Handle selection within generic CardList

VueJS generics are kinda insane. And awesome.

ts/components/ReviewContactColumnList.vue

@@ -29,7 +29,12 @@
 </style>
 
 <template>
-	<ListCard :items="items" :loading="loading">
+	<ListCard
+		:items="items"
+		:loading="loading"
+		selection-mode="single"
+		@selection-change="handleSelectionChange"
+	>
 		<!-- Filters Slot -->
 		<template #filters="{ applyFilter, clearFilters, activeFilters }">
 			<div class="user-filters">
@@ -50,11 +55,11 @@
 		</template>
 
 		<!-- Item Slot -->
-		<template #item="{ item }">
+		<template #item="{ item, isSelected, toggleSelection }">
 			<ListCardContact
 				:contact="item"
-				@click="handleContactClick(item)"
-				:isSelected="false"
+				@click="toggleSelection"
+				:is-selected="isSelected"
 			/>
 		</template>
 	</ListCard>
@@ -96,6 +101,10 @@ const handleClearFilters = (clearFilters: () => void) => {
 const handleContactClick = (contact: any) => {
 	console.log("Clicked contact:", contact);
 };
+const handleSelectionChange = (selectedContacts: Contact[]) => {
+	console.log("Selected contacts:", selectedContacts);
+	// Do something with the selected contacts
+};
 
 const items = computed((): Contact[] => {
 	if (props.contacts) {