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({