@alfalab/core-components 27.8.1 → 27.9.0

package/alert/Component.js

@@ -48,7 +48,7 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"component":"alert__component_rganz","buttons":"alert__buttons_rganz","title":"alert__title_rganz","content":"alert__content_rganz"};
+var styles = {"component":"alert__component_1qkdu","buttons":"alert__buttons_1qkdu","title":"alert__title_1qkdu","content":"alert__content_1qkdu"};
 require('./index.css');
 
 var Alert = function (_a) {

package/alert/esm/Component.js

@@ -41,7 +41,7 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"component":"alert__component_rganz","buttons":"alert__buttons_rganz","title":"alert__title_rganz","content":"alert__content_rganz"};
+var styles = {"component":"alert__component_1qkdu","buttons":"alert__buttons_1qkdu","title":"alert__title_1qkdu","content":"alert__content_1qkdu"};
 require('./index.css');
 
 var Alert = function (_a) {

package/alert/esm/index.css

@@ -1,4 +1,4 @@
-/* hash: 1ry7o */
+/* hash: 172go */
 :root {
     --color-dark-indigo: #0b1f35;
     --color-dark-indigo-60: rgba(11, 31, 53, 0.6);
@@ -721,7 +721,7 @@
     --size-l-height: 64px;
     --size-xl-height: 72px;
 }
-.alert__component_rganz {
+.alert__component_1qkdu {
     border-radius: var(--border-radius-xs) 0 0 var(--border-radius-xs);
     border-top: 0;
     border-right: 0;
@@ -732,14 +732,14 @@
     padding-right: var(--gap-s);
     min-height: 48px;
 }
-.alert__buttons_rganz {
+.alert__buttons_1qkdu {
     margin-top: var(--gap-m);
 }
-.alert__title_rganz {
+.alert__title_1qkdu {
     font-size: 16px;
     line-height: 24px;
     font-weight: 700;
 }
-.alert__content_rganz {
+.alert__content_1qkdu {
     max-width: none;
 }

package/alert/index.css

@@ -1,4 +1,4 @@
-/* hash: 1ry7o */
+/* hash: 172go */
 :root {
     --color-dark-indigo: #0b1f35;
     --color-dark-indigo-60: rgba(11, 31, 53, 0.6);
@@ -721,7 +721,7 @@
     --size-l-height: 64px;
     --size-xl-height: 72px;
 }
-.alert__component_rganz {
+.alert__component_1qkdu {
     border-radius: var(--border-radius-xs) 0 0 var(--border-radius-xs);
     border-top: 0;
     border-right: 0;
@@ -732,14 +732,14 @@
     padding-right: var(--gap-s);
     min-height: 48px;
 }
-.alert__buttons_rganz {
+.alert__buttons_1qkdu {
     margin-top: var(--gap-m);
 }
-.alert__title_rganz {
+.alert__title_1qkdu {
     font-size: 16px;
     line-height: 24px;
     font-weight: 700;
 }
-.alert__content_rganz {
+.alert__content_1qkdu {
     max-width: none;
 }

package/alert/modern/Component.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { Plate } from '../../plate/modern';
 
-var styles = {"component":"alert__component_rganz","buttons":"alert__buttons_rganz","title":"alert__title_rganz","content":"alert__content_rganz"};
+var styles = {"component":"alert__component_1qkdu","buttons":"alert__buttons_1qkdu","title":"alert__title_1qkdu","content":"alert__content_1qkdu"};
 require('./index.css');
 
 const Alert = ({ className, title, ...restProps }) => (React.createElement(Plate, Object.assign({ className: cn(styles.component, className), buttonsClassName: styles.buttons, contentClassName: styles.content, title: title ? React.createElement("span", { className: styles.title }, title) : null }, restProps)));

package/alert/modern/index.css

@@ -1,4 +1,4 @@
-/* hash: 1ry7o */
+/* hash: 172go */
 :root {
     --color-dark-indigo: #0b1f35;
     --color-dark-indigo-60: rgba(11, 31, 53, 0.6);
@@ -721,7 +721,7 @@
     --size-l-height: 64px;
     --size-xl-height: 72px;
 }
-.alert__component_rganz {
+.alert__component_1qkdu {
     border-radius: var(--border-radius-xs) 0 0 var(--border-radius-xs);
     border-top: 0;
     border-right: 0;
@@ -732,14 +732,14 @@
     padding-right: var(--gap-s);
     min-height: 48px;
 }
-.alert__buttons_rganz {
+.alert__buttons_1qkdu {
     margin-top: var(--gap-m);
 }
-.alert__title_rganz {
+.alert__title_1qkdu {
     font-size: 16px;
     line-height: 24px;
     font-weight: 700;
 }
-.alert__content_rganz {
+.alert__content_1qkdu {
     max-width: none;
 }

package/amount/component.js

@@ -9,7 +9,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"component":"amount__component_1ec63","transparentMinor":"amount__transparentMinor_1ec63","bold":"amount__bold_1ec63","normalMinor":"amount__normalMinor_1ec63","defaultStyles":"amount__defaultStyles_1ec63","defaultMinor":"amount__defaultMinor_1ec63"};
+var styles = {"component":"amount__component_o0r1y","transparentMinor":"amount__transparentMinor_o0r1y","bold":"amount__bold_o0r1y","normalMinor":"amount__normalMinor_o0r1y","defaultStyles":"amount__defaultStyles_o0r1y","defaultMinor":"amount__defaultMinor_o0r1y"};
 require('./index.css');
 
 /**

package/amount/esm/component.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { formatAmount, AMOUNT_MAJOR_MINOR_PARTS_SEPARATOR, THINSP } from '@alfalab/utils';
 
-var styles = {"component":"amount__component_1ec63","transparentMinor":"amount__transparentMinor_1ec63","bold":"amount__bold_1ec63","normalMinor":"amount__normalMinor_1ec63","defaultStyles":"amount__defaultStyles_1ec63","defaultMinor":"amount__defaultMinor_1ec63"};
+var styles = {"component":"amount__component_o0r1y","transparentMinor":"amount__transparentMinor_o0r1y","bold":"amount__bold_o0r1y","normalMinor":"amount__normalMinor_o0r1y","defaultStyles":"amount__defaultStyles_o0r1y","defaultMinor":"amount__defaultMinor_o0r1y"};
 require('./index.css');
 
 /**

package/amount/esm/index.css

@@ -726,22 +726,22 @@
     --amount-minor-part-font-weight: normal;
     --amount-minor-part-opacity: 0.6;
 }
-.amount__component_1ec63 {
+.amount__component_o0r1y {
     white-space: nowrap;
 }
-.amount__transparentMinor_1ec63 {
+.amount__transparentMinor_o0r1y {
     opacity: 0.6;
 }
-.amount__bold_1ec63 {
+.amount__bold_o0r1y {
     font-weight: bold;
 }
-.amount__normalMinor_1ec63 {
+.amount__normalMinor_o0r1y {
     font-weight: normal;
 }
-.amount__defaultStyles_1ec63 {
+.amount__defaultStyles_o0r1y {
     font-weight: var(--amount-major-part-font-weight);
 }
-.amount__defaultMinor_1ec63 {
+.amount__defaultMinor_o0r1y {
     opacity: var(--amount-minor-part-opacity);
     font-weight: var(--amount-minor-part-font-weight);
 }

package/amount/esm/pure/component.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { formatAmount, THINSP } from '@alfalab/utils';
 
-var styles = {"component":"amount__component_1cr7s"};
+var styles = {"component":"amount__component_r4fyy"};
 require('./index.css');
 
 /**

package/amount/esm/pure/index.css

@@ -1,4 +1,4 @@
 /* hash: 1d1k2 */
-.amount__component_1cr7s {
+.amount__component_r4fyy {
     white-space: nowrap;
 }

package/amount/index.css

@@ -726,22 +726,22 @@
     --amount-minor-part-font-weight: normal;
     --amount-minor-part-opacity: 0.6;
 }
-.amount__component_1ec63 {
+.amount__component_o0r1y {
     white-space: nowrap;
 }
-.amount__transparentMinor_1ec63 {
+.amount__transparentMinor_o0r1y {
     opacity: 0.6;
 }
-.amount__bold_1ec63 {
+.amount__bold_o0r1y {
     font-weight: bold;
 }
-.amount__normalMinor_1ec63 {
+.amount__normalMinor_o0r1y {
     font-weight: normal;
 }
-.amount__defaultStyles_1ec63 {
+.amount__defaultStyles_o0r1y {
     font-weight: var(--amount-major-part-font-weight);
 }
-.amount__defaultMinor_1ec63 {
+.amount__defaultMinor_o0r1y {
     opacity: var(--amount-minor-part-opacity);
     font-weight: var(--amount-minor-part-font-weight);
 }

package/amount/modern/component.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { formatAmount, AMOUNT_MAJOR_MINOR_PARTS_SEPARATOR, THINSP } from '@alfalab/utils';
 
-var styles = {"component":"amount__component_1ec63","transparentMinor":"amount__transparentMinor_1ec63","bold":"amount__bold_1ec63","normalMinor":"amount__normalMinor_1ec63","defaultStyles":"amount__defaultStyles_1ec63","defaultMinor":"amount__defaultMinor_1ec63"};
+var styles = {"component":"amount__component_o0r1y","transparentMinor":"amount__transparentMinor_o0r1y","bold":"amount__bold_o0r1y","normalMinor":"amount__normalMinor_o0r1y","defaultStyles":"amount__defaultStyles_o0r1y","defaultMinor":"amount__defaultMinor_o0r1y"};
 require('./index.css');
 
 /**

package/amount/modern/index.css

@@ -726,22 +726,22 @@
     --amount-minor-part-font-weight: normal;
     --amount-minor-part-opacity: 0.6;
 }
-.amount__component_1ec63 {
+.amount__component_o0r1y {
     white-space: nowrap;
 }
-.amount__transparentMinor_1ec63 {
+.amount__transparentMinor_o0r1y {
     opacity: 0.6;
 }
-.amount__bold_1ec63 {
+.amount__bold_o0r1y {
     font-weight: bold;
 }
-.amount__normalMinor_1ec63 {
+.amount__normalMinor_o0r1y {
     font-weight: normal;
 }
-.amount__defaultStyles_1ec63 {
+.amount__defaultStyles_o0r1y {
     font-weight: var(--amount-major-part-font-weight);
 }
-.amount__defaultMinor_1ec63 {
+.amount__defaultMinor_o0r1y {
     opacity: var(--amount-minor-part-opacity);
     font-weight: var(--amount-minor-part-font-weight);
 }

package/amount/modern/pure/component.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { formatAmount, THINSP } from '@alfalab/utils';
 
-var styles = {"component":"amount__component_1cr7s"};
+var styles = {"component":"amount__component_r4fyy"};
 require('./index.css');
 
 /**

package/amount/modern/pure/index.css

@@ -1,4 +1,4 @@
 /* hash: 1d1k2 */
-.amount__component_1cr7s {
+.amount__component_r4fyy {
     white-space: nowrap;
 }

package/amount/pure/component.js

@@ -9,7 +9,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"component":"amount__component_1cr7s"};
+var styles = {"component":"amount__component_r4fyy"};
 require('./index.css');
 
 /**

package/amount/pure/index.css

@@ -1,4 +1,4 @@
 /* hash: 1d1k2 */
-.amount__component_1cr7s {
+.amount__component_r4fyy {
     white-space: nowrap;
 }

package/amount-input/Component.d.ts

@@ -28,6 +28,11 @@ type AmountInputProps = Omit<InputProps, 'value' | 'onChange' | 'type'> & {
      * Позволяет вводить только целые значения
      */
     integersOnly?: boolean;
+    /**
+     * @default - true. Нельзя вводить отрицательные значения.
+     * Возможность вводить только положительные значения
+     */
+    positiveOnly?: boolean;
     /**
      * Жир
      */
@@ -76,6 +81,11 @@ declare const AmountInput: React.ForwardRefExoticComponent<Pick<InputProps, "cla
      * Позволяет вводить только целые значения
      */
     integersOnly?: boolean | undefined;
+    /**
+     * @default - true. Нельзя вводить отрицательные значения.
+     * Возможность вводить только положительные значения
+     */
+    positiveOnly?: boolean | undefined;
     /**
      * Жир
      */

package/amount-input/Component.js

@@ -51,13 +51,13 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"container":"amount-input__container_aqkwn","bold":"amount-input__bold_aqkwn","input":"amount-input__input_aqkwn","suffixContainer":"amount-input__suffixContainer_aqkwn","filled":"amount-input__filled_aqkwn"};
+var styles = {"container":"amount-input__container_10rrr","bold":"amount-input__bold_10rrr","input":"amount-input__input_10rrr","suffixContainer":"amount-input__suffixContainer_10rrr","filled":"amount-input__filled_10rrr"};
 require('./index.css');
 
-var defaultColors = {"minorPartAndCurrency":"amount-input__minorPartAndCurrency_1m2pt"};
+var defaultColors = {"minorPartAndCurrency":"amount-input__minorPartAndCurrency_1m5lw"};
 require('./default.css');
 
-var invertedColors = {"minorPartAndCurrency":"amount-input__minorPartAndCurrency_os35a"};
+var invertedColors = {"minorPartAndCurrency":"amount-input__minorPartAndCurrency_ouz7w"};
 require('./inverted.css');
 
 var colorStyles = {
@@ -73,18 +73,19 @@ var SuffixInput = coreComponentsWithSuffix.withSuffix(coreComponentsInput.Input)
  */
 var AmountInput = React.forwardRef(function (_a, ref) {
     var _b;
-    var _c = _a.value, value = _c === void 0 ? null : _c, _d = _a.integerLength, integerLength = _d === void 0 ? 9 : _d, _e = _a.minority, minority = _e === void 0 ? 100 : _e, _f = _a.currency, currency = _f === void 0 ? 'RUR' : _f, _g = _a.suffix, suffix = _g === void 0 ? currency : _g, _h = _a.placeholder, placeholder = _h === void 0 ? "0\u2009" + (suffix === currency ? utils.getCurrencySymbol(currency) || '' : suffix) : _h, _j = _a.integersOnly, integersOnly = _j === void 0 ? false : _j, _k = _a.bold, bold = _k === void 0 ? true : _k, _l = _a.colors, colors = _l === void 0 ? 'default' : _l, className = _a.className, focusedClassName = _a.focusedClassName, dataTestId = _a.dataTestId, _m = _a.clear, clear = _m === void 0 ? false : _m, onChange = _a.onChange, onClear = _a.onClear, restProps = __rest(_a, ["value", "integerLength", "minority", "currency", "suffix", "placeholder", "integersOnly", "bold", "colors", "className", "focusedClassName", "dataTestId", "clear", "onChange", "onClear"]);
+    var _c = _a.value, value = _c === void 0 ? null : _c, _d = _a.integerLength, integerLength = _d === void 0 ? 9 : _d, _e = _a.minority, minority = _e === void 0 ? 100 : _e, _f = _a.currency, currency = _f === void 0 ? 'RUR' : _f, _g = _a.suffix, suffix = _g === void 0 ? currency : _g, _h = _a.placeholder, placeholder = _h === void 0 ? "0\u2009" + (suffix === currency ? utils.getCurrencySymbol(currency) || '' : suffix) : _h, _j = _a.integersOnly, integersOnly = _j === void 0 ? false : _j, _k = _a.positiveOnly, positiveOnly = _k === void 0 ? true : _k, _l = _a.bold, bold = _l === void 0 ? true : _l, _m = _a.colors, colors = _m === void 0 ? 'default' : _m, className = _a.className, focusedClassName = _a.focusedClassName, dataTestId = _a.dataTestId, _o = _a.clear, clear = _o === void 0 ? false : _o, onChange = _a.onChange, onClear = _a.onClear, restProps = __rest(_a, ["value", "integerLength", "minority", "currency", "suffix", "placeholder", "integersOnly", "positiveOnly", "bold", "colors", "className", "focusedClassName", "dataTestId", "clear", "onChange", "onClear"]);
     var getFormattedAmount = React.useCallback(function () {
-        if (value === '' || value === null)
+        if (value === '' || value === null || value === '-')
             return '';
         return utils.formatAmount({
             value: +value,
             currency: currency,
             minority: minority,
             view: 'default',
+            negativeSymbol: 'hyphen-minus',
         }).formatted;
     }, [currency, minority, value]);
-    var _o = React.useState(getFormattedAmount()), inputValue = _o[0], setInputValue = _o[1];
+    var _p = React.useState(getFormattedAmount()), inputValue = _p[0], setInputValue = _p[1];
     var currencySymbol = utils.getCurrencySymbol(currency);
     React.useEffect(function () {
         var currentAmountValue = utils_index.getAmountValueFromStr(inputValue, minority);
@@ -100,7 +101,8 @@ var AmountInput = React.forwardRef(function (_a, ref) {
         if (integersOnly) {
             enteredValue = enteredValue.split(',')[0];
         }
-        var isCorrectEnteredValue = RegExp("(^[0-9]{1," + integerLength + "}(,([0-9]+)?)?$|^\\s*$)").test(enteredValue);
+        // Сокращение минимальной длины мажорной части числа до 0 позволяет ввести "," => "0,"
+        var isCorrectEnteredValue = RegExp("(^" + (positiveOnly ? '' : '-?') + "[0-9]{0," + integerLength + "}(,([0-9]+)?)?$|^\\s*$)").test(enteredValue);
         if (isCorrectEnteredValue) {
             var newFormattedValue = utils_index.getFormattedValue(enteredValue, currency, minority);
             if (newFormattedValue === inputValue) {
@@ -153,7 +155,7 @@ var AmountInput = React.forwardRef(function (_a, ref) {
             onClear(event);
         }
     }, [onClear]);
-    var _p = inputValue.split(','), majorPart = _p[0], minorPart = _p[1];
+    var _q = inputValue.split(','), majorPart = _q[0], minorPart = _q[1];
     return (React__default['default'].createElement("div", { className: cn__default['default'](styles.container, (_b = {},
             _b[styles.bold] = bold,
             _b[styles.filled] = Boolean(inputValue),

package/amount-input/cssm/Component.d.ts

@@ -28,6 +28,11 @@ type AmountInputProps = Omit<InputProps, 'value' | 'onChange' | 'type'> & {
      * Позволяет вводить только целые значения
      */
     integersOnly?: boolean;
+    /**
+     * @default - true. Нельзя вводить отрицательные значения.
+     * Возможность вводить только положительные значения
+     */
+    positiveOnly?: boolean;
     /**
      * Жир
      */
@@ -76,6 +81,11 @@ declare const AmountInput: React.ForwardRefExoticComponent<Pick<InputProps, "cla
      * Позволяет вводить только целые значения
      */
     integersOnly?: boolean | undefined;
+    /**
+     * @default - true. Нельзя вводить отрицательные значения.
+     * Возможность вводить только положительные значения
+     */
+    positiveOnly?: boolean | undefined;
     /**
      * Жир
      */

package/amount-input/cssm/Component.js

@@ -70,18 +70,19 @@ var SuffixInput = coreComponentsWithSuffix.withSuffix(coreComponentsInput.Input)
  */
 var AmountInput = React.forwardRef(function (_a, ref) {
     var _b;
-    var _c = _a.value, value = _c === void 0 ? null : _c, _d = _a.integerLength, integerLength = _d === void 0 ? 9 : _d, _e = _a.minority, minority = _e === void 0 ? 100 : _e, _f = _a.currency, currency = _f === void 0 ? 'RUR' : _f, _g = _a.suffix, suffix = _g === void 0 ? currency : _g, _h = _a.placeholder, placeholder = _h === void 0 ? "0\u2009" + (suffix === currency ? utils.getCurrencySymbol(currency) || '' : suffix) : _h, _j = _a.integersOnly, integersOnly = _j === void 0 ? false : _j, _k = _a.bold, bold = _k === void 0 ? true : _k, _l = _a.colors, colors = _l === void 0 ? 'default' : _l, className = _a.className, focusedClassName = _a.focusedClassName, dataTestId = _a.dataTestId, _m = _a.clear, clear = _m === void 0 ? false : _m, onChange = _a.onChange, onClear = _a.onClear, restProps = __rest(_a, ["value", "integerLength", "minority", "currency", "suffix", "placeholder", "integersOnly", "bold", "colors", "className", "focusedClassName", "dataTestId", "clear", "onChange", "onClear"]);
+    var _c = _a.value, value = _c === void 0 ? null : _c, _d = _a.integerLength, integerLength = _d === void 0 ? 9 : _d, _e = _a.minority, minority = _e === void 0 ? 100 : _e, _f = _a.currency, currency = _f === void 0 ? 'RUR' : _f, _g = _a.suffix, suffix = _g === void 0 ? currency : _g, _h = _a.placeholder, placeholder = _h === void 0 ? "0\u2009" + (suffix === currency ? utils.getCurrencySymbol(currency) || '' : suffix) : _h, _j = _a.integersOnly, integersOnly = _j === void 0 ? false : _j, _k = _a.positiveOnly, positiveOnly = _k === void 0 ? true : _k, _l = _a.bold, bold = _l === void 0 ? true : _l, _m = _a.colors, colors = _m === void 0 ? 'default' : _m, className = _a.className, focusedClassName = _a.focusedClassName, dataTestId = _a.dataTestId, _o = _a.clear, clear = _o === void 0 ? false : _o, onChange = _a.onChange, onClear = _a.onClear, restProps = __rest(_a, ["value", "integerLength", "minority", "currency", "suffix", "placeholder", "integersOnly", "positiveOnly", "bold", "colors", "className", "focusedClassName", "dataTestId", "clear", "onChange", "onClear"]);
     var getFormattedAmount = React.useCallback(function () {
-        if (value === '' || value === null)
+        if (value === '' || value === null || value === '-')
             return '';
         return utils.formatAmount({
             value: +value,
             currency: currency,
             minority: minority,
             view: 'default',
+            negativeSymbol: 'hyphen-minus',
         }).formatted;
     }, [currency, minority, value]);
-    var _o = React.useState(getFormattedAmount()), inputValue = _o[0], setInputValue = _o[1];
+    var _p = React.useState(getFormattedAmount()), inputValue = _p[0], setInputValue = _p[1];
     var currencySymbol = utils.getCurrencySymbol(currency);
     React.useEffect(function () {
         var currentAmountValue = utils_index.getAmountValueFromStr(inputValue, minority);
@@ -97,7 +98,8 @@ var AmountInput = React.forwardRef(function (_a, ref) {
         if (integersOnly) {
             enteredValue = enteredValue.split(',')[0];
         }
-        var isCorrectEnteredValue = RegExp("(^[0-9]{1," + integerLength + "}(,([0-9]+)?)?$|^\\s*$)").test(enteredValue);
+        // Сокращение минимальной длины мажорной части числа до 0 позволяет ввести "," => "0,"
+        var isCorrectEnteredValue = RegExp("(^" + (positiveOnly ? '' : '-?') + "[0-9]{0," + integerLength + "}(,([0-9]+)?)?$|^\\s*$)").test(enteredValue);
         if (isCorrectEnteredValue) {
             var newFormattedValue = utils_index.getFormattedValue(enteredValue, currency, minority);
             if (newFormattedValue === inputValue) {
@@ -150,7 +152,7 @@ var AmountInput = React.forwardRef(function (_a, ref) {
             onClear(event);
         }
     }, [onClear]);
-    var _p = inputValue.split(','), majorPart = _p[0], minorPart = _p[1];
+    var _q = inputValue.split(','), majorPart = _q[0], minorPart = _q[1];
     return (React__default['default'].createElement("div", { className: cn__default['default'](styles__default['default'].container, (_b = {},
             _b[styles__default['default'].bold] = bold,
             _b[styles__default['default'].filled] = Boolean(inputValue),

package/amount-input/cssm/utils/index.js

@@ -13,14 +13,24 @@ var utils = require('@alfalab/utils');
  * @param minority количество минорных единиц
  */
 function getFormattedValue(enteredValue, currency, minority) {
+    if (!enteredValue || enteredValue === '-') {
+        return enteredValue;
+    }
+    // eslint-disable-next-line prefer-const
     var _a = enteredValue.split(','), head = _a[0], tail = _a[1];
+    // При вводе "-," указываем, что имеется в виду "-0,"
+    if (head === '-') {
+        head = '-0';
+    }
     var majorPart = utils.formatAmount({
         value: Number(head) * minority,
         currency: currency,
         minority: minority,
+        negativeSymbol: 'hyphen-minus',
     }).majorPart;
-    if (!enteredValue) {
-        return enteredValue;
+    // Так как -0 === 0, formatAmount возвращает положительное значение. Исправляем это здесь
+    if (/^-(,|0),?/.test(enteredValue) && majorPart === '0') {
+        majorPart = "-" + majorPart;
     }
     if (!tail && enteredValue.includes(',')) {
         return majorPart.concat(',');
@@ -31,9 +41,10 @@ function getFormattedValue(enteredValue, currency, minority) {
     return majorPart;
 }
 function getAmountValueFromStr(str, minority) {
-    return str === ''
-        ? null
-        : Math.round(Number(str.replace(',', '.').replace(/[^0-9.]/g, '')) * minority);
+    if (str === '' || str === '-') {
+        return null;
+    }
+    return Math.round(Number(str.replace(',', '.').replace(/[^0-9.-]/g, '')) * minority);
 }
 
 exports.getAmountValueFromStr = getAmountValueFromStr;

package/amount-input/default.css

@@ -1,4 +1,4 @@
-/* hash: brt26 */
+/* hash: 1ov4m */
 :root {
     --color-dark-indigo: #0b1f35;
     --color-dark-indigo-60: rgba(11, 31, 53, 0.6);
@@ -724,6 +724,6 @@
 :root {
     --amount-input-minor-part-and-currency-color: var(--color-light-text-secondary);
 }
-.amount-input__minorPartAndCurrency_1m2pt {
+.amount-input__minorPartAndCurrency_1m5lw {
     color: var(--amount-input-minor-part-and-currency-color);
 }

package/amount-input/esm/Component.d.ts

@@ -28,6 +28,11 @@ type AmountInputProps = Omit<InputProps, 'value' | 'onChange' | 'type'> & {
      * Позволяет вводить только целые значения
      */
     integersOnly?: boolean;
+    /**
+     * @default - true. Нельзя вводить отрицательные значения.
+     * Возможность вводить только положительные значения
+     */
+    positiveOnly?: boolean;
     /**
      * Жир
      */
@@ -76,6 +81,11 @@ declare const AmountInput: React.ForwardRefExoticComponent<Pick<InputProps, "cla
      * Позволяет вводить только целые значения
      */
     integersOnly?: boolean | undefined;
+    /**
+     * @default - true. Нельзя вводить отрицательные значения.
+     * Возможность вводить только положительные значения
+     */
+    positiveOnly?: boolean | undefined;
     /**
      * Жир
      */

package/amount-input/esm/Component.js

@@ -44,13 +44,13 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"container":"amount-input__container_aqkwn","bold":"amount-input__bold_aqkwn","input":"amount-input__input_aqkwn","suffixContainer":"amount-input__suffixContainer_aqkwn","filled":"amount-input__filled_aqkwn"};
+var styles = {"container":"amount-input__container_10rrr","bold":"amount-input__bold_10rrr","input":"amount-input__input_10rrr","suffixContainer":"amount-input__suffixContainer_10rrr","filled":"amount-input__filled_10rrr"};
 require('./index.css');
 
-var defaultColors = {"minorPartAndCurrency":"amount-input__minorPartAndCurrency_1m2pt"};
+var defaultColors = {"minorPartAndCurrency":"amount-input__minorPartAndCurrency_1m5lw"};
 require('./default.css');
 
-var invertedColors = {"minorPartAndCurrency":"amount-input__minorPartAndCurrency_os35a"};
+var invertedColors = {"minorPartAndCurrency":"amount-input__minorPartAndCurrency_ouz7w"};
 require('./inverted.css');
 
 var colorStyles = {
@@ -66,18 +66,19 @@ var SuffixInput = withSuffix(Input);
  */
 var AmountInput = forwardRef(function (_a, ref) {
     var _b;
-    var _c = _a.value, value = _c === void 0 ? null : _c, _d = _a.integerLength, integerLength = _d === void 0 ? 9 : _d, _e = _a.minority, minority = _e === void 0 ? 100 : _e, _f = _a.currency, currency = _f === void 0 ? 'RUR' : _f, _g = _a.suffix, suffix = _g === void 0 ? currency : _g, _h = _a.placeholder, placeholder = _h === void 0 ? "0\u2009" + (suffix === currency ? getCurrencySymbol(currency) || '' : suffix) : _h, _j = _a.integersOnly, integersOnly = _j === void 0 ? false : _j, _k = _a.bold, bold = _k === void 0 ? true : _k, _l = _a.colors, colors = _l === void 0 ? 'default' : _l, className = _a.className, focusedClassName = _a.focusedClassName, dataTestId = _a.dataTestId, _m = _a.clear, clear = _m === void 0 ? false : _m, onChange = _a.onChange, onClear = _a.onClear, restProps = __rest(_a, ["value", "integerLength", "minority", "currency", "suffix", "placeholder", "integersOnly", "bold", "colors", "className", "focusedClassName", "dataTestId", "clear", "onChange", "onClear"]);
+    var _c = _a.value, value = _c === void 0 ? null : _c, _d = _a.integerLength, integerLength = _d === void 0 ? 9 : _d, _e = _a.minority, minority = _e === void 0 ? 100 : _e, _f = _a.currency, currency = _f === void 0 ? 'RUR' : _f, _g = _a.suffix, suffix = _g === void 0 ? currency : _g, _h = _a.placeholder, placeholder = _h === void 0 ? "0\u2009" + (suffix === currency ? getCurrencySymbol(currency) || '' : suffix) : _h, _j = _a.integersOnly, integersOnly = _j === void 0 ? false : _j, _k = _a.positiveOnly, positiveOnly = _k === void 0 ? true : _k, _l = _a.bold, bold = _l === void 0 ? true : _l, _m = _a.colors, colors = _m === void 0 ? 'default' : _m, className = _a.className, focusedClassName = _a.focusedClassName, dataTestId = _a.dataTestId, _o = _a.clear, clear = _o === void 0 ? false : _o, onChange = _a.onChange, onClear = _a.onClear, restProps = __rest(_a, ["value", "integerLength", "minority", "currency", "suffix", "placeholder", "integersOnly", "positiveOnly", "bold", "colors", "className", "focusedClassName", "dataTestId", "clear", "onChange", "onClear"]);
     var getFormattedAmount = useCallback(function () {
-        if (value === '' || value === null)
+        if (value === '' || value === null || value === '-')
             return '';
         return formatAmount({
             value: +value,
             currency: currency,
             minority: minority,
             view: 'default',
+            negativeSymbol: 'hyphen-minus',
         }).formatted;
     }, [currency, minority, value]);
-    var _o = useState(getFormattedAmount()), inputValue = _o[0], setInputValue = _o[1];
+    var _p = useState(getFormattedAmount()), inputValue = _p[0], setInputValue = _p[1];
     var currencySymbol = getCurrencySymbol(currency);
     useEffect(function () {
         var currentAmountValue = getAmountValueFromStr(inputValue, minority);
@@ -93,7 +94,8 @@ var AmountInput = forwardRef(function (_a, ref) {
         if (integersOnly) {
             enteredValue = enteredValue.split(',')[0];
         }
-        var isCorrectEnteredValue = RegExp("(^[0-9]{1," + integerLength + "}(,([0-9]+)?)?$|^\\s*$)").test(enteredValue);
+        // Сокращение минимальной длины мажорной части числа до 0 позволяет ввести "," => "0,"
+        var isCorrectEnteredValue = RegExp("(^" + (positiveOnly ? '' : '-?') + "[0-9]{0," + integerLength + "}(,([0-9]+)?)?$|^\\s*$)").test(enteredValue);
         if (isCorrectEnteredValue) {
             var newFormattedValue = getFormattedValue(enteredValue, currency, minority);
             if (newFormattedValue === inputValue) {
@@ -146,7 +148,7 @@ var AmountInput = forwardRef(function (_a, ref) {
             onClear(event);
         }
     }, [onClear]);
-    var _p = inputValue.split(','), majorPart = _p[0], minorPart = _p[1];
+    var _q = inputValue.split(','), majorPart = _q[0], minorPart = _q[1];
     return (React.createElement("div", { className: cn(styles.container, (_b = {},
             _b[styles.bold] = bold,
             _b[styles.filled] = Boolean(inputValue),

package/amount-input/esm/default.css

@@ -1,4 +1,4 @@
-/* hash: brt26 */
+/* hash: 1ov4m */
 :root {
     --color-dark-indigo: #0b1f35;
     --color-dark-indigo-60: rgba(11, 31, 53, 0.6);
@@ -724,6 +724,6 @@
 :root {
     --amount-input-minor-part-and-currency-color: var(--color-light-text-secondary);
 }
-.amount-input__minorPartAndCurrency_1m2pt {
+.amount-input__minorPartAndCurrency_1m5lw {
     color: var(--amount-input-minor-part-and-currency-color);
 }