diff --git a/app/components/modal/ModalContainer.vue b/app/components/modal/ModalContainer.vue
index 28f43b62..a8fb7896 100644
--- a/app/components/modal/ModalContainer.vue
+++ b/app/components/modal/ModalContainer.vue
@@ -82,7 +82,7 @@ function handleFavouritedBoostedByClose() {
>
-
+
diff --git a/app/components/modal/ModalDialog.vue b/app/components/modal/ModalDialog.vue
index d6ae88d2..d88836a9 100644
--- a/app/components/modal/ModalDialog.vue
+++ b/app/components/modal/ModalDialog.vue
@@ -10,6 +10,7 @@ const {
closeByMask = true,
useVIf = true,
keepAlive = false,
+ focusFirstElement = true,
} = defineProps<{
// level of depth
zIndex?: number
@@ -21,6 +22,8 @@ const {
keepAlive?: boolean
// The aria-labelledby id for the dialog.
dialogLabelledBy?: string
+ // Whether to focus on the first element when the modal opens.
+ focusFirstElement?: boolean
}>()
const emit = defineEmits<{
@@ -45,6 +48,7 @@ const { activate } = useFocusTrap(elDialogRoot, {
escapeDeactivates: true,
preventScroll: true,
returnFocusOnDeactivate: true,
+ initialFocus: focusFirstElement ? undefined : false,
})
defineExpose({