();\n const [name, setName] = useState('');\n\n const submitHandler = () => {\n const id = String(items.length + 1);\n setItems(prev => [...prev, { id, content: { label: name.trim() || `Окружение ${id}` } }]);\n setName('');\n return Promise.resolve(id);\n };\n\n return (\n \n ,\n }}\n submitHandler={submitHandler}\n />\n
\n );\n}\n```\n\n#### Асинхронная загрузка\n\nСостояние ошибки с кнопкой «Обновить» (onRefetch).\n\n```tsx\nimport { ItemId } from '@cloud-ru/ds-list';\nimport { FieldSelectCreate } from '@cloud-ru/ds-uikit-product-fields-predefined';\nimport { useState } from 'react';\n\nexport function FieldSelectCreateAsync() {\n const [value, setValue] = useState();\n const [loading, setLoading] = useState(false);\n const [dataError, setDataError] = useState(true);\n\n const load = () => {\n setDataError(false);\n setLoading(true);\n setTimeout(() => setLoading(false), 800);\n };\n\n return (\n \n Promise.resolve('1')}\n />\n
\n );\n}\n```\n\n#### Форма в модальном окне\n\ncreateLayoutType=modal — форма создания открывается в модальном окне.\n\n```tsx\nimport { FieldText } from '@cloud-ru/ds-fields';\nimport { ItemId } from '@cloud-ru/ds-list';\nimport { CREATE_LAYOUT_TYPE, FieldSelectCreate } from '@cloud-ru/ds-uikit-product-fields-predefined';\nimport { useState } from 'react';\n\nexport function FieldSelectCreateModal() {\n const [items, setItems] = useState([\n { id: '1', content: { label: 'Production' } },\n { id: '2', content: { label: 'Staging' } },\n ]);\n const [value, setValue] = useState();\n const [name, setName] = useState('');\n\n const submitHandler = () => {\n const id = String(items.length + 1);\n setItems(prev => [...prev, { id, content: { label: name.trim() || `Окружение ${id}` } }]);\n setName('');\n return Promise.resolve(id);\n };\n\n return (\n \n ,\n }}\n submitHandler={submitHandler}\n />\n
\n );\n}\n```\n\n### Props\n\n**FieldSelectCreateProps**\n\n| Prop | Type | Default | Description |\n|------|------|---------|-------------|\n| `afterClose` | `(() => void)` | — | Колбэк после закрытия модалки/дровера создания. |\n| `className` | `string` | — | CSS-класс корневой обёртки. |\n| `createLayoutProps` | `ManagedLayoutKeys` \\| `ModalProps` | — | Пропсы модалки создания (`content` — форма создания опции).
Пропсы дровера создания (`content` — форма создания опции); `position` по умолчанию `right`. |\n| `createLayoutType` | `\"drawer\"` \\| `\"modal\"` | `drawer` | По клику на «Создать» открывается модальное окно.
По клику на «Создать» открывается дровер (по умолчанию). |\n| `data-test-id` | `string` | — | |\n| `entityIcon` | `EntityIcon` | — | Иконка пустого состояния `noData` (по умолчанию — иконка поиска). |\n| `entityName` | `EntityName` | — | Название сущности в единственном и множественном числе — для кнопок и пустых состояний. |\n| `onRefetch` | `(() => void)` | — | Повтор загрузки в состоянии ошибки (кнопка «Обновить» в футере `errorDataState`). |\n| `permission` | `\"canCreate\"` \\| `\"canRead\"` \\| `\"none\"` | `canCreate` | Права пользователя:
- `canCreate` (по умолчанию) — доступны и выбор, и создание;
- `canRead` — поле активно, но создание недоступно (кнопки «Создать» с tooltip);
- `none` — поле недоступно (с tooltip). |\n| `selectProps` | `DroplistListProps` \\| `DroplistMobileSlots` \\| `EmptyState` \\| `FieldSelectDecoratorProps` \\| `PublicListContextType` \\| `ScrollProps` \\| `SelectFieldProps` \\| `SelectionState` | — | Пропсы, прокидываемые в `FieldSelect` (`@cloud-ru/ds-fields`). |\n| `submitHandler` | `() => Promise` | — | Действие создания опции: возвращает `value` новой опции, которая выбирается в поле (single-режим). |\n\n##### Related types\n\n- `EntityIcon` = `((props: { size?: number; className?: string; }, deprecatedLegacyContext?: any) => ReactNode) | (new (props: { size?: number; className?: string; }, deprecatedLegacyContext?: any) => Component)`\n\n**EntityName**\n\n| Prop | Type | Default | Description |\n|------|------|---------|-------------|\n| `plural` | `string` | — | Множественное число — для текстов пустых состояний и ошибки. |\n| `single` | `string` | — | Единственное число (винительный падеж) — для кнопки «Создать ». |\n\n- `ManagedLayoutKeys` = `\"approveButton\"` \\| `\"cancelButton\"` \\| `\"onClose\"` \\| `\"open\"`\n\n- `Permission` = `\"canCreate\"` \\| `\"canRead\"` \\| `\"none\"`\n\n- `SelectFieldProps` = `(Omit & { selection?: \"single\"; }) | (Omit & { selection: \"multiple\"; })`\n\n### Адаптивность\n\nДроплист — адаптивный `Droplist` из `@cloud-ru/ds-list`: на desktop анкорный popover, на mobile — список в `BottomSheet`. Раскладку даёт `AdaptiveProvider` (`@cloud-ru/ds-adaptive`); отдельного пропа `layoutType` нет.\n\n`size` на всех раскладках — база `m`. Автофокус поля выключается на mobile (наследуется из `FieldSelect` / `@cloud-ru/ds-fields`); вернуть — через `selectProps={{ layoutPresets: { mobile: { autoFocus: true } } }}`.\n\n## FieldChat\n\nПоле чата с многострочным вводом, прикреплением файлов и кнопкой отправки (Enter — отправка, Shift+Enter — перенос строки).\n\nПоле чата поверх `FieldTextArea`. Многострочный ввод с автоматическим ростом высоты (1–4 строки), футером действий (прикрепление файлов и отправка) и списком прикреплённых вложений. Enter отправляет сообщение, Shift+Enter переносит строку. Прикреплённые файлы на desktop показываются под полем, на mobile — над ним.\n\n### Когда использовать\n\n- Поле ввода сообщения в чате или диалоге с ассистентом.\n- Нужно прикрепление файлов рядом с вводом и отправка по Enter.\n\nКогда **не** нужен `FieldChat`:\n\n- Многострочное описание сущности без отправки/вложений — **`FieldDescription`**.\n- Произвольный многострочный текст — **`FieldTextArea`**.\n\n### Анатомия\n\n#### Ввод\n\n`FieldTextArea` с `minRows=1` и `maxRows=4`: поле растёт по мере набора текста и дальше скроллится. Плейсхолдер берётся из локали.\n\n#### Футер действий\n\n- Скрепка (`FileUpload`) — прикрепление файлов; видна только при переданном `attachment`. Тип допустимых файлов задаётся через `attachment.accept`.\n- Кнопка отправки — активна, когда есть непустой текст или хотя бы один файл; иначе disabled.\n\n#### Вложения\n\n`attachment.files` рендерятся карточками: `AttachmentSquare` на desktop, полноширинный `Attachment` на mobile. Удаление — через `attachment.onFileDelete`.\n\n#### Клавиатура\n\n- Enter — отправка (вызывает `handleSubmit(value)`), если ввод валиден.\n- Shift+Enter — перенос строки без отправки.\n\n### Примеры использования\n\n#### Базовый\n\nМногострочный ввод с отправкой по Enter.\n\n```tsx\nimport { FieldChat } from '@cloud-ru/ds-uikit-product-fields-predefined';\nimport { useState } from 'react';\n\nexport function FieldChatBasic() {\n const [value, setValue] = useState('');\n\n return setValue('')} />;\n}\n```\n\n#### С вложениями\n\nПрикрепление и удаление файлов, отправка очищает поле и список.\n\n```tsx\nimport { FieldChat } from '@cloud-ru/ds-uikit-product-fields-predefined';\nimport { useState } from 'react';\n\nexport function FieldChatWithAttachments() {\n const [value, setValue] = useState('');\n const [files, setFiles] = useState([]);\n\n return (\n {\n setValue('');\n setFiles([]);\n }}\n attachment={{\n files,\n accept: 'image/*,.pdf',\n onFilesUpload: uploaded => setFiles(prev => [...prev, ...uploaded]),\n onFileDelete: file => setFiles(prev => prev.filter(item => item !== file)),\n }}\n />\n );\n}\n```\n\n### Props\n\n**FieldChatProps**\n\n| Prop | Type | Default | Description |\n|------|------|---------|-------------|\n| `allowMoreThanMaxLength` | `boolean` | `true` | Разрешить ввод свыше `maxLength` символов (счётчик продолжит расти). |\n| `attachment` | `AttachmentSquareProps` \\| `FileUploadProps` \\| `NativeInputProps` | — | Прикрепление файлов |\n| `autoFocus` | `boolean` | — | Автофокус. На mobile выключается адаптивно (см. `layoutPresets`) |\n| `background` | `boolean` | `true` | Фон поля (acrylic) |\n| `caption` | `string` | — | Вторичная подпись справа |\n| `className` | `string` | — | CSS-класс
CSS-класс корня `FieldDecorator` |\n| `data-test-id` | `string` | — | |\n| `defaultValue` | `string` | — | Начальное значение (uncontrolled-режим) |\n| `disabled` | `boolean` | — | Поле выключено |\n| `error` | `string` | — | Ошибка (приоритетнее `hint`; форсит `validationState=error`) |\n| `fieldClassName` | `string` | — | CSS-класс оболочки поля |\n| `handleSubmit` | `(value: string) => void` | — | Колбек действия при отправке |\n| `header` | `ReactNode` | — | Нода над textarea — ряд элементов до контента (Figma `elementWrapperBefore` /
`slotBeforeContent`): тулбар с кнопками, чипами и т.п. |\n| `id` | `string` | — | HTML id |\n| `innerRef` | `Ref` | — | Ref на корневой DOM-элемент |\n| `inputMode` | `\"decimal\"` \\| `\"email\"` \\| `\"none\"` \\| `\"numeric\"` \\| `\"search\"` \\| `\"tel\"` \\| `\"text\"` \\| `\"url\"` | — | Режим виртуальной клавиатуры (`inputmode` нативного `