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 <[email protected]> * Update packages/components/package.json Co-authored-by: Jessica <[email protected]> * 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 <[email protected]> * fix: update changeset * Delete healthy-books-own.md Co-authored-by: Beatrice Parfait <[email protected]> Co-authored-by: Jessica <[email protected]>
sajari · Nov 14, 2022 · 8af1058 · 8af1058
1 parent 46debd6
commit 8af1058
Show file tree

Hide file tree

Showing 6 changed files with 19 additions and 21 deletions.
diff --git a/.changeset/fuzzy-rice-switch.md 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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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