From d4697e5f2bdd997c8f4c4054f33d8f6669f43e68 Mon Sep 17 00:00:00 2001
From: Sam Chen <chenxsan@gmail.com>
Date: Fri, 16 Jul 2021 19:28:24 +0800
Subject: [PATCH 1/5] fix(css): set width for .DocSearch-Button

---
 packages/docsearch-css/src/button.css | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/packages/docsearch-css/src/button.css b/packages/docsearch-css/src/button.css
index 1defba7ea..2b49846ad 100644
--- a/packages/docsearch-css/src/button.css
+++ b/packages/docsearch-css/src/button.css
@@ -12,6 +12,7 @@
   margin: 0 0 0 16px;
   padding: 0 8px;
   user-select: none;
+  width: 155px;
 }
 
 .DocSearch-Button:hover,
@@ -62,6 +63,10 @@
 }
 
 @media (max-width: 750px) {
+  .DocSearch-Button {
+    width: auto;
+  }
+
   .DocSearch-Button-KeySeparator,
   .DocSearch-Button-Key {
     display: none;

From 330d06ec2e5f4298f1c85b5353ae01df14eb4eb8 Mon Sep 17 00:00:00 2001
From: Sam Chen <chenxsan@gmail.com>
Date: Fri, 16 Jul 2021 21:06:35 +0800
Subject: [PATCH 2/5] Apply suggestions from code review
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Clément Vannicatte <20689156+shortcuts@users.noreply.github.com>
---
 packages/docsearch-css/src/button.css | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/docsearch-css/src/button.css b/packages/docsearch-css/src/button.css
index 2b49846ad..ac44f524b 100644
--- a/packages/docsearch-css/src/button.css
+++ b/packages/docsearch-css/src/button.css
@@ -12,7 +12,7 @@
   margin: 0 0 0 16px;
   padding: 0 8px;
   user-select: none;
-  width: 155px;
+  min-width: 155px;
 }
 
 .DocSearch-Button:hover,
@@ -64,7 +64,7 @@
 
 @media (max-width: 750px) {
   .DocSearch-Button {
-    width: auto;
+    min-width: auto;
   }
 
   .DocSearch-Button-KeySeparator,

From 16b2ef99cd623d9a5ce4bc1cb4383b15751fc82e Mon Sep 17 00:00:00 2001
From: chenxsan <chenxsan@gmail.com>
Date: Wed, 21 Jul 2021 19:37:16 +0800
Subject: [PATCH 3/5] revert css changes

---
 packages/docsearch-css/src/button.css | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/packages/docsearch-css/src/button.css b/packages/docsearch-css/src/button.css
index ac44f524b..1defba7ea 100644
--- a/packages/docsearch-css/src/button.css
+++ b/packages/docsearch-css/src/button.css
@@ -12,7 +12,6 @@
   margin: 0 0 0 16px;
   padding: 0 8px;
   user-select: none;
-  min-width: 155px;
 }
 
 .DocSearch-Button:hover,
@@ -63,10 +62,6 @@
 }
 
 @media (max-width: 750px) {
-  .DocSearch-Button {
-    min-width: auto;
-  }
-
   .DocSearch-Button-KeySeparator,
   .DocSearch-Button-Key {
     display: none;

From d2d87cee16323e7c80ddc9a15f991dcc34dc3675 Mon Sep 17 00:00:00 2001
From: chenxsan <chenxsan@gmail.com>
Date: Wed, 21 Jul 2021 20:31:07 +0800
Subject: [PATCH 4/5] remove setKey

---
 packages/docsearch-react/src/DocSearchButton.tsx | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/packages/docsearch-react/src/DocSearchButton.tsx b/packages/docsearch-react/src/DocSearchButton.tsx
index 910e7aa2d..7c089503a 100644
--- a/packages/docsearch-react/src/DocSearchButton.tsx
+++ b/packages/docsearch-react/src/DocSearchButton.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { useState } from 'react';
 
 import { ControlKeyIcon } from './icons/ControlKeyIcon';
 import { SearchIcon } from './icons/SearchIcon';
@@ -25,15 +25,14 @@ export const DocSearchButton = React.forwardRef<
 >(({ translations = {}, ...props }, ref) => {
   const { buttonText = 'Search', buttonAriaLabel = 'Search' } = translations;
 
-  const [key, setKey] = useState<
+  const [key] = useState<
     typeof ACTION_KEY_APPLE | typeof ACTION_KEY_DEFAULT | null
-  >(null);
-
-  useEffect(() => {
+  >(() => {
     if (typeof navigator !== 'undefined') {
-      setKey(isAppleDevice() ? ACTION_KEY_APPLE : ACTION_KEY_DEFAULT);
+      return isAppleDevice() ? ACTION_KEY_APPLE : ACTION_KEY_DEFAULT;
     }
-  }, []);
+    return null;
+  });
 
   return (
     <button

From 55b9e7a7e0cd751dc818164d125743c3f22c2e9b Mon Sep 17 00:00:00 2001
From: chenxsan <chenxsan@gmail.com>
Date: Wed, 21 Jul 2021 20:47:39 +0800
Subject: [PATCH 5/5] use useMemo

---
 packages/docsearch-react/src/DocSearchButton.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/docsearch-react/src/DocSearchButton.tsx b/packages/docsearch-react/src/DocSearchButton.tsx
index 7c089503a..5d5085103 100644
--- a/packages/docsearch-react/src/DocSearchButton.tsx
+++ b/packages/docsearch-react/src/DocSearchButton.tsx
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useMemo } from 'react';
 
 import { ControlKeyIcon } from './icons/ControlKeyIcon';
 import { SearchIcon } from './icons/SearchIcon';
@@ -25,14 +25,14 @@ export const DocSearchButton = React.forwardRef<
 >(({ translations = {}, ...props }, ref) => {
   const { buttonText = 'Search', buttonAriaLabel = 'Search' } = translations;
 
-  const [key] = useState<
+  const key = useMemo<
     typeof ACTION_KEY_APPLE | typeof ACTION_KEY_DEFAULT | null
   >(() => {
     if (typeof navigator !== 'undefined') {
       return isAppleDevice() ? ACTION_KEY_APPLE : ACTION_KEY_DEFAULT;
     }
     return null;
-  });
+  }, []);
 
   return (
     <button