@sberbusiness/triplex-next-mcp-server 1.44.0-beta → 1.45.0-beta

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (76) hide show
  1. package/README.md +7 -6
  2. package/bundle/components/AlertContext.md +11 -8
  3. package/bundle/components/AlertProcess.md +13 -10
  4. package/bundle/components/Badge.md +6 -3
  5. package/bundle/components/Button.md +46 -43
  6. package/bundle/components/ButtonDropdownExtended.md +3 -2
  7. package/bundle/components/ButtonIcon.md +7 -4
  8. package/bundle/components/Calendar.md +62 -59
  9. package/bundle/components/Caption.md +26 -23
  10. package/bundle/components/Checkbox.md +32 -29
  11. package/bundle/components/CheckboxTreeExtended.md +9 -5
  12. package/bundle/components/Chip.md +44 -41
  13. package/bundle/components/CodeText.md +26 -23
  14. package/bundle/components/Col.md +1 -2
  15. package/bundle/components/CollapsibleTree.md +8 -5
  16. package/bundle/components/Dropdown.md +33 -28
  17. package/bundle/components/EmptyView.md +12 -5
  18. package/bundle/components/FooterPage.md +6 -2
  19. package/bundle/components/FormField.md +44 -41
  20. package/bundle/components/FormGroup.md +192 -52
  21. package/bundle/components/Header.md +491 -211
  22. package/bundle/components/HeaderPage.md +6 -2
  23. package/bundle/components/ImageGallery.md +33 -34
  24. package/bundle/components/ImageGalleryExtended.md +33 -34
  25. package/bundle/components/Island.md +16 -13
  26. package/bundle/components/LightBox.md +14 -12
  27. package/bundle/components/Link.md +211 -96
  28. package/bundle/components/ListActionItem.md +7 -4
  29. package/bundle/components/ListItem.md +11 -8
  30. package/bundle/components/ListItemControlsButton.md +16 -13
  31. package/bundle/components/ListItemControlsButtonDropdown.md +9 -6
  32. package/bundle/components/ListItemSelectable.md +7 -4
  33. package/bundle/components/ListMasterFooter.md +8 -5
  34. package/bundle/components/ListMasterHeader.md +8 -5
  35. package/bundle/components/ListSortableItem.md +11 -8
  36. package/bundle/components/ListTableItem.md +7 -4
  37. package/bundle/components/LoaderMiddle.md +7 -4
  38. package/bundle/components/LoaderScreen.md +11 -8
  39. package/bundle/components/LoaderSmall.md +7 -4
  40. package/bundle/components/Marker.md +184 -69
  41. package/bundle/components/MarkerStatus.md +206 -88
  42. package/bundle/components/MaskedField.md +2 -4
  43. package/bundle/components/MasterTable.md +602 -0
  44. package/bundle/components/ModalWindow.md +7 -4
  45. package/bundle/components/MultiselectField.md +2183 -132
  46. package/bundle/components/Notification.md +12 -9
  47. package/bundle/components/Overlay.md +9 -4
  48. package/bundle/components/Page.md +2 -2
  49. package/bundle/components/Pagination.md +15 -8
  50. package/bundle/components/Row.md +1 -1
  51. package/bundle/components/SelectExtendedField.md +3 -3
  52. package/bundle/components/SelectField.md +466 -148
  53. package/bundle/components/SliderExtended.md +39 -36
  54. package/bundle/components/SmallInput.md +194 -51
  55. package/bundle/components/Suggest.md +535 -99
  56. package/bundle/components/SwipeableArea.md +428 -79
  57. package/bundle/components/TableBasic.md +19 -11
  58. package/bundle/components/TabsExtended.md +24 -21
  59. package/bundle/components/Tag.md +6 -2
  60. package/bundle/components/Text.md +28 -25
  61. package/bundle/components/TextField.md +3 -4
  62. package/bundle/components/ThemeProvider.md +50 -1
  63. package/bundle/components/Title.md +26 -23
  64. package/bundle/components/Tooltip.md +24 -21
  65. package/bundle/components/TopOverlay.md +7 -4
  66. package/bundle/guides/codestyle.md +3 -0
  67. package/bundle/guides/context.md +84 -12
  68. package/bundle/guides/guidelines.md +321 -0
  69. package/bundle/guides/template.md +22 -12
  70. package/bundle/manifest.json +31 -14
  71. package/bundle/release-notes/1.45.0.mdx +117 -0
  72. package/bundle/release-notes/1.46.0.mdx +7 -0
  73. package/bundle/tokens.json +6362 -0
  74. package/dist/index.js +177 -28
  75. package/dist/index.js.map +1 -1
  76. package/package.json +1 -1
@@ -0,0 +1,321 @@
1
+ # Guidelines кодогенерации на Triplex
2
+
3
+ Правила для ИИ-агентов, генерирующих React-код на дизайн-системе Triplex по
4
+ макетам. Документ отдаётся инструментом `get_guidelines` MCP-сервера
5
+ [`@sberbusiness/triplex-next-mcp-server`](https://github.com/SberBusiness/triplex-next-mcp-server)
6
+ и попадает туда через `mcp-data.json` (см. `scripts/generateMcpData.ts`).
7
+
8
+ Аудитория — потребители дизайн-системы (агенты и разработчики, пишущие код
9
+ *на* Triplex), а не контрибьюторы пакета: гайды для контрибьюторов живут в
10
+ `docs/ai/`.
11
+
12
+ Формат: каждое правило — секция со стабильным id `TPX-G-NN`. Id не
13
+ переиспользуются и не меняются; на них можно ссылаться в коде, ревью и
14
+ инструментах. Устаревшее правило помечается словом «отменено» с причиной,
15
+ но секция остаётся.
16
+
17
+ ---
18
+
19
+ ## TPX-G-01 — Тексты: только компоненты Typography
20
+
21
+ Для текстов из макета подбирается подходящий компонент Typography: `Title`
22
+ (H1 28px / H2 24px / H3 20px) или `Text` (B1 18px / B2 16px / B3 14px /
23
+ B4 12px); начертание `SEMIBOLD` — по шрифту в макете. Голые `span`/`div`
24
+ с текстом — дефект.
25
+
26
+ ## TPX-G-02 — Сетка: компоненты Row и Col
27
+
28
+ Горизонтальная раскладка контейнеров реализуется 12-колоночной сеткой
29
+ `Row`/`Col` (`size` из пропорций ширин), а не произвольными flex-обёртками.
30
+
31
+ ## TPX-G-03 — Скрытые слои не попадают в кодогенерацию
32
+
33
+ Узлы макета с `visible=false` и их поддеревья исключаются из дерева для
34
+ генерации кода.
35
+
36
+ ## TPX-G-04 — Иконки: только из @sberbusiness/icons-next
37
+
38
+ Имена иконок не угадываются — они подбираются через инструмент `list_icons`
39
+ MCP-сервера. Иконки импортируются ТОЛЬКО из пакета
40
+ `@sberbusiness/icons-next`, не из `@sberbusiness/triplex-next`.
41
+
42
+ ```tsx
43
+ import {CrossStrokeSrvIcon24, PlusStrokeSrvIcon16} from "@sberbusiness/icons-next";
44
+ // НЕВЕРНО: import {CrossStrokeSrvIcon24} from "@sberbusiness/triplex-next";
45
+ ```
46
+
47
+ ## TPX-G-05 — Хардкод цвета — дефект
48
+
49
+ Литералы цветов и значения, скопированные из стилей макета, в
50
+ сгенерированном коде недопустимы — цвета элементам дают сами компоненты
51
+ дизайн-системы и их темы.
52
+
53
+ Как устроены токены: они заводятся в TS-объекте пакета
54
+ (`src/components/DesignTokens/`), из него генерируются css-переменные,
55
+ которыми пользуются стили самой дизайн-системы — в исходниках less это
56
+ `color: var(--triplex-next-Link-Text_Color_Default)`, а при сборке
57
+ npm-пакета к имени дописывается версия
58
+ (`--triplex-next-Link-Text_Color_Default-1-44-0`).
59
+
60
+ Из-за версионного суффикса в сгенерированном коде приложения на эти
61
+ css-переменные не ссылаются — имя меняется каждый релиз (см.
62
+ `ThemeProvider-ai.md`). Вместо этого:
63
+
64
+ - значение токена в JS — хук `useToken` из `@sberbusiness/triplex-next`;
65
+ - переопределение оформления — prop `tokens` у `ThemeProvider` с путём
66
+ `Группа.Токен`; объект `tokens` выносить из рендера или мемоизировать,
67
+ иначе стили пересобираются на каждый рендер;
68
+ - список существующих токенов — `get_tokens` MCP-сервера.
69
+
70
+ ## TPX-G-06 — Перед использованием компонента — сверяться с документацией
71
+
72
+ Использовать компонент, для которого не смотрел документацию, ЗАПРЕЩЕНО:
73
+ перед КАЖДЫМ компонентом вызови `get_component` MCP-сервера и возьми оттуда
74
+ обязательные props и инварианты структуры — они не выводятся из имён.
75
+ Сгенерированный код обязан компилироваться: обязательные props без значения
76
+ заполняй заглушками из документации.
77
+
78
+ ## TPX-G-07 — Каркас содержимого страницы — Page
79
+
80
+ Внутри `LightBox.Content` (и вообще как каркас страницы) используется
81
+ `Page`, а в нём — только `Page.Header`, `Page.Body` и `Page.Footer`
82
+ (типы `FIRST`/`SECOND` задают наличие обёртки-Island).
83
+
84
+ ## TPX-G-08 — Обязательная обвязка приложения на Triplex
85
+
86
+ Приложение на Triplex подключает три обязательных куска; без любого из них
87
+ рендер тихо деградирует:
88
+
89
+ 1. стили дизайн-системы `@sberbusiness/triplex-next/styles/triplex-next.css`;
90
+ 2. стили иконок `@sberbusiness/icons-next/styles/icons.css` (fill-цвета и
91
+ состояния hoverable/active/disabled);
92
+ 3. `@font-face` для шрифтов SBSans* из
93
+ `@sberbusiness/triplex-next/assets/fonts` — пакет поставляет woff2,
94
+ но face объявляет потребитель (с `font-weight`/`font-style` по
95
+ инструкции).
96
+
97
+ Контент оборачивается в `ThemeProvider` со `scopeRef` на элемент-контейнер.
98
+ Базовый шрифт приложения задаётся явно:
99
+ `body { font-family: SBSansText, Arial, sans-serif; }` — текст вне
100
+ компонентов Typography не должен падать на системный шрифт.
101
+
102
+ Официальная инструкция подключения:
103
+ https://triplex-design.ru/storybook/main/?path=/docs/introduction--docs
104
+ (там же соответствие версий: 0.x — React 17, 1.x — React 18).
105
+
106
+ ```tsx
107
+ import {Button, Island, Page} from "@sberbusiness/triplex-next"; // компоненты и enum'ы — отсюда
108
+ import {CrossStrokeSrvIcon24} from "@sberbusiness/icons-next"; // иконки — только отсюда
109
+ import "@sberbusiness/triplex-next/styles/triplex-next.css";
110
+ import "@sberbusiness/icons-next/styles/icons.css";
111
+ ```
112
+
113
+ ## TPX-G-09 — Вертикальные внешние отступы — компонент Gap
114
+
115
+ Вертикальные отступы между блоками (айлендами, панелями, секциями) задаются
116
+ компонентом `Gap` с размером из шкалы, а не `margin` или пустыми
117
+ контейнерами.
118
+
119
+ ## TPX-G-10 — Конвенция имён слоёв макета
120
+
121
+ Имена слоёв несут семантику для чтения макета: префикс `_` — служебный
122
+ слой, игнорируется вместе с поддеревом (мишени прототипных переходов,
123
+ черновики); префикс `#` — слот шаблона (контейнер контента); префикс `@` —
124
+ иконка, подменяется иконкой из `@sberbusiness/icons-next`; суффиксы
125
+ `_text`/`_label`/`_placeholder` указывают, какому текстовому prop
126
+ компонента принадлежит текст ноды. Остальные имена — осмысленные; мусорные
127
+ имена (`Frame 427`, `Rectangle 12`) деградируют именной фолбэк маппинга.
128
+
129
+ ## TPX-G-11 — TableBasic: ячейка рендерится только при наличии fieldKey в rowData
130
+
131
+ Каждая колонка `TableBasic` обязана иметь соответствующий ключ в `rowData`
132
+ КАЖДОЙ строки — ячейку без ключа компонент молча пропускает. Колонкам, чей
133
+ контент даёт `renderCell` (кнопки, статусы, чекбоксы), в `rowData` кладётся
134
+ значение-заглушка. Таким колонкам также обязателен
135
+ `cellType: ECellType.COMPONENTS` (чекбоксам — `CHECKBOX`): при дефолтном
136
+ `TEXT` контент оборачивается в `Text B3`, ломая отступы и семантику.
137
+
138
+ ```tsx
139
+ // колонка: {fieldKey: "sign", cellType: ECellType.COMPONENTS, renderCell: () => <Button …>Подписать</Button>}
140
+ // строка: rowData: {…, sign: true} // без ключа sign ячейка не отрендерится
141
+ ```
142
+
143
+ ## TPX-G-12 — отменено
144
+
145
+ Id зарезервирован и отменён до публикации (конвенция оформления импортов —
146
+ стиль потребителя, на кодогенерацию из макета не влияет). Id не
147
+ переиспользуется.
148
+
149
+ ## TPX-G-13 — Вес Typography — из суффикса текст-стиля макета
150
+
151
+ Суффикс имени текст-стиля макета задаёт начертание. Для `Title`
152
+ (`EFontWeightTitle`: REGULAR / MEDIUM / SEMIBOLD / BOLD, дефолт —
153
+ semibold): `-M` (`Header/H3-M`) → `weight={EFontWeightTitle.MEDIUM}` —
154
+ без явного `weight` текст будет жирнее макета; `-S` (`Header/H1-S`) →
155
+ semibold, `weight` не пишется (дефолт). Для `Text` (`EFontWeightText`)
156
+ доступны только REGULAR (дефолт) и SEMIBOLD — веса MEDIUM у `Text` нет:
157
+ стили с суффиксом полужирного начертания (`-S`/`-Sb`) →
158
+ `weight={EFontWeightText.SEMIBOLD}`, прочие — дефолт REGULAR, `weight`
159
+ не пишется. Проверять текст-стиль узла макета, а не полагаться на
160
+ визуальную оценку.
161
+
162
+ ```tsx
163
+ <Title size={ETitleSize.H3} weight={EFontWeightTitle.MEDIUM}>…</Title> // стиль макета Header/H3-M
164
+ <Title tag="h1" size={ETitleSize.H1}>…</Title> // стиль Header/H1-S: semibold — дефолт
165
+ <Text size={ETextSize.B3} weight={EFontWeightText.SEMIBOLD}>…</Text> // полужирный Body-стиль
166
+ <Text size={ETextSize.B3}>…</Text> // обычный Body-стиль: REGULAR — дефолт
167
+ ```
168
+
169
+ ## TPX-G-14 — HelpBox и тултипы — без preferPlace
170
+
171
+ У `HelpBox` (и тултипов) `preferPlace`, как правило, не указывается — логики
172
+ компонента хватает, чтобы позиционировать тултип правильно; явный prop
173
+ ничего не ломает, но избыточен. Вариант `Position=Top/Left/…` из макета в
174
+ prop не переносится.
175
+
176
+ ```tsx
177
+ <HelpBox tooltipSize={ETooltipSize.SM}>Текст подсказки</HelpBox>
178
+ // НЕВЕРНО: <HelpBox tooltipSize={ETooltipSize.SM} preferPlace={ETooltipPreferPlace.ABOVE}>…</HelpBox>
179
+ ```
180
+
181
+ ## TPX-G-15 — Инлайн-стили в коде на компонентах ДС запрещены
182
+
183
+ В коде приложений на компонентах Triplex НИКОГДА не писать `style={{…}}`
184
+ для раскладки, отступов и выравнивания — их дают сами компоненты (`Gap`,
185
+ `Row`/`Col`, штатные подкомпоненты). Если базовый компонент не умеет
186
+ раскладку, которую рисует макет (пример: право-выровненный футер есть у
187
+ `IslandWidget`/`IslandAccordion`, у базового `Island` — нет), это ошибка
188
+ макета: контент кладётся в компонент как есть, расхождение фиксируется
189
+ диагностикой. Исключение — фреймы без компонентов ДС (absolute-витрины),
190
+ где штатной раскладки не существует.
191
+
192
+ ```tsx
193
+ // НЕВЕРНО: <Island.Footer style={{display: "flex", justifyContent: "flex-end", gap: 16}}>
194
+ <Island.Footer><Button …>Отмена</Button><Button …>Сохранить</Button></Island.Footer>
195
+ ```
196
+
197
+ ## TPX-G-16 — Описание и постфикс полевых компонентов — через targetProps
198
+
199
+ У полевых компонентов, чей `targetProps` наследует TextFieldBase
200
+ (`DateField` через MaskedField и т.п.), описание под полем и постфикс
201
+ (в т.ч. `HelpBox`) передаются через `targetProps.description` /
202
+ `targetProps.postfix` — постфикс НЕ перетирает встроенные иконки (календарь
203
+ `DateField`). У `SelectField` prop `description` отсутствует — там описание
204
+ строится паттерном `FormGroup` + `SelectField` + `FormFieldDescription`.
205
+ Перед выбором паттерна сверяться с примером `get_component`.
206
+
207
+ ```tsx
208
+ <DateField … targetProps={{postfix: <HelpBox tooltipSize={ETooltipSize.SM} />, description: <Text …>…</Text>}} />
209
+ <FormGroup><SelectField … /><FormFieldDescription>…</FormFieldDescription></FormGroup>
210
+ ```
211
+
212
+ ## TPX-G-17 — Композиция MasterTable: ChipPanel и порядок панелей
213
+
214
+ Чипы-фильтры таблицы кладутся в `MasterTable.ChipPanel` (`ChipGroup`
215
+ size SM `oneLine`), правая часть строки чипов — `MasterTable.ChipPanel.Links`
216
+ (туда же — `TableBasicSettings` со ссылкой настроек), а не в `FilterPanel`.
217
+ Порядок панелей: `ChipPanel` → `TableBasic` → `TableFooter` (появляется при
218
+ выборе строк) → `PaginationPanel`. Варианты чипов макета: `Chip/DatePicker` →
219
+ `ChipDatePicker`, `Chip/Select` → `ChipSelect`, `Chip/Multiselect` →
220
+ `ChipMultiselect`, `Chip/Suggest` → `ChipSuggest`; `Chip/MonthYearPicker`
221
+ аналога не имеет → `ChipSelect`.
222
+
223
+ ## TPX-G-18 — Кнопка-иконка: Button с icon vs ButtonIcon
224
+
225
+ Варианты кнопок макета `Type=Icon*` (`IconSecondary`, `IconSecondaryLight`,
226
+ …) — это `Button` с prop `icon` и соответствующей темой, БЕЗ children (плюс
227
+ `aria-label`). `ButtonIcon` — только для «голой» иконки-кнопки без подложки;
228
+ это нативный `<button>` без видимого текста, поэтому `aria-label` для него
229
+ обязателен так же, как для icon-`Button`.
230
+ В ячейках таблиц и шапках страниц кнопки с серой/светлой подложкой —
231
+ `Button` с `icon`. Размер иконки — из макета (MD-кнопка → 20, LG → 24).
232
+
233
+ ```tsx
234
+ <Button icon={<DefaulticonStrokePrdIcon20 paletteIndex={0} />} theme={EButtonTheme.SECONDARY} size={EComponentSize.MD} aria-label="Действие" />
235
+ ```
236
+
237
+ ## TPX-G-19 — columns TableBasic — стабильная ссылка
238
+
239
+ Массив `columns` для `TableBasic` должен быть стабильным по ссылке между
240
+ рендерами (`useMemo`/константа модуля): `TableBasic` пишет columns в
241
+ `MasterTableContext` через `useEffect` с проверкой `isEqual`, а `isEqual`
242
+ сравнивает функции (`renderCell`) по ссылке — пересоздаваемый каждый рендер
243
+ массив крутит бесконечную петлю записи в контекст. Симптомы: лишние
244
+ ре-рендеры, нестабильный список в `ColumnSettings`.
245
+
246
+ ```tsx
247
+ const columns = useMemo<ITableBasicColumn[]>(() => [...], [/* state, от которого зависят renderCell */]);
248
+ ```
249
+
250
+ ## TPX-G-20 — ColumnSettings.SortableList не строит пункты сам
251
+
252
+ У `ColumnSettings.SortableList` props `columns`/`onColumnsChange` — только
253
+ dnd-обвязка (порядок при перетаскивании); пункты списка рендерит потребитель
254
+ детьми: `ColumnSettings.SortableList.Item` с `id={fieldKey}` и контентом
255
+ (обычно `Checkbox` видимости колонки + label). Без детей меню настроек
256
+ открывается пустым.
257
+
258
+ ```tsx
259
+ <ColumnSettings.SortableList columns={cols} onColumnsChange={setCols}>
260
+ {cols.map((c) => (
261
+ <ColumnSettings.SortableList.Item key={c.fieldKey} id={c.fieldKey}>
262
+ <Checkbox checked={!c.hidden} onChange={…}>{c.label}</Checkbox>
263
+ </ColumnSettings.SortableList.Item>
264
+ ))}
265
+ </ColumnSettings.SortableList>
266
+ ```
267
+
268
+ ## TPX-G-21 — Компонент не найден в get_component: искать в типах пакета
269
+
270
+ Ответ `get_component` «Компонент не найден» не означает, что компонента нет
271
+ в пакете: документация MCP отстаёт от `@sberbusiness/triplex-next`, а
272
+ составные компоненты описаны под именем родителя — `MasterTable`,
273
+ `TableFooter`, `PaginationPanel` в `Table`/`TableBasic`; `ChipSelect`,
274
+ `ChipDatePicker`, `ChipMultiselect`, `ChipSuggest` в `Chip`/`ChipGroup`;
275
+ `FormFieldDescription` в `FormField`.
276
+
277
+ Порядок действий:
278
+
279
+ 1. вызвать `get_component` для родителя из `list_components` и искать
280
+ под-компонент в его примерах;
281
+ 2. если не нашёл — взять API из типов установленного пакета:
282
+ `node_modules/@sberbusiness/triplex-next/index.d.ts` и
283
+ `components/<Родитель>/*.d.ts` (имена экспортов, обязательные props,
284
+ `enum`'ы);
285
+ 3. компилировать `tsc` как обычно.
286
+
287
+ Придумывать имя компонента или props по памяти ЗАПРЕЩЕНО, как и заменять
288
+ недокументированный компонент html-тегом «раз документации нет».
289
+
290
+ ```tsx
291
+ // get_component('MasterTable') → «не найден» → get_component('Table') → пример MasterTable.TableBasic
292
+ // get_component('ChipSelect') → «не найден» → index.d.ts → components/Chip/ChipSelect.d.ts → props
293
+ ```
294
+
295
+ ## TPX-G-22 — Растры макета: ссылка по имени файла, байты передаются отдельно
296
+
297
+ Инструменты чтения макета байты изображений, как правило, не отдают: у
298
+ растровой заливки есть только hash содержимого, имя файла вида
299
+ `images/<hash>.png` и режим масштабирования (`FILL`/`FIT`). Правила для
300
+ кода:
301
+
302
+ 1. растр вставляется как `<img src="/assets/<hash>.<ext>">` (или в prop
303
+ компонента, принимающего `src`) с `alt` из имени слоя;
304
+ 2. режим масштабирования переносится в `object-fit`: `FILL` → `cover`,
305
+ `FIT` → `contain` — prop'ом или классом, не инлайн-стилем (TPX-G-15);
306
+ 3. файл с тем же именем кладётся в ассеты приложения отдельным шагом
307
+ передачи — экспортом из дизайн-инструмента или от дизайнера;
308
+ 4. выдумывать URL, встраивать base64 или подменять картинку заглушкой из
309
+ интернета ЗАПРЕЩЕНО;
310
+ 5. картинки-контент (фото в галерее, аватары, превью документов) — это
311
+ данные, а не UI: в компонент они передаются через props/items с теми же
312
+ `src`, а сам массив помечается как демо-данные.
313
+
314
+ Отсутствующий на диске файл — не ошибка генерации, а пункт передачи
315
+ ассетов: код ссылается на него по имени и остаётся рабочим, когда файл
316
+ положат.
317
+
318
+ ```tsx
319
+ <img src="/assets/ca92f04f46fa1c8c91a3d1406bc68b9ceffa7f86.png" alt="raster-fill" />
320
+ // демо-данные: [{src: "/assets/<hash>.png", alt: "…"}, …] — имя файла из макета, не выдуманное
321
+ ```
@@ -17,7 +17,10 @@ version: "1.0"
17
17
  Описывай намерения и ограничения, которые не видны из кода.
18
18
 
19
19
  Frontmatter:
20
- - tokens: список CSS-переменных, которые компонент использует
20
+ - tokens: пути дизайн-токенов, которые использует компонент, в формате
21
+ `{Группа}.{Токен}` (например `Button.General_Background_Default`).
22
+ Не css-переменные: они внутренние и версионируются на сборке.
23
+ Нормализуется и проверяется скриптом `npm run syncAiMdTokens`.
21
24
  - related: индекс переходов для агента. Полное правило: docs/ai/CONTEXT.md → «Как заполнять related в AI.md».
22
25
 
23
26
  Таблица Stories: колонка `Example file` обязательна — её читает сборщик
@@ -64,19 +67,26 @@ mcp-data.json, чтобы инлайнить код примера. См. раз
64
67
 
65
68
  ## Дизайн-токены
66
69
 
67
- <!-- Только те CSS-переменные, которые непосредственно используются в стилях компонента. -->
70
+ <!--
71
+ Только те токены, которые используются в стилях компонента. Путь токена —
72
+ `{Группа}.{Токен}`: ровно в этом виде он передаётся в ThemeProvider.
73
+ CSS-переменные `--triplex-next-*` здесь не пишем — это внутренний слой,
74
+ на сборке к ним дописывается версия пакета. См. docs/ai/CONTEXT.md → «Дизайн-токены».
75
+ -->
68
76
 
77
+ Переопределяются через `ThemeProvider` (prop `tokens`) — см. `ThemeProvider-ai.md` →
78
+ «Как переопределять токены». Значения по умолчанию — `src/components/DesignTokens/components/ComponentName.ts`.
79
+
80
+ ```text
81
+ ComponentName.Variant_Background_Default
82
+ ComponentName.Variant_Color_Hover
83
+ ComponentName.Variant_Shadow_Focus
69
84
  ```
70
- --triplex-next-ComponentName-Variant_Background_Default
71
- --triplex-next-ComponentName-Variant_Color_Default
72
- --triplex-next-ComponentName-Variant_Background_Hover
73
- --triplex-next-ComponentName-Variant_Color_Hover
74
- --triplex-next-ComponentName-Variant_Background_Active
75
- --triplex-next-ComponentName-Variant_Color_Active
76
- --triplex-next-ComponentName-Variant_Shadow_Focus
77
- --triplex-next-ComponentName-Variant_Background_Disabled
78
- --triplex-next-ComponentName-Variant_Color_Disabled
79
- ```
85
+
86
+ <!--
87
+ Пример кода с ThemeProvider здесь не дублируем — он живёт в ThemeProvider-ai.md,
88
+ иначе те же строки расползаются по всем AI.md и устаревают.
89
+ -->
80
90
 
81
91
  ---
82
92
 
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "schemaVersion": 1,
3
- "triplexVersion": "1.44.0",
4
- "generatedAt": "2026-08-28T11:32:35.105Z",
3
+ "triplexVersion": "1.45.0",
4
+ "generatedAt": "2026-09-04T13:44:34.562Z",
5
5
  "components": [
6
6
  {
7
7
  "name": "AbstractTree",
@@ -289,7 +289,7 @@
289
289
  },
290
290
  {
291
291
  "name": "FormGroup",
292
- "path": "src/components/FormGroup/FormGroup-AI.md",
292
+ "path": "src/components/FormGroup/FormGroup-ai.md",
293
293
  "file": "components/FormGroup.md",
294
294
  "ai_ready": true
295
295
  },
@@ -301,7 +301,7 @@
301
301
  },
302
302
  {
303
303
  "name": "Header",
304
- "path": "src/components/Header/Header-AI.md",
304
+ "path": "src/components/Header/Header-ai.md",
305
305
  "file": "components/Header.md",
306
306
  "ai_ready": true
307
307
  },
@@ -367,7 +367,7 @@
367
367
  },
368
368
  {
369
369
  "name": "Link",
370
- "path": "src/components/Link/Link-AI.md",
370
+ "path": "src/components/Link/Link-ai.md",
371
371
  "file": "components/Link.md",
372
372
  "ai_ready": true
373
373
  },
@@ -469,22 +469,28 @@
469
469
  },
470
470
  {
471
471
  "name": "Marker",
472
- "path": "src/components/Marker/Marker-AI.md",
472
+ "path": "src/components/Marker/Marker-ai.md",
473
473
  "file": "components/Marker.md",
474
474
  "ai_ready": true
475
475
  },
476
476
  {
477
477
  "name": "MarkerStatus",
478
- "path": "src/components/MarkerStatus/MarkerStatus-AI.md",
478
+ "path": "src/components/MarkerStatus/MarkerStatus-ai.md",
479
479
  "file": "components/MarkerStatus.md",
480
480
  "ai_ready": true
481
481
  },
482
482
  {
483
483
  "name": "MaskedField",
484
- "path": "src/components/TextField/MaskedField-ai.md",
484
+ "path": "src/components/MaskedField/MaskedField-ai.md",
485
485
  "file": "components/MaskedField.md",
486
486
  "ai_ready": true
487
487
  },
488
+ {
489
+ "name": "MasterTable",
490
+ "path": "src/components/Table/MasterTable-ai.md",
491
+ "file": "components/MasterTable.md",
492
+ "ai_ready": true
493
+ },
488
494
  {
489
495
  "name": "MediaWidth",
490
496
  "path": "src/components/MediaWidth/MediaWidth-ai.md",
@@ -518,7 +524,7 @@
518
524
  },
519
525
  {
520
526
  "name": "MultiselectField",
521
- "path": "src/components/MultiselectField/MultiselectField-AI.md",
527
+ "path": "src/components/MultiselectField/MultiselectField-ai.md",
522
528
  "file": "components/MultiselectField.md",
523
529
  "ai_ready": true
524
530
  },
@@ -590,7 +596,7 @@
590
596
  },
591
597
  {
592
598
  "name": "SelectField",
593
- "path": "src/components/SelectField/SelectField-AI.md",
599
+ "path": "src/components/SelectField/SelectField-ai.md",
594
600
  "file": "components/SelectField.md",
595
601
  "ai_ready": true
596
602
  },
@@ -620,7 +626,7 @@
620
626
  },
621
627
  {
622
628
  "name": "SmallInput",
623
- "path": "src/components/SmallInput/SmallInput-AI.md",
629
+ "path": "src/components/SmallInput/SmallInput-ai.md",
624
630
  "file": "components/SmallInput.md",
625
631
  "ai_ready": true
626
632
  },
@@ -656,7 +662,7 @@
656
662
  },
657
663
  {
658
664
  "name": "Suggest",
659
- "path": "src/components/Suggest/Suggest-AI.md",
665
+ "path": "src/components/Suggest/Suggest-ai.md",
660
666
  "file": "components/Suggest.md",
661
667
  "ai_ready": true
662
668
  },
@@ -668,7 +674,7 @@
668
674
  },
669
675
  {
670
676
  "name": "SwipeableArea",
671
- "path": "src/components/SwipeableArea/SwipeableArea-AI.md",
677
+ "path": "src/components/SwipeableArea/SwipeableArea-ai.md",
672
678
  "file": "components/SwipeableArea.md",
673
679
  "ai_ready": true
674
680
  },
@@ -855,6 +861,11 @@
855
861
  "topic": "template",
856
862
  "file": "guides/template.md",
857
863
  "path": "docs/ai/template-ai.md"
864
+ },
865
+ {
866
+ "topic": "guidelines",
867
+ "file": "guides/guidelines.md",
868
+ "path": "docs/mcp/guidelines.md"
858
869
  }
859
870
  ],
860
871
  "releaseNotes": [
@@ -1078,6 +1089,11 @@
1078
1089
  "file": "release-notes/1.45.0.mdx",
1079
1090
  "path": "stories/release-notes/v1/1.45.0.mdx"
1080
1091
  },
1092
+ {
1093
+ "version": "1.46.0",
1094
+ "file": "release-notes/1.46.0.mdx",
1095
+ "path": "stories/release-notes/v1/1.46.0.mdx"
1096
+ },
1081
1097
  {
1082
1098
  "version": "1.5.0",
1083
1099
  "file": "release-notes/1.5.0.mdx",
@@ -1108,5 +1124,6 @@
1108
1124
  "file": "release-notes/1.9.0.mdx",
1109
1125
  "path": "stories/release-notes/v1/1.9.0.mdx"
1110
1126
  }
1111
- ]
1127
+ ],
1128
+ "tokens": "tokens.json"
1112
1129
  }
@@ -4,4 +4,121 @@ import { Meta, Title, Heading } from "@storybook/addon-docs/blocks";
4
4
 
5
5
  <Title>v1.45.0</Title>
6
6
 
7
+ <Heading>Ломающие изменения</Heading>
8
+
9
+ **AmountField**
10
+
11
+ - Свойство `currency` теперь находится не в `postfix`, а рядом с суммой. На пустом значении валюта не отображается — при необходимости укажите её в `inputProps.placeholder`.
12
+ - Внешний `ref` компонента теперь прокидывается на родительский контейнер, а не на внутренний инпут. Для работы с инпутом используйте `inputProps.ref`.
13
+ - Тип `ref` компонента изменён с `HTMLInputElement` на `HTMLDivElement`.
14
+
15
+ **Carousel**
16
+
17
+ - Исправлена ошибка, из-за которой компонент не попадал в сборку.
18
+
19
+ **FormFieldInput / FormFieldMaskedInput**
20
+
21
+ - Удалено свойство `disabled`, используйте `status` со значением `EFormFieldStatus.DISABLED`.
22
+ - В интерфейсе `IFormFieldInputProvideProps` изменён тип `size` на нативный.
23
+
24
+ **MarkerStatus**
25
+
26
+ - Атрибут `data-tx` теперь выставляется после пользовательских props, поэтому переданное через props значение `data-tx` больше не применяется — на корневом элементе всегда версия пакета.
27
+
28
+ **SMSField**
29
+
30
+ - Удалены свойства `error` и `disabled`. Состояние задаётся свойством `status`.
31
+
7
32
  <Heading>Изменения</Heading>
33
+
34
+ **AmountField**
35
+
36
+ - Добавлено свойство `ref` в `inputProps`.
37
+
38
+ **ButtonDropdownExtended**
39
+
40
+ - Добавлено: `ButtonDropdownExtended` пробрасывает `ref` на свой корневой `<div>` — раньше компонент был объявлен как `React.FC`. Базовый тип `IButtonDropdownExtendedComponent` изменился с `React.FC` на `React.ForwardRefExoticComponent`; набор props, статики и разметка прежние.
41
+
42
+ **EmptyView**
43
+
44
+ - Изменены размер и начертание шрифта `Title` в размере `MD`.
45
+
46
+ **FormGroup**
47
+
48
+ - Проведён AI-рефакторинг: изменений для потребителя нет.
49
+
50
+ **Header**
51
+
52
+ - Проведён AI-рефакторинг: изменений для потребителя нет.
53
+
54
+ **ImageGallery**
55
+
56
+ - Удалены неиспользуемые токены `ImageGallery.Arrow_Background_Disabled` и `ImageGallery.Arrow_BorderColor_Disabled` вместе с их css-переменными. Токены остались от прежнего дизайна: сейчас неактивная стрелка галереи не приглушается, а скрывается (`display: none`), поэтому красить ими было нечего и их переопределение ни на что не влияло. Если вы переопределяли их через `ThemeProvider`, удалите эти ключи — визуально ничего не изменится.
57
+
58
+ **IslandWidget**
59
+
60
+ - Изменена высота `IslandWidget.Header` на десктоп экранах.
61
+ - Изменен размер текста `IslandWidget.Header.Description` в размерах `MD` и `LG` в адаптиве.
62
+
63
+ **Link**
64
+
65
+ - Проведён AI-рефакторинг: изменений для потребителя нет.
66
+
67
+ **Marker**
68
+
69
+ - Добавлено: `Marker` пробрасывает `ref` на свой корневой `<span>` — раньше компонент был объявлен как `React.FC`. Тип компонента изменился с `React.FC` на `React.ForwardRefExoticComponent`; набор props и разметка прежние.
70
+ - Проведён AI-рефакторинг.
71
+
72
+ **MarkerStatus**
73
+
74
+ - Проведён AI-рефакторинг, добавлен `displayName`.
75
+
76
+ **MaskedField**
77
+
78
+ - Исправлен цвет `placeholderMask` в состоянии `disabled`.
79
+
80
+ **MasterTable**
81
+
82
+ - Добавлено: `MasterTable` пробрасывает `ref` на свой корневой `<div>` — раньше компонент был объявлен как `React.FC`.
83
+ - Добавлено: `ref` пробрасывают и обёртки семейства — `MasterTable.FilterPanel`, `MasterTable.ChipPanel` (и `.Links`), `MasterTable.NoColumns`, `MasterTable.PaginationPanel`, `MasterTable.TableFooter`, `MasterTable.TableBasicSettings`. Раньше все они были объявлены как `React.FC`.
84
+ - Проведён AI-рефакторинг.
85
+
86
+ **MultiselectField**
87
+
88
+ - Проведён AI-рефакторинг: изменений для потребителя нет.
89
+
90
+ **Pagination**
91
+
92
+ - Исправлен баг, когда компонент `PaginationSelect` не передавал в `SelectField` `data`-атрибуты, `id`, `aria`-атрибуты и остальные свойства `SelectField` (`targetProps`, `dropdownProps`, `mobileTitle` и другие).
93
+
94
+ **SelectField**
95
+
96
+ - `SelectField` больше не оборачивает переданный `ref` в новую функцию на каждый рендер, поэтому стабильный callback-`ref` перестал переприкрепляться. Элемент, на который указывает `ref`, прежний.
97
+ - Проведён AI-рефакторинг: других изменений для потребителя нет.
98
+
99
+ **SmallInput**
100
+
101
+ - Проведён AI-рефакторинг: изменений для потребителя нет.
102
+
103
+ **Suggest**
104
+
105
+ - Проведён AI-рефакторинг: изменений для потребителя нет.
106
+
107
+ **SMSField**
108
+
109
+ - Добавлено свойство `status`.
110
+ - У компонента `SMSField.Input` добавлено свойство `errorText`: в статусе `ERROR` текст ошибки отображается внутри поля, пока поле не в фокусе. В фокусе отображается `placeholder`.
111
+ - Исправлены цвета фона поля и иконки `SMSFieldRefresh` в состояниях `error` и `disabled`.
112
+
113
+ **SwipeableArea**
114
+
115
+ - Исправлен баг: боковая область нулевой ширины давала невалидный `opacity` (`NaN`) — теперь в этом случае используется значение `1`, как у закрытой области. Визуально ничего не меняется: область нулевой ширины не видна.
116
+ - Проведён AI-рефакторинг: других изменений для потребителя нет.
117
+
118
+ **TextField**
119
+
120
+ - Тип свойства `ref` в `inputProps` расширен с `React.RefObject` до `React.Ref`.
121
+
122
+ **MCP (mcp-data.json)**
123
+
124
+ - В секцию `guides` добавлен топик `guidelines` (`docs/mcp/guidelines.md`) — правила кодогенерации на Triplex для ИИ-агентов; будет отдаваться инструментом `get_guidelines` MCP-сервера.
@@ -0,0 +1,7 @@
1
+ import { Meta, Title, Heading } from "@storybook/addon-docs/blocks";
2
+
3
+ <Meta title="release-notes/v1/1.46.0" />
4
+
5
+ <Title>v1.46.0</Title>
6
+
7
+ <Heading>Изменения</Heading>