fix(NcModal): use useTrapStackControl for pausing other focus traps

[skip ci]

Signed-off-by: Maksim Sukharev <[email protected]>

Author: Antreesy

src/components/NcModal/NcModal.vue

@@ -351,6 +351,7 @@ import Timer from '../../utils/Timer.js'
 import Close from 'vue-material-design-icons/Close.vue'
 import Pause from 'vue-material-design-icons/Pause.vue'
 import Play from 'vue-material-design-icons/Play.vue'
+import { useTrapStackControl } from '../../composables/useTrapStackControl.js'
 
 export default {
 	name: 'NcModal',
@@ -574,7 +575,6 @@ export default {
 			playing: false,
 			slideshowTimeout: null,
 			focusTrap: null,
-			externalFocusTrapStack: [],
 			randId: GenRandomId(),
 			internalShow: true,
 		}
@@ -657,6 +657,10 @@ export default {
 		},
 	},
 
+	created() {
+		useTrapStackControl(() => this.showModal)
+	},
+
 	beforeMount() {
 		window.addEventListener('keydown', this.handleKeydown)
 	},
@@ -864,11 +868,6 @@ export default {
 				setReturnFocus: this.setReturnFocus,
 			}
 
-			// Deactivate other focus traps to unlock modal elements
-			this.externalFocusTrapStack = [...options.trapStack]
-			for (const trap of this.externalFocusTrapStack) {
-				trap.deactivate()
-			}
 			// Init focus trap
 			this.focusTrap = createFocusTrap([contentContainer, ...this.additionalTrapElements], options)
 			this.focusTrap.activate()
@@ -879,10 +878,6 @@ export default {
 			}
 			this.focusTrap?.deactivate()
 			this.focusTrap = null
-			for (const trap of this.externalFocusTrapStack) {
-				trap.activate()
-			}
-			this.externalFocusTrapStack = []
 		},
 
 	},