fix: combobox and some components closed the modal prematurely (#475)

* fix: combobox and other element closed the modal prematurely

* fix: dismissable not setting correct pointer events

Author: zernonia

packages/radix-vue/src/DismissableLayer/DismissableLayer.vue

@@ -132,10 +132,10 @@ onKeyStroke('Escape', (event) => {
     emits('dismiss')
 })
 
+let originalBodyPointerEvents: string
 watchEffect((cleanupFn) => {
   if (!layerElement.value)
     return
-  let originalBodyPointerEvents: string
   if (props.disableOutsidePointerEvents) {
     if (context.layersWithOutsidePointerEventsDisabled.size === 0) {
       originalBodyPointerEvents = ownerDocument.value.body.style.pointerEvents

packages/radix-vue/src/DismissableLayer/utils.ts

@@ -21,14 +21,12 @@ function isLayerExist(layerElement: HTMLElement, targetElement: HTMLElement) {
     '[data-dismissable-layer]',
   ) as HTMLElement
 
-  if (!mainLayer)
-    return false
-
   const nodeList = Array.from(
     layerElement.ownerDocument.querySelectorAll('[data-dismissable-layer]'),
   )
   if (
-    mainLayer === targetLayer
+    (targetLayer
+    && mainLayer === targetLayer)
     || nodeList.indexOf(mainLayer) < nodeList.indexOf(targetLayer)
   )
     return true
@@ -57,7 +55,6 @@ export function usePointerDownOutside(
       if (!element?.value)
         return
 
-      await nextTick()
       if (isLayerExist(element.value, event.target as HTMLElement)) {
         isPointerInsideDOMTree.value = false
         return