diff --git a/CHANGELOG.md b/CHANGELOG.md index 780c1dde0c..2856a31618 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 +## [0.25.1](https://github.com/IBM/carbon-components-svelte/releases/tag/v0.25.1) - 2020-11-28 + +**Fixes** + +- set `selectedResultIndex` in HeaderSearch when clicking a result ([PR #430](https://github.com/IBM/carbon-components-svelte/pull/430), [issue #429](https://github.com/IBM/carbon-components-svelte/issues/429)) + ## [0.25.0](https://github.com/IBM/carbon-components-svelte/releases/tag/v0.25.0) - 2020-11-27 **Features** diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md index 45400296be..addbd6e2a4 100644 --- a/COMPONENT_INDEX.md +++ b/COMPONENT_INDEX.md @@ -1,6 +1,6 @@ # Component Index -> 155 components exported from carbon-components-svelte@0.25.0. +> 155 components exported from carbon-components-svelte@0.25.1. ## Components diff --git a/package.json b/package.json index 92376ad727..b5b2a28ca0 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "carbon-components-svelte", - "version": "0.25.0", + "version": "0.25.1", "license": "Apache-2.0", "author": "IBM", "description": "Svelte implementation of the Carbon Design System", diff --git a/src/UIShell/HeaderSearch.svelte b/src/UIShell/HeaderSearch.svelte index 63574c472b..eb4644980c 100644 --- a/src/UIShell/HeaderSearch.svelte +++ b/src/UIShell/HeaderSearch.svelte @@ -26,7 +26,7 @@ /** Specify the selected result index */ export let selectedResultIndex = 0; - import { createEventDispatcher } from "svelte"; + import { createEventDispatcher, tick } from "svelte"; import Close20 from "carbon-icons-svelte/lib/Close20/Close20.svelte"; import Search20 from "carbon-icons-svelte/lib/Search20/Search20.svelte"; @@ -223,12 +223,13 @@ on:focus on:blur on:keydown - on:keydown="{({ key }) => { - switch (key) { + on:keydown="{(e) => { + switch (e.key) { case 'Enter': selectResult(); break; case 'ArrowDown': + e.preventDefault(); if (selectedResultIndex === results.length - 1) { selectedResultIndex = 0; } else { @@ -236,6 +237,7 @@ } break; case 'ArrowUp': + e.preventDefault(); if (selectedResultIndex === 0) { selectedResultIndex = results.length - 1; } else { @@ -270,7 +272,11 @@ role="menuitem" href="{result.href}" class:selected="{selectedId === `search-menuitem-${i}`}" - on:click|preventDefault="{selectResult}" + on:click|preventDefault="{async () => { + selectedResultIndex = i; + await tick(); + selectResult(); + }}" > {result.text}