@vue-skuilder/common-ui 0.2.35 → 0.2.37

package/dist/components/auth/ResetPassword.vue_vue_type_script_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResetPassword.vue_vue_type_script_lang.mjs","names":[],"sources":["../../../src/components/auth/ResetPassword.vue"],"sourcesContent":["<template>\n  <v-container class=\"fill-height\" fluid>\n    <v-row align=\"center\" justify=\"center\">\n      <v-col cols=\"12\" sm=\"8\" md=\"6\">\n        <v-card>\n          <v-card-title class=\"text-h5 bg-grey-lighten-2\">\n            Set New Password\n          </v-card-title>\n\n          <v-card-text class=\"pa-6\">\n            <v-form v-if=\"!isComplete\" @submit.prevent=\"handleSubmit\">\n              <p class=\"mb-4\">Enter your new password below.</p>\n\n              <v-text-field\n                v-model=\"password\"\n                prepend-icon=\"mdi-lock\"\n                name=\"password\"\n                label=\"New password\"\n                min=\"4\"\n                :append-icon=\"passwordVisible ? 'mdi-eye-off' : 'mdi-eye'\"\n                :type=\"passwordVisible ? 'text' : 'password'\"\n                :disabled=\"isSubmitting\"\n                @click:append=\"() => (passwordVisible = !passwordVisible)\"\n              ></v-text-field>\n\n              <v-text-field\n                v-model=\"confirmPassword\"\n                prepend-icon=\"mdi-lock\"\n                name=\"confirmPassword\"\n                label=\"Confirm new password\"\n                min=\"4\"\n                :type=\"passwordVisible ? 'text' : 'password'\"\n                :error=\"confirmPasswordError\"\n                :hint=\"confirmPasswordHint\"\n                :disabled=\"isSubmitting\"\n                @blur=\"validateConfirmPassword\"\n              ></v-text-field>\n\n              <v-btn\n                type=\"submit\"\n                color=\"primary\"\n                class=\"mt-4\"\n                :loading=\"isSubmitting\"\n                :disabled=\"!canSubmit\"\n                block\n              >\n                <v-icon start>mdi-lock-reset</v-icon>\n                Reset Password\n              </v-btn>\n            </v-form>\n\n            <!-- Success state -->\n            <div v-else class=\"text-center\">\n              <v-icon color=\"success\" size=\"64\" class=\"mb-4\">mdi-check-circle</v-icon>\n              <h3 class=\"mb-2\">Password Reset Successful!</h3>\n              <p>Your password has been updated. You can now log in with your new password.</p>\n            </div>\n          </v-card-text>\n\n          <v-card-actions v-if=\"isComplete\">\n            <v-spacer></v-spacer>\n            <slot name=\"success-action\">\n              <!-- External apps can provide their own navigation -->\n              <v-btn color=\"primary\" @click=\"$emit('complete')\">\n                Continue to Login\n              </v-btn>\n            </slot>\n          </v-card-actions>\n        </v-card>\n      </v-col>\n    </v-row>\n  </v-container>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent } from 'vue';\nimport { resetPassword } from '../../services/authAPI';\nimport { alertUser } from '../SnackbarService';\nimport { Status } from '@vue-skuilder/common';\n\nexport default defineComponent({\n  name: 'ResetPassword',\n\n  emits: ['complete', 'error'],\n\n  props: {\n    /**\n     * Reset token. If not provided, will try to read from URL query params.\n     */\n    token: {\n      type: String,\n      default: null,\n    },\n  },\n\n  data() {\n    return {\n      password: '',\n      confirmPassword: '',\n      passwordVisible: false,\n      confirmPasswordError: false,\n      confirmPasswordHint: '',\n      isSubmitting: false,\n      isComplete: false,\n    };\n  },\n\n  computed: {\n    canSubmit(): boolean {\n      return (\n        this.password.length >= 4 &&\n        this.confirmPassword.length >= 4 &&\n        this.password === this.confirmPassword &&\n        !this.confirmPasswordError\n      );\n    },\n  },\n\n  methods: {\n    validateConfirmPassword() {\n      this.confirmPasswordError = false;\n      this.confirmPasswordHint = '';\n\n      if (!this.confirmPassword) return;\n\n      if (this.password !== this.confirmPassword) {\n        this.confirmPasswordError = true;\n        this.confirmPasswordHint = 'Passwords do not match';\n      }\n    },\n\n    async handleSubmit() {\n      this.validateConfirmPassword();\n\n      if (!this.canSubmit) {\n        return;\n      }\n\n      // Get token from prop or URL query params\n      const token = this.token || this.getTokenFromURL();\n\n      if (!token) {\n        alertUser({\n          text: 'No reset token provided. Please use the link from your email.',\n          status: Status.error,\n        });\n        this.$emit('error', 'No token');\n        return;\n      }\n\n      this.isSubmitting = true;\n\n      try {\n        const result = await resetPassword(token, this.password);\n\n        if (result.ok) {\n          this.isComplete = true;\n          alertUser({\n            text: 'Password reset successfully!',\n            status: Status.ok,\n          });\n        } else {\n          alertUser({\n            text: result.error || 'Failed to reset password',\n            status: Status.error,\n          });\n          this.$emit('error', result.error);\n        }\n      } catch (error) {\n        alertUser({\n          text: 'An unexpected error occurred',\n          status: Status.error,\n        });\n        this.$emit('error', 'Unexpected error');\n      } finally {\n        this.isSubmitting = false;\n      }\n    },\n\n    getTokenFromURL(): string | null {\n      if (typeof window === 'undefined') return null;\n\n      const params = new URLSearchParams(window.location.search);\n      return params.get('token');\n    },\n  },\n});\n</script>\n"],"mappings":";;;;;;AAgFA,IAAA,IAAe,EAAgB;CAC7B,MAAM;CAEN,OAAO,CAAC,YAAY,QAAQ;CAE5B,OAAO,EAIL,OAAO;EACL,MAAM;EACN,SAAS;EACV,EACF;CAED,OAAO;AACL,SAAO;GACL,UAAU;GACV,iBAAiB;GACjB,iBAAiB;GACjB,sBAAsB;GACtB,qBAAqB;GACrB,cAAc;GACd,YAAY;GACb;;CAGH,UAAU,EACR,YAAqB;AACnB,SACE,KAAK,SAAS,UAAU,KACxB,KAAK,gBAAgB,UAAU,KAC/B,KAAK,aAAa,KAAK,mBACvB,CAAC,KAAK;IAGX;CAED,SAAS;EACP,0BAA0B;AACxB,QAAK,uBAAuB,IAC5B,KAAK,sBAAsB,IAEtB,KAAK,mBAEN,KAAK,aAAa,KAAK,oBACzB,KAAK,uBAAuB,IAC5B,KAAK,sBAAsB;;EAI/B,MAAM,eAAe;AAGnB,OAFA,KAAK,yBAAyB,EAE1B,CAAC,KAAK,UACR;GAIF,IAAM,IAAQ,KAAK,SAAS,KAAK,iBAAiB;AAElD,OAAI,CAAC,GAAO;AAKV,IAJA,EAAU;KACR,MAAM;KACN,QAAQ,EAAO;KAChB,CAAC,EACF,KAAK,MAAM,SAAS,WAAW;AAC/B;;AAGF,QAAK,eAAe;AAEpB,OAAI;IACF,IAAM,IAAS,MAAM,EAAc,GAAO,KAAK,SAAS;AAExD,IAAI,EAAO,MACT,KAAK,aAAa,IAClB,EAAU;KACR,MAAM;KACN,QAAQ,EAAO;KAChB,CAAC,KAEF,EAAU;KACR,MAAM,EAAO,SAAS;KACtB,QAAQ,EAAO;KAChB,CAAC,EACF,KAAK,MAAM,SAAS,EAAO,MAAM;WAErB;AAKd,IAJA,EAAU;KACR,MAAM;KACN,QAAQ,EAAO;KAChB,CAAC,EACF,KAAK,MAAM,SAAS,mBAAmB;aAC/B;AACR,SAAK,eAAe;;;EAIxB,kBAAiC;AAI/B,UAHI,OAAO,SAAW,MAAoB,OAE3B,IAAI,gBAAgB,OAAO,SAAS,OAAO,CAC5C,IAAI,QAAQ;;EAE7B;CACF,CAAC"}

package/dist/components/auth/UserChip.mjs

@@ -0,0 +1,9 @@
+import e from "../../_virtual/_plugin-vue_export-helper.mjs";
+import t from "./UserChip.vue_vue_type_script_setup_true_lang.mjs";
+/* empty css                                                          */
+//#region src/components/auth/UserChip.vue
+var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-9a38a213"]]);
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=UserChip.mjs.map

package/dist/components/auth/UserChip.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserChip.mjs","names":[],"sources":["../../../src/components/auth/UserChip.vue"],"sourcesContent":["<template>\n  <v-badge :content=\"items.length\" :model-value=\"hasNewItems\" color=\"accent\" location=\"end top\">\n    <v-menu location=\"bottom end\" transition=\"scale-transition\">\n      <template #activator=\"{ props }\">\n        <v-chip v-bind=\"props\" class=\"ma-2\">\n          <v-avatar start class=\"bg-primary\">\n            <v-icon>mdi-school</v-icon>\n          </v-avatar>\n          {{ username }}\n        </v-chip>\n      </template>\n\n      <v-list>\n        <v-list-item v-for=\"item in items\" :key=\"item\" @click=\"dismiss(item)\">\n          <v-list-item-title>{{ item }}</v-list-item-title>\n        </v-list-item>\n\n        <v-divider v-if=\"items.length\" />\n\n        <v-list-item @click=\"gotoStats\">\n          <template #prepend>\n            <v-icon>mdi-trending-up</v-icon>\n          </template>\n          <v-list-item-title>Stats</v-list-item-title>\n        </v-list-item>\n\n        <v-list-item @click=\"gotoSettings\">\n          <template #prepend>\n            <v-icon>mdi-cog</v-icon>\n          </template>\n          <v-list-item-title>Settings</v-list-item-title>\n        </v-list-item>\n\n        <v-list-item v-if=\"authUIConfig.showLogout\" @click=\"logout\">\n          <template #prepend>\n            <v-icon>mdi-logout</v-icon>\n          </template>\n          <v-list-item-title>{{ authUIConfig.logoutLabel }}</v-list-item-title>\n        </v-list-item>\n\n        <v-list-item v-if=\"authUIConfig.showResetData\" @click=\"showResetDialog = true\">\n          <template #prepend>\n            <v-icon>mdi-delete-sweep</v-icon>\n          </template>\n          <v-list-item-title>{{ authUIConfig.resetLabel }}</v-list-item-title>\n        </v-list-item>\n      </v-list>\n    </v-menu>\n  </v-badge>\n\n  <!-- Reset Confirmation Dialog -->\n  <v-dialog v-model=\"showResetDialog\" max-width=\"500px\" persistent>\n    <v-card>\n      <v-card-title class=\"text-h5 d-flex align-center\">\n        <v-icon color=\"warning\" class=\"mr-3\">mdi-alert-circle</v-icon>\n        Reset All User Data\n      </v-card-title>\n      \n      <v-card-text>\n        <p class=\"mb-4\">This will permanently delete:</p>\n        <ul class=\"mb-4\">\n          <li>All course progress and history</li>\n          <li>Scheduled card reviews</li>\n          <li>Course registrations</li>\n          <li>User preferences</li>\n        </ul>\n        <p class=\"mb-4 text-error font-weight-bold\">This cannot be undone.</p>\n        \n        <v-text-field\n          v-model=\"confirmationText\"\n          label='Type \"reset\" to confirm'\n          outlined\n          dense\n          @keyup.enter=\"isConfirmationValid && executeReset()\"\n        />\n      </v-card-text>\n      \n      <v-card-actions>\n        <v-spacer />\n        <v-btn text @click=\"resetDialogState\">Cancel</v-btn>\n        <v-btn \n          color=\"error\" \n          :disabled=\"!isConfirmationValid\"\n          @click=\"executeReset\"\n        >\n          Reset All Data\n        </v-btn>\n      </v-card-actions>\n    </v-card>\n  </v-dialog>\n</template>\n\n<script lang=\"ts\" setup>\nimport { ref, computed, onMounted } from 'vue';\nimport { useRouter } from 'vue-router';\nimport { getCurrentUser, useAuthStore } from '../../stores/useAuthStore';\nimport { useConfigStore } from '../../stores/useConfigStore';\nimport { useAuthUI } from '../../composables/useAuthUI';\n\n// Define props (even if not used, prevents warnings)\ndefineProps<{\n  showLoginButton?: boolean;\n  redirectToPath?: string;\n}>();\n\nconst router = useRouter();\nconst authStore = useAuthStore();\nconst configStore = useConfigStore();\nconst authUI = useAuthUI();\n\nconst username = ref('');\nconst items = ref<string[]>([]);\n\n// Reset confirmation dialog state\nconst showResetDialog = ref(false);\nconst confirmationText = ref('');\n\nconst isConfirmationValid = computed(() => confirmationText.value === 'reset');\n\nconst resetDialogState = () => {\n  confirmationText.value = '';\n  showResetDialog.value = false;\n};\n\nconst hasNewItems = computed(() => items.value.length > 0);\n\nconst authUIConfig = computed(() => {\n  const configValue = authUI.config.value;\n  const fallback = {\n    showLoginRegistration: true,\n    showLogout: true,\n    showResetData: false,\n    logoutLabel: 'Log out',\n    resetLabel: '',\n  };\n  \n  return configValue || fallback;\n});\n\nonMounted(async () => {\n  const user = await getCurrentUser();\n  username.value = user.getUsername();\n  \n  // Detect sync strategy for conditional UI\n  await authUI.detectSyncStrategy();\n});\n\nconst gotoSettings = async () => {\n  router.push(`/u/${(await getCurrentUser()).getUsername()}`);\n};\n\nconst gotoStats = async () => {\n  router.push(`/u/${(await getCurrentUser()).getUsername()}/stats`);\n};\n\nconst dismiss = (item: string) => {\n  const index = items.value.indexOf(item);\n  items.value.splice(index, 1);\n};\n\nconst logout = async () => {\n  const res = await authStore._user!.logout();\n  if (res.ok) {\n    authStore.loginAndRegistration = {\n      init: true,\n      loggedIn: false,\n      regDialogOpen: false,\n      loginDialogOpen: false,\n    };\n\n    configStore.resetDefaults();\n    router.push('/home');\n  }\n};\n\nconst executeReset = async () => {\n  try {\n    await authStore.resetUserData();\n    configStore.resetDefaults();\n    \n    // Close dialog and navigate to home\n    resetDialogState();\n    router.push('/home');\n  } catch (error) {\n    console.error('Failed to reset user data:', error);\n    // Could add a snackbar notification here\n  }\n};\n</script>\n\n<style scoped>\n.component-fade-enter-active,\n.component-fade-leave-active {\n  transition: opacity 0.5s ease;\n}\n.component-fade-enter,\n.component-fade-leave-to {\n  opacity: 0;\n}\n</style>"],"mappings":""}

package/dist/components/auth/UserChip.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,213 @@
+import "../../_virtual/_rolldown/runtime.mjs";
+import { getCurrentUser as e, useAuthStore as t } from "../../stores/useAuthStore.mjs";
+import { useConfigStore as n } from "../../stores/useConfigStore.mjs";
+import { useAuthUI as r } from "../../composables/useAuthUI.mjs";
+import { Fragment as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createTextVNode as u, createVNode as d, defineComponent as f, mergeProps as p, onMounted as m, openBlock as h, ref as g, renderList as _, resolveComponent as v, toDisplayString as y, withCtx as b, withKeys as x } from "vue";
+import { useRouter as S } from "vue-router";
+//#region src/components/auth/UserChip.vue?vue&type=script&setup=true&lang.ts
+var C = /* @__PURE__ */ f({
+	__name: "UserChip",
+	props: {
+		showLoginButton: { type: Boolean },
+		redirectToPath: {}
+	},
+	setup(f) {
+		let C = S(), w = t(), T = n(), E = r(), D = g(""), O = g([]), k = g(!1), A = g(""), j = a(() => A.value === "reset"), resetDialogState = () => {
+			A.value = "", k.value = !1;
+		}, M = a(() => O.value.length > 0), N = a(() => E.config.value || {
+			showLoginRegistration: !0,
+			showLogout: !0,
+			showResetData: !1,
+			logoutLabel: "Log out",
+			resetLabel: ""
+		});
+		m(async () => {
+			D.value = (await e()).getUsername(), await E.detectSyncStrategy();
+		});
+		let gotoSettings = async () => {
+			C.push(`/u/${(await e()).getUsername()}`);
+		}, gotoStats = async () => {
+			C.push(`/u/${(await e()).getUsername()}/stats`);
+		}, dismiss = (e) => {
+			let t = O.value.indexOf(e);
+			O.value.splice(t, 1);
+		}, logout = async () => {
+			(await w._user.logout()).ok && (w.loginAndRegistration = {
+				init: !0,
+				loggedIn: !1,
+				regDialogOpen: !1,
+				loginDialogOpen: !1
+			}, T.resetDefaults(), C.push("/home"));
+		}, executeReset = async () => {
+			try {
+				await w.resetUserData(), T.resetDefaults(), resetDialogState(), C.push("/home");
+			} catch (e) {
+				console.error("Failed to reset user data:", e);
+			}
+		};
+		return (e, t) => {
+			let n = v("v-icon"), r = v("v-avatar"), a = v("v-chip"), f = v("v-list-item-title"), m = v("v-list-item"), g = v("v-divider"), S = v("v-list"), C = v("v-menu"), w = v("v-badge"), T = v("v-card-title"), E = v("v-text-field"), P = v("v-card-text"), F = v("v-spacer"), I = v("v-btn"), L = v("v-card-actions"), R = v("v-card"), z = v("v-dialog");
+			return h(), c(i, null, [d(w, {
+				content: O.value.length,
+				"model-value": M.value,
+				color: "accent",
+				location: "end top"
+			}, {
+				default: b(() => [d(C, {
+					location: "bottom end",
+					transition: "scale-transition"
+				}, {
+					activator: b(({ props: e }) => [d(a, p(e, { class: "ma-2" }), {
+						default: b(() => [d(r, {
+							start: "",
+							class: "bg-primary"
+						}, {
+							default: b(() => [d(n, null, {
+								default: b(() => t[4] || (t[4] = [u("mdi-school")])),
+								_: 1
+							})]),
+							_: 1
+						}), u(" " + y(D.value), 1)]),
+						_: 2
+					}, 1040)]),
+					default: b(() => [d(S, null, {
+						default: b(() => [
+							(h(!0), c(i, null, _(O.value, (e) => (h(), o(m, {
+								key: e,
+								onClick: (t) => dismiss(e)
+							}, {
+								default: b(() => [d(f, null, {
+									default: b(() => [u(y(e), 1)]),
+									_: 2
+								}, 1024)]),
+								_: 2
+							}, 1032, ["onClick"]))), 128)),
+							O.value.length ? (h(), o(g, { key: 0 })) : s("", !0),
+							d(m, { onClick: gotoStats }, {
+								prepend: b(() => [d(n, null, {
+									default: b(() => t[5] || (t[5] = [u("mdi-trending-up")])),
+									_: 1
+								})]),
+								default: b(() => [d(f, null, {
+									default: b(() => t[6] || (t[6] = [u("Stats")])),
+									_: 1
+								})]),
+								_: 1
+							}),
+							d(m, { onClick: gotoSettings }, {
+								prepend: b(() => [d(n, null, {
+									default: b(() => t[7] || (t[7] = [u("mdi-cog")])),
+									_: 1
+								})]),
+								default: b(() => [d(f, null, {
+									default: b(() => t[8] || (t[8] = [u("Settings")])),
+									_: 1
+								})]),
+								_: 1
+							}),
+							N.value.showLogout ? (h(), o(m, {
+								key: 1,
+								onClick: logout
+							}, {
+								prepend: b(() => [d(n, null, {
+									default: b(() => t[9] || (t[9] = [u("mdi-logout")])),
+									_: 1
+								})]),
+								default: b(() => [d(f, null, {
+									default: b(() => [u(y(N.value.logoutLabel), 1)]),
+									_: 1
+								})]),
+								_: 1
+							})) : s("", !0),
+							N.value.showResetData ? (h(), o(m, {
+								key: 2,
+								onClick: t[0] || (t[0] = (e) => k.value = !0)
+							}, {
+								prepend: b(() => [d(n, null, {
+									default: b(() => t[10] || (t[10] = [u("mdi-delete-sweep")])),
+									_: 1
+								})]),
+								default: b(() => [d(f, null, {
+									default: b(() => [u(y(N.value.resetLabel), 1)]),
+									_: 1
+								})]),
+								_: 1
+							})) : s("", !0)
+						]),
+						_: 1
+					})]),
+					_: 1
+				})]),
+				_: 1
+			}, 8, ["content", "model-value"]), d(z, {
+				modelValue: k.value,
+				"onUpdate:modelValue": t[3] || (t[3] = (e) => k.value = e),
+				"max-width": "500px",
+				persistent: ""
+			}, {
+				default: b(() => [d(R, null, {
+					default: b(() => [
+						d(T, { class: "text-h5 d-flex align-center" }, {
+							default: b(() => [d(n, {
+								color: "warning",
+								class: "mr-3"
+							}, {
+								default: b(() => t[11] || (t[11] = [u("mdi-alert-circle")])),
+								_: 1
+							}), t[12] || (t[12] = u(" Reset All User Data "))]),
+							_: 1
+						}),
+						d(P, null, {
+							default: b(() => [
+								t[13] || (t[13] = l("p", { class: "mb-4" }, "This will permanently delete:", -1)),
+								t[14] || (t[14] = l("ul", { class: "mb-4" }, [
+									l("li", null, "All course progress and history"),
+									l("li", null, "Scheduled card reviews"),
+									l("li", null, "Course registrations"),
+									l("li", null, "User preferences")
+								], -1)),
+								t[15] || (t[15] = l("p", { class: "mb-4 text-error font-weight-bold" }, "This cannot be undone.", -1)),
+								d(E, {
+									modelValue: A.value,
+									"onUpdate:modelValue": t[1] || (t[1] = (e) => A.value = e),
+									label: "Type \"reset\" to confirm",
+									outlined: "",
+									dense: "",
+									onKeyup: t[2] || (t[2] = x((e) => j.value && executeReset(), ["enter"]))
+								}, null, 8, ["modelValue"])
+							]),
+							_: 1
+						}),
+						d(L, null, {
+							default: b(() => [
+								d(F),
+								d(I, {
+									text: "",
+									onClick: resetDialogState
+								}, {
+									default: b(() => t[16] || (t[16] = [u("Cancel")])),
+									_: 1
+								}),
+								d(I, {
+									color: "error",
+									disabled: !j.value,
+									onClick: executeReset
+								}, {
+									default: b(() => t[17] || (t[17] = [u(" Reset All Data ")])),
+									_: 1
+								}, 8, ["disabled"])
+							]),
+							_: 1
+						})
+					]),
+					_: 1
+				})]),
+				_: 1
+			}, 8, ["modelValue"])], 64);
+		};
+	}
+});
+//#endregion
+export { C as default };
+
+//# sourceMappingURL=UserChip.vue_vue_type_script_setup_true_lang.mjs.map

package/dist/components/auth/UserChip.vue_vue_type_script_setup_true_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserChip.vue_vue_type_script_setup_true_lang.mjs","names":[],"sources":["../../../src/components/auth/UserChip.vue"],"sourcesContent":["<template>\n  <v-badge :content=\"items.length\" :model-value=\"hasNewItems\" color=\"accent\" location=\"end top\">\n    <v-menu location=\"bottom end\" transition=\"scale-transition\">\n      <template #activator=\"{ props }\">\n        <v-chip v-bind=\"props\" class=\"ma-2\">\n          <v-avatar start class=\"bg-primary\">\n            <v-icon>mdi-school</v-icon>\n          </v-avatar>\n          {{ username }}\n        </v-chip>\n      </template>\n\n      <v-list>\n        <v-list-item v-for=\"item in items\" :key=\"item\" @click=\"dismiss(item)\">\n          <v-list-item-title>{{ item }}</v-list-item-title>\n        </v-list-item>\n\n        <v-divider v-if=\"items.length\" />\n\n        <v-list-item @click=\"gotoStats\">\n          <template #prepend>\n            <v-icon>mdi-trending-up</v-icon>\n          </template>\n          <v-list-item-title>Stats</v-list-item-title>\n        </v-list-item>\n\n        <v-list-item @click=\"gotoSettings\">\n          <template #prepend>\n            <v-icon>mdi-cog</v-icon>\n          </template>\n          <v-list-item-title>Settings</v-list-item-title>\n        </v-list-item>\n\n        <v-list-item v-if=\"authUIConfig.showLogout\" @click=\"logout\">\n          <template #prepend>\n            <v-icon>mdi-logout</v-icon>\n          </template>\n          <v-list-item-title>{{ authUIConfig.logoutLabel }}</v-list-item-title>\n        </v-list-item>\n\n        <v-list-item v-if=\"authUIConfig.showResetData\" @click=\"showResetDialog = true\">\n          <template #prepend>\n            <v-icon>mdi-delete-sweep</v-icon>\n          </template>\n          <v-list-item-title>{{ authUIConfig.resetLabel }}</v-list-item-title>\n        </v-list-item>\n      </v-list>\n    </v-menu>\n  </v-badge>\n\n  <!-- Reset Confirmation Dialog -->\n  <v-dialog v-model=\"showResetDialog\" max-width=\"500px\" persistent>\n    <v-card>\n      <v-card-title class=\"text-h5 d-flex align-center\">\n        <v-icon color=\"warning\" class=\"mr-3\">mdi-alert-circle</v-icon>\n        Reset All User Data\n      </v-card-title>\n      \n      <v-card-text>\n        <p class=\"mb-4\">This will permanently delete:</p>\n        <ul class=\"mb-4\">\n          <li>All course progress and history</li>\n          <li>Scheduled card reviews</li>\n          <li>Course registrations</li>\n          <li>User preferences</li>\n        </ul>\n        <p class=\"mb-4 text-error font-weight-bold\">This cannot be undone.</p>\n        \n        <v-text-field\n          v-model=\"confirmationText\"\n          label='Type \"reset\" to confirm'\n          outlined\n          dense\n          @keyup.enter=\"isConfirmationValid && executeReset()\"\n        />\n      </v-card-text>\n      \n      <v-card-actions>\n        <v-spacer />\n        <v-btn text @click=\"resetDialogState\">Cancel</v-btn>\n        <v-btn \n          color=\"error\" \n          :disabled=\"!isConfirmationValid\"\n          @click=\"executeReset\"\n        >\n          Reset All Data\n        </v-btn>\n      </v-card-actions>\n    </v-card>\n  </v-dialog>\n</template>\n\n<script lang=\"ts\" setup>\nimport { ref, computed, onMounted } from 'vue';\nimport { useRouter } from 'vue-router';\nimport { getCurrentUser, useAuthStore } from '../../stores/useAuthStore';\nimport { useConfigStore } from '../../stores/useConfigStore';\nimport { useAuthUI } from '../../composables/useAuthUI';\n\n// Define props (even if not used, prevents warnings)\ndefineProps<{\n  showLoginButton?: boolean;\n  redirectToPath?: string;\n}>();\n\nconst router = useRouter();\nconst authStore = useAuthStore();\nconst configStore = useConfigStore();\nconst authUI = useAuthUI();\n\nconst username = ref('');\nconst items = ref<string[]>([]);\n\n// Reset confirmation dialog state\nconst showResetDialog = ref(false);\nconst confirmationText = ref('');\n\nconst isConfirmationValid = computed(() => confirmationText.value === 'reset');\n\nconst resetDialogState = () => {\n  confirmationText.value = '';\n  showResetDialog.value = false;\n};\n\nconst hasNewItems = computed(() => items.value.length > 0);\n\nconst authUIConfig = computed(() => {\n  const configValue = authUI.config.value;\n  const fallback = {\n    showLoginRegistration: true,\n    showLogout: true,\n    showResetData: false,\n    logoutLabel: 'Log out',\n    resetLabel: '',\n  };\n  \n  return configValue || fallback;\n});\n\nonMounted(async () => {\n  const user = await getCurrentUser();\n  username.value = user.getUsername();\n  \n  // Detect sync strategy for conditional UI\n  await authUI.detectSyncStrategy();\n});\n\nconst gotoSettings = async () => {\n  router.push(`/u/${(await getCurrentUser()).getUsername()}`);\n};\n\nconst gotoStats = async () => {\n  router.push(`/u/${(await getCurrentUser()).getUsername()}/stats`);\n};\n\nconst dismiss = (item: string) => {\n  const index = items.value.indexOf(item);\n  items.value.splice(index, 1);\n};\n\nconst logout = async () => {\n  const res = await authStore._user!.logout();\n  if (res.ok) {\n    authStore.loginAndRegistration = {\n      init: true,\n      loggedIn: false,\n      regDialogOpen: false,\n      loginDialogOpen: false,\n    };\n\n    configStore.resetDefaults();\n    router.push('/home');\n  }\n};\n\nconst executeReset = async () => {\n  try {\n    await authStore.resetUserData();\n    configStore.resetDefaults();\n    \n    // Close dialog and navigate to home\n    resetDialogState();\n    router.push('/home');\n  } catch (error) {\n    console.error('Failed to reset user data:', error);\n    // Could add a snackbar notification here\n  }\n};\n</script>\n\n<style scoped>\n.component-fade-enter-active,\n.component-fade-leave-active {\n  transition: opacity 0.5s ease;\n}\n.component-fade-enter,\n.component-fade-leave-to {\n  opacity: 0;\n}\n</style>"],"mappings":";;;;;;;;;;;;;;EAyGA,IAAM,IAAS,GAAW,EACpB,IAAY,GAAc,EAC1B,IAAc,GAAgB,EAC9B,IAAS,GAAW,EAEpB,IAAW,EAAI,GAAG,EAClB,IAAQ,EAAc,EAAE,CAAC,EAGzB,IAAkB,EAAI,GAAM,EAC5B,IAAmB,EAAI,GAAG,EAE1B,IAAsB,QAAe,EAAiB,UAAU,QAAQ,EAExE,yBAAyB;AAE7B,GADA,EAAiB,QAAQ,IACzB,EAAgB,QAAQ;KAGpB,IAAc,QAAe,EAAM,MAAM,SAAS,EAAE,EAEpD,IAAe,QACC,EAAO,OAAO,SACjB;GACf,uBAAuB;GACvB,YAAY;GACZ,eAAe;GACf,aAAa;GACb,YAAY;GACb,CAGD;AAEF,IAAU,YAAY;AAKpB,GAHA,EAAS,SADI,MAAM,GAAgB,EACb,aAAa,EAGnC,MAAM,EAAO,oBAAoB;IACjC;EAEF,IAAM,eAAe,YAAY;AAC/B,KAAO,KAAK,OAAO,MAAM,GAAgB,EAAE,aAAa,GAAG;KAGvD,YAAY,YAAY;AAC5B,KAAO,KAAK,OAAO,MAAM,GAAgB,EAAE,aAAa,CAAC,QAAQ;KAG7D,WAAW,MAAiB;GAChC,IAAM,IAAQ,EAAM,MAAM,QAAQ,EAAK;AACvC,KAAM,MAAM,OAAO,GAAO,EAAE;KAGxB,SAAS,YAAY;AAEzB,IADY,MAAM,EAAU,MAAO,QAAQ,EACnC,OACN,EAAU,uBAAuB;IAC/B,MAAM;IACN,UAAU;IACV,eAAe;IACf,iBAAiB;IAClB,EAED,EAAY,eAAe,EAC3B,EAAO,KAAK,QAAQ;KAIlB,eAAe,YAAY;AAC/B,OAAI;AAMF,IALA,MAAM,EAAU,eAAe,EAC/B,EAAY,eAAe,EAG3B,kBAAkB,EAClB,EAAO,KAAK,QAAQ;YACb,GAAO;AACd,YAAQ,MAAM,8BAA8B,EAAM"}

package/dist/components/auth/UserLogin.mjs

@@ -0,0 +1,9 @@
+import e from "../../_virtual/_plugin-vue_export-helper.mjs";
+import t from "./UserLogin.vue_vue_type_script_setup_true_lang.mjs";
+/* empty css                                                           */
+//#region src/components/auth/UserLogin.vue
+var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-764d1a76"]]);
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=UserLogin.mjs.map

package/dist/components/auth/UserLogin.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserLogin.mjs","names":[],"sources":["../../../src/components/auth/UserLogin.vue"],"sourcesContent":["<template>\n  <v-card>\n    <v-card-title v-if=\"!loginRoute\" class=\"text-h5 bg-grey-lighten-2\">Log In</v-card-title>\n\n    <v-card-text>\n      <v-form onsubmit=\"return false;\" @submit.prevent=\"login\">\n        <v-text-field\n          id=\"\"\n          v-model=\"identifier\"\n          autofocus\n          name=\"username\"\n          label=\"Username or email\"\n          prepend-icon=\"mdi-account-circle\"\n        ></v-text-field>\n        <v-text-field\n          v-model=\"password\"\n          prepend-icon=\"mdi-lock\"\n          name=\"password\"\n          hover=\"Show password input\"\n          label=\"Enter your password\"\n          hint=\"\"\n          min=\"0\"\n          :append-icon=\"passwordVisible ? 'mdi-eye-off' : 'mdi-eye'\"\n          :type=\"passwordVisible ? 'text' : 'password'\"\n          @click:append=\"() => (passwordVisible = !passwordVisible)\"\n        ></v-text-field>\n\n        <v-snackbar v-model=\"badLoginAttempt\" location=\"bottom right\" :timeout=\"errorTimeout\">\n          {{ errorMessage }}\n          <v-btn color=\"pink\" variant=\"text\" @click=\"badLoginAttempt = false\">Close</v-btn>\n        </v-snackbar>\n\n        <div class=\"d-flex flex-column align-start\">\n          <div class=\"mb-2\">\n            <v-btn class=\"mr-2\" type=\"submit\" :loading=\"awaitingResponse\" :color=\"buttonStatus.color\">\n              <v-icon start>mdi-lock-open</v-icon>\n              Log In\n            </v-btn>\n            <router-link v-if=\"loginRoute\" to=\"signup\">\n              <v-btn variant=\"text\">Create New Account</v-btn>\n            </router-link>\n            <v-btn v-else variant=\"text\" @click=\"toggle\">Create New Account</v-btn>\n          </div>\n\n          <slot name=\"forgot-password\">\n            <!-- Default: always show forgot password link -->\n            <a\n              href=\"#\"\n              class=\"text-caption text-decoration-none\"\n              @click.prevent=\"handleForgotPassword\"\n            >\n              Forgot password?\n            </a>\n          </slot>\n        </div>\n      </v-form>\n    </v-card-text>\n  </v-card>\n</template>\n\n<script lang=\"ts\" setup>\nimport { ref, computed } from 'vue';\nimport { useRouter, useRoute } from 'vue-router';\nimport { alertUser } from '../SnackbarService';\nimport { log } from '@vue-skuilder/common';\nimport { Status } from '@vue-skuilder/common';\nimport { User } from '@vue-skuilder/db';\nimport { getCurrentUser, useAuthStore } from '../../stores/useAuthStore';\nimport { useConfigStore } from '../../stores/useConfigStore';\nimport { resolveLoginIdentifier } from '../../services/authAPI';\n\n// Define props\ninterface Props {\n  redirectTo?: string;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  redirectTo: '/study'\n});\n\n// Define emits for toggle, cleanup, and forgot password\nconst emit = defineEmits<{\n  toggle: [];\n  loginSuccess: [redirectPath: string];\n  forgotPassword: [];\n}>();\n\nconst router = useRouter();\nconst route = useRoute();\nconst authStore = useAuthStore();\nconst configStore = useConfigStore();\n\n// Holds a username OR an email address (see login()).\nconst identifier = ref('');\nconst password = ref('');\nconst passwordVisible = ref(false);\nconst awaitingResponse = ref(false);\nconst badLoginAttempt = ref(false);\nconst errorTimeout = ref(7000);\nconst errorMessage = ref('Username or password was incorrect.');\n\n// Shown when the email→username resolver is unreachable (route missing / 5xx /\n// network) rather than when credentials are actually wrong. Telling the two\n// apart matters: \"wrong password\" sends the user to re-check what is in fact\n// correct, and hides a real backend outage.\nconst BAD_CREDENTIALS_MSG = 'Username or password was incorrect.';\nconst LOGIN_UNAVAILABLE_MSG =\n  'Login is temporarily unavailable. Please try again in a moment.';\nconst user = ref<User | undefined>(undefined);\n\nconst loginRoute = computed(() => route.name === 'login');\n\nconst buttonStatus = computed(() => ({\n  color: badLoginAttempt.value ? 'error' : 'success',\n  text: badLoginAttempt.value ? 'Try again' : 'Log In',\n}));\n\nconst initBadLogin = (message: string = BAD_CREDENTIALS_MSG) => {\n  errorMessage.value = message;\n  badLoginAttempt.value = true;\n\n  alertUser({\n    text: message,\n    status: Status.error,\n    timeout: errorTimeout.value,\n  });\n  setTimeout(() => {\n    badLoginAttempt.value = false;\n  }, errorTimeout.value);\n};\n\nconst login = async () => {\n  awaitingResponse.value = true;\n  log('Starting login attempt');\n  log(`Login attempt for identifier: ${identifier.value}`);\n\n  try {\n    log('Attempting to get User instance');\n    // #172 starting point - why is the pre-existing _user being referenced here?\n    user.value = await getCurrentUser();\n    log('Got User instance, attempting login');\n\n    // Couch _session authenticates by username only. When the identifier is an\n    // email, resolve it to the account username first — server-side and gated\n    // on the correct password, so it can't be used to enumerate accounts. A\n    // plain username is passed straight through.\n    let loginName = identifier.value;\n    if (identifier.value.includes('@')) {\n      const resolved = await resolveLoginIdentifier(identifier.value, password.value);\n      if (!resolved.ok || !resolved.username) {\n        // 401 is the server's uniform \"real auth failure\" code; anything else\n        // (404 = route not deployed, 5xx, or no status = network) means the\n        // resolver is unavailable, not that the credentials were wrong.\n        if (resolved.status === 401) {\n          log('Email identifier did not resolve: invalid credentials');\n          initBadLogin();\n        } else {\n          log(`Email login unavailable (resolver error: ${resolved.error ?? 'network'})`);\n          initBadLogin(LOGIN_UNAVAILABLE_MSG);\n        }\n        awaitingResponse.value = false;\n        return;\n      }\n      loginName = resolved.username;\n    }\n\n    await user.value.login(loginName, password.value);\n    log('Login successful');\n\n    // load user config\n    log('Initializing user config');\n    configStore.init();\n    log('User config initialized');\n\n    // set login state\n    log('Setting authentication state');\n    authStore.loginAndRegistration.loggedIn = true;\n    log(`Authentication state set, redirecting to: ${props.redirectTo}`);\n    \n    // Emit success event for cleanup\n    emit('loginSuccess', props.redirectTo);\n    \n    router.push(props.redirectTo);\n    log('Login and redirect complete');\n  } catch (e) {\n    // entry #186\n    log('Login attempt failed');\n    log(`Login error details: ${JSON.stringify(e)}`);\n    console.log(`login error: ${JSON.stringify(e)}`);\n    // - differentiate response\n    // - return better message to UI\n    log('Initiating bad login feedback');\n    initBadLogin();\n  }\n\n  log('Resetting awaiting response state');\n  awaitingResponse.value = false;\n};\n\n\nconst toggle = () => {\n  log('Toggling registration / login forms.');\n  emit('toggle');\n};\n\nconst handleForgotPassword = () => {\n  log('Forgot password clicked');\n  // If on login route, navigate directly\n  if (loginRoute.value) {\n    router.push('/request-reset');\n  } else {\n    // Otherwise, emit event for parent to handle (e.g., modal context)\n    emit('forgotPassword');\n  }\n};\n</script>\n\n<style lang=\"css\" scoped>\n.login {\n  max-width: 650px;\n}\n</style>\n"],"mappings":""}

package/dist/components/auth/UserLogin.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,155 @@
+import "../../_virtual/_rolldown/runtime.mjs";
+import { alertUser as e } from "../SnackbarService.mjs";
+import { resolveLoginIdentifier as t } from "../../services/authAPI.mjs";
+import { getCurrentUser as n, useAuthStore as r } from "../../stores/useAuthStore.mjs";
+import { useConfigStore as i } from "../../stores/useConfigStore.mjs";
+import { computed as a, createBlock as o, createCommentVNode as s, createElementVNode as c, createTextVNode as l, createVNode as u, defineComponent as d, openBlock as f, ref as p, renderSlot as m, resolveComponent as h, toDisplayString as g, withCtx as _, withModifiers as v } from "vue";
+import { Status as y, log as b } from "@vue-skuilder/common";
+import { useRoute as x, useRouter as S } from "vue-router";
+//#region src/components/auth/UserLogin.vue?vue&type=script&setup=true&lang.ts
+var C = { class: "d-flex flex-column align-start" }, w = { class: "mb-2" }, T = "Username or password was incorrect.", E = "Login is temporarily unavailable. Please try again in a moment.", D = /* @__PURE__ */ d({
+	__name: "UserLogin",
+	props: { redirectTo: { default: "/study" } },
+	emits: [
+		"toggle",
+		"loginSuccess",
+		"forgotPassword"
+	],
+	setup(d, { emit: D }) {
+		let O = d, k = D, A = S(), j = x(), M = r(), N = i(), P = p(""), F = p(""), I = p(!1), L = p(!1), R = p(!1), z = p(7e3), B = p("Username or password was incorrect."), V = p(void 0), H = a(() => j.name === "login"), U = a(() => ({
+			color: R.value ? "error" : "success",
+			text: R.value ? "Try again" : "Log In"
+		})), initBadLogin = (t = T) => {
+			B.value = t, R.value = !0, e({
+				text: t,
+				status: y.error,
+				timeout: z.value
+			}), setTimeout(() => {
+				R.value = !1;
+			}, z.value);
+		}, login = async () => {
+			L.value = !0, b("Starting login attempt"), b(`Login attempt for identifier: ${P.value}`);
+			try {
+				b("Attempting to get User instance"), V.value = await n(), b("Got User instance, attempting login");
+				let e = P.value;
+				if (P.value.includes("@")) {
+					let n = await t(P.value, F.value);
+					if (!n.ok || !n.username) {
+						n.status === 401 ? (b("Email identifier did not resolve: invalid credentials"), initBadLogin()) : (b(`Email login unavailable (resolver error: ${n.error ?? "network"})`), initBadLogin(E)), L.value = !1;
+						return;
+					}
+					e = n.username;
+				}
+				await V.value.login(e, F.value), b("Login successful"), b("Initializing user config"), N.init(), b("User config initialized"), b("Setting authentication state"), M.loginAndRegistration.loggedIn = !0, b(`Authentication state set, redirecting to: ${O.redirectTo}`), k("loginSuccess", O.redirectTo), A.push(O.redirectTo), b("Login and redirect complete");
+			} catch (e) {
+				b("Login attempt failed"), b(`Login error details: ${JSON.stringify(e)}`), console.log(`login error: ${JSON.stringify(e)}`), b("Initiating bad login feedback"), initBadLogin();
+			}
+			b("Resetting awaiting response state"), L.value = !1;
+		}, toggle = () => {
+			b("Toggling registration / login forms."), k("toggle");
+		}, handleForgotPassword = () => {
+			b("Forgot password clicked"), H.value ? A.push("/request-reset") : k("forgotPassword");
+		};
+		return (e, t) => {
+			let n = h("v-card-title"), r = h("v-text-field"), i = h("v-btn"), a = h("v-snackbar"), d = h("v-icon"), p = h("router-link"), y = h("v-form"), b = h("v-card-text"), x = h("v-card");
+			return f(), o(x, null, {
+				default: _(() => [H.value ? s("", !0) : (f(), o(n, {
+					key: 0,
+					class: "text-h5 bg-grey-lighten-2"
+				}, {
+					default: _(() => t[5] || (t[5] = [l("Log In")])),
+					_: 1
+				})), u(b, null, {
+					default: _(() => [u(y, {
+						onsubmit: "return false;",
+						onSubmit: v(login, ["prevent"])
+					}, {
+						default: _(() => [
+							u(r, {
+								id: "",
+								modelValue: P.value,
+								"onUpdate:modelValue": t[0] || (t[0] = (e) => P.value = e),
+								autofocus: "",
+								name: "username",
+								label: "Username or email",
+								"prepend-icon": "mdi-account-circle"
+							}, null, 8, ["modelValue"]),
+							u(r, {
+								modelValue: F.value,
+								"onUpdate:modelValue": t[1] || (t[1] = (e) => F.value = e),
+								"prepend-icon": "mdi-lock",
+								name: "password",
+								hover: "Show password input",
+								label: "Enter your password",
+								hint: "",
+								min: "0",
+								"append-icon": I.value ? "mdi-eye-off" : "mdi-eye",
+								type: I.value ? "text" : "password",
+								"onClick:append": t[2] || (t[2] = () => I.value = !I.value)
+							}, null, 8, [
+								"modelValue",
+								"append-icon",
+								"type"
+							]),
+							u(a, {
+								modelValue: R.value,
+								"onUpdate:modelValue": t[4] || (t[4] = (e) => R.value = e),
+								location: "bottom right",
+								timeout: z.value
+							}, {
+								default: _(() => [l(g(B.value) + " ", 1), u(i, {
+									color: "pink",
+									variant: "text",
+									onClick: t[3] || (t[3] = (e) => R.value = !1)
+								}, {
+									default: _(() => t[6] || (t[6] = [l("Close")])),
+									_: 1
+								})]),
+								_: 1
+							}, 8, ["modelValue", "timeout"]),
+							c("div", C, [c("div", w, [u(i, {
+								class: "mr-2",
+								type: "submit",
+								loading: L.value,
+								color: U.value.color
+							}, {
+								default: _(() => [u(d, { start: "" }, {
+									default: _(() => t[7] || (t[7] = [l("mdi-lock-open")])),
+									_: 1
+								}), t[8] || (t[8] = l(" Log In "))]),
+								_: 1
+							}, 8, ["loading", "color"]), H.value ? (f(), o(p, {
+								key: 0,
+								to: "signup"
+							}, {
+								default: _(() => [u(i, { variant: "text" }, {
+									default: _(() => t[9] || (t[9] = [l("Create New Account")])),
+									_: 1
+								})]),
+								_: 1
+							})) : (f(), o(i, {
+								key: 1,
+								variant: "text",
+								onClick: toggle
+							}, {
+								default: _(() => t[10] || (t[10] = [l("Create New Account")])),
+								_: 1
+							}))]), m(e.$slots, "forgot-password", {}, () => [c("a", {
+								href: "#",
+								class: "text-caption text-decoration-none",
+								onClick: v(handleForgotPassword, ["prevent"])
+							}, " Forgot password? ")], !0)])
+						]),
+						_: 3
+					})]),
+					_: 3
+				})]),
+				_: 3
+			});
+		};
+	}
+});
+//#endregion
+export { D as default };
+
+//# sourceMappingURL=UserLogin.vue_vue_type_script_setup_true_lang.mjs.map

package/dist/components/auth/UserLogin.vue_vue_type_script_setup_true_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserLogin.vue_vue_type_script_setup_true_lang.mjs","names":[],"sources":["../../../src/components/auth/UserLogin.vue"],"sourcesContent":["<template>\n  <v-card>\n    <v-card-title v-if=\"!loginRoute\" class=\"text-h5 bg-grey-lighten-2\">Log In</v-card-title>\n\n    <v-card-text>\n      <v-form onsubmit=\"return false;\" @submit.prevent=\"login\">\n        <v-text-field\n          id=\"\"\n          v-model=\"identifier\"\n          autofocus\n          name=\"username\"\n          label=\"Username or email\"\n          prepend-icon=\"mdi-account-circle\"\n        ></v-text-field>\n        <v-text-field\n          v-model=\"password\"\n          prepend-icon=\"mdi-lock\"\n          name=\"password\"\n          hover=\"Show password input\"\n          label=\"Enter your password\"\n          hint=\"\"\n          min=\"0\"\n          :append-icon=\"passwordVisible ? 'mdi-eye-off' : 'mdi-eye'\"\n          :type=\"passwordVisible ? 'text' : 'password'\"\n          @click:append=\"() => (passwordVisible = !passwordVisible)\"\n        ></v-text-field>\n\n        <v-snackbar v-model=\"badLoginAttempt\" location=\"bottom right\" :timeout=\"errorTimeout\">\n          {{ errorMessage }}\n          <v-btn color=\"pink\" variant=\"text\" @click=\"badLoginAttempt = false\">Close</v-btn>\n        </v-snackbar>\n\n        <div class=\"d-flex flex-column align-start\">\n          <div class=\"mb-2\">\n            <v-btn class=\"mr-2\" type=\"submit\" :loading=\"awaitingResponse\" :color=\"buttonStatus.color\">\n              <v-icon start>mdi-lock-open</v-icon>\n              Log In\n            </v-btn>\n            <router-link v-if=\"loginRoute\" to=\"signup\">\n              <v-btn variant=\"text\">Create New Account</v-btn>\n            </router-link>\n            <v-btn v-else variant=\"text\" @click=\"toggle\">Create New Account</v-btn>\n          </div>\n\n          <slot name=\"forgot-password\">\n            <!-- Default: always show forgot password link -->\n            <a\n              href=\"#\"\n              class=\"text-caption text-decoration-none\"\n              @click.prevent=\"handleForgotPassword\"\n            >\n              Forgot password?\n            </a>\n          </slot>\n        </div>\n      </v-form>\n    </v-card-text>\n  </v-card>\n</template>\n\n<script lang=\"ts\" setup>\nimport { ref, computed } from 'vue';\nimport { useRouter, useRoute } from 'vue-router';\nimport { alertUser } from '../SnackbarService';\nimport { log } from '@vue-skuilder/common';\nimport { Status } from '@vue-skuilder/common';\nimport { User } from '@vue-skuilder/db';\nimport { getCurrentUser, useAuthStore } from '../../stores/useAuthStore';\nimport { useConfigStore } from '../../stores/useConfigStore';\nimport { resolveLoginIdentifier } from '../../services/authAPI';\n\n// Define props\ninterface Props {\n  redirectTo?: string;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  redirectTo: '/study'\n});\n\n// Define emits for toggle, cleanup, and forgot password\nconst emit = defineEmits<{\n  toggle: [];\n  loginSuccess: [redirectPath: string];\n  forgotPassword: [];\n}>();\n\nconst router = useRouter();\nconst route = useRoute();\nconst authStore = useAuthStore();\nconst configStore = useConfigStore();\n\n// Holds a username OR an email address (see login()).\nconst identifier = ref('');\nconst password = ref('');\nconst passwordVisible = ref(false);\nconst awaitingResponse = ref(false);\nconst badLoginAttempt = ref(false);\nconst errorTimeout = ref(7000);\nconst errorMessage = ref('Username or password was incorrect.');\n\n// Shown when the email→username resolver is unreachable (route missing / 5xx /\n// network) rather than when credentials are actually wrong. Telling the two\n// apart matters: \"wrong password\" sends the user to re-check what is in fact\n// correct, and hides a real backend outage.\nconst BAD_CREDENTIALS_MSG = 'Username or password was incorrect.';\nconst LOGIN_UNAVAILABLE_MSG =\n  'Login is temporarily unavailable. Please try again in a moment.';\nconst user = ref<User | undefined>(undefined);\n\nconst loginRoute = computed(() => route.name === 'login');\n\nconst buttonStatus = computed(() => ({\n  color: badLoginAttempt.value ? 'error' : 'success',\n  text: badLoginAttempt.value ? 'Try again' : 'Log In',\n}));\n\nconst initBadLogin = (message: string = BAD_CREDENTIALS_MSG) => {\n  errorMessage.value = message;\n  badLoginAttempt.value = true;\n\n  alertUser({\n    text: message,\n    status: Status.error,\n    timeout: errorTimeout.value,\n  });\n  setTimeout(() => {\n    badLoginAttempt.value = false;\n  }, errorTimeout.value);\n};\n\nconst login = async () => {\n  awaitingResponse.value = true;\n  log('Starting login attempt');\n  log(`Login attempt for identifier: ${identifier.value}`);\n\n  try {\n    log('Attempting to get User instance');\n    // #172 starting point - why is the pre-existing _user being referenced here?\n    user.value = await getCurrentUser();\n    log('Got User instance, attempting login');\n\n    // Couch _session authenticates by username only. When the identifier is an\n    // email, resolve it to the account username first — server-side and gated\n    // on the correct password, so it can't be used to enumerate accounts. A\n    // plain username is passed straight through.\n    let loginName = identifier.value;\n    if (identifier.value.includes('@')) {\n      const resolved = await resolveLoginIdentifier(identifier.value, password.value);\n      if (!resolved.ok || !resolved.username) {\n        // 401 is the server's uniform \"real auth failure\" code; anything else\n        // (404 = route not deployed, 5xx, or no status = network) means the\n        // resolver is unavailable, not that the credentials were wrong.\n        if (resolved.status === 401) {\n          log('Email identifier did not resolve: invalid credentials');\n          initBadLogin();\n        } else {\n          log(`Email login unavailable (resolver error: ${resolved.error ?? 'network'})`);\n          initBadLogin(LOGIN_UNAVAILABLE_MSG);\n        }\n        awaitingResponse.value = false;\n        return;\n      }\n      loginName = resolved.username;\n    }\n\n    await user.value.login(loginName, password.value);\n    log('Login successful');\n\n    // load user config\n    log('Initializing user config');\n    configStore.init();\n    log('User config initialized');\n\n    // set login state\n    log('Setting authentication state');\n    authStore.loginAndRegistration.loggedIn = true;\n    log(`Authentication state set, redirecting to: ${props.redirectTo}`);\n    \n    // Emit success event for cleanup\n    emit('loginSuccess', props.redirectTo);\n    \n    router.push(props.redirectTo);\n    log('Login and redirect complete');\n  } catch (e) {\n    // entry #186\n    log('Login attempt failed');\n    log(`Login error details: ${JSON.stringify(e)}`);\n    console.log(`login error: ${JSON.stringify(e)}`);\n    // - differentiate response\n    // - return better message to UI\n    log('Initiating bad login feedback');\n    initBadLogin();\n  }\n\n  log('Resetting awaiting response state');\n  awaitingResponse.value = false;\n};\n\n\nconst toggle = () => {\n  log('Toggling registration / login forms.');\n  emit('toggle');\n};\n\nconst handleForgotPassword = () => {\n  log('Forgot password clicked');\n  // If on login route, navigate directly\n  if (loginRoute.value) {\n    router.push('/request-reset');\n  } else {\n    // Otherwise, emit event for parent to handle (e.g., modal context)\n    emit('forgotPassword');\n  }\n};\n</script>\n\n<style lang=\"css\" scoped>\n.login {\n  max-width: 650px;\n}\n</style>\n"],"mappings":";;;;;;;;;4EAyGM,IAAsB,uCACtB,IACJ;;;;;;;;;EA/BF,IAAM,IAAQ,GAKR,IAAO,GAMP,IAAS,GAAW,EACpB,IAAQ,GAAU,EAClB,IAAY,GAAc,EAC1B,IAAc,GAAgB,EAG9B,IAAa,EAAI,GAAG,EACpB,IAAW,EAAI,GAAG,EAClB,IAAkB,EAAI,GAAM,EAC5B,IAAmB,EAAI,GAAM,EAC7B,IAAkB,EAAI,GAAM,EAC5B,IAAe,EAAI,IAAK,EACxB,IAAe,EAAI,sCAAsC,EASzD,IAAO,EAAsB,KAAA,EAAU,EAEvC,IAAa,QAAe,EAAM,SAAS,QAAQ,EAEnD,IAAe,SAAgB;GACnC,OAAO,EAAgB,QAAQ,UAAU;GACzC,MAAM,EAAgB,QAAQ,cAAc;GAC7C,EAAE,EAEG,gBAAgB,IAAkB,MAAwB;AAS9D,GARA,EAAa,QAAQ,GACrB,EAAgB,QAAQ,IAExB,EAAU;IACR,MAAM;IACN,QAAQ,EAAO;IACf,SAAS,EAAa;IACvB,CAAC,EACF,iBAAiB;AACf,MAAgB,QAAQ;MACvB,EAAa,MAAM;KAGlB,QAAQ,YAAY;AAGxB,GAFA,EAAiB,QAAQ,IACzB,EAAI,yBAAyB,EAC7B,EAAI,iCAAiC,EAAW,QAAQ;AAExD,OAAI;AAIF,IAHA,EAAI,kCAAkC,EAEtC,EAAK,QAAQ,MAAM,GAAgB,EACnC,EAAI,sCAAsC;IAM1C,IAAI,IAAY,EAAW;AAC3B,QAAI,EAAW,MAAM,SAAS,IAAI,EAAE;KAClC,IAAM,IAAW,MAAM,EAAuB,EAAW,OAAO,EAAS,MAAM;AAC/E,SAAI,CAAC,EAAS,MAAM,CAAC,EAAS,UAAU;AAWtC,MAPI,EAAS,WAAW,OACtB,EAAI,wDAAwD,EAC5D,cAAc,KAEd,EAAI,4CAA4C,EAAS,SAAS,UAAU,GAAG,EAC/E,aAAa,EAAsB,GAErC,EAAiB,QAAQ;AACzB;;AAEF,SAAY,EAAS;;AAoBvB,IAjBA,MAAM,EAAK,MAAM,MAAM,GAAW,EAAS,MAAM,EACjD,EAAI,mBAAmB,EAGvB,EAAI,2BAA2B,EAC/B,EAAY,MAAM,EAClB,EAAI,0BAA0B,EAG9B,EAAI,+BAA+B,EACnC,EAAU,qBAAqB,WAAW,IAC1C,EAAI,6CAA6C,EAAM,aAAa,EAGpE,EAAK,gBAAgB,EAAM,WAAW,EAEtC,EAAO,KAAK,EAAM,WAAW,EAC7B,EAAI,8BAA8B;YAC3B,GAAG;AAQV,IANA,EAAI,uBAAuB,EAC3B,EAAI,wBAAwB,KAAK,UAAU,EAAE,GAAG,EAChD,QAAQ,IAAI,gBAAgB,KAAK,UAAU,EAAE,GAAG,EAGhD,EAAI,gCAAgC,EACpC,cAAc;;AAIhB,GADA,EAAI,oCAAoC,EACxC,EAAiB,QAAQ;KAIrB,eAAe;AAEnB,GADA,EAAI,uCAAuC,EAC3C,EAAK,SAAS;KAGV,6BAA6B;AAGjC,GAFA,EAAI,0BAA0B,EAE1B,EAAW,QACb,EAAO,KAAK,iBAAiB,GAG7B,EAAK,iBAAiB"}

package/dist/components/auth/UserLoginAndRegistrationContainer.mjs

@@ -0,0 +1,9 @@
+import e from "../../_virtual/_plugin-vue_export-helper.mjs";
+import t from "./UserLoginAndRegistrationContainer.vue_vue_type_script_setup_true_lang.mjs";
+/* empty css                                                                                   */
+//#region src/components/auth/UserLoginAndRegistrationContainer.vue
+var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-5a55bdf0"]]);
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=UserLoginAndRegistrationContainer.mjs.map

package/dist/components/auth/UserLoginAndRegistrationContainer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserLoginAndRegistrationContainer.mjs","names":[],"sources":["../../../src/components/auth/UserLoginAndRegistrationContainer.vue"],"sourcesContent":["<template>\n  <div v-if=\"userReady && display\">\n    <transition name=\"component-fade\" mode=\"out-in\">\n      <div v-if=\"guestMode\" key=\"login-buttons\">\n        <!-- Registration button: only if showLoginRegistration is true -->\n        <v-dialog v-model=\"regDialog\" width=\"500px\" v-if=\"authUIConfig.showLoginRegistration\">\n          <template #activator=\"{ props }\">\n            <v-btn class=\"mr-2\" size=\"small\" color=\"success\" v-bind=\"props\">Sign Up</v-btn>\n          </template>\n          <UserRegistration\n            @toggle=\"toggle\"\n            @signup-success=\"handleSignupSuccess\"\n            :on-signup-success=\"handleSignupSuccess\"\n          />\n        </v-dialog>\n        \n        <!-- Login button: always show in guest mode -->\n        <v-dialog v-model=\"loginDialog\" width=\"500px\">\n          <template #activator=\"{ props }\">\n            <v-btn size=\"small\" color=\"success\" v-bind=\"props\">Log In</v-btn>\n          </template>\n          <UserLogin @toggle=\"toggle\" @forgot-password=\"openResetDialog\" />\n        </v-dialog>\n\n        <!-- Password reset dialog: opened from login via \"Forgot password?\" -->\n        <v-dialog v-model=\"resetDialog\" width=\"500px\">\n          <RequestPasswordReset @cancel=\"closeResetDialog\" @success=\"closeResetDialog\" />\n        </v-dialog>\n      </div>\n      <div v-else key=\"user-chip\">\n        <user-chip />\n      </div>\n    </transition>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, onMounted, ref } from 'vue';\nimport { useRoute } from 'vue-router';\nimport UserLogin from './UserLogin.vue';\nimport UserRegistration from './UserRegistration.vue';\nimport RequestPasswordReset from './RequestPasswordReset.vue';\nimport UserChip from './UserChip.vue';\nimport { useAuthStore } from '../../stores/useAuthStore';\nimport { useAuthUI } from '../../composables/useAuthUI';\nimport { GuestUsername } from '@vue-skuilder/db';\n\n// Define props\nconst props = defineProps<{\n  showLoginButton?: boolean;\n  redirectToPath?: string;\n  showRegistration?: boolean;\n  onSignupSuccess?: (payload: { username: string }) => void;\n}>();\n\n// Define emits (keeping for backward compatibility if needed)\nconst emit = defineEmits<{\n  'signup-success': [payload: { username: string }]\n}>();\n\nconst route = useRoute();\nconst authStore = useAuthStore();\nconst authUI = useAuthUI();\n\n// Initialize auth UI detection\nonMounted(async () => {\n  await authUI.detectSyncStrategy();\n});\n\nconst display = computed(() => {\n  if (!route.name || typeof route.name !== 'string') {\n    return true;\n  }\n  const routeName = route.name.toLowerCase();\n  return !(routeName === 'login' || routeName === 'signup');\n});\n\nconst userReady = computed(() => authStore.onLoadComplete);\n\nconst guestMode = computed(() => {\n  if (authStore._user) {\n    return authStore._user.getUsername().startsWith(GuestUsername);\n  }\n  return !authStore.loginAndRegistration.loggedIn;\n});\n\nconst authUIConfig = computed(() => {\n  const baseConfig = authUI.config.value || {\n    showLoginRegistration: true,\n    showLogout: true, \n    showResetData: false,\n    logoutLabel: 'Log out',\n    resetLabel: '',\n  };\n  \n  // Apply prop overrides\n  return {\n    ...baseConfig,\n    ...(props.showRegistration !== undefined && { showLoginRegistration: props.showRegistration })\n  };\n});\n\nconst regDialog = computed({\n  get: () => authStore.loginAndRegistration.regDialogOpen,\n  set: (value: boolean) => {\n    authStore.loginAndRegistration.regDialogOpen = value;\n  },\n});\n\nconst loginDialog = computed({\n  get: () => authStore.loginAndRegistration.loginDialogOpen,\n  set: (value: boolean) => {\n    authStore.loginAndRegistration.loginDialogOpen = value;\n  },\n});\n\n// Password reset dialog state (local, not in auth store)\nconst resetDialog = ref(false);\n\nconst toggle = () => {\n  if (regDialog.value && loginDialog.value) {\n    throw new Error('Registration / Login dialogs both activated.');\n  } else if (regDialog.value === loginDialog.value) {\n    throw new Error('Registration / Login dialogs toggled while both were dormant.');\n  } else {\n    regDialog.value = !regDialog.value;\n    loginDialog.value = !loginDialog.value;\n  }\n};\n\nconst openResetDialog = () => {\n  loginDialog.value = false; // Close login dialog\n  resetDialog.value = true; // Open reset dialog\n};\n\nconst closeResetDialog = () => {\n  resetDialog.value = false;\n};\n\nconst handleSignupSuccess = (payload: { username: string }) => {\n  // Close the registration dialog\n  regDialog.value = false;\n\n  // Call the callback prop if provided (preferred method)\n  if (props.onSignupSuccess) {\n    props.onSignupSuccess(payload);\n  }\n\n  // Also emit event for backward compatibility\n  emit('signup-success', payload);\n};\n</script>\n\n<style scoped>\n.component-fade-enter-active,\n.component-fade-leave-active {\n  transition: opacity 0.5s ease;\n}\n.component-fade-enter,\n.component-fade-leave-to {\n  opacity: 0;\n}\n</style>\n"],"mappings":""}

package/dist/components/auth/UserLoginAndRegistrationContainer.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,126 @@
+import "../../_virtual/_rolldown/runtime.mjs";
+import { useAuthStore as e } from "../../stores/useAuthStore.mjs";
+import { useAuthUI as t } from "../../composables/useAuthUI.mjs";
+import n from "./UserChip.mjs";
+import r from "./UserLogin.mjs";
+import i from "./UserRegistration.mjs";
+import a from "./RequestPasswordReset.mjs";
+import { Transition as o, computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createTextVNode as d, createVNode as f, defineComponent as p, mergeProps as m, onMounted as h, openBlock as g, ref as _, resolveComponent as v, withCtx as y } from "vue";
+import { GuestUsername as b } from "@vue-skuilder/db";
+import { useRoute as x } from "vue-router";
+//#region src/components/auth/UserLoginAndRegistrationContainer.vue?vue&type=script&setup=true&lang.ts
+var S = { key: 0 }, C = { key: "login-buttons" }, w = { key: "user-chip" }, T = /* @__PURE__ */ p({
+	__name: "UserLoginAndRegistrationContainer",
+	props: {
+		showLoginButton: { type: Boolean },
+		redirectToPath: {},
+		showRegistration: { type: Boolean },
+		onSignupSuccess: { type: Function }
+	},
+	emits: ["signup-success"],
+	setup(p, { emit: T }) {
+		let E = p, D = T, O = x(), k = e(), A = t();
+		h(async () => {
+			await A.detectSyncStrategy();
+		});
+		let j = s(() => {
+			if (!O.name || typeof O.name != "string") return !0;
+			let e = O.name.toLowerCase();
+			return !(e === "login" || e === "signup");
+		}), M = s(() => k.onLoadComplete), N = s(() => k._user ? k._user.getUsername().startsWith(b) : !k.loginAndRegistration.loggedIn), P = s(() => ({
+			...A.config.value || {
+				showLoginRegistration: !0,
+				showLogout: !0,
+				showResetData: !1,
+				logoutLabel: "Log out",
+				resetLabel: ""
+			},
+			...E.showRegistration !== void 0 && { showLoginRegistration: E.showRegistration }
+		})), F = s({
+			get: () => k.loginAndRegistration.regDialogOpen,
+			set: (e) => {
+				k.loginAndRegistration.regDialogOpen = e;
+			}
+		}), I = s({
+			get: () => k.loginAndRegistration.loginDialogOpen,
+			set: (e) => {
+				k.loginAndRegistration.loginDialogOpen = e;
+			}
+		}), L = _(!1), toggle = () => {
+			if (F.value && I.value) throw Error("Registration / Login dialogs both activated.");
+			if (F.value === I.value) throw Error("Registration / Login dialogs toggled while both were dormant.");
+			F.value = !F.value, I.value = !I.value;
+		}, openResetDialog = () => {
+			I.value = !1, L.value = !0;
+		}, closeResetDialog = () => {
+			L.value = !1;
+		}, handleSignupSuccess = (e) => {
+			F.value = !1, E.onSignupSuccess && E.onSignupSuccess(e), D("signup-success", e);
+		};
+		return (e, t) => {
+			let s = v("v-btn"), p = v("v-dialog");
+			return M.value && j.value ? (g(), u("div", S, [f(o, {
+				name: "component-fade",
+				mode: "out-in"
+			}, {
+				default: y(() => [N.value ? (g(), u("div", C, [
+					P.value.showLoginRegistration ? (g(), c(p, {
+						key: 0,
+						modelValue: F.value,
+						"onUpdate:modelValue": t[0] || (t[0] = (e) => F.value = e),
+						width: "500px"
+					}, {
+						activator: y(({ props: e }) => [f(s, m({
+							class: "mr-2",
+							size: "small",
+							color: "success"
+						}, e), {
+							default: y(() => t[3] || (t[3] = [d("Sign Up")])),
+							_: 2
+						}, 1040)]),
+						default: y(() => [f(i, {
+							onToggle: toggle,
+							onSignupSuccess: handleSignupSuccess,
+							"on-signup-success": handleSignupSuccess
+						})]),
+						_: 1
+					}, 8, ["modelValue"])) : l("", !0),
+					f(p, {
+						modelValue: I.value,
+						"onUpdate:modelValue": t[1] || (t[1] = (e) => I.value = e),
+						width: "500px"
+					}, {
+						activator: y(({ props: e }) => [f(s, m({
+							size: "small",
+							color: "success"
+						}, e), {
+							default: y(() => t[4] || (t[4] = [d("Log In")])),
+							_: 2
+						}, 1040)]),
+						default: y(() => [f(r, {
+							onToggle: toggle,
+							onForgotPassword: openResetDialog
+						})]),
+						_: 1
+					}, 8, ["modelValue"]),
+					f(p, {
+						modelValue: L.value,
+						"onUpdate:modelValue": t[2] || (t[2] = (e) => L.value = e),
+						width: "500px"
+					}, {
+						default: y(() => [f(a, {
+							onCancel: closeResetDialog,
+							onSuccess: closeResetDialog
+						})]),
+						_: 1
+					}, 8, ["modelValue"])
+				])) : (g(), u("div", w, [f(n)]))]),
+				_: 1
+			})])) : l("", !0);
+		};
+	}
+});
+//#endregion
+export { T as default };
+
+//# sourceMappingURL=UserLoginAndRegistrationContainer.vue_vue_type_script_setup_true_lang.mjs.map