@itcase/ui 1.8.50 → 1.8.52

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.
@@ -12,7 +12,7 @@ var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
12
12
  var Button = require('./Button_cjs_C8P5a38-.js');
13
13
  var Icon = require('./Icon_cjs_CKWWo53f.js');
14
14
  var Input = require('./Input_cjs_BGLd0EQu.js');
15
- var Label = require('./Label_cjs_DNAubjXm.js');
15
+ var Label = require('./Label_cjs_DHLQmexE.js');
16
16
  var Text = require('./Text_cjs_C-Ux7Tz5.js');
17
17
  var _default = require('@itcase/icons/default');
18
18
 
@@ -10,7 +10,7 @@ import { useStyles } from './hooks/useStyles/useStyles.js';
10
10
  import { B as Button } from './Button_es_CwtOu3lT.js';
11
11
  import { I as Icon } from './Icon_es_B7IMj2rG.js';
12
12
  import { I as Input } from './Input_es_D2mNCqiH.js';
13
- import { L as Label } from './Label_es_DnV8akSC.js';
13
+ import { L as Label } from './Label_es_DDjXQQpD.js';
14
14
  import { T as Text } from './Text_es_BdFAdf7M.js';
15
15
  import { icons14 } from '@itcase/icons/default';
16
16
 
@@ -140,6 +140,28 @@ var labelAppearanceSecondary = {
140
140
  },
141
141
  };
142
142
 
143
+ var labelAppearanceShape = {
144
+ rounded: {
145
+ shape: 'rounded',
146
+ },
147
+ roundedL: {
148
+ shape: 'rounded',
149
+ shapeStrength: '1_5m',
150
+ },
151
+ roundedM: {
152
+ shape: 'rounded',
153
+ shapeStrength: '1m',
154
+ },
155
+ roundedS: {
156
+ shape: 'rounded',
157
+ shapeStrength: '0_5m',
158
+ },
159
+ roundedXL: {
160
+ shape: 'rounded',
161
+ shapeStrength: '2m',
162
+ },
163
+ };
164
+
143
165
  var labelAppearanceSize = {
144
166
  sizeXXL: {
145
167
  size: 'xxl',
@@ -276,7 +298,7 @@ var labelAppearanceWarning = {
276
298
  },
277
299
  };
278
300
 
279
- var labelAppearance = tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, labelAppearanceDisable), labelAppearanceSize), labelAppearanceStyle), labelAppearanceAccent), labelAppearanceDanger), labelAppearanceError), labelAppearanceInfo), labelAppearancePrimary), labelAppearanceSecondary), labelAppearanceSuccess), labelAppearanceSurface), labelAppearanceWarning);
301
+ var labelAppearance = tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, labelAppearanceDisable), labelAppearanceShape), labelAppearanceSize), labelAppearanceStyle), labelAppearanceAccent), labelAppearanceDanger), labelAppearanceError), labelAppearanceInfo), labelAppearancePrimary), labelAppearanceSecondary), labelAppearanceSuccess), labelAppearanceSurface), labelAppearanceWarning);
280
302
 
281
303
  var labelConfig = {
282
304
  appearance: labelAppearance,
@@ -285,7 +307,7 @@ var labelConfig = {
285
307
  },
286
308
  };
287
309
  function Label(props) {
288
- var className = props.className, type = props.type, appearance = props.appearance, label = props.label, cursor = props.cursor, dataTour = props.dataTour, mode = props.mode, showTooltip = props.showTooltip, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick, children = props.children;
310
+ var className = props.className, type = props.type, appearance = props.appearance, label = props.label, cursor = props.cursor, dataTour = props.dataTour, showTooltip = props.showTooltip, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick, children = props.children;
289
311
  var tooltipRef = React.useRef(null);
290
312
  var onMouseEnterLabel = React.useCallback(function () {
291
313
  var _a;
@@ -297,10 +319,10 @@ function Label(props) {
297
319
  }, []);
298
320
  var appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, labelConfig);
299
321
  var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
300
- var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, tooltipAlignment = propsGenerator.tooltipAlignment, tooltipAppearance = propsGenerator.tooltipAppearance, tooltipArrowPosition = propsGenerator.tooltipArrowPosition, tooltipContent = propsGenerator.tooltipContent, tooltipText = propsGenerator.tooltipText, tooltipTextSize = propsGenerator.tooltipTextSize, tooltipTitle = propsGenerator.tooltipTitle, tooltipTitleSize = propsGenerator.tooltipTitleSize, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
322
+ var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass, tooltipAlignment = propsGenerator.tooltipAlignment, tooltipAppearance = propsGenerator.tooltipAppearance, tooltipArrowPosition = propsGenerator.tooltipArrowPosition, tooltipContent = propsGenerator.tooltipContent, tooltipText = propsGenerator.tooltipText, tooltipTextSize = propsGenerator.tooltipTextSize, tooltipTitle = propsGenerator.tooltipTitle, tooltipTitleSize = propsGenerator.tooltipTitleSize, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
301
323
  // @ts-expect-error
302
324
  var labelStyles = useStyles.useStyles(props).styles;
303
- return (jsxRuntime.jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), mode && "label_mode_".concat(mode), isSkeleton && "label_skeleton", onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('label__icon_before'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), jsxRuntime.jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsxRuntime.jsx(Text.Text, { className: "label__text", size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })) : (jsxRuntime.jsx("div", { className: "label__text", children: label })), children, showTooltip && (jsxRuntime.jsx(Icon.Tooltip, { className: "label__tooltip", appearance: tooltipAppearance, alignment: tooltipAlignment, title: tooltipTitle, titleSize: tooltipTitleSize, text: tooltipText, textSize: tooltipTextSize, arrowPosition: tooltipArrowPosition, ref: tooltipRef, children: tooltipContent }))] }), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('label__icon_after'), fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), after] }));
325
+ return (jsxRuntime.jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass), type && "label_type_".concat(type), isSkeleton && "label_skeleton", onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('label__icon_before'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), jsxRuntime.jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsxRuntime.jsx(Text.Text, { className: "label__text", size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })) : (jsxRuntime.jsx("div", { className: "label__text", children: label })), children, showTooltip && (jsxRuntime.jsx(Icon.Tooltip, { className: "label__tooltip", appearance: tooltipAppearance, alignment: tooltipAlignment, title: tooltipTitle, titleSize: tooltipTitleSize, text: tooltipText, textSize: tooltipTextSize, arrowPosition: tooltipArrowPosition, ref: tooltipRef, children: tooltipContent }))] }), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('label__icon_after'), fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), after] }));
304
326
  }
305
327
 
306
328
  exports.Label = Label;
@@ -138,6 +138,28 @@ var labelAppearanceSecondary = {
138
138
  },
139
139
  };
140
140
 
141
+ var labelAppearanceShape = {
142
+ rounded: {
143
+ shape: 'rounded',
144
+ },
145
+ roundedL: {
146
+ shape: 'rounded',
147
+ shapeStrength: '1_5m',
148
+ },
149
+ roundedM: {
150
+ shape: 'rounded',
151
+ shapeStrength: '1m',
152
+ },
153
+ roundedS: {
154
+ shape: 'rounded',
155
+ shapeStrength: '0_5m',
156
+ },
157
+ roundedXL: {
158
+ shape: 'rounded',
159
+ shapeStrength: '2m',
160
+ },
161
+ };
162
+
141
163
  var labelAppearanceSize = {
142
164
  sizeXXL: {
143
165
  size: 'xxl',
@@ -274,7 +296,7 @@ var labelAppearanceWarning = {
274
296
  },
275
297
  };
276
298
 
277
- var labelAppearance = __assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign({}, labelAppearanceDisable), labelAppearanceSize), labelAppearanceStyle), labelAppearanceAccent), labelAppearanceDanger), labelAppearanceError), labelAppearanceInfo), labelAppearancePrimary), labelAppearanceSecondary), labelAppearanceSuccess), labelAppearanceSurface), labelAppearanceWarning);
299
+ var labelAppearance = __assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign({}, labelAppearanceDisable), labelAppearanceShape), labelAppearanceSize), labelAppearanceStyle), labelAppearanceAccent), labelAppearanceDanger), labelAppearanceError), labelAppearanceInfo), labelAppearancePrimary), labelAppearanceSecondary), labelAppearanceSuccess), labelAppearanceSurface), labelAppearanceWarning);
278
300
 
279
301
  var labelConfig = {
280
302
  appearance: labelAppearance,
@@ -283,7 +305,7 @@ var labelConfig = {
283
305
  },
284
306
  };
285
307
  function Label(props) {
286
- var className = props.className, type = props.type, appearance = props.appearance, label = props.label, cursor = props.cursor, dataTour = props.dataTour, mode = props.mode, showTooltip = props.showTooltip, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick, children = props.children;
308
+ var className = props.className, type = props.type, appearance = props.appearance, label = props.label, cursor = props.cursor, dataTour = props.dataTour, showTooltip = props.showTooltip, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick, children = props.children;
287
309
  var tooltipRef = useRef(null);
288
310
  var onMouseEnterLabel = useCallback(function () {
289
311
  var _a;
@@ -295,10 +317,10 @@ function Label(props) {
295
317
  }, []);
296
318
  var appearanceConfig = useAppearanceConfig(appearance, labelConfig);
297
319
  var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
298
- var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, tooltipAlignment = propsGenerator.tooltipAlignment, tooltipAppearance = propsGenerator.tooltipAppearance, tooltipArrowPosition = propsGenerator.tooltipArrowPosition, tooltipContent = propsGenerator.tooltipContent, tooltipText = propsGenerator.tooltipText, tooltipTextSize = propsGenerator.tooltipTextSize, tooltipTitle = propsGenerator.tooltipTitle, tooltipTitleSize = propsGenerator.tooltipTitleSize, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
320
+ var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass, tooltipAlignment = propsGenerator.tooltipAlignment, tooltipAppearance = propsGenerator.tooltipAppearance, tooltipArrowPosition = propsGenerator.tooltipArrowPosition, tooltipContent = propsGenerator.tooltipContent, tooltipText = propsGenerator.tooltipText, tooltipTextSize = propsGenerator.tooltipTextSize, tooltipTitle = propsGenerator.tooltipTitle, tooltipTitleSize = propsGenerator.tooltipTitleSize, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
299
321
  // @ts-expect-error
300
322
  var labelStyles = useStyles(props).styles;
301
- return (jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), mode && "label_mode_".concat(mode), isSkeleton && "label_skeleton", onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, (iconBefore || iconBeforeSrc) && (jsx(Icon, { className: clsx('label__icon_before'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsx(Text, { className: "label__text", size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })) : (jsx("div", { className: "label__text", children: label })), children, showTooltip && (jsx(Tooltip, { className: "label__tooltip", appearance: tooltipAppearance, alignment: tooltipAlignment, title: tooltipTitle, titleSize: tooltipTitleSize, text: tooltipText, textSize: tooltipTextSize, arrowPosition: tooltipArrowPosition, ref: tooltipRef, children: tooltipContent }))] }), (iconAfter || iconAfterSrc) && (jsx(Icon, { className: clsx('label__icon_after'), fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), after] }));
323
+ return (jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass), type && "label_type_".concat(type), isSkeleton && "label_skeleton", onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, (iconBefore || iconBeforeSrc) && (jsx(Icon, { className: clsx('label__icon_before'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsx(Text, { className: "label__text", size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })) : (jsx("div", { className: "label__text", children: label })), children, showTooltip && (jsx(Tooltip, { className: "label__tooltip", appearance: tooltipAppearance, alignment: tooltipAlignment, title: tooltipTitle, titleSize: tooltipTitleSize, text: tooltipText, textSize: tooltipTextSize, arrowPosition: tooltipArrowPosition, ref: tooltipRef, children: tooltipContent }))] }), (iconAfter || iconAfterSrc) && (jsx(Icon, { className: clsx('label__icon_after'), fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), after] }));
302
324
  }
303
325
 
304
326
  export { Label as L, labelAppearance as a, labelConfig as l };
@@ -6,7 +6,7 @@ var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceCon
6
6
  var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
7
7
  var useStyles = require('../hooks/useStyles/useStyles.js');
8
8
  var Icon = require('../../Icon_cjs_CKWWo53f.js');
9
- var Label = require('../../Label_cjs_DNAubjXm.js');
9
+ var Label = require('../../Label_cjs_DHLQmexE.js');
10
10
  var Text = require('../../Text_cjs_C-Ux7Tz5.js');
11
11
  var tslib_es6 = require('../../tslib.es6_cjs_CCZ3TN_7.js');
12
12
  require('react');
@@ -30,31 +30,31 @@ require('../../Link_cjs_BqT6eVl6.js');
30
30
  var cellAppearanceSize = {
31
31
  sizeXL: {
32
32
  size: 'xl',
33
- titleLabelAppearanceSize: 'sizeS',
34
- titleTextSize: 'xl',
33
+ titleLabelAppearanceSize: 'sizeXS',
34
+ titleTextSize: 'l',
35
35
  valueLabelAppearanceSize: 'sizeS',
36
- valueTextSize: 's',
36
+ valueTextSize: 'xl',
37
37
  },
38
38
  sizeL: {
39
39
  size: 'l',
40
- titleLabelAppearanceSize: 'sizeS',
41
- titleTextSize: 'l',
40
+ titleLabelAppearanceSize: 'sizeXS',
41
+ titleTextSize: 'm',
42
42
  valueLabelAppearanceSize: 'sizeS',
43
- valueTextSize: 's',
43
+ valueTextSize: 'l',
44
44
  },
45
45
  sizeM: {
46
46
  size: 'm',
47
- titleLabelAppearanceSize: 'sizeS',
48
- titleTextSize: 'm',
47
+ titleLabelAppearanceSize: 'sizeXS',
48
+ titleTextSize: 's',
49
49
  valueLabelAppearanceSize: 'sizeS',
50
- valueTextSize: 's',
50
+ valueTextSize: 'm',
51
51
  },
52
52
  sizeS: {
53
53
  size: 's',
54
54
  titleLabelAppearanceSize: 'sizeXS',
55
- titleTextSize: 's',
56
- valueLabelAppearanceSize: 'sizeXS',
57
- valueTextSize: 'xs',
55
+ titleTextSize: 'xs',
56
+ valueLabelAppearanceSize: 'sizeS',
57
+ valueTextSize: 's',
58
58
  },
59
59
  sizeEqualL: {
60
60
  size: 'l',
@@ -93,9 +93,7 @@ var cellAppearanceStyle = {
93
93
  outlined: {
94
94
  fill: 'none',
95
95
  },
96
- full: {
97
- //
98
- },
96
+ full: {},
99
97
  ghost: {
100
98
  fill: 'none',
101
99
  borderColor: 'none',
@@ -109,6 +107,7 @@ var cellAppearanceSurface = {
109
107
  titleIconItemFill: 'surfaceItemPrimary',
110
108
  titleLabelAppearance: 'accentPrimary',
111
109
  labelTextColor: 'surfaceTextPrimary',
110
+ borderColor: 'surfaceBorderPrimary',
112
111
  valueIconItemFill: 'surfaceItemPrimary',
113
112
  valueLabelAppearance: 'accentPrimary',
114
113
  },
@@ -118,6 +117,7 @@ var cellAppearanceSurface = {
118
117
  titleIconItemFill: 'surfaceItemPrimary',
119
118
  titleLabelAppearance: 'accentPrimary',
120
119
  labelTextColor: 'surfaceTextPrimary',
120
+ borderColor: 'surfaceBorderPrimary',
121
121
  valueIconItemFill: 'surfaceItemPrimary',
122
122
  valueLabelAppearance: 'accentPrimary',
123
123
  },
@@ -127,6 +127,7 @@ var cellAppearanceSurface = {
127
127
  titleIconItemFill: 'surfaceItemPrimary',
128
128
  titleLabelAppearance: 'accentPrimary',
129
129
  labelTextColor: 'surfaceTextPrimary',
130
+ borderColor: 'surfaceBorderPrimary',
130
131
  valueIconItemFill: 'surfaceItemPrimary',
131
132
  valueLabelAppearance: 'accentPrimary',
132
133
  },
@@ -136,6 +137,7 @@ var cellAppearanceSurface = {
136
137
  titleIconItemFill: 'surfaceItemPrimary',
137
138
  titleLabelAppearance: 'accentPrimary',
138
139
  labelTextColor: 'surfaceTextPrimary',
140
+ borderColor: 'surfaceBorderPrimary',
139
141
  valueIconItemFill: 'surfaceItemPrimary',
140
142
  valueLabelAppearance: 'accentPrimary',
141
143
  },
@@ -153,7 +155,7 @@ function Cell(props) {
153
155
  var className = props.className, appearance = props.appearance, title = props.title, titleIcon = props.titleIcon, titleLabel = props.titleLabel, titleTag = props.titleTag, showTitleLabel = props.showTitleLabel, showValueLabel = props.showValueLabel, value = props.value, valueIcon = props.valueIcon, valueTag = props.valueTag, before = props.before, after = props.after, isActive = props.isActive, isEqual = props.isEqual, onClick = props.onClick, onMouseEnter = props.onMouseEnter;
154
156
  var appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, cellConfig);
155
157
  var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
156
- var directionClass = propsGenerator.directionClass, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, titleIconFill = propsGenerator.titleIconFill, titleIconFillHover = propsGenerator.titleIconFillHover, titleIconFillSize = propsGenerator.titleIconFillSize, titleIconItemFill = propsGenerator.titleIconItemFill, titleIconShape = propsGenerator.titleIconShape, titleIconSrc = propsGenerator.titleIconSrc, titleLabelAppearance = propsGenerator.titleLabelAppearance, titleLabelAppearanceSize = propsGenerator.titleLabelAppearanceSize, titleLabelShape = propsGenerator.titleLabelShape, titleLabelSize = propsGenerator.titleLabelSize, titleLabelTextSize = propsGenerator.titleLabelTextSize, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, titleTextTruncate = propsGenerator.titleTextTruncate, titleTextWeight = propsGenerator.titleTextWeight, titleTextWrap = propsGenerator.titleTextWrap, borderColorActiveClass = propsGenerator.borderColorActiveClass, borderColorActiveHoverClass = propsGenerator.borderColorActiveHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, valueIconFill = propsGenerator.valueIconFill, valueIconFillHover = propsGenerator.valueIconFillHover, valueIconFillSize = propsGenerator.valueIconFillSize, valueIconItemFill = propsGenerator.valueIconItemFill, valueIconShape = propsGenerator.valueIconShape, valueIconSrc = propsGenerator.valueIconSrc, valueLabel = propsGenerator.valueLabel, valueLabelAppearance = propsGenerator.valueLabelAppearance, valueLabelAppearanceSize = propsGenerator.valueLabelAppearanceSize, valueLabelShape = propsGenerator.valueLabelShape, valueLabelSize = propsGenerator.valueLabelSize, valueLabelTextSize = propsGenerator.valueLabelTextSize, valueTextAlign = propsGenerator.valueTextAlign, valueTextColor = propsGenerator.valueTextColor, valueTextSize = propsGenerator.valueTextSize, valueTextTruncate = propsGenerator.valueTextTruncate, valueTextWeight = propsGenerator.valueTextWeight, valueTextWrap = propsGenerator.valueTextWrap, widthClass = propsGenerator.widthClass, zeroGap = propsGenerator.zeroGap, zeroPadding = propsGenerator.zeroPadding;
158
+ var directionClass = propsGenerator.directionClass, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, titleIconFill = propsGenerator.titleIconFill, titleIconFillHover = propsGenerator.titleIconFillHover, titleIconFillSize = propsGenerator.titleIconFillSize, titleIconItemFill = propsGenerator.titleIconItemFill, titleIconShape = propsGenerator.titleIconShape, titleIconSrc = propsGenerator.titleIconSrc, titleLabelAppearance = propsGenerator.titleLabelAppearance, titleLabelAppearanceSize = propsGenerator.titleLabelAppearanceSize, titleLabelShape = propsGenerator.titleLabelShape, titleLabelSize = propsGenerator.titleLabelSize, titleLabelTextSize = propsGenerator.titleLabelTextSize, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, titleTextTruncate = propsGenerator.titleTextTruncate, titleTextWeight = propsGenerator.titleTextWeight, titleTextWrap = propsGenerator.titleTextWrap, borderColorActiveClass = propsGenerator.borderColorActiveClass, borderColorActiveHoverClass = propsGenerator.borderColorActiveHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, reverseClass = propsGenerator.reverseClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, valueIconFill = propsGenerator.valueIconFill, valueIconFillHover = propsGenerator.valueIconFillHover, valueIconFillSize = propsGenerator.valueIconFillSize, valueIconItemFill = propsGenerator.valueIconItemFill, valueIconShape = propsGenerator.valueIconShape, valueIconSrc = propsGenerator.valueIconSrc, valueLabel = propsGenerator.valueLabel, valueLabelAppearance = propsGenerator.valueLabelAppearance, valueLabelAppearanceSize = propsGenerator.valueLabelAppearanceSize, valueLabelShape = propsGenerator.valueLabelShape, valueLabelSize = propsGenerator.valueLabelSize, valueLabelTextSize = propsGenerator.valueLabelTextSize, valueTextAlign = propsGenerator.valueTextAlign, valueTextColor = propsGenerator.valueTextColor, valueTextSize = propsGenerator.valueTextSize, valueTextTruncate = propsGenerator.valueTextTruncate, valueTextWeight = propsGenerator.valueTextWeight, valueTextWrap = propsGenerator.valueTextWrap, widthClass = propsGenerator.widthClass, zeroGap = propsGenerator.zeroGap, zeroPadding = propsGenerator.zeroPadding;
157
159
  // @ts-expect-error
158
160
  var _a = useStyles.useStyles(props), dataStyles = _a.data, cellStyles = _a.styles;
159
161
  return (jsxRuntime.jsxs("div", { className: clsx(className, 'cell', sizeClass && "cell_size_".concat(sizeClass), !isActive
@@ -167,7 +169,7 @@ function Cell(props) {
167
169
  ? borderColorHoverClass &&
168
170
  "border-color_hover_".concat(borderColorHoverClass)
169
171
  : borderColorActiveHoverClass &&
170
- "border-color_active_hover_".concat(borderColorActiveHoverClass), shapeClass && "cell_shape_".concat(shapeClass), widthClass && "width_".concat(widthClass), zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap'), style: cellStyles, onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsxRuntime.jsx("div", { className: "cell__before", children: before }), jsxRuntime.jsxs("div", { className: clsx('cell__wrapper', directionClass && "cell__wrapper_direction_".concat(directionClass), isEqual && 'cell__wrapper-equal'), children: [title && (jsxRuntime.jsxs("div", { className: "cell__data", style: dataStyles, children: [jsxRuntime.jsx(Text.Text, { className: "cell__title", size: titleTextSize, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, tag: titleTag, children: title }), (titleIcon || titleIconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "cell__title-icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), (showTitleLabel || titleLabel) && (jsxRuntime.jsx(Label.Label, { className: "cell__title-label", appearance: "".concat(titleLabelAppearance, " ").concat(titleLabelAppearanceSize), size: titleLabelSize, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape }))] })), value && (jsxRuntime.jsxs("div", { className: "cell__data", style: dataStyles, children: [jsxRuntime.jsx(Text.Text, { className: "cell__value", size: valueTextSize, textAlign: valueTextAlign, textColor: valueTextColor, textTruncate: valueTextTruncate, textWeight: valueTextWeight, textWrap: valueTextWrap, tag: valueTag, children: value }), (valueIcon || valueIconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "cell__value-icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), (showValueLabel || valueLabel) && (jsxRuntime.jsx(Label.Label, { className: "cell__value-label", appearance: "".concat(valueLabelAppearance, " ").concat(valueLabelAppearanceSize), size: valueLabelSize, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape }))] }))] }), after && jsxRuntime.jsx("div", { className: "cell__after", children: after })] }));
172
+ "border-color_active_hover_".concat(borderColorActiveHoverClass), reverseClass && "cell_reverse_".concat(reverseClass), shapeClass && "cell_shape_".concat(shapeClass), widthClass && "width_".concat(widthClass), zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap'), style: cellStyles, onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsxRuntime.jsx("div", { className: "cell__before", children: before }), jsxRuntime.jsxs("div", { className: clsx('cell__wrapper', directionClass && "cell__wrapper_direction_".concat(directionClass), isEqual && 'cell__wrapper-equal'), children: [title && (jsxRuntime.jsxs("div", { className: "cell__data", style: dataStyles, children: [jsxRuntime.jsx(Text.Text, { className: "cell__title", size: titleTextSize, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, tag: titleTag, children: title }), (titleIcon || titleIconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "cell__title-icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), (showTitleLabel || titleLabel) && (jsxRuntime.jsx(Label.Label, { className: "cell__title-label", appearance: "".concat(titleLabelAppearance, " ").concat(titleLabelAppearanceSize), size: titleLabelSize, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape }))] })), value && (jsxRuntime.jsxs("div", { className: "cell__data", style: dataStyles, children: [jsxRuntime.jsx(Text.Text, { className: "cell__value", size: valueTextSize, textAlign: valueTextAlign, textColor: valueTextColor, textTruncate: valueTextTruncate, textWeight: valueTextWeight, textWrap: valueTextWrap, tag: valueTag, children: value }), (valueIcon || valueIconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "cell__value-icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), (showValueLabel || valueLabel) && (jsxRuntime.jsx(Label.Label, { className: "cell__value-label", appearance: "".concat(valueLabelAppearance, " ").concat(valueLabelAppearanceSize), size: valueLabelSize, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape }))] }))] }), after && jsxRuntime.jsx("div", { className: "cell__after", children: after })] }));
171
173
  }
172
174
 
173
175
  exports.Cell = Cell;
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
4
4
  var React = require('react');
5
5
  var clsx = require('clsx');
6
6
  var common = require('@itcase/common');
7
- var DatePicker = require('../../DatePicker_cjs_CKmX_JOf.js');
7
+ var DatePicker = require('../../DatePicker_cjs_C5A_2oSh.js');
8
8
  var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
9
9
  var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
10
10
  var ChipsGroup = require('../../ChipsGroup_cjs_CVCYLe2C.js');
@@ -31,7 +31,7 @@ require('../../Link_cjs_BqT6eVl6.js');
31
31
  require('../../Text_cjs_C-Ux7Tz5.js');
32
32
  require('../../Loader_cjs_D_n5PrK5.js');
33
33
  require('../../Input_cjs_BGLd0EQu.js');
34
- require('../../Label_cjs_DNAubjXm.js');
34
+ require('../../Label_cjs_DHLQmexE.js');
35
35
  require('@itcase/icons/default');
36
36
  require('lodash/castArray');
37
37
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var DatePicker = require('../../DatePicker_cjs_CKmX_JOf.js');
3
+ var DatePicker = require('../../DatePicker_cjs_C5A_2oSh.js');
4
4
  require('../../tslib.es6_cjs_CCZ3TN_7.js');
5
5
  require('react/jsx-runtime');
6
6
  require('react');
@@ -31,7 +31,7 @@ require('../../Link_cjs_BqT6eVl6.js');
31
31
  require('../../Text_cjs_C-Ux7Tz5.js');
32
32
  require('../../Loader_cjs_D_n5PrK5.js');
33
33
  require('../../Input_cjs_BGLd0EQu.js');
34
- require('../../Label_cjs_DNAubjXm.js');
34
+ require('../../Label_cjs_DHLQmexE.js');
35
35
  require('@itcase/icons/default');
36
36
 
37
37
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Label = require('../../Label_cjs_DNAubjXm.js');
3
+ var Label = require('../../Label_cjs_DHLQmexE.js');
4
4
  require('react/jsx-runtime');
5
5
  require('react');
6
6
  require('clsx');
@@ -4,7 +4,7 @@ import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceC
4
4
  import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
5
5
  import { useStyles } from '../hooks/useStyles/useStyles.js';
6
6
  import { I as Icon } from '../Icon_es_B7IMj2rG.js';
7
- import { L as Label } from '../Label_es_DnV8akSC.js';
7
+ import { L as Label } from '../Label_es_DDjXQQpD.js';
8
8
  import { T as Text } from '../Text_es_BdFAdf7M.js';
9
9
  import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
10
10
  import 'react';
@@ -28,31 +28,31 @@ import '../Link_es_BnUIX0QT.js';
28
28
  var cellAppearanceSize = {
29
29
  sizeXL: {
30
30
  size: 'xl',
31
- titleLabelAppearanceSize: 'sizeS',
32
- titleTextSize: 'xl',
31
+ titleLabelAppearanceSize: 'sizeXS',
32
+ titleTextSize: 'l',
33
33
  valueLabelAppearanceSize: 'sizeS',
34
- valueTextSize: 's',
34
+ valueTextSize: 'xl',
35
35
  },
36
36
  sizeL: {
37
37
  size: 'l',
38
- titleLabelAppearanceSize: 'sizeS',
39
- titleTextSize: 'l',
38
+ titleLabelAppearanceSize: 'sizeXS',
39
+ titleTextSize: 'm',
40
40
  valueLabelAppearanceSize: 'sizeS',
41
- valueTextSize: 's',
41
+ valueTextSize: 'l',
42
42
  },
43
43
  sizeM: {
44
44
  size: 'm',
45
- titleLabelAppearanceSize: 'sizeS',
46
- titleTextSize: 'm',
45
+ titleLabelAppearanceSize: 'sizeXS',
46
+ titleTextSize: 's',
47
47
  valueLabelAppearanceSize: 'sizeS',
48
- valueTextSize: 's',
48
+ valueTextSize: 'm',
49
49
  },
50
50
  sizeS: {
51
51
  size: 's',
52
52
  titleLabelAppearanceSize: 'sizeXS',
53
- titleTextSize: 's',
54
- valueLabelAppearanceSize: 'sizeXS',
55
- valueTextSize: 'xs',
53
+ titleTextSize: 'xs',
54
+ valueLabelAppearanceSize: 'sizeS',
55
+ valueTextSize: 's',
56
56
  },
57
57
  sizeEqualL: {
58
58
  size: 'l',
@@ -91,9 +91,7 @@ var cellAppearanceStyle = {
91
91
  outlined: {
92
92
  fill: 'none',
93
93
  },
94
- full: {
95
- //
96
- },
94
+ full: {},
97
95
  ghost: {
98
96
  fill: 'none',
99
97
  borderColor: 'none',
@@ -107,6 +105,7 @@ var cellAppearanceSurface = {
107
105
  titleIconItemFill: 'surfaceItemPrimary',
108
106
  titleLabelAppearance: 'accentPrimary',
109
107
  labelTextColor: 'surfaceTextPrimary',
108
+ borderColor: 'surfaceBorderPrimary',
110
109
  valueIconItemFill: 'surfaceItemPrimary',
111
110
  valueLabelAppearance: 'accentPrimary',
112
111
  },
@@ -116,6 +115,7 @@ var cellAppearanceSurface = {
116
115
  titleIconItemFill: 'surfaceItemPrimary',
117
116
  titleLabelAppearance: 'accentPrimary',
118
117
  labelTextColor: 'surfaceTextPrimary',
118
+ borderColor: 'surfaceBorderPrimary',
119
119
  valueIconItemFill: 'surfaceItemPrimary',
120
120
  valueLabelAppearance: 'accentPrimary',
121
121
  },
@@ -125,6 +125,7 @@ var cellAppearanceSurface = {
125
125
  titleIconItemFill: 'surfaceItemPrimary',
126
126
  titleLabelAppearance: 'accentPrimary',
127
127
  labelTextColor: 'surfaceTextPrimary',
128
+ borderColor: 'surfaceBorderPrimary',
128
129
  valueIconItemFill: 'surfaceItemPrimary',
129
130
  valueLabelAppearance: 'accentPrimary',
130
131
  },
@@ -134,6 +135,7 @@ var cellAppearanceSurface = {
134
135
  titleIconItemFill: 'surfaceItemPrimary',
135
136
  titleLabelAppearance: 'accentPrimary',
136
137
  labelTextColor: 'surfaceTextPrimary',
138
+ borderColor: 'surfaceBorderPrimary',
137
139
  valueIconItemFill: 'surfaceItemPrimary',
138
140
  valueLabelAppearance: 'accentPrimary',
139
141
  },
@@ -151,7 +153,7 @@ function Cell(props) {
151
153
  var className = props.className, appearance = props.appearance, title = props.title, titleIcon = props.titleIcon, titleLabel = props.titleLabel, titleTag = props.titleTag, showTitleLabel = props.showTitleLabel, showValueLabel = props.showValueLabel, value = props.value, valueIcon = props.valueIcon, valueTag = props.valueTag, before = props.before, after = props.after, isActive = props.isActive, isEqual = props.isEqual, onClick = props.onClick, onMouseEnter = props.onMouseEnter;
152
154
  var appearanceConfig = useAppearanceConfig(appearance, cellConfig);
153
155
  var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
154
- var directionClass = propsGenerator.directionClass, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, titleIconFill = propsGenerator.titleIconFill, titleIconFillHover = propsGenerator.titleIconFillHover, titleIconFillSize = propsGenerator.titleIconFillSize, titleIconItemFill = propsGenerator.titleIconItemFill, titleIconShape = propsGenerator.titleIconShape, titleIconSrc = propsGenerator.titleIconSrc, titleLabelAppearance = propsGenerator.titleLabelAppearance, titleLabelAppearanceSize = propsGenerator.titleLabelAppearanceSize, titleLabelShape = propsGenerator.titleLabelShape, titleLabelSize = propsGenerator.titleLabelSize, titleLabelTextSize = propsGenerator.titleLabelTextSize, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, titleTextTruncate = propsGenerator.titleTextTruncate, titleTextWeight = propsGenerator.titleTextWeight, titleTextWrap = propsGenerator.titleTextWrap, borderColorActiveClass = propsGenerator.borderColorActiveClass, borderColorActiveHoverClass = propsGenerator.borderColorActiveHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, valueIconFill = propsGenerator.valueIconFill, valueIconFillHover = propsGenerator.valueIconFillHover, valueIconFillSize = propsGenerator.valueIconFillSize, valueIconItemFill = propsGenerator.valueIconItemFill, valueIconShape = propsGenerator.valueIconShape, valueIconSrc = propsGenerator.valueIconSrc, valueLabel = propsGenerator.valueLabel, valueLabelAppearance = propsGenerator.valueLabelAppearance, valueLabelAppearanceSize = propsGenerator.valueLabelAppearanceSize, valueLabelShape = propsGenerator.valueLabelShape, valueLabelSize = propsGenerator.valueLabelSize, valueLabelTextSize = propsGenerator.valueLabelTextSize, valueTextAlign = propsGenerator.valueTextAlign, valueTextColor = propsGenerator.valueTextColor, valueTextSize = propsGenerator.valueTextSize, valueTextTruncate = propsGenerator.valueTextTruncate, valueTextWeight = propsGenerator.valueTextWeight, valueTextWrap = propsGenerator.valueTextWrap, widthClass = propsGenerator.widthClass, zeroGap = propsGenerator.zeroGap, zeroPadding = propsGenerator.zeroPadding;
156
+ var directionClass = propsGenerator.directionClass, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, titleIconFill = propsGenerator.titleIconFill, titleIconFillHover = propsGenerator.titleIconFillHover, titleIconFillSize = propsGenerator.titleIconFillSize, titleIconItemFill = propsGenerator.titleIconItemFill, titleIconShape = propsGenerator.titleIconShape, titleIconSrc = propsGenerator.titleIconSrc, titleLabelAppearance = propsGenerator.titleLabelAppearance, titleLabelAppearanceSize = propsGenerator.titleLabelAppearanceSize, titleLabelShape = propsGenerator.titleLabelShape, titleLabelSize = propsGenerator.titleLabelSize, titleLabelTextSize = propsGenerator.titleLabelTextSize, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, titleTextTruncate = propsGenerator.titleTextTruncate, titleTextWeight = propsGenerator.titleTextWeight, titleTextWrap = propsGenerator.titleTextWrap, borderColorActiveClass = propsGenerator.borderColorActiveClass, borderColorActiveHoverClass = propsGenerator.borderColorActiveHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, reverseClass = propsGenerator.reverseClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, valueIconFill = propsGenerator.valueIconFill, valueIconFillHover = propsGenerator.valueIconFillHover, valueIconFillSize = propsGenerator.valueIconFillSize, valueIconItemFill = propsGenerator.valueIconItemFill, valueIconShape = propsGenerator.valueIconShape, valueIconSrc = propsGenerator.valueIconSrc, valueLabel = propsGenerator.valueLabel, valueLabelAppearance = propsGenerator.valueLabelAppearance, valueLabelAppearanceSize = propsGenerator.valueLabelAppearanceSize, valueLabelShape = propsGenerator.valueLabelShape, valueLabelSize = propsGenerator.valueLabelSize, valueLabelTextSize = propsGenerator.valueLabelTextSize, valueTextAlign = propsGenerator.valueTextAlign, valueTextColor = propsGenerator.valueTextColor, valueTextSize = propsGenerator.valueTextSize, valueTextTruncate = propsGenerator.valueTextTruncate, valueTextWeight = propsGenerator.valueTextWeight, valueTextWrap = propsGenerator.valueTextWrap, widthClass = propsGenerator.widthClass, zeroGap = propsGenerator.zeroGap, zeroPadding = propsGenerator.zeroPadding;
155
157
  // @ts-expect-error
156
158
  var _a = useStyles(props), dataStyles = _a.data, cellStyles = _a.styles;
157
159
  return (jsxs("div", { className: clsx(className, 'cell', sizeClass && "cell_size_".concat(sizeClass), !isActive
@@ -165,7 +167,7 @@ function Cell(props) {
165
167
  ? borderColorHoverClass &&
166
168
  "border-color_hover_".concat(borderColorHoverClass)
167
169
  : borderColorActiveHoverClass &&
168
- "border-color_active_hover_".concat(borderColorActiveHoverClass), shapeClass && "cell_shape_".concat(shapeClass), widthClass && "width_".concat(widthClass), zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap'), style: cellStyles, onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsx("div", { className: "cell__before", children: before }), jsxs("div", { className: clsx('cell__wrapper', directionClass && "cell__wrapper_direction_".concat(directionClass), isEqual && 'cell__wrapper-equal'), children: [title && (jsxs("div", { className: "cell__data", style: dataStyles, children: [jsx(Text, { className: "cell__title", size: titleTextSize, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, tag: titleTag, children: title }), (titleIcon || titleIconSrc) && (jsx(Icon, { className: "cell__title-icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), (showTitleLabel || titleLabel) && (jsx(Label, { className: "cell__title-label", appearance: "".concat(titleLabelAppearance, " ").concat(titleLabelAppearanceSize), size: titleLabelSize, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape }))] })), value && (jsxs("div", { className: "cell__data", style: dataStyles, children: [jsx(Text, { className: "cell__value", size: valueTextSize, textAlign: valueTextAlign, textColor: valueTextColor, textTruncate: valueTextTruncate, textWeight: valueTextWeight, textWrap: valueTextWrap, tag: valueTag, children: value }), (valueIcon || valueIconSrc) && (jsx(Icon, { className: "cell__value-icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), (showValueLabel || valueLabel) && (jsx(Label, { className: "cell__value-label", appearance: "".concat(valueLabelAppearance, " ").concat(valueLabelAppearanceSize), size: valueLabelSize, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape }))] }))] }), after && jsx("div", { className: "cell__after", children: after })] }));
170
+ "border-color_active_hover_".concat(borderColorActiveHoverClass), reverseClass && "cell_reverse_".concat(reverseClass), shapeClass && "cell_shape_".concat(shapeClass), widthClass && "width_".concat(widthClass), zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap'), style: cellStyles, onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsx("div", { className: "cell__before", children: before }), jsxs("div", { className: clsx('cell__wrapper', directionClass && "cell__wrapper_direction_".concat(directionClass), isEqual && 'cell__wrapper-equal'), children: [title && (jsxs("div", { className: "cell__data", style: dataStyles, children: [jsx(Text, { className: "cell__title", size: titleTextSize, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, tag: titleTag, children: title }), (titleIcon || titleIconSrc) && (jsx(Icon, { className: "cell__title-icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), (showTitleLabel || titleLabel) && (jsx(Label, { className: "cell__title-label", appearance: "".concat(titleLabelAppearance, " ").concat(titleLabelAppearanceSize), size: titleLabelSize, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape }))] })), value && (jsxs("div", { className: "cell__data", style: dataStyles, children: [jsx(Text, { className: "cell__value", size: valueTextSize, textAlign: valueTextAlign, textColor: valueTextColor, textTruncate: valueTextTruncate, textWeight: valueTextWeight, textWrap: valueTextWrap, tag: valueTag, children: value }), (valueIcon || valueIconSrc) && (jsx(Icon, { className: "cell__value-icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), (showValueLabel || valueLabel) && (jsx(Label, { className: "cell__value-label", appearance: "".concat(valueLabelAppearance, " ").concat(valueLabelAppearanceSize), size: valueLabelSize, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape }))] }))] }), after && jsx("div", { className: "cell__after", children: after })] }));
169
171
  }
170
172
 
171
173
  export { Cell, cellAppearance, cellConfig };
@@ -2,7 +2,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
2
2
  import { useCallback } from 'react';
3
3
  import clsx from 'clsx';
4
4
  import { DATE_PERIOD_INTERVALS } from '@itcase/common';
5
- import { D as DatePickerInput } from '../DatePicker_es_BRH4AHbV.js';
5
+ import { D as DatePickerInput } from '../DatePicker_es_CqxAvzoP.js';
6
6
  import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
7
7
  import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
8
8
  import { b as ChipsGroup, C as Chips } from '../ChipsGroup_es_BrX6_qHH.js';
@@ -29,7 +29,7 @@ import '../Link_es_BnUIX0QT.js';
29
29
  import '../Text_es_BdFAdf7M.js';
30
30
  import '../Loader_es_DXVVV9LE.js';
31
31
  import '../Input_es_D2mNCqiH.js';
32
- import '../Label_es_DnV8akSC.js';
32
+ import '../Label_es_DDjXQQpD.js';
33
33
  import '@itcase/icons/default';
34
34
  import 'lodash/castArray';
35
35
 
@@ -1,4 +1,4 @@
1
- export { D as DatePickerInput, a as datePickerAppearance, d as datePickerConfig } from '../DatePicker_es_BRH4AHbV.js';
1
+ export { D as DatePickerInput, a as datePickerAppearance, d as datePickerConfig } from '../DatePicker_es_CqxAvzoP.js';
2
2
  import '../tslib.es6_es_Bwu1Cn-t.js';
3
3
  import 'react/jsx-runtime';
4
4
  import 'react';
@@ -29,5 +29,5 @@ import '../Link_es_BnUIX0QT.js';
29
29
  import '../Text_es_BdFAdf7M.js';
30
30
  import '../Loader_es_DXVVV9LE.js';
31
31
  import '../Input_es_D2mNCqiH.js';
32
- import '../Label_es_DnV8akSC.js';
32
+ import '../Label_es_DDjXQQpD.js';
33
33
  import '@itcase/icons/default';
@@ -1,4 +1,4 @@
1
- export { L as Label, a as labelAppearance, l as labelConfig } from '../Label_es_DnV8akSC.js';
1
+ export { L as Label, a as labelAppearance, l as labelConfig } from '../Label_es_DDjXQQpD.js';
2
2
  import 'react/jsx-runtime';
3
3
  import 'react';
4
4
  import 'clsx';
@@ -105,6 +105,16 @@
105
105
  background-position: -200%;
106
106
  }
107
107
  }
108
+ .cell {
109
+ &_reverse {
110
+ &_true {
111
+ ^^&__wrapper {
112
+ display: flex;
113
+ flex-direction: column-reverse;
114
+ }
115
+ }
116
+ }
117
+ }
108
118
  :root {
109
119
  --cell-size-xl-padding: 4px 6px;
110
120
  --cell-size-xl-gap: 4px;
@@ -5,6 +5,7 @@ declare const cellAppearanceSurface: {
5
5
  titleIconItemFill: string;
6
6
  titleLabelAppearance: string;
7
7
  labelTextColor: string;
8
+ borderColor: string;
8
9
  valueIconItemFill: string;
9
10
  valueLabelAppearance: string;
10
11
  };
@@ -14,6 +15,7 @@ declare const cellAppearanceSurface: {
14
15
  titleIconItemFill: string;
15
16
  titleLabelAppearance: string;
16
17
  labelTextColor: string;
18
+ borderColor: string;
17
19
  valueIconItemFill: string;
18
20
  valueLabelAppearance: string;
19
21
  };
@@ -23,6 +25,7 @@ declare const cellAppearanceSurface: {
23
25
  titleIconItemFill: string;
24
26
  titleLabelAppearance: string;
25
27
  labelTextColor: string;
28
+ borderColor: string;
26
29
  valueIconItemFill: string;
27
30
  valueLabelAppearance: string;
28
31
  };
@@ -32,6 +35,7 @@ declare const cellAppearanceSurface: {
32
35
  titleIconItemFill: string;
33
36
  titleLabelAppearance: string;
34
37
  labelTextColor: string;
38
+ borderColor: string;
35
39
  valueIconItemFill: string;
36
40
  valueLabelAppearance: string;
37
41
  };
@@ -0,0 +1,22 @@
1
+ declare const labelAppearanceShape: {
2
+ rounded: {
3
+ shape: string;
4
+ };
5
+ roundedL: {
6
+ shape: string;
7
+ shapeStrength: string;
8
+ };
9
+ roundedM: {
10
+ shape: string;
11
+ shapeStrength: string;
12
+ };
13
+ roundedS: {
14
+ shape: string;
15
+ shapeStrength: string;
16
+ };
17
+ roundedXL: {
18
+ shape: string;
19
+ shapeStrength: string;
20
+ };
21
+ };
22
+ export { labelAppearanceShape };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@itcase/ui",
3
- "version": "1.8.50",
3
+ "version": "1.8.52",
4
4
  "description": "UI components (Modal, Loader, Popup, etc)",
5
5
  "keywords": [
6
6
  "Modal",