@alfalab/core-components 42.15.0 → 42.15.1

package/indicator/modern/index.css

@@ -25,7 +25,7 @@
     --gap-m: 16px;
 } :root {
 } :root {
-} .indicator__component_12l1l {
+} .indicator__component_f63wu {
     position: relative;
     display: inline-flex;
     justify-content: center;
@@ -35,54 +35,54 @@
     border-radius: var(--border-radius-pill);
     color: var(--color-static-text-primary-light);
     background-color: var(--color-light-bg-accent);
-} .indicator__red_12l1l {
+} .indicator__red_f63wu {
     background-color: var(--color-light-bg-accent);
     color: var(--color-static-text-primary-light)
-} .indicator__red_12l1l.indicator__border_12l1l {
+} .indicator__red_f63wu.indicator__border_f63wu {
         outline: 2px solid var(--color-light-border-key-inverted);
-    } .indicator__white_12l1l {
+    } .indicator__white_f63wu {
     background-color: var(--color-light-bg-primary);
     color: var(--color-light-text-primary)
-} .indicator__white_12l1l.indicator__border_12l1l {
+} .indicator__white_f63wu.indicator__border_f63wu {
         outline: 2px solid var(--color-light-border-key-inverted);
-    } .indicator__grey_12l1l {
+    } .indicator__grey_f63wu {
     background-color: var(--color-light-specialbg-secondary-transparent);
     color: var(--color-light-text-primary)
-} .indicator__grey_12l1l.indicator__border_12l1l {
+} .indicator__grey_f63wu.indicator__border_f63wu {
         outline: 2px solid var(--color-light-border-key-inverted);
-    } .indicator__xs_12l1l {
+    } .indicator__xs_f63wu {
     height: 8px;
     min-width: 8px;
-} .indicator__s_12l1l {
+} .indicator__s_f63wu {
     height: 20px;
     min-width: 20px
-} .indicator__s_12l1l .indicator__content_12l1l {
+} .indicator__s_f63wu .indicator__content_f63wu {
         font-size: 11px;
         line-height: 16px;
         font-weight: 700;
         padding: 0 var(--gap-2xs);
-    } .indicator__m_12l1l {
+    } .indicator__m_f63wu {
     height: 24px;
     min-width: 24px
-} .indicator__m_12l1l .indicator__content_12l1l {
+} .indicator__m_f63wu .indicator__content_f63wu {
         font-size: 14px;
         line-height: 20px;
         font-weight: 700;
         padding: 0 var(--gap-2xs);
-    } .indicator__l_12l1l {
+    } .indicator__l_f63wu {
     height: 40px;
     min-width: 40px
-} .indicator__l_12l1l .indicator__content_12l1l {
+} .indicator__l_f63wu .indicator__content_f63wu {
         font-size: 14px;
         line-height: 20px;
         font-weight: 700;
         padding: 0 var(--gap-xs);
-    } .indicator__xl_12l1l .indicator__content_12l1l {
+    } .indicator__xl_f63wu .indicator__content_f63wu {
         font-size: 16px;
         line-height: 24px;
         font-weight: 700;
         padding: 0 var(--gap-s);
-    } .indicator__xxl_12l1l .indicator__content_12l1l {
+    } .indicator__xxl_f63wu .indicator__content_f63wu {
         font-size: 16px;
         line-height: 24px;
         font-weight: 700;

package/input/Component.responsive.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 var coreComponentsMq = require('../mq');
-var Component_desktop = require('./Component.desktop.js');
-var Component_mobile = require('./Component.mobile.js');
+var desktop_Component_desktop = require('./desktop/Component.desktop.js');
+var mobile_Component_mobile = require('./mobile/Component.mobile.js');
 require('../form-control/desktop');
 require('./components/base-input/Component.js');
 require('react-merge-refs');
@@ -26,7 +26,7 @@ var Input = React.forwardRef(function (_a, ref) {
     var _b = _a.breakpoint, breakpoint = _b === void 0 ? 1024 : _b, defaultMatchMediaValue = _a.defaultMatchMediaValue, restProps = tslib.__rest(_a, ["breakpoint", "defaultMatchMediaValue"]);
     var query = "(min-width: ".concat(breakpoint, "px)");
     var isDesktop = coreComponentsMq.useMatchMedia(query, defaultMatchMediaValue)[0];
-    var Component = isDesktop ? Component_desktop.InputDesktop : Component_mobile.InputMobile;
+    var Component = isDesktop ? desktop_Component_desktop.InputDesktop : mobile_Component_mobile.InputMobile;
     return React__default.default.createElement(Component, tslib.__assign({ ref: ref }, restProps));
 });
 

package/input/components/base-input/Component.d.ts

@@ -150,7 +150,7 @@ type BaseInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type
      */
     disableUserInput?: boolean;
 };
-declare const BaseInput: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "value" | "size" | "defaultValue" | "onChange" | "onClick" | "onMouseDown" | "type" | "enterKeyHint"> & {
+declare const BaseInput: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "value" | "type" | "defaultValue" | "onChange" | "onClick" | "onMouseDown" | "enterKeyHint"> & {
     /**
      * Значение поля ввода
      */

package/input/components/base-input/Component.js

@@ -18,13 +18,13 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var defaultColors = {"input":"input__input_1lq8w","hasInnerLabel":"input__hasInnerLabel_1lq8w","clearIcon":"input__clearIcon_1lq8w","disableUserInput":"input__disableUserInput_1lq8w"};
+var defaultColors = {"input":"input__input_mkxfq","hasInnerLabel":"input__hasInnerLabel_mkxfq","clearIcon":"input__clearIcon_mkxfq","disableUserInput":"input__disableUserInput_mkxfq"};
 require('./default.css');
 
-var styles = {"input":"input__input_1agsq","hasInnerLabel":"input__hasInnerLabel_1agsq","s":"input__s_1agsq","m":"input__m_1agsq","l":"input__l_1agsq","xl":"input__xl_1agsq","block":"input__block_1agsq","clearIcon":"input__clearIcon_1agsq","errorIcon":"input__errorIcon_1agsq","errorColorIcon":"input__errorColorIcon_1agsq","clearButton":"input__clearButton_1agsq","successIcon":"input__successIcon_1agsq","successColorIcon":"input__successColorIcon_1agsq","focusVisible":"input__focusVisible_1agsq","onautofillstart":"input__onautofillstart_1agsq","onautofillcancel":"input__onautofillcancel_1agsq"};
+var styles = {"input":"input__input_qp1jj","hasInnerLabel":"input__hasInnerLabel_qp1jj","s":"input__s_qp1jj","m":"input__m_qp1jj","l":"input__l_qp1jj","xl":"input__xl_qp1jj","block":"input__block_qp1jj","clearIcon":"input__clearIcon_qp1jj","errorIcon":"input__errorIcon_qp1jj","errorColorIcon":"input__errorColorIcon_qp1jj","clearButton":"input__clearButton_qp1jj","successIcon":"input__successIcon_qp1jj","successColorIcon":"input__successColorIcon_qp1jj","focusVisible":"input__focusVisible_qp1jj","onautofillstart":"input__onautofillstart_qp1jj","onautofillcancel":"input__onautofillcancel_qp1jj"};
 require('./index.css');
 
-var invertedColors = {"input":"input__input_1ezua","hasInnerLabel":"input__hasInnerLabel_1ezua","clearIcon":"input__clearIcon_1ezua","disableUserInput":"input__disableUserInput_1ezua"};
+var invertedColors = {"input":"input__input_fuitm","hasInnerLabel":"input__hasInnerLabel_fuitm","clearIcon":"input__clearIcon_fuitm","disableUserInput":"input__disableUserInput_fuitm"};
 require('./inverted.css');
 
 var colorCommonStyles = {

package/input/components/base-input/default.css

@@ -38,25 +38,25 @@
     /* управляет видимостью иконки ошибки, если она стоит рядом с другой иконкой */
 
     /* mobile */
-} .input__input_1lq8w {
+} .input__input_mkxfq {
     color: var(--input-color);
     caret-color: var(--input-caret-color);
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-} .input__input_1lq8w:-webkit-autofill {
+} .input__input_mkxfq:-webkit-autofill {
     -webkit-text-fill-color: var(--input-color);
-} .input__input_1lq8w::placeholder {
+} .input__input_mkxfq::placeholder {
     color: var(--input-placeholder-color);
-} .input__hasInnerLabel_1lq8w::placeholder {
+} .input__hasInnerLabel_mkxfq::placeholder {
     color: var(--input-with-label-placeholder-color);
-} .input__clearIcon_1lq8w {
+} .input__clearIcon_mkxfq {
     color: var(--color-light-graphic-primary);
-} /* READ-ONLY STATE */ .input__input_1lq8w:read-only:not(.input__disableUserInput_1lq8w) {
+} /* READ-ONLY STATE */ .input__input_mkxfq:read-only:not(.input__disableUserInput_mkxfq) {
     color: var(--input-read-only-color)
-} .input__input_1lq8w:read-only:not(.input__disableUserInput_1lq8w):focus::placeholder {
+} .input__input_mkxfq:read-only:not(.input__disableUserInput_mkxfq):focus::placeholder {
         color: var(--input-placeholder-color);
-    } /* DISABLED STATE */ .input__input_1lq8w:disabled {
+    } /* DISABLED STATE */ .input__input_mkxfq:disabled {
     color: var(--input-disabled-color);
     -webkit-text-fill-color: var(--input-disabled-color);
-} /* FOCUS STATE */ .input__input_1lq8w:focus::placeholder {
+} /* FOCUS STATE */ .input__input_mkxfq:focus::placeholder {
     color: var(--input-focus-placeholder-color);
 }

package/input/components/base-input/index.css

@@ -83,7 +83,7 @@
     --input-error-icon-not-alone-display: none;
 
     /* mobile */
-} .input__input_1agsq {
+} .input__input_qp1jj {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -98,98 +98,98 @@
     text-overflow: ellipsis;
     box-sizing: border-box;
     -webkit-appearance: none;
-} .input__input_1agsq::placeholder {
+} .input__input_qp1jj::placeholder {
     transition: opacity 0.2s ease, color 0.2s ease;
-} .input__hasInnerLabel_1agsq::placeholder {
+} .input__hasInnerLabel_qp1jj::placeholder {
         opacity: 0;
-    } .input__hasInnerLabel_1agsq.input__s_1agsq {
+    } .input__hasInnerLabel_qp1jj.input__s_qp1jj {
         height: var(--form-control-s-min-height);
-    } .input__hasInnerLabel_1agsq.input__m_1agsq {
+    } .input__hasInnerLabel_qp1jj.input__m_qp1jj {
         height: var(--form-control-m-min-height);
-    } .input__hasInnerLabel_1agsq.input__l_1agsq {
+    } .input__hasInnerLabel_qp1jj.input__l_qp1jj {
         height: var(--form-control-l-min-height);
-    } .input__hasInnerLabel_1agsq.input__xl_1agsq {
+    } .input__hasInnerLabel_qp1jj.input__xl_qp1jj {
         height: var(--form-control-xl-min-height);
-    } .input__block_1agsq {
+    } .input__block_qp1jj {
     width: 100%;
-} .input__clearIcon_1agsq {
+} .input__clearIcon_qp1jj {
     display: block;
     opacity: 0.3;
     transition: opacity 0.2s ease
-} .input__clearIcon_1agsq:hover {
+} .input__clearIcon_qp1jj:hover {
         opacity: 0.6;
-    } .input__clearIcon_1agsq:active {
+    } .input__clearIcon_qp1jj:active {
         opacity: 1;
-    } .input__errorIcon_1agsq {
+    } .input__errorIcon_qp1jj {
     display: var(--input-error-icon-display)
-} .input__errorIcon_1agsq:not(:only-child) {
+} .input__errorIcon_qp1jj:not(:only-child) {
         margin-left: var(--gap-2xs);
-    } * + .input__errorIcon_1agsq {
+    } * + .input__errorIcon_qp1jj {
     display: var(--input-error-icon-not-alone-display);
-} button[class*='eye'] + .input__errorIcon_1agsq {
+} button[class*='eye'] + .input__errorIcon_qp1jj {
     margin-right: var(--gap-s);
-} .input__errorColorIcon_1agsq {
+} .input__errorColorIcon_qp1jj {
     color: var(--color-light-graphic-negative);
-} .input__clearButton_1agsq + * {
+} .input__clearButton_qp1jj + * {
     margin-left: var(--gap-2xs);
-} .input__clearButton_1agsq + .input__errorIcon_1agsq {
+} .input__clearButton_qp1jj + .input__errorIcon_qp1jj {
     display: var(--input-error-icon-display);
-} .input__successIcon_1agsq {
+} .input__successIcon_qp1jj {
     display: var(--input-success-icon-display)
-} .input__successIcon_1agsq:not(:only-child) {
+} .input__successIcon_qp1jj:not(:only-child) {
         margin-left: var(--gap-2xs);
-    } button[class*='eye'] + .input__successIcon_1agsq {
+    } button[class*='eye'] + .input__successIcon_qp1jj {
     margin-right: var(--gap-s);
-} .input__successColorIcon_1agsq {
+} .input__successColorIcon_qp1jj {
     color: var(--color-light-graphic-positive);
-} /* DISABLED STATE */ .input__input_1agsq:disabled {
+} /* DISABLED STATE */ .input__input_qp1jj:disabled {
     cursor: var(--disabled-cursor);
     opacity: 1;
-} /* FOCUS STATE */ .input__input_1agsq:focus.input__hasInnerLabel_1agsq::placeholder {
+} /* FOCUS STATE */ .input__input_qp1jj:focus.input__hasInnerLabel_qp1jj::placeholder {
     opacity: 1;
-} .input__focusVisible_1agsq {
+} .input__focusVisible_qp1jj {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
-} /* READ-ONLY STATE */ .input__hasInnerLabel_1agsq:read-only:focus::placeholder {
+} /* READ-ONLY STATE */ .input__hasInnerLabel_qp1jj:read-only:focus::placeholder {
     opacity: 0;
-} /* IE hide clear */ .input__input_1agsq::-ms-clear {
+} /* IE hide clear */ .input__input_qp1jj::-ms-clear {
     display: none;
     width: 0;
     height: 0;
-} /* Убирает синюю заливку при автокомплите */ .input__input_1agsq:-webkit-autofill:first-line, .input__input_1agsq:-webkit-autofill:hover:first-line, .input__input_1agsq:-webkit-autofill:focus:first-line, .input__input_1agsq:-webkit-autofill:active:first-line {
+} /* Убирает синюю заливку при автокомплите */ .input__input_qp1jj:-webkit-autofill:first-line, .input__input_qp1jj:-webkit-autofill:hover:first-line, .input__input_qp1jj:-webkit-autofill:focus:first-line, .input__input_qp1jj:-webkit-autofill:active:first-line {
             font-size: 16px;
             line-height: 20px;
             font-weight: 400;
             font-family: var(--form-control-font-family);
-        } .input__input_1agsq:-webkit-autofill,
-    .input__input_1agsq:-webkit-autofill:hover,
-    .input__input_1agsq:-webkit-autofill:focus,
-    .input__input_1agsq:-webkit-autofill:active {
+        } .input__input_qp1jj:-webkit-autofill,
+    .input__input_qp1jj:-webkit-autofill:hover,
+    .input__input_qp1jj:-webkit-autofill:focus,
+    .input__input_qp1jj:-webkit-autofill:active {
 
         /* Hack from http://stackoverflow.com/a/29350537 */
         -webkit-transition: background-color 999999s ease-in-out 0s;
         transition: background-color 999999s ease-in-out 0s;
-    } .input__input_1agsq:-webkit-autofill {
-        animation: input__onautofillstart_1agsq 999999s forwards;
-    } .input__input_1agsq:not(:-webkit-autofill) {
+    } .input__input_qp1jj:-webkit-autofill {
+        animation: input__onautofillstart_qp1jj 999999s forwards;
+    } .input__input_qp1jj:not(:-webkit-autofill) {
         /* Позволяет отслеживать autofill через js */
-        animation: input__onautofillcancel_1agsq 999999s;
-    } /* Убирает нативные стрелочки при type=number */ .input__input_1agsq::-webkit-outer-spin-button,
-    .input__input_1agsq::-webkit-inner-spin-button {
+        animation: input__onautofillcancel_qp1jj 999999s;
+    } /* Убирает нативные стрелочки при type=number */ .input__input_qp1jj::-webkit-outer-spin-button,
+    .input__input_qp1jj::-webkit-inner-spin-button {
         -webkit-appearance: none;
-    } .input__input_1agsq {
+    } .input__input_qp1jj {
 
     /* Firefox */
-} .input__input_1agsq[type='number'] {
+} .input__input_qp1jj[type='number'] {
         -moz-appearance: textfield;
-    } @keyframes input__onautofillstart_1agsq {
+    } @keyframes input__onautofillstart_qp1jj {
     from {
         -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
     }
     to {
         -webkit-tap-highlight-color: rgba(0, 0, 0, 0.01);
     }
-} @keyframes input__onautofillcancel_1agsq {
+} @keyframes input__onautofillcancel_qp1jj {
     from {
         -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
     }

package/input/components/base-input/inverted.css

@@ -38,25 +38,25 @@
     /* управляет видимостью иконки ошибки, если она стоит рядом с другой иконкой */
 
     /* mobile */
-} .input__input_1ezua {
+} .input__input_fuitm {
     color: var(--input-inverted-color);
     caret-color: var(--input-inverted-caret-color);
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-} .input__input_1ezua:-webkit-autofill {
+} .input__input_fuitm:-webkit-autofill {
     -webkit-text-fill-color: var(--input-inverted-color);
-} .input__input_1ezua::placeholder {
+} .input__input_fuitm::placeholder {
     color: var(--input-inverted-placeholder-color);
-} .input__hasInnerLabel_1ezua::placeholder {
+} .input__hasInnerLabel_fuitm::placeholder {
     color: var(--input-inverted-with-label-placeholder-color);
-} .input__clearIcon_1ezua {
+} .input__clearIcon_fuitm {
     color: var(--color-light-graphic-primary-inverted);
-} /* READ-ONLY STATE */ .input__input_1ezua:read-only:not(.input__disableUserInput_1ezua) {
+} /* READ-ONLY STATE */ .input__input_fuitm:read-only:not(.input__disableUserInput_fuitm) {
     color: var(--input-inverted-read-only-color)
-} .input__input_1ezua:read-only:not(.input__disableUserInput_1ezua):focus::placeholder {
+} .input__input_fuitm:read-only:not(.input__disableUserInput_fuitm):focus::placeholder {
         color: var(--input-inverted-placeholder-color);
-    } /* DISABLED STATE */ .input__input_1ezua:disabled {
+    } /* DISABLED STATE */ .input__input_fuitm:disabled {
     color: var(--input-inverted-disabled-color);
     -webkit-text-fill-color: var(--input-inverted-disabled-color);
-} /* FOCUS STATE */ .input__input_1ezua:focus::placeholder {
+} /* FOCUS STATE */ .input__input_fuitm:focus::placeholder {
     color: var(--input-inverted-focus-placeholder-color);
 }

package/input/cssm/Component.responsive.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 var coreComponentsMq = require('../../mq/cssm');
-var Component_desktop = require('./Component.desktop.js');
-var Component_mobile = require('./Component.mobile.js');
+var desktop_Component_desktop = require('./desktop/Component.desktop.js');
+var mobile_Component_mobile = require('./mobile/Component.mobile.js');
 require('../../form-control/cssm/desktop');
 require('./components/base-input/Component.js');
 require('react-merge-refs');
@@ -33,7 +33,7 @@ var Input = React.forwardRef(function (_a, ref) {
     var _b = _a.breakpoint, breakpoint = _b === void 0 ? 1024 : _b, defaultMatchMediaValue = _a.defaultMatchMediaValue, restProps = tslib.__rest(_a, ["breakpoint", "defaultMatchMediaValue"]);
     var query = "(min-width: ".concat(breakpoint, "px)");
     var isDesktop = coreComponentsMq.useMatchMedia(query, defaultMatchMediaValue)[0];
-    var Component = isDesktop ? Component_desktop.InputDesktop : Component_mobile.InputMobile;
+    var Component = isDesktop ? desktop_Component_desktop.InputDesktop : mobile_Component_mobile.InputMobile;
     return React__default.default.createElement(Component, tslib.__assign({ ref: ref }, restProps));
 });
 

package/input/cssm/desktop/Component.desktop.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import React from 'react';
+import { BaseInputProps } from "../components/base-input/index";
+type InputDesktopProps = Omit<BaseInputProps, 'FormControlComponent' | 'colorStyles'>;
+declare const InputDesktop: React.ForwardRefExoticComponent<InputDesktopProps & React.RefAttributes<HTMLInputElement>>;
+export { InputDesktopProps, InputDesktop };

package/input/cssm/desktop/Component.desktop.js

@@ -0,0 +1,34 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var desktop = require('../../../form-control/cssm/desktop');
+var components_baseInput_Component = require('../components/base-input/Component.js');
+var defaultColors = require('../default.desktop.module.css');
+var invertedColors = require('../inverted.desktop.module.css');
+require('react-merge-refs');
+require('classnames');
+require('../../../badge/cssm');
+require('../../../button/cssm');
+require('../../../shared/cssm');
+require('@alfalab/hooks');
+require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
+require('@alfalab/icons-glyph/CrossCircleMIcon');
+require('@alfalab/icons-glyph/ExclamationCircleMIcon');
+require('../components/base-input/default.module.css');
+require('../components/base-input/index.module.css');
+require('../components/base-input/inverted.module.css');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var defaultColors__default = /*#__PURE__*/_interopDefaultCompat(defaultColors);
+var invertedColors__default = /*#__PURE__*/_interopDefaultCompat(invertedColors);
+
+var colorStyles = {
+    default: defaultColors__default.default,
+    inverted: invertedColors__default.default,
+};
+var InputDesktop = React.forwardRef(function (restProps, ref) { return (React__default.default.createElement(components_baseInput_Component.BaseInput, tslib.__assign({}, restProps, { FormControlComponent: desktop.FormControlDesktop, ref: ref, colorStyles: colorStyles }))); });
+
+exports.InputDesktop = InputDesktop;

package/input/cssm/desktop/index.d.ts

@@ -1,2 +1,2 @@
-export * from "../Component.desktop";
+export * from "./Component.desktop";
 export {};

package/input/cssm/desktop/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Component_desktop = require('../Component.desktop.js');
+var desktop_Component_desktop = require('./Component.desktop.js');
 require('tslib');
 require('react');
 require('../../../form-control/cssm/desktop');
@@ -22,4 +22,4 @@ require('../inverted.desktop.module.css');
 
 
 
-exports.InputDesktop = Component_desktop.InputDesktop;
+exports.InputDesktop = desktop_Component_desktop.InputDesktop;

package/input/cssm/index.js

@@ -4,7 +4,7 @@ var Component_responsive = require('./Component.responsive.js');
 require('tslib');
 require('react');
 require('../../mq/cssm');
-require('./Component.desktop.js');
+require('./desktop/Component.desktop.js');
 require('../../form-control/cssm/desktop');
 require('./components/base-input/Component.js');
 require('react-merge-refs');
@@ -21,7 +21,7 @@ require('./components/base-input/index.module.css');
 require('./components/base-input/inverted.module.css');
 require('./default.desktop.module.css');
 require('./inverted.desktop.module.css');
-require('./Component.mobile.js');
+require('./mobile/Component.mobile.js');
 require('../../form-control/cssm/mobile');
 require('./default.mobile.module.css');
 require('./inverted.mobile.module.css');

package/input/cssm/mobile/Component.mobile.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import React from 'react';
+import { BaseInputProps } from "../components/base-input/index";
+type InputMobileProps = Omit<BaseInputProps, 'FormControlComponent' | 'colorStyles'>;
+declare const InputMobile: React.ForwardRefExoticComponent<InputMobileProps & React.RefAttributes<HTMLInputElement>>;
+export { InputMobileProps, InputMobile };

package/input/cssm/mobile/Component.mobile.js

@@ -0,0 +1,34 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var mobile = require('../../../form-control/cssm/mobile');
+var components_baseInput_Component = require('../components/base-input/Component.js');
+var defaultColors = require('../default.mobile.module.css');
+var invertedColors = require('../inverted.mobile.module.css');
+require('react-merge-refs');
+require('classnames');
+require('../../../badge/cssm');
+require('../../../button/cssm');
+require('../../../shared/cssm');
+require('@alfalab/hooks');
+require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
+require('@alfalab/icons-glyph/CrossCircleMIcon');
+require('@alfalab/icons-glyph/ExclamationCircleMIcon');
+require('../components/base-input/default.module.css');
+require('../components/base-input/index.module.css');
+require('../components/base-input/inverted.module.css');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var defaultColors__default = /*#__PURE__*/_interopDefaultCompat(defaultColors);
+var invertedColors__default = /*#__PURE__*/_interopDefaultCompat(invertedColors);
+
+var colorStyles = {
+    default: defaultColors__default.default,
+    inverted: invertedColors__default.default,
+};
+var InputMobile = React.forwardRef(function (restProps, ref) { return (React__default.default.createElement(components_baseInput_Component.BaseInput, tslib.__assign({}, restProps, { FormControlComponent: mobile.FormControlMobile, ref: ref, colorStyles: colorStyles }))); });
+
+exports.InputMobile = InputMobile;

package/input/cssm/mobile/index.d.ts

@@ -1,2 +1,2 @@
-export * from "../Component.mobile";
+export * from "./Component.mobile";
 export {};

package/input/cssm/mobile/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Component_mobile = require('../Component.mobile.js');
+var mobile_Component_mobile = require('./Component.mobile.js');
 require('tslib');
 require('react');
 require('../../../form-control/cssm/mobile');
@@ -22,4 +22,4 @@ require('../inverted.mobile.module.css');
 
 
 
-exports.InputMobile = Component_mobile.InputMobile;
+exports.InputMobile = mobile_Component_mobile.InputMobile;

package/input/default.desktop.css

@@ -29,7 +29,7 @@
     /* управляет видимостью иконки ошибки, если она стоит рядом с другой иконкой */
 
     /* mobile */
-} /* ERROR STATE */ .input__error_5z88b {
+} /* ERROR STATE */ .input__error_pqzfg {
     color: var(--input-error-color);
     caret-color: var(--input-error-color);
 }

package/input/default.mobile.css

@@ -29,7 +29,7 @@
 
     /* mobile */
     --input-error-mobile-color: var(--color-light-text-negative);
-} /* ERROR STATE */ .input__error_1hh2k {
+} /* ERROR STATE */ .input__error_ibr37 {
     color: var(--input-error-mobile-color);
     caret-color: var(--input-error-mobile-color);
 }

package/input/desktop/Component.desktop.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import React from 'react';
+import { BaseInputProps } from "../components/base-input/index";
+type InputDesktopProps = Omit<BaseInputProps, 'FormControlComponent' | 'colorStyles'>;
+declare const InputDesktop: React.ForwardRefExoticComponent<InputDesktopProps & React.RefAttributes<HTMLInputElement>>;
+export { InputDesktopProps, InputDesktop };

package/input/desktop/Component.desktop.js

@@ -0,0 +1,33 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var desktop = require('../../form-control/desktop');
+var components_baseInput_Component = require('../components/base-input/Component.js');
+require('react-merge-refs');
+require('classnames');
+require('../../badge');
+require('../../button');
+require('../../shared');
+require('@alfalab/hooks');
+require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
+require('@alfalab/icons-glyph/CrossCircleMIcon');
+require('@alfalab/icons-glyph/ExclamationCircleMIcon');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var defaultColors = {"error":"input__error_pqzfg"};
+require('./../default.desktop.css');
+
+var invertedColors = {"error":"input__error_1d1le"};
+require('./../inverted.desktop.css');
+
+var colorStyles = {
+    default: defaultColors,
+    inverted: invertedColors,
+};
+var InputDesktop = React.forwardRef(function (restProps, ref) { return (React__default.default.createElement(components_baseInput_Component.BaseInput, tslib.__assign({}, restProps, { FormControlComponent: desktop.FormControlDesktop, ref: ref, colorStyles: colorStyles }))); });
+
+exports.InputDesktop = InputDesktop;

package/input/desktop/index.d.ts

@@ -1,2 +1,2 @@
-export * from "../Component.desktop";
+export * from "./Component.desktop";
 export {};

package/input/desktop/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Component_desktop = require('../Component.desktop.js');
+var desktop_Component_desktop = require('./Component.desktop.js');
 require('tslib');
 require('react');
 require('../../form-control/desktop');
@@ -17,4 +17,4 @@ require('@alfalab/icons-glyph/ExclamationCircleMIcon');
 
 
 
-exports.InputDesktop = Component_desktop.InputDesktop;
+exports.InputDesktop = desktop_Component_desktop.InputDesktop;

package/input/esm/Component.responsive.js

@@ -1,8 +1,8 @@
 import { __rest, __assign } from 'tslib';
 import React, { forwardRef } from 'react';
 import { useMatchMedia } from '../../mq/esm';
-import { InputDesktop } from './Component.desktop.js';
-import { InputMobile } from './Component.mobile.js';
+import { InputDesktop } from './desktop/Component.desktop.js';
+import { InputMobile } from './mobile/Component.mobile.js';
 import '../../form-control/esm/desktop';
 import './components/base-input/Component.js';
 import 'react-merge-refs';

package/input/esm/components/base-input/Component.d.ts

@@ -150,7 +150,7 @@ type BaseInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type
      */
     disableUserInput?: boolean;
 };
-declare const BaseInput: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "value" | "size" | "defaultValue" | "onChange" | "onClick" | "onMouseDown" | "type" | "enterKeyHint"> & {
+declare const BaseInput: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "value" | "type" | "defaultValue" | "onChange" | "onClick" | "onMouseDown" | "enterKeyHint"> & {
     /**
      * Значение поля ввода
      */