@itcase/ui 1.8.3 → 1.8.5

package/dist/css/components/Avatar/Avatar.css

@@ -82,11 +82,11 @@
           justify-content: center;
           align-items: center;
           ^^^&__image {
-            width: $(size) px;
-            height: $(size) px;
+            width: $(size)px;
+            height: $(size)px;
             & .image__item {
-              width: $(size) px;
-              height: $(size) px;
+              width: $(size)px;
+              height: $(size)px;
             }
           }
         }

package/dist/css/components/CookiesWarning/CookiesWarning.css

@@ -18,7 +18,7 @@
     animation-name: cookieMessageClose;
   }
   &__inner {
-    background: var(--color-surface-primary);
+    background: var(--color-surface-fill-primary);
     padding: 32px;
     position: relative;
     @media (--mobile) {

package/dist/css/components/DatePicker/DatePicker.css

@@ -1287,7 +1287,7 @@ h2.react-datepicker__current-month {
 }
 :root {
   --date-picker-padding: 24px 12px;
-  --date-picker-fill: var(--color-surface-primary);
+  --date-picker-fill: var(--color-surface-fill-primary);
   --date-picker-box-shadow: 0px 4px 24px 0px rgb(0, 0, 0, 0.2);
   --date-picker-border-radius: 12px;
   --date-picker-border: solid 1px var(--color-surface-tertiary);
@@ -1336,7 +1336,7 @@ h2.react-datepicker__current-month {
   --date-picker-day-range-start-border-radius: 12px 0 0 12px;
   --date-picker-day-range-end-border-radius: 0 12px 12px 0;
 
-  --date-picker-day-weekend-background: var(--color-surface-primary);
+  --date-picker-day-weekend-background: var(--color-surface-fill-primary);
   --date-picker-day-weekend-text-color: var(--color-secondary-text-secondary);
   --date-picker-day-weekend-outside-text-color: var(
     --color-secondary-text-disabled
@@ -1349,6 +1349,6 @@ h2.react-datepicker__current-month {
   --date-picker-day-selected-text-color: var(--color-accent-text-primary);
   --date-picker-day-selected-text-hover-color: var(--color-accent-text-primary);
 
-  --date-picker-day-outside-background: var(--color-surface-primary);
+  --date-picker-day-outside-background: var(--color-surface-fill-primary);
   --date-picker-day-outside-text-color: var(--color-surface-text-tertiary);
 }

package/dist/css/components/Icon/Icon.css

@@ -50,7 +50,7 @@
         &-$(color) {
           & svg {
             stroke: none;
-            fill: var(--color-$(type)-$(color));
+            fill: var(--color-$(type)-fill-$(color));
           }
         }
       }

package/dist/css/components/Input/Input.css

@@ -95,7 +95,13 @@
   --input-state-hover-border: var(--color-surface-border-quaternary);
   --input-state-hover-background: none;
 
-  /* Dosabled */
+  --input-success-border: var(--color-success-border-primary);
+  --input-success-border-hover: var(--color-surface-border-quaternary);
+  --input-error-border: var(--color-error-border-primary);
+  --input-focus-background: var(--color-surface-primary);
+  --input-focus-border: var(--color-surface-border-quaternary);
+
+  /* Disabled */
   --input-state-disabled-background: none;
   --input-state-disabled-border: none;
 }

package/dist/css/components/ModalSheetBottom/ModalSheetBottom.css

@@ -1,10 +1,7 @@
 .modal-sheet-bottom {
   position: relative;
   &__container {
-    background-color: var(
-      --modal-sheet-bottom-container-background,
-      var(--color-surface-primary)
-    ) !important;
+    background-color: var(--modal-sheet-bottom-container-background) !important;
     border-radius: var(--modal-sheet-bottom-container-border-radius) !important;
   }
   &__header {
@@ -35,8 +32,8 @@
   }
 }
 :root {
-  --modal-sheet-bottom-container-background: none;
   --modal-sheet-bottom-container-border-radius: 0;
   --modal-sheet-bottom-header-grabber: none;
   --modal-sheet-bottom-backdrop: 0;
+  --modal-sheet-bottom-container-background: var(--color-surface-fill-primary);
 }

package/dist/css/components/Notification/Notification.css

@@ -76,7 +76,7 @@
   &_set {
     &_toast {
       width: 100%;
-      background: var(--color-surface-primary);
+      background: var(--color-surface-fill-primary);
       border-radius: var(--notification-item-set-toast-border-radius);
       display: flex;
       flex-direction: column;

package/dist/css/components/Notification/css/__item/notification__item_set_toast.css

@@ -2,7 +2,7 @@
   &_set {
     &_toast {
       width: 100%;
-      background: var(--color-surface-primary);
+      background: var(--color-surface-fill-primary);
       border-radius: var(--notification-item-set-toast-border-radius);
       display: flex;
       flex-direction: column;

package/dist/css/components/Pagination/Pagination.css

@@ -19,7 +19,7 @@
     }
   }
   &__input {
-    background: var(--color-surface-primary);
+    background: var(--color-surface-fill-primary);
     border: solid 1px
       var(--pagination-input-color, --color-surface-border-tertiary);
     border-radius: 8px;
@@ -130,8 +130,8 @@
 
   --paginator-item-transition: all 0.2s ease 0s;
 
-  --paginator-item-default-fill: var(--color-surface-primary);
-  --paginator-item-default-fill-hover: var(--color-surface-primary-hover);
+  --paginator-item-default-fill: var(--color-surface-fill-primary);
+  --paginator-item-default-fill-hover: var(--color-surface-hover);
   --paginator-item-default-text: var(--color-surface-text-primary);
 
   --paginator-item-active-fill: var(--color-accent-primary);

package/dist/css/components/RangeSlider/RangeSlider.css

@@ -317,7 +317,7 @@
         accent, disabled, hover {
         &-$(color) {
           & .rc-slider-rail {
-            background: var(--color-$(type)-$(color));
+            background: var(--color-$(type)-fill-$(color));
           }
         }
       }

package/dist/css/components/Select/Select.css

@@ -117,7 +117,7 @@
           @each $color in primary, secondary, tertiary, quaternary, quinary,
             senary, accent, disabled, hover {
             &-$(color) {
-              background: var(--color-$(type)-$(color));
+              background: var(--color-$(type)-fill-$(color));
             }
           }
         }
@@ -220,7 +220,7 @@
 .select {
   &__menu {
     width: 100%;
-    background: var(--color-surface-primary);
+    background: var(--color-surface-fill-primary);
     padding: 12px 0;
     margin: var(--select-menu-margin);
     border-radius: var(--select-menu-border-radius);
@@ -385,11 +385,16 @@
   --select-menu-border-radius: 12px;
   --select-menu-margin: 0;
 
-  --select-multi-value-padding: 2px 6px;
-
   --select-control-shape-rounded: 8px;
 
-  --select-success-border: var(--color-surface-border-tertiary);
+  --select-background: var(--color-surface-fill-primary);
+  --select-background-hover: var(--color-surface-fill-hover);
+  --select-focus-background: var(--color-surface-fill-primary);
+  --select-focus-border: var(--color-surface-border-quaternary);
+  --select-success-border: var(--color-success-border-secondary);
+  --select-success-border-hover: var(--color-surface-border-quaternary);
+  --select-error-border: var(--color-error-border-secondary);
+  --select-error-hover: var(--color-error-border-secondary);
 
   --select-menu-list-item-xxl-padding: 18px 25px;
   --select-menu-list-item-xl-padding: 14px 20px;
@@ -398,5 +403,6 @@
   --select-menu-list-item-s-padding: 6px 10px;
   --select-menu-list-item-xs-padding: 2px 8px;
 
+  --select-multi-value-padding: 2px 6px;
   --select-multi-value-border-radius: 0;
 }

package/dist/css/components/Select/css/__control/select__control_fill.css

@@ -7,7 +7,7 @@
           @each $color in primary, secondary, tertiary, quaternary, quinary,
             senary, accent, disabled, hover {
             &-$(color) {
-              background: var(--color-$(type)-$(color));
+              background: var(--color-$(type)-fill-$(color));
             }
           }
         }

package/dist/css/components/Select/css/__menu/select__menu.css

@@ -1,7 +1,7 @@
 .select {
   &__menu {
     width: 100%;
-    background: var(--color-surface-primary);
+    background: var(--color-surface-fill-primary);
     padding: 12px 0;
     margin: var(--select-menu-margin);
     border-radius: var(--select-menu-border-radius);

package/dist/css/components/Tooltip/Tooltip.css

@@ -163,7 +163,7 @@
   --tooltip-arrow-height: 14px;
   --tooltip-arrow-radius: 2px;
 
-  --tooltip-arrow-color: var(--color-surface-primary);
+  --tooltip-arrow-color: var(--color-surface-fill-primary);
   --tooltip-shape-rounded-default: 0;
 
   /* Size */

package/dist/css/styles/hover/hover-fill-color.css

@@ -1,10 +1,12 @@
 .hover-fill-color {
-  @each $type in accent, primary, secondary, tertiary, quaternary, quinary, senary, surface, success, error, info, warning {
-    &_$(type) {
-      @each $color in primary, secondary, tertiary, quaternary, quinary, senary, accent, disabled, hover  {
+  @each $type in accent, primary, secondary, tertiary, quaternary, surface,
+    error, success, warning, info, danger, gradient, disabled, hover, inverse {
+    @each $color in primary, secondary, tertiary, quaternary, accent, disabled,
+      hover, inverse {
+      &_$(type) {
         &-$(color) {
           &:hover {
-            background: var(--color-$(type)-$(color));
+            background: var(--color-$(type)-fill-$(color));
           }
         }
       }

package/dist/css/styles/hover/hover-item-color.css

@@ -1,8 +1,10 @@
 .hover-item-color {
-  @each $type in accent, primary, secondary, tertiary, quaternary, quinary, senary, surface, success, error, info, warning {
-    &_$(type) {
-      &-item {
-        @each $color in primary, secondary, tertiary, quaternary, quinary, senary, accent, disabled, hover  {
+  @each $type in accent, primary, secondary, tertiary, quaternary, surface,
+    error, success, warning, info, danger, gradient, disabled, hover, inverse {
+    @each $color in primary, secondary, tertiary, quaternary, accent, disabled,
+      hover, inverse {
+      &_$(type) {
+        &-item {
           &-$(color) {
             &:hover {
               color: var(--color-$(type)-item-$(color));

package/dist/css/styles/hover/hover-text-color.css

@@ -1,8 +1,10 @@
 .hover-text-color {
-  @each $type in accent, primary, secondary, tertiary, quaternary, quinary, senary, surface, success, error, info, warning {
-    &_$(type) {
-      &-text {
-        @each $color in primary, secondary, tertiary, quaternary, quinary, senary, accent, disabled, hover  {
+  @each $type in accent, primary, secondary, tertiary, quaternary, surface,
+    error, success, warning, info, danger, gradient, disabled, hover, inverse {
+    @each $color in primary, secondary, tertiary, quaternary, accent, disabled,
+      hover, inverse {
+      &_$(type) {
+        &-text {
           &-$(color) {
             &:hover {
               color: var(--color-$(type)-text-$(color));

package/dist/types/components/DatePicker/DatePicker.appearance.d.ts

@@ -27,13 +27,10 @@ export declare const datePickerAppearance: {
             daySize: string;
             dayTextSize: string;
             iconFillSize: number;
-            iconLeft: any;
-            iconRight: any;
         };
         inputProps: {
             size: string;
             textSize: string;
-            clearIcon: any;
             clearIconSize: number;
             clearLabelTextSize: string;
         };
@@ -43,13 +40,10 @@ export declare const datePickerAppearance: {
             daySize: string;
             dayTextSize: string;
             iconFillSize: number;
-            iconLeft: any;
-            iconRight: any;
         };
         inputProps: {
             size: string;
             textSize: string;
-            clearIcon: any;
             clearIconSize: number;
             clearLabelTextSize: string;
         };
@@ -59,13 +53,10 @@ export declare const datePickerAppearance: {
             daySize: string;
             dayTextSize: string;
             iconFillSize: number;
-            iconLeft: any;
-            iconRight: any;
         };
         inputProps: {
             size: string;
             textSize: string;
-            clearIcon: any;
             clearIconSize: number;
             clearLabelTextSize: string;
         };

package/dist/types/components/DatePicker/appearance/datePickerSize.d.ts

@@ -4,13 +4,10 @@ declare const datePickerSize: {
             daySize: string;
             dayTextSize: string;
             iconFillSize: number;
-            iconLeft: any;
-            iconRight: any;
         };
         inputProps: {
             size: string;
             textSize: string;
-            clearIcon: any;
             clearIconSize: number;
             clearLabelTextSize: string;
         };
@@ -20,13 +17,10 @@ declare const datePickerSize: {
             daySize: string;
             dayTextSize: string;
             iconFillSize: number;
-            iconLeft: any;
-            iconRight: any;
         };
         inputProps: {
             size: string;
             textSize: string;
-            clearIcon: any;
             clearIconSize: number;
             clearLabelTextSize: string;
         };
@@ -36,13 +30,10 @@ declare const datePickerSize: {
             daySize: string;
             dayTextSize: string;
             iconFillSize: number;
-            iconLeft: any;
-            iconRight: any;
         };
         inputProps: {
             size: string;
             textSize: string;
-            clearIcon: any;
             clearIconSize: number;
             clearLabelTextSize: string;
         };

package/dist/types/components/Input/Input.appearance.d.ts

@@ -1,3 +1,2 @@
-import { InputAppearance, InputState } from './Input.interface';
+import { InputAppearance } from './Input.interface';
 export declare const inputAppearance: InputAppearance;
-export declare const inputState: InputState;

package/dist/types/components/Input/Input.interface.d.ts

@@ -27,7 +27,6 @@ type InputAppearance = {
 interface InputConfig {
     [key: number | string | symbol]: any;
     appearance: InputAppearance | undefined;
-    state: InputState | undefined;
     setAppearance: (newComponent: InputAppearance) => void;
     setState: (newComponent: InputState) => void;
 }
@@ -50,4 +49,4 @@ interface InputProps extends InputThemeColor, StyleAttributes {
     onFocus?: (event?: React.FocusEvent<HTMLInputElement>) => void;
     onKeyDown?: (event?: React.KeyboardEvent<HTMLInputElement>) => void;
 }
-export type { InputThemeColor, InputState, InputAppearance, InputConfig, InputProps, };
+export type { InputThemeColor, InputAppearance, InputConfig, InputProps };

package/dist/types/components/Input/appearance/inputDefault.d.ts

@@ -0,0 +1,24 @@
+declare const inputAppearanceDefault: {
+    defaultPrimary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+        textColor: string;
+        textColorDisabled: string;
+        caret: string;
+    };
+    defaultSecondary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+        placeholderTextColor: string;
+        textColor: string;
+        textColorDisabled: string;
+        caret: string;
+    };
+};
+export { inputAppearanceDefault };

package/dist/types/components/Input/appearance/inputDisabled.d.ts

@@ -0,0 +1,20 @@
+declare const inputAppearanceDisabled: {
+    disabledPrimary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        textColor: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+        placeholderTextColor: string;
+    };
+    disabledSecondary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+        placeholderTextColor: string;
+    };
+};
+export { inputAppearanceDisabled };

package/dist/types/components/Input/appearance/inputError.d.ts

@@ -0,0 +1,20 @@
+declare const inputAppearanceError: {
+    errorPrimary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        textColor: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+        placeholderTextColor: string;
+    };
+    errorSecondary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+        placeholderTextColor: string;
+    };
+};
+export { inputAppearanceError };

package/dist/types/components/Input/appearance/inputRequire.d.ts

@@ -0,0 +1,20 @@
+declare const inputAppearanceRequire: {
+    requirePrimary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        textColor: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+        placeholderTextColor: string;
+    };
+    requireSecondary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+        placeholderTextColor: string;
+    };
+};
+export { inputAppearanceRequire };

package/dist/types/components/Input/appearance/inputSize.d.ts

@@ -0,0 +1,31 @@
+declare const inputAppearanceSize: {
+    sizeXXL: {
+        size: string;
+        textSize: string;
+    };
+    sizeXL: {
+        size: string;
+        textSize: string;
+    };
+    sizeL: {
+        size: string;
+        textSize: string;
+    };
+    sizeM: {
+        size: string;
+        textSize: string;
+    };
+    sizeS: {
+        size: string;
+        textSize: string;
+    };
+    sizeXS: {
+        size: string;
+        textSize: string;
+    };
+    sizeXXS: {
+        size: string;
+        textSize: string;
+    };
+};
+export { inputAppearanceSize };

package/dist/types/components/Input/appearance/inputStyle.d.ts

@@ -0,0 +1,14 @@
+declare const inputAppearanceStyle: {
+    full: {};
+    ghost: {
+        fill: string;
+        borderWidth: string;
+    };
+    outlined: {
+        fill: string;
+    };
+    solid: {
+        borderWidth: string;
+    };
+};
+export { inputAppearanceStyle };

package/dist/types/components/Input/appearance/inputSuccess.d.ts

@@ -0,0 +1,20 @@
+declare const inputAppearanceSuccess: {
+    successPrimary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        textColor: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+        placeholderTextColor: string;
+    };
+    successSecondary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+        placeholderTextColor: string;
+    };
+};
+export { inputAppearanceSuccess };

package/dist/types/components/Input/index.d.ts

@@ -1,2 +1,2 @@
 export { Input, inputConfig } from './Input';
-export { inputAppearance, inputState } from './Input.appearance';
+export { inputAppearance } from './Input.appearance';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.8.3",
+  "version": "1.8.5",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",

package/dist/Input_es_Bs0gEq3L.js

@@ -1,98 +0,0 @@
-import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
-import { jsx } from 'react/jsx-runtime';
-import React from 'react';
-import clsx from 'clsx';
-import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-
-var inputAppearance = {
-    dev: {
-        size: 'm',
-        borderColor: 'surfaceBorderTertiary',
-        textColor: 'surfaceTextPrimary',
-        textSize: 'm',
-        placeholderTextColor: 'surfaceTextSecondary',
-        shape: 'rounded',
-    },
-};
-var inputState = {
-    filled: {
-        borderColor: 'surfaceBorderQuaternary',
-        textColor: 'surfaceTextPrimary',
-    },
-    disabled: {
-        borderColor: 'surfaceBorderDisabled',
-        borderColorHover: 'surfaceBorderDisabled',
-        textColor: 'surfaceTextPrimary',
-        placeholderTextColor: 'surfaceTextDisabled',
-    },
-    error: {
-        borderColor: 'errorBorderPrimary',
-        placeholderTextColor: 'secondaryTextSecondary',
-    },
-    errorFilled: {
-        borderColor: 'errorBorderPrimary',
-        textColor: 'surfaceTextPrimary',
-    },
-    success: {
-        borderColor: 'successBorderPrimary',
-        textColor: 'surfaceTextPrimary',
-    },
-    active: {
-        borderColor: 'surfaceBorderActive',
-        placeholderTextColor: 'secondaryTextSecondary',
-    },
-    activeFilled: {
-        borderColor: 'surfaceBorderActive',
-        textColor: 'surfaceTextPrimary',
-    },
-    normal: {
-        borderColor: 'surfaceBorderQuaternary',
-        placeholderTextColor: 'secondaryTextSecondary',
-    },
-    readonly: {
-        borderColor: 'surfaceBorderDisabled',
-        textColor: 'surfaceTextPrimary',
-    },
-    require: {
-        borderColor: 'surfaceBorderActive',
-        textColor: 'surfaceTextPrimary',
-    },
-};
-
-var inputConfig = {
-    appearance: inputAppearance,
-    state: inputState,
-    setAppearance: function (appearanceConfig) {
-        inputConfig.appearance = appearanceConfig;
-    },
-    setState: function (newComponent) {
-        inputConfig.state = newComponent;
-    },
-};
-var Input = React.forwardRef(function Input(props, ref) {
-    var id = props.id, className = props.className, _a = props.type, type = _a === void 0 ? 'text' : _a, name = props.name, appearance = props.appearance, isDisabled = props.isDisabled, autocomplete = props.autocomplete, dataTestId = props.dataTestId, index = props.index, placeholder = props.placeholder, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
-    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-        var _a;
-        return (__assign(__assign({}, resultConfig), (_a = inputConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-    }, {});
-    // const stateConfig = state && inputConfig.state && inputConfig.state[state]
-    var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    var fillClass = propsGenerator.fillClass, fillDisabledClass = propsGenerator.fillDisabledClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorDisabledClass = propsGenerator.borderColorDisabledClass, borderWidthClass = propsGenerator.borderWidthClass, borderWidthDisabledClass = propsGenerator.borderWidthDisabledClass, textColorClass = propsGenerator.textColorClass, textColorDisabledClass = propsGenerator.textColorDisabledClass, textSizeClass = propsGenerator.textSizeClass, textWeightClass = propsGenerator.textWeightClass, placeholderTextColorDisabledClass = propsGenerator.placeholderTextColorDisabledClass, caretClass = propsGenerator.caretClass, placeholderTextColorClass = propsGenerator.placeholderTextColorClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
-    return (jsx("input", { id: String(id), className: clsx(className, 'input', type === 'number' && 'input_type_number', (textSizeClass || textColorClass || textWeightClass) && 'text', caretClass && "caret-color_".concat(caretClass), shapeClass && "input_shape_".concat(shapeClass), textSizeClass && "text_size_".concat(textSizeClass), textWeightClass && "text-weight_".concat(textWeightClass), widthClass && "width_".concat(widthClass), sizeClass && "input_size_".concat(sizeClass), textColorClass && "text-color_".concat(textColorClass), !isDisabled
-            ? fillClass && "fill_".concat(fillClass)
-            : fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), !isDisabled
-            ? borderWidthClass && "border-width_".concat(borderWidthClass)
-            : borderWidthDisabledClass &&
-                "border-width_disabled_".concat(borderWidthDisabledClass), !isDisabled ? fillHoverClass && "fill_hover_".concat(fillHoverClass) : null, !isDisabled
-            ? borderColorClass && "border-color_".concat(borderColorClass)
-            : borderColorDisabledClass &&
-                "border-color_disabled_".concat(borderColorDisabledClass), !isDisabled
-            ? placeholderTextColorClass &&
-                "placeholder-text-color_".concat(placeholderTextColorClass)
-            : placeholderTextColorDisabledClass &&
-                "placeholder-text-color_disabled_".concat(placeholderTextColorDisabledClass), !isDisabled
-            ? textColorClass && "text-color_".concat(textColorClass)
-            : textColorDisabledClass && "text-color_".concat(textColorDisabledClass)), type: type, disabled: isDisabled, autocomplete: autocomplete, "data-test-id": dataTestId || (name ? "".concat(name, "Input") : 'input'), index: index, placeholder: placeholder, ref: ref, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
-});
-
-export { Input as I, inputAppearance as a, inputState as b, inputConfig as i };