@itcase/ui 1.8.85 → 1.8.87

package/dist/{DatePicker_cjs_BVN24HUp.js → DatePicker_cjs_BFT9fj8A.js}

@@ -11,7 +11,7 @@ var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDe
 var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
 var Button = require('./Button_cjs_BG6t5BXg.js');
 var Icon = require('./Icon_cjs_DP41Z8bS.js');
-var Input = require('./Input_cjs_DSpBwtPv.js');
+var Input = require('./Input_cjs_CFy0tfAO.js');
 var Label = require('./Label_cjs_LEuuFaN-.js');
 var Text = require('./Text_cjs_B8nNXWBA.js');
 var _default = require('@itcase/icons/default');

package/dist/{DatePicker_es_tuBcfK5V.js → DatePicker_es_C1ykgFhq.js}

@@ -9,7 +9,7 @@ import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevi
 import { useStyles } from './hooks/useStyles/useStyles.js';
 import { B as Button } from './Button_es_CAxHI9Qd.js';
 import { I as Icon } from './Icon_es_-iRj1sFG.js';
-import { I as Input } from './Input_es_3C_YhQFo.js';
+import { I as Input } from './Input_es_l3ry6luZ.js';
 import { L as Label } from './Label_es_Bfi00e0G.js';
 import { T as Text } from './Text_es_BvmOR4nv.js';
 import { icons14 } from '@itcase/icons/default';

package/dist/{Input_cjs_DSpBwtPv.js → Input_cjs_CFy0tfAO.js}

@@ -14,7 +14,7 @@ var inputAppearanceDefault = {
         borderColorHover: 'surfaceBorderQuaternary',
         textColor: 'surfaceTextPrimary',
         textColorDisabled: 'surfaceTextDisabled',
-        caret: 'secondaryItemSecondary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
@@ -25,7 +25,7 @@ var inputAppearanceDefault = {
         borderColorHover: 'surfaceBorderQuaternary',
         textColor: 'surfaceTextPrimary',
         textColorDisabled: 'surfaceTextDisabled',
-        caret: 'secondaryItemSecondary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
@@ -58,6 +58,7 @@ var inputAppearanceError = {
         borderColor: 'errorBorderQuaternary',
         borderColorHover: 'errorBorderQuaternary',
         textColor: 'surfaceTextPrimary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'errorItemQuaternary',
         iconClearFill: 'errorItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
@@ -66,6 +67,7 @@ var inputAppearanceError = {
         fill: 'errorSecondary',
         borderColor: 'errorBorderTertiary',
         borderColorHover: 'errorBorderQuaternary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'errorItemQuaternary',
         iconClearFill: 'errorItemPrimary',
         placeholderTextColor: 'errorTextSecondary',
@@ -78,6 +80,7 @@ var inputAppearanceRequire = {
         borderColor: 'warningBorderQuaternary',
         borderColorHover: 'warningBorderQuaternary',
         textColor: 'surfaceTextPrimary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'warningItemQuaternary',
         iconClearFill: 'warningItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
@@ -86,6 +89,7 @@ var inputAppearanceRequire = {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextSecondary',
@@ -169,6 +173,7 @@ var inputAppearanceSuccess = {
         borderColor: 'successBorderQuaternary',
         borderColorHover: 'successBorderQuaternary',
         textColor: 'surfaceTextPrimary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'successItemQuaternary',
         iconClearFill: 'successItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
@@ -177,6 +182,7 @@ var inputAppearanceSuccess = {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextSecondary',

package/dist/{Input_es_3C_YhQFo.js → Input_es_l3ry6luZ.js}

@@ -12,7 +12,7 @@ var inputAppearanceDefault = {
         borderColorHover: 'surfaceBorderQuaternary',
         textColor: 'surfaceTextPrimary',
         textColorDisabled: 'surfaceTextDisabled',
-        caret: 'secondaryItemSecondary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
@@ -23,7 +23,7 @@ var inputAppearanceDefault = {
         borderColorHover: 'surfaceBorderQuaternary',
         textColor: 'surfaceTextPrimary',
         textColorDisabled: 'surfaceTextDisabled',
-        caret: 'secondaryItemSecondary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
@@ -56,6 +56,7 @@ var inputAppearanceError = {
         borderColor: 'errorBorderQuaternary',
         borderColorHover: 'errorBorderQuaternary',
         textColor: 'surfaceTextPrimary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'errorItemQuaternary',
         iconClearFill: 'errorItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
@@ -64,6 +65,7 @@ var inputAppearanceError = {
         fill: 'errorSecondary',
         borderColor: 'errorBorderTertiary',
         borderColorHover: 'errorBorderQuaternary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'errorItemQuaternary',
         iconClearFill: 'errorItemPrimary',
         placeholderTextColor: 'errorTextSecondary',
@@ -76,6 +78,7 @@ var inputAppearanceRequire = {
         borderColor: 'warningBorderQuaternary',
         borderColorHover: 'warningBorderQuaternary',
         textColor: 'surfaceTextPrimary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'warningItemQuaternary',
         iconClearFill: 'warningItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
@@ -84,6 +87,7 @@ var inputAppearanceRequire = {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextSecondary',
@@ -167,6 +171,7 @@ var inputAppearanceSuccess = {
         borderColor: 'successBorderQuaternary',
         borderColorHover: 'successBorderQuaternary',
         textColor: 'surfaceTextPrimary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'successItemQuaternary',
         iconClearFill: 'successItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
@@ -175,6 +180,7 @@ var inputAppearanceSuccess = {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
+        caret: 'accentItemSecondary',
         iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextSecondary',

package/dist/cjs/components/Checkbox.js

@@ -84,13 +84,17 @@ var checkboxAppearanceError = {
 
 var checkboxAppearanceRequire = {
     requirePrimary: {
-        fill: 'warningTertiary',
-        borderColor: 'warningBorderQuaternary',
-        borderHover: 'warningBorderQuaternary',
-        textColor: 'surfaceTextPrimary',
-        iconBeforeFill: 'warningItemQuaternary',
-        iconClearFill: 'warningItemPrimary',
-        placeholderTextColor: 'surfaceTextQuaternary',
+        fillCheckbox: 'warningPrimary',
+        fillCheckboxActive: 'warningPrimary',
+        fillCheckboxActiveHover: 'warningTertiary',
+        fillCheckboxHover: 'warningTertiary',
+        fillCheckmark: 'warningBorderPrimary',
+        labelTextColor: 'surfaceTextPrimary',
+        descTextColor: 'surfaceTextPrimary',
+        borderColorCheckbox: 'warningBorderPrimary',
+        borderColorCheckboxActive: 'warningBorderPrimary',
+        borderColorCheckboxActiveHover: 'warningBorderPrimary',
+        borderColorCheckboxHover: 'warningBorderPrimary',
     },
     requireSecondary: {
         fill: 'surfaceSecondary',
@@ -138,21 +142,25 @@ var checkboxAppearanceStyle = {
 
 var checkboxAppearanceSuccess = {
     successPrimary: {
-        fill: 'successTertiary',
-        borderColor: 'successBorderQuaternary',
+        fillCheckbox: 'successPrimary',
+        fillCheckboxActive: 'successPrimary',
+        fillCheckboxActiveHover: 'successTertiary',
+        fillCheckboxHover: 'successTertiary',
+        fillCheckmark: 'successBorderPrimary',
+        labelTextColor: 'surfaceTextPrimary',
+        descTextColor: 'surfaceTextPrimary',
+        borderColorCheckbox: 'successBorderPrimary',
+        borderColorCheckboxActive: 'successBorderPrimary',
+        borderColorCheckboxActiveHover: 'successBorderPrimary',
+        borderColorCheckboxHover: 'successBorderPrimary',
+    },
+    successSecondary: {
+        fill: 'successSecondary',
+        borderColor: 'successBorderTertiary',
         borderHover: 'successBorderQuaternary',
-        textColor: 'surfaceTextPrimary',
         iconBeforeFill: 'successItemQuaternary',
         iconClearFill: 'successItemPrimary',
-        placeholderTextColor: 'surfaceTextQuaternary',
-    },
-    successSecondary: {
-        fill: 'surfaceSecondary',
-        borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
-        iconBeforeFill: 'surfaceItemQuaternary',
-        iconClearFill: 'surfaceItemPrimary',
-        placeholderTextColor: 'surfaceTextSecondary',
+        placeholderTextColor: 'successTextSecondary',
     },
 };
 

package/dist/cjs/components/Dadata.js

@@ -5,7 +5,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
 var reactDadata = require('react-dadata');
-var Input = require('../../Input_cjs_DSpBwtPv.js');
+var Input = require('../../Input_cjs_CFy0tfAO.js');
 require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 require('lodash/camelCase');

package/dist/cjs/components/DatePeriod.js

@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
 var common = require('@itcase/common');
-var DatePicker = require('../../DatePicker_cjs_BVN24HUp.js');
+var DatePicker = require('../../DatePicker_cjs_BFT9fj8A.js');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var ChipsGroup = require('../../ChipsGroup_cjs_DlU08Wik.js');
@@ -30,7 +30,7 @@ require('../context/UrlAssetPrefix.js');
 require('../../Link_cjs_BqT6eVl6.js');
 require('../../Text_cjs_B8nNXWBA.js');
 require('../../Loader_cjs_DlnM5Vzb.js');
-require('../../Input_cjs_DSpBwtPv.js');
+require('../../Input_cjs_CFy0tfAO.js');
 require('../../Label_cjs_LEuuFaN-.js');
 require('@itcase/icons/default');
 require('lodash/castArray');

package/dist/cjs/components/DatePicker.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var DatePicker = require('../../DatePicker_cjs_BVN24HUp.js');
+var DatePicker = require('../../DatePicker_cjs_BFT9fj8A.js');
 require('../../tslib.es6_cjs_CCZ3TN_7.js');
 require('react/jsx-runtime');
 require('react');
@@ -30,7 +30,7 @@ require('../context/UrlAssetPrefix.js');
 require('../../Link_cjs_BqT6eVl6.js');
 require('../../Text_cjs_B8nNXWBA.js');
 require('../../Loader_cjs_DlnM5Vzb.js');
-require('../../Input_cjs_DSpBwtPv.js');
+require('../../Input_cjs_CFy0tfAO.js');
 require('../../Label_cjs_LEuuFaN-.js');
 require('@itcase/icons/default');
 

package/dist/cjs/components/Input.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Input = require('../../Input_cjs_DSpBwtPv.js');
+var Input = require('../../Input_cjs_CFy0tfAO.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');

package/dist/cjs/components/Switch.js

@@ -84,17 +84,17 @@ var switchAppearanceSize = {
 };
 
 var switchAppearanceStyle = {
-    full: {
+    solid: {
         borderColor: 'none',
     },
-    ghost: {
+    outlined: {
         fill: 'none',
+    },
+    full: {
         borderColor: 'none',
     },
-    outlined: {
+    ghost: {
         fill: 'none',
-    },
-    solid: {
         borderColor: 'none',
     },
 };
@@ -119,20 +119,20 @@ var switchConfig = {
     },
 };
 var Switch = React.forwardRef(function Switch(props, ref) {
-    var id = props.id, className = props.className, appearance = props.appearance, _a = props.align, align = _a === void 0 ? 'left' : _a, title = props.title, desc = props.desc, isDisabled = props.isDisabled, isChecked = props.isChecked, isActive = props.isActive, onChange = props.onChange;
+    var id = props.id, className = props.className, appearance = props.appearance, _a = props.align, align = _a === void 0 ? 'left' : _a, title = props.title, desc = props.desc, isDisabled = props.isDisabled, isActive = props.isActive, onChange = props.onChange;
     var appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, switchConfig);
     var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     var size = propsGenerator.size, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, fillToggleActiveClass = propsGenerator.fillToggleActiveClass, fillToggleActiveHoverClass = propsGenerator.fillToggleActiveHoverClass, fillToggleClass = propsGenerator.fillToggleClass, fillToggleHoverClass = propsGenerator.fillToggleHoverClass, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, descTextColor = propsGenerator.descTextColor, descTextSize = propsGenerator.descTextSize;
-    return (jsxRuntime.jsxs("div", { className: clsx('switch', className, align && "switch_align_".concat(align), size && "switch_size_".concat(size)), children: [title && (jsxRuntime.jsx(Text.Text, { className: clsx('switch__title'), size: titleTextSize, textColor: titleTextColor, children: title })), desc && (jsxRuntime.jsx(Text.Text, { className: clsx('switch__desc'), size: descTextSize, textColor: descTextColor, children: desc })), jsxRuntime.jsxs("div", { className: 'switch__item', children: [jsxRuntime.jsx("input", { id: id, className: "switch__checkbox", type: "checkbox", disabled: isDisabled && 'disabled', checked: (isActive || isChecked) && 'checked', 
+    return (jsxRuntime.jsxs("div", { className: clsx('switch', className, align && "switch_align_".concat(align), size && "switch_size_".concat(size)), children: [jsxRuntime.jsxs("div", { className: "switch__wrapper", children: [title && (jsxRuntime.jsx(Text.Text, { className: clsx('switch__title'), size: titleTextSize, textColor: titleTextColor, children: title })), desc && (jsxRuntime.jsx(Text.Text, { className: clsx('switch__desc'), size: descTextSize, textColor: descTextColor, children: desc }))] }), jsxRuntime.jsxs("div", { className: 'switch__item', children: [jsxRuntime.jsx("input", { id: id, className: "switch__checkbox", type: "checkbox", 
                         // @ts-expect-error
-                        ref: ref, onChange: onChange }), jsxRuntime.jsx("div", { className: clsx('switch__bg', !isActive || !isChecked
+                        ref: ref, disabled: isDisabled && 'disabled', checked: isActive && 'checked', onChange: onChange }), jsxRuntime.jsx("div", { className: clsx('switch__bg', !isActive
                             ? fillClass && "fill_".concat(fillClass)
-                            : fillActiveClass && "fill_active_".concat(fillActiveClass), !isActive || !isChecked
+                            : fillActiveClass && "fill_active_".concat(fillActiveClass), !isActive
                             ? fillHoverClass && "fill_hover_".concat(fillHoverClass)
                             : fillActiveHoverClass &&
-                                "fill_active_hover_".concat(fillActiveHoverClass)), children: "\u00A0" }), jsxRuntime.jsx("div", { className: clsx('switch__toggle', !isActive || !isChecked
+                                "fill_active_hover_".concat(fillActiveHoverClass)), children: "\u00A0" }), jsxRuntime.jsx("div", { className: clsx('switch__toggle', !isActive
                             ? fillToggleClass && "fill_".concat(fillToggleClass)
-                            : fillToggleActiveClass && "fill_active_".concat(fillToggleActiveClass), !isActive || !isChecked
+                            : fillToggleActiveClass && "fill_active_".concat(fillToggleActiveClass), !isActive
                             ? fillToggleHoverClass && "fill_hover_".concat(fillToggleHoverClass)
                             : fillToggleActiveHoverClass &&
                                 "fill_active_hover_".concat(fillToggleActiveHoverClass)), children: "\u00A0" })] })] }));

package/dist/components/Checkbox.js

@@ -82,13 +82,17 @@ var checkboxAppearanceError = {
 
 var checkboxAppearanceRequire = {
     requirePrimary: {
-        fill: 'warningTertiary',
-        borderColor: 'warningBorderQuaternary',
-        borderHover: 'warningBorderQuaternary',
-        textColor: 'surfaceTextPrimary',
-        iconBeforeFill: 'warningItemQuaternary',
-        iconClearFill: 'warningItemPrimary',
-        placeholderTextColor: 'surfaceTextQuaternary',
+        fillCheckbox: 'warningPrimary',
+        fillCheckboxActive: 'warningPrimary',
+        fillCheckboxActiveHover: 'warningTertiary',
+        fillCheckboxHover: 'warningTertiary',
+        fillCheckmark: 'warningBorderPrimary',
+        labelTextColor: 'surfaceTextPrimary',
+        descTextColor: 'surfaceTextPrimary',
+        borderColorCheckbox: 'warningBorderPrimary',
+        borderColorCheckboxActive: 'warningBorderPrimary',
+        borderColorCheckboxActiveHover: 'warningBorderPrimary',
+        borderColorCheckboxHover: 'warningBorderPrimary',
     },
     requireSecondary: {
         fill: 'surfaceSecondary',
@@ -136,21 +140,25 @@ var checkboxAppearanceStyle = {
 
 var checkboxAppearanceSuccess = {
     successPrimary: {
-        fill: 'successTertiary',
-        borderColor: 'successBorderQuaternary',
+        fillCheckbox: 'successPrimary',
+        fillCheckboxActive: 'successPrimary',
+        fillCheckboxActiveHover: 'successTertiary',
+        fillCheckboxHover: 'successTertiary',
+        fillCheckmark: 'successBorderPrimary',
+        labelTextColor: 'surfaceTextPrimary',
+        descTextColor: 'surfaceTextPrimary',
+        borderColorCheckbox: 'successBorderPrimary',
+        borderColorCheckboxActive: 'successBorderPrimary',
+        borderColorCheckboxActiveHover: 'successBorderPrimary',
+        borderColorCheckboxHover: 'successBorderPrimary',
+    },
+    successSecondary: {
+        fill: 'successSecondary',
+        borderColor: 'successBorderTertiary',
         borderHover: 'successBorderQuaternary',
-        textColor: 'surfaceTextPrimary',
         iconBeforeFill: 'successItemQuaternary',
         iconClearFill: 'successItemPrimary',
-        placeholderTextColor: 'surfaceTextQuaternary',
-    },
-    successSecondary: {
-        fill: 'surfaceSecondary',
-        borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
-        iconBeforeFill: 'surfaceItemQuaternary',
-        iconClearFill: 'surfaceItemPrimary',
-        placeholderTextColor: 'surfaceTextSecondary',
+        placeholderTextColor: 'successTextSecondary',
     },
 };
 

package/dist/components/Dadata.js

@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
 import { useMemo } from 'react';
 import clsx from 'clsx';
 import { PartySuggestions } from 'react-dadata';
-import { I as Input } from '../Input_es_3C_YhQFo.js';
+import { I as Input } from '../Input_es_l3ry6luZ.js';
 import '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import 'lodash/camelCase';

package/dist/components/DatePeriod.js

@@ -2,7 +2,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { useCallback } from 'react';
 import clsx from 'clsx';
 import { DATE_PERIOD_INTERVALS } from '@itcase/common';
-import { D as DatePickerInput } from '../DatePicker_es_tuBcfK5V.js';
+import { D as DatePickerInput } from '../DatePicker_es_C1ykgFhq.js';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { b as ChipsGroup, C as Chips } from '../ChipsGroup_es_BcYHhSiE.js';
@@ -28,7 +28,7 @@ import '../context/UrlAssetPrefix.js';
 import '../Link_es_BnUIX0QT.js';
 import '../Text_es_BvmOR4nv.js';
 import '../Loader_es_DhNCKZ8Y.js';
-import '../Input_es_3C_YhQFo.js';
+import '../Input_es_l3ry6luZ.js';
 import '../Label_es_Bfi00e0G.js';
 import '@itcase/icons/default';
 import 'lodash/castArray';

package/dist/components/DatePicker.js

@@ -1,4 +1,4 @@
-export { D as DatePickerInput, a as datePickerAppearance, d as datePickerConfig } from '../DatePicker_es_tuBcfK5V.js';
+export { D as DatePickerInput, a as datePickerAppearance, d as datePickerConfig } from '../DatePicker_es_C1ykgFhq.js';
 import '../tslib.es6_es_Bwu1Cn-t.js';
 import 'react/jsx-runtime';
 import 'react';
@@ -28,6 +28,6 @@ import '../context/UrlAssetPrefix.js';
 import '../Link_es_BnUIX0QT.js';
 import '../Text_es_BvmOR4nv.js';
 import '../Loader_es_DhNCKZ8Y.js';
-import '../Input_es_3C_YhQFo.js';
+import '../Input_es_l3ry6luZ.js';
 import '../Label_es_Bfi00e0G.js';
 import '@itcase/icons/default';

package/dist/components/Input.js

@@ -1,4 +1,4 @@
-export { I as Input, a as inputAppearance, i as inputConfig } from '../Input_es_3C_YhQFo.js';
+export { I as Input, a as inputAppearance, i as inputConfig } from '../Input_es_l3ry6luZ.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';

package/dist/components/Switch.js

@@ -82,17 +82,17 @@ var switchAppearanceSize = {
 };
 
 var switchAppearanceStyle = {
-    full: {
+    solid: {
         borderColor: 'none',
     },
-    ghost: {
+    outlined: {
         fill: 'none',
+    },
+    full: {
         borderColor: 'none',
     },
-    outlined: {
+    ghost: {
         fill: 'none',
-    },
-    solid: {
         borderColor: 'none',
     },
 };
@@ -117,20 +117,20 @@ var switchConfig = {
     },
 };
 var Switch = React.forwardRef(function Switch(props, ref) {
-    var id = props.id, className = props.className, appearance = props.appearance, _a = props.align, align = _a === void 0 ? 'left' : _a, title = props.title, desc = props.desc, isDisabled = props.isDisabled, isChecked = props.isChecked, isActive = props.isActive, onChange = props.onChange;
+    var id = props.id, className = props.className, appearance = props.appearance, _a = props.align, align = _a === void 0 ? 'left' : _a, title = props.title, desc = props.desc, isDisabled = props.isDisabled, isActive = props.isActive, onChange = props.onChange;
     var appearanceConfig = useAppearanceConfig(appearance, switchConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var size = propsGenerator.size, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, fillToggleActiveClass = propsGenerator.fillToggleActiveClass, fillToggleActiveHoverClass = propsGenerator.fillToggleActiveHoverClass, fillToggleClass = propsGenerator.fillToggleClass, fillToggleHoverClass = propsGenerator.fillToggleHoverClass, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, descTextColor = propsGenerator.descTextColor, descTextSize = propsGenerator.descTextSize;
-    return (jsxs("div", { className: clsx('switch', className, align && "switch_align_".concat(align), size && "switch_size_".concat(size)), children: [title && (jsx(Text, { className: clsx('switch__title'), size: titleTextSize, textColor: titleTextColor, children: title })), desc && (jsx(Text, { className: clsx('switch__desc'), size: descTextSize, textColor: descTextColor, children: desc })), jsxs("div", { className: 'switch__item', children: [jsx("input", { id: id, className: "switch__checkbox", type: "checkbox", disabled: isDisabled && 'disabled', checked: (isActive || isChecked) && 'checked', 
+    return (jsxs("div", { className: clsx('switch', className, align && "switch_align_".concat(align), size && "switch_size_".concat(size)), children: [jsxs("div", { className: "switch__wrapper", children: [title && (jsx(Text, { className: clsx('switch__title'), size: titleTextSize, textColor: titleTextColor, children: title })), desc && (jsx(Text, { className: clsx('switch__desc'), size: descTextSize, textColor: descTextColor, children: desc }))] }), jsxs("div", { className: 'switch__item', children: [jsx("input", { id: id, className: "switch__checkbox", type: "checkbox", 
                         // @ts-expect-error
-                        ref: ref, onChange: onChange }), jsx("div", { className: clsx('switch__bg', !isActive || !isChecked
+                        ref: ref, disabled: isDisabled && 'disabled', checked: isActive && 'checked', onChange: onChange }), jsx("div", { className: clsx('switch__bg', !isActive
                             ? fillClass && "fill_".concat(fillClass)
-                            : fillActiveClass && "fill_active_".concat(fillActiveClass), !isActive || !isChecked
+                            : fillActiveClass && "fill_active_".concat(fillActiveClass), !isActive
                             ? fillHoverClass && "fill_hover_".concat(fillHoverClass)
                             : fillActiveHoverClass &&
-                                "fill_active_hover_".concat(fillActiveHoverClass)), children: "\u00A0" }), jsx("div", { className: clsx('switch__toggle', !isActive || !isChecked
+                                "fill_active_hover_".concat(fillActiveHoverClass)), children: "\u00A0" }), jsx("div", { className: clsx('switch__toggle', !isActive
                             ? fillToggleClass && "fill_".concat(fillToggleClass)
-                            : fillToggleActiveClass && "fill_active_".concat(fillToggleActiveClass), !isActive || !isChecked
+                            : fillToggleActiveClass && "fill_active_".concat(fillToggleActiveClass), !isActive
                             ? fillToggleHoverClass && "fill_hover_".concat(fillToggleHoverClass)
                             : fillToggleActiveHoverClass &&
                                 "fill_active_hover_".concat(fillToggleActiveHoverClass)), children: "\u00A0" })] })] }));

package/dist/css/components/Code/Code.css

@@ -1,4 +1,5 @@
 .code {
+  width: 100%;
   &__wrapper {
     width: 100%;
     display: flex;
@@ -14,7 +15,7 @@
 }
 .code__input {
   &_size {
-    @each $size in l, m {
+    @each $size in xl, l, m, s {
       &_$(size) {
         min-width: var(--code-input-size-$(size)-width);
         min-height: var(--code-input-size-$(size)-height);

package/dist/css/components/Switch/Switch.css

@@ -1,22 +1,24 @@
 .switch {
-  display: grid;
-  &__title {
-    padding: 0 8px 0 0;
-    align-self: start;
-  }
-  &__desc {
-    padding: 0 8px 0 0;
-    align-self: start;
+  display: flex;
+  flex-direction: row;
+  &__wrapper {
+    display: flex;
+    flex: 1;
+    align-items: center;
+    ^&__title {
+      padding: 0 8px 0 0;
+    }
+    ^&__desc {
+      padding: 0 8px 0 0;
+    }
   }
   &__item {
     border-radius: 50px;
     position: relative;
     overflow: hidden;
     display: flex;
-    align-self: start;
     transition: 0.4s;
     cursor: pointer;
-    grid-row: 1/3;
   }
   &__checkbox {
     width: 100%;
@@ -30,11 +32,7 @@
     cursor: pointer;
     appearance: none;
     &:checked {
-      & + .switch__bg {
-        /* background: var(--color-accent-fill-primary); */
-      }
       & ~ .switch__toggle {
-        /* background: var(--color-accent-item-primary); */
         margin: 0 0 0 -3px;
         left: 100%;
         transform: translate(-100%, -50%);
@@ -47,7 +45,6 @@
     }
   }
   &__bg {
-    /* background: var(--color-surface-tertiary); */
     width: 100%;
     flex: 1;
     transition: all 0.25s;
@@ -55,8 +52,6 @@
   &__toggle {
     height: calc(100% - 6px);
     aspect-ratio: 1/1;
-
-    /* background: #fff; */
     border-radius: 50%;
     position: absolute;
     box-shadow: inset 0 0 5px rgb(0, 0, 0, 0.2);
@@ -70,26 +65,20 @@
 .switch {
   &_align {
     &_left {
-      grid-template-columns: 1fr auto;
+      width: 100%;
+      flex-direction: row-reverse;
       ^^&__title,
       ^^&__desc {
-        grid-column-start: 2;
         padding: 0 0 0 8px;
       }
-      ^^&__item {
-        grid-column-start: 1;
-      }
     }
     &_right {
-      grid-template-columns: auto 1fr;
+      width: 100%;
+      flex-direction: row;
       ^^&__title,
       ^^&__desc {
-        grid-column-start: 1;
         padding: 0 8px 0 0;
       }
-      ^^&__item {
-        grid-column-start: 2;
-      }
     }
   }
 }

package/dist/types/components/Checkbox/appearance/checkboxRequire.d.ts

@@ -1,12 +1,16 @@
 declare const checkboxAppearanceRequire: {
     requirePrimary: {
-        fill: string;
-        borderColor: string;
-        borderHover: string;
-        textColor: string;
-        iconBeforeFill: string;
-        iconClearFill: string;
-        placeholderTextColor: string;
+        fillCheckbox: string;
+        fillCheckboxActive: string;
+        fillCheckboxActiveHover: string;
+        fillCheckboxHover: string;
+        fillCheckmark: string;
+        labelTextColor: string;
+        descTextColor: string;
+        borderColorCheckbox: string;
+        borderColorCheckboxActive: string;
+        borderColorCheckboxActiveHover: string;
+        borderColorCheckboxHover: string;
     };
     requireSecondary: {
         fill: string;

package/dist/types/components/Checkbox/appearance/checkboxSuccess.d.ts

@@ -1,12 +1,16 @@
 declare const checkboxAppearanceSuccess: {
     successPrimary: {
-        fill: string;
-        borderColor: string;
-        borderHover: string;
-        textColor: string;
-        iconBeforeFill: string;
-        iconClearFill: string;
-        placeholderTextColor: string;
+        fillCheckbox: string;
+        fillCheckboxActive: string;
+        fillCheckboxActiveHover: string;
+        fillCheckboxHover: string;
+        fillCheckmark: string;
+        labelTextColor: string;
+        descTextColor: string;
+        borderColorCheckbox: string;
+        borderColorCheckboxActive: string;
+        borderColorCheckboxActiveHover: string;
+        borderColorCheckboxHover: string;
     };
     successSecondary: {
         fill: string;

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

@@ -4,6 +4,7 @@ declare const inputAppearanceError: {
         borderColor: string;
         borderColorHover: string;
         textColor: string;
+        caret: string;
         iconBeforeFill: string;
         iconClearFill: string;
         placeholderTextColor: string;
@@ -12,6 +13,7 @@ declare const inputAppearanceError: {
         fill: string;
         borderColor: string;
         borderColorHover: string;
+        caret: string;
         iconBeforeFill: string;
         iconClearFill: string;
         placeholderTextColor: string;

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

@@ -4,6 +4,7 @@ declare const inputAppearanceRequire: {
         borderColor: string;
         borderColorHover: string;
         textColor: string;
+        caret: string;
         iconBeforeFill: string;
         iconClearFill: string;
         placeholderTextColor: string;
@@ -12,6 +13,7 @@ declare const inputAppearanceRequire: {
         fill: string;
         borderColor: string;
         borderColorHover: string;
+        caret: string;
         iconBeforeFill: string;
         iconClearFill: string;
         placeholderTextColor: string;

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

@@ -4,6 +4,7 @@ declare const inputAppearanceSuccess: {
         borderColor: string;
         borderColorHover: string;
         textColor: string;
+        caret: string;
         iconBeforeFill: string;
         iconClearFill: string;
         placeholderTextColor: string;
@@ -12,6 +13,7 @@ declare const inputAppearanceSuccess: {
         fill: string;
         borderColor: string;
         borderColorHover: string;
+        caret: string;
         iconBeforeFill: string;
         iconClearFill: string;
         placeholderTextColor: string;

package/dist/types/components/Switch/appearance/switchStyle.d.ts

@@ -1,15 +1,15 @@
 declare const switchAppearanceStyle: {
-    full: {
+    solid: {
         borderColor: string;
     };
-    ghost: {
+    outlined: {
         fill: string;
+    };
+    full: {
         borderColor: string;
     };
-    outlined: {
+    ghost: {
         fill: string;
-    };
-    solid: {
         borderColor: string;
     };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.8.85",
+  "version": "1.8.87",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",
@@ -103,7 +103,7 @@
     "@emotion/is-prop-valid": "^1.3.1",
     "@itcase/common": "^1.2.28",
     "@itcase/icons": "^1.2.16",
-    "@itcase/storybook-config": "^1.1.76",
+    "@itcase/storybook-config": "^1.1.77",
     "@itcase/tokens-am": "^1.1.19",
     "@itcase/tokens-baikal": "^1.1.17",
     "@itcase/tokens-palette": "^1.1.11",