@alfalab/core-components-pure-cell 4.8.1 → 4.10.0

package/cssm/index.module.css

@@ -37,18 +37,18 @@
     cursor: pointer;
     transition: opacity 0.15s ease-in-out;
     padding: 0
-} .button:hover {
+} .button.hover {
         opacity: 0.8;
-    } .button:active {
+    } .button.active {
         opacity: 0.6;
     } .link {
     text-decoration: none;
     color: inherit;
     cursor: pointer;
     transition: opacity 0.15s ease-in-out
-} .link:hover {
+} .link.hover {
         opacity: 0.8;
-    } .link:active {
+    } .link.active {
         opacity: 0.6;
     } .none {
     padding: 0;

package/cssm/vars.css

@@ -0,0 +1,17 @@
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root {
+} :root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+} :root {
+} :root {
+} :root {
+} :root {
+} :root {
+}

package/{modern/component-ef65ce67.d.ts → esm/component-02d56ae7.d.ts}

@@ -23,6 +23,10 @@ type Props = {
      * Используется модификатор -main
      */
     dataTestId?: string;
+    /**
+     * Клик по контенту.
+     */
+    onClick?: () => void;
 };
 declare const Main: React.FC<Props>;
 type Props$0 = {
@@ -43,6 +47,10 @@ type Props$0 = {
      * Отступ от графики
      */
     graphicPadding?: "airy" | "default" | "compact" | "tiny" | "none";
+    /**
+     * Клик по контенту графики.
+     */
+    onClick?: () => void;
 };
 declare const Graphics: React.FC<Props$0>;
 type Props$1 = {
@@ -174,6 +182,10 @@ type Props$7 = {
      * Используется модификатор -addon
      */
     dataTestId?: string;
+    /**
+     * Клик по контенту аддона.
+     */
+    onClick?: () => void;
 };
 declare const Addon: React.FC<Props$7>;
 type Props$8 = {

package/esm/{component-6a644022.js → component-02d56ae7.js}

@@ -1,5 +1,5 @@
-import { __rest, __assign } from 'tslib';
-import React, { useContext, forwardRef, useRef } from 'react';
+import { __assign, __rest } from 'tslib';
+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/esm';
@@ -9,16 +9,41 @@ import { Amount as Amount$1 } from '@alfalab/core-components-amount/esm';
 import { Typography } from '@alfalab/core-components-typography/esm';
 import { Button } from '@alfalab/core-components-button/esm';
 
-var styles$a = {"component":"pure-cell__component_1769n","none":"pure-cell__none_1769n","default":"pure-cell__default_1769n","addonPadding":"pure-cell__addonPadding_1769n","auto":"pure-cell__auto_1769n","top":"pure-cell__top_1769n","center":"pure-cell__center_1769n","bottom":"pure-cell__bottom_1769n"};
+var styles$a = {"component":"pure-cell__component_10lw5","none":"pure-cell__none_10lw5","default":"pure-cell__default_10lw5","addonPadding":"pure-cell__addonPadding_10lw5","auto":"pure-cell__auto_10lw5","top":"pure-cell__top_10lw5","center":"pure-cell__center_10lw5","bottom":"pure-cell__bottom_10lw5","button":"pure-cell__button_10lw5"};
 require('./components/addon/index.css')
 
+var ADDON_COMPONENT = {
+    button: 'button',
+    section: 'section',
+};
 var Addon = function (_a) {
-    var children = _a.children, _b = _a.verticalAlign, verticalAlign = _b === void 0 ? 'top' : _b, _c = _a.addonPadding, addonPadding = _c === void 0 ? 'default' : _c, dataTestId = _a.dataTestId;
+    var _b;
+    var children = _a.children, _c = _a.verticalAlign, verticalAlign = _c === void 0 ? 'top' : _c, _d = _a.addonPadding, addonPadding = _d === void 0 ? 'default' : _d, dataTestId = _a.dataTestId, onClick = _a.onClick;
     var pureCellContext = useContext(PureCellContext);
-    return (React.createElement("section", { className: cn(styles$a.component, styles$a[addonPadding], styles$a[verticalAlign]), "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'addon') }, children));
+    var Component = onClick ? ADDON_COMPONENT.button : ADDON_COMPONENT.section;
+    var onMouseEvents = {
+        onClick: function (e) {
+            e.stopPropagation();
+            onClick === null || onClick === void 0 ? void 0 : onClick();
+        },
+        onMouseEnter: function () {
+            var _a;
+            (_a = pureCellContext.unsetMainHover) === null || _a === void 0 ? void 0 : _a.call(pureCellContext);
+        },
+        onMouseLeave: function () {
+            var _a;
+            (_a = pureCellContext.setMainHover) === null || _a === void 0 ? void 0 : _a.call(pureCellContext);
+        },
+        onMouseDown: function (e) {
+            e.stopPropagation();
+        },
+    };
+    return (React.createElement(Component, __assign({ className: cn(styles$a.component, styles$a[addonPadding], styles$a[verticalAlign], (_b = {},
+            _b[styles$a.button] = onClick,
+            _b)), "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'addon') }, (onClick && onMouseEvents)), children));
 };
 
-var styles$9 = {"component":"pure-cell__component_1loxt"};
+var styles$9 = {"component":"pure-cell__component_3ozhf"};
 require('./components/amount/index.css')
 
 var Amount = function (_a) {
@@ -28,18 +53,18 @@ var Amount = function (_a) {
         React.createElement(Amount$1, __assign({ minority: minority || minorUnits, bold: weight === 'bold' ? 'full' : 'none', dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'amount') }, restProps))));
 };
 
-var styles$8 = {"component":"pure-cell__component_rcgyg","weight":"pure-cell__weight_rcgyg"};
+var styles$8 = {"component":"pure-cell__component_15g1c","weight":"pure-cell__weight_15g1c"};
 require('./components/amount-title/index.css')
 
 var AmountTitle = function (_a) {
     var minority = _a.minority, _b = _a.minorUnits, minorUnits = _b === void 0 ? 100 : _b, className = _a.className, _c = _a.color, color = _c === void 0 ? 'primary' : _c, dataTestId = _a.dataTestId, _d = _a.titleProps, titleProps = _d === void 0 ? {} : _d, restProps = __rest(_a, ["minority", "minorUnits", "className", "color", "dataTestId", "titleProps"]);
     var pureCellContext = useContext(PureCellContext);
     var titleDefaultProps = __assign({ tag: 'h4', view: 'small', color: color }, titleProps);
-    return (React.createElement(Typography.Title, __assign({}, titleDefaultProps, { dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'amount-title'), className: cn(styles$8.component, titleProps.className) }),
+    return (React.createElement(Typography.TitleResponsive, __assign({}, titleDefaultProps, { dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'amount-title'), className: cn(styles$8.component, titleProps.className) }),
         React.createElement(Amount$1, __assign({ minority: minority || minorUnits, className: cn(styles$8.weight, className), dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'core-amount-title') }, restProps, { bold: 'none' }))));
 };
 
-var styles$7 = {"component":"pure-cell__component_skrok","categoryName":"pure-cell__categoryName_skrok","categoryPercent":"pure-cell__categoryPercent_skrok","rightAddon":"pure-cell__rightAddon_skrok"};
+var styles$7 = {"component":"pure-cell__component_r9n5z","categoryName":"pure-cell__categoryName_r9n5z","categoryPercent":"pure-cell__categoryPercent_r9n5z","rightAddon":"pure-cell__rightAddon_r9n5z"};
 require('./components/category/index.css')
 
 var Category = function (_a) {
@@ -53,7 +78,7 @@ var Category = function (_a) {
         rightAddons !== undefined && (React.createElement("div", { className: styles$7.rightAddon, "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'category-right-addon') }, rightAddons))));
 };
 
-var styles$6 = {"component":"pure-cell__component_usovd","horizontal":"pure-cell__horizontal_usovd"};
+var styles$6 = {"component":"pure-cell__component_3ubiy","horizontal":"pure-cell__horizontal_3ubiy"};
 require('./components/content/index.css')
 
 var Content = function (_a) {
@@ -63,7 +88,7 @@ var Content = function (_a) {
     return (React.createElement("section", { className: cn(styles$6.component, (_b = {}, _b[styles$6.horizontal] = direction === 'horizontal', _b)), "data-test-id": getDataTestId(dataTestId || contextDataTestId, 'content') }, children));
 };
 
-var styles$5 = {"component":"pure-cell__component_17wih","none":"pure-cell__none_17wih","default":"pure-cell__default_17wih"};
+var styles$5 = {"component":"pure-cell__component_uyhv6","none":"pure-cell__none_uyhv6","default":"pure-cell__default_uyhv6"};
 require('./components/footer/index.css')
 
 var Footer = function (_a) {
@@ -72,13 +97,31 @@ var Footer = function (_a) {
     return (React.createElement("footer", { className: cn(styles$5.component, styles$5[footerPadding]), "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'footer') }, children));
 };
 
-var styles$4 = {"component":"pure-cell__component_6ojmm"};
+var styles$4 = {"component":"pure-cell__component_1l487"};
 require('./components/footer-button/index.css')
 
 var FooterButton = forwardRef(function (_a, ref) {
-    var children = _a.children, dataTestId = _a.dataTestId, props = __rest(_a, ["children", "dataTestId"]);
+    var children = _a.children, dataTestId = _a.dataTestId, onClick = _a.onClick, onMouseDown = _a.onMouseDown, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave, props = __rest(_a, ["children", "dataTestId", "onClick", "onMouseDown", "onMouseEnter", "onMouseLeave"]);
     var pureCellContext = useContext(PureCellContext);
-    return (React.createElement(Button, __assign({}, props, { size: 'xxs', dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'button'), className: styles$4.component, ref: ref }), children));
+    var handleClick = function (e) {
+        e.stopPropagation();
+        onClick === null || onClick === void 0 ? void 0 : onClick(e);
+    };
+    var handleMouseEnter = function (e) {
+        var _a;
+        onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(e);
+        (_a = pureCellContext.unsetMainHover) === null || _a === void 0 ? void 0 : _a.call(pureCellContext);
+    };
+    var handleMouseLeave = function (e) {
+        var _a;
+        onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(e);
+        (_a = pureCellContext.setMainHover) === null || _a === void 0 ? void 0 : _a.call(pureCellContext);
+    };
+    var handleMouseDown = function (e) {
+        onMouseDown === null || onMouseDown === void 0 ? void 0 : onMouseDown(e);
+        e.stopPropagation();
+    };
+    return (React.createElement(Button, __assign({}, props, { size: 'xxs', dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'button'), className: styles$4.component, ref: ref, onClick: handleClick, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onMouseDown: handleMouseDown }), children));
 });
 
 var FooterText = function (_a) {
@@ -87,29 +130,72 @@ var FooterText = function (_a) {
     return (React.createElement(Typography.Text, { view: 'primary-small', color: color, "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'footer-title') }, children));
 };
 
-var styles$3 = {"component":"pure-cell__component_xhf99","top":"pure-cell__top_xhf99","center":"pure-cell__center_xhf99","bottom":"pure-cell__bottom_xhf99","horizontal":"pure-cell__horizontal_xhf99","none":"pure-cell__none_xhf99","airy":"pure-cell__airy_xhf99","default":"pure-cell__default_xhf99","compact":"pure-cell__compact_xhf99","tiny":"pure-cell__tiny_xhf99","vertical":"pure-cell__vertical_xhf99"};
+var styles$3 = {"component":"pure-cell__component_1ywkt","top":"pure-cell__top_1ywkt","center":"pure-cell__center_1ywkt","bottom":"pure-cell__bottom_1ywkt","horizontal":"pure-cell__horizontal_1ywkt","none":"pure-cell__none_1ywkt","airy":"pure-cell__airy_1ywkt","default":"pure-cell__default_1ywkt","compact":"pure-cell__compact_1ywkt","tiny":"pure-cell__tiny_1ywkt","vertical":"pure-cell__vertical_1ywkt","button":"pure-cell__button_1ywkt"};
 require('./components/graphics/index.css')
 
+var GRAPHICS_COMPONENT = {
+    button: 'button',
+    section: 'section',
+};
 var Graphics = function (_a) {
-    var children = _a.children, dataTestId = _a.dataTestId, _b = _a.verticalAlign, verticalAlign = _b === void 0 ? 'top' : _b, graphicPadding = _a.graphicPadding;
+    var _b;
+    var children = _a.children, dataTestId = _a.dataTestId, _c = _a.verticalAlign, verticalAlign = _c === void 0 ? 'top' : _c, graphicPadding = _a.graphicPadding, onClick = _a.onClick;
     var pureCellContext = useContext(PureCellContext);
+    var Component = onClick ? GRAPHICS_COMPONENT.button : GRAPHICS_COMPONENT.section;
     var defaultGraphicPadding = pureCellContext.direction === 'horizontal' ? 'airy' : 'default';
-    return (React.createElement("section", { className: cn(styles$3.component, styles$3[verticalAlign], styles$3[pureCellContext.direction || 'horizontal'], styles$3[graphicPadding || defaultGraphicPadding]), "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'graphics') }, children));
+    var onMouseEvents = {
+        onClick: function (e) {
+            e.stopPropagation();
+            onClick === null || onClick === void 0 ? void 0 : onClick();
+        },
+        onMouseEnter: function () {
+            var _a;
+            (_a = pureCellContext.unsetMainHover) === null || _a === void 0 ? void 0 : _a.call(pureCellContext);
+        },
+        onMouseLeave: function () {
+            var _a;
+            (_a = pureCellContext.setMainHover) === null || _a === void 0 ? void 0 : _a.call(pureCellContext);
+        },
+        onMouseDown: function (e) {
+            e.stopPropagation();
+        },
+    };
+    return (React.createElement(Component, __assign({ className: cn(styles$3.component, styles$3[verticalAlign], styles$3[pureCellContext.direction || 'horizontal'], styles$3[graphicPadding || defaultGraphicPadding], (_b = {}, _b[styles$3.button] = onClick, _b)), "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'graphics') }, (onClick && onMouseEvents)), children));
 };
 
-var styles$2 = {"component":"pure-cell__component_19tfu","vertical":"pure-cell__vertical_19tfu","reverse":"pure-cell__reverse_19tfu"};
+var styles$2 = {"component":"pure-cell__component_351av","vertical":"pure-cell__vertical_351av","reverse":"pure-cell__reverse_351av","button":"pure-cell__button_351av"};
 require('./components/main/index.css')
 
+var MAIN_COMPONENT = {
+    button: 'button',
+    section: 'section',
+};
 var Main = function (_a) {
-    var _b;
-    var children = _a.children, isReverse = _a.isReverse, className = _a.className, dataTestId = _a.dataTestId;
-    var _c = useContext(PureCellContext), _d = _c.direction, direction = _d === void 0 ? 'horizontal' : _d, contextDataTestId = _c.dataTestId;
-    return (React.createElement("div", { className: cn(styles$2.component, styles$2[direction], (_b = {},
+    var _b, _c;
+    var children = _a.children, isReverse = _a.isReverse, className = _a.className, dataTestId = _a.dataTestId, onClick = _a.onClick;
+    var _d = useContext(PureCellContext), _e = _d.direction, direction = _e === void 0 ? 'horizontal' : _e, contextDataTestId = _d.dataTestId, setMainHover = _d.setMainHover, unsetMainHover = _d.unsetMainHover;
+    var Component = onClick ? MAIN_COMPONENT.button : MAIN_COMPONENT.section;
+    var onMouseEvents = {
+        onClick: function (e) {
+            e.stopPropagation();
+            onClick === null || onClick === void 0 ? void 0 : onClick();
+        },
+        onMouseEnter: function () {
+            unsetMainHover === null || unsetMainHover === void 0 ? void 0 : unsetMainHover();
+        },
+        onMouseLeave: function () {
+            setMainHover === null || setMainHover === void 0 ? void 0 : setMainHover();
+        },
+        onMouseDown: function (e) {
+            e.stopPropagation();
+        },
+    };
+    return (React.createElement(Component, __assign({ className: cn(styles$2.component, styles$2[direction], (_b = {},
             _b[styles$2.reverse] = isReverse,
-            _b), className), "data-test-id": getDataTestId(dataTestId || contextDataTestId, 'main') }, children));
+            _b), (_c = {}, _c[styles$2.button] = onClick, _c), className), "data-test-id": getDataTestId(dataTestId || contextDataTestId, 'main') }, (onClick && onMouseEvents)), children));
 };
 
-var styles$1 = {"horizontal":"pure-cell__horizontal_1ima4","rowLimit1":"pure-cell__rowLimit1_1ima4","rowLimit2":"pure-cell__rowLimit2_1ima4","component":"pure-cell__component_1ima4","vertical":"pure-cell__vertical_1ima4","title":"pure-cell__title_1ima4","value":"pure-cell__value_1ima4"};
+var styles$1 = {"horizontal":"pure-cell__horizontal_g10oe","rowLimit1":"pure-cell__rowLimit1_g10oe","rowLimit2":"pure-cell__rowLimit2_g10oe","component":"pure-cell__component_g10oe","vertical":"pure-cell__vertical_g10oe","title":"pure-cell__title_g10oe","value":"pure-cell__value_g10oe"};
 require('./components/text/index.css')
 
 var Text = function (_a) {
@@ -126,7 +212,7 @@ var Text = function (_a) {
             React.createElement(Typography.Text, { view: view, tag: 'div', color: valueColor, className: className, "data-test-id": getDataTestId(dataTestId || contextDataTestId, 'text_value') }, value)))));
 };
 
-var styles = {"component":"pure-cell__component_1vn59","horizontal":"pure-cell__horizontal_1vn59","vertical":"pure-cell__vertical_1vn59","button":"pure-cell__button_1vn59","link":"pure-cell__link_1vn59","none":"pure-cell__none_1vn59","airy":"pure-cell__airy_1vn59","default":"pure-cell__default_1vn59","compact":"pure-cell__compact_1vn59","tiny":"pure-cell__tiny_1vn59","noneTop":"pure-cell__noneTop_1vn59","airyTop":"pure-cell__airyTop_1vn59","defaultTop":"pure-cell__defaultTop_1vn59","compactTop":"pure-cell__compactTop_1vn59","tinyTop":"pure-cell__tinyTop_1vn59","noneBottom":"pure-cell__noneBottom_1vn59","airyBottom":"pure-cell__airyBottom_1vn59","defaultBottom":"pure-cell__defaultBottom_1vn59","compactBottom":"pure-cell__compactBottom_1vn59","tinyBottom":"pure-cell__tinyBottom_1vn59","left":"pure-cell__left_1vn59","right":"pure-cell__right_1vn59","both":"pure-cell__both_1vn59","focused":"pure-cell__focused_1vn59"};
+var styles = {"component":"pure-cell__component_8dxyc","horizontal":"pure-cell__horizontal_8dxyc","vertical":"pure-cell__vertical_8dxyc","button":"pure-cell__button_8dxyc","hover":"pure-cell__hover_8dxyc","active":"pure-cell__active_8dxyc","link":"pure-cell__link_8dxyc","none":"pure-cell__none_8dxyc","airy":"pure-cell__airy_8dxyc","default":"pure-cell__default_8dxyc","compact":"pure-cell__compact_8dxyc","tiny":"pure-cell__tiny_8dxyc","noneTop":"pure-cell__noneTop_8dxyc","airyTop":"pure-cell__airyTop_8dxyc","defaultTop":"pure-cell__defaultTop_8dxyc","compactTop":"pure-cell__compactTop_8dxyc","tinyTop":"pure-cell__tinyTop_8dxyc","noneBottom":"pure-cell__noneBottom_8dxyc","airyBottom":"pure-cell__airyBottom_8dxyc","defaultBottom":"pure-cell__defaultBottom_8dxyc","compactBottom":"pure-cell__compactBottom_8dxyc","tinyBottom":"pure-cell__tinyBottom_8dxyc","left":"pure-cell__left_8dxyc","right":"pure-cell__right_8dxyc","both":"pure-cell__both_8dxyc","focused":"pure-cell__focused_8dxyc"};
 require('./index.css')
 
 // eslint-disable-next-line @typescript-eslint/no-redeclare
@@ -136,12 +222,32 @@ var PureCellComponent = forwardRef(function (_a, ref) {
     var className = _a.className, dataTestId = _a.dataTestId, onClick = _a.onClick, href = _a.href, _d = _a.tag, Component = _d === void 0 ? (href && 'a') || (onClick && 'button') || 'section' : _d, children = _a.children, _e = _a.horizontalPadding, horizontalPadding = _e === void 0 ? 'none' : _e, _f = _a.verticalPadding, verticalPadding = _f === void 0 ? 'none' : _f, _g = _a.direction, direction = _g === void 0 ? 'horizontal' : _g, restProps = __rest(_a, ["className", "dataTestId", "onClick", "href", "tag", "children", "horizontalPadding", "verticalPadding", "direction"]);
     var cellRef = useRef(null);
     var focused = useFocus(cellRef, 'keyboard')[0];
+    var _h = useState(false), hoverState = _h[0], setHoverState = _h[1];
+    var _j = useState(false), activeState = _j[0], setActiveState = _j[1];
+    var setHover = function () { return setHoverState(true); };
+    var unsetHover = function () { return setHoverState(false); };
+    var setActive = function () { return setActiveState(true); };
+    var unsetActive = function () { return setActiveState(false); };
+    var mouseEvents = {
+        onMouseEnter: setHover,
+        onMouseLeave: unsetHover,
+        onMouseDown: setActive,
+        onMouseUp: unsetActive,
+    };
     var addClasses = (_b = {},
         _b[styles.component] = true,
         _b[styles.focused] = focused,
         _b[styles[direction]] = true,
         _b[styles[horizontalPadding]] = true,
+        _b[styles.hover] = hoverState,
+        _b[styles.active] = activeState,
         _b);
+    var contextState = {
+        direction: direction,
+        dataTestId: dataTestId,
+        setMainHover: setHover,
+        unsetMainHover: unsetHover,
+    };
     if (typeof verticalPadding === 'string') {
         addClasses[styles[verticalPadding]] = typeof verticalPadding === 'string';
     }
@@ -153,15 +259,15 @@ var PureCellComponent = forwardRef(function (_a, ref) {
         var target = restProps.target;
         // Для совместимости с react-router-dom, меняем href на to
         var hrefProps = (_c = {}, _c[typeof Component === 'string' ? 'href' : 'to'] = href, _c);
-        return (React.createElement(Component, __assign({ rel: target === '_blank' ? 'noreferrer noopener' : undefined }, restProps, hrefProps, { ref: mergeRefs([cellRef, ref]), className: cn(styles.link, addClasses, className), "data-test-id": dataTestId, onClick: onClick }),
-            React.createElement(PureCellContext.Provider, { value: { direction: direction, dataTestId: dataTestId } }, children)));
+        return (React.createElement(Component, __assign({ rel: target === '_blank' ? 'noreferrer noopener' : undefined }, restProps, hrefProps, { ref: mergeRefs([cellRef, ref]), className: cn(styles.link, addClasses, className), "data-test-id": dataTestId, onClick: onClick }, mouseEvents),
+            React.createElement(PureCellContext.Provider, { value: contextState }, children)));
     }
     if (onClick) {
-        return (React.createElement(Component, __assign({}, restProps, { ref: mergeRefs([cellRef, ref]), className: cn(styles.button, addClasses, className), "data-test-id": dataTestId, onClick: onClick }),
-            React.createElement(PureCellContext.Provider, { value: { direction: direction, dataTestId: dataTestId } }, children)));
+        return (React.createElement(Component, __assign({}, restProps, { ref: mergeRefs([cellRef, ref]), className: cn(styles.button, addClasses, className), "data-test-id": dataTestId, onClick: onClick }, mouseEvents),
+            React.createElement(PureCellContext.Provider, { value: contextState }, children)));
     }
     return (React.createElement(Component, __assign({}, restProps, { ref: ref, tabIndex: 0, className: cn(addClasses, className), "data-test-id": dataTestId }),
-        React.createElement(PureCellContext.Provider, { value: { direction: direction, dataTestId: dataTestId } }, children)));
+        React.createElement(PureCellContext.Provider, { value: contextState }, children)));
 });
 /**
  * Универсальный конструктор для сборки любой ячейки.

package/{cssm/component-21d7b687.d.ts → esm/component-6a954af1.d.ts}

@@ -7,6 +7,8 @@ type PureCellContext = {
     /** Направление */
     direction?: 'horizontal' | 'vertical';
     dataTestId?: string;
+    setMainHover?: () => void;
+    unsetMainHover?: () => void;
 };
 declare const PureCellContext: React.Context<PureCellContext>;
 type BasePureCellProps = {
@@ -67,6 +69,7 @@ declare const PureCell: React.ForwardRefExoticComponent<PureCellProps & React.Re
         isReverse?: boolean | undefined;
         className?: string | undefined;
         dataTestId?: string | undefined;
+        onClick?: (() => void) | undefined;
     }>;
     Graphics: React.FC<import("./components/graphics/index").Props>;
     Content: React.FC<{
@@ -99,6 +102,7 @@ declare const PureCell: React.ForwardRefExoticComponent<PureCellProps & React.Re
         addonPadding?: "none" | "default" | undefined;
         children: import("./components/types").AddonElement;
         dataTestId?: string | undefined;
+        onClick?: (() => void) | undefined;
     }>;
     Footer: React.FC<{
         children: import("./components/types").FooterElement;

package/esm/component.js

@@ -4,4 +4,4 @@ import 'react-merge-refs';
 import 'classnames';
 import '@alfalab/core-components-comment/esm';
 import '@alfalab/hooks';
-export { P as PureCell, f as PureCellContext } from './component-6a644022.js';
+export { P as PureCell, f as PureCellContext } from './component-02d56ae7.js';

package/esm/components/addon/component.js

@@ -1,4 +1,5 @@
+import 'tslib';
 import 'react';
 import 'classnames';
 import '@alfalab/core-components-shared/esm';
-export { A as Addon } from '../../component-6a644022.js';
+export { A as Addon } from '../../component-02d56ae7.js';

package/esm/components/addon/index.css

@@ -1,4 +1,4 @@
-/* hash: sxa08 */
+/* hash: 8ebll */
 :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -15,24 +15,49 @@
     --gap-m: 16px;
 } :root {
 } :root {
-} .pure-cell__component_1769n {
+} :root {
+    --pure-cell-clickable-area-hover-opacity: 1;
+    --pure-cell-clickable-area-active-opacity: 1;
+} .pure-cell__component_10lw5 {
     display: flex;
     flex-direction: column;
     align-items: flex-end
-} .pure-cell__component_1769n > * {
+} .pure-cell__component_10lw5 > * {
         justify-content: flex-end;
-    } .pure-cell__component_1769n.pure-cell__none_1769n {
+    } .pure-cell__component_10lw5.pure-cell__none_10lw5 {
         padding-left: 0;
-    } .pure-cell__component_1769n.pure-cell__default_1769n {
+    } .pure-cell__component_10lw5.pure-cell__default_10lw5 {
         padding-left: var(--gap-m);
-    } .pure-cell__component_1769n.pure-cell__addonPadding_1769n {
+    } .pure-cell__component_10lw5.pure-cell__addonPadding_10lw5 {
         padding-left: var(--gap-m);
-    } .pure-cell__component_1769n.pure-cell__auto_1769n {
+    } .pure-cell__component_10lw5.pure-cell__auto_10lw5 {
         align-self: auto;
-    } .pure-cell__component_1769n.pure-cell__top_1769n {
+    } .pure-cell__component_10lw5.pure-cell__top_10lw5 {
         align-self: flex-start;
-    } .pure-cell__component_1769n.pure-cell__center_1769n {
+    } .pure-cell__component_10lw5.pure-cell__center_10lw5 {
         align-self: center;
-    } .pure-cell__component_1769n.pure-cell__bottom_1769n {
+    } .pure-cell__component_10lw5.pure-cell__bottom_10lw5 {
         align-self: flex-end;
+    } .pure-cell__button_10lw5 {
+    box-sizing: border-box;
+    background-color: transparent;
+    -webkit-tap-highlight-color: transparent;
+    outline: none;
+    border: 0;
+    margin: 0;
+    box-shadow: none;
+    border-radius: 0;
+    -webkit-user-select: none;
+            user-select: none;
+    vertical-align: middle;
+    appearance: none;
+    text-decoration: none;
+    min-width: 0;
+    cursor: pointer;
+    padding: 0;
+    transition: opacity 0.15s ease-in-out
+} .pure-cell__button_10lw5:hover {
+        opacity: var(--pure-cell-clickable-area-hover-opacity);
+    } .pure-cell__button_10lw5:active {
+        opacity: var(--pure-cell-clickable-area-active-opacity);
     }

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

@@ -1 +1 @@
-export * from "../../component-6a644022";
+export * from "../../component-02d56ae7";

package/esm/components/addon/index.js

@@ -1 +1 @@
-export { A as Addon } from '../../component-6a644022.js';
+export { A as Addon } from '../../component-02d56ae7.js';

package/esm/components/amount/component.js

@@ -4,4 +4,4 @@ import 'classnames';
 import '@alfalab/core-components-amount/esm';
 import '@alfalab/core-components-shared/esm';
 import '@alfalab/core-components-typography/esm';
-export { a as Amount } from '../../component-6a644022.js';
+export { a as Amount } from '../../component-02d56ae7.js';

package/esm/components/amount/index.css

@@ -1,4 +1,4 @@
-/* hash: 1oonj */
+/* hash: wm8p4 */
 :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -15,7 +15,7 @@
     --gap-3xs: 2px;
 } :root {
 } :root {
-} .pure-cell__component_1loxt {
+} .pure-cell__component_3ozhf {
     padding: var(--gap-3xs) 0;
     display: flex;
 }

package/esm/components/amount/index.d.ts

@@ -1 +1 @@
-export * from "../../component-6a644022";
+export * from "../../component-02d56ae7";

package/esm/components/amount/index.js

@@ -1 +1 @@
-export { a as Amount } from '../../component-6a644022.js';
+export { a as Amount } from '../../component-02d56ae7.js';

package/esm/components/amount-title/component.js

@@ -4,4 +4,4 @@ import 'classnames';
 import '@alfalab/core-components-amount/esm';
 import '@alfalab/core-components-shared/esm';
 import '@alfalab/core-components-typography/esm';
-export { b as AmountTitle } from '../../component-6a644022.js';
+export { b as AmountTitle } from '../../component-02d56ae7.js';

package/esm/components/amount-title/index.css

@@ -1,4 +1,4 @@
-/* hash: znsy9 */
+/* hash: 4icg4 */
 :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -14,8 +14,8 @@
 } :root {
 } :root {
 } :root {
-} .pure-cell__component_rcgyg {
+} .pure-cell__component_15g1c {
     display: flex;
-} .pure-cell__weight_rcgyg {
+} .pure-cell__weight_15g1c {
     font-weight: inherit;
 }

package/esm/components/amount-title/index.d.ts

@@ -1 +1 @@
-export * from "../../component-6a644022";
+export * from "../../component-02d56ae7";

package/esm/components/amount-title/index.js

@@ -1 +1 @@
-export { b as AmountTitle } from '../../component-6a644022.js';
+export { b as AmountTitle } from '../../component-02d56ae7.js';

package/esm/components/category/component.js

@@ -1,4 +1,4 @@
 import 'react';
 import '@alfalab/core-components-shared/esm';
 import '@alfalab/core-components-typography/esm';
-export { C as Category } from '../../component-6a644022.js';
+export { C as Category } from '../../component-02d56ae7.js';

package/esm/components/category/index.css

@@ -1,4 +1,4 @@
-/* hash: cz7e1 */
+/* hash: 1jxwm */
 :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-bg-secondary: #f2f3f5; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -19,21 +19,21 @@
     --gap-xs: 8px;
 } :root {
 } :root {
-} .pure-cell__component_skrok {
+} .pure-cell__component_r9n5z {
     display: flex;
     overflow: hidden;
     padding: var(--gap-3xs) 0;
-} .pure-cell__categoryName_skrok {
+} .pure-cell__categoryName_r9n5z {
     display: -webkit-box;
     -webkit-line-clamp: 1;
     -webkit-box-orient: vertical;
     overflow: hidden;
     word-break: break-all;
-} .pure-cell__categoryPercent_skrok {
+} .pure-cell__categoryPercent_r9n5z {
     padding: 0 var(--gap-xs);
     background-color: var(--color-light-bg-secondary);
     border-radius: var(--border-radius-xl);
     margin-left: var(--gap-2xs);
-} .pure-cell__rightAddon_skrok {
+} .pure-cell__rightAddon_r9n5z {
     margin-left: var(--gap-2xs);
 }

package/esm/components/category/index.d.ts

@@ -1 +1 @@
-export * from "../../component-6a644022";
+export * from "../../component-02d56ae7";

package/esm/components/category/index.js

@@ -1 +1 @@
-export { C as Category } from '../../component-6a644022.js';
+export { C as Category } from '../../component-02d56ae7.js';

package/esm/components/content/component.js

@@ -1,4 +1,4 @@
 import 'react';
 import 'classnames';
 import '@alfalab/core-components-shared/esm';
-export { c as Content } from '../../component-6a644022.js';
+export { c as Content } from '../../component-02d56ae7.js';