@alfalab/core-components-pure-cell 4.11.5 → 4.12.0

package/moderncssm/component-511ba1c0.d.ts

@@ -0,0 +1,227 @@
+/// <reference types="react" />
+import React from "react";
+import { ReactNode, AnchorHTMLAttributes, ButtonHTMLAttributes } from "react";
+import { MainElement, GraphicsElement, FooterElement, ContentElement, AddonElement } from "./components/types";
+import { Color, TitleProps } from "@alfalab/core-components-typography";
+import { ButtonProps } from "@alfalab/core-components-button";
+import { AmountProps as AmountType } from "./components/typesProps";
+type Props = {
+    /**
+     * Компоненты
+     */
+    children: MainElement;
+    /**
+     * Позволяет изменить расположение блоков внутри main
+     */
+    isReverse?: boolean;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Идентификатор для систем автоматизированного тестирования.
+     * Используется модификатор -main
+     */
+    dataTestId?: string;
+    /**
+     * Клик по контенту.
+     */
+    onClick?: () => void;
+};
+declare const Main: React.FC<Props>;
+type Props$0 = {
+    /**
+     * Компоненты
+     */
+    children: GraphicsElement;
+    /**
+     * Идентификатор для систем автоматизированного тестирования.
+     * Используется модификатор -graphics
+     */
+    dataTestId?: string;
+    /**
+     * Вертикальное выравнивание
+     */
+    verticalAlign?: "top" | "center" | "bottom";
+    /**
+     * Отступ от графики
+     */
+    graphicPadding?: "airy" | "default" | "compact" | "tiny" | "none";
+    /**
+     * Клик по контенту графики.
+     */
+    onClick?: () => void;
+};
+declare const Graphics: React.FC<Props$0>;
+type FooterTextProps = {
+    /**
+     * Цвет текста
+     */
+    color?: Color;
+    /**
+     * Идентификатор для систем автоматизированного тестирования.
+     * Используется модификатор -footer-title
+     */
+    dataTestId?: string;
+    /**
+     * Дочерние элементы.
+     */
+    children?: ReactNode;
+};
+declare const FooterText: React.FC<FooterTextProps>;
+type ComponentProps = Omit<ButtonProps, "dataTestId"> & {
+    /**
+     * Идентификатор для систем автоматизированного тестирования.
+     * Используется модификатор -button
+     */
+    dataTestId?: string;
+};
+type FooterButtonProps = ComponentProps & Partial<AnchorHTMLAttributes<HTMLAnchorElement> | ButtonHTMLAttributes<HTMLButtonElement>>;
+declare const FooterButton: React.ForwardRefExoticComponent<FooterButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
+type Props$1 = {
+    /**
+     * Компоненты
+     */
+    children: FooterElement;
+    /**
+     * Вертикальные отступы
+     */
+    footerPadding?: "default" | "none";
+    /**
+     * Идентификатор для систем автоматизированного тестирования.
+     * Используется модификатор -footer
+     */
+    dataTestId?: string;
+};
+declare const Footer: React.FC<Props$1>;
+type Props$2 = {
+    /**
+     * Компоненты
+     */
+    children: ContentElement;
+    /**
+     * Идентификатор для систем автоматизированного тестирования.
+     * Используется модификатор -content
+     */
+    dataTestId?: string;
+};
+declare const Content: React.FC<Props$2>;
+type Props$3 = {
+    /**
+     * Наименование категории
+     */
+    categoryName: string;
+    /**
+     * Процент категории
+     */
+    categoryPercent?: number;
+    /**
+     * Слот справа
+     */
+    rightAddons?: ReactNode;
+    /**
+     * Идентификатор для систем автоматизированного тестирования.
+     * Для наименования категории используется модификатор -category-name,
+     * процент категории -category-percent, слота справа -category-right-addon
+     */
+    dataTestId?: string;
+};
+declare const Category: React.FC<Props$3>;
+type Props$4 = {
+    /**
+     * Цвет денежного значения
+     * @deprecated Используйте titleProps.color
+     */
+    color?: Color;
+    /**
+     * Пропсы, которые будут прокинуты в компонент типографики
+     */
+    titleProps?: TitleProps;
+    /**
+     * Идентификатор для систем автоматизированного тестирования.
+     * Для typography используется модификатор -amount-title, для компонента Amount -core-amount-title
+     */
+    dataTestId?: string;
+} & Omit<AmountType, "dataTestId">;
+declare const AmountTitle: React.FC<Props$4>;
+type Props$5 = {
+    /**
+     * Начертание шрифта денежного значения
+     */
+    weight?: "bold" | "normal";
+    /**
+     * Размер денежного значения
+     */
+    textView?: "component" | "primary-small";
+    /**
+     * Цвет денежного значения
+     */
+    color?: Color;
+    /**
+     * Идентификатор для систем автоматизированного тестирования.
+     * Для typography используется модификатор -amount-text, для компонента Amount -amount
+     */
+    dataTestId?: string;
+} & Omit<AmountType, "dataTestId">;
+declare const Amount: React.FC<Props$5>;
+type Props$6 = {
+    /**
+     * Вертикальное выравнивание
+     */
+    verticalAlign?: "auto" | "top" | "center" | "bottom";
+    /**
+     * Горизонтальные отступы
+     */
+    addonPadding?: "default" | "none";
+    /**
+     * Компоненты
+     */
+    children: AddonElement;
+    /**
+     * Идентификатор для систем автоматизированного тестирования.
+     * Используется модификатор -addon
+     */
+    dataTestId?: string;
+    /**
+     * Клик по контенту аддона.
+     */
+    onClick?: () => void;
+};
+declare const Addon: React.FC<Props$6>;
+type Props$7 = {
+    /**
+     * Контент
+     */
+    children?: ReactNode;
+    /**
+     * Количество строк
+     */
+    rowLimit?: 1 | 2;
+    /**
+     * Размер текста
+     */
+    view?: 'primary-large' | 'primary-medium' | 'primary-small' | 'component' | 'component-primary' | 'secondary-large';
+    /**
+     * Толщина title
+     */
+    titleWeight?: 'regular' | 'bold';
+    /**
+     * Цвет title
+     */
+    titleColor: Color;
+    /**
+     * Value ячейки
+     */
+    value?: ReactNode;
+    /**
+     * Цвет value
+     */
+    valueColor?: Color;
+    /**
+     * Идентификатор для систем автоматизированного тестирования.
+     * Для контента используется модификатор -text_content, для value ячейки -text_value
+     */
+    dataTestId?: string;
+};
+declare const Text: React.FC<Props$7>;
+export { Main, Props$0 as Props, Graphics, FooterTextProps, FooterText, FooterButton, Footer, Content, Category, AmountTitle, Amount, Addon, Text };

package/moderncssm/component-511ba1c0.js

@@ -0,0 +1,252 @@
+import React, { useContext, forwardRef, useRef, useState } from 'react';
+import mergeRefs from 'react-merge-refs';
+import cn from 'classnames';
+import { Comment } from '@alfalab/core-components-comment/moderncssm';
+import { useFocus } from '@alfalab/hooks';
+import { getDataTestId } from '@alfalab/core-components-shared/moderncssm';
+import { Amount as Amount$1 } from '@alfalab/core-components-amount/moderncssm';
+import { Typography } from '@alfalab/core-components-typography/moderncssm';
+import styles$1 from './components/amount/index.module.css';
+import styles$2 from './components/amount-title/index.module.css';
+import styles$3 from './components/category/index.module.css';
+import styles$4 from './components/content/index.module.css';
+import styles$5 from './components/footer/index.module.css';
+import { Button } from '@alfalab/core-components-button/moderncssm';
+import styles$6 from './components/footer-button/index.module.css';
+import styles$7 from './components/graphics/index.module.css';
+import styles$8 from './components/main/index.module.css';
+import styles$9 from './components/text/index.module.css';
+import styles$a from './index.module.css';
+import styles from './components/addon/index.module.css';
+
+const ADDON_COMPONENT = {
+    button: 'button',
+    section: 'section',
+};
+const Addon = ({ children, verticalAlign = 'top', addonPadding = 'default', dataTestId, onClick, }) => {
+    const pureCellContext = useContext(PureCellContext);
+    const Component = onClick ? ADDON_COMPONENT.button : ADDON_COMPONENT.section;
+    const onMouseEvents = {
+        onClick: (e) => {
+            e.stopPropagation();
+            onClick?.();
+        },
+        onMouseEnter: () => {
+            pureCellContext.unsetMainHover?.();
+        },
+        onMouseLeave: () => {
+            pureCellContext.setMainHover?.();
+        },
+        onMouseDown: (e) => {
+            e.stopPropagation();
+        },
+    };
+    return (React.createElement(Component, { className: cn(styles.component, styles[addonPadding], styles[verticalAlign], {
+            [styles.button]: onClick,
+        }), "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'addon'), ...(onClick && onMouseEvents) }, children));
+};
+
+const Amount = ({ weight = 'normal', textView = 'component', color = 'primary', minority, minorUnits = 100, dataTestId, ...restProps }) => {
+    const pureCellContext = useContext(PureCellContext);
+    return (React.createElement(Typography.Text, { view: textView, dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'amount-text'), className: cn(styles$1.component), color: color },
+        React.createElement(Amount$1, { minority: minority || minorUnits, bold: weight === 'bold' ? 'full' : 'none', dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'amount'), ...restProps })));
+};
+
+const AmountTitle = ({ minority, minorUnits = 100, className, color = 'primary', dataTestId, titleProps = {}, ...restProps }) => {
+    const pureCellContext = useContext(PureCellContext);
+    const titleDefaultProps = {
+        tag: 'h4',
+        view: 'small',
+        color,
+        ...titleProps,
+    };
+    return (React.createElement(Typography.TitleResponsive, { ...titleDefaultProps, dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'amount-title'), className: cn(styles$2.component, titleProps.className) },
+        React.createElement(Amount$1, { minority: minority || minorUnits, className: cn(styles$2.weight, className), dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'core-amount-title'), ...restProps, bold: 'none' })));
+};
+
+const Category = ({ categoryName, categoryPercent, rightAddons, dataTestId, }) => {
+    const pureCellContext = useContext(PureCellContext);
+    return (React.createElement("div", { className: styles$3.component, "data-test-id": 'cell-pure-category' },
+        React.createElement(Typography.Text, { view: 'primary-small', color: 'secondary', dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'category-name'), className: styles$3.categoryName }, categoryName),
+        categoryPercent !== undefined && (React.createElement(Typography.Text, { tag: 'div', view: 'primary-small', color: 'secondary', className: styles$3.categoryPercent, dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'category-percent') },
+            categoryPercent,
+            "%")),
+        rightAddons !== undefined && (React.createElement("div", { className: styles$3.rightAddon, "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'category-right-addon') }, rightAddons))));
+};
+
+const Content = ({ children, dataTestId }) => {
+    const { direction, dataTestId: contextDataTestId } = useContext(PureCellContext);
+    return (React.createElement("section", { className: cn(styles$4.component, { [styles$4.horizontal]: direction === 'horizontal' }), "data-test-id": getDataTestId(dataTestId || contextDataTestId, 'content') }, children));
+};
+
+const Footer = ({ children, footerPadding = 'default', dataTestId }) => {
+    const pureCellContext = useContext(PureCellContext);
+    return (React.createElement("footer", { className: cn(styles$5.component, styles$5[footerPadding]), "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'footer') }, children));
+};
+
+const FooterButton = forwardRef(({ children, dataTestId, onClick, onMouseDown, onMouseEnter, onMouseLeave, ...props }, ref) => {
+    const pureCellContext = useContext(PureCellContext);
+    const handleClick = (e) => {
+        e.stopPropagation();
+        onClick?.(e);
+    };
+    const handleMouseEnter = (e) => {
+        onMouseEnter?.(e);
+        pureCellContext.unsetMainHover?.();
+    };
+    const handleMouseLeave = (e) => {
+        onMouseLeave?.(e);
+        pureCellContext.setMainHover?.();
+    };
+    const handleMouseDown = (e) => {
+        onMouseDown?.(e);
+        e.stopPropagation();
+    };
+    return (React.createElement(Button, { ...props, size: 'xxs', dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'button'), className: styles$6.component, ref: ref, onClick: handleClick, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onMouseDown: handleMouseDown }, children));
+});
+
+const FooterText = ({ children, color = 'secondary', dataTestId, }) => {
+    const pureCellContext = useContext(PureCellContext);
+    return (React.createElement(Typography.Text, { view: 'primary-small', color: color, "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'footer-title') }, children));
+};
+
+const GRAPHICS_COMPONENT = {
+    button: 'button',
+    section: 'section',
+};
+const Graphics = ({ children, dataTestId, verticalAlign = 'top', graphicPadding, onClick, }) => {
+    const pureCellContext = useContext(PureCellContext);
+    const Component = onClick ? GRAPHICS_COMPONENT.button : GRAPHICS_COMPONENT.section;
+    const defaultGraphicPadding = pureCellContext.direction === 'horizontal' ? 'airy' : 'default';
+    const onMouseEvents = {
+        onClick: (e) => {
+            e.stopPropagation();
+            onClick?.();
+        },
+        onMouseEnter: () => {
+            pureCellContext.unsetMainHover?.();
+        },
+        onMouseLeave: () => {
+            pureCellContext.setMainHover?.();
+        },
+        onMouseDown: (e) => {
+            e.stopPropagation();
+        },
+    };
+    return (React.createElement(Component, { className: cn(styles$7.component, styles$7[verticalAlign], styles$7[pureCellContext.direction || 'horizontal'], styles$7[graphicPadding || defaultGraphicPadding], { [styles$7.button]: onClick }), "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'graphics'), ...(onClick && onMouseEvents) }, children));
+};
+
+const MAIN_COMPONENT = {
+    button: 'button',
+    section: 'section',
+};
+const Main = ({ children, isReverse, className, dataTestId, onClick }) => {
+    const { direction = 'horizontal', dataTestId: contextDataTestId, setMainHover, unsetMainHover, } = useContext(PureCellContext);
+    const Component = onClick ? MAIN_COMPONENT.button : MAIN_COMPONENT.section;
+    const onMouseEvents = {
+        onClick: (e) => {
+            e.stopPropagation();
+            onClick?.();
+        },
+        onMouseEnter: () => {
+            unsetMainHover?.();
+        },
+        onMouseLeave: () => {
+            setMainHover?.();
+        },
+        onMouseDown: (e) => {
+            e.stopPropagation();
+        },
+    };
+    return (React.createElement(Component, { className: cn(styles$8.component, styles$8[direction], {
+            [styles$8.reverse]: isReverse,
+        }, { [styles$8.button]: onClick }, className), "data-test-id": getDataTestId(dataTestId || contextDataTestId, 'main'), ...(onClick && onMouseEvents) }, children));
+};
+
+const Text = ({ children, value, rowLimit, view = 'component-primary', titleWeight, titleColor, valueColor, dataTestId, }) => {
+    const { direction = 'horizontal', dataTestId: contextDataTestId } = useContext(PureCellContext);
+    const className = rowLimit && styles$9[`rowLimit${rowLimit}`];
+    return (React.createElement("div", { className: cn(styles$9.component, {
+            [styles$9.vertical]: direction !== 'horizontal',
+        }) },
+        React.createElement("div", { className: styles$9.title },
+            React.createElement(Typography.Text, { view: view, weight: titleWeight, tag: 'div', color: titleColor, className: className, "data-test-id": getDataTestId(dataTestId || contextDataTestId, 'text_content') }, children)),
+        value && (React.createElement("div", { className: styles$9.value },
+            React.createElement(Typography.Text, { view: view, tag: 'div', color: valueColor, className: className, "data-test-id": getDataTestId(dataTestId || contextDataTestId, 'text_value') }, value)))));
+};
+
+/* eslint-disable react/jsx-no-constructed-context-values */
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+const PureCellContext = React.createContext({});
+const PureCellComponent = forwardRef(({ className, dataTestId, onClick, href, tag: Component = (href && 'a') || (onClick && 'button') || 'section', children, horizontalPadding = 'none', verticalPadding = 'none', direction = 'horizontal', ...restProps }, ref) => {
+    const cellRef = useRef(null);
+    const [focused] = useFocus(cellRef, 'keyboard');
+    const [hoverState, setHoverState] = useState(false);
+    const [activeState, setActiveState] = useState(false);
+    const setHover = () => setHoverState(true);
+    const unsetHover = () => setHoverState(false);
+    const setActive = () => setActiveState(true);
+    const unsetActive = () => setActiveState(false);
+    const mouseEvents = {
+        onMouseEnter: setHover,
+        onMouseLeave: unsetHover,
+        onMouseDown: setActive,
+        onMouseUp: unsetActive,
+    };
+    const addClasses = {
+        [styles$a.component]: true,
+        [styles$a.focused]: focused,
+        [styles$a[direction]]: true,
+        [styles$a[horizontalPadding]]: true,
+        [styles$a.hover]: hoverState,
+        [styles$a.active]: activeState,
+    };
+    const contextState = {
+        direction,
+        dataTestId,
+        setMainHover: setHover,
+        unsetMainHover: unsetHover,
+    };
+    if (typeof verticalPadding === 'string') {
+        addClasses[styles$a[verticalPadding]] = typeof verticalPadding === 'string';
+    }
+    if (typeof verticalPadding === 'object') {
+        addClasses[styles$a[`${verticalPadding.top}Top`]] = !!verticalPadding.top;
+        addClasses[styles$a[`${verticalPadding.bottom}Bottom`]] = !!verticalPadding.bottom;
+    }
+    if (href) {
+        const { target } = restProps;
+        // Для совместимости с react-router-dom, меняем href на to
+        const hrefProps = { [typeof Component === 'string' ? 'href' : 'to']: href };
+        return (React.createElement(Component, { rel: target === '_blank' ? 'noreferrer noopener' : undefined, ...restProps, ...hrefProps, ref: mergeRefs([cellRef, ref]), className: cn(styles$a.link, addClasses, className), "data-test-id": dataTestId, onClick: onClick, ...mouseEvents },
+            React.createElement(PureCellContext.Provider, { value: contextState }, children)));
+    }
+    if (onClick) {
+        return (React.createElement(Component, { ...restProps, ref: mergeRefs([cellRef, ref]), className: cn(styles$a.button, addClasses, className), "data-test-id": dataTestId, onClick: onClick, ...mouseEvents },
+            React.createElement(PureCellContext.Provider, { value: contextState }, children)));
+    }
+    return (React.createElement(Component, { ...restProps, ref: ref, tabIndex: 0, className: cn(addClasses, className), "data-test-id": dataTestId },
+        React.createElement(PureCellContext.Provider, { value: contextState }, children)));
+});
+/**
+ * Универсальный конструктор для сборки любой ячейки.
+ *
+ * [Макет](https://www.figma.com/file/KlFOLLkKO8rtvvQE3RXuhq/Click-Library?node-id=43525%3A240018)
+ */
+const PureCell = Object.assign(PureCellComponent, {
+    Main,
+    Graphics,
+    Content,
+    Text,
+    Amount,
+    AmountTitle,
+    Addon,
+    Footer,
+    ExtraSubtitle: FooterText,
+    FooterButton,
+    Comment,
+    Category,
+});
+PureCellComponent.displayName = 'PureCellComponent';
+
+export { Addon as A, Category as C, Footer as F, Graphics as G, Main as M, PureCell as P, Text as T, Amount as a, AmountTitle as b, Content as c, FooterButton as d, FooterText as e, PureCellContext as f };

package/moderncssm/component-8c83a9ca.d.ts

@@ -0,0 +1,125 @@
+/// <reference types="react" />
+import React from 'react';
+import { AnchorHTMLAttributes, ButtonHTMLAttributes, ElementType, HTMLAttributes } from "react";
+import { ButtonProps } from "@alfalab/core-components-button";
+import { FooterTextProps } from "./components/footer-text/index";
+import { PureCellElement } from "./components/types";
+type PureCellContext = {
+    /** Направление */
+    direction?: 'horizontal' | 'vertical';
+    dataTestId?: string;
+    setMainHover?: () => void;
+    unsetMainHover?: () => void;
+};
+declare const PureCellContext: React.Context<PureCellContext>;
+type BasePureCellProps = {
+    /**
+     * Направление
+     */
+    direction?: 'horizontal' | 'vertical';
+    /**
+     * Сss класс для стилизации общей обёртки
+     */
+    className?: string;
+    /**
+     * Выводит ссылку в виде ячейки
+     */
+    href?: string;
+    /**
+     * Вертикальные отступы
+     */
+    verticalPadding?: 'airy' | 'default' | 'compact' | 'tiny' | 'none' | {
+        /**
+         * Вертикальный отступ сверху
+         */
+        top?: 'airy' | 'default' | 'compact' | 'tiny' | 'none';
+        /**
+         * Вертикальный отступ снизу
+         */
+        bottom?: 'airy' | 'default' | 'compact' | 'tiny' | 'none';
+    };
+    /**
+     * Горизонтальные отступы
+     */
+    horizontalPadding?: 'left' | 'right' | 'both' | 'none';
+    /**
+     * Позволяет использовать кастомный компонент для кнопки (например Link из роутера)
+     */
+    tag?: ElementType;
+    /**
+     * Компоненты
+     */
+    children: PureCellElement;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+};
+type AnchorPureCellProps = BasePureCellProps & AnchorHTMLAttributes<HTMLAnchorElement>;
+type ButtonPureCellProps = BasePureCellProps & ButtonHTMLAttributes<HTMLButtonElement>;
+type ElementPureCellProps = BasePureCellProps & HTMLAttributes<HTMLElement>;
+type PureCellProps = Partial<AnchorPureCellProps | ButtonPureCellProps | ElementPureCellProps>;
+/**
+ * Универсальный конструктор для сборки любой ячейки.
+ *
+ * [Макет](https://www.figma.com/file/KlFOLLkKO8rtvvQE3RXuhq/Click-Library?node-id=43525%3A240018)
+ */
+declare const PureCell: React.ForwardRefExoticComponent<PureCellProps & React.RefAttributes<HTMLElement>> & {
+    Main: React.FC<{
+        children: import("./components/types").MainElement;
+        isReverse?: boolean | undefined;
+        className?: string | undefined;
+        dataTestId?: string | undefined;
+        onClick?: (() => void) | undefined;
+    }>;
+    Graphics: React.FC<import("./components/graphics/index").Props>;
+    Content: React.FC<{
+        children: import("./components/types").ContentElement;
+        dataTestId?: string | undefined;
+    }>;
+    Text: React.FC<{
+        children?: React.ReactNode;
+        rowLimit?: 1 | 2 | undefined;
+        view?: "component" | "primary-large" | "primary-medium" | "primary-small" | "secondary-large" | "component-primary" | undefined;
+        titleWeight?: "bold" | "regular" | undefined;
+        titleColor: "link" | "accent" | "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "tertiary" | "tertiary-inverted" | "attention" | "positive" | "negative" | "static-accent" | "disabled" | "static-primary-light" | "static-secondary-light" | "static-tertiary-light" | "static-primary-dark" | "static-secondary-dark" | "static-tertiary-dark";
+        value?: React.ReactNode;
+        valueColor?: "link" | "accent" | "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "tertiary" | "tertiary-inverted" | "attention" | "positive" | "negative" | "static-accent" | "disabled" | "static-primary-light" | "static-secondary-light" | "static-tertiary-light" | "static-primary-dark" | "static-secondary-dark" | "static-tertiary-dark" | undefined;
+        dataTestId?: string | undefined;
+    }>;
+    Amount: React.FC<{
+        weight?: "bold" | "normal" | undefined;
+        textView?: "component" | "primary-small" | undefined;
+        color?: "link" | "accent" | "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "tertiary" | "tertiary-inverted" | "attention" | "positive" | "negative" | "static-accent" | "disabled" | "static-primary-light" | "static-secondary-light" | "static-tertiary-light" | "static-primary-dark" | "static-secondary-dark" | "static-tertiary-dark" | undefined;
+        dataTestId?: string | undefined;
+    } & Omit<import("./components/typesProps").AmountProps, "dataTestId">>;
+    AmountTitle: React.FC<{
+        color?: "link" | "accent" | "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "tertiary" | "tertiary-inverted" | "attention" | "positive" | "negative" | "static-accent" | "disabled" | "static-primary-light" | "static-secondary-light" | "static-tertiary-light" | "static-primary-dark" | "static-secondary-dark" | "static-tertiary-dark" | undefined;
+        titleProps?: import("@alfalab/core-components-typography").TitleProps | undefined;
+        dataTestId?: string | undefined;
+    } & Omit<import("./components/typesProps").AmountProps, "dataTestId">>;
+    Addon: React.FC<{
+        verticalAlign?: "center" | "auto" | "top" | "bottom" | undefined;
+        addonPadding?: "none" | "default" | undefined;
+        children: import("./components/types").AddonElement;
+        dataTestId?: string | undefined;
+        onClick?: (() => void) | undefined;
+    }>;
+    Footer: React.FC<{
+        children: import("./components/types").FooterElement;
+        footerPadding?: "none" | "default" | undefined;
+        dataTestId?: string | undefined;
+    }>;
+    ExtraSubtitle: React.FC<FooterTextProps>;
+    FooterButton: React.ForwardRefExoticComponent<(Omit<ButtonProps, "dataTestId"> & {
+        dataTestId?: string | undefined;
+    } & Partial<React.AnchorHTMLAttributes<HTMLAnchorElement> | React.ButtonHTMLAttributes<HTMLButtonElement>>) & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
+    Comment: React.FC<import("@alfalab/core-components-comment").CommentProps>;
+    Category: React.FC<{
+        categoryName: string;
+        categoryPercent?: number | undefined;
+        rightAddons?: React.ReactNode;
+        dataTestId?: string | undefined;
+    }>;
+};
+export { PureCellContext, PureCellProps, PureCell };

package/moderncssm/component.js

@@ -0,0 +1,7 @@
+import 'react';
+import 'react-merge-refs';
+import 'classnames';
+import '@alfalab/core-components-comment/moderncssm';
+import '@alfalab/hooks';
+export { P as PureCell, f as PureCellContext } from './component-511ba1c0.js';
+import './index.module.css';

package/moderncssm/components/addon/component.js

@@ -0,0 +1,5 @@
+import 'react';
+import 'classnames';
+import '@alfalab/core-components-shared/moderncssm';
+export { A as Addon } from '../../component-511ba1c0.js';
+import './index.module.css';

package/moderncssm/components/addon/index.d.ts

@@ -0,0 +1 @@
+export * from "../../component-511ba1c0";

package/moderncssm/components/addon/index.js

@@ -0,0 +1 @@
+export { A as Addon } from '../../component-511ba1c0.js';