Initial commit

src/components/dialogs/DeleteConfirmDialog.vue

@@ -0,0 +1,32 @@
+<script setup lang="ts">
+defineProps<{
+  modelValue: boolean
+  itemCount: number
+}>()
+
+const emit = defineEmits<{
+  'update:modelValue': [value: boolean]
+  'confirm': []
+}>()
+
+function handleClose() {
+  emit('update:modelValue', false)
+}
+</script>
+
+<template>
+  <v-dialog :model-value="modelValue" @update:model-value="emit('update:modelValue', $event)" max-width="400">
+    <v-card>
+      <v-card-title>Delete</v-card-title>
+      <v-card-text>
+        Are you sure you want to delete {{ itemCount }} item(s)?
+        This action cannot be undone.
+      </v-card-text>
+      <v-card-actions>
+        <v-spacer />
+        <v-btn variant="text" @click="handleClose">Cancel</v-btn>
+        <v-btn color="error" variant="elevated" @click="emit('confirm')">Delete</v-btn>
+      </v-card-actions>
+    </v-card>
+  </v-dialog>
+</template>