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

package/button/cssm/vars.css

@@ -1,96 +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 { /* 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 {
-} :root {
-} :root {
-} :root {
-    /* misc */
-
-    /* border-radius desktop */
-
-    /* primary */
-
-    /* accent */
-
-    /* secondary */
-
-    /* tertiary */
-
-    /* outlined */
-
-    /* ghost */
-
-    /* text */
-
-    /* link */
-
-    /* transparent */
-
-    /* loader */
-
-    /* primary inverted */
-
-    /* accent inverted */
-
-    /* secondary inverted */
-
-    /* tertiary inverted */
-
-    /* outlined inverted */
-
-    /* ghost inverted */
-
-    /* text inverted */
-
-    /* link inverted */
-
-    /* transparent inverted */
-
-    /* loader inverted */
-
-    /* border-radius mobile */
-
-    /* primary mobile */
-
-    /* primary inverted mobile */
-
-    /* secondary mobile */
-
-    /* secondary inverted mobile */
-
-    /* tertiary mobile */
-
-    /* tertiary inverted mobile */
-
-    /* outlined mobile */
-
-    /* outlined inverted mobile */
-
-    /* link mobile */
-
-    /* link inverted mobile */
-
-    /* transparent mobile */
-
-    /* transparent inverted mobile */
-
-    /* ghost mobile */
-
-    /* ghost mobile inverted */
-
-    /* text mobile */
-
-    /* text mobile inverted */
-
-    /* loader mobile */
-}

package/button/modern-pcss-raw/Component.responsive.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import React from 'react';
-import { ButtonProps } from "./typings";
-declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
-export { Button };

package/button/modern-pcss-raw/Component.responsive.js

@@ -1,19 +0,0 @@
-import React, { forwardRef } from 'react';
-import { useMatchMedia } from '../../mq/modern-pcss-raw';
-import { ButtonDesktop } from './desktop/Component.desktop.js';
-import { ButtonMobile } from './mobile/Component.mobile.js';
-import './components/base-button/Component.js';
-import 'react-merge-refs';
-import 'classnames';
-import '../../shared/modern-pcss-raw';
-import '../../spinner/modern-pcss-raw';
-import '@alfalab/hooks';
-
-const Button = forwardRef(({ children, breakpoint = 1024, ...restProps }, ref) => {
-    const query = `(min-width: ${breakpoint}px)`;
-    const [isDesktop] = useMatchMedia(query);
-    const Component = isDesktop ? ButtonDesktop : ButtonMobile;
-    return (React.createElement(Component, { ref: ref, ...restProps }, children));
-});
-
-export { Button };

package/button/modern-pcss-raw/components/base-button/Component.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import React from 'react';
-import { CommonButtonProps, PrivateButtonProps } from "../../typings";
-/**
- * Минимальное время отображения лоадера - 500мс,
- * чтобы при быстрых ответах от сервера кнопка не «моргала».
- */
-declare const LOADER_MIN_DISPLAY_INTERVAL = 500;
-declare const BaseButton: React.ForwardRefExoticComponent<(CommonButtonProps & PrivateButtonProps) & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
-export { LOADER_MIN_DISPLAY_INTERVAL, BaseButton };

package/button/modern-pcss-raw/components/base-button/Component.js

@@ -1,121 +0,0 @@
-import React, { useRef, useState, useEffect } from 'react';
-import mergeRefs from 'react-merge-refs';
-import cn from 'classnames';
-import { getDataTestId } from '../../../../shared/modern-pcss-raw';
-import { Spinner } from '../../../../spinner/modern-pcss-raw';
-import { useFocus } from '@alfalab/hooks';
-
-const defaultColors = {"accent":"accent","loader":"loader","primary":"primary","secondary":"secondary","outlined":"outlined","tertiary":"tertiary","filled":"filled","transparent":"transparent","link":"link","text":"text","ghost":"ghost","component":"component","loading":"loading"};
-require('./default.css');
-
-const commonStyles = {"component":"component","hug":"hug","fill":"fill","hint":"hint","allowBackdropBlur":"allowBackdropBlur","secondary":"secondary","accent":"accent","primary":"primary","focused":"focused","loading":"loading","label":"label","addons":"addons","stretchText":"stretchText","loader":"loader","size-32":"size-32","iconOnly":"iconOnly","size-40":"size-40","size-48":"size-48","size-56":"size-56","size-64":"size-64","size-72":"size-72","withRightAddons":"withRightAddons","ghost":"ghost","text":"text","withLeftAddons":"withLeftAddons","link":"link","transparent":"transparent","block":"block","nowrap":"nowrap","rounded":"rounded"};
-require('./index.css');
-
-const invertedColors = {"accent":"accent","loader":"loader","primary":"primary","secondary":"secondary","outlined":"outlined","tertiary":"tertiary","filled":"filled","transparent":"transparent","link":"link","text":"text","ghost":"ghost","component":"component","loading":"loading"};
-require('./inverted.css');
-
-/* eslint-disable complexity */
-const colorStyles = {
-    default: defaultColors,
-    inverted: invertedColors,
-};
-/**
- * Минимальное время отображения лоадера - 500мс,
- * чтобы при быстрых ответах от сервера кнопка не «моргала».
- */
-const LOADER_MIN_DISPLAY_INTERVAL = 500;
-const logWarning = (view) => {
-    if (process.env.NODE_ENV !== 'development') {
-        return;
-    }
-    const viewsMap = {
-        link: 'transparent',
-        ghost: 'text',
-    };
-    // eslint-disable-next-line no-console
-    console.warn(
-    // eslint-disable-next-line prefer-template
-    `@alfalab/core-components/button: view='${view}' будет удален в следующих мажорных версиях. ` +
-        `Используйте view='${viewsMap[view]}'. Чтобы поменять все кнопки на проекте разом, можно воспользоваться codemod: ` +
-        'npx @alfalab/core-components-codemod --transformers=button-views-45 src/**/*.tsx');
-};
-const SIZE_TO_CLASSNAME_MAP = {
-    xxs: 'size-32',
-    xs: 'size-40',
-    s: 'size-48',
-    m: 'size-56',
-    l: 'size-64',
-    xl: 'size-72',
-    32: 'size-32',
-    40: 'size-40',
-    48: 'size-48',
-    56: 'size-56',
-    64: 'size-64',
-    72: 'size-72',
-};
-const BaseButton = React.forwardRef(({ allowBackdropBlur, children, view = 'secondary', shape = 'rectangular', textResizing = 'hug', hint, leftAddons, rightAddons, size = 56, block = false, className, spinnerClassName, dataTestId, href, loading = false, nowrap = false, colors = 'default', Component = href ? 'a' : 'button', onClick, styles = {}, colorStylesMap = { default: {}, inverted: {} }, ...restProps }, ref) => {
-    if (['link', 'ghost'].includes(view)) {
-        logWarning(view);
-    }
-    const buttonRef = useRef(null);
-    const [focused] = useFocus(buttonRef, 'keyboard');
-    const [loaderTimePassed, setLoaderTimePassed] = useState(true);
-    const timerId = useRef(0);
-    const showLoader = loading || !loaderTimePassed;
-    const showHint = hint && ['size-56', 'size-64', 'size-72'].includes(SIZE_TO_CLASSNAME_MAP[size]);
-    const iconOnly = !children;
-    const componentProps = {
-        className: cn(commonStyles.component, commonStyles[view], commonStyles[SIZE_TO_CLASSNAME_MAP[size]], commonStyles[textResizing], shape === 'rectangular' && styles[SIZE_TO_CLASSNAME_MAP[size]], shape === 'rounded' && commonStyles[shape], colorStyles[colors].component, colorStyles[colors][view], colorStylesMap[colors].component, {
-            [commonStyles.allowBackdropBlur]: allowBackdropBlur,
-            [colorStylesMap[colors][view]]: Boolean(colorStylesMap[colors][view]),
-            [commonStyles.focused]: focused,
-            [commonStyles.block]: block,
-            [commonStyles.iconOnly]: iconOnly,
-            [commonStyles.loading]: showLoader,
-            [commonStyles.withRightAddons]: Boolean(rightAddons) && !iconOnly,
-            [commonStyles.withLeftAddons]: Boolean(leftAddons) && !iconOnly,
-            [colorStyles[colors].loading]: showLoader,
-            [colorStylesMap[colors].loading]: showLoader,
-        }, className),
-        'data-test-id': dataTestId || null,
-    };
-    const { disabled, type = 'button', ...restButtonProps } = restProps;
-    const buttonChildren = (React.createElement(React.Fragment, null,
-        leftAddons && React.createElement("span", { className: commonStyles.addons }, leftAddons),
-        children && (React.createElement("span", { className: cn(commonStyles.label, {
-                [commonStyles.nowrap]: nowrap,
-                [commonStyles.stretchText]: !(leftAddons || rightAddons) || textResizing === 'fill',
-            }) },
-            children,
-            showHint && React.createElement("span", { className: commonStyles.hint }, hint))),
-        showLoader && (React.createElement(Spinner, { dataTestId: getDataTestId(dataTestId, 'loader'), visible: true, className: cn(commonStyles.loader, colorStyles[colors].loader, colorStylesMap[colors].loader, spinnerClassName) })),
-        rightAddons && React.createElement("span", { className: commonStyles.addons }, rightAddons)));
-    useEffect(() => {
-        if (loading) {
-            setLoaderTimePassed(false);
-            timerId.current = window.setTimeout(() => {
-                setLoaderTimePassed(true);
-            }, LOADER_MIN_DISPLAY_INTERVAL);
-        }
-    }, [loading]);
-    useEffect(() => () => {
-        window.clearTimeout(timerId.current);
-    }, []);
-    const handleClick = (e) => {
-        if (disabled || showLoader) {
-            e.preventDefault();
-            e.stopPropagation();
-            return;
-        }
-        onClick?.(e);
-    };
-    if (href) {
-        const { target } = restProps;
-        // Для совместимости с react-router-dom, меняем href на to
-        const hrefProps = { [typeof Component === 'string' ? 'href' : 'to']: href };
-        return (React.createElement(Component, { rel: target === '_blank' ? 'noreferrer noopener' : undefined, ...componentProps, ...restProps, ...hrefProps, onClick: handleClick, disabled: disabled || showLoader, ref: mergeRefs([buttonRef, ref]) }, buttonChildren));
-    }
-    return (React.createElement(Component, { ...componentProps, ...restButtonProps, onClick: handleClick, type: type, disabled: disabled || showLoader, ref: mergeRefs([buttonRef, ref]) }, buttonChildren));
-});
-
-export { BaseButton, LOADER_MIN_DISPLAY_INTERVAL };

package/button/modern-pcss-raw/components/base-button/index.d.ts

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

package/button/modern-pcss-raw/components/base-button/index.js

@@ -1,7 +0,0 @@
-export { BaseButton, LOADER_MIN_DISPLAY_INTERVAL } from './Component.js';
-import 'react';
-import 'react-merge-refs';
-import 'classnames';
-import '../../../../shared/modern-pcss-raw';
-import '../../../../spinner/modern-pcss-raw';
-import '@alfalab/hooks';

package/button/modern-pcss-raw/desktop/Component.desktop.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import React from 'react';
-import { CommonButtonProps } from "../typings";
-declare const ButtonDesktop: React.ForwardRefExoticComponent<CommonButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
-export { ButtonDesktop };

package/button/modern-pcss-raw/desktop/Component.desktop.js

@@ -1,24 +0,0 @@
-import React, { forwardRef } from 'react';
-import { BaseButton } from '../components/base-button/Component.js';
-import 'react-merge-refs';
-import 'classnames';
-import '../../../shared/modern-pcss-raw';
-import '../../../spinner/modern-pcss-raw';
-import '@alfalab/hooks';
-
-const defaultColors = {"primary":"primary","loader":"loader","secondary":"secondary","text":"text","ghost":"ghost","component":"component","loading":"loading","outlined":"outlined","tertiary":"tertiary","transparent":"transparent","link":"link"};
-require('./default.desktop.css');
-
-const styles = {"size-32":"size-32","size-40":"size-40","size-48":"size-48","size-56":"size-56","size-64":"size-64","size-72":"size-72"};
-require('./desktop.css');
-
-const invertedColors = {"primary":"primary","loader":"loader","secondary":"secondary","text":"text","ghost":"ghost","component":"component","loading":"loading","outlined":"outlined","tertiary":"tertiary","transparent":"transparent","link":"link"};
-require('./inverted.desktop.css');
-
-const colorStyles = {
-    default: defaultColors,
-    inverted: invertedColors,
-};
-const ButtonDesktop = forwardRef((restProps, ref) => (React.createElement(BaseButton, { ...restProps, ref: ref, styles: styles, colorStylesMap: colorStyles })));
-
-export { ButtonDesktop };

package/button/modern-pcss-raw/desktop/index.d.ts

@@ -1,2 +0,0 @@
-export { ButtonDesktop } from "./Component.desktop";
-export type { CommonButtonProps as ButtonDesktopProps } from "../typings";

package/button/modern-pcss-raw/desktop/index.js

@@ -1,8 +0,0 @@
-export { ButtonDesktop } from './Component.desktop.js';
-import 'react';
-import '../components/base-button/Component.js';
-import 'react-merge-refs';
-import 'classnames';
-import '../../../shared/modern-pcss-raw';
-import '../../../spinner/modern-pcss-raw';
-import '@alfalab/hooks';

package/button/modern-pcss-raw/index.d.ts

@@ -1,2 +0,0 @@
-export { Button } from "./Component.responsive";
-export type { ButtonProps } from "./typings";

package/button/modern-pcss-raw/index.js

@@ -1,11 +0,0 @@
-export { Button } from './Component.responsive.js';
-import 'react';
-import '../../mq/modern-pcss-raw';
-import './desktop/Component.desktop.js';
-import './components/base-button/Component.js';
-import 'react-merge-refs';
-import 'classnames';
-import '../../shared/modern-pcss-raw';
-import '../../spinner/modern-pcss-raw';
-import '@alfalab/hooks';
-import './mobile/Component.mobile.js';

package/button/modern-pcss-raw/mobile/Component.mobile.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import React from 'react';
-import { CommonButtonProps } from "../typings";
-declare const ButtonMobile: React.ForwardRefExoticComponent<CommonButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
-export { ButtonMobile };

package/button/modern-pcss-raw/mobile/Component.mobile.js

@@ -1,24 +0,0 @@
-import React, { forwardRef } from 'react';
-import { BaseButton } from '../components/base-button/Component.js';
-import 'react-merge-refs';
-import 'classnames';
-import '../../../shared/modern-pcss-raw';
-import '../../../spinner/modern-pcss-raw';
-import '@alfalab/hooks';
-
-const defaultColors = {"primary":"primary","loader":"loader","secondary":"secondary","text":"text","ghost":"ghost","component":"component","loading":"loading","outlined":"outlined","tertiary":"tertiary","transparent":"transparent","link":"link"};
-require('./default.mobile.css');
-
-const invertedColors = {"primary":"primary","loader":"loader","secondary":"secondary","text":"text","ghost":"ghost","component":"component","loading":"loading","outlined":"outlined","tertiary":"tertiary","transparent":"transparent","link":"link"};
-require('./inverted.mobile.css');
-
-const styles = {"size-32":"size-32","size-40":"size-40","size-48":"size-48","size-56":"size-56","size-64":"size-64","size-72":"size-72"};
-require('./mobile.css');
-
-const colorStyles = {
-    default: defaultColors,
-    inverted: invertedColors,
-};
-const ButtonMobile = forwardRef((restProps, ref) => (React.createElement(BaseButton, { ...restProps, ref: ref, colorStylesMap: colorStyles, styles: styles })));
-
-export { ButtonMobile };

package/button/modern-pcss-raw/mobile/index.d.ts

@@ -1,2 +0,0 @@
-export { ButtonMobile } from "./Component.mobile";
-export type { CommonButtonProps as ButtonMobileProps } from "../typings";

package/button/modern-pcss-raw/mobile/index.js

@@ -1,8 +0,0 @@
-export { ButtonMobile } from './Component.mobile.js';
-import 'react';
-import '../components/base-button/Component.js';
-import 'react-merge-refs';
-import 'classnames';
-import '../../../shared/modern-pcss-raw';
-import '../../../spinner/modern-pcss-raw';
-import '@alfalab/hooks';

package/button/modern-pcss-raw/shared/index.d.ts

@@ -1 +0,0 @@
-export { getButtonTestIds } from "../utils";

package/button/modern-pcss-raw/shared/index.js

@@ -1,2 +0,0 @@
-export { getButtonTestIds } from '../utils.js';
-import '../../../shared/modern-pcss-raw';

package/button/modern-pcss-raw/typings.d.ts

@@ -1,114 +0,0 @@
-import { AnchorHTMLAttributes, ButtonHTMLAttributes, ElementType, ReactNode } from 'react';
-type StyleColors = {
-    default: {
-        [key: string]: string;
-    };
-    inverted: {
-        [key: string]: string;
-    };
-};
-type ComponentProps = {
-    /**
-     * Тип кнопки
-     * @default secondary
-     */
-    view?: 'accent' | 'primary' | 'secondary' | 'outlined' | 'transparent' | 'text' | 'tertiary' | 'filled' | 'link' | 'ghost';
-    /**
-     * Форма кнопки
-     * @default rectangular
-     */
-    shape?: 'rounded' | 'rectangular';
-    /**
-     * Ширина текстового контента
-     * @default hug
-     */
-    textResizing?: 'fill' | 'hug';
-    /**
-     *  Подпись под лейблом (видна только в размерах >= m)
-     */
-    hint?: ReactNode;
-    /**
-     * Слот слева
-     */
-    leftAddons?: ReactNode;
-    /**
-     * Слот справа
-     */
-    rightAddons?: ReactNode;
-    /**
-     * Размер компонента
-     * @default 56
-     * @description xxs, xs, s, m, l, xl deprecated, используйте вместо них 32, 40, 48, 56, 64, 72 соответственно
-     */
-    size?: 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 32 | 40 | 48 | 56 | 64 | 72;
-    /**
-     * Растягивает компонент на ширину контейнера
-     * @default false
-     */
-    block?: boolean;
-    /**
-     * Дополнительный класс
-     */
-    className?: string;
-    /**
-     * Дополнительный класс для спиннера
-     */
-    spinnerClassName?: string;
-    /**
-     * Выводит ссылку в виде кнопки
-     */
-    href?: string;
-    /**
-     * Позволяет использовать кастомный компонент для кнопки (например Link из роутера)
-     */
-    Component?: ElementType;
-    /**
-     * Идентификатор для систем автоматизированного тестирования.
-     * Для спиннера используется модификатор -loader
-     */
-    dataTestId?: string;
-    /**
-     * Показать лоадер
-     * @default false
-     */
-    loading?: boolean;
-    /**
-     * Не переносить текст кнопки на новую строку
-     * @default false
-     */
-    nowrap?: boolean;
-    /**
-     * Набор цветов для компонента
-     */
-    colors?: 'default' | 'inverted';
-    /**
-     * Включает размытие фона для некоторых вариантов кнопки
-     * @description Может привести к просадке fps и другим багам. Старайтесь не размещать слишком много заблюреных элементов на одной странице.
-     */
-    allowBackdropBlur?: boolean;
-    /**
-     * Дочерние элементы.
-     */
-    children?: ReactNode;
-};
-type PrivateButtonProps = {
-    /**
-     * Основные стили компонента.
-     */
-    styles: {
-        [key: string]: string;
-    };
-    /**
-     * Стили компонента для default и inverted режима.
-     */
-    colorStylesMap: StyleColors;
-};
-type CommonButtonProps = ComponentProps & Partial<AnchorHTMLAttributes<HTMLAnchorElement> | ButtonHTMLAttributes<HTMLButtonElement>>;
-type ButtonProps = CommonButtonProps & {
-    /**
-     * Контрольная точка, с нее начинается desktop версия
-     * @default 1024
-     */
-    breakpoint?: number;
-};
-export { StyleColors, ComponentProps, PrivateButtonProps, CommonButtonProps, ButtonProps };

package/button/modern-pcss-raw/typings.js

@@ -1 +0,0 @@
-

package/button/modern-pcss-raw/utils.d.ts

@@ -1,5 +0,0 @@
-declare function getButtonTestIds(dataTestId: string): {
-    button: string;
-    spinner: string;
-};
-export { getButtonTestIds };

package/button/modern-pcss-raw/utils.js

@@ -1,10 +0,0 @@
-import { getDataTestId } from '../../shared/modern-pcss-raw';
-
-function getButtonTestIds(dataTestId) {
-    return {
-        button: dataTestId,
-        spinner: getDataTestId(dataTestId, 'loader'),
-    };
-}
-
-export { getButtonTestIds };

package/calendar/cssm/components/calendar-mobile/backdrop-transitions.module.css

@@ -1,33 +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 { /* 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 */
-    --color-light-bg-primary-inverted-alpha-10: rgba(14, 14, 14, 0.1);
-} :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 {
-} :root {
-} :root {
-} .appear,
-.enter {
-    background-color: transparent;
-} .appearActive,
-.enterActive,
-.appearDone,
-.enterDone {
-    background-color: var(--color-light-bg-primary-inverted-alpha-10);
-    transition: background-color 80ms linear;
-} .exit {
-    background-color: var(--color-light-bg-primary-inverted-alpha-10);
-} .exitActive,
-.exitDone {
-    background-color: transparent;
-    transition: background-color 80ms linear;
-    transition-delay: 280ms;
-}