diff --git a/docs/packages/ui-inputs.md b/docs/packages/ui-inputs.md
index 08fc5b5..08789a1 100644
--- a/docs/packages/ui-inputs.md
+++ b/docs/packages/ui-inputs.md
@@ -292,6 +292,8 @@ The default slot receives `{controlId, errorId, required, invalid, describedby}`
 | `DateInput`   | `min`, `max` (ISO `YYYY-MM-DD`)     | `string \| null` | `''`           |
 | `Textarea`    | `rows`, `placeholder`               | `string \| null` | `''`           |
 
+**IME input.** `TextInput` and `Textarea` follow Vue's own `v-model` on a text field: while an input method (Japanese, Chinese, Korean, …) is composing, the candidate `input` events emit nothing, and the composed value is emitted once on `compositionend`. Swapping a native `v-model` for one of these controls does not hand you every candidate.
+
 See [Nullable values](#nullable-values) for why the models are nullable and what each input emits when cleared.
 
 ### The select family
@@ -305,7 +307,7 @@ See [Nullable values](#nullable-values) for why the models are nullable and what
 | `id`               | `string`      | —              | Required. Pairs the trigger with a label/error                     |
 | `placeholder`      | `string`      | `'Select…'`    |                                                                    |
 | `disabled`         | `boolean`     | `false`        |                                                                    |
-| `alphabeticalSort` | `boolean`     | `true`         | Sorts rendered options by display string                           |
+| `alphabeticalSort` | `boolean`     | `false`        | Sorts rendered options by display string; off keeps caller order   |
 | `required`         | `boolean`     | `false`        | Conveyed via `aria-required`                                       |
 | `invalid`          | `boolean`     | `false`        | Invalid styling + `aria-invalid`                                   |
 | `describedby`      | `string`      | —              | Id of the paired error element                                     |
@@ -437,7 +439,7 @@ The **`as` escape hatch is discouraged**. Where a button genuinely cannot be use
 
 ### Attribute fall-through
 
-Props the components do not declare — `name`, `autocomplete`, `inputmode`, `data-*`, … — fall through to the underlying native control via Vue's attribute inheritance. You do not need a declared prop to make a field participate in autofill or a native form post. (`Checkbox` and `Switch` re-aim attrs at the native **input** — their root is the wrapping `<label>`.)
+Props the components do not declare — `name`, `autocomplete`, `inputmode`, `data-*`, … — fall through to the underlying native control via Vue's attribute inheritance. You do not need a declared prop to make a field participate in autofill or a native form post. (`Checkbox` and `Switch` re-aim attrs at the native **input** — their root is the wrapping `<label>`.) The six selects and comboboxes split them: `class` and `style` stay on the root `<div>`, where you style the whole control, and every other attr — `aria-label`, `aria-labelledby`, `data-*`, listeners — lands on the element carrying `role="combobox"` (the trigger button, or the combobox's text input), the only place an accessible name can name the control.
 
 ## Theming — the `--ui-*` contract
 
@@ -666,6 +668,7 @@ The select family keeps DOM focus on the trigger and conveys the keyboard-focuse
 - `aria-selected` marks the **committed** value, never the option under the keyboard pointer — keyboard/hover focus stays visual (`.is-active`) plus `aria-activedescendant`; selection only moves on <kbd>Enter</kbd> or click.
 - `MultiSelect`'s and `MultiCombobox`'s listboxes are `aria-multiselectable="true"`; `aria-selected` marks membership, and every chip's remove button carries an accessible name (`"${removeLabel} ${label}"`). `MultiCombobox` additionally conveys the committed selection through an `aria-describedby` summary (its input's accessible value is the query).
 - <kbd>Home</kbd>/<kbd>End</kbd> jump the keyboard highlight to the first/last option while the listbox is open, and the empty state (`emptyText`) is announced through a persistent, visually-hidden `aria-live="polite"` region — a filtered list draining to nothing is never silent.
+- **Typeahead** on `SingleSelect`, `MultiSelect` and `GroupSelect`: Typing on the focused trigger moves the keyboard highlight the way a native `<select>` does: a character moves to the next option starting with it (so repeating it cycles through those options), a string typed quickly — spaces included — matches by prefix, and the string resets after 500 ms without a keystroke. Matching ignores case and wraps past the last option, and a character no option starts with moves nothing. With nothing highlighted, a search starts from the chosen option on `SingleSelect` and `GroupSelect` (so with Banana chosen, `b` moves on to the next b-option); `MultiSelect` has no single chosen option and searches from the top. On a closed control a match **opens** the list on that option and commits nothing; Enter commits, as always. The comboboxes have no typeahead: what you type there is the query.
 - `required` and `invalid` are conveyed via `aria-required` / `aria-invalid`; pair `describedby` with the error element's id — `FormField` does all of this for you.
 
 `Pressable` and `Disclosure` follow the same rule from the other end: rather than describing a control to assistive tech, they _are_ the control — a real `<button>`, whose role, focusability and activation the platform supplies. The only ARIA either sets by hand is the state a button has no native equivalent for (`aria-pressed`, `aria-expanded` + `aria-controls`).
diff --git a/package-lock.json b/package-lock.json
index 966b88e..2b1569b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9434,7 +9434,7 @@
         },
         "packages/ui-inputs": {
             "name": "@script-development/ui-inputs",
-            "version": "0.16.0",
+            "version": "0.17.0",
             "license": "MIT",
             "dependencies": {
                 "@floating-ui/vue": "^2.0.1"
diff --git a/packages/ui-inputs/CHANGELOG.md b/packages/ui-inputs/CHANGELOG.md
index 4602cb9..b388226 100644
--- a/packages/ui-inputs/CHANGELOG.md
+++ b/packages/ui-inputs/CHANGELOG.md
@@ -1,5 +1,18 @@
 # @script-development/ui-inputs
 
+## 0.17.0 — 2026-10-03
+
+### Added
+
+- **Typeahead on `SingleSelect`, `MultiSelect` and `GroupSelect` (WR-1991).** A typed character moves the highlight to the next option starting with it, a quickly typed string matches by prefix, and the string resets after 500 ms or when the list closes, however it closes. The string keeps its first 64 characters. With nothing highlighted, SingleSelect and GroupSelect search from the chosen option, as a native `<select>` does; MultiSelect searches from the top. On a closed control a match opens the list on that option; nothing commits until Enter. Case is ignored one character at a time, so typed `ΟΣ` finds both `ΟΣ` and `ΟΣΑ` (a whole-word lowercase would read the first as `ος`), and `İ` finds and cycles the labels starting with `İ`. An emoji key such as `🍎` counts as one character. The comboboxes are unchanged: their typed characters are the query.
+
+### Changed
+
+- **Closing `SingleSelect` or `MultiSelect` with a click on the trigger now clears the highlight (WR-1991).** Before, the highlighted option survived a trigger close and reappeared, with its `aria-activedescendant`, when the list reopened. Every other way of closing already cleared it, and `GroupSelect` cleared it on a trigger close too.
+- **`TextInput` and `Textarea` no longer emit while an IME is composing (WR-1990).** Like Vue's own `v-model` on a text field, the candidate `input` events of a Japanese/Chinese/Korean input method emit nothing and the composed value is emitted once on `compositionend`, or on a `change` that ends the composition without one, as Vue does. Plain typing still emits on every keystroke. A consumer that reacted to each candidate (lokalekeuze: a request per candidate) now sees one value.
+- **`alphabeticalSort` now defaults to `false` (WR-1991, Commander ruling 2026-10-03).** `SingleSelect`, `MultiSelect`, `Combobox` and `MultiCombobox` render options in the order you pass them unless you set `alphabeticalSort`. Uses that relied on the old default, found on 2026-10-03 at each repo's checked-out HEAD (direct uses with no `alphabeticalSort` binding; every other fleet use already passes `:alphabetical-sort="false"`): entreezuil `frontend/src/shared/ui/BaseSelect.vue` (reached by `apps/admin/domains/users/components/UserForm.vue`); brick-inventory-orchestrator `frontend/src/apps/families/domains/sets/pages/AddSetPage.vue`, `…/sets/pages/EditSetPage.vue`, `frontend/src/apps/families/modals/PlacePartModal.vue`, `frontend/src/apps/showcase/components/ComponentGallery.vue`, `frontend/src/apps/showcase/components/FormValidationWorkbench.vue`. Add `alphabetical-sort` to keep the sorted order.
+- **The select family's attrs now reach the combobox element (WR-1991).** On `SingleSelect`, `MultiSelect`, `GroupSelect`, `Combobox`, `MultiCombobox` and `GroupCombobox`, every attr except `class` and `style` now lands on the element carrying `role="combobox"` (the trigger button or the text input) instead of the root `<div>`, so `aria-label`/`aria-labelledby` finally name the control. `class` and `style` stay on the root. A `data-*` selector or a listener you bound on one of these components now finds the control rather than the wrapper: `@focus`/`@blur` start firing (they never bubbled to the wrapper), and an `@keydown` runs on the control before the component's own handler. Fleet census on 2026-10-03: of 33 direct uses in 8 repos, 4 pass a fall-through attr, all of them `class` (ublgenie `editorial/Select.vue` ×2, `editorial/Multiselect.vue` ×2), which stays put.
+
 ## 0.16.0 — 2026-10-03
 
 ### Minor Changes
diff --git a/packages/ui-inputs/DECISIONS.md b/packages/ui-inputs/DECISIONS.md
new file mode 100644
index 0000000..dc8e61d
--- /dev/null
+++ b/packages/ui-inputs/DECISIONS.md
@@ -0,0 +1,47 @@
+# ui-inputs — decisions
+
+Why this package is shaped the way it is. Every entry names a cost it accepts or
+a limitation it lives with, so the argument sits here rather than in a comment
+nobody dates.
+
+## D1 — Select typeahead scans the whole option list; there is no large-list budget
+
+_2026-10-05, #285. Crit finding on head `dc7cf20` ("Select typeahead folds and
+scans unbounded option lists on the browser main thread"); follow-up row WR-2035._
+
+The typeahead in SingleSelect, MultiSelect and GroupSelect folds every option
+label once per change of the options (`foldedLabels`, a computed in
+`useListbox`), and each printable key runs a prefix search over the folded
+labels. Both are O(n) in the number of options, and both run on the main thread.
+
+**Why this is accepted.**
+
+- **The scan is the matching.** A prefix search has to look at the labels to
+  find one.
+- **Each key folds nothing.** Labels are folded once per options change, not on
+  every key, so a held key that matches nothing costs one scan per key.
+- **It adds no new cost class to these controls.** Every options change already
+  maps every label (`optionLabels`) and, with `alphabeticalSort` on, sorts the
+  options with `localeCompare`. Opening the list renders every row; there is no
+  virtualization. One extra O(n) fold per options change sits under that work.
+
+**What is not decided.** No supported ceiling on the number of options exists,
+and none of the three costs has been measured at large n. WR-2035 asks for that
+measurement first. Typeahead is the smallest of the three, so it is the wrong
+place to start.
+
+## D2 — AltGr and macOS Option characters do not start typeahead
+
+_2026-10-05, #285. Crit finding `30ba9376644d`; follow-up row WR-2031._
+
+`isTypeahead` refuses any keydown that carries `ctrlKey` or `altKey`, so that
+command chords such as Ctrl+A or Alt+F never type. A character printed with
+AltGr (which Windows reports as Ctrl+Alt) or with macOS Option carries the same
+flags, so a label starting with such a character cannot be reached by typing it.
+
+**Why it is not fixed here.** In the browser test lane (Chromium 153 via
+Playwright), a real AltGr press reports `getModifierState('AltGraph')` as
+`false`; only a synthetic event reports `true`. So an AltGr branch could only be
+proven against synthetic events. On macOS, Option plus a key looks the same as
+Alt plus a letter elsewhere; telling them apart needs layout or platform
+detection. WR-2031 measures what native `<select>` does on each platform first.
diff --git a/packages/ui-inputs/README.md b/packages/ui-inputs/README.md
index c915b84..3c3ef65 100644
--- a/packages/ui-inputs/README.md
+++ b/packages/ui-inputs/README.md
@@ -71,6 +71,12 @@ shape at that fixed breakpoint (a custom property cannot drive a media query, so
 
 ### The select family's shared extras
 
+**Attributes.** On all six selects and comboboxes, `class` and `style` stay on the root `<div>`,
+where you style the whole control; every other attr — `aria-label`, `aria-labelledby`, `data-*`,
+listeners — lands on the element carrying `role="combobox"` (the trigger button, or the text
+input), the only place an accessible name can name the control. A consumer attr never overrides
+the component's own `id`, `role` or ARIA wiring.
+
 **Per-option content — the `#option` scoped slot.** All four selects render each option's
 plain display string by default; the `option` slot replaces that content with your own
 (colour swatches, icons, rich labels). The payload is `{option, index, selected, active}` —
@@ -115,6 +121,17 @@ persistent, visually-hidden `aria-live="polite"` region that speaks the empty te
 the (filtered) list drains to nothing — which matters most on the filterable components,
 where typing can drain the list silently.
 
+**Typeahead (`SingleSelect`, `MultiSelect`, `GroupSelect`).** Typing on the focused trigger
+moves the keyboard highlight the way a native `<select>` does: a character moves to the next
+option starting with it (so repeating it cycles through those options), a string typed quickly —
+spaces included — matches by prefix, and the string resets after 500 ms without a keystroke.
+Matching ignores case and wraps past the last option, and a character no option starts with
+moves nothing. With nothing highlighted, a search starts from the chosen option on
+`SingleSelect` and `GroupSelect` (so with Banana chosen, `b` moves on to the next b-option);
+`MultiSelect` has no single chosen option and searches from the top. On a closed control a match
+**opens** the list on that option and commits nothing; Enter commits, as always. The comboboxes
+have no typeahead: what you type there is the query.
+
 **The committing clear entry (`SingleSelect` / `Combobox`).** `clearLabel` renders a
 committing entry **above** the options — choosing it commits `null` and closes, exactly like
 choosing an option. It lives outside the option index space: its own keyboard slot between
@@ -522,6 +539,8 @@ option — the anchor grows with it, so the popup stays on-screen.
 
 Every text-like input (`TextInput`, `DateInput`, `Textarea`) models `string | null`, and `NumberInput` models `number | null`. A `null` from a nullable backend column binds directly — the control renders empty, no `?? ''` at the call site. When the user clears the field, the string inputs emit `''` (the raw native value); a Laravel backend's `ConvertEmptyStringsToNull` middleware maps that back to `null` on submit. `NumberInput` is the one exception: an empty number input emits `null` (not `NaN`, not `''`), since a `number` model can never hold `''` honestly — so it round-trips to `null` without relying on the middleware.
 
+**IME input.** `TextInput` and `Textarea` follow Vue's own `v-model` on a text field: while an input method (Japanese, Chinese, Korean, …) is composing, the candidate `input` events emit nothing, and the composed value is emitted once on `compositionend`. Swapping a native `v-model` for one of these controls does not hand you every candidate.
+
 ## SingleSelect and assistive tech
 
 The listbox keeps DOM focus on the trigger and conveys the keyboard-focused option with
diff --git a/packages/ui-inputs/package.json b/packages/ui-inputs/package.json
index ea913c9..a10bce4 100644
--- a/packages/ui-inputs/package.json
+++ b/packages/ui-inputs/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@script-development/ui-inputs",
-    "version": "0.16.0",
+    "version": "0.17.0",
     "description": "Headless, themeable Vue 3 UI components — form inputs (field, label, error, text/number/date input, textarea, select, checkbox/radio/switch) plus keyboard-correct interactive controls (pressable, disclosure) — styled entirely through --ui-* CSS custom properties.",
     "homepage": "https://packages.script.nl/packages/ui-inputs",
     "license": "MIT",
diff --git a/packages/ui-inputs/src/components/Combobox.vue b/packages/ui-inputs/src/components/Combobox.vue
index ec8c75d..2e17a3b 100644
--- a/packages/ui-inputs/src/components/Combobox.vue
+++ b/packages/ui-inputs/src/components/Combobox.vue
@@ -1,6 +1,7 @@
 <template>
-    <div ref="root" class="ui-combobox" @keydown="onKey">
+    <div ref="root" v-bind="rootAttrs($attrs)" class="ui-combobox" @keydown="onKey">
         <input
+            v-bind="controlAttrs($attrs)"
             :id="id"
             ref="input"
             type="text"
@@ -82,15 +83,19 @@ import type {LabelKey, SelectItem} from '../types';
 
 import {useListbox} from '../composables/useListbox';
 import {ensureRefValueExists} from '../internal/reactivity';
+import {controlAttrs, rootAttrs} from '../internal/split-attrs';
 import OptionList from './OptionList.vue';
 
+// `class`/`style` → root, every other attr → the combobox element (see split-attrs).
+defineOptions({inheritAttrs: false});
+
 const {
     options,
     label,
     id,
     placeholder = 'Select…',
     disabled = false,
-    alphabeticalSort = true,
+    alphabeticalSort = false,
     required = false,
     invalid = false,
     describedby,
@@ -107,6 +112,7 @@ const {
     id: string;
     placeholder?: string;
     disabled?: boolean;
+    /** sort the rendered options by display string — off by default, so the caller's order is kept. */
     alphabeticalSort?: boolean;
     /** conveys the required state to assistive tech via `aria-required`. */
     required?: boolean;
@@ -222,6 +228,7 @@ const {
     activeDescendant,
     floatingStyles,
     onKey,
+    openList,
     close,
     clearHighlighted,
     clearId,
@@ -285,13 +292,11 @@ const choose = (option: T): void => {
 // `resetHighlight` (not a bare pointer write) so a hovered clear entry drops too.
 const onInput = (event: Event) => {
     query.value = (event.target as HTMLInputElement).value;
-    open.value = true;
+    openList();
     resetHighlight();
 };
 // Clicking the (enabled) input opens the list. A disabled input never dispatches click.
-const onClick = () => {
-    open.value = true;
-};
+const onClick = openList;
 
 // The one sanctioned defineExpose: a PUBLIC imperative handle (isms WR-0448 focus trap).
 // The input is non-null by lifetime; the loud accessor names the assumption if it ever breaks.
diff --git a/packages/ui-inputs/src/components/GroupCombobox.vue b/packages/ui-inputs/src/components/GroupCombobox.vue
index bf29999..37c12d3 100644
--- a/packages/ui-inputs/src/components/GroupCombobox.vue
+++ b/packages/ui-inputs/src/components/GroupCombobox.vue
@@ -1,6 +1,7 @@
 <template>
-    <div ref="root" class="ui-groupcombobox" @keydown="onKey">
+    <div ref="root" v-bind="rootAttrs($attrs)" class="ui-groupcombobox" @keydown="onKey">
         <input
+            v-bind="controlAttrs($attrs)"
             :id="id"
             ref="input"
             type="text"
@@ -82,8 +83,12 @@ import type {LabelKey, SelectItem} from '../types';
 import {useListbox} from '../composables/useListbox';
 import {buildGroupRows} from '../internal/group-rows';
 import {ensureRefValueExists} from '../internal/reactivity';
+import {controlAttrs, rootAttrs} from '../internal/split-attrs';
 import OptionList from './OptionList.vue';
 
+// `class`/`style` → root, every other attr → the combobox element (see split-attrs).
+defineOptions({inheritAttrs: false});
+
 const {
     groups,
     label,
@@ -224,6 +229,7 @@ const {
     activeDescendant,
     floatingStyles,
     onKey,
+    openList,
     close,
     clearHighlighted,
     clearId,
@@ -277,13 +283,11 @@ const dismiss = (): void => {
 // `resetHighlight` (not a bare pointer write) so a hovered clear entry drops too.
 const onInput = (event: Event) => {
     query.value = (event.target as HTMLInputElement).value;
-    open.value = true;
+    openList();
     resetHighlight();
 };
 // Clicking the (enabled) input opens the list. A disabled input never dispatches click.
-const onClick = () => {
-    open.value = true;
-};
+const onClick = openList;
 
 // The one sanctioned defineExpose: a PUBLIC imperative handle (isms WR-0448 focus trap).
 defineExpose({focus: () => ensureRefValueExists(input).focus()});
diff --git a/packages/ui-inputs/src/components/GroupSelect.vue b/packages/ui-inputs/src/components/GroupSelect.vue
index c97bf98..cf5ab43 100644
--- a/packages/ui-inputs/src/components/GroupSelect.vue
+++ b/packages/ui-inputs/src/components/GroupSelect.vue
@@ -1,6 +1,7 @@
 <template>
-    <div ref="root" class="ui-groupselect" @keydown="onKey">
+    <div ref="root" v-bind="rootAttrs($attrs)" class="ui-groupselect" @keydown="onKey">
         <button
+            v-bind="controlAttrs($attrs)"
             :id="id"
             ref="reference"
             type="button"
@@ -90,8 +91,12 @@ import type {LabelKey, SelectItem} from '../types';
 
 import {useListbox} from '../composables/useListbox';
 import {buildGroupRows} from '../internal/group-rows';
+import {controlAttrs, rootAttrs} from '../internal/split-attrs';
 import OptionList from './OptionList.vue';
 
+// `class`/`style` → root, every other attr → the combobox element (see split-attrs).
+defineOptions({inheritAttrs: false});
+
 const {
     groups,
     label,
@@ -201,6 +206,7 @@ const {
     floatingStyles,
     onKey,
     close,
+    toggle,
     clearHighlighted,
     clearId,
     highlightClear,
@@ -216,15 +222,9 @@ const {
     onCommit: commit,
     onDismiss: () => close(),
     onOutside: () => close(),
+    typeaheadLabels: () => flatOptions.value.map(labelOf),
+    committedIndex: () => flatOptions.value.findIndex((option) => option.id === model.value),
     clearEntry: () => clearLabel !== undefined,
     onClearCommit: commitClear,
 });
-
-const toggle = () => {
-    if (open.value) {
-        close();
-    } else {
-        open.value = true;
-    }
-};
 </script>
diff --git a/packages/ui-inputs/src/components/MultiCombobox.vue b/packages/ui-inputs/src/components/MultiCombobox.vue
index 8d714c7..901ba13 100644
--- a/packages/ui-inputs/src/components/MultiCombobox.vue
+++ b/packages/ui-inputs/src/components/MultiCombobox.vue
@@ -1,5 +1,5 @@
 <template>
-    <div ref="root" class="ui-multicombobox">
+    <div ref="root" v-bind="rootAttrs($attrs)" class="ui-multicombobox">
         <div
             ref="box"
             class="ui-control ui-multicombobox__box"
@@ -34,6 +34,7 @@
                  committed label to snap to, so Combobox's commit-snaps-query→label and
                  closed-state label re-sync are deliberately NOT ported. -->
             <input
+                v-bind="controlAttrs($attrs)"
                 :id="id"
                 ref="input"
                 type="text"
@@ -117,15 +118,19 @@ import type {LabelKey, SelectItem} from '../types';
 
 import {useListbox} from '../composables/useListbox';
 import {ensureRefValueExists} from '../internal/reactivity';
+import {controlAttrs, rootAttrs} from '../internal/split-attrs';
 import OptionList from './OptionList.vue';
 
+// `class`/`style` → root, every other attr → the combobox element (see split-attrs).
+defineOptions({inheritAttrs: false});
+
 const {
     options,
     label,
     id,
     placeholder = 'Select…',
     disabled = false,
-    alphabeticalSort = true,
+    alphabeticalSort = false,
     required = false,
     invalid = false,
     describedby,
@@ -142,6 +147,7 @@ const {
     /** shown only while nothing is committed — chips replace it, like MultiSelect. */
     placeholder?: string;
     disabled?: boolean;
+    /** sort the rendered options by display string — off by default, so the caller's order is kept. */
     alphabeticalSort?: boolean;
     /** conveys the required state to assistive tech via `aria-required`. */
     required?: boolean;
@@ -259,8 +265,8 @@ const commit = (index: number): boolean => {
     return true;
 };
 
-const {open, pointer, listboxId, optionId, activeDescendant, floatingStyles, onKey, close, resetHighlight} = useListbox(
-    {
+const {open, pointer, listboxId, optionId, activeDescendant, floatingStyles, onKey, openList, close, resetHighlight} =
+    useListbox({
         root,
         reference: box,
         floating,
@@ -273,8 +279,7 @@ const {open, pointer, listboxId, optionId, activeDescendant, floatingStyles, onK
         onCommit: commit,
         onDismiss: () => dismiss(),
         onOutside: () => dismiss(),
-    },
-);
+    });
 
 // Close-without-commit (Escape, Tab, click outside): the query clears back to the resting
 // empty state — a half-typed filter never lingers, and there is no committed label to revert to.
@@ -293,7 +298,7 @@ const remove = (value: T['id']): void => {
     model.value = model.value.filter((member) => member !== value);
     const wasOpen = open.value;
     ensureRefValueExists(input).focus();
-    open.value = wasOpen;
+    if (!wasOpen) close();
 };
 /** Backspace with an EMPTY query pops the LAST committed value (no-op when empty). */
 const popLast = (): void => {
@@ -317,15 +322,13 @@ const onInputKey = (event: KeyboardEvent): void => {
 // resets the highlight (nothing is pre-selected — Enter with no highlight is a no-op).
 const onInput = (event: Event) => {
     query.value = (event.target as HTMLInputElement).value;
-    open.value = true;
+    openList();
     resetHighlight();
 };
 // Focusing or clicking the (enabled) input opens the list (kendo's searchable choreography —
 // focus is managed into the input, and the list is its context). A disabled input never
 // dispatches either event.
-const onOpen = () => {
-    open.value = true;
-};
+const onOpen = openList;
 
 // The one sanctioned defineExpose: a PUBLIC imperative handle (Combobox parity).
 // The input is non-null by lifetime; the loud accessor names the assumption if it ever breaks.
diff --git a/packages/ui-inputs/src/components/MultiSelect.vue b/packages/ui-inputs/src/components/MultiSelect.vue
index 7fe4763..9fb018f 100644
--- a/packages/ui-inputs/src/components/MultiSelect.vue
+++ b/packages/ui-inputs/src/components/MultiSelect.vue
@@ -1,5 +1,5 @@
 <template>
-    <div ref="root" class="ui-multiselect">
+    <div ref="root" v-bind="rootAttrs($attrs)" class="ui-multiselect">
         <div
             class="ui-control ui-multiselect__box"
             :class="{'is-open': open, 'has-value': model.length > 0, 'is-invalid': invalid, 'is-disabled': disabled}"
@@ -29,6 +29,7 @@
                  root, and Enter on one must remove the chip — never leak into the listbox
                  skeleton and open the menu. -->
             <button
+                v-bind="controlAttrs($attrs)"
                 :id="id"
                 ref="reference"
                 type="button"
@@ -112,15 +113,19 @@ import type {GroupRow} from '../internal/group-rows';
 import type {LabelKey, SelectItem} from '../types';
 
 import {useListbox} from '../composables/useListbox';
+import {controlAttrs, rootAttrs} from '../internal/split-attrs';
 import OptionList from './OptionList.vue';
 
+// `class`/`style` → root, every other attr → the combobox element (see split-attrs).
+defineOptions({inheritAttrs: false});
+
 const {
     options,
     label,
     id,
     placeholder = 'Select…',
     disabled = false,
-    alphabeticalSort = true,
+    alphabeticalSort = false,
     required = false,
     invalid = false,
     describedby,
@@ -136,6 +141,7 @@ const {
     id: string;
     placeholder?: string;
     disabled?: boolean;
+    /** sort the rendered options by display string — off by default, so the caller's order is kept. */
     alphabeticalSort?: boolean;
     /** conveys the required state to assistive tech via `aria-required`. */
     required?: boolean;
@@ -225,7 +231,7 @@ const commit = (index: number): boolean => {
     return true;
 };
 
-const {open, pointer, listboxId, optionId, activeDescendant, floatingStyles, onKey, close} = useListbox({
+const {open, pointer, listboxId, optionId, activeDescendant, floatingStyles, onKey, close, toggle} = useListbox({
     root,
     reference,
     floating,
@@ -237,11 +243,9 @@ const {open, pointer, listboxId, optionId, activeDescendant, floatingStyles, onK
     onCommit: commit,
     onDismiss: () => close(),
     onOutside: () => close(),
+    typeaheadLabels: () => optionLabels.value,
 });
 
-const toggle = () => {
-    open.value = !open.value;
-};
 /** Per-chip remove — drops one committed id; never touches `open`. */
 const remove = (value: T['id']): void => {
     model.value = model.value.filter((member) => member !== value);
diff --git a/packages/ui-inputs/src/components/SingleSelect.vue b/packages/ui-inputs/src/components/SingleSelect.vue
index 330c385..aa3dc28 100644
--- a/packages/ui-inputs/src/components/SingleSelect.vue
+++ b/packages/ui-inputs/src/components/SingleSelect.vue
@@ -1,6 +1,7 @@
 <template>
-    <div ref="root" class="ui-select" @keydown="onKey">
+    <div ref="root" v-bind="rootAttrs($attrs)" class="ui-select" @keydown="onKey">
         <button
+            v-bind="controlAttrs($attrs)"
             :id="id"
             ref="reference"
             type="button"
@@ -89,15 +90,19 @@ import type {GroupRow} from '../internal/group-rows';
 import type {LabelKey, SelectItem} from '../types';
 
 import {useListbox} from '../composables/useListbox';
+import {controlAttrs, rootAttrs} from '../internal/split-attrs';
 import OptionList from './OptionList.vue';
 
+// `class`/`style` → root, every other attr → the combobox element (see split-attrs).
+defineOptions({inheritAttrs: false});
+
 const {
     options,
     label,
     id,
     placeholder = 'Select…',
     disabled = false,
-    alphabeticalSort = true,
+    alphabeticalSort = false,
     required = false,
     invalid = false,
     describedby,
@@ -114,6 +119,7 @@ const {
     id: string;
     placeholder?: string;
     disabled?: boolean;
+    /** sort the rendered options by display string — off by default, so the caller's order is kept. */
     alphabeticalSort?: boolean;
     /** conveys the required state to assistive tech via `aria-required`. */
     required?: boolean;
@@ -201,6 +207,7 @@ const {
     floatingStyles,
     onKey,
     close,
+    toggle,
     clearHighlighted,
     clearId,
     highlightClear,
@@ -216,13 +223,12 @@ const {
     onCommit: commit,
     onDismiss: () => close(),
     onOutside: () => close(),
+    typeaheadLabels: () => optionLabels.value,
+    committedIndex: () => sorted.value.findIndex((option) => option.id === model.value),
     clearEntry: () => clearLabel !== undefined,
     onClearCommit: commitClear,
 });
 
-const toggle = () => {
-    open.value = !open.value;
-};
 const choose = (option: T): void => {
     model.value = option.id;
     close();
diff --git a/packages/ui-inputs/src/components/TextInput.vue b/packages/ui-inputs/src/components/TextInput.vue
index b3b8a5d..97c0669 100644
--- a/packages/ui-inputs/src/components/TextInput.vue
+++ b/packages/ui-inputs/src/components/TextInput.vue
@@ -4,17 +4,22 @@
         :type="type"
         class="ui-control ui-input"
         :class="{'is-invalid': invalid}"
-        :value="model"
+        :value="shown"
         :placeholder="placeholder"
         :disabled="disabled"
         :aria-required="required || undefined"
         :aria-invalid="invalid || undefined"
         :aria-describedby="describedby"
-        @input="model = ($event.target as HTMLInputElement).value"
+        @input="onInput"
+        @compositionstart="onCompositionstart"
+        @compositionend="onCompositionend"
+        @change="onChange"
     />
 </template>
 
 <script setup lang="ts">
+import {commitOutsideComposition} from '../internal/composition';
+
 const {type = 'text'} = defineProps<{
     id: string;
     type?: 'text' | 'email' | 'password' | 'search' | 'tel' | 'url';
@@ -32,4 +37,11 @@ const {type = 'text'} = defineProps<{
 // an empty control); a cleared input emits '', which the fleet's
 // ConvertEmptyStringsToNull middleware converts back to null on submit.
 const model = defineModel<string | null>({required: true});
+
+const {shown, onInput, onCompositionstart, onCompositionend, onChange} = commitOutsideComposition(
+    () => model.value,
+    (value) => {
+        model.value = value;
+    },
+);
 </script>
diff --git a/packages/ui-inputs/src/components/Textarea.vue b/packages/ui-inputs/src/components/Textarea.vue
index c056a50..ff7ad1c 100644
--- a/packages/ui-inputs/src/components/Textarea.vue
+++ b/packages/ui-inputs/src/components/Textarea.vue
@@ -3,18 +3,23 @@
         :id="id"
         class="ui-control ui-textarea"
         :class="{'is-invalid': invalid}"
-        :value="model"
+        :value="shown"
         :placeholder="placeholder"
         :disabled="disabled"
         :rows="rows"
         :aria-required="required || undefined"
         :aria-invalid="invalid || undefined"
         :aria-describedby="describedby"
-        @input="model = ($event.target as HTMLTextAreaElement).value"
+        @input="onInput"
+        @compositionstart="onCompositionstart"
+        @compositionend="onCompositionend"
+        @change="onChange"
     />
 </template>
 
 <script setup lang="ts">
+import {commitOutsideComposition} from '../internal/composition';
+
 defineProps<{
     id: string;
     placeholder?: string;
@@ -32,4 +37,11 @@ defineProps<{
 // empty control); a cleared textarea emits '', which the fleet's
 // ConvertEmptyStringsToNull middleware converts back to null on submit.
 const model = defineModel<string | null>({required: true});
+
+const {shown, onInput, onCompositionstart, onCompositionend, onChange} = commitOutsideComposition(
+    () => model.value,
+    (value) => {
+        model.value = value;
+    },
+);
 </script>
diff --git a/packages/ui-inputs/src/composables/useListbox.ts b/packages/ui-inputs/src/composables/useListbox.ts
index 217599c..8fb9c3a 100644
--- a/packages/ui-inputs/src/composables/useListbox.ts
+++ b/packages/ui-inputs/src/composables/useListbox.ts
@@ -2,7 +2,7 @@ import type {Placement} from '@floating-ui/vue';
 import type {CSSProperties, Ref} from 'vue';
 
 import {autoUpdate, flip, hide, offset, shift, size, useFloating} from '@floating-ui/vue';
-import {computed, onBeforeUnmount, onMounted, ref, watch} from 'vue';
+import {computed, onBeforeUnmount, onMounted, readonly, ref, watch} from 'vue';
 
 import {ensureRefValueExists} from '../internal/reactivity';
 
@@ -65,8 +65,35 @@ export interface UseListboxOptions {
     clearEntry?: () => boolean;
     /** Commit the clear entry; returns whether a commit happened (decides preventDefault). */
     onClearCommit?: () => boolean;
+    /**
+     * The rendered options' display strings, index-aligned with the list — supplying it turns on
+     * typeahead. Select-only listboxes pass it; a combobox never does, because its typed
+     * characters belong to its text input.
+     */
+    typeaheadLabels?: () => string[];
+    /**
+     * Index of the single committed option in the rendered list, or -1. A typeahead search with
+     * nothing highlighted starts from it, as a native <select> searches from its value.
+     */
+    committedIndex?: () => number;
 }
 
+/** How long the typed string survives without a keystroke (the APG listbox examples' 500 ms). */
+const TYPEAHEAD_RESET_MS = 500;
+/**
+ * Key repeat never lets the idle reset fire, so the typed string is capped. It keeps its FIRST
+ * keys: the prefix is what matches, and a sliding tail would match from the middle of a word. Keys,
+ * not UTF-16 units: an emoji key is two units and one key.
+ */
+const TYPEAHEAD_MAX_LENGTH = 64;
+
+/**
+ * Lowercases one code point at a time, so a character folds the same wherever it stands. A whole-string
+ * lowercase is contextual (Σ ending a word becomes ς, elsewhere σ), and the keys are folded one by one,
+ * so a label folded as a whole could disagree with the same text typed (crit b8d6a958f182).
+ */
+const fold = (text: string): string => Array.from(text, (character) => character.toLocaleLowerCase()).join('');
+
 /**
  * The behavioural core shared by every ui-inputs listbox control (SingleSelect, Combobox, and —
  * forthcoming — MultiSelect). Entirely position/index-based, so the option type `T` never crosses
@@ -89,6 +116,8 @@ export const useListbox = (options: UseListboxOptions) => {
         floatingOptions = {},
         clearEntry,
         onClearCommit,
+        typeaheadLabels,
+        committedIndex,
     } = options;
 
     const open = ref(false);
@@ -121,9 +150,82 @@ export const useListbox = (options: UseListboxOptions) => {
     // as a phantom highlight (and a phantom aria-activedescendant) on the next open. The
     // composable still never calls this on commit: closing after a commit stays the caller's
     // decision (`onCommit` — the MultiSelect toggle-and-stay-open contract).
+    let typed = '';
+    // The first key, folded. Not `typed[0]`: a fold can be two code units (İ → i̇).
+    let first = '';
+    let keys = 0;
+    // Whether every key in `typed` is its first character — kept as a flag, so a held key costs the
+    // same on every repeat instead of re-scanning a run that key repeat grows without limit.
+    let repeated = true;
+    let typedTimer: ReturnType<typeof setTimeout> | undefined;
+    const dropTyped = () => {
+        clearTimeout(typedTimer);
+        typed = '';
+        keys = 0;
+        repeated = true;
+    };
+
+    // `open` is written here and nowhere else: it leaves the composable read-only, so every close
+    // passes through the one place that drops the highlight and the typed string (WR-1991).
+    const openList = () => {
+        open.value = true;
+    };
     const close = () => {
         open.value = false;
         resetHighlight();
+        dropTyped();
+    };
+    const toggle = () => {
+        if (open.value) close();
+        else openList();
+    };
+
+    // A key is typeahead when it prints one character with no command modifier. Characters are
+    // counted as `fold` counts them, by code point, so 🍎 is one and a named key such as Enter is not.
+    // Space counts only inside a string already being typed — on its own it keeps its open/toggle meaning.
+    const isTypeahead = (event: KeyboardEvent): boolean =>
+        Array.from(event.key).length === 1 &&
+        !event.ctrlKey &&
+        !event.metaKey &&
+        !event.altKey &&
+        (event.key !== ' ' || typed !== '');
+
+    // Folded once per change of the labels, not on every key a held, matching-nothing key repeats.
+    const foldedLabels = typeaheadLabels && computed(() => typeaheadLabels().map(fold));
+
+    /**
+     * The WAI-ARIA listbox typeahead, with native <select> parity: the typed string grows while keys
+     * arrive within TYPEAHEAD_RESET_MS; a single character (or the same character repeated) moves
+     * to the NEXT option starting with it, so repeating it cycles; a longer string matches by
+     * prefix from the current option, so a highlight that still matches stays put. With nothing
+     * highlighted, "current" is the committed option (`committedIndex`). The search
+     * wraps, compares case-insensitively, and moves nothing when no option matches. Returns
+     * whether it found one.
+     */
+    const typeahead = (key: string, labels: string[]): boolean => {
+        clearTimeout(typedTimer);
+        typedTimer = setTimeout(dropTyped, TYPEAHEAD_RESET_MS);
+
+        const character = fold(key);
+        if (typed === '') first = character;
+        repeated = typed === '' || (repeated && character === first);
+        if (keys < TYPEAHEAD_MAX_LENGTH) {
+            typed += character;
+            keys++;
+        }
+
+        const needle = repeated ? first : typed;
+        const from = pointer.value >= 0 ? pointer.value : (committedIndex?.() ?? -1);
+        const start = repeated ? from + 1 : Math.max(from, 0);
+        for (let step = 0; step < labels.length; step++) {
+            const index = (start + step) % labels.length;
+            if (labels[index].startsWith(needle)) {
+                clearActive.value = false;
+                pointer.value = index;
+                return true;
+            }
+        }
+        return false;
     };
 
     // Keyboard focus lives on the trigger, so the focused option is conveyed to assistive
@@ -175,10 +277,16 @@ export const useListbox = (options: UseListboxOptions) => {
             onDismiss();
             return;
         }
+        if (foldedLabels !== undefined && isTypeahead(event)) {
+            event.preventDefault();
+            // Closed, a match OPENS the list on it (the APG select-only combobox), never commits.
+            if (typeahead(event.key, foldedLabels.value) && !open.value) openList();
+            return;
+        }
         if (!open.value) {
             if (openKeys(event.key)) {
                 event.preventDefault();
-                open.value = true;
+                openList();
             }
             return;
         }
@@ -264,7 +372,10 @@ export const useListbox = (options: UseListboxOptions) => {
         onOutside();
     };
     onMounted(() => document.addEventListener('click', onDocumentPointer));
-    onBeforeUnmount(() => document.removeEventListener('click', onDocumentPointer));
+    onBeforeUnmount(() => {
+        document.removeEventListener('click', onDocumentPointer);
+        dropTyped();
+    });
 
     // KD-1136. The popup is promoted to the TOP LAYER in place, via the Popover API — it is
     // never moved in the DOM. A top-layer box paints outside the normal flow, so no ancestor's
@@ -323,14 +434,16 @@ export const useListbox = (options: UseListboxOptions) => {
     );
 
     return {
-        open,
+        open: readonly(open),
         pointer,
         listboxId,
         optionId,
         activeDescendant,
         floatingStyles: gatedFloatingStyles,
         onKey,
+        openList,
         close,
+        toggle,
         clearHighlighted,
         clearId,
         highlightClear,
diff --git a/packages/ui-inputs/src/internal/composition.ts b/packages/ui-inputs/src/internal/composition.ts
new file mode 100644
index 0000000..83cb44b
--- /dev/null
+++ b/packages/ui-inputs/src/internal/composition.ts
@@ -0,0 +1,39 @@
+import {computed, ref} from 'vue';
+
+type TextField = HTMLInputElement | HTMLTextAreaElement;
+
+/**
+ * Vue's `vModelText` composition rule for a text field the component binds by hand: an IME composes
+ * one character through several `input` events, none of which is the user's value, so nothing is
+ * committed while composing and the field's value is committed once on `compositionend`.
+ *
+ * Bind the field's `:value` to `shown`, never to the model: Vue re-patches `value` on every render,
+ * and the model is stale mid-composition, so any re-render then would wipe the candidate text.
+ * `shown` holds the field's own text while composing — the job `vModelText`'s
+ * `if (el.composing) return` does on update.
+ */
+export const commitOutsideComposition = (model: () => string | null, commit: (value: string) => void) => {
+    const draft = ref<string | null>(null);
+    const onCompositionend = (event: Event): void => {
+        draft.value = null;
+        commit((event.target as TextField).value);
+    };
+
+    return {
+        shown: computed(() => draft.value ?? model()),
+        onCompositionstart: (event: Event): void => {
+            draft.value = (event.target as TextField).value;
+        },
+        onCompositionend,
+        // `vModelText` also ends a composition on `change`, for a browser that commits one without a
+        // `compositionend`; outside a composition it does nothing.
+        onChange: (event: Event): void => {
+            if (draft.value !== null) onCompositionend(event);
+        },
+        onInput: (event: Event): void => {
+            const {value} = event.target as TextField;
+            if (draft.value === null) commit(value);
+            else draft.value = value;
+        },
+    };
+};
diff --git a/packages/ui-inputs/src/internal/split-attrs.ts b/packages/ui-inputs/src/internal/split-attrs.ts
new file mode 100644
index 0000000..fa4dc69
--- /dev/null
+++ b/packages/ui-inputs/src/internal/split-attrs.ts
@@ -0,0 +1,18 @@
+import type {StyleValue} from 'vue';
+
+/**
+ * The select family's attribute split. `class` and `style` stay on the root, where consumers style
+ * the whole control (ublgenie passes `class` on four of them); everything else — `aria-label`,
+ * `aria-labelledby`, `data-*`, listeners — goes to the element carrying role="combobox", the only
+ * place an accessible name can land.
+ */
+export const rootAttrs = (attrs: Record<string, unknown>): {class?: unknown; style?: StyleValue} => ({
+    class: attrs.class,
+    style: attrs.style as StyleValue | undefined,
+});
+
+export const controlAttrs = (attrs: Record<string, unknown>): Record<string, unknown> => {
+    const {class: _class, style: _style, ...rest} = attrs;
+
+    return rest;
+};
diff --git a/packages/ui-inputs/tests/Combobox.spec.ts b/packages/ui-inputs/tests/Combobox.spec.ts
index c8a3a68..1502eb6 100644
--- a/packages/ui-inputs/tests/Combobox.spec.ts
+++ b/packages/ui-inputs/tests/Combobox.spec.ts
@@ -20,7 +20,8 @@ const FRUITS: Fruit[] = [
 // eslint-disable-next-line @typescript-eslint/no-explicit-any -- generic SFC + VTU mount inference
 const mountCombobox = (props: Record<string, unknown>, slots?: Record<string, unknown>) =>
     mount(Combobox as any, {
-        props: {options: FRUITS, label: 'name', id: 'fruit', modelValue: null, ...props},
+        // Sorted on purpose: the cases below index the sorted order (the default is caller order).
+        props: {options: FRUITS, label: 'name', id: 'fruit', modelValue: null, alphabeticalSort: true, ...props},
         slots,
         attachTo: document.body,
     });
diff --git a/packages/ui-inputs/tests/MultiCombobox.spec.ts b/packages/ui-inputs/tests/MultiCombobox.spec.ts
index e5b3dcc..7314b4e 100644
--- a/packages/ui-inputs/tests/MultiCombobox.spec.ts
+++ b/packages/ui-inputs/tests/MultiCombobox.spec.ts
@@ -20,7 +20,8 @@ const FRUITS: Fruit[] = [
 // eslint-disable-next-line @typescript-eslint/no-explicit-any -- generic SFC + VTU mount inference
 const mountMultiCombobox = (props: Record<string, unknown>, slots?: Record<string, unknown>) =>
     mount(MultiCombobox as any, {
-        props: {options: FRUITS, label: 'name', id: 'fruit', modelValue: [], ...props},
+        // Sorted on purpose: the cases below index the sorted order (the default is caller order).
+        props: {options: FRUITS, label: 'name', id: 'fruit', modelValue: [], alphabeticalSort: true, ...props},
         slots,
         attachTo: document.body,
     });
diff --git a/packages/ui-inputs/tests/MultiSelect.spec.ts b/packages/ui-inputs/tests/MultiSelect.spec.ts
index ad1380e..cc2cc1e 100644
--- a/packages/ui-inputs/tests/MultiSelect.spec.ts
+++ b/packages/ui-inputs/tests/MultiSelect.spec.ts
@@ -20,7 +20,8 @@ const FRUITS: Fruit[] = [
 // eslint-disable-next-line @typescript-eslint/no-explicit-any -- generic SFC + VTU mount inference
 const mountMulti = (props: Record<string, unknown>, slots?: Record<string, unknown>) =>
     mount(MultiSelect as any, {
-        props: {options: FRUITS, label: 'name', id: 'fruit', modelValue: [], ...props},
+        // Sorted on purpose: the cases below index the sorted order (the default is caller order).
+        props: {options: FRUITS, label: 'name', id: 'fruit', modelValue: [], alphabeticalSort: true, ...props},
         slots,
         attachTo: document.body,
     });
diff --git a/packages/ui-inputs/tests/SingleSelect.spec.ts b/packages/ui-inputs/tests/SingleSelect.spec.ts
index 22f5750..55c794a 100644
--- a/packages/ui-inputs/tests/SingleSelect.spec.ts
+++ b/packages/ui-inputs/tests/SingleSelect.spec.ts
@@ -20,7 +20,8 @@ const FRUITS: Fruit[] = [
 // eslint-disable-next-line @typescript-eslint/no-explicit-any -- generic SFC + VTU mount inference
 const mountSelect = (props: Record<string, unknown>, slots?: Record<string, unknown>) =>
     mount(SingleSelect as any, {
-        props: {options: FRUITS, label: 'name', id: 'fruit', modelValue: null, ...props},
+        // Sorted on purpose: the cases below index the sorted order (the default is caller order).
+        props: {options: FRUITS, label: 'name', id: 'fruit', modelValue: null, alphabeticalSort: true, ...props},
         slots,
         attachTo: document.body,
     });
diff --git a/packages/ui-inputs/tests/alphabetical-sort-default.spec.ts b/packages/ui-inputs/tests/alphabetical-sort-default.spec.ts
new file mode 100644
index 0000000..b045068
--- /dev/null
+++ b/packages/ui-inputs/tests/alphabetical-sort-default.spec.ts
@@ -0,0 +1,48 @@
+// @vitest-environment happy-dom
+// WR-1991 (Commander ruling 2026-10-03): `alphabeticalSort` defaults to false — the caller's order
+// is the order, and sorting is the opt-in.
+import {mount} from '@vue/test-utils';
+import {afterEach, describe, expect, it} from 'vitest';
+
+import Combobox from '../src/components/Combobox.vue';
+import MultiCombobox from '../src/components/MultiCombobox.vue';
+import MultiSelect from '../src/components/MultiSelect.vue';
+import SingleSelect from '../src/components/SingleSelect.vue';
+
+const CALLER_ORDER = [
+    {id: 1, name: 'Watermelon'},
+    {id: 2, name: 'Apricot'},
+    {id: 3, name: 'Mango'},
+];
+
+const SORTABLE = [
+    {name: 'SingleSelect', component: SingleSelect, modelValue: null, opener: 'button'},
+    {name: 'MultiSelect', component: MultiSelect, modelValue: [], opener: '.ui-multiselect__trigger'},
+    {name: 'Combobox', component: Combobox, modelValue: null, opener: 'input'},
+    {name: 'MultiCombobox', component: MultiCombobox, modelValue: [], opener: 'input'},
+] as const;
+
+afterEach(() => {
+    document.body.innerHTML = '';
+});
+
+describe.each(SORTABLE)('$name — option order', ({component, modelValue, opener}) => {
+    const renderedOrder = async (extra: Record<string, unknown>) => {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- four generic SFCs through one mount
+        const wrapper = mount(component as any, {
+            props: {options: CALLER_ORDER, label: 'name', id: 'f', modelValue, ...extra},
+            attachTo: document.body,
+        });
+        await wrapper.find(opener).trigger(opener === 'input' ? 'focus' : 'click');
+        if (opener === 'input') await wrapper.find(opener).trigger('keydown', {key: 'ArrowDown'});
+        return wrapper.findAll('[role="option"]').map((option) => option.text());
+    };
+
+    it("keeps the caller's order by default", async () => {
+        expect(await renderedOrder({})).toEqual(['Watermelon', 'Apricot', 'Mango']);
+    });
+
+    it('sorts by display string when `alphabeticalSort` is set', async () => {
+        expect(await renderedOrder({alphabeticalSort: true})).toEqual(['Apricot', 'Mango', 'Watermelon']);
+    });
+});
diff --git a/packages/ui-inputs/tests/attrs-to-control.spec.ts b/packages/ui-inputs/tests/attrs-to-control.spec.ts
new file mode 100644
index 0000000..c80b563
--- /dev/null
+++ b/packages/ui-inputs/tests/attrs-to-control.spec.ts
@@ -0,0 +1,91 @@
+// @vitest-environment happy-dom
+// WR-1991: a consumer's attrs reach the element that carries role="combobox" — the only place an
+// `aria-label` or `aria-labelledby` can name the control — while `class` and `style` stay on the
+// root, where the fleet's consumers already style the whole control.
+import {mount} from '@vue/test-utils';
+import {afterEach, describe, expect, it, vi} from 'vitest';
+
+import Combobox from '../src/components/Combobox.vue';
+import GroupCombobox from '../src/components/GroupCombobox.vue';
+import GroupSelect from '../src/components/GroupSelect.vue';
+import MultiCombobox from '../src/components/MultiCombobox.vue';
+import MultiSelect from '../src/components/MultiSelect.vue';
+import SingleSelect from '../src/components/SingleSelect.vue';
+
+const OPTIONS = [{id: 1, name: 'Apricot'}];
+const GROUPS = [{text: 'Fruit', options: OPTIONS}];
+
+const FAMILY = [
+    {name: 'SingleSelect', component: SingleSelect, props: {options: OPTIONS, modelValue: null}},
+    {name: 'MultiSelect', component: MultiSelect, props: {options: OPTIONS, modelValue: []}},
+    {name: 'GroupSelect', component: GroupSelect, props: {groups: GROUPS, modelValue: null}},
+    {name: 'Combobox', component: Combobox, props: {options: OPTIONS, modelValue: null}},
+    {name: 'MultiCombobox', component: MultiCombobox, props: {options: OPTIONS, modelValue: []}},
+    {name: 'GroupCombobox', component: GroupCombobox, props: {groups: GROUPS, modelValue: null}},
+] as const;
+
+afterEach(() => {
+    document.body.innerHTML = '';
+});
+
+describe.each(FAMILY)('$name — attribute fall-through', ({component, props}) => {
+    const mountWithAttrs = () =>
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- six generic SFCs through one mount
+        mount(component as any, {
+            props: {label: 'name', id: 'f', ...props},
+            attrs: {
+                'aria-label': 'Fruit',
+                'data-qa': 'fruit-picker',
+                class: 'consumer-class',
+                style: 'margin-top: 3px;',
+            },
+            attachTo: document.body,
+        });
+
+    it('aria-label and data-* land on the combobox element, not the root', () => {
+        const wrapper = mountWithAttrs();
+        const control = wrapper.find('[role="combobox"]');
+
+        expect(control.attributes('aria-label')).toBe('Fruit');
+        expect(control.attributes('data-qa')).toBe('fruit-picker');
+        expect(wrapper.attributes('aria-label')).toBeUndefined();
+        expect(wrapper.attributes('data-qa')).toBeUndefined();
+    });
+
+    it('REGRESSION PIN — class and style stay on the root, beside its own class', () => {
+        const wrapper = mountWithAttrs();
+        const control = wrapper.find('[role="combobox"]');
+
+        expect(wrapper.classes()).toContain('consumer-class');
+        expect(wrapper.attributes('style')).toContain('margin-top: 3px');
+        expect(control.classes()).not.toContain('consumer-class');
+        expect(control.attributes('style')).toBeUndefined();
+    });
+
+    it("a consumer attr never overrides the component's own wiring on the control", () => {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- six generic SFCs through one mount
+        const wrapper = mount(component as any, {
+            props: {label: 'name', id: 'f', ...props},
+            attrs: {id: 'hijack', role: 'button'},
+            attachTo: document.body,
+        });
+        const control = wrapper.find('#f');
+
+        expect(control.attributes('role')).toBe('combobox');
+    });
+
+    it('a consumer listener passed as an attr fires on the combobox element', () => {
+        // `focus` does not bubble: a listener left on the root would never hear it.
+        const onFocus = vi.fn();
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- six generic SFCs through one mount
+        const wrapper = mount(component as any, {
+            props: {label: 'name', id: 'f', ...props},
+            attrs: {onFocus},
+            attachTo: document.body,
+        });
+
+        wrapper.find('[role="combobox"]').element.dispatchEvent(new FocusEvent('focus'));
+
+        expect(onFocus).toHaveBeenCalledOnce();
+    });
+});
diff --git a/packages/ui-inputs/tests/browser/interaction.browser.spec.ts b/packages/ui-inputs/tests/browser/interaction.browser.spec.ts
index 0d46582..555d40f 100644
--- a/packages/ui-inputs/tests/browser/interaction.browser.spec.ts
+++ b/packages/ui-inputs/tests/browser/interaction.browser.spec.ts
@@ -36,7 +36,7 @@ const FRUITS: Fruit[] = [
     {id: 2, name: 'Apricot'},
     {id: 3, name: 'Mango'},
 ];
-// Sorted render order: Apricot(2), Mango(3), Watermelon(1).
+// Sorted render order (`alphabeticalSort: true`): Apricot(2), Mango(3), Watermelon(1).
 
 // Grouped controls are CALLER-ordered (no alphabetical sort), so the flat option index runs
 // through the groups in declaration order: Watermelon(0), Mango(1), Apricot(2).
@@ -111,9 +111,35 @@ const groupMenu = () => document.querySelector('.ui-groupselect__menu, .ui-group
 const groupHeaders = (variant: 'groupselect' | 'groupcombobox'): string[] =>
     [...document.querySelectorAll(`.ui-${variant}__group-header`)].map((h) => h.textContent?.trim() ?? '');
 
+describe('SingleSelect — real typeahead (WR-1991)', () => {
+    const SPACED: Fruit[] = [
+        {id: 1, name: 'Blue moon'},
+        {id: 2, name: 'Blueberry'},
+        {id: 3, name: 'Banana'},
+    ];
+
+    it('typed from the closed trigger, opens on the match; a space inside the string keeps the list open', async () => {
+        const model = await renderControlled<number | null>(SingleSelect, null, {
+            options: SPACED,
+            alphabeticalSort: false,
+        });
+        const trigger = document.getElementById('fruit') as HTMLButtonElement;
+
+        await userEvent.tab();
+        await userEvent.keyboard('blue m');
+
+        // A Space that reached the button's default would click it on keyup and close the list.
+        expect(menu()).not.toBeNull();
+        expect(trigger.getAttribute('aria-activedescendant')).toBe('fruit-opt-0');
+
+        await userEvent.keyboard('{Enter}');
+        expect(model.value).toBe(1);
+    });
+});
+
 describe('SingleSelect — real keyboard walk', () => {
     it('Tab focuses, Enter opens, ArrowDown navigates, Enter commits, menu closes', async () => {
-        const model = await renderControlled<number | null>(SingleSelect, null, {});
+        const model = await renderControlled<number | null>(SingleSelect, null, {alphabeticalSort: true});
         const trigger = document.getElementById('fruit') as HTMLButtonElement;
 
         await userEvent.tab();
@@ -271,7 +297,7 @@ describe('Combobox — real typing filters and commits', () => {
 
 describe('MultiSelect — chips, toggle-stays-open, Backspace', () => {
     it('a real click commit toggles membership while the menu STAYS open, and chips render', async () => {
-        const model = await renderControlled<number[]>(MultiSelect, [], {});
+        const model = await renderControlled<number[]>(MultiSelect, [], {alphabeticalSort: true});
         const trigger = document.getElementById('fruit') as HTMLButtonElement;
 
         await userEvent.click(trigger);
diff --git a/packages/ui-inputs/tests/browser/shadow.browser.spec.ts b/packages/ui-inputs/tests/browser/shadow.browser.spec.ts
index da84b53..e50277e 100644
--- a/packages/ui-inputs/tests/browser/shadow.browser.spec.ts
+++ b/packages/ui-inputs/tests/browser/shadow.browser.spec.ts
@@ -63,6 +63,7 @@ const mountInShadow = (model: {value: number[]}): ShadowRoot => {
                     options: FRUITS,
                     label: 'name',
                     id: 'fruit',
+                    alphabeticalSort: true,
                     modelValue: model.value,
                     'onUpdate:modelValue': (value: number[]) => {
                         model.value = value;
diff --git a/packages/ui-inputs/tests/composition.spec.ts b/packages/ui-inputs/tests/composition.spec.ts
new file mode 100644
index 0000000..e49be7f
--- /dev/null
+++ b/packages/ui-inputs/tests/composition.spec.ts
@@ -0,0 +1,105 @@
+// @vitest-environment happy-dom
+// WR-1990: an IME composes a character through several `input` events. Vue's own `v-model` on a text
+// field ignores them until `compositionend`; these controls must do the same, or a consumer gets
+// every candidate (lokalekeuze measured a GET per candidate). Neither happy-dom nor Chromium can be
+// driven by a real IME from a test, so both would run these same dispatched events; the composition
+// handling is the component's own logic, which happy-dom runs faithfully.
+import {mount} from '@vue/test-utils';
+import {describe, expect, it} from 'vitest';
+
+import Textarea from '../src/components/Textarea.vue';
+import TextInput from '../src/components/TextInput.vue';
+
+describe.each([
+    ['TextInput', TextInput, 'input'],
+    ['Textarea', Textarea, 'textarea'],
+] as const)('%s — IME composition', (_name, component, selector) => {
+    const mountField = () =>
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- two SFCs through one mount
+        mount(component as any, {props: {id: 't', modelValue: ''}});
+
+    const type = (field: HTMLInputElement | HTMLTextAreaElement, value: string): void => {
+        field.value = value;
+        field.dispatchEvent(new Event('input', {bubbles: true}));
+    };
+
+    it('emits nothing while composing, then the committed value once on compositionend', () => {
+        const wrapper = mountField();
+        const field = wrapper.find(selector).element as HTMLInputElement;
+
+        field.dispatchEvent(new CompositionEvent('compositionstart', {bubbles: true}));
+        type(field, 'k');
+        type(field, 'か');
+        type(field, 'かn');
+        type(field, 'かな');
+        field.dispatchEvent(new CompositionEvent('compositionend', {bubbles: true, data: 'かな'}));
+
+        expect(wrapper.emitted('update:modelValue')).toEqual([['かな']]);
+    });
+
+    it('REGRESSION PIN — plain typing still emits on every input', () => {
+        const wrapper = mountField();
+        const field = wrapper.find(selector).element as HTMLInputElement;
+
+        type(field, 'a');
+        type(field, 'ab');
+
+        expect(wrapper.emitted('update:modelValue')).toEqual([['a'], ['ab']]);
+    });
+
+    it('REGRESSION PIN — typing after a composition emits per input again', () => {
+        const wrapper = mountField();
+        const field = wrapper.find(selector).element as HTMLInputElement;
+
+        field.dispatchEvent(new CompositionEvent('compositionstart', {bubbles: true}));
+        type(field, 'か');
+        field.dispatchEvent(new CompositionEvent('compositionend', {bubbles: true}));
+        type(field, 'か!');
+
+        expect(wrapper.emitted('update:modelValue')).toEqual([['か'], ['か!']]);
+    });
+
+    it('a change that ends a composition with no compositionend commits it, and typing reaches the model again', () => {
+        const wrapper = mountField();
+        const field = wrapper.find(selector).element as HTMLInputElement;
+
+        field.dispatchEvent(new CompositionEvent('compositionstart', {bubbles: true}));
+        type(field, 'か');
+        field.dispatchEvent(new Event('change', {bubbles: true}));
+        type(field, 'か!');
+
+        expect(wrapper.emitted('update:modelValue')).toEqual([['か'], ['か!']]);
+    });
+
+    it('REGRESSION PIN — a change outside a composition commits nothing, as `vModelText` ignores it', () => {
+        const wrapper = mountField();
+        const field = wrapper.find(selector).element as HTMLInputElement;
+
+        type(field, 'a');
+        field.value = 'ab';
+        field.dispatchEvent(new Event('change', {bubbles: true}));
+
+        expect(wrapper.emitted('update:modelValue')).toEqual([['a']]);
+    });
+});
+
+describe.each([
+    ['TextInput', TextInput, 'input'],
+    ['Textarea', Textarea, 'textarea'],
+] as const)('%s — a re-render during composition', (_name, component, selector) => {
+    it('keeps the candidate text in the field, then commits it on compositionend', async () => {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- two SFCs through one mount
+        const wrapper = mount(component as any, {props: {id: 't', modelValue: 'a', placeholder: 'one'}});
+        const field = wrapper.find(selector).element as HTMLInputElement;
+
+        field.dispatchEvent(new CompositionEvent('compositionstart', {bubbles: true}));
+        field.value = 'aか';
+        field.dispatchEvent(new Event('input', {bubbles: true}));
+        await wrapper.setProps({placeholder: 'two'});
+
+        expect(field.value).toBe('aか');
+
+        field.dispatchEvent(new CompositionEvent('compositionend', {bubbles: true}));
+        expect(wrapper.emitted('update:modelValue')).toEqual([['aか']]);
+    });
+});
diff --git a/packages/ui-inputs/tests/listbox-open-owner.spec.ts b/packages/ui-inputs/tests/listbox-open-owner.spec.ts
new file mode 100644
index 0000000..4737d22
--- /dev/null
+++ b/packages/ui-inputs/tests/listbox-open-owner.spec.ts
@@ -0,0 +1,38 @@
+import {readdirSync, readFileSync} from 'node:fs';
+import path from 'node:path';
+import {describe, expect, it} from 'vitest';
+
+/**
+ * WR-1991: a listbox's open state has one writer, `useListbox`. A component that flips `open`
+ * itself skips the close path, so the typed string and its timer outlive the closed list. The
+ * composable returns `open` read-only, but a cast gets past the type, so the source is asserted too.
+ */
+const COMPONENTS = path.join(import.meta.dirname, '..', 'src', 'components');
+
+const FILES = readdirSync(COMPONENTS)
+    .filter((name) => name.endsWith('.vue'))
+    .map((name) => ({name, source: readFileSync(path.join(COMPONENTS, name), 'utf8')}));
+
+const LISTBOX_HOSTS = FILES.filter(({source}) => source.includes('useListbox('));
+
+const DIRECT_OPEN_WRITE = /\bopen\.value\s*=(?!=)/u;
+
+describe('listbox open state has one owner', () => {
+    it('found the listbox components it is meant to scan', () => {
+        // Without this the guard passes over an empty list — a clean report from a scan that never ran.
+        expect(LISTBOX_HOSTS.map(({name}) => name).sort()).toEqual([
+            'Combobox.vue',
+            'GroupCombobox.vue',
+            'GroupSelect.vue',
+            'MultiCombobox.vue',
+            'MultiSelect.vue',
+            'SingleSelect.vue',
+        ]);
+    });
+
+    it('no component writes open.value directly', () => {
+        const offenders = FILES.filter(({source}) => DIRECT_OPEN_WRITE.test(source)).map(({name}) => name);
+
+        expect(offenders).toEqual([]);
+    });
+});
diff --git a/packages/ui-inputs/tests/typeahead.spec.ts b/packages/ui-inputs/tests/typeahead.spec.ts
new file mode 100644
index 0000000..b8d18b6
--- /dev/null
+++ b/packages/ui-inputs/tests/typeahead.spec.ts
@@ -0,0 +1,491 @@
+// @vitest-environment happy-dom
+// WR-1991: typeahead on the select-only listboxes. Key handling is the component's own logic over
+// the keydown it receives — no platform default is involved — so happy-dom runs the real path.
+import {mount} from '@vue/test-utils';
+import {afterEach, beforeEach, describe, expect, it, onTestFinished, vi} from 'vitest';
+
+import Combobox from '../src/components/Combobox.vue';
+import GroupSelect from '../src/components/GroupSelect.vue';
+import MultiSelect from '../src/components/MultiSelect.vue';
+import SingleSelect from '../src/components/SingleSelect.vue';
+
+interface Fruit {
+    id: number;
+    name: string;
+}
+
+// Caller order: Apricot(0), Avocado(1), Banana(2), Blue moon(3), Blueberry(4), cherry(5).
+const FRUITS: Fruit[] = [
+    {id: 1, name: 'Apricot'},
+    {id: 2, name: 'Avocado'},
+    {id: 3, name: 'Banana'},
+    {id: 4, name: 'Blue moon'},
+    {id: 5, name: 'Blueberry'},
+    {id: 6, name: 'cherry'},
+];
+
+const SELECT_ONLY = [
+    {
+        name: 'SingleSelect',
+        mountIt: () =>
+            mount(SingleSelect, {
+                props: {options: FRUITS, label: 'name', id: 'f', modelValue: null, alphabeticalSort: false},
+                attachTo: document.body,
+            }),
+        keyTarget: '.ui-select',
+    },
+    {
+        name: 'MultiSelect',
+        mountIt: () =>
+            mount(MultiSelect, {
+                props: {options: FRUITS, label: 'name', id: 'f', modelValue: [] as number[], alphabeticalSort: false},
+                attachTo: document.body,
+            }),
+        keyTarget: '.ui-multiselect__trigger',
+    },
+    {
+        name: 'GroupSelect',
+        mountIt: () =>
+            mount(GroupSelect, {
+                props: {
+                    groups: [
+                        {text: 'A', options: FRUITS.slice(0, 2)},
+                        {text: 'B', options: FRUITS.slice(2, 5)},
+                        {text: 'C', options: FRUITS.slice(5)},
+                    ],
+                    label: 'name',
+                    id: 'f',
+                    modelValue: null,
+                },
+                attachTo: document.body,
+            }),
+        keyTarget: '.ui-groupselect',
+    },
+] as const;
+
+beforeEach(() => {
+    vi.useFakeTimers();
+});
+
+afterEach(() => {
+    vi.useRealTimers();
+    document.body.innerHTML = '';
+});
+
+describe.each(SELECT_ONLY)('$name — typeahead', ({mountIt, keyTarget}) => {
+    const setup = async (open = true) => {
+        const wrapper = mountIt();
+        const target = wrapper.find(keyTarget);
+        const press = async (key: string, init: Record<string, unknown> = {}) => {
+            await target.trigger('keydown', {key, ...init});
+        };
+        const active = () => wrapper.find('[role="combobox"]').attributes('aria-activedescendant');
+        if (open) await press('ArrowDown');
+        return {wrapper, press, active};
+    };
+
+    it('a printable character moves the active option to the first match, case-insensitively', async () => {
+        const {press, active} = await setup();
+
+        await press('C');
+
+        expect(active()).toBe('f-opt-5');
+    });
+
+    it('the same character again cycles through the options that start with it', async () => {
+        const {press, active} = await setup();
+
+        await press('b');
+        expect(active()).toBe('f-opt-2');
+        await press('b');
+        expect(active()).toBe('f-opt-3');
+        await press('b');
+        expect(active()).toBe('f-opt-4');
+    });
+
+    it('a quickly typed string matches by prefix, a space inside it included', async () => {
+        const {press, active} = await setup();
+
+        for (const key of 'blueb') await press(key);
+        expect(active()).toBe('f-opt-4');
+    });
+
+    it('a highlight that still matches the growing string stays put', async () => {
+        const {press, active} = await setup();
+
+        for (const key of 'blu') await press(key);
+
+        // "blu" matches Blue moon and Blueberry; a search from the NEXT option would skip ahead.
+        expect(active()).toBe('f-opt-3');
+    });
+
+    it('a space typed mid-string is part of the string and is prevented from clicking the trigger', async () => {
+        const {wrapper, press, active} = await setup();
+
+        for (const key of 'blue') await press(key);
+        const space = new KeyboardEvent('keydown', {key: ' ', bubbles: true, cancelable: true});
+        wrapper.find(keyTarget).element.dispatchEvent(space);
+        await press('m');
+
+        expect(space.defaultPrevented).toBe(true);
+        expect(active()).toBe('f-opt-3');
+    });
+
+    it('the string resets after a short idle, so the next key starts a new search', async () => {
+        const {press, active} = await setup();
+
+        await press('a');
+        expect(active()).toBe('f-opt-0');
+        vi.advanceTimersByTime(600);
+        await press('v');
+
+        // Without the reset this reads "av" and lands on Avocado.
+        expect(active()).toBe('f-opt-0');
+    });
+
+    it('after a typed string resets, a repeated character cycles again', async () => {
+        const {press, active} = await setup();
+
+        for (const key of 'ap') await press(key);
+        vi.advanceTimersByTime(600);
+        await press('b');
+        await press('b');
+
+        expect(active()).toBe('f-opt-3');
+    });
+
+    it('wraps around past the last option', async () => {
+        const {press, active} = await setup();
+
+        await press('End');
+        await press('a');
+
+        expect(active()).toBe('f-opt-0');
+    });
+
+    it('a character no option starts with moves nothing', async () => {
+        const {press, active} = await setup();
+
+        await press('b');
+        await press('z');
+
+        expect(active()).toBe('f-opt-2');
+    });
+
+    it('a modified key is not typeahead', async () => {
+        const {press, active} = await setup();
+
+        await press('a', {ctrlKey: true});
+        await press('b', {metaKey: true});
+        await press('c', {altKey: true});
+
+        expect(active()).toBeUndefined();
+    });
+
+    it('closed, a character opens the list on the first match and commits nothing', async () => {
+        const {wrapper, press, active} = await setup(false);
+
+        await press('c');
+
+        expect(wrapper.find('[role="combobox"]').attributes('aria-expanded')).toBe('true');
+        expect(active()).toBe('f-opt-5');
+        expect(wrapper.emitted('update:modelValue')).toBeUndefined();
+    });
+
+    it('closed, a character no option starts with opens nothing', async () => {
+        const {wrapper, press} = await setup(false);
+
+        await press('z');
+
+        expect(wrapper.find('[role="combobox"]').attributes('aria-expanded')).toBe('false');
+    });
+
+    it('closing drops a half-typed string', async () => {
+        const {press, active} = await setup();
+
+        await press('b');
+        await press('Escape');
+        await press('ArrowDown');
+        await press('l');
+
+        // Without the drop this reads "bl" and lands on Blue moon.
+        expect(active()).toBeUndefined();
+    });
+});
+
+describe('Combobox — typeahead belongs to the text input', () => {
+    it('NEGATIVE PIN — typing filters the query and never jumps the highlight', async () => {
+        const wrapper = mount(Combobox, {
+            props: {options: FRUITS, label: 'name', id: 'f', modelValue: null, alphabeticalSort: false},
+            attachTo: document.body,
+        });
+        const input = wrapper.find('input');
+
+        await input.trigger('keydown', {key: 'ArrowDown'});
+        await input.trigger('keydown', {key: 'c'});
+
+        expect(input.attributes('aria-activedescendant')).toBeUndefined();
+    });
+});
+
+describe('typeahead — a search starts after the committed value (native <select> parity)', () => {
+    const banana = 3;
+
+    it('SingleSelect with Banana chosen: closed, b moves to Blue moon, not Banana again', async () => {
+        const wrapper = mount(SingleSelect, {
+            props: {options: FRUITS, label: 'name', id: 'f', modelValue: banana, alphabeticalSort: false},
+            attachTo: document.body,
+        });
+
+        await wrapper.find('.ui-select').trigger('keydown', {key: 'b'});
+
+        expect(wrapper.find('[role="combobox"]').attributes('aria-activedescendant')).toBe('f-opt-3');
+    });
+
+    it('GroupSelect with Banana chosen: closed, b moves to Blue moon', async () => {
+        const wrapper = mount(GroupSelect, {
+            props: {
+                groups: [
+                    {text: 'A', options: FRUITS.slice(0, 2)},
+                    {text: 'B', options: FRUITS.slice(2)},
+                ],
+                label: 'name',
+                id: 'f',
+                modelValue: banana,
+            },
+            attachTo: document.body,
+        });
+
+        await wrapper.find('.ui-groupselect').trigger('keydown', {key: 'b'});
+
+        expect(wrapper.find('[role="combobox"]').attributes('aria-activedescendant')).toBe('f-opt-3');
+    });
+
+    it('REGRESSION PIN — SingleSelect with Banana chosen: a string still matching it stays on it', async () => {
+        const wrapper = mount(SingleSelect, {
+            props: {options: FRUITS, label: 'name', id: 'f', modelValue: banana, alphabeticalSort: false},
+            attachTo: document.body,
+        });
+        const root = wrapper.find('.ui-select');
+
+        await root.trigger('keydown', {key: 'b'});
+        await root.trigger('keydown', {key: 'a'});
+
+        expect(wrapper.find('[role="combobox"]').attributes('aria-activedescendant')).toBe('f-opt-2');
+    });
+
+    it('PIN — MultiSelect has no single committed value, so a search starts at the top', async () => {
+        const wrapper = mount(MultiSelect, {
+            props: {options: FRUITS, label: 'name', id: 'f', modelValue: [banana], alphabeticalSort: false},
+            attachTo: document.body,
+        });
+
+        await wrapper.find('.ui-multiselect__trigger').trigger('keydown', {key: 'b'});
+
+        expect(wrapper.find('[role="combobox"]').attributes('aria-activedescendant')).toBe('f-opt-2');
+    });
+});
+
+describe('typeahead — a held key costs the same on its thousandth repeat as on its first', () => {
+    // Key repeat (~30 Hz) never lets the idle reset fire, so a held key grows the typed string without
+    // limit; per-key work must not grow with it. Timed, not counted: the string lives inside the
+    // composable. Both blocks are timed in one run, so station load mostly cancels out of the ratio.
+    // The assertion is a within-run ratio (last block vs first) at 4x, between the fix's ~1x and the
+    // defect's measured 9-14x. If it flakes in CI, the fix is a deterministic work counter, never a
+    // looser threshold.
+    const holdAfter = (prefix: string): {first: number; last: number} => {
+        // Real clock: the suite's fake timers freeze performance.now(). The loop is synchronous, so
+        // the 500 ms idle reset cannot fire inside it either way.
+        vi.useRealTimers();
+        const wrapper = mount(SingleSelect, {
+            props: {options: FRUITS, label: 'name', id: 'f', modelValue: null, alphabeticalSort: false},
+            attachTo: document.body,
+        });
+        const root = wrapper.find('.ui-select').element;
+        const press = (key: string): void => {
+            root.dispatchEvent(new KeyboardEvent('keydown', {key, bubbles: true, cancelable: true}));
+        };
+        const hold = (repeats: number): number => {
+            const started = performance.now();
+            for (let repeat = 0; repeat < repeats; repeat++) press('a');
+            return performance.now() - started;
+        };
+
+        for (const key of prefix) press(key);
+        const first = hold(1000);
+        hold(15_000);
+        return {first, last: hold(1000)};
+    };
+
+    it('a held key on its own (the repeated-character run)', () => {
+        const {first, last} = holdAfter('');
+
+        expect(last).toBeLessThan(first * 4);
+    });
+
+    it('a held key after another character (a string no option can match any more)', () => {
+        const {first, last} = holdAfter('b');
+
+        expect(last).toBeLessThan(first * 4);
+    });
+});
+
+describe.each(SELECT_ONLY)('$name — closing through the trigger drops a half-typed string', ({name, mountIt}) => {
+    it(`${name === 'GroupSelect' ? 'REGRESSION PIN — ' : ''}a reopen within the idle window starts a new search`, async () => {
+        const wrapper = mountIt();
+        const trigger = wrapper.find('[role="combobox"]');
+
+        await trigger.trigger('click');
+        await trigger.trigger('keydown', {key: 'b'});
+        expect(trigger.attributes('aria-activedescendant')).toBe('f-opt-2');
+        await trigger.trigger('click');
+        await trigger.trigger('click');
+        await trigger.trigger('keydown', {key: 'a'});
+
+        // Extending the old prefix reads "ba" and stays on Banana.
+        expect(trigger.attributes('aria-expanded')).toBe('true');
+        expect(trigger.attributes('aria-activedescendant')).toBe('f-opt-0');
+    });
+});
+
+describe('typeahead — the typed string stops growing at 64 characters', () => {
+    // Two labels identical for their first 64 characters: past the cap, a 65th key cannot tell them
+    // apart, so the highlight stays on the first. An uncapped string reads the 65th key and moves.
+    const shared = 'xy'.repeat(32);
+    const LONG = [
+        {id: 1, name: `${shared}a`},
+        {id: 2, name: `${shared}b`},
+    ];
+
+    it('a 65th key leaves the 64-character match in place', async () => {
+        const wrapper = mount(SingleSelect, {
+            props: {options: LONG, label: 'name', id: 'f', modelValue: null, alphabeticalSort: false},
+            attachTo: document.body,
+        });
+        const root = wrapper.find('.ui-select');
+
+        for (const key of `${shared}b`) await root.trigger('keydown', {key});
+
+        expect(wrapper.find('[role="combobox"]').attributes('aria-activedescendant')).toBe('f-opt-0');
+    });
+
+    // The cap counts keys, not UTF-16 units: an emoji key is two units and still one of the 64.
+    const typeEmoji = async (shared: string): Promise<string | undefined> => {
+        const wrapper = mount(SingleSelect, {
+            props: {
+                options: [
+                    {id: 1, name: `${shared}🍌`},
+                    {id: 2, name: `${shared}🍒`},
+                ],
+                label: 'name',
+                id: 'f',
+                modelValue: null,
+                alphabeticalSort: false,
+            },
+            attachTo: document.body,
+        });
+        const root = wrapper.find('.ui-select');
+        for (const key of `${shared}🍒`) await root.trigger('keydown', {key});
+        return wrapper.find('[role="combobox"]').attributes('aria-activedescendant');
+    };
+
+    it('a 64th emoji key is read', async () => {
+        expect(await typeEmoji(`${'🍎🍌'.repeat(31)}🍎`)).toBe('f-opt-1');
+    });
+
+    it('a 65th emoji key leaves the 64-key match in place', async () => {
+        expect(await typeEmoji('🍎🍌'.repeat(32))).toBe('f-opt-0');
+    });
+});
+
+describe('typeahead — a typed key and a label fold the same, whatever follows in the label', () => {
+    // A whole-string lowercase is contextual: Σ ending a word becomes ς, elsewhere σ. Typed one key
+    // at a time, Σ never ends a word, so the label must not be folded with a context the keys lack.
+    const typeInto = async (names: string[], keys: string): Promise<string | undefined> => {
+        const wrapper = mount(SingleSelect, {
+            props: {
+                options: names.map((name, index) => ({id: index + 1, name})),
+                label: 'name',
+                id: 'f',
+                modelValue: null,
+                alphabeticalSort: false,
+            },
+            attachTo: document.body,
+        });
+        const root = wrapper.find('.ui-select');
+        for (const key of keys) await root.trigger('keydown', {key});
+        return wrapper.find('[role="combobox"]').attributes('aria-activedescendant');
+    };
+
+    it('Ο then Σ moves from ΟΧ to ΟΣ, a label whose Σ ends the word', async () => {
+        expect(await typeInto(['ΟΧ', 'ΟΣ'], 'ΟΣ')).toBe('f-opt-1');
+    });
+
+    it('Ο then Σ moves from ΟΧ to ΟΣΑ, a label whose Σ does not end the word', async () => {
+        expect(await typeInto(['ΟΧ', 'ΟΣΑ'], 'ΟΣ')).toBe('f-opt-1');
+    });
+
+    it('İ, whose lowercase is two code units, matches İ labels and cycles through them on repeat', async () => {
+        expect(await typeInto(['Ice', 'İzmir', 'İstanbul'], 'İ')).toBe('f-opt-1');
+        expect(await typeInto(['Ice', 'İzmir', 'İstanbul'], 'İİ')).toBe('f-opt-2');
+    });
+
+    it('a key outside the BMP, two code units, is one character and matches', async () => {
+        expect(await typeInto(['Banana', '🍎 Apple'], '🍎')).toBe('f-opt-1');
+    });
+});
+
+describe('typeahead — a named key is not a character', () => {
+    // Enter and Tab are longer than one character; neither may search for a label spelling the key.
+    it.each(['Enter', 'Tab'])('%s never moves the highlight to a label starting with its name', async (key) => {
+        const wrapper = mount(SingleSelect, {
+            props: {
+                options: [
+                    {id: 1, name: 'Apple'},
+                    {id: 2, name: `${key} here`},
+                ],
+                label: 'name',
+                id: 'f',
+                modelValue: null,
+                alphabeticalSort: false,
+            },
+            attachTo: document.body,
+        });
+
+        await wrapper.find('.ui-select').trigger('keydown', {key});
+
+        expect(wrapper.find('[role="combobox"]').attributes('aria-activedescendant')).not.toBe('f-opt-1');
+    });
+});
+
+describe.each(SELECT_ONLY)('$name — a held key that matches nothing folds no label again', ({mountIt, keyTarget}) => {
+    // The labels change only with the options, so they are folded once; a key folds only itself.
+    it('100 repeats of a key no label starts with cost one fold each', () => {
+        const wrapper = mountIt();
+        const target = wrapper.find(keyTarget).element;
+        const press = (): void => {
+            target.dispatchEvent(new KeyboardEvent('keydown', {key: 'z', bubbles: true, cancelable: true}));
+        };
+        press();
+        const folds = vi.spyOn(String.prototype, 'toLocaleLowerCase');
+        onTestFinished(() => folds.mockRestore());
+
+        for (let repeat = 0; repeat < 100; repeat++) press();
+
+        expect(folds).toHaveBeenCalledTimes(100);
+    });
+});
+
+describe('typeahead — the labels fold again when the options change', () => {
+    it('a label added after mount is found', async () => {
+        const wrapper = mount(SingleSelect, {
+            props: {options: FRUITS, label: 'name', id: 'f', modelValue: null, alphabeticalSort: false},
+            attachTo: document.body,
+        });
+        await wrapper.setProps({options: [...FRUITS, {id: 7, name: 'Damson'}]});
+
+        await wrapper.find('.ui-select').trigger('keydown', {key: 'd'});
+
+        expect(wrapper.find('[role="combobox"]').attributes('aria-activedescendant')).toBe('f-opt-6');
+    });
+});
diff --git a/packages/ui-inputs/tests/useListbox.spec.ts b/packages/ui-inputs/tests/useListbox.spec.ts
index fa94360..0b8bd50 100644
--- a/packages/ui-inputs/tests/useListbox.spec.ts
+++ b/packages/ui-inputs/tests/useListbox.spec.ts
@@ -148,7 +148,7 @@ describe('useListbox Home/End (WR-0521)', () => {
     it('End jumps to the last option and Home back to the first, both swallowing the key', () => {
         const wrapper = mount(Harness, {props: {overrides: {listLength: () => 3}}});
 
-        api.open.value = true;
+        api.openList();
         const end = key('End');
         api.onKey(end);
         expect(api.pointer.value).toBe(2);
@@ -164,7 +164,7 @@ describe('useListbox Home/End (WR-0521)', () => {
     it('an empty list leaves the highlight untouched but still swallows the key while open', () => {
         const wrapper = mount(Harness); // listLength 0
 
-        api.open.value = true;
+        api.openList();
         const home = key('Home');
         api.onKey(home);
         expect(api.pointer.value).toBe(-1);
@@ -176,7 +176,7 @@ describe('useListbox Home/End (WR-0521)', () => {
     it('modified Home/End (Shift/Ctrl/Meta) fall through to native text-selection — never swallowed', () => {
         const wrapper = mount(Harness, {props: {overrides: {listLength: () => 3}}});
 
-        api.open.value = true;
+        api.openList();
         api.onKey(key('ArrowDown')); // highlight option 0 so a wrongly-taken arm would move it
         expect(api.pointer.value).toBe(0);
 
@@ -196,7 +196,7 @@ describe('useListbox Home/End (WR-0521)', () => {
             props: {overrides: {clearEntry: () => true, onClearCommit: () => true, listLength: () => 2}},
         });
 
-        api.open.value = true;
+        api.openList();
         api.onKey(key('ArrowDown')); // "nothing" → the clear entry
         expect(api.clearHighlighted.value).toBe(true);
 
@@ -214,7 +214,7 @@ describe('useListbox clear-entry option combinations', () => {
     it('a rendered clear entry with NO commit callback highlights but never swallows Enter', () => {
         const wrapper = mount(Harness, {props: {overrides: {clearEntry: () => true, listLength: () => 2}}});
 
-        api.open.value = true;
+        api.openList();
         api.onKey(key('ArrowDown')); // "nothing" → the clear entry
         expect(api.clearHighlighted.value).toBe(true);
         expect(api.activeDescendant.value).toBe('harness-clear');
@@ -231,7 +231,7 @@ describe('useListbox clear-entry option combinations', () => {
             props: {overrides: {clearEntry: () => true, onClearCommit: () => false, listLength: () => 2}},
         });
 
-        api.open.value = true;
+        api.openList();
         api.onKey(key('ArrowDown'));
         expect(api.clearHighlighted.value).toBe(true);
 
@@ -246,7 +246,7 @@ describe('useListbox clear-entry option combinations', () => {
             props: {overrides: {clearEntry: () => true, onClearCommit: () => true, listLength: () => 0}},
         });
 
-        api.open.value = true;
+        api.openList();
         api.onKey(key('ArrowDown')); // → clear entry
         api.onKey(key('ArrowDown')); // empty list → nowhere to go, stays
         expect(api.clearHighlighted.value).toBe(true);
@@ -306,7 +306,7 @@ describe('useListbox click-outside across shadow boundaries (KD-1136)', () => {
         const mountPoint = document.createElement('div');
         host.attachShadow({mode: 'open'}).append(mountPoint);
         const wrapper = mount(Harness, {props: {overrides: {onOutside}}, attachTo: mountPoint});
-        api.open.value = true;
+        api.openList();
 
         wrapper.element.dispatchEvent(new MouseEvent('click', {bubbles: true, composed: true}));
         expect(onOutside).not.toHaveBeenCalled();
@@ -317,7 +317,7 @@ describe('useListbox click-outside across shadow boundaries (KD-1136)', () => {
     it('calls onOutside for a click that is in neither root nor floating', () => {
         const onOutside = vi.fn();
         const wrapper = mount(Harness, {props: {overrides: {onOutside}}, attachTo: document.body});
-        api.open.value = true;
+        api.openList();
 
         document.body.dispatchEvent(new MouseEvent('click', {bubbles: true}));
         expect(onOutside).toHaveBeenCalledTimes(1);
@@ -327,7 +327,7 @@ describe('useListbox click-outside across shadow boundaries (KD-1136)', () => {
     it('does not call onOutside for a click inside root', () => {
         const onOutside = vi.fn();
         const wrapper = mount(Harness, {props: {overrides: {onOutside}}, attachTo: document.body});
-        api.open.value = true;
+        api.openList();
 
         wrapper.element.dispatchEvent(new MouseEvent('click', {bubbles: true}));
         expect(onOutside).not.toHaveBeenCalled();