fix: clear input text and selected item on escape key (downshift-js#689)

.all-contributorsrc

@@ -1054,6 +1054,15 @@
         "code",
         "bug"
       ]
+    },
+    {
+      "login": "gaskar",
+      "name": "Karen Gasparyan",
+      "avatar_url": "https://avatars1.githubusercontent.com/u/491166?v=4",
+      "profile": "https://github.com/gaskar",
+      "contributions": [
+        "code"
+      ]
     }
   ]
 }

.size-snapshot.json

@@ -1,59 +1,59 @@
 {
   "dist/downshift.cjs.js": {
-    "bundled": 55424,
-    "minified": 24572,
-    "gzipped": 6727
+    "bundled": 55478,
+    "minified": 24602,
+    "gzipped": 6733
   },
   "preact/dist/downshift.cjs.js": {
-    "bundled": 53993,
-    "minified": 23422,
-    "gzipped": 6529
+    "bundled": 54047,
+    "minified": 23452,
+    "gzipped": 6536
   },
   "preact/dist/downshift.umd.min.js": {
-    "bundled": 66597,
-    "minified": 22781,
-    "gzipped": 7232
+    "bundled": 66654,
+    "minified": 22813,
+    "gzipped": 7237
   },
   "preact/dist/downshift.umd.js": {
-    "bundled": 79370,
-    "minified": 28040,
-    "gzipped": 8593
+    "bundled": 79425,
+    "minified": 28070,
+    "gzipped": 8598
   },
   "dist/downshift.umd.min.js": {
-    "bundled": 71478,
-    "minified": 24075,
-    "gzipped": 7803
+    "bundled": 71535,
+    "minified": 24107,
+    "gzipped": 7808
   },
   "dist/downshift.umd.js": {
-    "bundled": 108769,
-    "minified": 37045,
-    "gzipped": 11357
+    "bundled": 108824,
+    "minified": 37075,
+    "gzipped": 11362
   },
   "dist/downshift.esm.js": {
-    "bundled": 55050,
-    "minified": 24281,
-    "gzipped": 6655,
+    "bundled": 55104,
+    "minified": 24311,
+    "gzipped": 6661,
     "treeshaked": {
       "rollup": {
-        "code": 17130,
+        "code": 17162,
         "import_statements": 354
       },
       "webpack": {
-        "code": 18427
+        "code": 18459
       }
     }
   },
   "preact/dist/downshift.esm.js": {
-    "bundled": 53639,
-    "minified": 23146,
-    "gzipped": 6459,
+    "bundled": 53693,
+    "minified": 23176,
+    "gzipped": 6466,
     "treeshaked": {
       "rollup": {
-        "code": 17120,
+        "code": 17152,
         "import_statements": 336
       },
       "webpack": {
-        "code": 18382
+        "code": 18414
       }
     }
   }

README.md

@@ -19,7 +19,7 @@ autocomplete/dropdown/select/combobox components</p>
 [![downloads][downloads-badge]][npmcharts] [![version][version-badge]][package]
 [![MIT License][license-badge]][license]
 
-[![All Contributors](https://img.shields.io/badge/all_contributors-107-orange.svg?style=flat-square)](#contributors)
+[![All Contributors](https://img.shields.io/badge/all_contributors-108-orange.svg?style=flat-square)](#contributors)
 [![PRs Welcome][prs-badge]][prs] [![Chat][chat-badge]][chat]
 [![Code of Conduct][coc-badge]][coc]
 [![Join the community on Spectrum][spectrum-badge]][spectrum]
@@ -878,9 +878,9 @@ described below.
   (though if the menu is closed the form submission will work normally). See below
   for customizing the handlers.
 
-- `Escape`: will reset downshift's state. This means that `highlightedIndex` will be
-  set to the `defaultHighlightedIndex`, the `inputValue` will be set to the `itemToString`
-  value of the `selectedItem`, and the `isOpen` state will be set to the `defaultIsOpen`.
+- `Escape`: will clear downshift's state. This means that `highlightedIndex` will be
+  set to the `defaultHighlightedIndex`, the `inputValue` will be set to empty string,
+  `selectedItem` will be set to `null`, and the `isOpen` state will be set to the `defaultIsOpen`.
 
 ### customizing handlers
 
@@ -1125,7 +1125,7 @@ Thanks goes to these people ([emoji key][emojis]):
 | [<img src="https://avatars3.githubusercontent.com/u/6643991?v=4" width="100px;" alt="Michaël De Boey"/><br /><sub><b>Michaël De Boey</b></sub>](http://michaeldeboey.be)<br />[💻](https://github.com/paypal/downshift/commits?author=MichaelDeBoey "Code") | [<img src="https://avatars3.githubusercontent.com/u/4412771?v=4" width="100px;" alt="Henry"/><br /><sub><b>Henry</b></sub>](https://github.com/EricHenry)<br />[💻](https://github.com/paypal/downshift/commits?author=EricHenry "Code") | [<img src="https://avatars3.githubusercontent.com/u/2180127?v=4" width="100px;" alt="Andrew Walton"/><br /><sub><b>Andrew Walton</b></sub>](http://www.greenarrow.me)<br />[🐛](https://github.com/paypal/downshift/issues?q=author%3Agreen-arrow "Bug reports") [💻](https://github.com/paypal/downshift/commits?author=green-arrow "Code") [⚠️](https://github.com/paypal/downshift/commits?author=green-arrow "Tests") | [<img src="https://avatars0.githubusercontent.com/u/13774309?v=4" width="100px;" alt="Arthur Denner"/><br /><sub><b>Arthur Denner</b></sub>](https://github.com/arthurdenner)<br />[💻](https://github.com/paypal/downshift/commits?author=arthurdenner "Code") | [<img src="https://avatars2.githubusercontent.com/u/81981?v=4" width="100px;" alt="Cody Olsen"/><br /><sub><b>Cody Olsen</b></sub>](http://twitter.com/stipsan)<br />[💻](https://github.com/paypal/downshift/commits?author=stipsan "Code") | [<img src="https://avatars0.githubusercontent.com/u/5084492?v=4" width="100px;" alt="Thomas Ladd"/><br /><sub><b>Thomas Ladd</b></sub>](https://github.com/TLadd)<br />[💻](https://github.com/paypal/downshift/commits?author=TLadd "Code") | [<img src="https://avatars3.githubusercontent.com/u/34634369?v=4" width="100px;" alt="lixualinta"/><br /><sub><b>lixualinta</b></sub>](https://github.com/lixualinta)<br />[💻](https://github.com/paypal/downshift/commits?author=lixualinta "Code") |
 | [<img src="https://avatars2.githubusercontent.com/u/2118956?v=4" width="100px;" alt="Jacob Cofman"/><br /><sub><b>Jacob Cofman</b></sub>](https://twitter.com/JCofman)<br />[💻](https://github.com/paypal/downshift/commits?author=JCofman "Code") | [<img src="https://avatars3.githubusercontent.com/u/19275184?v=4" width="100px;" alt="Joshua Freedman"/><br /><sub><b>Joshua Freedman</b></sub>](https://github.com/jf248)<br />[💻](https://github.com/paypal/downshift/commits?author=jf248 "Code") | [<img src="https://avatars1.githubusercontent.com/u/24494020?v=4" width="100px;" alt="Amy"/><br /><sub><b>Amy</b></sub>](https://github.com/AmyScript)<br />[💡](#example-AmyScript "Examples") | [<img src="https://avatars1.githubusercontent.com/u/9063669?v=4" width="100px;" alt="Rogin Farrer"/><br /><sub><b>Rogin Farrer</b></sub>](http://twitter.com/roginfarrer)<br />[💻](https://github.com/paypal/downshift/commits?author=roginfarrer "Code") | [<img src="https://avatars3.githubusercontent.com/u/871583" width="100px;" alt="Dmitrii Kanatnikov"/><br /><sub><b>Dmitrii Kanatnikov</b></sub>](https://github.com/rifler)<br />[💻](https://github.com/paypal/downshift/commits?author=rifler "Code") | [<img src="https://avatars2.githubusercontent.com/u/346300?v=4" width="100px;" alt="Dallon Feldner"/><br /><sub><b>Dallon Feldner</b></sub>](https://github.com/dallonf)<br />[🐛](https://github.com/paypal/downshift/issues?q=author%3Adallonf "Bug reports") [💻](https://github.com/paypal/downshift/commits?author=dallonf "Code") | [<img src="https://avatars2.githubusercontent.com/u/10165959?v=4" width="100px;" alt="Samuel Fuller Thomas"/><br /><sub><b>Samuel Fuller Thomas</b></sub>](https://samuelfullerthomas.com)<br />[💻](https://github.com/paypal/downshift/commits?author=samuelfullerthomas "Code") |
 | [<img src="https://avatars1.githubusercontent.com/u/2430381?v=4" width="100px;" alt="Ryan Castner"/><br /><sub><b>Ryan Castner</b></sub>](http://audiolion.github.io)<br />[💻](https://github.com/paypal/downshift/commits?author=audiolion "Code") | [<img src="https://avatars2.githubusercontent.com/u/11275392?v=4" width="100px;" alt="Silviu Alexandru Avram"/><br /><sub><b>Silviu Alexandru Avram</b></sub>](https://github.com/silviuavram)<br />[🐛](https://github.com/paypal/downshift/issues?q=author%3Asilviuavram "Bug reports") [💻](https://github.com/paypal/downshift/commits?author=silviuavram "Code") [⚠️](https://github.com/paypal/downshift/commits?author=silviuavram "Tests") | [<img src="https://avatars1.githubusercontent.com/u/15676655?v=4" width="100px;" alt="Anton Volkov"/><br /><sub><b>Anton Volkov</b></sub>](https://github.com/akronb)<br />[💻](https://github.com/paypal/downshift/commits?author=akronb "Code") [⚠️](https://github.com/paypal/downshift/commits?author=akronb "Tests") | [<img src="https://avatars3.githubusercontent.com/u/513363?v=4" width="100px;" alt="Keegan Street"/><br /><sub><b>Keegan Street</b></sub>](http://keegan.st)<br />[🐛](https://github.com/paypal/downshift/issues?q=author%3Akeeganstreet "Bug reports") [💻](https://github.com/paypal/downshift/commits?author=keeganstreet "Code") | [<img src="https://avatars1.githubusercontent.com/u/894149?v=4" width="100px;" alt="Manuel Dugué"/><br /><sub><b>Manuel Dugué</b></sub>](http://manueldugue.de)<br />[💻](https://github.com/paypal/downshift/commits?author=mdugue "Code") | [<img src="https://avatars2.githubusercontent.com/u/12477983?v=4" width="100px;" alt="Max Karadeniz"/><br /><sub><b>Max Karadeniz</b></sub>](https://github.com/mkaradeniz)<br />[💻](https://github.com/paypal/downshift/commits?author=mkaradeniz "Code") | [<img src="https://avatars3.githubusercontent.com/u/857221?v=4" width="100px;" alt="Gonzalo Beviglia"/><br /><sub><b>Gonzalo Beviglia</b></sub>](https://medium.com/@gonchub)<br />[🐛](https://github.com/paypal/downshift/issues?q=author%3AGonchuB "Bug reports") [💻](https://github.com/paypal/downshift/commits?author=GonchuB "Code") [👀](#review-GonchuB "Reviewed Pull Requests") |
-| [<img src="https://avatars2.githubusercontent.com/u/47700687?v=4" width="100px;" alt="Brian Kilrain"/><br /><sub><b>Brian Kilrain</b></sub>](https://github.com/kilrain)<br />[🐛](https://github.com/paypal/downshift/issues?q=author%3Akilrain "Bug reports") [💻](https://github.com/paypal/downshift/commits?author=kilrain "Code") [⚠️](https://github.com/paypal/downshift/commits?author=kilrain "Tests") [📖](https://github.com/paypal/downshift/commits?author=kilrain "Documentation") | [<img src="https://avatars0.githubusercontent.com/u/321265?v=4" width="100px;" alt="Gerd Zschaler"/><br /><sub><b>Gerd Zschaler</b></sub>](http://www.gzschaler.de)<br />[💻](https://github.com/paypal/downshift/commits?author=rincedd "Code") [🐛](https://github.com/paypal/downshift/issues?q=author%3Arincedd "Bug reports") |
+| [<img src="https://avatars2.githubusercontent.com/u/47700687?v=4" width="100px;" alt="Brian Kilrain"/><br /><sub><b>Brian Kilrain</b></sub>](https://github.com/kilrain)<br />[🐛](https://github.com/paypal/downshift/issues?q=author%3Akilrain "Bug reports") [💻](https://github.com/paypal/downshift/commits?author=kilrain "Code") [⚠️](https://github.com/paypal/downshift/commits?author=kilrain "Tests") [📖](https://github.com/paypal/downshift/commits?author=kilrain "Documentation") | [<img src="https://avatars0.githubusercontent.com/u/321265?v=4" width="100px;" alt="Gerd Zschaler"/><br /><sub><b>Gerd Zschaler</b></sub>](http://www.gzschaler.de)<br />[💻](https://github.com/paypal/downshift/commits?author=rincedd "Code") [🐛](https://github.com/paypal/downshift/issues?q=author%3Arincedd "Bug reports") | [<img src="https://avatars1.githubusercontent.com/u/491166?v=4" width="100px;" alt="Karen Gasparyan"/><br /><sub><b>Karen Gasparyan</b></sub>](https://github.com/gaskar)<br />[💻](https://github.com/paypal/downshift/commits?author=gaskar "Code") |
 
 <!-- ALL-CONTRIBUTORS-LIST:END -->
 

src/__tests__/downshift.get-input-props.js

@@ -420,19 +420,20 @@ test('escape on an input without a selection should reset downshift and close th
   expect(childrenSpy).toHaveBeenLastCalledWith(
     expect.objectContaining({
       isOpen: false,
+      selectedItem: null,
       inputValue: '',
     }),
   )
 })
 
-test('escape on an input with a selection should reset downshift and close the menu', () => {
-  const {escapeOnInput, childrenSpy, items} = setupDownshiftWithState()
+test('escape on an input with a selection should reset downshift, clear input and close the menu', () => {
+  const {escapeOnInput, childrenSpy} = setupDownshiftWithState()
   escapeOnInput()
   expect(childrenSpy).toHaveBeenLastCalledWith(
     expect.objectContaining({
       isOpen: false,
-      inputValue: items[0],
-      selectedItem: items[0],
+      inputValue: '',
+      selectedItem: null,
     }),
   )
 })

src/downshift.js

@@ -610,7 +610,11 @@ class Downshift extends Component {
 
     Escape(event) {
       event.preventDefault()
-      this.reset({type: stateChangeTypes.keyDownEscape})
+      this.reset({
+        type: stateChangeTypes.keyDownEscape,
+        selectedItem: null,
+        inputValue: '',
+      })
     },
   }