Merge pull request #3020 from nextcloud/bugfix/noid/focus-trap-modal-…

…sidebar

Fix issues with focus trap on modal

src/components/Modal/Modal.vue

@@ -445,6 +445,14 @@ export default {
  type: Boolean,
  default: true,
  },
+
+ /**
+ * Additional elements to add to the focus trap
+ */
+ additionalTrapElements: {
+ type: Array,
+ default: () => [],
+ },
  },
 
  emits: [
@@ -505,6 +513,12 @@ export default {
  }
  }
  },
+ additionalTrapElements(elements) {
+ if (this.focusTrap) {
+ const contentContainer = this.$refs.mask
+ this.focusTrap.updateContainerElements([contentContainer, ...elements])
+ }
+ },
  },
 
  beforeMount() {
@@ -661,7 +675,9 @@ export default {
  const contentContainer = this.$refs.mask
  // wait until all children are mounted and available in the DOM before focusTrap can be added
  this.$nextTick(() => {
- this.focusTrap = createFocusTrap(contentContainer)
+ this.focusTrap = createFocusTrap(contentContainer, {
+ allowOutsideClick: true,
+ })
  this.focusTrap.activate()
  })
  },