react-modal-sheet 3.3.0 → 3.4.0

package/src/utils.ts

@@ -15,48 +15,6 @@ export function getClosest(nums: number[], goal: number) {
   return closest;
 }
 
-export function applyRootStyles(rootId: string) {
-  const body = document.querySelector('body') as HTMLBodyElement;
-  const root = document.querySelector(`#${rootId}`) as HTMLDivElement;
-
-  if (root) {
-    const p = 24;
-    const h = window.innerHeight;
-    const s = (h - p) / h;
-    body.style.backgroundColor = '#000';
-    root.style.overflow = 'hidden';
-    root.style.willChange = 'transform';
-    root.style.transition =
-      'transform 200ms ease-in-out, border-radius 200ms linear';
-    root.style.transform = `translateY(calc(env(safe-area-inset-top) + ${p / 2}px)) scale(${s})`; // prettier-ignore
-    root.style.borderTopRightRadius = '10px';
-    root.style.borderTopLeftRadius = '10px';
-  }
-}
-
-export function cleanupRootStyles(rootId: string) {
-  const body = document.querySelector('body') as HTMLBodyElement;
-  const root = document.getElementById(rootId) as HTMLDivElement;
-
-  function onTransitionEnd() {
-    root.style.removeProperty('overflow');
-    root.style.removeProperty('will-change');
-    root.style.removeProperty('transition');
-    body.style.removeProperty('background-color');
-    root.removeEventListener('transitionend', onTransitionEnd);
-  }
-
-  if (root) {
-    // Start animating back
-    root.style.removeProperty('border-top-right-radius');
-    root.style.removeProperty('border-top-left-radius');
-    root.style.removeProperty('transform');
-
-    // Remove temp properties after animation is finished
-    root.addEventListener('transitionend', onTransitionEnd);
-  }
-}
-
 export function inDescendingOrder(arr: number[]) {
   for (let i = 0; i < arr.length; i++) {
     if (arr[i + 1] > arr[i]) return false;
@@ -101,3 +59,44 @@ export function isTouchDevice() {
   if (typeof window === 'undefined') return false;
   return 'ontouchstart' in window || navigator.maxTouchPoints > 0;
 }
+
+function testPlatform(re: RegExp) {
+  // eslint-disable-next-line @typescript-eslint/prefer-optional-chain
+  return typeof window !== 'undefined' && window.navigator != null
+    ? re.test(
+        // @ts-expect-error
+        // eslint-disable-next-line @typescript-eslint/dot-notation
+        window.navigator['userAgentData']?.platform || window.navigator.platform
+      )
+    : false;
+}
+
+function cached(fn: () => boolean) {
+  let res: boolean | null = null;
+  return () => {
+    if (res == null) {
+      res = fn();
+    }
+    return res;
+  };
+}
+
+const isMac = cached(function () {
+  return testPlatform(/^Mac/i);
+});
+
+const isIPhone = cached(function () {
+  return testPlatform(/^iPhone/i);
+});
+
+const isIPad = cached(function () {
+  return (
+    testPlatform(/^iPad/i) ||
+    // iPadOS 13 lies and says it's a Mac, but we can distinguish by detecting touch support.
+    (isMac() && navigator.maxTouchPoints > 1)
+  );
+});
+
+export const isIOS = cached(function () {
+  return isIPhone() || isIPad();
+});