fix: used native method for dismissing of drawer

Author: grv-saini-20

platforms/metagram/src/lib/fragments/Drawer/Drawer.svelte

@@ -2,7 +2,7 @@
 	import { onMount, type Snippet } from 'svelte';
 	import { CupertinoPane } from 'cupertino-pane';
 	import type { HTMLAttributes } from 'svelte/elements';
-	import { clickOutside, cn } from '$lib/utils';
+	import { cn } from '$lib/utils';
 	import { swipe } from 'svelte-gestures';
 	import type { SwipeCustomEvent } from 'svelte-gestures';
 
@@ -22,10 +22,9 @@
 	let drawerElement: HTMLElement;
 	let drawer: CupertinoPane;
 
-	const handleClickOutside = () => {
-		drawer?.destroy({ animate: true });
-		isPaneOpen = false;
-	};
+	function dismiss() {
+		if (drawer) drawer.destroy({ animate: true });
+	}
 
 	const handleDrawerSwipe = (event: SwipeCustomEvent) => {
 		if (event.detail.direction === ('down' as string)) {
@@ -47,7 +46,10 @@
 			bottomClose: true,
 			buttonDestroy: false,
 			cssClass: '',
-			initialBreak: 'middle'
+			initialBreak: 'middle',
+			events: {
+					onBackdropTap: () => dismiss()
+				}
 		});
 		if (isPaneOpen) {
 			drawer.present({ animate: true });
@@ -67,7 +69,6 @@
 		minSwipeDistance: 60
 	})}
 	onswipe={handleDrawerSwipe}
-	use:clickOutside={handleClickOutside}
 	class={cn(restProps.class)}
 >
 	{@render children?.()}