@andreyyolkin/keycloakify-vue 0.1.0

package/keycloakify-vue/login/pages/LoginRecoveryAuthnCodeConfig.useScript.js

@@ -0,0 +1,139 @@
+import { onMounted } from "vue";
+import { useInsertScriptTags } from "../../tools/useInsertScriptTags";
+import { waitForElementMountedOnDom } from "keycloakify/tools/waitForElementMountedOnDom";
+function useScript(params) {
+  const { olRecoveryCodesListId, i18n } = params;
+  const { msgStr, isFetchingTranslations } = i18n;
+  const { insertScriptTags } = useInsertScriptTags({
+    componentOrHookName: "LoginRecoveryAuthnCodeConfig",
+    scriptTags: [
+      {
+        type: "text/javascript",
+        textContent: () => `
+
+                    /* copy recovery codes  */
+                    function copyRecoveryCodes() {
+                        var tmpTextarea = document.createElement("textarea");
+                        var codes = document.querySelectorAll("#${olRecoveryCodesListId} li");
+                        for (i = 0; i < codes.length; i++) {
+                            tmpTextarea.value = tmpTextarea.value + codes[i].innerText + "\\n";
+                        }
+                        document.body.appendChild(tmpTextarea);
+                        tmpTextarea.select();
+                        document.execCommand("copy");
+                        document.body.removeChild(tmpTextarea);
+                    }
+
+                    var copyButton = document.getElementById("copyRecoveryCodes");
+                    copyButton && copyButton.addEventListener("click", function () {
+                        copyRecoveryCodes();
+                    });
+
+                    /* download recovery codes  */
+                    function formatCurrentDateTime() {
+                        var dt = new Date();
+                        var options = {
+                            month: 'long',
+                            day: 'numeric',
+                            year: 'numeric',
+                            hour: 'numeric',
+                            minute: 'numeric',
+                            timeZoneName: 'short'
+                        };
+
+                        return dt.toLocaleString('en-US', options);
+                    }
+
+                    function parseRecoveryCodeList() {
+                        var recoveryCodes = document.querySelectorAll("#${olRecoveryCodesListId} li");
+                        var recoveryCodeList = "";
+
+                        for (var i = 0; i < recoveryCodes.length; i++) {
+                            var recoveryCodeLiElement = recoveryCodes[i].innerText;
+                            recoveryCodeList += recoveryCodeLiElement + "\\r\\n";
+                        }
+
+                        return recoveryCodeList;
+                    }
+
+                    function buildDownloadContent() {
+                        var recoveryCodeList = parseRecoveryCodeList();
+                        var dt = new Date();
+                        var options = {
+                            month: 'long',
+                            day: 'numeric',
+                            year: 'numeric',
+                            hour: 'numeric',
+                            minute: 'numeric',
+                            timeZoneName: 'short'
+                        };
+
+                        return fileBodyContent =
+                            ${JSON.stringify(msgStr("recovery-codes-download-file-header"))} + "\\n\\n" +
+                            recoveryCodeList + "\\n" +
+                            ${JSON.stringify(msgStr("recovery-codes-download-file-description"))} + "\\n\\n" +
+                            ${JSON.stringify(msgStr("recovery-codes-download-file-date"))} + " " + formatCurrentDateTime();
+                    }
+
+                    function setUpDownloadLinkAndDownload(filename, text) {
+                        var el = document.createElement('a');
+                        el.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
+                        el.setAttribute('download', filename);
+                        el.style.display = 'none';
+                        document.body.appendChild(el);
+                        el.click();
+                        document.body.removeChild(el);
+                    }
+
+                    function downloadRecoveryCodes() {
+                        setUpDownloadLinkAndDownload('kc-download-recovery-codes.txt', buildDownloadContent());
+                    }
+
+                    var downloadButton = document.getElementById("downloadRecoveryCodes");
+                    downloadButton && downloadButton.addEventListener("click", downloadRecoveryCodes);
+
+                    /* print recovery codes */
+                    function buildPrintContent() {
+                        var recoveryCodeListHTML = document.getElementById('${olRecoveryCodesListId}').innerHTML;
+                        var styles =
+                            \`@page { size: auto;  margin-top: 0; }
+                            body { width: 480px; }
+                            div { list-style-type: none; font-family: monospace }
+                            p:first-of-type { margin-top: 48px }\`;
+
+                        return printFileContent =
+                            "<html><style>" + styles + "</style><body>" +
+                            "<title>kc-download-recovery-codes</title>" +
+                            "<p>" + ${JSON.stringify(msgStr("recovery-codes-download-file-header"))} + "</p>" +
+                            "<div>" + recoveryCodeListHTML + "</div>" +
+                            "<p>" + ${JSON.stringify(msgStr("recovery-codes-download-file-description"))} + "</p>" +
+                            "<p>" + ${JSON.stringify(msgStr("recovery-codes-download-file-date"))} + " " + formatCurrentDateTime() + "</p>" +
+                            "</body></html>";
+                    }
+
+                    function printRecoveryCodes() {
+                        var w = window.open();
+                        w.document.write(buildPrintContent());
+                        w.print();
+                        w.close();
+                    }
+
+                    var printButton = document.getElementById("printRecoveryCodes");
+                    printButton && printButton.addEventListener("click", printRecoveryCodes);
+                `
+      }
+    ]
+  });
+  onMounted(async () => {
+    if (isFetchingTranslations) {
+      return;
+    }
+    await waitForElementMountedOnDom({
+      elementId: olRecoveryCodesListId
+    });
+    insertScriptTags();
+  });
+}
+export {
+  useScript
+};

package/keycloakify-vue/login/pages/LoginRecoveryAuthnCodeConfig.vue

@@ -0,0 +1,183 @@
+<script setup lang="ts">
+import { clsx } from 'keycloakify/tools/clsx';
+import type { KcContext } from 'keycloakify/login/KcContext';
+import { getKcClsx } from 'keycloakify/login/lib/kcClsx';
+import LogoutOtherSessions from '../components/LogoutOtherSessions.vue';
+import type { I18n } from '../i18n/i18n';
+import type { PageProps } from './PageProps';
+import { useScript } from './LoginRecoveryAuthnCodeConfig.useScript';
+
+const props = defineProps<PageProps<Extract<KcContext, { pageId: 'login-recovery-authn-code-config.ftl' }>, I18n>>();
+
+const { kcClsx } = getKcClsx({
+  doUseDefaultCss: props.doUseDefaultCss,
+  classes: props.classes,
+});
+
+const kcContext = props.kcContext;
+const { recoveryAuthnCodesConfigBean, isAppInitiatedAction } = kcContext;
+
+const olRecoveryCodesListId = 'kc-recovery-codes-list';
+
+useScript({ olRecoveryCodesListId, i18n: props.i18n });
+</script>
+
+<template>
+  <component
+    :is="Template"
+    :kcContext="kcContext"
+    :i18n="i18n"
+    :doUseDefaultCss="doUseDefaultCss"
+    :classes="classes"
+  >
+    <template #header>
+      <component :is="i18n.msg('recovery-code-config-header')" />
+    </template>
+
+    <div
+      :class="clsx('pf-c-alert', 'pf-m-warning', 'pf-m-inline', kcClsx('kcRecoveryCodesWarning'))"
+      aria-label="Warning alert"
+    >
+      <div class="pf-c-alert__icon">
+        <i
+          class="pficon-warning-triangle-o"
+          aria-hidden="true"
+        ></i>
+      </div>
+      <h4 class="pf-c-alert__title">
+        <span class="pf-screen-reader">Warning alert:</span>
+        <component :is="i18n.msg('recovery-code-config-warning-title')" />
+      </h4>
+      <div class="pf-c-alert__description">
+        <p>
+          <component :is="i18n.msg('recovery-code-config-warning-message')" />
+        </p>
+      </div>
+    </div>
+
+    <ol
+      :id="olRecoveryCodesListId"
+      :class="kcClsx('kcRecoveryCodesList')"
+    >
+      <li
+        v-for="(code, index) in recoveryAuthnCodesConfigBean.generatedRecoveryAuthnCodesList"
+        :key="code"
+      >
+        <span>{{ index + 1 }}:</span> {{ code.slice(0, 4) }}-{{ code.slice(4, 8) }}-{{ code.slice(8) }}
+      </li>
+    </ol>
+
+    <!-- actions -->
+    <div :class="kcClsx('kcRecoveryCodesActions')">
+      <button
+        id="printRecoveryCodes"
+        :class="clsx('pf-c-button', 'pf-m-link')"
+        type="button"
+      >
+        <i
+          class="pficon-print"
+          aria-hidden="true"
+        ></i>
+        <component :is="i18n.msg('recovery-codes-print')" />
+      </button>
+      <button
+        id="downloadRecoveryCodes"
+        :class="clsx('pf-c-button', 'pf-m-link')"
+        type="button"
+      >
+        <i
+          class="pficon-save"
+          aria-hidden="true"
+        ></i>
+        <component :is="i18n.msg('recovery-codes-download')" />
+      </button>
+      <button
+        id="copyRecoveryCodes"
+        :class="clsx('pf-c-button', 'pf-m-link')"
+        type="button"
+      >
+        <i
+          class="pficon-blueprint"
+          aria-hidden="true"
+        ></i>
+        <component :is="i18n.msg('recovery-codes-copy')" />
+      </button>
+    </div>
+
+    <!-- confirmation checkbox -->
+    <div :class="kcClsx('kcFormOptionsClass')">
+      <input
+        :class="kcClsx('kcCheckInputClass')"
+        type="checkbox"
+        id="kcRecoveryCodesConfirmationCheck"
+        name="kcRecoveryCodesConfirmationCheck"
+        @change="
+          (event) => {
+            // @ts-expect-error: This is inherited from the original code
+            document.getElementById('saveRecoveryAuthnCodesBtn').disabled = !(event.target as HTMLInputElement).checked;
+          }
+        "
+      />
+      <label for="kcRecoveryCodesConfirmationCheck">
+        <component :is="i18n.msg('recovery-codes-confirmation-message')" />
+      </label>
+    </div>
+
+    <form
+      :action="kcContext.url.loginAction"
+      :class="kcClsx('kcFormGroupClass')"
+      id="kc-recovery-codes-settings-form"
+      method="post"
+    >
+      <input
+        type="hidden"
+        name="generatedRecoveryAuthnCodes"
+        :value="recoveryAuthnCodesConfigBean.generatedRecoveryAuthnCodesAsString"
+      />
+      <input
+        type="hidden"
+        name="generatedAt"
+        :value="recoveryAuthnCodesConfigBean.generatedAt"
+      />
+      <input
+        type="hidden"
+        id="userLabel"
+        name="userLabel"
+        :value="i18n.msgStr('recovery-codes-label-default')"
+      />
+
+      <LogoutOtherSessions
+        :kcClsx="kcClsx"
+        :i18n="i18n"
+      />
+
+      <template v-if="isAppInitiatedAction">
+        <input
+          type="submit"
+          :class="kcClsx('kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonLargeClass')"
+          id="saveRecoveryAuthnCodesBtn"
+          :value="i18n.msgStr('recovery-codes-action-complete')"
+          disabled
+        />
+        <button
+          type="submit"
+          :class="kcClsx('kcButtonClass', 'kcButtonDefaultClass', 'kcButtonLargeClass')"
+          id="cancelRecoveryAuthnCodesBtn"
+          name="cancel-aia"
+          value="true"
+        >
+          <component :is="i18n.msg('recovery-codes-action-cancel')" />
+        </button>
+      </template>
+      <template v-else>
+        <input
+          type="submit"
+          :class="kcClsx('kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonBlockClass', 'kcButtonLargeClass')"
+          id="saveRecoveryAuthnCodesBtn"
+          :value="i18n.msgStr('recovery-codes-action-complete')"
+          disabled
+        />
+      </template>
+    </form>
+  </component>
+</template>

package/keycloakify-vue/login/pages/LoginRecoveryAuthnCodeConfig.vue.d.ts

@@ -0,0 +1,9 @@
+import type { KcContext } from 'keycloakify/login/KcContext';
+import type { I18n } from '../i18n/i18n';
+import type { PageProps } from './PageProps';
+type __VLS_Props = PageProps<Extract<KcContext, {
+    pageId: 'login-recovery-authn-code-config.ftl';
+}>, I18n>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/keycloakify-vue/login/pages/LoginRecoveryAuthnCodeInput.vue

@@ -0,0 +1,90 @@
+<script setup lang="ts">
+import { kcSanitize } from 'keycloakify/lib/kcSanitize';
+import type { KcContext } from 'keycloakify/login/KcContext';
+import { getKcClsx } from 'keycloakify/login/lib/kcClsx';
+import type { I18n } from '../i18n/i18n';
+import type { PageProps } from './PageProps';
+
+const props = defineProps<PageProps<Extract<KcContext, { pageId: 'login-recovery-authn-code-input.ftl' }>, I18n>>();
+
+const { kcClsx } = getKcClsx({
+  doUseDefaultCss: props.doUseDefaultCss,
+  classes: props.classes,
+});
+
+const kcContext = props.kcContext;
+const { url, messagesPerField, recoveryAuthnCodesInputBean } = kcContext;
+</script>
+
+<template>
+  <component
+    :is="Template"
+    :kcContext="kcContext"
+    :i18n="i18n"
+    :doUseDefaultCss="doUseDefaultCss"
+    :classes="classes"
+    :displayMessage="!messagesPerField.existsError('recoveryCodeInput')"
+  >
+    <template #header>
+      <component :is="i18n.msg('auth-recovery-code-header')" />
+    </template>
+
+    <form
+      id="kc-recovery-code-login-form"
+      :class="kcClsx('kcFormClass')"
+      :action="url.loginAction"
+      method="post"
+    >
+      <div :class="kcClsx('kcFormGroupClass')">
+        <div :class="kcClsx('kcLabelWrapperClass')">
+          <label
+            for="recoveryCodeInput"
+            :class="kcClsx('kcLabelClass')"
+          >
+            <component :is="i18n.msg('auth-recovery-code-prompt', `${recoveryAuthnCodesInputBean.codeNumber}`)" />
+          </label>
+        </div>
+        <div :class="kcClsx('kcInputWrapperClass')">
+          <input
+            :tabindex="1"
+            id="recoveryCodeInput"
+            name="recoveryCodeInput"
+            :aria-invalid="messagesPerField.existsError('recoveryCodeInput')"
+            autocomplete="off"
+            type="text"
+            :class="kcClsx('kcInputClass')"
+            autofocus
+          />
+          <span
+            v-if="messagesPerField.existsError('recoveryCodeInput')"
+            id="input-error"
+            :class="kcClsx('kcInputErrorMessageClass')"
+            aria-live="polite"
+            v-html="kcSanitize(messagesPerField.get('recoveryCodeInput'))"
+          ></span>
+        </div>
+      </div>
+
+      <div :class="kcClsx('kcFormGroupClass')">
+        <div
+          id="kc-form-options"
+          :class="kcClsx('kcFormOptionsWrapperClass')"
+        >
+          <div :class="kcClsx('kcFormOptionsWrapperClass')"></div>
+        </div>
+        <div
+          id="kc-form-buttons"
+          :class="kcClsx('kcFormButtonsClass')"
+        >
+          <input
+            :class="kcClsx('kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonBlockClass', 'kcButtonLargeClass')"
+            name="login"
+            id="kc-login"
+            type="submit"
+            :value="i18n.msgStr('doLogIn')"
+          />
+        </div>
+      </div>
+    </form>
+  </component>
+</template>

package/keycloakify-vue/login/pages/LoginRecoveryAuthnCodeInput.vue.d.ts

@@ -0,0 +1,9 @@
+import type { KcContext } from 'keycloakify/login/KcContext';
+import type { I18n } from '../i18n/i18n';
+import type { PageProps } from './PageProps';
+type __VLS_Props = PageProps<Extract<KcContext, {
+    pageId: 'login-recovery-authn-code-input.ftl';
+}>, I18n>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/keycloakify-vue/login/pages/LoginResetOtp.vue

@@ -0,0 +1,88 @@
+<script setup lang="ts">
+import type { KcContext } from 'keycloakify/login/KcContext';
+import { getKcClsx } from 'keycloakify/login/lib/kcClsx';
+import type { I18n } from '../i18n/i18n';
+import type { PageProps } from './PageProps';
+
+const props = defineProps<PageProps<Extract<KcContext, { pageId: 'login-reset-otp.ftl' }>, I18n>>();
+
+const { kcClsx } = getKcClsx({
+  doUseDefaultCss: props.doUseDefaultCss,
+  classes: props.classes,
+});
+
+const kcContext = props.kcContext;
+const { url, messagesPerField, configuredOtpCredentials } = kcContext;
+</script>
+
+<template>
+  <component
+    :is="Template"
+    :kcContext="kcContext"
+    :i18n="i18n"
+    :doUseDefaultCss="doUseDefaultCss"
+    :classes="classes"
+    :displayMessage="!messagesPerField.existsError('totp')"
+  >
+    <template #header>
+      <component :is="i18n.msg('doLogIn')" />
+    </template>
+
+    <form
+      id="kc-otp-reset-form"
+      :class="kcClsx('kcFormClass')"
+      :action="url.loginAction"
+      method="post"
+    >
+      <div :class="kcClsx('kcInputWrapperClass')">
+        <div :class="kcClsx('kcInfoAreaWrapperClass')">
+          <p id="kc-otp-reset-form-description">
+            <component :is="i18n.msg('otp-reset-description')" />
+          </p>
+          <template
+            v-for="(otpCredential, index) in configuredOtpCredentials.userOtpCredentials"
+            :key="otpCredential.id"
+          >
+            <input
+              :id="`kc-otp-credential-${index}`"
+              :class="kcClsx('kcLoginOTPListInputClass')"
+              type="radio"
+              name="selectedCredentialId"
+              :value="otpCredential.id"
+              :checked="otpCredential.id === configuredOtpCredentials.selectedCredentialId"
+            />
+            <label
+              :for="`kc-otp-credential-${index}`"
+              :class="kcClsx('kcLoginOTPListClass')"
+              :tabindex="index"
+            >
+              <span :class="kcClsx('kcLoginOTPListItemHeaderClass')">
+                <span :class="kcClsx('kcLoginOTPListItemIconBodyClass')">
+                  <i
+                    :class="kcClsx('kcLoginOTPListItemIconClass')"
+                    aria-hidden="true"
+                  ></i>
+                </span>
+                <span :class="kcClsx('kcLoginOTPListItemTitleClass')">{{ otpCredential.userLabel }}</span>
+              </span>
+            </label>
+          </template>
+          <div :class="kcClsx('kcFormGroupClass')">
+            <div
+              id="kc-form-buttons"
+              :class="kcClsx('kcFormButtonsClass')"
+            >
+              <input
+                id="kc-otp-reset-form-submit"
+                :class="kcClsx('kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonBlockClass', 'kcButtonLargeClass')"
+                type="submit"
+                :value="i18n.msgStr('doSubmit')"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </form>
+    <div class="clearfix" />
+  </component>
+</template>

package/keycloakify-vue/login/pages/LoginResetOtp.vue.d.ts

@@ -0,0 +1,9 @@
+import type { KcContext } from 'keycloakify/login/KcContext';
+import type { I18n } from '../i18n/i18n';
+import type { PageProps } from './PageProps';
+type __VLS_Props = PageProps<Extract<KcContext, {
+    pageId: 'login-reset-otp.ftl';
+}>, I18n>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/keycloakify-vue/login/pages/LoginResetPassword.vue

@@ -0,0 +1,114 @@
+<script setup lang="ts">
+import { kcSanitize } from 'keycloakify/lib/kcSanitize';
+import type { KcContext } from 'keycloakify/login/KcContext';
+import { getKcClsx } from 'keycloakify/login/lib/kcClsx';
+import type { I18n } from '../i18n/i18n';
+import type { PageProps } from './PageProps';
+
+const props = defineProps<PageProps<Extract<KcContext, { pageId: 'login-reset-password.ftl' }>, I18n>>();
+
+const { kcClsx } = getKcClsx({
+  doUseDefaultCss: props.doUseDefaultCss,
+  classes: props.classes,
+});
+
+const kcContext = props.kcContext;
+const { url, realm, auth, messagesPerField } = kcContext;
+</script>
+
+<template>
+  <component
+    :is="Template"
+    :kcContext="kcContext"
+    :i18n="i18n"
+    :doUseDefaultCss="doUseDefaultCss"
+    :classes="classes"
+    :displayInfo="true"
+    :displayMessage="!messagesPerField.existsError('username')"
+  >
+    <template #header>
+      <component :is="i18n.msg('emailForgotTitle')" />
+    </template>
+
+    <template #info>
+      <component
+        v-if="realm.duplicateEmailsAllowed"
+        :is="i18n.msg('emailInstructionUsername')"
+      />
+      <component
+        v-else
+        :is="i18n.msg('emailInstruction')"
+      />
+    </template>
+
+    <form
+      id="kc-reset-password-form"
+      :class="kcClsx('kcFormClass')"
+      :action="url.loginAction"
+      method="post"
+    >
+      <div :class="kcClsx('kcFormGroupClass')">
+        <div :class="kcClsx('kcLabelWrapperClass')">
+          <label
+            for="username"
+            :class="kcClsx('kcLabelClass')"
+          >
+            <component
+              v-if="!realm.loginWithEmailAllowed"
+              :is="i18n.msg('username')"
+            />
+            <component
+              v-else-if="!realm.registrationEmailAsUsername"
+              :is="i18n.msg('usernameOrEmail')"
+            />
+            <component
+              v-else
+              :is="i18n.msg('email')"
+            />
+          </label>
+        </div>
+        <div :class="kcClsx('kcInputWrapperClass')">
+          <input
+            type="text"
+            id="username"
+            name="username"
+            :class="kcClsx('kcInputClass')"
+            autofocus
+            :value="auth.attemptedUsername ?? ''"
+            :aria-invalid="messagesPerField.existsError('username')"
+          />
+          <span
+            v-if="messagesPerField.existsError('username')"
+            id="input-error-username"
+            :class="kcClsx('kcInputErrorMessageClass')"
+            aria-live="polite"
+            v-html="kcSanitize(messagesPerField.get('username'))"
+          ></span>
+        </div>
+      </div>
+      <div :class="kcClsx('kcFormGroupClass', 'kcFormSettingClass')">
+        <div
+          id="kc-form-options"
+          :class="kcClsx('kcFormOptionsClass')"
+        >
+          <div :class="kcClsx('kcFormOptionsWrapperClass')">
+            <span>
+              <a :href="url.loginUrl"><component :is="i18n.msg('backToLogin')" /></a>
+            </span>
+          </div>
+        </div>
+
+        <div
+          id="kc-form-buttons"
+          :class="kcClsx('kcFormButtonsClass')"
+        >
+          <input
+            :class="kcClsx('kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonBlockClass', 'kcButtonLargeClass')"
+            type="submit"
+            :value="i18n.msgStr('doSubmit')"
+          />
+        </div>
+      </div>
+    </form>
+  </component>
+</template>

package/keycloakify-vue/login/pages/LoginResetPassword.vue.d.ts

@@ -0,0 +1,9 @@
+import type { KcContext } from 'keycloakify/login/KcContext';
+import type { I18n } from '../i18n/i18n';
+import type { PageProps } from './PageProps';
+type __VLS_Props = PageProps<Extract<KcContext, {
+    pageId: 'login-reset-password.ftl';
+}>, I18n>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;