@soxa-ui/plugins 0.0.0-stage → 0.3.0-beta.1

package/dist/custom/select/editable/editable.plugin.d.ts

@@ -0,0 +1,193 @@
+import { TBasePlugin } from '../../../base';
+import type { IPluginContext } from '../../../base';
+import type { TEditablePluginEvents } from './types';
+/**
+ * TEditablePlugin — реакция на ввод текста в поле Select при `editable: true`.
+ *
+ * Подписка, а не проверка на каждый ввод: плагин слушает `change:editable` и
+ * `change:editableMode` и вешает обработчик `input` только тогда, когда ввод
+ * вообще на что-то влияет — `editable: true` и режим не `none`. В остальное
+ * время слушателя нет, и никакой логики не выполняется вовсе. Так состояние
+ * поля выражено подпиской, а не условием внутри обработчика, который иначе
+ * звали бы на каждое нажатие впустую.
+ *
+ * `editableMode` (см. `TSelect`) — значение с тремя состояниями, а этот плагин
+ * — операция над ним, по одной функции на режим:
+ *
+ * - `search` — {@link _highlight}: подсвечивает первую опцию, чей текст
+ *   содержит набранное в любом месте, без учёта регистра, — методом
+ *   клавиатуры (`TSelectKeyboardPlugin.highlightByText`): подсветка и
+ *   `aria-activedescendant` остаются у неё. Правила набора по первым буквам
+ *   (`TTypeahead`) сюда не идут: там буквы ищут опцию по началу текста от
+ *   подсвеченной (WAI-ARIA), а здесь вводят произвольный фрагмент текста.
+ *   Список остаётся целым, ничего не скрывается.
+ * - `filter` — {@link _filter}: отдаёт набранное в `filter.query` коллекции.
+ *   Отбор уже умеет `TFilterExtension` — сузить выдачу, не трогая хранилище;
+ *   плагину остаётся передать текст. Отсюда и одна строка вместо второго
+ *   значения поля: ни ядру, ни шести адаптерам не пришлось ничего узнать.
+ *
+ * Слушает `input` вложенного `<input>`, а не `keydown`: текст меняется не
+ * только с клавиатуры, но и вставкой, автозаполнением, IME или очисткой поля
+ * — всё это `input`-событие ловит одинаково. Узел — по общему правилу полей
+ * (`fieldOf`), так же, как у `TInputPlugin`, — разметку и адаптеры трогать не
+ * пришлось.
+ *
+ * **Возврат поля** — одна точка (`_returnField`): снимает набранное и отбор и
+ * пишет текст возврата в `owner.field.value` — экземпляр `TInput`, которым
+ * владеет Select (не `<input>` напрямую: DOM больше нигде здесь не
+ * трогается). Закрытие панели её не вызывает (владелец закрывает панель
+ * кликом по стрелке, оставляя набранное как есть); точку вызывают два повода:
+ *
+ * - второй `Escape` на уже закрытой панели (первый только закрывает —
+ *   событие `escape` шлёт клавиатурная стратегия `TEditableKeyboardStrategy`,
+ *   слушать `close` напрямую было бы циклом: клавиатура сама зависит от
+ *   `TSelectKeyboardPlugin`);
+ * - `focusout`, когда фокус ушёл и с корня, и с телепортированной панели —
+ *   границы те же, что у нажатия мимо (`TDismissPlugin.isInside`), и переход
+ *   внутрь панели ничего не меняет.
+ *
+ * Смена `editable`/`editableMode` пишет в поле тот же текст возврата: режим
+ * сменился, значит набранное и отбор относились к прежнему режиму и больше
+ * не актуальны. Никакой умной логики (что оставить, а что сбросить) для
+ * этого редкого перехода нет намеренно: сбрасывается всё, как при обычном
+ * возврате поля, только отбор — сразу (см. ниже).
+ *
+ * Выбор сюда не входит: текст выбранного (`single`) и очистку поля
+ * (`multiple`) пишет сама `TSelectExtension` — `owner.field.value` меняется
+ * реактивно, и вложенный `Input` перерисуется сам. Этому плагину на выбор
+ * остаётся сбросить то, что относится только к вводу: набранное (`query`) и
+ * отбор (`filter`) — иначе после выбора в `multiple` панель осталась бы
+ * сужена прежним запросом.
+ *
+ * Слушает он для этого событие `choose` расширения `select`, а не
+ * `change:selection`. Набор прерывает то же, что безусловно пишет поле, —
+ * выбор пользователя (`chooseItem`, `clear`). Смена `value` или состава,
+ * закрытие тега во время ввода поле не трогают, и сброс на
+ * `change:selection` оставил бы набранное в поле, развернув список целиком.
+ *
+ * **Отбор снимается, когда закрытая панель догасла.** Набор обычно кончается
+ * закрытием панели — выбором в `single`, Tab с поля, нажатием мимо, — а
+ * панель гаснет переходом темы и до его конца остаётся на экране. Сними
+ * плагин отбор тем же действием, гаснущая панель на миг показала бы весь
+ * список и вытянулась бы до его высоты. Поэтому выбор, второй `Escape` и
+ * уход фокуса снимают набранное и пишут поле сразу — это поле, а не панель, —
+ * а отбор (`filter.query`) снимают, когда панель доиграла свои переходы
+ * (`afterTransitions` — то же ожидание, что у замка прокрутки). Закрытая
+ * панель показывает то, что показывала. Панель открыта (выбор в `multiple`,
+ * `closeOnSelect: false`) или её узла нет (нет `TDismissPlugin`, корень не
+ * объявлен, рендер на сервере) — ждать нечего, и отбор снимается сразу.
+ * Ожидание одно: новый повод заменяет прежнее.
+ *
+ * Пока плагин ждёт:
+ *
+ * - панель открыли снова — отбор снимается сразу: поле уже показывает
+ *   выбранное или возвращённый текст, и суженная панель не дала бы увидеть
+ *   остальные опции без нового ввода;
+ * - в поле снова печатают — ожидание отменяется до записи набранного: отбор
+ *   теперь пишет ввод, а открытие панели из него иначе сняло бы только что
+ *   набранное;
+ * - отбор сменил кто-то другой (в `none` отбором ведает приложение) —
+ *   ожидание отменяется: это уже не тот отбор, который плагин собирался
+ *   снять;
+ * - `destroy()` — отбор снимается сразу: движок снаружи переживает
+ *   компонент, и ждать исчезания панели больше некому.
+ *
+ * Смена `editable`/`editableMode` снимает отбор сразу: это не закрытие
+ * панели, а отложенная запись стёрла бы отбор, который приложение ставит
+ * после перехода в `none`.
+ *
+ * Реакция на сам ввод (`_handleInput`) слушает DOM-событие `input`
+ * вложенного `<input>`, а не `change:value` у `field`: `_returnField` тоже
+ * пишет в `field.value`, и слушай плагин это событие, собственная запись
+ * возврата запустила бы повторный поиск и открыла панель.
+ */
+export declare class TEditablePlugin extends TBasePlugin<any, TEditablePluginEvents> {
+    private _owner;
+    private _dismiss;
+    private _keyboard;
+    private _engine;
+    private _input;
+    private _listening;
+    private _focusListening;
+    private _query;
+    /** Отмена ожидания, пока закрытая панель догаснет; `null` — плагин не ждёт. */
+    private _stopWaiting;
+    private readonly _onInput;
+    private readonly _onFocusOut;
+    install(ctx: IPluginContext): void;
+    destroy(): void;
+    /** Что сейчас набрано в поле — до выбора или закрытия панели. */
+    get query(): string;
+    /** Слушаем ввод ровно тогда, когда ему есть на что влиять. */
+    private _syncListener;
+    private _listen;
+    private _unlisten;
+    private _handleInput;
+    /** `search` — подсветка совпадения, список остаётся целым. */
+    private _highlight;
+    /**
+     * `filter` — скрытие несовпавших.
+     *
+     * Пустая строка сюда доходит и снимает отбор: в отличие от подсветки,
+     * «ничего не набрано» — это состояние, а не отсутствие события.
+     *
+     * Подсветку `filter` не расставляет по вводу, как `search`: набранное
+     * сужает выдачу, а не ищет конкретную опцию. Но у неё нет и своей
+     * клавиатурной подсказки, поэтому при первом открытии панель встаёт на
+     * выбранное или на первую из отфильтрованных сама, тем же методом, что и
+     * стрелка вниз (`TSelectKeyboardPlugin.highlightSelected`). Дальше, пока
+     * панель уже открыта, подсветка следит за сузившейся выдачей сама
+     * (`onEngineBound` в `TSelectKeyboardPlugin`).
+     */
+    private _filter;
+    private _open;
+    private _setQuery;
+    /**
+     * Слушаем `focusout`, только пока поле принимает ввод — независимо от
+     * `editableMode`: в select-only фокус на панель не переключается вовсе
+     * (панель не фокусируемая часть), поэтому там слушать нечего.
+     */
+    private _syncFocusListener;
+    private _listenFocus;
+    private _unlistenFocus;
+    /**
+     * Фокус ушёл — но не в панель: она телепортирована и лежит вне поддерева
+     * поля, поэтому одного `contains()` мало. Границы — те же, что у нажатия
+     * мимо: их знает `TDismissPlugin` (корень, панель по пометке, слои выше).
+     */
+    private _handleFocusOut;
+    /**
+     * Единая точка возврата поля: снимает набранное и отбор, пишет текст
+     * возврата в `owner.field.value`. Вызывают второй `Escape` на закрытой
+     * панели и уход фокуса — см. JSDoc класса. Отбор — когда закрытая панель
+     * догаснет.
+     */
+    private _returnField;
+    /** Текст возврата — в `owner.field.value`; набранное и отбор не трогает. */
+    private _writeFieldText;
+    /** Сбросить набранное и отбор сразу, не трогая текст поля. */
+    private _resetQuery;
+    /**
+     * Сбросить набранное сразу, а отбор — когда закрытая панель доиграет свои
+     * переходы (см. JSDoc класса). Панель открыта или её узла нет — ждать
+     * нечего, и отбор снимается сразу. Ожидание одно: новый вызов заменяет
+     * прежнее.
+     */
+    private _resetQueryAfterPanel;
+    /** Снять отбор сейчас; ожидание исчезания панели, если шло, больше не нужно. */
+    private _clearFilter;
+    /** Плагин ждёт исчезания панели — снять отбор сейчас, не дожидаясь. */
+    private _flushFilterReset;
+    /** Перестать ждать: отбор остаётся, каким его застали. */
+    private _cancelFilterReset;
+    private get _filterExtension();
+    private get _selectionExtension();
+    private get _selectExtension();
+    /**
+     * Текст, который встаёт в поле при возврате. `multiple` всегда пуст —
+     * значение там показывают теги, а не текст поля; `single` — текст
+     * выбранного, пусто, если ничего не выбрано.
+     */
+    private _fieldText;
+    private _selectedText;
+}

package/dist/custom/select/editable/editable.plugin.js

@@ -0,0 +1,347 @@
+import { TBasePlugin } from "../../../base/base.class.js";
+import { TCollectionBundlesPlugin } from "../../collection/bundles.plugin.js";
+import { TElementPlugin } from "../../element/element.plugin.js";
+import { afterTransitions } from "../../../utils/afterTransitions.js";
+import { TDismissPlugin } from "../../dismiss/dismiss.plugin.js";
+import { fieldOf } from "../../input/field.js";
+import { TSelectKeyboardPlugin } from "../keyboard/keyboard.plugin.js";
+import { filterOf, selectOf, selectionOf } from "@soxa-ui/core";
+//#region src/custom/select/editable/editable.plugin.ts
+/**
+* TEditablePlugin — реакция на ввод текста в поле Select при `editable: true`.
+*
+* Подписка, а не проверка на каждый ввод: плагин слушает `change:editable` и
+* `change:editableMode` и вешает обработчик `input` только тогда, когда ввод
+* вообще на что-то влияет — `editable: true` и режим не `none`. В остальное
+* время слушателя нет, и никакой логики не выполняется вовсе. Так состояние
+* поля выражено подпиской, а не условием внутри обработчика, который иначе
+* звали бы на каждое нажатие впустую.
+*
+* `editableMode` (см. `TSelect`) — значение с тремя состояниями, а этот плагин
+* — операция над ним, по одной функции на режим:
+*
+* - `search` — {@link _highlight}: подсвечивает первую опцию, чей текст
+*   содержит набранное в любом месте, без учёта регистра, — методом
+*   клавиатуры (`TSelectKeyboardPlugin.highlightByText`): подсветка и
+*   `aria-activedescendant` остаются у неё. Правила набора по первым буквам
+*   (`TTypeahead`) сюда не идут: там буквы ищут опцию по началу текста от
+*   подсвеченной (WAI-ARIA), а здесь вводят произвольный фрагмент текста.
+*   Список остаётся целым, ничего не скрывается.
+* - `filter` — {@link _filter}: отдаёт набранное в `filter.query` коллекции.
+*   Отбор уже умеет `TFilterExtension` — сузить выдачу, не трогая хранилище;
+*   плагину остаётся передать текст. Отсюда и одна строка вместо второго
+*   значения поля: ни ядру, ни шести адаптерам не пришлось ничего узнать.
+*
+* Слушает `input` вложенного `<input>`, а не `keydown`: текст меняется не
+* только с клавиатуры, но и вставкой, автозаполнением, IME или очисткой поля
+* — всё это `input`-событие ловит одинаково. Узел — по общему правилу полей
+* (`fieldOf`), так же, как у `TInputPlugin`, — разметку и адаптеры трогать не
+* пришлось.
+*
+* **Возврат поля** — одна точка (`_returnField`): снимает набранное и отбор и
+* пишет текст возврата в `owner.field.value` — экземпляр `TInput`, которым
+* владеет Select (не `<input>` напрямую: DOM больше нигде здесь не
+* трогается). Закрытие панели её не вызывает (владелец закрывает панель
+* кликом по стрелке, оставляя набранное как есть); точку вызывают два повода:
+*
+* - второй `Escape` на уже закрытой панели (первый только закрывает —
+*   событие `escape` шлёт клавиатурная стратегия `TEditableKeyboardStrategy`,
+*   слушать `close` напрямую было бы циклом: клавиатура сама зависит от
+*   `TSelectKeyboardPlugin`);
+* - `focusout`, когда фокус ушёл и с корня, и с телепортированной панели —
+*   границы те же, что у нажатия мимо (`TDismissPlugin.isInside`), и переход
+*   внутрь панели ничего не меняет.
+*
+* Смена `editable`/`editableMode` пишет в поле тот же текст возврата: режим
+* сменился, значит набранное и отбор относились к прежнему режиму и больше
+* не актуальны. Никакой умной логики (что оставить, а что сбросить) для
+* этого редкого перехода нет намеренно: сбрасывается всё, как при обычном
+* возврате поля, только отбор — сразу (см. ниже).
+*
+* Выбор сюда не входит: текст выбранного (`single`) и очистку поля
+* (`multiple`) пишет сама `TSelectExtension` — `owner.field.value` меняется
+* реактивно, и вложенный `Input` перерисуется сам. Этому плагину на выбор
+* остаётся сбросить то, что относится только к вводу: набранное (`query`) и
+* отбор (`filter`) — иначе после выбора в `multiple` панель осталась бы
+* сужена прежним запросом.
+*
+* Слушает он для этого событие `choose` расширения `select`, а не
+* `change:selection`. Набор прерывает то же, что безусловно пишет поле, —
+* выбор пользователя (`chooseItem`, `clear`). Смена `value` или состава,
+* закрытие тега во время ввода поле не трогают, и сброс на
+* `change:selection` оставил бы набранное в поле, развернув список целиком.
+*
+* **Отбор снимается, когда закрытая панель догасла.** Набор обычно кончается
+* закрытием панели — выбором в `single`, Tab с поля, нажатием мимо, — а
+* панель гаснет переходом темы и до его конца остаётся на экране. Сними
+* плагин отбор тем же действием, гаснущая панель на миг показала бы весь
+* список и вытянулась бы до его высоты. Поэтому выбор, второй `Escape` и
+* уход фокуса снимают набранное и пишут поле сразу — это поле, а не панель, —
+* а отбор (`filter.query`) снимают, когда панель доиграла свои переходы
+* (`afterTransitions` — то же ожидание, что у замка прокрутки). Закрытая
+* панель показывает то, что показывала. Панель открыта (выбор в `multiple`,
+* `closeOnSelect: false`) или её узла нет (нет `TDismissPlugin`, корень не
+* объявлен, рендер на сервере) — ждать нечего, и отбор снимается сразу.
+* Ожидание одно: новый повод заменяет прежнее.
+*
+* Пока плагин ждёт:
+*
+* - панель открыли снова — отбор снимается сразу: поле уже показывает
+*   выбранное или возвращённый текст, и суженная панель не дала бы увидеть
+*   остальные опции без нового ввода;
+* - в поле снова печатают — ожидание отменяется до записи набранного: отбор
+*   теперь пишет ввод, а открытие панели из него иначе сняло бы только что
+*   набранное;
+* - отбор сменил кто-то другой (в `none` отбором ведает приложение) —
+*   ожидание отменяется: это уже не тот отбор, который плагин собирался
+*   снять;
+* - `destroy()` — отбор снимается сразу: движок снаружи переживает
+*   компонент, и ждать исчезания панели больше некому.
+*
+* Смена `editable`/`editableMode` снимает отбор сразу: это не закрытие
+* панели, а отложенная запись стёрла бы отбор, который приложение ставит
+* после перехода в `none`.
+*
+* Реакция на сам ввод (`_handleInput`) слушает DOM-событие `input`
+* вложенного `<input>`, а не `change:value` у `field`: `_returnField` тоже
+* пишет в `field.value`, и слушай плагин это событие, собственная запись
+* возврата запустила бы повторный поиск и открыла панель.
+*/
+var TEditablePlugin = class extends TBasePlugin {
+	_owner = null;
+	_dismiss = null;
+	_keyboard = null;
+	_engine = null;
+	_input = null;
+	_listening = false;
+	_focusListening = false;
+	_query = "";
+	/** Отмена ожидания, пока закрытая панель догаснет; `null` — плагин не ждёт. */
+	_stopWaiting = null;
+	_onInput = this._handleInput.bind(this);
+	_onFocusOut = this._handleFocusOut.bind(this);
+	install(ctx) {
+		super.install(ctx);
+		this._owner = ctx.getInstance() ?? null;
+		this._keyboard = ctx.get(TSelectKeyboardPlugin) ?? null;
+		this._dismiss = ctx.get(TDismissPlugin) ?? null;
+		const elementPlugin = ctx.get(TElementPlugin);
+		elementPlugin?.events.on("ready", () => {
+			const el = elementPlugin.element;
+			if (!el) return;
+			const field = fieldOf(el);
+			this._input = field instanceof HTMLInputElement ? field : null;
+			this._syncListener();
+			this._syncFocusListener();
+		});
+		elementPlugin?.events.on("removed", () => {
+			this._unlisten();
+			this._unlistenFocus();
+			this._input = null;
+		});
+		ctx.get(TCollectionBundlesPlugin)?.events.on("engine:bound", (engine) => {
+			this._engine = engine;
+			this._listenTo(this._selectExtension?.events, "choose", () => {
+				if (this._owner?.editable) this._resetQueryAfterPanel();
+			});
+			this._listenTo(this._filterExtension?.events, "change:query", () => this._cancelFilterReset());
+		});
+		this._listenTo(this._owner?.events, "change:editable", () => {
+			this._syncListener();
+			this._syncFocusListener();
+			this._resetQuery();
+			this._writeFieldText();
+		});
+		this._listenTo(this._owner?.events, "change:editableMode", () => {
+			this._syncListener();
+			this._resetQuery();
+			this._writeFieldText();
+		});
+		this._listenTo(this._owner?.events, "change:open", ({ newValue: open }) => {
+			if (open) this._flushFilterReset();
+		});
+		this._keyboard?.events.on("escape", () => this._returnField());
+	}
+	destroy() {
+		this._flushFilterReset();
+		this._unlisten();
+		this._unlistenFocus();
+		this._input = null;
+		this._owner = null;
+		this._keyboard = null;
+		this._dismiss = null;
+		this._engine = null;
+		super.destroy();
+	}
+	/** Что сейчас набрано в поле — до выбора или закрытия панели. */
+	get query() {
+		return this._query;
+	}
+	/** Слушаем ввод ровно тогда, когда ему есть на что влиять. */
+	_syncListener() {
+		const owner = this._owner;
+		if (Boolean(owner?.editable) && owner?.editableMode !== "none") this._listen();
+		else this._unlisten();
+	}
+	_listen() {
+		if (this._listening || !this._input) return;
+		this._input.addEventListener("input", this._onInput);
+		this._listening = true;
+	}
+	_unlisten() {
+		if (!this._listening) return;
+		this._input?.removeEventListener("input", this._onInput);
+		this._listening = false;
+	}
+	_handleInput() {
+		this._cancelFilterReset();
+		const value = this._input?.value ?? "";
+		this._setQuery(value);
+		if (this._owner?.editableMode === "filter") this._filter(value);
+		else this._highlight(value);
+	}
+	/** `search` — подсветка совпадения, список остаётся целым. */
+	_highlight(value) {
+		if (!value) return;
+		this._open();
+		this._keyboard?.highlightByText(value);
+	}
+	/**
+	* `filter` — скрытие несовпавших.
+	*
+	* Пустая строка сюда доходит и снимает отбор: в отличие от подсветки,
+	* «ничего не набрано» — это состояние, а не отсутствие события.
+	*
+	* Подсветку `filter` не расставляет по вводу, как `search`: набранное
+	* сужает выдачу, а не ищет конкретную опцию. Но у неё нет и своей
+	* клавиатурной подсказки, поэтому при первом открытии панель встаёт на
+	* выбранное или на первую из отфильтрованных сама, тем же методом, что и
+	* стрелка вниз (`TSelectKeyboardPlugin.highlightSelected`). Дальше, пока
+	* панель уже открыта, подсветка следит за сузившейся выдачей сама
+	* (`onEngineBound` в `TSelectKeyboardPlugin`).
+	*/
+	_filter(value) {
+		const filter = this._filterExtension;
+		if (!filter) return;
+		filter.query = value;
+		if (!value) return;
+		const wasOpen = Boolean(this._owner?.open);
+		this._open();
+		if (!wasOpen) this._keyboard?.highlightSelected();
+	}
+	_open() {
+		if (this._owner) this._owner.open = true;
+	}
+	_setQuery(value) {
+		const oldQuery = this.query;
+		if (this._query === value) return;
+		this._query = value;
+		this.events.emit("change:query", {
+			newValue: value,
+			oldValue: oldQuery
+		});
+	}
+	/**
+	* Слушаем `focusout`, только пока поле принимает ввод — независимо от
+	* `editableMode`: в select-only фокус на панель не переключается вовсе
+	* (панель не фокусируемая часть), поэтому там слушать нечего.
+	*/
+	_syncFocusListener() {
+		if (this._owner?.editable) this._listenFocus();
+		else this._unlistenFocus();
+	}
+	_listenFocus() {
+		if (this._focusListening || !this._input) return;
+		this._input.addEventListener("focusout", this._onFocusOut);
+		this._focusListening = true;
+	}
+	_unlistenFocus() {
+		if (!this._focusListening) return;
+		this._input?.removeEventListener("focusout", this._onFocusOut);
+		this._focusListening = false;
+	}
+	/**
+	* Фокус ушёл — но не в панель: она телепортирована и лежит вне поддерева
+	* поля, поэтому одного `contains()` мало. Границы — те же, что у нажатия
+	* мимо: их знает `TDismissPlugin` (корень, панель по пометке, слои выше).
+	*/
+	_handleFocusOut(event) {
+		if (this._dismiss?.isInside(event.relatedTarget)) return;
+		this._returnField();
+	}
+	/**
+	* Единая точка возврата поля: снимает набранное и отбор, пишет текст
+	* возврата в `owner.field.value`. Вызывают второй `Escape` на закрытой
+	* панели и уход фокуса — см. JSDoc класса. Отбор — когда закрытая панель
+	* догаснет.
+	*/
+	_returnField() {
+		this._resetQueryAfterPanel();
+		this._writeFieldText();
+	}
+	/** Текст возврата — в `owner.field.value`; набранное и отбор не трогает. */
+	_writeFieldText() {
+		if (this._owner) this._owner.field.value = this._fieldText();
+	}
+	/** Сбросить набранное и отбор сразу, не трогая текст поля. */
+	_resetQuery() {
+		this._setQuery("");
+		this._clearFilter();
+	}
+	/**
+	* Сбросить набранное сразу, а отбор — когда закрытая панель доиграет свои
+	* переходы (см. JSDoc класса). Панель открыта или её узла нет — ждать
+	* нечего, и отбор снимается сразу. Ожидание одно: новый вызов заменяет
+	* прежнее.
+	*/
+	_resetQueryAfterPanel() {
+		const panel = this._owner?.open ? null : this._dismiss?.findPanel() ?? null;
+		if (!panel) {
+			this._resetQuery();
+			return;
+		}
+		this._setQuery("");
+		this._cancelFilterReset();
+		this._stopWaiting = afterTransitions(panel, () => {
+			this._stopWaiting = null;
+			this._filterExtension?.clear();
+		});
+	}
+	/** Снять отбор сейчас; ожидание исчезания панели, если шло, больше не нужно. */
+	_clearFilter() {
+		this._cancelFilterReset();
+		this._filterExtension?.clear();
+	}
+	/** Плагин ждёт исчезания панели — снять отбор сейчас, не дожидаясь. */
+	_flushFilterReset() {
+		if (this._stopWaiting) this._clearFilter();
+	}
+	/** Перестать ждать: отбор остаётся, каким его застали. */
+	_cancelFilterReset() {
+		this._stopWaiting?.();
+		this._stopWaiting = null;
+	}
+	get _filterExtension() {
+		return filterOf(this._engine);
+	}
+	get _selectionExtension() {
+		return selectionOf(this._engine);
+	}
+	get _selectExtension() {
+		return selectOf(this._engine);
+	}
+	/**
+	* Текст, который встаёт в поле при возврате. `multiple` всегда пуст —
+	* значение там показывают теги, а не текст поля; `single` — текст
+	* выбранного, пусто, если ничего не выбрано.
+	*/
+	_fieldText() {
+		if (this._selectionExtension?.multiple) return "";
+		return this._selectedText();
+	}
+	_selectedText() {
+		return this._selectExtension?.text ?? "";
+	}
+};
+//#endregion
+export { TEditablePlugin };

package/dist/custom/select/editable/index.d.ts

@@ -0,0 +1,2 @@
+export { TEditablePlugin } from './editable.plugin';
+export type { TEditablePluginEvents } from './types';

package/dist/custom/select/editable/types.d.ts

@@ -0,0 +1,6 @@
+import type { TValuePayload } from '@soxa-ui/core';
+import type { TPluginEvents } from '../../../base';
+export type TEditablePluginEvents = TPluginEvents & {
+    /** change:query — сменился текст, набранный в поле */
+    'change:query': (payload: TValuePayload<string>) => void;
+};

package/dist/custom/select/ids/ids.plugin.d.ts

@@ -0,0 +1,22 @@
+import { TBasePlugin } from '../../../base';
+import type { IPluginContext } from '../../../base';
+/**
+ * TSelectIdsPlugin — связка «поле ↔ список» Select в документе.
+ *
+ * `id` списка — в `listAria`, который разметка раскладывает на список, и
+ * ссылка на него `aria-controls` — в `aria` поля (`field.aria`): связку со
+ * списком объявляет поле с `role="combobox"`, а не корень Select. Список
+ * существует всегда — в отличие от панели у Tabs, которой может и не быть, —
+ * поэтому ссылка стоит всегда.
+ *
+ * Сторона опций — у самих опций (`TOptionIdsPlugin`, общий с элементами
+ * ListBox): у каждой своё монтирование. `aria-activedescendant` берёт `id`
+ * подсвеченной опции из её набора (`TSelectKeyboardPlugin`).
+ *
+ * `id` — от монтирования (`createId`), а не от экземпляра: он нужен только
+ * документу, и на сервере и в браузере обязан совпасть. Пишется при
+ * установке, синхронно, — связка есть уже в первой (и серверной) отрисовке.
+ */
+export declare class TSelectIdsPlugin extends TBasePlugin {
+    install(ctx: IPluginContext): void;
+}

package/dist/custom/select/ids/ids.plugin.js

@@ -0,0 +1,31 @@
+import { TBasePlugin } from "../../../base/base.class.js";
+//#region src/custom/select/ids/ids.plugin.ts
+/**
+* TSelectIdsPlugin — связка «поле ↔ список» Select в документе.
+*
+* `id` списка — в `listAria`, который разметка раскладывает на список, и
+* ссылка на него `aria-controls` — в `aria` поля (`field.aria`): связку со
+* списком объявляет поле с `role="combobox"`, а не корень Select. Список
+* существует всегда — в отличие от панели у Tabs, которой может и не быть, —
+* поэтому ссылка стоит всегда.
+*
+* Сторона опций — у самих опций (`TOptionIdsPlugin`, общий с элементами
+* ListBox): у каждой своё монтирование. `aria-activedescendant` берёт `id`
+* подсвеченной опции из её набора (`TSelectKeyboardPlugin`).
+*
+* `id` — от монтирования (`createId`), а не от экземпляра: он нужен только
+* документу, и на сервере и в браузере обязан совпасть. Пишется при
+* установке, синхронно, — связка есть уже в первой (и серверной) отрисовке.
+*/
+var TSelectIdsPlugin = class extends TBasePlugin {
+	install(ctx) {
+		super.install(ctx);
+		const select = ctx.getInstance();
+		if (!select) return;
+		const listId = ctx.createId("list");
+		select.listAria.add("id", listId);
+		select.field.aria.add("aria-controls", listId);
+	}
+};
+//#endregion
+export { TSelectIdsPlugin };

package/dist/custom/select/ids/index.d.ts

@@ -0,0 +1 @@
+export * from './ids.plugin';

package/dist/custom/select/index.d.ts

@@ -0,0 +1,5 @@
+export * from './keyboard';
+export * from './editable';
+export * from './pointer';
+export * from './backspace';
+export * from './ids';

package/dist/custom/select/keyboard/index.d.ts

@@ -0,0 +1,2 @@
+export { TSelectKeyboardPlugin } from './keyboard.plugin';
+export type { ISelectKeyboardPluginOptions, TSelectKeyboardPluginEvents } from './types';