(self.webpackChunk_genesislcap_foundation_login=self.webpackChunk_genesislcap_foundation_login||[]).push([[170],{3170:(e,t,o)=>{"use strict";o.r(t),o.d(t,{BackgroundElement:()=>j,BaseRoute:()=>O,ConfigHostElement:()=>R,Login:()=>Ce,LoginConfig:()=>b,LoginHosted:()=>Se,LogoElement:()=>U,MainRouterConfig:()=>we,MessageElement:()=>H,Routes:()=>m,SubmittingIndicator:()=>W,backButton:()=>q,configurableTextField:()=>T,configure:()=>v,defaultApiHost:()=>d,defaultLoginConfig:()=>f,defaultOnBackMS:()=>P,defaultOrganisation:()=>r,defaultPassword:()=>l,defaultSocketExt:()=>u,defaultTemplateOptions:()=>$e,defaultUser:()=>c,define:()=>ze,definition:()=>xe,emailField:()=>D,hostEnv:()=>g,hostUrl:()=>h,isMFRoute:()=>p,organisationField:()=>L,password2Field:()=>I,passwordField:()=>M,showPasswordsCheckbox:()=>N,standaloneDefinition:()=>ke,styles:()=>_e,submitButton:()=>B,template:()=>ye,usernameField:()=>A});var s=o(1273),i=o(9398),n=o(7924),a=o(7702);const r=void 0,c=void 0,l=void 0,d=void 0,u=void 0,g=location.host,h=`${"https:"===location.protocol?"wss:":"ws:"}//${g}/gwf/`,m={login:"login","request-account":"request-account","reset-password":"reset-password","forgot-password":"forgot-password",verify:"verify",protected:"protected","not-found":"not-found"};function p(e=location.pathname){const t=e.split("/")["/"===e.charAt(0)?1:0];return!!m[t]}const f={autoConnect:!1,autoAuth:!1,logo:s.css`
    content: url(${n});
  `,background:s.css`
    :host {
      background-image: url(${a});
    }
  `,omitRoutes:[],fields:{organisation:null,username:{label:"Username",value:c},email:{label:"Email Address"},password:{label:"Password",value:l}},showConnectionIndicator:!1,defaultRedirectUrl:"/protected",omitRedirectUrls:["/not-found","/not-permitted"],sso:{identityProvidersPath:"sso/list"}},b=i.DI.createInterface();function v(e,t){e.register(i.Registration.instance(b,Object.assign(Object.assign({},f),t)))}var w=o(7261),y=o(5373),_=o(2140),$=o(1242),x=o(7981);const k=(0,x.createLogger)("foundation-login");var C;function S(){return(0,y.__awaiter)(this,void 0,void 0,(function*(){let e=C.REMOTE;try{return yield o.e(993).then(o.t.bind(o,2993,23))}catch(t){return e=C.LOCAL,yield Promise.resolve().then(o.t.bind(o,3671,23))}finally{k.debug(`Using '${e}' version of foundationZero/ZeroDesignSystem`)}}))}!function(e){e.LOCAL="LOCAL",e.REMOTE="REMOTE"}(C||(C={})),w.FoundationRouter;var z=o(3671),E=o(9691);const P=3e3;class R extends s.FASTElement{connectedCallback(){this.config=this.container.has(b,!0)?this.container.get(b):f,super.connectedCallback()}}(0,y.__decorate)([i.Container],R.prototype,"container",void 0),(0,y.__decorate)([s.observable],R.prototype,"config",void 0);class O extends R{constructor(){super(...arguments),this.host="",this.organisation="",this.username="",this.email="",this.password="",this.password2="",this.showPasswords=!1,this.message="",this.hasErrors=!1,this.isSubmitting=!1,this.onBack=()=>this.onNavigate("login"),this.onNavigate=(e,t)=>$.Route.name.push($.Router.find(this),e,t)}connectedCallback(){var e;super.connectedCallback(),this.host=null!==(e=this.session.getSessionStorageItem("hostUrl"))&&void 0!==e?e:h}onSubmit(){return(0,y.__awaiter)(this,void 0,void 0,(function*(){this.isSubmitting=!0,this.clearError(),yield this.ensureConnection()}))}ensureConnection(){return(0,y.__awaiter)(this,void 0,void 0,(function*(){return!!this.connect.isConnected||this.connect.connect(this.host)}))}setError(e){this.message=e,this.hasErrors=!0}clearError(){this.message="",this.hasErrors=!1}get orgUsername(){return this.config.fields.organisation?`${this.username.trim()}:${this.organisation.trim()}`:this.username.trim()}queueOnBack(e=P){setTimeout((()=>{this.onBack()}),e)}autofill(){var e,t,o;return(0,y.__awaiter)(this,void 0,void 0,(function*(){let s;try{if(s=yield this.credentialManager.getCredentials(),s&&(this.username=null!==(e=s.name)&&void 0!==e?e:"",this.password=null!==(t=s.password)&&void 0!==t?t:"",this.config.fields.organisation)){const e=(null!==(o=s.id)&&void 0!==o?o:"").split(":"),t=e[2===e.length?1:0];t!==this.username&&(this.organisation=t)}}catch(e){k.error("An error occurred attempting to get and autofill from stored credentials.",e)}return Promise.resolve(!!s)}))}storeCredentials(e=this.password){this.credentialManager.storeCredentials({id:this.orgUsername,name:this.username,password:e})}sendMessage(e,t="",o){return(0,y.__awaiter)(this,void 0,void 0,(function*(){yield this.ensureConnection(),this.clearError();const s=yield this.connect.send(e);s.ERROR?this.setError(s.ERROR.map((e=>e.TEXT)).toString()):(this.message=t,o&&o(s),this.queueOnBack())}))}}(0,y.__decorate)([_.Auth],O.prototype,"auth",void 0),(0,y.__decorate)([_.Connect],O.prototype,"connect",void 0),(0,y.__decorate)([_.Session],O.prototype,"session",void 0),(0,y.__decorate)([_.MessageBuilder],O.prototype,"messageBuilder",void 0),(0,y.__decorate)([_.CredentialManager],O.prototype,"credentialManager",void 0),(0,y.__decorate)([s.observable],O.prototype,"host",void 0),(0,y.__decorate)([s.observable],O.prototype,"organisation",void 0),(0,y.__decorate)([s.observable],O.prototype,"username",void 0),(0,y.__decorate)([s.observable],O.prototype,"email",void 0),(0,y.__decorate)([s.observable],O.prototype,"password",void 0),(0,y.__decorate)([s.observable],O.prototype,"password2",void 0),(0,y.__decorate)([s.observable],O.prototype,"showPasswords",void 0),(0,y.__decorate)([s.observable],O.prototype,"message",void 0),(0,y.__decorate)([s.observable],O.prototype,"hasErrors",void 0),(0,y.__decorate)([s.observable],O.prototype,"isSubmitting",void 0);const T=(e,t,o=!1,i="",n="",a="",r="",c=!0)=>{const[l,d]=Array.isArray(e)?e:[e,e];return s.html`
    ${(0,s.when)((e=>e.config.fields[l]),s.html`
        <zero-text-field
          type="${t}"
          name="${l}"
          id="${l}"
          :value="${(0,x.sync)((e=>e[d]))}"
          ?autofocus="${()=>o}"
          ?required="${()=>c}"
          ${i?`autocomplete="${i}"`:""}
          data-test-id="${null!=r?r:l}"
          class="${n}"
        >
          <span class="form-title">
            ${e=>null!=a?a:e.config.fields[l].label}
          </span>
        </zero-text-field>
      `)}
  `},L=()=>s.html`
  ${(0,s.when)((e=>e.config.fields.organisation),s.html`
      <zero-text-field
        type="text"
        name="organisation"
        id="organisation"
        autocomplete="organisation"
        data-test-id="organisation"
        :value="${(0,x.sync)((e=>e.organisation))}"
        autofocus
        class="${e=>e.config.logo?"":"no-top-margin"}"
        required
      >
        <span class="form-title">
          ${e=>{var t;return null!==(t=e.config.fields.organisation.label)&&void 0!==t?t:"Organisation"}}
        </span>
      </zero-text-field>
    `)}
`,A=()=>s.html`
  <zero-text-field
    type="text"
    name="username"
    id="username"
    autocomplete="username email"
    data-test-id="username"
    :value="${(0,x.sync)((e=>e.username))}"
    ?autofocus="${e=>!e.config.fields.organisation}"
    class="${e=>e.config.logo||e.config.fields.organisation?"":"no-top-margin"}"
    required
  >
    <span class="form-title">${e=>{var t;return null!==(t=e.config.fields.username.label)&&void 0!==t?t:"Username"}}</span>
  </zero-text-field>
`,D=()=>s.html`
  ${(0,s.when)((e=>e.config.fields.email),s.html`
      <zero-text-field
        type="email"
        name="email"
        id="email"
        autocomplete="email"
        data-test-id="email"
        :value="${(0,x.sync)((e=>e.email))}"
        required
      >
        <span class="form-title">${e=>{var t;return null!==(t=e.config.fields.email.label)&&void 0!==t?t:"Email"}}</span>
      </zero-text-field>
    `)}
`,M=e=>s.html`
  <zero-text-field
    type="${e=>e.showPasswords?"text":"password"}"
    name="password"
    id="password"
    autocomplete="current-password"
    data-test-id="password"
    :value="${(0,x.sync)((e=>e.password))}"
    required
  >
    <span class="form-title">${t=>{var o;return null!==(o=null!=e?e:t.config.fields.password.label)&&void 0!==o?o:"Password"}}</span>
  </zero-text-field>
`,F={new:["new-password","New Password"],confirmation:["password-confirmation","Confirm Password"]},I=e=>{const[t,o]=F[e];return s.html`
    <zero-text-field
      type="${e=>e.showPasswords?"text":"password"}"
      name="${t}"
      id="${t}"
      autocomplete="${t}"
      data-test-id="${t}"
      :value="${(0,x.sync)((e=>e.password2))}"
      required
    >
      <span class="form-title">${o}</span>
    </zero-text-field>
  `};let j=class extends R{connectedCallback(){super.connectedCallback(),this.$fastController.addStyles(this.config.background)}};j=(0,y.__decorate)([(0,s.customElement)({name:"login-background",template:s.html`
    <template class="background" part="background" data-test-id="background">
      <slot></slot>
    </template>
  `,styles:s.css`
    :host {
      background-color: var(--foundation-login-background-color, transparent);
      background-position: left top;
      background-repeat: no-repeat;
      background-attachment: fixed;
      background-size: cover;
      background-origin: border-box;
      display: flex;
      flex-direction: column;
      align-items: center;
      width: 100%;
      height: 100%;
      overflow: auto;
    }
    ::slotted(div.container) {
      margin: auto;
    }
  `})],j);let U=class extends R{};U=(0,y.__decorate)([(0,s.customElement)({name:"login-logo",template:s.html`
    ${(0,s.when)((e=>e.config.logo),s.html`
        <img class="logo" style="${e=>e.config.logo.styles}" part="logo" data-test-id="logo" />
      `)}
  `,styles:s.css`
    .logo {
      display: initial;
      margin-bottom: calc(var(--design-unit) * 5px);
      transition: opacity 5s ease-in-out;
      width: auto;
      height: auto;
    }
  `})],U);const q=e=>s.html`
  <zero-button
    appearance="neutral-grey"
    type="button"
    class="action-btn"
    @click=${e}
    data-test-id="back"
  >
    Back
  </zero-button>
`,B=(e,t="submit",o=!1)=>s.html`
  <zero-button
    appearance="primary-gradient"
    type="submit"
    class="action-btn"
    data-test-id="${t}"
    ?disabled="${()=>o}"
  >
    ${e}
  </zero-button>
`,N=()=>s.html`
  <zero-checkbox
    ?checked="${(0,x.sync)((e=>e.showPasswords),"boolean")}"
    name="show-passwords"
    data-test-id="show-passwords"
  >
    Show Passwords
  </zero-checkbox>
`;let H=class extends s.FASTElement{constructor(){super(...arguments),this.classNames="",this.message="",this.nonError=!1}nonErrorChanged(){this.classNames=(0,E.classNames)("message",["non-error",this.nonError])}};(0,y.__decorate)([s.observable],H.prototype,"classNames",void 0),(0,y.__decorate)([s.attr],H.prototype,"message",void 0),(0,y.__decorate)([(0,s.attr)({mode:"boolean",attribute:"non-error"})],H.prototype,"nonError",void 0),H=(0,y.__decorate)([(0,s.customElement)({name:"login-message",template:s.html`
    ${(0,s.when)((e=>e.message),s.html`
        <span class="${e=>e.classNames}" part="message" data-test-id="message">
          ${e=>e.message}
        </span>
      `)}
  `,styles:s.css`
    :host {
      text-align: center;
    }
    .message {
      color: ${z.SecondaryRapidColorHEX.orange};
      margin-top: calc(var(--design-unit) * 3px);
      white-space: pre-line;
    }
    .message.non-error {
      color: ${z.SecondaryRapidColorHEX.teal};
    }
  `})],H);let W=class extends s.FASTElement{constructor(){super(...arguments),this.isSubmitting=!1}};(0,y.__decorate)([(0,s.attr)({mode:"boolean",attribute:"is-submitting"})],W.prototype,"isSubmitting",void 0),W=(0,y.__decorate)([(0,s.customElement)({name:"submitting-indicator",template:s.html`
    ${(0,s.when)((e=>e.isSubmitting),s.html`
        <zero-progress-ring
          part="submitting-indicator"
          data-test-id="submitting-indicator"
        ></zero-progress-ring>
      `)}
  `,styles:s.css`
    :host {
      display: flex;
      justify-content: center;
    }
    zero-progress-ring {
      align-self: center;
    }
  `})],W);const V=new $.FASTElementLayout(s.html`
    <div class="container">
      <div class="content">
        <slot></slot>
      </div>
    </div>
  `,s.css`
    :host {
    }

    .container {
      width: 100%;
      height: 100%;
      display: block;
      position: relative;
    }

    .content {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
    }
  `);var Z=o(2617);const X=(e="normal",t="normal")=>`\n  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif; \n  font-style: ${e};\n  font-weight: ${t};\n`,Y=(X(),X("normal","bold")),K=s.css`
  :host {
    contain: content;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;

    --design-unit: 3.5;
  }
`,G=s.css`
  .container {
    min-width: 330px;
    width: 15%;
    display: flex;
    flex-direction: column;
    align-items: center;

    animate: all 3s ease-in 0s;
  }

  .no-top-margin {
    margin-top: 0;
  }

  .no-top-margin::part(label) {
    margin-top: 0;
  }

  .card-pd {
    --zero-card-fill-color: #202126;
    padding: calc(var(--design-unit) * 5px);
  }

  .card-mg {
    margin: calc(var(--design-unit) * 2px);
  }

  .column-content {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .logo {
    display: initial;
    margin-bottom: calc(var(--design-unit) * 5px);
    transition: opacity 5s ease-in-out;
  }

  .heading {
    ${Y};

    background-color: ${Z.neutralLayer1};
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    font-size: 20px;
    margin: -4px -16px 0 -16px;
    padding: 8px 16px;
  }

  .heading2 {
    font-family: Roboto-Medium, sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 16px;
    text-align: center;
    opacity: 80%;
    margin-bottom: 10px;
  }

  .heading3 {
    text-align: center;
    font-family: Roboto-Medium, sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 12px;
    opacity: 50%;
    margin-bottom: calc(var(--design-unit) * 5px);
  }

  form {
    display: flex;
    flex-direction: column;
  }

  .action-btn {
    margin-top: calc(var(--design-unit) * 5px);
  }

  .form-buttons {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .form-title {
    font-family: Roboto-Medium, sans-serif;
    font-style: normal;
    color: var(--neutral-stroke-rest);
  }

  zero-text-field {
    margin: 8px 0 12px;
  }

  zero-text-field::part(label) {
    margin-bottom: calc(var(--design-unit) * 2px);
  }

  zero-text-field,
  zero-select {
    margin-bottom: calc(var(--design-unit) * 3px);
  }

  zero-button::part(info1),
  zero-button::part(info2) {
    display: none;
  }

  zero-checkbox {
    margin-top: calc(var(--design-unit) * 3px);
  }

  zero-checkbox::part(label) {
    color: var(--neutral-stroke-rest);
  }
`,J=s.css`
  ${K}
  ${G}
`,Q=s.css`
  ${J}
  .link-url {
    width: fit-content;
    cursor: pointer;
    font-weight: 500;
    font-size: 12px;
    color: var(--accent-foreground-rest);
    opacity: 80%;
    padding: 1px 0;
    line-height: calc(var(--design-unit) * 6px);
    text-decoration: none;
  }

  .link-url:hover {
    color: var(--accent-foreground-hover);
    opacity: 100%;
    border-bottom: 1px solid;
    margin-bottom: -1px;
  }

  .action-btn {
    margin: calc(var(--design-unit) * 5px) 0;
  }

  .sso {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
  }

  .sso .form-title {
    font-size: var(--type-ramp-base-font-size);
    margin-bottom: calc(var(--design-unit) * 2px);
  }

  .links {
    display: flex;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    flex-wrap: wrap;
  }

  .password-links {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-self: flex-start;
  }

  .account-links {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-self: flex-start;
  }

  .case-warning {
    color: #379ec0;
    font-size: 0.83em;
    margin-block-start: 1em;
    margin-block-end: 1em;
  }

  .version {
    width: fit-content;
    font-weight: 500;
    font-size: 10px;
    color: var(--accent-foreground-rest);
    opacity: 80%;
    padding: 1px 0;
    line-height: calc(var(--design-unit) * 6px);
  }
`,ee=s.html`
  ${(0,s.when)((e=>!e.ssoToggled),s.html`
      ${L()} ${A()} ${M()}
      <span class="case-warning">*Fields are case-sensitive</span>
      ${N()}
      <div class="form-buttons">
        ${e=>B("Login","submit-login",e.submitDisabled)}
        <div class="links">
          <div class="password-links">
            ${(0,s.when)((e=>!e.config.omitRoutes.includes("forgot-password")),s.html`
                <a
                  class="link-url"
                  @click=${e=>e.onNavigate("forgot-password")}
                  data-test-id="forgot-password"
                >
                  Forgot Password?
                </a>
              `)}
            ${(0,s.when)((e=>!e.config.omitRoutes.includes("reset-password")),s.html`
                <a
                  class="link-url"
                  @click=${e=>e.onNavigate("reset-password")}
                  data-test-id="reset-password"
                >
                  Change Password
                </a>
              `)}
          </div>
          <div class="account-links">
            ${(0,s.when)((e=>!e.config.omitRoutes.includes("request-account")),s.html`
                <a
                  class="link-url"
                  @click=${e=>e.onNavigate("request-account")}
                  data-test-id="request-account"
                >
                  Request Account
                </a>
              `)}
          </div>
        </div>
      </div>
      ${(0,s.when)((e=>e.config.versionInformation),s.html`
          <div>
            <span class="version" data-test-id="version">
              ${e=>e.config.versionInformation}
            </span>
          </div>
        `)}
    `)}
`,te=s.html`
  ${(0,s.when)((e=>e.ssoToggled),s.html`
      <div class="sso">
        <span class="form-title">Providers</span>
        <zero-select
          name="sso"
          data-test-id="sso"
          :value=${(0,x.sync)((e=>e.selectedIDP))}
          ?disabled=${e=>!e.idps.length}
        >
          ${(0,s.repeat)((e=>e.idps),s.html`
              <zero-option value="${({id:e})=>e}">${({id:e})=>e}</zero-option>
            `)}
        </zero-select>
        <zero-button
          type="button"
          class="action-btn"
          appearance="primary-gradient"
          @click="${e=>e.onClickSSO()}"
          data-test-id="sso-login"
          ?disabled=${e=>!e.selectedIDP}
        >
          SSO Login
        </zero-button>
      </div>
    `)}
`,oe=s.html`
  <pre data-test-id="connect-http-mode">Http Polling Mode Enabled.</pre>
`,se=s.html`
  ${e=>e.connect.httpMode()?oe:null}
`,ie=s.html`
  <zero-connection-indicator show-label="true" />
`,ne=s.html`
  ${e=>e.connect.httpMode()?null:ie}
`,ae=s.html`
  <login-background>
    <div class="container">
      ${(0,s.when)((e=>!e.config.autoConnect),s.html`
          <zero-card class="card-pd card-mg">
            <form
              id="connect-form"
              method="post"
              autocomplete="on"
              @submit=${e=>e.onHostSubmit()}
              ?disabled=${e=>e.submitConnectDisabled}
              data-test-id="connect-form"
            >
              <zero-text-field
                class="no-top-margin"
                type="text"
                name="host"
                :value=${(0,x.sync)((e=>e.host))}
                ?disabled=${e=>e.connect.isConnected}
                data-test-id="connect-host"
                required
              >
                <span class="form-title">Host</span>
              </zero-text-field>

              ${se}

              <div class="form-buttons">
                ${e=>B(e.connectActionText,"submit-connect",e.submitConnectDisabled)}
              </div>
            </form>
          </zero-card>
        `)}

      <zero-card class="card-pd">
        <div class="column-content">
          <login-logo></login-logo>
          <div class="heading2">Login</div>
        </div>
        <form
          id="login-form"
          method="post"
          autocomplete="on"
          @submit=${e=>e.onLoginSubmit()}
          ?disabled=${e=>e.submitDisabled}
          data-test-id="login-form"
        >
          ${ee} ${te}
          ${(0,s.when)((e=>e.config.sso),s.html`
              <zero-checkbox
                ?checked="${(0,x.sync)((e=>e.ssoToggled),"boolean")}"
                name="sso-toggle"
                data-test-id="sso-toggle"
              >
                ${e=>e.ssoToggled?"SSO Enabled"+e.selectedIDPName:"Enable SSO?"}
              </zero-checkbox>
            `)}
          <login-message
            message="${e=>e.message}"
            non-error="${e=>!e.hasErrors}"
          ></login-message>
          ${(0,s.when)((e=>e.config.showConnectionIndicator),s.html`
              ${ne}
            `)}
        </form>
      </zero-card>
    </div>
  </login-background>
`;let re=class extends O{constructor(){super(...arguments),this.idps=[],this.selectedIDP="",this.ssoToggled=!1,this.fetchIDPs=()=>(0,y.__awaiter)(this,void 0,void 0,(function*(){var e,t;var o;const s=`${(o=this.host).startsWith("ws:")?o.replace("ws:","http:"):o.startsWith("wss:")?o.replace("wss:","https:"):o}${null!==(t=null===(e=this.config.sso)||void 0===e?void 0:e.identityProvidersPath)&&void 0!==t?t:"sso/list"}`;return fetch(s).then((e=>{if(e.ok)return e;throw new Error(e.statusText)})).then((e=>e.json())).then((e=>e.IDPS))})),this.toggleHttpMode=e=>{this.connect&&this.convertHostUrl()}}connectedCallback(){const e=Object.create(null,{connectedCallback:{get:()=>super.connectedCallback}});var t,o;return(0,y.__awaiter)(this,void 0,void 0,(function*(){e.connectedCallback.call(this),this.ssoToggled=null!==(o=null===(t=this.config.sso)||void 0===t?void 0:t.toggled)&&void 0!==o&&o,this.connect.isConnected&&this.auth.isLoggedIn&&(yield this.credentialManager.preventSilentAccess(),yield this.auth.logout()),this.convertHostUrl(),yield this.autofill()}))}enter(){return(0,y.__awaiter)(this,void 0,void 0,(function*(){s.DOM.queueUpdate((()=>(0,y.__awaiter)(this,void 0,void 0,(function*(){try{!this.connect.isConnected&&this.config.autoConnect&&(yield this.toggleConnection()),!this.auth.isLoggedIn&&this.config.autoAuth&&this.attemptLoginWhenConnected()}catch(e){k.debug(e)}}))))}))}toggleConnection(){return(0,y.__awaiter)(this,void 0,void 0,(function*(){return this.connect.isConnected?(this.connect.disconnect(),void k.debug(`Disconnected from ${this.host}`)):this.connect.connect(this.host)}))}attemptLoginWhenConnected(){this.connect.isConnectedSubject.subscribe((e=>{if(e){const e=this.credentialManager,t=e.createRefreshCredentials();if(e.validateRefreshCredentials(t))return k.debug("Attempting to login with refresh credentials."),void this.login(t);if(this.ssoToggled){const t=e.createSSOCredentials();if(e.validateSSOCredentials(t))return k.debug("Attempting to login with SSO."),this.login(t),void this.credentialManager.removeSSOToken()}this.attemptBasicLogin()}}))}attemptBasicLogin(){const e=this.credentialManager.createBasicCredentials({username:this.orgUsername,password:this.password});this.credentialManager.validateBasicCredentials(e)?(k.debug("Attempting to login with basic credentials."),this.login(e)):k.debug("Basic credentials appear invalid, aborting login attempt.")}ssoToggledChanged(){this.clearError(),this.ssoToggled&&this.fetchIDPs().then((e=>{var t,o;k.debug("fetched IDPs",e),this.idps=e.map((e=>({id:e.ID,type:e.TYPE}))),this.selectedIDP=null===(o=null===(t=null==this?void 0:this.idps)||void 0===t?void 0:t[0])||void 0===o?void 0:o.id})).catch((()=>this.setError("Failed to fetch identity providers.")))}get selectedIDPName(){return this.selectedIDP?` - ${this.selectedIDP}`:""}onClickSSO(){const e=this.createLoginURL();(0,x.inIFrame)()?(0,x.inSymphonyDesktop)()?(0,x.openPopup)("","symphony").location.assign(e):(0,x.openPopup)(e,"Login"):window.open(e,"_self")}createLoginURL(){const e=this.idps.find((e=>e.id===this.selectedIDP));return`https://${new URL(this.host).host}${`/gwf/${e.type}/login`}?idp=${e.id}`}convertHostUrl(){var e,t,o,s;(null===(e=this.connect)||void 0===e?void 0:e.httpMode())&&(null===(t=this.host)||void 0===t?void 0:t.startsWith("ws"))?this.host=this.host.replace("ws","http"):!(null===(o=this.connect)||void 0===o?void 0:o.httpMode())&&(null===(s=this.host)||void 0===s?void 0:s.startsWith("http"))&&(this.host=this.host.replace("http","ws"))}onHostSubmit(){return(0,y.__awaiter)(this,void 0,void 0,(function*(){k.debug("host submission"),yield this.toggleConnection()}))}onLoginSubmit(){const e=Object.create(null,{onSubmit:{get:()=>super.onSubmit}});return(0,y.__awaiter)(this,void 0,void 0,(function*(){k.debug("login submission"),yield e.onSubmit.call(this),s.DOM.queueUpdate((()=>{this.attemptBasicLogin()}))}))}login(e){return(0,y.__awaiter)(this,void 0,void 0,(function*(){try{const{authToken:t}=yield this.auth.login(e);if(!t)throw new Error("Unable to login. Try again later.");this.storeCredentials();let o=this.config.defaultRedirectUrl;this.session.returnUrl&&!this.config.omitRedirectUrls.includes(this.session.returnUrl)&&(o=this.session.returnUrl),$.Route.path.push(o)}catch(e){if(e instanceof _.AuthError)return e.hasPasswordExpiredError()?(this.storeCredentials(),void this.onNavigate("reset-password",{expired:!0})):this.config.fields.organisation&&!this.organisation.length?void this.setError(e.message+"Please fill in Comp Id."):void this.setError(e.message+e.getMessageError());this.setError(e.message)}}))}get connectActionText(){return this.connect.isConnected?"Disconnect":"Connect"}get submitConnectDisabled(){return!this.host}get submitDisabled(){return!this.connect.httpMode()&&(this.connect.isWorking||!this.connect.isConnected)}};(0,y.__decorate)([s.observable],re.prototype,"idps",void 0),(0,y.__decorate)([s.observable],re.prototype,"selectedIDP",void 0),(0,y.__decorate)([s.observable],re.prototype,"ssoToggled",void 0),(0,y.__decorate)([s.volatile],re.prototype,"selectedIDPName",null),(0,y.__decorate)([s.volatile],re.prototype,"connectActionText",null),re=(0,y.__decorate)([(0,s.customElement)({name:"foundation-login-form",template:ae,styles:Q})],re);const ce=s.html`
  <login-background>
    <div class="container">
      <zero-card class="card-pd">
        <div class="column-content">
          <login-logo></login-logo>
          <div class="heading2">Forgotten Password</div>
          <div class="heading3">Enter your account username</div>
        </div>
        <form @submit=${e=>e.onSubmit()}>
          ${L()} ${A()}
          <div class="form-buttons">
            ${B("Send Recovery Link")} ${q((e=>e.onBack()))}
          </div>
          <submitting-indicator is-submitting="${e=>e.isSubmitting}"></submitting-indicator>
          <login-message
            message="${e=>e.message}"
            non-error="${e=>!e.hasErrors}"
          ></login-message>
        </form>
      </zero-card>
    </div>
  </login-background>
`;let le=class extends O{connectedCallback(){const e=Object.create(null,{connectedCallback:{get:()=>super.connectedCallback}});return(0,y.__awaiter)(this,void 0,void 0,(function*(){e.connectedCallback.call(this),yield this.autofill()}))}onSubmit(){const e=Object.create(null,{onSubmit:{get:()=>super.onSubmit}});return(0,y.__awaiter)(this,void 0,void 0,(function*(){k.debug("forgot password submission"),yield e.onSubmit.call(this);const t=`${location.protocol}//${g}/reset-password`,o=this.messageBuilder.createForgotPasswordMessage(this.orgUsername,t);yield this.sendMessage(o,"Please check your inbox for reset instructions.")}))}};le=(0,y.__decorate)([(0,s.customElement)({name:"foundation-login-forgot-password",template:ce,styles:J})],le);let de=class extends O{};de=(0,y.__decorate)([(0,s.customElement)({name:"foundation-login-not-found",template:s.html`
    <h1 data-test-id="not-found">Not found! 404</h1>
  `,styles:J})],de);const ue=s.html`
  <login-background>
    <div class="container">
      <zero-card class="card-pd">
        <div class="column-content">
          <login-logo></login-logo>
          <div class="heading2">Request Account</div>
        </div>
        <form @submit=${e=>e.onSubmit()}>
          ${L()} ${A()} ${D()} ${M()}
          ${I("confirmation")}
          <zero-checkbox
            name="terms"
            :value=${(0,x.sync)((e=>e.termsAgreed),"boolean")}
            data-test-id="terms"
          >
            I agree to the
            <stong>Terms</stong>
            and
            <stong>Conditions</stong>
          </zero-checkbox>
          <div class="form-buttons">
            <submit-button
              is-submitting="${e=>e.isSubmitting}"
              label="Request Account"
            ></submit-button>
            ${q((e=>e.onBack()))}
          </div>
          <login-message message="${e=>e.message}"></login-message>
        </form>
      </zero-card>
    </div>
  </login-background>
`;let ge=class extends O{constructor(){super(...arguments),this.termsAgreed=!1}onSubmit(){const e=Object.create(null,{onSubmit:{get:()=>super.onSubmit}});return(0,y.__awaiter)(this,void 0,void 0,(function*(){k.debug("request account submission"),yield e.onSubmit.call(this)}))}};(0,y.__decorate)([s.observable],ge.prototype,"termsAgreed",void 0),ge=(0,y.__decorate)([(0,s.customElement)({name:"foundation-login-request-account",template:ue,styles:J})],ge);const he=s.html`
  <login-background>
    <div class="container">
      <zero-card class="card-pd">
        <div class="column-content">
          <login-logo></login-logo>
          <div class="heading2">Verify that it's you</div>
          <div class="heading3">
            We've sent a code to the email address attached to this account.
          </div>
        </div>
        <form @submit=${e=>e.onSubmit()}>
          <zero-text-field
            type="text"
            name="code"
            autocomplete="one-time-code"
            :value=${(0,x.sync)((e=>e.code))}
            autofocus
            data-test-id="code"
          >
            <span class="form-title">Verification Code</span>
          </zero-text-field>
          <div class="form-buttons">
            <submit-button
              is-submitting="${e=>e.isSubmitting}"
              label="Verify and Login"
            ></submit-button>
            ${q((e=>e.onBack()))}
          </div>
          <login-message message="${e=>e.message}"></login-message>
        </form>
      </zero-card>
    </div>
  </login-background>
`;let me=class extends O{constructor(){super(...arguments),this.code=""}onSubmit(){const e=Object.create(null,{onSubmit:{get:()=>super.onSubmit}});return(0,y.__awaiter)(this,void 0,void 0,(function*(){k.debug("2FA verify submission"),yield e.onSubmit.call(this)}))}};(0,y.__decorate)([s.observable],me.prototype,"code",void 0),me=(0,y.__decorate)([(0,s.customElement)({name:"foundation-login-verify",template:he,styles:J})],me);const pe=s.html`
  <div class="container">
    <zero-button
      type="button"
      appearance="primary-gradient"
      @click=${e=>e.onLogout()}
      data-test-id="logout"
    >
      Logout
    </zero-button>
  </div>
`;let fe=class extends O{onLogout(){return(0,y.__awaiter)(this,void 0,void 0,(function*(){(yield this.auth.logout()).success&&(yield this.credentialManager.preventSilentAccess(),this.onNavigate("login"))}))}};fe=(0,y.__decorate)([(0,s.customElement)({name:"foundation-login-protected",template:pe,styles:J})],fe);const be=s.html`
  <login-background>
    <div class="container">
      <zero-card class="card-pd">
        <div class="column-content">
          <login-logo></login-logo>
          <div class="heading2" data-test-id="heading">${e=>e.headingText}</div>
          <div class="heading3">Enter the username registered to your account</div>
        </div>
        <form @submit=${e=>e.onSubmit()} autocomplete="on">
          ${L()} ${A()}
          ${(0,s.when)((e=>!e.passwordResetToken),s.html`
              ${M("Old Password")}
            `)}
          ${I("new")} ${N()}
          <div class="form-buttons">
            ${B("Change Password")} ${q((e=>e.onBack()))}
          </div>
          <submitting-indicator is-submitting="${e=>e.isSubmitting}"></submitting-indicator>
          <login-message
            message="${e=>e.message}"
            non-error="${e=>!e.hasErrors}"
          ></login-message>
        </form>
      </zero-card>
    </div>
  </login-background>
`;let ve=class extends O{constructor(){super(...arguments),this.hasPasswordExpired=!1,this.passwordResetToken=""}connectedCallback(){const e=Object.create(null,{connectedCallback:{get:()=>super.connectedCallback}});return(0,y.__awaiter)(this,void 0,void 0,(function*(){e.connectedCallback.call(this),yield this.autofill()}))}enter(e){return(0,y.__awaiter)(this,void 0,void 0,(function*(){this.hasPasswordExpired=!!e.route.queryParams.expired,this.passwordResetToken=e.route.queryParams.password}))}onSubmit(){const e=Object.create(null,{onSubmit:{get:()=>super.onSubmit}});return(0,y.__awaiter)(this,void 0,void 0,(function*(){yield e.onSubmit.call(this),this.passwordResetToken?yield this.onForgotPasswordWorkflow():yield this.onChangePasswordWorkflow(),this.isSubmitting=!1}))}onForgotPasswordWorkflow(){return(0,y.__awaiter)(this,void 0,void 0,(function*(){k.debug("forgot password submission");const e=this.messageBuilder.createForgotPasswordTokenMessage(this.orgUsername,this.passwordResetToken,this.password2);yield this.sendMessage(e,"Password reset success.",(()=>{this.storeCredentials(this.password2)}))}))}onChangePasswordWorkflow(){return(0,y.__awaiter)(this,void 0,void 0,(function*(){k.debug("change password submission");const e=this.messageBuilder.createChangePasswordMessage(this.orgUsername,this.password,this.password2);yield this.sendMessage(e,"Password change success.",(()=>{this.storeCredentials(this.password2)}))}))}get headingText(){return this.hasPasswordExpired?"You are required to change your password":"Change Password"}};(0,y.__decorate)([s.observable],ve.prototype,"hasPasswordExpired",void 0),(0,y.__decorate)([s.observable],ve.prototype,"passwordResetToken",void 0),(0,y.__decorate)([s.volatile],ve.prototype,"headingText",null),ve=(0,y.__decorate)([(0,s.customElement)({name:"foundation-login-reset-password",template:be,styles:J})],ve);let we=class extends $.RouterConfiguration{constructor(e,t,o,s,i=f){super(),this.auth=e,this.container=t,this.analytics=o,this.session=s,this.loginConfig=i}configure(){this.title="Login",this.defaultLayout=V;const e=[{path:"",name:"login",element:re,title:"Login",settings:{public:!0}},{path:"not-found",element:de,title:"Not Found",name:"not-found",settings:{public:!0}}],{omitRoutes:t}=this.loginConfig;t.includes("request-account")||e.push({path:"request-account",name:"request-account",element:ge,title:"Request Account",settings:{public:!0}}),t.includes("reset-password")||e.push({path:"reset-password",name:"reset-password",element:ve,title:"Reset Password",settings:{public:!0}}),t.includes("forgot-password")||e.push({path:"forgot-password",name:"forgot-password",element:le,title:"Forgot Password",settings:{public:!0}}),t.includes("verify")||e.push({path:"verify",element:me,title:"Verify",name:"verify",settings:{public:!0}}),t.includes("protected")||e.push({path:"protected",element:fe,title:"Protected",name:"protected",settings:{public:!1}}),this.routes.map(...e);const o=this.session,s=this.auth,i=this.analytics;this.routes.fallback((()=>s.isLoggedIn?{redirect:"not-found"}:{redirect:"login"})),this.contributors.push({navigate:e=>(0,y.__awaiter)(this,void 0,void 0,(function*(){const t=e.route.settings;i.trackEvent(_.FoundationAnalyticsEventType.routeChanged,{path:e.route.endpoint.path}),t&&t.public||s.isLoggedIn||this.loginConfig.autoAuth&&(yield s.reAuthFromSession())||e.cancel((()=>{o.captureReturnUrl(),$.Route.name.replace(e.router,"login")}))}))})}construct(e){return this.container.get(e)}};we=(0,y.__decorate)([(0,y.__param)(0,_.Auth),(0,y.__param)(1,i.Container),(0,y.__param)(2,_.FoundationAnalytics),(0,y.__param)(3,_.Session),(0,y.__param)(4,(0,i.optional)(b))],we);const ye=e=>{const t=(0,w.tagFor)(e.provider),o=(0,w.tagFor)(e.router);return s.html`
    <${t} data-test-id="login-provider" ${(0,s.ref)("provider")}>
      <${o} :config=${e=>e.config} data-test-id="login-router"></${o}>
    </${t}>
  `},_e=e=>{const t=(0,w.tagFor)(e.provider),o=(0,w.tagFor)(e.router);return s.css`
    ${(0,z.mixinRobotoFont)()}
    :host {
      contain: content;
    }

    :host,
    ${t}, ${o} {
      display: flex;
      width: 100%;
      height: 100%;
    }

    :host([hidden]) {
      display: none;
    }

    :host:not(:defined) {
      visibility: hidden;
    }
  `},$e={anchor:"zero-anchor",button:"zero-button",card:"zero-card",checkbox:"zero-checkbox",listboxOption:"zero-option",provider:"template",router:"foundation-router",select:"zero-select",textField:"zero-text-field"},xe={name:"foundation-login",template:ye($e),styles:_e($e)},ke={name:"foundation-login",template:ye(Object.assign(Object.assign({},$e),{provider:"zero-design-system-provider"})),styles:_e(Object.assign(Object.assign({},$e),{provider:"zero-design-system-provider"}))};let Ce=class extends s.FASTElement{constructor(){super(...arguments),this.ready=!1}connectedCallback(){const e=Object.create(null,{connectedCallback:{get:()=>super.connectedCallback}});return(0,y.__awaiter)(this,void 0,void 0,(function*(){this.registerDIDependencies(),e.connectedCallback.call(this),yield this.registerCommonComponents(),this.checkForSSOToken()}))}checkForSSOToken(){const e=new URLSearchParams(window.location.search).get("SSO_TOKEN");e&&(window.opener?(window.opener.sessionStorage.setItem("ssoToken",e),window.opener.location.reload(),window.close()):this.session.setSessionStorageItem("ssoToken",e))}registerCommonComponents(){return(0,y.__awaiter)(this,void 0,void 0,(function*(){yield function(e){return(0,y.__awaiter)(this,void 0,void 0,(function*(){const{registerZeroDesignSystem:e}=yield S();return{ZeroDesignSystem:e()}}))}(),this.ready=!0}))}registerDIDependencies(){this.container.register(i.Registration.transient($.DefaultRouteRecognizer,$.DefaultRouteRecognizer),i.Registration.instance(_.ConnectConfig,Object.assign(Object.assign({},_.defaultConnectConfig),{connect:Object.assign(Object.assign({},_.defaultConnectConfig.connect),{heartbeatInterval:12e3})})))}};(0,y.__decorate)([(0,i.inject)(we)],Ce.prototype,"config",void 0),(0,y.__decorate)([i.Container],Ce.prototype,"container",void 0),(0,y.__decorate)([_.Session],Ce.prototype,"session",void 0),(0,y.__decorate)([s.observable],Ce.prototype,"ready",void 0),(0,y.__decorate)([s.observable],Ce.prototype,"provider",void 0),Ce=(0,y.__decorate)([(0,s.customElement)(ke)],Ce);let Se=class extends Ce{registerCommonComponents(){return(0,y.__awaiter)(this,void 0,void 0,(function*(){this.ready=!0}))}};Se=(0,y.__decorate)([(0,s.customElement)(Object.assign(Object.assign({},xe),{name:`${xe.name}-hosted`}))],Se);const ze=(0,w.defineFactory)(Ce,xe)},7702:(e,t,o)=>{"use strict";e.exports=o.p+"c0bd2c45d93ce443d624.jpg"},7924:(e,t,o)=>{"use strict";e.exports=o.p+"b634d7e1f2324faf1230.svg"}}]);
//# sourceMappingURL=170.02ecd6ffb7bb9c9531e72b7099ba0dce.js.map