33 lines
		
	
	
		
			886 B
		
	
	
	
		
			TypeScript
		
	
	
			
		
		
	
	
			33 lines
		
	
	
		
			886 B
		
	
	
	
		
			TypeScript
		
	
	
| import type { Ref } from 'vue';
 | |
| import { onBeforeUnmount, onMounted } from 'vue';
 | |
| 
 | |
| export default function useSelectTriggerControl(
 | |
|   refs: Ref[],
 | |
|   open: Ref<boolean>,
 | |
|   triggerOpen: (open: boolean) => void,
 | |
| ) {
 | |
|   function onGlobalMouseDown(event: MouseEvent) {
 | |
|     let target = event.target as HTMLElement;
 | |
| 
 | |
|     if (target.shadowRoot && event.composed) {
 | |
|       target = (event.composedPath()[0] || target) as HTMLElement;
 | |
|     }
 | |
|     const elements = [refs[0]?.value, refs[1]?.value?.getPopupElement()];
 | |
|     if (
 | |
|       open.value &&
 | |
|       elements.every(element => element && !element.contains(target) && element !== target)
 | |
|     ) {
 | |
|       // Should trigger close
 | |
|       triggerOpen(false);
 | |
|     }
 | |
|   }
 | |
| 
 | |
|   onMounted(() => {
 | |
|     window.addEventListener('mousedown', onGlobalMouseDown);
 | |
|   });
 | |
| 
 | |
|   onBeforeUnmount(() => {
 | |
|     window.removeEventListener('mousedown', onGlobalMouseDown);
 | |
|   });
 | |
| }
 |