@alfalab/core-components 45.6.0-beta.1 → 45.6.0-beta.2

package/circular-progress-bar/cssm/index.module.css

@@ -1,170 +0,0 @@
-: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 */ /* 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 */ /* deprecated */ /* deprecated */
-} /* deprecated */ :root {
-    --color-light-neutral-1500: #0e0e0e;
-    --color-light-neutral-1500-inverted: #fff;
-    --color-light-neutral-500: #babbc2;
-    --color-light-neutral-700: #898991;
-    --color-light-neutral-translucent-300: rgba(15, 25, 55, 0.1);
-    --color-light-status-negative: #ff5431;
-    --color-light-status-positive: #0cc44d; /* 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 {
-} :root {
-    --font-family-system: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica,
-        sans-serif;
-} :root {
-} :root {
-    /* stroke */
-    --circular-progress-bar-stroke-color: var(--color-light-neutral-translucent-300);
-
-    /* positive */
-    --circular-progress-bar-positive-color: var(--color-light-status-positive);
-
-    /* negative */
-    --circular-progress-bar-negative-color: var(--color-light-status-negative);
-
-    /* theme */
-    --circular-progress-bar-font-family: var(--font-family-system);
-    --circular-progress-bar-font-weight: 600;
-} .component {
-    position: relative;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    border-radius: var(--border-radius-pill)
-} .component.bg-positive {
-        background: var(--circular-progress-bar-positive-color);
-    } .component.bg-negative {
-        background: var(--circular-progress-bar-negative-color);
-    } .svg {
-    display: block;
-    width: 100%;
-} .title,
-.subtitle {
-    overflow: hidden;
-    word-break: break-word;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    margin: 0 6px;
-} .subtitle {
-    max-height: 40px;
-} .labelWrapper {
-    text-align: center;
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    width: 100%;
-    transform: translate(-50%, -50%)
-} .labelWrapper.label {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-    } .typography {
-    font-feature-settings: 'ss01';
-    font-weight: var(--circular-progress-bar-font-weight);
-    font-family: var(--circular-progress-bar-font-family);
-} .size-144 {
-    width: 144px;
-    height: 144px
-} .size-144 .labelWrapper {
-        max-width: 128px;
-    } .size-144 .title {
-        max-height: 32px;
-    } .size-128 {
-    width: 128px;
-    height: 128px
-} .size-128 .labelWrapper {
-        max-width: 108px;
-    } .size-128 .title {
-        max-height: 32px;
-    } .size-80 {
-    width: 80px;
-    height: 80px
-} .size-80 .labelWrapper {
-        max-width: 64px;
-    } .size-80 .title {
-        max-height: 24px;
-    } .size-64 {
-    width: 64px;
-    height: 64px
-} .size-64 .labelWrapper {
-        max-width: 48px;
-    } .size-64 .title {
-        max-height: 16px;
-        margin: 0;
-    } .size-48 {
-    width: 48px;
-    height: 48px
-} .size-48 .labelWrapper {
-        max-width: 40px;
-    } .size-48 .title {
-        max-height: 16px;
-        margin: 0;
-    } .size-24 {
-    width: 24px;
-    height: 24px
-} .size-24 .labelWrapper {
-        max-width: 24px;
-    } .backgroundCircle,
-.progressCircle {
-    width: 100%;
-    height: 100%;
-    fill: transparent;
-} .positive {
-    stroke: var(--circular-progress-bar-positive-color);
-} .negative {
-    stroke: var(--circular-progress-bar-negative-color);
-} .backgroundCircle {
-    stroke: var(--circular-progress-bar-stroke-color)
-} .backgroundCircle.stroke {
-        stroke: transparent;
-    } .progressCircle {
-    stroke-linecap: round;
-} .iconWrapper {
-    display: flex;
-    align-items: center;
-    justify-content: center
-} .iconWrapper.size-144 {
-        max-width: 64px;
-        max-height: 64px;
-    } .iconWrapper.size-128 {
-        max-width: 64px;
-        max-height: 64px;
-    } .iconWrapper.size-80 {
-        max-width: 48px;
-        max-height: 48px;
-    } .iconWrapper.size-64 {
-        max-width: 36px;
-        max-height: 36px;
-    } .iconWrapper.size-48 {
-        max-width: 24px;
-        max-height: 24px;
-    } .iconWrapper.size-24 {
-        max-width: 16px;
-        max-height: 16px;
-    } .iconWrapper.icon-tertiary {
-        color: var(--color-light-neutral-500);
-    } .iconWrapper.icon-positive {
-        color: var(--color-light-status-positive);
-    } .iconWrapper.icon-negative {
-        color: var(--color-light-status-negative);
-    } .iconWrapper.icon-primary-inverted {
-        color: var(--color-light-neutral-1500-inverted);
-    } .iconWrapper.icon-primary {
-        color: var(--color-light-neutral-1500);
-    } .iconWrapper.icon-secondary {
-        color: var(--color-light-neutral-700);
-    } .icon {
-    width: 100%;
-    height: 100%;
-}

package/circular-progress-bar/modern-pcss-raw/Component.d.ts

@@ -1,111 +0,0 @@
-/// <reference types="react" />
-import React from 'react';
-import { ElementType, ReactNode } from "react";
-type TypographyColor = 'primary' | 'secondary' | 'tertiary' | 'positive' | 'negative';
-type CircularProgressBarProps = {
-    /**
-     * Уровень прогресса, %
-     */
-    value: number;
-    /**
-     * Дополнительный класс
-     */
-    className?: string;
-    /**
-     * Основной текст
-     */
-    title?: ReactNode;
-    /**
-     * Цвет контента
-     */
-    contentColor?: TypographyColor | string;
-    /**
-     * Дополнительный текст
-     */
-    subtitle?: ReactNode;
-    /**
-     * Основной текст при 100%
-     */
-    titleComplete?: ReactNode;
-    /**
-     * Дополнительный текст при 100%
-     */
-    subtitleComplete?: ReactNode;
-    /**
-     * Цвет заполнения
-     */
-    view?: 'positive' | 'negative';
-    /**
-     * Размер (xxl — 144×144px, xl — 128×128px, l — 80×80px, m — 64×64px, s — 48×48px, xs — 24×24px)
-     * @description xs, s, m, l, xl, xxl deprecated, используйте вместо них 24, 48, 64 , 80, 128, 144 соответственно
-     */
-    size?: 'xxl' | 'xl' | 'l' | 'm' | 's' | 'xs' | 24 | 48 | 64 | 80 | 128 | 144;
-    /**
-     * Наличие желоба
-     */
-    stroke?: boolean;
-    /**
-     * Заливка при 100%
-     */
-    fillComplete?: boolean;
-    /**
-     * Цвет текста при 100%
-     */
-    completeTextColor?: 'primary' | 'primary-inverted' | 'positive' | 'negative';
-    /**
-     * Цвет иконки при 100%
-     */
-    completeIconColor?: 'primary-inverted' | 'positive' | 'negative' | 'tertiary';
-    /**
-     * Компонент иконки
-     */
-    icon?: ElementType<{
-        className?: string;
-    }>;
-    /**
-     * Компонент иконки при 100%
-     */
-    iconComplete?: ElementType<{
-        className?: string;
-    }>;
-    /**
-     * Направление прогресса (clockwise - по часовой стрелке, counter-clockwise - против часовой стрелки)
-     */
-    direction?: 'clockwise' | 'counter-clockwise';
-    /**
-     * Высота компонента, min = 24; max = 144
-     * использовать совместно с size :
-     * xxl от 144
-     * xl  от 128 до 143
-     * l   от 80 до 127
-     * m   от 64 до 79
-     * s   от 48 до 63
-     * xs  от 24 до 47
-     */
-    height?: number;
-    /**
-     * Id компонента для тестов
-     */
-    dataTestId?: string;
-    /**
-     * Дочерние элементы
-     */
-    children?: ReactNode;
-    /**
-     * Цвет прогресса
-     */
-    progressStrokeColor?: string;
-    /**
-     * Цвет заливки внутри круга
-     */
-    circleColor?: string;
-    /**
-     * Цвет желоба
-     */
-    strokeColor?: string;
-};
-/**
- * Компонент круглого прогресс бара.
- */
-declare const CircularProgressBar: React.FC<CircularProgressBarProps>;
-export { TypographyColor, CircularProgressBarProps, CircularProgressBar };

package/circular-progress-bar/modern-pcss-raw/Component.js

@@ -1,79 +0,0 @@
-import React, { useMemo } from 'react';
-import cn from 'classnames';
-import { Typography } from '../../typography/modern-pcss-raw';
-import { STROKE, SIZES, TYPOGRAPHY_COLOR, SIZE_TO_CLASSNAME_MAP, VIEW_TITLE, VIEW_TEXT } from './consts.js';
-
-const styles = {"component":"component","bg-positive":"bg-positive","bg-negative":"bg-negative","svg":"svg","title":"title","subtitle":"subtitle","labelWrapper":"labelWrapper","label":"label","typography":"typography","size-144":"size-144","size-128":"size-128","size-80":"size-80","size-64":"size-64","size-48":"size-48","size-24":"size-24","backgroundCircle":"backgroundCircle","progressCircle":"progressCircle","positive":"positive","negative":"negative","stroke":"stroke","iconWrapper":"iconWrapper","icon-tertiary":"icon-tertiary","icon-positive":"icon-positive","icon-negative":"icon-negative","icon-primary-inverted":"icon-primary-inverted","icon-primary":"icon-primary","icon-secondary":"icon-secondary","icon":"icon"};
-require('./index.css');
-
-/**
- * Компонент круглого прогресс бара.
- */
-const CircularProgressBar = ({ value, view = 'positive', size = 64, className, dataTestId, title = value ? value.toString() : '0', titleComplete, subtitle, contentColor = 'secondary', subtitleComplete, stroke = true, fillComplete, icon: Icon, iconComplete: IconComplete, completeTextColor, completeIconColor = 'tertiary', direction = 'clockwise', height, children, progressStrokeColor, circleColor, strokeColor, }) => {
-    const memorized = useMemo(() => {
-        const strokeWidth = STROKE[size];
-        const maxProgress = 100;
-        const minProgress = 0;
-        const widthSVG = SIZES[size];
-        const heightSVG = SIZES[size];
-        const center = widthSVG / 2;
-        const radius = center - strokeWidth / 2;
-        const circumference = Math.PI * radius * 2;
-        const progress = Math.min(Math.max(value, minProgress), maxProgress);
-        const strokeDasharray = circumference.toFixed(3);
-        const strokeDashoffset = (((100 - progress) / 100) * circumference).toFixed(3);
-        return {
-            widthSVG,
-            heightSVG,
-            center,
-            radius,
-            strokeDasharray,
-            strokeDashoffset,
-        };
-    }, [value, size]);
-    const isComplete = value === 100;
-    const isCompleteTextColor = isComplete && completeTextColor;
-    const titleContent = titleComplete && isComplete ? titleComplete : title;
-    const subtitleContent = subtitleComplete && isComplete ? subtitleComplete : subtitle;
-    const IconComponent = IconComplete && isComplete ? IconComplete : Icon;
-    const typographyContentColor = TYPOGRAPHY_COLOR.includes(contentColor)
-        ? contentColor
-        : undefined;
-    const renderTitleString = () => SIZES[size] > 64 ? (React.createElement(Typography.TitleMobile, { className: cn(styles.typography, styles.title), color: isCompleteTextColor ? completeTextColor : typographyContentColor, tag: 'div', font: 'system', view: VIEW_TITLE[size], style: {
-            ...(!typographyContentColor && { color: contentColor }),
-        } }, titleContent)) : (React.createElement(Typography.Text, { className: styles.title, color: isCompleteTextColor ? completeTextColor : typographyContentColor, tag: 'div', weight: 'bold', view: VIEW_TEXT[size], style: {
-            ...(!typographyContentColor && { color: contentColor }),
-        } }, titleContent));
-    const renderTitle = () => (typeof title === 'string' ? renderTitleString() : titleContent);
-    const renderSubTitle = () => typeof subtitle === 'string' ? (React.createElement(Typography.Text, { tag: 'div', className: styles.subtitle, color: isCompleteTextColor ? completeTextColor : typographyContentColor, view: 'primary-small', style: {
-            ...(!typographyContentColor && { color: contentColor }),
-        } }, subtitleContent)) : (subtitleContent);
-    const renderIcon = () => (React.createElement("span", { className: cn(styles.iconWrapper, styles[SIZE_TO_CLASSNAME_MAP[size]], styles.tertiary, styles[`icon-${contentColor}`], {
-            [styles[`icon-${completeIconColor}`]]: completeIconColor,
-        }) }, IconComponent && React.createElement(IconComponent, { className: styles.icon })));
-    const renderContent = () => Icon || (IconComplete && isComplete) ? (renderIcon()) : (React.createElement(React.Fragment, null,
-        SIZES[size] > 24 && renderTitle(),
-        SIZES[size] > 64 && renderSubTitle()));
-    return (React.createElement("div", { className: cn(styles.component, styles[SIZE_TO_CLASSNAME_MAP[size]], className, {
-            [styles[`bg-${view}`]]: fillComplete && isComplete,
-        }), style: {
-            ...(height && { height, width: height }),
-            ...(circleColor && { backgroundColor: circleColor }),
-        }, "data-test-id": dataTestId },
-        React.createElement("svg", { viewBox: `0 0 ${memorized.widthSVG} ${memorized.heightSVG}`, className: styles.svg, xmlns: 'http://www.w3.org/2000/svg' },
-            React.createElement("circle", { className: cn(styles.backgroundCircle, styles[SIZE_TO_CLASSNAME_MAP[size]], {
-                    [styles.stroke]: !stroke,
-                }), style: {
-                    ...(strokeColor && stroke && { stroke: strokeColor }),
-                }, cx: memorized.center, cy: memorized.center, r: memorized.radius, strokeWidth: STROKE[size] }),
-            React.createElement("circle", { className: cn(styles.progressCircle, styles[view], styles[SIZE_TO_CLASSNAME_MAP[size]]), style: {
-                    ...(progressStrokeColor && { stroke: progressStrokeColor }),
-                }, cx: memorized.center, cy: memorized.center, r: memorized.radius, strokeWidth: STROKE[size], strokeDasharray: memorized.strokeDasharray, strokeDashoffset: direction === 'counter-clockwise'
-                    ? -memorized.strokeDashoffset
-                    : memorized.strokeDashoffset, transform: `rotate(${-90} ${memorized.center} ${memorized.center})` })),
-        React.createElement("div", { className: cn(styles.labelWrapper, {
-                [styles.label]: Icon || IconComplete,
-            }) }, children || renderContent())));
-};
-
-export { CircularProgressBar };

package/circular-progress-bar/modern-pcss-raw/consts.d.ts

@@ -1,72 +0,0 @@
-declare const SIZES: {
-    xs: number;
-    s: number;
-    m: number;
-    l: number;
-    xl: number;
-    xxl: number;
-    24: number;
-    48: number;
-    64: number;
-    80: number;
-    128: number;
-    144: number;
-};
-declare const STROKE: {
-    xs: number;
-    s: number;
-    m: number;
-    l: number;
-    xl: number;
-    xxl: number;
-    24: number;
-    48: number;
-    64: number;
-    80: number;
-    128: number;
-    144: number;
-};
-declare const VIEW_TITLE: {
-    readonly xs: "small";
-    readonly s: "small";
-    readonly m: "small";
-    readonly l: "xsmall";
-    readonly xl: "medium";
-    readonly xxl: "medium";
-    readonly 24: "small";
-    readonly 48: "small";
-    readonly 64: "small";
-    readonly 80: "xsmall";
-    readonly 128: "medium";
-    readonly 144: "medium";
-};
-declare const VIEW_TEXT: {
-    readonly xs: "secondary-small";
-    readonly s: "secondary-small";
-    readonly m: "secondary-large";
-    readonly l: "secondary-large";
-    readonly xl: "secondary-large";
-    readonly xxl: "secondary-large";
-    readonly 24: "secondary-small";
-    readonly 48: "secondary-small";
-    readonly 64: "secondary-large";
-    readonly 80: "secondary-large";
-    readonly 128: "secondary-large";
-    readonly 144: "secondary-large";
-};
-declare const TYPOGRAPHY_COLOR: string[];
-declare const SIZE_TO_CLASSNAME_MAP: {
-    xs: string;
-    s: string;
-    m: string;
-    l: string;
-    xl: string;
-    xxl: string;
-    24: string;
-    48: string;
-    64: string;
-    80: string;
-    128: string;
-    144: string;
-};
-export { SIZES, STROKE, VIEW_TITLE, VIEW_TEXT, TYPOGRAPHY_COLOR, SIZE_TO_CLASSNAME_MAP };

package/circular-progress-bar/modern-pcss-raw/consts.js

@@ -1,73 +0,0 @@
-const SIZES = {
-    xs: 24,
-    s: 48,
-    m: 64,
-    l: 80,
-    xl: 128,
-    xxl: 144,
-    24: 24,
-    48: 48,
-    64: 64,
-    80: 80,
-    128: 128,
-    144: 144,
-};
-const STROKE = {
-    xs: 4,
-    s: 4,
-    m: 6,
-    l: 8,
-    xl: 10,
-    xxl: 12,
-    24: 4,
-    48: 4,
-    64: 6,
-    80: 8,
-    128: 10,
-    144: 12,
-};
-const VIEW_TITLE = {
-    xs: 'small',
-    s: 'small',
-    m: 'small',
-    l: 'xsmall',
-    xl: 'medium',
-    xxl: 'medium',
-    24: 'small',
-    48: 'small',
-    64: 'small',
-    80: 'xsmall',
-    128: 'medium',
-    144: 'medium',
-};
-const VIEW_TEXT = {
-    xs: 'secondary-small',
-    s: 'secondary-small',
-    m: 'secondary-large',
-    l: 'secondary-large',
-    xl: 'secondary-large',
-    xxl: 'secondary-large',
-    24: 'secondary-small',
-    48: 'secondary-small',
-    64: 'secondary-large',
-    80: 'secondary-large',
-    128: 'secondary-large',
-    144: 'secondary-large',
-};
-const TYPOGRAPHY_COLOR = ['primary', 'secondary', 'tertiary', 'positive', 'negative'];
-const SIZE_TO_CLASSNAME_MAP = {
-    xs: 'size-24',
-    s: 'size-48',
-    m: 'size-64',
-    l: 'size-80',
-    xl: 'size-128',
-    xxl: 'size-144',
-    24: 'size-24',
-    48: 'size-48',
-    64: 'size-64',
-    80: 'size-80',
-    128: 'size-128',
-    144: 'size-144',
-};
-
-export { SIZES, SIZE_TO_CLASSNAME_MAP, STROKE, TYPOGRAPHY_COLOR, VIEW_TEXT, VIEW_TITLE };

package/circular-progress-bar/modern-pcss-raw/index.d.ts

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

package/circular-progress-bar/modern-pcss-raw/index.js

@@ -1,5 +0,0 @@
-export { CircularProgressBar } from './Component.js';
-import 'react';
-import 'classnames';
-import '../../typography/modern-pcss-raw';
-import './consts.js';

package/code-input/cssm/components/base-code-input/index.module.css

@@ -1,46 +0,0 @@
-: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 */ /* 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 */ /* deprecated */ /* deprecated */
-} /* deprecated */ :root {
-    --color-light-text-negative: #ec2e14; /* 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 {
-} :root {
-    --gap-xs: 8px;
-} :root {
-} :root {
-} .component {
-    display: flex;
-    flex-direction: column;
-} .error {
-    font-size: 14px;
-    line-height: 20px;
-    font-weight: 400;
-
-    margin-top: var(--gap-xs);
-    color: var(--color-light-text-negative);
-} @keyframes shake {
-    0% {
-        transform: translateX(0);
-    }
-
-    25% {
-        transform: translateX(-2px);
-    }
-
-    75% {
-        transform: translateX(2px);
-    }
-
-    100% {
-        transform: translateX(0);
-    }
-} .shake {
-    animation: shake 0.15s linear 0s 3;
-}

package/code-input/cssm/components/input/index.module.css

@@ -1,95 +0,0 @@
-: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 */ /* 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 */ /* deprecated */ /* deprecated */
-} /* deprecated */ :root {
-    --color-light-status-muted-negative: #ffebeb;
-    --color-light-text-negative: #ec2e14;
-    --color-light-text-primary: #0e0e0e;
-    --color-light-text-tertiary: rgba(5, 8, 29, 0.38); /* 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-s: 4px;
-} :root {
-    --gap-xs: 8px;
-} :root {
-    --font-family-system: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica,
-        sans-serif;
-} :root {
-} :root {
-
-    /* disabled */
-
-    /* focus */
-
-    /* hover */
-
-    /* error */
-
-    /* height */
-
-    /* paddings */
-
-    /* disabled */
-
-    /* font */
-
-    /* border-radius */
-
-    /* paddings mobile */
-
-    /* border-radius mobile */
-
-    /* color mobile */
-
-    /* error mobile */
-} :root {
-    --code-input-font-size: 30px;
-    --code-input-font-weight: 700;
-    --code-input-font-family: var(--font-family-system);
-    --code-input-text-color: var(--color-light-text-primary);
-    --code-input-error-bg-color: var(--color-light-status-muted-negative);
-} .component {
-    display: flex;
-} .input {
-    flex-shrink: 0;
-    width: 36px;
-    height: 48px;
-    margin-right: var(--gap-xs);
-    padding: 0;
-    border: none;
-    border-radius: var(--border-radius-s);
-    box-sizing: border-box;
-    outline: none;
-    color: var(--code-input-text-color);
-    text-align: center;
-    font-size: var(--code-input-font-size);
-    font-weight: var(--code-input-font-weight);
-    font-family: var(--code-input-font-family)
-} .input:last-child {
-        margin-right: 0;
-    } .input.hasError {
-        color: var(--color-light-text-negative);
-        caret-color: var(--code-input-text-color);
-        background-color: var(--code-input-error-bg-color);
-    } .input.disabled {
-        color: var(--color-light-text-tertiary);
-        opacity: 1;
-    } .input:-webkit-autofill {
-        -webkit-text-fill-color: var(--code-input-text-color);
-    } .input:-webkit-autofill,
-    .input:-webkit-autofill:hover,
-    .input:-webkit-autofill:focus,
-    .input:-webkit-autofill:active {
-        /* Hack from http://stackoverflow.com/a/29350537 */
-        -webkit-transition: background-color 999999s ease-in-out 0s;
-        transition: background-color 999999s ease-in-out 0s;
-    } .compact {
-    width: 32px;
-    height: 48px;
-}