mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-03-01 19:20:10 +00:00
Make searchbox first focused element in settings dialog (#5804)
## Summary Resolves https://github.com/Comfy-Org/ComfyUI_frontend/issues/5164 by adding `autofocus` prop to common `SearchBox` component then enabled for the settings dialog search box (changing first focused element from the close button). Previously, searchbox was the 2nd item in tab order. ## Review Focus Accessibility implications of automatic focus and potential interference with screen readers or keyboard navigation patterns. Already discussed this previously w.r.t. accessibility, but only now implementing. ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-5804-Make-searchbox-first-focused-element-in-settings-dialog-27a6d73d3650814997facfa2418e1d40) by [Unito](https://www.unito.io)
This commit is contained in:
@@ -13,6 +13,7 @@
|
||||
class="search-box-input w-full"
|
||||
:model-value="modelValue"
|
||||
:placeholder="placeholder"
|
||||
:autofocus="autofocus"
|
||||
@input="handleInput"
|
||||
/>
|
||||
<InputIcon v-if="!modelValue" :class="icon" />
|
||||
@@ -57,7 +58,8 @@ const {
|
||||
icon = 'pi pi-search',
|
||||
debounceTime = 300,
|
||||
filterIcon,
|
||||
filters = []
|
||||
filters = [],
|
||||
autofocus = false
|
||||
} = defineProps<{
|
||||
modelValue: string
|
||||
placeholder?: string
|
||||
@@ -65,6 +67,7 @@ const {
|
||||
debounceTime?: number
|
||||
filterIcon?: string
|
||||
filters?: TFilter[]
|
||||
autofocus?: boolean
|
||||
}>()
|
||||
|
||||
const emit = defineEmits<{
|
||||
|
||||
@@ -6,6 +6,7 @@
|
||||
class="settings-search-box w-full mb-2"
|
||||
:placeholder="$t('g.searchSettings') + '...'"
|
||||
:debounce-time="128"
|
||||
autofocus
|
||||
@search="handleSearch"
|
||||
/>
|
||||
<Listbox
|
||||
|
||||
Reference in New Issue
Block a user