feat: increase sash size on touch devices (#66)

johnwalley · Dec 5, 2021 · 20ab7d9 · 20ab7d9
1 parent 578b695
commit 20ab7d9
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/src/helpers/platform.ts b/src/helpers/platform.ts
@@ -1,7 +1,9 @@
+let _isIOS = false;
 let _isMacintosh = false;
 let _userAgent: string | undefined = undefined;
 
 interface INavigator {
+  maxTouchPoints?: number;
   userAgent: string;
 }
 
@@ -11,8 +13,15 @@ declare const navigator: INavigator;
 if (typeof navigator === "object") {
   _userAgent = navigator.userAgent;
   _isMacintosh = _userAgent.indexOf("Macintosh") >= 0;
+  _isIOS =
+    (_userAgent.indexOf("Macintosh") >= 0 ||
+      _userAgent.indexOf("iPad") >= 0 ||
+      _userAgent.indexOf("iPhone") >= 0) &&
+    !!navigator.maxTouchPoints &&
+    navigator.maxTouchPoints > 0;
 } else {
   console.error("Unable to resolve platform.");
 }
 
+export const isIOS = _isIOS;
 export const isMacintosh = _isMacintosh;
diff --git a/src/sash/sash.ts b/src/sash/sash.ts
@@ -2,7 +2,7 @@ import EventEmitter from "eventemitter3";
 import debounce from "lodash.debounce";
 
 import { Disposable } from "../helpers/disposable";
-import { isMacintosh } from "../helpers/platform";
+import { isIOS, isMacintosh } from "../helpers/platform";
 import styles from "./sash.module.css";
 
 export interface SashOptions {
@@ -111,7 +111,7 @@ export class Sash extends EventEmitter implements Disposable {
       10
     );
 
-    this.size = isNaN(sashSize) ? 4 : sashSize;
+    this.size = isIOS ? 20 : isNaN(sashSize) ? 4 : sashSize;
 
     this.hidden = false;
     this.layoutProvider = layoutProvider;