@salutejs/plasma-new-hope 0.239.0-canary.1696.12711678920.0 → 0.239.0-canary.1699.12748300760.0

package/styled-components/cjs/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx

@@ -96,6 +96,7 @@ export const Default: StoryObj<StoryPropsDefault> = {
         segmentation: 'default',
         min: 0,
         max: 9,
+        precision: 2,
         step: 1,
         width: 188,
         isManualInput: false,

package/styled-components/es/components/Avatar/Avatar.js

@@ -1,5 +1,5 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["size", "name", "url", "customText", "status", "className", "focused", "isScalable", "statusLabels", "hasExtra", "extraPlacement", "type", "counterView", "count", "maxCount", "badgeView", "text", "customColor", "customBackgroundColor", "contentLeft", "contentRight", "pilled"];
+var _excluded = ["size", "name", "url", "customText", "status", "className", "focused", "isScalable", "statusLabels"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -14,10 +14,10 @@ import { component, mergeConfig } from '../../engines';
 import { cx } from '../../utils';
 import { indicatorConfig, indicatorTokens } from '../Indicator';
 import { classes, tokens } from './Avatar.tokens';
-import { base, Wrapper, Image, StatusIcon, Text, ExtraContent, ExtraCounter, ExtraBadge } from './Avatar.styles';
+import { base, Wrapper, Image, StatusIcon, Text } from './Avatar.styles';
 import { base as viewCSS } from './variations/_size/base';
 import { base as focusedCSS } from './variations/_focused/base';
-import { extraPlacementMap, getInitialsForName } from './utils';
+import { getInitialsForName } from './utils';
 var StatusLabelsDefault = {
   active: 'Активен',
   inactive: 'Неактивен'
@@ -73,19 +73,6 @@ export var avatarRoot = function avatarRoot(Root) {
       isScalable = props.isScalable,
       _props$statusLabels = props.statusLabels,
       statusLabels = _props$statusLabels === void 0 ? StatusLabelsDefault : _props$statusLabels,
-      hasExtra = props.hasExtra,
-      extraPlacement = props.extraPlacement,
-      type = props.type,
-      counterView = props.counterView,
-      count = props.count,
-      maxCount = props.maxCount,
-      badgeView = props.badgeView,
-      text = props.text,
-      customColor = props.customColor,
-      customBackgroundColor = props.customBackgroundColor,
-      contentLeft = props.contentLeft,
-      contentRight = props.contentRight,
-      pilled = props.pilled,
       rest = _objectWithoutProperties(props, _excluded);
     var initials = useMemo(function () {
       return getInitialsForName(name);
@@ -93,18 +80,13 @@ export var avatarRoot = function avatarRoot(Root) {
     var ariaLabel = getAriaLabel(_objectSpread(_objectSpread({}, props), {}, {
       statusLabels: statusLabels
     }));
-    var extraViewProp = type === 'badge' ? {
-      badgeView: badgeView
-    } : {
-      counterView: counterView
-    };
     return /*#__PURE__*/React.createElement(Root, _extends({
       ref: ref,
       size: avatarSize,
       className: cx(classes.avatarItem, className),
       "aria-label": ariaLabel,
       focused: focused
-    }, extraViewProp, rest), /*#__PURE__*/React.createElement(Wrapper, {
+    }, rest), /*#__PURE__*/React.createElement(Wrapper, {
       isScalable: isScalable
     }, getAvatarContent({
       customText: customText,
@@ -114,24 +96,7 @@ export var avatarRoot = function avatarRoot(Root) {
     })), status && /*#__PURE__*/React.createElement(StatusIcon, null, /*#__PURE__*/React.createElement(StyledIndicator, {
       "aria-label": statusLabels[status],
       status: status
-    })), hasExtra && avatarSize !== 'fit' && /*#__PURE__*/React.createElement(ExtraContent, {
-      className: extraPlacementMap(extraPlacement)
-    }, type === 'counter' ? /*#__PURE__*/React.createElement(ExtraCounter, {
-      view: counterView,
-      count: count || 1,
-      maxCount: maxCount
-    }) : avatarSize !== 's' && /*#__PURE__*/React.createElement(ExtraBadge, _extends({
-      view: badgeView,
-      text: text,
-      customColor: customColor,
-      customBackgroundColor: customBackgroundColor,
-      pilled: pilled,
-      maxWidth: "100%"
-    }, contentLeft ? {
-      contentLeft: contentLeft
-    } : {
-      contentRight: contentRight
-    }))));
+    })));
   });
 };
 export var avatarConfig = {

package/styled-components/es/components/Avatar/Avatar.styles.js

@@ -2,14 +2,7 @@ var _templateObject;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import { css } from 'styled-components';
 import styled from 'styled-components';
-import { component, mergeConfig } from '../../engines';
-import { badgeConfig, badgeTokens } from '../Badge';
-import { counterConfig, counterTokens } from '../Counter';
-import { classes, tokens } from './Avatar.tokens';
-var mergedBadgeConfig = /*#__PURE__*/mergeConfig(badgeConfig);
-var Badge = /*#__PURE__*/component(mergedBadgeConfig);
-var mergedCounterConfig = /*#__PURE__*/mergeConfig(counterConfig);
-var Counter = /*#__PURE__*/component(mergedCounterConfig);
+import { tokens } from './Avatar.tokens';
 export var base = /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    position: relative;\n"])));
 export var Wrapper = /*#__PURE__*/styled.div.withConfig({
   componentId: "plasma-new-hope__sc-t16ccn-0"
@@ -28,13 +21,4 @@ export var Image = /*#__PURE__*/styled.img.withConfig({
 })(["width:100%;height:100%;border-radius:50%;"]);
 export var Text = /*#__PURE__*/styled.span.withConfig({
   componentId: "plasma-new-hope__sc-t16ccn-3"
-})(["font-size:var(", ");font-family:var(", ");font-weight:var(", ");line-height:var(", ");background-image:var(", ");background-color:var(", ");background-size:100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;"], tokens.fontSize, tokens.fontFamily, tokens.fontWeight, tokens.lineHeight, tokens.color, tokens.color);
-export var ExtraContent = /*#__PURE__*/styled.div.withConfig({
-  componentId: "plasma-new-hope__sc-t16ccn-4"
-})(["max-width:100%;display:flex;position:absolute;z-index:2;&.", "{top:calc(-0.063rem * var(", ",0));left:calc(-0.063rem * var(", ",0));}&.", "{top:calc(-0.063rem * var(", ",0));right:calc(-0.063rem * var(", ",0));}&.", "{bottom:calc(-0.063rem * var(", ",0));right:calc(-0.063rem * var(", ",0));}&.", "{bottom:calc(-0.063rem * var(", ",0));left:calc(-0.063rem * var(", ",0));}"], classes.extraPlacementTopLeft, tokens.extraPlacementFactor, tokens.extraPlacementFactor, classes.extraPlacementTopRight, tokens.extraPlacementFactor, tokens.extraPlacementFactor, classes.extraPlacementBottomRight, tokens.extraPlacementFactor, tokens.extraPlacementFactor, classes.extraPlacementBottomLeft, tokens.extraPlacementFactor, tokens.extraPlacementFactor);
-export var ExtraBadge = /*#__PURE__*/styled(Badge).withConfig({
-  componentId: "plasma-new-hope__sc-t16ccn-5"
-})(["", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");"], badgeTokens.background, tokens.badgeBackground, badgeTokens.color, tokens.badgeColor, badgeTokens.backgroundTransparent, tokens.badgeBackgroundTransparent, badgeTokens.colorTransparent, tokens.badgeColorTransparent, badgeTokens.colorClear, tokens.badgeColorClear, badgeTokens.backgroundClear, tokens.badgeBackgroundClear, badgeTokens.borderRadius, tokens.badgeBorderRadius, badgeTokens.pilledBorderRadius, tokens.badgePilledBorderRadius, badgeTokens.height, tokens.badgeHeight, badgeTokens.padding, tokens.badgePadding, badgeTokens.paddingIconOnly, tokens.badgePaddingIconOnly, badgeTokens.fontFamily, tokens.badgeFontFamily, badgeTokens.fontSize, tokens.badgeFontSize, badgeTokens.fontStyle, tokens.badgeFontStyle, badgeTokens.fontWeight, tokens.badgeFontWeight, badgeTokens.letterSpacing, tokens.badgeLetterSpacing, badgeTokens.lineHeight, tokens.badgeLineHeight, badgeTokens.leftContentMarginLeft, tokens.badgeLeftContentMarginLeft, badgeTokens.leftContentMarginRight, tokens.badgeLeftContentMarginRight, badgeTokens.rightContentMarginLeft, tokens.badgeRightContentMarginLeft, badgeTokens.rightContentMarginRight, tokens.badgeRightContentMarginRight);
-export var ExtraCounter = /*#__PURE__*/styled(Counter).withConfig({
-  componentId: "plasma-new-hope__sc-t16ccn-6"
-})(["", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");"], counterTokens.background, tokens.counterBackground, counterTokens.color, tokens.counterColor, counterTokens.borderRadius, tokens.counterBorderRadius, counterTokens.height, tokens.counterHeight, counterTokens.padding, tokens.counterPadding, counterTokens.fontFamily, tokens.counterFontFamily, counterTokens.fontSize, tokens.counterFontSize, counterTokens.fontStyle, tokens.counterFontStyle, counterTokens.fontWeight, tokens.counterFontWeight, counterTokens.letterSpacing, tokens.counterLetterSpacing, counterTokens.lineHeight, tokens.counterLineHeight);
+})(["font-size:var(", ");font-family:var(", ");font-weight:var(", ");line-height:var(", ");background-image:var(", ");background-color:var(", ");background-size:100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;"], tokens.fontSize, tokens.fontFamily, tokens.fontWeight, tokens.lineHeight, tokens.color, tokens.color);

package/styled-components/es/components/Avatar/Avatar.template-doc.mdx

@@ -147,57 +147,3 @@ export function App() {
 Опциональное свойство для корректной озвучки значений свойства `status`.
 
 По-умолчанию стоит значение для русскоговорящих `{ active: 'Активен', inactive: 'Неактивен' }`.
-
-#### Avatar и дополнительный контент
-
-Чтобы отобразить дополнительный контент нужно передать свойство `hasExtra`. 
-Тип дополнительного контента задается с помощью свойства `type`, а его вид с помощью `badgeView` и `counterView` соответственно.
-За положение дополнительного контента отвечает `extraPlacement`:
-
-```tsx live
-import React from 'react';
-import { Avatar } from '@salutejs/{{ package }}';
-
-export function App() {
-    return (
-        <>
-            <Avatar
-                size="l"
-                name="Иван Фадеев"
-                extraPlacement="top-left"
-                type="counter"
-                count={33}
-                counterView="positive"
-                hasExtra
-            />
-            <Avatar
-                size="l"
-                name="Иван Фадеев"
-                extraPlacement="top-right"
-                type="counter"
-                count={33}
-                counterView="accent"
-                hasExtra
-            />
-            <Avatar
-                size="l"
-                name="Иван Фадеев"
-                extraPlacement="bottom-right"
-                type="badge"
-                text="15"
-                badgeView="warning"
-                hasExtra
-            />
-            <Avatar
-                size="l"
-                name="Иван Фадеев"
-                extraPlacement="bottom-left"
-                type="badge"
-                text="15"
-                badgeView="negative"
-                hasExtra
-            />
-        </>
-    );
-}
-```

package/styled-components/es/components/Avatar/Avatar.tokens.js

@@ -1,9 +1,5 @@
 export var classes = {
-  avatarItem: 'avatar-item',
-  extraPlacementTopRight: 'avatar-extra-placement-top-right',
-  extraPlacementTopLeft: 'avatar-extra-placement-top-left',
-  extraPlacementBottomLeft: 'avatar-extra-placement-bottom-left',
-  extraPlacementBottomRight: 'avatar-extra-placement-bottom-right'
+  avatarItem: 'avatar-item'
 };
 export var tokens = {
   avatarSize: '--plasma-avatar-size',
@@ -19,40 +15,5 @@ export var tokens = {
   outlineColor: '--plasma-avatar-outline-color',
   outlineSize: '--plasma-avatar-outline-size',
   outlineOffset: '--plasma-avatar-outline-offset',
-  scaleHover: '--plasma-avatar-scale-hover',
-  extraPlacementFactor: '--plasma-avatar-extra-placement-factor',
-  // extra badge tokens
-  badgeBackground: '--plasma-avatar-extra-badge-background',
-  badgeColor: '--plasma-avatar-extra-badge-color',
-  badgeBackgroundTransparent: '--plasma-avatar-extra-badge-background-transparent',
-  badgeColorTransparent: '--plasma-avatar-extra-badge-color-transparent',
-  badgeColorClear: '--plasma-avatar-extra-badge-color-clear',
-  badgeBackgroundClear: '--plasma-avatar-extra-badge-background-clear',
-  badgeBorderRadius: '--plasma-avatar-extra-badge-border-radius',
-  badgePilledBorderRadius: '--plasma-avatar-extra-badge-pilled-border-radius',
-  badgeHeight: '--plasma-avatar-extra-badge-height',
-  badgePadding: '--plasma-avatar-extra-badge-padding',
-  badgePaddingIconOnly: '--plasma-avatar-extra-badge-padding-icon-only',
-  badgeFontFamily: '--plasma-avatar-extra-badge-font-family',
-  badgeFontSize: '--plasma-avatar-extra-badge-font-size',
-  badgeFontStyle: '--plasma-avatar-extra-badge-font-style',
-  badgeFontWeight: '--plasma-avatar-extra-badge-font-weight',
-  badgeLetterSpacing: '--plasma-avatar-extra-badge-letter-spacing',
-  badgeLineHeight: '--plasma-avatar-extra-badge-lineheight',
-  badgeLeftContentMarginLeft: '--plasma-avatar-extra-badge-left-content-margin-left',
-  badgeLeftContentMarginRight: '--plasma-avatar-extra-badge-left-content-margin-right',
-  badgeRightContentMarginLeft: '--plasma-avatar-extra-badge-right-content-margin-left',
-  badgeRightContentMarginRight: '--plasma-avatar-extra-badge-right-content-margin-right',
-  // extra counter tokens
-  counterBackground: '--plasma-avatar-extra-counter-background',
-  counterColor: '--plasma-avatar-extra-counter-color',
-  counterBorderRadius: '--plasma-avatar-extra-counter-border-radius',
-  counterHeight: '--plasma-avatar-extra-counter-height',
-  counterPadding: '--plasma-avatar-extra-counter-padding',
-  counterFontFamily: '--plasma-avatar-extra-counter-font-family',
-  counterFontSize: '--plasma-avatar-extra-counter-font-size',
-  counterFontStyle: '--plasma-avatar-extra-counter-font-style',
-  counterFontWeight: '--plasma-avatar-extra-counter-font-weight',
-  counterLetterSpacing: '--plasma-avatar-extra-counter-letter-spacing',
-  counterLineHeight: '--plasma-avatar-extra-counter-lineheight'
+  scaleHover: '--plasma-avatar-scale-hover'
 };

package/styled-components/es/components/Avatar/utils/index.js

@@ -1,14 +1 @@
-import { classes } from '../Avatar.tokens';
-export { getInitialsForName } from './getInitialsForName';
-export var extraPlacementMap = function extraPlacementMap(extraPlacement) {
-  switch (extraPlacement) {
-    case 'top-left':
-      return classes.extraPlacementTopLeft;
-    case 'bottom-left':
-      return classes.extraPlacementBottomLeft;
-    case 'bottom-right':
-      return classes.extraPlacementBottomRight;
-    default:
-      return classes.extraPlacementTopRight;
-  }
-};
+export { getInitialsForName } from './getInitialsForName';

package/styled-components/es/components/NumberInput/NumberInput.js

@@ -1,5 +1,5 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["className", "style", "width", "value", "min", "max", "step", "isLoading", "loader", "size", "view", "clear", "shape", "segmentation", "inputBackgroundType", "disabled", "textBefore", "textAfter", "customIncrementButton", "incrementIcon", "customDecrementButton", "decrementIcon", "isManualInput", "onChange", "onIncrement", "onDecrement"];
+var _excluded = ["className", "style", "width", "value", "min", "max", "step", "precision", "isLoading", "loader", "size", "view", "clear", "shape", "segmentation", "inputBackgroundType", "disabled", "textBefore", "textAfter", "customIncrementButton", "incrementIcon", "customDecrementButton", "decrementIcon", "isManualInput", "onChange", "onIncrement", "onDecrement"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -26,6 +26,7 @@ import { base as shapeCSS } from './variations/_shape/base';
 import { base as inputBackgroundTypeCSS } from './variations/_background-type/base';
 import { base as segmentationCSS } from './variations/_segmentation/base';
 import { base as disabledCSS } from './variations/_disabled/base';
+import { getPreciseValue } from './utils';
 export var numberInputRoot = function numberInputRoot(Root) {
   return /*#__PURE__*/forwardRef(function (_ref, ref) {
     var _ref2;
@@ -37,6 +38,8 @@ export var numberInputRoot = function numberInputRoot(Root) {
       max = _ref.max,
       _ref$step = _ref.step,
       step = _ref$step === void 0 ? 1 : _ref$step,
+      _ref$precision = _ref.precision,
+      precision = _ref$precision === void 0 ? 2 : _ref$precision,
       isLoading = _ref.isLoading,
       loader = _ref.loader,
       size = _ref.size,
@@ -70,6 +73,7 @@ export var numberInputRoot = function numberInputRoot(Root) {
       _useState6 = _slicedToArray(_useState5, 2),
       isAnimationRun = _useState6[0],
       setIsAnimationRun = _useState6[1];
+    console.log('innerValue', innerValue);
     var innerWidth = width ? getSizeValueFromProp(width) : '100%';
     var actionIconSize = size === 'xs' ? 'xs' : 's';
     var solidViewClass = segmentation === 'solid' ? classes.solidView : undefined;
@@ -90,7 +94,8 @@ export var numberInputRoot = function numberInputRoot(Root) {
       if (isLoading || disabled || isAnimationRun) {
         return;
       }
-      var diffValue = Number(innerValue) - step;
+      var preciseDiff = getPreciseValue(Number(innerValue) - step, precision);
+      var diffValue = Number(preciseDiff);
       var resValue = min !== undefined && diffValue <= min ? min : diffValue;
       setInnerValue(resValue);
       if (onDecrement) {
@@ -104,7 +109,8 @@ export var numberInputRoot = function numberInputRoot(Root) {
       if (isLoading || disabled || isAnimationRun) {
         return;
       }
-      var diffValue = Number(innerValue) + step;
+      var preciseDiff = getPreciseValue(Number(innerValue) + step, precision);
+      var diffValue = Number(preciseDiff);
       var resValue = max !== undefined && diffValue >= max ? max : diffValue;
       setInnerValue(resValue);
       if (onIncrement) {
@@ -148,6 +154,7 @@ export var numberInputRoot = function numberInputRoot(Root) {
       ref: ref,
       segmentation: segmentation,
       value: innerValue,
+      precision: precision,
       min: min,
       max: max,
       isManualInput: isManualInput,

package/styled-components/es/components/NumberInput/ui/Input/Input.js

@@ -1,5 +1,5 @@
 var _StyledSpinner;
-var _excluded = ["value", "min", "max", "isLoading", "loader", "disabled", "segmentation", "textBefore", "textAfter", "isManualInput", "isInputFocused", "setIsInputFocused", "setIsAnimationRun", "setInnerValue", "onChange", "onBlur", "onKeyDown"];
+var _excluded = ["value", "precision", "min", "max", "isLoading", "loader", "disabled", "segmentation", "textBefore", "textAfter", "isManualInput", "isInputFocused", "setIsInputFocused", "setIsAnimationRun", "setInnerValue", "onChange", "onBlur", "onKeyDown"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -14,11 +14,12 @@ import { useForkRef } from '@salutejs/plasma-core';
 import { classes } from '../../NumberInput.tokens';
 import { cx, isNumber } from '../../../../utils';
 import { useDidMountEffect } from '../../../../hooks';
-import { defaultCharacterWidth, excludingNumberSchema, numberSchema } from '../../utils';
+import { defaultCharacterWidth, excludingNumberSchema, getPreciseValue, numberSchema } from '../../utils';
 import { keyCodes } from '../../../../utils/constants';
 import { AdditionalText, Input, InputWrapper, DynamicInput, InputWidthHelper, TextWrapper, StyledSpinner, Loader } from './Input.styles';
 export var NumberInput = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var value = _ref.value,
+    precision = _ref.precision,
     min = _ref.min,
     max = _ref.max,
     isLoading = _ref.isLoading,
@@ -84,11 +85,6 @@ export var NumberInput = /*#__PURE__*/forwardRef(function (_ref, ref) {
       setIsAnimationRun(false);
       return;
     }
-    if (String(newValue).endsWith('.')) {
-      setValues(null, Number(newValue));
-      setIsAnimationRun(false);
-      return;
-    }
     var resValue = Number(newValue);
     if (max !== undefined && resValue > max) {
       setErrorClass(classes.errorAnimation);
@@ -100,6 +96,16 @@ export var NumberInput = /*#__PURE__*/forwardRef(function (_ref, ref) {
       setErrorClass(classes.errorAnimation);
       setErrorValue(min);
       setIsAnimationRun(true);
+      return;
+    }
+    if (String(newValue).endsWith('.')) {
+      setValues(null, Number(newValue));
+      setIsAnimationRun(false);
+      return;
+    }
+    if (precision !== undefined) {
+      var preciseNewValue = Number(getPreciseValue(newValue, precision));
+      setValues(null, preciseNewValue);
     }
     setIsAnimationRun(false);
   };
@@ -125,15 +131,18 @@ export var NumberInput = /*#__PURE__*/forwardRef(function (_ref, ref) {
       }
       return;
     }
+    console.log('here');
     var isValid = numberSchema.test(cleanValue);
     if (!isValid) {
+      console.log('not valid', cleanValue);
       setValues(event, lastValidValue);
       return;
     }
+    console.log('valid!', cleanValue);
     if (textWrapperRef !== null && textWrapperRef !== void 0 && textWrapperRef.current && wrapperRef !== null && wrapperRef !== void 0 && wrapperRef.current && (textWrapperRef === null || textWrapperRef === void 0 || (_textWrapperRef$curre = textWrapperRef.current) === null || _textWrapperRef$curre === void 0 ? void 0 : _textWrapperRef$curre.clientWidth) > (wrapperRef === null || wrapperRef === void 0 || (_wrapperRef$current = wrapperRef.current) === null || _wrapperRef$current === void 0 ? void 0 : _wrapperRef$current.clientWidth)) {
       wrapperRef.current.scrollLeft = textWrapperRef.current.offsetWidth - textWrapperRef.current.offsetLeft || 0;
     }
-    setValues(event, Number(cleanValue));
+    setValues(event, cleanValue);
   };
   var handleClickInputWrapper = function handleClickInputWrapper() {
     if (!isManualInput || !inputRef.current) {

package/styled-components/es/components/NumberInput/utils/index.js

@@ -1,3 +1,12 @@
 export var defaultCharacterWidth = '1ch';
 export var numberSchema = /^(-)?\d+(\.\d+)?$/;
-export var excludingNumberSchema = /[^-.\d]/g;
+export var excludingNumberSchema = /[^-.\d]/g;
+export var getPreciseValue = function getPreciseValue(value, precision) {
+  var innerValue = String(value);
+  if (precision !== undefined) {
+    var factor = Math.pow(10, precision);
+    var preparedValue = Number(innerValue) < 0 ? Number(innerValue) - Number.EPSILON : Number(innerValue) + Number.EPSILON;
+    return String(Math.round(preparedValue * factor) / factor);
+  }
+  return innerValue;
+};

package/styled-components/es/examples/plasma_b2c/components/Avatar/Avatar.config.js

@@ -10,32 +10,14 @@ export var config = {
       "default": /*#__PURE__*/css(["", ":var(--text-accent-gradient);", ":linear-gradient(94deg,rgba(62,121,240,0.2) 6.49%,rgba(39,198,229,0.2) 93.51%);", ":var(--surface-positive);", ":var(--surface-solid-tertiary);", ":1.02;"], tokens.color, tokens.backgroundColor, tokens.statusOnlineColor, tokens.statusOfflineColor, tokens.scaleHover)
     },
     size: {
-      xxl: /*#__PURE__*/css(["", ":6.25rem;", ":2rem;", ":600;", ":2rem;", ":0.75rem;", ":0.5rem;", ":1.75rem;", ":0 0.6875rem;", ":0 0.375rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":-0.0625rem;", ":0.25rem;", ":0.25rem;", ":-0.0625rem;", ":1.25rem;", ":1rem;", ":1.75rem;", ":0 0.625rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);"], tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize, tokens.badgeBorderRadius, tokens.badgeHeight, tokens.badgePadding, tokens.badgePaddingIconOnly, tokens.badgeFontFamily, tokens.badgeFontSize, tokens.badgeFontStyle, tokens.badgeFontWeight, tokens.badgeLetterSpacing, tokens.badgeLineHeight, tokens.badgeLeftContentMarginLeft, tokens.badgeLeftContentMarginRight, tokens.badgeRightContentMarginLeft, tokens.badgeRightContentMarginRight, tokens.badgePilledBorderRadius, tokens.counterBorderRadius, tokens.counterHeight, tokens.counterPadding, tokens.counterFontFamily, tokens.counterFontSize, tokens.counterFontStyle, tokens.counterFontWeight, tokens.counterLetterSpacing, tokens.counterLineHeight),
-      l: /*#__PURE__*/css(["", ":3rem;", ":1.25rem;", ":600;", ":1.25rem;", ":0.5rem;", ":2;", ":0.375rem;", ":1.25rem;", ":0 0.4375rem;", ":0 0.25rem;", ":var(--plasma-typo-body-xxs-font-family);", ":var(--plasma-typo-body-xxs-font-size);", ":var(--plasma-typo-body-xxs-font-style);", ":var(--plasma-typo-body-xxs-font-weight);", ":var(--plasma-typo-body-xxs-letter-spacing);", ":var(--plasma-typo-body-xxs-line-height);", ":-0.0625rem;", ":0.125rem;", ":0.125rem;", ":-0.0625rem;", ":1.25rem;", ":1rem;", ":1.25rem;", ":0 0.375rem;", ":var(--plasma-typo-body-xxs-font-family);", ":var(--plasma-typo-body-xxs-font-size);", ":var(--plasma-typo-body-xxs-font-style);", ":var(--plasma-typo-body-xxs-font-weight);", ":var(--plasma-typo-body-xxs-letter-spacing);", ":var(--plasma-typo-body-xxs-line-height);"], tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize, tokens.extraPlacementFactor, tokens.badgeBorderRadius, tokens.badgeHeight, tokens.badgePadding, tokens.badgePaddingIconOnly, tokens.badgeFontFamily, tokens.badgeFontSize, tokens.badgeFontStyle, tokens.badgeFontWeight, tokens.badgeLetterSpacing, tokens.badgeLineHeight, tokens.badgeLeftContentMarginLeft, tokens.badgeLeftContentMarginRight, tokens.badgeRightContentMarginLeft, tokens.badgeRightContentMarginRight, tokens.badgePilledBorderRadius, tokens.counterBorderRadius, tokens.counterHeight, tokens.counterPadding, tokens.counterFontFamily, tokens.counterFontSize, tokens.counterFontStyle, tokens.counterFontWeight, tokens.counterLetterSpacing, tokens.counterLineHeight),
-      m: /*#__PURE__*/css(["", ":2.25rem;", ":0.875rem;", ":600;", ":0.875rem;", ":0.5rem;", ":2;", ":0.25rem;", ":1rem;", ":0 0.25rem;", ":0 0.188rem;", ":var(--plasma-typo-body-xxs-font-family);", ":var(--plasma-typo-body-xxs-font-size);", ":var(--plasma-typo-body-xxs-font-style);", ":var(--plasma-typo-body-xxs-font-weight);", ":var(--plasma-typo-body-xxs-letter-spacing);", ":var(--plasma-typo-body-xxs-line-height);", ":-0.0625rem;", ":0.125rem;", ":0.125rem;", ":-0.0625rem;", ":1.25rem;", ":1rem;", ":1rem;", ":0 0.25rem;", ":var(--plasma-typo-body-xxs-font-family);", ":var(--plasma-typo-body-xxs-font-size);", ":var(--plasma-typo-body-xxs-font-style);", ":var(--plasma-typo-body-xxs-font-weight);", ":var(--plasma-typo-body-xxs-letter-spacing);", ":var(--plasma-typo-body-xxs-line-height);"], tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize, tokens.extraPlacementFactor, tokens.badgeBorderRadius, tokens.badgeHeight, tokens.badgePadding, tokens.badgePaddingIconOnly, tokens.badgeFontFamily, tokens.badgeFontSize, tokens.badgeFontStyle, tokens.badgeFontWeight, tokens.badgeLetterSpacing, tokens.badgeLineHeight, tokens.badgeLeftContentMarginLeft, tokens.badgeLeftContentMarginRight, tokens.badgeRightContentMarginLeft, tokens.badgeRightContentMarginRight, tokens.badgePilledBorderRadius, tokens.counterBorderRadius, tokens.counterHeight, tokens.counterPadding, tokens.counterFontFamily, tokens.counterFontSize, tokens.counterFontStyle, tokens.counterFontWeight, tokens.counterLetterSpacing, tokens.counterLineHeight),
-      s: /*#__PURE__*/css(["", ":1.5rem;", ":0.5rem;", ":600;", ":0.5rem;", ":0.375rem;", ":1;", ":1rem;", ":0.75rem;", ":0 0.125rem;", ":var(--plasma-typo-body-xxs-font-family);", ":var(--plasma-typo-body-xxs-font-size);", ":var(--plasma-typo-body-xxs-font-style);", ":var(--plasma-typo-body-xxs-font-weight);", ":var(--plasma-typo-body-xxs-letter-spacing);", ":var(--plasma-typo-body-xxs-line-height);"], tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize, tokens.extraPlacementFactor, tokens.counterBorderRadius, tokens.counterHeight, tokens.counterPadding, tokens.counterFontFamily, tokens.counterFontSize, tokens.counterFontStyle, tokens.counterFontWeight, tokens.counterLetterSpacing, tokens.counterLineHeight),
+      xxl: /*#__PURE__*/css(["", ":6.25rem;", ":2rem;", ":600;", ":2rem;", ":0.75rem;"], tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize),
+      l: /*#__PURE__*/css(["", ":3rem;", ":1.25rem;", ":600;", ":1.25rem;", ":0.5rem;"], tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize),
+      m: /*#__PURE__*/css(["", ":2.25rem;", ":0.875rem;", ":600;", ":0.875rem;", ":0.5rem;"], tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize),
+      s: /*#__PURE__*/css(["", ":1.5rem;", ":0.5rem;", ":600;", ":0.5rem;", ":0.375rem;"], tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize),
       fit: /*#__PURE__*/css(["", ":100%;", ":0;", ":0;", ":0;", ":0;"], tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize)
     },
     focused: {
       "true": /*#__PURE__*/css(["", ":0.1rem;", ":-0.2rem;", ":var(--surface-accent);"], tokens.outlineSize, tokens.outlineOffset, tokens.outlineColor)
-    },
-    badgeView: {
-      "default": /*#__PURE__*/css(["", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-clear);"], tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
-      accent: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-accent);", ":var(--text-accent);", ":var(--surface-transparent-accent);", ":var(--text-accent);", ":var(--surface-clear)"], tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
-      positive: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-positive);", ":var(--text-positive);", ":var(--surface-transparent-positive);", ":var(--text-positive);", ":var(--surface-clear)"], tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
-      warning: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-warning);", ":var(--text-warning);", ":var(--surface-transparent-warning);", ":var(--text-warning);", ":var(--surface-clear)"], tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
-      negative: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-negative);", ":var(--text-negative);", ":var(--surface-transparent-negative);", ":var(--text-negative);", ":var(--surface-clear)"], tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
-      dark: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--on-light-surface-solid-default);", ":var(--on-dark-text-primary);", ":var(--on-light-surface-transparent-deep);", ":var(--on-light-text-pri ", ":var(--surface-clear)mary);"], tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
-      light: /*#__PURE__*/css(["", ":var(--on-light-text-primary);", ":var(--on-dark-surface-solid-default);", ":var(--on-dark-text-primary);", ":var(--on-dark-surface-transparent-card);", ":var(--on-dark-text-prima ", ":var(--surface-clear)ry);"], tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear)
-    },
-    counterView: {
-      "default": /*#__PURE__*/css(["", ":var(--inverse-text-primary);", ":var(--surface-solid-default);"], tokens.counterColor, tokens.counterBackground),
-      accent: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-accent);"], tokens.counterColor, tokens.counterBackground),
-      positive: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-positive);"], tokens.counterColor, tokens.counterBackground),
-      warning: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-warning);"], tokens.counterColor, tokens.counterBackground),
-      negative: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-negative);"], tokens.counterColor, tokens.counterBackground),
-      dark: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--on-light-surface-solid-default);"], tokens.counterColor, tokens.counterBackground),
-      light: /*#__PURE__*/css(["", ":var(--on-light-text-primary);", ":var(--on-dark-surface-solid-default);"], tokens.counterColor, tokens.counterBackground)
     }
   }
 };

package/styled-components/es/examples/plasma_b2c/components/Avatar/Avatar.stories.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import type { ComponentProps } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { disableProps } from '@salutejs/plasma-sb-utils';
@@ -7,11 +6,6 @@ import { argTypesFromConfig, WithTheme } from '../../../_helpers';
 
 import { Avatar, mergedConfig } from './Avatar';
 
-const extraPlacements = ['top-left', 'top-right', 'bottom-left', 'bottom-right'];
-const extraType = ['', 'badge', 'counter'];
-const counterViews = ['default', 'accent', 'positive', 'warning', 'negative', 'dark', 'light'];
-const badgeViews = ['default', 'accent', 'positive', 'warning', 'negative', 'dark', 'light'];
-
 const meta: Meta<typeof Avatar> = {
     title: 'b2c/Data Display/Avatar',
     decorators: [WithTheme],
@@ -19,69 +13,12 @@ const meta: Meta<typeof Avatar> = {
     argTypes: {
         ...argTypesFromConfig(mergedConfig),
         status: { control: 'select', options: ['active', 'inactive'] },
-        type: {
-            control: 'select',
-            options: extraType,
-            if: { arg: 'hasExtra', truthy: true },
-        },
-        extraPlacement: {
-            control: 'select',
-            options: extraPlacements,
-            if: { arg: 'hasExtra', truthy: true },
-        },
-        counterView: {
-            control: 'select',
-            options: counterViews,
-            if: { arg: 'type', eq: 'counter' },
-        },
-        count: {
-            control: 'number',
-            if: { arg: 'type', eq: 'counter' },
-        },
-        maxCount: {
-            control: 'number',
-            if: { arg: 'type', eq: 'counter' },
-        },
-        badgeView: {
-            control: 'select',
-            options: badgeViews,
-            if: { arg: 'type', eq: 'badge' },
-        },
-        text: {
-            control: 'text',
-            if: { arg: 'type', eq: 'badge' },
-        },
-        customColor: {
-            control: 'color',
-            if: { arg: 'type', eq: 'badge' },
-        },
-        customBackgroundColor: {
-            control: 'color',
-            if: { arg: 'type', eq: 'badge' },
-        },
-        pilled: {
-            control: 'boolean',
-            if: { arg: 'type', eq: 'badge' },
-        },
     },
 };
 
 export default meta;
 
-type StoryProps = ComponentProps<typeof Avatar> & {
-    enableContentLeft: boolean;
-    enableContentRight: boolean;
-};
-type Story = StoryObj<StoryProps>;
-
-const BellIcon = (props) => (
-    <svg width="100%" viewBox="0 0 24 24" fill="none" {...props}>
-        <path
-            d="M11.501 21.28c1.088 0 1.978-.889 1.978-1.977H9.524c0 1.088.88 1.978 1.977 1.978zm5.933-5.932v-4.944c0-3.035-1.622-5.576-4.45-6.248v-.673c0-.82-.662-1.483-1.483-1.483-.82 0-1.483.662-1.483 1.483v.672c-2.838.673-4.45 3.204-4.45 6.25v4.943l-1.275 1.276c-.623.623-.188 1.69.692 1.69h13.022c.88 0 1.325-1.067.702-1.69l-1.275-1.276z"
-            fill="currentColor"
-        />
-    </svg>
-);
+type Story = StoryObj<ComponentProps<typeof Avatar>>;
 
 export const Default: Story = {
     args: {
@@ -90,56 +27,10 @@ export const Default: Story = {
         name: 'Иван Фадеев',
         url: 'https://avatars.githubusercontent.com/u/1813468?v=4',
         isScalable: false,
-        hasExtra: false,
-        extraPlacement: 'top-right',
-        type: undefined,
-        counterView: 'accent',
-        count: 3,
-        maxCount: 10,
-        badgeView: 'accent',
-        text: '31',
-        pilled: true,
-        enableContentLeft: false,
-        enableContentRight: false,
     },
     argTypes: {
-        enableContentLeft: {
-            control: { type: 'boolean' },
-            if: { arg: 'type', eq: 'badge' },
-        },
-        enableContentRight: {
-            control: { type: 'boolean' },
-            if: { arg: 'type', eq: 'badge' },
-        },
         ...disableProps(['focused']),
     },
-    render: ({ enableContentLeft, enableContentRight, size, ...rest }: StoryProps) => {
-        const iconSize = () => {
-            switch (size) {
-                case 'xxl':
-                    return '1rem';
-                case 'm':
-                    return '0.625rem';
-                default:
-                    return '0.75rem';
-            }
-        };
-
-        return (
-            <>
-                <Avatar
-                    contentLeft={enableContentLeft ? <BellIcon width={iconSize()} height={iconSize()} /> : undefined}
-                    contentRight={
-                        !enableContentLeft && enableContentRight ? (
-                            <BellIcon width={iconSize()} height={iconSize()} />
-                        ) : undefined
-                    }
-                    size={size}
-                    {...rest}
-                />
-            </>
-        );
-    },
 };
 
 export const Accessibility: Story = {
@@ -151,14 +42,6 @@ export const Accessibility: Story = {
         size: 'xxl',
         status: 'active',
         focused: true,
-        hasExtra: false,
-        extraPlacement: 'top-right',
-        type: undefined,
-        counterView: 'accent',
-        count: 3,
-        maxCount: 10,
-        badgeView: 'accent',
-        text: '31',
     },
 };
 
@@ -172,14 +55,6 @@ export const AccessibilityWithURL: Story = {
         focused: true,
         name: 'Микула Селянинович',
         url: 'https://avatars.githubusercontent.com/u/1813468?v=4',
-        hasExtra: false,
-        extraPlacement: 'top-right',
-        type: undefined,
-        counterView: 'accent',
-        count: 3,
-        maxCount: 10,
-        badgeView: 'accent',
-        text: '31',
     },
 };
 
@@ -192,13 +67,5 @@ export const AccessibilityWithCustomText: Story = {
         status: 'inactive',
         focused: true,
         customText: 'ФИО',
-        hasExtra: false,
-        extraPlacement: 'top-right',
-        type: undefined,
-        counterView: 'accent',
-        count: 3,
-        maxCount: 10,
-        badgeView: 'accent',
-        text: '31',
     },
 };