@itcase/ui 1.8.123 → 1.8.125

package/dist/cjs/components/RangeSlider.js

@@ -5,7 +5,6 @@ var clsx = require('clsx');
 var Slider = require('rc-slider');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-require('../../tslib.es6_cjs_CCZ3TN_7.js');
 require('react');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -22,15 +21,15 @@ require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
 
 function RangeSlider(props) {
-    var className = props.className, min = props.min, max = props.max, disabled = props.disabled, pushable = props.pushable, range = props.range, value = props.value, vertical = props.vertical, before = props.before, after = props.after, set = props.set, onChangeSlider = props.onChangeSlider, children = props.children;
-    var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
-    var fillClass = propsGenerator.fillClass, fillHandleClass = propsGenerator.fillHandleClass, fillHandleDraggingClass = propsGenerator.fillHandleDraggingClass, fillHandleDraggingHoverClass = propsGenerator.fillHandleDraggingHoverClass, fillHandleHoverClass = propsGenerator.fillHandleHoverClass, fillRailClass = propsGenerator.fillRailClass, fillTrackClass = propsGenerator.fillTrackClass, shapeClass = propsGenerator.shapeClass, widthClass = propsGenerator.widthClass;
+    const { className, min, max, disabled, pushable, range, value, vertical, before, after, set, onChangeSlider, children, } = props;
+    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
+    const { fillClass, fillHandleClass, fillHandleDraggingClass, fillHandleDraggingHoverClass, fillHandleHoverClass, fillRailClass, fillTrackClass, shapeClass, widthClass, } = propsGenerator;
     // @ts-expect-error
-    var rangeSliderStyles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsxs("div", { className: clsx(className, 'range-slider', set && "range-slider_set_".concat(set), fillClass && "fill_".concat(fillClass), fillTrackClass && "range-slider-track-fill_".concat(fillTrackClass), fillRailClass && "range-slider-rail-fill_".concat(fillRailClass), fillHandleClass && "range-slider-handle-fill_".concat(fillHandleClass), fillHandleHoverClass &&
-            "range-slider-handle-fill-hover_".concat(fillHandleHoverClass), fillHandleDraggingClass &&
-            "range-slider-handle-dragging-fill_".concat(fillHandleDraggingClass), fillHandleDraggingHoverClass &&
-            "range-slider-handle-dragging-fill-hover_".concat(fillHandleDraggingHoverClass), shapeClass && "range-slider_shape_".concat(shapeClass), widthClass && "width_".concat(widthClass)), style: rangeSliderStyles, children: [before && jsxRuntime.jsx("div", { className: "range-slider__before", children: before }), jsxRuntime.jsx(Slider, { className: "range-slider__wrapper", min: min, max: max, disabled: disabled, pushable: pushable, range: range, value: value, vertical: vertical, onChange: onChangeSlider }), children, after && jsxRuntime.jsx("div", { className: "range-slider__after", children: after })] }));
+    const { styles: rangeSliderStyles } = useStyles.useStyles(props);
+    return (jsxRuntime.jsxs("div", { className: clsx(className, 'range-slider', set && `range-slider_set_${set}`, fillClass && `fill_${fillClass}`, fillTrackClass && `range-slider-track-fill_${fillTrackClass}`, fillRailClass && `range-slider-rail-fill_${fillRailClass}`, fillHandleClass && `range-slider-handle-fill_${fillHandleClass}`, fillHandleHoverClass &&
+            `range-slider-handle-fill-hover_${fillHandleHoverClass}`, fillHandleDraggingClass &&
+            `range-slider-handle-dragging-fill_${fillHandleDraggingClass}`, fillHandleDraggingHoverClass &&
+            `range-slider-handle-dragging-fill-hover_${fillHandleDraggingHoverClass}`, shapeClass && `range-slider_shape_${shapeClass}`, widthClass && `width_${widthClass}`), style: rangeSliderStyles, children: [before && jsxRuntime.jsx("div", { className: "range-slider__before", children: before }), jsxRuntime.jsx(Slider, { className: "range-slider__wrapper", min: min, max: max, disabled: disabled, pushable: pushable, range: range, value: value, vertical: vertical, onChange: onChangeSlider }), children, after && jsxRuntime.jsx("div", { className: "range-slider__after", children: after })] }));
 }
 
 exports.RangeSlider = RangeSlider;

package/dist/cjs/components/Response/img.js

@@ -22,7 +22,7 @@ var img$1 = "data:image/svg+xml,%3csvg width='180' height='180' viewBox='0 0 180
 
 var img = "data:image/svg+xml,%3csvg width='180' height='180' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='180' height='180' rx='90' fill='%23DE8806'/%3e%3cpath d='M90.5029 123.721C93.8166 123.721 96.5029 126.407 96.5029 129.721V134.749C96.5027 138.063 93.8165 140.749 90.5029 140.749C87.1894 140.749 84.5031 138.063 84.5029 134.749V129.721C84.5029 126.407 87.1892 123.721 90.5029 123.721ZM90.5029 39.251C93.8166 39.251 96.5029 41.9383 96.5029 45.252V104.582C96.5024 107.895 93.8163 110.582 90.5029 110.582C87.1895 110.582 84.5034 107.895 84.5029 104.582V45.252C84.5029 41.9382 87.1892 39.251 90.5029 39.251Z' fill='white'/%3e%3c/svg%3e";
 
-var responseIcon = {
+const responseIcon = {
     Error: img$7,
     Warning: img,
     Success: img$2,

package/dist/cjs/components/Response.js

@@ -1,7 +1,6 @@
 'use strict';
 
 var index = require('./Response/img.js');
-var tslib_es6 = require('../../tslib.es6_cjs_CCZ3TN_7.js');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
@@ -9,9 +8,9 @@ var urlWithAssetPrefix = require('../hoc/urlWithAssetPrefix.js');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Button = require('../../Button_cjs_Ce97psFT.js');
-var Group = require('../../Group_cjs_CsJ6ICKK.js');
-var Text = require('../../Text_cjs_0EINiUq4.js');
+var Button = require('../../Button_cjs_C34BU1BK.js');
+var Group = require('../../Group_cjs_DmfeUcFI.js');
+var Text = require('../../Text_cjs_BDTjOTVB.js');
 require('@itcase/common');
 require('../context/UrlAssetPrefix.js');
 require('lodash/camelCase');
@@ -26,12 +25,12 @@ require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
-require('../../Icon_cjs_Cz6IyOkb.js');
+require('../../Icon_cjs_BVLGzj7Y.js');
 require('react-inlinesvg');
-require('../../Link_cjs_C5UsZUiF.js');
-require('../../Loader_cjs_D3lnxPlI.js');
+require('../../Link_cjs_qKXVfU8e.js');
+require('../../Loader_cjs_DIDsIq3J.js');
 
-var responseAppearanceConfirm = {
+const responseAppearanceConfirm = {
     confirm: {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
@@ -46,7 +45,7 @@ var responseAppearanceConfirm = {
     },
 };
 
-var responseAppearanceDanger = {
+const responseAppearanceDanger = {
     danger: {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
@@ -61,7 +60,7 @@ var responseAppearanceDanger = {
     },
 };
 
-var responseAppearanceEmpty = {
+const responseAppearanceEmpty = {
     empty: {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
@@ -76,7 +75,7 @@ var responseAppearanceEmpty = {
     },
 };
 
-var responseAppearanceError = {
+const responseAppearanceError = {
     error: {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
@@ -91,7 +90,7 @@ var responseAppearanceError = {
     },
 };
 
-var responseAppearanceFail = {
+const responseAppearanceFail = {
     fail: {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
@@ -106,7 +105,7 @@ var responseAppearanceFail = {
     },
 };
 
-var responseAppearanceNothingFound = {
+const responseAppearanceNothingFound = {
     nothingFound: {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
@@ -121,7 +120,7 @@ var responseAppearanceNothingFound = {
     },
 };
 
-var responseAppearanceRefresh = {
+const responseAppearanceRefresh = {
     refresh: {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
@@ -136,7 +135,7 @@ var responseAppearanceRefresh = {
     },
 };
 
-var responseAppearanceStyle = {
+const responseAppearanceStyle = {
     solid: {
         borderColor: 'none',
     },
@@ -150,7 +149,7 @@ var responseAppearanceStyle = {
     },
 };
 
-var responseAppearanceSuccess = {
+const responseAppearanceSuccess = {
     success: {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
@@ -165,7 +164,7 @@ var responseAppearanceSuccess = {
     },
 };
 
-var responseAppearanceUnableLoadData = {
+const responseAppearanceUnableLoadData = {
     unableLoadData: {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
@@ -180,7 +179,7 @@ var responseAppearanceUnableLoadData = {
     },
 };
 
-var responseAppearanceWarning = {
+const responseAppearanceWarning = {
     warning: {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
@@ -195,32 +194,44 @@ var responseAppearanceWarning = {
     },
 };
 
-var responseAppearance = 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({}, responseAppearanceConfirm), responseAppearanceEmpty), responseAppearanceDanger), responseAppearanceRefresh), responseAppearanceUnableLoadData), responseAppearanceNothingFound), responseAppearanceFail), responseAppearanceError), responseAppearanceSuccess), responseAppearanceWarning), responseAppearanceStyle);
+const responseAppearance = {
+    ...responseAppearanceConfirm,
+    ...responseAppearanceEmpty,
+    ...responseAppearanceDanger,
+    ...responseAppearanceRefresh,
+    ...responseAppearanceUnableLoadData,
+    ...responseAppearanceNothingFound,
+    ...responseAppearanceFail,
+    ...responseAppearanceError,
+    ...responseAppearanceSuccess,
+    ...responseAppearanceWarning,
+    ...responseAppearanceStyle,
+};
 
-var responseConfig = {
+const responseConfig = {
     appearance: responseAppearance,
-    setAppearance: function (appearanceConfig) {
+    setAppearance: (appearanceConfig) => {
         responseConfig.appearance = appearanceConfig;
     },
 };
-var Response = urlWithAssetPrefix.urlWithAssetPrefix(function Response(props) {
-    var appearance = props.appearance, className = props.className, width = props.width, height = props.height, title = props.title, desc = props.desc, secondaryButton = props.secondaryButton, primaryButton = props.primaryButton, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClickSecondaryButton = props.onClickSecondaryButton;
-    var appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, responseConfig);
-    var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
-    var dataTestId = propsGenerator.dataTestId, dataTour = propsGenerator.dataTour, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, titleTextWeight = propsGenerator.titleTextWeight, descTextColor = propsGenerator.descTextColor, descTextSize = propsGenerator.descTextSize, descTextWeight = propsGenerator.descTextWeight, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, onClickPrimaryButton = propsGenerator.onClickPrimaryButton, secondaryButtonAfter = propsGenerator.secondaryButtonAfter, secondaryButtonAppearance = propsGenerator.secondaryButtonAppearance, secondaryButtonBefore = propsGenerator.secondaryButtonBefore, secondaryButtonFill = propsGenerator.secondaryButtonFill, secondaryButtonFillHover = propsGenerator.secondaryButtonFillHover, secondaryButtonLabel = propsGenerator.secondaryButtonLabel, secondaryButtonLabelTextColor = propsGenerator.secondaryButtonLabelTextColor, secondaryButtonLabelTextSize = propsGenerator.secondaryButtonLabelTextSize, secondaryButtonShape = propsGenerator.secondaryButtonShape, secondaryButtonSize = propsGenerator.secondaryButtonSize, secondaryButtonWidth = propsGenerator.secondaryButtonWidth, imageSrc = propsGenerator.imageSrc, primaryButtonAfter = propsGenerator.primaryButtonAfter, primaryButtonAppearance = propsGenerator.primaryButtonAppearance, primaryButtonBefore = propsGenerator.primaryButtonBefore, primaryButtonFill = propsGenerator.primaryButtonFill, primaryButtonFillHover = propsGenerator.primaryButtonFillHover, primaryButtonLabel = propsGenerator.primaryButtonLabel, primaryButtonLabelTextColor = propsGenerator.primaryButtonLabelTextColor, primaryButtonLabelTextSize = propsGenerator.primaryButtonLabelTextSize, primaryButtonShape = propsGenerator.primaryButtonShape, primaryButtonSize = propsGenerator.primaryButtonSize, primaryButtonWidth = propsGenerator.primaryButtonWidth, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, svgFillClass = propsGenerator.svgFillClass, SvgImage = propsGenerator.SvgImage, svgPathFillClass = propsGenerator.svgPathFillClass, svgSrc = propsGenerator.svgSrc, widthClass = propsGenerator.widthClass;
+const Response = urlWithAssetPrefix.urlWithAssetPrefix(function Response(props) {
+    const { appearance, className, width, height, title, desc, secondaryButton, primaryButton, before, after, isSkeleton, onClickSecondaryButton, } = props;
+    const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, responseConfig);
+    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
+    const { dataTestId, dataTour, fillClass, fillHoverClass, titleTextColor, titleTextSize, titleTextWeight, descTextColor, descTextSize, descTextWeight, borderColorClass, borderColorHoverClass, borderTypeClass, borderWidthClass, onClickPrimaryButton, secondaryButtonAfter, secondaryButtonAppearance, secondaryButtonBefore, secondaryButtonFill, secondaryButtonFillHover, secondaryButtonLabel, secondaryButtonLabelTextColor, secondaryButtonLabelTextSize, secondaryButtonShape, secondaryButtonSize, secondaryButtonWidth, imageSrc, primaryButtonAfter, primaryButtonAppearance, primaryButtonBefore, primaryButtonFill, primaryButtonFillHover, primaryButtonLabel, primaryButtonLabelTextColor, primaryButtonLabelTextSize, primaryButtonShape, primaryButtonSize, primaryButtonWidth, shapeClass, shapeStrengthClass, svgFillClass, SvgImage, svgPathFillClass, svgSrc, widthClass, } = propsGenerator;
     // TODO: use Icon instead?
-    var ImageComponent = React.useMemo(function () {
-        var src = imageSrc || svgSrc;
-        var Image = SvgImage;
+    const ImageComponent = React.useMemo(() => {
+        const src = imageSrc || svgSrc;
+        const Image = SvgImage;
         if (Image) {
-            var sizes = {};
+            const sizes = {};
             if (width) {
                 sizes.width = width;
             }
             if (height) {
                 sizes.height = height;
             }
-            return jsxRuntime.jsx(Image, tslib_es6.__assign({}, sizes));
+            return jsxRuntime.jsx(Image, { ...sizes });
         }
         if (src) {
             // if (src.endsWith('.svg') || src.startsWith('data:image/svg')) {
@@ -235,15 +246,15 @@ var Response = urlWithAssetPrefix.urlWithAssetPrefix(function Response(props) {
         return null;
     }, [imageSrc, svgSrc, SvgImage, width, height, svgFillClass]);
     // @ts-expect-error
-    var _a = useStyles.useStyles(props), responseStyles = _a.styles, wrapperStyles = _a.wrapper;
-    return (jsxRuntime.jsxs("div", { className: clsx(className, 'response', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass), widthClass && "width_".concat(widthClass), borderColorClass && "border-color_".concat(borderColorClass), borderColorHoverClass && "border-color_hover_".concat(borderColorHoverClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), isSkeleton && "response_skeleton"), "data-test-id": dataTestId, "data-tour": dataTour, style: responseStyles, children: [before, jsxRuntime.jsxs("div", { className: "response__wrapper", style: wrapperStyles, children: [ImageComponent && (jsxRuntime.jsx("div", { className: clsx('response__image', svgFillClass && "svg_fill_".concat(svgFillClass), svgPathFillClass && "svg_path_fill_".concat(svgPathFillClass)), children: ImageComponent })), jsxRuntime.jsxs("div", { className: "response__wrapper-inner", children: [title && (jsxRuntime.jsx(Text.Text, { className: "response__title", size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title })), desc && (jsxRuntime.jsx(Text.Text, { className: "response__desc", size: descTextSize, textColor: descTextColor, textWeight: descTextWeight, children: desc }))] })] }), (primaryButtonLabel ||
+    const { styles: responseStyles, wrapper: wrapperStyles } = useStyles.useStyles(props);
+    return (jsxRuntime.jsxs("div", { className: clsx(className, 'response', fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, widthClass && `width_${widthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, isSkeleton && `response_skeleton`), "data-test-id": dataTestId, "data-tour": dataTour, style: responseStyles, children: [before, jsxRuntime.jsxs("div", { className: "response__wrapper", style: wrapperStyles, children: [ImageComponent && (jsxRuntime.jsx("div", { className: clsx('response__image', svgFillClass && `svg_fill_${svgFillClass}`, svgPathFillClass && `svg_path_fill_${svgPathFillClass}`), children: ImageComponent })), jsxRuntime.jsxs("div", { className: "response__wrapper-inner", children: [title && (jsxRuntime.jsx(Text.Text, { className: "response__title", size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title })), desc && (jsxRuntime.jsx(Text.Text, { className: "response__desc", size: descTextSize, textColor: descTextColor, textWeight: descTextWeight, children: desc }))] })] }), (primaryButtonLabel ||
                 primaryButton ||
                 secondaryButtonLabel ||
                 secondaryButton ||
                 appearanceConfig) && (jsxRuntime.jsxs(Group.Group, { className: "response__button", width: "fill", children: [primaryButtonLabel ? (jsxRuntime.jsx(Button.Button, { className: "response__button-item", appearance: primaryButtonAppearance, width: primaryButtonWidth || 'fill', size: primaryButtonSize, fill: primaryButtonFill, fillHover: primaryButtonFillHover, label: primaryButtonLabel, labelTextColor: primaryButtonLabelTextColor, labelTextSize: primaryButtonLabelTextSize, shape: primaryButtonShape, before: primaryButtonBefore, after: primaryButtonAfter, onClick: onClickPrimaryButton })) : (primaryButton), secondaryButtonLabel ? (jsxRuntime.jsx(Button.Button, { className: "response__button-item", appearance: secondaryButtonAppearance, width: secondaryButtonWidth || 'fill', size: secondaryButtonSize, fill: secondaryButtonFill, fillHover: secondaryButtonFillHover, label: secondaryButtonLabel, labelTextColor: secondaryButtonLabelTextColor, labelTextSize: secondaryButtonLabelTextSize, shape: secondaryButtonShape, before: secondaryButtonBefore, after: secondaryButtonAfter, onClick: onClickSecondaryButton })) : (secondaryButton)] })), after] }));
 });
 
-var RESPONSE_MESSAGES = {
+const RESPONSE_MESSAGES = {
     empty: {
         appearance: 'refresh ghost',
         title: ' Список пуст',

package/dist/cjs/components/SVGContent.js

@@ -6,7 +6,6 @@ var SVG = require('react-inlinesvg');
 var urlWithAssetPrefix = require('../hoc/urlWithAssetPrefix.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-require('../../tslib.es6_cjs_CCZ3TN_7.js');
 require('react');
 require('@itcase/common');
 require('../context/UrlAssetPrefix.js');
@@ -23,13 +22,13 @@ require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
 
-var SVGContent = urlWithAssetPrefix.urlWithAssetPrefix(function SVGContent(props) {
-    var className = props.className, src = props.src, SvgImage = props.SvgImage;
-    var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
-    var svgFillClass = propsGenerator.svgFillClass, svgFillHoverClass = propsGenerator.svgFillHoverClass;
+const SVGContent = urlWithAssetPrefix.urlWithAssetPrefix(function SVGContent(props) {
+    const { className, src, SvgImage } = props;
+    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
+    const { svgFillClass, svgFillHoverClass } = propsGenerator;
     // @ts-expect-error
-    var svgContentStyles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsxs("div", { className: clsx(className, 'svg-content', svgFillClass && "svg_fill_".concat(svgFillClass), svgFillHoverClass && "svg_fill_hover_".concat(svgFillHoverClass)), style: svgContentStyles, children: [src && jsxRuntime.jsx(SVG, { src: src }), SvgImage && jsxRuntime.jsx(SvgImage, {})] }));
+    const { styles: svgContentStyles } = useStyles.useStyles(props);
+    return (jsxRuntime.jsxs("div", { className: clsx(className, 'svg-content', svgFillClass && `svg_fill_${svgFillClass}`, svgFillHoverClass && `svg_fill_hover_${svgFillHoverClass}`), style: svgContentStyles, children: [src && jsxRuntime.jsx(SVG, { src: src }), SvgImage && jsxRuntime.jsx(SvgImage, {})] }));
 });
 
 exports.SVGContent = SVGContent;

package/dist/cjs/components/ScrollOnDrag/stories/__mock__.js

@@ -2,7 +2,7 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 
-var scrollOnDragMock = (jsxRuntime.jsx("div", { style: { display: 'flex' }, children: Array.from({ length: 20 }, function (_, index) { return (jsxRuntime.jsx("div", { style: {
+const scrollOnDragMock = (jsxRuntime.jsx("div", { style: { display: 'flex' }, children: Array.from({ length: 20 }, (_, index) => (jsxRuntime.jsx("div", { style: {
             height: 65,
             justifyContent: 'center',
             alignItems: 'center',
@@ -10,6 +10,6 @@ var scrollOnDragMock = (jsxRuntime.jsx("div", { style: { display: 'flex' }, chil
             padding: '50px',
             border: '1px solid black',
             display: 'flex',
-        }, children: index }, index)); }) }));
+        }, children: index }, index))) }));
 
 exports.scrollOnDragMock = scrollOnDragMock;

package/dist/cjs/components/ScrollOnDrag.js

@@ -1,6 +1,5 @@
 'use strict';
 
-var tslib_es6 = require('../../tslib.es6_cjs_CCZ3TN_7.js');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
@@ -23,14 +22,14 @@ require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
 
 function ScrollOnDrag(props) {
-    var className = props.className, scrollContainerProps = props.scrollContainerProps, children = props.children, isScrollbar = props.isScrollbar;
-    var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
-    var ref = ScrollContainer.useScrollContainer().ref;
-    var fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, elevationClass = propsGenerator.elevationClass, heightClass = propsGenerator.heightClass, _a = propsGenerator.widthClass, widthClass = _a === void 0 ? 'fill' : _a;
+    const { className, scrollContainerProps, children, isScrollbar } = props;
+    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
+    const { ref } = ScrollContainer.useScrollContainer();
+    const { fillClass, fillHoverClass, borderColorClass, borderTypeClass, borderWidthClass, elevationClass, heightClass, widthClass = 'fill', } = propsGenerator;
     // @ts-expect-error
-    var _b = useStyles.useStyles(props), scrollContainerStyles = _b.scrollContainer, styles = _b.styles;
-    var ScrollOnDragWrapper = isScrollbar ? SimpleBar : React.Fragment;
-    return (jsxRuntime.jsx(ScrollOnDragWrapper, { scrollableNodeProps: { ref: ref }, children: jsxRuntime.jsx("div", { className: clsx('scroll-on-drag', className, borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), borderWidthClass && "border-width_".concat(borderWidthClass), elevationClass && "elevation_".concat(elevationClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), heightClass && "height_".concat(heightClass), widthClass && "width_".concat(widthClass)), style: styles, children: jsxRuntime.jsx(ScrollContainer, tslib_es6.__assign({ className: clsx(!isScrollbar && 'scroll-on-drag__wrapper'), ref: ref }, scrollContainerProps, { style: scrollContainerStyles, children: children })) }) }));
+    const { scrollContainer: scrollContainerStyles, styles: styles } = useStyles.useStyles(props);
+    const ScrollOnDragWrapper = isScrollbar ? SimpleBar : React.Fragment;
+    return (jsxRuntime.jsx(ScrollOnDragWrapper, { scrollableNodeProps: { ref }, children: jsxRuntime.jsx("div", { className: clsx('scroll-on-drag', className, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, borderWidthClass && `border-width_${borderWidthClass}`, elevationClass && `elevation_${elevationClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, heightClass && `height_${heightClass}`, widthClass && `width_${widthClass}`), style: styles, children: jsxRuntime.jsx(ScrollContainer, { className: clsx(!isScrollbar && 'scroll-on-drag__wrapper'), ref: ref, ...scrollContainerProps, style: scrollContainerStyles, children: children }) }) }));
 }
 
 exports.ScrollOnDrag = ScrollOnDrag;

package/dist/cjs/components/ScrollToView.js

@@ -5,7 +5,6 @@ var clsx = require('clsx');
 var reactScroll = require('react-scroll');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-require('../../tslib.es6_cjs_CCZ3TN_7.js');
 require('react');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -21,14 +20,14 @@ require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
 
-var ScrollToView = reactScroll.ScrollLink(function ScrollToView(props) {
-    var id = props.id, className = props.className, _a = props.tag, Tag = _a === void 0 ? 'div' : _a, children = props.children;
-    var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
-    var directionClass = propsGenerator.directionClass, justifyContentClass = propsGenerator.justifyContentClass, alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, alignItemsClass = propsGenerator.alignItemsClass, alignSelfClass = propsGenerator.alignSelfClass, textColorActiveClass = propsGenerator.textColorActiveClass, textColorClass = propsGenerator.textColorClass, textColorHoverClass = propsGenerator.textColorHoverClass, heightClass = propsGenerator.heightClass, widthClass = propsGenerator.widthClass;
-    var scrollToViewStyles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsx(Tag, { id: id, className: clsx(className, 'scroll-to-view', alignItemsClass && "align-items_".concat(alignItemsClass), widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), textColorClass && "scroll-to-view_text-color_".concat(textColorClass), textColorActiveClass &&
-            "scroll-to-view_text-color_active_".concat(textColorActiveClass), textColorHoverClass &&
-            "scroll-to-view_text-color_hover_".concat(textColorHoverClass), justifyContentClass && "justify-content_".concat(justifyContentClass), directionClass && "direction_".concat(directionClass), alignSelfClass && "align-self_".concat(alignSelfClass)), style: Object.assign({}, scrollToViewStyles, props.style), onClick: props.onClick, children: children }));
+const ScrollToView = reactScroll.ScrollLink(function ScrollToView(props) {
+    const { id, className, tag: Tag = 'div', children } = props;
+    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
+    const { directionClass, justifyContentClass, alignClass, alignDirectionClass, alignItemsClass, alignSelfClass, textColorActiveClass, textColorClass, textColorHoverClass, heightClass, widthClass, } = propsGenerator;
+    const { styles: scrollToViewStyles } = useStyles.useStyles(props);
+    return (jsxRuntime.jsx(Tag, { id: id, className: clsx(className, 'scroll-to-view', alignItemsClass && `align-items_${alignItemsClass}`, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`, textColorClass && `scroll-to-view_text-color_${textColorClass}`, textColorActiveClass &&
+            `scroll-to-view_text-color_active_${textColorActiveClass}`, textColorHoverClass &&
+            `scroll-to-view_text-color_hover_${textColorHoverClass}`, justifyContentClass && `justify-content_${justifyContentClass}`, directionClass && `direction_${directionClass}`, alignSelfClass && `align-self_${alignSelfClass}`), style: Object.assign({}, scrollToViewStyles, props.style), onClick: props.onClick, children: children }));
 });
 
 exports.ScrollToView = ScrollToView;

package/dist/cjs/components/Scrollbar/stories/__mock__.js

@@ -2,6 +2,6 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 
-var scrollbarMock = Array.from({ length: 30 }, function (_, index) { return (jsxRuntime.jsx("div", { children: index })); });
+const scrollbarMock = Array.from({ length: 30 }, (_, index) => (jsxRuntime.jsx("div", { children: index })));
 
 exports.scrollbarMock = scrollbarMock;

package/dist/cjs/components/Scrollbar.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Scrollbar = require('../../Scrollbar_cjs_DcKOfcNp.js');
+var Scrollbar = require('../../Scrollbar_cjs_Cp-7v2Mt.js');
 require('react/jsx-runtime');
 require('clsx');
 require('react-scrollbars-custom');

package/dist/cjs/components/Search.js

@@ -1,6 +1,5 @@
 'use strict';
 
-var tslib_es6 = require('../../tslib.es6_cjs_CCZ3TN_7.js');
 var _default = require('@itcase/icons/default');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
@@ -8,9 +7,9 @@ var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon_cjs_Cz6IyOkb.js');
-var Text = require('../../Text_cjs_0EINiUq4.js');
-var Scrollbar = require('../../Scrollbar_cjs_DcKOfcNp.js');
+var Icon = require('../../Icon_cjs_BVLGzj7Y.js');
+var Text = require('../../Text_cjs_BDTjOTVB.js');
+var Scrollbar = require('../../Scrollbar_cjs_Cp-7v2Mt.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -27,10 +26,10 @@ require('lodash/maxBy');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_C5UsZUiF.js');
+require('../../Link_cjs_qKXVfU8e.js');
 require('react-scrollbars-custom');
 
-var searchAppearanceDefault = {
+const searchAppearanceDefault = {
     defaultPrimary: {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderQuaternary',
@@ -53,7 +52,7 @@ var searchAppearanceDefault = {
     },
 };
 
-var searchAppearanceDisabled = {
+const searchAppearanceDisabled = {
     disabledPrimary: {
         fill: 'surfaceDisabled',
         borderColor: 'surfaceBorderDisabled',
@@ -66,7 +65,7 @@ var searchAppearanceDisabled = {
     },
 };
 
-var searchAppearanceError = {
+const searchAppearanceError = {
     errorPrimary: {
         fill: 'errorTertiary',
         borderColor: 'errorBorderQuaternary',
@@ -79,7 +78,7 @@ var searchAppearanceError = {
     },
 };
 
-var searchAppearanceRequire = {
+const searchAppearanceRequire = {
     requirePrimary: {
         fill: 'warningTertiary',
         borderColor: 'warningBorderSecondary',
@@ -92,7 +91,7 @@ var searchAppearanceRequire = {
     },
 };
 
-var searchAppearanceShape = {
+const searchAppearanceShape = {
     circular: {
         shape: 'circular',
     },
@@ -117,7 +116,7 @@ var searchAppearanceShape = {
     },
 };
 
-var searchAppearanceSize = {
+const searchAppearanceSize = {
     sizeXXL: {
         size: 'xxl',
         iconBefore: _default.icons24.Security.Search,
@@ -162,7 +161,7 @@ var searchAppearanceSize = {
     },
 };
 
-var searchAppearanceStyle = {
+const searchAppearanceStyle = {
     solid: {
         borderColor: 'none',
         borderColorHover: 'none',
@@ -179,7 +178,7 @@ var searchAppearanceStyle = {
     },
 };
 
-var searchAppearanceSuccess = {
+const searchAppearanceSuccess = {
     successPrimary: {
         fill: 'successTertiary',
         borderColor: 'accentBorderQuaternary',
@@ -192,46 +191,55 @@ var searchAppearanceSuccess = {
     },
 };
 
-var searchAppearance = tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, searchAppearanceSize), searchAppearanceStyle), searchAppearanceDefault), searchAppearanceError), searchAppearanceSuccess), searchAppearanceRequire), searchAppearanceDisabled), searchAppearanceShape);
+const searchAppearance = {
+    ...searchAppearanceSize,
+    ...searchAppearanceStyle,
+    ...searchAppearanceDefault,
+    ...searchAppearanceError,
+    ...searchAppearanceSuccess,
+    ...searchAppearanceRequire,
+    ...searchAppearanceDisabled,
+    ...searchAppearanceShape,
+};
 
-var searchInputConfig = {
+const searchInputConfig = {
     appearance: searchAppearance,
-    setAppearance: function (appearanceConfig) {
+    setAppearance: (appearanceConfig) => {
         searchInputConfig.appearance = appearanceConfig;
     },
 };
-var SearchInput = React.forwardRef(function SearchInput(props, ref) {
-    var dataTour = props.dataTour, className = props.className, appearance = props.appearance, placeholder = props.placeholder, value = props.value, before = props.before, after = props.after, isActive = props.isActive, isSkeleton = props.isSkeleton, isDisabled = props.isDisabled, onChange = props.onChange, onClickClean = props.onClickClean, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
-    var onChangeSearchInput = React.useCallback(function (event) {
+const SearchInput = React.forwardRef(function SearchInput(props, ref) {
+    const { dataTour, className, appearance, placeholder, value, before, after, isActive, isSkeleton, isDisabled, onChange, onClickClean, onFocus, onKeyDown, } = props;
+    const onChangeSearchInput = React.useCallback((event) => {
         onChange && onChange(event.target.value);
     }, [onChange]);
-    var onClickClearIcon = React.useCallback(function (event) {
+    const onClickClearIcon = React.useCallback((event) => {
         event.stopPropagation();
         onChange && onChange('');
         if (onClickClean) {
             onClickClean();
         }
     }, [onChange, onClickClean]);
-    var appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, searchInputConfig, isDisabled);
-    var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
-    var size = propsGenerator.size, fillClass = propsGenerator.fillClass, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, iconClear = propsGenerator.iconClear, iconClearFill = propsGenerator.iconClearFill, iconClearSize = propsGenerator.iconClearSize, iconClearSrc = propsGenerator.iconClearSrc, inputFillClass = propsGenerator.inputFillClass, inputTextColorClass = propsGenerator.inputTextColorClass, inputTextSizeClass = propsGenerator.inputTextSizeClass, inputTextStyleClass = propsGenerator.inputTextStyleClass, inputTextWeightClass = propsGenerator.inputTextWeightClass, placeholderTextColor = propsGenerator.placeholderTextColor, placeholderTextSize = propsGenerator.placeholderTextSize, placeholderTextStyle = propsGenerator.placeholderTextStyle, placeholderTextWeight = propsGenerator.placeholderTextWeight, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, widthClass = propsGenerator.widthClass;
-    var searchInputStyles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsxs("label", { dataTour: dataTour, className: clsx(className, 'search-input', shapeClass && "shape_".concat(shapeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass), fillClass && "fill_".concat(fillClass), widthClass && "width_".concat(widthClass), borderColorClass && "border-color_".concat(borderColorClass), borderColorHoverClass && "border-color_hover_".concat(borderColorHoverClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), size && "search-input_size_".concat(size), isSkeleton && "search-input_skeleton"), style: searchInputStyles, children: [before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "search-input__icon-before", size: iconBeforeSize, iconFill: iconBeforeFill, imageSrc: iconBeforeSrc, SvgImage: iconBefore })), jsxRuntime.jsxs("div", { className: clsx('search-input__wrapper', inputFillClass && "fill_".concat(inputFillClass)), children: [jsxRuntime.jsx("input", { className: clsx('search-input__value', (inputTextSizeClass ||
+    const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, searchInputConfig, isDisabled);
+    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
+    const { size, fillClass, borderColorClass, borderColorHoverClass, borderTypeClass, borderWidthClass, iconAfter, iconAfterFill, iconAfterSize, iconAfterSrc, iconBefore, iconBeforeFill, iconBeforeSize, iconBeforeSrc, iconClear, iconClearFill, iconClearSize, iconClearSrc, inputFillClass, inputTextColorClass, inputTextSizeClass, inputTextStyleClass, inputTextWeightClass, placeholderTextColor, placeholderTextSize, placeholderTextStyle, placeholderTextWeight, shapeClass, shapeStrengthClass, widthClass, } = propsGenerator;
+    const { styles: searchInputStyles } = useStyles.useStyles(props);
+    return (jsxRuntime.jsxs("label", { dataTour: dataTour, className: clsx(className, 'search-input', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, fillClass && `fill_${fillClass}`, widthClass && `width_${widthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, size && `search-input_size_${size}`, isSkeleton && `search-input_skeleton`), style: searchInputStyles, children: [before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "search-input__icon-before", size: iconBeforeSize, iconFill: iconBeforeFill, imageSrc: iconBeforeSrc, SvgImage: iconBefore })), jsxRuntime.jsxs("div", { className: clsx('search-input__wrapper', inputFillClass && `fill_${inputFillClass}`), children: [jsxRuntime.jsx("input", { className: clsx('search-input__value', (inputTextSizeClass ||
                             inputTextWeightClass ||
                             inputTextColorClass ||
                             inputTextStyleClass) &&
-                            'text', inputTextSizeClass && "text_size_".concat(inputTextSizeClass), inputTextWeightClass && "text-weight_".concat(inputTextWeightClass), inputTextColorClass && "text-color_".concat(inputTextColorClass), inputTextStyleClass && "text-style_".concat(inputTextStyleClass)), type: "text", ref: ref, required: true, value: value || '', onChange: onChangeSearchInput, onFocus: onFocus, onKeyDown: onKeyDown }), jsxRuntime.jsx("div", { className: "search-input__placeholder", children: jsxRuntime.jsx(Text.Text, { className: clsx('search-input__placeholder-value'), size: placeholderTextSize, textColor: placeholderTextColor, textStyle: placeholderTextStyle, textWeight: placeholderTextWeight, children: placeholder }) }), value && (jsxRuntime.jsx(Icon.Icon, { className: clsx('search-input__clear', 'cursor_type_pointer', isActive && "fill_".concat(iconClearFill)), size: iconClearSize, iconFill: iconClearFill, imageSrc: iconClearSrc, SvgImage: iconClear, onClick: onClickClearIcon }))] }), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "search-input__icon-after", size: iconAfterSize, iconFill: iconAfterFill, imageSrc: iconAfterSrc, SvgImage: iconAfter })), after] }));
+                            'text', inputTextSizeClass && `text_size_${inputTextSizeClass}`, inputTextWeightClass && `text-weight_${inputTextWeightClass}`, inputTextColorClass && `text-color_${inputTextColorClass}`, inputTextStyleClass && `text-style_${inputTextStyleClass}`), type: "text", ref: ref, required: true, value: value || '', onChange: onChangeSearchInput, onFocus: onFocus, onKeyDown: onKeyDown }), jsxRuntime.jsx("div", { className: "search-input__placeholder", children: jsxRuntime.jsx(Text.Text, { className: clsx('search-input__placeholder-value'), size: placeholderTextSize, textColor: placeholderTextColor, textStyle: placeholderTextStyle, textWeight: placeholderTextWeight, children: placeholder }) }), value && (jsxRuntime.jsx(Icon.Icon, { className: clsx('search-input__clear', 'cursor_type_pointer', isActive && `fill_${iconClearFill}`), size: iconClearSize, iconFill: iconClearFill, imageSrc: iconClearSrc, SvgImage: iconClear, onClick: onClickClearIcon }))] }), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "search-input__icon-after", size: iconAfterSize, iconFill: iconAfterFill, imageSrc: iconAfterSrc, SvgImage: iconAfter })), after] }));
 });
 // @ts-expect-error
 SearchInput.DEFAULT_REF_STATE = {
     input: null,
 };
 
-var SearchResult = React.forwardRef(function SearchResult(props) {
-    var className = props.className, scrollHeight = props.scrollHeight, before = props.before, after = props.after, children = props.children;
-    var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
-    var fillClass = propsGenerator.fillClass, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass;
-    return (jsxRuntime.jsx("div", { className: clsx(className, 'search-result', shapeClass && "shape_".concat(shapeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass), fillClass && "fill_".concat(fillClass)), children: jsxRuntime.jsxs("div", { className: "search-result__wrapper", children: [before, React.Children.toArray(children).filter(Boolean).length && (jsxRuntime.jsx(Scrollbar.Scrollbar, { scrollHeight: scrollHeight ? "".concat(scrollHeight, "px") : '300px', children: children })), after] }) }));
+const SearchResult = React.forwardRef(function SearchResult(props) {
+    const { className, scrollHeight, before, after, children } = props;
+    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
+    const { fillClass, shapeClass, shapeStrengthClass } = propsGenerator;
+    return (jsxRuntime.jsx("div", { className: clsx(className, 'search-result', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, fillClass && `fill_${fillClass}`), children: jsxRuntime.jsxs("div", { className: "search-result__wrapper", children: [before, React.Children.toArray(children).filter(Boolean).length && (jsxRuntime.jsx(Scrollbar.Scrollbar, { scrollHeight: scrollHeight ? `${scrollHeight}px` : '300px', children: children })), after] }) }));
 });
 
 exports.SearchInput = SearchInput;