@atlasauth/angular 0.15.1 → 0.16.1

package/dist/fesm2022/atlasauth-angular.mjs

@@ -1,10 +1,10 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, signal, inject, PLATFORM_ID, computed, Injectable, TemplateRef, ViewContainerRef, Directive, Input, ElementRef, Renderer2, EventEmitter, Output, ChangeDetectionStrategy, Component, ChangeDetectorRef, effect, untracked, DestroyRef, makeEnvironmentProviders, ENVIRONMENT_INITIALIZER, NgModule } from '@angular/core';
+import { InjectionToken, signal, inject, PLATFORM_ID, computed, Injectable, TemplateRef, ViewContainerRef, Directive, Input, ElementRef, Renderer2, EventEmitter, Output, ChangeDetectionStrategy, Component, ChangeDetectorRef, afterNextRender, effect, untracked, DestroyRef, makeEnvironmentProviders, ENVIRONMENT_INITIALIZER, NgModule } from '@angular/core';
 import { isPlatformBrowser, DOCUMENT } from '@angular/common';
 import { toSignal } from '@angular/core/rxjs-interop';
 import { BehaviorSubject, Subject, combineLatest, firstValueFrom } from 'rxjs';
 import { map, distinctUntilChanged, filter, take } from 'rxjs/operators';
-import { createOrganizationAuditLog, POLICY_STRINGS, TokenCache, SignOutNotifier, resolveFrontendApi, withDevBrowser, catalogLocale, configureReferralCapture, FapiClient, SignOutGuard, localizedErrorMessage, reauthenticate, getTemplateToken, getProviderToken, signOutReasonFromClient, readRedirectResult, completeOAuthPopupLanding, mapOAuthPopupPayload, stripRedirectParams, closeOAuthPopupAfterSignIn, SDK_HEADER, sdkHeaderValue, reportSdkAdvisory, readExpiry, msUntilRefresh, policyTranslator, injectPolicyStyles, mountPolicyClickwrap, mountPolicyConsent, controllerForPending, mountPolicyAcceptStep, joinTitles, formatPolicyDate, PolicyGateController, groupSetupKey, enrollmentSubmitKey, nextStep, awaitingSignUpLink, canDownloadRecoveryCodes, copyRecoveryCodes, downloadRecoveryCodes, createCaptchaController, atlasCaptchaLabels, PolicyAcceptanceController, flowFromPending, initialFlow, createMfaEnrollment, createPasskeySignInController, startSignInWithAtlas, mfaChoicesFrom, fetchInstanceSettings, fetchLastSignInMethod, offeredFirstFactors, preparePasswordHoldProof, prepareFactor, signInCaptchaOptions, flowNeedsCaptcha, planFirstFactor, attemptPasswordHoldProof, advanceWithCaptcha, loadPolicies, createSignUp, prepareSecondFactorCode, resendSignUpVerification, createPasskeySignUp, finishPasskeySignUp, pendingRecoveryCodes, acknowledgeRecoveryCodes, pendingExistingAccountNotice, acknowledgeExistingAccount, shouldKeepPolling, pollAttempt, lastUsedMethodLabel, signUp, passkeysSupported, confirmPolicies, existingAccountResetUrl, signUpProvedByLink, signInAfterProofUrl, awaitingPasskey, listCibaRequests, getCibaPin, decideCibaRequest, setCibaPin, clearCibaPin, OrganizationProfileController, describeAuditAction, actorFromClaims } from '@atlasauth/js';
+import { createOrganizationAuditLog, POLICY_STRINGS, TokenCache, SignOutNotifier, resolveFrontendApi, withDevBrowser, catalogLocale, configureReferralCapture, FapiClient, SignOutGuard, localizedErrorMessage, reauthenticate, getTemplateToken, getProviderToken, signOutReasonFromClient, readRedirectResult, completeOAuthPopupLanding, mapOAuthPopupPayload, stripRedirectParams, closeOAuthPopupAfterSignIn, SDK_HEADER, sdkHeaderValue, reportSdkAdvisory, readExpiry, msUntilRefresh, policyTranslator, injectPolicyStyles, mountPolicyClickwrap, mountPolicyConsent, controllerForPending, mountPolicyAcceptStep, joinTitles, formatPolicyDate, PolicyGateController, enrollmentOptionKey, groupSetupKey, enrollmentSubmitKey, nextStep, awaitingSignUpLink, createEmailLinkConfirmation, canDownloadRecoveryCodes, copyRecoveryCodes, downloadRecoveryCodes, createCaptchaController, atlasCaptchaLabels, PolicyAcceptanceController, flowFromPending, initialFlow, createMfaEnrollment, createPasskeySignInController, startSignInWithAtlas, mfaChoicesFrom, fetchInstanceSettings, fetchLastSignInMethod, offeredFirstFactors, preparePasswordHoldProof, prepareFactor, signInCaptchaOptions, flowNeedsCaptcha, planFirstFactor, attemptPasswordHoldProof, advanceWithCaptcha, loadPolicies, createSignUp, prepareSecondFactorCode, resendSignUpVerification, createPasskeySignUp, finishPasskeySignUp, pendingRecoveryCodes, acknowledgeRecoveryCodes, pendingExistingAccountNotice, acknowledgeExistingAccount, shouldKeepPolling, pollAttempt, emailLinkFromUrl, lastUsedMethodLabel, signUp, passkeysSupported, confirmPolicies, existingAccountResetUrl, signUpProvedByLink, signInAfterProofUrl, awaitingPasskey, listCibaRequests, getCibaPin, decideCibaRequest, setCibaPin, clearCibaPin, OrganizationProfileController, describeAuditAction, actorFromClaims } from '@atlasauth/js';
 export { FapiClient, SIGN_OUT_EVENT, SignOutError, advance, flowFromPending, getProviderToken, initialFlow, onAtlasSignOut, pollAttempt, prepareFactor, requestForStep, shouldKeepPolling } from '@atlasauth/js';
 import { evaluate } from '@atlasauth/authz';
 export { evaluate, hasFromClaims } from '@atlasauth/authz';
@@ -266,6 +266,23 @@ const EN_US = {
     'mfa.enrollChoose': 'Set up a second step for signing in.',
     'mfa.enrollTotpOption': 'Use an authenticator app',
     'mfa.enrollSmsOption': 'Use text messages',
+    'link.title': "Confirm it's you",
+    'link.matchCodeHint': 'Opening the link on another device? Enter this code there.',
+    'link.checking': 'Checking your link…',
+    'link.enterCodeHelp': 'Enter the code shown on the device where you started.',
+    'link.codeLabel': 'Code',
+    'link.confirm': 'Confirm',
+    'link.confirmed': 'Confirmed. You can close this tab and go back to where you started.',
+    'link.invalid': 'This link is no longer valid. Go back to where you started and ask for a new one.',
+    'mfa.enrollHotpOption': 'Use a counter-based code generator',
+    'mfa.enrollYubikeyOption': 'Use a YubiKey',
+    'mfa.enrollDuoOption': 'Use Duo',
+    'mfa.enrollPasskeyOption': 'Use a passkey',
+    'mfa.yubikeyLabel': 'Touch your YubiKey',
+    'mfa.enrollDuoHelp': 'Open Duo and approve the request, then come back and continue.',
+    'mfa.enrollDuoOpen': 'Open Duo',
+    'mfa.enrollPasskeyHelp': 'Create a passkey on this device to use as your second step. It must ask for your PIN or biometrics.',
+    'mfa.enrollPasskeyCreate': 'Create passkey',
     'mfa.enrollScan': 'Scan this QR code with your authenticator app, or enter the setup key.',
     'mfa.enrollQrAlt': 'QR code for your authenticator app',
     'mfa.enrollSetupKey': 'Setup key',
@@ -364,6 +381,7 @@ const EN_US = {
     'error.form_password_reused': 'Your new password must not match any of your last {history_count} passwords.',
     'error.password_expired': 'Your password has expired. Reset it to continue.',
     'error.email_not_verified': 'Your email address is not verified yet. Verify it before signing in with your password.',
+    'error.mfa_setup_unavailable': "This account needs 2-Step Verification, but it can't be set up here. Contact the app's support to continue.",
     'error.sign_in_token_invalid': 'That sign-in token is invalid or has expired.',
     'error.too_many_attempts': 'Too many failed attempts. Try again later.',
     'error.too_many_requests': 'Too many requests. Please try again later.',
@@ -403,7 +421,7 @@ function withFallback(locale) {
 }
 
 /** This package's version, sent as `X-Atlas-SDK` (kept in step with package.json by a test). */
-const ATLAS_ANGULAR_VERSION = '0.15.1';
+const ATLAS_ANGULAR_VERSION = '0.16.1';
 const ATLAS_ANGULAR_SDK = { name: '@atlasauth/angular', version: ATLAS_ANGULAR_VERSION };
 
 /**
@@ -1481,6 +1499,8 @@ class AttemptFlowComponent {
     /** `FlowState.sessionKept`: whether this browser kept the session the sign-in created. */
     sessionKept = undefined;
     titleKey = 'signIn.title';
+    /** Sign-up only: the sign-in link beside the code step's "an account already uses this email". */
+    signInHref = null;
     /**
      * The sign-in captcha, drawn above the submit button on the identifier step
      * (an always-on sign-in captcha) and on the challenge step the server demands
@@ -1536,6 +1556,8 @@ class AttemptFlowComponent {
      * while the flow polls, and offers a resend (`resend`).
      */
     emailVerification = 'code';
+    /** `FlowState.matchCode`: shown while a mailed link waits, to type if it's opened on another device. */
+    matchCode = null;
     resend = new EventEmitter();
     /** The user declined a policy the sign-in was waiting on (`needs_policy_acceptance`): cancel the attempt. */
     policyDeclined = new EventEmitter();
@@ -1583,6 +1605,12 @@ class AttemptFlowComponent {
     resendEnrollment() {
         void this.enrollment?.resend();
     }
+    optionKey(method) {
+        return enrollmentOptionKey(method);
+    }
+    showMatchCode() {
+        return !!this.matchCode && (this.step().kind === 'collect_email_code' || this.linkSentText() !== null);
+    }
     otherMethods(state) {
         return state.options.filter((m) => m !== state.method);
     }
@@ -1604,6 +1632,9 @@ class AttemptFlowComponent {
     formErrors() {
         return this.errors.filter((error) => !error.param);
     }
+    signInLink(error) {
+        return this.step().kind === 'collect_email_code' && error.code === 'IDENTIFIER_EXISTS' ? this.signInHref : null;
+    }
     fieldErrorsFor(name) {
         return this.errors.filter((error) => error.param === name);
     }
@@ -1730,12 +1761,17 @@ class AttemptFlowComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AttemptFlowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AttemptFlowComponent, isStandalone: true, selector: "atlas-attempt-flow", inputs: { attempt: "attempt", busy: "busy", errors: "errors", sessionKept: "sessionKept", titleKey: "titleKey", captcha: "captcha", firstFactors: "firstFactors", preparedFactor: "preparedFactor", passwordHold: "passwordHold", holdProof: "holdProof", offerEmailSecondFactor: "offerEmailSecondFactor", emailedSecondFactor: "emailedSecondFactor", offerSmsSecondFactor: "offerSmsSecondFactor", textedSecondFactor: "textedSecondFactor", enrollment: "enrollment", enrollmentState: "enrollmentState", emailVerification: "emailVerification" }, outputs: { submitFlow: "submitFlow", chooseFactor: "chooseFactor", usePassword: "usePassword", emailSecondFactor: "emailSecondFactor", smsSecondFactor: "smsSecondFactor", resend: "resend", policyDeclined: "policyDeclined" }, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AttemptFlowComponent, isStandalone: true, selector: "atlas-attempt-flow", inputs: { attempt: "attempt", busy: "busy", errors: "errors", sessionKept: "sessionKept", titleKey: "titleKey", signInHref: "signInHref", captcha: "captcha", firstFactors: "firstFactors", preparedFactor: "preparedFactor", passwordHold: "passwordHold", holdProof: "holdProof", offerEmailSecondFactor: "offerEmailSecondFactor", emailedSecondFactor: "emailedSecondFactor", offerSmsSecondFactor: "offerSmsSecondFactor", textedSecondFactor: "textedSecondFactor", enrollment: "enrollment", enrollmentState: "enrollmentState", emailVerification: "emailVerification", matchCode: "matchCode" }, outputs: { submitFlow: "submitFlow", chooseFactor: "chooseFactor", usePassword: "usePassword", emailSecondFactor: "emailSecondFactor", smsSecondFactor: "smsSecondFactor", resend: "resend", policyDeclined: "policyDeclined" }, ngImport: i0, template: `
     <div [class]="cls('card', 'atlas-card')">
       <h1 [class]="cls('headerTitle', 'atlas-title')">{{ t(titleKey) }}</h1>
 
       @for (error of formErrors(); track error.code) {
-        <p [class]="cls('formFieldError', 'atlas-error')" role="alert">{{ errorText(error) }}</p>
+        <p [class]="cls('formFieldError', 'atlas-error')" role="alert">
+          {{ errorText(error) }}
+          @if (signInLink(error); as href) {
+            <a class="atlas-link" [href]="href">{{ t('signIn.title') }}</a>
+          }
+        </p>
       }
 
       <form (submit)="onSubmit($event)">
@@ -1760,6 +1796,9 @@ class AttemptFlowComponent {
             {{ t('signIn.resendLink') }}
           </button>
         }
+        @if (showMatchCode()) {
+          <p class="atlas-text" data-atlas="link-match-code">{{ t('link.matchCodeHint') }} <strong><code>{{ matchCode }}</code></strong></p>
+        }
         @if (enrolling() && enrollmentState; as enrol) {
           @if (enrol.method === null) {
             <p class="atlas-text">{{ t('mfa.enrollChoose') }}</p>
@@ -1771,10 +1810,31 @@ class AttemptFlowComponent {
                 [disabled]="busy || enrol.busy"
                 (click)="chooseMethod(m)"
               >
-                {{ t(m === 'totp' ? 'mfa.enrollTotpOption' : 'mfa.enrollSmsOption') }}
+                {{ t(optionKey(m)) }}
               </button>
             }
-          } @else if (enrol.method === 'totp') {
+          } @else if (enrol.method === 'yubikey') {
+            <label class="atlas-field">
+              <span>{{ t('mfa.yubikeyLabel') }}</span>
+              <input [class]="cls('formFieldInput', 'atlas-input')" type="text" name="otp" autocomplete="off" [value]="values['otp'] ?? ''" (input)="setValue('otp', $any($event.target).value)" />
+              @for (error of fieldErrorsFor('otp'); track error.code) {
+                <span [class]="cls('formFieldError', 'atlas-error')">{{ errorText(error) }}</span>
+              }
+            </label>
+          } @else if (enrol.method === 'duo' || enrol.method === 'passkey') {
+            @if (enrol.enrollment; as setup) {
+              @if (enrol.method === 'passkey') {
+                <p class="atlas-text">{{ t('mfa.enrollPasskeyHelp') }}</p>
+              } @else {
+                <p class="atlas-text">{{ t('mfa.enrollDuoHelp') }}</p>
+                @if (setup.authorizationUrl) {
+                  <a class="atlas-link" data-atlas="mfa-duo-open" [href]="setup.authorizationUrl" target="_blank" rel="noopener noreferrer">{{ t('mfa.enrollDuoOpen') }}</a>
+                }
+              }
+            } @else {
+              <p class="atlas-text" aria-live="polite">{{ enrol.busy ? t('mfa.enrollPreparing') : '' }}</p>
+            }
+          } @else if (enrol.method === 'totp' || enrol.method === 'hotp') {
             @if (enrol.enrollment; as setup) {
               <p class="atlas-text">{{ t('mfa.enrollScan') }}</p>
               @if (setup.qrCode) {
@@ -1787,7 +1847,7 @@ class AttemptFlowComponent {
                 <span>{{ t('mfa.enrollFirstCodeLabel') }}</span>
                 <input [class]="cls('formFieldInput', 'atlas-input')" type="text" name="code" autocomplete="one-time-code" inputmode="numeric" [value]="values['code'] ?? ''" (input)="setValue('code', $any($event.target).value)" />
               </label>
-              @if (enrol.totpCodes >= 2) {
+              @if (enrol.method === 'totp' && enrol.totpCodes >= 2) {
                 <label class="atlas-field">
                   <span>{{ t('mfa.enrollSecondCodeLabel') }}</span>
                   <input [class]="cls('formFieldInput', 'atlas-input')" type="text" name="secondCode" autocomplete="one-time-code" inputmode="numeric" [value]="values['secondCode'] ?? ''" (input)="setValue('secondCode', $any($event.target).value)" />
@@ -1832,7 +1892,7 @@ class AttemptFlowComponent {
                 [disabled]="busy || enrol.busy"
                 (click)="chooseMethod(other)"
               >
-                {{ t(other === 'totp' ? 'mfa.enrollTotpOption' : 'mfa.enrollSmsOption') }}
+                {{ t(optionKey(other)) }}
               </button>
             }
           }
@@ -1977,7 +2037,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
       <h1 [class]="cls('headerTitle', 'atlas-title')">{{ t(titleKey) }}</h1>
 
       @for (error of formErrors(); track error.code) {
-        <p [class]="cls('formFieldError', 'atlas-error')" role="alert">{{ errorText(error) }}</p>
+        <p [class]="cls('formFieldError', 'atlas-error')" role="alert">
+          {{ errorText(error) }}
+          @if (signInLink(error); as href) {
+            <a class="atlas-link" [href]="href">{{ t('signIn.title') }}</a>
+          }
+        </p>
       }
 
       <form (submit)="onSubmit($event)">
@@ -2002,6 +2067,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
             {{ t('signIn.resendLink') }}
           </button>
         }
+        @if (showMatchCode()) {
+          <p class="atlas-text" data-atlas="link-match-code">{{ t('link.matchCodeHint') }} <strong><code>{{ matchCode }}</code></strong></p>
+        }
         @if (enrolling() && enrollmentState; as enrol) {
           @if (enrol.method === null) {
             <p class="atlas-text">{{ t('mfa.enrollChoose') }}</p>
@@ -2013,10 +2081,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                 [disabled]="busy || enrol.busy"
                 (click)="chooseMethod(m)"
               >
-                {{ t(m === 'totp' ? 'mfa.enrollTotpOption' : 'mfa.enrollSmsOption') }}
+                {{ t(optionKey(m)) }}
               </button>
             }
-          } @else if (enrol.method === 'totp') {
+          } @else if (enrol.method === 'yubikey') {
+            <label class="atlas-field">
+              <span>{{ t('mfa.yubikeyLabel') }}</span>
+              <input [class]="cls('formFieldInput', 'atlas-input')" type="text" name="otp" autocomplete="off" [value]="values['otp'] ?? ''" (input)="setValue('otp', $any($event.target).value)" />
+              @for (error of fieldErrorsFor('otp'); track error.code) {
+                <span [class]="cls('formFieldError', 'atlas-error')">{{ errorText(error) }}</span>
+              }
+            </label>
+          } @else if (enrol.method === 'duo' || enrol.method === 'passkey') {
+            @if (enrol.enrollment; as setup) {
+              @if (enrol.method === 'passkey') {
+                <p class="atlas-text">{{ t('mfa.enrollPasskeyHelp') }}</p>
+              } @else {
+                <p class="atlas-text">{{ t('mfa.enrollDuoHelp') }}</p>
+                @if (setup.authorizationUrl) {
+                  <a class="atlas-link" data-atlas="mfa-duo-open" [href]="setup.authorizationUrl" target="_blank" rel="noopener noreferrer">{{ t('mfa.enrollDuoOpen') }}</a>
+                }
+              }
+            } @else {
+              <p class="atlas-text" aria-live="polite">{{ enrol.busy ? t('mfa.enrollPreparing') : '' }}</p>
+            }
+          } @else if (enrol.method === 'totp' || enrol.method === 'hotp') {
             @if (enrol.enrollment; as setup) {
               <p class="atlas-text">{{ t('mfa.enrollScan') }}</p>
               @if (setup.qrCode) {
@@ -2029,7 +2118,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                 <span>{{ t('mfa.enrollFirstCodeLabel') }}</span>
                 <input [class]="cls('formFieldInput', 'atlas-input')" type="text" name="code" autocomplete="one-time-code" inputmode="numeric" [value]="values['code'] ?? ''" (input)="setValue('code', $any($event.target).value)" />
               </label>
-              @if (enrol.totpCodes >= 2) {
+              @if (enrol.method === 'totp' && enrol.totpCodes >= 2) {
                 <label class="atlas-field">
                   <span>{{ t('mfa.enrollSecondCodeLabel') }}</span>
                   <input [class]="cls('formFieldInput', 'atlas-input')" type="text" name="secondCode" autocomplete="one-time-code" inputmode="numeric" [value]="values['secondCode'] ?? ''" (input)="setValue('secondCode', $any($event.target).value)" />
@@ -2074,7 +2163,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                 [disabled]="busy || enrol.busy"
                 (click)="chooseMethod(other)"
               >
-                {{ t(other === 'totp' ? 'mfa.enrollTotpOption' : 'mfa.enrollSmsOption') }}
+                {{ t(optionKey(other)) }}
               </button>
             }
           }
@@ -2217,6 +2306,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                 type: Input
             }], titleKey: [{
                 type: Input
+            }], signInHref: [{
+                type: Input
             }], captcha: [{
                 type: Input
             }], firstFactors: [{
@@ -2251,6 +2342,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                 type: Input
             }], emailVerification: [{
                 type: Input
+            }], matchCode: [{
+                type: Input
             }], resend: [{
                 type: Output
             }], policyDeclined: [{
@@ -2264,6 +2357,103 @@ function released() {
     return { kind: 'released', name: '', labelKey: 'signIn.passwordHoldReleased', type: 'text' };
 }
 
+/**
+ * What `<atlas-sign-in>` / `<atlas-sign-up>` draw when opened from a mailed link:
+ * tries this browser's stored secret, then asks for the code the starting tab
+ * shows. A success signs nobody in here: the starting tab continues on its own.
+ */
+class EmailLinkComponent {
+    atlas = inject(AtlasService);
+    link;
+    state = signal({ status: 'checking', busy: false, errors: [] });
+    code = '';
+    controller = null;
+    stop = null;
+    ngOnInit() {
+        this.controller = createEmailLinkConfirmation(this.atlas.createFapiClient(), this.link);
+        this.stop = this.controller.subscribe((next) => this.state.set(next));
+        void this.controller.start();
+    }
+    ngOnDestroy() {
+        this.stop?.();
+    }
+    onSubmit(event) {
+        event.preventDefault();
+        void this.controller?.submitCode(this.code);
+    }
+    message() {
+        const status = this.state().status;
+        return status === 'confirmed' ? 'link.confirmed' : status === 'invalid' ? 'link.invalid' : 'link.checking';
+    }
+    t(key) {
+        return translate(this.atlas.localization, key);
+    }
+    cls(key, base) {
+        return classFor(key, this.atlas.appearance, base);
+    }
+    errorText(error) {
+        return localizedErrorMessage(error, this.atlas.localization);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EmailLinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: EmailLinkComponent, isStandalone: true, selector: "atlas-email-link", inputs: { link: "link" }, ngImport: i0, template: `
+    <div [class]="cls('card', 'atlas-card')" data-atlas="email-link" [attr.data-atlas-status]="state().status">
+      <h1 [class]="cls('headerTitle', 'atlas-title')">{{ t('link.title') }}</h1>
+      @if (state().status === 'needs_code') {
+        <form (submit)="onSubmit($event)">
+          <p class="atlas-text">{{ t('link.enterCodeHelp') }}</p>
+          <label class="atlas-field">
+            <span>{{ t('link.codeLabel') }}</span>
+            <input [class]="cls('formFieldInput', 'atlas-input')" type="text" name="match_code" autocomplete="off" inputmode="numeric" required [value]="code" (input)="code = $any($event.target).value" />
+          </label>
+          @for (error of state().errors; track error.code) {
+            <p [class]="cls('formFieldError', 'atlas-error')" role="alert">{{ errorText(error) }}</p>
+          }
+          <button [class]="cls('formButtonPrimary', 'atlas-button')" type="submit" [disabled]="state().busy">{{ t('link.confirm') }}</button>
+        </form>
+      } @else {
+        <p class="atlas-text" role="status" aria-live="polite">{{ t(message()) }}</p>
+      }
+      @if (state().resetUrl; as resetUrl) {
+        <p class="atlas-text"><a class="atlas-link" data-atlas-reset-link="" [href]="resetUrl">{{ t('signIn.forgotPassword') }}</a></p>
+      }
+    </div>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EmailLinkComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'atlas-email-link',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: `
+    <div [class]="cls('card', 'atlas-card')" data-atlas="email-link" [attr.data-atlas-status]="state().status">
+      <h1 [class]="cls('headerTitle', 'atlas-title')">{{ t('link.title') }}</h1>
+      @if (state().status === 'needs_code') {
+        <form (submit)="onSubmit($event)">
+          <p class="atlas-text">{{ t('link.enterCodeHelp') }}</p>
+          <label class="atlas-field">
+            <span>{{ t('link.codeLabel') }}</span>
+            <input [class]="cls('formFieldInput', 'atlas-input')" type="text" name="match_code" autocomplete="off" inputmode="numeric" required [value]="code" (input)="code = $any($event.target).value" />
+          </label>
+          @for (error of state().errors; track error.code) {
+            <p [class]="cls('formFieldError', 'atlas-error')" role="alert">{{ errorText(error) }}</p>
+          }
+          <button [class]="cls('formButtonPrimary', 'atlas-button')" type="submit" [disabled]="state().busy">{{ t('link.confirm') }}</button>
+        </form>
+      } @else {
+        <p class="atlas-text" role="status" aria-live="polite">{{ t(message()) }}</p>
+      }
+      @if (state().resetUrl; as resetUrl) {
+        <p class="atlas-text"><a class="atlas-link" data-atlas-reset-link="" [href]="resetUrl">{{ t('signIn.forgotPassword') }}</a></p>
+      }
+    </div>
+  `,
+                }]
+        }], propDecorators: { link: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
+
 /**
  * The recovery codes a mid-sign-in MFA enrolment came with, shown once before
  * the sign-in finishes: copy them, download them as a .txt file, then
@@ -2801,8 +2991,11 @@ class AtlasFlowController {
             return;
         this.pollTimer = setInterval(() => {
             void (async () => {
-                const { state: next, ticket } = await pollAttempt(this.client, this.state());
-                this.setState(next);
+                const polled = this.state();
+                const { state: next, ticket } = await pollAttempt(this.client, polled);
+                // A resend rotated the secret meanwhile: this answer is stale.
+                if (this.state().pollSecret === polled.pollSecret)
+                    this.setState(next);
                 // e.g. a passkey sign-up whose email was just proven: only this tab can go on.
                 if (!ticket && !shouldKeepPolling(next))
                     this.stopPolling();
@@ -2847,6 +3040,11 @@ class AtlasFlowController {
  */
 class SignInComponent {
     atlas = inject(AtlasService);
+    /** Opened from a mailed link: that page, not the flow. Read after the first render, so hydration matches. */
+    emailLink = signal(null);
+    constructor() {
+        afterNextRender(() => this.emailLink.set(emailLinkFromUrl(undefined, 'sign_in')));
+    }
     /** Where to send the user once the flow completes. Reserved for host routing. */
     afterUrl;
     /**
@@ -2912,6 +3110,9 @@ class SignInComponent {
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SignInComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: SignInComponent, isStandalone: true, selector: "atlas-sign-in", inputs: { afterUrl: "afterUrl", signUpUrl: "signUpUrl" }, ngImport: i0, template: `
+    @if (emailLink(); as link) {
+      <atlas-email-link [link]="link"></atlas-email-link>
+    } @else {
     @if (lastUsedLabel(); as label) {
       <p class="atlas-text atlas-last-used-hint" data-atlas="last-used" [attr.data-atlas-method]="flow.lastMethod()">
         {{ t('signIn.lastUsed') }}: {{ label }}
@@ -2937,6 +3138,7 @@ class SignInComponent {
       [captcha]="flow.captchaDrawn() ? flow.captcha : null"
       [firstFactors]="flow.firstFactors()"
       [preparedFactor]="flow.preparedFactor()"
+      [matchCode]="flow.state().matchCode ?? null"
       [passwordHold]="flow.state().passwordHold ?? null"
       [holdProof]="flow.holdProof()"
       (usePassword)="flow.usePassword()"
@@ -2969,7 +3171,8 @@ class SignInComponent {
         {{ t('signIn.noAccount') }} <a class="atlas-link" [href]="href">{{ t('signIn.signUpLink') }}</a>
       </p>
     }
-  `, isInline: true, dependencies: [{ kind: "component", type: AttemptFlowComponent, selector: "atlas-attempt-flow", inputs: ["attempt", "busy", "errors", "sessionKept", "titleKey", "captcha", "firstFactors", "preparedFactor", "passwordHold", "holdProof", "offerEmailSecondFactor", "emailedSecondFactor", "offerSmsSecondFactor", "textedSecondFactor", "enrollment", "enrollmentState", "emailVerification"], outputs: ["submitFlow", "chooseFactor", "usePassword", "emailSecondFactor", "smsSecondFactor", "resend", "policyDeclined"] }, { kind: "component", type: RecoveryCodesComponent, selector: "atlas-recovery-codes", inputs: ["codes", "busy"], outputs: ["saved"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    }
+  `, isInline: true, dependencies: [{ kind: "component", type: EmailLinkComponent, selector: "atlas-email-link", inputs: ["link"] }, { kind: "component", type: AttemptFlowComponent, selector: "atlas-attempt-flow", inputs: ["attempt", "busy", "errors", "sessionKept", "titleKey", "signInHref", "captcha", "firstFactors", "preparedFactor", "passwordHold", "holdProof", "offerEmailSecondFactor", "emailedSecondFactor", "offerSmsSecondFactor", "textedSecondFactor", "enrollment", "enrollmentState", "emailVerification", "matchCode"], outputs: ["submitFlow", "chooseFactor", "usePassword", "emailSecondFactor", "smsSecondFactor", "resend", "policyDeclined"] }, { kind: "component", type: RecoveryCodesComponent, selector: "atlas-recovery-codes", inputs: ["codes", "busy"], outputs: ["saved"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SignInComponent, decorators: [{
             type: Component,
@@ -2977,8 +3180,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                     selector: 'atlas-sign-in',
                     standalone: true,
                     changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [AttemptFlowComponent, RecoveryCodesComponent],
+                    imports: [EmailLinkComponent, AttemptFlowComponent, RecoveryCodesComponent],
                     template: `
+    @if (emailLink(); as link) {
+      <atlas-email-link [link]="link"></atlas-email-link>
+    } @else {
     @if (lastUsedLabel(); as label) {
       <p class="atlas-text atlas-last-used-hint" data-atlas="last-used" [attr.data-atlas-method]="flow.lastMethod()">
         {{ t('signIn.lastUsed') }}: {{ label }}
@@ -3004,6 +3210,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
       [captcha]="flow.captchaDrawn() ? flow.captcha : null"
       [firstFactors]="flow.firstFactors()"
       [preparedFactor]="flow.preparedFactor()"
+      [matchCode]="flow.state().matchCode ?? null"
       [passwordHold]="flow.state().passwordHold ?? null"
       [holdProof]="flow.holdProof()"
       (usePassword)="flow.usePassword()"
@@ -3036,9 +3243,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
         {{ t('signIn.noAccount') }} <a class="atlas-link" [href]="href">{{ t('signIn.signUpLink') }}</a>
       </p>
     }
+    }
   `,
                 }]
-        }], propDecorators: { afterUrl: [{
+        }], ctorParameters: () => [], propDecorators: { afterUrl: [{
                 type: Input
             }], signUpUrl: [{
                 type: Input
@@ -3615,6 +3823,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
  */
 class SignUpComponent {
     atlas = inject(AtlasService);
+    /** Opened from a mailed link: that page, not the flow. Read after the first render, so hydration matches. */
+    emailLink = signal(null);
+    constructor() {
+        afterNextRender(() => this.emailLink.set(emailLinkFromUrl(undefined, 'sign_up')));
+    }
     /** Where to send the user once the flow completes. Reserved for host routing. */
     afterUrl;
     /** Where the existing-account notice's "Forgot password?" goes. Default: the hosted sign-in page; `null` hides it. */
@@ -3670,6 +3883,9 @@ class SignUpComponent {
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SignUpComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: SignUpComponent, isStandalone: true, selector: "atlas-sign-up", inputs: { afterUrl: "afterUrl", resetPasswordUrl: "resetPasswordUrl", signInUrl: "signInUrl" }, ngImport: i0, template: `
+    @if (emailLink(); as link) {
+      <atlas-email-link [link]="link"></atlas-email-link>
+    } @else {
     @if (flow.recoveryCodes(); as codes) {
       <atlas-recovery-codes [codes]="codes" [busy]="flow.state().busy" (saved)="flow.saveRecoveryCodes()"></atlas-recovery-codes>
     } @else if (flow.existingAccountNotice()) {
@@ -3722,6 +3938,7 @@ class SignUpComponent {
         [emailVerification]="flow.settings()?.account?.emailVerification ?? 'code'"
         (submitFlow)="flow.submit($event)"
         (resend)="flow.resendSignUp()"
+        [matchCode]="flow.state().matchCode ?? null"
         [offerEmailSecondFactor]="flow.settings()?.account?.emailSecondFactor === true"
         [emailedSecondFactor]="flow.emailSecondFactor()"
         [offerSmsSecondFactor]="flow.settings() !== null && flow.mfaChoices().sms"
@@ -3731,6 +3948,7 @@ class SignUpComponent {
         (emailSecondFactor)="flow.sendEmailSecondFactor()"
         (smsSecondFactor)="flow.sendSmsSecondFactor()"
         (policyDeclined)="flow.declinePolicy($event)"
+        [signInHref]="signInHref()"
       ></atlas-attempt-flow>
     } @else {
       <atlas-sign-up-form
@@ -3747,7 +3965,8 @@ class SignUpComponent {
         "
       ></atlas-sign-up-form>
     }
-  `, isInline: true, dependencies: [{ kind: "component", type: AttemptFlowComponent, selector: "atlas-attempt-flow", inputs: ["attempt", "busy", "errors", "sessionKept", "titleKey", "captcha", "firstFactors", "preparedFactor", "passwordHold", "holdProof", "offerEmailSecondFactor", "emailedSecondFactor", "offerSmsSecondFactor", "textedSecondFactor", "enrollment", "enrollmentState", "emailVerification"], outputs: ["submitFlow", "chooseFactor", "usePassword", "emailSecondFactor", "smsSecondFactor", "resend", "policyDeclined"] }, { kind: "component", type: RecoveryCodesComponent, selector: "atlas-recovery-codes", inputs: ["codes", "busy"], outputs: ["saved"] }, { kind: "component", type: SignUpFormComponent, selector: "atlas-sign-up-form", inputs: ["settings", "busy", "errors", "captcha", "passkey", "switchable", "policies"], outputs: ["switchMode", "submitSignUp"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    }
+  `, isInline: true, dependencies: [{ kind: "component", type: EmailLinkComponent, selector: "atlas-email-link", inputs: ["link"] }, { kind: "component", type: AttemptFlowComponent, selector: "atlas-attempt-flow", inputs: ["attempt", "busy", "errors", "sessionKept", "titleKey", "signInHref", "captcha", "firstFactors", "preparedFactor", "passwordHold", "holdProof", "offerEmailSecondFactor", "emailedSecondFactor", "offerSmsSecondFactor", "textedSecondFactor", "enrollment", "enrollmentState", "emailVerification", "matchCode"], outputs: ["submitFlow", "chooseFactor", "usePassword", "emailSecondFactor", "smsSecondFactor", "resend", "policyDeclined"] }, { kind: "component", type: RecoveryCodesComponent, selector: "atlas-recovery-codes", inputs: ["codes", "busy"], outputs: ["saved"] }, { kind: "component", type: SignUpFormComponent, selector: "atlas-sign-up-form", inputs: ["settings", "busy", "errors", "captcha", "passkey", "switchable", "policies"], outputs: ["switchMode", "submitSignUp"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SignUpComponent, decorators: [{
             type: Component,
@@ -3755,8 +3974,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                     selector: 'atlas-sign-up',
                     standalone: true,
                     changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [AttemptFlowComponent, RecoveryCodesComponent, SignUpFormComponent],
+                    imports: [EmailLinkComponent, AttemptFlowComponent, RecoveryCodesComponent, SignUpFormComponent],
                     template: `
+    @if (emailLink(); as link) {
+      <atlas-email-link [link]="link"></atlas-email-link>
+    } @else {
     @if (flow.recoveryCodes(); as codes) {
       <atlas-recovery-codes [codes]="codes" [busy]="flow.state().busy" (saved)="flow.saveRecoveryCodes()"></atlas-recovery-codes>
     } @else if (flow.existingAccountNotice()) {
@@ -3809,6 +4031,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
         [emailVerification]="flow.settings()?.account?.emailVerification ?? 'code'"
         (submitFlow)="flow.submit($event)"
         (resend)="flow.resendSignUp()"
+        [matchCode]="flow.state().matchCode ?? null"
         [offerEmailSecondFactor]="flow.settings()?.account?.emailSecondFactor === true"
         [emailedSecondFactor]="flow.emailSecondFactor()"
         [offerSmsSecondFactor]="flow.settings() !== null && flow.mfaChoices().sms"
@@ -3818,6 +4041,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
         (emailSecondFactor)="flow.sendEmailSecondFactor()"
         (smsSecondFactor)="flow.sendSmsSecondFactor()"
         (policyDeclined)="flow.declinePolicy($event)"
+        [signInHref]="signInHref()"
       ></atlas-attempt-flow>
     } @else {
       <atlas-sign-up-form
@@ -3834,9 +4058,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
         "
       ></atlas-sign-up-form>
     }
+    }
   `,
                 }]
-        }], propDecorators: { afterUrl: [{
+        }], ctorParameters: () => [], propDecorators: { afterUrl: [{
                 type: Input
             }], resetPasswordUrl: [{
                 type: Input
@@ -5298,5 +5523,5 @@ function atlasChildGuard(options = {}) {
  * Generated bundle index. Do not edit.
  */
 
-export { ATLAS_ANGULAR_SDK, ATLAS_ANGULAR_VERSION, ATLAS_OPTIONS, ATLAS_UI, AtlasCaptchaSlotDirective, AtlasFlowController, AtlasLoadedDirective, AtlasLoadingDirective, AtlasModule, AtlasOrganizationAuditLog, AtlasPoliciesDirective, AtlasProtectDirective, AtlasRootDirective, AtlasService, AtlasSignedInDirective, AtlasSignedOutDirective, AttemptFlowComponent, DEFAULT_TOKENS, EN_US, ImpersonationBannerComponent, ManageCibaComponent, OrganizationAuditLogComponent, OrganizationProfileComponent, OrganizationSwitcherComponent, PolicyAcceptStepComponent, PolicyGateComponent, SignInComponent, SignUpComponent, SignUpFormComponent, THEMES, UserButtonComponent, UserProfileComponent, atlasChildGuard, atlasGuard, classFor, cssVariables, explicitTokens, provideAtlas, renderAppearance, resolveTokens, translate, withFallback };
+export { ATLAS_ANGULAR_SDK, ATLAS_ANGULAR_VERSION, ATLAS_OPTIONS, ATLAS_UI, AtlasCaptchaSlotDirective, AtlasFlowController, AtlasLoadedDirective, AtlasLoadingDirective, AtlasModule, AtlasOrganizationAuditLog, AtlasPoliciesDirective, AtlasProtectDirective, AtlasRootDirective, AtlasService, AtlasSignedInDirective, AtlasSignedOutDirective, AttemptFlowComponent, DEFAULT_TOKENS, EN_US, EmailLinkComponent, ImpersonationBannerComponent, ManageCibaComponent, OrganizationAuditLogComponent, OrganizationProfileComponent, OrganizationSwitcherComponent, PolicyAcceptStepComponent, PolicyGateComponent, SignInComponent, SignUpComponent, SignUpFormComponent, THEMES, UserButtonComponent, UserProfileComponent, atlasChildGuard, atlasGuard, classFor, cssVariables, explicitTokens, provideAtlas, renderAppearance, resolveTokens, translate, withFallback };
 //# sourceMappingURL=atlasauth-angular.mjs.map