@sberbusiness/triplex-next-mcp-server 1.48.0-beta → 1.50.0-beta

package/bundle/components/Step.md

@@ -1,23 +1,21 @@
 ---
 component: Step
-category: Navigation
-figma-node: ""
-figma-file: ""
-related: [Stepper, Tooltip]
+category: Step
+related: [Stepper, Tooltip, Text]
 tokens:
-  - --triplex-next-Step-Background_Default
-  - --triplex-next-Step-Background_Active
-  - --triplex-next-Step-Background_Done
-  - --triplex-next-Step-Background_Warning
-  - --triplex-next-Step-Background_Error
-  - --triplex-next-Step-Background_Disabled
-  - --triplex-next-Step-Color_Default
-  - --triplex-next-Step-Color_Active
-  - --triplex-next-Step-Color_Done
-  - --triplex-next-Step-Color_Warning
-  - --triplex-next-Step-Color_Error
-  - --triplex-next-Step-Color_Disabled
-stories: ""
+  - Step.Background_Active
+  - Step.Background_Default
+  - Step.Background_Disabled
+  - Step.Background_Done
+  - Step.Background_Error
+  - Step.Background_Warning
+  - Step.Color_Active
+  - Step.Color_Default
+  - Step.Color_Disabled
+  - Step.Color_Done
+  - Step.Color_Error
+  - Step.Color_Warning
+stories: stories/Step/Step.stories.tsx
 version: "1.0"
 ---
 
@@ -25,92 +23,182 @@ version: "1.0"
 
 ## Назначение
 
-Визуальный «кружок с номером шага» для stepper-интерфейсов. Показывает статус
-(`default`/`active`/`done`/`warning`/`error`/`disabled`) через цветовой стейт.
-Опционально оборачивается в `Tooltip` (hover), если передан `children`.
+Круглый индикатор одного шага: номер внутри кружка, цвет фона и цвет номера кодируют статус
+(`DEFAULT` / `DONE` / `ACTIVE` / `ERROR` / `WARNING` / `DISABLED`). Компонент рисует ровно один
+шаг — ряд шагов и связь между ними собирает потребитель. Если передан `children`, кружок
+оборачивается в `Tooltip`, раскрывающийся по наведению.
 
-Используй когда: нужен отдельный индикатор шага (например, внутри кастомного
-stepper-а). Для готового пошагового виджета — `Stepper`.
-Не используй когда: нужен текстовый label шага — добавь его рядом, `Step`
-отрисовывает только номер в кружке.
+Используй когда: нужно показать номер и состояние отдельного шага внутри своей вёрстки
+пошагового сценария — так его использует `IslandAccordion` для нумерации секций.
 
----
-
-## Файловая структура
-
-```text
-src/components/Step/
-├── Step.tsx          # FC
-├── enums.ts          # EStepStatus, EStepPosition
-├── index.ts
-└── styles/Step.module.less
-```
+Не используй когда:
 
-Также экспортируется утилита `calcPosition(stepCount, i)` — вычисляет
-`EStepPosition` (первый/последний/в середине) для списка шагов.
+- Нужен готовый горизонтальный степпер с переключением шагов, подписями и клавиатурной
+  навигацией — возьми `Stepper` (или `StepperExtended` для произвольного состава шагов).
+  `Step` в реализацию `Stepper` не входит: у того собственный `StepperStep`.
+- Нужен кликабельный элемент. `Step` рендерит `<div>` без роли, фокуса и обработчиков —
+  интерактивность придётся навешивать снаружи, вместе с ролью и клавиатурой.
+- Нужно показать статус без номера — возьми `Marker` или `MarkerStatus`.
 
 ---
 
 ## Варианты и props
 
-### `IStepProps`
+### Обязательные props
+
+| Prop | Тип | Описание |
+|---|---|---|
+| `step` | `number` | Номер шага. Рендерится внутри кружка через `Text` (`B1`, semibold). Компонент не форматирует и не ограничивает значение: двузначные номера помещаются, кружок под содержимое не растягивается |
+| `status` | `EStepStatus` | Состояние шага. Определяет **только** пару цветов — фон кружка и цвет номера |
 
-| Prop | Тип | Default | Описание |
+### Опциональные props
+
+| Prop | Тип | По умолчанию | Описание |
 |---|---|---|---|
-| `step` | `number` | — | Число, отображаемое внутри кружка. |
-| `status` | `EStepStatus` | — | Цветовой стейт (см. ниже). |
-| `position?` | `EStepPosition` | `Default` | Влияет на `alignTip` опционального Tooltip'а. |
-| `children?` | `ReactNode` | — | Контент Tooltip'а. Если не передан — Tooltip не рендерится. |
-| `...HTMLAttributes<HTMLDivElement>` | — | — | Прокидываются на корневой `<div>`. |
+| `size` | `EComponentSize` | `EComponentSize.MD` | Размер кружка. SM и MD дают 28px, LG — 32px |
+| `position` | `EStepPosition` | `EStepPosition.Default` | Позиция шага в ряду. Влияет **только** на выравнивание указателя подсказки и потому имеет смысл лишь вместе с `children` |
+| `children` | `React.ReactNode` | — | Содержимое подсказки. Без него подсказка не создаётся и `Tooltip` не монтируется вовсе |
 
-### `EStepStatus`
+Остальные props — стандартные атрибуты `div`
+(`IStepProps extends React.HTMLAttributes<HTMLDivElement>`), уходят на корневой элемент
+через `...rest`.
 
-`DEFAULT` / `DONE` / `ACTIVE` / `ERROR` / `WARNING` / `DISABLED`.
+### Размер и статус независимы
 
-Маппинг на CSS-классы 1-к-1 через `statusToClassNameMap`.
+Две оси не пересекаются: `size` отвечает за геометрию, `status` — за пару цветов. Любая
+комбинация допустима, поэтому матрицу 3×6 целиком покрывает story `VisualTests`,
+а документационные stories показывают оси по отдельности.
 
-### `EStepPosition`
+### `position` и подсказка
 
-| Value | Поведение (alignTip) |
-|---|---|
-| `XFirst` | `ETooltipAlign.START` |
-| `Default` | `ETooltipAlign.CENTER` |
-| `XLast` | `ETooltipAlign.END` |
+`position` отображается на `alignTip` подсказки: `XFirst` → `START`, `Default` → `CENTER`,
+`XLast` → `END`. Для крайних шагов ряда указатель прижимается к краю, чтобы подсказка
+не выходила за границы ряда. Без `children` prop ни на что не влияет.
+
+Значение для ряда шагов считает экспортируемый хелпер `calcPosition(stepCount, i)`:
+`XFirst` для `i === 0`, `XLast` для последнего, иначе `Default`. Для ряда из одного шага
+возвращает `XFirst` — проверка на первый шаг идёт первой.
+
+---
+
+## Дизайн-токены
 
-`calcPosition(total, i)` возвращает `XFirst`/`XLast`/`Default` для удобства
-сборки списка шагов.
+Переопределяются через `ThemeProvider` (prop `tokens`) — см. `ThemeProvider-ai.md` →
+«Как переопределять токены». Значения по умолчанию — `src/components/DesignTokens/components/Step.ts`.
+
+```text
+Step.Background_Default
+Step.Background_Done
+Step.Background_Active
+Step.Background_Error
+Step.Background_Warning
+Step.Background_Disabled
+Step.Color_Default
+Step.Color_Done
+Step.Color_Active
+Step.Color_Error
+Step.Color_Warning
+Step.Color_Disabled
+```
+
+По паре токенов (`Background_*` + `Color_*`) на каждое значение `EStepStatus`; добавление
+статуса означает и два новых токена. Цвет номера задаётся селектором `& > span` — он попадает
+на элемент, который рендерит `Text`.
+
+Размеры (28 / 32px, `border-radius: 50%`) заданы литералами в `styles/Step.module.less` — они
+специфичны для компонента. Брейкпоинт адаптива берётся из LESS-переменной `@screen-sm-max`.
 
 ---
 
 ## Инварианты
 
-- **Рендер числа через `<Text size=B1 weight=SEMIBOLD>`** — фикс типографики для совпадения с дизайном.
-- **Tooltip рендерится только при наличии `children`** — без children компонент возвращает голый `<div>`.
-- **Tooltip: `toggleType="hover"`, `size=SM`** — не менять без согласования.
-- **Step — `FC`**, ref не пробрасывается (корневой div доступен только через обёртку Tooltip — по-разному в двух ветках рендера).
-- **Публичные enums** (`EStepStatus`, `EStepPosition`) + функция `calcPosition` — часть публичного API.
+- `forwardRef<HTMLDivElement>` — не убирать. Ref всегда указывает на корневой `<div class="step">`,
+  и в варианте с подсказкой тоже: внешний ref мерджится с внутренним через
+  `setForwardedRef` (`src/helpers/setForwardedRef.ts`).
+- Внутренний ref на корневой `<div>` обязателен: он уходит в `Tooltip` как `targetRef` —
+  относительно этого узла считается позиция подсказки. Убрать внутренний ref или перевесить
+  его на другой элемент нельзя.
+- Корневой элемент — `<div>`. Кружок центрует содержимое через `display: flex`; смена тега
+  сломает вёрстку и типизацию props.
+- `displayName` — `"Step"`. Не менять.
+- Значения `EStepStatus` (`"default"` / `"done"` / `"active"` / `"error"` / `"warning"` /
+  `"disabled"`) совпадают с именами CSS-классов в `Step.module.less` и с суффиксами токенов
+  `Step.Background_*` / `Step.Color_*`. Переименование значения enum — ломающее изменение
+  сразу в трёх местах.
+- Значения `EStepPosition` — `PascalCase` (`Default` / `XFirst` / `XLast`), в отличие от
+  остальных enum'ов библиотеки. Это часть публичного API, приводить к общему виду нельзя.
+- Подсказка монтируется только при непустом `children`. Оборачивать кружок в `Tooltip`
+  безусловно нельзя: пустая подсказка перехватывала бы наведение.
+- `EStepStatus.DISABLED` — только цвет. Ни `pointer-events`, ни `aria-disabled` компонент
+  не выставляет, подсказка у выключенного шага продолжает работать.
+- Экспорты `Step`, `IStepProps`, `calcPosition`, `EStepStatus` и `EStepPosition` идут в barrel
+  `src/components/Step/index.ts` — сохранять. `calcPosition` внутри компонента не используется,
+  но входит в публичный API: он нужен потребителю, который собирает ряд шагов.
+- `className` деструктурируется из props и мерджится через `clsx`, поэтому в `...rest`
+  его нет и перезатереть базовые классы он не может.
 
 ---
 
 ## Accessibility
 
-- Компонент — чисто визуальный (`<div>` с числом); сам по себе ARIA-ролью не наделён.
-- В составе stepper-а потребитель обязан обеспечить семантику (`role="list"` / `role="listitem"` / `aria-current="step"` на активном шаге). См. `Stepper-AI`.
-- Tooltip показывается только на hover — для пользователей клавиатуры текст подсказки недоступен. Если содержимое tooltip важно, дублируй его видимым лейблом рядом со Step.
+- Собственной ARIA-роли нет: корневой `<div>` — неинтерактивный контейнер, в порядок фокуса
+  не попадает, обработчиков клавиатуры у компонента нет.
+- Номер шага — единственное, что читает скринридер. Смысл шага в разметку не попадает:
+  текст подсказки живёт в `Tooltip`, который раскрывается по наведению или клику мышью
+  и с клавиатуры недоступен. Если шаг должен быть понятен без мыши, опиши его видимым
+  текстом рядом в своей вёрстке.
+- Статус кодируется только цветом. Дублируй его видимым текстом на стороне потребителя.
+- Одного `aria-label` на `Step` недостаточно: корневой `<div>` без роли получает роль
+  `generic`, которой [спецификация HTML-AAM](https://www.w3.org/TR/html-aria/) запрещает
+  доступное имя, — атрибут попадёт в разметку через `...rest`, но скринридер его не
+  озвучит. Если имя нужно именно на шаге, передай вместе с ним роль, допускающую
+  именование: `<Step step={2} status={EStepStatus.ERROR} role="img" aria-label="Шаг 2, ошибка" />`.
+- Ряд шагов семантики списка не создаёт: если нужна структура, оберни шаги в `<ol>`/`<li>`
+  на стороне потребителя.
+- Компонент не хардкодит текстовые строки: содержимое подсказки и любые `aria-label` задаёт
+  потребитель. Библиотека мультиязычная.
 
 ---
 
 ## Связанные компоненты
 
-- `Stepper` — готовый виджет пошаговой навигации, использует Step внутри через `StepperStep` / `StepperStepIcon`.
-- `Tooltip` — оборачивает Step при наличии children.
-- `Typography.Text` — используется для рендера номера.
+- `Stepper` — готовый горизонтальный степпер с подписями, выбором шага и клавиатурной
+  навигацией. Альтернатива, когда нужен весь сценарий целиком, а не отдельный индикатор.
+  Общего кода со `Step` нет: у `Stepper` собственный `StepperStep`.
+- `Tooltip` — рендерится вокруг кружка, когда передан `children`. `Step` фиксирует
+  `size={ETooltipSize.SM}` и `toggleType="hover"`, а из props потребителя прокидывает
+  только выравнивание указателя (`alignTip`) — остальное настроить нельзя. `disableAdaptiveMode`
+  не передаётся, поэтому на экранах до `SM_MAX` включительно подсказка открывается
+  в адаптивном (полноэкранном) режиме.
+- `Text` — рендерит номер шага (`ETextSize.B1`, `EFontWeightText.SEMIBOLD`). Цвет номера
+  задаётся снаружи, селектором `& > span` в стилях `Step`.
+- `IslandAccordion` — потребитель: нумерует секции аккордеона, передавая `Step` номер,
+  статус и `size`. Опирается на то, что `Step` рисует только кружок, без внешних отступов.
 
 ---
 
 ## Stories
 
-Отдельных stories нет (используется внутри stories `Stepper`).
+Основные истории: `stories/Step/Step.stories.tsx`
+Файлы примеров: `stories/Step/examples/`
+
+| Story | Example file | Что демонстрирует |
+|---|---|---|
+| `Playground` | `Playground.tsx` | Интерактивный контроль `step`, `status`, `size`, `position` и текста подсказки |
+| `Default` | `Default.tsx` | Минимальный шаг: обязательны только `step` и `status` |
+| `Sizes` | `Sizes.tsx` | Размеры SM / MD / LG при одном статусе |
+| `Statuses` | `Statuses.tsx` | Все шесть значений `EStepStatus` при одном размере |
+| `WithTooltip` | `WithTooltip.tsx` | Шаг с подсказкой: `children` становится её содержимым |
+| `Example` | `Example.tsx` | Ряд шагов платёжного сценария, `position` считается через `calcPosition` |
+| `VisualTests` | `VisualTests.tsx` | Матрица размеров × статусов, двузначные номера и раскрытая подсказка (открывается `play`) — для скриншот-тестов |
+
+Из скриншот-тестов исключены (`testRunner: { skip: true }`) `Playground`, `Default` и
+`WithTooltip`: первые два визуально дублируют `Statuses`, а закрытая подсказка
+неотличима от обычного шага — раскрытая снимается в `VisualTests`, где её открывает
+`play`. Не добавляй им скриншоты: это дубли, которые придётся поддерживать.
+
+Story ID участвуют в именах baseline-скриншотов (`step--sizes--xs.png` и т.п.), поэтому
+переименование story требует перегенерации baseline и удаления осиротевших файлов.
 
 ---
 
@@ -118,4 +206,105 @@ src/components/Step/
 
 | Дата | Изменение |
 |---|---|
-| 2026-04-18 | Создан документ |
+| 2026-09-24 | Создан документ. AI-рефакторинг: `Step` переведён с `React.FC` на `forwardRef` (внешний ref мерджится с внутренним, который уходит в `Tooltip` как `targetRef`), JSDoc на компоненте и дефолтах props, `renderContent()` заменён на вычисляемый один раз элемент, приведён к порядку LESS. Добавлены unit-тесты (`__tests__/Step.test.tsx`), stories созданы по modern pattern (`stories/Step/`). |
+
+---
+
+## Примеры использования
+
+### Default
+
+`stories/Step/examples/Default.tsx`
+
+```tsx
+import React from "react";
+import { Step, EStepStatus } from "@sberbusiness/triplex-next";
+
+export const Default = () => <Step step={1} status={EStepStatus.DEFAULT} />;
+```
+
+### Sizes
+
+`stories/Step/examples/Sizes.tsx`
+
+```tsx
+import React from "react";
+import { Step, EComponentSize, EStepStatus } from "@sberbusiness/triplex-next";
+
+const SIZES = Object.values(EComponentSize);
+
+export const Sizes = () => (
+    <div style={{ display: "flex", flexDirection: "column", gap: 16 }}>
+        {SIZES.map((size, index) => (
+            <div key={size}>
+                <div style={{ marginBottom: 8, fontSize: 16, fontWeight: 700 }}>{size.toUpperCase()}</div>
+                <Step step={index + 1} status={EStepStatus.ACTIVE} size={size} />
+            </div>
+        ))}
+    </div>
+);
+```
+
+### Statuses
+
+`stories/Step/examples/Statuses.tsx`
+
+```tsx
+import React from "react";
+import { Step, EStepStatus } from "@sberbusiness/triplex-next";
+
+const STATUSES = Object.values(EStepStatus);
+
+export const Statuses = () => (
+    <div style={{ display: "flex", flexDirection: "column", gap: 16 }}>
+        {STATUSES.map((status, index) => (
+            <div key={status}>
+                <div style={{ marginBottom: 8, fontSize: 16, fontWeight: 700 }}>{status.toUpperCase()}</div>
+                <Step step={index + 1} status={status} />
+            </div>
+        ))}
+    </div>
+);
+```
+
+### WithTooltip
+
+`stories/Step/examples/WithTooltip.tsx`
+
+```tsx
+import React from "react";
+import { Step, EStepStatus } from "@sberbusiness/triplex-next";
+
+export const WithTooltip = () => (
+    <Step step={2} status={EStepStatus.ACTIVE}>
+        Заполните реквизиты получателя
+    </Step>
+);
+```
+
+### Example
+
+`stories/Step/examples/Example.tsx`
+
+```tsx
+import React from "react";
+import { Step, calcPosition, EStepStatus } from "@sberbusiness/triplex-next";
+
+const STEPS = [
+    { hint: "Реквизиты получателя заполнены", status: EStepStatus.DONE },
+    { hint: "Проверьте сумму и назначение платежа", status: EStepStatus.ACTIVE },
+    { hint: "Подписание доступно после проверки", status: EStepStatus.DEFAULT },
+    { hint: "Отправка доступна после подписания", status: EStepStatus.DISABLED },
+];
+
+export const Example = () => (
+    <div style={{ display: "flex", alignItems: "center", gap: 16 }}>
+        {STEPS.map(({ hint, status }, index) => (
+            <Step key={hint} step={index + 1} status={status} position={calcPosition(STEPS.length, index)}>
+                {hint}
+            </Step>
+        ))}
+    </div>
+);
+```
+

package/bundle/components/SuggestField.md

@@ -1,7 +1,7 @@
 ---
 component: SuggestField
 category: TextFields
-related: [Suggest, SelectField, TextField, FormField, Dropdown]
+related: [Suggest, SelectField, MultiselectField, SelectExtendedField, TextField, FormField, Dropdown, LoaderSmall]
 tokens: []
 stories: stories/SuggestField/SuggestField.stories.tsx
 version: "1.0"
@@ -45,7 +45,7 @@ version: "1.0"
 | `options` | `T[]` | Список опций. Фильтрует потребитель в ответ на `onFilter` — компонент список не фильтрует и не сортирует |
 | `tooltipHint` | `string` | Текст подсказки («Ничего не найдено», «Введите более 3 символов»). Обязателен, даже если `tooltipOpen` всегда `false` |
 | `tooltipOpen` | `boolean` | Показывать подсказку. Управляется снаружи: компонент сам не решает, когда список «пустой по делу» |
-| `onSelect` | `(value: T \| undefined) => void` | Опция выбрана. Вызывается с `undefined`, когда значение сбрасывается. На десктопе это blur с пустым полем и кнопка очистки; на мобильном — только закрытие дропдауна с пустым вводом, кнопка очистки там зовёт лишь `onClear` (см. «Инварианты»), так что сброс значения ложится на потребителя |
+| `onSelect` | `(value: T \| undefined) => void` | Опция выбрана. Вызывается с `undefined`, когда значение сбрасывается, — на обеих платформах только кнопкой очистки (см. «Инварианты»). Blur на десктопе и закрытие дропдауна на мобильном значение не сбрасывают даже при пустом вводе. Не сбрасывай значение в `onFilter("")`: при `clearInputOnFocus` десктоп зовёт его уже на фокусе |
 | `onFilter` | `(value: string) => void` | Текст поля ввода изменился. Ответ — обновлённый `options` |
 | `inputProps` | `IFormFieldInputProps & { ref?: React.Ref<HTMLInputElement> }` | Свойства поля ввода. **Не опционально:** передавай хотя бы `{}`. Через `inputProps.ref` потребитель получает ref на `<input>` — собственного `forwardRef` у компонента нет |
 
@@ -91,8 +91,7 @@ version: "1.0"
 | Ввод текста | `onFilter(value)`, сброс `aria-activedescendant`, список снова разрешён к автооткрытию |
 | `Escape` при открытом списке | Список закрывается, всплытие останавливается, автооткрытие подавлено до следующего ввода или mousedown |
 | Выбор опции | `onSelect(option)`, в поле подставляется `label`, автооткрытие подавлено |
-| Blur с непустым полем | В поле возвращается `label` текущего `value` |
-| Blur с пустым полем и заданным `value` | `onSelect(undefined)` |
+| Blur | В поле возвращается `label` текущего `value` (пустая строка, если `value` не задан). `onSelect` не вызывается: введённый, но не выбранный текст отбрасывается, в том числе пустой |
 | Клик по кнопке очистки | `onSelect(undefined)` (если было значение), `onFilter("")` (если поле не пустое), затем `onClear(event)` |
 
 `inputProps.onFocus` / `onBlur` / `onKeyDown` / `onMouseDown` / `onChange` вызываются
@@ -104,9 +103,14 @@ version: "1.0"
 
 Поле-триггер — `readOnly`, по фокусу открывается полноэкранный `Dropdown` с собственным полем
 ввода (автофокус). При `tooltipOpen` вместо списка показывается `SuggestFieldMobileDropdownHint`
-с текстом `tooltipHint`. Закрытие дропдауна с пустым полем ввода и заданным `value` вызывает
-`onSelect(undefined)`; закрытие сразу после выбора опции значение не сбрасывает. После закрытия
-поле-триггер скроллится в центр экрана (в iOS открытие дропдауна уводит страницу вверх).
+с текстом `tooltipHint`. Закрытие дропдауна без выбора опции значение не сбрасывает, даже при
+пустом поле ввода: на закрытии поле ввода дропдауна возвращается к `label` текущего `value`
+(через `onClose` у `Dropdown`, а не только на автофокусе — при повторном открытии во время
+анимации закрытия содержимое ещё смонтировано и автофокус не срабатывает). При следующем
+открытии с `clearInputOnFocus` поле очищается автофокусом. Кнопка очистки работает как на
+десктопе: `onSelect(undefined)` (если было значение), `onFilter("")` (если у значения непустой
+`label` — его и показывает поле-триггер), затем `onClear(event)`. После закрытия поле-триггер
+скроллится в центр экрана (в iOS открытие дропдауна уводит страницу вверх).
 
 ---
 
@@ -130,13 +134,15 @@ version: "1.0"
   и переименование наблюдаемо для потребителя.
 - `SuggestField` — `Object.assign(SuggestFieldBase, { Input: FormFieldInput })`. Дженерик
   сохраняется только у самой функции; `SuggestField.Input` — часть публичного API.
-- **Мобильная ветка получает не все props.** `SuggestField.tsx` передаёт в `SuggestFieldMobile`
-  явный whitelist, тогда как в `SuggestFieldDesktop` уходит `{...props}`. На мобильной ширине
-  до поля не доходят `className`, `id`, `data-test-id`, `active` и `renderInput`. Расширение
-  списка меняет наблюдаемое поведение — только по решению мейнтейнера.
-- **`onClear` на мобильном варианте работает иначе:** обработчик вешается на `FormFieldClear`
-  напрямую, без сброса `value` и фильтра, которые делает десктоп. Выравнивание — изменение
-  поведения, а не рефакторинг.
+- **Оба варианта получают все props.** `SuggestField.tsx` отдаёт `{...props}` и в
+  `SuggestFieldDesktop`, и в `SuggestFieldMobile`. Не возвращай явный список props для мобильной
+  ветки: пропущенный prop молча терялся бы на мобильной ширине (так до 1.49.0 терялись
+  `className`, `id`, `data-test-id`, `active` и `renderInput`).
+- **Значение сбрасывает только кнопка очистки — на обеих платформах.** Blur на десктопе и
+  закрытие дропдауна на мобильном `onSelect(undefined)` не зовут, даже при пустом вводе: иначе
+  при `clearInputOnFocus` значение терялось от простого фокуса без выбора. Кнопка очистки
+  рендерится только при `onClear`, так что без него встроенного сброса нет. Возврат сброса в
+  blur / закрытие дропдауна — изменение поведения, решение мейнтейнера.
 - Видимость десктопного списка синхронизируется **во время рендера** (`if (inputFocused) {...}`),
   а не в `useEffect`. Так требует правило `react-hooks/set-state-in-effect`; возврат к эффекту
   вернёт и ошибку линтера, и лишний кадр рендера.
@@ -201,8 +207,10 @@ version: "1.0"
 - `Dropdown` — выпадающий список: `DropdownDesktop` + `DropdownList` + `DropdownListItem` на
   десктопе, `DropdownMobile*` в полноэкранном мобильном варианте. `ISuggestFieldDesktopDropdownProps`
   наследует `IDropdownDesktopProps`.
-- `Tooltip` — подсказка `tooltipHint` у десктопного поля. В `related` не вынесен: односторонний
-  контракт по рендеру, а ориентир 2–5 имён уже выбран более полезными адресатами.
+- `LoaderSmall` — индикатор подгрузки подсказок: `SuggestFieldDesktop` и `SuggestFieldMobile`
+  показывают его с темой `BRAND`, пока `loading`.
+- `Tooltip` — подсказка `tooltipHint` у десктопного поля. В `related` не вынесен: связь узкая,
+  а список адресатов и так шире ориентира 2–5.
 - `MobileView` — переключает десктопный и мобильный варианты по ширине экрана. В `related` не
   вынесен по той же причине.
 - `SuggestFieldDesktop` / `SuggestFieldMobile` — платформенные варианты, экспортируются из barrel
@@ -238,6 +246,8 @@ version: "1.0"
 | Дата | Изменение |
 |---|---|
 | 2026-09-23 | Создан документ |
+| 2026-09-29 | Аудит симметрии `related` (TRI-156): добавлены обратные ссылки (`MultiselectField`, `SelectExtendedField`) и контракт по рендеру `LoaderSmall`. Публичный API и поведение не затронуты. |
+| 2026-10-02 | Сброс значения только кнопкой очистки на обеих платформах: при `clearInputOnFocus` значение терялось от фокуса без выбора. Blur на десктопе и закрытие дропдауна на мобильном больше не вызывают `onSelect(undefined)`; мобильная кнопка очистки сама зовёт `onSelect(undefined)` и `onFilter("")` (последний — при непустом `label`), как десктопная; на закрытии мобильного дропдауна его поле ввода возвращается к `label`. `SuggestField` отдаёт мобильному варианту все props, как десктопному: на мобильной ширине больше не теряются `className`, `id`, `data-test-id`, `active` и `renderInput`. Обновлены `onSelect`, поведение обеих платформ и «Инварианты» |
 
 ---
 
@@ -715,7 +725,6 @@ export const ProductionExample = () => {
         setInputPristine(false);
 
         if (inputValue.length === 0) {
-            setValue(undefined);
             setOptions(FOOD_OPTIONS);
             setTooltipOpen(false);
         } else {
@@ -750,7 +759,10 @@ export const ProductionExample = () => {
     };
 
     const handleClear: React.MouseEventHandler<HTMLButtonElement> = () => {
-        inputRef.current?.focus();
+        // На мобильном фокус открыл бы полноэкранный дропдаун сразу после очистки.
+        if (!adaptive) {
+            inputRef.current?.focus();
+        }
     };
 
     const handleLinkClick: React.MouseEventHandler<HTMLAnchorElement> = (event) => {

package/bundle/components/Tabs.md

@@ -1,7 +1,7 @@
 ---
 component: Tabs
 category: Tabs
-related: [TabsExtended, TabsLine, ButtonDropdown]
+related: [TabsExtended, TabsLine, ButtonDropdown, SegmentedControl]
 tokens:
   - Tabs.Type1_Tab_Background_Selected
   - Tabs.Type2_Tab_Background_Selected
@@ -110,6 +110,7 @@ Tabs.Type2_Tab_Background_Selected
 - `TabsLine` — альтернативный визуальный паттерн табов (подчёркивание вместо залитой кнопки).
 - `ButtonDropdown` — кнопка выпадающего списка, которую `Tabs` рендерит сам для не поместившихся табов; тема подбирается по `type` (`DOTS_SECONDARY` / `DOTS_SECONDARY_LIGHT`).
 - `Badge` — `Badge.Dot` как значок новых уведомлений на кнопке таба (рендерится внутри `TabsExtended.Content.TabButton`).
+- `SegmentedControl` — альтернатива, когда переключатель не управляет панелями контента: компактный набор сегментов без семантики табов, зато с режимом множественного выбора.
 
 ---
 

package/bundle/components/TabsLine.md

@@ -1,7 +1,7 @@
 ---
 component: TabsLine
 category: Tabs
-related: [Tabs, TabsExtended, Dropdown, Badge, Text]
+related: [Tabs, TabsExtended, Dropdown, Badge, Text, SegmentedControl]
 tokens:
   - TabsLine.BorderColor_Active
   - TabsLine.BorderColor_Hover
@@ -144,6 +144,7 @@ TabsLine.Shadow_Focus
 - `Badge` — значок новых уведомлений на табе (`Badge.Dot`).
 - `Text` — текст таба; размер выбирается по `size` через `tabsLineSizeToTextSizeMap`.
 - `MobileView` — переключает десктопный и мобильный варианты по ширине окна (<768px). Собственной разметки не добавляет.
+- `SegmentedControl` — альтернатива, когда переключатель не управляет панелями контента: компактный набор сегментов без семантики табов, зато с режимом множественного выбора.
 
 ---
 

package/bundle/components/TextField.md

@@ -1,7 +1,7 @@
 ---
 component: TextField
 category: TextFields
-related: [MaskedField, FormField, FormGroup, TextareaField, MonthYearField]
+related: [MaskedField, SmallInput, TextareaField, MonthYearField, FormField, FormGroup]
 tokens: []
 stories: stories/TextField/TextField.stories.tsx
 version: "1.0"
@@ -62,8 +62,8 @@ version: "1.0"
 
 - `forwardRef` на `TextField` и `TextFieldBase` — не убирать. Внешний `ref` указывает на корневой `<div>` `FormField`; ref на сам input — только через `inputProps.ref`.
 - Публичный API (`ITextFieldProps`: `inputProps` + `label`/`prefix`/`postfix`/`description`/`counter` + унаследованные `size`/`status`/`active`) — изменение имён/типов/значений enum — breaking change.
-- `TextFieldBase` намеренно НЕ экспортируется — приватная база.
-- Известное ограничение контракта: `inputProps.ref` типизирован как `React.RefObject<HTMLInputElement>` (не `React.Ref`), callback-ref формально не проходит по типам. Исправление — breaking change, требует отдельной задачи.
+- Компонент `TextFieldBase` намеренно НЕ экспортируется — приватная база. Его тип `ITextFieldBaseProps` экспортируется из barrel только как тип (`export type`): `children` в нём обязателен (слот поля ввода), поэтому потребители типизируют props собственных обёрток через `Omit<ITextFieldBaseProps, "children">` — так же, как `TextField`, `MaskedField`, `AmountField` и `TextareaField`. Переименование или изменение полей — breaking change.
+- `inputProps.ref` типизирован как `React.Ref<HTMLInputElement>` (расширен в TRIPLEX-935): принимает и объектный, и callback-ref, `FormFieldInput` отдаёт его прямо на `<input>`.
 - Уникальный `id` для связки label↔input генерируется через `lodash uniqueId` в `FormFieldInput` — не заменять на `useId` (React 17 совместимость через release-0).
 - `description || counter` рендерятся в общем блоке `FormFieldDescription` — не разносить по отдельным блокам (изменит DOM и скриншоты).
 
@@ -80,10 +80,12 @@ version: "1.0"
 
 ## Связанные компоненты
 
-- `TextFieldBase` (внутренний, не в barrel) — базовая раскладка `FormGroup`/`FormField` + слоты `prefix`/`children`/`label`/`postfix` и блок `description`/`counter`. Описан здесь, отдельного AI.md не имеет.
+- `TextFieldBase` (внутренний, не в barrel; публичен только тип `ITextFieldBaseProps`) — базовая раскладка `FormGroup`/`FormField` + слоты `prefix`/`children`/`label`/`postfix` и блок `description`/`counter`. Описан здесь, отдельного AI.md не имеет.
 - `FormField` / `FormFieldInput` и слоты семейства — низкоуровневые строительные блоки; используются напрямую, когда нужна нестандартная композиция.
 - `FormGroup` — контейнер вертикальной раскладки поля и описания.
 - `FormFieldClear` — кнопка очистки, передаётся в `postfix`.
+- `MaskedField` — то же поле, но с маской ввода: отличается только элементом ввода (`FormFieldMaskedInput` вместо `FormFieldInput`).
+- `SmallInput` — альтернатива для инлайн-редактирования короткого значения: без лейбла, статусов, описания и счётчика.
 - `TextareaField`, `AmountField`, `SuggestField`, `DateField`, `MonthYearField` — специализированные поля той же группы `TextFields`.
 
 ---
@@ -113,6 +115,8 @@ version: "1.0"
 | Дата | Изменение |
 |---|---|
 | 2026-07-27 | Создан документ (TRI-5). AI-рефакторинг TextField/TextFieldBase, unit-тесты, миграция stories на modern pattern |
+| 2026-09-29 | Тип `ITextFieldBaseProps` экспортирован из barrel (`export type`); компонент `TextFieldBase` остаётся приватным (TRI-158). Удалён устаревший инвариант про `RefObject` у `inputProps.ref` — тип уже `React.Ref` после TRIPLEX-935 |
+| 2026-09-29 | Аудит симметрии `related` (TRI-156): добавлены обратные ссылки (`SmallInput`). Публичный API и поведение не затронуты. |
 
 ---
 

package/bundle/components/TextareaField.md

@@ -1,7 +1,7 @@
 ---
 component: TextareaField
 category: TextFields
-related: [TextField, MaskedField, FormField, FormGroup, DateField, MonthYearField]
+related: [TextField, FormField, FormGroup]
 tokens: []
 stories: stories/TextareaField/TextareaField.stories.tsx
 version: "1.0"
@@ -115,6 +115,7 @@ version: "1.0"
 |---|---|
 | 2026-09-17 | Создан документ (TRI-96). AI-рефакторинг `TextareaField`: проброс `ref` на корневой `<div>` через `forwardRef`, `displayName`, unit-тесты вместо mock-заглушек |
 | 2026-09-17 | Ломающее изменение: `disabled` убран из `IFormFieldTextareaProps` (`Omit`), поэтому его больше нельзя передать в `textareaProps` — блокировка только через `status`. Правка по ревью PR #629, зафиксирована в release notes 1.47.0 |
+| 2026-09-29 | Аудит симметрии `related` (TRI-156): из `related` убраны несимметричные имена (`MaskedField`, `DateField`, `MonthYearField`). Пояснения к убранным именам сохранены прозой в «Связанные компоненты»; публичный API и поведение не затронуты. |
 
 ---
 

package/bundle/components/ThemeProvider.md

@@ -1,7 +1,7 @@
 ---
 component: ThemeProvider
 category: ThemeProvider
-related: [useToken]
+related: []
 tokens: []
 stories: stories/ThemeProvider/ThemeProvider.stories.tsx
 version: "1.0"
@@ -194,6 +194,7 @@ const App = () => {
 | 2026-08-05 | Создан документ. AI-рефакторинг: JSDoc на props и экспортах, ключ тега стилей вынесен в хелпер, упрощён эффект `ThemeProviderView`, добавлены unit-тесты `ThemeProviderView` и `useToken`, stories переведены на modern pattern |
 | 2026-08-05 | `related` сокращён до `useToken`. Удалён неактуальный комментарий про относительный импорт в `ThemeProviderView` |
 | 2026-08-31 | Добавлен раздел «Как переопределять токены»: путь `{Группа}.{Токен}`, плоская форма prop `tokens`, `value` / `ref` |
+| 2026-09-29 | Аудит симметрии `related` (TRI-156): из `related` убраны имена без строки в `docs/ai/ROADMAP.md` (`useToken`). Пояснения к убранным именам сохранены прозой в «Связанные компоненты»; публичный API и поведение не затронуты. |
 
 ---