@gravitee/ui-components 3.25.2 → 3.25.3-typescript-ad6021f

package/src/organisms/gv-menu.js

@@ -18,6 +18,7 @@ import '../molecules/gv-nav';
 import { isSameRoutes } from '../lib/utils';
 import { classMap } from 'lit/directives/class-map';
 import { withResizeObserver } from '../mixins/with-resize-observer';
+
 /**
  * A menu
  *
@@ -40,55 +41,175 @@ import { withResizeObserver } from '../mixins/with-resize-observer';
  * @cssprop {Color} [--gv-menu-link--bgc=transparent] - Background color
  * @cssprop {Length} [--gv-menu-link-a--pv=0px] - Link vertical padding
  */
-
 export class GvMenu extends withResizeObserver(LitElement) {
   static get properties() {
     return {
       /** @required **/
-      routes: {
-        type: Array
-      },
-      sticky: {
-        type: Boolean,
-        reflect: true
-      },
-      _small: {
-        type: Boolean,
-        attribute: false
-      },
-      _routes: {
-        type: Array,
-        attribute: false
-      },
-      _hasHeader: {
-        type: Boolean,
-        attribute: false
-      }
+      routes: { type: Array },
+      sticky: { type: Boolean, reflect: true },
+      _small: { type: Boolean, attribute: false },
+      _routes: { type: Array, attribute: false },
+      _hasHeader: { type: Boolean, attribute: false },
     };
   }
 
   static get styles() {
-    return [// language=css
-    css`:host{--gv-link--c:var(--gv-menu--c, var(--gv-theme-font-color-light, #ffffff));--gv-link-active--c:var(--gv-menu--c, var(--gv-theme-font-color-light, #ffffff));--gv-link--bgc:var(--gv-menu-link--bgc, transparent);--gv-link-active--bgc:var(--gv-menu-link-active--bgc, transparent);--gv-link-active--bdc:var(--gv-menu-link-active--bdc, var(--gv-theme-color-light, #86c3d0));--gv-link-active--bds:var(--gv-menu-link-active--bds, solid);--gv-link-active--bdw:var(--gv-menu-link-active--bdw, 0 0 3px 0);--pr:var(--gv-theme-layout--pr, 4rem);--pl:var(--gv-theme-layout--pl, 4rem);box-sizing:border-box;display:block;font-size:var(--gv-theme-font-size-s,12px)}:host([sticky]) gv-nav{line-height:14px;--gv-link-icon--s:20px}:host([sticky]) .has-header gv-nav{line-height:34px}:host([sticky]) ::slotted([slot=top]){transition:height 250ms ease-in-out}:host([w-lt-1024]){--pr:5px;--pl:5px}:host([w-lt-768]) .nav-container{width:100%;padding-left:var(--pl);--gv-link-a--pv:var(--gv-menu-link-a--pv, 0px)}:host([w-lt-580]) .nav-container{flex:auto;padding-left:0}:host([w-lt-580]) gv-nav{flex:auto}:host([w-lt-580]) .right{flex:auto}:host([w-lt-380]) .nav-container{display:flex;flex-direction:column-reverse}:host([w-lt-380]) gv-nav{align-self:flex-start;flex:1}:host([w-lt-380]) .right{align-self:flex-end;flex:1;width:100%;padding-right:0}gv-nav{display:table-cell;line-height:50px;vertical-align:middle}.nav-container{display:grid;grid-template-columns:auto auto;background-color:var(--gv-menu--bgc,var(--gv-theme-color-dark,#28444f));color:var(--gv-menu--c,var(--gv-theme-font-color-light,#fff))}.has-header .nav-container{width:calc(100% - 10rem);padding-left:10rem;--gv-link-a--pv:0}:host([sticky]) .has-header .nav-container{width:calc(100% - 5rem);padding-left:5rem;transition:all 250ms ease-in-out}.right{display:flex;padding-right:var(--pr);justify-content:center;flex-direction:column}gv-nav{padding-left:var(--pl);transition:width 250ms ease-in-out}slot[name=right-transition],slot[name=right]{display:flex;justify-content:flex-end;width:100%}.right ::slotted([slot=right-transition]),.right ::slotted([slot=right]){align-self:center}.right ::slotted([slot=right-transition]){transition:width 250ms ease 250ms;width:70%}.right:focus-within ::slotted([slot=right-transition]){animation:slide 250ms 250ms;transition:width 250ms ease-in-out 250ms;width:100%}.right ::slotted([slot=right]){--gv-button--p:7px 16px;--gv-button--fz:15px}`];
+    return [
+      // language=css
+      css`
+        :host {
+          --gv-link--c: var(--gv-menu--c, var(--gv-theme-font-color-light, #ffffff));
+          --gv-link-active--c: var(--gv-menu--c, var(--gv-theme-font-color-light, #ffffff));
+          --gv-link--bgc: var(--gv-menu-link--bgc, transparent);
+          --gv-link-active--bgc: var(--gv-menu-link-active--bgc, transparent);
+          --gv-link-active--bdc: var(--gv-menu-link-active--bdc, var(--gv-theme-color-light, #86c3d0));
+          --gv-link-active--bds: var(--gv-menu-link-active--bds, solid);
+          --gv-link-active--bdw: var(--gv-menu-link-active--bdw, 0 0 3px 0);
+          --pr: var(--gv-theme-layout--pr, 4rem);
+          --pl: var(--gv-theme-layout--pl, 4rem);
+          box-sizing: border-box;
+          display: block;
+          font-size: var(--gv-theme-font-size-s, 12px);
+        }
+
+        :host([sticky]) gv-nav {
+          line-height: 14px;
+          --gv-link-icon--s: 20px;
+        }
+
+        :host([sticky]) .has-header gv-nav {
+          line-height: 34px;
+        }
+
+        :host([sticky]) ::slotted([slot='top']) {
+          transition: height 250ms ease-in-out;
+        }
+
+        :host([w-lt-1024]) {
+          --pr: 5px;
+          --pl: 5px;
+        }
+
+        :host([w-lt-768]) .nav-container {
+          width: 100%;
+          padding-left: var(--pl);
+          --gv-link-a--pv: var(--gv-menu-link-a--pv, 0px);
+        }
+
+        :host([w-lt-580]) .nav-container {
+          flex: auto;
+          padding-left: 0;
+        }
+
+        :host([w-lt-580]) gv-nav {
+          flex: auto;
+        }
+
+        :host([w-lt-580]) .right {
+          flex: auto;
+        }
+
+        :host([w-lt-380]) .nav-container {
+          display: flex;
+          flex-direction: column-reverse;
+        }
+
+        :host([w-lt-380]) gv-nav {
+          align-self: flex-start;
+          flex: 1;
+        }
+
+        :host([w-lt-380]) .right {
+          align-self: flex-end;
+          flex: 1;
+          width: 100%;
+          padding-right: 0;
+        }
+
+        gv-nav {
+          display: table-cell;
+          line-height: 50px;
+          vertical-align: middle;
+        }
+
+        .nav-container {
+          display: grid;
+          grid-template-columns: auto auto;
+          background-color: var(--gv-menu--bgc, var(--gv-theme-color-dark, #28444f));
+          color: var(--gv-menu--c, var(--gv-theme-font-color-light, #ffffff));
+        }
+
+        .has-header .nav-container {
+          width: calc(100% - 10rem);
+          padding-left: 10rem;
+          --gv-link-a--pv: 0;
+        }
+
+        :host([sticky]) .has-header .nav-container {
+          width: calc(100% - 5rem);
+          padding-left: 5rem;
+          transition: all 250ms ease-in-out;
+        }
+
+        .right {
+          display: flex;
+          padding-right: var(--pr);
+          justify-content: center;
+          flex-direction: column;
+        }
+
+        gv-nav {
+          padding-left: var(--pl);
+          transition: width 250ms ease-in-out;
+        }
+
+        slot[name='right-transition'],
+        slot[name='right'] {
+          display: flex;
+          justify-content: flex-end;
+          width: 100%;
+        }
+
+        .right ::slotted([slot='right']),
+        .right ::slotted([slot='right-transition']) {
+          align-self: center;
+        }
+
+        .right ::slotted([slot='right-transition']) {
+          transition: width 250ms ease 250ms;
+          width: 70%;
+        }
+
+        .right:focus-within ::slotted([slot='right-transition']) {
+          animation: slide 250ms 250ms;
+          transition: width 250ms ease-in-out 250ms;
+          width: 100%;
+        }
+
+        .right ::slotted([slot='right']) {
+          --gv-button--p: 7px 16px;
+          --gv-button--fz: 15px;
+        }
+      `,
+    ];
   }
 
   constructor() {
     super();
     /** @protected */
-
     this._routes = [];
     this.sticky = false;
     this.breakpoints = {
       // ceiled width with 275px tiles and 1rem (16px) gap
-      width: [380, 580, 768, 1024]
+      width: [380, 580, 768, 1024],
     };
   }
 
   set routes(candidate) {
     if (candidate) {
-      Promise.resolve(candidate).then(candidates => {
+      Promise.resolve(candidate).then((candidates) => {
         if (candidates) {
-          Promise.all(candidates).then(futureRoutes => {
+          Promise.all(candidates).then((futureRoutes) => {
             if (!isSameRoutes(this._routes, futureRoutes)) {
               this._routes = futureRoutes;
             }
@@ -102,9 +223,7 @@ export class GvMenu extends withResizeObserver(LitElement) {
     }
   }
 
-  onResize({
-    width
-  }) {
+  onResize({ width }) {
     if (width <= 1024) {
       this._small = true;
     } else {
@@ -113,19 +232,23 @@ export class GvMenu extends withResizeObserver(LitElement) {
   }
 
   render() {
-    return html` <div class="${classMap({
-      'has-header': this._hasHeader
-    })}"> <slot name="top"></slot> <div class="nav-container"> <gv-nav .routes="${this._routes}" ?small="${this._small}"></gv-nav> <div class="right"><slot name="right-transition"></slot><slot name="right"></slot></div> </div> </div> `;
+    return html`
+      <div class="${classMap({ 'has-header': this._hasHeader })}">
+        <slot name="top"></slot>
+        <div class="nav-container">
+          <gv-nav .routes="${this._routes}" ?small="${this._small}"></gv-nav>
+          <div class="right"><slot name="right-transition"></slot><slot name="right"></slot></div>
+        </div>
+      </div>
+    `;
   }
 
   updated(changedProperties) {
     super.updated(changedProperties);
     let _header = false;
-
     for (const node of this.childNodes) {
       if (node.nodeType === 1) {
         const child = node.nodeName.toLowerCase() === 'gv-header' ? node : node.querySelector('gv-header');
-
         if (child) {
           child.sticky = this.sticky;
           _header = true;
@@ -133,10 +256,8 @@ export class GvMenu extends withResizeObserver(LitElement) {
         }
       }
     }
-
     this._hasHeader = _header;
   }
-
 }
+
 window.customElements.define('gv-menu', GvMenu);
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4vbm9kZV9tb2R1bGVzL0BncmF2aXRlZS91aS1jb21wb25lbnRzL29yZ2FuaXNtcy9ndi1tZW51LmpzIl0sIm5hbWVzIjpbIkxpdEVsZW1lbnQiLCJodG1sIiwiY3NzIiwiaXNTYW1lUm91dGVzIiwiY2xhc3NNYXAiLCJ3aXRoUmVzaXplT2JzZXJ2ZXIiLCJHdk1lbnUiLCJwcm9wZXJ0aWVzIiwicm91dGVzIiwidHlwZSIsIkFycmF5Iiwic3RpY2t5IiwiQm9vbGVhbiIsInJlZmxlY3QiLCJfc21hbGwiLCJhdHRyaWJ1dGUiLCJfcm91dGVzIiwiX2hhc0hlYWRlciIsInN0eWxlcyIsImNvbnN0cnVjdG9yIiwiYnJlYWtwb2ludHMiLCJ3aWR0aCIsImNhbmRpZGF0ZSIsIlByb21pc2UiLCJyZXNvbHZlIiwidGhlbiIsImNhbmRpZGF0ZXMiLCJhbGwiLCJmdXR1cmVSb3V0ZXMiLCJvblJlc2l6ZSIsInJlbmRlciIsInVwZGF0ZWQiLCJjaGFuZ2VkUHJvcGVydGllcyIsIl9oZWFkZXIiLCJub2RlIiwiY2hpbGROb2RlcyIsIm5vZGVUeXBlIiwiY2hpbGQiLCJub2RlTmFtZSIsInRvTG93ZXJDYXNlIiwicXVlcnlTZWxlY3RvciIsIndpbmRvdyIsImN1c3RvbUVsZW1lbnRzIiwiZGVmaW5lIl0sIm1hcHBpbmdzIjoiQUFBQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQSxTQUFTQSxVQUFULEVBQXFCQyxJQUFyQixFQUEyQkMsR0FBM0IsUUFBc0MsS0FBdEM7QUFDQSxPQUFPLHFCQUFQO0FBQ0EsU0FBU0MsWUFBVCxRQUE2QixjQUE3QjtBQUNBLFNBQVNDLFFBQVQsUUFBeUIsMEJBQXpCO0FBQ0EsU0FBU0Msa0JBQVQsUUFBbUMsZ0NBQW5DO0FBRUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNB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QSxJQUFJLENBQUNNLGFBQUwsQ0FBbUIsV0FBbkIsQ0FBbkU7O0FBQ0EsWUFBSUgsS0FBSixFQUFXO0FBQ1RBLFVBQUFBLEtBQUssQ0FBQzFCLE1BQU4sR0FBZSxLQUFLQSxNQUFwQjtBQUNBc0IsVUFBQUEsT0FBTyxHQUFHLElBQVY7QUFDQTtBQUNEO0FBQ0Y7QUFDRjs7QUFDRCxTQUFLaEIsVUFBTCxHQUFrQmdCLE9BQWxCO0FBQ0Q7O0FBeE53RDtBQTJOM0RRLE1BQU0sQ0FBQ0MsY0FBUCxDQUFzQkMsTUFBdEIsQ0FBNkIsU0FBN0IsRUFBd0NyQyxNQUF4QyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBDb3B5cmlnaHQgKEMpIDIwMTUgVGhlIEdyYXZpdGVlIHRlYW0gKGh0dHA6Ly9ncmF2aXRlZS5pbylcbiAqXG4gKiBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG5pbXBvcnQgeyBMaXRFbGVtZW50LCBodG1sLCBjc3MgfSBmcm9tICdsaXQnO1xuaW1wb3J0ICcuLi9tb2xlY3VsZXMvZ3YtbmF2JztcbmltcG9ydCB7IGlzU2FtZVJvdXRlcyB9IGZyb20gJy4uL2xpYi91dGlscyc7XG5pbXBvcnQgeyBjbGFzc01hcCB9IGZyb20gJ2xpdC9kaXJlY3RpdmVzL2NsYXNzLW1hcCc7XG5pbXBvcnQgeyB3aXRoUmVzaXplT2JzZXJ2ZXIgfSBmcm9tICcuLi9taXhpbnMvd2l0aC1yZXNpemUtb2JzZXJ2ZXInO1xuXG4vKipcbiAqIEEgbWVudVxuICpcbiAqICMjIERldGFpbHNcbiAqICogaGFzIEB0aGVtZSBmYWNldFxuICpcbiAqIEBmaXJlcyBndi1saW5rOmNsaWNrIC0gQ3VzdG9tIGV2ZW50IHdoZW4gbGluayBjbGlja1xuICpcbiAqIEBzbG90IHRvcCAtIFRoZSBjb250ZW50IG9uIHRvcCBvZiBtZW51XG4gKiBAc2xvdCByaWdodCAtIFRoZSBjb250ZW50IGF0IHJpZ2h0XG4gKiBAc2xvdCByaWdodC10cmFuc2l0aW9uIC0gVGhlIGNvbnRlbnQgYXQgcmlnaHQgd2l0aCB0cmFuc2l0aW9uXG4gKlxuICogQGF0dHIge0FycmF5fSByb3V0ZXMgLSBkZWZpbml0aW9uIG9mIHJvdXRlcyBbe2FjdGl2ZTogQm9vbGVhbiwgaWNvbjogU3RyaW5nLCBwYXRoOiBTdHJpbmcsIHRpdGxlOiBQcm9taXNlPFN0cmluZz5dXG4gKiBAY3NzcHJvcCB7Q29sb3J9IFstLWd2LW1lbnUtLWM9dmFyKC0tZ3YtdGhlbWUtZm9udC1jb2xvci1saWdodCwgI2ZmZmZmZildIC0gQ29sb3JcbiAqIEBjc3Nwcm9wIHtDb2xvcn0gWy0tZ3YtbWVudS0tYmdjPXZhcigtLWd2LXRoZW1lLWNvbG9yLWRhcmssICMyODQ0NGYpXSAtIEJhY2tncm91bmQgY29sb3IuXG4gKiBAY3NzcHJvcCB7Q29sb3J9IFstLWd2LW1lbnUtbGluay1hY3RpdmUtLWJkYz12YXIoLS1ndi10aGVtZS1jb2xvci1saWdodCwgIzg2YzNkMCldIC0gQm9yZGVyIGJvdHRvbSBjb2xvciBvZiBhY3RpdmUgbGluay5cbiAqIEBjc3Nwcm9wIHtTdHJpbmd9IFstLWd2LW1lbnUtbGluay1hY3RpdmUtLWJkcz1zb2xpZF0gLSBCb3JkZXIgYm90dG9tIHN0eWxlIG9mIGFjdGl2ZSBsaW5rLlxuICogQGNzc3Byb3Age0xlbmd0aH0gWy0tZ3YtbWVudS1saW5rLWFjdGl2ZS0tYmR3PTAgMCAzcHggMF0gLSBCb3JkZXIgYm90dG9tIHdpZHRoIG9mIGFjdGl2ZSBsaW5rLlxuICogQGNzc3Byb3Age0NvbG9yfSBbLS1ndi1tZW51LWxpbmstYWN0aXZlLS1iZ2M9dHJhbnNwYXJlbnRdIC0gQWN0aXZlIGJhY2tncm91bmQgY29sb3JcbiAqIEBjc3Nwcm9wIHtDb2xvcn0gWy0tZ3YtbWVudS1saW5rLS1iZ2M9dHJhbnNwYXJlbnRdIC0gQmFja2dyb3VuZCBjb2xvclxuICogQGNzc3Byb3Age0xlbmd0aH0gWy0tZ3YtbWVudS1saW5rLWEtLXB2PTBweF0gLSBMaW5rIHZlcnRpY2FsIHBhZGRpbmdcbiAqL1xuZXhwb3J0IGNsYXNzIEd2TWVudSBleHRlbmRzIHdpdGhSZXNpemVPYnNlcnZlcihMaXRFbGVtZW50KSB7XG4gIHN0YXRpYyBnZXQgcHJvcGVydGllcygpIHtcbiAgICByZXR1cm4ge1xuICAgICAgLyoqIEByZXF1aXJlZCAqKi9cbiAgICAgIHJvdXRlczogeyB0eXBlOiBBcnJheSB9LFxuICAgICAgc3RpY2t5OiB7IHR5cGU6IEJvb2xlYW4sIHJlZmxlY3Q6IHRydWUgfSxcbiAgICAgIF9zbWFsbDogeyB0eXBlOiBCb29sZWFuLCBhdHRyaWJ1dGU6IGZhbHNlIH0sXG4gICAgICBfcm91dGVzOiB7IHR5cGU6IEFycmF5LCBhdHRyaWJ1dGU6IGZhbHNlIH0sXG4gICAgICBfaGFzSGVhZGVyOiB7IHR5cGU6IEJvb2xlYW4sIGF0dHJpYnV0ZTogZmFsc2UgfSxcbiAgICB9O1xuICB9XG5cbiAgc3RhdGljIGdldCBzdHlsZXMoKSB7XG4gICAgcmV0dXJuIFtcbiAgICAgIC8vIGxhbmd1YWdlPWNzc1xuICAgICAgY3NzYFxuICAgICAgICA6aG9zdCB7XG4gICAgICAgICAgLS1ndi1saW5rLS1jOiB2YXIoLS1ndi1tZW51LS1jLCB2YXIoLS1ndi10aGVtZS1mb250LWNvbG9yLWxpZ2h0LCAjZmZmZmZmKSk7XG4gICAgICAgICAgLS1ndi1saW5rLWFjdGl2ZS0tYzogdmFyKC0tZ3YtbWVudS0tYywgdmFyKC0tZ3YtdGhlbWUtZm9udC1jb2xvci1saWdodCwgI2ZmZmZmZikpO1xuICAgICAgICAgIC0tZ3YtbGluay0tYmdjOiB2YXIoLS1ndi1tZW51LWxpbmstLWJnYywgdHJhbnNwYXJlbnQpO1xuICAgICAgICAgIC0tZ3YtbGluay1hY3RpdmUtLWJnYzogdmFyKC0tZ3YtbWVudS1saW5rLWFjdGl2ZS0tYmdjLCB0cmFuc3BhcmVudCk7XG4gICAgICAgICAgLS1ndi1saW5rLWFjdGl2ZS0tYmRjOiB2YXIoLS1ndi1tZW51LWxpbmstYWN0aXZlLS1iZGMsIHZhcigtLWd2LXRoZW1lLWNvbG9yLWxpZ2h0LCAjODZjM2QwKSk7XG4gICAgICAgICAgLS1ndi1saW5rLWFjdGl2ZS0tYmRzOiB2YXIoLS1ndi1tZW51LWxpbmstYWN0aXZlLS1iZHMsIHNvbGlkKTtcbiAgICAgICAgICAtLWd2LWxpbmstYWN0aXZlLS1iZHc6IHZhcigtLWd2LW1lbnUtbGluay1hY3RpdmUtLWJkdywgMCAwIDNweCAwKTtcbiAgICAgICAgICAtLXByOiB2YXIoLS1ndi10aGVtZS1sYXlvdXQtLXByLCA0cmVtKTtcbiAgICAgICAgICAtLXBsOiB2YXIoLS1ndi10aGVtZS1sYXlvdXQtLXBsLCA0cmVtKTtcbiAgICAgICAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgICAgICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgICAgICAgIGZvbnQtc2l6ZTogdmFyKC0tZ3YtdGhlbWUtZm9udC1zaXplLXMsIDEycHgpO1xuICAgICAgICB9XG5cbiAgICAgICAgOmhvc3QoW3N0aWNreV0pIGd2LW5hdiB7XG4gICAgICAgICAgbGluZS1oZWlnaHQ6IDE0cHg7XG4gICAgICAgICAgLS1ndi1saW5rLWljb24tLXM6IDIwcHg7XG4gICAgICAgIH1cblxuICAgICAgICA6aG9zdChbc3RpY2t5XSkgLmhhcy1oZWFkZXIgZ3YtbmF2IHtcbiAgICAgICAgICBsaW5lLWhlaWdodDogMzRweDtcbiAgICAgICAgfVxuXG4gICAgICAgIDpob3N0KFtzdGlja3ldKSA6OnNsb3R0ZWQoW3Nsb3Q9J3RvcCddKSB7XG4gICAgICAgICAgdHJhbnNpdGlvbjogaGVpZ2h0IDI1MG1zIGVhc2UtaW4tb3V0O1xuICAgICAgICB9XG5cbiAgICAgICAgOmhvc3QoW3ctbHQtMTAyNF0pIHtcbiAgICAgICAgICAtLXByOiA1cHg7XG4gICAgICAgICAgLS1wbDogNXB4O1xuICAgICAgICB9XG5cbiAgICAgICAgOmhvc3QoW3ctbHQtNzY4XSkgLm5hdi1jb250YWluZXIge1xuICAgICAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgICAgIHBhZGRpbmctbGVmdDogdmFyKC0tcGwpO1xuICAgICAgICAgIC0tZ3YtbGluay1hLS1wdjogdmFyKC0tZ3YtbWVudS1saW5rLWEtLXB2LCAwcHgpO1xuICAgICAgICB9XG5cbiAgICAgICAgOmhvc3QoW3ctbHQtNTgwXSkgLm5hdi1jb250YWluZXIge1xuICAgICAgICAgIGZsZXg6IGF1dG87XG4gICAgICAgICAgcGFkZGluZy1sZWZ0OiAwO1xuICAgICAgICB9XG5cbiAgICAgICAgOmhvc3QoW3ctbHQtNTgwXSkgZ3YtbmF2IHtcbiAgICAgICAgICBmbGV4OiBhdXRvO1xuICAgICAgICB9XG5cbiAgICAgICAgOmhvc3QoW3ctbHQtNTgwXSkgLnJpZ2h0IHtcbiAgICAgICAgICBmbGV4OiBhdXRvO1xuICAgICAgICB9XG5cbiAgICAgICAgOmhvc3QoW3ctbHQtMzgwXSkgLm5hdi1jb250YWluZXIge1xuICAgICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbi1yZXZlcnNlO1xuICAgICAgICB9XG5cbiAgICAgICAgOmhvc3QoW3ctbHQtMzgwXSkgZ3YtbmF2IHtcbiAgICAgICAgICBhbGlnbi1zZWxmOiBmbGV4LXN0YXJ0O1xuICAgICAgICAgIGZsZXg6IDE7XG4gICAgICAgIH1cblxuICAgICAgICA6aG9zdChbdy1sdC0zODBdKSAucmlnaHQge1xuICAgICAgICAgIGFsaWduLXNlbGY6IGZsZXgtZW5kO1xuICAgICAgICAgIGZsZXg6IDE7XG4gICAgICAgICAgd2lkdGg6IDEwMCU7XG4gICAgICAgICAgcGFkZGluZy1yaWdodDogMDtcbiAgICAgICAgfVxuXG4gICAgICAgIGd2LW5hdiB7XG4gICAgICAgICAgZGlzcGxheTogdGFibGUtY2VsbDtcbiAgICAgICAgICBsaW5lLWhlaWdodDogNTBweDtcbiAgICAgICAgICB2ZXJ0aWNhbC1hbGlnbjogbWlkZGxlO1xuICAgICAgICB9XG5cbiAgICAgICAgLm5hdi1jb250YWluZXIge1xuICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiBhdXRvIGF1dG87XG4gICAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tZ3YtbWVudS0tYmdjLCB2YXIoLS1ndi10aGVtZS1jb2xvci1kYXJrLCAjMjg0NDRmKSk7XG4gICAgICAgICAgY29sb3I6IHZhcigtLWd2LW1lbnUtLWMsIHZhcigtLWd2LXRoZW1lLWZvbnQtY29sb3ItbGlnaHQsICNmZmZmZmYpKTtcbiAgICAgICAgfVxuXG4gICAgICAgIC5oYXMtaGVhZGVyIC5uYXYtY29udGFpbmVyIHtcbiAgICAgICAgICB3aWR0aDogY2FsYygxMDAlIC0gMTByZW0pO1xuICAgICAgICAgIHBhZGRpbmctbGVmdDogMTByZW07XG4gICAgICAgICAgLS1ndi1saW5rLWEtLXB2OiAwO1xuICAgICAgICB9XG5cbiAgICAgICAgOmhvc3QoW3N0aWNreV0pIC5oYXMtaGVhZGVyIC5uYXYtY29udGFpbmVyIHtcbiAgICAgICAgICB3aWR0aDogY2FsYygxMDAlIC0gNXJlbSk7XG4gICAgICAgICAgcGFkZGluZy1sZWZ0OiA1cmVtO1xuICAgICAgICAgIHRyYW5zaXRpb246IGFsbCAyNTBtcyBlYXNlLWluLW91dDtcbiAgICAgICAgfVxuXG4gICAgICAgIC5yaWdodCB7XG4gICAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgICBwYWRkaW5nLXJpZ2h0OiB2YXIoLS1wcik7XG4gICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICAgICAgfVxuXG4gICAgICAgIGd2LW5hdiB7XG4gICAgICAgICAgcGFkZGluZy1sZWZ0OiB2YXIoLS1wbCk7XG4gICAgICAgICAgdHJhbnNpdGlvbjogd2lkdGggMjUwbXMgZWFzZS1pbi1vdXQ7XG4gICAgICAgIH1cblxuICAgICAgICBzbG90W25hbWU9J3JpZ2h0LXRyYW5zaXRpb24nXSxcbiAgICAgICAgc2xvdFtuYW1lPSdyaWdodCddIHtcbiAgICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICAgIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG4gICAgICAgICAgd2lkdGg6IDEwMCU7XG4gICAgICAgIH1cblxuICAgICAgICAucmlnaHQgOjpzbG90dGVkKFtzbG90PSdyaWdodCddKSxcbiAgICAgICAgLnJpZ2h0IDo6c2xvdHRlZChbc2xvdD0ncmlnaHQtdHJhbnNpdGlvbiddKSB7XG4gICAgICAgICAgYWxpZ24tc2VsZjogY2VudGVyO1xuICAgICAgICB9XG5cbiAgICAgICAgLnJpZ2h0IDo6c2xvdHRlZChbc2xvdD0ncmlnaHQtdHJhbnNpdGlvbiddKSB7XG4gICAgICAgICAgdHJhbnNpdGlvbjogd2lkdGggMjUwbXMgZWFzZSAyNTBtcztcbiAgICAgICAgICB3aWR0aDogNzAlO1xuICAgICAgICB9XG5cbiAgICAgICAgLnJpZ2h0OmZvY3VzLXdpdGhpbiA6OnNsb3R0ZWQoW3Nsb3Q9J3JpZ2h0LXRyYW5zaXRpb24nXSkge1xuICAgICAgICAgIGFuaW1hdGlvbjogc2xpZGUgMjUwbXMgMjUwbXM7XG4gICAgICAgICAgdHJhbnNpdGlvbjogd2lkdGggMjUwbXMgZWFzZS1pbi1vdXQgMjUwbXM7XG4gICAgICAgICAgd2lkdGg6IDEwMCU7XG4gICAgICAgIH1cblxuICAgICAgICAucmlnaHQgOjpzbG90dGVkKFtzbG90PSdyaWdodCddKSB7XG4gICAgICAgICAgLS1ndi1idXR0b24tLXA6IDdweCAxNnB4O1xuICAgICAgICAgIC0tZ3YtYnV0dG9uLS1mejogMTVweDtcbiAgICAgICAgfVxuICAgICAgYCxcbiAgICBdO1xuICB9XG5cbiAgY29uc3RydWN0b3IoKSB7XG4gICAgc3VwZXIoKTtcbiAgICAvKiogQHByb3RlY3RlZCAqL1xuICAgIHRoaXMuX3JvdXRlcyA9IFtdO1xuICAgIHRoaXMuc3RpY2t5ID0gZmFsc2U7XG4gICAgdGhpcy5icmVha3BvaW50cyA9IHtcbiAgICAgIC8vIGNlaWxlZCB3aWR0aCB3aXRoIDI3NXB4IHRpbGVzIGFuZCAxcmVtICgxNnB4KSBnYXBcbiAgICAgIHdpZHRoOiBbMzgwLCA1ODAsIDc2OCwgMTAyNF0sXG4gICAgfTtcbiAgfVxuXG4gIHNldCByb3V0ZXMoY2FuZGlkYXRlKSB7XG4gICAgaWYgKGNhbmRpZGF0ZSkge1xuICAgICAgUHJvbWlzZS5yZXNvbHZlKGNhbmRpZGF0ZSkudGhlbigoY2FuZGlkYXRlcykgPT4ge1xuICAgICAgICBpZiAoY2FuZGlkYXRlcykge1xuICAgICAgICAgIFByb21pc2UuYWxsKGNhbmRpZGF0ZXMpLnRoZW4oKGZ1dHVyZVJvdXRlcykgPT4ge1xuICAgICAgICAgICAgaWYgKCFpc1NhbWVSb3V0ZXModGhpcy5fcm91dGVzLCBmdXR1cmVSb3V0ZXMpKSB7XG4gICAgICAgICAgICAgIHRoaXMuX3JvdXRlcyA9IGZ1dHVyZVJvdXRlcztcbiAgICAgICAgICAgIH1cbiAgICAgICAgICB9KTtcbiAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICB0aGlzLl9yb3V0ZXMgPSBbXTtcbiAgICAgICAgfVxuICAgICAgfSk7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuX3JvdXRlcyA9IFtdO1xuICAgIH1cbiAgfVxuXG4gIG9uUmVzaXplKHsgd2lkdGggfSkge1xuICAgIGlmICh3aWR0aCA8PSAxMDI0KSB7XG4gICAgICB0aGlzLl9zbWFsbCA9IHRydWU7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuX3NtYWxsID0gZmFsc2U7XG4gICAgfVxuICB9XG5cbiAgcmVuZGVyKCkge1xuICAgIHJldHVybiBodG1sYFxuICAgICAgPGRpdiBjbGFzcz1cIiR7Y2xhc3NNYXAoeyAnaGFzLWhlYWRlcic6IHRoaXMuX2hhc0hlYWRlciB9KX1cIj5cbiAgICAgICAgPHNsb3QgbmFtZT1cInRvcFwiPjwvc2xvdD5cbiAgICAgICAgPGRpdiBjbGFzcz1cIm5hdi1jb250YWluZXJcIj5cbiAgICAgICAgICA8Z3YtbmF2IC5yb3V0ZXM9XCIke3RoaXMuX3JvdXRlc31cIiA/c21hbGw9XCIke3RoaXMuX3NtYWxsfVwiPjwvZ3YtbmF2PlxuICAgICAgICAgIDxkaXYgY2xhc3M9XCJyaWdodFwiPjxzbG90IG5hbWU9XCJyaWdodC10cmFuc2l0aW9uXCI+PC9zbG90PjxzbG90IG5hbWU9XCJyaWdodFwiPjwvc2xvdD48L2Rpdj5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L2Rpdj5cbiAgICBgO1xuICB9XG5cbiAgdXBkYXRlZChjaGFuZ2VkUHJvcGVydGllcykge1xuICAgIHN1cGVyLnVwZGF0ZWQoY2hhbmdlZFByb3BlcnRpZXMpO1xuICAgIGxldCBfaGVhZGVyID0gZmFsc2U7XG4gICAgZm9yIChjb25zdCBub2RlIG9mIHRoaXMuY2hpbGROb2Rlcykge1xuICAgICAgaWYgKG5vZGUubm9kZVR5cGUgPT09IDEpIHtcbiAgICAgICAgY29uc3QgY2hpbGQgPSBub2RlLm5vZGVOYW1lLnRvTG93ZXJDYXNlKCkgPT09ICdndi1oZWFkZXInID8gbm9kZSA6IG5vZGUucXVlcnlTZWxlY3RvcignZ3YtaGVhZGVyJyk7XG4gICAgICAgIGlmIChjaGlsZCkge1xuICAgICAgICAgIGNoaWxkLnN0aWNreSA9IHRoaXMuc3RpY2t5O1xuICAgICAgICAgIF9oZWFkZXIgPSB0cnVlO1xuICAgICAgICAgIGJyZWFrO1xuICAgICAgICB9XG4gICAgICB9XG4gICAgfVxuICAgIHRoaXMuX2hhc0hlYWRlciA9IF9oZWFkZXI7XG4gIH1cbn1cblxud2luZG93LmN1c3RvbUVsZW1lbnRzLmRlZmluZSgnZ3YtbWVudScsIEd2TWVudSk7XG4iXX0=

package/src/organisms/gv-newsletter-subscription.js

@@ -15,6 +15,7 @@
  */
 import { css, html, LitElement } from 'lit';
 import { dispatchCustomEvent } from '../lib/events';
+
 /**
  * The newsletter subscription page
  *
@@ -34,58 +35,126 @@ import { dispatchCustomEvent } from '../lib/events';
  * @attr {String} linkedinUrl - The url to linkedin page
  *
  */
-
 export class GvNewsletterSubscription extends LitElement {
   static get properties() {
     return {
-      title: {
-        type: String
-      },
-      header: {
-        type: String
-      },
-      placeholder: {
-        type: String
-      },
-      subscribeLabel: {
-        type: String,
-        attribute: 'subscribe-label'
-      },
-      skipLabel: {
-        type: String,
-        attribute: 'skip-label'
-      },
-      taglines: {
-        type: Array
-      },
-      email: {
-        type: String
-      },
-      disabled: {
-        type: Boolean
-      },
-      githubUrl: {
-        type: String,
-        attribute: 'github-url'
-      },
-      twitterUrl: {
-        type: String,
-        attribute: 'twitter-url'
-      },
-      linkedinUrl: {
-        type: String,
-        attribute: 'linkedin-url'
-      },
-      _invalid: {
-        type: Boolean,
-        attribute: false
-      }
+      title: { type: String },
+      header: { type: String },
+      placeholder: { type: String },
+      subscribeLabel: { type: String, attribute: 'subscribe-label' },
+      skipLabel: { type: String, attribute: 'skip-label' },
+      taglines: { type: Array },
+      email: { type: String },
+      disabled: { type: Boolean },
+      githubUrl: { type: String, attribute: 'github-url' },
+      twitterUrl: { type: String, attribute: 'twitter-url' },
+      linkedinUrl: { type: String, attribute: 'linkedin-url' },
+      _invalid: { type: Boolean, attribute: false },
     };
   }
 
   static get styles() {
-    return [// language=css
-    css`:host{box-sizing:border-box;margin:.2rem}.newsletter-container{display:flex;flex-direction:column;align-items:center;justify-content:space-between;max-width:680px;box-shadow:0 0 20px 0 rgba(0,0,0,.2),0 5px 5px 0 rgba(0,0,0,.24);padding:25px 20px 5px 20px}.newsletter__header{text-transform:uppercase;font-style:oblique;text-align:center;font-size:16px;font-weight:700;padding:5px 35px;color:var(--gv-theme-neutral-color-lightest,#fff);background-color:var(--gv-theme-color-light,#86c3d0)}.newsletter__title{display:flex;flex-direction:column;align-items:center;font-size:20px;text-transform:uppercase;padding:20px;color:var(--gv-theme-color-light,#86c3d0)}.newsletter__title-highlight{font-size:30px}.newsletter__email{display:flex;flex-direction:column;width:50%}.newsletter__taglines{display:flex;flex-direction:row;justify-content:space-between;align-items:center;text-align:center;text-transform:uppercase;font-size:14px;height:20%;margin-top:20px;padding:10px 0;color:var(--gv-theme-color-darker,#383e3f);border-bottom:solid 1px var(--gv-theme-color-darker,#383e3f)}.newsletter__tagline{display:flex;flex-basis:100%;flex-direction:column;justify-content:center;align-items:center;height:100%;font-weight:700;padding:0 15px;border-right:solid 1px var(--gv-theme-color-darker,#383e3f)}.newsletter__tagline.last{border-right:none}.newsletter__tagline-text{width:100%}.newsletter__skip{margin-top:20px}.social{width:100%;display:flex;flex-direction:row;justify-content:flex-end}.social-link{--gv-icon--c:var(--gv-theme-color-light, #86c3d0);--gv-icon--s:32px}`];
+    return [
+      // language=css
+      css`
+        :host {
+          box-sizing: border-box;
+          margin: 0.2rem;
+        }
+
+        .newsletter-container {
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: space-between;
+          max-width: 680px;
+          box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
+          padding: 25px 20px 5px 20px;
+        }
+
+        .newsletter__header {
+          text-transform: uppercase;
+          font-style: oblique;
+          text-align: center;
+          font-size: 16px;
+          font-weight: bold;
+          padding: 5px 35px;
+          color: var(--gv-theme-neutral-color-lightest, #ffffff);
+          background-color: var(--gv-theme-color-light, #86c3d0);
+        }
+
+        .newsletter__title {
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          font-size: 20px;
+          text-transform: uppercase;
+          padding: 20px;
+          color: var(--gv-theme-color-light, #86c3d0);
+        }
+
+        .newsletter__title-highlight {
+          font-size: 30px;
+        }
+
+        .newsletter__email {
+          display: flex;
+          flex-direction: column;
+          width: 50%;
+        }
+
+        .newsletter__taglines {
+          display: flex;
+          flex-direction: row;
+          justify-content: space-between;
+          align-items: center;
+          text-align: center;
+          text-transform: uppercase;
+          font-size: 14px;
+          height: 20%;
+          margin-top: 20px;
+          padding: 10px 0;
+          color: var(--gv-theme-color-darker, #383e3f);
+          border-bottom: solid 1px var(--gv-theme-color-darker, #383e3f);
+        }
+
+        .newsletter__tagline {
+          display: flex;
+          flex-basis: 100%;
+          flex-direction: column;
+          justify-content: center;
+          align-items: center;
+          height: 100%;
+          font-weight: bold;
+          padding: 0 15px;
+          border-right: solid 1px var(--gv-theme-color-darker, #383e3f);
+        }
+
+        .newsletter__tagline.last {
+          border-right: none;
+        }
+
+        .newsletter__tagline-text {
+          width: 100%;
+        }
+
+        .newsletter__skip {
+          margin-top: 20px;
+        }
+
+        .social {
+          width: 100%;
+          display: flex;
+          flex-direction: row;
+          justify-content: flex-end;
+        }
+
+        .social-link {
+          --gv-icon--c: var(--gv-theme-color-light, #86c3d0);
+          --gv-icon--s: 32px;
+        }
+      `,
+    ];
   }
 
   constructor() {
@@ -105,7 +174,80 @@ export class GvNewsletterSubscription extends LitElement {
   }
 
   render() {
-    return html` <div class="newsletter-container"> <div class="newsletter__header"> ${this.header} </div> <div class="newsletter__title"> <span>Join the</span> <span class="newsletter__title-highlight">${this.title}</span> <span>Today</span> </div> <div class="newsletter__email"> <gv-input id="email" name="email" @gv-input:submit="${this._onSubscribe}" @gv-input:input="${this._onInputChange}" type="email" required .value="${this.email}" .disabled="${this.disabled}" placeholder="${this.placeholder}"></gv-input> <gv-button @click="${this._onSubscribe}" id="email-submit" provider="graviteeio_am" icon-right="navigation:angle-right" .disabled="${!this.disabled && this._invalid}"> ${this.subscribeLabel} </gv-button> </div> ${this.taglines.length > 0 ? html` <div class="newsletter__taglines"> ${this.taglines.map((item, i, arr) => html` <div class="newsletter__tagline ${i === arr.length - 1 ? 'last' : ''}"> <div class="newsletter__tagline-text">${item}</div> </div> `)} </div>` : ''} <div class="newsletter__skip"> <gv-button @click="${this._onSkip}" provider="graviteeio_am" icon-right="navigation:angle-right" small outlined> ${this.skipLabel} </gv-button> </div> <div class="social"> <gv-button class="social-link" link icon="thirdparty:github" .href="${this.githubUrl}" @gv-button:click="${this._navigateSocial.bind(this, this.githubUrl)}"> </gv-button> <gv-button class="social-link" link icon="thirdparty:twitter" .href="${this.twitterUrl}" @gv-button:click="${this._navigateSocial.bind(this, this.twitterUrl)}"> </gv-button> <gv-button class="social-link" link icon="thirdparty:linkedin" .href="${this.linkedinUrl}" @gv-button:click="${this._navigateSocial.bind(this, this.linkedinUrl)}"> </gv-button>  </div> </div> `;
+    return html`
+        <div class="newsletter-container">
+          <div class="newsletter__header">
+            ${this.header}
+          </div>
+          <div class="newsletter__title">
+            <span>Join the</span>
+            <span class="newsletter__title-highlight">${this.title}</span>
+            <span>Today</span>
+          </div>
+          <div class="newsletter__email">
+            <gv-input
+              id="email"
+              name="email"
+              @gv-input:submit="${this._onSubscribe}"
+              @gv-input:input="${this._onInputChange}"
+              type="email"
+              required
+              .value="${this.email}"
+              .disabled=${this.disabled}
+              placeholder="${this.placeholder}"
+            ></gv-input>
+            <gv-button @click="${this._onSubscribe}"
+                       id="email-submit"
+                       provider="graviteeio_am"
+                       icon-right="navigation:angle-right"
+                       .disabled=${!this.disabled && this._invalid}>
+              ${this.subscribeLabel}
+            </gv-button>
+          </div>
+          ${
+            this.taglines.length > 0
+              ? html` <div class="newsletter__taglines">
+                  ${this.taglines.map(
+                    (item, i, arr) => html`
+                      <div class="newsletter__tagline ${i === arr.length - 1 ? 'last' : ''}">
+                        <div class="newsletter__tagline-text">${item}</div>
+                      </div>
+                    `,
+                  )}
+                </div>`
+              : ''
+          }
+          <div class="newsletter__skip">
+            <gv-button @click="${this._onSkip}"
+                       provider="graviteeio_am"
+                       icon-right="navigation:angle-right"
+                       small
+                       outlined>
+              ${this.skipLabel}
+            </gv-button>
+          </div>
+          <div class="social">
+            <gv-button class="social-link"
+                       link
+                       icon="thirdparty:github"
+                       .href="${this.githubUrl}"
+                       @gv-button:click="${this._navigateSocial.bind(this, this.githubUrl)}">
+            </gv-button>
+            <gv-button class="social-link"
+                       link icon="thirdparty:twitter"
+                       .href="${this.twitterUrl}"
+                       @gv-button:click="${this._navigateSocial.bind(this, this.twitterUrl)}">
+            </gv-button>
+            <gv-button class="social-link"
+                       link
+                       icon="thirdparty:linkedin"
+                       .href="${this.linkedinUrl}"
+                       @gv-button:click="${this._navigateSocial.bind(this, this.linkedinUrl)}">
+            </gv-button>
+            </gv-link>
+          </div>
+        </div>
+    `;
   }
 
   _onSubscribe() {
@@ -124,7 +266,6 @@ export class GvNewsletterSubscription extends LitElement {
     this._invalid = e.target.invalid;
     this.email = e.detail;
   }
-
 }
+
 window.customElements.define('gv-newsletter-subscription', GvNewsletterSubscription);
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4vbm9kZV9tb2R1bGVzL0BncmF2aXRlZS91aS1jb21wb25lbnRzL29yZ2FuaXNtcy9ndi1uZXdzbGV0dGVyLXN1YnNjcmlwdGlvbi5qcyJdLCJuYW1lcyI6WyJjc3MiLCJodG1sIiwiTGl0RWxlbWVudCIsImRpc3BhdGNoQ3VzdG9tRXZlbnQiLCJHdk5ld3NsZXR0ZXJTdWJzY3JpcHRpb24iLCJwcm9wZXJ0aWVzIiwidGl0bGUiLCJ0eXBlIiwiU3RyaW5nIiwiaGVhZGVyIiwicGxhY2Vob2xkZXIiLCJzdWJzY3JpYmVMYWJlbCIsImF0dHJpYnV0ZSIsInNraXBMYWJlbCIsInRhZ2xpbmVzIiwiQXJyYXkiLCJlbWFpbCIsImRpc2FibGVkIiwiQm9vbGVhbiIsImdpdGh1YlVybCIsInR3aXR0ZXJVcmwiLCJsaW5rZWRpblVybCIsIl9pbnZhbGlkIiwic3R5bGVzIiwiY29uc3RydWN0b3IiLCJyZW5kZXIiLCJfb25TdWJzY3JpYmUiLCJfb25JbnB1dENoYW5nZSIsImxlbmd0aCIsIm1hcCIsIml0ZW0iLCJpIiwiYXJyIiwiX29uU2tpcCIsIl9uYXZpZ2F0ZVNvY2lhbCIsImJpbmQiLCJ1cmwiLCJ3aW5kb3ciLCJvcGVuIiwiZSIsInRhcmdldCIsImludmFsaWQiLCJkZXRhaWwiLCJjdXN0b21FbGVtZW50cyIsImRlZmluZSJdLCJtYXBwaW5ncyI6IkFBQUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0EsU0FBU0EsR0FBVCxFQUFjQyxJQUFkLEVBQW9CQyxVQUFwQixRQUFzQyxLQUF0QztBQUNBLFNBQVNDLG1CQUFULFFBQW9DLGVBQXBDO0FBRUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7O0FBQ0EsT0FBTyxNQUFNQyx3QkFBTixTQUF1Q0YsVUFBdkMs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NSBUaGUgR3Jhdml0ZWUgdGVhbSAoaHR0cDovL2dyYXZpdGVlLmlvKVxuICpcbiAqIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbmltcG9ydCB7IGNzcywgaHRtbCwgTGl0RWxlbWVudCB9IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBkaXNwYXRjaEN1c3RvbUV2ZW50IH0gZnJvbSAnLi4vbGliL2V2ZW50cyc7XG5cbi8qKlxuICogVGhlIG5ld3NsZXR0ZXIgc3Vic2NyaXB0aW9uIHBhZ2VcbiAqXG4gKiBAZmlyZXMgZ3YtbmV3c2xldHRlci1zdWJzY3JpcHRpb246c3Vic2NyaWJlIC0gQ3VzdG9tIGV2ZW50IHdoZW4gbGluayBjbGlja1xuICogQGZpcmVzIGd2LW5ld3NsZXR0ZXItc3Vic2NyaXB0aW9uOnNraXAgLSBDdXN0b20gZXZlbnQgd2hlbiBsaW5rIGNsaWNrXG4gKlxuICogQGF0dHIge1N0cmluZ30gdGl0bGUgLSBUaGUgdGl0bGUgb2YgbmV3c2xldHRlciBzdWJzY3JpcHRpb24gY29udGFpbmVyXG4gKiBAYXR0ciB7U3RyaW5nfSBoZWFkZXIgLSBUaGUgaGVhZGVyIG9mIG5ld3NsZXR0ZXIgc3Vic2NyaXB0aW9uIGNvbnRhaW5lclxuICogQGF0dHIge1N0cmluZ30gcGxhY2Vob2xkZXIgLSBUaGUgcGxhY2Vob2xkZXIgdXNlZCBmb3IgdGhlIGVtYWlsIGlucHV0XG4gKiBAYXR0ciB7U3RyaW5nfSBzdWJzY3JpYmVMYWJlbCAtIFRoZSB0ZXh0IG9mIHRoZSBzdWJzY3JpYmUgYnV0dG9uXG4gKiBAYXR0ciB7U3RyaW5nfSBza2lwTGFiZWwgLSBUaGUgdGV4dCBvZiB0aGUgc2tpcCBidXR0b25cbiAqIEBhdHRyIHtBcnJheX0gdGFnbGluZXMgLSBUaGUgdGFnbGluZXMgdG8gcHJvbW90ZSB0aGUgbmV3c2xldHRlciBzdWJzY3JpcHRpb25cbiAqIEBhdHRyIHtTdHJpbmd9IGVtYWlsIC0gVGhlIGVtYWlsIHZhbHVlXG4gKiBAYXR0ciB7Qm9vbGVhbn0gZGlzYWJsZWQgLSBUaGUgZGlzYWJsZWQgc3RhdGUgb2YgZW1haWwgaW5wdXRcbiAqIEBhdHRyIHtTdHJpbmd9IGdpdGh1YlVybCAtIFRoZSB1cmwgdG8gZ2l0aHViIHBhZ2VcbiAqIEBhdHRyIHtTdHJpbmd9IHR3aXR0ZXJVcmwgLSBUaGUgdXJsIHRvIHR3aXR0ZXIgcGFnZVxuICogQGF0dHIge1N0cmluZ30gbGlua2VkaW5VcmwgLSBUaGUgdXJsIHRvIGxpbmtlZGluIHBhZ2VcbiAqXG4gKi9cbmV4cG9ydCBjbGFzcyBHdk5ld3NsZXR0ZXJTdWJzY3JpcHRpb24gZXh0ZW5kcyBMaXRFbGVtZW50IHtcbiAgc3RhdGljIGdldCBwcm9wZXJ0aWVzKCkge1xuICAgIHJldHVybiB7XG4gICAgICB0aXRsZTogeyB0eXBlOiBTdHJpbmcgfSxcbiAgICAgIGhlYWRlcjogeyB0eXBlOiBTdHJpbmcgfSxcbiAgICAgIHBsYWNlaG9sZGVyOiB7IHR5cGU6IFN0cmluZyB9LFxuICAgICAgc3Vic2NyaWJlTGFiZWw6IHsgdHlwZTogU3RyaW5nLCBhdHRyaWJ1dGU6ICdzdWJzY3JpYmUtbGFiZWwnIH0sXG4gICAgICBza2lwTGFiZWw6IHsgdHlwZTogU3RyaW5nLCBhdHRyaWJ1dGU6ICdza2lwLWxhYmVsJyB9LFxuICAgICAgdGFnbGluZXM6IHsgdHlwZTogQXJyYXkgfSxcbiAgICAgIGVtYWlsOiB7IHR5cGU6IFN0cmluZyB9LFxuICAgICAgZGlzYWJsZWQ6IHsgdHlwZTogQm9vbGVhbiB9LFxuICAgICAgZ2l0aHViVXJsOiB7IHR5cGU6IFN0cmluZywgYXR0cmlidXRlOiAnZ2l0aHViLXVybCcgfSxcbiAgICAgIHR3aXR0ZXJVcmw6IHsgdHlwZTogU3RyaW5nLCBhdHRyaWJ1dGU6ICd0d2l0dGVyLXVybCcgfSxcbiAgICAgIGxpbmtlZGluVXJsOiB7IHR5cGU6IFN0cmluZywgYXR0cmlidXRlOiAnbGlua2VkaW4tdXJsJyB9LFxuICAgICAgX2ludmFsaWQ6IHsgdHlwZTogQm9vbGVhbiwgYXR0cmlidXRlOiBmYWxzZSB9LFxuICAgIH07XG4gIH1cblxuICBzdGF0aWMgZ2V0IHN0eWxlcygpIHtcbiAgICByZXR1cm4gW1xuICAgICAgLy8gbGFuZ3VhZ2U9Y3NzXG4gICAgICBjc3NgXG4gICAgICAgIDpob3N0IHtcbiAgICAgICAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgICAgICAgIG1hcmdpbjogMC4ycmVtO1xuICAgICAgICB9XG5cbiAgICAgICAgLm5ld3NsZXR0ZXItY29udGFpbmVyIHtcbiAgICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gICAgICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG4gICAgICAgICAgbWF4LXdpZHRoOiA2ODBweDtcbiAgICAgICAgICBib3gtc2hhZG93OiAwIDAgMjBweCAwIHJnYmEoMCwgMCwgMCwgMC4yKSwgMCA1cHggNXB4IDAgcmdiYSgwLCAwLCAwLCAwLjI0KTtcbiAgICAgICAgICBwYWRkaW5nOiAyNXB4IDIwcHggNXB4IDIwcHg7XG4gICAgICAgIH1cblxuICAgICAgICAubmV3c2xldHRlcl9faGVhZGVyIHtcbiAgICAgICAgICB0ZXh0LXRyYW5zZm9ybTogdXBwZXJjYXNlO1xuICAgICAgICAgIGZvbnQtc3R5bGU6IG9ibGlxdWU7XG4gICAgICAgICAgdGV4dC1hbGlnbjogY2VudGVyO1xuICAgICAgICAgIGZvbnQtc2l6ZTogMTZweDtcbiAgICAgICAgICBmb250LXdlaWdodDogYm9sZDtcbiAgICAgICAgICBwYWRkaW5nOiA1cHggMzVweDtcbiAgICAgICAgICBjb2xvcjogdmFyKC0tZ3YtdGhlbWUtbmV1dHJhbC1jb2xvci1saWdodGVzdCwgI2ZmZmZmZik7XG4gICAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tZ3YtdGhlbWUtY29sb3ItbGlnaHQsICM4NmMzZDApO1xuICAgICAgICB9XG5cbiAgICAgICAgLm5ld3NsZXR0ZXJfX3RpdGxlIHtcbiAgICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gICAgICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICAgICAgICBmb250LXNpemU6IDIwcHg7XG4gICAgICAgICAgdGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbiAgICAgICAgICBwYWRkaW5nOiAyMHB4O1xuICAgICAgICAgIGNvbG9yOiB2YXIoLS1ndi10aGVtZS1jb2xvci1saWdodCwgIzg2YzNkMCk7XG4gICAgICAgIH1cblxuICAgICAgICAubmV3c2xldHRlcl9fdGl0bGUtaGlnaGxpZ2h0IHtcbiAgICAgICAgICBmb250LXNpemU6IDMwcHg7XG4gICAgICAgIH1cblxuICAgICAgICAubmV3c2xldHRlcl9fZW1haWwge1xuICAgICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICAgICAgICB3aWR0aDogNTAlO1xuICAgICAgICB9XG5cbiAgICAgICAgLm5ld3NsZXR0ZXJfX3RhZ2xpbmVzIHtcbiAgICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XG4gICAgICAgICAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICAgICAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgICAgICAgdGV4dC1hbGlnbjogY2VudGVyO1xuICAgICAgICAgIHRleHQtdHJhbnNmb3JtOiB1cHBlcmNhc2U7XG4gICAgICAgICAgZm9udC1zaXplOiAxNHB4O1xuICAgICAgICAgIGhlaWdodDogMjAlO1xuICAgICAgICAgIG1hcmdpbi10b3A6IDIwcHg7XG4gICAgICAgICAgcGFkZGluZzogMTBweCAwO1xuICAgICAgICAgIGNvbG9yOiB2YXIoLS1ndi10aGVtZS1jb2xvci1kYXJrZXIsICMzODNlM2YpO1xuICAgICAgICAgIGJvcmRlci1ib3R0b206IHNvbGlkIDFweCB2YXIoLS1ndi10aGVtZS1jb2xvci1kYXJrZXIsICMzODNlM2YpO1xuICAgICAgICB9XG5cbiAgICAgICAgLm5ld3NsZXR0ZXJfX3RhZ2xpbmUge1xuICAgICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgICAgZmxleC1iYXNpczogMTAwJTtcbiAgICAgICAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICAgICAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgICAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgICAgICAgaGVpZ2h0OiAxMDAlO1xuICAgICAgICAgIGZvbnQtd2VpZ2h0OiBib2xkO1xuICAgICAgICAgIHBhZGRpbmc6IDAgMTVweDtcbiAgICAgICAgICBib3JkZXItcmlnaHQ6IHNvbGlkIDFweCB2YXIoLS1ndi10aGVtZS1jb2xvci1kYXJrZXIsICMzODNlM2YpO1xuICAgICAgICB9XG5cbiAgICAgICAgLm5ld3NsZXR0ZXJfX3RhZ2xpbmUubGFzdCB7XG4gICAgICAgICAgYm9yZGVyLXJpZ2h0OiBub25lO1xuICAgICAgICB9XG5cbiAgICAgICAgLm5ld3NsZXR0ZXJfX3RhZ2xpbmUtdGV4dCB7XG4gICAgICAgICAgd2lkdGg6IDEwMCU7XG4gICAgICAgIH1cblxuICAgICAgICAubmV3c2xldHRlcl9fc2tpcCB7XG4gICAgICAgICAgbWFyZ2luLXRvcDogMjBweDtcbiAgICAgICAgfVxuXG4gICAgICAgIC5zb2NpYWwge1xuICAgICAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgICAgZmxleC1kaXJlY3Rpb246IHJvdztcbiAgICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtZW5kO1xuICAgICAgICB9XG5cbiAgICAgICAgLnNvY2lhbC1saW5rIHtcbiAgICAgICAgICAtLWd2LWljb24tLWM6IHZhcigtLWd2LXRoZW1lLWNvbG9yLWxpZ2h0LCAjODZjM2QwKTtcbiAgICAgICAgICAtLWd2LWljb24tLXM6IDMycHg7XG4gICAgICAgIH1cbiAgICAgIGAsXG4gICAgXTtcbiAgfVxuXG4gIGNvbnN0cnVjdG9yKCkge1xuICAgIHN1cGVyKCk7XG4gICAgdGhpcy5oZWFkZXIgPSAnQ3VzdG9tZXJzIHByb2Nlc3Mgb3ZlciAxIGJpbGxpb24gcmVxdWVzdHMgdGhyb3VnaCB0aGUgZ3Jhdml0ZWUuaW8gZ2F0ZXdheSBpbiBqdXN0IG9uZSB3ZWVrJztcbiAgICB0aGlzLnRpdGxlID0gJ0NvbW11bml0eSBvZiBhcGkgbWFzdGVycyc7XG4gICAgdGhpcy5wbGFjZWhvbGRlciA9ICdFbnRlciB5b3VyIGVtYWlsJztcbiAgICB0aGlzLnN1YnNjcmliZUxhYmVsID0gJ0JlY29tZSBhbiBBUEkgbWFzdGVyIG5vdyc7XG4gICAgdGhpcy50YWdsaW5lcyA9IFsnTmV3IHJlbGVhc2UgbW9udGhseSB1cGRhdGVzJywgJ0ZyZWUgdHJpYWwgb2YgR3Jhdml0ZWUuSU8gZW50ZXJwcmlzZScsICdTaGFyZSB5b3VyIGV4cGVyaWVuY2VzIHdpdGggb3RoZXIgbWVtYmVycyddO1xuICAgIHRoaXMuc2tpcExhYmVsID0gJ1NraXAnO1xuICAgIHRoaXMuZW1haWwgPSAnJztcbiAgICB0aGlzLmRpc2FibGVkID0gZmFsc2U7XG4gICAgdGhpcy5faW52YWxpZCA9IHRydWU7XG4gICAgdGhpcy5naXRodWJVcmwgPSAnaHR0cHM6Ly9naXRodWIuY29tL2dyYXZpdGVlLWlvJztcbiAgICB0aGlzLnR3aXR0ZXJVcmwgPSAnaHR0cHM6Ly90d2l0dGVyLmNvbS9HcmF2aXRlZUlPJztcbiAgICB0aGlzLmxpbmtlZGluVXJsID0gJ2h0dHBzOi8vd3d3LmxpbmtlZGluLmNvbS9jb21wYW55L2dyYXZpdGVlLWlvLyc7XG4gIH1cblxuICByZW5kZXIoKSB7XG4gICAgcmV0dXJuIGh0bWxgXG4gICAgICAgIDxkaXYgY2xhc3M9XCJuZXdzbGV0dGVyLWNvbnRhaW5lclwiPlxuICAgICAgICAgIDxkaXYgY2xhc3M9XCJuZXdzbGV0dGVyX19oZWFkZXJcIj5cbiAgICAgICAgICAgICR7dGhpcy5oZWFkZXJ9XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgPGRpdiBjbGFzcz1cIm5ld3NsZXR0ZXJfX3RpdGxlXCI+XG4gICAgICAgICAgICA8c3Bhbj5Kb2luIHRoZTwvc3Bhbj5cbiAgICAgICAgICAgIDxzcGFuIGNsYXNzPVwibmV3c2xldHRlcl9fdGl0bGUtaGlnaGxpZ2h0XCI+JHt0aGlzLnRpdGxlfTwvc3Bhbj5cbiAgICAgICAgICAgIDxzcGFuPlRvZGF5PC9zcGFuPlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDxkaXYgY2xhc3M9XCJuZXdzbGV0dGVyX19lbWFpbFwiPlxuICAgICAgICAgICAgPGd2LWlucHV0XG4gICAgICAgICAgICAgIGlkPVwiZW1haWxcIlxuICAgICAgICAgICAgICBuYW1lPVwiZW1haWxcIlxuICAgICAgICAgICAgICBAZ3YtaW5wdXQ6c3VibWl0PVwiJHt0aGlzLl9vblN1YnNjcmliZX1cIlxuICAgICAgICAgICAgICBAZ3YtaW5wdXQ6aW5wdXQ9XCIke3RoaXMuX29uSW5wdXRDaGFuZ2V9XCJcbiAgICAgICAgICAgICAgdHlwZT1cImVtYWlsXCJcbiAgICAgICAgICAgICAgcmVxdWlyZWRcbiAgICAgICAgICAgICAgLnZhbHVlPVwiJHt0aGlzLmVtYWlsfVwiXG4gICAgICAgICAgICAgIC5kaXNhYmxlZD0ke3RoaXMuZGlzYWJsZWR9XG4gICAgICAgICAgICAgIHBsYWNlaG9sZGVyPVwiJHt0aGlzLnBsYWNlaG9sZGVyfVwiXG4gICAgICAgICAgICA+PC9ndi1pbnB1dD5cbiAgICAgICAgICAgIDxndi1idXR0b24gQGNsaWNrPVwiJHt0aGlzLl9vblN1YnNjcmliZX1cIlxuICAgICAgICAgICAgICAgICAgICAgICBpZD1cImVtYWlsLXN1Ym1pdFwiXG4gICAgICAgICAgICAgICAgICAgICAgIHByb3ZpZGVyPVwiZ3Jhdml0ZWVpb19hbVwiXG4gICAgICAgICAgICAgICAgICAgICAgIGljb24tcmlnaHQ9XCJuYXZpZ2F0aW9uOmFuZ2xlLXJpZ2h0XCJcbiAgICAgICAgICAgICAgICAgICAgICAgLmRpc2FibGVkPSR7IXRoaXMuZGlzYWJsZWQgJiYgdGhpcy5faW52YWxpZH0+XG4gICAgICAgICAgICAgICR7dGhpcy5zdWJzY3JpYmVMYWJlbH1cbiAgICAgICAgICAgIDwvZ3YtYnV0dG9uPlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICR7XG4gICAgICAgICAgICB0aGlzLnRhZ2xpbmVzLmxlbmd0aCA+IDBcbiAgICAgICAgICAgICAgPyBodG1sYCA8ZGl2IGNsYXNzPVwibmV3c2xldHRlcl9fdGFnbGluZXNcIj5cbiAgICAgICAgICAgICAgICAgICR7dGhpcy50YWdsaW5lcy5tYXAoXG4gICAgICAgICAgICAgICAgICAgIChpdGVtLCBpLCBhcnIpID0+IGh0bWxgXG4gICAgICAgICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cIm5ld3NsZXR0ZXJfX3RhZ2xpbmUgJHtpID09PSBhcnIubGVuZ3RoIC0gMSA/ICdsYXN0JyA6ICcnfVwiPlxuICAgICAgICAgICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cIm5ld3NsZXR0ZXJfX3RhZ2xpbmUtdGV4dFwiPiR7aXRlbX08L2Rpdj5cbiAgICAgICAgICAgICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgICAgICAgICAgYCxcbiAgICAgICAgICAgICAgICAgICl9XG4gICAgICAgICAgICAgICAgPC9kaXY+YFxuICAgICAgICAgICAgICA6ICcnXG4gICAgICAgICAgfVxuICAgICAgICAgIDxkaXYgY2xhc3M9XCJuZXdzbGV0dGVyX19za2lwXCI+XG4gICAgICAgICAgICA8Z3YtYnV0dG9uIEBjbGljaz1cIiR7dGhpcy5fb25Ta2lwfVwiXG4gICAgICAgICAgICAgICAgICAgICAgIHByb3ZpZGVyPVwiZ3Jhdml0ZWVpb19hbVwiXG4gICAgICAgICAgICAgICAgICAgICAgIGljb24tcmlnaHQ9XCJuYXZpZ2F0aW9uOmFuZ2xlLXJpZ2h0XCJcbiAgICAgICAgICAgICAgICAgICAgICAgc21hbGxcbiAgICAgICAgICAgICAgICAgICAgICAgb3V0bGluZWQ+XG4gICAgICAgICAgICAgICR7dGhpcy5za2lwTGFiZWx9XG4gICAgICAgICAgICA8L2d2LWJ1dHRvbj5cbiAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICA8ZGl2IGNsYXNzPVwic29jaWFsXCI+XG4gICAgICAgICAgICA8Z3YtYnV0dG9uIGNsYXNzPVwic29jaWFsLWxpbmtcIlxuICAgICAgICAgICAgICAgICAgICAgICBsaW5rXG4gICAgICAgICAgICAgICAgICAgICAgIGljb249XCJ0aGlyZHBhcnR5OmdpdGh1YlwiXG4gICAgICAgICAgICAgICAgICAgICAgIC5ocmVmPVwiJHt0aGlzLmdpdGh1YlVybH1cIlxuICAgICAgICAgICAgICAgICAgICAgICBAZ3YtYnV0dG9uOmNsaWNrPVwiJHt0aGlzLl9uYXZpZ2F0ZVNvY2lhbC5iaW5kKHRoaXMsIHRoaXMuZ2l0aHViVXJsKX1cIj5cbiAgICAgICAgICAgIDwvZ3YtYnV0dG9uPlxuICAgICAgICAgICAgPGd2LWJ1dHRvbiBjbGFzcz1cInNvY2lhbC1saW5rXCJcbiAgICAgICAgICAgICAgICAgICAgICAgbGluayBpY29uPVwidGhpcmRwYXJ0eTp0d2l0dGVyXCJcbiAgICAgICAgICAgICAgICAgICAgICAgLmhyZWY9XCIke3RoaXMudHdpdHRlclVybH1cIlxuICAgICAgICAgICAgICAgICAgICAgICBAZ3YtYnV0dG9uOmNsaWNrPVwiJHt0aGlzLl9uYXZpZ2F0ZVNvY2lhbC5iaW5kKHRoaXMsIHRoaXMudHdpdHRlclVybCl9XCI+XG4gICAgICAgICAgICA8L2d2LWJ1dHRvbj5cbiAgICAgICAgICAgIDxndi1idXR0b24gY2xhc3M9XCJzb2NpYWwtbGlua1wiXG4gICAgICAgICAgICAgICAgICAgICAgIGxpbmtcbiAgICAgICAgICAgICAgICAgICAgICAgaWNvbj1cInRoaXJkcGFydHk6bGlua2VkaW5cIlxuICAgICAgICAgICAgICAgICAgICAgICAuaHJlZj1cIiR7dGhpcy5saW5rZWRpblVybH1cIlxuICAgICAgICAgICAgICAgICAgICAgICBAZ3YtYnV0dG9uOmNsaWNrPVwiJHt0aGlzLl9uYXZpZ2F0ZVNvY2lhbC5iaW5kKHRoaXMsIHRoaXMubGlua2VkaW5VcmwpfVwiPlxuICAgICAgICAgICAgPC9ndi1idXR0b24+XG4gICAgICAgICAgICA8L2d2LWxpbms+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvZGl2PlxuICAgIGA7XG4gIH1cblxuICBfb25TdWJzY3JpYmUoKSB7XG4gICAgZGlzcGF0Y2hDdXN0b21FdmVudCh0aGlzLCAnc3Vic2NyaWJlJywgdGhpcy5lbWFpbCk7XG4gIH1cblxuICBfb25Ta2lwKCkge1xuICAgIGRpc3BhdGNoQ3VzdG9tRXZlbnQodGhpcywgJ3NraXAnKTtcbiAgfVxuXG4gIF9uYXZpZ2F0ZVNvY2lhbCh1cmwpIHtcbiAgICB3aW5kb3cub3Blbih1cmwsICdfYmxhbmsnKTtcbiAgfVxuXG4gIF9vbklucHV0Q2hhbmdlKGUpIHtcbiAgICB0aGlzLl9pbnZhbGlkID0gZS50YXJnZXQuaW52YWxpZDtcbiAgICB0aGlzLmVtYWlsID0gZS5kZXRhaWw7XG4gIH1cbn1cblxud2luZG93LmN1c3RvbUVsZW1lbnRzLmRlZmluZSgnZ3YtbmV3c2xldHRlci1zdWJzY3JpcHRpb24nLCBHdk5ld3NsZXR0ZXJTdWJzY3JpcHRpb24pO1xuIl19