AiToolArray
Сворачиваемый список однотипных элементов: имя, счётчик (count + unit) и chevron. Раскрытие controlled: opened + onToggle.
Когда использовать
- Массив элементов в результате инструмента.
- Список объектов с вложенными полями.
Анатомия
Count + Unit
Счётчик рендерится как [ N ] или [ N unit ] (например [ 2 шт. ]).
Вложенный контент
В элементы можно вкладывать любой контент: AiToolText, AiToolKeyValue, AiToolObject (включая массив объектов) и вложенные AiToolArray.
Mono / Error
Наследуются из AiToolDetails и каскадом передаются во вложенные узлы; либо задаются пропом явно.
Установка
pnpm add @cloud-ru/ds-ai-toolimport { AiToolArray } from '@cloud-ru/ds-ai-tool'Примеры использования
Массив объектов
Key[ArrayName][ 2 шт. ]
Key[0]
regionru-central1
statusok
Key[1]
regionru-central1-a
statuspending
tsx
import { AiToolArray, AiToolObject } from '@cloud-ru/ds-ai-tool';
import { useState } from 'react';
export function ArrayList() {
const [opened, setOpened] = useState(true);
return (
<div style={{ width: 360 }}>
<AiToolArray name='Key[ArrayName]' count={2} unit='шт.' opened={opened} onToggle={setOpened}>
<AiToolObject name='Key[0]' opened>
<AiToolObject variant='string' name='region' value='ru-central1' />
<AiToolObject variant='string' name='status' value='ok' />
</AiToolObject>
<AiToolObject name='Key[1]' opened>
<AiToolObject variant='string' name='region' value='ru-central1-a' />
<AiToolObject variant='string' name='status' value='pending' />
</AiToolObject>
</AiToolArray>
</div>
);
}Props
Types
Props
AiToolArrayProps| Prop | Type | Default | Required | Description |
|---|---|---|---|---|
children | ReactNode | — | no | Вложенные элементы (при раскрытии). |
className | string | — | no | Доп. класс корня. |
count | number | — | no | Количество элементов — рендерится как `[ N ]` (или `[ N unit ]`). |
data-test-id | string | ai-tool-array | no | |
error | boolean | — | no | Состояние ошибки: имя и счётчик красные. По умолчанию наследуется от `AiToolDetails`. |
mono | boolean | — | no | Моноширинный режим имени и счётчика. По умолчанию наследуется от `AiToolDetails`. |
name | ReactNode | — | no | Имя узла (`Key[ArrayName]`). |
onToggle | ((opened: boolean) => void) | — | no | Переключение раскрытия. Получает новое значение `opened`. |
opened | boolean | false | no | Раскрытое состояние. Источник истины — родитель. |
unit | string | — | no | Единица измерения после количества (например `шт.`). |