Attachment

Пакет @cloud-ru/ds-attachment предоставляет два компонента для отображения прикреплённых файлов:

  • Attachment — горизонтальный список-айтем с иконкой/превью, заголовком, описанием и actions.
  • AttachmentSquare — квадратный тайл с hover-оверлеем; удобен для галерей превью.

Оба используют общие токены s / m, поддерживают loading/error/disabled/checked (множественный выбор) и автоматически показывают image-превью, если file — изображение.

Когда использовать

  • В списках прикреплённых файлов с возможностью скачать/удалить — Attachment.
  • В галереях превью со state hovered-overlay — AttachmentSquare.

Когда не нужен пакет: для drag&drop-загрузки — Dropzone; для одиночных preview-карточек без actions — Card.

Анатомия

Оба компонента строятся вокруг трёх слотов: превью (иконка или image из file), текстовый блок (заголовок + описание / сообщение об ошибке), панель actions (download / delete, или retry при error).

Установка

pnpm add @cloud-ru/ds-attachment
import { Attachment, AttachmentSquare } from '@cloud-ru/ds-attachment'

Storybook

Figma