@cloud-ru/uikit-product-price-summary 0.5.3 → 0.5.4

package/dist/esm/components/ContentBlock/ContentBlock.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { RepeatSVG } from '@sbercloud/uikit-product-icons';
+import { useLocale } from '@sbercloud/uikit-product-locale';
+import { ButtonFunction } from '@snack-uikit/button';
+import { Sun } from '@snack-uikit/loaders';
+import { Typography } from '@snack-uikit/typography';
+import styles from './styles.module.css';
+export function ContentBlock({ loading, dataError, onRetry, children }) {
+    const { t } = useLocale('PriceSummary');
+    if (loading) {
+        return (_jsx("div", { className: styles.loadingBlock, children: _jsx(Sun, {}) }));
+    }
+    if (dataError) {
+        return (_jsxs("div", { className: styles.dataErrorBlock, children: [onRetry && _jsx(ButtonFunction, { icon: _jsx(RepeatSVG, {}), onClick: onRetry }), _jsx(Typography.SansBodyS, { children: t('dataError') })] }));
+    }
+    return children;
+}

package/dist/esm/components/ContentBlock/index.d.ts

@@ -0,0 +1 @@
+export * from './ContentBlock';

package/dist/esm/components/ContentBlock/index.js

@@ -0,0 +1 @@
+export * from './ContentBlock';

package/dist/esm/components/ContentBlock/styles.module.css

@@ -0,0 +1,12 @@
+.loadingBlock{
+  display:flex;
+  justify-content:center;
+  padding:var(--dimension-050m, 4px);
+}
+
+.dataErrorBlock{
+  display:flex;
+  flex-direction:column;
+  align-items:center;
+  color:var(--sys-neutral-text-light, #8b8e9b);
+}

package/dist/esm/components/PriceSummary/PriceSummary.d.ts

@@ -0,0 +1,17 @@
+import { WithLayoutType, WithSupportProps } from '@sbercloud/uikit-product-utils';
+import { LinkProps } from '@snack-uikit/link';
+import { DiscountDetails, InvoiceDetails } from '../../types';
+import { ContentBlockProps } from '../ContentBlock';
+import { HeaderBlockProps } from './components/HeaderBlock';
+import { TotalValueBlockProps } from './components/TotalValueBlock';
+export type PriceSummaryProps = WithLayoutType<WithSupportProps<TotalValueBlockProps & HeaderBlockProps & ContentBlockProps & {
+    discount?: DiscountDetails;
+    invoice?: InvoiceDetails[];
+    invoiceExpandedDefault?: boolean;
+    docsLink?: {
+        href?: LinkProps['href'];
+        text?: LinkProps['text'];
+    };
+    className?: string;
+}>>;
+export declare function PriceSummary({ value, totalSumType, hint, period, onPeriodChanged, periodOptions, promoBadge, loading, dataError, onRetry, discount, invoice, invoiceExpandedDefault, docsLink, className, layoutType, hintAppearance, showHintTooltip, hintTooltipText, hintLink, showHintLink, ...rest }: PriceSummaryProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/PriceSummary/PriceSummary.js

@@ -0,0 +1,27 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import cn from 'classnames';
+import { useLocale } from '@sbercloud/uikit-product-locale';
+import { extractSupportProps } from '@sbercloud/uikit-product-utils';
+import { Link } from '@snack-uikit/link';
+import { ContentBlock } from '../ContentBlock';
+import { DiscountBlock } from './components/DiscountBlock';
+import { HeaderBlock } from './components/HeaderBlock';
+import { InvoiceBlock } from './components/InvoiceBlock';
+import { TotalValueBlock } from './components/TotalValueBlock';
+import styles from './styles.module.css';
+export function PriceSummary(_a) {
+    var { value, totalSumType, hint, period, onPeriodChanged, periodOptions, promoBadge, loading, dataError, onRetry, discount, invoice, invoiceExpandedDefault = true, docsLink, className, layoutType, hintAppearance, showHintTooltip = false, hintTooltipText, hintLink, showHintLink } = _a, rest = __rest(_a, ["value", "totalSumType", "hint", "period", "onPeriodChanged", "periodOptions", "promoBadge", "loading", "dataError", "onRetry", "discount", "invoice", "invoiceExpandedDefault", "docsLink", "className", "layoutType", "hintAppearance", "showHintTooltip", "hintTooltipText", "hintLink", "showHintLink"]);
+    const { t } = useLocale('PriceSummary');
+    return (_jsxs("div", Object.assign({ className: cn(styles.priceSummary, className) }, extractSupportProps(rest), { children: [_jsx(HeaderBlock, { period: period, onPeriodChanged: onPeriodChanged, periodOptions: periodOptions, promoBadge: promoBadge, layoutType: layoutType }), _jsxs(ContentBlock, { loading: loading, dataError: dataError, onRetry: onRetry, children: [discount && _jsx(DiscountBlock, { value: discount, layoutType: layoutType }), _jsx(TotalValueBlock, { value: value, totalSumType: totalSumType, hint: hint, hintAppearance: hintAppearance, showHintTooltip: showHintTooltip, hintTooltipText: hintTooltipText, hintLink: hintLink, showHintLink: showHintLink }), (invoice === null || invoice === void 0 ? void 0 : invoice.length) && (_jsx(InvoiceBlock, { invoice: invoice, invoiceExpandedDefault: invoiceExpandedDefault, layoutType: layoutType })), (docsLink === null || docsLink === void 0 ? void 0 : docsLink.href) && (_jsx(Link, { size: 'm', textMode: 'default', text: docsLink.text || t('docsLink'), href: docsLink.href, target: '_blank' }))] })] })));
+}

package/dist/esm/components/PriceSummary/components/DiscountBlock/DiscountBlock.d.ts

@@ -0,0 +1,6 @@
+import { WithLayoutType } from '@sbercloud/uikit-product-utils';
+import { DiscountDetails } from '../../../../types';
+export type DiscountBlockProps = WithLayoutType<{
+    value: DiscountDetails;
+}>;
+export declare function DiscountBlock({ value, layoutType }: DiscountBlockProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/PriceSummary/components/DiscountBlock/DiscountBlock.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment } from 'react';
+import { useLocale } from '@sbercloud/uikit-product-locale';
+import { Typography } from '@snack-uikit/typography';
+import { formatCurrency } from '../../../../helpers';
+import { DiscountPercentCell } from '../DiscountPercentCell';
+import styles from './styles.module.css';
+export function DiscountBlock({ value, layoutType }) {
+    const { t } = useLocale('PriceSummary');
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: styles.discountGrid, children: [_jsx(Typography.SansBodyS, { tag: 'div', children: t('basePrice') }), _jsx(Typography.SansLabelM, { tag: 'div', className: styles.priceCell, children: formatCurrency(value.price) })] }), _jsx("div", { className: styles.discountGrid, children: value.discounts.map((discount, index) => (_jsxs(Fragment, { children: [_jsx(DiscountPercentCell, { discount: discount, layoutType: layoutType }), _jsx(Typography.SansLabelM, { tag: 'div', className: styles.discountCell, children: formatCurrency(-Math.abs(discount.value)) })] }, index))) })] }));
+}

package/dist/esm/components/PriceSummary/components/DiscountBlock/index.d.ts

@@ -0,0 +1 @@
+export * from './DiscountBlock';

package/dist/esm/components/PriceSummary/components/DiscountBlock/index.js

@@ -0,0 +1 @@
+export * from './DiscountBlock';

package/dist/esm/components/PriceSummary/components/DiscountBlock/styles.module.css

@@ -0,0 +1,16 @@
+.discountGrid{
+  display:grid;
+  grid-template-columns:1fr 1fr;
+  -moz-column-gap:var(--dimension-1m, 8px);
+       column-gap:var(--dimension-1m, 8px);
+  color:var(--sys-neutral-text-support, #6d707f);
+}
+
+.priceCell{
+  justify-self:end;
+}
+
+.discountCell{
+  justify-self:end;
+  color:var(--sys-red-text-support, #ae514c);
+}

package/dist/esm/components/PriceSummary/components/DiscountPercentCell/DiscountPercentCell.d.ts

@@ -0,0 +1,6 @@
+import { WithLayoutType } from '@sbercloud/uikit-product-utils';
+import { DiscountItem } from '../../../../types';
+export type DiscountPercentCellProps = WithLayoutType<{
+    discount: DiscountItem;
+}>;
+export declare function DiscountPercentCell({ discount, layoutType }: DiscountPercentCellProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/PriceSummary/components/DiscountPercentCell/DiscountPercentCell.js

@@ -0,0 +1,10 @@
+import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { formatNumber } from '@cloud-ru/ft-formatters';
+import { useLocale } from '@sbercloud/uikit-product-locale';
+import { AdaptiveQuestionTooltip } from '@sbercloud/uikit-product-mobile-tooltip';
+import { Typography } from '@snack-uikit/typography';
+import styles from './styles.module.css';
+export function DiscountPercentCell({ discount, layoutType }) {
+    const { t } = useLocale('PriceSummary');
+    return (_jsx("div", { className: styles.percentCell, children: discount.percent && (_jsxs(_Fragment, { children: [_jsxs(Typography.SansBodyS, { children: [t('discount'), " ", formatNumber(-Math.abs(discount.percent)), "%"] }), discount.tooltip && (_jsx(AdaptiveQuestionTooltip, { layoutType: layoutType, tip: discount.tooltip, trigger: layoutType === 'mobile' ? 'click' : 'hover' }))] })) }));
+}

package/dist/esm/components/PriceSummary/components/DiscountPercentCell/index.d.ts

@@ -0,0 +1 @@
+export * from './DiscountPercentCell';

package/dist/esm/components/PriceSummary/components/DiscountPercentCell/index.js

@@ -0,0 +1 @@
+export * from './DiscountPercentCell';

package/dist/esm/components/PriceSummary/components/DiscountPercentCell/styles.module.css

@@ -0,0 +1,5 @@
+.percentCell{
+  display:flex;
+  align-items:center;
+  gap:2px;
+}

package/dist/esm/components/PriceSummary/components/Divider/Divider.d.ts

@@ -0,0 +1 @@
+export declare function Divider(): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/PriceSummary/components/Divider/Divider.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import styles from './styles.module.css';
+export function Divider() {
+    return _jsx("div", { className: styles.divider });
+}

package/dist/esm/components/PriceSummary/components/Divider/index.d.ts

@@ -0,0 +1 @@
+export * from './Divider';

package/dist/esm/components/PriceSummary/components/Divider/index.js

@@ -0,0 +1 @@
+export * from './Divider';

package/dist/esm/components/PriceSummary/components/Divider/styles.module.css

@@ -0,0 +1,6 @@
+.divider{
+  width:100%;
+  height:0;
+  border-top:1px dashed var(--sys-neutral-decor-default, #dde0ea);
+  margin:var(--dimension-050m, 4px) 0;
+}

package/dist/esm/components/PriceSummary/components/HeaderBlock/HeaderBlock.d.ts

@@ -0,0 +1,6 @@
+import { PromoTagProps } from '@snack-uikit/promo-tag';
+import { PeriodDropdownProps } from '../PeriodDropdown';
+export type HeaderBlockProps = PeriodDropdownProps & {
+    promoBadge?: Pick<PromoTagProps, 'text' | 'appearance'> | string;
+};
+export declare function HeaderBlock({ period, onPeriodChanged, periodOptions, promoBadge, layoutType }: HeaderBlockProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/PriceSummary/components/HeaderBlock/HeaderBlock.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useLocale } from '@sbercloud/uikit-product-locale';
+import { PromoTag } from '@snack-uikit/promo-tag';
+import { Typography } from '@snack-uikit/typography';
+import { PeriodDropdown } from '../PeriodDropdown';
+import styles from './styles.module.css';
+export function HeaderBlock({ period, onPeriodChanged, periodOptions, promoBadge, layoutType }) {
+    const { t } = useLocale('PriceSummary');
+    return (_jsxs(_Fragment, { children: [promoBadge && (_jsx("div", { className: styles.promoBadge, children: _jsx(PromoTag, Object.assign({}, (typeof promoBadge === 'string' ? { text: promoBadge } : promoBadge))) })), _jsxs("div", { className: styles.headline, children: [_jsx(PeriodDropdown, { period: period, onPeriodChanged: onPeriodChanged, periodOptions: periodOptions, layoutType: layoutType }), _jsx(Typography.SansBodyM, { className: styles.vat, children: t('vat') })] })] }));
+}

package/dist/esm/components/PriceSummary/components/HeaderBlock/index.d.ts

@@ -0,0 +1 @@
+export * from './HeaderBlock';

package/dist/esm/components/PriceSummary/components/HeaderBlock/index.js

@@ -0,0 +1 @@
+export * from './HeaderBlock';

package/dist/esm/components/PriceSummary/components/HeaderBlock/styles.module.css

@@ -0,0 +1,14 @@
+.headline{
+  display:flex;
+  justify-content:space-between;
+  align-items:center;
+  gap:var(--dimension-050m, 4px);
+}
+
+.vat{
+  color:var(--sys-neutral-text-light, #8b8e9b);
+}
+
+.promoBadge{
+  display:flex;
+}

package/dist/esm/components/PriceSummary/components/InvoiceBlock/InvoiceBlock.d.ts

@@ -0,0 +1,7 @@
+import { WithLayoutType } from '@sbercloud/uikit-product-utils';
+import { InvoiceDetails } from '../../../../types';
+export type InvoiceBlockProps = WithLayoutType<{
+    invoice: InvoiceDetails[];
+    invoiceExpandedDefault?: boolean;
+}>;
+export declare function InvoiceBlock({ invoice, invoiceExpandedDefault, layoutType }: InvoiceBlockProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/PriceSummary/components/InvoiceBlock/InvoiceBlock.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useId } from 'react';
+import { useLocale } from '@sbercloud/uikit-product-locale';
+import { AccordionSecondary } from '@snack-uikit/accordion';
+import { Typography } from '@snack-uikit/typography';
+import { InvoiceDetailsBlock } from '../InvoiceDetailsBlock';
+import styles from './styles.module.css';
+export function InvoiceBlock({ invoice, invoiceExpandedDefault, layoutType }) {
+    const { t } = useLocale('PriceSummary');
+    const invoiceBlockId = useId();
+    return (_jsx(AccordionSecondary, { expandedDefault: invoiceExpandedDefault ? invoiceBlockId : undefined, className: styles.accordion, children: _jsx(AccordionSecondary.CollapseBlock, { id: invoiceBlockId, header: _jsx(Typography.SansBodyM, { className: styles.accordionHeaderTitle, children: t('orderDetails') }), children: _jsx("div", { className: styles.accordionContent, children: invoice.map((invoice, index) => (_jsx(InvoiceDetailsBlock, { invoice: invoice, layoutType: layoutType }, index))) }) }) }));
+}

package/dist/esm/components/PriceSummary/components/InvoiceBlock/index.d.ts

@@ -0,0 +1 @@
+export * from './InvoiceBlock';

package/dist/esm/components/PriceSummary/components/InvoiceBlock/index.js

@@ -0,0 +1 @@
+export * from './InvoiceBlock';

package/dist/esm/components/PriceSummary/components/InvoiceBlock/styles.module.css

@@ -0,0 +1,18 @@
+.accordion{
+  --space-accordion-collapse-block-secondary-horizontal-padding:0;
+  --space-accordion-collapse-block-secondary-vertical-padding:var(--dimension-1m, 8px);
+  --space-accordion-collapse-block-secondary-gap:var(--dimension-1m, 8px);
+  --border-width-accordion-collapse-block-secondary:0;
+  --accordion-header-padding-vertical:0;
+}
+
+.accordionHeaderTitle{
+  color:var(--sys-neutral-text-support, #6d707f);
+  padding:2px 0;
+}
+
+.accordionContent{
+  display:flex;
+  flex-direction:column;
+  gap:var(--dimension-1m, 8px);
+}

package/dist/esm/components/PriceSummary/components/InvoiceDetailsBlock/InvoiceDetailsBlock.d.ts

@@ -0,0 +1,6 @@
+import { WithLayoutType } from '@sbercloud/uikit-product-utils';
+import { InvoiceDetails } from '../../../../types';
+export type InvoiceDetailsBlockProps = WithLayoutType<{
+    invoice: InvoiceDetails;
+}>;
+export declare function InvoiceDetailsBlock({ invoice, layoutType }: InvoiceDetailsBlockProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/PriceSummary/components/InvoiceDetailsBlock/InvoiceDetailsBlock.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useLocale } from '@sbercloud/uikit-product-locale';
+import { Typography } from '@snack-uikit/typography';
+import { formatCurrency, formatQuantity } from '../../../../helpers';
+import { Divider } from '../Divider';
+import { InvoiceItemBlock } from '../InvoiceItemBlock';
+import styles from './styles.module.css';
+export function InvoiceDetailsBlock({ invoice, layoutType }) {
+    const { t } = useLocale('PriceSummary');
+    return (_jsxs("div", { className: styles.main, children: [invoice.title && (_jsxs(_Fragment, { children: [_jsxs("div", { className: styles.header, children: [_jsx(Typography.SansLabelM, { children: invoice.title }), invoice.quantity && _jsx(Typography.SansLabelM, { children: formatQuantity(invoice.quantity) })] }), _jsx(Divider, {})] })), invoice.items.map((item, index) => (_jsx(InvoiceItemBlock, { item: item, index: index, layoutType: layoutType }, index))), invoice.price !== undefined && (_jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsx("div", { className: styles.footer, children: _jsxs(Typography.SansLabelM, { children: [t('price'), ": ", formatCurrency(invoice.price)] }) })] }))] }));
+}

package/dist/esm/components/PriceSummary/components/InvoiceDetailsBlock/index.d.ts

@@ -0,0 +1 @@
+export * from './InvoiceDetailsBlock';

package/dist/esm/components/PriceSummary/components/InvoiceDetailsBlock/index.js

@@ -0,0 +1 @@
+export * from './InvoiceDetailsBlock';

package/dist/esm/components/PriceSummary/components/InvoiceDetailsBlock/styles.module.css

@@ -0,0 +1,16 @@
+.main{
+  border-radius:var(--dimension-050m, 4px);
+  padding:var(--dimension-050m, 4px) var(--dimension-1m, 8px);
+  border:1px dashed var(--sys-neutral-decor-default, #dde0ea);
+}
+
+.header{
+  display:flex;
+  justify-content:space-between;
+}
+
+.footer{
+  display:flex;
+  align-items:center;
+  justify-content:flex-end;
+}

package/dist/esm/components/PriceSummary/components/InvoiceItemBlock/InvoiceItemBlock.d.ts

@@ -0,0 +1,7 @@
+import { WithLayoutType } from '@sbercloud/uikit-product-utils';
+import { InvoiceItem } from '../../../../types';
+export type InvoiceItemBlockProps = WithLayoutType<{
+    item: InvoiceItem;
+    index: number;
+}>;
+export declare function InvoiceItemBlock({ item, index, layoutType }: InvoiceItemBlockProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/PriceSummary/components/InvoiceItemBlock/InvoiceItemBlock.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Typography } from '@snack-uikit/typography';
+import { formatCurrency } from '../../../../helpers';
+import { DiscountPercentCell } from '../DiscountPercentCell';
+import { Divider } from '../Divider';
+import { InvoiceItemLabelCell } from '../InvoiceItemLabelCell';
+import styles from './styles.module.css';
+export function InvoiceItemBlock({ item, index, layoutType }) {
+    const isEven = (index + 1) % 2 === 0;
+    const isSecondary = item.primary === undefined ? isEven : !item.primary;
+    const getPriceItem = () => {
+        if (item.hidePrice === false) {
+            return item.price !== undefined ? formatCurrency(item.price) : 'n/a';
+        }
+        return item.price !== undefined ? formatCurrency(item.price) : undefined;
+    };
+    return (_jsxs(_Fragment, { children: [item.topDivider && _jsx(Divider, {}), _jsxs("div", { className: styles.itemGrid, "data-discount": Boolean(item.discount), children: ['label' in item && item.label !== undefined && (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.labelCell, "data-secondary": isSecondary, children: _jsx(InvoiceItemLabelCell, { item: item, layoutType: layoutType }) }), _jsx(Typography.SansBodyS, { tag: 'div', className: styles.priceCell, "data-secondary": isSecondary, children: getPriceItem() })] })), item.discount && (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.percentCell, "data-secondary": isSecondary, children: _jsx(DiscountPercentCell, { discount: item.discount, layoutType: layoutType }) }), _jsx(Typography.SansBodyS, { tag: 'div', className: styles.discountCell, "data-secondary": isSecondary, children: formatCurrency(-Math.abs(item.discount.value)) })] }))] }), item.bottomDivider && _jsx(Divider, {})] }));
+}

package/dist/esm/components/PriceSummary/components/InvoiceItemBlock/index.d.ts

@@ -0,0 +1 @@
+export * from './InvoiceItemBlock';

package/dist/esm/components/PriceSummary/components/InvoiceItemBlock/index.js

@@ -0,0 +1 @@
+export * from './InvoiceItemBlock';

package/dist/esm/components/PriceSummary/components/InvoiceItemBlock/styles.module.css

@@ -0,0 +1,33 @@
+.itemGrid{
+  display:grid;
+  grid-template-columns:1fr auto;
+  -moz-column-gap:var(--dimension-1m, 8px);
+       column-gap:var(--dimension-1m, 8px);
+}
+.itemGrid[data-discount=true]{
+  margin-bottom:var(--dimension-050m, 4px);
+}
+
+.labelCell{
+  display:flex;
+  overflow:hidden;
+  gap:var(--dimension-050m, 4px);
+}
+
+.priceCell{
+  justify-self:end;
+}
+
+.labelCell[data-secondary=true],
+.priceCell[data-secondary=true],
+.percentCell[data-secondary=true]{
+  color:var(--sys-neutral-text-light, #8b8e9b);
+}
+
+.discountCell{
+  justify-self:end;
+  color:var(--sys-red-accent-default, #cb3f3e);
+}
+.discountCell[data-secondary=true]{
+  color:var(--sys-red-text-disabled, #ee9285);
+}

package/dist/esm/components/PriceSummary/components/InvoiceItemLabelCell/InvoiceItemLabelCell.d.ts

@@ -0,0 +1,6 @@
+import { WithLayoutType } from '@sbercloud/uikit-product-utils';
+import { InvoiceItem } from '../../../../types';
+export type InvoiceItemLabelCellProps = WithLayoutType<{
+    item: InvoiceItem;
+}>;
+export declare function InvoiceItemLabelCell({ item, layoutType }: InvoiceItemLabelCellProps): false | import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/PriceSummary/components/InvoiceItemLabelCell/InvoiceItemLabelCell.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { AdaptiveQuestionTooltip } from '@sbercloud/uikit-product-mobile-tooltip';
+import { TruncateString } from '@snack-uikit/truncate-string';
+import { Typography } from '@snack-uikit/typography';
+import { formatQuantity } from '../../../../helpers';
+import styles from './styles.module.css';
+export function InvoiceItemLabelCell({ item, layoutType }) {
+    return ('label' in item &&
+        item.label !== undefined && (_jsxs(_Fragment, { children: [_jsxs("div", { className: styles.labelCell, children: [_jsx(Typography.SansBodyS, { className: styles.label, children: item.labelMaxLines ? _jsx(TruncateString, { text: item.label, maxLines: item.labelMaxLines }) : item.label }), item.labelTooltip && (_jsx(AdaptiveQuestionTooltip, { layoutType: layoutType, tip: item.labelTooltip, trigger: layoutType === 'mobile' ? 'click' : 'hover' }))] }), item.quantity && (_jsx(Typography.SansBodyS, { className: styles.quantity, children: formatQuantity(item.quantity) }))] })));
+}

package/dist/esm/components/PriceSummary/components/InvoiceItemLabelCell/index.d.ts

@@ -0,0 +1 @@
+export * from './InvoiceItemLabelCell';

package/dist/esm/components/PriceSummary/components/InvoiceItemLabelCell/index.js

@@ -0,0 +1 @@
+export * from './InvoiceItemLabelCell';

package/dist/esm/components/PriceSummary/components/InvoiceItemLabelCell/styles.module.css

@@ -0,0 +1,14 @@
+.labelCell{
+  display:flex;
+  gap:2px;
+}
+
+.label{
+  flex:0 1 auto;
+  min-width:0;
+}
+
+.quantity{
+  flex:0 0 auto;
+  white-space:nowrap;
+}

package/dist/esm/components/PriceSummary/components/PeriodDropdown/PeriodDropdown.d.ts

@@ -0,0 +1,8 @@
+import { WithLayoutType } from '@sbercloud/uikit-product-utils';
+import { PricePeriod } from '../../../../types';
+export type PeriodDropdownProps = WithLayoutType<{
+    period: PricePeriod;
+    periodOptions: PricePeriod[];
+    onPeriodChanged?: (period: PricePeriod) => void;
+}>;
+export declare function PeriodDropdown({ period, onPeriodChanged, periodOptions, layoutType }: PeriodDropdownProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/PriceSummary/components/PeriodDropdown/PeriodDropdown.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ButtonDropdown } from '@sbercloud/uikit-product-button-predefined';
+import { useLocale } from '@sbercloud/uikit-product-locale';
+import { Typography } from '@snack-uikit/typography';
+import { usePeriodFormat } from '../../../../hooks';
+import styles from './styles.module.css';
+export function PeriodDropdown({ period, onPeriodChanged = () => { }, periodOptions, layoutType }) {
+    const { t } = useLocale('PriceSummary');
+    const formatPeriod = usePeriodFormat();
+    const actions = periodOptions
+        .filter(item => item !== period)
+        .map(item => ({
+        content: { option: formatPeriod(item) },
+        onClick: () => onPeriodChanged(item),
+    }));
+    return (_jsxs("div", { className: styles.period, "data-single": actions.length === 0 ? true : undefined, children: [_jsx(Typography.SansBodyM, { children: t('total') }), actions.length === 0 && (_jsx("div", { className: styles.single, children: _jsx(Typography.SansBodyM, { children: formatPeriod(period) }) })), actions.length > 0 && (_jsx(ButtonDropdown, { size: 's', label: formatPeriod(period), items: actions, closeDroplistOnItemClick: true, layoutType: layoutType }))] }));
+}

package/dist/esm/components/PriceSummary/components/PeriodDropdown/index.d.ts

@@ -0,0 +1 @@
+export * from './PeriodDropdown';

package/dist/esm/components/PriceSummary/components/PeriodDropdown/index.js

@@ -0,0 +1 @@
+export * from './PeriodDropdown';

package/dist/esm/components/PriceSummary/components/PeriodDropdown/styles.module.css

@@ -0,0 +1,15 @@
+.period{
+  display:flex;
+  align-items:center;
+  gap:var(--dimension-1m, 8px);
+}
+.period[data-single]{
+  gap:var(--dimension-050m, 4px);
+}
+
+.single{
+  min-height:var(--size-button-s, 32px);
+  display:flex;
+  align-items:center;
+  color:var(--sys-neutral-text-light, #8b8e9b);
+}

package/dist/esm/components/PriceSummary/components/TotalValueBlock/TotalValueBlock.d.ts

@@ -0,0 +1,24 @@
+import { ReactNode } from 'react';
+import { ValueOf } from '@snack-uikit/utils';
+import { TotalSumType } from '../../../../types';
+export declare const APPEARANCE_STATE: {
+    readonly Default: "default";
+    readonly UserError: "userError";
+    readonly SystemError: "systemError";
+    readonly Warning: "warning";
+};
+export type AppearanceState = ValueOf<typeof APPEARANCE_STATE>;
+export type TotalValueBlockProps = {
+    value?: number;
+    totalSumType?: TotalSumType;
+    hint?: string;
+    hintAppearance?: AppearanceState;
+    showHintTooltip?: boolean;
+    hintTooltipText?: ReactNode;
+    hintLink?: {
+        href?: string;
+        text: string;
+    };
+    showHintLink?: boolean;
+};
+export declare function TotalValueBlock({ value, totalSumType, hint, hintAppearance, showHintTooltip, hintTooltipText, hintLink, showHintLink, }: TotalValueBlockProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/PriceSummary/components/TotalValueBlock/TotalValueBlock.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { InfoFilledSVG } from '@sbercloud/uikit-product-icons';
+import { useLocale } from '@sbercloud/uikit-product-locale';
+import { AlarmFilledSVG, CrossFilledSVG, QuestionSVG } from '@snack-uikit/icons';
+import { Link } from '@snack-uikit/link';
+import { Tooltip } from '@snack-uikit/tooltip';
+import { Typography } from '@snack-uikit/typography';
+import { formatCurrency } from '../../../../helpers';
+import styles from './styles.module.css';
+export const APPEARANCE_STATE = {
+    Default: 'default',
+    UserError: 'userError',
+    SystemError: 'systemError',
+    Warning: 'warning',
+};
+function getAppearanceIcon(appearance) {
+    let Component;
+    switch (appearance) {
+        case APPEARANCE_STATE.Warning:
+            Component = AlarmFilledSVG;
+            break;
+        case APPEARANCE_STATE.UserError:
+            Component = CrossFilledSVG;
+            break;
+        case APPEARANCE_STATE.SystemError:
+            Component = QuestionSVG;
+            break;
+        case APPEARANCE_STATE.Default:
+        default:
+            Component = InfoFilledSVG;
+            break;
+    }
+    return _jsx(Component, { size: 16, "data-appearance": appearance, className: styles.hintIcon });
+}
+export function TotalValueBlock({ value, totalSumType = 'equal', hint, hintAppearance = APPEARANCE_STATE.Default, showHintTooltip, hintTooltipText, hintLink, showHintLink, }) {
+    const { t } = useLocale('PriceSummary');
+    const totalSumPrefix = totalSumType === 'from' ? `${t('totalSumFromPrefix')} ` : '';
+    return (_jsxs("div", { className: styles.content, "data-appearance": hintAppearance, children: [_jsx(Typography.LightHeadlineS, { children: value !== undefined ? `${totalSumPrefix}${formatCurrency(Number(value))}` : 'N/A' }), _jsx(Tooltip, { open: showHintTooltip && hintTooltipText ? undefined : false, tip: hintTooltipText, placement: 'left-start', children: hint && (_jsxs("div", { className: styles.hint, "data-appearance": hintAppearance, children: [getAppearanceIcon(hintAppearance), _jsx(Typography.SansBodyS, { children: hint })] })) }), showHintLink && (_jsx(Link, { textMode: 'accent', appearance: 'neutral', size: 's', href: hintLink === null || hintLink === void 0 ? void 0 : hintLink.href, text: hintLink === null || hintLink === void 0 ? void 0 : hintLink.text, className: styles.link }))] }));
+}

package/dist/esm/components/PriceSummary/components/TotalValueBlock/index.d.ts

@@ -0,0 +1 @@
+export * from './TotalValueBlock';

package/dist/esm/components/PriceSummary/components/TotalValueBlock/index.js

@@ -0,0 +1 @@
+export * from './TotalValueBlock';

package/dist/esm/components/PriceSummary/components/TotalValueBlock/styles.module.css

@@ -0,0 +1,51 @@
+.content{
+  display:flex;
+  flex-direction:column;
+  text-align:start;
+}
+.content[data-appearance=userError]{
+  color:var(--sys-red-text-main, #7a2d2d);
+}
+.content[data-appearance=warning]{
+  color:var(--sys-yellow-text-main, #815f19);
+}
+.content[data-appearance=systemError]{
+  color:var(--sys-neutral-text-disabled, #aaaebd);
+}
+
+.hint{
+  display:flex;
+  align-items:center;
+  gap:var(--dimension-025m, 2px);
+  color:var(--sys-neutral-text-light, #8b8e9b);
+}
+.hint[data-appearance=userError]{
+  color:var(--sys-red-text-main, #7a2d2d);
+}
+.hint[data-appearance=warning]{
+  color:var(--sys-yellow-text-main, #815f19);
+}
+.hint[data-appearance=systemError]{
+  color:var(--sys-neutral-text-disabled, #aaaebd);
+}
+
+.hintIcon{
+  flex-shrink:0;
+  box-sizing:content-box;
+}
+.hintIcon[data-appearance=default]{
+  color:var(--sys-neutral-accent-default, #787b8a);
+}
+.hintIcon[data-appearance=userError]{
+  color:var(--sys-red-accent-default, #cb3f3e);
+}
+.hintIcon[data-appearance=warning]{
+  color:var(--sys-yellow-accent-default, #e2b134);
+}
+.hintIcon[data-appearance=systemError]{
+  color:var(--sys-neutral-text-disabled, #aaaebd);
+}
+
+.link{
+  margin-left:18px;
+}

package/dist/esm/components/PriceSummary/index.d.ts

@@ -0,0 +1 @@
+export * from './PriceSummary';