diff --git a/frontend/src/lib/components/dashboard/DashboardDataGrid.svelte b/frontend/src/lib/components/dashboard/DashboardDataGrid.svelte index 4cef74ae..d72bd48e 100644 --- a/frontend/src/lib/components/dashboard/DashboardDataGrid.svelte +++ b/frontend/src/lib/components/dashboard/DashboardDataGrid.svelte @@ -42,6 +42,8 @@ class?: string; /** Custom cell render — returns display string */ render?: (item: any) => string; + /** If true, render() output is injected as HTML (for styled badges, etc.) */ + raw?: boolean; } // [SECTION: PROPS] @@ -79,6 +81,15 @@ // Snippet for bulk actions bar (shown above table when items are selected) children = undefined, + + // Per-row action buttons (rendered as a final column) + actions = [] as Array<{ + label: string; + handler: (item: any) => void; + variant?: string; + condition?: (item: any) => boolean; + disabled?: (item: any) => boolean; + }>, } = $props(); // [SECTION: HELPERS] @@ -255,6 +266,11 @@ {/if} {/each} + {#if actions.length > 0} + + Actions + + {/if} @@ -275,9 +291,34 @@ class="px-6 py-4 whitespace-nowrap text-sm {col.class || ''}" style={col.width ? `width:${col.width}` : ""} > - {col.render ? col.render(item) : item[col.key]} + {#if col.render} + {#if col.raw} + {@html col.render(item)} + {:else} + {col.render(item)} + {/if} + {:else} + {item[col.key]} + {/if} {/each} + {#if actions.length > 0} + + {#each actions as action} + {#if !action.condition || action.condition(item)} + + {/if} + {/each} + + {/if} {/each}