{"version":3,"file":"auth_login_app-788b3a54.js","sources":["../../../app/javascript/vuecomponents/AuthLoginApp.vue","../../../app/javascript/pages/auth_login_app.ts"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { dir } from '@@/bits/current_dir'\nimport device from '@@/bits/device'\nimport { isEmail } from '@@/bits/email'\nimport window from '@@/bits/global'\nimport { __ } from '@@/bits/intl'\nimport { buildUrlFromPath, goBack, navigateTo, transformCurrentUrl, transformUrl } from '@@/bits/location'\nimport OzBackButton from '@@/library/v4/components/OzBackButton.vue'\nimport OzCheckBox from '@@/library/v4/components/OzCheckBox.vue'\nimport OzContainedButton, { OzContainedButtonColorScheme } from '@@/library/v4/components/OzContainedButton.vue'\nimport OzIcon from '@@/library/v4/components/OzIcon.vue'\nimport OzInput from '@@/library/v4/components/OzInput.vue'\nimport OzLabelInput from '@@/library/v4/components/OzLabelInput.vue'\nimport OzLoadingText from '@@/library/v4/components/OzLoadingText.vue'\nimport OzPadletLogo from '@@/library/v4/components/OzPadletLogo.vue'\nimport OzPlainButton, {\n  OzPlainButtonColorScheme,\n  OzPlainButtonSizePreset,\n} from '@@/library/v4/components/OzPlainButton.vue'\nimport OzTextLink from '@@/library/v4/components/OzTextLink.vue'\nimport { useAuthLoginStore } from '@@/pinia/auth_login_store'\nimport { useWindowSizeStore } from '@@/pinia/window_size'\nimport AuthActionMenu from '@@/vuecomponents/AuthActionMenu.vue'\nimport AuthBottomNav from '@@/vuecomponents/AuthBottomNav.vue'\nimport AuthLoginSAMLButton from '@@/vuecomponents/AuthLoginSAMLButton.vue'\nimport AuthLoginThirdPartyGroupButtons, {\n  AuthLoginThirdPartyGroupButtonsType,\n} from '@@/vuecomponents/AuthLoginThirdPartyGroupButtons.vue'\nimport GlobalSnackbar from '@@/vuecomponents/GlobalSnackbar.vue'\nimport SkipToContentLink from '@@/vuecomponents/SkipToContentLink.vue'\nimport { storeToRefs } from 'pinia'\nimport { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue'\n\nconst windowSizeStore = useWindowSizeStore()\nconst authLoginStore = useAuthLoginStore()\n\nconst { isSmallerThanTabletPortrait, visualViewportHeight } = storeToRefs(windowSizeStore)\nconst {\n  username,\n  password,\n  usernameValidationMessage,\n  passwordValidationMessage,\n  isAwaitingServerResponse,\n  thirdPartyAuthLoginMethods,\n  userThirdPartyAuthLoginMethods,\n  samlLoginMethods,\n  isUsernameVerified,\n  isUsernameValid,\n  isPasswordValid,\n  codeChallenge,\n  codeChallengeMethod,\n  pkceState,\n  originAppClientId,\n  originAppRedirectUri,\n  isPkceEnabled,\n  isPasswordLoginEnabled,\n  isSchoolLibraryLoginPage,\n} = storeToRefs(authLoginStore)\nconst {\n  setUsername,\n  setUsernameValidationMessage,\n  setPassword,\n  setPasswordValidationMessage,\n  setIsUsernameVerified,\n  continueWithEmailOrUsername,\n  loginWithPassword,\n  resetIsAwaitingServerResponse,\n} = authLoginStore\n\nconst usernameInputRef = ref<InstanceType<typeof OzInput>>()\nconst passwordInputRef = ref<InstanceType<typeof OzInput>>()\nconst xActionMenu = ref(false)\nconst isUsernameInputFocused = ref(false)\nconst isPasswordInputFocused = ref(false)\nconst isPasswordShown = ref(false)\nconst initialScrollY = ref(0)\nconst prefilledPasswordByBrowser = ref('')\n\n// Header elements are hidden when the input is focused on android phones.\nconst xHeader = computed((): boolean => {\n  return !(\n    device.mobile &&\n    device.android &&\n    isSmallerThanTabletPortrait.value &&\n    (isUsernameInputFocused.value || isPasswordInputFocused.value)\n  )\n})\n\nconst isContinueButtonDisabled = computed((): boolean => {\n  return !username.value.length || !!usernameValidationMessage.value.length\n})\n\nconst isLoginButtonDisabled = computed((): boolean => {\n  return !password.value.length || !!passwordValidationMessage.value.length\n})\n\nconst signUpPageUrl = computed((): string => {\n  const baseSignupUrl = buildUrlFromPath('/auth/signup')\n  if (isPkceEnabled.value) {\n    const signupUrlWithPkceParams = transformUrl(baseSignupUrl, {\n      searchParams: {\n        code_challenge: codeChallenge.value as string,\n        code_challenge_method: codeChallengeMethod.value as string,\n        redirect_uri: encodeURIComponent(originAppRedirectUri.value as string),\n        client_id: originAppClientId.value as string,\n        pkce_state: pkceState.value as string,\n      },\n    })\n    return signupUrlWithPkceParams\n  } else {\n    return baseSignupUrl\n  }\n})\n\nconst orgDomainVerificationPageUrl = computed((): string => {\n  const baseOrgDomainVerificationPageUrl = buildUrlFromPath('/auth/org_login_redirect')\n  if (isPkceEnabled.value) {\n    const orgDomainVerificationPageUrlWithPkceParams = transformUrl(baseOrgDomainVerificationPageUrl, {\n      searchParams: {\n        code_challenge: codeChallenge.value as string,\n        code_challenge_method: codeChallengeMethod.value as string,\n        redirect_uri: encodeURIComponent(originAppRedirectUri.value as string),\n        client_id: originAppClientId.value as string,\n        pkce_state: pkceState.value as string,\n      },\n    })\n    return orgDomainVerificationPageUrlWithPkceParams\n  } else {\n    return baseOrgDomainVerificationPageUrl\n  }\n})\n\nconst passwordScreenHeading = computed((): string => {\n  return isEmail(username.value) ? __('Log in with email') : __('Log in with username')\n})\n\nconst forgotPasswordUrl = computed<string>(() => {\n  if (isEmail(username.value)) {\n    return transformCurrentUrl({}, { path: '/auth/forgot', search: { email: username.value } })\n  }\n  return transformCurrentUrl({}, { path: '/auth/forgot' })\n})\n\nconst xUsernameVerificationScreen = computed((): boolean => {\n  return !isUsernameVerified.value\n})\n\nconst referredFromCreateSchoolLibrary = computed((): boolean => {\n  const urlParams: URLSearchParams = new URLSearchParams(window.location.search)\n  return urlParams.get('referrer')?.includes('school-library/create') || false\n})\n\nwatch(visualViewportHeight, (newValue, oldValue) => {\n  if (device.desktop || newValue >= oldValue) return\n\n  initialScrollY.value = window.scrollY\n\n  // When people focus on the input, the keyboard will pop up\n  // so the visual viewport height will be narrowed down.\n  // we want to hide the keyboard when people try to scroll the page\n  if (isUsernameInputFocused.value) {\n    document.addEventListener('scroll', blurUsernameInputOnScroll)\n  } else if (isPasswordInputFocused.value) {\n    document.addEventListener('scroll', blurPasswordInputOnScroll)\n  }\n})\n\nwatch(\n  xUsernameVerificationScreen,\n  (newValue: boolean) => {\n    // Only focus on current screen input field after a 1ms `setTimeout`,\n    // because we need to wait for the input field to be shown in the DOM,\n    // before we can focus on it.\n    setTimeout(() => {\n      nextTick(() => {\n        if (newValue) {\n          usernameInputRef.value?.focusInput()\n        } else {\n          passwordInputRef.value?.focusInput()\n        }\n      })\n    }, 1)\n  },\n  { immediate: true },\n)\n\nfunction continueWithSamlText(methodName: string | undefined): string {\n  return __('Continue with %{samlLoginMethod}', { samlLoginMethod: methodName ?? 'SAML' }) // SAML is a custom login method hosted by the university\n}\n\nwatch(isAwaitingServerResponse, (value: boolean) => {\n  const html = document.getElementsByTagName('html')[0]\n\n  if (xUsernameVerificationScreen.value) return\n\n  // Animate the background color while waiting for the response\n  // Note: Only do this when submitting the login form\n  if (value) {\n    html.classList.add('dot-grid-loading')\n  } else {\n    html.classList.remove('dot-grid-loading')\n  }\n})\n\nonBeforeUnmount(() => {\n  window.removeEventListener('popstate', goBackEmailVerificationScreen)\n})\n\nfunction onInputUsernameInput(e): void {\n  // Prevent the input from being refilled by browser after clicking the Continue button\n  if (!xUsernameVerificationScreen.value) return\n\n  setUsername(e.target.value)\n\n  // Reset the username validation message to enable the Continue button when typing on mobile and tablet\n  if (usernameValidationMessage.value.length) setUsernameValidationMessage('')\n}\n\nfunction onInputPasswordInput(e): void {\n  setPassword(prefilledPasswordByBrowser.value || e.target.value)\n\n  // Prevent the value of password input from always being prefilledPasswordByBrowser\n  if (prefilledPasswordByBrowser.value) {\n    prefilledPasswordByBrowser.value = ''\n  }\n\n  // Reset the password validation message to enable the Login button when typing on mobile and tablet\n  if (passwordValidationMessage.value.length) setPasswordValidationMessage('')\n}\n\nfunction onFocusInUsernameInput(): void {\n  isUsernameInputFocused.value = true\n}\n\nfunction onFocusInPasswordInput(): void {\n  isPasswordInputFocused.value = true\n}\n\nfunction onBlurUsernameInput(): void {\n  isUsernameInputFocused.value = false\n  document.removeEventListener('scroll', blurUsernameInputOnScroll)\n}\n\nfunction onBlurPasswordInput(): void {\n  isPasswordInputFocused.value = false\n  document.removeEventListener('scroll', blurPasswordInputOnScroll)\n}\n\nfunction blurUsernameInputOnScroll(): void {\n  // Note: the scroll event is fired when people press a key on the soft keyboard only on iPad\n  // we just blur the input only if the user scrolls past a certain threshold\n  if (isExceededScrollableThreshold(window.scrollY)) {\n    usernameInputRef.value?.blurInput()\n  }\n}\n\nfunction blurPasswordInputOnScroll(): void {\n  // Note: the scroll event is fired when people press a key on the soft keyboard only on iPad\n  // we just blur the input only if the user scrolls past a certain threshold\n  if (isExceededScrollableThreshold(window.scrollY)) {\n    passwordInputRef.value?.blurInput()\n  }\n}\n\nfunction isExceededScrollableThreshold(currentWindowY: number): boolean {\n  const SCROLLABLE_THRESHOLD = 40 // the height of the input field\n  return (\n    currentWindowY > initialScrollY.value + SCROLLABLE_THRESHOLD ||\n    currentWindowY < initialScrollY.value - SCROLLABLE_THRESHOLD\n  )\n}\n\nfunction goBackEmailVerificationScreen(event: PopStateEvent | Event): void {\n  // Go back to the email verification screen when clicking the back button on the password page\n  // Assuming the login flow is:\n  // (1) Visit home page → (2) Click Log in button → (3) Navigate to login page → (4) Enter email and click the Continue button\n  // → (5) Navigate to the password page → (6) Click the back button on the page → (7) Navigate back to the email page → (8) Click the browser back button.\n  // If we don't call `goBack()`, we have to do the step (8) twice to go back to the home page at step (1).\n  if (event.type === 'click') {\n    goBack()\n    return\n  }\n\n  if (document.referrer !== '') {\n    // Reset state only if referrer is not from Dashboard Settings delete page\n    const deletePagePathnames = ['/dashboard/settings/library_delete', '/dashboard/settings/delete']\n    const referrer = new URL(document.referrer)\n    const isReferredFromDeletePage = deletePagePathnames.includes(referrer.pathname)\n    if (isReferredFromDeletePage) return\n  }\n\n  isPasswordShown.value = false\n  prefilledPasswordByBrowser.value = ''\n  setIsUsernameVerified(false)\n  setPassword('')\n  setPasswordValidationMessage('')\n  resetIsAwaitingServerResponse()\n}\n\nasync function submit(): Promise<void> {\n  if (xUsernameVerificationScreen.value) {\n    // Blur the username input to prevent modifying the input value when submitting the form by clicking \"Enter\" key\n    usernameInputRef.value?.blurInput()\n\n    await continueWithEmailOrUsername()\n\n    // Re-focus the username input if there is an error message\n    if (usernameValidationMessage.value.length) {\n      usernameInputRef.value?.focusInput()\n    }\n\n    // Browser refills username and password input after clicking the Continue button\n    // so we need to store the password of the account that the user selected\n    if (password.value) {\n      prefilledPasswordByBrowser.value = password.value\n    }\n\n    if (isUsernameVerified.value && !window.history.state?.didPushState) {\n      // Enable the browser back button on login page\n      // didPushState: true to prevent pushing redundant states\n      window.history.pushState({ didPushState: true }, '', window.location.href)\n    }\n\n    window.addEventListener('popstate', goBackEmailVerificationScreen)\n  } else {\n    // Blur the password input to prevent modifying the input value when submitting the form by clicking \"Enter\" key\n    passwordInputRef.value?.blurInput()\n\n    await loginWithPassword()\n\n    // Re-focus the password input if there is an error message\n    if (passwordValidationMessage.value.length) {\n      passwordInputRef.value?.focusInput()\n    }\n  }\n}\n</script>\n\n<template>\n  <div class=\"relative flex flex-col items-center\">\n    <header\n      v-show=\"xHeader\"\n      :class=\"[\n        'fixed flex items-center justify-between box-border w-full px-4 transition-all',\n        xUsernameVerificationScreen || (device.desktop && !isSmallerThanTabletPortrait)\n          ? 'h-14 ps-5'\n          : 'h-18 tablet-portrait:ps-6',\n      ]\"\n    >\n      <SkipToContentLink />\n\n      <!-- UI for the email verification screen -->\n      <template v-if=\"xUsernameVerificationScreen\">\n        <OzPadletLogo :class=\"[{ invisible: device.electronApp }]\" :x-old-padlet-wordmark=\"true\" />\n\n        <div class=\"flex items-center text-body-small\">\n          <template v-if=\"device.desktop && !isSmallerThanTabletPortrait\">\n            <span class=\"text-dark-text-200 dark:text-light-text-200\">\n              {{ __('Not a member?') }}\n            </span>\n\n            <OzTextLink :href=\"signUpPageUrl\" :text=\"__('Sign up')\" class=\"font-semibold ms-1 me-2\" />\n          </template>\n          <template v-else>\n            <OzTextLink :href=\"signUpPageUrl\" :text=\"__('Sign up')\" class=\"font-semibold me-2\" />\n\n            <OzPlainButton\n              :color-scheme=\"OzPlainButtonColorScheme.SecondaryIcon\"\n              :size-preset=\"OzPlainButtonSizePreset.H28px\"\n              :aria-label=\"__('Open more menu dialog')\"\n              data-testid=\"actionMenuButton\"\n              @click=\"xActionMenu = true\"\n            >\n              <OzIcon :size=\"20\" name=\"more_vertical\" />\n            </OzPlainButton>\n          </template>\n        </div>\n      </template>\n\n      <!-- UI for the login with password screen -->\n      <template v-else>\n        <OzPadletLogo\n          v-if=\"device.desktop && !isSmallerThanTabletPortrait\"\n          :class=\"[{ invisible: device.electronApp }]\"\n          :x-old-padlet-wordmark=\"true\"\n        />\n\n        <template v-else>\n          <OzBackButton\n            data-testid=\"landsideLoginBackButton\"\n            :disabled=\"isAwaitingServerResponse\"\n            @click=\"goBackEmailVerificationScreen\"\n          />\n\n          <OzPlainButton\n            v-if=\"device.tablet\"\n            :color-scheme=\"OzPlainButtonColorScheme.SecondaryIcon\"\n            :size-preset=\"OzPlainButtonSizePreset.H28px\"\n            :aria-label=\"__('Open more menu dialog')\"\n            @click=\"xActionMenu = true\"\n          >\n            <OzIcon :size=\"20\" name=\"more_vertical\" />\n          </OzPlainButton>\n        </template>\n      </template>\n    </header>\n\n    <main\n      id=\"main-content\"\n      :class=\"[\n        'fixed',\n        'bottom-0',\n        'flex',\n        'flex-col',\n        'justify-center',\n        'box-border',\n        'w-full',\n        'p-4',\n        'tablet-portrait:relative tablet-portrait:w-[375px] tablet-portrait:p-0 tablet-portrait:px-4 tablet-portrait:mt-32',\n      ]\"\n      tabindex=\"-1\"\n    >\n      <!-- Only display the back button on the log in with password screen -->\n      <OzBackButton\n        v-if=\"!xUsernameVerificationScreen && device.desktop && !isSmallerThanTabletPortrait\"\n        data-testid=\"landsideLoginBackButton\"\n        :disabled=\"isAwaitingServerResponse\"\n        class=\"mb-5\"\n        @click=\"goBackEmailVerificationScreen\"\n      />\n\n      <div class=\"text-dark-text-100 dark:text-light-text-100 mb-5\">\n        <h1 class=\"w-56 text-login-heading-1 font-semibold px-2 mb-1\">\n          {{ xUsernameVerificationScreen ? __('Log in') : passwordScreenHeading }}\n        </h1>\n        <h2 class=\"text-login-body px-2\">\n          {{ xUsernameVerificationScreen ? __('Welcome back to where you belong') : username }}\n        </h2>\n      </div>\n\n      <div v-if=\"samlLoginMethods !== null && samlLoginMethods.length > 0\" class=\"flex flex-col space-y-2 mb-5\">\n        <AuthLoginSAMLButton\n          v-for=\"method in samlLoginMethods\"\n          :key=\"method.name\"\n          :text=\"continueWithSamlText(method.displayName)\"\n          :logo=\"method.logo\"\n          @click=\"navigateTo(method.url)\"\n        />\n      </div>\n\n      <AuthLoginThirdPartyGroupButtons\n        v-if=\"xUsernameVerificationScreen && !!Object.keys(thirdPartyAuthLoginMethods).length\"\n        :login-methods=\"thirdPartyAuthLoginMethods\"\n        :type=\"AuthLoginThirdPartyGroupButtonsType.LogIn\"\n        class=\"mb-5\"\n      />\n\n      <AuthLoginThirdPartyGroupButtons\n        v-else-if=\"!xUsernameVerificationScreen && !!Object.keys(userThirdPartyAuthLoginMethods).length\"\n        :login-methods=\"userThirdPartyAuthLoginMethods\"\n        :type=\"AuthLoginThirdPartyGroupButtonsType.Continue\"\n        class=\"mb-5\"\n      />\n\n      <form\n        novalidate\n        :class=\"['flex flex-col mb-6', { 'tablet-portrait:mb-[72px]': xUsernameVerificationScreen }]\"\n        @submit.prevent=\"submit\"\n      >\n        <!--\n          Use `model-value` and `@input` here instead of `v-model`\n          because the input value doesn't get updated on every keypress on android when using `v-model`\n          @see https://github.com/vuejs/vue/issues/9777#issuecomment-478831263\n        -->\n\n        <!-- Display the email input on the email verification screen -->\n        <OzLabelInput v-show=\"xUsernameVerificationScreen && isPasswordLoginEnabled\" class=\"mb-4\">\n          <template #label>\n            <label\n              for=\"username-input\"\n              :class=\"['text-body-small-posts', 'text-dark-text-100 dark:text-light-text-100', 'px-2']\"\n            >\n              {{ __('Or, log in with email/username') }}\n            </label>\n          </template>\n\n          <template #input>\n            <OzInput\n              id=\"username-input\"\n              ref=\"usernameInputRef\"\n              name=\"username\"\n              autocomplete=\"email\"\n              type=\"email\"\n              test-id=\"usernameInput\"\n              :disabled=\"isAwaitingServerResponse\"\n              :model-value=\"username\"\n              :validation-message=\"usernameValidationMessage\"\n              placeholder=\"harrypotter@hogwarts.edu\"\n              :valid=\"isUsernameValid\"\n              :required=\"true\"\n              class=\"bg-light-ui-100 dark:bg-dark-ui-100\"\n              @input=\"onInputUsernameInput\"\n              @focusin=\"onFocusInUsernameInput\"\n              @blur=\"onBlurUsernameInput\"\n            />\n          </template>\n        </OzLabelInput>\n\n        <!-- Display the password input on the login with password screen -->\n        <OzLabelInput v-show=\"!xUsernameVerificationScreen && isPasswordLoginEnabled\" class=\"mb-4\">\n          <template #label>\n            <label\n              for=\"password-input\"\n              :class=\"['text-body-small-posts', 'text-dark-text-100 dark:text-light-text-100', 'px-2']\"\n            >\n              {{ Object.keys(userThirdPartyAuthLoginMethods).length ? __('Or enter password') : __('Enter password') }}\n            </label>\n          </template>\n\n          <template #inputAccessory>\n            <OzCheckBox\n              :value=\"isPasswordShown\"\n              :label=\"__('Show')\"\n              :aria-label=\"__('Show password as plain text. Warning: this will display your password on the screen.')\"\n              :dir=\"dir()\"\n              class=\"px-2\"\n              @input=\"isPasswordShown = !isPasswordShown\"\n            />\n          </template>\n\n          <template #input>\n            <OzInput\n              id=\"password-input\"\n              ref=\"passwordInputRef\"\n              name=\"password\"\n              autocomplete=\"current-password\"\n              autocapitalize=\"none\"\n              :type=\"isPasswordShown ? 'text' : 'password'\"\n              test-id=\"passwordInput\"\n              :disabled=\"isAwaitingServerResponse\"\n              :model-value=\"password\"\n              :validation-message=\"passwordValidationMessage\"\n              :placeholder=\"__('Enter password')\"\n              :valid=\"isPasswordValid\"\n              :required=\"true\"\n              class=\"bg-light-ui-100 dark:bg-dark-ui-100\"\n              @input=\"onInputPasswordInput\"\n              @focusin=\"onFocusInPasswordInput\"\n              @blur=\"onBlurPasswordInput\"\n            />\n          </template>\n        </OzLabelInput>\n\n        <div class=\"flex justify-center tablet-portrait:justify-end\">\n          <!-- Display the Continue button on the email verification screen -->\n          <OzContainedButton\n            v-if=\"xUsernameVerificationScreen\"\n            data-testid=\"continueButton\"\n            data-pw=\"continueButton\"\n            :color-scheme=\"OzContainedButtonColorScheme.Primary\"\n            :disabled=\"isAwaitingServerResponse || isContinueButtonDisabled\"\n            class=\"w-full tablet-portrait:w-auto\"\n          >\n            {{ __('Continue') }}\n          </OzContainedButton>\n\n          <!-- Display the Log in button on the login with password screen -->\n          <template v-else-if=\"isPasswordLoginEnabled\">\n            <OzLoadingText\n              v-if=\"isAwaitingServerResponse\"\n              :text=\"__('Logging in...')\"\n              class=\"text-heading-4 text-center font-semibold px-5 py-2\"\n            />\n            <OzContainedButton\n              v-else\n              data-testid=\"loginButton\"\n              data-pw=\"loginButton\"\n              :color-scheme=\"OzContainedButtonColorScheme.Primary\"\n              :disabled=\"isLoginButtonDisabled\"\n              class=\"w-full tablet-portrait:w-auto\"\n            >\n              {{ __('Log in') }}\n            </OzContainedButton>\n          </template>\n        </div>\n      </form>\n\n      <p\n        class=\"text-body-small-posts text-dark-text-200 dark:text-light-text-200 text-center tablet-portrait:text-start px-2 tablet-portrait:mb-4\"\n      >\n        <!-- Display \"Backpack or Briefcase user? Log in here\" on the email verification screen -->\n        <template v-if=\"xUsernameVerificationScreen && !referredFromCreateSchoolLibrary && !isSchoolLibraryLoginPage\">\n          <span>{{ __('Backpack or Briefcase user?') }}</span>\n\n          <OzTextLink :href=\"orgDomainVerificationPageUrl\" :text=\"__('Log in here')\" class=\"font-semibold\" />\n        </template>\n\n        <!-- Display \"Forgot password?\" on the login with password screen -->\n        <template v-else-if=\"isPasswordLoginEnabled\">\n          <OzTextLink\n            :href=\"forgotPasswordUrl\"\n            :text=\"__('Forgot password?')\"\n            class=\"font-semibold\"\n            data-testid=\"forgotPasswordLink\"\n          />\n        </template>\n      </p>\n\n      <AuthActionMenu v-if=\"xActionMenu\" @cancel=\"xActionMenu = false\" />\n      <GlobalSnackbar />\n    </main>\n\n    <AuthBottomNav v-if=\"device.desktop\" class=\"fixed start-6 bottom-6 hidden tablet-portrait:flex\" />\n  </div>\n</template>\n\n<style lang=\"postcss\">\n@import '@@/styles/4/kit';\n@import '@@/styles/4/dot_grid';\n\n* {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\nhtml {\n  @extend .dot-grid;\n  @apply overflow-hidden;\n  @apply bg-left-top;\n  @apply h-screen;\n\n  font-size: 16px;\n}\n\n@media screen and (orientation: landscape) {\n  html {\n    @apply overflow-auto;\n  }\n}\n</style>\n","// @file Entrypoint for auth login page\nimport { captureException } from '@@/bits/error_tracker'\nimport { ww } from '@@/bits/global'\nimport { setupVueApp } from '@@/bits/vue'\nimport { useAuthLoginStore } from '@@/pinia/auth_login_store'\nimport AuthLoginApp from '@@/vuecomponents/AuthLoginApp.vue'\n\nvoid setupVueApp({\n  el: '#auth_login_app',\n  rootComponent: AuthLoginApp,\n  usePinia: true,\n  initializePiniaStore() {\n    void useAuthLoginStore().initialize(ww.vueStartingState)\n  },\n}).catch(captureException)\n"],"names":["windowSizeStore","useWindowSizeStore","authLoginStore","useAuthLoginStore","isSmallerThanTabletPortrait","visualViewportHeight","storeToRefs","username","password","usernameValidationMessage","passwordValidationMessage","isAwaitingServerResponse","thirdPartyAuthLoginMethods","userThirdPartyAuthLoginMethods","samlLoginMethods","isUsernameVerified","isUsernameValid","isPasswordValid","codeChallenge","codeChallengeMethod","pkceState","originAppClientId","originAppRedirectUri","isPkceEnabled","isPasswordLoginEnabled","isSchoolLibraryLoginPage","setUsername","setUsernameValidationMessage","setPassword","setPasswordValidationMessage","setIsUsernameVerified","continueWithEmailOrUsername","loginWithPassword","resetIsAwaitingServerResponse","usernameInputRef","ref","passwordInputRef","xActionMenu","isUsernameInputFocused","isPasswordInputFocused","isPasswordShown","initialScrollY","prefilledPasswordByBrowser","xHeader","computed","device","mobile","android","value","isContinueButtonDisabled","length","isLoginButtonDisabled","signUpPageUrl","baseSignupUrl","buildUrlFromPath","transformUrl","searchParams","code_challenge","code_challenge_method","redirect_uri","encodeURIComponent","client_id","pkce_state","orgDomainVerificationPageUrl","baseOrgDomainVerificationPageUrl","passwordScreenHeading","isEmail","__","forgotPasswordUrl","transformCurrentUrl","path","search","email","xUsernameVerificationScreen","referredFromCreateSchoolLibrary","urlParams","URLSearchParams","window","location","get","includes","watch","newValue","oldValue","desktop","scrollY","document","addEventListener","blurUsernameInputOnScroll","blurPasswordInputOnScroll","setTimeout","nextTick","focusInput","immediate","continueWithSamlText","methodName","samlLoginMethod","html","getElementsByTagName","classList","add","remove","onBeforeUnmount","removeEventListener","goBackEmailVerificationScreen","onInputUsernameInput","e","target","onInputPasswordInput","onFocusInUsernameInput","onFocusInPasswordInput","onBlurUsernameInput","onBlurPasswordInput","isExceededScrollableThreshold","blurInput","currentWindowY","SCROLLABLE_THRESHOLD","event","type","goBack","referrer","deletePagePathnames","URL","pathname","submit","history","state","didPushState","pushState","href","setupVueApp","el","rootComponent","AuthLoginApp","usePinia","initializePiniaStore","initialize","ww","vueStartingState","catch","captureException"],"mappings":"inGAiCA,MAAMA,EAAkBC,KAClBC,EAAiBC,IAEjB,CAAEC,4BAAAA,EAA6BC,qBAAAA,CAAqB,EAAIC,EAAYN,CAAe,EACnF,CACJO,SAAAA,EACAC,SAAAA,EACAC,0BAAAA,EACAC,0BAAAA,EACAC,yBAAAA,EACAC,2BAAAA,GACAC,+BAAAA,GACAC,iBAAAA,GACAC,mBAAAA,EACAC,gBAAAA,GACAC,gBAAAA,GACAC,cAAAA,EACAC,oBAAAA,EACAC,UAAAA,EACAC,kBAAAA,EACAC,qBAAAA,EACAC,cAAAA,EACAC,uBAAAA,GACAC,yBAAAA,EACF,EAAInB,EAAYJ,CAAc,EACxB,CACJwB,YAAAA,EACAC,6BAAAA,EACAC,YAAAA,EACAC,6BAAAA,EACAC,sBAAAA,EACAC,4BAAAA,EACAC,kBAAAA,EACAC,8BAAAA,CACE,EAAA/B,EAEEgC,EAAmBC,IACnBC,EAAmBD,IACnBE,GAAcF,EAAI,EAAK,EACvBG,EAAyBH,EAAI,EAAK,EAClCI,EAAyBJ,EAAI,EAAK,EAClCK,EAAkBL,EAAI,EAAK,EAC3BM,EAAiBN,EAAI,CAAC,EACtBO,EAA6BP,EAAI,EAAE,EAGnCQ,GAAUC,EAAS,IAChB,EACLC,EAAOC,QACPD,EAAOE,SACP3C,EAA4B4C,QAC3BV,EAAuBU,OAAST,EAAuBS,OAE3D,EAEKC,GAA2BL,EAAS,IACjC,CAACrC,EAASyC,MAAME,QAAU,CAAC,CAACzC,EAA0BuC,MAAME,MACpE,EAEKC,GAAwBP,EAAS,IAC9B,CAACpC,EAASwC,MAAME,QAAU,CAAC,CAACxC,EAA0BsC,MAAME,MACpE,EAEKE,GAAgBR,EAAS,IAAc,CACrC,MAAAS,EAAgBC,EAAiB,cAAc,EACrD,OAAI/B,EAAcyB,MACgBO,EAAaF,EAAe,CAC1DG,aAAc,CACZC,eAAgBvC,EAAc8B,MAC9BU,sBAAuBvC,EAAoB6B,MAC3CW,aAAcC,mBAAmBtC,EAAqB0B,KAAe,EACrEa,UAAWxC,EAAkB2B,MAC7Bc,WAAY1C,EAAU4B,KACxB,CACF,CAAC,EAGMK,CAEX,CAAC,EAEKU,GAA+BnB,EAAS,IAAc,CACpD,MAAAoB,EAAmCV,EAAiB,0BAA0B,EACpF,OAAI/B,EAAcyB,MACmCO,EAAaS,EAAkC,CAChGR,aAAc,CACZC,eAAgBvC,EAAc8B,MAC9BU,sBAAuBvC,EAAoB6B,MAC3CW,aAAcC,mBAAmBtC,EAAqB0B,KAAe,EACrEa,UAAWxC,EAAkB2B,MAC7Bc,WAAY1C,EAAU4B,KACxB,CACF,CAAC,EAGMgB,CAEX,CAAC,EAEKC,GAAwBrB,EAAS,IAC9BsB,EAAQ3D,EAASyC,KAAK,EAAImB,EAAG,mBAAmB,EAAIA,EAAG,sBAAsB,CACrF,EAEKC,GAAoBxB,EAAiB,IACrCsB,EAAQ3D,EAASyC,KAAK,EACjBqB,EAAoB,CAAA,EAAI,CAAEC,KAAM,eAAgBC,OAAQ,CAAEC,MAAOjE,EAASyC,KAAM,CAAE,CAAC,EAErFqB,EAAoB,CAAA,EAAI,CAAEC,KAAM,cAAe,CAAC,CACxD,EAEKG,EAA8B7B,EAAS,IACpC,CAAC7B,EAAmBiC,KAC5B,EAEK0B,GAAkC9B,EAAS,IAAe,OAE9D,QAAO+B,EAD4B,IAAIC,gBAAgBC,EAAOC,SAASP,MAAM,EAC5DQ,IAAI,UAAU,IAAxBJ,YAAAA,EAA2BK,SAAS,2BAA4B,EACzE,CAAC,EAEKC,EAAA5E,EAAsB,CAAC6E,EAAUC,IAAa,CAC9CtC,EAAOuC,SAAWF,GAAYC,IAElC1C,EAAeO,MAAQ6B,EAAOQ,QAK1B/C,EAAuBU,MAChBsC,SAAAC,iBAAiB,SAAUC,CAAyB,EACpDjD,EAAuBS,OACvBsC,SAAAC,iBAAiB,SAAUE,CAAyB,EAEjE,CAAC,EAEDR,EACER,EACCS,GAAsB,CAIrBQ,WAAW,IAAM,CACfC,GAAS,IAAM,SACTT,GACFhD,EAAAA,EAAiBc,QAAjBd,MAAAA,EAAwB0D,cAExBxD,EAAAA,EAAiBY,QAAjBZ,MAAAA,EAAwBwD,YAE5B,CAAC,GACA,CAAC,CACN,EACA,CAAEC,UAAW,EAAK,CACpB,EAEA,SAASC,GAAqBC,EAAwC,CACpE,OAAO5B,EAAG,mCAAoC,CAAE6B,gBAAiBD,GAAc,MAAO,CAAC,CACzF,CAEMd,EAAAtE,EAA2BqC,GAAmB,CAClD,MAAMiD,EAAOX,SAASY,qBAAqB,MAAM,EAAE,CAAC,EAEhDzB,EAA4BzB,QAI5BA,EACGiD,EAAAE,UAAUC,IAAI,kBAAkB,EAEhCH,EAAAE,UAAUE,OAAO,kBAAkB,EAE5C,CAAC,EAEDC,GAAgB,IAAM,CACbzB,EAAA0B,oBAAoB,WAAYC,CAA6B,CACtE,CAAC,EAED,SAASC,GAAqBC,EAAS,CAEhCjC,EAA4BzB,QAErBtB,EAAAgF,EAAEC,OAAO3D,KAAK,EAGtBvC,EAA0BuC,MAAME,QAAQvB,EAA6B,EAAE,EAC7E,CAEA,SAASiF,GAAqBF,EAAS,CACrC9E,EAAYc,EAA2BM,OAAS0D,EAAEC,OAAO3D,KAAK,EAG1DN,EAA2BM,QAC7BN,EAA2BM,MAAQ,IAIjCtC,EAA0BsC,MAAME,QAAQrB,EAA6B,EAAE,CAC7E,CAEA,SAASgF,IAA+B,CACtCvE,EAAuBU,MAAQ,EACjC,CAEA,SAAS8D,IAA+B,CACtCvE,EAAuBS,MAAQ,EACjC,CAEA,SAAS+D,IAA4B,CACnCzE,EAAuBU,MAAQ,GACtBsC,SAAAiB,oBAAoB,SAAUf,CAAyB,CAClE,CAEA,SAASwB,IAA4B,CACnCzE,EAAuBS,MAAQ,GACtBsC,SAAAiB,oBAAoB,SAAUd,CAAyB,CAClE,CAEA,SAASD,GAAkC,OAGrCyB,EAA8BpC,EAAOQ,OAAO,KAC9CnD,EAAAA,EAAiBc,QAAjBd,MAAAA,EAAwBgF,YAE5B,CAEA,SAASzB,GAAkC,OAGrCwB,EAA8BpC,EAAOQ,OAAO,KAC9CjD,EAAAA,EAAiBY,QAAjBZ,MAAAA,EAAwB8E,YAE5B,CAEA,SAASD,EAA8BE,EAAiC,CAEtE,OACEA,EAAiB1E,EAAeO,MAAQoE,IACxCD,EAAiB1E,EAAeO,MAAQoE,EAE5C,CAEA,SAASZ,EAA8Ba,EAAoC,CAMrE,GAAAA,EAAMC,OAAS,QAAS,CACnBC,KACP,MACF,CAEI,GAAAjC,SAASkC,WAAa,GAAI,CAEtB,MAAAC,EAAsB,CAAC,qCAAsC,4BAA4B,EACzFD,EAAW,IAAIE,IAAIpC,SAASkC,QAAQ,EAEtC,GAD6BC,EAAoBzC,SAASwC,EAASG,QAAQ,EACjD,MAChC,CAEAnF,EAAgBQ,MAAQ,GACxBN,EAA2BM,MAAQ,GACnClB,EAAsB,EAAK,EAC3BF,EAAY,EAAE,EACdC,EAA6B,EAAE,EACDI,GAChC,CAEA,eAAe2F,IAAwB,eACjCnD,EAA4BzB,QAE9Bd,EAAAA,EAAiBc,QAAjBd,MAAAA,EAAwBgF,YAExB,MAAMnF,EAA4B,EAG9BtB,EAA0BuC,MAAME,UAClChB,EAAAA,EAAiBc,QAAjBd,MAAAA,EAAwB0D,cAKtBpF,EAASwC,QACXN,EAA2BM,MAAQxC,EAASwC,OAG1CjC,EAAmBiC,OAAS,GAAC6B,EAAAA,EAAOgD,QAAQC,QAAfjD,MAAAA,EAAsBkD,eAG9ClD,EAAAgD,QAAQG,UAAU,CAAED,aAAc,EAAQ,EAAA,GAAIlD,EAAOC,SAASmD,IAAI,EAGpEpD,EAAAU,iBAAiB,WAAYiB,CAA6B,KAGjEpE,EAAAA,EAAiBY,QAAjBZ,MAAAA,EAAwB8E,YAExB,MAAMlF,EAAkB,EAGpBtB,EAA0BsC,MAAME,UAClCd,EAAAA,EAAiBY,QAAjBZ,MAAAA,EAAwBwD,cAG9B,6mTCxUKsC,GAAY,CACfC,GAAI,kBACJC,cAAeC,GACfC,SAAU,GACVC,sBAAuB,CAChBpI,EAAkB,EAAEqI,WAAWC,GAAGC,gBAAgB,CACzD,CACF,CAAC,EAAEC,MAAMC,EAAgB"}