@makolabs/ripple 1.2.8 → 1.2.9

package/dist/layout/table/Table.svelte

@@ -44,7 +44,6 @@
 		headerActions
 		// eslint-disable-next-line @typescript-eslint/no-explicit-any
 	}: TableProps<any> = $props();
-
 	// Determine if we should use Card wrapper
 	const hasHeader = $derived(title !== undefined || subtitle !== undefined);
 

package/dist/layout/table/table.js

@@ -19,33 +19,33 @@ export const table = tv({
     variants: {
         size: {
             xs: {
-                th: 'px-2 py-1.5 text-xs',
+                th: 'px-2 py-1.5',
                 td: 'px-2 py-1.5 text-xs'
             },
             sm: {
-                th: 'px-3 py-2 text-xs',
+                th: 'px-3 py-2',
                 td: 'px-3 py-2 text-sm'
             },
             base: {
-                th: 'px-4 py-3 text-sm',
+                th: 'px-3 py-2',
                 td: 'px-4 py-3 text-sm'
             },
             lg: {
-                th: 'px-6 py-4 text-sm',
+                th: 'px-4 py-3',
                 td: 'px-6 py-4 text-base'
             },
             xl: {
-                th: 'px-8 py-5 text-base',
+                th: 'px-5 py-4',
                 td: 'px-8 py-5 text-base'
             },
             '2xl': {
-                th: 'px-10 py-6 text-lg',
+                th: 'px-6 py-5',
                 td: 'px-10 py-6 text-lg'
             }
         },
         color: {
             default: {
-                th: 'text-default-700 bg-default-50'
+                th: 'bg-gray-50'
             },
             [Color.PRIMARY]: {
                 th: 'text-primary-700 bg-primary-50',

package/dist/user-management/UserManagement.svelte

@@ -79,14 +79,38 @@
 	}
 
 	// Modal handlers
-	function openViewModal(user: User) {
+	async function openViewModal(user: User) {
 		selectedUser = user;
 		showViewModal = true;
+		// Fetch fresh permissions for the user
+		if (user.id) {
+			try {
+				const permissions = await adapter.getUserPermissions(user.id);
+				selectedUser = {
+					...user,
+					permissions
+				};
+			} catch (error) {
+				console.error('Error fetching user permissions:', error);
+			}
+		}
 	}
 
-	function openEditModal(user: User) {
+	async function openEditModal(user: User) {
 		selectedUser = user;
 		showEditCreateModal = true;
+		// Fetch fresh permissions for the user
+		if (user.id) {
+			try {
+				const permissions = await adapter.getUserPermissions(user.id);
+				selectedUser = {
+					...user,
+					permissions
+				};
+			} catch (error) {
+				console.error('Error fetching user permissions:', error);
+			}
+		}
 	}
 
 	function openCreateModal() {

package/dist/user-management/UserModal.svelte

@@ -31,15 +31,69 @@
 		permissions: []
 	});
 
+	// Helper function to detect role from permissions
+	function detectRoleFromPermissions(userPermissions: string[]): string {
+		if (!roles || roles.length === 0 || !userPermissions || userPermissions.length === 0) {
+			return '';
+		}
+
+		// First, try to find an exact match (all role permissions match user permissions)
+		for (const role of roles) {
+			if (role.permissions && role.permissions.length > 0) {
+				const rolePermissions = role.permissions;
+				// Check if all role permissions are present in user permissions
+				const allPermissionsMatch = rolePermissions.every((perm) => userPermissions.includes(perm));
+				// Also check if the counts match (to avoid partial matches)
+				if (allPermissionsMatch && rolePermissions.length === userPermissions.length) {
+					return role.value;
+				}
+			}
+		}
+
+		// If no exact match, try to find a role where all of its permissions are in user's permissions
+		// This handles cases where user has additional permissions beyond the role
+		for (const role of roles) {
+			if (role.permissions && role.permissions.length > 0) {
+				const allRolePermissionsInUser = role.permissions.every((perm) =>
+					userPermissions.includes(perm)
+				);
+				if (allRolePermissionsInUser) {
+					return role.value;
+				}
+			}
+		}
+
+		// Last resort: find any role where at least one permission matches
+		// (for cases where permissions might be partially matching)
+		for (const role of roles) {
+			if (role.permissions && role.permissions.length > 0) {
+				const hasMatchingPermission = role.permissions.some((perm) =>
+					userPermissions.includes(perm)
+				);
+				if (hasMatchingPermission) {
+					return role.value;
+				}
+			}
+		}
+
+		return '';
+	}
+
 	// Initialize form data when user changes
 	$effect(() => {
 		if (open && user) {
+			// Detect role from permissions if role is not already set
+			let detectedRole = user.role || '';
+			if (!detectedRole && user.permissions && user.permissions.length > 0) {
+				detectedRole = detectRoleFromPermissions(user.permissions);
+			}
+
 			formData = {
 				first_name: user.first_name || '',
 				last_name: user.last_name || '',
 				email_addresses: user.email_addresses || [{ email_address: '' }],
 				phone_numbers: user.phone_numbers || [],
-				role: user.role || '',
+				role: detectedRole,
 				permissions: user.permissions || []
 			};
 		} else if (open && !user) {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@makolabs/ripple",
-	"version": "1.2.8",
+	"version": "1.2.9",
 	"description": "Simple Svelte 5 powered component library ✨",
 	"license": "SEE LICENSE IN LICENSE",
 	"repository": {