@alfalab/core-components 41.8.0 → 41.9.0-beta.1

package/indicator/index.css

@@ -0,0 +1,90 @@
+/* hash: kbjvk */
+:root {
+} /* deprecated */ :root {
+    --color-light-bg-accent: #ef3124;
+    --color-light-bg-primary: #fff;
+    --color-light-border-key-inverted: #fff;
+    --color-light-specialbg-secondary-transparent: rgba(11, 31, 53, 0.05);
+    --color-light-text-primary: #0e0e0e;
+    --color-static-text-primary-light: #fff; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root {
+} :root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+} :root {
+    --border-radius-pill: 99px;
+} :root {
+    --gap-2xs: 4px;
+    --gap-xs: 8px;
+    --gap-s: 12px;
+    --gap-m: 16px;
+} :root {
+} :root {
+} .indicator__component_1hip1 {
+    position: relative;
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    box-sizing: content-box;
+    flex-shrink: 0;
+    border-radius: var(--border-radius-pill);
+    color: var(--color-static-text-primary-light);
+    background-color: var(--color-light-bg-accent);
+} .indicator__red_1hip1 {
+    background-color: var(--color-light-bg-accent);
+    color: var(--color-static-text-primary-light)
+} .indicator__red_1hip1.indicator__border_1hip1 {
+        outline: 2px solid var(--color-light-border-key-inverted);
+    } .indicator__white_1hip1 {
+    background-color: var(--color-light-bg-primary);
+    color: var(--color-light-text-primary)
+} .indicator__white_1hip1.indicator__border_1hip1 {
+        outline: 2px solid var(--color-light-border-key-inverted);
+    } .indicator__grey_1hip1 {
+    background-color: var(--color-light-specialbg-secondary-transparent);
+    color: var(--color-light-text-primary)
+} .indicator__grey_1hip1.indicator__border_1hip1 {
+        outline: 2px solid var(--color-light-border-key-inverted);
+    } .indicator__xs_1hip1 {
+    height: 8px;
+    min-width: 8px;
+} .indicator__s_1hip1 {
+    height: 20px;
+    min-width: 20px
+} .indicator__s_1hip1 .indicator__content_1hip1 {
+        font-size: 11px;
+        line-height: 16px;
+        font-weight: 700;
+        padding: 0 var(--gap-2xs);
+    } .indicator__m_1hip1 {
+    height: 24px;
+    min-width: 24px
+} .indicator__m_1hip1 .indicator__content_1hip1 {
+        font-size: 14px;
+        line-height: 20px;
+        font-weight: 700;
+        padding: 0 var(--gap-2xs);
+    } .indicator__l_1hip1 {
+    height: 40px;
+    min-width: 40px
+} .indicator__l_1hip1 .indicator__content_1hip1 {
+        font-size: 14px;
+        line-height: 20px;
+        font-weight: 700;
+        padding: 0 var(--gap-xs);
+    } .indicator__xl_1hip1 .indicator__content_1hip1 {
+        font-size: 16px;
+        line-height: 24px;
+        font-weight: 700;
+        padding: 0 var(--gap-s);
+    } .indicator__xxl_1hip1 .indicator__content_1hip1 {
+        font-size: 16px;
+        line-height: 24px;
+        font-weight: 700;
+        padding: 0 var(--gap-m);
+    }

package/indicator/index.d.ts

@@ -0,0 +1 @@
+export * from "./Component";

package/indicator/index.js

@@ -0,0 +1,9 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Component = require('./Component.js');
+require('react');
+require('classnames');
+
+
+
+exports.Indicator = Component.Indicator;

package/indicator/modern/Component.d.ts

@@ -0,0 +1,85 @@
+/// <reference types="react" />
+import React from 'react';
+import { ReactElement } from "react";
+type Border = {
+    width?: number;
+    color?: string;
+    style?: 'solid' | 'dashed' | 'dotted';
+};
+type IndicatorProps = React.HTMLAttributes<HTMLDivElement> & {
+    /**
+     * Значение индикатора
+     */
+    value?: number | ReactElement;
+    /**
+     * Цвет значения
+     */
+    color?: string;
+    /**
+     * Цвет заливки
+     */
+    backgroundColor?: string;
+    /**
+     * Высота компонента, min = 16; max = 48
+     */
+    height?: number;
+    /**
+     * Размер компонента
+     */
+    size?: 'xs' | 's' | 'm' | 'l';
+    /**
+     * Настройки обводки
+     */
+    border?: boolean | Border;
+    /**
+     * Пресет компонента
+     */
+    view?: 'red' | 'grey' | 'white';
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+};
+declare const Indicator: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    /**
+     * Значение индикатора
+     */
+    value?: number | React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
+    /**
+     * Цвет значения
+     */
+    color?: string | undefined;
+    /**
+     * Цвет заливки
+     */
+    backgroundColor?: string | undefined;
+    /**
+     * Высота компонента, min = 16; max = 48
+     */
+    height?: number | undefined;
+    /**
+     * Размер компонента
+     */
+    size?: "xs" | "s" | "m" | "l" | undefined;
+    /**
+     * Настройки обводки
+     */
+    border?: boolean | Border | undefined;
+    /**
+     * Пресет компонента
+     */
+    view?: "red" | "grey" | "white" | undefined;
+    /**
+     * Дополнительный класс
+     */
+    className?: string | undefined;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+export { IndicatorProps, Indicator };

package/indicator/modern/Component.js

@@ -0,0 +1,60 @@
+import React, { forwardRef } from 'react';
+import cn from 'classnames';
+
+const styles = {"component":"indicator__component_1hip1","red":"indicator__red_1hip1","border":"indicator__border_1hip1","white":"indicator__white_1hip1","grey":"indicator__grey_1hip1","xs":"indicator__xs_1hip1","s":"indicator__s_1hip1","content":"indicator__content_1hip1","m":"indicator__m_1hip1","l":"indicator__l_1hip1","xl":"indicator__xl_1hip1","xxl":"indicator__xxl_1hip1"};
+require('./index.css');
+
+function getSize(height, value) {
+    if (!height) {
+        return typeof value === 'undefined' ? 'xs' : 's';
+    }
+    if (height <= 8)
+        return 'xs';
+    if (height <= 18)
+        return 's';
+    if (height <= 24)
+        return 'm';
+    if (height <= 32)
+        return 'l';
+    if (height <= 40)
+        return 'xl';
+    return 'xxl';
+}
+function formatValue(rawValue) {
+    if (typeof rawValue === 'number' && rawValue >= 100)
+        return '99+';
+    return rawValue;
+}
+function borderStyles(border, view) {
+    if (!border)
+        return {};
+    if (typeof border === 'object') {
+        return {
+            outlineColor: border.color,
+            outlineWidth: border.width,
+            outlineStyle: border.style || 'solid',
+        };
+    }
+    if (view)
+        return {};
+    return {
+        outlineWidth: 2,
+        outlineColor: 'var(--color-light-graphic-primary)',
+        outlineStyle: 'solid',
+    };
+}
+const Indicator = forwardRef(({ value, view, color, backgroundColor, height, border, className, dataTestId, style, size = getSize(height, value), ...restProps }, ref) => {
+    const showContent = typeof value !== 'undefined' && size !== 'xs';
+    return (React.createElement("div", { ref: ref, className: cn(styles.component, styles[size], view && styles[view], border === true && styles.border, className), style: {
+            ...style,
+            ...(!view && {
+                backgroundColor,
+                color,
+            }),
+            height,
+            minWidth: height,
+            ...borderStyles(border, view),
+        }, "data-test-id": dataTestId, ...restProps }, showContent && React.createElement("span", { className: styles.content }, formatValue(value))));
+});
+
+export { Indicator };

package/indicator/modern/index.css

@@ -0,0 +1,90 @@
+/* hash: kbjvk */
+:root {
+} /* deprecated */ :root {
+    --color-light-bg-accent: #ef3124;
+    --color-light-bg-primary: #fff;
+    --color-light-border-key-inverted: #fff;
+    --color-light-specialbg-secondary-transparent: rgba(11, 31, 53, 0.05);
+    --color-light-text-primary: #0e0e0e;
+    --color-static-text-primary-light: #fff; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root {
+} :root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+} :root {
+    --border-radius-pill: 99px;
+} :root {
+    --gap-2xs: 4px;
+    --gap-xs: 8px;
+    --gap-s: 12px;
+    --gap-m: 16px;
+} :root {
+} :root {
+} .indicator__component_1hip1 {
+    position: relative;
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    box-sizing: content-box;
+    flex-shrink: 0;
+    border-radius: var(--border-radius-pill);
+    color: var(--color-static-text-primary-light);
+    background-color: var(--color-light-bg-accent);
+} .indicator__red_1hip1 {
+    background-color: var(--color-light-bg-accent);
+    color: var(--color-static-text-primary-light)
+} .indicator__red_1hip1.indicator__border_1hip1 {
+        outline: 2px solid var(--color-light-border-key-inverted);
+    } .indicator__white_1hip1 {
+    background-color: var(--color-light-bg-primary);
+    color: var(--color-light-text-primary)
+} .indicator__white_1hip1.indicator__border_1hip1 {
+        outline: 2px solid var(--color-light-border-key-inverted);
+    } .indicator__grey_1hip1 {
+    background-color: var(--color-light-specialbg-secondary-transparent);
+    color: var(--color-light-text-primary)
+} .indicator__grey_1hip1.indicator__border_1hip1 {
+        outline: 2px solid var(--color-light-border-key-inverted);
+    } .indicator__xs_1hip1 {
+    height: 8px;
+    min-width: 8px;
+} .indicator__s_1hip1 {
+    height: 20px;
+    min-width: 20px
+} .indicator__s_1hip1 .indicator__content_1hip1 {
+        font-size: 11px;
+        line-height: 16px;
+        font-weight: 700;
+        padding: 0 var(--gap-2xs);
+    } .indicator__m_1hip1 {
+    height: 24px;
+    min-width: 24px
+} .indicator__m_1hip1 .indicator__content_1hip1 {
+        font-size: 14px;
+        line-height: 20px;
+        font-weight: 700;
+        padding: 0 var(--gap-2xs);
+    } .indicator__l_1hip1 {
+    height: 40px;
+    min-width: 40px
+} .indicator__l_1hip1 .indicator__content_1hip1 {
+        font-size: 14px;
+        line-height: 20px;
+        font-weight: 700;
+        padding: 0 var(--gap-xs);
+    } .indicator__xl_1hip1 .indicator__content_1hip1 {
+        font-size: 16px;
+        line-height: 24px;
+        font-weight: 700;
+        padding: 0 var(--gap-s);
+    } .indicator__xxl_1hip1 .indicator__content_1hip1 {
+        font-size: 16px;
+        line-height: 24px;
+        font-weight: 700;
+        padding: 0 var(--gap-m);
+    }

package/indicator/modern/index.d.ts

@@ -0,0 +1 @@
+export * from "./Component";

package/indicator/modern/index.js

@@ -0,0 +1,3 @@
+export { Indicator } from './Component.js';
+import 'react';
+import 'classnames';

package/indicator/package.json

@@ -0,0 +1,3 @@
+{
+    "module": "./esm/index.js"
+}

package/indicator/send-stats.js

@@ -0,0 +1,82 @@
+const http = require('http');
+const fs = require('fs');
+const { promisify } = require('util');
+const path = require('path');
+
+const readFile = promisify(fs.readFile);
+
+async function main() {
+    const remoteHost = process.env.NIS_HOST || 'digital';
+    const remotePort = process.env.NIS_PORT || 80;
+    const remotePath = process.env.NIS_PATH || '/npm-install-stats/api/install-stats';
+
+    try {
+        const [_, node, os, arch] =
+            /node\/v(\d+\.\d+\.\d+) (\w+) (\w+)/.exec(process.env.npm_config_user_agent) || [];
+        const [__, npm] = /npm\/(\d+\.\d+\.\d+)/.exec(process.env.npm_config_user_agent) || [];
+        const [___, yarn] = /yarn\/(\d+\.\d+\.\d+)/.exec(process.env.npm_config_user_agent) || [];
+
+        let ownPackageJson, packageJson;
+
+        try {
+            const result = await Promise.all([
+                readFile(path.join(process.cwd(), 'package.json'), 'utf-8'),
+                readFile(path.join(process.cwd(), '../../../package.json'), 'utf-8'),
+            ]);
+
+            ownPackageJson = JSON.parse(result[0]);
+            packageJson = JSON.parse(result[1]);
+        } catch (err) {
+            ownPackageJson = '';
+            packageJson = '';
+        }
+
+        const data = {
+            node,
+            npm,
+            yarn,
+            os,
+            arch,
+            ownPackageJson: JSON.stringify(ownPackageJson),
+            packageJson: JSON.stringify(packageJson),
+        };
+
+        const body = JSON.stringify(data);
+
+        const options = {
+            host: remoteHost,
+            port: remotePort,
+            path: remotePath,
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+                'Content-Length': body.length,
+            },
+        };
+
+        return new Promise((resolve, reject) => {
+            const req = http.request(options, (res) => {
+                res.on('end', () => {
+                    resolve();
+                });
+            });
+
+            req.on('error', () => {
+                reject();
+            });
+
+            req.write(body);
+            req.end();
+        });
+    } catch (error) {
+        throw error;
+    }
+}
+
+main()
+    .then(() => {
+        process.exit(0);
+    })
+    .catch(() => {
+        process.exit(0);
+    });

package/input/Component.js

@@ -18,13 +18,13 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var defaultColors = {"input":"input__input_t0k3d","hasInnerLabel":"input__hasInnerLabel_t0k3d","clearIcon":"input__clearIcon_t0k3d","error":"input__error_t0k3d"};
+var defaultColors = {"input":"input__input_pt831","hasInnerLabel":"input__hasInnerLabel_pt831","clearIcon":"input__clearIcon_pt831","error":"input__error_pt831"};
 require('./default.css');
 
-var styles = {"input":"input__input_1uovb","hasInnerLabel":"input__hasInnerLabel_1uovb","s":"input__s_1uovb","m":"input__m_1uovb","l":"input__l_1uovb","xl":"input__xl_1uovb","block":"input__block_1uovb","clearIcon":"input__clearIcon_1uovb","errorIcon":"input__errorIcon_1uovb","errorColorIcon":"input__errorColorIcon_1uovb","clearButton":"input__clearButton_1uovb","successIcon":"input__successIcon_1uovb","successColorIcon":"input__successColorIcon_1uovb","focusVisible":"input__focusVisible_1uovb","onautofillstart":"input__onautofillstart_1uovb","onautofillcancel":"input__onautofillcancel_1uovb"};
+var styles = {"input":"input__input_jerci","hasInnerLabel":"input__hasInnerLabel_jerci","s":"input__s_jerci","m":"input__m_jerci","l":"input__l_jerci","xl":"input__xl_jerci","block":"input__block_jerci","clearIcon":"input__clearIcon_jerci","errorIcon":"input__errorIcon_jerci","errorColorIcon":"input__errorColorIcon_jerci","clearButton":"input__clearButton_jerci","successIcon":"input__successIcon_jerci","successColorIcon":"input__successColorIcon_jerci","focusVisible":"input__focusVisible_jerci","onautofillstart":"input__onautofillstart_jerci","onautofillcancel":"input__onautofillcancel_jerci"};
 require('./index.css');
 
-var invertedColors = {"input":"input__input_gtxgo","hasInnerLabel":"input__hasInnerLabel_gtxgo","clearIcon":"input__clearIcon_gtxgo","error":"input__error_gtxgo"};
+var invertedColors = {"input":"input__input_d3lit","hasInnerLabel":"input__hasInnerLabel_d3lit","clearIcon":"input__clearIcon_d3lit","error":"input__error_d3lit"};
 require('./inverted.css');
 
 var colorStyles = {

package/input/default.css

@@ -1,4 +1,4 @@
-/* hash: 10vxy */
+/* hash: 1jxjd */
 :root {
 } /* deprecated */ :root {
     --color-light-graphic-primary: #0e0e0e;
@@ -37,28 +37,28 @@
     /* display */
 
     /* управляет видимостью иконки ошибки, если она стоит рядом с другой иконкой */
-} .input__input_t0k3d {
+} .input__input_pt831 {
     color: var(--input-color);
     caret-color: var(--input-caret-color);
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-} .input__input_t0k3d:-webkit-autofill {
+} .input__input_pt831:-webkit-autofill {
     -webkit-text-fill-color: var(--input-color);
-} .input__input_t0k3d::placeholder {
+} .input__input_pt831::placeholder {
     color: var(--input-placeholder-color);
-} .input__hasInnerLabel_t0k3d::placeholder {
+} .input__hasInnerLabel_pt831::placeholder {
     color: var(--input-with-label-placeholder-color);
-} .input__clearIcon_t0k3d {
+} .input__clearIcon_pt831 {
     color: var(--color-light-graphic-primary);
-} /* READ-ONLY STATE */ .input__input_t0k3d:read-only {
+} /* READ-ONLY STATE */ .input__input_pt831:read-only {
     color: var(--input-read-only-color)
-} .input__input_t0k3d:read-only:focus::placeholder {
+} .input__input_pt831:read-only:focus::placeholder {
         color: var(--input-placeholder-color);
-    } /* DISABLED STATE */ .input__input_t0k3d:disabled {
+    } /* DISABLED STATE */ .input__input_pt831:disabled {
     color: var(--input-disabled-color);
     -webkit-text-fill-color: var(--input-disabled-color);
-} /* FOCUS STATE */ .input__input_t0k3d:focus::placeholder {
+} /* FOCUS STATE */ .input__input_pt831:focus::placeholder {
     color: var(--input-focus-placeholder-color);
-} /* ERROR STATE */ .input__error_t0k3d {
+} /* ERROR STATE */ .input__error_pt831 {
     color: var(--input-error-color);
     caret-color: var(--input-error-color);
 }

package/input/esm/Component.js

@@ -10,13 +10,13 @@ import { CheckmarkCircleMIcon } from '@alfalab/icons-glyph/CheckmarkCircleMIcon'
 import { CrossCircleMIcon } from '@alfalab/icons-glyph/CrossCircleMIcon';
 import { ExclamationCircleMIcon } from '@alfalab/icons-glyph/ExclamationCircleMIcon';
 
-var defaultColors = {"input":"input__input_t0k3d","hasInnerLabel":"input__hasInnerLabel_t0k3d","clearIcon":"input__clearIcon_t0k3d","error":"input__error_t0k3d"};
+var defaultColors = {"input":"input__input_pt831","hasInnerLabel":"input__hasInnerLabel_pt831","clearIcon":"input__clearIcon_pt831","error":"input__error_pt831"};
 require('./default.css');
 
-var styles = {"input":"input__input_1uovb","hasInnerLabel":"input__hasInnerLabel_1uovb","s":"input__s_1uovb","m":"input__m_1uovb","l":"input__l_1uovb","xl":"input__xl_1uovb","block":"input__block_1uovb","clearIcon":"input__clearIcon_1uovb","errorIcon":"input__errorIcon_1uovb","errorColorIcon":"input__errorColorIcon_1uovb","clearButton":"input__clearButton_1uovb","successIcon":"input__successIcon_1uovb","successColorIcon":"input__successColorIcon_1uovb","focusVisible":"input__focusVisible_1uovb","onautofillstart":"input__onautofillstart_1uovb","onautofillcancel":"input__onautofillcancel_1uovb"};
+var styles = {"input":"input__input_jerci","hasInnerLabel":"input__hasInnerLabel_jerci","s":"input__s_jerci","m":"input__m_jerci","l":"input__l_jerci","xl":"input__xl_jerci","block":"input__block_jerci","clearIcon":"input__clearIcon_jerci","errorIcon":"input__errorIcon_jerci","errorColorIcon":"input__errorColorIcon_jerci","clearButton":"input__clearButton_jerci","successIcon":"input__successIcon_jerci","successColorIcon":"input__successColorIcon_jerci","focusVisible":"input__focusVisible_jerci","onautofillstart":"input__onautofillstart_jerci","onautofillcancel":"input__onautofillcancel_jerci"};
 require('./index.css');
 
-var invertedColors = {"input":"input__input_gtxgo","hasInnerLabel":"input__hasInnerLabel_gtxgo","clearIcon":"input__clearIcon_gtxgo","error":"input__error_gtxgo"};
+var invertedColors = {"input":"input__input_d3lit","hasInnerLabel":"input__hasInnerLabel_d3lit","clearIcon":"input__clearIcon_d3lit","error":"input__error_d3lit"};
 require('./inverted.css');
 
 var colorStyles = {

package/input/esm/default.css

@@ -1,4 +1,4 @@
-/* hash: 10vxy */
+/* hash: 1jxjd */
 :root {
 } /* deprecated */ :root {
     --color-light-graphic-primary: #0e0e0e;
@@ -37,28 +37,28 @@
     /* display */
 
     /* управляет видимостью иконки ошибки, если она стоит рядом с другой иконкой */
-} .input__input_t0k3d {
+} .input__input_pt831 {
     color: var(--input-color);
     caret-color: var(--input-caret-color);
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-} .input__input_t0k3d:-webkit-autofill {
+} .input__input_pt831:-webkit-autofill {
     -webkit-text-fill-color: var(--input-color);
-} .input__input_t0k3d::placeholder {
+} .input__input_pt831::placeholder {
     color: var(--input-placeholder-color);
-} .input__hasInnerLabel_t0k3d::placeholder {
+} .input__hasInnerLabel_pt831::placeholder {
     color: var(--input-with-label-placeholder-color);
-} .input__clearIcon_t0k3d {
+} .input__clearIcon_pt831 {
     color: var(--color-light-graphic-primary);
-} /* READ-ONLY STATE */ .input__input_t0k3d:read-only {
+} /* READ-ONLY STATE */ .input__input_pt831:read-only {
     color: var(--input-read-only-color)
-} .input__input_t0k3d:read-only:focus::placeholder {
+} .input__input_pt831:read-only:focus::placeholder {
         color: var(--input-placeholder-color);
-    } /* DISABLED STATE */ .input__input_t0k3d:disabled {
+    } /* DISABLED STATE */ .input__input_pt831:disabled {
     color: var(--input-disabled-color);
     -webkit-text-fill-color: var(--input-disabled-color);
-} /* FOCUS STATE */ .input__input_t0k3d:focus::placeholder {
+} /* FOCUS STATE */ .input__input_pt831:focus::placeholder {
     color: var(--input-focus-placeholder-color);
-} /* ERROR STATE */ .input__error_t0k3d {
+} /* ERROR STATE */ .input__error_pt831 {
     color: var(--input-error-color);
     caret-color: var(--input-error-color);
 }