From dc17e2983dd7d6b71a44ff819f8468b5d4b18b38 Mon Sep 17 00:00:00 2001
From: Justin Starry <justin@solana.com>
Date: Thu, 20 Aug 2020 22:01:34 +0800
Subject: [PATCH] explorer: Fix search bar paste on mobile (#11735)

---
 explorer/src/components/SearchBar.tsx | 5 +++++
 explorer/src/scss/_solana.scss        | 8 ++++++++
 2 files changed, 13 insertions(+)

diff --git a/explorer/src/components/SearchBar.tsx b/explorer/src/components/SearchBar.tsx
index 3b27b47552..9e1bca15a9 100644
--- a/explorer/src/components/SearchBar.tsx
+++ b/explorer/src/components/SearchBar.tsx
@@ -40,6 +40,11 @@ export function SearchBar() {
             blurInputOnSelect
             onMenuClose={() => selectRef.current?.blur()}
             onChange={onChange}
+            styles={{
+              /* work around for https://github.com/JedWatson/react-select/issues/3857 */
+              placeholder: (style) => ({ ...style, pointerEvents: "none" }),
+              input: (style) => ({ ...style, width: "100%" }),
+            }}
             onInputChange={onInputChange}
             components={{ DropdownIndicator }}
             classNamePrefix="search-bar"
diff --git a/explorer/src/scss/_solana.scss b/explorer/src/scss/_solana.scss
index 1ed2927628..9c565395cc 100644
--- a/explorer/src/scss/_solana.scss
+++ b/explorer/src/scss/_solana.scss
@@ -190,3 +190,11 @@ h4.slot-pill {
     max-width: 120px;
   }
 }
+
+// work around for https://github.com/JedWatson/react-select/issues/3857
+.search-bar__input {
+  width: 100% !important;
+  input {
+    width: 100% !important;
+  }
+}