nuxt-users 1.38.0 → 1.39.0

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

@@ -2,6 +2,17 @@ interface Props {
     apiEndpoint?: string;
     forgotPasswordEndpoint?: string;
     redirectTo?: string;
+    title?: string;
+    subtitle?: string;
+    emailLabel?: string;
+    emailPlaceholder?: string;
+    passwordLabel?: string;
+    passwordPlaceholder?: string;
+    rememberMeLabel?: string;
+    submitLabel?: string;
+    submittingLabel?: string;
+    forgotPasswordLabel?: string;
+    forgotPasswordSendingLabel?: string;
 }
 declare var __VLS_1: {}, __VLS_3: {}, __VLS_5: {}, __VLS_7: {}, __VLS_9: {}, __VLS_11: {}, __VLS_13: {
     message: string;
@@ -26,15 +37,15 @@ type __VLS_Slots = {} & {
     'error-message'?: (props: typeof __VLS_15) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    success: (user: UserWithoutPassword, rememberMe: boolean) => any;
     error: (error: string) => any;
     submit: (data: LoginFormData) => any;
+    success: (user: UserWithoutPassword, rememberMe: boolean) => any;
     "forgot-password-error": (error: string) => any;
     "forgot-password-success": () => any;
 }, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
-    onSuccess?: ((user: UserWithoutPassword, rememberMe: boolean) => any) | undefined;
     onError?: ((error: string) => any) | undefined;
     onSubmit?: ((data: LoginFormData) => any) | undefined;
+    onSuccess?: ((user: UserWithoutPassword, rememberMe: boolean) => any) | undefined;
     "onForgot-password-error"?: ((error: string) => any) | undefined;
     "onForgot-password-success"?: (() => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

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

@@ -2,6 +2,7 @@ interface LogoutLinkProps {
     redirectTo?: string;
     linkText?: string;
     confirmMessage?: string;
+    loggingOutText?: string;
     class?: string;
     style?: string | Record<string, string | number>;
     linkClass?: string;
@@ -16,17 +17,15 @@ type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<LogoutLinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    success: () => any;
     error: (error: string) => any;
+    success: () => any;
     click: () => any;
 }, string, import("vue").PublicProps, Readonly<LogoutLinkProps> & Readonly<{
-    onSuccess?: (() => any) | undefined;
     onError?: ((error: string) => any) | undefined;
+    onSuccess?: (() => any) | undefined;
     onClick?: (() => any) | undefined;
 }>, {
     redirectTo: string;
-    linkText: string;
-    confirmMessage: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/runtime/components/NUsersLogoutLink.vue

@@ -2,10 +2,13 @@
 import { ref, onMounted } from "vue";
 import { navigateTo } from "#app";
 import { useAuthentication } from "../composables/useAuthentication";
+import { useNuxtUsersLocale } from "../composables/useNuxtUsersLocale";
+const { t } = useNuxtUsersLocale();
 const props = defineProps({
   redirectTo: { type: String, required: false, default: "/login" },
-  linkText: { type: String, required: false, default: "Logout" },
-  confirmMessage: { type: String, required: false, default: "Are you sure you want to logout?" },
+  linkText: { type: String, required: false },
+  confirmMessage: { type: String, required: false },
+  loggingOutText: { type: String, required: false },
   class: { type: String, required: false },
   style: { type: [String, Object], required: false },
   linkClass: { type: String, required: false },
@@ -24,7 +27,7 @@ onMounted(() => {
 });
 const handleLogout = async (event) => {
   event.preventDefault();
-  if (!confirm(props.confirmMessage)) {
+  if (!confirm(props.confirmMessage || t("logout.confirmMessage"))) {
     return;
   }
   if (!authComposable) {
@@ -71,8 +74,8 @@ const handleLogout = async (event) => {
       @click="handleLogout"
     >
       <slot>
-        <span v-if="isLoading">Logging out...</span>
-        <span v-else>{{ linkText }}</span>
+        <span v-if="isLoading">{{ props.loggingOutText || t("logout.loggingOut") }}</span>
+        <span v-if="!isLoading">{{ props.linkText || t("logout.linkText") }}</span>
       </slot>
     </a>
   </div>

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

@@ -2,6 +2,7 @@ interface LogoutLinkProps {
     redirectTo?: string;
     linkText?: string;
     confirmMessage?: string;
+    loggingOutText?: string;
     class?: string;
     style?: string | Record<string, string | number>;
     linkClass?: string;
@@ -16,17 +17,15 @@ type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<LogoutLinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    success: () => any;
     error: (error: string) => any;
+    success: () => any;
     click: () => any;
 }, string, import("vue").PublicProps, Readonly<LogoutLinkProps> & Readonly<{
-    onSuccess?: (() => any) | undefined;
     onError?: ((error: string) => any) | undefined;
+    onSuccess?: (() => any) | undefined;
     onClick?: (() => any) | undefined;
 }>, {
     redirectTo: string;
-    linkText: string;
-    confirmMessage: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

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

@@ -4,6 +4,12 @@ interface Props {
     validationResult: PasswordValidationResult | null;
     showHints?: boolean;
     showRules?: boolean;
+    weakLabel?: string;
+    mediumLabel?: string;
+    strongLabel?: string;
+    unknownLabel?: string;
+    requirementsTitleText?: string;
+    hintsTitleText?: string;
 }
 declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
     showHints: boolean;

package/dist/runtime/components/NUsersPasswordStrengthIndicator.vue

@@ -1,11 +1,19 @@
 <script setup>
 import { computed } from "vue";
 import { useRuntimeConfig } from "#app";
+import { useNuxtUsersLocale } from "../composables/useNuxtUsersLocale";
+const { t } = useNuxtUsersLocale();
 const props = defineProps({
   password: { type: String, required: true },
   validationResult: { type: null, required: true },
   showHints: { type: Boolean, required: false, default: true },
-  showRules: { type: Boolean, required: false, default: true }
+  showRules: { type: Boolean, required: false, default: true },
+  weakLabel: { type: String, required: false },
+  mediumLabel: { type: String, required: false },
+  strongLabel: { type: String, required: false },
+  unknownLabel: { type: String, required: false },
+  requirementsTitleText: { type: String, required: false },
+  hintsTitleText: { type: String, required: false }
 });
 const { public: { nuxtUsers } } = useRuntimeConfig();
 const moduleOptions = nuxtUsers;
@@ -18,35 +26,35 @@ const validationRules = computed(() => {
   if (moduleOptions.passwordValidation.minLength) {
     const hasMinLength = props.password.length >= moduleOptions.passwordValidation.minLength;
     rules.push({
-      text: `At least ${moduleOptions.passwordValidation.minLength} characters`,
+      text: t("passwordStrength.minLength", [moduleOptions.passwordValidation.minLength]),
       passed: hasMinLength
     });
   }
   if (moduleOptions.passwordValidation.requireUppercase) {
     const hasUppercase = /[A-Z]/.test(props.password);
     rules.push({
-      text: "Contains uppercase letter (A-Z)",
+      text: t("passwordStrength.uppercase"),
       passed: hasUppercase
     });
   }
   if (moduleOptions.passwordValidation.requireLowercase) {
     const hasLowercase = /[a-z]/.test(props.password);
     rules.push({
-      text: "Contains lowercase letter (a-z)",
+      text: t("passwordStrength.lowercase"),
       passed: hasLowercase
     });
   }
   if (moduleOptions.passwordValidation.requireNumbers) {
     const hasNumbers = /\d/.test(props.password);
     rules.push({
-      text: "Contains number (0-9)",
+      text: t("passwordStrength.number"),
       passed: hasNumbers
     });
   }
   if (moduleOptions.passwordValidation.requireSpecialChars) {
     const hasSpecialChars = /[!@#$%^&*()_+\-=[\]{};':"\\|,.<>/?]/.test(props.password);
     rules.push({
-      text: "Contains special character (!@#$%^&*)",
+      text: t("passwordStrength.specialChar"),
       passed: hasSpecialChars
     });
   }
@@ -74,7 +82,7 @@ const validationRules = computed(() => {
   color: validationResult?.strength === 'weak' ? '#dc3545' : validationResult?.strength === 'medium' ? '#ffc107' : validationResult?.strength === 'strong' ? '#28a745' : '#6c757d'
 }"
     >
-      {{ validationResult?.strength === "weak" ? "Weak" : validationResult?.strength === "medium" ? "Medium" : validationResult?.strength === "strong" ? "Strong" : "Unknown" }}
+      {{ validationResult?.strength === "weak" ? props.weakLabel || t("passwordStrength.weak") : validationResult?.strength === "medium" ? props.mediumLabel || t("passwordStrength.medium") : validationResult?.strength === "strong" ? props.strongLabel || t("passwordStrength.strong") : props.unknownLabel || t("passwordStrength.unknown") }}
       ({{ validationResult?.score || 0 }}%)
     </span>
   </div>
@@ -85,7 +93,7 @@ const validationRules = computed(() => {
     class="n-users-validation-rules n-users-validation-container"
   >
     <div class="n-users-rules-title n-users-container-title">
-      Password Requirements:
+      {{ props.requirementsTitleText || t("passwordStrength.label") }}
     </div>
     <ul class="n-users-rules-list n-users-list-unstyled">
       <li
@@ -124,7 +132,7 @@ const validationRules = computed(() => {
     class="n-users-password-hints n-users-validation-container"
   >
     <div class="n-users-hint-title n-users-container-title">
-      How to make your password stronger:
+      {{ props.hintsTitleText || t("passwordStrength.hintsTitle") }}
     </div>
     <ul class="n-users-hint-list n-users-list-unstyled">
       <li

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

@@ -4,6 +4,12 @@ interface Props {
     validationResult: PasswordValidationResult | null;
     showHints?: boolean;
     showRules?: boolean;
+    weakLabel?: string;
+    mediumLabel?: string;
+    strongLabel?: string;
+    unknownLabel?: string;
+    requirementsTitleText?: string;
+    hintsTitleText?: string;
 }
 declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
     showHints: boolean;

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

@@ -1,3 +1,15 @@
-declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+interface Props {
+    title?: string;
+    nameLabel?: string;
+    emailLabel?: string;
+    roleLabel?: string;
+    registeredLabel?: string;
+    lastUpdatedLabel?: string;
+    activeLabel?: string;
+    idLabel?: string;
+    yesText?: string;
+    noText?: string;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/NUsersProfileInfo.vue

@@ -1,6 +1,20 @@
 <script setup>
 import { computed, onMounted, ref } from "vue";
 import { useAuthentication } from "../composables/useAuthentication";
+import { useNuxtUsersLocale } from "../composables/useNuxtUsersLocale";
+const { t } = useNuxtUsersLocale();
+const props = defineProps({
+  title: { type: String, required: false },
+  nameLabel: { type: String, required: false },
+  emailLabel: { type: String, required: false },
+  roleLabel: { type: String, required: false },
+  registeredLabel: { type: String, required: false },
+  lastUpdatedLabel: { type: String, required: false },
+  activeLabel: { type: String, required: false },
+  idLabel: { type: String, required: false },
+  yesText: { type: String, required: false },
+  noText: { type: String, required: false }
+});
 const authComposable = ref(null);
 const user = computed(() => authComposable.value?.user ?? null);
 onMounted(() => {
@@ -11,31 +25,31 @@ onMounted(() => {
 <template>
   <div class="n-users-profile-info n-users-section">
     <h2 class="n-users-section-header">
-      Profile Information
+      {{ props.title || t("profile.title") }}
     </h2>
     <dl
       v-if="user"
       class="n-users-profile-details n-users-grid n-users-grid-2"
     >
-      <dt>Name:</dt>
+      <dt>{{ props.nameLabel || t("profile.name") }}</dt>
       <dd>{{ user.name }}</dd>
 
-      <dt>Email:</dt>
+      <dt>{{ props.emailLabel || t("profile.email") }}</dt>
       <dd>{{ user.email }}</dd>
 
-      <dt>Role:</dt>
+      <dt>{{ props.roleLabel || t("profile.role") }}</dt>
       <dd>{{ user.role }}</dd>
 
-      <dt>Registered:</dt>
+      <dt>{{ props.registeredLabel || t("profile.registered") }}</dt>
       <dd>{{ Intl.DateTimeFormat().format(new Date(user.created_at)) }}</dd>
 
-      <dt>Last updated:</dt>
+      <dt>{{ props.lastUpdatedLabel || t("profile.lastUpdated") }}</dt>
       <dd>{{ Intl.DateTimeFormat().format(new Date(user.updated_at)) }}</dd>
 
-      <dt>Active:</dt>
-      <dd>{{ user.active ? "Yes" : "No" }}</dd>
+      <dt>{{ props.activeLabel || t("profile.active") }}</dt>
+      <dd>{{ user.active ? props.yesText || t("common.yes") : props.noText || t("common.no") }}</dd>
 
-      <dt>ID:</dt>
+      <dt>{{ props.idLabel || t("profile.id") }}</dt>
       <dd>{{ user.id }}</dd>
     </dl>
   </div>

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

@@ -1,3 +1,15 @@
-declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+interface Props {
+    title?: string;
+    nameLabel?: string;
+    emailLabel?: string;
+    roleLabel?: string;
+    registeredLabel?: string;
+    lastUpdatedLabel?: string;
+    activeLabel?: string;
+    idLabel?: string;
+    yesText?: string;
+    noText?: string;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

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

@@ -3,6 +3,21 @@ interface Props {
     apiEndpoint?: string;
     redirectTo?: string;
     loginLink?: string;
+    title?: string;
+    subtitle?: string;
+    nameLabel?: string;
+    namePlaceholder?: string;
+    emailLabel?: string;
+    emailPlaceholder?: string;
+    passwordLabel?: string;
+    passwordPlaceholder?: string;
+    confirmPasswordLabel?: string;
+    confirmPasswordPlaceholder?: string;
+    passwordMismatchError?: string;
+    submitLabel?: string;
+    submittingLabel?: string;
+    alreadyHaveAccountText?: string;
+    signInLinkText?: string;
 }
 interface RegistrationFormData {
     email: string;
@@ -10,9 +25,9 @@ interface RegistrationFormData {
     password: string;
     confirmPassword: string;
 }
-declare var __VLS_1: {}, __VLS_3: {}, __VLS_5: {}, __VLS_7: {}, __VLS_9: {}, __VLS_17: {}, __VLS_19: {}, __VLS_21: {}, __VLS_23: {
+declare var __VLS_1: {}, __VLS_3: {}, __VLS_5: {}, __VLS_7: {}, __VLS_9: {}, __VLS_16: {}, __VLS_18: {}, __VLS_20: {}, __VLS_22: {
     message: string;
-}, __VLS_25: {
+}, __VLS_24: {
     error: string;
 };
 type __VLS_Slots = {} & {
@@ -26,30 +41,30 @@ type __VLS_Slots = {} & {
 } & {
     'password-strength'?: (props: typeof __VLS_9) => any;
 } & {
-    'confirm-password-field'?: (props: typeof __VLS_17) => any;
+    'confirm-password-field'?: (props: typeof __VLS_16) => any;
 } & {
-    'submit-button'?: (props: typeof __VLS_19) => any;
+    'submit-button'?: (props: typeof __VLS_18) => any;
 } & {
-    footer?: (props: typeof __VLS_21) => any;
+    footer?: (props: typeof __VLS_20) => any;
 } & {
-    'success-message'?: (props: typeof __VLS_23) => any;
+    'success-message'?: (props: typeof __VLS_22) => any;
 } & {
-    'error-message'?: (props: typeof __VLS_25) => any;
+    'error-message'?: (props: typeof __VLS_24) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    error: (error: string) => any;
+    submit: (data: RegistrationFormData) => any;
     success: (data: {
         user: Omit<UserWithoutPassword, "active">;
         message: string;
     }) => any;
-    error: (error: string) => any;
-    submit: (data: RegistrationFormData) => any;
 }, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    onError?: ((error: string) => any) | undefined;
+    onSubmit?: ((data: RegistrationFormData) => any) | undefined;
     onSuccess?: ((data: {
         user: Omit<UserWithoutPassword, "active">;
         message: string;
     }) => any) | undefined;
-    onError?: ((error: string) => any) | undefined;
-    onSubmit?: ((data: RegistrationFormData) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/runtime/components/NUsersRegisterForm.vue

@@ -3,12 +3,29 @@ import { ref, computed, watch } from "vue";
 import { navigateTo } from "#app";
 import { useRuntimeConfig } from "#imports";
 import { validatePassword } from "nuxt-users/utils";
+import { useNuxtUsersLocale } from "../composables/useNuxtUsersLocale";
 const { public: { nuxtUsers } } = useRuntimeConfig();
 const { passwordValidation } = nuxtUsers;
+const { t } = useNuxtUsersLocale();
 const props = defineProps({
   apiEndpoint: { type: String, required: false },
   redirectTo: { type: String, required: false },
-  loginLink: { type: String, required: false }
+  loginLink: { type: String, required: false },
+  title: { type: String, required: false },
+  subtitle: { type: String, required: false },
+  nameLabel: { type: String, required: false },
+  namePlaceholder: { type: String, required: false },
+  emailLabel: { type: String, required: false },
+  emailPlaceholder: { type: String, required: false },
+  passwordLabel: { type: String, required: false },
+  passwordPlaceholder: { type: String, required: false },
+  confirmPasswordLabel: { type: String, required: false },
+  confirmPasswordPlaceholder: { type: String, required: false },
+  passwordMismatchError: { type: String, required: false },
+  submitLabel: { type: String, required: false },
+  submittingLabel: { type: String, required: false },
+  alreadyHaveAccountText: { type: String, required: false },
+  signInLinkText: { type: String, required: false }
 });
 const emit = defineEmits(["success", "error", "submit"]);
 const apiEndpoint = computed(() => props.apiEndpoint || `${nuxtUsers?.apiBasePath}/register`);
@@ -25,7 +42,8 @@ const formData = ref({
 watch(() => formData.value.password, (newPassword) => {
   if (newPassword) {
     passwordValidationResult.value = validatePassword(newPassword, passwordValidation);
-  } else {
+  }
+  if (!newPassword) {
     passwordValidationResult.value = null;
   }
 }, { immediate: true });
@@ -83,10 +101,10 @@ const handleSubmit = async () => {
       <slot name="header">
         <div class="n-users-register-header">
           <h2 class="n-users-register-title">
-            Create Account
+            {{ props.title || t("register.title") }}
           </h2>
           <p class="n-users-register-subtitle">
-            Sign up for a new account
+            {{ props.subtitle || t("register.subtitle") }}
           </p>
         </div>
       </slot>
@@ -94,13 +112,13 @@ const handleSubmit = async () => {
       <!-- Name field -->
       <slot name="name-field">
         <div class="n-users-form-group">
-          <label for="name">Full Name</label>
+          <label for="name">{{ props.nameLabel || t("register.nameLabel") }}</label>
           <input
             id="name"
             v-model="formData.name"
             type="text"
             name="name"
-            placeholder="Enter your full name"
+            :placeholder="props.namePlaceholder || t('register.namePlaceholder')"
             required
           >
         </div>
@@ -109,13 +127,13 @@ const handleSubmit = async () => {
       <!-- Email field -->
       <slot name="email-field">
         <div class="n-users-form-group">
-          <label for="email">Email</label>
+          <label for="email">{{ props.emailLabel || t("common.email") }}</label>
           <input
             id="email"
             v-model="formData.email"
             type="email"
             name="email"
-            placeholder="Enter your email"
+            :placeholder="props.emailPlaceholder || t('register.emailPlaceholder')"
             required
           >
         </div>
@@ -124,13 +142,13 @@ const handleSubmit = async () => {
       <!-- Password field -->
       <slot name="password-field">
         <div class="n-users-form-group">
-          <label for="password">Password</label>
+          <label for="password">{{ props.passwordLabel || t("register.passwordLabel") }}</label>
           <input
             id="password"
             v-model="formData.password"
             type="password"
             name="password"
-            placeholder="Enter your password"
+            :placeholder="props.passwordPlaceholder || t('register.passwordPlaceholder')"
             required
             :minlength="passwordValidation.minLength"
           >
@@ -151,13 +169,13 @@ const handleSubmit = async () => {
       <!-- Confirm Password field -->
       <slot name="confirm-password-field">
         <div class="n-users-form-group">
-          <label for="confirmPassword">Confirm Password</label>
+          <label for="confirmPassword">{{ props.confirmPasswordLabel || t("register.confirmPasswordLabel") }}</label>
           <input
             id="confirmPassword"
             v-model="formData.confirmPassword"
             type="password"
             name="confirmPassword"
-            placeholder="Confirm your password"
+            :placeholder="props.confirmPasswordPlaceholder || t('register.confirmPasswordPlaceholder')"
             required
             :class="{ 'n-users-input-error': !passwordsMatch }"
           >
@@ -165,7 +183,7 @@ const handleSubmit = async () => {
             v-if="!passwordsMatch && formData.confirmPassword"
             class="n-users-error-text"
           >
-            Passwords do not match
+            {{ props.passwordMismatchError || t("register.passwordMismatch") }}
           </small>
         </div>
       </slot>
@@ -180,7 +198,7 @@ const handleSubmit = async () => {
             v-if="isLoading"
             class="n-users-loading-spinner"
           />
-          {{ isLoading ? "Creating Account..." : "Create Account" }}
+          {{ isLoading ? props.submittingLabel || t("register.submitting") : props.submitLabel || t("register.submit") }}
         </button>
       </slot>
 
@@ -188,12 +206,12 @@ const handleSubmit = async () => {
       <slot name="footer">
         <div class="n-users-register-footer">
           <p class="n-users-login-link">
-            Already have an account?
+            {{ props.alreadyHaveAccountText || t("register.alreadyHaveAccount") }}
             <a
               :href="loginLink || '/login'"
               class="n-users-link"
             >
-              Sign in here
+              {{ props.signInLinkText || t("register.signInLink") }}
             </a>
           </p>
         </div>

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

@@ -3,6 +3,21 @@ interface Props {
     apiEndpoint?: string;
     redirectTo?: string;
     loginLink?: string;
+    title?: string;
+    subtitle?: string;
+    nameLabel?: string;
+    namePlaceholder?: string;
+    emailLabel?: string;
+    emailPlaceholder?: string;
+    passwordLabel?: string;
+    passwordPlaceholder?: string;
+    confirmPasswordLabel?: string;
+    confirmPasswordPlaceholder?: string;
+    passwordMismatchError?: string;
+    submitLabel?: string;
+    submittingLabel?: string;
+    alreadyHaveAccountText?: string;
+    signInLinkText?: string;
 }
 interface RegistrationFormData {
     email: string;
@@ -10,9 +25,9 @@ interface RegistrationFormData {
     password: string;
     confirmPassword: string;
 }
-declare var __VLS_1: {}, __VLS_3: {}, __VLS_5: {}, __VLS_7: {}, __VLS_9: {}, __VLS_17: {}, __VLS_19: {}, __VLS_21: {}, __VLS_23: {
+declare var __VLS_1: {}, __VLS_3: {}, __VLS_5: {}, __VLS_7: {}, __VLS_9: {}, __VLS_16: {}, __VLS_18: {}, __VLS_20: {}, __VLS_22: {
     message: string;
-}, __VLS_25: {
+}, __VLS_24: {
     error: string;
 };
 type __VLS_Slots = {} & {
@@ -26,30 +41,30 @@ type __VLS_Slots = {} & {
 } & {
     'password-strength'?: (props: typeof __VLS_9) => any;
 } & {
-    'confirm-password-field'?: (props: typeof __VLS_17) => any;
+    'confirm-password-field'?: (props: typeof __VLS_16) => any;
 } & {
-    'submit-button'?: (props: typeof __VLS_19) => any;
+    'submit-button'?: (props: typeof __VLS_18) => any;
 } & {
-    footer?: (props: typeof __VLS_21) => any;
+    footer?: (props: typeof __VLS_20) => any;
 } & {
-    'success-message'?: (props: typeof __VLS_23) => any;
+    'success-message'?: (props: typeof __VLS_22) => any;
 } & {
-    'error-message'?: (props: typeof __VLS_25) => any;
+    'error-message'?: (props: typeof __VLS_24) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    error: (error: string) => any;
+    submit: (data: RegistrationFormData) => any;
     success: (data: {
         user: Omit<UserWithoutPassword, "active">;
         message: string;
     }) => any;
-    error: (error: string) => any;
-    submit: (data: RegistrationFormData) => any;
 }, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    onError?: ((error: string) => any) | undefined;
+    onSubmit?: ((data: RegistrationFormData) => any) | undefined;
     onSuccess?: ((data: {
         user: Omit<UserWithoutPassword, "active">;
         message: string;
     }) => any) | undefined;
-    onError?: ((error: string) => any) | undefined;
-    onSubmit?: ((data: RegistrationFormData) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;