Usernames and emails are latin even when the panel runs in Persian (the
only locale that sets dir="rtl"). Inheriting the RTL direction pushes such
a string to the right edge and reorders its trailing punctuation, so
"a.zharkova@example.com (user)" renders with the parens and dots in the
wrong place. dir="auto" lets the browser pick per string: latin entries
lay out LTR, Persian ones stay RTL.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
On a panel with a few dozen users, picking one when creating a connection
means scrolling a plain <select> and reading every entry — there is no way
to type a name.
Adds a small dependency-free searchable select and applies it to the user
picker in the Add Connection modal. It's progressive enhancement: the
native <select> stays in the DOM as the source of truth, so `.value`,
programmatic assignment and `change` listeners keep working exactly as
before (server.html reads `connectionUserId.value` unchanged).
- static/js/searchable-select.js: opt-in via `data-searchable`, with
case-insensitive substring filtering, keyboard navigation
(arrows/Enter/Escape/Tab), an empty state, and ARIA combobox roles
- styles built entirely from existing CSS variables, so light/dark themes
and RTL follow the rest of the panel
- labels come from `data-search-*` attributes, so strings stay in the
templates; new keys added to all five locales
No jQuery/select2: the panel ships no jQuery today, and pulling in two
libraries for one dropdown seemed a poor trade against ~300 lines of
vanilla JS.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>