From c260027c9c01104ceef38a473ac3383824adf09b Mon Sep 17 00:00:00 2001
From: thislight <l1589002388@gmail.com>
Date: Sun, 1 Dec 2024 22:50:29 +0800
Subject: [PATCH] add isPointNotInRect

---
 src/material/BottomSheet.tsx   | 8 ++------
 src/platform/StackedRouter.tsx | 8 ++------
 src/platform/dom.ts            | 5 +++++
 3 files changed, 9 insertions(+), 12 deletions(-)
 create mode 100644 src/platform/dom.ts

diff --git a/src/material/BottomSheet.tsx b/src/material/BottomSheet.tsx
index 73fd734..99bfbd0 100644
--- a/src/material/BottomSheet.tsx
+++ b/src/material/BottomSheet.tsx
@@ -13,6 +13,7 @@ import {
   animateSlideInFromRight,
   animateSlideOutToRight,
 } from "~platform/anim";
+import { isPointNotInRect } from "~platform/dom";
 
 export type BottomSheetProps = {
   open?: boolean;
@@ -120,12 +121,7 @@ const BottomSheet: ParentComponent<BottomSheetProps> = (props) => {
     event.stopPropagation();
     if (event.target !== event.currentTarget) return;
     const rect = event.currentTarget.getBoundingClientRect();
-    const isNotInDialog =
-      event.clientY < rect.top ||
-      event.clientY > rect.bottom ||
-      event.clientX < rect.left ||
-      event.clientX > rect.right;
-    if (isNotInDialog) {
+    if (isPointNotInRect(rect, event.clientX, event.clientY)) {
       props.onClose?.("backdrop");
     }
   };
diff --git a/src/platform/StackedRouter.tsx b/src/platform/StackedRouter.tsx
index 975d66f..75e7594 100644
--- a/src/platform/StackedRouter.tsx
+++ b/src/platform/StackedRouter.tsx
@@ -19,6 +19,7 @@ import { animateSlideInFromRight, animateSlideOutToRight } from "./anim";
 import { ANIM_CURVE_DECELERATION, ANIM_CURVE_STD } from "~material/theme";
 import { makeEventListener } from "@solid-primitives/event-listener";
 import { useWindowSize } from "@solid-primitives/resize-observer";
+import { isPointNotInRect } from "./dom";
 
 export type StackedRouterProps = Omit<RouterProps, "url">;
 
@@ -173,12 +174,7 @@ function onDialogClick(
 ) {
   if (event.target !== event.currentTarget) return;
   const rect = event.currentTarget.getBoundingClientRect();
-  const isNotInDialog =
-    event.clientY < rect.top ||
-    event.clientY > rect.bottom ||
-    event.clientX < rect.left ||
-    event.clientX > rect.right;
-  if (isNotInDialog) {
+  if (isPointNotInRect(rect, event.clientX, event.clientY)) {
     onClose();
   }
 }
diff --git a/src/platform/dom.ts b/src/platform/dom.ts
new file mode 100644
index 0000000..cc3925c
--- /dev/null
+++ b/src/platform/dom.ts
@@ -0,0 +1,5 @@
+export function isPointNotInRect(rect: DOMRect, ptX: number, ptY: number) {
+  return (
+    ptY < rect.top || ptY > rect.bottom || ptX < rect.left || ptX > rect.right
+  );
+}