fix: use cell instead of cell text where needed

src/lib/elements/table/cell.svelte

@@ -1,12 +1,16 @@
 <script lang="ts">
+    export let title = '';
     export let onlyDesktop = false;
     export let width: number = null;
+    export let showOverflow = false;
 </script>
 
 <div
     width={width?.toString() ?? ''}
     class="table-col"
+    class:u-overflow-visible={showOverflow}
     class:is-only-desktop={onlyDesktop}
+    data-title={title}
     role="cell">
     <slot />
 </div>

src/routes/console/[project]/users/index.svelte

@@ -8,6 +8,7 @@
         TableHeader,
         TableBody,
         TableCellHead,
+        TableCell,
         TableCellText,
         TableRowLink
     } from '$lib/elements/table';
@@ -85,7 +86,7 @@
                             </div>
                         </TableCellText>
                         <TableCellText title="Email">{user.email}</TableCellText>
-                        <TableCellText title="Status">
+                        <TableCell title="Status">
                             {#if user.status}
                                 <Pill success={user.emailVerification}>
                                     {user.emailVerification ? 'Verified' : 'Unverified'}
@@ -93,14 +94,14 @@
                             {:else}
                                 <Pill danger>Blocked</Pill>
                             {/if}
-                        </TableCellText>
-                        <TableCellText showOverflow title="ID">
+                        </TableCell>
+                        <TableCell showOverflow title="ID">
                             <Copy value={user.$id}>
                                 <Pill button
                                     ><span class="icon-duplicate" aria-hidden="true" />
                                     <span class="text">User ID</span></Pill>
                             </Copy>
-                        </TableCellText>
+                        </TableCell>
                         <TableCellText title="Joined">
                             {toLocaleDateTime(user.registration)}
                         </TableCellText>

src/routes/console/[project]/users/user/[user]/memberships.svelte

@@ -7,7 +7,8 @@
         TableBody,
         TableRowLink,
         TableCellHead,
-        TableCellText
+        TableCellText,
+        TableCell
     } from '$lib/elements/table';
     import { Button } from '$lib/elements/forms';
     import { Container } from '$lib/layout';
@@ -61,7 +62,7 @@
                                 </div>
                             </TableCellText>
                             <TableCellText title="Role">{membership.roles}</TableCellText>
-                            <TableCellText title="">
+                            <TableCell>
                                 <button
                                     class="button is-only-icon is-text"
                                     aria-label="Delete item"
@@ -71,7 +72,7 @@
                                     }}>
                                     <span class="icon-trash" aria-hidden="true" />
                                 </button>
-                            </TableCellText>
+                            </TableCell>
                         </TableRowLink>
                     {/each}
                 </TableBody>