npm - @itcase/ui - Versions diffs - 1.1.15 → 1.1.16 - Mend

@itcase/ui 1.1.15 → 1.1.16

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 (212) hide show

package/dist/{Accordion-DyOfdiGd.js → Accordion-DF2lqrVA.js} RENAMED Viewed

@@ -38,12 +38,17 @@ const icon16 = {
 };
 function AccordionItem(props) {
-    var children = props.children, id = props.id, title = props.title, icon = props.icon, _a = props.iconFill, iconFill = _a === void 0 ? 'surfaceItemAccent' : _a, content = props.content, beforeContent = props.beforeContent, afterContent = props.afterContent, className = props.className, titleTextSize = props.titleTextSize, titleTextColor = props.titleTextColor, titleTextWeight = props.titleTextWeight, contentTextSize = props.contentTextSize, contentTextColor = props.contentTextColor, contentTextWeight = props.contentTextWeight, size = props.size, isExpanded = props.isExpanded, onClick = props.onClick;
+    var id = props.id, children = props.children, isExpanded = props.isExpanded, afterContent = props.afterContent, beforeContent = props.beforeContent, className = props.className, content = props.content, contentTextColor = props.contentTextColor, contentTextSize = props.contentTextSize, contentTextWeight = props.contentTextWeight, icon = props.icon, _a = props.iconFill, iconFill = _a === void 0 ? 'surfaceItemAccent' : _a, size = props.size, title = props.title, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, onClick = props.onClick;
     var onClickTitle = useCallback(function () {
-        // !isExpanded - is next state of expanded
-        var thisItemData = { id: id, title: title, content: content, isExpanded: !isExpanded };
+        // "!isExpanded" - is next state of expanded
+        var thisItemData = {
+            id: id,
+            isExpanded: !isExpanded,
+            content: content,
+            title: title,
+        };
         onClick && onClick(thisItemData);
-    }, [onClick, id, title, content, isExpanded]);
+    }, [id, title, content, isExpanded, onClick]);
     var borderColorClass = useDeviceTargetClass(props, {
         prefix: 'border-color_',
         propsKey: 'borderColor',
@@ -82,7 +87,7 @@ function AccordionItem(props) {
     });
     // @ts-expect-error
     var styles = useStyles(props).styles;
-    return (jsxRuntimeExports.jsxs("div", { className: clsx('accordion-item', className, borderColorClass, fillClass, fillHoverClass, shapeClass, size && "accordion-item_size_".concat(size), isExpanded && 'accordion-item_state_open'), style: styles, children: [jsxRuntimeExports.jsx(Text, { className: clsx('accordion-item__title', titleBorderColorClass, titleFillClass, titleFillHoverClass, 'cursor_type_pointer'), size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, onClick: onClickTitle, children: title }), jsxRuntimeExports.jsx("div", { className: clsx('accordion-item__icon', 'cursor_type_pointer'), onClick: onClickTitle, children: icon || (jsxRuntimeExports.jsx(Icon, { iconFill: iconFill, size: "16", SvgImage: icon16.ChevronDown })) }), beforeContent && beforeContent, isExpanded && (jsxRuntimeExports.jsx("div", { className: clsx('accordion-item__content', contentBorderColorClass, contentFillClass, fillHoverClass), children: children ||
+    return (jsxRuntimeExports.jsxs("div", { style: styles, className: clsx('accordion-item', className, borderColorClass, fillClass, fillHoverClass, shapeClass, size && "accordion-item_size_".concat(size), isExpanded && 'accordion-item_state_open'), children: [jsxRuntimeExports.jsx(Text, { size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, className: clsx('accordion-item__title', titleBorderColorClass, titleFillClass, titleFillHoverClass, 'cursor_type_pointer'), onClick: onClickTitle, children: title }), jsxRuntimeExports.jsx("div", { className: clsx('accordion-item__icon', 'cursor_type_pointer'), onClick: onClickTitle, children: icon || jsxRuntimeExports.jsx(Icon, { SvgImage: icon16.ChevronDown, iconFill: iconFill, size: "16" }) }), beforeContent && beforeContent, isExpanded && (jsxRuntimeExports.jsx("div", { className: clsx('accordion-item__content', contentBorderColorClass, contentFillClass, fillHoverClass), children: children ||
                     (content && (jsxRuntimeExports.jsx(Text, { size: contentTextSize, textColor: contentTextColor, textWeight: contentTextWeight, children: content }))) })), afterContent && afterContent] }));
 }
 AccordionItem.defaultProps = {
@@ -90,7 +95,7 @@ AccordionItem.defaultProps = {
 };
 function Accordion(props) {
-    var children = props.children, items = props.items, className = props.className, _a = props.initial, initial = _a === void 0 ? [] : _a, isMultiple = props.isMultiple, onClickItem = props.onClickItem;
+    var children = props.children, isMultiple = props.isMultiple, className = props.className, _a = props.initial, initial = _a === void 0 ? [] : _a, items = props.items, onClickItem = props.onClickItem;
     var _b = useState(castArray(initial)), expandedItems = _b[0], setExpandedItems = _b[1];
     var onClickAccordionItem = useCallback(function (targetItem) {
         setExpandedItems(function (prevState) {
@@ -115,12 +120,13 @@ function Accordion(props) {
             }
         });
         onClickItem && onClickItem(targetItem);
-    }, [onClickItem]);
+    }, [isMultiple, onClickItem]);
     var accordionItemsList = useMemo(function () {
         if (items) {
-            return items.map(function (item, i) { return (jsxRuntimeExports.jsx(AccordionItem, { content: item.content, id: item.id, isExpanded: expandedItems.includes(item.id), title: item.title, onClick: onClickAccordionItem }, "accordionItem_".concat(item.id || i + 1))); });
+            return items.map(function (item, i) { return (jsxRuntimeExports.jsx(AccordionItem, { content: item.content, id: item.id, title: item.title, isExpanded: expandedItems.includes(item.id), onClick: onClickAccordionItem }, "accordionItem_".concat(item.id || i + 1))); });
         }
         if (children) {
+            // @ts-ignore
             return React__default.Children.toArray(children).map(function (child) {
                 if (React__default.isValidElement(child)) {
                     var childID = child.props.id || child.key;
@@ -162,7 +168,7 @@ function Accordion(props) {
      */
     // @ts-expect-error
     var _c = useStyles(props), accordionStyles = _c.styles, accordionWrapperStyles = _c.wrapper;
-    return (jsxRuntimeExports.jsx("div", { className: clsx(className, 'accordion', borderColorClass, directionClass, fillClass, shapeClass, widthClass), style: accordionStyles, children: jsxRuntimeExports.jsx("div", { className: "accordion__wrapper", style: accordionWrapperStyles, children: accordionItemsList }) }));
+    return (jsxRuntimeExports.jsx("div", { style: accordionStyles, className: clsx(className, 'accordion', borderColorClass, directionClass, fillClass, shapeClass, widthClass), children: jsxRuntimeExports.jsx("div", { className: "accordion__wrapper", style: accordionWrapperStyles, children: accordionItemsList }) }));
 }
 Accordion.defaultProps = {
     initial: [],

package/dist/{Cell-DftU408q.js → Cell-D9Wa7coO.js} RENAMED Viewed

@@ -4,6 +4,7 @@ import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
 import { I as Icon } from './Icon-DWnG-4KG.js';
 import { L as Label } from './Label-VHbRKztj.js';
 import { T as Text } from './Text-CxrzHFN1.js';
+import { useStyles } from './hooks/useStyles.js';
 function Cell(props) {
     var after = props.after, before = props.before, className = props.className, isActive = props.isActive, isDisabled = props.isDisabled, mode = props.mode, reverse = props.reverse, set = props.set, showTitleLabel = props.showTitleLabel, showValueLabel = props.showValueLabel, size = props.size, title = props.title, titleIcon = props.titleIcon, titleIconFill = props.titleIconFill, titleIconFillHover = props.titleIconFillHover, titleIconFillSize = props.titleIconFillSize, titleIconItemFill = props.titleIconItemFill, titleIconShape = props.titleIconShape, titleIconSrc = props.titleIconSrc, titleLabel = props.titleLabel, titleLabelAppearance = props.titleLabelAppearance, titleLabelShape = props.titleLabelShape, titleLabelSize = props.titleLabelSize, titleLabelTextSize = props.titleLabelTextSize, titleTag = props.titleTag, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextTruncate = props.titleTextTruncate, titleTextWeight = props.titleTextWeight, titleTextWrap = props.titleTextWrap, value = props.value, valueIcon = props.valueIcon, valueIconFill = props.valueIconFill, valueIconFillHover = props.valueIconFillHover, valueIconFillSize = props.valueIconFillSize, valueIconItemFill = props.valueIconItemFill, valueIconShape = props.valueIconShape, valueIconSrc = props.valueIconSrc, valueLabel = props.valueLabel, valueLabelAppearance = props.valueLabelAppearance, valueLabelShape = props.valueLabelShape, valueLabelSize = props.valueLabelSize, valueLabelTextSize = props.valueLabelTextSize, valueTag = props.valueTag, valueTextAlign = props.valueTextAlign, valueTextColor = props.valueTextColor, valueTextSize = props.valueTextSize, valueTextWeight = props.valueTextWeight, valueTextWrap = props.valueTextWrap, zeroGap = props.zeroGap, zeroPadding = props.zeroPadding, onClick = props.onClick, onMouseEnter = props.onMouseEnter;
@@ -55,7 +56,9 @@ function Cell(props) {
         prefix: 'width_',
         propsKey: 'width',
     });
-    return (jsxRuntimeExports.jsxs("div", { className: clsx(className, 'cell', mode && "cell_mode_".concat(mode), size && "cell_size_".concat(size), set && "cell_set_".concat(set), bgFillClass, bgFillHoverClass, isActive && bgFillActiveClass, isDisabled && bgFillDisabledClass, bgShapeClass, widthClass, zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap', reverse && 'cell_reverse'), onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsxRuntimeExports.jsx("div", { className: "cell__before", children: before }), jsxRuntimeExports.jsxs("div", { className: clsx('cell__wrapper', directionClass, fillClass, fillHoverClass, isActive && fillActiveClass, isDisabled && fillDisabledClass, shapeClass), children: [title && (jsxRuntimeExports.jsxs("div", { className: "cell__data", children: [jsxRuntimeExports.jsx(Text, { className: "cell__title", size: titleTextSize, tag: titleTag, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title }), (titleIcon || titleIconSrc) && (jsxRuntimeExports.jsx(Icon, { className: "cell__icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), showTitleLabel && (jsxRuntimeExports.jsx(Label, { appearance: titleLabelAppearance, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape, size: titleLabelSize }))] })), value && (jsxRuntimeExports.jsxs("div", { className: "cell__data", children: [jsxRuntimeExports.jsx(Text, { className: "cell__value", size: valueTextSize, tag: valueTag, textAlign: valueTextAlign, textColor: valueTextColor, textWeight: valueTextWeight, textWrap: valueTextWrap, children: value }), (valueIcon || valueIconSrc) && (jsxRuntimeExports.jsx(Icon, { className: "cell__icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), showValueLabel && (jsxRuntimeExports.jsx(Label, { appearance: valueLabelAppearance, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape, size: valueLabelSize }))] }))] }), after && jsxRuntimeExports.jsx("div", { className: "cell__after", children: after })] }));
+    // @ts-expect-error
+    var cellStyles = useStyles(props).styles;
+    return (jsxRuntimeExports.jsxs("div", { className: clsx(className, 'cell', mode && "cell_mode_".concat(mode), size && "cell_size_".concat(size), set && "cell_set_".concat(set), bgFillClass, bgFillHoverClass, isActive && bgFillActiveClass, isDisabled && bgFillDisabledClass, bgShapeClass, widthClass, zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap', reverse && 'cell_reverse'), onClick: onClick, onMouseEnter: onMouseEnter, style: cellStyles, children: [before && jsxRuntimeExports.jsx("div", { className: "cell__before", children: before }), jsxRuntimeExports.jsxs("div", { className: clsx('cell__wrapper', directionClass, fillClass, fillHoverClass, isActive && fillActiveClass, isDisabled && fillDisabledClass, shapeClass), children: [title && (jsxRuntimeExports.jsxs("div", { className: "cell__data", children: [jsxRuntimeExports.jsx(Text, { className: "cell__title", size: titleTextSize, tag: titleTag, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title }), (titleIcon || titleIconSrc) && (jsxRuntimeExports.jsx(Icon, { className: "cell__icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), showTitleLabel && (jsxRuntimeExports.jsx(Label, { appearance: titleLabelAppearance, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape, size: titleLabelSize }))] })), value && (jsxRuntimeExports.jsxs("div", { className: "cell__data", children: [jsxRuntimeExports.jsx(Text, { className: "cell__value", size: valueTextSize, tag: valueTag, textAlign: valueTextAlign, textColor: valueTextColor, textWeight: valueTextWeight, textWrap: valueTextWrap, children: value }), (valueIcon || valueIconSrc) && (jsxRuntimeExports.jsx(Icon, { className: "cell__icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), showValueLabel && (jsxRuntimeExports.jsx(Label, { appearance: valueLabelAppearance, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape, size: valueLabelSize }))] }))] }), after && jsxRuntimeExports.jsx("div", { className: "cell__after", children: after })] }));
 }
 Cell.defaultProps = {
     isDisabled: false,

package/dist/{Checkbox-C-H_Z4S_.js → Checkbox-i0qZk0sb.js} RENAMED Viewed

@@ -1,21 +1,21 @@
 import { j as jsxRuntimeExports } from './jsx-runtime-C2uP7l8s.js';
-import { useMemo } from 'react';
 import clsx from 'clsx';
 import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
 import { T as Text } from './Text-CxrzHFN1.js';
 var checkboxConfig = {
-    state: undefined,
-    setState: function (newComponent) {
-        checkboxConfig.state = newComponent;
-    },
     appearance: undefined,
     setAppearance: function (newComponent) {
         checkboxConfig.appearance = newComponent;
     },
+    state: undefined,
+    // eslint-disable-next-line perfectionist/sort-objects
+    setState: function (newComponent) {
+        checkboxConfig.state = newComponent;
+    },
 };
 function Checkbox(props) {
-    var appearance = props.appearance, before = props.before, after = props.after, id = props.id, _a = props.Tag, Tag = _a === void 0 ? 'label' : _a, className = props.className, checked = props.checked, disabled = props.disabled, descTextSize = props.descTextSize, descTextWeight = props.descTextWeight, descTextColor = props.descTextColor, desc = props.desc, label = props.label, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, labelTextColor = props.labelTextColor, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, value = props.value;
+    var id = props.id, _a = props.Tag, Tag = _a === void 0 ? 'label' : _a, after = props.after, appearance = props.appearance, before = props.before, checked = props.checked, className = props.className, desc = props.desc, descTextColor = props.descTextColor, descTextSize = props.descTextSize, descTextWeight = props.descTextWeight, disabled = props.disabled, label = props.label, labelTextColor = props.labelTextColor, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus;
     var fillClass = useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'fill',
@@ -56,7 +56,8 @@ function Checkbox(props) {
         prefix: 'width_',
         propsKey: 'width',
     });
-    var appearanceConfig = useMemo(function () { return appearance && checkboxConfig.appearance && checkboxConfig.appearance[appearance]; }, [appearance, checkboxConfig]);
+    // prettier-ignore
+    var appearanceConfig = (appearance && checkboxConfig.appearance && checkboxConfig.appearance[appearance]);
     return (jsxRuntimeExports.jsxs(Tag, { className: clsx(className, 'checkbox', fillClass, shapeClass, widthClass), htmlFor: Tag === 'label' && id, children: [before, jsxRuntimeExports.jsxs("div", { className: clsx('checkbox__item', stateCheckmarkFillClass ||
                     ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.stateCheckmarkFill) &&
                         "checkbox_checkmark_fill_".concat(appearanceConfig.stateCheckmarkFill)

package/dist/{Chips-BR_EPV82.js → Chips-BdK4kVmq.js} RENAMED Viewed

@@ -12,7 +12,7 @@ var chipsConfig = {
     },
 };
 function Chips(props) {
-    var appearance = props.appearance, children = props.children, className = props.className, label = props.label, labelSize = props.labelSize, labelTextColor = props.labelTextColor, labelTextWeight = props.labelTextWeight, type = props.type, onClick = props.onClick;
+    var isActive = props.isActive, labelTextActiveColor = props.labelTextActiveColor, appearance = props.appearance, children = props.children, className = props.className, label = props.label, labelTextSize = props.labelTextSize, labelTextColor = props.labelTextColor, labelTextWeight = props.labelTextWeight, type = props.type, onClick = props.onClick;
     var alignDirectionClass = useDeviceTargetClass(props, {
         prefix: 'align_',
         propsKey: 'alignDirection',
@@ -29,6 +29,10 @@ function Chips(props) {
         prefix: 'fill_hover_',
         propsKey: 'fillHover',
     });
+    var fillActiveClass = useDeviceTargetClass(props, {
+        prefix: 'fill_active_',
+        propsKey: 'fillActive',
+    });
     var sizeClass = useDeviceTargetClass(props, {
         prefix: 'chips_size_',
         propsKey: 'size',
@@ -52,7 +56,9 @@ function Chips(props) {
     // @ts-expect-error
     var chipsStyles = useStyles(props).styles;
     var appearanceConfig = useMemo(function () { return appearance && chipsConfig.appearance && chipsConfig.appearance[appearance]; }, [appearance, chipsConfig]);
-    return (jsxRuntimeExports.jsx("div", { className: clsx(className, 'chips', fillClass ||
+    return (jsxRuntimeExports.jsx("div", { className: clsx(className, 'chips', isActive && 'chips_state_active', isActive ? fillActiveClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillActive) &&
+                "fill_".concat(appearanceConfig.fillActive).replace(/([A-Z])/g, '-$1').toLowerCase()) : fillClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
                 "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), fillHoverClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
@@ -60,7 +66,7 @@ function Chips(props) {
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderColor) &&
                 "border-color_".concat(appearanceConfig.borderColor)
                     .replace(/([A-Z])/g, '-$1')
-                    .toLowerCase()), borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && "chips_type_".concat(type), cursorClass), style: chipsStyles, onClick: onClick, children: jsxRuntimeExports.jsxs("div", { className: "chips__inner", children: [typeof label === 'string' ? (jsxRuntimeExports.jsx(Text, { className: "chips__label", textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textWeight: labelTextWeight, size: labelSize, children: label })) : (jsxRuntimeExports.jsx("div", { className: "chips__label", children: label })), children] }) }));
+                    .toLowerCase()), borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && "chips_type_".concat(type), cursorClass, onClick && 'cursor_type_pointer'), style: chipsStyles, onClick: onClick, children: jsxRuntimeExports.jsxs("div", { className: "chips__inner", children: [typeof label === 'string' ? (jsxRuntimeExports.jsx(Text, { className: "chips__label", textColor: isActive ? labelTextActiveColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextActiveColor) : labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textWeight: labelTextWeight, size: labelTextSize, children: label })) : (jsxRuntimeExports.jsx("div", { className: "chips__label", children: label })), children] }) }));
 }
 Chips.defaultProps = {
     label: 'Chips',

package/dist/{DadataHintField-QzDwYdF1.js → DadataHintField-CHJLsVjJ.js} RENAMED Viewed

@@ -3,7 +3,7 @@ import { j as jsxRuntimeExports } from './jsx-runtime-C2uP7l8s.js';
 import React__default, { PureComponent, useMemo } from 'react';
 import clsx from 'clsx';
 import crypto from 'crypto';
-import { I as Input } from './Input-CYMKQ0qF.js';
+import { I as Input } from './Input-CYDtAlO-.js';
 function getDefaultExportFromCjs (x) {
 	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;

package/dist/{DatePicker-CUmrPZZ-.js → DatePicker-CAgJ_CIz.js} RENAMED Viewed

@@ -9,7 +9,7 @@ import { o as offset$1, f as flip$1, c as computePosition, b as arrow$2, g as ge
 import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
 import { B as Button } from './Button-ULZVVxWC.js';
 import { I as Icon } from './Icon-DWnG-4KG.js';
-import { I as Input } from './Input-CYMKQ0qF.js';
+import { I as Input } from './Input-CYDtAlO-.js';
 import { L as Label } from './Label-VHbRKztj.js';
 import { T as Text } from './Text-CxrzHFN1.js';

package/dist/{Input-CYMKQ0qF.js → Input-CYDtAlO-.js} RENAMED Viewed

@@ -1,20 +1,21 @@
 import { j as jsxRuntimeExports } from './jsx-runtime-C2uP7l8s.js';
-import React__default, { useMemo } from 'react';
+import React__default from 'react';
 import clsx from 'clsx';
 import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
 var inputConfig = {
-    state: undefined,
-    setState: function (newComponent) {
-        inputConfig.state = newComponent;
-    },
     appearance: undefined,
     setAppearance: function (newComponent) {
         inputConfig.appearance = newComponent;
     },
+    state: undefined,
+    // eslint-disable-next-line perfectionist/sort-objects
+    setState: function (newComponent) {
+        inputConfig.state = newComponent;
+    },
 };
 var Input = React__default.forwardRef(function Input(props, ref) {
-    var appearance = props.appearance, state = props.state, index = props.index, id = props.id, dataTestId = props.dataTestId, type = props.type, className = props.className, name = props.name, placeholder = props.placeholder, isDisabled = props.isDisabled, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
+    var id = props.id, isDisabled = props.isDisabled, appearance = props.appearance, className = props.className, dataTestId = props.dataTestId, index = props.index, name = props.name, placeholder = props.placeholder, state = props.state, type = props.type, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
     var fillClass = useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'fill',
@@ -79,9 +80,12 @@ var Input = React__default.forwardRef(function Input(props, ref) {
         prefix: 'width_',
         propsKey: 'width',
     });
-    var appearanceConfig = useMemo(function () { return appearance && inputConfig.appearance && inputConfig.appearance[appearance]; }, [appearance, inputConfig]);
-    var stateConfig = useMemo(function () { return state && inputConfig.state && inputConfig.state[state]; }, [state, inputConfig]);
-    return (jsxRuntimeExports.jsx("input", { className: clsx(className, 'input', type === 'number' && 'input_type_number', (textSizeClass || textColorClass || weightClass) && 'text', caretClass, !isDisabled ? fillClass : fillDisabledClass, shapeClass ||
+    // prettier-ignore
+    var appearanceConfig = (appearance && inputConfig.appearance && inputConfig.appearance[appearance]);
+    var stateConfig = state && inputConfig.state && inputConfig.state[state];
+    return (jsxRuntimeExports.jsx("input", { "data-test-id": dataTestId || (name ? "".concat(name, "Input") : 'input'), disabled: isDisabled, id: String(id),
+        // @ts-ignore
+        index: index, placeholder: placeholder, ref: ref, type: type, value: value, className: clsx(className, 'input', type === 'number' && 'input_type_number', (textSizeClass || textColorClass || weightClass) && 'text', caretClass, !isDisabled ? fillClass : fillDisabledClass, shapeClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.shape) &&
                 "input_shape_".concat(appearanceConfig.shape).replace(/([A-Z])/g, '-$1').toLowerCase()), textSizeClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize) &&
@@ -121,9 +125,7 @@ var Input = React__default.forwardRef(function Input(props, ref) {
                     "text-color_".concat(stateConfig.textColor).replace(/([A-Z])/g, '-$1').toLowerCase())
             : textColorDisabledClass ||
                 ((stateConfig === null || stateConfig === void 0 ? void 0 : stateConfig.textColor) &&
-                    "text-color_".concat(stateConfig.textColor).replace(/([A-Z])/g, '-$1').toLowerCase())), "data-test-id": dataTestId || (name ? "".concat(name, "Input") : 'input'), disabled: isDisabled, id: String(id),
-        // @ts-ignore
-        index: index, placeholder: placeholder, ref: ref, type: type, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
+                    "text-color_".concat(stateConfig.textColor).replace(/([A-Z])/g, '-$1').toLowerCase())), onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
 });
 Input.defaultProps = {
     size: 'm',

package/dist/{Logo-D6UNcO5P.js → Logo-D4NFjeqd.js} RENAMED Viewed

@@ -5,7 +5,7 @@ import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
 import { useStyles } from './hooks/useStyles.js';
 function Logo(props) {
-    var className = props.className, href = props.href, link = props.link, mode = props.mode, size = props.size, source = props.source, src = props.src;
+    var alt = props.alt, className = props.className, href = props.href, link = props.link, mode = props.mode, size = props.size, source = props.source, src = props.src;
     var alignItemsClass = useDeviceTargetClass(props, {
         prefix: 'logo_align-items_',
         propsKey: 'alignItems',
@@ -24,7 +24,7 @@ function Logo(props) {
     });
     // @ts-expect-error
     var logo = useStyles(props).styles;
-    return (jsxRuntimeExports.jsx("div", { className: clsx(className, 'logo', alignDirectionClass, alignClass, widthClass, alignItemsClass, size && "logo_size_".concat(size), mode && "logo_mode_".concat(mode)), style: logo, children: link || href ? (jsxRuntimeExports.jsxs(LinkWrapper, { href: link || href, children: [' ', jsxRuntimeExports.jsx("img", { className: "logo__image", src: src || source })] })) : (jsxRuntimeExports.jsx("img", { className: "logo__image", src: src || source })) }));
+    return (jsxRuntimeExports.jsx("div", { className: clsx(className, 'logo', alignClass, alignDirectionClass, alignItemsClass, alt, mode && "logo_mode_".concat(mode), size && "logo_size_".concat(size), widthClass), style: logo, children: link || href ? (jsxRuntimeExports.jsxs(LinkWrapper, { href: link || href, children: [' ', jsxRuntimeExports.jsx("img", { className: "logo__image", src: src || source })] })) : (jsxRuntimeExports.jsx("img", { className: "logo__image", src: src || source })) }));
 }
 export { Logo as L };

package/dist/{ModalLoader-8l8YtIvz.js → ModalLoader-D17lZhS7.js} RENAMED Viewed

@@ -63,6 +63,8 @@ var Modal = React__default.forwardRef(function Modal(props, ref) {
     // Show modal with children content
     var openModal = useCallback(function () {
         setIsOpen(true);
+        console.warn('========   openModal   ========');
+        console.log('onOpenModal ', onOpenModal);
         // Callback
         if (typeof onOpenModal === 'function') {
             onOpenModal();
@@ -110,7 +112,12 @@ var Modal = React__default.forwardRef(function Modal(props, ref) {
         }
     }, []);
     // Save ref things
-    useImperativeHandle(ref, function () { return ({ isOpen: isOpen, openModal: openModal, closeModal: closeModal, modalElement: modalElement }); });
+    useImperativeHandle(ref, function () { return ({ isOpen: isOpen, closeModal: closeModal, modalElement: modalElement, openModal: openModal }); }, [
+        isOpen,
+        openModal,
+        closeModal,
+        modalElement,
+    ]);
     var fillClass = useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'fill',

package/dist/{Response-DzfL5Sy8.js → Response-m-8zeYeD.js} RENAMED Viewed

@@ -16,7 +16,7 @@ var responseConfig = {
     },
 };
 function Response(props) {
-    var after = props.after, before = props.before, appearance = props.appearance, imageSrc = props.imageSrc, className = props.className, title = props.title, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, titleTextColor = props.titleTextColor, message = props.message, messageTextColor = props.messageTextColor, messageTextSize = props.messageTextSize, primaryButton = props.primaryButton, primaryButtonAfter = props.primaryButtonAfter, primaryButtonAppearance = props.primaryButtonAppearance, primaryButtonBefore = props.primaryButtonBefore, primaryButtonFill = props.primaryButtonFill, primaryButtonFillHover = props.primaryButtonFillHover, primaryButtonLabel = props.primaryButtonLabel, primaryButtonLabelTextColor = props.primaryButtonLabelTextColor, primaryButtonLabelTextSize = props.primaryButtonLabelTextSize, primaryButtonShape = props.primaryButtonShape, primaryButtonSize = props.primaryButtonSize, primaryButtonWidth = props.primaryButtonWidth, secondaryButton = props.secondaryButton, secondaryButtonAfter = props.secondaryButtonAfter, secondaryButtonAppearance = props.secondaryButtonAppearance, secondaryButtonBefore = props.secondaryButtonBefore, secondaryButtonFill = props.secondaryButtonFill, secondaryButtonFillHover = props.secondaryButtonFillHover, secondaryButtonLabel = props.secondaryButtonLabel, secondaryButtonLabelTextColor = props.secondaryButtonLabelTextColor, secondaryButtonLabelTextSize = props.secondaryButtonLabelTextSize, secondaryButtonShape = props.secondaryButtonShape, secondaryButtonSize = props.secondaryButtonSize, secondaryButtonWidth = props.secondaryButtonWidth, set = props.set, onClickPrimaryButton = props.onClickPrimaryButton, onClickSecondaryButton = props.onClickSecondaryButton;
+    var after = props.after, before = props.before, appearance = props.appearance, imageSrc = props.imageSrc, className = props.className, title = props.title, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, message = props.message, messageTextColor = props.messageTextColor, messageTextSize = props.messageTextSize, messageTextWeight = props.messageTextWeight, primaryButton = props.primaryButton, primaryButtonAfter = props.primaryButtonAfter, primaryButtonAppearance = props.primaryButtonAppearance, primaryButtonBefore = props.primaryButtonBefore, primaryButtonFill = props.primaryButtonFill, primaryButtonFillHover = props.primaryButtonFillHover, primaryButtonLabel = props.primaryButtonLabel, primaryButtonLabelTextColor = props.primaryButtonLabelTextColor, primaryButtonLabelTextSize = props.primaryButtonLabelTextSize, primaryButtonShape = props.primaryButtonShape, primaryButtonSize = props.primaryButtonSize, primaryButtonWidth = props.primaryButtonWidth, secondaryButton = props.secondaryButton, secondaryButtonAfter = props.secondaryButtonAfter, secondaryButtonAppearance = props.secondaryButtonAppearance, secondaryButtonBefore = props.secondaryButtonBefore, secondaryButtonFill = props.secondaryButtonFill, secondaryButtonFillHover = props.secondaryButtonFillHover, secondaryButtonLabel = props.secondaryButtonLabel, secondaryButtonLabelTextColor = props.secondaryButtonLabelTextColor, secondaryButtonLabelTextSize = props.secondaryButtonLabelTextSize, secondaryButtonShape = props.secondaryButtonShape, secondaryButtonSize = props.secondaryButtonSize, secondaryButtonWidth = props.secondaryButtonWidth, set = props.set, onClickPrimaryButton = props.onClickPrimaryButton, onClickSecondaryButton = props.onClickSecondaryButton;
     var ImageComponent = useMemo(function () {
         if (imageSrc) {
             // eslint-disable-next-line react/prop-types
@@ -64,7 +64,7 @@ function Response(props) {
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
                 "fill_hover_".concat(appearanceConfig.fillHover).replace(/([A-Z])/g, '-$1').toLowerCase()), shapeClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.shape) &&
-                "fill_hover_".concat(appearanceConfig.shape).replace(/([A-Z])/g, '-$1').toLowerCase()), borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, set && "response_set_".concat(set)), style: responseStyles, children: [before, ImageComponent || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.imageSrc), jsxRuntimeExports.jsxs(Group, { className: "response__desc", width: "fill", children: [title && (jsxRuntimeExports.jsx(Title, { className: "response__title", size: titleTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextSize) || 'h2', textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), textWeight: titleTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextWeight) || '600', children: title })), message && (jsxRuntimeExports.jsx(Text, { className: "response__message", size: messageTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.messageTextSize) || 'xxl', textColor: messageTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.messageTextColor), children: message }))] }), (primaryButtonLabel ||
+                "fill_hover_".concat(appearanceConfig.shape).replace(/([A-Z])/g, '-$1').toLowerCase()), borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, set && "response_set_".concat(set)), style: responseStyles, children: [before, ImageComponent || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.imageSrc), jsxRuntimeExports.jsxs(Group, { className: "response__desc", width: "fill", children: [title && (jsxRuntimeExports.jsx(Title, { className: "response__title", size: titleTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextSize) || 'h2', textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), textWeight: titleTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextWeight) || '600', children: title })), message && (jsxRuntimeExports.jsx(Text, { className: "response__message", size: messageTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.messageTextSize) || 'xxl', textColor: messageTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.messageTextColor), textWeight: messageTextWeight, children: message }))] }), (primaryButtonLabel ||
                 primaryButton ||
                 secondaryButtonLabel ||
                 secondaryButton ||

package/dist/cjs/{Accordion-UbOVpiO4.js → Accordion-rCFDAon3.js} RENAMED Viewed

@@ -46,12 +46,17 @@ const icon16 = {
 };
 function AccordionItem(props) {
-    var children = props.children, id = props.id, title = props.title, icon = props.icon, _a = props.iconFill, iconFill = _a === void 0 ? 'surfaceItemAccent' : _a, content = props.content, beforeContent = props.beforeContent, afterContent = props.afterContent, className = props.className, titleTextSize = props.titleTextSize, titleTextColor = props.titleTextColor, titleTextWeight = props.titleTextWeight, contentTextSize = props.contentTextSize, contentTextColor = props.contentTextColor, contentTextWeight = props.contentTextWeight, size = props.size, isExpanded = props.isExpanded, onClick = props.onClick;
+    var id = props.id, children = props.children, isExpanded = props.isExpanded, afterContent = props.afterContent, beforeContent = props.beforeContent, className = props.className, content = props.content, contentTextColor = props.contentTextColor, contentTextSize = props.contentTextSize, contentTextWeight = props.contentTextWeight, icon = props.icon, _a = props.iconFill, iconFill = _a === void 0 ? 'surfaceItemAccent' : _a, size = props.size, title = props.title, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, onClick = props.onClick;
     var onClickTitle = React.useCallback(function () {
-        // !isExpanded - is next state of expanded
-        var thisItemData = { id: id, title: title, content: content, isExpanded: !isExpanded };
+        // "!isExpanded" - is next state of expanded
+        var thisItemData = {
+            id: id,
+            isExpanded: !isExpanded,
+            content: content,
+            title: title,
+        };
         onClick && onClick(thisItemData);
-    }, [onClick, id, title, content, isExpanded]);
+    }, [id, title, content, isExpanded, onClick]);
     var borderColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
         prefix: 'border-color_',
         propsKey: 'borderColor',
@@ -90,7 +95,7 @@ function AccordionItem(props) {
     });
     // @ts-expect-error
     var styles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default('accordion-item', className, borderColorClass, fillClass, fillHoverClass, shapeClass, size && "accordion-item_size_".concat(size), isExpanded && 'accordion-item_state_open'), style: styles, children: [jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: clsx__default.default('accordion-item__title', titleBorderColorClass, titleFillClass, titleFillHoverClass, 'cursor_type_pointer'), size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, onClick: onClickTitle, children: title }), jsxRuntime.jsxRuntimeExports.jsx("div", { className: clsx__default.default('accordion-item__icon', 'cursor_type_pointer'), onClick: onClickTitle, children: icon || (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { iconFill: iconFill, size: "16", SvgImage: icon16.ChevronDown })) }), beforeContent && beforeContent, isExpanded && (jsxRuntime.jsxRuntimeExports.jsx("div", { className: clsx__default.default('accordion-item__content', contentBorderColorClass, contentFillClass, fillHoverClass), children: children ||
+    return (jsxRuntime.jsxRuntimeExports.jsxs("div", { style: styles, className: clsx__default.default('accordion-item', className, borderColorClass, fillClass, fillHoverClass, shapeClass, size && "accordion-item_size_".concat(size), isExpanded && 'accordion-item_state_open'), children: [jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, className: clsx__default.default('accordion-item__title', titleBorderColorClass, titleFillClass, titleFillHoverClass, 'cursor_type_pointer'), onClick: onClickTitle, children: title }), jsxRuntime.jsxRuntimeExports.jsx("div", { className: clsx__default.default('accordion-item__icon', 'cursor_type_pointer'), onClick: onClickTitle, children: icon || jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { SvgImage: icon16.ChevronDown, iconFill: iconFill, size: "16" }) }), beforeContent && beforeContent, isExpanded && (jsxRuntime.jsxRuntimeExports.jsx("div", { className: clsx__default.default('accordion-item__content', contentBorderColorClass, contentFillClass, fillHoverClass), children: children ||
                     (content && (jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { size: contentTextSize, textColor: contentTextColor, textWeight: contentTextWeight, children: content }))) })), afterContent && afterContent] }));
 }
 AccordionItem.defaultProps = {
@@ -98,7 +103,7 @@ AccordionItem.defaultProps = {
 };
 function Accordion(props) {
-    var children = props.children, items = props.items, className = props.className, _a = props.initial, initial = _a === void 0 ? [] : _a, isMultiple = props.isMultiple, onClickItem = props.onClickItem;
+    var children = props.children, isMultiple = props.isMultiple, className = props.className, _a = props.initial, initial = _a === void 0 ? [] : _a, items = props.items, onClickItem = props.onClickItem;
     var _b = React.useState(castArray__default.default(initial)), expandedItems = _b[0], setExpandedItems = _b[1];
     var onClickAccordionItem = React.useCallback(function (targetItem) {
         setExpandedItems(function (prevState) {
@@ -123,12 +128,13 @@ function Accordion(props) {
             }
         });
         onClickItem && onClickItem(targetItem);
-    }, [onClickItem]);
+    }, [isMultiple, onClickItem]);
     var accordionItemsList = React.useMemo(function () {
         if (items) {
-            return items.map(function (item, i) { return (jsxRuntime.jsxRuntimeExports.jsx(AccordionItem, { content: item.content, id: item.id, isExpanded: expandedItems.includes(item.id), title: item.title, onClick: onClickAccordionItem }, "accordionItem_".concat(item.id || i + 1))); });
+            return items.map(function (item, i) { return (jsxRuntime.jsxRuntimeExports.jsx(AccordionItem, { content: item.content, id: item.id, title: item.title, isExpanded: expandedItems.includes(item.id), onClick: onClickAccordionItem }, "accordionItem_".concat(item.id || i + 1))); });
         }
         if (children) {
+            // @ts-ignore
             return React__default.default.Children.toArray(children).map(function (child) {
                 if (React__default.default.isValidElement(child)) {
                     var childID = child.props.id || child.key;
@@ -170,7 +176,7 @@ function Accordion(props) {
      */
     // @ts-expect-error
     var _c = useStyles.useStyles(props), accordionStyles = _c.styles, accordionWrapperStyles = _c.wrapper;
-    return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: clsx__default.default(className, 'accordion', borderColorClass, directionClass, fillClass, shapeClass, widthClass), style: accordionStyles, children: jsxRuntime.jsxRuntimeExports.jsx("div", { className: "accordion__wrapper", style: accordionWrapperStyles, children: accordionItemsList }) }));
+    return (jsxRuntime.jsxRuntimeExports.jsx("div", { style: accordionStyles, className: clsx__default.default(className, 'accordion', borderColorClass, directionClass, fillClass, shapeClass, widthClass), children: jsxRuntime.jsxRuntimeExports.jsx("div", { className: "accordion__wrapper", style: accordionWrapperStyles, children: accordionItemsList }) }));
 }
 Accordion.defaultProps = {
     initial: [],

package/dist/cjs/{Cell-BhsGTfV-.js → Cell-DEBk3Rbp.js} RENAMED Viewed

@@ -6,6 +6,7 @@ var useDeviceTargetClass = require('./hooks/useDeviceTargetClass.js');
 var Icon = require('./Icon-2rv_L0yY.js');
 var Label = require('./Label-EFoxH21m.js');
 var Text = require('./Text-C8vlKWNN.js');
+var useStyles = require('./hooks/useStyles.js');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -61,7 +62,9 @@ function Cell(props) {
         prefix: 'width_',
         propsKey: 'width',
     });
-    return (jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default(className, 'cell', mode && "cell_mode_".concat(mode), size && "cell_size_".concat(size), set && "cell_set_".concat(set), bgFillClass, bgFillHoverClass, isActive && bgFillActiveClass, isDisabled && bgFillDisabledClass, bgShapeClass, widthClass, zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap', reverse && 'cell_reverse'), onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsxRuntime.jsxRuntimeExports.jsx("div", { className: "cell__before", children: before }), jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default('cell__wrapper', directionClass, fillClass, fillHoverClass, isActive && fillActiveClass, isDisabled && fillDisabledClass, shapeClass), children: [title && (jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "cell__data", children: [jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "cell__title", size: titleTextSize, tag: titleTag, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title }), (titleIcon || titleIconSrc) && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { className: "cell__icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), showTitleLabel && (jsxRuntime.jsxRuntimeExports.jsx(Label.Label, { appearance: titleLabelAppearance, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape, size: titleLabelSize }))] })), value && (jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "cell__data", children: [jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "cell__value", size: valueTextSize, tag: valueTag, textAlign: valueTextAlign, textColor: valueTextColor, textWeight: valueTextWeight, textWrap: valueTextWrap, children: value }), (valueIcon || valueIconSrc) && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { className: "cell__icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), showValueLabel && (jsxRuntime.jsxRuntimeExports.jsx(Label.Label, { appearance: valueLabelAppearance, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape, size: valueLabelSize }))] }))] }), after && jsxRuntime.jsxRuntimeExports.jsx("div", { className: "cell__after", children: after })] }));
+    // @ts-expect-error
+    var cellStyles = useStyles.useStyles(props).styles;
+    return (jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default(className, 'cell', mode && "cell_mode_".concat(mode), size && "cell_size_".concat(size), set && "cell_set_".concat(set), bgFillClass, bgFillHoverClass, isActive && bgFillActiveClass, isDisabled && bgFillDisabledClass, bgShapeClass, widthClass, zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap', reverse && 'cell_reverse'), onClick: onClick, onMouseEnter: onMouseEnter, style: cellStyles, children: [before && jsxRuntime.jsxRuntimeExports.jsx("div", { className: "cell__before", children: before }), jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default('cell__wrapper', directionClass, fillClass, fillHoverClass, isActive && fillActiveClass, isDisabled && fillDisabledClass, shapeClass), children: [title && (jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "cell__data", children: [jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "cell__title", size: titleTextSize, tag: titleTag, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title }), (titleIcon || titleIconSrc) && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { className: "cell__icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), showTitleLabel && (jsxRuntime.jsxRuntimeExports.jsx(Label.Label, { appearance: titleLabelAppearance, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape, size: titleLabelSize }))] })), value && (jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "cell__data", children: [jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "cell__value", size: valueTextSize, tag: valueTag, textAlign: valueTextAlign, textColor: valueTextColor, textWeight: valueTextWeight, textWrap: valueTextWrap, children: value }), (valueIcon || valueIconSrc) && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { className: "cell__icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), showValueLabel && (jsxRuntime.jsxRuntimeExports.jsx(Label.Label, { appearance: valueLabelAppearance, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape, size: valueLabelSize }))] }))] }), after && jsxRuntime.jsxRuntimeExports.jsx("div", { className: "cell__after", children: after })] }));
 }
 Cell.defaultProps = {
     isDisabled: false,

package/dist/cjs/{Checkbox-B-1dwjii.js → Checkbox-BIvndDsy.js} RENAMED Viewed

@@ -1,7 +1,6 @@
 'use strict';
 var jsxRuntime = require('./jsx-runtime-BBxmckJR.js');
-var React = require('react');
 var clsx = require('clsx');
 var useDeviceTargetClass = require('./hooks/useDeviceTargetClass.js');
 var Text = require('./Text-C8vlKWNN.js');
@@ -11,17 +10,18 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 var clsx__default = /*#__PURE__*/_interopDefault(clsx);
 var checkboxConfig = {
-    state: undefined,
-    setState: function (newComponent) {
-        checkboxConfig.state = newComponent;
-    },
     appearance: undefined,
     setAppearance: function (newComponent) {
         checkboxConfig.appearance = newComponent;
     },
+    state: undefined,
+    // eslint-disable-next-line perfectionist/sort-objects
+    setState: function (newComponent) {
+        checkboxConfig.state = newComponent;
+    },
 };
 function Checkbox(props) {
-    var appearance = props.appearance, before = props.before, after = props.after, id = props.id, _a = props.Tag, Tag = _a === void 0 ? 'label' : _a, className = props.className, checked = props.checked, disabled = props.disabled, descTextSize = props.descTextSize, descTextWeight = props.descTextWeight, descTextColor = props.descTextColor, desc = props.desc, label = props.label, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, labelTextColor = props.labelTextColor, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, value = props.value;
+    var id = props.id, _a = props.Tag, Tag = _a === void 0 ? 'label' : _a, after = props.after, appearance = props.appearance, before = props.before, checked = props.checked, className = props.className, desc = props.desc, descTextColor = props.descTextColor, descTextSize = props.descTextSize, descTextWeight = props.descTextWeight, disabled = props.disabled, label = props.label, labelTextColor = props.labelTextColor, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus;
     var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'fill',
@@ -62,7 +62,8 @@ function Checkbox(props) {
         prefix: 'width_',
         propsKey: 'width',
     });
-    var appearanceConfig = React.useMemo(function () { return appearance && checkboxConfig.appearance && checkboxConfig.appearance[appearance]; }, [appearance, checkboxConfig]);
+    // prettier-ignore
+    var appearanceConfig = (appearance && checkboxConfig.appearance && checkboxConfig.appearance[appearance]);
     return (jsxRuntime.jsxRuntimeExports.jsxs(Tag, { className: clsx__default.default(className, 'checkbox', fillClass, shapeClass, widthClass), htmlFor: Tag === 'label' && id, children: [before, jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default('checkbox__item', stateCheckmarkFillClass ||
                     ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.stateCheckmarkFill) &&
                         "checkbox_checkmark_fill_".concat(appearanceConfig.stateCheckmarkFill)

package/dist/cjs/{Chips-BcJttN22.js → Chips-i7zrI9aU.js} RENAMED Viewed

@@ -18,7 +18,7 @@ var chipsConfig = {
     },
 };
 function Chips(props) {
-    var appearance = props.appearance, children = props.children, className = props.className, label = props.label, labelSize = props.labelSize, labelTextColor = props.labelTextColor, labelTextWeight = props.labelTextWeight, type = props.type, onClick = props.onClick;
+    var isActive = props.isActive, labelTextActiveColor = props.labelTextActiveColor, appearance = props.appearance, children = props.children, className = props.className, label = props.label, labelTextSize = props.labelTextSize, labelTextColor = props.labelTextColor, labelTextWeight = props.labelTextWeight, type = props.type, onClick = props.onClick;
     var alignDirectionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
         prefix: 'align_',
         propsKey: 'alignDirection',
@@ -35,6 +35,10 @@ function Chips(props) {
         prefix: 'fill_hover_',
         propsKey: 'fillHover',
     });
+    var fillActiveClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'fill_active_',
+        propsKey: 'fillActive',
+    });
     var sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
         prefix: 'chips_size_',
         propsKey: 'size',
@@ -58,7 +62,9 @@ function Chips(props) {
     // @ts-expect-error
     var chipsStyles = useStyles.useStyles(props).styles;
     var appearanceConfig = React.useMemo(function () { return appearance && chipsConfig.appearance && chipsConfig.appearance[appearance]; }, [appearance, chipsConfig]);
-    return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: clsx__default.default(className, 'chips', fillClass ||
+    return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: clsx__default.default(className, 'chips', isActive && 'chips_state_active', isActive ? fillActiveClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillActive) &&
+                "fill_".concat(appearanceConfig.fillActive).replace(/([A-Z])/g, '-$1').toLowerCase()) : fillClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
                 "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), fillHoverClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
@@ -66,7 +72,7 @@ function Chips(props) {
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderColor) &&
                 "border-color_".concat(appearanceConfig.borderColor)
                     .replace(/([A-Z])/g, '-$1')
-                    .toLowerCase()), borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && "chips_type_".concat(type), cursorClass), style: chipsStyles, onClick: onClick, children: jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "chips__inner", children: [typeof label === 'string' ? (jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "chips__label", textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textWeight: labelTextWeight, size: labelSize, children: label })) : (jsxRuntime.jsxRuntimeExports.jsx("div", { className: "chips__label", children: label })), children] }) }));
+                    .toLowerCase()), borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && "chips_type_".concat(type), cursorClass, onClick && 'cursor_type_pointer'), style: chipsStyles, onClick: onClick, children: jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "chips__inner", children: [typeof label === 'string' ? (jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "chips__label", textColor: isActive ? labelTextActiveColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextActiveColor) : labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textWeight: labelTextWeight, size: labelTextSize, children: label })) : (jsxRuntime.jsxRuntimeExports.jsx("div", { className: "chips__label", children: label })), children] }) }));
 }
 Chips.defaultProps = {
     label: 'Chips',

package/dist/cjs/{DadataHintField-DQHPRLs0.js → DadataHintField-z7Mw-xDn.js} RENAMED Viewed

@@ -5,7 +5,7 @@ var jsxRuntime = require('./jsx-runtime-BBxmckJR.js');
 var React = require('react');
 var clsx = require('clsx');
 var crypto = require('crypto');
-var Input = require('./Input-BqKlyvEt.js');
+var Input = require('./Input-vwyG3XF0.js');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

package/dist/cjs/{DatePicker-DOmOhaU3.js → DatePicker-e4-8mC1N.js} RENAMED Viewed

@@ -9,7 +9,7 @@ var floatingUi_dom = require('./floating-ui.dom-D1St6qnn.js');
 var useDeviceTargetClass = require('./hooks/useDeviceTargetClass.js');
 var Button = require('./Button-DfUQ11Hs.js');
 var Icon = require('./Icon-2rv_L0yY.js');
-var Input = require('./Input-BqKlyvEt.js');
+var Input = require('./Input-vwyG3XF0.js');
 var Label = require('./Label-EFoxH21m.js');
 var Text = require('./Text-C8vlKWNN.js');

package/dist/cjs/{Input-BqKlyvEt.js → Input-vwyG3XF0.js} RENAMED Viewed

@@ -11,17 +11,18 @@ var React__default = /*#__PURE__*/_interopDefault(React);
 var clsx__default = /*#__PURE__*/_interopDefault(clsx);
 var inputConfig = {
-    state: undefined,
-    setState: function (newComponent) {
-        inputConfig.state = newComponent;
-    },
     appearance: undefined,
     setAppearance: function (newComponent) {
         inputConfig.appearance = newComponent;
     },
+    state: undefined,
+    // eslint-disable-next-line perfectionist/sort-objects
+    setState: function (newComponent) {
+        inputConfig.state = newComponent;
+    },
 };
 var Input = React__default.default.forwardRef(function Input(props, ref) {
-    var appearance = props.appearance, state = props.state, index = props.index, id = props.id, dataTestId = props.dataTestId, type = props.type, className = props.className, name = props.name, placeholder = props.placeholder, isDisabled = props.isDisabled, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
+    var id = props.id, isDisabled = props.isDisabled, appearance = props.appearance, className = props.className, dataTestId = props.dataTestId, index = props.index, name = props.name, placeholder = props.placeholder, state = props.state, type = props.type, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
     var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'fill',
@@ -86,9 +87,12 @@ var Input = React__default.default.forwardRef(function Input(props, ref) {
         prefix: 'width_',
         propsKey: 'width',
     });
-    var appearanceConfig = React.useMemo(function () { return appearance && inputConfig.appearance && inputConfig.appearance[appearance]; }, [appearance, inputConfig]);
-    var stateConfig = React.useMemo(function () { return state && inputConfig.state && inputConfig.state[state]; }, [state, inputConfig]);
-    return (jsxRuntime.jsxRuntimeExports.jsx("input", { className: clsx__default.default(className, 'input', type === 'number' && 'input_type_number', (textSizeClass || textColorClass || weightClass) && 'text', caretClass, !isDisabled ? fillClass : fillDisabledClass, shapeClass ||
+    // prettier-ignore
+    var appearanceConfig = (appearance && inputConfig.appearance && inputConfig.appearance[appearance]);
+    var stateConfig = state && inputConfig.state && inputConfig.state[state];
+    return (jsxRuntime.jsxRuntimeExports.jsx("input", { "data-test-id": dataTestId || (name ? "".concat(name, "Input") : 'input'), disabled: isDisabled, id: String(id),
+        // @ts-ignore
+        index: index, placeholder: placeholder, ref: ref, type: type, value: value, className: clsx__default.default(className, 'input', type === 'number' && 'input_type_number', (textSizeClass || textColorClass || weightClass) && 'text', caretClass, !isDisabled ? fillClass : fillDisabledClass, shapeClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.shape) &&
                 "input_shape_".concat(appearanceConfig.shape).replace(/([A-Z])/g, '-$1').toLowerCase()), textSizeClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize) &&
@@ -128,9 +132,7 @@ var Input = React__default.default.forwardRef(function Input(props, ref) {
                     "text-color_".concat(stateConfig.textColor).replace(/([A-Z])/g, '-$1').toLowerCase())
             : textColorDisabledClass ||
                 ((stateConfig === null || stateConfig === void 0 ? void 0 : stateConfig.textColor) &&
-                    "text-color_".concat(stateConfig.textColor).replace(/([A-Z])/g, '-$1').toLowerCase())), "data-test-id": dataTestId || (name ? "".concat(name, "Input") : 'input'), disabled: isDisabled, id: String(id),
-        // @ts-ignore
-        index: index, placeholder: placeholder, ref: ref, type: type, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
+                    "text-color_".concat(stateConfig.textColor).replace(/([A-Z])/g, '-$1').toLowerCase())), onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
 });
 Input.defaultProps = {
     size: 'm',