@abraca/nuxt 2.0.0 → 2.0.3

package/dist/runtime/components/APasswordRegisterModal.d.vue.ts

@@ -0,0 +1,49 @@
+type __VLS_Props = {
+    open?: boolean;
+    loading?: boolean;
+    error?: string | null;
+    title?: string;
+    subtitle?: string;
+    /** Server-enforced minimum password length (mirrored client-side). */
+    minLength?: number;
+    /** Show optional email field. */
+    showEmail?: boolean;
+    /** Show optional display-name field. */
+    showDisplayName?: boolean;
+    /** Show optional invite-code field. */
+    showInviteCode?: boolean;
+    /** Show "Already have an account? Sign in" link. */
+    showSignInLink?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    submit: (payload: {
+        username: string;
+        password: string;
+        email?: string;
+        displayName?: string;
+        inviteCode?: string;
+    }) => any;
+    "update:open": (v: boolean) => any;
+    signin: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSubmit?: ((payload: {
+        username: string;
+        password: string;
+        email?: string;
+        displayName?: string;
+        inviteCode?: string;
+    }) => any) | undefined;
+    "onUpdate:open"?: ((v: boolean) => any) | undefined;
+    onSignin?: (() => any) | undefined;
+}>, {
+    subtitle: string;
+    title: string;
+    minLength: number;
+    loading: boolean;
+    showInviteCode: boolean;
+    showEmail: boolean;
+    showDisplayName: boolean;
+    showSignInLink: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/APasswordRegisterModal.vue

@@ -0,0 +1,262 @@
+<script setup>
+import { computed, ref, watch } from "vue";
+const props = defineProps({
+  open: { type: Boolean, required: false },
+  loading: { type: Boolean, required: false, default: false },
+  error: { type: [String, null], required: false },
+  title: { type: String, required: false, default: "Create your account" },
+  subtitle: { type: String, required: false, default: "Pick a username and a password. You can change either later." },
+  minLength: { type: Number, required: false, default: 8 },
+  showEmail: { type: Boolean, required: false, default: true },
+  showDisplayName: { type: Boolean, required: false, default: false },
+  showInviteCode: { type: Boolean, required: false, default: true },
+  showSignInLink: { type: Boolean, required: false, default: true }
+});
+const emit = defineEmits(["update:open", "submit", "signin"]);
+const open = computed({
+  get: () => !!props.open,
+  set: (v) => emit("update:open", v)
+});
+const username = ref("");
+const password = ref("");
+const confirm = ref("");
+const email = ref("");
+const displayName = ref("");
+const inviteCode = ref("");
+const showPassword = ref(false);
+watch(() => props.open, (v) => {
+  if (!v) return;
+  username.value = "";
+  password.value = "";
+  confirm.value = "";
+  email.value = "";
+  displayName.value = "";
+  inviteCode.value = "";
+  showPassword.value = false;
+});
+const passwordTooShort = computed(
+  () => password.value.length > 0 && password.value.length < props.minLength
+);
+const confirmMismatch = computed(
+  () => confirm.value.length > 0 && confirm.value !== password.value
+);
+const emailLooksValid = computed(
+  () => !email.value || /^[^\s@]+@[^\s@]+\.[^\s.@]+$/.test(email.value.trim())
+);
+const strength = computed(() => {
+  const p = password.value;
+  if (!p) return { score: 0, label: "" };
+  let score = 0;
+  if (p.length >= props.minLength) score++;
+  if (p.length >= props.minLength + 4) score++;
+  if (/[A-Z]/.test(p) && /[a-z]/.test(p)) score++;
+  if (/\d/.test(p)) score++;
+  if (/[^a-z0-9]/i.test(p)) score++;
+  const labels = ["Too short", "Weak", "Fair", "Good", "Strong", "Strong"];
+  return { score, label: labels[Math.min(score, 5)] };
+});
+const canSubmit = computed(
+  () => !!username.value.trim() && password.value.length >= props.minLength && confirm.value === password.value && emailLooksValid.value && !props.loading
+);
+function submit() {
+  if (!canSubmit.value) return;
+  emit("submit", {
+    username: username.value.trim(),
+    password: password.value,
+    email: email.value.trim() || void 0,
+    displayName: displayName.value.trim() || void 0,
+    inviteCode: inviteCode.value.trim() || void 0
+  });
+}
+</script>
+
+<template>
+  <UModal
+    v-model:open="open"
+    :title="title"
+    :ui="{ content: 'sm:max-w-md' }"
+  >
+    <template #body>
+      <div class="flex flex-col gap-4">
+        <p class="text-sm text-(--ui-text-muted)">
+          {{ subtitle }}
+        </p>
+
+        <UAlert
+          v-if="error"
+          color="error"
+          variant="soft"
+          icon="i-lucide-triangle-alert"
+          :description="error"
+        />
+
+        <div class="flex flex-col gap-1">
+          <label class="text-xs font-medium text-(--ui-text-muted)">Username</label>
+          <UInput
+            v-model="username"
+            size="md"
+            autofocus
+            autocomplete="username"
+            placeholder="your-handle"
+            icon="i-lucide-at-sign"
+            @keydown.enter="submit"
+          />
+        </div>
+
+        <div
+          v-if="showDisplayName"
+          class="flex flex-col gap-1"
+        >
+          <label class="text-xs font-medium text-(--ui-text-muted)">Display name (optional)</label>
+          <UInput
+            v-model="displayName"
+            size="md"
+            autocomplete="name"
+            placeholder="Visible to other people"
+            icon="i-lucide-user"
+            @keydown.enter="submit"
+          />
+        </div>
+
+        <div
+          v-if="showEmail"
+          class="flex flex-col gap-1"
+        >
+          <label class="text-xs font-medium text-(--ui-text-muted)">Email (optional)</label>
+          <UInput
+            v-model="email"
+            type="email"
+            size="md"
+            autocomplete="email"
+            placeholder="you@example.com"
+            icon="i-lucide-mail"
+            @keydown.enter="submit"
+          />
+          <p
+            v-if="email && !emailLooksValid"
+            class="text-xs text-(--ui-color-error-500)"
+          >
+            That doesn't look like an email address.
+          </p>
+        </div>
+
+        <div class="flex flex-col gap-1">
+          <label class="text-xs font-medium text-(--ui-text-muted)">Password</label>
+          <UInput
+            v-model="password"
+            :type="showPassword ? 'text' : 'password'"
+            size="md"
+            autocomplete="new-password"
+            :placeholder="`${minLength}+ characters`"
+            icon="i-lucide-lock"
+            :ui="{ trailing: 'pe-1' }"
+            @keydown.enter="submit"
+          >
+            <template #trailing>
+              <UButton
+                tabindex="-1"
+                variant="ghost"
+                color="neutral"
+                size="xs"
+                :icon="showPassword ? 'i-lucide-eye-off' : 'i-lucide-eye'"
+                :aria-label="showPassword ? 'Hide password' : 'Show password'"
+                @click="showPassword = !showPassword"
+              />
+            </template>
+          </UInput>
+          <div
+            v-if="password.length > 0"
+            class="flex items-center gap-1.5 mt-1"
+          >
+            <div class="flex-1 grid grid-cols-5 gap-0.5 h-1">
+              <div
+                v-for="i in 5"
+                :key="i"
+                class="rounded-full transition-colors"
+                :class="i <= strength.score ? strength.score >= 4 ? 'bg-(--ui-color-success-500)' : strength.score >= 2 ? 'bg-(--ui-color-warning-500)' : 'bg-(--ui-color-error-500)' : 'bg-(--ui-border)'"
+              />
+            </div>
+            <span
+              class="text-xs font-mono w-12 text-right"
+              :class="strength.score >= 4 ? 'text-(--ui-color-success-500)' : strength.score >= 2 ? 'text-(--ui-color-warning-500)' : 'text-(--ui-color-error-500)'"
+            >{{ strength.label }}</span>
+          </div>
+          <p
+            v-if="passwordTooShort"
+            class="text-xs text-(--ui-color-error-500)"
+          >
+            At least {{ minLength }} characters.
+          </p>
+        </div>
+
+        <div class="flex flex-col gap-1">
+          <label class="text-xs font-medium text-(--ui-text-muted)">Confirm password</label>
+          <UInput
+            v-model="confirm"
+            :type="showPassword ? 'text' : 'password'"
+            size="md"
+            autocomplete="new-password"
+            placeholder="Type it again"
+            icon="i-lucide-shield-check"
+            @keydown.enter="submit"
+          />
+          <p
+            v-if="confirmMismatch"
+            class="text-xs text-(--ui-color-error-500)"
+          >
+            Passwords don't match.
+          </p>
+        </div>
+
+        <div
+          v-if="showInviteCode"
+          class="flex flex-col gap-1"
+        >
+          <label class="text-xs font-medium text-(--ui-text-muted)">Invite code (optional)</label>
+          <UInput
+            v-model="inviteCode"
+            size="sm"
+            placeholder="paste invite code"
+            icon="i-lucide-ticket"
+            @keydown.enter="submit"
+          />
+        </div>
+
+        <div
+          v-if="showSignInLink"
+          class="-mt-1 text-xs"
+        >
+          <UButton
+            variant="link"
+            color="neutral"
+            size="xs"
+            label="Already have an account? Sign in"
+            @click="emit('signin')"
+          />
+        </div>
+      </div>
+    </template>
+
+    <template #footer>
+      <div class="flex items-center justify-end gap-2 w-full">
+        <UButton
+          variant="ghost"
+          color="neutral"
+          size="sm"
+          label="Cancel"
+          :disabled="loading"
+          @click="open = false"
+        />
+        <UButton
+          color="primary"
+          size="sm"
+          icon="i-lucide-user-plus"
+          label="Create account"
+          :loading="loading"
+          :disabled="!canSubmit"
+          @click="submit"
+        />
+      </div>
+    </template>
+  </UModal>
+</template>

package/dist/runtime/components/APasswordRegisterModal.vue.d.ts

@@ -0,0 +1,49 @@
+type __VLS_Props = {
+    open?: boolean;
+    loading?: boolean;
+    error?: string | null;
+    title?: string;
+    subtitle?: string;
+    /** Server-enforced minimum password length (mirrored client-side). */
+    minLength?: number;
+    /** Show optional email field. */
+    showEmail?: boolean;
+    /** Show optional display-name field. */
+    showDisplayName?: boolean;
+    /** Show optional invite-code field. */
+    showInviteCode?: boolean;
+    /** Show "Already have an account? Sign in" link. */
+    showSignInLink?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    submit: (payload: {
+        username: string;
+        password: string;
+        email?: string;
+        displayName?: string;
+        inviteCode?: string;
+    }) => any;
+    "update:open": (v: boolean) => any;
+    signin: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSubmit?: ((payload: {
+        username: string;
+        password: string;
+        email?: string;
+        displayName?: string;
+        inviteCode?: string;
+    }) => any) | undefined;
+    "onUpdate:open"?: ((v: boolean) => any) | undefined;
+    onSignin?: (() => any) | undefined;
+}>, {
+    subtitle: string;
+    title: string;
+    minLength: number;
+    loading: boolean;
+    showInviteCode: boolean;
+    showEmail: boolean;
+    showDisplayName: boolean;
+    showSignInLink: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/APasswordResetConfirmModal.d.vue.ts

@@ -0,0 +1,31 @@
+type __VLS_Props = {
+    open?: boolean;
+    loading?: boolean;
+    error?: string | null;
+    /** Pre-fill the token (e.g. from a query param when the email link lands here). */
+    initialToken?: string;
+    title?: string;
+    subtitle?: string;
+    minLength?: number;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    submit: (payload: {
+        token: string;
+        newPassword: string;
+    }) => any;
+    "update:open": (v: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSubmit?: ((payload: {
+        token: string;
+        newPassword: string;
+    }) => any) | undefined;
+    "onUpdate:open"?: ((v: boolean) => any) | undefined;
+}>, {
+    subtitle: string;
+    title: string;
+    minLength: number;
+    loading: boolean;
+    initialToken: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/APasswordResetConfirmModal.vue

@@ -0,0 +1,154 @@
+<script setup>
+import { computed, ref, watch } from "vue";
+const props = defineProps({
+  open: { type: Boolean, required: false },
+  loading: { type: Boolean, required: false, default: false },
+  error: { type: [String, null], required: false },
+  initialToken: { type: String, required: false, default: "" },
+  title: { type: String, required: false, default: "Choose a new password" },
+  subtitle: { type: String, required: false, default: "Paste the token from your reset email, then set a new password." },
+  minLength: { type: Number, required: false, default: 8 }
+});
+const emit = defineEmits(["update:open", "submit"]);
+const open = computed({
+  get: () => !!props.open,
+  set: (v) => emit("update:open", v)
+});
+const token = ref("");
+const newPassword = ref("");
+const confirm = ref("");
+const showPassword = ref(false);
+watch(() => props.open, (v) => {
+  if (!v) return;
+  token.value = props.initialToken || "";
+  newPassword.value = "";
+  confirm.value = "";
+  showPassword.value = false;
+});
+const passwordTooShort = computed(
+  () => newPassword.value.length > 0 && newPassword.value.length < props.minLength
+);
+const confirmMismatch = computed(
+  () => confirm.value.length > 0 && confirm.value !== newPassword.value
+);
+const canSubmit = computed(
+  () => !!token.value.trim() && newPassword.value.length >= props.minLength && confirm.value === newPassword.value && !props.loading
+);
+function submit() {
+  if (!canSubmit.value) return;
+  emit("submit", {
+    token: token.value.trim(),
+    newPassword: newPassword.value
+  });
+}
+</script>
+
+<template>
+  <UModal
+    v-model:open="open"
+    :title="title"
+    :ui="{ content: 'sm:max-w-md' }"
+  >
+    <template #body>
+      <div class="flex flex-col gap-4">
+        <p class="text-sm text-(--ui-text-muted)">
+          {{ subtitle }}
+        </p>
+
+        <UAlert
+          v-if="error"
+          color="error"
+          variant="soft"
+          icon="i-lucide-triangle-alert"
+          :description="error"
+        />
+
+        <div class="flex flex-col gap-1">
+          <label class="text-xs font-medium text-(--ui-text-muted)">Reset token</label>
+          <UInput
+            v-model="token"
+            size="md"
+            autofocus
+            placeholder="paste from email"
+            icon="i-lucide-key"
+            :ui="{ base: 'font-mono' }"
+            @keydown.enter="submit"
+          />
+        </div>
+
+        <div class="flex flex-col gap-1">
+          <label class="text-xs font-medium text-(--ui-text-muted)">New password</label>
+          <UInput
+            v-model="newPassword"
+            :type="showPassword ? 'text' : 'password'"
+            size="md"
+            autocomplete="new-password"
+            :placeholder="`${minLength}+ characters`"
+            icon="i-lucide-lock"
+            :ui="{ trailing: 'pe-1' }"
+            @keydown.enter="submit"
+          >
+            <template #trailing>
+              <UButton
+                tabindex="-1"
+                variant="ghost"
+                color="neutral"
+                size="xs"
+                :icon="showPassword ? 'i-lucide-eye-off' : 'i-lucide-eye'"
+                :aria-label="showPassword ? 'Hide password' : 'Show password'"
+                @click="showPassword = !showPassword"
+              />
+            </template>
+          </UInput>
+          <p
+            v-if="passwordTooShort"
+            class="text-xs text-(--ui-color-error-500)"
+          >
+            At least {{ minLength }} characters.
+          </p>
+        </div>
+
+        <div class="flex flex-col gap-1">
+          <label class="text-xs font-medium text-(--ui-text-muted)">Confirm new password</label>
+          <UInput
+            v-model="confirm"
+            :type="showPassword ? 'text' : 'password'"
+            size="md"
+            autocomplete="new-password"
+            placeholder="Type it again"
+            icon="i-lucide-shield-check"
+            @keydown.enter="submit"
+          />
+          <p
+            v-if="confirmMismatch"
+            class="text-xs text-(--ui-color-error-500)"
+          >
+            Passwords don't match.
+          </p>
+        </div>
+      </div>
+    </template>
+
+    <template #footer>
+      <div class="flex items-center justify-end gap-2 w-full">
+        <UButton
+          variant="ghost"
+          color="neutral"
+          size="sm"
+          label="Cancel"
+          :disabled="loading"
+          @click="open = false"
+        />
+        <UButton
+          color="primary"
+          size="sm"
+          icon="i-lucide-rotate-ccw-key"
+          label="Set new password"
+          :loading="loading"
+          :disabled="!canSubmit"
+          @click="submit"
+        />
+      </div>
+    </template>
+  </UModal>
+</template>

package/dist/runtime/components/APasswordResetConfirmModal.vue.d.ts

@@ -0,0 +1,31 @@
+type __VLS_Props = {
+    open?: boolean;
+    loading?: boolean;
+    error?: string | null;
+    /** Pre-fill the token (e.g. from a query param when the email link lands here). */
+    initialToken?: string;
+    title?: string;
+    subtitle?: string;
+    minLength?: number;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    submit: (payload: {
+        token: string;
+        newPassword: string;
+    }) => any;
+    "update:open": (v: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSubmit?: ((payload: {
+        token: string;
+        newPassword: string;
+    }) => any) | undefined;
+    "onUpdate:open"?: ((v: boolean) => any) | undefined;
+}>, {
+    subtitle: string;
+    title: string;
+    minLength: number;
+    loading: boolean;
+    initialToken: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/APasswordResetRequestModal.d.vue.ts

@@ -0,0 +1,35 @@
+type __VLS_Props = {
+    open?: boolean;
+    loading?: boolean;
+    /**
+     * Flip to true after the consumer's submit handler resolves; flips the modal to the
+     *  "we sent an email if that account exists" confirmation copy.
+     */
+    sent?: boolean;
+    error?: string | null;
+    title?: string;
+    subtitle?: string;
+    /** Show the "Back to sign in" link in the footer. */
+    showSignInLink?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    submit: (payload: {
+        identifier: string;
+    }) => any;
+    "update:open": (v: boolean) => any;
+    signin: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSubmit?: ((payload: {
+        identifier: string;
+    }) => any) | undefined;
+    "onUpdate:open"?: ((v: boolean) => any) | undefined;
+    onSignin?: (() => any) | undefined;
+}>, {
+    subtitle: string;
+    title: string;
+    loading: boolean;
+    sent: boolean;
+    showSignInLink: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;