@alfalab/core-components 45.9.0-beta.3 → 45.10.0

package/tabs/cssm/components/tabs/Component.js

@@ -23,8 +23,8 @@ var Tabs = function (_a) {
         });
     });
     var tabs = tabsArray.filter(function (tab) { return tab.props.id === selectedId || tab.props.keepMounted || keepMounted; });
-    return (React__default.default.createElement("div", { className: className, style: style },
-        React__default.default.createElement(TabList, { containerClassName: containerClassName, size: size, titles: titles, selectedId: selectedId, scrollable: scrollable, collapsedTabsIds: collapsedTabsIds, onChange: onChange, dataTestId: dataTestId, defaultMatchMediaValue: defaultMatchMediaValue, fullWidthScroll: fullWidthScroll, breakpoint: breakpoint, tagShape: tagShape, tagView: tagView, textStyle: textStyle }),
+    return (React__default.default.createElement("div", { className: className },
+        React__default.default.createElement(TabList, { containerClassName: containerClassName, size: size, titles: titles, selectedId: selectedId, scrollable: scrollable, collapsedTabsIds: collapsedTabsIds, onChange: onChange, dataTestId: dataTestId, defaultMatchMediaValue: defaultMatchMediaValue, fullWidthScroll: fullWidthScroll, breakpoint: breakpoint, tagShape: tagShape, tagView: tagView, textStyle: textStyle, inlineStyle: style }),
         tabs.map(function (tab) { return React.cloneElement(tab, { hidden: tab.props.id !== selectedId }); })));
 };
 

package/tabs/cssm/typings.d.ts

@@ -155,6 +155,10 @@ type TabListProps = Pick<TabsProps, 'className' | 'containerClassName' | 'size'
      * @default 1024
      */
     breakpoint?: number;
+    /**
+     * Дополнительные инлайн стили для заголовка
+     */
+    inlineStyle?: React.CSSProperties;
 };
 type SecondaryTabListProps = TabListProps & {
     tagSize?: TagProps['size'];

package/tabs/esm/components/primary-tablist/Component.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import React from 'react';
 import { PlatformProps, Styles, TabListProps } from "../../typings";
-declare const PrimaryTabList: ({ size, styles, className, containerClassName, titles, selectedId, scrollable, fullWidthScroll, onChange, dataTestId, platform, textStyle, }: TabListProps & Styles & PlatformProps) => React.JSX.Element;
+declare const PrimaryTabList: ({ size, styles, className, containerClassName, titles, selectedId, scrollable, fullWidthScroll, onChange, dataTestId, platform, textStyle, inlineStyle, }: TabListProps & Styles & PlatformProps) => React.JSX.Element;
 export { PrimaryTabList };

package/tabs/esm/components/primary-tablist/Component.js

@@ -17,7 +17,7 @@ import '@alfalab/icons-glyph/ChevronRightCompactSIcon';
 import '../scroll-controls/utils.js';
 
 var PrimaryTabList = function (_a) {
-    var size = _a.size, _b = _a.styles, styles = _b === void 0 ? {} : _b, className = _a.className, containerClassName = _a.containerClassName, _c = _a.titles, titles = _c === void 0 ? [] : _c, _d = _a.selectedId, selectedId = _d === void 0 ? titles.length ? titles[0].id : undefined : _d, _e = _a.scrollable, scrollable = _e === void 0 ? true : _e, fullWidthScroll = _a.fullWidthScroll, onChange = _a.onChange, dataTestId = _a.dataTestId, platform = _a.platform, textStyle = _a.textStyle;
+    var size = _a.size, _b = _a.styles, styles = _b === void 0 ? {} : _b, className = _a.className, containerClassName = _a.containerClassName, _c = _a.titles, titles = _c === void 0 ? [] : _c, _d = _a.selectedId, selectedId = _d === void 0 ? titles.length ? titles[0].id : undefined : _d, _e = _a.scrollable, scrollable = _e === void 0 ? true : _e, fullWidthScroll = _a.fullWidthScroll, onChange = _a.onChange, dataTestId = _a.dataTestId, platform = _a.platform, textStyle = _a.textStyle, inlineStyle = _a.inlineStyle;
     var lineRef = useRef(null);
     var _f = useTabs({
         titles: titles,
@@ -51,7 +51,7 @@ var PrimaryTabList = function (_a) {
             React.createElement("div", { className: styles.line, ref: lineRef })));
     };
     var wrapperClassName = cn(textStyle && styles[textStyle], styles[platform]);
-    return scrollable ? (React.createElement(ScrollableContainer, { containerWrapperClassName: wrapperClassName, activeChild: focusedTab || selectedTab, containerClassName: containerClassName, scrollControlsClassName: cn(textStyle && styles.scrollControls), fullWidthScroll: fullWidthScroll, view: 'primary', size: textStyle ? undefined : size, platform: platform }, renderContent())) : (React.createElement("div", { className: cn(styles.container, wrapperClassName, containerClassName) }, renderContent()));
+    return scrollable ? (React.createElement(ScrollableContainer, { containerWrapperClassName: wrapperClassName, activeChild: focusedTab || selectedTab, containerClassName: containerClassName, scrollControlsClassName: cn(textStyle && styles.scrollControls), fullWidthScroll: fullWidthScroll, view: 'primary', size: textStyle ? undefined : size, platform: platform, inlineStyle: inlineStyle }, renderContent())) : (React.createElement("div", { className: cn(styles.container, wrapperClassName, containerClassName), style: inlineStyle }, renderContent()));
 };
 
 export { PrimaryTabList };

package/tabs/esm/components/scrollable-container/Component.d.ts

@@ -31,6 +31,10 @@ type ScrollableContainerProps = {
      *  Размер
      */
     size: TabsProps['size'];
+    /**
+     * Дополнительные инлайн стили для заголовка
+     */
+    inlineStyle?: React.CSSProperties;
 };
-declare const ScrollableContainer: ({ containerWrapperClassName, containerClassName, scrollControlsClassName, children, activeChild, fullWidthScroll, view, size, platform, }: ScrollableContainerProps & Pick<TabsProps, 'fullWidthScroll'> & PlatformProps) => React.JSX.Element;
+declare const ScrollableContainer: ({ containerWrapperClassName, containerClassName, scrollControlsClassName, children, activeChild, fullWidthScroll, view, size, platform, inlineStyle, }: ScrollableContainerProps & Pick<TabsProps, 'fullWidthScroll'> & PlatformProps) => React.JSX.Element;
 export { ScrollableContainerProps, ScrollableContainer };

package/tabs/esm/components/scrollable-container/Component.js

@@ -23,7 +23,7 @@ var isOverflown = function (_a, controlsNode) {
 };
 var ScrollableContainer = function (_a) {
     var _b;
-    var containerWrapperClassName = _a.containerWrapperClassName, containerClassName = _a.containerClassName, scrollControlsClassName = _a.scrollControlsClassName, children = _a.children, activeChild = _a.activeChild, fullWidthScroll = _a.fullWidthScroll, view = _a.view, size = _a.size, platform = _a.platform;
+    var containerWrapperClassName = _a.containerWrapperClassName, containerClassName = _a.containerClassName, scrollControlsClassName = _a.scrollControlsClassName, children = _a.children, activeChild = _a.activeChild, fullWidthScroll = _a.fullWidthScroll, view = _a.view, size = _a.size, platform = _a.platform, inlineStyle = _a.inlineStyle;
     var containerRef = useRef(null);
     var controlsRef = useRef(null);
     var _c = useState(false), overflown = _c[0], setOverflown = _c[1];
@@ -65,7 +65,7 @@ var ScrollableContainer = function (_a) {
         }
         return function () { };
     }, [platform]);
-    return (React.createElement("div", { className: cn(styles.scrollableContainerWrapper, containerWrapperClassName) },
+    return (React.createElement("div", { className: cn(styles.scrollableContainerWrapper, containerWrapperClassName), style: inlineStyle },
         React.createElement("div", { ref: containerRef, className: cn(styles.container, containerClassName, (_b = {},
                 _b[styles.fullWidthScroll] = fullWidthScroll,
                 _b)) }, children),

package/tabs/esm/components/secondary-tablist/Component.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import React from 'react';
 import { PlatformProps, SecondaryTabListProps, Styles } from "../../typings";
-declare const SecondaryTabList: ({ styles, className, containerClassName, size, titles, selectedId, scrollable, fullWidthScroll, tagSize, onChange, dataTestId, TagComponent, platform, tagShape, tagView, }: SecondaryTabListProps & Styles & PlatformProps) => React.JSX.Element;
+declare const SecondaryTabList: ({ styles, className, containerClassName, size, titles, selectedId, scrollable, fullWidthScroll, tagSize, onChange, dataTestId, TagComponent, platform, tagShape, tagView, inlineStyle, }: SecondaryTabListProps & Styles & PlatformProps) => React.JSX.Element;
 export { SecondaryTabList };

package/tabs/esm/components/secondary-tablist/Component.js

@@ -14,7 +14,7 @@ import '@alfalab/icons-glyph/ChevronRightCompactSIcon';
 import '../scroll-controls/utils.js';
 
 var SecondaryTabList = function (_a) {
-    var _b = _a.styles, styles = _b === void 0 ? {} : _b, className = _a.className, containerClassName = _a.containerClassName, size = _a.size, _c = _a.titles, titles = _c === void 0 ? [] : _c, _d = _a.selectedId, selectedId = _d === void 0 ? titles.length ? titles[0].id : undefined : _d, _e = _a.scrollable, scrollable = _e === void 0 ? true : _e, fullWidthScroll = _a.fullWidthScroll, _f = _a.tagSize, tagSize = _f === void 0 ? 'xs' : _f, onChange = _a.onChange, dataTestId = _a.dataTestId, TagComponent = _a.TagComponent, platform = _a.platform, tagShape = _a.tagShape, tagView = _a.tagView;
+    var _b = _a.styles, styles = _b === void 0 ? {} : _b, className = _a.className, containerClassName = _a.containerClassName, size = _a.size, _c = _a.titles, titles = _c === void 0 ? [] : _c, _d = _a.selectedId, selectedId = _d === void 0 ? titles.length ? titles[0].id : undefined : _d, _e = _a.scrollable, scrollable = _e === void 0 ? true : _e, fullWidthScroll = _a.fullWidthScroll, _f = _a.tagSize, tagSize = _f === void 0 ? 'xs' : _f, onChange = _a.onChange, dataTestId = _a.dataTestId, TagComponent = _a.TagComponent, platform = _a.platform, tagShape = _a.tagShape, tagView = _a.tagView, inlineStyle = _a.inlineStyle;
     var _g = useTabs({
         titles: titles,
         selectedId: selectedId,
@@ -32,7 +32,7 @@ var SecondaryTabList = function (_a) {
             return (React.createElement(TagComponent, __assign({}, getTabListItemProps(index), { shape: tagShape, view: tagView, key: item.id, className: cn(styles.title, item.toggleClassName), checked: item.id === selectedId, size: tagSize, rightAddons: item.rightAddons }), item.title));
         })));
     };
-    return scrollable ? (React.createElement(ScrollableContainer, { activeChild: focusedTab || selectedTab, containerClassName: containerClassName, fullWidthScroll: fullWidthScroll, view: 'secondary', size: size, platform: platform }, renderContent())) : (React.createElement("div", { className: cn(styles.container, containerClassName) }, renderContent()));
+    return scrollable ? (React.createElement(ScrollableContainer, { activeChild: focusedTab || selectedTab, containerClassName: containerClassName, fullWidthScroll: fullWidthScroll, view: 'secondary', size: size, platform: platform, inlineStyle: inlineStyle }, renderContent())) : (React.createElement("div", { className: cn(styles.container, containerClassName), style: inlineStyle }, renderContent()));
 };
 
 export { SecondaryTabList };

package/tabs/esm/components/tabs/Component.js

@@ -17,8 +17,8 @@ var Tabs = function (_a) {
         });
     });
     var tabs = tabsArray.filter(function (tab) { return tab.props.id === selectedId || tab.props.keepMounted || keepMounted; });
-    return (React.createElement("div", { className: className, style: style },
-        React.createElement(TabList, { containerClassName: containerClassName, size: size, titles: titles, selectedId: selectedId, scrollable: scrollable, collapsedTabsIds: collapsedTabsIds, onChange: onChange, dataTestId: dataTestId, defaultMatchMediaValue: defaultMatchMediaValue, fullWidthScroll: fullWidthScroll, breakpoint: breakpoint, tagShape: tagShape, tagView: tagView, textStyle: textStyle }),
+    return (React.createElement("div", { className: className },
+        React.createElement(TabList, { containerClassName: containerClassName, size: size, titles: titles, selectedId: selectedId, scrollable: scrollable, collapsedTabsIds: collapsedTabsIds, onChange: onChange, dataTestId: dataTestId, defaultMatchMediaValue: defaultMatchMediaValue, fullWidthScroll: fullWidthScroll, breakpoint: breakpoint, tagShape: tagShape, tagView: tagView, textStyle: textStyle, inlineStyle: style }),
         tabs.map(function (tab) { return cloneElement(tab, { hidden: tab.props.id !== selectedId }); })));
 };
 

package/tabs/esm/typings.d.ts

@@ -155,6 +155,10 @@ type TabListProps = Pick<TabsProps, 'className' | 'containerClassName' | 'size'
      * @default 1024
      */
     breakpoint?: number;
+    /**
+     * Дополнительные инлайн стили для заголовка
+     */
+    inlineStyle?: React.CSSProperties;
 };
 type SecondaryTabListProps = TabListProps & {
     tagSize?: TagProps['size'];

package/tabs/modern/components/primary-tablist/Component.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import React from 'react';
 import { PlatformProps, Styles, TabListProps } from "../../typings";
-declare const PrimaryTabList: ({ size, styles, className, containerClassName, titles, selectedId, scrollable, fullWidthScroll, onChange, dataTestId, platform, textStyle, }: TabListProps & Styles & PlatformProps) => React.JSX.Element;
+declare const PrimaryTabList: ({ size, styles, className, containerClassName, titles, selectedId, scrollable, fullWidthScroll, onChange, dataTestId, platform, textStyle, inlineStyle, }: TabListProps & Styles & PlatformProps) => React.JSX.Element;
 export { PrimaryTabList };

package/tabs/modern/components/primary-tablist/Component.js

@@ -15,7 +15,7 @@ import '@alfalab/icons-glyph/ChevronLeftCompactSIcon';
 import '@alfalab/icons-glyph/ChevronRightCompactSIcon';
 import '../scroll-controls/utils.js';
 
-const PrimaryTabList = ({ size, styles = {}, className, containerClassName, titles = [], selectedId = titles.length ? titles[0].id : undefined, scrollable = true, fullWidthScroll, onChange, dataTestId, platform, textStyle, }) => {
+const PrimaryTabList = ({ size, styles = {}, className, containerClassName, titles = [], selectedId = titles.length ? titles[0].id : undefined, scrollable = true, fullWidthScroll, onChange, dataTestId, platform, textStyle, inlineStyle, }) => {
     const lineRef = useRef(null);
     const { selectedTab, focusedTab, getTabListItemProps } = useTabs({
         titles,
@@ -43,7 +43,7 @@ const PrimaryTabList = ({ size, styles = {}, className, containerClassName, titl
         titles.map(({ dataTestId: _, toggleRef: __, ...restTitleProps }, index) => (React.createElement(KeyboardFocusable, { key: restTitleProps.id }, (ref, focused) => (React.createElement(Title, { ...getTabListItemProps(index, ref), ...restTitleProps, focused: focused, styles: styles }))))),
         React.createElement("div", { className: styles.line, ref: lineRef })));
     const wrapperClassName = cn(textStyle && styles[textStyle], styles[platform]);
-    return scrollable ? (React.createElement(ScrollableContainer, { containerWrapperClassName: wrapperClassName, activeChild: focusedTab || selectedTab, containerClassName: containerClassName, scrollControlsClassName: cn(textStyle && styles.scrollControls), fullWidthScroll: fullWidthScroll, view: 'primary', size: textStyle ? undefined : size, platform: platform }, renderContent())) : (React.createElement("div", { className: cn(styles.container, wrapperClassName, containerClassName) }, renderContent()));
+    return scrollable ? (React.createElement(ScrollableContainer, { containerWrapperClassName: wrapperClassName, activeChild: focusedTab || selectedTab, containerClassName: containerClassName, scrollControlsClassName: cn(textStyle && styles.scrollControls), fullWidthScroll: fullWidthScroll, view: 'primary', size: textStyle ? undefined : size, platform: platform, inlineStyle: inlineStyle }, renderContent())) : (React.createElement("div", { className: cn(styles.container, wrapperClassName, containerClassName), style: inlineStyle }, renderContent()));
 };
 
 export { PrimaryTabList };

package/tabs/modern/components/scrollable-container/Component.d.ts

@@ -31,6 +31,10 @@ type ScrollableContainerProps = {
      *  Размер
      */
     size: TabsProps['size'];
+    /**
+     * Дополнительные инлайн стили для заголовка
+     */
+    inlineStyle?: React.CSSProperties;
 };
-declare const ScrollableContainer: ({ containerWrapperClassName, containerClassName, scrollControlsClassName, children, activeChild, fullWidthScroll, view, size, platform, }: ScrollableContainerProps & Pick<TabsProps, 'fullWidthScroll'> & PlatformProps) => React.JSX.Element;
+declare const ScrollableContainer: ({ containerWrapperClassName, containerClassName, scrollControlsClassName, children, activeChild, fullWidthScroll, view, size, platform, inlineStyle, }: ScrollableContainerProps & Pick<TabsProps, 'fullWidthScroll'> & PlatformProps) => React.JSX.Element;
 export { ScrollableContainerProps, ScrollableContainer };

package/tabs/modern/components/scrollable-container/Component.js

@@ -19,7 +19,7 @@ const isOverflown = ({ clientWidth, scrollWidth }, controlsNode) => {
     const controlsWidth = controlsNode?.offsetWidth || 0;
     return scrollWidth > clientWidth + controlsWidth;
 };
-const ScrollableContainer = ({ containerWrapperClassName, containerClassName, scrollControlsClassName, children, activeChild, fullWidthScroll, view, size, platform, }) => {
+const ScrollableContainer = ({ containerWrapperClassName, containerClassName, scrollControlsClassName, children, activeChild, fullWidthScroll, view, size, platform, inlineStyle, }) => {
     const containerRef = useRef(null);
     const controlsRef = useRef(null);
     const [overflown, setOverflown] = useState(false);
@@ -60,7 +60,7 @@ const ScrollableContainer = ({ containerWrapperClassName, containerClassName, sc
         }
         return () => { };
     }, [platform]);
-    return (React.createElement("div", { className: cn(styles.scrollableContainerWrapper, containerWrapperClassName) },
+    return (React.createElement("div", { className: cn(styles.scrollableContainerWrapper, containerWrapperClassName), style: inlineStyle },
         React.createElement("div", { ref: containerRef, className: cn(styles.container, containerClassName, {
                 [styles.fullWidthScroll]: fullWidthScroll,
             }) }, children),

package/tabs/modern/components/secondary-tablist/Component.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import React from 'react';
 import { PlatformProps, SecondaryTabListProps, Styles } from "../../typings";
-declare const SecondaryTabList: ({ styles, className, containerClassName, size, titles, selectedId, scrollable, fullWidthScroll, tagSize, onChange, dataTestId, TagComponent, platform, tagShape, tagView, }: SecondaryTabListProps & Styles & PlatformProps) => React.JSX.Element;
+declare const SecondaryTabList: ({ styles, className, containerClassName, size, titles, selectedId, scrollable, fullWidthScroll, tagSize, onChange, dataTestId, TagComponent, platform, tagShape, tagView, inlineStyle, }: SecondaryTabListProps & Styles & PlatformProps) => React.JSX.Element;
 export { SecondaryTabList };

package/tabs/modern/components/secondary-tablist/Component.js

@@ -12,7 +12,7 @@ import '@alfalab/icons-glyph/ChevronLeftCompactSIcon';
 import '@alfalab/icons-glyph/ChevronRightCompactSIcon';
 import '../scroll-controls/utils.js';
 
-const SecondaryTabList = ({ styles = {}, className, containerClassName, size, titles = [], selectedId = titles.length ? titles[0].id : undefined, scrollable = true, fullWidthScroll, tagSize = 'xs', onChange, dataTestId, TagComponent, platform, tagShape, tagView, }) => {
+const SecondaryTabList = ({ styles = {}, className, containerClassName, size, titles = [], selectedId = titles.length ? titles[0].id : undefined, scrollable = true, fullWidthScroll, tagSize = 'xs', onChange, dataTestId, TagComponent, platform, tagShape, tagView, inlineStyle, }) => {
     const { focusedTab, selectedTab, getTabListItemProps } = useTabs({
         titles,
         selectedId,
@@ -29,7 +29,7 @@ const SecondaryTabList = ({ styles = {}, className, containerClassName, size, ti
             return (React.createElement(TagComponent, { ...getTabListItemProps(index), shape: tagShape, view: tagView, key: item.id, className: cn(styles.title, item.toggleClassName), checked: item.id === selectedId, size: tagSize, rightAddons: item.rightAddons }, item.title));
         })));
     };
-    return scrollable ? (React.createElement(ScrollableContainer, { activeChild: focusedTab || selectedTab, containerClassName: containerClassName, fullWidthScroll: fullWidthScroll, view: 'secondary', size: size, platform: platform }, renderContent())) : (React.createElement("div", { className: cn(styles.container, containerClassName) }, renderContent()));
+    return scrollable ? (React.createElement(ScrollableContainer, { activeChild: focusedTab || selectedTab, containerClassName: containerClassName, fullWidthScroll: fullWidthScroll, view: 'secondary', size: size, platform: platform, inlineStyle: inlineStyle }, renderContent())) : (React.createElement("div", { className: cn(styles.container, containerClassName), style: inlineStyle }, renderContent()));
 };
 
 export { SecondaryTabList };

package/tabs/modern/components/tabs/Component.js

@@ -13,8 +13,8 @@ const Tabs = ({ TabList, className, containerClassName, size, defaultMatchMediaV
         toggleRef,
     }));
     const tabs = tabsArray.filter((tab) => tab.props.id === selectedId || tab.props.keepMounted || keepMounted);
-    return (React.createElement("div", { className: className, style: style },
-        React.createElement(TabList, { containerClassName: containerClassName, size: size, titles: titles, selectedId: selectedId, scrollable: scrollable, collapsedTabsIds: collapsedTabsIds, onChange: onChange, dataTestId: dataTestId, defaultMatchMediaValue: defaultMatchMediaValue, fullWidthScroll: fullWidthScroll, breakpoint: breakpoint, tagShape: tagShape, tagView: tagView, textStyle: textStyle }),
+    return (React.createElement("div", { className: className },
+        React.createElement(TabList, { containerClassName: containerClassName, size: size, titles: titles, selectedId: selectedId, scrollable: scrollable, collapsedTabsIds: collapsedTabsIds, onChange: onChange, dataTestId: dataTestId, defaultMatchMediaValue: defaultMatchMediaValue, fullWidthScroll: fullWidthScroll, breakpoint: breakpoint, tagShape: tagShape, tagView: tagView, textStyle: textStyle, inlineStyle: style }),
         tabs.map((tab) => cloneElement(tab, { hidden: tab.props.id !== selectedId }))));
 };
 

package/tabs/modern/typings.d.ts

@@ -155,6 +155,10 @@ type TabListProps = Pick<TabsProps, 'className' | 'containerClassName' | 'size'
      * @default 1024
      */
     breakpoint?: number;
+    /**
+     * Дополнительные инлайн стили для заголовка
+     */
+    inlineStyle?: React.CSSProperties;
 };
 type SecondaryTabListProps = TabListProps & {
     tagSize?: TagProps['size'];

package/tabs/typings.d.ts

@@ -155,6 +155,10 @@ type TabListProps = Pick<TabsProps, 'className' | 'containerClassName' | 'size'
      * @default 1024
      */
     breakpoint?: number;
+    /**
+     * Дополнительные инлайн стили для заголовка
+     */
+    inlineStyle?: React.CSSProperties;
 };
 type SecondaryTabListProps = TabListProps & {
     tagSize?: TagProps['size'];

package/themes/compiled/mobile-dark-bluetint.css

@@ -1,4 +1,8 @@
-.backdrop__backdrop_1bojg {
+.card-image__cardImage_1jnst {
+    background: #e7e8ea;
+} .card-image__loaded_1jnst {
+    background: transparent
+}.backdrop__backdrop_1bojg {
     -webkit-tap-highlight-color: transparent;
 } .backdrop__appear_1bojg,
 .backdrop__enter_1bojg {
@@ -13,10 +17,6 @@
 } .backdrop__exitActive_1bojg,
 .backdrop__exitDone_1bojg {
     background-color: transparent;
-}.card-image__cardImage_1jnst {
-    background: #e7e8ea;
-} .card-image__loaded_1jnst {
-    background: transparent
 }.badge__component_1l6wq.badge__background-accent_1l6wq {
         background-color: #f83a2a;
         color: rgba(255, 255, 255, 0.94);
@@ -168,7 +168,14 @@
         background: #fff;
     } .hatching-progress-bar__accent_5j2u0 {
         background: #f83a2a;
-    }.indicator__component_96ho4 {
+    }.icon-view__component_10g9p {
+    color: rgba(238, 238, 251, 0.55)
+} .icon-view__bg_10g9p {
+    fill: #1c1c1e;
+} .icon-view__border_10g9p {
+    stroke: rgba(225, 225, 248, 0.09);
+    fill: transparent;
+}.indicator__component_96ho4 {
     color: rgba(255, 255, 255, 0.94);
     background-color: #f83a2a;
 } .indicator__red_96ho4 {
@@ -186,14 +193,7 @@
     color: rgba(255, 255, 255, 0.94)
 } .indicator__grey_96ho4.indicator__border_96ho4 {
         outline: 2px solid #121213;
-    }.icon-view__component_10g9p {
-    color: rgba(238, 238, 251, 0.55)
-} .icon-view__bg_10g9p {
-    fill: #1c1c1e;
-} .icon-view__border_10g9p {
-    stroke: rgba(225, 225, 248, 0.09);
-    fill: transparent;
-}@keyframes loader__blink_13yub {
+    }@keyframes loader__blink_13yub {
 }.link__primary_1594o {
     color: rgba(255, 255, 255, 0.94);
     border-bottom-color: rgba(255, 255, 255, 0.94)
@@ -310,25 +310,7 @@
     100% {
         background: rgb(198, 205, 214);
     }
-}.slider__component_1tniw .noUi-base:hover .noUi-connects {
-            background: rgba(222, 222, 238, 0.13);
-        } .slider__component_1tniw .noUi-base:hover .noUi-connect {
-            background: #f83a2a;
-        } .slider__component_1tniw .noUi-handle:hover .noUi-touch-area {
-        background: #ff503e;
-    } .slider__component_1tniw .noUi-handle:active .noUi-touch-area {
-        background: #fd624e;
-    } .slider__component_1tniw .noUi-connects {
-        background: rgba(222, 222, 238, 0.13);
-    } .slider__component_1tniw .noUi-connect {
-        background: #f83a2a;
-    } .slider__component_1tniw .noUi-handle {
-        border: 2px solid transparent;
-    } .slider__component_1tniw .noUi-touch-area {
-        background: #f83a2a;
-    } .slider__component_1tniw .noUi-pips {
-        color: rgba(238, 238, 251, 0.55);
-    }.segmented-control__wrapper_3hkmf {
+}.segmented-control__wrapper_3hkmf {
     background-color: rgba(225, 225, 248, 0.09);
 } .segmented-control__segment_3hkmf.segmented-control__selected_3hkmf {
     color: rgba(255, 255, 255, 0.94);
@@ -362,6 +344,24 @@
     color: rgba(3, 3, 6, 0.88)
 } .segmented-control__segment_15rjq:not(:first-child):before {
         background-color: rgba(15, 25, 55, 0.1);
+    }.slider__component_1tniw .noUi-base:hover .noUi-connects {
+            background: rgba(222, 222, 238, 0.13);
+        } .slider__component_1tniw .noUi-base:hover .noUi-connect {
+            background: #f83a2a;
+        } .slider__component_1tniw .noUi-handle:hover .noUi-touch-area {
+        background: #ff503e;
+    } .slider__component_1tniw .noUi-handle:active .noUi-touch-area {
+        background: #fd624e;
+    } .slider__component_1tniw .noUi-connects {
+        background: rgba(222, 222, 238, 0.13);
+    } .slider__component_1tniw .noUi-connect {
+        background: #f83a2a;
+    } .slider__component_1tniw .noUi-handle {
+        border: 2px solid transparent;
+    } .slider__component_1tniw .noUi-touch-area {
+        background: #f83a2a;
+    } .slider__component_1tniw .noUi-pips {
+        color: rgba(238, 238, 251, 0.55);
     }.spinner__component_1a4j5 {
     color: #fff;
 }
@@ -369,34 +369,6 @@
 }
 .spinner__component_6a92s {
     color: #121213;
-}.status-badge__positive-checkmark_1uqcz {
-    background-color: #17d055;
-} .status-badge__negative-cross_1uqcz,
-.status-badge__negative-alert_1uqcz,
-.status-badge__negative-block_1uqcz {
-    background-color: #ff4837;
-} .status-badge__attention-alert_1uqcz {
-    background-color: #fda136;
-} .status-badge__neutral-information_1uqcz,
-.status-badge__neutral-operation_1uqcz,
-.status-badge__neutral-cross_1uqcz {
-    background-color: #898991;
-}
-.status-badge__component_11kkv {
-    color: #fff;
-}
-.status-badge__positive-checkmark_55f9k {
-    background-color: #0cc44d;
-} .status-badge__negative-cross_55f9k,
-.status-badge__negative-alert_55f9k,
-.status-badge__negative-block_55f9k {
-    background-color: #ff4837;
-} .status-badge__attention-alert_55f9k {
-    background-color: #fa9313;
-} .status-badge__neutral-information_55f9k,
-.status-badge__neutral-operation_55f9k,
-.status-badge__neutral-cross_55f9k {
-    background-color: #898991;
 }.status__soft_qw79g.status__green_qw79g {
         background: #d1f1d7;
         color: #0d9336;
@@ -434,4 +406,32 @@
         background: #09b9be;
     } .status__contrast_qw79g.status__purple_qw79g {
         background: #897eff;
-    }
+    }.status-badge__positive-checkmark_1uqcz {
+    background-color: #17d055;
+} .status-badge__negative-cross_1uqcz,
+.status-badge__negative-alert_1uqcz,
+.status-badge__negative-block_1uqcz {
+    background-color: #ff4837;
+} .status-badge__attention-alert_1uqcz {
+    background-color: #fda136;
+} .status-badge__neutral-information_1uqcz,
+.status-badge__neutral-operation_1uqcz,
+.status-badge__neutral-cross_1uqcz {
+    background-color: #898991;
+}
+.status-badge__component_11kkv {
+    color: #fff;
+}
+.status-badge__positive-checkmark_55f9k {
+    background-color: #0cc44d;
+} .status-badge__negative-cross_55f9k,
+.status-badge__negative-alert_55f9k,
+.status-badge__negative-block_55f9k {
+    background-color: #ff4837;
+} .status-badge__attention-alert_55f9k {
+    background-color: #fa9313;
+} .status-badge__neutral-information_55f9k,
+.status-badge__neutral-operation_55f9k,
+.status-badge__neutral-cross_55f9k {
+    background-color: #898991;
+}

package/typography/esm/component.js

@@ -9,10 +9,10 @@ import 'classnames';
 import './hooks/use-skeleton.js';
 import '../../skeleton/esm';
 import '@alfalab/hooks';
-import './colors.module-72a95925.js';
+import './colors.module-171b9a02.js';
 import './title/component.js';
 import './title/utils.js';
-import './common.module-094a1daa.js';
+import './common.module-35992ec8.js';
 import '../../mq/esm';
 
 var Typography = {

package/typography/esm/index.js

@@ -8,11 +8,11 @@ import 'classnames';
 import './hooks/use-skeleton.js';
 import '../../skeleton/esm';
 import '@alfalab/hooks';
-import './colors.module-72a95925.js';
+import './colors.module-171b9a02.js';
 import './title/index.js';
 import './title/component.js';
 import './title/utils.js';
-import './common.module-094a1daa.js';
+import './common.module-35992ec8.js';
 import './title-mobile/component.js';
 import './title-responsive/component.js';
 import '../../mq/esm';

package/typography/esm/text/component.js

@@ -3,7 +3,7 @@ import React, { forwardRef } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { useSkeleton } from '../hooks/use-skeleton.js';
-import { c as colors } from '../colors.module-72a95925.js';
+import { c as colors } from '../colors.module-171b9a02.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 

package/typography/esm/text/index.js

@@ -6,4 +6,4 @@ import 'classnames';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
-import '../colors.module-72a95925.js';
+import '../colors.module-171b9a02.js';

package/typography/esm/title/component.js

@@ -4,7 +4,7 @@ import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { useSkeleton } from '../hooks/use-skeleton.js';
 import { getDefaultWeight } from './utils.js';
-import { c as colors } from '../colors.module-72a95925.js';
+import { c as colors } from '../colors.module-171b9a02.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 

package/typography/esm/title/index.js

@@ -1,14 +1,14 @@
 import { __assign } from 'tslib';
 import React, { forwardRef } from 'react';
 import { TitleBase } from './component.js';
-import { c as commonStyles } from '../common.module-094a1daa.js';
+import { c as commonStyles } from '../common.module-35992ec8.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import './utils.js';
-import '../colors.module-72a95925.js';
+import '../colors.module-171b9a02.js';
 
 var styles = {"styrene-xlarge":"typography__styrene-xlarge_fjykh","styrene-large":"typography__styrene-large_fjykh","styrene-medium":"typography__styrene-medium_fjykh","styrene-small":"typography__styrene-small_fjykh","styrene-xsmall":"typography__styrene-xsmall_fjykh","system-xlarge":"typography__system-xlarge_fjykh","system-large":"typography__system-large_fjykh","system-medium":"typography__system-medium_fjykh","system-small":"typography__system-small_fjykh","system-xsmall":"typography__system-xsmall_fjykh","margins-xlarge":"typography__margins-xlarge_fjykh","margins-large":"typography__margins-large_fjykh","margins-medium":"typography__margins-medium_fjykh","margins-small":"typography__margins-small_fjykh","margins-xsmall":"typography__margins-xsmall_fjykh","rowLimit1":"typography__rowLimit1_fjykh","rowLimit2":"typography__rowLimit2_fjykh","rowLimit3":"typography__rowLimit3_fjykh"};
 require('./index.css');

package/typography/esm/title-mobile/component.js

@@ -1,14 +1,14 @@
 import { __assign } from 'tslib';
 import React, { forwardRef } from 'react';
 import { TitleBase } from '../title/component.js';
-import { c as commonStyles } from '../common.module-094a1daa.js';
+import { c as commonStyles } from '../common.module-35992ec8.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-72a95925.js';
+import '../colors.module-171b9a02.js';
 
 var styles = {"styrene-xlarge":"typography__styrene-xlarge_mnp9g","styrene-large":"typography__styrene-large_mnp9g","styrene-medium":"typography__styrene-medium_mnp9g","styrene-small":"typography__styrene-small_mnp9g","styrene-xsmall":"typography__styrene-xsmall_mnp9g","system-xlarge":"typography__system-xlarge_mnp9g","system-large":"typography__system-large_mnp9g","system-medium":"typography__system-medium_mnp9g","system-small":"typography__system-small_mnp9g","system-xsmall":"typography__system-xsmall_mnp9g"};
 require('./index.css');

package/typography/esm/title-mobile/index.js

@@ -8,5 +8,5 @@ import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-72a95925.js';
-import '../common.module-094a1daa.js';
+import '../colors.module-171b9a02.js';
+import '../common.module-35992ec8.js';

package/typography/esm/title-responsive/component.js

@@ -2,14 +2,14 @@ import { __assign } from 'tslib';
 import React, { forwardRef } from 'react';
 import { useMatchMedia } from '../../../mq/esm';
 import { TitleBase } from '../title/component.js';
-import { c as commonStyles } from '../common.module-094a1daa.js';
+import { c as commonStyles } from '../common.module-35992ec8.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-72a95925.js';
+import '../colors.module-171b9a02.js';
 
 var styles = {"styrene-xlarge":"typography__styrene-xlarge_kl7al","styrene-large":"typography__styrene-large_kl7al","styrene-medium":"typography__styrene-medium_kl7al","styrene-small":"typography__styrene-small_kl7al","styrene-xsmall":"typography__styrene-xsmall_kl7al","system-xlarge":"typography__system-xlarge_kl7al","system-large":"typography__system-large_kl7al","system-medium":"typography__system-medium_kl7al","system-small":"typography__system-small_kl7al","system-xsmall":"typography__system-xsmall_kl7al","margins-xlarge":"typography__margins-xlarge_kl7al","margins-large":"typography__margins-large_kl7al","margins-medium":"typography__margins-medium_kl7al","margins-small":"typography__margins-small_kl7al","margins-xsmall":"typography__margins-xsmall_kl7al"};
 require('./index.css');

package/typography/esm/title-responsive/index.js

@@ -9,5 +9,5 @@ import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-72a95925.js';
-import '../common.module-094a1daa.js';
+import '../colors.module-171b9a02.js';
+import '../common.module-35992ec8.js';

package/typography/modern/component.js

@@ -8,10 +8,10 @@ import 'classnames';
 import './hooks/use-skeleton.js';
 import '../../skeleton/modern';
 import '@alfalab/hooks';
-import './colors.module-72b8827b.js';
+import './colors.module-d0a78afd.js';
 import './title/component.js';
 import './title/utils.js';
-import './common.module-c1b61160.js';
+import './common.module-dfaebe18.js';
 import '../../mq/modern';
 
 const Typography = {

package/typography/modern/index.js

@@ -7,11 +7,11 @@ import 'classnames';
 import './hooks/use-skeleton.js';
 import '../../skeleton/modern';
 import '@alfalab/hooks';
-import './colors.module-72b8827b.js';
+import './colors.module-d0a78afd.js';
 import './title/index.js';
 import './title/component.js';
 import './title/utils.js';
-import './common.module-c1b61160.js';
+import './common.module-dfaebe18.js';
 import './title-mobile/component.js';
 import './title-responsive/component.js';
 import '../../mq/modern';

package/typography/modern/text/component.js

@@ -2,7 +2,7 @@ import React, { forwardRef } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { useSkeleton } from '../hooks/use-skeleton.js';
-import { c as colors } from '../colors.module-72b8827b.js';
+import { c as colors } from '../colors.module-d0a78afd.js';
 import '../../../skeleton/modern';
 import '@alfalab/hooks';
 

package/typography/modern/text/index.js

@@ -5,4 +5,4 @@ import 'classnames';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/modern';
 import '@alfalab/hooks';
-import '../colors.module-72b8827b.js';
+import '../colors.module-d0a78afd.js';