Quota
Пакет @cloud-ru/ds-uikit-product-quota предоставляет три компонента для отображения квот проекта. Все три используют общую модель данных QuotaItem (name, limit, usage, remains, unitDisplayName) и общие состояния загрузки и ошибки.
- QuotaWidget — кнопка-триггер с выпадающим списком карточек квот, для шапки продуктовых страниц.
- QuotaWidgetMini — компактный аккордеон со списком квот, для сайдбаров и узких layout’ов.
- QuotaWidgetCard — карточка одной квоты с прогресс-баром, tooltip-расшифровкой и состояниями
loading/noData.
Карточки внутри QuotaWidget и QuotaWidgetMini — те же QuotaWidgetCard; исчерпанные квоты (remains <= 0) поднимаются в начало списка и подсчитываются в counter триггера.
Отдельно доступен QuotaWidgetContent — содержимое QuotaWidget без кнопки-триггера и выпадающего списка, для случаев, когда раскрытие даёт контейнер снаружи.
Установка
pnpm add @cloud-ru/ds-uikit-product-quota
import { QuotaWidget, QuotaWidgetMini, QuotaWidgetCard } from '@cloud-ru/ds-uikit-product-quota'
Figma
Все три компонента живут на одной странице Quota файла Product UI Kit. Ссылки на конкретные узлы — на страницах компонентов.