npm - @alfalab/core-components - Versions diffs - 48.21.0-beta.4 → 48.21.0 - Mend

@alfalab/core-components 48.21.0-beta.4 → 48.21.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (722) hide show

package/filter-tag/components/base-filter-tag/inverted.css ADDED Viewed

@@ -0,0 +1,197 @@
+/* hash: 15ktw */
+: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-accent-secondary-inverted: #f2f3f5;
+    --color-light-neutral-500-inverted: #4a4a51;
+    --color-light-neutral-translucent-1300: rgba(3, 3, 6, 0.88);
+    --color-light-neutral-translucent-1300-inverted: rgba(255, 255, 255, 0.94);
+    --color-light-neutral-translucent-500: rgba(9, 12, 37, 0.28);
+    --color-light-neutral-translucent-500-inverted: rgba(228, 228, 251, 0.28);
+    --color-light-neutral-translucent-700: rgba(4, 4, 21, 0.47);
+    --color-light-neutral-translucent-700-hover: rgba(4, 4, 19, 0.55);
+    --color-light-neutral-translucent-700-press: rgba(1, 1, 12, 0.63);
+    --color-light-text-primary: rgba(3, 3, 6, 0.88);
+    --color-light-text-primary-inverted: rgba(255, 255, 255, 0.94);
+    --color-light-text-tertiary-inverted: rgba(233, 233, 250, 0.37); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* 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 */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* 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 */
+} :root {
+    /* Hard */
+    /* Up */
+    /* Hard up */
+} :root { /* 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 */
+    /* новые значения, используйте их */
+    /* no-unit может приводить к проблемам в calc (#1559) */
+    /* stylelint-disable-next-line length-zero-no-unit */
+} :root {
+} :root {
+} /* сбрасывает синюю подсветку при нажатии */ :root {
+    /* border */
+    --tag-border-width: 1px;
+    /* rectangular border-radius */
+    /* rounded border-radius */
+    /* background-color outlined */
+    /* background-color filled */
+    /* background-color checked */
+    /* text color */
+    /* inverted */
+    /* border */
+    --tag-inverted-border-color: var(--color-light-neutral-translucent-500-inverted);
+    --tag-inverted-filled-border-color: transparent;
+    --tag-inverted-border-color-hover: var(--color-light-neutral-translucent-500-inverted);
+    --tag-inverted-border-color-active: var(--color-light-neutral-translucent-500-inverted);
+    --tag-inverted-border-color-checked: var(--color-light-accent-secondary-inverted);
+    --tag-inverted-border-color-disabled: var(--color-light-neutral-translucent-500-inverted);
+    /* background-color outlined */
+    --tag-inverted-outlined-background-color: transparent;
+    --tag-inverted-outlined-background-color-hover: var(
+        --color-light-transparent-default-inverted-hover
+    );
+    --tag-inverted-outlined-background-color-disabled: transparent;
+    --tag-inverted-outlined-background-color-active: var(
+        --color-light-transparent-default-inverted-press
+    );
+    /* background-color filled */
+    /* background-color checked */
+    --tag-inverted-background-color-checked: var(--color-light-accent-secondary-inverted);
+    --tag-inverted-background-color-checked-hover: var(
+        --color-light-accent-secondary-inverted-hover
+    );
+    --tag-inverted-background-color-checked-active: var(
+        --color-light-accent-secondary-inverted-press
+    );
+    --tag-inverted-background-color-checked-disabled: var(
+        --color-light-neutral-translucent-100-inverted
+    );
+    /* text color */
+    --tag-inverted-text-color: var(--color-light-text-primary-inverted);
+    --tag-inverted-text-color-checked: var(--color-light-text-primary);
+    --tag-inverted-text-color-disabled: var(--color-light-text-tertiary-inverted);
+    --tag-inverted-text-color-checked-disabled: var(--color-light-text-tertiary-inverted);
+    /* mobile */
+    /* mobile inverted */
+} :root {
+    /* chevron */
+    --filter-tag-chevron-color: var(--color-light-neutral-translucent-1300);
+    /* chevron inverted */
+    --filter-tag-inverted-chevron-color: var(--color-light-neutral-translucent-1300-inverted);
+    --filter-tag-inverted-chevron-disabled-color: var(--color-light-neutral-500-inverted);
+    /* separator */
+    /* separator inverted */
+    --filter-tag-inverted-separator-background-color-hover: transparent;
+    --filter-tag-inverted-separator-background-color-active: transparent;
+    /* clear */
+    /* clear inverted */
+    --filter-tag-inverted-clear-color: var(--color-light-neutral-translucent-700);
+    --filter-tag-inverted-clear-color-hover: var(--color-light-neutral-translucent-700-hover);
+    --filter-tag-inverted-clear-color-active: var(--color-light-neutral-translucent-700-press);
+    --filter-tag-inverted-clear-before-background-color: var(--color-light-neutral-translucent-500);
+} .filter-tag__component_1c2gj.filter-tag__disabled_1c2gj {
+        background-color: var(--tag-inverted-outlined-background-color-disabled);
+    } .filter-tag__component_1c2gj.filter-tag__checked_1c2gj:not(.filter-tag__disabled_1c2gj) {
+            background-color: var(--tag-inverted-background-color-checked);
+        } @media (hover: hover) {
+            .filter-tag__component_1c2gj.filter-tag__checked_1c2gj:not(.filter-tag__disabled_1c2gj):hover {
+                background-color: var(--tag-inverted-background-color-checked-hover);
+            }
+        } .filter-tag__component_1c2gj.filter-tag__checked_1c2gj:not(.filter-tag__disabled_1c2gj):active {
+            background-color: var(--tag-inverted-background-color-checked-active);
+        } .filter-tag__chevron_1c2gj {
+    color: var(--filter-tag-inverted-chevron-color);
+} .filter-tag__valueButton_1c2gj {
+    color: var(--tag-inverted-text-color);
+    background-color: var(--tag-inverted-outlined-background-color);
+    border: var(--tag-border-width) solid var(--tag-inverted-border-color)
+} .filter-tag__valueButton_1c2gj:disabled > .filter-tag__chevron_1c2gj {
+            color: var(--filter-tag-inverted-chevron-disabled-color);
+        } .filter-tag__valueButton_1c2gj.filter-tag__outlined_1c2gj {
+        color: var(--tag-inverted-text-color);
+        border-color: var(--tag-inverted-border-color);
+        background-color: var(--tag-inverted-outlined-background-color)
+    } .filter-tag__valueButton_1c2gj.filter-tag__outlined_1c2gj:disabled {
+            border-color: var(--tag-inverted-border-color-disabled);
+            color: var(--tag-inverted-text-color-disabled);
+            background-color: var(--tag-inverted-outlined-background-color-disabled);
+        } @media (hover: hover) {
+            .filter-tag__valueButton_1c2gj.filter-tag__outlined_1c2gj:not(:disabled):hover {
+                border-color: var(--tag-inverted-border-color-hover);
+                background-color: var(--tag-inverted-outlined-background-color-hover);
+            }
+        } .filter-tag__valueButton_1c2gj.filter-tag__outlined_1c2gj:not(:disabled):active {
+            border-color: var(--tag-inverted-border-color-active);
+            background-color: var(--tag-inverted-outlined-background-color-active);
+        } .filter-tag__valueButton_1c2gj.filter-tag__filled_1c2gj {
+        color: var(--tag-inverted-text-color);
+        border-color: var(--tag-inverted-filled-border-color)
+    } .filter-tag__valueButton_1c2gj.filter-tag__filled_1c2gj:disabled {
+            color: var(--tag-inverted-text-color-disabled);
+        } .filter-tag__valueButton_1c2gj.filter-tag__checked_1c2gj {
+        color: var(--tag-inverted-text-color-checked);
+        background-color: var(--tag-inverted-background-color-checked);
+        border-color: var(--tag-inverted-border-color-checked)
+    } .filter-tag__valueButton_1c2gj.filter-tag__checked_1c2gj > .filter-tag__chevron_1c2gj {
+            color: var(--filter-tag-chevron-color);
+        } @media (hover: hover) {
+            .filter-tag__valueButton_1c2gj.filter-tag__checked_1c2gj:not(:disabled):hover {
+                background-color: var(--tag-inverted-background-color-checked-hover);
+            }
+        } .filter-tag__valueButton_1c2gj.filter-tag__checked_1c2gj:not(:disabled):active {
+            background-color: var(--tag-inverted-background-color-checked-active);
+        } @media (hover: hover) {
+            .filter-tag__valueButton_1c2gj.filter-tag__checked_1c2gj:not(:disabled):hover + .filter-tag__clear_1c2gj:before {
+                background-color: var(--filter-tag-inverted-separator-background-color-hover);
+            }
+        } .filter-tag__valueButton_1c2gj.filter-tag__checked_1c2gj:not(:disabled):active + .filter-tag__clear_1c2gj:before {
+            background-color: var(--filter-tag-inverted-separator-background-color-active);
+        } .filter-tag__valueButton_1c2gj.filter-tag__checked_1c2gj:disabled {
+            color: var(--tag-inverted-text-color-checked-disabled);
+            background-color: var(--tag-inverted-background-color-checked-disabled)
+        } .filter-tag__valueButton_1c2gj.filter-tag__checked_1c2gj:disabled > .filter-tag__chevron_1c2gj {
+                color: var(--filter-tag-inverted-chevron-disabled-color);
+            } .filter-tag__clear_1c2gj {
+    color: var(--filter-tag-inverted-clear-color);
+    background-color: var(--tag-inverted-background-color-checked)
+} .filter-tag__clear_1c2gj:before {
+        background-color: var(--filter-tag-inverted-clear-before-background-color);
+    } @media (hover: hover) {
+        .filter-tag__clear_1c2gj:hover:before {
+            background-color: var(--filter-tag-inverted-separator-background-color-hover);
+        }
+    } .filter-tag__clear_1c2gj:active:before {
+        background-color: var(--filter-tag-inverted-separator-background-color-active);
+    } @media (hover: hover) {
+        .filter-tag__clear_1c2gj:hover {
+            color: var(--filter-tag-inverted-clear-color-hover);
+            background-color: var(--tag-inverted-background-color-checked-hover);
+        }
+    } .filter-tag__clear_1c2gj:active {
+        color: var(--filter-tag-inverted-clear-color-active);
+        background-color: var(--tag-inverted-background-color-checked-active);
+    }

package/filter-tag/cssm/Component.responsive.d.ts CHANGED Viewed

@@ -1,7 +1,8 @@
 /// <reference types="react" />
 import React from 'react';
-import { BaseFilterTagProps } from "./components/base-filter-tag/index";
-type FilterTagProps = Omit<BaseFilterTagProps, 'styles'> & {
+import { PrivateProps } from "./types/base-filter-tag-private-props";
+import { BaseFilterTagProps } from "./types/base-filter-tag-props";
+type FilterTagProps = Omit<BaseFilterTagProps, keyof PrivateProps> & {
     /**
      * Контрольная точка, с нее начинается desktop версия
      * @default 1024
@@ -17,7 +18,7 @@ type FilterTagProps = Omit<BaseFilterTagProps, 'styles'> & {
      */
     defaultMatchMediaValue?: boolean | (() => boolean);
 };
-declare const FilterTag: React.ForwardRefExoticComponent<Omit<BaseFilterTagProps, "styles"> & {
+declare const FilterTag: React.ForwardRefExoticComponent<Omit<BaseFilterTagProps, keyof PrivateProps> & {
     /**
      * Контрольная точка, с нее начинается desktop версия
      * @default 1024

package/filter-tag/cssm/components/base-filter-tag/Component.d.ts CHANGED Viewed

@@ -1,73 +1,6 @@
 /// <reference types="react" />
 import React from 'react';
-import { MouseEvent, ReactNode } from "react";
-type BaseFilterTagProps = {
-    /**
-     * Состояние выбора
-     */
-    checked?: boolean;
-    /**
-     * Состояние открытия
-     */
-    open?: boolean;
-    /**
-     * Состояние блокировки
-     */
-    disabled?: boolean;
-    /**
-     * Обработчик клика
-     */
-    onClick?: (event: MouseEvent<HTMLDivElement>) => void;
-    /**
-     * Обработчик очистки
-     */
-    onClear?: () => void;
-    /**
-     * Контент
-     */
-    children?: ReactNode;
-    /**
-     * Идентификатор для систем автоматизированного тестирования
-     */
-    dataTestId?: string;
-    /**
-     * Размер компонента
-     * @description xxs, xs, s deprecated, используйте вместо них 32, 40, 48 соответственно
-     */
-    size?: 'xxs' | 'xs' | 's' | 32 | 40 | 48;
-    /**
-     * Дополнительный класс
-     */
-    className?: string;
-    /**
-     * Показывать крестик для очистки выбора
-     */
-    showClear?: boolean;
-    /**
-     * Растягивает компонент на ширину контейнера
-     * @default false
-     */
-    block?: boolean;
-    /**
-     * @deprecated данный проп больше не используется, временно оставлен для обратной совместимости
-     * Используйте props shape и view
-     * Вариант тега
-     */
-    variant?: 'default' | 'alt';
-    /**
-     * Форма тега
-     */
-    shape?: 'rounded' | 'rectangular';
-    /**
-     * Стиль тега
-     */
-    view?: 'outlined' | 'filled';
-    /**
-     * Основные стили компонента.
-     */
-    styles?: {
-        [key: string]: string;
-    };
-};
-declare const BaseFilterTag: React.ForwardRefExoticComponent<BaseFilterTagProps & React.RefAttributes<HTMLDivElement>>;
-export { BaseFilterTagProps, BaseFilterTag };
+import { PrivateProps } from "../../types/base-filter-tag-private-props";
+import { BaseFilterTagProps } from "../../types/base-filter-tag-props";
+declare const BaseFilterTag: React.ForwardRefExoticComponent<BaseFilterTagProps & PrivateProps & React.RefAttributes<HTMLDivElement>>;
+export { BaseFilterTag };

package/filter-tag/cssm/components/base-filter-tag/Component.js CHANGED Viewed

@@ -7,16 +7,22 @@ var ChevronDownCompactSIcon = require('@alfalab/icons-glyph/ChevronDownCompactSI
 var ChevronDownMIcon = require('@alfalab/icons-glyph/ChevronDownMIcon');
 var CrossCircleMIcon = require('@alfalab/icons-glyph/CrossCircleMIcon');
 var CrossCircleSIcon = require('@alfalab/icons-glyph/CrossCircleSIcon');
+var helpers_isKeyboardEvent = require('../../helpers/is-keyboard-event.js');
+var defaultColors = require('./default.module.css');
 var commonStyles = require('./index.module.css');
+var invertedColors = require('./inverted.module.css');
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var defaultColors__default = /*#__PURE__*/_interopDefaultCompat(defaultColors);
 var commonStyles__default = /*#__PURE__*/_interopDefaultCompat(commonStyles);
+var invertedColors__default = /*#__PURE__*/_interopDefaultCompat(invertedColors);
-var isKeyBoardEvent = function (event) {
-    return event.key !== undefined;
+var colorStyles = {
+    default: defaultColors__default.default,
+    inverted: invertedColors__default.default,
 };
 var SIZE_TO_CLASSNAME_MAP = {
     xxs: 'size-32',
@@ -28,12 +34,12 @@ var SIZE_TO_CLASSNAME_MAP = {
 };
 var BaseFilterTag = React.forwardRef(function (_a, ref) {
     var _b, _c;
-    var children = _a.children, checked = _a.checked, disabled = _a.disabled, open = _a.open, onClick = _a.onClick, _d = _a.size, size = _d === void 0 ? 48 : _d, _e = _a.variant, variant = _e === void 0 ? 'default' : _e, shape = _a.shape, _f = _a.view, view = _f === void 0 ? 'outlined' : _f, _g = _a.onClear, onClear = _g === void 0 ? function () { return null; } : _g, _h = _a.showClear, showClear = _h === void 0 ? true : _h, _j = _a.block, block = _j === void 0 ? false : _j, className = _a.className, dataTestId = _a.dataTestId, _k = _a.styles, styles = _k === void 0 ? {} : _k;
+    var children = _a.children, checked = _a.checked, disabled = _a.disabled, open = _a.open, onClick = _a.onClick, _d = _a.size, size = _d === void 0 ? 48 : _d, _e = _a.variant, variant = _e === void 0 ? 'default' : _e, shape = _a.shape, _f = _a.view, view = _f === void 0 ? 'outlined' : _f, _g = _a.onClear, onClear = _g === void 0 ? function () { return null; } : _g, _h = _a.showClear, showClear = _h === void 0 ? true : _h, _j = _a.block, block = _j === void 0 ? false : _j, className = _a.className, dataTestId = _a.dataTestId, _k = _a.styles, styles = _k === void 0 ? {} : _k, _l = _a.colors, colors = _l === void 0 ? 'default' : _l, _m = _a.colorStylesMap, colorStylesMap = _m === void 0 ? { default: {}, inverted: {} } : _m, leftAddons = _a.leftAddons;
     var valueRef = React.useRef(null);
     var focused = hooks.useFocus(valueRef, 'keyboard')[0];
     var handleClear = function (event) {
         event.stopPropagation();
-        if (isKeyBoardEvent(event)) {
+        if (helpers_isKeyboardEvent.isKeyBoardEvent(event)) {
             var clickSimilarKeys = ['Enter'].includes(event.key);
             if (clickSimilarKeys)
                 onClear();
@@ -45,28 +51,33 @@ var BaseFilterTag = React.forwardRef(function (_a, ref) {
     var shapeClassName = shape || variantClassName;
     return (
     // eslint-disable-next-line jsx-a11y/click-events-have-key-events
-    React__default.default.createElement("div", { className: cn__default.default(className, commonStyles__default.default.component, commonStyles__default.default[shapeClassName], commonStyles__default.default[SIZE_TO_CLASSNAME_MAP[size]], styles.component, styles[shapeClassName], styles[SIZE_TO_CLASSNAME_MAP[size]], (_b = {},
+    React__default.default.createElement("div", { className: cn__default.default(className, commonStyles__default.default.component, colorStyles[colors].component, commonStyles__default.default[shapeClassName], commonStyles__default.default[SIZE_TO_CLASSNAME_MAP[size]], styles.component, styles[shapeClassName], styles[SIZE_TO_CLASSNAME_MAP[size]], (_b = {},
             _b[commonStyles__default.default.checked] = checked,
+            _b[colorStyles[colors].checked] = checked,
             _b[styles.checked] = checked,
             _b[commonStyles__default.default.disabled] = disabled,
+            _b[colorStyles[colors].disabled] = disabled,
             _b[styles.disabled] = disabled,
             _b[commonStyles__default.default.focused] = focused,
             _b[commonStyles__default.default.open] = open,
             _b[commonStyles__default.default.block] = block,
             _b)), ref: ref, "data-test-id": dataTestId, onClick: disabled ? undefined : onClick },
-        React__default.default.createElement("button", { type: 'button', ref: valueRef, disabled: disabled, className: cn__default.default(commonStyles__default.default.valueButton, styles.valueButton, commonStyles__default.default[SIZE_TO_CLASSNAME_MAP[size]], styles[SIZE_TO_CLASSNAME_MAP[size]], commonStyles__default.default[shapeClassName], styles[shapeClassName], commonStyles__default.default[view], (_c = {},
+        React__default.default.createElement("button", { type: 'button', ref: valueRef, disabled: disabled, className: cn__default.default(commonStyles__default.default.valueButton, colorStyles[colors].valueButton, styles.valueButton, colorStylesMap[colors].valueButton, commonStyles__default.default[SIZE_TO_CLASSNAME_MAP[size]], styles[SIZE_TO_CLASSNAME_MAP[size]], commonStyles__default.default[shapeClassName], styles[shapeClassName], commonStyles__default.default[view], colorStyles[colors][view], (_c = {},
                 _c[styles[view]] = Boolean(styles[view]),
+                _c[colorStylesMap[colors][view]] = Boolean(colorStylesMap[colors][view]),
                 _c[commonStyles__default.default.checked] = checked,
+                _c[colorStyles[colors].checked] = checked,
                 _c[styles.checked] = checked,
                 _c[commonStyles__default.default.open] = open,
                 _c[commonStyles__default.default.close] = !showClear,
                 _c[styles.close] = !showClear,
                 _c[commonStyles__default.default.block] = block,
+                _c[commonStyles__default.default.withClear] = showClear,
                 _c)) },
+            leftAddons && React__default.default.createElement("div", { className: commonStyles__default.default.addons }, leftAddons),
             React__default.default.createElement("span", { className: commonStyles__default.default.content }, children),
-            React__default.default.createElement("span", { className: commonStyles__default.default.chevron }, ['size-40', 'size-32'].includes(SIZE_TO_CLASSNAME_MAP[size]) ? (React__default.default.createElement(ChevronDownCompactSIcon.ChevronDownCompactSIcon, null)) : (React__default.default.createElement(ChevronDownMIcon.ChevronDownMIcon, null)))),
-        checked && !disabled && showClear && (React__default.default.createElement("div", { role: 'button', className: cn__default.default(commonStyles__default.default.clear, styles.clear, commonStyles__default.default[SIZE_TO_CLASSNAME_MAP[size]], styles[SIZE_TO_CLASSNAME_MAP[size]], styles[shapeClassName], commonStyles__default.default[shapeClassName]), onClick: handleClear, onKeyDown: handleClear, tabIndex: 0 },
-            React__default.default.createElement("span", { className: commonStyles__default.default.iconWrapper }, SIZE_TO_CLASSNAME_MAP[size] === 'size-32' ? (React__default.default.createElement(CrossCircleSIcon.CrossCircleSIcon, null)) : (React__default.default.createElement(CrossCircleMIcon.CrossCircleMIcon, null)))))));
+            React__default.default.createElement("span", { className: cn__default.default(commonStyles__default.default.chevron, colorStyles[colors].chevron) }, ['size-40', 'size-32'].includes(SIZE_TO_CLASSNAME_MAP[size]) ? (React__default.default.createElement(ChevronDownCompactSIcon.ChevronDownCompactSIcon, null)) : (React__default.default.createElement(ChevronDownMIcon.ChevronDownMIcon, null)))),
+        checked && !disabled && showClear && (React__default.default.createElement("div", { role: 'button', className: cn__default.default(commonStyles__default.default.clear, [colorStyles[colors].clear], styles.clear, commonStyles__default.default[SIZE_TO_CLASSNAME_MAP[size]], styles[SIZE_TO_CLASSNAME_MAP[size]], styles[shapeClassName], commonStyles__default.default[shapeClassName]), onClick: handleClear, onKeyDown: handleClear, tabIndex: 0 }, ['size-40', 'size-32'].includes(SIZE_TO_CLASSNAME_MAP[size]) ? (React__default.default.createElement(CrossCircleSIcon.CrossCircleSIcon, null)) : (React__default.default.createElement(CrossCircleMIcon.CrossCircleMIcon, null))))));
 });
 exports.BaseFilterTag = BaseFilterTag;