nuxt-users 1.27.0 → 1.28.0

package/CHANGELOG.md

@@ -1,6 +1,26 @@
 # Changelog
 
 
+## v1.28.0
+
+[compare changes](https://github.com/rrd108/nuxt-users/compare/v1.27.0...v1.28.0)
+
+### 🚀 Enhancements
+
+- Expose useUsers composable ([485d81c](https://github.com/rrd108/nuxt-users/commit/485d81c))
+
+### 🩹 Fixes
+
+- Composables are initialized on mount ([b25eb95](https://github.com/rrd108/nuxt-users/commit/b25eb95))
+
+### 🏡 Chore
+
+- **release:** V1.27.0 ([195a5b7](https://github.com/rrd108/nuxt-users/commit/195a5b7))
+
+### ❤️ Contributors
+
+- Rrd108 ([@rrd108](https://github.com/rrd108))
+
 ## v1.27.0
 
 [compare changes](https://github.com/rrd108/nuxt-users/compare/v1.26.0...v1.27.0)

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "nuxt-users",
   "configKey": "nuxtUsers",
-  "version": "1.27.0",
+  "version": "1.28.0",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.0"

package/dist/runtime/components/NUsersList.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { onMounted } from "vue";
+import { onMounted, computed } from "vue";
 import { useUsers } from "../composables/useUsers";
 import { defaultDisplayFields, defaultFieldLabels } from "nuxt-users/utils";
 defineProps({
@@ -7,23 +7,28 @@ defineProps({
   fieldLabels: { type: Object, required: false, default: () => defaultFieldLabels }
 });
 const emit = defineEmits(["editClick", "delete"]);
-const {
-  users,
-  pagination,
-  loading,
-  error,
-  fetchUsers,
-  removeUser
-} = useUsers();
+let usersComposable = null;
+const users = computed(() => usersComposable?.users.value ?? []);
+const pagination = computed(() => usersComposable?.pagination.value ?? null);
+const loading = computed(() => usersComposable?.loading.value ?? false);
+const error = computed(() => usersComposable?.error.value ?? null);
 onMounted(() => {
+  usersComposable = useUsers();
   if (users.value.length === 0) {
-    fetchUsers();
+    usersComposable.fetchUsers();
   }
 });
 const handleDelete = (user) => {
-  removeUser(user.id);
+  if (usersComposable) {
+    usersComposable.removeUser(user.id);
+  }
   emit("delete", user);
 };
+const handleFetchUsers = (page, limit) => {
+  if (usersComposable) {
+    usersComposable.fetchUsers(page, limit);
+  }
+};
 </script>
 
 <template>
@@ -102,7 +107,7 @@ const handleDelete = (user) => {
       <slot
         name="pagination"
         :pagination="pagination"
-        :fetch-users="fetchUsers"
+        :fetch-users="handleFetchUsers"
         :loading="loading"
       >
         <div v-if="pagination && pagination.totalPages > 1">
@@ -110,7 +115,7 @@ const handleDelete = (user) => {
             <button
               v-if="pagination.hasPrev"
               :disabled="loading"
-              @click="fetchUsers(pagination.page - 1)"
+              @click="handleFetchUsers(pagination.page - 1)"
             >
               Previous
             </button>
@@ -118,7 +123,7 @@ const handleDelete = (user) => {
             <button
               v-if="pagination.hasNext"
               :disabled="loading"
-              @click="fetchUsers(pagination.page + 1)"
+              @click="handleFetchUsers(pagination.page + 1)"
             >
               Next
             </button>

package/dist/runtime/components/NUsersLogoutLink.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref } from "vue";
+import { ref, onMounted } from "vue";
 import { navigateTo } from "#app";
 import { useAuthentication } from "../composables/useAuthentication";
 const props = defineProps({
@@ -16,19 +16,26 @@ const props = defineProps({
   containerStyle: { type: [String, Object], required: false }
 });
 const emit = defineEmits(["success", "click", "error"]);
-const { logout } = useAuthentication();
+let authComposable = null;
 const isLoading = ref(false);
 const error = ref("");
+onMounted(() => {
+  authComposable = useAuthentication();
+});
 const handleLogout = async (event) => {
   event.preventDefault();
   if (!confirm(props.confirmMessage)) {
     return;
   }
+  if (!authComposable) {
+    error.value = "Authentication not initialized";
+    return;
+  }
   isLoading.value = true;
   error.value = "";
   try {
     emit("click");
-    await logout();
+    await authComposable.logout();
     emit("success");
     if (props.redirectTo) {
       await navigateTo(props.redirectTo);

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

@@ -16,12 +16,12 @@ type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<LogoutLinkProps, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    error: (error: string) => any;
     click: () => any;
+    error: (error: string) => any;
     success: () => any;
 }, string, import("vue").PublicProps, Readonly<LogoutLinkProps> & Readonly<{
-    onError?: ((error: string) => any) | undefined;
     onClick?: (() => any) | undefined;
+    onError?: ((error: string) => any) | undefined;
     onSuccess?: (() => any) | undefined;
 }>, {
     redirectTo: string;

package/dist/runtime/components/NUsersProfileInfo.vue

@@ -1,6 +1,11 @@
 <script setup>
+import { computed, onMounted } from "vue";
 import { useAuthentication } from "../composables/useAuthentication";
-const { user } = useAuthentication();
+let authComposable = null;
+const user = computed(() => authComposable?.user.value ?? null);
+onMounted(() => {
+  authComposable = useAuthentication();
+});
 </script>
 
 <template>

package/dist/runtime/components/NUsersUserCard.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { computed } from "vue";
+import { computed, onMounted } from "vue";
 import { useAuthentication } from "../composables/useAuthentication";
 import { useRuntimeConfig } from "#imports";
 import { defaultDisplayFields, defaultFieldLabels } from "nuxt-users/utils";
@@ -10,8 +10,12 @@ const props = defineProps({
   fieldLabels: { type: Object, required: false, default: () => defaultFieldLabels }
 });
 const emit = defineEmits(["delete", "editClick"]);
-const { user: currentUser } = useAuthentication();
 const { public: { nuxtUsers } } = useRuntimeConfig();
+let authComposable = null;
+const currentUser = computed(() => authComposable?.user.value ?? null);
+onMounted(() => {
+  authComposable = useAuthentication();
+});
 const canEdit = computed(() => {
   if (!currentUser.value) return false;
   if (nuxtUsers.auth?.permissions) {
@@ -35,6 +39,7 @@ const canDelete = computed(() => {
   return false;
 });
 const editUser = async (user) => {
+  console.info("The edit event is emitted. Nuxt-users does not automatically calls the API to update the user, you should do it at the upper component.");
   emit("editClick", user);
 };
 const deleteUser = async (user) => {

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

@@ -3,12 +3,12 @@ interface Props {
     user?: User | null;
 }
 declare const _default: import("vue").DefineComponent<Props, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    error: (error: unknown) => any;
     cancel: () => any;
+    error: (error: unknown) => any;
     submit: (userData: User) => any;
 }, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
-    onError?: ((error: unknown) => any) | undefined;
     onCancel?: (() => any) | undefined;
+    onError?: ((error: unknown) => any) | undefined;
     onSubmit?: ((userData: User) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nuxt-users",
-  "version": "1.27.0",
+  "version": "1.28.0",
   "description": "A comprehensive user management module for Nuxt 3 and Nuxt 4 applications with authentication, authorization, database support, and CLI tools",
   "keywords": [
     "nuxt",