From 2868ed7768d40c3a8b992195a1c45e7bb51a1d51 Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Wed, 8 Nov 2023 18:32:04 +0100
Subject: [PATCH 1/2] Use input type search for search/filter input fields

---
 .../modal/common/icon-picker/icon-picker-modal.element.ts    | 5 +++--
 .../views/section-view-examine-searchers.ts                  | 1 +
 .../data-type-picker-flow-modal.element.ts                   | 1 +
 .../property-editor-ui-picker-modal.element.ts               | 1 +
 4 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/packages/core/modal/common/icon-picker/icon-picker-modal.element.ts b/src/packages/core/modal/common/icon-picker/icon-picker-modal.element.ts
index de5bccd8e4..8050305abc 100644
--- a/src/packages/core/modal/common/icon-picker/icon-picker-modal.element.ts
+++ b/src/packages/core/modal/common/icon-picker/icon-picker-modal.element.ts
@@ -106,10 +106,11 @@ export class UmbIconPickerModalElement extends UmbModalBaseElement<UmbIconPicker
 
 	renderSearchbar() {
 		return html` <uui-input
-			@keyup="${this.#filterIcons}"
+			type="search"
 			placeholder="Type to filter..."
 			label="Type to filter icons"
-			id="searchbar">
+			id="searchbar"
+			@keyup="${this.#filterIcons}">
 			<uui-icon name="search" slot="prepend" id="searchbar_icon"></uui-icon>
 		</uui-input>`;
 	}
diff --git a/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts b/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts
index 2e66e61cfc..f80ee143c8 100644
--- a/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts
+++ b/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts
@@ -112,6 +112,7 @@ export class UmbDashboardExamineSearcherElement extends UmbLitElement {
 				<p>Search the ${this.searcherName} and view the results</p>
 				<div class="flex">
 					<uui-input
+						type="search"
 						id="search-input"
 						placeholder="Type to filter..."
 						label="Type to filter"
diff --git a/src/packages/settings/data-types/modals/data-type-picker-flow/data-type-picker-flow-modal.element.ts b/src/packages/settings/data-types/modals/data-type-picker-flow/data-type-picker-flow-modal.element.ts
index e58b76edd6..413cd698ca 100644
--- a/src/packages/settings/data-types/modals/data-type-picker-flow/data-type-picker-flow-modal.element.ts
+++ b/src/packages/settings/data-types/modals/data-type-picker-flow/data-type-picker-flow-modal.element.ts
@@ -195,6 +195,7 @@ export class UmbDataTypePickerFlowModalElement extends UmbLitElement {
 
 	private _renderFilter() {
 		return html` <uui-input
+			type="search"
 			id="filter"
 			@input="${this._handleFilterInput}"
 			placeholder="Type to filter..."
diff --git a/src/packages/settings/data-types/modals/property-editor-ui-picker/property-editor-ui-picker-modal.element.ts b/src/packages/settings/data-types/modals/property-editor-ui-picker/property-editor-ui-picker-modal.element.ts
index 4c953898ef..4fe275bfde 100644
--- a/src/packages/settings/data-types/modals/property-editor-ui-picker/property-editor-ui-picker-modal.element.ts
+++ b/src/packages/settings/data-types/modals/property-editor-ui-picker/property-editor-ui-picker-modal.element.ts
@@ -111,6 +111,7 @@ export class UmbPropertyEditorUIPickerModalElement extends UmbLitElement {
 
 	private _renderFilter() {
 		return html` <uui-input
+			type="search"
 			id="filter"
 			@input="${this._handleFilterInput}"
 			placeholder="Type to filter..."

From fd2a9d7a100fb0106e15a06477b859e193eb9ffc Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Wed, 8 Nov 2023 18:36:27 +0100
Subject: [PATCH 2/2] Search input type

---
 .../dictionary/dashboard-localization-dictionary.element.ts  | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/packages/dictionary/dashboards/dictionary/dashboard-localization-dictionary.element.ts b/src/packages/dictionary/dashboards/dictionary/dashboard-localization-dictionary.element.ts
index 9f9831a07d..acaaa39823 100644
--- a/src/packages/dictionary/dashboards/dictionary/dashboard-localization-dictionary.element.ts
+++ b/src/packages/dictionary/dashboards/dictionary/dashboard-localization-dictionary.element.ts
@@ -129,10 +129,11 @@ export class UmbDashboardTranslationDictionaryElement extends UmbLitElement {
 						${this.localize.term('dictionary_createNew')}
 					</uui-button>
 					<uui-input
-						@keyup="${this.#filter}"
+						type="search"
+						id="searchbar"
 						placeholder=${this.localize.term('placeholders_filter')}
 						label=${this.localize.term('placeholders_filter')}
-						id="searchbar">
+						@keyup="${this.#filter}">
 						<div slot="prepend">
 							<uui-icon name="search" id="searchbar_icon"></uui-icon>
 						</div>