@alfalab/core-components 48.8.0-beta.0 → 48.8.0

package/universal-date-input/moderncssm/components/date-input/Component.js

@@ -6,6 +6,7 @@ import { Input } from '../../../../input/moderncssm';
 import { Popover } from '../../../../popover/moderncssm';
 import { getDataTestId } from '../../../../shared/moderncssm';
 import { CalendarMIcon } from '@alfalab/icons-glyph/CalendarMIcon';
+import { CalendarSIcon } from '@alfalab/icons-glyph/CalendarSIcon';
 import { DATE_TIME_SEPARATOR, DEFAULT_MIN_DATE, DEFAULT_MAX_DATE, DATE_TIME_FORMAT, DATE_FORMAT } from '../../consts.js';
 import { isValidDate, isCompleteTime, formatDate, isCompleteDate, preventDefault, parseDateString } from '../../utils/index.js';
 import styles from '../../index.module.css';
@@ -117,13 +118,14 @@ const DateInput = forwardRef(({ autoCorrection, open, value: valueProp, inputWra
         }
         return null;
     };
+    const CalendarIcon = restProps.size === 40 ? CalendarSIcon : CalendarMIcon;
     return (React.createElement("div", { ...wrapperHandlers, className: cn(styles.wrapper, wrapperClassName, {
             [styles.block]: block,
         }), tabIndex: -1, "data-test-id": getDataTestId(dataTestId, 'wrapper') },
         React.createElement(Input, { ...restProps, clear: clear && isCompleteDate(inputDate) && isCompleteTime(inputTime, withTime), onClear: valueProp === undefined ? handleClear : onClear, breakpoint: breakpoint, dataTestId: dataTestId, wrapperRef: mergeRefs([inputWrapperRef, inputWrapperRefProp]), ref: mergeRefs([ref, inputRef]), value: inputValue, inputMode: 'decimal', onInput: handleInputChange, onBlur: handleBlur, error: error || getInnerError(), block: true, rightAddons: React.createElement(React.Fragment, null,
                 rightAddons,
-                picker && (React.createElement(CalendarMIcon, { onClick: onPickerClick, className: styles.calendarIcon, onMouseDown: preventDefault }))) }),
-        platform === 'desktop' ? (React.createElement(Popover, { offset: [0, 4], position: 'bottom-start', dataTestId: getDataTestId(dataTestId, 'popover'), ...popoverProps, open: open, anchorElement: inputWrapperRef, popperClassName: cn(styles.calendarContainer, popoverProps?.popperClassName, desktopStyles.calendarContainer), withTransition: false }, renderCalendar())) : (renderCalendar())));
+                picker && (React.createElement(CalendarIcon, { onClick: onPickerClick, className: cn(styles.calendarIcon, styles[`size-${restProps.size}`]), onMouseDown: preventDefault }))) }),
+        platform === 'desktop' ? (React.createElement(Popover, { offset: [0, 4], position: 'bottom-start', dataTestId: getDataTestId(dataTestId, 'popover'), ...popoverProps, open: open, anchorElement: inputWrapperRef.current, popperClassName: cn(styles.calendarContainer, popoverProps?.popperClassName, desktopStyles.calendarContainer), withTransition: false }, renderCalendar())) : (renderCalendar())));
 });
 
 export { DateInput };

package/universal-date-input/moderncssm/components/date-input/index.js

@@ -7,6 +7,7 @@ import '../../../../input/moderncssm';
 import '../../../../popover/moderncssm';
 import '../../../../shared/moderncssm';
 import '@alfalab/icons-glyph/CalendarMIcon';
+import '@alfalab/icons-glyph/CalendarSIcon';
 import '../../consts.js';
 import '../../utils/index.js';
 import 'date-fns/differenceInDays';

package/universal-date-input/moderncssm/components/date-range-input/Component.js

@@ -8,6 +8,7 @@ import { Input } from '../../../../input/moderncssm';
 import { Popover } from '../../../../popover/moderncssm';
 import { getDataTestId } from '../../../../shared/moderncssm';
 import { CalendarMIcon } from '@alfalab/icons-glyph/CalendarMIcon';
+import { CalendarSIcon } from '@alfalab/icons-glyph/CalendarSIcon';
 import { DATE_RANGE_SEPARATOR, DEFAULT_MAX_DATE, DEFAULT_MIN_DATE } from '../../consts.js';
 import { getValidRange, formatDate, formatDateRange, isCompleteDateRange, preventDefault, isCompleteDate, parseDateString, updateRange } from '../../utils/index.js';
 import styles from '../../index.module.css';
@@ -121,13 +122,14 @@ const DateRangeInput = forwardRef(({ autoCorrection, breakpoint, wrapperClassNam
         }
         return null;
     };
+    const CalendarIcon = restProps.size === 40 ? CalendarSIcon : CalendarMIcon;
     return (React.createElement("div", { ...wrapperHandlers, className: cn(styles.wrapper, wrapperClassName, {
             [styles.block]: block,
         }), tabIndex: -1, "data-test-id": getDataTestId(dataTestId, 'wrapper') },
         React.createElement(Input, { ...restProps, clear: clear && isCompleteDateRange(inputValue), onClear: valueProp === undefined ? handleClear : onClear, dataTestId: dataTestId, breakpoint: breakpoint, wrapperRef: mergeRefs([inputWrapperRef, inputWrapperRefProp]), ref: mergeRefs([ref, inputRef]), value: inputValue, inputMode: 'decimal', onInput: handleInputChange, onBlur: handleBlur, error: error || getInnerError(), block: true, rightAddons: React.createElement(React.Fragment, null,
                 rightAddons,
-                picker && (React.createElement(CalendarMIcon, { onClick: onPickerClick, className: styles.calendarIcon, onMouseDown: preventDefault }))) }),
-        platform === 'desktop' ? (React.createElement(Popover, { offset: [0, 4], position: 'bottom-start', dataTestId: getDataTestId(dataTestId, 'popover'), ...popoverProps, open: open, anchorElement: inputWrapperRef, popperClassName: cn(styles.calendarContainer, popoverProps?.popperClassName), withTransition: false }, renderCalendar())) : (renderCalendar())));
+                picker && (React.createElement(CalendarIcon, { onClick: onPickerClick, className: cn(styles.calendarIcon, styles[`size-${restProps.size}`]), onMouseDown: preventDefault }))) }),
+        platform === 'desktop' ? (React.createElement(Popover, { offset: [0, 4], position: 'bottom-start', dataTestId: getDataTestId(dataTestId, 'popover'), ...popoverProps, open: open, anchorElement: inputWrapperRef.current, popperClassName: cn(styles.calendarContainer, popoverProps?.popperClassName), withTransition: false }, renderCalendar())) : (renderCalendar())));
 });
 
 export { DateRangeInput };

package/universal-date-input/moderncssm/components/date-range-input/index.js

@@ -9,6 +9,7 @@ import '../../../../input/moderncssm';
 import '../../../../popover/moderncssm';
 import '../../../../shared/moderncssm';
 import '@alfalab/icons-glyph/CalendarMIcon';
+import '@alfalab/icons-glyph/CalendarSIcon';
 import '../../consts.js';
 import '../../utils/index.js';
 import 'date-fns/differenceInDays';

package/universal-date-input/moderncssm/desktop/Component.desktop.js

@@ -24,6 +24,7 @@ import '../components/date-input/Component.js';
 import '../../../input/moderncssm';
 import '../../../popover/moderncssm';
 import '@alfalab/icons-glyph/CalendarMIcon';
+import '@alfalab/icons-glyph/CalendarSIcon';
 import '../index.module.css';
 import '../components/date-input/date-input.desktop.module.css';
 import '../components/date-range-input/Component.js';

package/universal-date-input/moderncssm/desktop/index.js

@@ -25,6 +25,7 @@ import '../components/date-input/Component.js';
 import '../../../input/moderncssm';
 import '../../../popover/moderncssm';
 import '@alfalab/icons-glyph/CalendarMIcon';
+import '@alfalab/icons-glyph/CalendarSIcon';
 import '../index.module.css';
 import '../components/date-input/date-input.desktop.module.css';
 import '../components/date-range-input/Component.js';

package/universal-date-input/moderncssm/index.js

@@ -26,6 +26,7 @@ import './components/date-input/Component.js';
 import '../../input/moderncssm';
 import '../../popover/moderncssm';
 import '@alfalab/icons-glyph/CalendarMIcon';
+import '@alfalab/icons-glyph/CalendarSIcon';
 import './index.module.css';
 import './components/date-input/date-input.desktop.module.css';
 import './components/date-range-input/Component.js';

package/universal-date-input/moderncssm/index.module.css

@@ -40,8 +40,11 @@
     width: 24px;
     height: 100%;
     display: block;
-    color: var(--calendar-icon-color);
+    color: var(--calendar-icon-color)
 }
+.calendarIcon.size-40 {
+        width: 16px;
+    }
 .calendarContainer {
     display: inline-block;
     box-sizing: border-box;

package/universal-date-input/moderncssm/mobile/Component.mobile.js

@@ -24,6 +24,7 @@ import '../components/date-input/Component.js';
 import '../../../input/moderncssm';
 import '../../../popover/moderncssm';
 import '@alfalab/icons-glyph/CalendarMIcon';
+import '@alfalab/icons-glyph/CalendarSIcon';
 import '../index.module.css';
 import '../components/date-input/date-input.desktop.module.css';
 import '../components/date-range-input/Component.js';

package/universal-date-input/moderncssm/mobile/index.js

@@ -25,6 +25,7 @@ import '../components/date-input/Component.js';
 import '../../../input/moderncssm';
 import '../../../popover/moderncssm';
 import '@alfalab/icons-glyph/CalendarMIcon';
+import '@alfalab/icons-glyph/CalendarSIcon';
 import '../index.module.css';
 import '../components/date-input/date-input.desktop.module.css';
 import '../components/date-range-input/Component.js';

package/with-suffix/Component.js

@@ -12,16 +12,16 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"suffixContainer":"with-suffix__suffixContainer_bvvo9","suffixVisible":"with-suffix__suffixVisible_bvvo9","hasSuffix":"with-suffix__hasSuffix_bvvo9","spacer":"with-suffix__spacer_bvvo9","suffix":"with-suffix__suffix_bvvo9","disabled":"with-suffix__disabled_bvvo9","inverted":"with-suffix__inverted_bvvo9","readOnly":"with-suffix__readOnly_bvvo9"};
+var styles = {"suffixContainer":"with-suffix__suffixContainer_bvvo9","size-40":"with-suffix__size-40_bvvo9","suffixVisible":"with-suffix__suffixVisible_bvvo9","hasSuffix":"with-suffix__hasSuffix_bvvo9","spacer":"with-suffix__spacer_bvvo9","suffix":"with-suffix__suffix_bvvo9","disabled":"with-suffix__disabled_bvvo9","inverted":"with-suffix__inverted_bvvo9","readOnly":"with-suffix__readOnly_bvvo9"};
 require('./index.css');
 
 var withSuffix = function (Input) {
     return React.forwardRef(function (_a, ref) {
-        var _b, _c;
-        var value = _a.value, defaultValue = _a.defaultValue, onChange = _a.onChange, onClear = _a.onClear, _d = _a.suffix, suffix = _d === void 0 ? '' : _d, placeholder = _a.placeholder, className = _a.className, disabled = _a.disabled, readOnly = _a.readOnly, suffixContainerClassName = _a.suffixContainerClassName, restProps = tslib.__rest(_a, ["value", "defaultValue", "onChange", "onClear", "suffix", "placeholder", "className", "disabled", "readOnly", "suffixContainerClassName"]);
+        var _b, _c, _d;
+        var value = _a.value, defaultValue = _a.defaultValue, onChange = _a.onChange, onClear = _a.onClear, _e = _a.suffix, suffix = _e === void 0 ? '' : _e, placeholder = _a.placeholder, className = _a.className, disabled = _a.disabled, readOnly = _a.readOnly, suffixContainerClassName = _a.suffixContainerClassName, restProps = tslib.__rest(_a, ["value", "defaultValue", "onChange", "onClear", "suffix", "placeholder", "className", "disabled", "readOnly", "suffixContainerClassName"]);
         var uncontrolled = value === undefined;
-        var _e = React.useState(null), inputNode = _e[0], setInputNode = _e[1];
-        var _f = React.useState(defaultValue || ''), stateValue = _f[0], setStateValue = _f[1];
+        var _f = React.useState(null), inputNode = _f[0], setInputNode = _f[1];
+        var _g = React.useState(defaultValue || ''), stateValue = _g[0], setStateValue = _g[1];
         var handleInputChange = React.useCallback(function (event, payload) {
             if (onChange) {
                 onChange(event, payload);
@@ -49,13 +49,15 @@ var withSuffix = function (Input) {
                     _b[styles.hasSuffix] = suffix,
                     _b)) }, restProps)),
             React__default.default.createElement(coreComponentsPortal.Portal, { getPortalContainer: getPortalContainer },
-                React__default.default.createElement("div", { translate: 'no', className: cn__default.default(styles.suffixContainer, suffixContainerClassName) },
+                React__default.default.createElement("div", { translate: 'no', className: cn__default.default(styles.suffixContainer, suffixContainerClassName, (_c = {},
+                        _c[styles["size-".concat(restProps.size)]] = restProps.size,
+                        _c)) },
                     React__default.default.createElement("span", { className: styles.spacer }, visibleValue),
-                    suffix && (React__default.default.createElement("div", { className: cn__default.default(styles.suffix, (_c = {},
-                            _c[styles.disabled] = disabled,
-                            _c[styles.readOnly] = readOnly,
-                            _c[styles.inverted] = isInverted,
-                            _c)) }, suffix))))));
+                    suffix && (React__default.default.createElement("div", { className: cn__default.default(styles.suffix, (_d = {},
+                            _d[styles.disabled] = disabled,
+                            _d[styles.readOnly] = readOnly,
+                            _d[styles.inverted] = isInverted,
+                            _d)) }, suffix))))));
     });
 };
 

package/with-suffix/cssm/Component.js

@@ -16,11 +16,11 @@ var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
 
 var withSuffix = function (Input) {
     return React.forwardRef(function (_a, ref) {
-        var _b, _c;
-        var value = _a.value, defaultValue = _a.defaultValue, onChange = _a.onChange, onClear = _a.onClear, _d = _a.suffix, suffix = _d === void 0 ? '' : _d, placeholder = _a.placeholder, className = _a.className, disabled = _a.disabled, readOnly = _a.readOnly, suffixContainerClassName = _a.suffixContainerClassName, restProps = tslib.__rest(_a, ["value", "defaultValue", "onChange", "onClear", "suffix", "placeholder", "className", "disabled", "readOnly", "suffixContainerClassName"]);
+        var _b, _c, _d;
+        var value = _a.value, defaultValue = _a.defaultValue, onChange = _a.onChange, onClear = _a.onClear, _e = _a.suffix, suffix = _e === void 0 ? '' : _e, placeholder = _a.placeholder, className = _a.className, disabled = _a.disabled, readOnly = _a.readOnly, suffixContainerClassName = _a.suffixContainerClassName, restProps = tslib.__rest(_a, ["value", "defaultValue", "onChange", "onClear", "suffix", "placeholder", "className", "disabled", "readOnly", "suffixContainerClassName"]);
         var uncontrolled = value === undefined;
-        var _e = React.useState(null), inputNode = _e[0], setInputNode = _e[1];
-        var _f = React.useState(defaultValue || ''), stateValue = _f[0], setStateValue = _f[1];
+        var _f = React.useState(null), inputNode = _f[0], setInputNode = _f[1];
+        var _g = React.useState(defaultValue || ''), stateValue = _g[0], setStateValue = _g[1];
         var handleInputChange = React.useCallback(function (event, payload) {
             if (onChange) {
                 onChange(event, payload);
@@ -48,13 +48,15 @@ var withSuffix = function (Input) {
                     _b[styles__default.default.hasSuffix] = suffix,
                     _b)) }, restProps)),
             React__default.default.createElement(coreComponentsPortal.Portal, { getPortalContainer: getPortalContainer },
-                React__default.default.createElement("div", { translate: 'no', className: cn__default.default(styles__default.default.suffixContainer, suffixContainerClassName) },
+                React__default.default.createElement("div", { translate: 'no', className: cn__default.default(styles__default.default.suffixContainer, suffixContainerClassName, (_c = {},
+                        _c[styles__default.default["size-".concat(restProps.size)]] = restProps.size,
+                        _c)) },
                     React__default.default.createElement("span", { className: styles__default.default.spacer }, visibleValue),
-                    suffix && (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.suffix, (_c = {},
-                            _c[styles__default.default.disabled] = disabled,
-                            _c[styles__default.default.readOnly] = readOnly,
-                            _c[styles__default.default.inverted] = isInverted,
-                            _c)) }, suffix))))));
+                    suffix && (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.suffix, (_d = {},
+                            _d[styles__default.default.disabled] = disabled,
+                            _d[styles__default.default.readOnly] = readOnly,
+                            _d[styles__default.default.inverted] = isInverted,
+                            _d)) }, suffix))))));
     });
 };
 

package/with-suffix/cssm/index.module.css

@@ -14,10 +14,12 @@
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
-} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */
+    --gap-xs: 8px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
     --gap-0: 0;
+    --gap-8: var(--gap-xs);
 } :root {
 } :root {
 } /* сбрасывает синюю подсветку при нажатии */ :root {
@@ -46,8 +48,13 @@
     bottom: var(--gap-0);
     align-items: center;
     display: none;
-    pointer-events: none;
-} input:focus:not(:read-only) + .suffixContainer,
+    pointer-events: none
+} .suffixContainer.size-40 {
+        font-size: 14px;
+        line-height: 18px;
+        font-weight: 400;
+        padding: var(--gap-0) var(--gap-8);
+    } input:focus:not(:read-only) + .suffixContainer,
 .suffixVisible .suffixContainer {
     display: inline-flex;
 } .hasSuffix input:focus::placeholder {

package/with-suffix/esm/Component.js

@@ -4,16 +4,16 @@ import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { Portal } from '../../portal/esm';
 
-var styles = {"suffixContainer":"with-suffix__suffixContainer_bvvo9","suffixVisible":"with-suffix__suffixVisible_bvvo9","hasSuffix":"with-suffix__hasSuffix_bvvo9","spacer":"with-suffix__spacer_bvvo9","suffix":"with-suffix__suffix_bvvo9","disabled":"with-suffix__disabled_bvvo9","inverted":"with-suffix__inverted_bvvo9","readOnly":"with-suffix__readOnly_bvvo9"};
+var styles = {"suffixContainer":"with-suffix__suffixContainer_bvvo9","size-40":"with-suffix__size-40_bvvo9","suffixVisible":"with-suffix__suffixVisible_bvvo9","hasSuffix":"with-suffix__hasSuffix_bvvo9","spacer":"with-suffix__spacer_bvvo9","suffix":"with-suffix__suffix_bvvo9","disabled":"with-suffix__disabled_bvvo9","inverted":"with-suffix__inverted_bvvo9","readOnly":"with-suffix__readOnly_bvvo9"};
 require('./index.css');
 
 var withSuffix = function (Input) {
     return forwardRef(function (_a, ref) {
-        var _b, _c;
-        var value = _a.value, defaultValue = _a.defaultValue, onChange = _a.onChange, onClear = _a.onClear, _d = _a.suffix, suffix = _d === void 0 ? '' : _d, placeholder = _a.placeholder, className = _a.className, disabled = _a.disabled, readOnly = _a.readOnly, suffixContainerClassName = _a.suffixContainerClassName, restProps = __rest(_a, ["value", "defaultValue", "onChange", "onClear", "suffix", "placeholder", "className", "disabled", "readOnly", "suffixContainerClassName"]);
+        var _b, _c, _d;
+        var value = _a.value, defaultValue = _a.defaultValue, onChange = _a.onChange, onClear = _a.onClear, _e = _a.suffix, suffix = _e === void 0 ? '' : _e, placeholder = _a.placeholder, className = _a.className, disabled = _a.disabled, readOnly = _a.readOnly, suffixContainerClassName = _a.suffixContainerClassName, restProps = __rest(_a, ["value", "defaultValue", "onChange", "onClear", "suffix", "placeholder", "className", "disabled", "readOnly", "suffixContainerClassName"]);
         var uncontrolled = value === undefined;
-        var _e = useState(null), inputNode = _e[0], setInputNode = _e[1];
-        var _f = useState(defaultValue || ''), stateValue = _f[0], setStateValue = _f[1];
+        var _f = useState(null), inputNode = _f[0], setInputNode = _f[1];
+        var _g = useState(defaultValue || ''), stateValue = _g[0], setStateValue = _g[1];
         var handleInputChange = useCallback(function (event, payload) {
             if (onChange) {
                 onChange(event, payload);
@@ -41,13 +41,15 @@ var withSuffix = function (Input) {
                     _b[styles.hasSuffix] = suffix,
                     _b)) }, restProps)),
             React.createElement(Portal, { getPortalContainer: getPortalContainer },
-                React.createElement("div", { translate: 'no', className: cn(styles.suffixContainer, suffixContainerClassName) },
+                React.createElement("div", { translate: 'no', className: cn(styles.suffixContainer, suffixContainerClassName, (_c = {},
+                        _c[styles["size-".concat(restProps.size)]] = restProps.size,
+                        _c)) },
                     React.createElement("span", { className: styles.spacer }, visibleValue),
-                    suffix && (React.createElement("div", { className: cn(styles.suffix, (_c = {},
-                            _c[styles.disabled] = disabled,
-                            _c[styles.readOnly] = readOnly,
-                            _c[styles.inverted] = isInverted,
-                            _c)) }, suffix))))));
+                    suffix && (React.createElement("div", { className: cn(styles.suffix, (_d = {},
+                            _d[styles.disabled] = disabled,
+                            _d[styles.readOnly] = readOnly,
+                            _d[styles.inverted] = isInverted,
+                            _d)) }, suffix))))));
     });
 };
 

package/with-suffix/esm/index.css

@@ -15,10 +15,12 @@
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
-} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */
+    --gap-xs: 8px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
     --gap-0: 0;
+    --gap-8: var(--gap-xs);
 } :root {
 } :root {
 } /* сбрасывает синюю подсветку при нажатии */ :root {
@@ -47,8 +49,13 @@
     bottom: var(--gap-0);
     align-items: center;
     display: none;
-    pointer-events: none;
-} input:focus:not(:read-only) + .with-suffix__suffixContainer_bvvo9,
+    pointer-events: none
+} .with-suffix__suffixContainer_bvvo9.with-suffix__size-40_bvvo9 {
+        font-size: 14px;
+        line-height: 18px;
+        font-weight: 400;
+        padding: var(--gap-0) var(--gap-8);
+    } input:focus:not(:read-only) + .with-suffix__suffixContainer_bvvo9,
 .with-suffix__suffixVisible_bvvo9 .with-suffix__suffixContainer_bvvo9 {
     display: inline-flex;
 } .with-suffix__hasSuffix_bvvo9 input:focus::placeholder {

package/with-suffix/index.css

@@ -15,10 +15,12 @@
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
-} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */
+    --gap-xs: 8px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
     --gap-0: 0;
+    --gap-8: var(--gap-xs);
 } :root {
 } :root {
 } /* сбрасывает синюю подсветку при нажатии */ :root {
@@ -47,8 +49,13 @@
     bottom: var(--gap-0);
     align-items: center;
     display: none;
-    pointer-events: none;
-} input:focus:not(:read-only) + .with-suffix__suffixContainer_bvvo9,
+    pointer-events: none
+} .with-suffix__suffixContainer_bvvo9.with-suffix__size-40_bvvo9 {
+        font-size: 14px;
+        line-height: 18px;
+        font-weight: 400;
+        padding: var(--gap-0) var(--gap-8);
+    } input:focus:not(:read-only) + .with-suffix__suffixContainer_bvvo9,
 .with-suffix__suffixVisible_bvvo9 .with-suffix__suffixContainer_bvvo9 {
     display: inline-flex;
 } .with-suffix__hasSuffix_bvvo9 input:focus::placeholder {

package/with-suffix/modern/Component.js

@@ -3,7 +3,7 @@ import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { Portal } from '../../portal/modern';
 
-const styles = {"suffixContainer":"with-suffix__suffixContainer_bvvo9","suffixVisible":"with-suffix__suffixVisible_bvvo9","hasSuffix":"with-suffix__hasSuffix_bvvo9","spacer":"with-suffix__spacer_bvvo9","suffix":"with-suffix__suffix_bvvo9","disabled":"with-suffix__disabled_bvvo9","inverted":"with-suffix__inverted_bvvo9","readOnly":"with-suffix__readOnly_bvvo9"};
+const styles = {"suffixContainer":"with-suffix__suffixContainer_bvvo9","size-40":"with-suffix__size-40_bvvo9","suffixVisible":"with-suffix__suffixVisible_bvvo9","hasSuffix":"with-suffix__hasSuffix_bvvo9","spacer":"with-suffix__spacer_bvvo9","suffix":"with-suffix__suffix_bvvo9","disabled":"with-suffix__disabled_bvvo9","inverted":"with-suffix__inverted_bvvo9","readOnly":"with-suffix__readOnly_bvvo9"};
 require('./index.css');
 
 const withSuffix = (Input) => forwardRef(({ value, defaultValue, onChange, onClear, suffix = '', placeholder, className, disabled, readOnly, suffixContainerClassName, ...restProps }, ref) => {
@@ -37,7 +37,9 @@ const withSuffix = (Input) => forwardRef(({ value, defaultValue, onChange, onCle
                 [styles.hasSuffix]: suffix,
             }), ...restProps }),
         React.createElement(Portal, { getPortalContainer: getPortalContainer },
-            React.createElement("div", { translate: 'no', className: cn(styles.suffixContainer, suffixContainerClassName) },
+            React.createElement("div", { translate: 'no', className: cn(styles.suffixContainer, suffixContainerClassName, {
+                    [styles[`size-${restProps.size}`]]: restProps.size,
+                }) },
                 React.createElement("span", { className: styles.spacer }, visibleValue),
                 suffix && (React.createElement("div", { className: cn(styles.suffix, {
                         [styles.disabled]: disabled,

package/with-suffix/modern/index.css

@@ -15,10 +15,12 @@
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
-} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */
+    --gap-xs: 8px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
     --gap-0: 0;
+    --gap-8: var(--gap-xs);
 } :root {
 } :root {
 } /* сбрасывает синюю подсветку при нажатии */ :root {
@@ -47,8 +49,13 @@
     bottom: var(--gap-0);
     align-items: center;
     display: none;
-    pointer-events: none;
-} input:focus:not(:read-only) + .with-suffix__suffixContainer_bvvo9,
+    pointer-events: none
+} .with-suffix__suffixContainer_bvvo9.with-suffix__size-40_bvvo9 {
+        font-size: 14px;
+        line-height: 18px;
+        font-weight: 400;
+        padding: var(--gap-0) var(--gap-8);
+    } input:focus:not(:read-only) + .with-suffix__suffixContainer_bvvo9,
 .with-suffix__suffixVisible_bvvo9 .with-suffix__suffixContainer_bvvo9 {
     display: inline-flex;
 } .with-suffix__hasSuffix_bvvo9 input:focus::placeholder {

package/with-suffix/moderncssm/Component.js

@@ -35,7 +35,9 @@ const withSuffix = (Input) => forwardRef(({ value, defaultValue, onChange, onCle
                 [styles.hasSuffix]: suffix,
             }), ...restProps }),
         React.createElement(Portal, { getPortalContainer: getPortalContainer },
-            React.createElement("div", { translate: 'no', className: cn(styles.suffixContainer, suffixContainerClassName) },
+            React.createElement("div", { translate: 'no', className: cn(styles.suffixContainer, suffixContainerClassName, {
+                    [styles[`size-${restProps.size}`]]: restProps.size,
+                }) },
                 React.createElement("span", { className: styles.spacer }, visibleValue),
                 suffix && (React.createElement("div", { className: cn(styles.suffix, {
                         [styles.disabled]: disabled,

package/with-suffix/moderncssm/index.module.css

@@ -26,8 +26,14 @@
     bottom: var(--gap-0);
     align-items: center;
     display: none;
-    pointer-events: none;
+    pointer-events: none
 }
+.suffixContainer.size-40 {
+        font-size: 14px;
+        line-height: 18px;
+        font-weight: 400;
+        padding: var(--gap-0) var(--gap-8);
+    }
 input:focus:not(:read-only) + .suffixContainer,
 .suffixVisible .suffixContainer {
     display: inline-flex;

package/attach/@alfalab/icons-glyph/package.json

@@ -1,14 +0,0 @@
-{
-    "name": "@alfalab/icons-glyph",
-    "version": "2.140.0",
-    "license": "MIT",
-    "peerDependencies": {
-        "react": ">=16.8.0",
-        "react-dom": ">=16.8.0"
-    },
-    "main": "./index.js",
-    "module": "./esm/index.js",
-    "publishConfig": {
-        "access": "public"
-    }
-}

package/bank-card/@alfalab/icons-glyph/package.json

@@ -1,14 +0,0 @@
-{
-    "name": "@alfalab/icons-glyph",
-    "version": "2.140.0",
-    "license": "MIT",
-    "peerDependencies": {
-        "react": ">=16.8.0",
-        "react-dom": ">=16.8.0"
-    },
-    "main": "./index.js",
-    "module": "./esm/index.js",
-    "publishConfig": {
-        "access": "public"
-    }
-}

package/calendar/@alfalab/icons-glyph/package.json

@@ -1,14 +0,0 @@
-{
-    "name": "@alfalab/icons-glyph",
-    "version": "2.140.0",
-    "license": "MIT",
-    "peerDependencies": {
-        "react": ">=16.8.0",
-        "react-dom": ">=16.8.0"
-    },
-    "main": "./index.js",
-    "module": "./esm/index.js",
-    "publishConfig": {
-        "access": "public"
-    }
-}

package/calendar-input/@alfalab/icons-glyph/package.json

@@ -1,14 +0,0 @@
-{
-    "name": "@alfalab/icons-glyph",
-    "version": "2.140.0",
-    "license": "MIT",
-    "peerDependencies": {
-        "react": ">=16.8.0",
-        "react-dom": ">=16.8.0"
-    },
-    "main": "./index.js",
-    "module": "./esm/index.js",
-    "publishConfig": {
-        "access": "public"
-    }
-}

package/checkbox/@alfalab/icons-glyph/package.json

@@ -1,14 +0,0 @@
-{
-    "name": "@alfalab/icons-glyph",
-    "version": "2.140.0",
-    "license": "MIT",
-    "peerDependencies": {
-        "react": ">=16.8.0",
-        "react-dom": ">=16.8.0"
-    },
-    "main": "./index.js",
-    "module": "./esm/index.js",
-    "publishConfig": {
-        "access": "public"
-    }
-}

package/collapse/@alfalab/icons-glyph/package.json

@@ -1,14 +0,0 @@
-{
-    "name": "@alfalab/icons-glyph",
-    "version": "2.140.0",
-    "license": "MIT",
-    "peerDependencies": {
-        "react": ">=16.8.0",
-        "react-dom": ">=16.8.0"
-    },
-    "main": "./index.js",
-    "module": "./esm/index.js",
-    "publishConfig": {
-        "access": "public"
-    }
-}

package/confirmation-v1/@alfalab/icons-glyph/package.json

@@ -1,14 +0,0 @@
-{
-    "name": "@alfalab/icons-glyph",
-    "version": "2.140.0",
-    "license": "MIT",
-    "peerDependencies": {
-        "react": ">=16.8.0",
-        "react-dom": ">=16.8.0"
-    },
-    "main": "./index.js",
-    "module": "./esm/index.js",
-    "publishConfig": {
-        "access": "public"
-    }
-}

package/date-range-input/@alfalab/icons-glyph/package.json

@@ -1,14 +0,0 @@
-{
-    "name": "@alfalab/icons-glyph",
-    "version": "2.140.0",
-    "license": "MIT",
-    "peerDependencies": {
-        "react": ">=16.8.0",
-        "react-dom": ">=16.8.0"
-    },
-    "main": "./index.js",
-    "module": "./esm/index.js",
-    "publishConfig": {
-        "access": "public"
-    }
-}

package/date-time-input/@alfalab/icons-glyph/package.json

@@ -1,14 +0,0 @@
-{
-    "name": "@alfalab/icons-glyph",
-    "version": "2.140.0",
-    "license": "MIT",
-    "peerDependencies": {
-        "react": ">=16.8.0",
-        "react-dom": ">=16.8.0"
-    },
-    "main": "./index.js",
-    "module": "./esm/index.js",
-    "publishConfig": {
-        "access": "public"
-    }
-}

package/dropzone/@alfalab/icons-glyph/package.json

@@ -1,14 +0,0 @@
-{
-    "name": "@alfalab/icons-glyph",
-    "version": "2.140.0",
-    "license": "MIT",
-    "peerDependencies": {
-        "react": ">=16.8.0",
-        "react-dom": ">=16.8.0"
-    },
-    "main": "./index.js",
-    "module": "./esm/index.js",
-    "publishConfig": {
-        "access": "public"
-    }
-}