From 32ecdd67536f07f9d95e331e44661afb2cf7b470 Mon Sep 17 00:00:00 2001
From: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
Date: Mon, 27 Apr 2020 10:52:14 -0400
Subject: [PATCH] feat(gesture): add support for blurring active inputs on
 gesture start (#20638)

fixes #20588
---
 core/src/components/menu/menu.tsx |  1 +
 core/src/utils/gesture/index.ts   | 15 +++++++++++++++
 2 files changed, 16 insertions(+)

diff --git a/core/src/components/menu/menu.tsx b/core/src/components/menu/menu.tsx
index 12193e24d6..079e4f8f6b 100644
--- a/core/src/components/menu/menu.tsx
+++ b/core/src/components/menu/menu.tsx
@@ -191,6 +191,7 @@ AFTER:
       gestureName: 'menu-swipe',
       gesturePriority: 30,
       threshold: 10,
+      blurOnStart: true,
       canStart: ev => this.canStart(ev),
       onWillStart: () => this.onWillStart(),
       onStart: () => this.onStart(),
diff --git a/core/src/utils/gesture/index.ts b/core/src/utils/gesture/index.ts
index 0e9833b4c2..eddfe80648 100644
--- a/core/src/utils/gesture/index.ts
+++ b/core/src/utils/gesture/index.ts
@@ -26,6 +26,7 @@ export const createGesture = (config: GestureConfig): Gesture => {
   const notCaptured = finalConfig.notCaptured;
   const onMove = finalConfig.onMove;
   const threshold = finalConfig.threshold;
+  const blurOnStart = finalConfig.blurOnStart;
 
   const detail = {
     type: 'pan',
@@ -141,7 +142,20 @@ export const createGesture = (config: GestureConfig): Gesture => {
     return true;
   };
 
+  const blurActiveElement = () => {
+    /* tslint:disable-next-line */
+    if (typeof document !== 'undefined') {
+      const activeElement = document.activeElement as HTMLElement | null;
+      if (activeElement !== null && activeElement.blur) {
+        activeElement.blur();
+      }
+    }
+  };
+
   const fireOnStart = () => {
+    if (blurOnStart) {
+      blurActiveElement();
+    }
     if (onStart) {
       onStart(detail);
     }
@@ -301,6 +315,7 @@ export interface GestureConfig {
   passive?: boolean;
   maxAngle?: number;
   threshold?: number;
+  blurOnStart?: boolean;
 
   canStart?: GestureCallback;
   onWillStart?: (_: GestureDetail) => Promise<void>;