Price summary

Пакет @cloud-ru/ds-uikit-product-price-summary — итоговая стоимость заказа с периодом биллинга, скидками, детализацией позиций и состояниями загрузки/ошибки. Использует @cloud-ru/ds-uikit-product-button-predefined для выбора периода и токены Product UI Kit.

Состав пакета

  • PriceSummary — полный блок: период (ButtonDropdown), сумма, скидки, аккордеон деталей заказа, ссылка на расчёт.
  • PriceSummarySmall — компактный итог (size=small в Figma): метка, сумма, опциональная function-ссылка.

Установка

pnpm add @cloud-ru/ds-uikit-product-price-summary

ButtonDropdown для периода входит в пакет через зависимость @cloud-ru/ds-uikit-product-button-predefined — отдельно ставить не нужно.

import { PricePeriod, PriceSummary, PriceSummarySmall } from '@cloud-ru/ds-uikit-product-price-summary'

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

ЗадачаКомпонент
Боковая панель / checkout с периодом, скидками и раскрываемым invoicePriceSummary
Компактная строка «Итого» без аккордеона и выбора периодаPriceSummarySmall
Выбор периода отдельно от блока ценыButtonDropdown