diff --git a/docs/components/modal.md b/docs/components/modal.md index f9bc64ad..4fe8e9dd 100644 --- a/docs/components/modal.md +++ b/docs/components/modal.md @@ -161,7 +161,7 @@ import { FwbModal } from 'flowbite-vue' ## Focus Trap -You can enable focus trapping by setting the `focus-trap` prop to `true`. This keeps the focus within the modal, preventing users from tabbing to elements outside of it, which improves accessibility. +You can enable focus trapping by setting the `focus-trap` prop to `true`. This keeps the focus within the modal, preventing users from tabbing to elements outside of it, which improves accessibility. esc key will still close the modal. ```vue diff --git a/src/components/FwbModal/FwbModal.vue b/src/components/FwbModal/FwbModal.vue index 2c6a3ffa..8cd0423e 100644 --- a/src/components/FwbModal/FwbModal.vue +++ b/src/components/FwbModal/FwbModal.vue @@ -128,6 +128,7 @@ const modalRef: Ref = ref(null) const { activate, deactivate } = useFocusTrap(modalRef, { immediate: false, initialFocus: () => modalRef.value?.querySelector('button[aria-label="close"]') || modalRef.value, + escapeDeactivates: false, }) onMounted(async () => {