From 89e7daaa288d34cb0f10b0fbf97a32d447715ba6 Mon Sep 17 00:00:00 2001 From: Maxim Nesterov Date: Tue, 13 Dec 2022 11:33:31 +0300 Subject: [PATCH 1/8] fix: fix conflict QDrawer & QMessageBox --- src/qComponents/QDrawer/src/QDrawerContainer/index.vue | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/qComponents/QDrawer/src/QDrawerContainer/index.vue b/src/qComponents/QDrawer/src/QDrawerContainer/index.vue index 043f778f..a9aff74e 100644 --- a/src/qComponents/QDrawer/src/QDrawerContainer/index.vue +++ b/src/qComponents/QDrawer/src/QDrawerContainer/index.vue @@ -173,7 +173,11 @@ export default defineComponent({ const handleDocumentFocus = (event: FocusEvent): void => { const drawerValue = drawer.value; - if (drawerValue && !drawerValue.contains(event.target as HTMLElement)) { + if ( + drawerValue && + !drawerValue.contains(event.target as HTMLElement) && + document.activeElement === drawerValue + ) { drawerValue.focus(); } }; From 57917c611bbc2b296025b066be4c9276cbd4ac0b Mon Sep 17 00:00:00 2001 From: Maxim Nesterov Date: Thu, 15 Dec 2022 11:33:28 +0300 Subject: [PATCH 2/8] fix: fix conflict .focus method --- src/qComponents/QDrawer/src/QDrawerContainer/index.vue | 10 ++++++++-- src/qComponents/QDrawer/src/QDrawerContainer/types.ts | 1 + 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/src/qComponents/QDrawer/src/QDrawerContainer/index.vue b/src/qComponents/QDrawer/src/QDrawerContainer/index.vue index a9aff74e..f5a8bb19 100644 --- a/src/qComponents/QDrawer/src/QDrawerContainer/index.vue +++ b/src/qComponents/QDrawer/src/QDrawerContainer/index.vue @@ -149,6 +149,7 @@ export default defineComponent({ const drawer = ref>(null); const isShown = ref(false); const zIndex = getConfig('nextZIndex'); + const shouldBeFocused = ref(true); const drawerStyle = computed>>( () => ({ @@ -176,7 +177,7 @@ export default defineComponent({ if ( drawerValue && !drawerValue.contains(event.target as HTMLElement) && - document.activeElement === drawerValue + shouldBeFocused.value ) { drawerValue.focus(); } @@ -217,6 +218,10 @@ export default defineComponent({ }); }; + const toggleFocusState = (state): void => { + shouldBeFocused.value = state; + }; + onMounted(async () => { document.body.appendChild(instance?.vnode.el as Node); document.documentElement.style.overflow = 'hidden'; @@ -236,7 +241,8 @@ export default defineComponent({ provide('qDrawerContainer', { emitDoneEvent, - emitCloseEvent + emitCloseEvent, + toggleFocusState }); return { diff --git a/src/qComponents/QDrawer/src/QDrawerContainer/types.ts b/src/qComponents/QDrawer/src/QDrawerContainer/types.ts index a64acaf1..501651fb 100644 --- a/src/qComponents/QDrawer/src/QDrawerContainer/types.ts +++ b/src/qComponents/QDrawer/src/QDrawerContainer/types.ts @@ -27,6 +27,7 @@ export interface QDrawerContainerProps { export interface QDrawerContainerProvider { emitDoneEvent: (props: QDrawerEvent) => Promise; emitCloseEvent: () => void; + toggleFocusState: (state: boolean) => void; } export interface QDrawerContainerInstance { From 33942f536a54e930c2ce2733adc56b6a2870514e Mon Sep 17 00:00:00 2001 From: Maxim Nesterov Date: Thu, 15 Dec 2022 16:27:23 +0300 Subject: [PATCH 3/8] fix: refactor focusing method --- src/qComponents/QDrawer/index.ts | 5 +++- .../QDrawer/src/QDrawerContainer/index.vue | 28 +++++++++++-------- .../QDrawer/src/QDrawerContainer/types.ts | 10 +++++-- src/qComponents/QDrawer/src/constants.ts | 5 ++++ .../src/QMessageBoxContainer/index.vue | 19 ++++++++++++- 5 files changed, 51 insertions(+), 16 deletions(-) diff --git a/src/qComponents/QDrawer/index.ts b/src/qComponents/QDrawer/index.ts index d51c1a9b..7671c314 100644 --- a/src/qComponents/QDrawer/index.ts +++ b/src/qComponents/QDrawer/index.ts @@ -25,7 +25,10 @@ export type { QDrawerContentProps, QDrawerContentInstance } from './src/QDrawerContent'; -export { QDrawerAction } from './src/constants'; +export { + QDrawerAction, + QDrawerAddOrRemoveFocusListenerAction +} from './src/constants'; export type { QDrawer, QDrawerOptionsPosition, diff --git a/src/qComponents/QDrawer/src/QDrawerContainer/index.vue b/src/qComponents/QDrawer/src/QDrawerContainer/index.vue index f5a8bb19..994d0b9a 100644 --- a/src/qComponents/QDrawer/src/QDrawerContainer/index.vue +++ b/src/qComponents/QDrawer/src/QDrawerContainer/index.vue @@ -55,7 +55,10 @@ import { validateArray } from '@/qComponents/helpers'; import type { Nullable } from '#/helpers'; -import { QDrawerAction } from '../constants'; +import { + QDrawerAction, + QDrawerAddOrRemoveFocusListenerAction +} from '../constants'; import type { QDrawerComponent, QDrawerEvent } from '../types'; import type { @@ -149,7 +152,6 @@ export default defineComponent({ const drawer = ref>(null); const isShown = ref(false); const zIndex = getConfig('nextZIndex'); - const shouldBeFocused = ref(true); const drawerStyle = computed>>( () => ({ @@ -174,11 +176,7 @@ export default defineComponent({ const handleDocumentFocus = (event: FocusEvent): void => { const drawerValue = drawer.value; - if ( - drawerValue && - !drawerValue.contains(event.target as HTMLElement) && - shouldBeFocused.value - ) { + if (drawerValue && !drawerValue.contains(event.target as HTMLElement)) { drawerValue.focus(); } }; @@ -218,14 +216,20 @@ export default defineComponent({ }); }; - const toggleFocusState = (state): void => { - shouldBeFocused.value = state; + const addOrRemoveFocusListener = ( + action: QDrawerAddOrRemoveFocusListenerAction + ): void => { + if (action === QDrawerAddOrRemoveFocusListenerAction.add) + document.addEventListener('focus', handleDocumentFocus, true); + + if (action === QDrawerAddOrRemoveFocusListenerAction.remove) + document.removeEventListener('focus', handleDocumentFocus, true); }; onMounted(async () => { document.body.appendChild(instance?.vnode.el as Node); document.documentElement.style.overflow = 'hidden'; - document.addEventListener('focus', handleDocumentFocus, true); + addOrRemoveFocusListener(QDrawerAddOrRemoveFocusListenerAction.add); await nextTick(); isShown.value = true; @@ -235,14 +239,14 @@ export default defineComponent({ onBeforeUnmount(() => { document.documentElement.style.overflow = ''; - document.removeEventListener('focus', handleDocumentFocus, true); + addOrRemoveFocusListener(QDrawerAddOrRemoveFocusListenerAction.remove); if (!props.preventFocusAfterClosing) elementToFocusAfterClosing?.focus(); }); provide('qDrawerContainer', { emitDoneEvent, emitCloseEvent, - toggleFocusState + addOrRemoveFocusListener }); return { diff --git a/src/qComponents/QDrawer/src/QDrawerContainer/types.ts b/src/qComponents/QDrawer/src/QDrawerContainer/types.ts index 501651fb..3abfc40f 100644 --- a/src/qComponents/QDrawer/src/QDrawerContainer/types.ts +++ b/src/qComponents/QDrawer/src/QDrawerContainer/types.ts @@ -2,7 +2,11 @@ import type { Ref, ComputedRef } from 'vue'; import type { Nullable } from '#/helpers'; -import type { QDrawerAction } from '../constants'; +import type { + QDrawerAction, + QDrawerAddOrRemoveFocusListenerAction +} from '../constants'; + import type { QDrawerComponent, QDrawerContent, QDrawerEvent } from '../types'; export type QDrawerContainerPropContent = QDrawerContent; @@ -27,7 +31,9 @@ export interface QDrawerContainerProps { export interface QDrawerContainerProvider { emitDoneEvent: (props: QDrawerEvent) => Promise; emitCloseEvent: () => void; - toggleFocusState: (state: boolean) => void; + addOrRemoveFocusListener: ( + action: QDrawerAddOrRemoveFocusListenerAction + ) => void; } export interface QDrawerContainerInstance { diff --git a/src/qComponents/QDrawer/src/constants.ts b/src/qComponents/QDrawer/src/constants.ts index c171c5e3..e9b4bf65 100644 --- a/src/qComponents/QDrawer/src/constants.ts +++ b/src/qComponents/QDrawer/src/constants.ts @@ -3,3 +3,8 @@ export enum QDrawerAction { cancel = 'cancel', close = 'close' } + +export enum QDrawerAddOrRemoveFocusListenerAction { + add = 'add', + remove = 'remove' +} diff --git a/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue b/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue index 4a3b57ff..32028510 100644 --- a/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue +++ b/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue @@ -55,6 +55,7 @@ import { onMounted, nextTick, provide, + inject, onBeforeUnmount } from 'vue'; import type { PropType } from 'vue'; @@ -63,7 +64,10 @@ import { getConfig } from '@/qComponents/config'; import { isServer } from '@/qComponents/constants/isServer'; import { QScrollbar } from '@/qComponents/QScrollbar'; -import type { Nullable } from '#/helpers'; +import type { QDrawerContainerProvider } from '@/qComponents'; +import { QDrawerAddOrRemoveFocusListenerAction } from '@/qComponents'; + +import type { Nullable, Nillable } from '#/helpers'; import { QMessageBoxAction } from '../constants'; import { QMessageBoxContent } from '../QMessageBoxContent'; @@ -163,6 +167,11 @@ export default defineComponent({ setup(props: QMessageBoxContainerProps, ctx): QMessageBoxContainerInstance { const instance = getCurrentInstance(); + let qDrawerContainer: Nillable = null; + if (instance?.root.appContext.provides.qDrawerContainer) { + qDrawerContainer = inject('qDrawerContainer'); + } + const messageBox = ref>(null); const isShown = ref(false); const zIndex = getConfig('nextZIndex'); @@ -232,6 +241,10 @@ export default defineComponent({ }; onMounted(async () => { + qDrawerContainer?.addOrRemoveFocusListener( + QDrawerAddOrRemoveFocusListenerAction.remove + ); + document.body.appendChild(instance?.vnode.el as Node); document.documentElement.style.overflow = 'hidden'; document.addEventListener('focus', handleDocumentFocus, true); @@ -243,6 +256,10 @@ export default defineComponent({ }); onBeforeUnmount(() => { + qDrawerContainer?.addOrRemoveFocusListener( + QDrawerAddOrRemoveFocusListenerAction.remove + ); + document.documentElement.style.overflow = ''; document.removeEventListener('focus', handleDocumentFocus, true); if (!props.preventFocusAfterClosing) elementToFocusAfterClosing?.focus(); From 5c854ce9437346d6157202986c7cac99689eaec0 Mon Sep 17 00:00:00 2001 From: Maxim Nesterov Date: Thu, 15 Dec 2022 17:06:42 +0300 Subject: [PATCH 4/8] fix: fix use addOrRemoveFocus method --- src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue b/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue index 32028510..ab86022c 100644 --- a/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue +++ b/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue @@ -257,7 +257,7 @@ export default defineComponent({ onBeforeUnmount(() => { qDrawerContainer?.addOrRemoveFocusListener( - QDrawerAddOrRemoveFocusListenerAction.remove + QDrawerAddOrRemoveFocusListenerAction.add ); document.documentElement.style.overflow = ''; From 63568f1bde739f0e1b39c64c23f800da6d520bda Mon Sep 17 00:00:00 2001 From: Maxim Nesterov Date: Sun, 18 Dec 2022 22:53:36 +0300 Subject: [PATCH 5/8] fix: fix methods --- src/qComponents/QDrawer/index.ts | 5 +-- .../QDrawer/src/QDrawerContainer/index.vue | 31 ++++++++++--------- .../QDrawer/src/QDrawerContainer/types.ts | 10 ++---- src/qComponents/QDrawer/src/constants.ts | 5 --- .../src/QMessageBoxContainer/index.vue | 13 +++----- 5 files changed, 25 insertions(+), 39 deletions(-) diff --git a/src/qComponents/QDrawer/index.ts b/src/qComponents/QDrawer/index.ts index 7671c314..d51c1a9b 100644 --- a/src/qComponents/QDrawer/index.ts +++ b/src/qComponents/QDrawer/index.ts @@ -25,10 +25,7 @@ export type { QDrawerContentProps, QDrawerContentInstance } from './src/QDrawerContent'; -export { - QDrawerAction, - QDrawerAddOrRemoveFocusListenerAction -} from './src/constants'; +export { QDrawerAction } from './src/constants'; export type { QDrawer, QDrawerOptionsPosition, diff --git a/src/qComponents/QDrawer/src/QDrawerContainer/index.vue b/src/qComponents/QDrawer/src/QDrawerContainer/index.vue index 994d0b9a..4840a7d0 100644 --- a/src/qComponents/QDrawer/src/QDrawerContainer/index.vue +++ b/src/qComponents/QDrawer/src/QDrawerContainer/index.vue @@ -55,10 +55,7 @@ import { validateArray } from '@/qComponents/helpers'; import type { Nullable } from '#/helpers'; -import { - QDrawerAction, - QDrawerAddOrRemoveFocusListenerAction -} from '../constants'; +import { QDrawerAction } from '../constants'; import type { QDrawerComponent, QDrawerEvent } from '../types'; import type { @@ -152,6 +149,7 @@ export default defineComponent({ const drawer = ref>(null); const isShown = ref(false); const zIndex = getConfig('nextZIndex'); + const isFocusing = ref(false); const drawerStyle = computed>>( () => ({ @@ -216,20 +214,24 @@ export default defineComponent({ }); }; - const addOrRemoveFocusListener = ( - action: QDrawerAddOrRemoveFocusListenerAction - ): void => { - if (action === QDrawerAddOrRemoveFocusListenerAction.add) - document.addEventListener('focus', handleDocumentFocus, true); + const enableFocusing = (): void => { + if (isFocusing.value) return; + + document.addEventListener('focus', handleDocumentFocus, true); + isFocusing.value = true; + }; + + const disableFocusing = (): void => { + if (!isFocusing.value) return; - if (action === QDrawerAddOrRemoveFocusListenerAction.remove) - document.removeEventListener('focus', handleDocumentFocus, true); + document.removeEventListener('focus', handleDocumentFocus, true); + isFocusing.value = false; }; onMounted(async () => { document.body.appendChild(instance?.vnode.el as Node); document.documentElement.style.overflow = 'hidden'; - addOrRemoveFocusListener(QDrawerAddOrRemoveFocusListenerAction.add); + enableFocusing(); await nextTick(); isShown.value = true; @@ -239,14 +241,15 @@ export default defineComponent({ onBeforeUnmount(() => { document.documentElement.style.overflow = ''; - addOrRemoveFocusListener(QDrawerAddOrRemoveFocusListenerAction.remove); + disableFocusing(); if (!props.preventFocusAfterClosing) elementToFocusAfterClosing?.focus(); }); provide('qDrawerContainer', { emitDoneEvent, emitCloseEvent, - addOrRemoveFocusListener + enableFocusing, + disableFocusing }); return { diff --git a/src/qComponents/QDrawer/src/QDrawerContainer/types.ts b/src/qComponents/QDrawer/src/QDrawerContainer/types.ts index 3abfc40f..8d6c03d4 100644 --- a/src/qComponents/QDrawer/src/QDrawerContainer/types.ts +++ b/src/qComponents/QDrawer/src/QDrawerContainer/types.ts @@ -2,10 +2,7 @@ import type { Ref, ComputedRef } from 'vue'; import type { Nullable } from '#/helpers'; -import type { - QDrawerAction, - QDrawerAddOrRemoveFocusListenerAction -} from '../constants'; +import type { QDrawerAction } from '../constants'; import type { QDrawerComponent, QDrawerContent, QDrawerEvent } from '../types'; @@ -31,9 +28,8 @@ export interface QDrawerContainerProps { export interface QDrawerContainerProvider { emitDoneEvent: (props: QDrawerEvent) => Promise; emitCloseEvent: () => void; - addOrRemoveFocusListener: ( - action: QDrawerAddOrRemoveFocusListenerAction - ) => void; + enableFocusing: () => void; + disableFocusing: () => void; } export interface QDrawerContainerInstance { diff --git a/src/qComponents/QDrawer/src/constants.ts b/src/qComponents/QDrawer/src/constants.ts index e9b4bf65..c171c5e3 100644 --- a/src/qComponents/QDrawer/src/constants.ts +++ b/src/qComponents/QDrawer/src/constants.ts @@ -3,8 +3,3 @@ export enum QDrawerAction { cancel = 'cancel', close = 'close' } - -export enum QDrawerAddOrRemoveFocusListenerAction { - add = 'add', - remove = 'remove' -} diff --git a/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue b/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue index ab86022c..4e609600 100644 --- a/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue +++ b/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue @@ -65,7 +65,6 @@ import { isServer } from '@/qComponents/constants/isServer'; import { QScrollbar } from '@/qComponents/QScrollbar'; import type { QDrawerContainerProvider } from '@/qComponents'; -import { QDrawerAddOrRemoveFocusListenerAction } from '@/qComponents'; import type { Nullable, Nillable } from '#/helpers'; @@ -241,9 +240,7 @@ export default defineComponent({ }; onMounted(async () => { - qDrawerContainer?.addOrRemoveFocusListener( - QDrawerAddOrRemoveFocusListenerAction.remove - ); + qDrawerContainer?.disableFocusing(); document.body.appendChild(instance?.vnode.el as Node); document.documentElement.style.overflow = 'hidden'; @@ -256,13 +253,11 @@ export default defineComponent({ }); onBeforeUnmount(() => { - qDrawerContainer?.addOrRemoveFocusListener( - QDrawerAddOrRemoveFocusListenerAction.add - ); - - document.documentElement.style.overflow = ''; document.removeEventListener('focus', handleDocumentFocus, true); + document.documentElement.style.overflow = ''; if (!props.preventFocusAfterClosing) elementToFocusAfterClosing?.focus(); + + qDrawerContainer?.enableFocusing(); }); provide('qMessageBoxContainer', { From 24aa336b16dfe69ae50e5ef3ccef1b2ecae57e2c Mon Sep 17 00:00:00 2001 From: Maxim Nesterov Date: Tue, 20 Dec 2022 21:25:51 +0300 Subject: [PATCH 6/8] fix: change names of methods & remove react var --- .../QDrawer/src/QDrawerContainer/index.vue | 22 +++++++++---------- .../QDrawer/src/QDrawerContainer/types.ts | 4 ++-- .../src/QMessageBoxContainer/index.vue | 6 ++--- 3 files changed, 16 insertions(+), 16 deletions(-) diff --git a/src/qComponents/QDrawer/src/QDrawerContainer/index.vue b/src/qComponents/QDrawer/src/QDrawerContainer/index.vue index 4840a7d0..8b5e5fa7 100644 --- a/src/qComponents/QDrawer/src/QDrawerContainer/index.vue +++ b/src/qComponents/QDrawer/src/QDrawerContainer/index.vue @@ -149,7 +149,7 @@ export default defineComponent({ const drawer = ref>(null); const isShown = ref(false); const zIndex = getConfig('nextZIndex'); - const isFocusing = ref(false); + let isFocusTrapEnabled: boolean = false; const drawerStyle = computed>>( () => ({ @@ -214,24 +214,24 @@ export default defineComponent({ }); }; - const enableFocusing = (): void => { - if (isFocusing.value) return; + const enableFocusTrap = (): void => { + if (isFocusTrapEnabled) return; document.addEventListener('focus', handleDocumentFocus, true); - isFocusing.value = true; + isFocusTrapEnabled = true; }; - const disableFocusing = (): void => { - if (!isFocusing.value) return; + const disableFocusTrap = (): void => { + if (!isFocusTrapEnabled) return; document.removeEventListener('focus', handleDocumentFocus, true); - isFocusing.value = false; + isFocusTrapEnabled = false; }; onMounted(async () => { document.body.appendChild(instance?.vnode.el as Node); document.documentElement.style.overflow = 'hidden'; - enableFocusing(); + enableFocusTrap(); await nextTick(); isShown.value = true; @@ -241,15 +241,15 @@ export default defineComponent({ onBeforeUnmount(() => { document.documentElement.style.overflow = ''; - disableFocusing(); + disableFocusTrap(); if (!props.preventFocusAfterClosing) elementToFocusAfterClosing?.focus(); }); provide('qDrawerContainer', { emitDoneEvent, emitCloseEvent, - enableFocusing, - disableFocusing + enableFocusTrap, + disableFocusTrap }); return { diff --git a/src/qComponents/QDrawer/src/QDrawerContainer/types.ts b/src/qComponents/QDrawer/src/QDrawerContainer/types.ts index 8d6c03d4..eb850b3d 100644 --- a/src/qComponents/QDrawer/src/QDrawerContainer/types.ts +++ b/src/qComponents/QDrawer/src/QDrawerContainer/types.ts @@ -28,8 +28,8 @@ export interface QDrawerContainerProps { export interface QDrawerContainerProvider { emitDoneEvent: (props: QDrawerEvent) => Promise; emitCloseEvent: () => void; - enableFocusing: () => void; - disableFocusing: () => void; + enableFocusTrap: () => void; + disableFocusTrap: () => void; } export interface QDrawerContainerInstance { diff --git a/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue b/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue index 4e609600..7cbfeffd 100644 --- a/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue +++ b/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue @@ -240,7 +240,7 @@ export default defineComponent({ }; onMounted(async () => { - qDrawerContainer?.disableFocusing(); + qDrawerContainer?.disableFocusTrap(); document.body.appendChild(instance?.vnode.el as Node); document.documentElement.style.overflow = 'hidden'; @@ -253,11 +253,11 @@ export default defineComponent({ }); onBeforeUnmount(() => { - document.removeEventListener('focus', handleDocumentFocus, true); document.documentElement.style.overflow = ''; + document.removeEventListener('focus', handleDocumentFocus, true); if (!props.preventFocusAfterClosing) elementToFocusAfterClosing?.focus(); - qDrawerContainer?.enableFocusing(); + qDrawerContainer?.enableFocusTrap(); }); provide('qMessageBoxContainer', { From 511f9e7ec22ed55474166d2a2b5ec4c2a585a5d5 Mon Sep 17 00:00:00 2001 From: Maxim Nesterov Date: Tue, 20 Dec 2022 21:34:56 +0300 Subject: [PATCH 7/8] fix: add default value for inject method --- .../QMessageBox/src/QMessageBoxContainer/index.vue | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue b/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue index 7cbfeffd..481740e3 100644 --- a/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue +++ b/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue @@ -167,9 +167,10 @@ export default defineComponent({ const instance = getCurrentInstance(); let qDrawerContainer: Nillable = null; - if (instance?.root.appContext.provides.qDrawerContainer) { - qDrawerContainer = inject('qDrawerContainer'); - } + qDrawerContainer = inject>( + 'qDrawerContainer', + null + ); const messageBox = ref>(null); const isShown = ref(false); From 7c28328f3390bb7d4d2326f00715c5f039b0290d Mon Sep 17 00:00:00 2001 From: Maxim Nesterov Date: Wed, 21 Dec 2022 10:59:09 +0300 Subject: [PATCH 8/8] fix: fix let/const var qDrawerContainer --- src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue b/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue index 481740e3..97a4a7ce 100644 --- a/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue +++ b/src/qComponents/QMessageBox/src/QMessageBoxContainer/index.vue @@ -166,8 +166,7 @@ export default defineComponent({ setup(props: QMessageBoxContainerProps, ctx): QMessageBoxContainerInstance { const instance = getCurrentInstance(); - let qDrawerContainer: Nillable = null; - qDrawerContainer = inject>( + const qDrawerContainer = inject>( 'qDrawerContainer', null );