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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (205) hide show
  1. package/{esm/component-6a644022.d.ts → component-5aa16b0d.d.ts} +12 -0
  2. package/{component-81e75437.js → component-5aa16b0d.js} +133 -27
  3. package/{component-21d7b687.d.ts → component-6a954af1.d.ts} +4 -0
  4. package/component.js +1 -1
  5. package/components/addon/component.js +2 -1
  6. package/components/addon/index.css +35 -10
  7. package/components/addon/index.d.ts +1 -1
  8. package/components/addon/index.js +1 -1
  9. package/components/amount/component.js +1 -1
  10. package/components/amount/index.css +2 -2
  11. package/components/amount/index.d.ts +1 -1
  12. package/components/amount/index.js +1 -1
  13. package/components/amount-title/component.js +1 -1
  14. package/components/amount-title/index.css +3 -3
  15. package/components/amount-title/index.d.ts +1 -1
  16. package/components/amount-title/index.js +1 -1
  17. package/components/category/component.js +1 -1
  18. package/components/category/index.css +5 -5
  19. package/components/category/index.d.ts +1 -1
  20. package/components/category/index.js +1 -1
  21. package/components/content/component.js +1 -1
  22. package/components/content/index.css +3 -3
  23. package/components/content/index.d.ts +1 -1
  24. package/components/content/index.js +1 -1
  25. package/components/footer/component.js +1 -1
  26. package/components/footer/index.css +4 -4
  27. package/components/footer/index.d.ts +1 -1
  28. package/components/footer/index.js +1 -1
  29. package/components/footer-button/component.js +1 -1
  30. package/components/footer-button/index.css +2 -2
  31. package/components/footer-button/index.d.ts +1 -1
  32. package/components/footer-button/index.js +1 -1
  33. package/components/footer-text/component.js +1 -1
  34. package/components/footer-text/index.d.ts +1 -1
  35. package/components/footer-text/index.js +1 -1
  36. package/components/graphics/component.js +2 -1
  37. package/components/graphics/index.css +41 -15
  38. package/components/graphics/index.d.ts +1 -1
  39. package/components/graphics/index.js +1 -1
  40. package/components/main/component.js +2 -1
  41. package/components/main/index.css +31 -5
  42. package/components/main/index.d.ts +1 -1
  43. package/components/main/index.js +1 -1
  44. package/components/text/component.js +1 -1
  45. package/components/text/index.css +7 -7
  46. package/components/text/index.d.ts +1 -1
  47. package/components/text/index.js +1 -1
  48. package/{esm/component-21d7b687.d.ts → cssm/component-6a954af1.d.ts} +4 -0
  49. package/{component-81e75437.d.ts → cssm/component-719b272a.d.ts} +12 -0
  50. package/cssm/{component-063660c0.js → component-719b272a.js} +122 -16
  51. package/cssm/component.js +1 -1
  52. package/cssm/components/addon/component.js +2 -1
  53. package/cssm/components/addon/index.d.ts +1 -1
  54. package/cssm/components/addon/index.js +1 -1
  55. package/cssm/components/addon/index.module.css +25 -0
  56. package/cssm/components/amount/component.js +1 -1
  57. package/cssm/components/amount/index.d.ts +1 -1
  58. package/cssm/components/amount/index.js +1 -1
  59. package/cssm/components/amount-title/component.js +1 -1
  60. package/cssm/components/amount-title/index.d.ts +1 -1
  61. package/cssm/components/amount-title/index.js +1 -1
  62. package/cssm/components/category/component.js +1 -1
  63. package/cssm/components/category/index.d.ts +1 -1
  64. package/cssm/components/category/index.js +1 -1
  65. package/cssm/components/content/component.js +1 -1
  66. package/cssm/components/content/index.d.ts +1 -1
  67. package/cssm/components/content/index.js +1 -1
  68. package/cssm/components/footer/component.js +1 -1
  69. package/cssm/components/footer/index.d.ts +1 -1
  70. package/cssm/components/footer/index.js +1 -1
  71. package/cssm/components/footer-button/component.js +1 -1
  72. package/cssm/components/footer-button/index.d.ts +1 -1
  73. package/cssm/components/footer-button/index.js +1 -1
  74. package/cssm/components/footer-text/component.js +1 -1
  75. package/cssm/components/footer-text/index.d.ts +1 -1
  76. package/cssm/components/footer-text/index.js +1 -1
  77. package/cssm/components/graphics/component.js +2 -1
  78. package/cssm/components/graphics/index.d.ts +1 -1
  79. package/cssm/components/graphics/index.js +1 -1
  80. package/cssm/components/graphics/index.module.css +26 -0
  81. package/cssm/components/main/component.js +2 -1
  82. package/cssm/components/main/index.d.ts +1 -1
  83. package/cssm/components/main/index.js +1 -1
  84. package/cssm/components/main/index.module.css +27 -1
  85. package/cssm/components/text/component.js +1 -1
  86. package/cssm/components/text/index.d.ts +1 -1
  87. package/cssm/components/text/index.js +1 -1
  88. package/cssm/index.d.ts +2 -2
  89. package/cssm/index.js +1 -1
  90. package/cssm/index.module.css +4 -4
  91. package/cssm/vars.css +17 -0
  92. package/{cssm/component-21d7b687.d.ts → esm/component-6a954af1.d.ts} +4 -0
  93. package/{modern/component-ef65ce67.d.ts → esm/component-f3f965f3.d.ts} +12 -0
  94. package/esm/{component-6a644022.js → component-f3f965f3.js} +135 -29
  95. package/esm/component.js +1 -1
  96. package/esm/components/addon/component.js +2 -1
  97. package/esm/components/addon/index.css +35 -10
  98. package/esm/components/addon/index.d.ts +1 -1
  99. package/esm/components/addon/index.js +1 -1
  100. package/esm/components/amount/component.js +1 -1
  101. package/esm/components/amount/index.css +2 -2
  102. package/esm/components/amount/index.d.ts +1 -1
  103. package/esm/components/amount/index.js +1 -1
  104. package/esm/components/amount-title/component.js +1 -1
  105. package/esm/components/amount-title/index.css +3 -3
  106. package/esm/components/amount-title/index.d.ts +1 -1
  107. package/esm/components/amount-title/index.js +1 -1
  108. package/esm/components/category/component.js +1 -1
  109. package/esm/components/category/index.css +5 -5
  110. package/esm/components/category/index.d.ts +1 -1
  111. package/esm/components/category/index.js +1 -1
  112. package/esm/components/content/component.js +1 -1
  113. package/esm/components/content/index.css +3 -3
  114. package/esm/components/content/index.d.ts +1 -1
  115. package/esm/components/content/index.js +1 -1
  116. package/esm/components/footer/component.js +1 -1
  117. package/esm/components/footer/index.css +4 -4
  118. package/esm/components/footer/index.d.ts +1 -1
  119. package/esm/components/footer/index.js +1 -1
  120. package/esm/components/footer-button/component.js +1 -1
  121. package/esm/components/footer-button/index.css +2 -2
  122. package/esm/components/footer-button/index.d.ts +1 -1
  123. package/esm/components/footer-button/index.js +1 -1
  124. package/esm/components/footer-text/component.js +1 -1
  125. package/esm/components/footer-text/index.d.ts +1 -1
  126. package/esm/components/footer-text/index.js +1 -1
  127. package/esm/components/graphics/component.js +2 -1
  128. package/esm/components/graphics/index.css +41 -15
  129. package/esm/components/graphics/index.d.ts +1 -1
  130. package/esm/components/graphics/index.js +1 -1
  131. package/esm/components/main/component.js +2 -1
  132. package/esm/components/main/index.css +31 -5
  133. package/esm/components/main/index.d.ts +1 -1
  134. package/esm/components/main/index.js +1 -1
  135. package/esm/components/text/component.js +1 -1
  136. package/esm/components/text/index.css +7 -7
  137. package/esm/components/text/index.d.ts +1 -1
  138. package/esm/components/text/index.js +1 -1
  139. package/esm/index.css +29 -29
  140. package/esm/index.d.ts +2 -2
  141. package/esm/index.js +1 -1
  142. package/index.css +29 -29
  143. package/index.d.ts +2 -2
  144. package/index.js +1 -1
  145. package/{cssm/component-063660c0.d.ts → modern/component-1f635679.d.ts} +12 -0
  146. package/modern/{component-ef65ce67.js → component-1f635679.js} +125 -27
  147. package/modern/{component-21d7b687.d.ts → component-6a954af1.d.ts} +4 -0
  148. package/modern/component.js +1 -1
  149. package/modern/components/addon/component.js +1 -1
  150. package/modern/components/addon/index.css +35 -10
  151. package/modern/components/addon/index.d.ts +1 -1
  152. package/modern/components/addon/index.js +1 -1
  153. package/modern/components/amount/component.js +1 -1
  154. package/modern/components/amount/index.css +2 -2
  155. package/modern/components/amount/index.d.ts +1 -1
  156. package/modern/components/amount/index.js +1 -1
  157. package/modern/components/amount-title/component.js +1 -1
  158. package/modern/components/amount-title/index.css +3 -3
  159. package/modern/components/amount-title/index.d.ts +1 -1
  160. package/modern/components/amount-title/index.js +1 -1
  161. package/modern/components/category/component.js +1 -1
  162. package/modern/components/category/index.css +5 -5
  163. package/modern/components/category/index.d.ts +1 -1
  164. package/modern/components/category/index.js +1 -1
  165. package/modern/components/content/component.js +1 -1
  166. package/modern/components/content/index.css +3 -3
  167. package/modern/components/content/index.d.ts +1 -1
  168. package/modern/components/content/index.js +1 -1
  169. package/modern/components/footer/component.js +1 -1
  170. package/modern/components/footer/index.css +4 -4
  171. package/modern/components/footer/index.d.ts +1 -1
  172. package/modern/components/footer/index.js +1 -1
  173. package/modern/components/footer-button/component.js +1 -1
  174. package/modern/components/footer-button/index.css +2 -2
  175. package/modern/components/footer-button/index.d.ts +1 -1
  176. package/modern/components/footer-button/index.js +1 -1
  177. package/modern/components/footer-text/component.js +1 -1
  178. package/modern/components/footer-text/index.d.ts +1 -1
  179. package/modern/components/footer-text/index.js +1 -1
  180. package/modern/components/graphics/component.js +1 -1
  181. package/modern/components/graphics/index.css +41 -15
  182. package/modern/components/graphics/index.d.ts +1 -1
  183. package/modern/components/graphics/index.js +1 -1
  184. package/modern/components/main/component.js +1 -1
  185. package/modern/components/main/index.css +31 -5
  186. package/modern/components/main/index.d.ts +1 -1
  187. package/modern/components/main/index.js +1 -1
  188. package/modern/components/text/component.js +1 -1
  189. package/modern/components/text/index.css +7 -7
  190. package/modern/components/text/index.d.ts +1 -1
  191. package/modern/components/text/index.js +1 -1
  192. package/modern/index.css +29 -29
  193. package/modern/index.d.ts +2 -2
  194. package/modern/index.js +1 -1
  195. package/package.json +3 -3
  196. package/src/component.tsx +33 -5
  197. package/src/components/addon/component.tsx +35 -3
  198. package/src/components/addon/index.module.css +15 -1
  199. package/src/components/footer-button/component.tsx +32 -1
  200. package/src/components/graphics/component.tsx +33 -2
  201. package/src/components/graphics/index.module.css +16 -1
  202. package/src/components/main/component.tsx +39 -4
  203. package/src/components/main/index.module.css +16 -1
  204. package/src/index.module.css +4 -4
  205. package/src/vars.css +6 -0
@@ -39,10 +39,35 @@ var styles__default$9 = /*#__PURE__*/_interopDefaultCompat(styles$9);
39
39
  var styles__default$a = /*#__PURE__*/_interopDefaultCompat(styles$a);
40
40
  var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
41
41
 
42
+ var ADDON_COMPONENT = {
43
+ button: 'button',
44
+ section: 'section',
45
+ };
42
46
  var Addon = function (_a) {
43
- 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;
47
+ var _b;
48
+ 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;
44
49
  var pureCellContext = React.useContext(PureCellContext);
45
- return (React__default.default.createElement("section", { className: cn__default.default(styles__default.default.component, styles__default.default[addonPadding], styles__default.default[verticalAlign]), "data-test-id": coreComponentsShared.getDataTestId(dataTestId || pureCellContext.dataTestId, 'addon') }, children));
50
+ var Component = onClick ? ADDON_COMPONENT.button : ADDON_COMPONENT.section;
51
+ var onMouseEvents = {
52
+ onClick: function (e) {
53
+ e.stopPropagation();
54
+ onClick === null || onClick === void 0 ? void 0 : onClick();
55
+ },
56
+ onMouseEnter: function () {
57
+ var _a;
58
+ (_a = pureCellContext.unsetMainHover) === null || _a === void 0 ? void 0 : _a.call(pureCellContext);
59
+ },
60
+ onMouseLeave: function () {
61
+ var _a;
62
+ (_a = pureCellContext.setMainHover) === null || _a === void 0 ? void 0 : _a.call(pureCellContext);
63
+ },
64
+ onMouseDown: function (e) {
65
+ e.stopPropagation();
66
+ },
67
+ };
68
+ return (React__default.default.createElement(Component, tslib.__assign({ className: cn__default.default(styles__default.default.component, styles__default.default[addonPadding], styles__default.default[verticalAlign], (_b = {},
69
+ _b[styles__default.default.button] = onClick,
70
+ _b)), "data-test-id": coreComponentsShared.getDataTestId(dataTestId || pureCellContext.dataTestId, 'addon') }, (onClick && onMouseEvents)), children));
46
71
  };
47
72
 
48
73
  var Amount = function (_a) {
@@ -85,9 +110,27 @@ var Footer = function (_a) {
85
110
  };
86
111
 
87
112
  var FooterButton = React.forwardRef(function (_a, ref) {
88
- var children = _a.children, dataTestId = _a.dataTestId, props = tslib.__rest(_a, ["children", "dataTestId"]);
113
+ var children = _a.children, dataTestId = _a.dataTestId, onClick = _a.onClick, onMouseDown = _a.onMouseDown, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave, props = tslib.__rest(_a, ["children", "dataTestId", "onClick", "onMouseDown", "onMouseEnter", "onMouseLeave"]);
89
114
  var pureCellContext = React.useContext(PureCellContext);
90
- return (React__default.default.createElement(coreComponentsButton.Button, tslib.__assign({}, props, { size: 'xxs', dataTestId: coreComponentsShared.getDataTestId(dataTestId || pureCellContext.dataTestId, 'button'), className: styles__default$6.default.component, ref: ref }), children));
115
+ var handleClick = function (e) {
116
+ e.stopPropagation();
117
+ onClick === null || onClick === void 0 ? void 0 : onClick(e);
118
+ };
119
+ var handleMouseEnter = function (e) {
120
+ var _a;
121
+ onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(e);
122
+ (_a = pureCellContext.unsetMainHover) === null || _a === void 0 ? void 0 : _a.call(pureCellContext);
123
+ };
124
+ var handleMouseLeave = function (e) {
125
+ var _a;
126
+ onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(e);
127
+ (_a = pureCellContext.setMainHover) === null || _a === void 0 ? void 0 : _a.call(pureCellContext);
128
+ };
129
+ var handleMouseDown = function (e) {
130
+ onMouseDown === null || onMouseDown === void 0 ? void 0 : onMouseDown(e);
131
+ e.stopPropagation();
132
+ };
133
+ return (React__default.default.createElement(coreComponentsButton.Button, tslib.__assign({}, props, { size: 'xxs', dataTestId: coreComponentsShared.getDataTestId(dataTestId || pureCellContext.dataTestId, 'button'), className: styles__default$6.default.component, ref: ref, onClick: handleClick, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onMouseDown: handleMouseDown }), children));
91
134
  });
92
135
 
93
136
  var FooterText = function (_a) {
@@ -96,20 +139,63 @@ var FooterText = function (_a) {
96
139
  return (React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-small', color: color, "data-test-id": coreComponentsShared.getDataTestId(dataTestId || pureCellContext.dataTestId, 'footer-title') }, children));
97
140
  };
98
141
 
142
+ var GRAPHICS_COMPONENT = {
143
+ button: 'button',
144
+ section: 'section',
145
+ };
99
146
  var Graphics = function (_a) {
100
- var children = _a.children, dataTestId = _a.dataTestId, _b = _a.verticalAlign, verticalAlign = _b === void 0 ? 'top' : _b, graphicPadding = _a.graphicPadding;
147
+ var _b;
148
+ var children = _a.children, dataTestId = _a.dataTestId, _c = _a.verticalAlign, verticalAlign = _c === void 0 ? 'top' : _c, graphicPadding = _a.graphicPadding, onClick = _a.onClick;
101
149
  var pureCellContext = React.useContext(PureCellContext);
150
+ var Component = onClick ? GRAPHICS_COMPONENT.button : GRAPHICS_COMPONENT.section;
102
151
  var defaultGraphicPadding = pureCellContext.direction === 'horizontal' ? 'airy' : 'default';
103
- return (React__default.default.createElement("section", { className: cn__default.default(styles__default$7.default.component, styles__default$7.default[verticalAlign], styles__default$7.default[pureCellContext.direction || 'horizontal'], styles__default$7.default[graphicPadding || defaultGraphicPadding]), "data-test-id": coreComponentsShared.getDataTestId(dataTestId || pureCellContext.dataTestId, 'graphics') }, children));
152
+ var onMouseEvents = {
153
+ onClick: function (e) {
154
+ e.stopPropagation();
155
+ onClick === null || onClick === void 0 ? void 0 : onClick();
156
+ },
157
+ onMouseEnter: function () {
158
+ var _a;
159
+ (_a = pureCellContext.unsetMainHover) === null || _a === void 0 ? void 0 : _a.call(pureCellContext);
160
+ },
161
+ onMouseLeave: function () {
162
+ var _a;
163
+ (_a = pureCellContext.setMainHover) === null || _a === void 0 ? void 0 : _a.call(pureCellContext);
164
+ },
165
+ onMouseDown: function (e) {
166
+ e.stopPropagation();
167
+ },
168
+ };
169
+ return (React__default.default.createElement(Component, tslib.__assign({ className: cn__default.default(styles__default$7.default.component, styles__default$7.default[verticalAlign], styles__default$7.default[pureCellContext.direction || 'horizontal'], styles__default$7.default[graphicPadding || defaultGraphicPadding], (_b = {}, _b[styles__default$7.default.button] = onClick, _b)), "data-test-id": coreComponentsShared.getDataTestId(dataTestId || pureCellContext.dataTestId, 'graphics') }, (onClick && onMouseEvents)), children));
104
170
  };
105
171
 
172
+ var MAIN_COMPONENT = {
173
+ button: 'button',
174
+ section: 'section',
175
+ };
106
176
  var Main = function (_a) {
107
- var _b;
108
- var children = _a.children, isReverse = _a.isReverse, className = _a.className, dataTestId = _a.dataTestId;
109
- var _c = React.useContext(PureCellContext), _d = _c.direction, direction = _d === void 0 ? 'horizontal' : _d, contextDataTestId = _c.dataTestId;
110
- return (React__default.default.createElement("div", { className: cn__default.default(styles__default$8.default.component, styles__default$8.default[direction], (_b = {},
177
+ var _b, _c;
178
+ var children = _a.children, isReverse = _a.isReverse, className = _a.className, dataTestId = _a.dataTestId, onClick = _a.onClick;
179
+ var _d = React.useContext(PureCellContext), _e = _d.direction, direction = _e === void 0 ? 'horizontal' : _e, contextDataTestId = _d.dataTestId, setMainHover = _d.setMainHover, unsetMainHover = _d.unsetMainHover;
180
+ var Component = onClick ? MAIN_COMPONENT.button : MAIN_COMPONENT.section;
181
+ var onMouseEvents = {
182
+ onClick: function (e) {
183
+ e.stopPropagation();
184
+ onClick === null || onClick === void 0 ? void 0 : onClick();
185
+ },
186
+ onMouseEnter: function () {
187
+ unsetMainHover === null || unsetMainHover === void 0 ? void 0 : unsetMainHover();
188
+ },
189
+ onMouseLeave: function () {
190
+ setMainHover === null || setMainHover === void 0 ? void 0 : setMainHover();
191
+ },
192
+ onMouseDown: function (e) {
193
+ e.stopPropagation();
194
+ },
195
+ };
196
+ return (React__default.default.createElement(Component, tslib.__assign({ className: cn__default.default(styles__default$8.default.component, styles__default$8.default[direction], (_b = {},
111
197
  _b[styles__default$8.default.reverse] = isReverse,
112
- _b), className), "data-test-id": coreComponentsShared.getDataTestId(dataTestId || contextDataTestId, 'main') }, children));
198
+ _b), (_c = {}, _c[styles__default$8.default.button] = onClick, _c), className), "data-test-id": coreComponentsShared.getDataTestId(dataTestId || contextDataTestId, 'main') }, (onClick && onMouseEvents)), children));
113
199
  };
114
200
 
115
201
  var Text = function (_a) {
@@ -133,12 +219,32 @@ var PureCellComponent = React.forwardRef(function (_a, ref) {
133
219
  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 = tslib.__rest(_a, ["className", "dataTestId", "onClick", "href", "tag", "children", "horizontalPadding", "verticalPadding", "direction"]);
134
220
  var cellRef = React.useRef(null);
135
221
  var focused = hooks.useFocus(cellRef, 'keyboard')[0];
222
+ var _h = React.useState(false), hoverState = _h[0], setHoverState = _h[1];
223
+ var _j = React.useState(false), activeState = _j[0], setActiveState = _j[1];
224
+ var setHover = function () { return setHoverState(true); };
225
+ var unsetHover = function () { return setHoverState(false); };
226
+ var setActive = function () { return setActiveState(true); };
227
+ var unsetActive = function () { return setActiveState(false); };
228
+ var mouseEvents = {
229
+ onMouseEnter: setHover,
230
+ onMouseLeave: unsetHover,
231
+ onMouseDown: setActive,
232
+ onMouseUp: unsetActive,
233
+ };
136
234
  var addClasses = (_b = {},
137
235
  _b[styles__default$a.default.component] = true,
138
236
  _b[styles__default$a.default.focused] = focused,
139
237
  _b[styles__default$a.default[direction]] = true,
140
238
  _b[styles__default$a.default[horizontalPadding]] = true,
239
+ _b[styles__default$a.default.hover] = hoverState,
240
+ _b[styles__default$a.default.active] = activeState,
141
241
  _b);
242
+ var contextState = {
243
+ direction: direction,
244
+ dataTestId: dataTestId,
245
+ setMainHover: setHover,
246
+ unsetMainHover: unsetHover,
247
+ };
142
248
  if (typeof verticalPadding === 'string') {
143
249
  addClasses[styles__default$a.default[verticalPadding]] = typeof verticalPadding === 'string';
144
250
  }
@@ -150,15 +256,15 @@ var PureCellComponent = React.forwardRef(function (_a, ref) {
150
256
  var target = restProps.target;
151
257
  // Для совместимости с react-router-dom, меняем href на to
152
258
  var hrefProps = (_c = {}, _c[typeof Component === 'string' ? 'href' : 'to'] = href, _c);
153
- return (React__default.default.createElement(Component, tslib.__assign({ rel: target === '_blank' ? 'noreferrer noopener' : undefined }, restProps, hrefProps, { ref: mergeRefs__default.default([cellRef, ref]), className: cn__default.default(styles__default$a.default.link, addClasses, className), "data-test-id": dataTestId, onClick: onClick }),
154
- React__default.default.createElement(PureCellContext.Provider, { value: { direction: direction, dataTestId: dataTestId } }, children)));
259
+ return (React__default.default.createElement(Component, tslib.__assign({ rel: target === '_blank' ? 'noreferrer noopener' : undefined }, restProps, hrefProps, { ref: mergeRefs__default.default([cellRef, ref]), className: cn__default.default(styles__default$a.default.link, addClasses, className), "data-test-id": dataTestId, onClick: onClick }, mouseEvents),
260
+ React__default.default.createElement(PureCellContext.Provider, { value: contextState }, children)));
155
261
  }
156
262
  if (onClick) {
157
- return (React__default.default.createElement(Component, tslib.__assign({}, restProps, { ref: mergeRefs__default.default([cellRef, ref]), className: cn__default.default(styles__default$a.default.button, addClasses, className), "data-test-id": dataTestId, onClick: onClick }),
158
- React__default.default.createElement(PureCellContext.Provider, { value: { direction: direction, dataTestId: dataTestId } }, children)));
263
+ return (React__default.default.createElement(Component, tslib.__assign({}, restProps, { ref: mergeRefs__default.default([cellRef, ref]), className: cn__default.default(styles__default$a.default.button, addClasses, className), "data-test-id": dataTestId, onClick: onClick }, mouseEvents),
264
+ React__default.default.createElement(PureCellContext.Provider, { value: contextState }, children)));
159
265
  }
160
266
  return (React__default.default.createElement(Component, tslib.__assign({}, restProps, { ref: ref, tabIndex: 0, className: cn__default.default(addClasses, className), "data-test-id": dataTestId }),
161
- React__default.default.createElement(PureCellContext.Provider, { value: { direction: direction, dataTestId: dataTestId } }, children)));
267
+ React__default.default.createElement(PureCellContext.Provider, { value: contextState }, children)));
162
268
  });
163
269
  /**
164
270
  * Универсальный конструктор для сборки любой ячейки.
package/cssm/component.js CHANGED
@@ -8,7 +8,7 @@ require('react-merge-refs');
8
8
  require('classnames');
9
9
  require('@alfalab/core-components-comment/cssm');
10
10
  require('@alfalab/hooks');
11
- var components_addon_component = require('./component-063660c0.js');
11
+ var components_addon_component = require('./component-719b272a.js');
12
12
  require('./index.module.css');
13
13
 
14
14
 
@@ -2,10 +2,11 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
+ require('tslib');
5
6
  require('react');
6
7
  require('classnames');
7
8
  require('@alfalab/core-components-shared/cssm');
8
- var components_addon_component = require('../../component-063660c0.js');
9
+ var components_addon_component = require('../../component-719b272a.js');
9
10
  require('./index.module.css');
10
11
 
11
12
 
@@ -1 +1 @@
1
- export * from "../../component-063660c0";
1
+ export * from "../../component-719b272a";
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_addon_component = require('../../component-063660c0.js');
5
+ var components_addon_component = require('../../component-719b272a.js');
6
6
 
7
7
 
8
8
 
@@ -14,6 +14,9 @@
14
14
  --gap-m: 16px;
15
15
  } :root {
16
16
  } :root {
17
+ } :root {
18
+ --pure-cell-clickable-area-hover-opacity: 1;
19
+ --pure-cell-clickable-area-active-opacity: 1;
17
20
  } .component {
18
21
  display: flex;
19
22
  flex-direction: column;
@@ -34,4 +37,26 @@
34
37
  align-self: center;
35
38
  } .component.bottom {
36
39
  align-self: flex-end;
40
+ } .button {
41
+ box-sizing: border-box;
42
+ background-color: transparent;
43
+ -webkit-tap-highlight-color: transparent;
44
+ outline: none;
45
+ border: 0;
46
+ margin: 0;
47
+ box-shadow: none;
48
+ border-radius: 0;
49
+ -webkit-user-select: none;
50
+ user-select: none;
51
+ vertical-align: middle;
52
+ appearance: none;
53
+ text-decoration: none;
54
+ min-width: 0;
55
+ cursor: pointer;
56
+ padding: 0;
57
+ transition: opacity 0.15s ease-in-out
58
+ } .button:hover {
59
+ opacity: var(--pure-cell-clickable-area-hover-opacity);
60
+ } .button:active {
61
+ opacity: var(--pure-cell-clickable-area-active-opacity);
37
62
  }
@@ -8,7 +8,7 @@ require('classnames');
8
8
  require('@alfalab/core-components-amount/cssm');
9
9
  require('@alfalab/core-components-shared/cssm');
10
10
  require('@alfalab/core-components-typography/cssm');
11
- var components_addon_component = require('../../component-063660c0.js');
11
+ var components_addon_component = require('../../component-719b272a.js');
12
12
  require('./index.module.css');
13
13
 
14
14
 
@@ -1 +1 @@
1
- export * from "../../component-063660c0";
1
+ export * from "../../component-719b272a";
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_addon_component = require('../../component-063660c0.js');
5
+ var components_addon_component = require('../../component-719b272a.js');
6
6
 
7
7
 
8
8
 
@@ -8,7 +8,7 @@ require('classnames');
8
8
  require('@alfalab/core-components-amount/cssm');
9
9
  require('@alfalab/core-components-shared/cssm');
10
10
  require('@alfalab/core-components-typography/cssm');
11
- var components_addon_component = require('../../component-063660c0.js');
11
+ var components_addon_component = require('../../component-719b272a.js');
12
12
  require('./index.module.css');
13
13
 
14
14
 
@@ -1 +1 @@
1
- export * from "../../component-063660c0";
1
+ export * from "../../component-719b272a";
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_addon_component = require('../../component-063660c0.js');
5
+ var components_addon_component = require('../../component-719b272a.js');
6
6
 
7
7
 
8
8
 
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  require('react');
6
6
  require('@alfalab/core-components-shared/cssm');
7
7
  require('@alfalab/core-components-typography/cssm');
8
- var components_addon_component = require('../../component-063660c0.js');
8
+ var components_addon_component = require('../../component-719b272a.js');
9
9
  require('./index.module.css');
10
10
 
11
11
 
@@ -1 +1 @@
1
- export * from "../../component-063660c0";
1
+ export * from "../../component-719b272a";
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_addon_component = require('../../component-063660c0.js');
5
+ var components_addon_component = require('../../component-719b272a.js');
6
6
 
7
7
 
8
8
 
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  require('react');
6
6
  require('classnames');
7
7
  require('@alfalab/core-components-shared/cssm');
8
- var components_addon_component = require('../../component-063660c0.js');
8
+ var components_addon_component = require('../../component-719b272a.js');
9
9
  require('./index.module.css');
10
10
 
11
11
 
@@ -1 +1 @@
1
- export * from "../../component-063660c0";
1
+ export * from "../../component-719b272a";
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_addon_component = require('../../component-063660c0.js');
5
+ var components_addon_component = require('../../component-719b272a.js');
6
6
 
7
7
 
8
8
 
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  require('react');
6
6
  require('classnames');
7
7
  require('@alfalab/core-components-shared/cssm');
8
- var components_addon_component = require('../../component-063660c0.js');
8
+ var components_addon_component = require('../../component-719b272a.js');
9
9
  require('./index.module.css');
10
10
 
11
11
 
@@ -1 +1 @@
1
- export * from "../../component-063660c0";
1
+ export * from "../../component-719b272a";
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_addon_component = require('../../component-063660c0.js');
5
+ var components_addon_component = require('../../component-719b272a.js');
6
6
 
7
7
 
8
8
 
@@ -6,7 +6,7 @@ require('tslib');
6
6
  require('react');
7
7
  require('@alfalab/core-components-button/cssm');
8
8
  require('@alfalab/core-components-shared/cssm');
9
- var components_addon_component = require('../../component-063660c0.js');
9
+ var components_addon_component = require('../../component-719b272a.js');
10
10
  require('./index.module.css');
11
11
 
12
12
 
@@ -1 +1 @@
1
- export * from "../../component-063660c0";
1
+ export * from "../../component-719b272a";
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_addon_component = require('../../component-063660c0.js');
5
+ var components_addon_component = require('../../component-719b272a.js');
6
6
 
7
7
 
8
8
 
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  require('react');
6
6
  require('@alfalab/core-components-shared/cssm');
7
7
  require('@alfalab/core-components-typography/cssm');
8
- var components_addon_component = require('../../component-063660c0.js');
8
+ var components_addon_component = require('../../component-719b272a.js');
9
9
 
10
10
 
11
11
 
@@ -1 +1 @@
1
- export * from "../../component-063660c0";
1
+ export * from "../../component-719b272a";
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_addon_component = require('../../component-063660c0.js');
5
+ var components_addon_component = require('../../component-719b272a.js');
6
6
 
7
7
 
8
8
 
@@ -2,10 +2,11 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
+ require('tslib');
5
6
  require('react');
6
7
  require('classnames');
7
8
  require('@alfalab/core-components-shared/cssm');
8
- var components_addon_component = require('../../component-063660c0.js');
9
+ var components_addon_component = require('../../component-719b272a.js');
9
10
  require('./index.module.css');
10
11
 
11
12
 
@@ -1 +1 @@
1
- export * from "../../component-063660c0";
1
+ export * from "../../component-719b272a";
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_addon_component = require('../../component-063660c0.js');
5
+ var components_addon_component = require('../../component-719b272a.js');
6
6
 
7
7
 
8
8
 
@@ -17,6 +17,9 @@
17
17
  --gap-m: 16px;
18
18
  } :root {
19
19
  } :root {
20
+ } :root {
21
+ --pure-cell-clickable-area-hover-opacity: 1;
22
+ --pure-cell-clickable-area-active-opacity: 1;
20
23
  } .component {
21
24
  display: inline-flex;
22
25
  flex-basis: auto;
@@ -46,4 +49,27 @@
46
49
  margin-bottom: var(--gap-xs);
47
50
  } .vertical:not(:last-child).tiny {
48
51
  margin-bottom: var(--gap-2xs);
52
+ } .button {
53
+ box-sizing: border-box;
54
+ background-color: transparent;
55
+ -webkit-tap-highlight-color: transparent;
56
+ outline: none;
57
+ border: 0;
58
+ margin: 0;
59
+ box-shadow: none;
60
+ border-radius: 0;
61
+ -webkit-user-select: none;
62
+ user-select: none;
63
+ vertical-align: middle;
64
+ appearance: none;
65
+ text-decoration: none;
66
+ min-width: 0;
67
+ cursor: pointer;
68
+ padding: 0;
69
+ transition: opacity 0.15s ease-in-out;
70
+ min-width: auto
71
+ } .button:hover {
72
+ opacity: var(--pure-cell-clickable-area-hover-opacity);
73
+ } .button:active {
74
+ opacity: var(--pure-cell-clickable-area-active-opacity);
49
75
  }
@@ -2,10 +2,11 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
+ require('tslib');
5
6
  require('react');
6
7
  require('classnames');
7
8
  require('@alfalab/core-components-shared/cssm');
8
- var components_addon_component = require('../../component-063660c0.js');
9
+ var components_addon_component = require('../../component-719b272a.js');
9
10
  require('./index.module.css');
10
11
 
11
12
 
@@ -1 +1 @@
1
- export * from "../../component-063660c0";
1
+ export * from "../../component-719b272a";
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_addon_component = require('../../component-063660c0.js');
5
+ var components_addon_component = require('../../component-719b272a.js');
6
6
 
7
7
 
8
8
 
@@ -14,6 +14,9 @@
14
14
  --gap-3xs: 2px;
15
15
  } :root {
16
16
  } :root {
17
+ } :root {
18
+ --pure-cell-clickable-area-hover-opacity: 1;
19
+ --pure-cell-clickable-area-active-opacity: 1;
17
20
  } .component {
18
21
  display: flex;
19
22
  flex-direction: column;
@@ -30,4 +33,27 @@
30
33
  text-align: center;
31
34
  } .component.reverse {
32
35
  flex-direction: column-reverse;
33
- }
36
+ } .component.button {
37
+ box-sizing: border-box;
38
+ background-color: transparent;
39
+ -webkit-tap-highlight-color: transparent;
40
+ outline: none;
41
+ border: 0;
42
+ margin: 0;
43
+ box-shadow: none;
44
+ border-radius: 0;
45
+ -webkit-user-select: none;
46
+ user-select: none;
47
+ vertical-align: middle;
48
+ appearance: none;
49
+ text-decoration: none;
50
+ min-width: 0;
51
+ cursor: pointer;
52
+ padding: 0;
53
+ transition: opacity 0.15s ease-in-out;
54
+ min-width: auto
55
+ } .component.button:hover {
56
+ opacity: var(--pure-cell-clickable-area-hover-opacity);
57
+ } .component.button:active {
58
+ opacity: var(--pure-cell-clickable-area-active-opacity);
59
+ }
@@ -6,7 +6,7 @@ require('react');
6
6
  require('classnames');
7
7
  require('@alfalab/core-components-shared/cssm');
8
8
  require('@alfalab/core-components-typography/cssm');
9
- var components_addon_component = require('../../component-063660c0.js');
9
+ var components_addon_component = require('../../component-719b272a.js');
10
10
  require('./index.module.css');
11
11
 
12
12
 
@@ -1 +1 @@
1
- export * from "../../component-063660c0";
1
+ export * from "../../component-719b272a";
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_addon_component = require('../../component-063660c0.js');
5
+ var components_addon_component = require('../../component-719b272a.js');
6
6
 
7
7
 
8
8
 
package/cssm/index.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- export { PureCell } from "./component-21d7b687";
2
- export type { PureCellProps } from "./component-21d7b687";
1
+ export { PureCell } from "./component-6a954af1";
2
+ export type { PureCellProps } from "./component-6a954af1";
package/cssm/index.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_addon_component = require('./component-063660c0.js');
5
+ var components_addon_component = require('./component-719b272a.js');
6
6
 
7
7
 
8
8