@salutejs/sdds-finportal 0.161.0-canary.1551.11740641367.0 → 0.161.1-canary.1517.11744378817.0

package/api/sdds-finportal.api.md

@@ -136,6 +136,8 @@ import { NotificationIconPlacement } from '@salutejs/plasma-new-hope/styled-comp
 import { NotificationLayout } from '@salutejs/plasma-new-hope/styled-components';
 import { NotificationPlacement } from '@salutejs/plasma-new-hope/styled-components';
 import { NotificationProps } from '@salutejs/plasma-new-hope/styled-components';
+import { numberInputClasses } from '@salutejs/plasma-new-hope/styled-components';
+import { numberInputTokens } from '@salutejs/plasma-new-hope/styled-components';
 import { Orientation } from '@salutejs/plasma-new-hope/types/components/TextFieldGroup/TextFieldGroup.types';
 import { Overlay } from '@salutejs/plasma-new-hope/styled-components';
 import { OverlayProps } from '@salutejs/plasma-new-hope/styled-components';
@@ -194,6 +196,7 @@ import { StepItemProps } from '@salutejs/plasma-new-hope/styled-components';
 import { StepsProps } from '@salutejs/plasma-new-hope/types/components/Steps/Steps.types';
 import { StyledComponent } from 'styled-components';
 import { SwitchProps as SwitchProps_2 } from '@salutejs/plasma-new-hope/styled-components';
+import { SyntheticEvent } from 'react';
 import { TabItemRefs } from '@salutejs/plasma-new-hope/styled-components';
 import { TabsContext } from '@salutejs/plasma-new-hope/styled-components';
 import { TabsControllerProps } from '@salutejs/plasma-new-hope/styled-components';
@@ -3172,6 +3175,92 @@ export const NotificationsProvider: React_2.FC<{
     placement?: NotificationPlacement;
 }>;
 
+// @public (undocumented)
+export const NumberInput: FunctionComponent<PropsType<    {
+view: {
+default: PolymorphicClassName;
+secondary: PolymorphicClassName;
+accent: PolymorphicClassName;
+clear: PolymorphicClassName;
+};
+size: {
+l: PolymorphicClassName;
+m: PolymorphicClassName;
+s: PolymorphicClassName;
+xs: PolymorphicClassName;
+};
+shape: {
+cornered: PolymorphicClassName;
+pilled: PolymorphicClassName;
+};
+inputBackgroundType: {
+fill: PolymorphicClassName;
+clear: PolymorphicClassName;
+};
+segmentation: {
+default: PolymorphicClassName;
+segmented: PolymorphicClassName;
+solid: PolymorphicClassName;
+};
+disabled: {
+true: PolymorphicClassName;
+};
+}> & (({
+value?: number | undefined;
+min?: number | undefined;
+max?: number | undefined;
+step?: number | undefined;
+isLoading?: boolean | undefined;
+loader?: ReactNode;
+size?: string | undefined;
+view?: string | undefined;
+clear?: boolean | undefined;
+shape?: string | undefined;
+disabled?: boolean | undefined;
+textBefore?: string | undefined;
+textAfter?: string | undefined;
+customIncrementButton?: ReactNode;
+incrementIcon?: ReactNode;
+customDecrementButton?: ReactNode;
+decrementIcon?: ReactNode;
+isManualInput?: boolean | undefined;
+onChange?: ((event: SyntheticEvent<HTMLInputElement, Event> | null, value: string | number) => void) | undefined;
+onIncrement?: ((value: number) => void) | undefined;
+onDecrement?: ((value: number) => void) | undefined;
+} & {
+segmentation?: "clear" | undefined;
+inputBackgroundType?: undefined;
+} & Omit<InputHTMLAttributes_2<HTMLInputElement>, "onChange" | "size" | "value"> & RefAttributes<HTMLInputElement>) | ({
+value?: number | undefined;
+min?: number | undefined;
+max?: number | undefined;
+step?: number | undefined;
+isLoading?: boolean | undefined;
+loader?: ReactNode;
+size?: string | undefined;
+view?: string | undefined;
+clear?: boolean | undefined;
+shape?: string | undefined;
+disabled?: boolean | undefined;
+textBefore?: string | undefined;
+textAfter?: string | undefined;
+customIncrementButton?: ReactNode;
+incrementIcon?: ReactNode;
+customDecrementButton?: ReactNode;
+decrementIcon?: ReactNode;
+isManualInput?: boolean | undefined;
+onChange?: ((event: SyntheticEvent<HTMLInputElement, Event> | null, value: string | number) => void) | undefined;
+onIncrement?: ((value: number) => void) | undefined;
+onDecrement?: ((value: number) => void) | undefined;
+} & {
+segmentation?: string | undefined;
+inputBackgroundType?: string | undefined;
+} & Omit<InputHTMLAttributes_2<HTMLInputElement>, "onChange" | "size" | "value"> & RefAttributes<HTMLInputElement>))>;
+
+export { numberInputClasses }
+
+export { numberInputTokens }
+
 export { Overlay }
 
 export { OverlayProps }

package/components/NumberInput/NumberInput.config.d.ts

@@ -0,0 +1,38 @@
+export declare const config: {
+    defaults: {
+        view: string;
+        size: string;
+        shape: string;
+        inputBackgroundType: string;
+    };
+    variations: {
+        view: {
+            default: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+            secondary: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+            accent: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+            clear: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        };
+        size: {
+            l: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+            m: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+            s: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+            xs: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        };
+        shape: {
+            cornered: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+            pilled: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        };
+        inputBackgroundType: {
+            fill: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+            clear: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        };
+        segmentation: {
+            default: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+            segmented: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+            solid: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        };
+        disabled: {
+            true: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        };
+    };
+};

package/components/NumberInput/NumberInput.config.js

@@ -0,0 +1,47 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.config = void 0;
+var _styledComponents = /*#__PURE__*/require("@salutejs/plasma-new-hope/styled-components");
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+var config = exports.config = {
+  defaults: {
+    view: 'default',
+    size: 'l',
+    shape: 'cornered',
+    inputBackgroundType: 'fill'
+  },
+  variations: {
+    view: {
+      "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-accent);\n                ", ": var(--text-negative);\n                ", ": var(--surface-transparent-negative);\n\n                ", ": var(--text-primary);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--text-tertiary);\n                ", ": var(--inverse-text-tertiary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--inverse-surface-transparent-secondary);\n                ", ": var(--surface-solid-default);\n\n                ", ": var(--inverse-text-primary);\n                ", ": var(--surface-solid-default);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--inverse-text-primary-hover);\n                ", ": var(--surface-solid-default-hover);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--inverse-text-primary-active);\n                ", ": var(--surface-solid-default-active);\n\n                ", ": 0.4;\n\n                ", ": inherit;\n                ", ": inherit;\n            "])), _styledComponents.numberInputTokens.caretColor, _styledComponents.numberInputTokens.errorColor, _styledComponents.numberInputTokens.backgroundErrorColor, _styledComponents.numberInputTokens.color, _styledComponents.numberInputTokens.colorSolid, _styledComponents.numberInputTokens.additionalTextColor, _styledComponents.numberInputTokens.additionalTextColorSolid, _styledComponents.numberInputTokens.backgroundColorFocus, _styledComponents.numberInputTokens.backgroundColorSolidFocus, _styledComponents.numberInputTokens.backgroundColorSolid, _styledComponents.numberInputTokens.iconButtonColor, _styledComponents.numberInputTokens.iconButtonBackgroundColor, _styledComponents.numberInputTokens.iconButtonColorHover, _styledComponents.numberInputTokens.iconButtonColorSolidHover, _styledComponents.numberInputTokens.iconButtonBackgroundColorHover, _styledComponents.numberInputTokens.iconButtonColorActive, _styledComponents.numberInputTokens.iconButtonColorSolidActive, _styledComponents.numberInputTokens.iconButtonBackgroundColorActive, _styledComponents.numberInputTokens.actionButtonDisabledOpacity, _styledComponents.numberInputTokens.loaderSpinnerColor, _styledComponents.numberInputTokens.loaderSpinnerColorSolid),
+      secondary: /*#__PURE__*/(0, _styledComponents.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-accent);\n                ", ": var(--text-negative);\n                ", ": var(--surface-transparent-negative);\n\n                ", ": var(--text-primary);\n                ", ": var(--text-primary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--surface-transparent-secondary);\n\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--text-primary-hover);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--text-primary-active);\n                ", ": var(--surface-transparent-secondary-active);\n\n                ", ": 0.4;\n\n                ", ": inherit;\n                ", ": inherit;\n            "])), _styledComponents.numberInputTokens.caretColor, _styledComponents.numberInputTokens.errorColor, _styledComponents.numberInputTokens.backgroundErrorColor, _styledComponents.numberInputTokens.color, _styledComponents.numberInputTokens.colorSolid, _styledComponents.numberInputTokens.additionalTextColor, _styledComponents.numberInputTokens.additionalTextColorSolid, _styledComponents.numberInputTokens.backgroundColorFocus, _styledComponents.numberInputTokens.backgroundColorSolidFocus, _styledComponents.numberInputTokens.backgroundColorSolid, _styledComponents.numberInputTokens.iconButtonColor, _styledComponents.numberInputTokens.iconButtonBackgroundColor, _styledComponents.numberInputTokens.iconButtonColorHover, _styledComponents.numberInputTokens.iconButtonColorSolidHover, _styledComponents.numberInputTokens.iconButtonBackgroundColorHover, _styledComponents.numberInputTokens.iconButtonColorActive, _styledComponents.numberInputTokens.iconButtonColorSolidActive, _styledComponents.numberInputTokens.iconButtonBackgroundColorActive, _styledComponents.numberInputTokens.actionButtonDisabledOpacity, _styledComponents.numberInputTokens.loaderSpinnerColor, _styledComponents.numberInputTokens.loaderSpinnerColorSolid),
+      accent: /*#__PURE__*/(0, _styledComponents.css)(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-accent);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--text-negative);\n                ", ": var(--surface-transparent-negative);\n\n                ", ": var(--text-primary);\n                ", ": var(--on-dark-text-primary);\n                ", ": var(--text-tertiary);\n                ", ": var(--on-dark-text-tertiary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--on-dark-surface-transparent-secondary);\n                ", ": var(--surface-accent);\n\n                ", ": var(--on-dark-text-primary);\n                ", ": var(--surface-accent);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--on-dark-text-primary-hover);\n                ", ": var(--surface-accent-hover);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--on-dark-text-primary-active);\n                ", ": var(--surface-accent-active);\n\n                ", ": 0.4;\n\n                ", ": inherit;\n                ", ": inherit;\n            "])), _styledComponents.numberInputTokens.caretColor, _styledComponents.numberInputTokens.caretColorSolid, _styledComponents.numberInputTokens.errorColor, _styledComponents.numberInputTokens.backgroundErrorColor, _styledComponents.numberInputTokens.color, _styledComponents.numberInputTokens.colorSolid, _styledComponents.numberInputTokens.additionalTextColor, _styledComponents.numberInputTokens.additionalTextColorSolid, _styledComponents.numberInputTokens.backgroundColorFocus, _styledComponents.numberInputTokens.backgroundColorSolidFocus, _styledComponents.numberInputTokens.backgroundColorSolid, _styledComponents.numberInputTokens.iconButtonColor, _styledComponents.numberInputTokens.iconButtonBackgroundColor, _styledComponents.numberInputTokens.iconButtonColorHover, _styledComponents.numberInputTokens.iconButtonColorSolidHover, _styledComponents.numberInputTokens.iconButtonBackgroundColorHover, _styledComponents.numberInputTokens.iconButtonColorActive, _styledComponents.numberInputTokens.iconButtonColorSolidActive, _styledComponents.numberInputTokens.iconButtonBackgroundColorActive, _styledComponents.numberInputTokens.actionButtonDisabledOpacity, _styledComponents.numberInputTokens.loaderSpinnerColor, _styledComponents.numberInputTokens.loaderSpinnerColorSolid),
+      clear: /*#__PURE__*/(0, _styledComponents.css)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-accent);\n                ", ": var(--text-accent);\n                ", ": var(--text-negative);\n                ", ": var(--surface-transparent-negative);\n\n                ", ": var(--text-primary);\n                ", ": var(--text-primary);\n                ", ": var(--text-primary-hover);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": transparent;\n\n                ", ": var(--text-primary);\n                ", ": transparent;\n                ", ": var(--text-primary-hover);\n                ", ": transparent;\n                ", ": var(--text-primary-active);\n                ", ": transparent;\n\n                ", ": 0.4;\n\n                ", ": inherit;\n                ", ": inherit;\n            "])), _styledComponents.numberInputTokens.caretColor, _styledComponents.numberInputTokens.caretColorSolid, _styledComponents.numberInputTokens.errorColor, _styledComponents.numberInputTokens.backgroundErrorColor, _styledComponents.numberInputTokens.color, _styledComponents.numberInputTokens.colorSolid, _styledComponents.numberInputTokens.iconButtonColorSolidHover, _styledComponents.numberInputTokens.additionalTextColor, _styledComponents.numberInputTokens.additionalTextColorSolid, _styledComponents.numberInputTokens.backgroundColorFocus, _styledComponents.numberInputTokens.backgroundColorSolidFocus, _styledComponents.numberInputTokens.backgroundColorSolid, _styledComponents.numberInputTokens.iconButtonColor, _styledComponents.numberInputTokens.iconButtonBackgroundColor, _styledComponents.numberInputTokens.iconButtonColorHover, _styledComponents.numberInputTokens.iconButtonBackgroundColorHover, _styledComponents.numberInputTokens.iconButtonColorActive, _styledComponents.numberInputTokens.iconButtonBackgroundColorActive, _styledComponents.numberInputTokens.actionButtonDisabledOpacity, _styledComponents.numberInputTokens.loaderSpinnerColor, _styledComponents.numberInputTokens.loaderSpinnerColorSolid)
+    },
+    size: {
+      l: /*#__PURE__*/(0, _styledComponents.css)(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 11.75rem;\n                ", ": 3.5rem;\n                ", ": 3.5rem;\n                ", ": 1.5rem;\n                ", ": var(--plasma-typo-body-l-font-family);\n                ", ": var(--plasma-typo-body-l-font-size);\n                ", ": var(--plasma-typo-body-l-font-style);\n                ", ": var(--plasma-typo-body-l-bold-font-weight);\n                ", ": var(--plasma-typo-body-l-letter-spacing);\n                ", ": var(--plasma-typo-body-l-line-height);\n\n                ", ": 0.875rem;\n                ", ": 0.375rem;\n\n                ", ": 0 0.125rem;\n                ", ": 0.875rem;\n                ", ": 3.5rem;\n                ", ": 1.063rem 1.125rem;\n\n                ", ": var(--plasma-typo-body-l-font-family);\n                ", ": var(--plasma-typo-body-l-font-size);\n                ", ": var(--plasma-typo-body-l-font-style);\n                ", ": var(--plasma-typo-body-l-font-weight);\n                ", ": var(--plasma-typo-body-l-letter-spacing);\n                ", ": var(--plasma-typo-body-l-line-height);\n\n                ", ": 0.25rem;\n                ", ": 0.25rem;\n\n                ", ": 1.375rem;\n            "])), _styledComponents.numberInputTokens.rootMinWidth, _styledComponents.numberInputTokens.iconButtonHeight, _styledComponents.numberInputTokens.iconButtonWidth, _styledComponents.numberInputTokens.iconButtonPadding, _styledComponents.numberInputTokens.iconButtonFontFamily, _styledComponents.numberInputTokens.iconButtonFontSize, _styledComponents.numberInputTokens.iconButtonFontStyle, _styledComponents.numberInputTokens.iconButtonFontWeight, _styledComponents.numberInputTokens.iconButtonLetterSpacing, _styledComponents.numberInputTokens.iconButtonLineHeight, _styledComponents.numberInputTokens.iconButtonRadius, _styledComponents.numberInputTokens.iconButtonSegmentationRadius, _styledComponents.numberInputTokens.inputWrapperMargin, _styledComponents.numberInputTokens.inputWrapperBorderRadius, _styledComponents.numberInputTokens.textWrapperHeight, _styledComponents.numberInputTokens.textWrapperPadding, _styledComponents.numberInputTokens.fontFamily, _styledComponents.numberInputTokens.fontSize, _styledComponents.numberInputTokens.fontStyle, _styledComponents.numberInputTokens.fontWeight, _styledComponents.numberInputTokens.letterSpacing, _styledComponents.numberInputTokens.lineHeight, _styledComponents.numberInputTokens.textBeforeMarginRight, _styledComponents.numberInputTokens.textAfterMarginLeft, _styledComponents.numberInputTokens.loaderSpinnerSize),
+      m: /*#__PURE__*/(0, _styledComponents.css)(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 10.25rem;\n                ", ": 3rem;\n                ", ": 3rem;\n                ", ": 1.25rem;\n                ", ": var(--plasma-typo-body-m-font-family);\n                ", ": var(--plasma-typo-body-m-font-size);\n                ", ": var(--plasma-typo-body-m-font-style);\n                ", ": var(--plasma-typo-body-m-bold-font-weight);\n                ", ": var(--plasma-typo-body-m-letter-spacing);\n                ", ": var(--plasma-typo-body-m-line-height);\n\n                ", ": 0.75rem;\n                ", ": 0.25rem;\n\n                ", ": 0 0.125rem;\n                ", ": 0.75rem;\n                ", ": 3rem;\n                ", ": 0.875rem 1rem;\n\n                ", ": var(--plasma-typo-body-m-font-family);\n                ", ": var(--plasma-typo-body-m-font-size);\n                ", ": var(--plasma-typo-body-m-font-style);\n                ", ": var(--plasma-typo-body-m-font-weight);\n                ", ": var(--plasma-typo-body-m-letter-spacing);\n                ", ": var(--plasma-typo-body-m-line-height);\n\n                ", ": 0.25rem;\n                ", ": 0.25rem;\n\n                ", ": 1.375rem;\n            "])), _styledComponents.numberInputTokens.rootMinWidth, _styledComponents.numberInputTokens.iconButtonHeight, _styledComponents.numberInputTokens.iconButtonWidth, _styledComponents.numberInputTokens.iconButtonPadding, _styledComponents.numberInputTokens.iconButtonFontFamily, _styledComponents.numberInputTokens.iconButtonFontSize, _styledComponents.numberInputTokens.iconButtonFontStyle, _styledComponents.numberInputTokens.iconButtonFontWeight, _styledComponents.numberInputTokens.iconButtonLetterSpacing, _styledComponents.numberInputTokens.iconButtonLineHeight, _styledComponents.numberInputTokens.iconButtonRadius, _styledComponents.numberInputTokens.iconButtonSegmentationRadius, _styledComponents.numberInputTokens.inputWrapperMargin, _styledComponents.numberInputTokens.inputWrapperBorderRadius, _styledComponents.numberInputTokens.textWrapperHeight, _styledComponents.numberInputTokens.textWrapperPadding, _styledComponents.numberInputTokens.fontFamily, _styledComponents.numberInputTokens.fontSize, _styledComponents.numberInputTokens.fontStyle, _styledComponents.numberInputTokens.fontWeight, _styledComponents.numberInputTokens.letterSpacing, _styledComponents.numberInputTokens.lineHeight, _styledComponents.numberInputTokens.textBeforeMarginRight, _styledComponents.numberInputTokens.textAfterMarginLeft, _styledComponents.numberInputTokens.loaderSpinnerSize),
+      s: /*#__PURE__*/(0, _styledComponents.css)(_templateObject7 || (_templateObject7 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 8.75rem;\n                ", ": 2.5rem;\n                ", ": 2.5rem;\n                ", ": 1rem;\n                ", ": var(--plasma-typo-body-s-font-family);\n                ", ": var(--plasma-typo-body-s-font-size);\n                ", ": var(--plasma-typo-body-s-font-style);\n                ", ": var(--plasma-typo-body-s-bold-font-weight);\n                ", ": var(--plasma-typo-body-s-letter-spacing);\n                ", ": var(--plasma-typo-body-s-line-height);\n\n                ", ": 0.625rem;\n                ", ": 0.25rem;\n\n                ", ": 0 0.125rem;\n                ", ": 0.625rem;\n                ", ": 2.5rem;\n                ", ": 0.688rem 0.875rem;\n\n                ", ": var(--plasma-typo-body-s-font-family);\n                ", ": var(--plasma-typo-body-s-font-size);\n                ", ": var(--plasma-typo-body-s-font-style);\n                ", ": var(--plasma-typo-body-s-font-weight);\n                ", ": var(--plasma-typo-body-s-letter-spacing);\n                ", ": var(--plasma-typo-body-s-line-height);\n\n                ", ": 0.25rem;\n                ", ": 0.25rem;\n\n                ", ": 1.375rem;\n            "])), _styledComponents.numberInputTokens.rootMinWidth, _styledComponents.numberInputTokens.iconButtonHeight, _styledComponents.numberInputTokens.iconButtonWidth, _styledComponents.numberInputTokens.iconButtonPadding, _styledComponents.numberInputTokens.iconButtonFontFamily, _styledComponents.numberInputTokens.iconButtonFontSize, _styledComponents.numberInputTokens.iconButtonFontStyle, _styledComponents.numberInputTokens.iconButtonFontWeight, _styledComponents.numberInputTokens.iconButtonLetterSpacing, _styledComponents.numberInputTokens.iconButtonLineHeight, _styledComponents.numberInputTokens.iconButtonRadius, _styledComponents.numberInputTokens.iconButtonSegmentationRadius, _styledComponents.numberInputTokens.inputWrapperMargin, _styledComponents.numberInputTokens.inputWrapperBorderRadius, _styledComponents.numberInputTokens.textWrapperHeight, _styledComponents.numberInputTokens.textWrapperPadding, _styledComponents.numberInputTokens.fontFamily, _styledComponents.numberInputTokens.fontSize, _styledComponents.numberInputTokens.fontStyle, _styledComponents.numberInputTokens.fontWeight, _styledComponents.numberInputTokens.letterSpacing, _styledComponents.numberInputTokens.lineHeight, _styledComponents.numberInputTokens.textBeforeMarginRight, _styledComponents.numberInputTokens.textAfterMarginLeft, _styledComponents.numberInputTokens.loaderSpinnerSize),
+      xs: /*#__PURE__*/(0, _styledComponents.css)(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 6.875rem;\n                ", ": 2rem;\n                ", ": 2rem;\n                ", ": 0.75rem;\n                ", ": var(--plasma-typo-body-xs-font-family);\n                ", ": var(--plasma-typo-body-xs-font-size);\n                ", ": var(--plasma-typo-body-xs-font-style);\n                ", ": var(--plasma-typo-body-xs-bold-font-weight);\n                ", ": var(--plasma-typo-body-xs-letter-spacing);\n                ", ": var(--plasma-typo-body-xs-line-height);\n\n                ", ": 0.5rem;\n                ", ": 0.125rem;\n\n                ", ": 0 0.125rem;\n                ", ": 0.5rem;\n                ", ": 2rem;\n                ", ": 0.563rem 0.625rem;\n\n                ", ": var(--plasma-typo-body-xs-font-family);\n                ", ": var(--plasma-typo-body-xs-font-size);\n                ", ": var(--plasma-typo-body-xs-font-style);\n                ", ": var(--plasma-typo-body-xs-font-weight);\n                ", ": var(--plasma-typo-body-xs-letter-spacing);\n                ", ": var(--plasma-typo-body-xs-line-height);\n\n                ", ": 0.25rem;\n                ", ": 0.25rem;\n\n                ", ": 1rem;\n            "])), _styledComponents.numberInputTokens.rootMinWidth, _styledComponents.numberInputTokens.iconButtonHeight, _styledComponents.numberInputTokens.iconButtonWidth, _styledComponents.numberInputTokens.iconButtonPadding, _styledComponents.numberInputTokens.iconButtonFontFamily, _styledComponents.numberInputTokens.iconButtonFontSize, _styledComponents.numberInputTokens.iconButtonFontStyle, _styledComponents.numberInputTokens.iconButtonFontWeight, _styledComponents.numberInputTokens.iconButtonLetterSpacing, _styledComponents.numberInputTokens.iconButtonLineHeight, _styledComponents.numberInputTokens.iconButtonRadius, _styledComponents.numberInputTokens.iconButtonSegmentationRadius, _styledComponents.numberInputTokens.inputWrapperMargin, _styledComponents.numberInputTokens.inputWrapperBorderRadius, _styledComponents.numberInputTokens.textWrapperHeight, _styledComponents.numberInputTokens.textWrapperPadding, _styledComponents.numberInputTokens.fontFamily, _styledComponents.numberInputTokens.fontSize, _styledComponents.numberInputTokens.fontStyle, _styledComponents.numberInputTokens.fontWeight, _styledComponents.numberInputTokens.letterSpacing, _styledComponents.numberInputTokens.lineHeight, _styledComponents.numberInputTokens.textBeforeMarginRight, _styledComponents.numberInputTokens.textAfterMarginLeft, _styledComponents.numberInputTokens.loaderSpinnerSize)
+    },
+    shape: {
+      cornered: /*#__PURE__*/(0, _styledComponents.css)(_templateObject9 || (_templateObject9 = /*#__PURE__*/_taggedTemplateLiteral([""]))),
+      pilled: /*#__PURE__*/(0, _styledComponents.css)(_templateObject10 || (_templateObject10 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 50%;\n            "])), _styledComponents.numberInputTokens.iconButtonRadius)
+    },
+    inputBackgroundType: {
+      fill: /*#__PURE__*/(0, _styledComponents.css)(_templateObject11 || (_templateObject11 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--surface-transparent-primary);\n                ", ": var(--surface-transparent-primary);\n            "])), _styledComponents.numberInputTokens.backgroundColor, _styledComponents.numberInputTokens.backgroundColorHover),
+      clear: /*#__PURE__*/(0, _styledComponents.css)(_templateObject12 || (_templateObject12 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": transparent;\n                ", ": transparent;\n            "])), _styledComponents.numberInputTokens.backgroundColor, _styledComponents.numberInputTokens.backgroundColorHover)
+    },
+    segmentation: {
+      "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject13 || (_templateObject13 = /*#__PURE__*/_taggedTemplateLiteral([""]))),
+      segmented: /*#__PURE__*/(0, _styledComponents.css)(_templateObject14 || (_templateObject14 = /*#__PURE__*/_taggedTemplateLiteral([""]))),
+      solid: /*#__PURE__*/(0, _styledComponents.css)(_templateObject15 || (_templateObject15 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 0;\n            "])), _styledComponents.numberInputTokens.iconButtonSegmentationRadius)
+    },
+    disabled: {
+      "true": /*#__PURE__*/(0, _styledComponents.css)(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 0.4;\n            "])), _styledComponents.numberInputTokens.disabledOpacity)
+    }
+  }
+};

package/components/NumberInput/NumberInput.d.ts

@@ -0,0 +1,81 @@
+/// <reference types="react" />
+export declare const NumberInput: import("react").FunctionComponent<import("@salutejs/plasma-new-hope/types/engines/types").PropsType<{
+    view: {
+        default: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        secondary: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        accent: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        clear: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+    };
+    size: {
+        l: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        m: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        s: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        xs: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+    };
+    shape: {
+        cornered: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        pilled: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+    };
+    inputBackgroundType: {
+        fill: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        clear: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+    };
+    segmentation: {
+        default: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        segmented: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+        solid: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+    };
+    disabled: {
+        true: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
+    };
+}> & (({
+    value?: number | undefined;
+    min?: number | undefined;
+    max?: number | undefined;
+    step?: number | undefined;
+    isLoading?: boolean | undefined;
+    loader?: import("react").ReactNode;
+    size?: string | undefined;
+    view?: string | undefined;
+    clear?: boolean | undefined;
+    shape?: string | undefined;
+    disabled?: boolean | undefined;
+    textBefore?: string | undefined;
+    textAfter?: string | undefined;
+    customIncrementButton?: import("react").ReactNode;
+    incrementIcon?: import("react").ReactNode;
+    customDecrementButton?: import("react").ReactNode;
+    decrementIcon?: import("react").ReactNode;
+    isManualInput?: boolean | undefined;
+    onChange?: ((event: import("react").SyntheticEvent<HTMLInputElement, Event> | null, value: string | number) => void) | undefined;
+    onIncrement?: ((value: number) => void) | undefined;
+    onDecrement?: ((value: number) => void) | undefined;
+} & {
+    segmentation?: "clear" | undefined;
+    inputBackgroundType?: undefined;
+} & Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "onChange" | "size" | "value"> & import("react").RefAttributes<HTMLInputElement>) | ({
+    value?: number | undefined;
+    min?: number | undefined;
+    max?: number | undefined;
+    step?: number | undefined;
+    isLoading?: boolean | undefined;
+    loader?: import("react").ReactNode;
+    size?: string | undefined;
+    view?: string | undefined;
+    clear?: boolean | undefined;
+    shape?: string | undefined;
+    disabled?: boolean | undefined;
+    textBefore?: string | undefined;
+    textAfter?: string | undefined;
+    customIncrementButton?: import("react").ReactNode;
+    incrementIcon?: import("react").ReactNode;
+    customDecrementButton?: import("react").ReactNode;
+    decrementIcon?: import("react").ReactNode;
+    isManualInput?: boolean | undefined;
+    onChange?: ((event: import("react").SyntheticEvent<HTMLInputElement, Event> | null, value: string | number) => void) | undefined;
+    onIncrement?: ((value: number) => void) | undefined;
+    onDecrement?: ((value: number) => void) | undefined;
+} & {
+    segmentation?: string | undefined;
+    inputBackgroundType?: string | undefined;
+} & Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "onChange" | "size" | "value"> & import("react").RefAttributes<HTMLInputElement>))>;

package/components/NumberInput/NumberInput.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.NumberInput = void 0;
+var _styledComponents = /*#__PURE__*/require("@salutejs/plasma-new-hope/styled-components");
+var _NumberInput = /*#__PURE__*/require("./NumberInput.config");
+var mergedConfig = /*#__PURE__*/(0, _styledComponents.mergeConfig)(_styledComponents.numberInputConfig, _NumberInput.config);
+var NumberInput = exports.NumberInput = /*#__PURE__*/(0, _styledComponents.component)(mergedConfig);

package/components/NumberInput/index.d.ts

@@ -0,0 +1,2 @@
+export { NumberInput } from './NumberInput';
+export { numberInputTokens, numberInputClasses } from '@salutejs/plasma-new-hope/styled-components';

package/components/NumberInput/index.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "NumberInput", {
+  enumerable: true,
+  get: function get() {
+    return _NumberInput.NumberInput;
+  }
+});
+Object.defineProperty(exports, "numberInputClasses", {
+  enumerable: true,
+  get: function get() {
+    return _styledComponents.numberInputClasses;
+  }
+});
+Object.defineProperty(exports, "numberInputTokens", {
+  enumerable: true,
+  get: function get() {
+    return _styledComponents.numberInputTokens;
+  }
+});
+var _NumberInput = /*#__PURE__*/require("./NumberInput");
+var _styledComponents = /*#__PURE__*/require("@salutejs/plasma-new-hope/styled-components");

package/components/Steps/Steps.config.js

@@ -14,7 +14,7 @@ var config = exports.config = {
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-primary-hover);\n                ", ": solid var(--surface-solid-default);\n                ", ": var(--text-primary);\n                ", ": var(--surface-clear);\n\n                ", ": var(--inverse-text-primary);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--surface-solid-default);\n                ", ": var(--surface-solid-default-hover);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--surface-transparent-secondary-hover);\n\n                ", ": var(--text-secondary);\n\n                ", ": 0.4;\n            "])), _styledComponents.stepsTokens.activeTitleColor, _styledComponents.stepsTokens.activeTitleColorHover, _styledComponents.stepsTokens.activeIndicatorBorder, _styledComponents.stepsTokens.activeIndicatorColor, _styledComponents.stepsTokens.activeIndicatorBackground, _styledComponents.stepsTokens.completedIndicatorColor, _styledComponents.stepsTokens.completedIndicatorColorHover, _styledComponents.stepsTokens.completedIndicatorBackground, _styledComponents.stepsTokens.completedIndicatorBackgroundHover, _styledComponents.stepsTokens.inactiveTitleColor, _styledComponents.stepsTokens.inactiveTitleColorHover, _styledComponents.stepsTokens.inactiveIndicatorColor, _styledComponents.stepsTokens.inactiveIndicatorColorHover, _styledComponents.stepsTokens.inactiveIndicatorBackground, _styledComponents.stepsTokens.inactiveIndicatorBackgroundHover, _styledComponents.stepsTokens.contentColor, _styledComponents.stepsTokens.disabledOpacity)
+      "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-primary-hover);\n                ", ": solid var(--surface-solid-default);\n                ", ": var(--text-primary);\n                ", ": var(--surface-clear);\n\n                ", ": var(--inverse-text-primary);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--surface-solid-default);\n                ", ": var(--surface-solid-default-hover);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--surface-transparent-secondary-hover);\n\n                ", ": var(--text-secondary);\n                ", ": var(--surface-accent);\n\n                ", ": 0.4;\n            "])), _styledComponents.stepsTokens.activeTitleColor, _styledComponents.stepsTokens.activeTitleColorHover, _styledComponents.stepsTokens.activeIndicatorBorder, _styledComponents.stepsTokens.activeIndicatorColor, _styledComponents.stepsTokens.activeIndicatorBackground, _styledComponents.stepsTokens.completedIndicatorColor, _styledComponents.stepsTokens.completedIndicatorColorHover, _styledComponents.stepsTokens.completedIndicatorBackground, _styledComponents.stepsTokens.completedIndicatorBackgroundHover, _styledComponents.stepsTokens.inactiveTitleColor, _styledComponents.stepsTokens.inactiveTitleColorHover, _styledComponents.stepsTokens.inactiveIndicatorColor, _styledComponents.stepsTokens.inactiveIndicatorColorHover, _styledComponents.stepsTokens.inactiveIndicatorBackground, _styledComponents.stepsTokens.inactiveIndicatorBackgroundHover, _styledComponents.stepsTokens.contentColor, _styledComponents.stepsTokens.focusColor, _styledComponents.stepsTokens.disabledOpacity)
     },
     size: {
       l: /*#__PURE__*/(0, _styledComponents.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 1.5rem;\n                ", ": 2.25rem;\n                ", ": 0.5rem;\n                ", ": 1rem;\n\n                ", ": 0.75rem;\n                ", ": 0.375rem;\n                ", ": 2rem;\n                ", ": 1.0625rem;\n                ", ": 0.75rem;\n\n                ", ": 1rem;\n                ", ": 0.625rem;\n                ", ": 1.5rem;\n                ", ": 1.25rem;\n\n                ", ": var(--plasma-typo-body-xs-font-family);\n                ", ": var(--plasma-typo-body-xs-font-size);\n                ", ": var(--plasma-typo-body-xs-font-style);\n                ", ": var(--plasma-typo-body-xs-font-weight);\n                ", ": var(--plasma-typo-body-xs-letter-spacing);\n                ", ": var(--plasma-typo-body-xs-line-height);\n\n                ", ": var(--plasma-typo-body-s-font-family);\n                ", ": var(--plasma-typo-body-s-font-size);\n                ", ": var(--plasma-typo-body-s-font-style);\n                ", ": var(--plasma-typo-body-s-font-weight);\n                ", ": var(--plasma-typo-body-s-letter-spacing);\n                ", ": var(--plasma-typo-body-s-line-height);\n\n                ", ": var(--plasma-typo-body-l-font-family);\n                ", ": var(--plasma-typo-body-l-font-size);\n                ", ": var(--plasma-typo-body-l-font-style);\n                ", ": var(--plasma-typo-body-l-font-weight);\n                ", ": var(--plasma-typo-body-l-letter-spacing);\n                ", ": var(--plasma-typo-body-l-line-height);\n\n                ", ": var(--plasma-typo-body-m-font-family);\n                ", ": var(--plasma-typo-body-m-font-size);\n                ", ": var(--plasma-typo-body-m-font-style);\n                ", ": var(--plasma-typo-body-m-font-weight);\n                ", ": var(--plasma-typo-body-m-letter-spacing);\n                ", ": var(--plasma-typo-body-m-line-height);\n\n                ", ": 0.125rem;\n            "])), _styledComponents.stepsTokens.indicatorSize, _styledComponents.stepsTokens.activeIndicatorSize, _styledComponents.stepsTokens.bulletSize, _styledComponents.stepsTokens.activeBulletSize, _styledComponents.stepsTokens.titlePaddingTop, _styledComponents.stepsTokens.contentPaddingTop, _styledComponents.stepsTokens.contentSidePadding, _styledComponents.stepsTokens.contentVerticalPadding, _styledComponents.stepsTokens.verticalContentPaddingLeft, _styledComponents.stepsTokens.smallIndicatorIndentHeight, _styledComponents.stepsTokens.largeIndicatorIndentHeight, _styledComponents.stepsTokens.smallBulletIndentHeight, _styledComponents.stepsTokens.largeBulletIndentHeight, _styledComponents.stepsTokens.indicatorFontFamily, _styledComponents.stepsTokens.indicatorFontSize, _styledComponents.stepsTokens.indicatorFontStyle, _styledComponents.stepsTokens.indicatorFontWeight, _styledComponents.stepsTokens.indicatorLetterSpacing, _styledComponents.stepsTokens.indicatorLineHeight, _styledComponents.stepsTokens.activeIndicatorFontFamily, _styledComponents.stepsTokens.activeIndicatorFontSize, _styledComponents.stepsTokens.activeIndicatorFontStyle, _styledComponents.stepsTokens.activeIndicatorFontWeight, _styledComponents.stepsTokens.activeIndicatorLetterSpacing, _styledComponents.stepsTokens.activeIndicatorLineHeight, _styledComponents.stepsTokens.titleFontFamily, _styledComponents.stepsTokens.titleFontSize, _styledComponents.stepsTokens.titleFontStyle, _styledComponents.stepsTokens.titleFontWeight, _styledComponents.stepsTokens.titleLetterSpacing, _styledComponents.stepsTokens.titleLineHeight, _styledComponents.stepsTokens.contentFontFamily, _styledComponents.stepsTokens.contentFontSize, _styledComponents.stepsTokens.contentFontStyle, _styledComponents.stepsTokens.contentFontWeight, _styledComponents.stepsTokens.contentLetterSpacing, _styledComponents.stepsTokens.contentLineHeight, _styledComponents.stepsTokens.dividerThickness),

package/components/TextField/TextField.config.js

@@ -15,10 +15,10 @@ var config = exports.config = {
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-primary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--surface-transparent-primary);\n                ", ": var(--surface-transparent-primary-hover);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-transparent-tertiary);\n                ", ": var(--text-secondary);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), _styledComponents.textFieldTokens.color, _styledComponents.textFieldTokens.clearColor, _styledComponents.textFieldTokens.placeholderColorFocus, _styledComponents.textFieldTokens.clearPlaceholderColor, _styledComponents.textFieldTokens.clearPlaceholderColorFocus, _styledComponents.textFieldTokens.backgroundColor, _styledComponents.textFieldTokens.backgroundColorHover, _styledComponents.textFieldTokens.backgroundColorFocus, _styledComponents.textFieldTokens.caretColor, _styledComponents.textFieldTokens.placeholderColor, _styledComponents.textFieldTokens.textBeforeColor, _styledComponents.textFieldTokens.textAfterColor, _styledComponents.textFieldTokens.labelColor, _styledComponents.textFieldTokens.leftHelperColor, _styledComponents.textFieldTokens.titleCaptionColor, _styledComponents.textFieldTokens.hintIconColor, _styledComponents.textFieldTokens.contentSlotColor, _styledComponents.textFieldTokens.contentSlotColorHover, _styledComponents.textFieldTokens.contentSlotColorActive, _styledComponents.textFieldTokens.dividerColor, _styledComponents.textFieldTokens.dividerColorHover, _styledComponents.textFieldTokens.dividerColorFocus, _styledComponents.textFieldTokens.chipCloseIconColor, _styledComponents.textFieldTokens.chipColor, _styledComponents.textFieldTokens.chipBackground, _styledComponents.textFieldTokens.chipColorHover, _styledComponents.textFieldTokens.chipBackgroundHover, _styledComponents.textFieldTokens.chipColorActive, _styledComponents.textFieldTokens.chipBackgroundActive, _styledComponents.textFieldTokens.chipBackgroundReadOnly, _styledComponents.textFieldTokens.chipColorReadOnly, _styledComponents.textFieldTokens.chipBackgroundReadOnlyHover, _styledComponents.textFieldTokens.chipColorReadOnlyHover, _styledComponents.textFieldTokens.chipOpacityReadonly, _styledComponents.textFieldTokens.focusColor, _styledComponents.textFieldTokens.indicatorColor, _styledComponents.textFieldTokens.optionalColor),
-      positive: /*#__PURE__*/(0, _styledComponents.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-positive);\n                ", ": var(--text-positive);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-positive);\n                ", ": var(--surface-transparent-positive);\n                ", ": var(--surface-transparent-positive-hover);\n                ", ": var(--surface-transparent-positive-active);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-positive);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-positive);\n                ", ": var(--surface-positive);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), _styledComponents.textFieldTokens.color, _styledComponents.textFieldTokens.clearColor, _styledComponents.textFieldTokens.clearPlaceholderColor, _styledComponents.textFieldTokens.placeholderColorFocus, _styledComponents.textFieldTokens.clearPlaceholderColorFocus, _styledComponents.textFieldTokens.backgroundColor, _styledComponents.textFieldTokens.backgroundColorHover, _styledComponents.textFieldTokens.backgroundColorFocus, _styledComponents.textFieldTokens.caretColor, _styledComponents.textFieldTokens.placeholderColor, _styledComponents.textFieldTokens.textBeforeColor, _styledComponents.textFieldTokens.textAfterColor, _styledComponents.textFieldTokens.labelColor, _styledComponents.textFieldTokens.leftHelperColor, _styledComponents.textFieldTokens.titleCaptionColor, _styledComponents.textFieldTokens.hintIconColor, _styledComponents.textFieldTokens.contentSlotColor, _styledComponents.textFieldTokens.contentSlotColorHover, _styledComponents.textFieldTokens.contentSlotColorActive, _styledComponents.textFieldTokens.dividerColor, _styledComponents.textFieldTokens.dividerColorHover, _styledComponents.textFieldTokens.dividerColorFocus, _styledComponents.textFieldTokens.chipCloseIconColor, _styledComponents.textFieldTokens.chipColor, _styledComponents.textFieldTokens.chipBackground, _styledComponents.textFieldTokens.chipColorHover, _styledComponents.textFieldTokens.chipBackgroundHover, _styledComponents.textFieldTokens.chipColorActive, _styledComponents.textFieldTokens.chipBackgroundActive, _styledComponents.textFieldTokens.chipBackgroundReadOnly, _styledComponents.textFieldTokens.chipColorReadOnly, _styledComponents.textFieldTokens.chipBackgroundReadOnlyHover, _styledComponents.textFieldTokens.chipColorReadOnlyHover, _styledComponents.textFieldTokens.chipOpacityReadonly, _styledComponents.textFieldTokens.focusColor, _styledComponents.textFieldTokens.indicatorColor, _styledComponents.textFieldTokens.optionalColor),
-      warning: /*#__PURE__*/(0, _styledComponents.css)(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-warning);\n                ", ": var(--text-warning);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-warning);\n                ", ": var(--surface-transparent-warning);\n                ", ": var(--surface-transparent-warning-hover);\n                ", ": var(--surface-transparent-warning-active);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-warning);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-warning);\n                ", ": var(--surface-warning);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), _styledComponents.textFieldTokens.color, _styledComponents.textFieldTokens.clearColor, _styledComponents.textFieldTokens.clearPlaceholderColor, _styledComponents.textFieldTokens.placeholderColorFocus, _styledComponents.textFieldTokens.clearPlaceholderColorFocus, _styledComponents.textFieldTokens.backgroundColor, _styledComponents.textFieldTokens.backgroundColorHover, _styledComponents.textFieldTokens.backgroundColorFocus, _styledComponents.textFieldTokens.caretColor, _styledComponents.textFieldTokens.placeholderColor, _styledComponents.textFieldTokens.textBeforeColor, _styledComponents.textFieldTokens.textAfterColor, _styledComponents.textFieldTokens.labelColor, _styledComponents.textFieldTokens.leftHelperColor, _styledComponents.textFieldTokens.titleCaptionColor, _styledComponents.textFieldTokens.hintIconColor, _styledComponents.textFieldTokens.contentSlotColor, _styledComponents.textFieldTokens.contentSlotColorHover, _styledComponents.textFieldTokens.contentSlotColorActive, _styledComponents.textFieldTokens.dividerColor, _styledComponents.textFieldTokens.dividerColorHover, _styledComponents.textFieldTokens.dividerColorFocus, _styledComponents.textFieldTokens.chipCloseIconColor, _styledComponents.textFieldTokens.chipColor, _styledComponents.textFieldTokens.chipBackground, _styledComponents.textFieldTokens.chipColorHover, _styledComponents.textFieldTokens.chipBackgroundHover, _styledComponents.textFieldTokens.chipColorActive, _styledComponents.textFieldTokens.chipBackgroundActive, _styledComponents.textFieldTokens.chipBackgroundReadOnly, _styledComponents.textFieldTokens.chipColorReadOnly, _styledComponents.textFieldTokens.chipBackgroundReadOnlyHover, _styledComponents.textFieldTokens.chipColorReadOnlyHover, _styledComponents.textFieldTokens.chipOpacityReadonly, _styledComponents.textFieldTokens.focusColor, _styledComponents.textFieldTokens.indicatorColor, _styledComponents.textFieldTokens.optionalColor),
-      negative: /*#__PURE__*/(0, _styledComponents.css)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-negative);\n                ", ": var(--text-negative);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-negative);\n                ", ": var(--surface-transparent-negative);\n                ", ": var(--surface-transparent-negative-hover);\n                ", ": var(--surface-transparent-negative-active);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-negative);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-negative);\n                ", ": var(--surface-negative);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), _styledComponents.textFieldTokens.color, _styledComponents.textFieldTokens.clearColor, _styledComponents.textFieldTokens.clearPlaceholderColor, _styledComponents.textFieldTokens.placeholderColorFocus, _styledComponents.textFieldTokens.clearPlaceholderColorFocus, _styledComponents.textFieldTokens.backgroundColor, _styledComponents.textFieldTokens.backgroundColorHover, _styledComponents.textFieldTokens.backgroundColorFocus, _styledComponents.textFieldTokens.caretColor, _styledComponents.textFieldTokens.placeholderColor, _styledComponents.textFieldTokens.textBeforeColor, _styledComponents.textFieldTokens.textAfterColor, _styledComponents.textFieldTokens.labelColor, _styledComponents.textFieldTokens.leftHelperColor, _styledComponents.textFieldTokens.titleCaptionColor, _styledComponents.textFieldTokens.hintIconColor, _styledComponents.textFieldTokens.contentSlotColor, _styledComponents.textFieldTokens.contentSlotColorHover, _styledComponents.textFieldTokens.contentSlotColorActive, _styledComponents.textFieldTokens.dividerColor, _styledComponents.textFieldTokens.dividerColorHover, _styledComponents.textFieldTokens.dividerColorFocus, _styledComponents.textFieldTokens.chipCloseIconColor, _styledComponents.textFieldTokens.chipColor, _styledComponents.textFieldTokens.chipBackground, _styledComponents.textFieldTokens.chipColorHover, _styledComponents.textFieldTokens.chipBackgroundHover, _styledComponents.textFieldTokens.chipColorActive, _styledComponents.textFieldTokens.chipBackgroundActive, _styledComponents.textFieldTokens.chipBackgroundReadOnly, _styledComponents.textFieldTokens.chipColorReadOnly, _styledComponents.textFieldTokens.chipBackgroundReadOnlyHover, _styledComponents.textFieldTokens.chipColorReadOnlyHover, _styledComponents.textFieldTokens.chipOpacityReadonly, _styledComponents.textFieldTokens.focusColor, _styledComponents.textFieldTokens.indicatorColor, _styledComponents.textFieldTokens.optionalColor)
+      "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-primary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--surface-transparent-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-transparent-tertiary);\n                ", ": var(--text-secondary);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), _styledComponents.textFieldTokens.color, _styledComponents.textFieldTokens.clearColor, _styledComponents.textFieldTokens.placeholderColorFocus, _styledComponents.textFieldTokens.clearPlaceholderColor, _styledComponents.textFieldTokens.clearPlaceholderColorFocus, _styledComponents.textFieldTokens.backgroundColor, _styledComponents.textFieldTokens.backgroundColorFocus, _styledComponents.textFieldTokens.caretColor, _styledComponents.textFieldTokens.placeholderColor, _styledComponents.textFieldTokens.textBeforeColor, _styledComponents.textFieldTokens.textAfterColor, _styledComponents.textFieldTokens.labelColor, _styledComponents.textFieldTokens.leftHelperColor, _styledComponents.textFieldTokens.titleCaptionColor, _styledComponents.textFieldTokens.hintIconColor, _styledComponents.textFieldTokens.contentSlotColor, _styledComponents.textFieldTokens.contentSlotColorHover, _styledComponents.textFieldTokens.contentSlotColorActive, _styledComponents.textFieldTokens.dividerColor, _styledComponents.textFieldTokens.dividerColorHover, _styledComponents.textFieldTokens.dividerColorFocus, _styledComponents.textFieldTokens.chipCloseIconColor, _styledComponents.textFieldTokens.chipColor, _styledComponents.textFieldTokens.chipBackground, _styledComponents.textFieldTokens.chipColorHover, _styledComponents.textFieldTokens.chipBackgroundHover, _styledComponents.textFieldTokens.chipColorActive, _styledComponents.textFieldTokens.chipBackgroundActive, _styledComponents.textFieldTokens.chipBackgroundReadOnly, _styledComponents.textFieldTokens.chipColorReadOnly, _styledComponents.textFieldTokens.chipBackgroundReadOnlyHover, _styledComponents.textFieldTokens.chipColorReadOnlyHover, _styledComponents.textFieldTokens.chipOpacityReadonly, _styledComponents.textFieldTokens.focusColor, _styledComponents.textFieldTokens.indicatorColor, _styledComponents.textFieldTokens.optionalColor),
+      positive: /*#__PURE__*/(0, _styledComponents.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-positive);\n                ", ": var(--text-positive);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-positive);\n                ", ": var(--surface-transparent-positive);\n                ", ": var(--surface-transparent-positive-active);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-positive);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-positive);\n                ", ": var(--surface-positive);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), _styledComponents.textFieldTokens.color, _styledComponents.textFieldTokens.clearColor, _styledComponents.textFieldTokens.clearPlaceholderColor, _styledComponents.textFieldTokens.placeholderColorFocus, _styledComponents.textFieldTokens.clearPlaceholderColorFocus, _styledComponents.textFieldTokens.backgroundColor, _styledComponents.textFieldTokens.backgroundColorFocus, _styledComponents.textFieldTokens.caretColor, _styledComponents.textFieldTokens.placeholderColor, _styledComponents.textFieldTokens.textBeforeColor, _styledComponents.textFieldTokens.textAfterColor, _styledComponents.textFieldTokens.labelColor, _styledComponents.textFieldTokens.leftHelperColor, _styledComponents.textFieldTokens.titleCaptionColor, _styledComponents.textFieldTokens.hintIconColor, _styledComponents.textFieldTokens.contentSlotColor, _styledComponents.textFieldTokens.contentSlotColorHover, _styledComponents.textFieldTokens.contentSlotColorActive, _styledComponents.textFieldTokens.dividerColor, _styledComponents.textFieldTokens.dividerColorHover, _styledComponents.textFieldTokens.dividerColorFocus, _styledComponents.textFieldTokens.chipCloseIconColor, _styledComponents.textFieldTokens.chipColor, _styledComponents.textFieldTokens.chipBackground, _styledComponents.textFieldTokens.chipColorHover, _styledComponents.textFieldTokens.chipBackgroundHover, _styledComponents.textFieldTokens.chipColorActive, _styledComponents.textFieldTokens.chipBackgroundActive, _styledComponents.textFieldTokens.chipBackgroundReadOnly, _styledComponents.textFieldTokens.chipColorReadOnly, _styledComponents.textFieldTokens.chipBackgroundReadOnlyHover, _styledComponents.textFieldTokens.chipColorReadOnlyHover, _styledComponents.textFieldTokens.chipOpacityReadonly, _styledComponents.textFieldTokens.focusColor, _styledComponents.textFieldTokens.indicatorColor, _styledComponents.textFieldTokens.optionalColor),
+      warning: /*#__PURE__*/(0, _styledComponents.css)(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-warning);\n                ", ": var(--text-warning);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-warning);\n                ", ": var(--surface-transparent-warning);\n                ", ": var(--surface-transparent-warning-active);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-warning);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-warning);\n                ", ": var(--surface-warning);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), _styledComponents.textFieldTokens.color, _styledComponents.textFieldTokens.clearColor, _styledComponents.textFieldTokens.clearPlaceholderColor, _styledComponents.textFieldTokens.placeholderColorFocus, _styledComponents.textFieldTokens.clearPlaceholderColorFocus, _styledComponents.textFieldTokens.backgroundColor, _styledComponents.textFieldTokens.backgroundColorFocus, _styledComponents.textFieldTokens.caretColor, _styledComponents.textFieldTokens.placeholderColor, _styledComponents.textFieldTokens.textBeforeColor, _styledComponents.textFieldTokens.textAfterColor, _styledComponents.textFieldTokens.labelColor, _styledComponents.textFieldTokens.leftHelperColor, _styledComponents.textFieldTokens.titleCaptionColor, _styledComponents.textFieldTokens.hintIconColor, _styledComponents.textFieldTokens.contentSlotColor, _styledComponents.textFieldTokens.contentSlotColorHover, _styledComponents.textFieldTokens.contentSlotColorActive, _styledComponents.textFieldTokens.dividerColor, _styledComponents.textFieldTokens.dividerColorHover, _styledComponents.textFieldTokens.dividerColorFocus, _styledComponents.textFieldTokens.chipCloseIconColor, _styledComponents.textFieldTokens.chipColor, _styledComponents.textFieldTokens.chipBackground, _styledComponents.textFieldTokens.chipColorHover, _styledComponents.textFieldTokens.chipBackgroundHover, _styledComponents.textFieldTokens.chipColorActive, _styledComponents.textFieldTokens.chipBackgroundActive, _styledComponents.textFieldTokens.chipBackgroundReadOnly, _styledComponents.textFieldTokens.chipColorReadOnly, _styledComponents.textFieldTokens.chipBackgroundReadOnlyHover, _styledComponents.textFieldTokens.chipColorReadOnlyHover, _styledComponents.textFieldTokens.chipOpacityReadonly, _styledComponents.textFieldTokens.focusColor, _styledComponents.textFieldTokens.indicatorColor, _styledComponents.textFieldTokens.optionalColor),
+      negative: /*#__PURE__*/(0, _styledComponents.css)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-negative);\n                ", ": var(--text-negative);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-negative);\n                ", ": var(--surface-transparent-negative);\n                ", ": var(--surface-transparent-negative-active);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-negative);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-negative);\n                ", ": var(--surface-negative);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), _styledComponents.textFieldTokens.color, _styledComponents.textFieldTokens.clearColor, _styledComponents.textFieldTokens.clearPlaceholderColor, _styledComponents.textFieldTokens.placeholderColorFocus, _styledComponents.textFieldTokens.clearPlaceholderColorFocus, _styledComponents.textFieldTokens.backgroundColor, _styledComponents.textFieldTokens.backgroundColorFocus, _styledComponents.textFieldTokens.caretColor, _styledComponents.textFieldTokens.placeholderColor, _styledComponents.textFieldTokens.textBeforeColor, _styledComponents.textFieldTokens.textAfterColor, _styledComponents.textFieldTokens.labelColor, _styledComponents.textFieldTokens.leftHelperColor, _styledComponents.textFieldTokens.titleCaptionColor, _styledComponents.textFieldTokens.hintIconColor, _styledComponents.textFieldTokens.contentSlotColor, _styledComponents.textFieldTokens.contentSlotColorHover, _styledComponents.textFieldTokens.contentSlotColorActive, _styledComponents.textFieldTokens.dividerColor, _styledComponents.textFieldTokens.dividerColorHover, _styledComponents.textFieldTokens.dividerColorFocus, _styledComponents.textFieldTokens.chipCloseIconColor, _styledComponents.textFieldTokens.chipColor, _styledComponents.textFieldTokens.chipBackground, _styledComponents.textFieldTokens.chipColorHover, _styledComponents.textFieldTokens.chipBackgroundHover, _styledComponents.textFieldTokens.chipColorActive, _styledComponents.textFieldTokens.chipBackgroundActive, _styledComponents.textFieldTokens.chipBackgroundReadOnly, _styledComponents.textFieldTokens.chipColorReadOnly, _styledComponents.textFieldTokens.chipBackgroundReadOnlyHover, _styledComponents.textFieldTokens.chipColorReadOnlyHover, _styledComponents.textFieldTokens.chipOpacityReadonly, _styledComponents.textFieldTokens.focusColor, _styledComponents.textFieldTokens.indicatorColor, _styledComponents.textFieldTokens.optionalColor)
     },
     size: {
       l: /*#__PURE__*/(0, _styledComponents.css)(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 3.5rem;\n                ", ": 1.0625rem 1.125rem 1.0625rem 1.125rem;\n                ", ": 0.375rem;\n                ", ": 0.875rem;\n\n                ", ": -0.0625rem 0.5rem -0.0625rem -0.125rem;\n                ", ": -0.0625rem -0.125rem -0.0625rem 0.75rem;\n\n                ", ": var(--plasma-typo-body-l-font-family);\n                ", ": var(--plasma-typo-body-l-font-size);\n                ", ": var(--plasma-typo-body-l-font-style);\n                ", ": var(--plasma-typo-body-l-font-weight);\n                ", ": var(--plasma-typo-body-l-letter-spacing);\n                ", ": var(--plasma-typo-body-l-line-height);\n\n                ", ": 0.75rem;\n                ", ": 0.25rem;\n                ", ": var(--plasma-typo-body-l-font-family);\n                ", ": var(--plasma-typo-body-l-font-size);\n                ", ": var(--plasma-typo-body-l-font-style);\n                ", ": var(--plasma-typo-body-l-font-weight);\n                ", ": var(--plasma-typo-body-l-letter-spacing);\n                ", ": var(--plasma-typo-body-l-line-height);\n\n                ", ": -0.688rem -0.5rem;\n                ", ": 2.375rem;\n                ", ": -0.751rem -2rem auto auto;\n                ", ": 0.562rem -2.063rem auto auto;\n\n                ", ": 0.25rem;\n                ", ": var(--plasma-typo-body-xs-font-family);\n                ", ": var(--plasma-typo-body-xs-font-size);\n                ", ": var(--plasma-typo-body-xs-font-style);\n                ", ": var(--plasma-typo-body-xs-font-weight);\n                ", ": var(--plasma-typo-body-xs-letter-spacing);\n                ", ": var(--plasma-typo-body-xs-line-height);\n\n                ", ": 0.25rem;\n                ", ": var(--plasma-typo-body-xs-font-family);\n                ", ": var(--plasma-typo-body-xs-font-size);\n                ", ": var(--plasma-typo-body-xs-font-style);\n                ", ": var(--plasma-typo-body-xs-font-weight);\n                ", ": var(--plasma-typo-body-xs-letter-spacing);\n                ", ": var(--plasma-typo-body-xs-line-height);\n\n                ", ": 0.5625rem 0 0.125rem 0;\n                ", ": 1.5625rem 0 0.5625rem 0;\n                ", ": 0 0.25rem 0 0;\n                ", ": 0 0 0 0.25rem;\n\n                ", ": 0.25rem;\n                ", ": 0.5rem;\n                ", ": auto;\n                ", ": 2.75rem;\n                ", ": 0.75rem;\n                ", ": 1rem;\n                ", ": 0.625rem;\n                ", ": 0rem;\n                ", ": 1.5rem;\n                ", ": var(--plasma-typo-body-l-font-family);\n                ", ": var(--plasma-typo-body-l-font-size);\n                ", ": var(--plasma-typo-body-l-font-style);\n                ", ": var(--plasma-typo-body-l-font-weight);\n                ", ": var(--plasma-typo-body-l-letter-spacing);\n                ", ": var(--plasma-typo-body-l-line-height);\n\n                ", ": 0.5rem;\n                ", ": 0.375rem;\n                ", ": 0 0 0 0;\n                ", ": 0.5rem auto auto -0.75rem;\n                ", ": 0 0 auto auto;\n                ", ": 0.25rem -0.625rem auto auto;\n                ", ": 1.5rem auto auto -0.875rem;\n                ", ": 1.5rem -0.875rem auto auto;\n                ", ": 1.5rem -2.25rem auto auto;\n            "])), _styledComponents.textFieldTokens.height, _styledComponents.textFieldTokens.padding, _styledComponents.textFieldTokens.paddingWithChips, _styledComponents.textFieldTokens.borderRadius, _styledComponents.textFieldTokens.leftContentMargin, _styledComponents.textFieldTokens.rightContentMargin, _styledComponents.textFieldTokens.fontFamily, _styledComponents.textFieldTokens.fontSize, _styledComponents.textFieldTokens.fontStyle, _styledComponents.textFieldTokens.fontWeight, _styledComponents.textFieldTokens.letterSpacing, _styledComponents.textFieldTokens.lineHeight, _styledComponents.textFieldTokens.labelOffset, _styledComponents.textFieldTokens.clearLabelOffset, _styledComponents.textFieldTokens.labelFontFamily, _styledComponents.textFieldTokens.labelFontSize, _styledComponents.textFieldTokens.labelFontStyle, _styledComponents.textFieldTokens.labelFontWeight, _styledComponents.textFieldTokens.labelLetterSpacing, _styledComponents.textFieldTokens.labelLineHeight, _styledComponents.textFieldTokens.hintMargin, _styledComponents.textFieldTokens.hintTargetSize, _styledComponents.textFieldTokens.hintInnerLabelPlacementOffset, _styledComponents.textFieldTokens.clearHintInnerLabelPlacementOffset, _styledComponents.textFieldTokens.titleCaptionInnerLabelOffset, _styledComponents.textFieldTokens.titleCaptionFontFamily, _styledComponents.textFieldTokens.titleCaptionFontSize, _styledComponents.textFieldTokens.titleCaptionFontStyle, _styledComponents.textFieldTokens.titleCaptionFontWeight, _styledComponents.textFieldTokens.titleCaptionLetterSpacing, _styledComponents.textFieldTokens.titleCaptionLineHeight, _styledComponents.textFieldTokens.leftHelperOffset, _styledComponents.textFieldTokens.leftHelperFontFamily, _styledComponents.textFieldTokens.leftHelperFontSize, _styledComponents.textFieldTokens.leftHelperFontStyle, _styledComponents.textFieldTokens.leftHelperFontWeight, _styledComponents.textFieldTokens.leftHelperLetterSpacing, _styledComponents.textFieldTokens.leftHelperLineHeight, _styledComponents.textFieldTokens.labelInnerPadding, _styledComponents.textFieldTokens.contentLabelInnerPadding, _styledComponents.textFieldTokens.textBeforeMargin, _styledComponents.textFieldTokens.textAfterMargin, _styledComponents.textFieldTokens.chipGap, _styledComponents.textFieldTokens.chipBorderRadius, _styledComponents.textFieldTokens.chipWidth, _styledComponents.textFieldTokens.chipHeight, _styledComponents.textFieldTokens.chipPaddingRight, _styledComponents.textFieldTokens.chipPaddingLeft, _styledComponents.textFieldTokens.chipClearContentMarginLeft, _styledComponents.textFieldTokens.chipClearContentMarginRight, _styledComponents.textFieldTokens.chipCloseIconSize, _styledComponents.textFieldTokens.chipFontFamily, _styledComponents.textFieldTokens.chipFontSize, _styledComponents.textFieldTokens.chipFontStyle, _styledComponents.textFieldTokens.chipFontWeight, _styledComponents.textFieldTokens.chipLetterSpacing, _styledComponents.textFieldTokens.chipLineHeight, _styledComponents.textFieldTokens.indicatorSizeInner, _styledComponents.textFieldTokens.indicatorSizeOuter, _styledComponents.textFieldTokens.indicatorLabelPlacementInner, _styledComponents.textFieldTokens.indicatorLabelPlacementOuter, _styledComponents.textFieldTokens.indicatorLabelPlacementInnerRight, _styledComponents.textFieldTokens.indicatorLabelPlacementOuterRight, _styledComponents.textFieldTokens.clearIndicatorLabelPlacementInner, _styledComponents.textFieldTokens.clearIndicatorLabelPlacementInnerRight, _styledComponents.textFieldTokens.clearIndicatorHintInnerRight),

package/es/components/NumberInput/NumberInput.config.js

@@ -0,0 +1,41 @@
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+import { css, numberInputTokens as tokens } from '@salutejs/plasma-new-hope/styled-components';
+export var config = {
+  defaults: {
+    view: 'default',
+    size: 'l',
+    shape: 'cornered',
+    inputBackgroundType: 'fill'
+  },
+  variations: {
+    view: {
+      "default": /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-accent);\n                ", ": var(--text-negative);\n                ", ": var(--surface-transparent-negative);\n\n                ", ": var(--text-primary);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--text-tertiary);\n                ", ": var(--inverse-text-tertiary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--inverse-surface-transparent-secondary);\n                ", ": var(--surface-solid-default);\n\n                ", ": var(--inverse-text-primary);\n                ", ": var(--surface-solid-default);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--inverse-text-primary-hover);\n                ", ": var(--surface-solid-default-hover);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--inverse-text-primary-active);\n                ", ": var(--surface-solid-default-active);\n\n                ", ": 0.4;\n\n                ", ": inherit;\n                ", ": inherit;\n            "])), tokens.caretColor, tokens.errorColor, tokens.backgroundErrorColor, tokens.color, tokens.colorSolid, tokens.additionalTextColor, tokens.additionalTextColorSolid, tokens.backgroundColorFocus, tokens.backgroundColorSolidFocus, tokens.backgroundColorSolid, tokens.iconButtonColor, tokens.iconButtonBackgroundColor, tokens.iconButtonColorHover, tokens.iconButtonColorSolidHover, tokens.iconButtonBackgroundColorHover, tokens.iconButtonColorActive, tokens.iconButtonColorSolidActive, tokens.iconButtonBackgroundColorActive, tokens.actionButtonDisabledOpacity, tokens.loaderSpinnerColor, tokens.loaderSpinnerColorSolid),
+      secondary: /*#__PURE__*/css(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-accent);\n                ", ": var(--text-negative);\n                ", ": var(--surface-transparent-negative);\n\n                ", ": var(--text-primary);\n                ", ": var(--text-primary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--surface-transparent-secondary);\n\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--text-primary-hover);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--text-primary-active);\n                ", ": var(--surface-transparent-secondary-active);\n\n                ", ": 0.4;\n\n                ", ": inherit;\n                ", ": inherit;\n            "])), tokens.caretColor, tokens.errorColor, tokens.backgroundErrorColor, tokens.color, tokens.colorSolid, tokens.additionalTextColor, tokens.additionalTextColorSolid, tokens.backgroundColorFocus, tokens.backgroundColorSolidFocus, tokens.backgroundColorSolid, tokens.iconButtonColor, tokens.iconButtonBackgroundColor, tokens.iconButtonColorHover, tokens.iconButtonColorSolidHover, tokens.iconButtonBackgroundColorHover, tokens.iconButtonColorActive, tokens.iconButtonColorSolidActive, tokens.iconButtonBackgroundColorActive, tokens.actionButtonDisabledOpacity, tokens.loaderSpinnerColor, tokens.loaderSpinnerColorSolid),
+      accent: /*#__PURE__*/css(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-accent);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--text-negative);\n                ", ": var(--surface-transparent-negative);\n\n                ", ": var(--text-primary);\n                ", ": var(--on-dark-text-primary);\n                ", ": var(--text-tertiary);\n                ", ": var(--on-dark-text-tertiary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--on-dark-surface-transparent-secondary);\n                ", ": var(--surface-accent);\n\n                ", ": var(--on-dark-text-primary);\n                ", ": var(--surface-accent);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--on-dark-text-primary-hover);\n                ", ": var(--surface-accent-hover);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--on-dark-text-primary-active);\n                ", ": var(--surface-accent-active);\n\n                ", ": 0.4;\n\n                ", ": inherit;\n                ", ": inherit;\n            "])), tokens.caretColor, tokens.caretColorSolid, tokens.errorColor, tokens.backgroundErrorColor, tokens.color, tokens.colorSolid, tokens.additionalTextColor, tokens.additionalTextColorSolid, tokens.backgroundColorFocus, tokens.backgroundColorSolidFocus, tokens.backgroundColorSolid, tokens.iconButtonColor, tokens.iconButtonBackgroundColor, tokens.iconButtonColorHover, tokens.iconButtonColorSolidHover, tokens.iconButtonBackgroundColorHover, tokens.iconButtonColorActive, tokens.iconButtonColorSolidActive, tokens.iconButtonBackgroundColorActive, tokens.actionButtonDisabledOpacity, tokens.loaderSpinnerColor, tokens.loaderSpinnerColorSolid),
+      clear: /*#__PURE__*/css(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-accent);\n                ", ": var(--text-accent);\n                ", ": var(--text-negative);\n                ", ": var(--surface-transparent-negative);\n\n                ", ": var(--text-primary);\n                ", ": var(--text-primary);\n                ", ": var(--text-primary-hover);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": transparent;\n\n                ", ": var(--text-primary);\n                ", ": transparent;\n                ", ": var(--text-primary-hover);\n                ", ": transparent;\n                ", ": var(--text-primary-active);\n                ", ": transparent;\n\n                ", ": 0.4;\n\n                ", ": inherit;\n                ", ": inherit;\n            "])), tokens.caretColor, tokens.caretColorSolid, tokens.errorColor, tokens.backgroundErrorColor, tokens.color, tokens.colorSolid, tokens.iconButtonColorSolidHover, tokens.additionalTextColor, tokens.additionalTextColorSolid, tokens.backgroundColorFocus, tokens.backgroundColorSolidFocus, tokens.backgroundColorSolid, tokens.iconButtonColor, tokens.iconButtonBackgroundColor, tokens.iconButtonColorHover, tokens.iconButtonBackgroundColorHover, tokens.iconButtonColorActive, tokens.iconButtonBackgroundColorActive, tokens.actionButtonDisabledOpacity, tokens.loaderSpinnerColor, tokens.loaderSpinnerColorSolid)
+    },
+    size: {
+      l: /*#__PURE__*/css(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 11.75rem;\n                ", ": 3.5rem;\n                ", ": 3.5rem;\n                ", ": 1.5rem;\n                ", ": var(--plasma-typo-body-l-font-family);\n                ", ": var(--plasma-typo-body-l-font-size);\n                ", ": var(--plasma-typo-body-l-font-style);\n                ", ": var(--plasma-typo-body-l-bold-font-weight);\n                ", ": var(--plasma-typo-body-l-letter-spacing);\n                ", ": var(--plasma-typo-body-l-line-height);\n\n                ", ": 0.875rem;\n                ", ": 0.375rem;\n\n                ", ": 0 0.125rem;\n                ", ": 0.875rem;\n                ", ": 3.5rem;\n                ", ": 1.063rem 1.125rem;\n\n                ", ": var(--plasma-typo-body-l-font-family);\n                ", ": var(--plasma-typo-body-l-font-size);\n                ", ": var(--plasma-typo-body-l-font-style);\n                ", ": var(--plasma-typo-body-l-font-weight);\n                ", ": var(--plasma-typo-body-l-letter-spacing);\n                ", ": var(--plasma-typo-body-l-line-height);\n\n                ", ": 0.25rem;\n                ", ": 0.25rem;\n\n                ", ": 1.375rem;\n            "])), tokens.rootMinWidth, tokens.iconButtonHeight, tokens.iconButtonWidth, tokens.iconButtonPadding, tokens.iconButtonFontFamily, tokens.iconButtonFontSize, tokens.iconButtonFontStyle, tokens.iconButtonFontWeight, tokens.iconButtonLetterSpacing, tokens.iconButtonLineHeight, tokens.iconButtonRadius, tokens.iconButtonSegmentationRadius, tokens.inputWrapperMargin, tokens.inputWrapperBorderRadius, tokens.textWrapperHeight, tokens.textWrapperPadding, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.textBeforeMarginRight, tokens.textAfterMarginLeft, tokens.loaderSpinnerSize),
+      m: /*#__PURE__*/css(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 10.25rem;\n                ", ": 3rem;\n                ", ": 3rem;\n                ", ": 1.25rem;\n                ", ": var(--plasma-typo-body-m-font-family);\n                ", ": var(--plasma-typo-body-m-font-size);\n                ", ": var(--plasma-typo-body-m-font-style);\n                ", ": var(--plasma-typo-body-m-bold-font-weight);\n                ", ": var(--plasma-typo-body-m-letter-spacing);\n                ", ": var(--plasma-typo-body-m-line-height);\n\n                ", ": 0.75rem;\n                ", ": 0.25rem;\n\n                ", ": 0 0.125rem;\n                ", ": 0.75rem;\n                ", ": 3rem;\n                ", ": 0.875rem 1rem;\n\n                ", ": var(--plasma-typo-body-m-font-family);\n                ", ": var(--plasma-typo-body-m-font-size);\n                ", ": var(--plasma-typo-body-m-font-style);\n                ", ": var(--plasma-typo-body-m-font-weight);\n                ", ": var(--plasma-typo-body-m-letter-spacing);\n                ", ": var(--plasma-typo-body-m-line-height);\n\n                ", ": 0.25rem;\n                ", ": 0.25rem;\n\n                ", ": 1.375rem;\n            "])), tokens.rootMinWidth, tokens.iconButtonHeight, tokens.iconButtonWidth, tokens.iconButtonPadding, tokens.iconButtonFontFamily, tokens.iconButtonFontSize, tokens.iconButtonFontStyle, tokens.iconButtonFontWeight, tokens.iconButtonLetterSpacing, tokens.iconButtonLineHeight, tokens.iconButtonRadius, tokens.iconButtonSegmentationRadius, tokens.inputWrapperMargin, tokens.inputWrapperBorderRadius, tokens.textWrapperHeight, tokens.textWrapperPadding, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.textBeforeMarginRight, tokens.textAfterMarginLeft, tokens.loaderSpinnerSize),
+      s: /*#__PURE__*/css(_templateObject7 || (_templateObject7 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 8.75rem;\n                ", ": 2.5rem;\n                ", ": 2.5rem;\n                ", ": 1rem;\n                ", ": var(--plasma-typo-body-s-font-family);\n                ", ": var(--plasma-typo-body-s-font-size);\n                ", ": var(--plasma-typo-body-s-font-style);\n                ", ": var(--plasma-typo-body-s-bold-font-weight);\n                ", ": var(--plasma-typo-body-s-letter-spacing);\n                ", ": var(--plasma-typo-body-s-line-height);\n\n                ", ": 0.625rem;\n                ", ": 0.25rem;\n\n                ", ": 0 0.125rem;\n                ", ": 0.625rem;\n                ", ": 2.5rem;\n                ", ": 0.688rem 0.875rem;\n\n                ", ": var(--plasma-typo-body-s-font-family);\n                ", ": var(--plasma-typo-body-s-font-size);\n                ", ": var(--plasma-typo-body-s-font-style);\n                ", ": var(--plasma-typo-body-s-font-weight);\n                ", ": var(--plasma-typo-body-s-letter-spacing);\n                ", ": var(--plasma-typo-body-s-line-height);\n\n                ", ": 0.25rem;\n                ", ": 0.25rem;\n\n                ", ": 1.375rem;\n            "])), tokens.rootMinWidth, tokens.iconButtonHeight, tokens.iconButtonWidth, tokens.iconButtonPadding, tokens.iconButtonFontFamily, tokens.iconButtonFontSize, tokens.iconButtonFontStyle, tokens.iconButtonFontWeight, tokens.iconButtonLetterSpacing, tokens.iconButtonLineHeight, tokens.iconButtonRadius, tokens.iconButtonSegmentationRadius, tokens.inputWrapperMargin, tokens.inputWrapperBorderRadius, tokens.textWrapperHeight, tokens.textWrapperPadding, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.textBeforeMarginRight, tokens.textAfterMarginLeft, tokens.loaderSpinnerSize),
+      xs: /*#__PURE__*/css(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 6.875rem;\n                ", ": 2rem;\n                ", ": 2rem;\n                ", ": 0.75rem;\n                ", ": var(--plasma-typo-body-xs-font-family);\n                ", ": var(--plasma-typo-body-xs-font-size);\n                ", ": var(--plasma-typo-body-xs-font-style);\n                ", ": var(--plasma-typo-body-xs-bold-font-weight);\n                ", ": var(--plasma-typo-body-xs-letter-spacing);\n                ", ": var(--plasma-typo-body-xs-line-height);\n\n                ", ": 0.5rem;\n                ", ": 0.125rem;\n\n                ", ": 0 0.125rem;\n                ", ": 0.5rem;\n                ", ": 2rem;\n                ", ": 0.563rem 0.625rem;\n\n                ", ": var(--plasma-typo-body-xs-font-family);\n                ", ": var(--plasma-typo-body-xs-font-size);\n                ", ": var(--plasma-typo-body-xs-font-style);\n                ", ": var(--plasma-typo-body-xs-font-weight);\n                ", ": var(--plasma-typo-body-xs-letter-spacing);\n                ", ": var(--plasma-typo-body-xs-line-height);\n\n                ", ": 0.25rem;\n                ", ": 0.25rem;\n\n                ", ": 1rem;\n            "])), tokens.rootMinWidth, tokens.iconButtonHeight, tokens.iconButtonWidth, tokens.iconButtonPadding, tokens.iconButtonFontFamily, tokens.iconButtonFontSize, tokens.iconButtonFontStyle, tokens.iconButtonFontWeight, tokens.iconButtonLetterSpacing, tokens.iconButtonLineHeight, tokens.iconButtonRadius, tokens.iconButtonSegmentationRadius, tokens.inputWrapperMargin, tokens.inputWrapperBorderRadius, tokens.textWrapperHeight, tokens.textWrapperPadding, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.textBeforeMarginRight, tokens.textAfterMarginLeft, tokens.loaderSpinnerSize)
+    },
+    shape: {
+      cornered: /*#__PURE__*/css(_templateObject9 || (_templateObject9 = /*#__PURE__*/_taggedTemplateLiteral([""]))),
+      pilled: /*#__PURE__*/css(_templateObject10 || (_templateObject10 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 50%;\n            "])), tokens.iconButtonRadius)
+    },
+    inputBackgroundType: {
+      fill: /*#__PURE__*/css(_templateObject11 || (_templateObject11 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--surface-transparent-primary);\n                ", ": var(--surface-transparent-primary);\n            "])), tokens.backgroundColor, tokens.backgroundColorHover),
+      clear: /*#__PURE__*/css(_templateObject12 || (_templateObject12 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": transparent;\n                ", ": transparent;\n            "])), tokens.backgroundColor, tokens.backgroundColorHover)
+    },
+    segmentation: {
+      "default": /*#__PURE__*/css(_templateObject13 || (_templateObject13 = /*#__PURE__*/_taggedTemplateLiteral([""]))),
+      segmented: /*#__PURE__*/css(_templateObject14 || (_templateObject14 = /*#__PURE__*/_taggedTemplateLiteral([""]))),
+      solid: /*#__PURE__*/css(_templateObject15 || (_templateObject15 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 0;\n            "])), tokens.iconButtonSegmentationRadius)
+    },
+    disabled: {
+      "true": /*#__PURE__*/css(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 0.4;\n            "])), tokens.disabledOpacity)
+    }
+  }
+};

package/es/components/NumberInput/NumberInput.js

@@ -0,0 +1,4 @@
+import { numberInputConfig, component, mergeConfig } from '@salutejs/plasma-new-hope/styled-components';
+import { config } from './NumberInput.config';
+var mergedConfig = /*#__PURE__*/mergeConfig(numberInputConfig, config);
+export var NumberInput = /*#__PURE__*/component(mergedConfig);

package/es/components/NumberInput/index.js

@@ -0,0 +1,2 @@
+export { NumberInput } from './NumberInput';
+export { numberInputTokens, numberInputClasses } from '@salutejs/plasma-new-hope/styled-components';

package/es/components/Steps/Steps.config.js

@@ -8,7 +8,7 @@ export var config = {
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-primary-hover);\n                ", ": solid var(--surface-solid-default);\n                ", ": var(--text-primary);\n                ", ": var(--surface-clear);\n\n                ", ": var(--inverse-text-primary);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--surface-solid-default);\n                ", ": var(--surface-solid-default-hover);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--surface-transparent-secondary-hover);\n\n                ", ": var(--text-secondary);\n\n                ", ": 0.4;\n            "])), tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor, tokens.activeIndicatorBackground, tokens.completedIndicatorColor, tokens.completedIndicatorColorHover, tokens.completedIndicatorBackground, tokens.completedIndicatorBackgroundHover, tokens.inactiveTitleColor, tokens.inactiveTitleColorHover, tokens.inactiveIndicatorColor, tokens.inactiveIndicatorColorHover, tokens.inactiveIndicatorBackground, tokens.inactiveIndicatorBackgroundHover, tokens.contentColor, tokens.disabledOpacity)
+      "default": /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-primary-hover);\n                ", ": solid var(--surface-solid-default);\n                ", ": var(--text-primary);\n                ", ": var(--surface-clear);\n\n                ", ": var(--inverse-text-primary);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--surface-solid-default);\n                ", ": var(--surface-solid-default-hover);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--surface-transparent-secondary-hover);\n\n                ", ": var(--text-secondary);\n                ", ": var(--surface-accent);\n\n                ", ": 0.4;\n            "])), tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor, tokens.activeIndicatorBackground, tokens.completedIndicatorColor, tokens.completedIndicatorColorHover, tokens.completedIndicatorBackground, tokens.completedIndicatorBackgroundHover, tokens.inactiveTitleColor, tokens.inactiveTitleColorHover, tokens.inactiveIndicatorColor, tokens.inactiveIndicatorColorHover, tokens.inactiveIndicatorBackground, tokens.inactiveIndicatorBackgroundHover, tokens.contentColor, tokens.focusColor, tokens.disabledOpacity)
     },
     size: {
       l: /*#__PURE__*/css(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 1.5rem;\n                ", ": 2.25rem;\n                ", ": 0.5rem;\n                ", ": 1rem;\n\n                ", ": 0.75rem;\n                ", ": 0.375rem;\n                ", ": 2rem;\n                ", ": 1.0625rem;\n                ", ": 0.75rem;\n\n                ", ": 1rem;\n                ", ": 0.625rem;\n                ", ": 1.5rem;\n                ", ": 1.25rem;\n\n                ", ": var(--plasma-typo-body-xs-font-family);\n                ", ": var(--plasma-typo-body-xs-font-size);\n                ", ": var(--plasma-typo-body-xs-font-style);\n                ", ": var(--plasma-typo-body-xs-font-weight);\n                ", ": var(--plasma-typo-body-xs-letter-spacing);\n                ", ": var(--plasma-typo-body-xs-line-height);\n\n                ", ": var(--plasma-typo-body-s-font-family);\n                ", ": var(--plasma-typo-body-s-font-size);\n                ", ": var(--plasma-typo-body-s-font-style);\n                ", ": var(--plasma-typo-body-s-font-weight);\n                ", ": var(--plasma-typo-body-s-letter-spacing);\n                ", ": var(--plasma-typo-body-s-line-height);\n\n                ", ": var(--plasma-typo-body-l-font-family);\n                ", ": var(--plasma-typo-body-l-font-size);\n                ", ": var(--plasma-typo-body-l-font-style);\n                ", ": var(--plasma-typo-body-l-font-weight);\n                ", ": var(--plasma-typo-body-l-letter-spacing);\n                ", ": var(--plasma-typo-body-l-line-height);\n\n                ", ": var(--plasma-typo-body-m-font-family);\n                ", ": var(--plasma-typo-body-m-font-size);\n                ", ": var(--plasma-typo-body-m-font-style);\n                ", ": var(--plasma-typo-body-m-font-weight);\n                ", ": var(--plasma-typo-body-m-letter-spacing);\n                ", ": var(--plasma-typo-body-m-line-height);\n\n                ", ": 0.125rem;\n            "])), tokens.indicatorSize, tokens.activeIndicatorSize, tokens.bulletSize, tokens.activeBulletSize, tokens.titlePaddingTop, tokens.contentPaddingTop, tokens.contentSidePadding, tokens.contentVerticalPadding, tokens.verticalContentPaddingLeft, tokens.smallIndicatorIndentHeight, tokens.largeIndicatorIndentHeight, tokens.smallBulletIndentHeight, tokens.largeBulletIndentHeight, tokens.indicatorFontFamily, tokens.indicatorFontSize, tokens.indicatorFontStyle, tokens.indicatorFontWeight, tokens.indicatorLetterSpacing, tokens.indicatorLineHeight, tokens.activeIndicatorFontFamily, tokens.activeIndicatorFontSize, tokens.activeIndicatorFontStyle, tokens.activeIndicatorFontWeight, tokens.activeIndicatorLetterSpacing, tokens.activeIndicatorLineHeight, tokens.titleFontFamily, tokens.titleFontSize, tokens.titleFontStyle, tokens.titleFontWeight, tokens.titleLetterSpacing, tokens.titleLineHeight, tokens.contentFontFamily, tokens.contentFontSize, tokens.contentFontStyle, tokens.contentFontWeight, tokens.contentLetterSpacing, tokens.contentLineHeight, tokens.dividerThickness),

package/es/components/TextField/TextField.config.js

@@ -9,10 +9,10 @@ export var config = {
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-primary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--surface-transparent-primary);\n                ", ": var(--surface-transparent-primary-hover);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-transparent-tertiary);\n                ", ": var(--text-secondary);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), tokens.color, tokens.clearColor, tokens.placeholderColorFocus, tokens.clearPlaceholderColor, tokens.clearPlaceholderColorFocus, tokens.backgroundColor, tokens.backgroundColorHover, tokens.backgroundColorFocus, tokens.caretColor, tokens.placeholderColor, tokens.textBeforeColor, tokens.textAfterColor, tokens.labelColor, tokens.leftHelperColor, tokens.titleCaptionColor, tokens.hintIconColor, tokens.contentSlotColor, tokens.contentSlotColorHover, tokens.contentSlotColorActive, tokens.dividerColor, tokens.dividerColorHover, tokens.dividerColorFocus, tokens.chipCloseIconColor, tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipOpacityReadonly, tokens.focusColor, tokens.indicatorColor, tokens.optionalColor),
-      positive: /*#__PURE__*/css(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-positive);\n                ", ": var(--text-positive);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-positive);\n                ", ": var(--surface-transparent-positive);\n                ", ": var(--surface-transparent-positive-hover);\n                ", ": var(--surface-transparent-positive-active);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-positive);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-positive);\n                ", ": var(--surface-positive);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), tokens.color, tokens.clearColor, tokens.clearPlaceholderColor, tokens.placeholderColorFocus, tokens.clearPlaceholderColorFocus, tokens.backgroundColor, tokens.backgroundColorHover, tokens.backgroundColorFocus, tokens.caretColor, tokens.placeholderColor, tokens.textBeforeColor, tokens.textAfterColor, tokens.labelColor, tokens.leftHelperColor, tokens.titleCaptionColor, tokens.hintIconColor, tokens.contentSlotColor, tokens.contentSlotColorHover, tokens.contentSlotColorActive, tokens.dividerColor, tokens.dividerColorHover, tokens.dividerColorFocus, tokens.chipCloseIconColor, tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipOpacityReadonly, tokens.focusColor, tokens.indicatorColor, tokens.optionalColor),
-      warning: /*#__PURE__*/css(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-warning);\n                ", ": var(--text-warning);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-warning);\n                ", ": var(--surface-transparent-warning);\n                ", ": var(--surface-transparent-warning-hover);\n                ", ": var(--surface-transparent-warning-active);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-warning);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-warning);\n                ", ": var(--surface-warning);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), tokens.color, tokens.clearColor, tokens.clearPlaceholderColor, tokens.placeholderColorFocus, tokens.clearPlaceholderColorFocus, tokens.backgroundColor, tokens.backgroundColorHover, tokens.backgroundColorFocus, tokens.caretColor, tokens.placeholderColor, tokens.textBeforeColor, tokens.textAfterColor, tokens.labelColor, tokens.leftHelperColor, tokens.titleCaptionColor, tokens.hintIconColor, tokens.contentSlotColor, tokens.contentSlotColorHover, tokens.contentSlotColorActive, tokens.dividerColor, tokens.dividerColorHover, tokens.dividerColorFocus, tokens.chipCloseIconColor, tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipOpacityReadonly, tokens.focusColor, tokens.indicatorColor, tokens.optionalColor),
-      negative: /*#__PURE__*/css(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-negative);\n                ", ": var(--text-negative);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-negative);\n                ", ": var(--surface-transparent-negative);\n                ", ": var(--surface-transparent-negative-hover);\n                ", ": var(--surface-transparent-negative-active);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-negative);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-negative);\n                ", ": var(--surface-negative);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), tokens.color, tokens.clearColor, tokens.clearPlaceholderColor, tokens.placeholderColorFocus, tokens.clearPlaceholderColorFocus, tokens.backgroundColor, tokens.backgroundColorHover, tokens.backgroundColorFocus, tokens.caretColor, tokens.placeholderColor, tokens.textBeforeColor, tokens.textAfterColor, tokens.labelColor, tokens.leftHelperColor, tokens.titleCaptionColor, tokens.hintIconColor, tokens.contentSlotColor, tokens.contentSlotColorHover, tokens.contentSlotColorActive, tokens.dividerColor, tokens.dividerColorHover, tokens.dividerColorFocus, tokens.chipCloseIconColor, tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipOpacityReadonly, tokens.focusColor, tokens.indicatorColor, tokens.optionalColor)
+      "default": /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-primary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--surface-transparent-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-transparent-tertiary);\n                ", ": var(--text-secondary);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), tokens.color, tokens.clearColor, tokens.placeholderColorFocus, tokens.clearPlaceholderColor, tokens.clearPlaceholderColorFocus, tokens.backgroundColor, tokens.backgroundColorFocus, tokens.caretColor, tokens.placeholderColor, tokens.textBeforeColor, tokens.textAfterColor, tokens.labelColor, tokens.leftHelperColor, tokens.titleCaptionColor, tokens.hintIconColor, tokens.contentSlotColor, tokens.contentSlotColorHover, tokens.contentSlotColorActive, tokens.dividerColor, tokens.dividerColorHover, tokens.dividerColorFocus, tokens.chipCloseIconColor, tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipOpacityReadonly, tokens.focusColor, tokens.indicatorColor, tokens.optionalColor),
+      positive: /*#__PURE__*/css(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-positive);\n                ", ": var(--text-positive);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-positive);\n                ", ": var(--surface-transparent-positive);\n                ", ": var(--surface-transparent-positive-active);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-positive);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-positive);\n                ", ": var(--surface-positive);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), tokens.color, tokens.clearColor, tokens.clearPlaceholderColor, tokens.placeholderColorFocus, tokens.clearPlaceholderColorFocus, tokens.backgroundColor, tokens.backgroundColorFocus, tokens.caretColor, tokens.placeholderColor, tokens.textBeforeColor, tokens.textAfterColor, tokens.labelColor, tokens.leftHelperColor, tokens.titleCaptionColor, tokens.hintIconColor, tokens.contentSlotColor, tokens.contentSlotColorHover, tokens.contentSlotColorActive, tokens.dividerColor, tokens.dividerColorHover, tokens.dividerColorFocus, tokens.chipCloseIconColor, tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipOpacityReadonly, tokens.focusColor, tokens.indicatorColor, tokens.optionalColor),
+      warning: /*#__PURE__*/css(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-warning);\n                ", ": var(--text-warning);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-warning);\n                ", ": var(--surface-transparent-warning);\n                ", ": var(--surface-transparent-warning-active);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-warning);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-warning);\n                ", ": var(--surface-warning);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), tokens.color, tokens.clearColor, tokens.clearPlaceholderColor, tokens.placeholderColorFocus, tokens.clearPlaceholderColorFocus, tokens.backgroundColor, tokens.backgroundColorFocus, tokens.caretColor, tokens.placeholderColor, tokens.textBeforeColor, tokens.textAfterColor, tokens.labelColor, tokens.leftHelperColor, tokens.titleCaptionColor, tokens.hintIconColor, tokens.contentSlotColor, tokens.contentSlotColorHover, tokens.contentSlotColorActive, tokens.dividerColor, tokens.dividerColorHover, tokens.dividerColorFocus, tokens.chipCloseIconColor, tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipOpacityReadonly, tokens.focusColor, tokens.indicatorColor, tokens.optionalColor),
+      negative: /*#__PURE__*/css(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-negative);\n                ", ": var(--text-negative);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-negative);\n                ", ": var(--surface-transparent-negative);\n                ", ": var(--surface-transparent-negative-active);\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-primary);\n                ", ": var(--text-negative);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n\n                ", ": var(--surface-negative);\n                ", ": var(--surface-negative);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary-active);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": var(--surface-transparent-secondary);\n                ", ": var(--text-primary);\n                ", ": 0.72;\n\n                ", ": var(--text-accent);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), tokens.color, tokens.clearColor, tokens.clearPlaceholderColor, tokens.placeholderColorFocus, tokens.clearPlaceholderColorFocus, tokens.backgroundColor, tokens.backgroundColorFocus, tokens.caretColor, tokens.placeholderColor, tokens.textBeforeColor, tokens.textAfterColor, tokens.labelColor, tokens.leftHelperColor, tokens.titleCaptionColor, tokens.hintIconColor, tokens.contentSlotColor, tokens.contentSlotColorHover, tokens.contentSlotColorActive, tokens.dividerColor, tokens.dividerColorHover, tokens.dividerColorFocus, tokens.chipCloseIconColor, tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipOpacityReadonly, tokens.focusColor, tokens.indicatorColor, tokens.optionalColor)
     },
     size: {
       l: /*#__PURE__*/css(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 3.5rem;\n                ", ": 1.0625rem 1.125rem 1.0625rem 1.125rem;\n                ", ": 0.375rem;\n                ", ": 0.875rem;\n\n                ", ": -0.0625rem 0.5rem -0.0625rem -0.125rem;\n                ", ": -0.0625rem -0.125rem -0.0625rem 0.75rem;\n\n                ", ": var(--plasma-typo-body-l-font-family);\n                ", ": var(--plasma-typo-body-l-font-size);\n                ", ": var(--plasma-typo-body-l-font-style);\n                ", ": var(--plasma-typo-body-l-font-weight);\n                ", ": var(--plasma-typo-body-l-letter-spacing);\n                ", ": var(--plasma-typo-body-l-line-height);\n\n                ", ": 0.75rem;\n                ", ": 0.25rem;\n                ", ": var(--plasma-typo-body-l-font-family);\n                ", ": var(--plasma-typo-body-l-font-size);\n                ", ": var(--plasma-typo-body-l-font-style);\n                ", ": var(--plasma-typo-body-l-font-weight);\n                ", ": var(--plasma-typo-body-l-letter-spacing);\n                ", ": var(--plasma-typo-body-l-line-height);\n\n                ", ": -0.688rem -0.5rem;\n                ", ": 2.375rem;\n                ", ": -0.751rem -2rem auto auto;\n                ", ": 0.562rem -2.063rem auto auto;\n\n                ", ": 0.25rem;\n                ", ": var(--plasma-typo-body-xs-font-family);\n                ", ": var(--plasma-typo-body-xs-font-size);\n                ", ": var(--plasma-typo-body-xs-font-style);\n                ", ": var(--plasma-typo-body-xs-font-weight);\n                ", ": var(--plasma-typo-body-xs-letter-spacing);\n                ", ": var(--plasma-typo-body-xs-line-height);\n\n                ", ": 0.25rem;\n                ", ": var(--plasma-typo-body-xs-font-family);\n                ", ": var(--plasma-typo-body-xs-font-size);\n                ", ": var(--plasma-typo-body-xs-font-style);\n                ", ": var(--plasma-typo-body-xs-font-weight);\n                ", ": var(--plasma-typo-body-xs-letter-spacing);\n                ", ": var(--plasma-typo-body-xs-line-height);\n\n                ", ": 0.5625rem 0 0.125rem 0;\n                ", ": 1.5625rem 0 0.5625rem 0;\n                ", ": 0 0.25rem 0 0;\n                ", ": 0 0 0 0.25rem;\n\n                ", ": 0.25rem;\n                ", ": 0.5rem;\n                ", ": auto;\n                ", ": 2.75rem;\n                ", ": 0.75rem;\n                ", ": 1rem;\n                ", ": 0.625rem;\n                ", ": 0rem;\n                ", ": 1.5rem;\n                ", ": var(--plasma-typo-body-l-font-family);\n                ", ": var(--plasma-typo-body-l-font-size);\n                ", ": var(--plasma-typo-body-l-font-style);\n                ", ": var(--plasma-typo-body-l-font-weight);\n                ", ": var(--plasma-typo-body-l-letter-spacing);\n                ", ": var(--plasma-typo-body-l-line-height);\n\n                ", ": 0.5rem;\n                ", ": 0.375rem;\n                ", ": 0 0 0 0;\n                ", ": 0.5rem auto auto -0.75rem;\n                ", ": 0 0 auto auto;\n                ", ": 0.25rem -0.625rem auto auto;\n                ", ": 1.5rem auto auto -0.875rem;\n                ", ": 1.5rem -0.875rem auto auto;\n                ", ": 1.5rem -2.25rem auto auto;\n            "])), tokens.height, tokens.padding, tokens.paddingWithChips, tokens.borderRadius, tokens.leftContentMargin, tokens.rightContentMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.clearLabelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.hintMargin, tokens.hintTargetSize, tokens.hintInnerLabelPlacementOffset, tokens.clearHintInnerLabelPlacementOffset, tokens.titleCaptionInnerLabelOffset, tokens.titleCaptionFontFamily, tokens.titleCaptionFontSize, tokens.titleCaptionFontStyle, tokens.titleCaptionFontWeight, tokens.titleCaptionLetterSpacing, tokens.titleCaptionLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.chipGap, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPaddingRight, tokens.chipPaddingLeft, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight, tokens.indicatorSizeInner, tokens.indicatorSizeOuter, tokens.indicatorLabelPlacementInner, tokens.indicatorLabelPlacementOuter, tokens.indicatorLabelPlacementInnerRight, tokens.indicatorLabelPlacementOuterRight, tokens.clearIndicatorLabelPlacementInner, tokens.clearIndicatorLabelPlacementInnerRight, tokens.clearIndicatorHintInnerRight),

package/es/index.js

@@ -55,5 +55,6 @@ export * from './components/Autocomplete';
 export * from './components/EmptyState';
 export * from './components/Attach';
 export * from './components/ViewContainer';
+export * from './components/NumberInput';
 export * from './mixins';
 export * from './tokens';

package/index.d.ts

@@ -55,5 +55,6 @@ export * from './components/Autocomplete';
 export * from './components/EmptyState';
 export * from './components/Attach';
 export * from './components/ViewContainer';
+export * from './components/NumberInput';
 export * from './mixins';
 export * from './tokens';

package/index.js

@@ -630,6 +630,17 @@ Object.keys(_ViewContainer).forEach(function (key) {
     }
   });
 });
+var _NumberInput = /*#__PURE__*/require("./components/NumberInput");
+Object.keys(_NumberInput).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _NumberInput[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _NumberInput[key];
+    }
+  });
+});
 var _mixins = /*#__PURE__*/require("./mixins");
 Object.keys(_mixins).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salutejs/sdds-finportal",
-  "version": "0.161.0-canary.1551.11740641367.0",
+  "version": "0.161.1-canary.1517.11744378817.0",
   "description": "Salute Design System / React UI kit for SDDS FinPortal web applications",
   "author": "Salute Frontend Team <salute.developers@gmail.com>",
   "license": "MIT",
@@ -19,7 +19,7 @@
     "directory": "packages/sdds-finportal"
   },
   "dependencies": {
-    "@salutejs/plasma-new-hope": "0.187.0-canary.1551.11740641367.0",
+    "@salutejs/plasma-new-hope": "0.187.1-canary.1517.11744378817.0",
     "@salutejs/sdds-themes": "0.27.0-dev.0"
   },
   "peerDependencies": {
@@ -94,5 +94,5 @@
     "Vasiliy Loginevskiy"
   ],
   "sideEffects": false,
-  "gitHead": "0b3ada38adb06cff0294f58f0f5dbe33adf8198d"
+  "gitHead": "36d3509d905fb467afddf89b4815e4634d37fb4c"
 }

package/temp/sdds-finportal.api.md

@@ -136,6 +136,8 @@ import { NotificationIconPlacement } from '@salutejs/plasma-new-hope/styled-comp
 import { NotificationLayout } from '@salutejs/plasma-new-hope/styled-components';
 import { NotificationPlacement } from '@salutejs/plasma-new-hope/styled-components';
 import { NotificationProps } from '@salutejs/plasma-new-hope/styled-components';
+import { numberInputClasses } from '@salutejs/plasma-new-hope/styled-components';
+import { numberInputTokens } from '@salutejs/plasma-new-hope/styled-components';
 import { Orientation } from '@salutejs/plasma-new-hope/types/components/TextFieldGroup/TextFieldGroup.types';
 import { Overlay } from '@salutejs/plasma-new-hope/styled-components';
 import { OverlayProps } from '@salutejs/plasma-new-hope/styled-components';
@@ -194,6 +196,7 @@ import { StepItemProps } from '@salutejs/plasma-new-hope/styled-components';
 import { StepsProps } from '@salutejs/plasma-new-hope/types/components/Steps/Steps.types';
 import { StyledComponent } from 'styled-components';
 import { SwitchProps as SwitchProps_2 } from '@salutejs/plasma-new-hope/styled-components';
+import { SyntheticEvent } from 'react';
 import { TabItemRefs } from '@salutejs/plasma-new-hope/styled-components';
 import { TabsContext } from '@salutejs/plasma-new-hope/styled-components';
 import { TabsControllerProps } from '@salutejs/plasma-new-hope/styled-components';
@@ -3172,6 +3175,92 @@ export const NotificationsProvider: React_2.FC<{
     placement?: NotificationPlacement;
 }>;
 
+// @public (undocumented)
+export const NumberInput: FunctionComponent<PropsType<    {
+view: {
+default: PolymorphicClassName;
+secondary: PolymorphicClassName;
+accent: PolymorphicClassName;
+clear: PolymorphicClassName;
+};
+size: {
+l: PolymorphicClassName;
+m: PolymorphicClassName;
+s: PolymorphicClassName;
+xs: PolymorphicClassName;
+};
+shape: {
+cornered: PolymorphicClassName;
+pilled: PolymorphicClassName;
+};
+inputBackgroundType: {
+fill: PolymorphicClassName;
+clear: PolymorphicClassName;
+};
+segmentation: {
+default: PolymorphicClassName;
+segmented: PolymorphicClassName;
+solid: PolymorphicClassName;
+};
+disabled: {
+true: PolymorphicClassName;
+};
+}> & (({
+value?: number | undefined;
+min?: number | undefined;
+max?: number | undefined;
+step?: number | undefined;
+isLoading?: boolean | undefined;
+loader?: ReactNode;
+size?: string | undefined;
+view?: string | undefined;
+clear?: boolean | undefined;
+shape?: string | undefined;
+disabled?: boolean | undefined;
+textBefore?: string | undefined;
+textAfter?: string | undefined;
+customIncrementButton?: ReactNode;
+incrementIcon?: ReactNode;
+customDecrementButton?: ReactNode;
+decrementIcon?: ReactNode;
+isManualInput?: boolean | undefined;
+onChange?: ((event: SyntheticEvent<HTMLInputElement, Event> | null, value: string | number) => void) | undefined;
+onIncrement?: ((value: number) => void) | undefined;
+onDecrement?: ((value: number) => void) | undefined;
+} & {
+segmentation?: "clear" | undefined;
+inputBackgroundType?: undefined;
+} & Omit<InputHTMLAttributes_2<HTMLInputElement>, "onChange" | "size" | "value"> & RefAttributes<HTMLInputElement>) | ({
+value?: number | undefined;
+min?: number | undefined;
+max?: number | undefined;
+step?: number | undefined;
+isLoading?: boolean | undefined;
+loader?: ReactNode;
+size?: string | undefined;
+view?: string | undefined;
+clear?: boolean | undefined;
+shape?: string | undefined;
+disabled?: boolean | undefined;
+textBefore?: string | undefined;
+textAfter?: string | undefined;
+customIncrementButton?: ReactNode;
+incrementIcon?: ReactNode;
+customDecrementButton?: ReactNode;
+decrementIcon?: ReactNode;
+isManualInput?: boolean | undefined;
+onChange?: ((event: SyntheticEvent<HTMLInputElement, Event> | null, value: string | number) => void) | undefined;
+onIncrement?: ((value: number) => void) | undefined;
+onDecrement?: ((value: number) => void) | undefined;
+} & {
+segmentation?: string | undefined;
+inputBackgroundType?: string | undefined;
+} & Omit<InputHTMLAttributes_2<HTMLInputElement>, "onChange" | "size" | "value"> & RefAttributes<HTMLInputElement>))>;
+
+export { numberInputClasses }
+
+export { numberInputTokens }
+
 export { Overlay }
 
 export { OverlayProps }