fix(Autocomplete): enhance reactivity by value change from outside (#…

…2922)

packages/dnb-design-system-portal/src/docs/uilib/components/autocomplete/methods.mdx

@@ -7,8 +7,11 @@ You can manipulate the used data dynamically, either by changing the `data` prop
 - `updateData` replace all data entries.
 - `emptyData` remove all data entries.
 - `resetSelectedItem` will invalidate the selected key.
-- `revalidateSelectedItem` will re-validate the selected key on the given `value`.
+- `revalidateSelectedItem` will re-validate the internal selected key on the given `value`.
+- `revalidateInputValue` will re-validate the current input value and update it – based on the given `value`.
 - `setInputValue` update the input value.
+- `clearInputValue` will set the current input value to an empty string.
+- `focusInput` will set focus on the input element.
 - `showIndicator` shows a progress indicator instead of the icon (inside the input).
 - `hideIndicator` hides the progress indicator inside the input.
 - `showIndicatorItem` shows an item with a [ProgressIndicator](/uilib/components/progress-indicator) status as an data option item.

packages/dnb-design-system-portal/src/docs/uilib/components/autocomplete/properties.mdx

@@ -19,6 +19,7 @@ You may check out the [DrawerList Properties](#drawerlist-properties) down below
 | `search_numbers`                                                 | _(optional)_ if set to `true` and `search_in_word_index` is not set, the user will be able to more easily search and filter e.g. bank account numbers. Defaults to `false`.                                                           |
 | `search_in_word_index`                                           | _(optional)_ this gives you the possibility to change the threshold number, which defines from what word on we search "inside words". Defaults to `3`.                                                                                |
 | `keep_value`                                                     | _(optional)_ use `true` to not remove the typed value on input blur, if it is invalid. By default, the typed value will disappear / replaced by a selected value from the data list during the input field blur. Defaults to `false`. |
+| `keep_selection`                                                 | _(optional)_ use `true` to not remove selected item on input blur, when the input value is empty. Defaults to `false`.                                                                                                                |
 | `keep_value_and_selection`                                       | _(optional)_ like `keep_value` – but would not reset to the selected value during input field blur. Also, the selected value would still be kept. Defaults to `false`.                                                                |
 | `prevent_selection`                                              | _(optional)_ if set to `true`, no permanent selection will be made. Also, the typed value will not disappear on input blur (like `keep_value`). Defaults to `false`.                                                                  |
 | `show_clear_button`                                              | _(optional)_ if set to `true`, a clear button is shown inside the input field. Defaults to `false`.                                                                                                                                   |

packages/dnb-design-system-portal/src/shared/menu/SearchBar.tsx

@@ -16,6 +16,7 @@ import {
 } from './SearchBar.module.scss'
 import { scrollToAnimation } from '../parts/Layout'
 import { getIndexName } from '../../uilib/search/searchHelpers'
+import { applyPageFocus } from '@dnb/eufemia/src/shared/helpers'
 
 const indexName = getIndexName()
 const algoliaApplicationID = 'SLD6KEYMQ9'
@@ -51,9 +52,11 @@ export const SearchBarInput = () => {
     showIndicator()
   }
 
-  const onChangeHandler = ({ data }) => {
+  const onChangeHandler = ({ data, emptyData }) => {
     try {
       navigate(`/${data.hit.slug}`.replace('//', '/'))
+      emptyData()
+      applyPageFocus('content')
     } catch (e) {
       setStatus(e.message)
     }

packages/dnb-eufemia/src/components/autocomplete/Autocomplete.d.ts

@@ -124,6 +124,10 @@ export interface AutocompleteProps
    * Use `true` to not remove the typed value on input blur, if it is invalid. By default, the typed value will disappear / replaced by a selected value from the data list during the input field blur. Defaults to `false`.
    */
   keep_value?: boolean;
+  /**
+   * Use `true` to not remove the selected value/key on input blur, if it is invalid. By default, the typed value will disappear / replaced by a selected value from the data list during the input field blur. Defaults to `false`.
+   */
+  keep_selection?: boolean;
   /**
    * Like `keep_value` – but would not reset to the selected value during input field blur. Also, the selected value would still be kept. Defaults to `false`.
    */