From 8af1058b51cc608e3c364685dd953cf4cccb3113 Mon Sep 17 00:00:00 2001
From: Beatrice <17920228+beatrice94@users.noreply.github.com>
Date: Mon, 14 Nov 2022 16:51:01 +1100
Subject: [PATCH] fix: upgrade downshift and remove breaking changes (#858)

* fix: update downshift and remove breaking changes

* added changeset

* fix: update MenuKeyDown calls

* Update package.json

Co-authored-by: Jessica <jhong@sajari.com>

* Update packages/components/package.json

Co-authored-by: Jessica <jhong@sajari.com>

* fix: remove yalc from package files

* updated yarn lock file

* fix: adjusted padding and text size for combobox

* Update packages/components/src/Combobox/styles.ts

Co-authored-by: Jessica <jhong@sajari.com>

* fix: update changeset

* Delete healthy-books-own.md

Co-authored-by: Beatrice Parfait <beatrice.parfait@algolia.com>
Co-authored-by: Jessica <jhong@sajari.com>
---
 .changeset/fuzzy-rice-switch.md            |  5 +++++
 packages/components/package.json           |  2 +-
 packages/components/src/Combobox/index.tsx |  3 +--
 packages/components/src/Combobox/styles.ts |  2 +-
 packages/components/src/Select/index.tsx   |  4 ++--
 yarn.lock                                  | 24 ++++++++--------------
 6 files changed, 19 insertions(+), 21 deletions(-)
 create mode 100644 .changeset/fuzzy-rice-switch.md

diff --git a/.changeset/fuzzy-rice-switch.md b/.changeset/fuzzy-rice-switch.md
new file mode 100644
index 000000000..5a9bfb9ae
--- /dev/null
+++ b/.changeset/fuzzy-rice-switch.md
@@ -0,0 +1,5 @@
+---
+'@sajari/react-components': minor
+---
+
+Upgrade Downshift to v7.0.1 and changes to default Combobox styling
diff --git a/packages/components/package.json b/packages/components/package.json
index a00c48494..20078c9bf 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -41,7 +41,7 @@
     "body-scroll-lock": "^3.1.5",
     "classnames": "^2.2.6",
     "color": "^3.1.3",
-    "downshift": "^6.1.0",
+    "downshift": "7.0.1",
     "react-focus-lock": "^2.5.0",
     "react-ranger": "^2.1.0",
     "smoothscroll-polyfill": "^0.4.4",
diff --git a/packages/components/src/Combobox/index.tsx b/packages/components/src/Combobox/index.tsx
index 332c30b44..f7cf9ef9d 100644
--- a/packages/components/src/Combobox/index.tsx
+++ b/packages/components/src/Combobox/index.tsx
@@ -79,7 +79,6 @@ const Combobox = React.forwardRef(function ComboboxInner<T>(
     getMenuProps,
     getItemProps,
     getInputProps,
-    getComboboxProps,
     selectedItem,
     highlightedIndex,
     inputValue,
@@ -383,7 +382,7 @@ const Combobox = React.forwardRef(function ComboboxInner<T>(
         renderInAttachMode()
       ) : (
         <Box css={[styles.container, stylesProp]} className={className}>
-          <Box css={styles.inputContainer} {...getComboboxProps()}>
+          <Box css={styles.inputContainer}>
             <Box as="label" css={tw`sr-only`} {...getLabelProps({ htmlFor: id })}>
               {label ?? placeholder}
             </Box>
diff --git a/packages/components/src/Combobox/styles.ts b/packages/components/src/Combobox/styles.ts
index badbf4119..9f22fa8d1 100644
--- a/packages/components/src/Combobox/styles.ts
+++ b/packages/components/src/Combobox/styles.ts
@@ -27,7 +27,7 @@ export function getInputSpacingStyles(size?: ComboboxSize) {
 
     case 'md':
     default:
-      return tw`pl-9`;
+      return tw`pl-9 text-base`;
   }
 }
 
diff --git a/packages/components/src/Select/index.tsx b/packages/components/src/Select/index.tsx
index 4fcbe389e..6b3116989 100644
--- a/packages/components/src/Select/index.tsx
+++ b/packages/components/src/Select/index.tsx
@@ -43,8 +43,8 @@ const Select = React.forwardRef((props: SelectProps, ref?: React.Ref<HTMLDivElem
     const { changes, type } = actionAndChanges;
 
     switch (type) {
-      case useSelect.stateChangeTypes.MenuKeyDownEnter:
-      case useSelect.stateChangeTypes.MenuKeyDownSpaceButton:
+      case useSelect.stateChangeTypes.ToggleButtonKeyDownEnter:
+      case useSelect.stateChangeTypes.ToggleButtonKeyDownSpaceButton:
       case useSelect.stateChangeTypes.ItemClick:
         return {
           ...changes,
diff --git a/yarn.lock b/yarn.lock
index 5e9b42a0e..c79dfaa55 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5241,7 +5241,7 @@ __metadata:
     body-scroll-lock: ^3.1.5
     classnames: ^2.2.6
     color: ^3.1.3
-    downshift: ^6.1.0
+    downshift: 7.0.1
     jest: ^26.6.3
     react-focus-lock: ^2.5.0
     react-ranger: ^2.1.0
@@ -8441,13 +8441,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"compute-scroll-into-view@npm:^1.0.16":
-  version: 1.0.16
-  resolution: "compute-scroll-into-view@npm:1.0.16"
-  checksum: 4334db6397e52911397922d3778c56513eca97c26f669a7d35e38739aadb3340d04133f26cb5830df25dab0687c9ce934953f3e9b27556042b1af99fb15b7c7a
-  languageName: node
-  linkType: hard
-
 "compute-scroll-into-view@npm:^1.0.17":
   version: 1.0.17
   resolution: "compute-scroll-into-view@npm:1.0.17"
@@ -9289,17 +9282,18 @@ __metadata:
   languageName: node
   linkType: hard
 
-"downshift@npm:^6.1.0":
-  version: 6.1.0
-  resolution: "downshift@npm:6.1.0"
+"downshift@npm:7.0.1":
+  version: 7.0.1
+  resolution: "downshift@npm:7.0.1"
   dependencies:
-    "@babel/runtime": ^7.12.5
-    compute-scroll-into-view: ^1.0.16
+    "@babel/runtime": ^7.14.8
+    compute-scroll-into-view: ^1.0.17
     prop-types: ^15.7.2
-    react-is: ^17.0.1
+    react-is: ^17.0.2
+    tslib: ^2.3.0
   peerDependencies:
     react: ">=16.12.0"
-  checksum: c07fc6d9d9115eb92d1cabae51b3c6abff28054ab9e434af4f062e6c9ffb8d942d5770094e05f3eea3f122b4444e7a9e0f5cb4e621f747f706a4fc3548b70282
+  checksum: f2dc82171ee64777e82ad86ab8e08f1015bef289ab26799337f43a8465bd55f6b484cad4ab40030b57891e99ed3a7d41b27dd560a0929635133c41cee802bc32
   languageName: node
   linkType: hard