From 75d95fa41c9eaec11b755c6a4a55cc1b4d9cd117 Mon Sep 17 00:00:00 2001 From: Aleksander Grygier Date: Fri, 4 Sep 2026 13:28:13 +0200 Subject: [PATCH] ui : use a constant for the dropdown-menu search selector Extract the '[data-slot="dropdown-menu-content"] input' focus selector into a DROPDOWN_MENU_CONTENT_SEARCH_SELECTOR constant, alongside the existing data-slot selector constant. Assisted-by: llama-ui:Qwen3.8-Flash-Next --- .../models/ModelsSelector/ModelsSelectorDropdown.svelte | 8 ++++++-- tools/ui/src/lib/constants/css-classes.constants.ts | 6 ++++++ 2 files changed, 12 insertions(+), 2 deletions(-) diff --git a/tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorDropdown.svelte b/tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorDropdown.svelte index c2c2512518..604ec3703f 100644 --- a/tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorDropdown.svelte +++ b/tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorDropdown.svelte @@ -12,7 +12,11 @@ import type { ModelItem } from '$lib/components/app/navigation/utils'; import * as DropdownMenu from '$lib/components/ui/dropdown-menu'; import * as Tooltip from '$lib/components/ui/tooltip'; - import { MODEL_SELECTOR_ICON, SETTINGS_KEYS } from '$lib/constants'; + import { + DROPDOWN_MENU_CONTENT_SEARCH_SELECTOR, + MODEL_SELECTOR_ICON, + SETTINGS_KEYS + } from '$lib/constants'; import { KeyboardKey, ServerModelStatus } from '$lib/enums'; import { useModelParamsFallback } from '$lib/hooks/use-model-params-fallback.svelte'; import { useModelsSelector } from '$lib/hooks/use-models-selector.svelte'; @@ -56,7 +60,7 @@ if (!isOpen) return; document - .querySelector('[data-slot="dropdown-menu-content"] input') + .querySelector(DROPDOWN_MENU_CONTENT_SEARCH_SELECTOR) ?.focus({ preventScroll: true }); }); } diff --git a/tools/ui/src/lib/constants/css-classes.constants.ts b/tools/ui/src/lib/constants/css-classes.constants.ts index 07dd77ff57..37b7b03fc9 100644 --- a/tools/ui/src/lib/constants/css-classes.constants.ts +++ b/tools/ui/src/lib/constants/css-classes.constants.ts @@ -23,6 +23,12 @@ export const DIALOG_SUBMENU_CONTENT = 'w-60'; export const CHAT_INPUT_FOCUS_SELECTOR = '[data-slot="input-area"] textarea, [data-slot="input-area"] [contenteditable="true"]'; +/** + * Selects the search input inside an open dropdown-menu's content, to focus it + * after the menu mounts (bits-ui's default auto-focus can yank page scroll). + */ +export const DROPDOWN_MENU_CONTENT_SEARCH_SELECTOR = '[data-slot="dropdown-menu-content"] input'; + /** Default Tailwind size class for inline icon components (lucide, etc.). */ export const ICON_CLASS_DEFAULT = 'h-4 w-4';