@itcase/ui 1.9.31 → 1.9.34

package/dist/{Image_es_C-IjVkKX.js → Image_es_D3YrkouM.js}

@@ -6,7 +6,7 @@ import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevi
 import { useStyles } from './hooks/useStyles/useStyles.js';
 
 const Image = urlWithAssetPrefix(function Image(props) {
-    const { className, type, src, title, alt, caption, imageClassName, imageWrapperClassName, mode, overlay, placeholderUrl, before, after, isSkeleton, onClick, onError, children, } = props;
+    const { className, dataTestId, dataTour, type, src, title, alt, caption, imageClassName, imageWrapperClassName, mode, overlay, placeholderUrl, before, after, isSkeleton, onClick, onError, children, } = props;
     const propsGenerator = useDevicePropsGenerator(props);
     const { fillClass, fillHoverClass, borderColorClass, borderColorImageClass, borderTypeClass, borderWidthClass, cursorClass, heightClass, horizontalAlignClass, imageHeightClass, imageWidthClass, resizeModeClass, shapeClass, verticalAlignClass, widthClass, } = propsGenerator;
     const { image: imageStyles, styles, wrapper: wrapperStyles, } = useStyles(props);
@@ -19,7 +19,7 @@ const Image = urlWithAssetPrefix(function Image(props) {
         }
     }, [onError, placeholderUrl]);
     return (jsxs("div", { className: clsx(className, 'image', mode && `image_mode_${mode}`, type && `image_type_${type}`, cursorClass && `cursor_${cursorClass}`, horizontalAlignClass &&
-            `image_horizontal-align_${horizontalAlignClass}`, verticalAlignClass && `image_vertical-align_${verticalAlignClass}`, shapeClass && `image_shape_${shapeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, resizeModeClass && `image_resize-mode_${resizeModeClass}`, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, isSkeleton && 'image_skeleton'), style: styles, onClick: onClick, children: [before, jsxs("div", { className: clsx('image__wrapper', imageWrapperClassName), style: wrapperStyles, children: [jsx("img", { className: clsx('image__item', imageWidthClass && `width_${imageWidthClass}`, imageHeightClass && `height_${imageHeightClass}`, imageClassName, borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, borderColorImageClass &&
+            `image_horizontal-align_${horizontalAlignClass}`, verticalAlignClass && `image_vertical-align_${verticalAlignClass}`, shapeClass && `image_shape_${shapeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, resizeModeClass && `image_resize-mode_${resizeModeClass}`, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, isSkeleton && 'image_skeleton'), "data-testid": dataTestId, "data-tour": dataTour, style: styles, onClick: onClick, children: [before, jsxs("div", { className: clsx('image__wrapper', imageWrapperClassName), style: wrapperStyles, children: [jsx("img", { className: clsx('image__item', imageWidthClass && `width_${imageWidthClass}`, imageHeightClass && `height_${imageHeightClass}`, imageClassName, borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, borderColorImageClass &&
                             `border-color-image_${borderColorImageClass}`), src: src, title: title || alt, alt: alt || title, style: imageStyles, onError: onErrorImage }), overlay, caption, children] }), after] }));
 });
 

package/dist/{Input_cjs_DnjehCpi.js → Input_cjs_BUtZUZYh.js}

@@ -209,13 +209,13 @@ const inputConfig = {
     },
 };
 const Input = React.forwardRef(function Input(props, ref) {
-    const { id, appearance, className, dataTestId, type = 'text', name, autocomplete, index, placeholder, value, isDisabled, isReadOnly, onClick, onBlur, onChange, onFocus, onKeyDown, } = props;
+    const { id, appearance, className, dataTestId, dataTour, type = 'text', name, autocomplete, index, placeholder, value, isDisabled, isReadOnly, onClick, onBlur, onChange, onFocus, onKeyDown, } = props;
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, inputConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, fillHoverClass, borderColorClass, borderColorHoverClass, borderWidthClass, textColorClass, textSizeClass, textWeightClass, caretClass, placeholderTextColorClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
     const fallbackId = React.useId();
     return (jsxRuntime.jsx("input", { id: String(id ?? fallbackId), className: clsx(className, 'input', type === 'number' && 'input_type_number', isDisabled && 'input_state_disabled', (textSizeClass || textColorClass || textWeightClass) && 'text', borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, caretClass && `caret-color_${caretClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, placeholderTextColorClass &&
-            `placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: type, ref: ref, autoComplete: autocomplete, "data-testid": dataTestId || (name ? `${name}-input` : 'input'), disabled: isDisabled, index: index, placeholder: placeholder, readOnly: isReadOnly, value: value, onClick: onClick, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
+            `placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: type, ref: ref, autoComplete: autocomplete, "data-testid": dataTestId || (name ? `${name}-input` : 'input'), "data-tour": dataTour, disabled: isDisabled, index: index, placeholder: placeholder, readOnly: isReadOnly, value: value, onClick: onClick, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
 });
 
 exports.Input = Input;

package/dist/{Input_es_DCaVqQH5.js → Input_es_DaDvQ8Xp.js}

@@ -207,13 +207,13 @@ const inputConfig = {
     },
 };
 const Input = React.forwardRef(function Input(props, ref) {
-    const { id, appearance, className, dataTestId, type = 'text', name, autocomplete, index, placeholder, value, isDisabled, isReadOnly, onClick, onBlur, onChange, onFocus, onKeyDown, } = props;
+    const { id, appearance, className, dataTestId, dataTour, type = 'text', name, autocomplete, index, placeholder, value, isDisabled, isReadOnly, onClick, onBlur, onChange, onFocus, onKeyDown, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, inputConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, fillHoverClass, borderColorClass, borderColorHoverClass, borderWidthClass, textColorClass, textSizeClass, textWeightClass, caretClass, placeholderTextColorClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
     const fallbackId = useId();
     return (jsx("input", { id: String(id ?? fallbackId), className: clsx(className, 'input', type === 'number' && 'input_type_number', isDisabled && 'input_state_disabled', (textSizeClass || textColorClass || textWeightClass) && 'text', borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, caretClass && `caret-color_${caretClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, placeholderTextColorClass &&
-            `placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: type, ref: ref, autoComplete: autocomplete, "data-testid": dataTestId || (name ? `${name}-input` : 'input'), disabled: isDisabled, index: index, placeholder: placeholder, readOnly: isReadOnly, value: value, onClick: onClick, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
+            `placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: type, ref: ref, autoComplete: autocomplete, "data-testid": dataTestId || (name ? `${name}-input` : 'input'), "data-tour": dataTour, disabled: isDisabled, index: index, placeholder: placeholder, readOnly: isReadOnly, value: value, onClick: onClick, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
 });
 
 export { Input as I, inputAppearance as a, inputConfig as i };

package/dist/{Label_cjs_CyPU9hqO.js → Label_cjs_eckLVQqh.js}

@@ -6,7 +6,7 @@ var clsx = require('clsx');
 var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
-var Icon = require('./Icon_cjs_D-jQrwjV.js');
+var Icon = require('./Icon_cjs_CQxDPPGY.js');
 var Text = require('./Text_cjs_Co2XdYF-.js');
 
 const labelAppearanceAccent = {

package/dist/{Label_es_qnCgQX52.js → Label_es_DuDL0-3C.js}

@@ -4,7 +4,7 @@ import clsx from 'clsx';
 import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from './hooks/useStyles/useStyles.js';
-import { I as Icon, T as Tooltip } from './Icon_es_BstDGBF3.js';
+import { I as Icon, T as Tooltip } from './Icon_es_Banbw98_.js';
 import { T as Text } from './Text_es_DaYcLe4H.js';
 
 const labelAppearanceAccent = {

package/dist/{Link_cjs_qKXVfU8e.js → Link_cjs_DqNtNI23.js}

@@ -271,7 +271,7 @@ const linkConfig = {
     },
 };
 function Link(props) {
-    const { className, appearance, text, href, link, isDisabled, LinkComponent, rel, style, target, before, after, onClick, onMouseDown, children, } = props;
+    const { appearance, className, dataTestId, dataTour, text, href, link, LinkComponent, rel, style, target, before, after, isDisabled, onClick, onMouseDown, children, } = props;
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, linkConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { directionClass, fillClass, fillHoverClass, borderColorClass, borderColorHoverClass, borderTypeClass, borderWidthClass, textColorClass, textColorHoverClass, textGradientClass, textStyleClass, textWeightClass, heightClass, shapeClass, sizeClass, svgFillClass, svgFillHoverClass, underline = 'underline', widthClass, } = propsGenerator;
@@ -282,7 +282,7 @@ function Link(props) {
             textGradientClass ||
             textStyleClass ||
             textWeightClass) &&
-            'text', textColorClass && `text-color_${textColorClass}`, textColorHoverClass && `text-color_hover_${textColorHoverClass}`, textGradientClass && `text-gradient_${textGradientClass}`, textStyleClass && `text-style_${textStyleClass}`, textWeightClass && `text-weight_${textWeightClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, shapeClass && `link_shape_${shapeClass}`), href: href || link, LinkComponent: LinkComponent, rel: rel, style: Object.assign({}, styles, style), target: target, onClick: onClick, onMouseDown: onMouseDown, children: [before, children || text, after] }));
+            'text', textColorClass && `text-color_${textColorClass}`, textColorHoverClass && `text-color_hover_${textColorHoverClass}`, textGradientClass && `text-gradient_${textGradientClass}`, textStyleClass && `text-style_${textStyleClass}`, textWeightClass && `text-weight_${textWeightClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, shapeClass && `link_shape_${shapeClass}`), "data-testid": dataTestId, "data-tour": dataTour, href: href || link, LinkComponent: LinkComponent, rel: rel, style: Object.assign({}, styles, style), target: target, onClick: onClick, onMouseDown: onMouseDown, children: [before, children || text, after] }));
 }
 // Wrapper with "Link" by condition
 function LinkWrapper(props) {

package/dist/{Link_es_P2b6ya7P.js → Link_es_Bt-Bhy3t.js}

@@ -269,7 +269,7 @@ const linkConfig = {
     },
 };
 function Link(props) {
-    const { className, appearance, text, href, link, isDisabled, LinkComponent, rel, style, target, before, after, onClick, onMouseDown, children, } = props;
+    const { appearance, className, dataTestId, dataTour, text, href, link, LinkComponent, rel, style, target, before, after, isDisabled, onClick, onMouseDown, children, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, linkConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { directionClass, fillClass, fillHoverClass, borderColorClass, borderColorHoverClass, borderTypeClass, borderWidthClass, textColorClass, textColorHoverClass, textGradientClass, textStyleClass, textWeightClass, heightClass, shapeClass, sizeClass, svgFillClass, svgFillHoverClass, underline = 'underline', widthClass, } = propsGenerator;
@@ -280,7 +280,7 @@ function Link(props) {
             textGradientClass ||
             textStyleClass ||
             textWeightClass) &&
-            'text', textColorClass && `text-color_${textColorClass}`, textColorHoverClass && `text-color_hover_${textColorHoverClass}`, textGradientClass && `text-gradient_${textGradientClass}`, textStyleClass && `text-style_${textStyleClass}`, textWeightClass && `text-weight_${textWeightClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, shapeClass && `link_shape_${shapeClass}`), href: href || link, LinkComponent: LinkComponent, rel: rel, style: Object.assign({}, styles, style), target: target, onClick: onClick, onMouseDown: onMouseDown, children: [before, children || text, after] }));
+            'text', textColorClass && `text-color_${textColorClass}`, textColorHoverClass && `text-color_hover_${textColorHoverClass}`, textGradientClass && `text-gradient_${textGradientClass}`, textStyleClass && `text-style_${textStyleClass}`, textWeightClass && `text-weight_${textWeightClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, shapeClass && `link_shape_${shapeClass}`), "data-testid": dataTestId, "data-tour": dataTour, href: href || link, LinkComponent: LinkComponent, rel: rel, style: Object.assign({}, styles, style), target: target, onClick: onClick, onMouseDown: onMouseDown, children: [before, children || text, after] }));
 }
 // Wrapper with "Link" by condition
 function LinkWrapper(props) {

package/dist/{Loader_cjs_B3j9ATrq.js → Loader_cjs_CP1xKwb-.js}

@@ -129,13 +129,13 @@ const loaderConfig = {
     },
 };
 function Loader(props) {
-    const { className, type = 'simple', appearance, text, isDisabled, isSkeleton, children, } = props;
+    const { appearance, className, dataTestId, dataTour, type = 'simple', text, isDisabled, isSkeleton, children, } = props;
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, loaderConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, textColor, textSize, heightClass, itemFillClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator; // TODO: сделать нормальные типы для useDevicePropsGenerator
     // @ts-expect-error - TODO: сделать useStyles на ts
     const { styles: loader } = useStyles.useStyles(props);
-    return (jsxRuntime.jsxs("div", { className: clsx('loader', className, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, fillClass && `fill_${fillClass}`, sizeClass && `loader_size_${sizeClass}`, isSkeleton && `loader_skeleton`, type && `loader_type_${type}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), style: loader, children: [children || (jsxRuntime.jsxs("div", { className: "loader__inner", children: [jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" })] })), text && (jsxRuntime.jsx(Text.Text, { className: "loader__text", size: textSize, textColor: textColor, children: text }))] }));
+    return (jsxRuntime.jsxs("div", { className: clsx('loader', className, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, fillClass && `fill_${fillClass}`, sizeClass && `loader_size_${sizeClass}`, isSkeleton && `loader_skeleton`, type && `loader_type_${type}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: loader, children: [children || (jsxRuntime.jsxs("div", { className: "loader__inner", children: [jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" })] })), text && (jsxRuntime.jsx(Text.Text, { className: "loader__text", size: textSize, textColor: textColor, children: text }))] }));
 }
 
 exports.Loader = Loader;

package/dist/{Loader_es_wjTqawH6.js → Loader_es_Csp5tr40.js}

@@ -127,13 +127,13 @@ const loaderConfig = {
     },
 };
 function Loader(props) {
-    const { className, type = 'simple', appearance, text, isDisabled, isSkeleton, children, } = props;
+    const { appearance, className, dataTestId, dataTour, type = 'simple', text, isDisabled, isSkeleton, children, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, loaderConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, textColor, textSize, heightClass, itemFillClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator; // TODO: сделать нормальные типы для useDevicePropsGenerator
     // @ts-expect-error - TODO: сделать useStyles на ts
     const { styles: loader } = useStyles(props);
-    return (jsxs("div", { className: clsx('loader', className, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, fillClass && `fill_${fillClass}`, sizeClass && `loader_size_${sizeClass}`, isSkeleton && `loader_skeleton`, type && `loader_type_${type}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), style: loader, children: [children || (jsxs("div", { className: "loader__inner", children: [jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" }), jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" }), jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" })] })), text && (jsx(Text, { className: "loader__text", size: textSize, textColor: textColor, children: text }))] }));
+    return (jsxs("div", { className: clsx('loader', className, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, fillClass && `fill_${fillClass}`, sizeClass && `loader_size_${sizeClass}`, isSkeleton && `loader_skeleton`, type && `loader_type_${type}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: loader, children: [children || (jsxs("div", { className: "loader__inner", children: [jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" }), jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" }), jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" })] })), text && (jsx(Text, { className: "loader__text", size: textSize, textColor: textColor, children: text }))] }));
 }
 
 export { Loader as L, loaderAppearance as a, loaderConfig as l };

package/dist/{Scrollbar_cjs_Cp-7v2Mt.js → Scrollbar_cjs_DHe1EK_B.js}

@@ -5,10 +5,10 @@ var clsx = require('clsx');
 var reactScrollbarsCustom = require('react-scrollbars-custom');
 
 function Scrollbar(props) {
-    const { className, noDefaultStyles, scrollbarWidth, scrollHeight = '200', onScroll, children, } = props;
+    const { className, dataTestId, dataTour, noDefaultStyles, scrollbarWidth, scrollHeight = '200', onScroll, children, } = props;
     return (jsxRuntime.jsx(reactScrollbarsCustom.Scrollbar, { className: clsx('scrollbar', className), contentProps: {
             className: 'scrollbar__scroll-content',
-        }, noDefaultStyles: noDefaultStyles, scrollbarWidth: scrollbarWidth, scrollerProps: {
+        }, "data-testid": dataTestId, "data-tour": dataTour, noDefaultStyles: noDefaultStyles, scrollbarWidth: scrollbarWidth, scrollerProps: {
             className: 'scrollbar__scroll',
         }, style: { height: scrollHeight + 'px' }, thumbXProps: {
             className: 'scrollbar__track-x-item',

package/dist/{Scrollbar_es_CcMgNvGi.js → Scrollbar_es_CKTh3pew.js}

@@ -3,10 +3,10 @@ import clsx from 'clsx';
 import { Scrollbar as Scrollbar$1 } from 'react-scrollbars-custom';
 
 function Scrollbar(props) {
-    const { className, noDefaultStyles, scrollbarWidth, scrollHeight = '200', onScroll, children, } = props;
+    const { className, dataTestId, dataTour, noDefaultStyles, scrollbarWidth, scrollHeight = '200', onScroll, children, } = props;
     return (jsx(Scrollbar$1, { className: clsx('scrollbar', className), contentProps: {
             className: 'scrollbar__scroll-content',
-        }, noDefaultStyles: noDefaultStyles, scrollbarWidth: scrollbarWidth, scrollerProps: {
+        }, "data-testid": dataTestId, "data-tour": dataTour, noDefaultStyles: noDefaultStyles, scrollbarWidth: scrollbarWidth, scrollerProps: {
             className: 'scrollbar__scroll',
         }, style: { height: scrollHeight + 'px' }, thumbXProps: {
             className: 'scrollbar__track-x-item',

package/dist/{SelectContainer_cjs_CnhODaJP.js → SelectContainer_cjs_DzjEQKXj.js}

@@ -7,12 +7,12 @@ var Select = require('react-select');
 var CreatableSelect = require('react-select/creatable');
 var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Group = require('./Group_cjs_C1YVff0N.js');
+var Group = require('./Group_cjs_CcDdC0Ua.js');
 var Text = require('./Text_cjs_Co2XdYF-.js');
 var _default = require('@itcase/icons/default');
-var Icon = require('./Icon_cjs_D-jQrwjV.js');
-var Loader = require('./Loader_cjs_B3j9ATrq.js');
-var Divider = require('./Divider_cjs_BZn2epqW.js');
+var Icon = require('./Icon_cjs_CQxDPPGY.js');
+var Loader = require('./Loader_cjs_CP1xKwb-.js');
+var Divider = require('./Divider_cjs_1fwsCxEb.js');
 
 // interface ClearIndicatorProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>>
 //   extends DefaultClearIndicatorProps<Option, IsMulti, Group> {}
@@ -33,12 +33,10 @@ const selectAppearanceDefault = {
     defaultPrimary: {
         fill: 'surfaceSecondary',
         fillHover: 'surfaceTertiary',
-        optionFillDisabled: 'surfaceSecondary',
-        optionTextColorDisabled: 'surfaceTextQuaternary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
         elevation: 8,
-        badgeAppearance: 'accent',
+        badgeAppearance: 'accentPrimary solid circular',
         clearIconFill: 'surfaceItemQuaternary',
         dropdownIconFill: 'surfaceItemQuaternary',
         groupFill: 'surfaceSecondary',
@@ -59,10 +57,12 @@ const selectAppearanceDefault = {
         optionFill: 'surfacePrimary',
         optionFillActive: 'accentPrimary',
         optionFillActiveHover: 'accentSecondary',
+        optionFillDisabled: 'surfaceSecondary',
         optionFillHover: 'surfaceSecondary',
         optionSelectedIconFillIcon: 'successItemPrimary',
         optionTextColor: 'surfaceTextPrimary',
         optionTextColorActive: 'accentTextPrimary',
+        optionTextColorDisabled: 'surfaceTextQuaternary',
         placeholderTextColor: 'surfaceTextQuaternary',
         requiredInputBorderColor: 'warningBorderPrimary',
     },
@@ -71,7 +71,7 @@ const selectAppearanceDefault = {
 const selectAppearanceDisabled = {
     disabledPrimary: {
         elevation: 8,
-        badgeAppearance: 'accent',
+        badgeAppearance: 'accentPrimary solid circular',
         clearIconFill: 'surfaceItemDisabled',
         dropdownIconFill: 'surfaceItemDisabled',
         headingFill: 'surfaceSecondary',
@@ -102,12 +102,10 @@ const selectAppearanceError = {
     errorPrimary: {
         fill: 'errorTertiary',
         fillHover: 'errorTertiary',
-        optionFillDisabled: 'surfaceSecondary',
-        optionTextColorDisabled: 'surfaceTextQuaternary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
         elevation: 8,
-        badgeAppearance: 'accent',
+        badgeAppearance: 'accentPrimary solid circular',
         clearIconFill: 'surfaceItemQuaternary',
         dropdownIconFill: 'surfaceItemQuaternary',
         groupFill: 'surfaceSecondary',
@@ -128,10 +126,12 @@ const selectAppearanceError = {
         optionFill: 'surfacePrimary',
         optionFillActive: 'accentPrimary',
         optionFillActiveHover: 'accentSecondary',
+        optionFillDisabled: 'surfaceSecondary',
         optionFillHover: 'surfaceSecondary',
         optionSelectedIconFillIcon: 'successItemPrimary',
         optionTextColor: 'surfaceTextPrimary',
         optionTextColorActive: 'accentTextPrimary',
+        optionTextColorDisabled: 'surfaceTextQuaternary',
         placeholderTextColor: 'surfaceTextQuaternary',
         requiredInputBorderColor: 'warningBorderPrimary',
     },
@@ -141,12 +141,10 @@ const selectAppearanceRequire = {
     requirePrimary: {
         fill: 'warningTertiary',
         fillHover: 'warningTertiary',
-        optionFillDisabled: 'surfaceSecondary',
-        optionTextColorDisabled: 'surfaceTextQuaternary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
         elevation: 8,
-        badgeAppearance: 'accent',
+        badgeAppearance: 'accentPrimary solid circular',
         clearIconFill: 'surfaceItemQuaternary',
         dropdownIconFill: 'surfaceItemQuaternary',
         groupFill: 'surfaceSecondary',
@@ -167,10 +165,12 @@ const selectAppearanceRequire = {
         optionFill: 'surfacePrimary',
         optionFillActive: 'accentPrimary',
         optionFillActiveHover: 'accentSecondary',
+        optionFillDisabled: 'surfaceSecondary',
         optionFillHover: 'surfaceSecondary',
         optionSelectedIconFillIcon: 'successItemPrimary',
         optionTextColor: 'surfaceTextPrimary',
         optionTextColorActive: 'accentTextPrimary',
+        optionTextColorDisabled: 'surfaceTextQuaternary',
         placeholderTextColor: 'surfaceTextQuaternary',
         requiredInputBorderColor: 'warningBorderPrimary',
     },
@@ -207,6 +207,7 @@ const selectAppearanceSize = {
     sizeXL: {
         size: 'xl',
         textLoadingMessageAppearance: 'sizeM',
+        badgeAppearanceSize: 'sizeM',
         badgeSize: 'm',
         badgeTextSize: 'm',
         clearIcon: _default.icons24.Action.Clear,
@@ -226,6 +227,7 @@ const selectAppearanceSize = {
     sizeL: {
         size: 'l',
         textLoadingMessageAppearance: 'sizeM',
+        badgeAppearanceSize: 'sizeM',
         badgeSize: 'm',
         badgeTextSize: 'm',
         clearIcon: _default.icons24.Action.Clear,
@@ -245,6 +247,7 @@ const selectAppearanceSize = {
     sizeM: {
         size: 'm',
         textLoadingMessageAppearance: 'sizeM',
+        badgeAppearanceSize: 'sizeM',
         badgeSize: 'm',
         badgeTextSize: 'm',
         clearIcon: _default.icons24.Action.Clear,
@@ -264,6 +267,7 @@ const selectAppearanceSize = {
     sizeS: {
         size: 's',
         textLoadingMessageAppearance: 'sizeS',
+        badgeAppearanceSize: 'sizeM',
         badgeSize: 'm',
         badgeTextSize: 'm',
         clearIcon: _default.icons24.Action.Clear,
@@ -283,6 +287,7 @@ const selectAppearanceSize = {
     sizeXS: {
         size: 'xs',
         textLoadingMessageAppearance: 'sizeXS',
+        badgeAppearanceSize: 'sizeM',
         badgeSize: 'm',
         badgeTextSize: 'm',
         clearIcon: _default.icons16.Action.Clear,
@@ -302,6 +307,7 @@ const selectAppearanceSize = {
     sizeXXS: {
         size: 'xxs',
         textLoadingMessageAppearance: 'sizeXS',
+        badgeAppearanceSize: 'sizeM',
         badgeSize: 'm',
         badgeTextSize: 'm',
         clearIcon: _default.icons16.Action.Clear,
@@ -341,12 +347,10 @@ const selectAppearanceSuccess = {
     successPrimary: {
         fill: 'successTertiary',
         fillHover: 'successTertiary',
-        optionFillDisabled: 'surfaceSecondary',
-        optionTextColorDisabled: 'surfaceTextQuaternary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
         elevation: 8,
-        badgeAppearance: 'accent',
+        badgeAppearance: 'accentPrimary solid circular',
         clearIconFill: 'surfaceItemQuaternary',
         dropdownIconFill: 'surfaceItemQuaternary',
         groupFill: 'surfaceSecondary',
@@ -367,10 +371,12 @@ const selectAppearanceSuccess = {
         optionFill: 'surfacePrimary',
         optionFillActive: 'accentPrimary',
         optionFillActiveHover: 'accentSecondary',
+        optionFillDisabled: 'surfaceSecondary',
         optionFillHover: 'surfaceSecondary',
         optionSelectedIconFillIcon: 'successItemPrimary',
         optionTextColor: 'surfaceTextPrimary',
         optionTextColorActive: 'accentTextPrimary',
+        optionTextColorDisabled: 'surfaceTextQuaternary',
         placeholderTextColor: 'surfaceTextQuaternary',
         requiredInputBorderColor: 'warningBorderPrimary',
     },
@@ -430,6 +436,27 @@ const SelectMenu = (props) => {
     return (jsxRuntime.jsxs(Select.components.Menu, { ...props, className: clsx(menuFill && `fill_${menuFill}`, menuShape && `shape_${menuShape}`, menuShapeStrength && `shape-strength_${menuShapeStrength}`, elevation && `elevation_${elevation}`), children: [menuBefore, props.selectProps.fetchingData ? (jsxRuntime.jsx("span", { className: "fetching", children: "Fetching data..." })) : (jsxRuntime.jsx(React.Fragment, { children: props.children })), menuAfter] }));
 };
 
+const SelectOverflowBadge = (props) => {
+    const { badgeAppearance, badgeAppearanceSize, overflowItemsList } = props;
+    const label = `+${overflowItemsList.length}`;
+    return (jsxRuntime.jsx(Icon.Badge, { appearance: `${badgeAppearance} ${badgeAppearanceSize}`, className: "select__multi-value-badge", value: label }));
+};
+
+const SelectMultiValue = (props) => {
+    const { index, getValue, ...restProps } = props;
+    const maxToShow = restProps.selectProps.maxToShow || 3;
+    const overflowItemsList = getValue()
+        .slice(maxToShow)
+        .map((x) => x.label);
+    if (index < maxToShow) {
+        return jsxRuntime.jsx(Select.components.MultiValue, { ...restProps });
+    }
+    if (index === maxToShow) {
+        return (jsxRuntime.jsx(SelectOverflowBadge, { badgeAppearance: restProps.selectProps.badgeAppearance, badgeAppearanceSize: restProps.selectProps.badgeAppearanceSize, overflowItemsList: overflowItemsList }));
+    }
+    return null;
+};
+
 const SelectMultiValueContainer = (props) => {
     const { multipleItemFill, multipleItemFillHover, multipleItemShapeRadius } = props.selectProps;
     return (jsxRuntime.jsx(Select.components.MultiValueContainer, { ...props, children: jsxRuntime.jsx(Group.Group, { className: clsx('select__multi-value-item'), direction: "horizontal", alignItems: "center", fill: multipleItemFill, fillHover: multipleItemFillHover, borderRadius: multipleItemShapeRadius, gap: "0.5m", children: props.children }) }));
@@ -495,7 +522,7 @@ const selectConfig = {
     },
 };
 const SelectContainer = React.forwardRef(function SelectContainer(props, ref) {
-    const { appearance = '', className, width, minWidth, initialValue, badgeAppearance, badgeSize, defaultValue, dividerDirection, filterOption, hideSelectedOptions, hideValueContainer, inputAfter, inputBefore, instanceId, loaderAppearance, loadingMessageText, menuAfter, menuBefore, menuIsOpen, menuItemSize, noOptionsSearchText, noOptionsText, optionAfter, optionBefore, options, placeholder, showBadge, showDivider, value, before, after, openMenuOnClick, closeMenuOnSelect, isDisabled, isClearable, isCreatable, isLoading, isMulti, isSearchable, set, onChange, onInputChange, } = props;
+    const { appearance = '', className, dataTestId, dataTour, width, minWidth, maxToShow, initialValue, badgeSize, defaultValue, dividerDirection, filterOption, hideSelectedOptions, hideValueContainer, inputAfter, inputBefore, instanceId, loadingMessageText, menuAfter, menuBefore, menuIsOpen, menuItemSize, noOptionsSearchText, noOptionsText, optionAfter, optionBefore, options, placeholder, showBadge, showDivider, value, before, after, openMenuOnClick, closeMenuOnSelect, isDisabled, isClearable, isCreatable, isLoading, isMulti, isSearchable, set, onChange, onInputChange, } = props;
     const defaultRef = React.useRef(null);
     const selectRef = ref || defaultRef;
     const SelectComponent = isCreatable
@@ -542,8 +569,8 @@ const SelectContainer = React.forwardRef(function SelectContainer(props, ref) {
     }), [minWidth, width]);
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, selectConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
-    const { fillClass, fillHoverClass, borderColorClass, borderColorHoverClass, elevation, badgeTextSize, clearIcon, clearIconFill, dividerFill, dividerSize, dropdownFillHover, dropdownIcon, dropdownIconFill, dropdownIconShape, groupFillClass, groupTextColorClass, groupTextSizeClass, groupTextWeightClass, inputCaretColorClass, inputTextColorClass, inputTextSizeClass, loadingMessageTextColor, loadingMessageTextSize, menuFillClass, multipleItemFill, multipleItemFillHover, multipleItemIcon, multipleItemIconFill, multipleItemShapeRadius, multipleItemTextColorClass, multipleItemTextSizeClass, noOptionsTextColorClass, noOptionsTextSizeClass, optionBorderClass, optionBorderTypeClass, optionFillActiveClass, optionFillActiveDisabledClass, optionFillActiveHoverClass, optionFillClass, optionFillDisabledClass, optionFillHoverClass, optionSelectedIcon, optionSelectedIconFillIcon, optionSelectedIconSize, optionSelectedIconSrc, optionTextColorActiveClass, optionTextColorClass, optionTextColorDisabled, optionTextSizeClass, placeholderTextColor, placeholderTextSize, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
-    return (jsxRuntime.jsx(SelectComponent, { className: clsx(className, 'select', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, sizeClass && `select_size_${sizeClass}`, hideValueContainer && 'select_state_hide-value-container', set && `select_set_${set}`, widthClass && `select_width_${widthClass}`), ref: selectRef, elevation: elevation, badgeAppearance: badgeAppearance, badgeSize: badgeSize, badgeTextSize: badgeTextSize, classNamePrefix: "select", clearIcon: clearIcon, clearIconFill: clearIconFill, components: {
+    const { fillClass, fillHoverClass, borderColorClass, borderColorHoverClass, elevation, badgeAppearance, badgeAppearanceSize, badgeTextSize, clearIcon, clearIconFill, dividerFill, dividerSize, dropdownFillHover, dropdownIcon, dropdownIconFill, dropdownIconShape, groupFillClass, groupTextColorClass, groupTextSizeClass, groupTextWeightClass, inputCaretColorClass, inputTextColorClass, inputTextSizeClass, loaderAppearance, loadingMessageTextColor, loadingMessageTextSize, menuFillClass, multipleItemFill, multipleItemFillHover, multipleItemIcon, multipleItemIconFill, multipleItemShapeRadius, multipleItemTextColorClass, multipleItemTextSizeClass, noOptionsTextColorClass, noOptionsTextSizeClass, optionBorderClass, optionBorderTypeClass, optionFillActiveClass, optionFillActiveDisabledClass, optionFillActiveHoverClass, optionFillClass, optionFillDisabledClass, optionFillHoverClass, optionSelectedIcon, optionSelectedIconFillIcon, optionSelectedIconSize, optionSelectedIconSrc, optionTextColorActiveClass, optionTextColorClass, optionTextColorDisabled, optionTextSizeClass, placeholderTextColor, placeholderTextSize, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
+    return (jsxRuntime.jsx(SelectComponent, { className: clsx(className, 'select', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, sizeClass && `select_size_${sizeClass}`, hideValueContainer && 'select_state_hide-value-container', set && `select_set_${set}`, widthClass && `select_width_${widthClass}`), ref: selectRef, maxToShow: maxToShow, elevation: elevation, badgeAppearance: badgeAppearance, badgeAppearanceSize: badgeAppearanceSize, badgeSize: badgeSize, badgeTextSize: badgeTextSize, classNamePrefix: "select", clearIcon: clearIcon, clearIconFill: clearIconFill, components: {
             IndicatorSeparator: () => null,
             ClearIndicator: SelectClearIndicator,
             Control: SelectControl,
@@ -554,6 +581,7 @@ const SelectContainer = React.forwardRef(function SelectContainer(props, ref) {
             LoadingIndicator: SelectLoadingIndicator,
             LoadingMessage: SelectLoadingMessage,
             Menu: SelectMenu,
+            MultiValue: SelectMultiValue,
             MultiValueContainer: SelectMultiValueContainer,
             MultiValueLabel: SelectMultiValueLabel,
             MultiValueRemove: SelectMultiValueRemove,
@@ -562,7 +590,7 @@ const SelectContainer = React.forwardRef(function SelectContainer(props, ref) {
             Placeholder: SelectPlaceholder,
             SingleValue: SelectSingleValue,
             ValueContainer: SelectValueContainer,
-        }, defaultValue: defaultValue || initialValue, dividerDirection: dividerDirection, dividerFill: dividerFill, dividerSize: dividerSize, dropdownFillHover: dropdownFillHover, dropdownIcon: dropdownIcon, dropdownIconFill: dropdownIconFill, dropdownIconShape: dropdownIconShape, filterOption: filterOption, groupFill: groupFillClass, groupTextColor: groupTextColorClass, groupTextSize: groupTextSizeClass, groupTextWeight: groupTextWeightClass, hideSelectedOptions: hideSelectedOptions ?? false, inputAfter: inputAfter, inputBefore: inputBefore, inputCaretColor: inputCaretColorClass, inputShape: shapeClass, inputShapeStrength: shapeStrengthClass, inputTextColor: inputTextColorClass, inputTextSize: inputTextSizeClass, instanceId: instanceId, loaderAppearance: loaderAppearance, loadingMessageText: loadingMessageText, loadingMessageTextColor: loadingMessageTextColor, loadingMessageTextSize: loadingMessageTextSize, menuAfter: menuAfter, menuBefore: menuBefore, menuFill: menuFillClass, menuIsOpen: menuIsOpen, menuItemSize: menuItemSize, menuShape: shapeClass, menuShapeStrength: shapeStrengthClass, multipleItemFill: multipleItemFill, multipleItemFillHover: multipleItemFillHover, multipleItemIcon: multipleItemIcon, multipleItemIconFill: multipleItemIconFill, multipleItemShapeRadius: multipleItemShapeRadius, multipleItemSize: sizeClass, multipleItemTextColor: multipleItemTextColorClass, multipleItemTextSize: multipleItemTextSizeClass, noOptionBorder: optionBorderClass && `border-color_${optionBorderClass}`, noOptionBorderType: optionBorderTypeClass && `border_type_${optionBorderTypeClass}`, noOptionsFill: optionFillClass && `fill_${optionFillClass}`, noOptionsSearchText: noOptionsSearchText, noOptionsText: noOptionsText, noOptionsTextColor: noOptionsTextColorClass, noOptionsTextSize: noOptionsTextSizeClass, optionAfter: optionAfter, optionBefore: optionBefore, optionBorder: optionBorderClass, optionBorderType: optionBorderTypeClass, optionFill: optionFillClass, optionFillActive: optionFillActiveClass, optionFillActiveDisabledClass: optionFillActiveDisabledClass, optionFillActiveHover: optionFillActiveHoverClass, optionFillDisabled: optionFillDisabledClass, optionFillHover: optionFillHoverClass, options: options, optionSelectedIcon: optionSelectedIcon, optionSelectedIconFillIcon: optionSelectedIconFillIcon, optionSelectedIconSize: optionSelectedIconSize, optionSelectedIconSrc: optionSelectedIconSrc, optionShape: shapeClass, optionShapeStrength: shapeStrengthClass, optionTextColor: optionTextColorClass, optionTextColorActive: optionTextColorActiveClass, optionTextColorDisabled: optionTextColorDisabled, optionTextSize: optionTextSizeClass, placeholder: placeholder, placeholderTextColor: placeholderTextColor, placeholderTextSize: placeholderTextSize, showBadge: showBadge, showDivider: showDivider, styles: clearStyle, value: value, before: before, after: after, openMenuOnClick: openMenuOnClick, closeMenuOnSelect: closeMenuOnSelect ?? true, isDisabled: isDisabled, isClearable: isClearable ?? false, isLoading: isLoading, isMulti: isMulti ?? false, isSearchable: isSearchable ?? false, set: set, onChange: onChange, onInputChange: onInputChange }));
+        }, "data-testid": dataTestId, "data-tour": dataTour, defaultValue: defaultValue || initialValue, dividerDirection: dividerDirection, dividerFill: dividerFill, dividerSize: dividerSize, dropdownFillHover: dropdownFillHover, dropdownIcon: dropdownIcon, dropdownIconFill: dropdownIconFill, dropdownIconShape: dropdownIconShape, filterOption: filterOption, groupFill: groupFillClass, groupTextColor: groupTextColorClass, groupTextSize: groupTextSizeClass, groupTextWeight: groupTextWeightClass, hideSelectedOptions: hideSelectedOptions ?? false, inputAfter: inputAfter, inputBefore: inputBefore, inputCaretColor: inputCaretColorClass, inputShape: shapeClass, inputShapeStrength: shapeStrengthClass, inputTextColor: inputTextColorClass, inputTextSize: inputTextSizeClass, instanceId: instanceId, loaderAppearance: loaderAppearance, loadingMessageText: loadingMessageText, loadingMessageTextColor: loadingMessageTextColor, loadingMessageTextSize: loadingMessageTextSize, menuAfter: menuAfter, menuBefore: menuBefore, menuFill: menuFillClass, menuIsOpen: menuIsOpen, menuItemSize: menuItemSize, menuShape: shapeClass, menuShapeStrength: shapeStrengthClass, multipleItemFill: multipleItemFill, multipleItemFillHover: multipleItemFillHover, multipleItemIcon: multipleItemIcon, multipleItemIconFill: multipleItemIconFill, multipleItemShapeRadius: multipleItemShapeRadius, multipleItemSize: sizeClass, multipleItemTextColor: multipleItemTextColorClass, multipleItemTextSize: multipleItemTextSizeClass, noOptionBorder: optionBorderClass && `border-color_${optionBorderClass}`, noOptionBorderType: optionBorderTypeClass && `border_type_${optionBorderTypeClass}`, noOptionsFill: optionFillClass && `fill_${optionFillClass}`, noOptionsSearchText: noOptionsSearchText, noOptionsText: noOptionsText, noOptionsTextColor: noOptionsTextColorClass, noOptionsTextSize: noOptionsTextSizeClass, optionAfter: optionAfter, optionBefore: optionBefore, optionBorder: optionBorderClass, optionBorderType: optionBorderTypeClass, optionFill: optionFillClass, optionFillActive: optionFillActiveClass, optionFillActiveDisabledClass: optionFillActiveDisabledClass, optionFillActiveHover: optionFillActiveHoverClass, optionFillDisabled: optionFillDisabledClass, optionFillHover: optionFillHoverClass, options: options, optionSelectedIcon: optionSelectedIcon, optionSelectedIconFillIcon: optionSelectedIconFillIcon, optionSelectedIconSize: optionSelectedIconSize, optionSelectedIconSrc: optionSelectedIconSrc, optionShape: shapeClass, optionShapeStrength: shapeStrengthClass, optionTextColor: optionTextColorClass, optionTextColorActive: optionTextColorActiveClass, optionTextColorDisabled: optionTextColorDisabled, optionTextSize: optionTextSizeClass, placeholder: placeholder, placeholderTextColor: placeholderTextColor, placeholderTextSize: placeholderTextSize, showBadge: showBadge, showDivider: showDivider, styles: clearStyle, value: value, before: before, after: after, openMenuOnClick: openMenuOnClick, closeMenuOnSelect: closeMenuOnSelect ?? true, isDisabled: isDisabled, isClearable: isClearable ?? false, isLoading: isLoading, isMulti: isMulti ?? false, isSearchable: isSearchable ?? false, set: set, onChange: onChange, onInputChange: onInputChange }));
 });
 
 exports.SelectClearIndicator = SelectClearIndicator;