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

package/side-panel/modern/components/footer/Component.desktop.js

@@ -6,7 +6,7 @@ import '../../../../shared/modern';
 import '../../Context.js';
 import '../../../../base-modal/modern';
 import '../../ResponsiveContext.js';
-import '../../layout.module-7200d95f.js';
+import '../../layout.module-98a7c547.js';
 
 const styles = {"sticky":"side-panel__sticky_nej0v","size-500":"side-panel__size-500_nej0v"};
 require('./desktop.css');

package/side-panel/modern/components/footer/Component.js

@@ -3,7 +3,7 @@ import cn from 'classnames';
 import { getDataTestId } from '../../../../shared/modern';
 import { ModalContext } from '../../Context.js';
 import { ResponsiveContext } from '../../ResponsiveContext.js';
-import { l as layoutStyles } from '../../layout.module-7200d95f.js';
+import { l as layoutStyles } from '../../layout.module-98a7c547.js';
 import '../../../../base-modal/modern';
 
 const styles = {"footer":"side-panel__footer_1cn7q","sticky":"side-panel__sticky_1cn7q","highlighted":"side-panel__highlighted_1cn7q"};

package/side-panel/modern/components/footer/Component.mobile.js

@@ -5,7 +5,7 @@ import '../../../../shared/modern';
 import '../../Context.js';
 import '../../../../base-modal/modern';
 import '../../ResponsiveContext.js';
-import '../../layout.module-7200d95f.js';
+import '../../layout.module-98a7c547.js';
 
 const styles = {"footer":"side-panel__footer_171n6","sticky":"side-panel__sticky_171n6"};
 require('./mobile.css');

package/side-panel/modern/components/header/Component.d.ts

@@ -1,5 +1,5 @@
 import { FC } from 'react';
-import { NavigationBarProps } from "../../../../navigation-bar";
-type HeaderProps = Omit<NavigationBarProps, 'size' | 'view' | 'parentRef'>;
+import { NavigationBarPrivateProps } from "../../../../navigation-bar-private";
+type HeaderProps = Omit<NavigationBarPrivateProps, 'size' | 'view' | 'parentRef'>;
 declare const Header: FC<HeaderProps>;
 export { HeaderProps, Header };

package/side-panel/modern/components/header/Component.js

@@ -1,6 +1,6 @@
 import React, { useContext, useEffect } from 'react';
 import cn from 'classnames';
-import { NavigationBar } from '../../../../navigation-bar/modern';
+import { NavigationBarPrivate } from '../../../../navigation-bar-private/modern';
 import { getDataTestId } from '../../../../shared/modern';
 import { SIZE_TO_CLASSNAME_MAP } from '../../consts.js';
 import { ModalContext } from '../../Context.js';
@@ -23,7 +23,7 @@ const Header = ({ className, children, contentClassName, title, sticky, hasClose
         setHasHeader(true);
     }, [setHasHeader]);
     const hasContent = Boolean(title || children);
-    return (React.createElement(NavigationBar, { dataTestId: getDataTestId(dataTestId, 'header'), ...restProps, scrollableParentRef: componentRef, view: view, sticky: sticky, title: title, hasCloser: hasCloser, onClose: onClose, className: cn(styles.header, className, {
+    return (React.createElement(NavigationBarPrivate, { dataTestId: getDataTestId(dataTestId, 'header'), ...restProps, scrollableParentRef: componentRef, view: view, sticky: sticky, title: title, hasCloser: hasCloser, onClose: onClose, className: cn(styles.header, className, {
             [styles.highlighted]: hasContent && sticky && headerHighlighted,
             [styles.sticky]: sticky,
             [styles.hasContent]: hasContent,

package/side-panel/modern/desktop/Component.desktop.js

@@ -12,9 +12,9 @@ import '../components/content/Component.js';
 import '../../../shared/modern';
 import '../Context.js';
 import '../../../base-modal/modern';
-import '../layout.module-7200d95f.js';
+import '../layout.module-98a7c547.js';
 import '../components/footer/Component.js';
-import '../../../navigation-bar/modern';
+import '../../../navigation-bar-private/modern';
 
 const styles = {"size-500":"side-panel__size-500_bbb92","hidden":"side-panel__hidden_bbb92"};
 require('./desktop.css');

package/side-panel/modern/desktop/index.js

@@ -11,8 +11,8 @@ import '../Context.js';
 import '../../../base-modal/modern';
 import '../ResponsiveContext.js';
 import '../components/controls/Component.js';
-import '../layout.module-7200d95f.js';
+import '../layout.module-98a7c547.js';
 import '../components/footer/Component.desktop.js';
 import '../components/footer/Component.js';
 import '../components/header/Component.js';
-import '../../../navigation-bar/modern';
+import '../../../navigation-bar-private/modern';

package/side-panel/modern/index.js

@@ -5,9 +5,9 @@ import '../../shared/modern';
 import './components/controls/Component.js';
 import 'classnames';
 import './ResponsiveContext.js';
-import './layout.module-7200d95f.js';
+import './layout.module-98a7c547.js';
 import './components/header/Component.js';
-import '../../navigation-bar/modern';
+import '../../navigation-bar-private/modern';
 import './consts.js';
 import './Context.js';
 import '../../base-modal/modern';

package/side-panel/modern/mobile/Component.mobile.js

@@ -9,9 +9,9 @@ import { ResponsiveContext } from '../ResponsiveContext.js';
 import '../components/content/Component.js';
 import '../../../shared/modern';
 import '../Context.js';
-import '../layout.module-7200d95f.js';
+import '../layout.module-98a7c547.js';
 import '../components/footer/Component.js';
-import '../../../navigation-bar/modern';
+import '../../../navigation-bar-private/modern';
 import '../consts.js';
 
 const styles = {"component":"side-panel__component_1hgz2","mobileContent":"side-panel__mobileContent_1hgz2"};

package/side-panel/modern/mobile/index.js

@@ -8,9 +8,9 @@ import '../../../shared/modern';
 import '../Context.js';
 import '../ResponsiveContext.js';
 import '../components/controls/Component.js';
-import '../layout.module-7200d95f.js';
+import '../layout.module-98a7c547.js';
 import '../components/footer/Component.mobile.js';
 import '../components/footer/Component.js';
 import '../components/header/Component.js';
-import '../../../navigation-bar/modern';
+import '../../../navigation-bar-private/modern';
 import '../consts.js';

package/slider-input/Component.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import React from 'react';
-import { ChangeEvent, FC, ReactNode } from "react";
+import { ChangeEvent, ComponentType, ReactNode } from "react";
 import { InputProps } from "../input";
 import { SliderProps } from "../slider";
 type SliderInputProps = Omit<InputProps, 'min' | 'max' | 'step' | 'value' | 'type' | 'onChange' | 'bottomAddons'> & {
@@ -45,7 +45,7 @@ type SliderInputProps = Omit<InputProps, 'min' | 'max' | 'step' | 'value' | 'typ
     /**
      * Компонент поля ввода
      */
-    Input?: FC<Omit<InputProps, 'onChange' | 'value'>>;
+    Input?: ComponentType<Omit<InputProps, 'onChange' | 'value'>>;
     /**
      * Кастомные пропсы для поля ввода
      */
@@ -135,7 +135,7 @@ declare const SliderInput: React.ForwardRefExoticComponent<Omit<InputProps, "val
     /**
      * Компонент поля ввода
      */
-    Input?: React.FC<Omit<InputProps, "value" | "onChange">> | undefined;
+    Input?: React.ComponentType<Omit<InputProps, "value" | "onChange">> | undefined;
     /**
      * Кастомные пропсы для поля ввода
      */

package/slider-input/cssm/Component.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import React from 'react';
-import { ChangeEvent, FC, ReactNode } from "react";
+import { ChangeEvent, ComponentType, ReactNode } from "react";
 import { InputProps } from "../../input";
 import { SliderProps } from "../../slider";
 type SliderInputProps = Omit<InputProps, 'min' | 'max' | 'step' | 'value' | 'type' | 'onChange' | 'bottomAddons'> & {
@@ -45,7 +45,7 @@ type SliderInputProps = Omit<InputProps, 'min' | 'max' | 'step' | 'value' | 'typ
     /**
      * Компонент поля ввода
      */
-    Input?: FC<Omit<InputProps, 'onChange' | 'value'>>;
+    Input?: ComponentType<Omit<InputProps, 'onChange' | 'value'>>;
     /**
      * Кастомные пропсы для поля ввода
      */
@@ -135,7 +135,7 @@ declare const SliderInput: React.ForwardRefExoticComponent<Omit<InputProps, "val
     /**
      * Компонент поля ввода
      */
-    Input?: React.FC<Omit<InputProps, "value" | "onChange">> | undefined;
+    Input?: React.ComponentType<Omit<InputProps, "value" | "onChange">> | undefined;
     /**
      * Кастомные пропсы для поля ввода
      */

package/slider-input/esm/Component.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import React from 'react';
-import { ChangeEvent, FC, ReactNode } from "react";
+import { ChangeEvent, ComponentType, ReactNode } from "react";
 import { InputProps } from "../../input";
 import { SliderProps } from "../../slider";
 type SliderInputProps = Omit<InputProps, 'min' | 'max' | 'step' | 'value' | 'type' | 'onChange' | 'bottomAddons'> & {
@@ -45,7 +45,7 @@ type SliderInputProps = Omit<InputProps, 'min' | 'max' | 'step' | 'value' | 'typ
     /**
      * Компонент поля ввода
      */
-    Input?: FC<Omit<InputProps, 'onChange' | 'value'>>;
+    Input?: ComponentType<Omit<InputProps, 'onChange' | 'value'>>;
     /**
      * Кастомные пропсы для поля ввода
      */
@@ -135,7 +135,7 @@ declare const SliderInput: React.ForwardRefExoticComponent<Omit<InputProps, "val
     /**
      * Компонент поля ввода
      */
-    Input?: React.FC<Omit<InputProps, "value" | "onChange">> | undefined;
+    Input?: React.ComponentType<Omit<InputProps, "value" | "onChange">> | undefined;
     /**
      * Кастомные пропсы для поля ввода
      */

package/slider-input/modern/Component.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import React from 'react';
-import { ChangeEvent, FC, ReactNode } from "react";
+import { ChangeEvent, ComponentType, ReactNode } from "react";
 import { InputProps } from "../../input";
 import { SliderProps } from "../../slider";
 type SliderInputProps = Omit<InputProps, 'min' | 'max' | 'step' | 'value' | 'type' | 'onChange' | 'bottomAddons'> & {
@@ -45,7 +45,7 @@ type SliderInputProps = Omit<InputProps, 'min' | 'max' | 'step' | 'value' | 'typ
     /**
      * Компонент поля ввода
      */
-    Input?: FC<Omit<InputProps, 'onChange' | 'value'>>;
+    Input?: ComponentType<Omit<InputProps, 'onChange' | 'value'>>;
     /**
      * Кастомные пропсы для поля ввода
      */
@@ -135,7 +135,7 @@ declare const SliderInput: React.ForwardRefExoticComponent<Omit<InputProps, "val
     /**
      * Компонент поля ввода
      */
-    Input?: React.FC<Omit<InputProps, "value" | "onChange">> | undefined;
+    Input?: React.ComponentType<Omit<InputProps, "value" | "onChange">> | undefined;
     /**
      * Кастомные пропсы для поля ввода
      */

package/status/Component.d.ts

@@ -12,7 +12,7 @@ type StatusProps = {
     /**
      * Цветовое оформление иконки
      */
-    color?: typeof colors[number];
+    color?: (typeof colors)[number];
     /**
      * Идентификатор для систем автоматизированного тестирования
      */

package/status/Component.js

@@ -8,13 +8,14 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"component":"status__component_qw79g","soft":"status__soft_qw79g","green":"status__green_qw79g","orange":"status__orange_qw79g","red":"status__red_qw79g","blue":"status__blue_qw79g","grey":"status__grey_qw79g","teal":"status__teal_qw79g","purple":"status__purple_qw79g","contrast":"status__contrast_qw79g"};
+var styles = {"component":"status__component_qw79g","ellipsis":"status__ellipsis_qw79g","soft":"status__soft_qw79g","green":"status__green_qw79g","orange":"status__orange_qw79g","red":"status__red_qw79g","blue":"status__blue_qw79g","grey":"status__grey_qw79g","teal":"status__teal_qw79g","purple":"status__purple_qw79g","contrast":"status__contrast_qw79g"};
 require('./index.css');
 
 var colors = ['green', 'orange', 'red', 'blue', 'grey', 'teal', 'purple'];
 var Status = function (_a) {
     var className = _a.className, _b = _a.view, view = _b === void 0 ? 'soft' : _b, _c = _a.color, color = _c === void 0 ? 'green' : _c, children = _a.children, dataTestId = _a.dataTestId;
-    return (React__default.default.createElement("span", { className: cn__default.default(styles.component, styles[color], styles[view], className), "data-test-id": dataTestId }, children));
+    return (React__default.default.createElement("span", { className: cn__default.default(styles.component, styles[color], styles[view], className), "data-test-id": dataTestId },
+        React__default.default.createElement("span", { className: styles.ellipsis }, children)));
 };
 
 exports.Status = Status;

package/status/cssm/Component.d.ts

@@ -12,7 +12,7 @@ type StatusProps = {
     /**
      * Цветовое оформление иконки
      */
-    color?: typeof colors[number];
+    color?: (typeof colors)[number];
     /**
      * Идентификатор для систем автоматизированного тестирования
      */

package/status/cssm/Component.js

@@ -13,7 +13,8 @@ var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
 var colors = ['green', 'orange', 'red', 'blue', 'grey', 'teal', 'purple'];
 var Status = function (_a) {
     var className = _a.className, _b = _a.view, view = _b === void 0 ? 'soft' : _b, _c = _a.color, color = _c === void 0 ? 'green' : _c, children = _a.children, dataTestId = _a.dataTestId;
-    return (React__default.default.createElement("span", { className: cn__default.default(styles__default.default.component, styles__default.default[color], styles__default.default[view], className), "data-test-id": dataTestId }, children));
+    return (React__default.default.createElement("span", { className: cn__default.default(styles__default.default.component, styles__default.default[color], styles__default.default[view], className), "data-test-id": dataTestId },
+        React__default.default.createElement("span", { className: styles__default.default.ellipsis }, children)));
 };
 
 exports.Status = Status;

package/status/cssm/index.module.css

@@ -51,9 +51,14 @@
     border-radius: var(--border-radius-s);
     text-align: center;
     text-transform: uppercase;
-    white-space: nowrap;
     letter-spacing: 0.5px
-} .component:empty {
+} .component .ellipsis {
+        -webkit-line-clamp: 1;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        overflow: hidden;
+        word-break: break-all;
+    } .component:empty {
         padding: 0;
     } .soft.green {
         background: var(--color-light-decorative-muted-alt-green);

package/status/esm/Component.d.ts

@@ -12,7 +12,7 @@ type StatusProps = {
     /**
      * Цветовое оформление иконки
      */
-    color?: typeof colors[number];
+    color?: (typeof colors)[number];
     /**
      * Идентификатор для систем автоматизированного тестирования
      */

package/status/esm/Component.js

@@ -1,13 +1,14 @@
 import React from 'react';
 import cn from 'classnames';
 
-var styles = {"component":"status__component_qw79g","soft":"status__soft_qw79g","green":"status__green_qw79g","orange":"status__orange_qw79g","red":"status__red_qw79g","blue":"status__blue_qw79g","grey":"status__grey_qw79g","teal":"status__teal_qw79g","purple":"status__purple_qw79g","contrast":"status__contrast_qw79g"};
+var styles = {"component":"status__component_qw79g","ellipsis":"status__ellipsis_qw79g","soft":"status__soft_qw79g","green":"status__green_qw79g","orange":"status__orange_qw79g","red":"status__red_qw79g","blue":"status__blue_qw79g","grey":"status__grey_qw79g","teal":"status__teal_qw79g","purple":"status__purple_qw79g","contrast":"status__contrast_qw79g"};
 require('./index.css');
 
 var colors = ['green', 'orange', 'red', 'blue', 'grey', 'teal', 'purple'];
 var Status = function (_a) {
     var className = _a.className, _b = _a.view, view = _b === void 0 ? 'soft' : _b, _c = _a.color, color = _c === void 0 ? 'green' : _c, children = _a.children, dataTestId = _a.dataTestId;
-    return (React.createElement("span", { className: cn(styles.component, styles[color], styles[view], className), "data-test-id": dataTestId }, children));
+    return (React.createElement("span", { className: cn(styles.component, styles[color], styles[view], className), "data-test-id": dataTestId },
+        React.createElement("span", { className: styles.ellipsis }, children)));
 };
 
 export { Status, colors };

package/status/esm/index.css

@@ -52,9 +52,14 @@
     border-radius: var(--border-radius-s);
     text-align: center;
     text-transform: uppercase;
-    white-space: nowrap;
     letter-spacing: 0.5px
-} .status__component_qw79g:empty {
+} .status__component_qw79g .status__ellipsis_qw79g {
+        -webkit-line-clamp: 1;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        overflow: hidden;
+        word-break: break-all;
+    } .status__component_qw79g:empty {
         padding: 0;
     } .status__soft_qw79g.status__green_qw79g {
         background: var(--color-light-decorative-muted-alt-green);

package/status/index.css

@@ -52,9 +52,14 @@
     border-radius: var(--border-radius-s);
     text-align: center;
     text-transform: uppercase;
-    white-space: nowrap;
     letter-spacing: 0.5px
-} .status__component_qw79g:empty {
+} .status__component_qw79g .status__ellipsis_qw79g {
+        -webkit-line-clamp: 1;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        overflow: hidden;
+        word-break: break-all;
+    } .status__component_qw79g:empty {
         padding: 0;
     } .status__soft_qw79g.status__green_qw79g {
         background: var(--color-light-decorative-muted-alt-green);

package/status/modern/Component.d.ts

@@ -12,7 +12,7 @@ type StatusProps = {
     /**
      * Цветовое оформление иконки
      */
-    color?: typeof colors[number];
+    color?: (typeof colors)[number];
     /**
      * Идентификатор для систем автоматизированного тестирования
      */

package/status/modern/Component.js

@@ -1,10 +1,11 @@
 import React from 'react';
 import cn from 'classnames';
 
-const styles = {"component":"status__component_qw79g","soft":"status__soft_qw79g","green":"status__green_qw79g","orange":"status__orange_qw79g","red":"status__red_qw79g","blue":"status__blue_qw79g","grey":"status__grey_qw79g","teal":"status__teal_qw79g","purple":"status__purple_qw79g","contrast":"status__contrast_qw79g"};
+const styles = {"component":"status__component_qw79g","ellipsis":"status__ellipsis_qw79g","soft":"status__soft_qw79g","green":"status__green_qw79g","orange":"status__orange_qw79g","red":"status__red_qw79g","blue":"status__blue_qw79g","grey":"status__grey_qw79g","teal":"status__teal_qw79g","purple":"status__purple_qw79g","contrast":"status__contrast_qw79g"};
 require('./index.css');
 
 const colors = ['green', 'orange', 'red', 'blue', 'grey', 'teal', 'purple'];
-const Status = ({ className, view = 'soft', color = 'green', children, dataTestId, }) => (React.createElement("span", { className: cn(styles.component, styles[color], styles[view], className), "data-test-id": dataTestId }, children));
+const Status = ({ className, view = 'soft', color = 'green', children, dataTestId, }) => (React.createElement("span", { className: cn(styles.component, styles[color], styles[view], className), "data-test-id": dataTestId },
+    React.createElement("span", { className: styles.ellipsis }, children)));
 
 export { Status, colors };

package/status/modern/index.css

@@ -52,9 +52,14 @@
     border-radius: var(--border-radius-s);
     text-align: center;
     text-transform: uppercase;
-    white-space: nowrap;
     letter-spacing: 0.5px
-} .status__component_qw79g:empty {
+} .status__component_qw79g .status__ellipsis_qw79g {
+        -webkit-line-clamp: 1;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        overflow: hidden;
+        word-break: break-all;
+    } .status__component_qw79g:empty {
         padding: 0;
     } .status__soft_qw79g.status__green_qw79g {
         background: var(--color-light-decorative-muted-alt-green);

package/tabs/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/components/primary-tablist/Component.js

@@ -16,7 +16,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
 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 = React.useRef(null);
     var _f = hooks_useTabs.useTabs({
         titles: titles,
@@ -50,7 +50,7 @@ var PrimaryTabList = function (_a) {
             React__default.default.createElement("div", { className: styles.line, ref: lineRef })));
     };
     var wrapperClassName = cn__default.default(textStyle && styles[textStyle], styles[platform]);
-    return scrollable ? (React__default.default.createElement(components_scrollableContainer_Component.ScrollableContainer, { containerWrapperClassName: wrapperClassName, activeChild: focusedTab || selectedTab, containerClassName: containerClassName, scrollControlsClassName: cn__default.default(textStyle && styles.scrollControls), fullWidthScroll: fullWidthScroll, view: 'primary', size: textStyle ? undefined : size, platform: platform }, renderContent())) : (React__default.default.createElement("div", { className: cn__default.default(styles.container, wrapperClassName, containerClassName) }, renderContent()));
+    return scrollable ? (React__default.default.createElement(components_scrollableContainer_Component.ScrollableContainer, { containerWrapperClassName: wrapperClassName, activeChild: focusedTab || selectedTab, containerClassName: containerClassName, scrollControlsClassName: cn__default.default(textStyle && styles.scrollControls), fullWidthScroll: fullWidthScroll, view: 'primary', size: textStyle ? undefined : size, platform: platform, inlineStyle: inlineStyle }, renderContent())) : (React__default.default.createElement("div", { className: cn__default.default(styles.container, wrapperClassName, containerClassName), style: inlineStyle }, renderContent()));
 };
 
 exports.PrimaryTabList = PrimaryTabList;

package/tabs/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/components/scrollable-container/Component.js

@@ -24,7 +24,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 = React.useRef(null);
     var controlsRef = React.useRef(null);
     var _c = React.useState(false), overflown = _c[0], setOverflown = _c[1];
@@ -66,7 +66,7 @@ var ScrollableContainer = function (_a) {
         }
         return function () { };
     }, [platform]);
-    return (React__default.default.createElement("div", { className: cn__default.default(styles.scrollableContainerWrapper, containerWrapperClassName) },
+    return (React__default.default.createElement("div", { className: cn__default.default(styles.scrollableContainerWrapper, containerWrapperClassName), style: inlineStyle },
         React__default.default.createElement("div", { ref: containerRef, className: cn__default.default(styles.container, containerClassName, (_b = {},
                 _b[styles.fullWidthScroll] = fullWidthScroll,
                 _b)) }, children),

package/tabs/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/components/secondary-tablist/Component.js

@@ -12,7 +12,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
 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 = hooks_useTabs.useTabs({
         titles: titles,
         selectedId: selectedId,
@@ -30,7 +30,7 @@ var SecondaryTabList = function (_a) {
             return (React__default.default.createElement(TagComponent, tslib.__assign({}, getTabListItemProps(index), { shape: tagShape, view: tagView, key: item.id, className: cn__default.default(styles.title, item.toggleClassName), checked: item.id === selectedId, size: tagSize, rightAddons: item.rightAddons }), item.title));
         })));
     };
-    return scrollable ? (React__default.default.createElement(components_scrollableContainer_Component.ScrollableContainer, { activeChild: focusedTab || selectedTab, containerClassName: containerClassName, fullWidthScroll: fullWidthScroll, view: 'secondary', size: size, platform: platform }, renderContent())) : (React__default.default.createElement("div", { className: cn__default.default(styles.container, containerClassName) }, renderContent()));
+    return scrollable ? (React__default.default.createElement(components_scrollableContainer_Component.ScrollableContainer, { activeChild: focusedTab || selectedTab, containerClassName: containerClassName, fullWidthScroll: fullWidthScroll, view: 'secondary', size: size, platform: platform, inlineStyle: inlineStyle }, renderContent())) : (React__default.default.createElement("div", { className: cn__default.default(styles.container, containerClassName), style: inlineStyle }, renderContent()));
 };
 
 exports.SecondaryTabList = SecondaryTabList;

package/tabs/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/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/cssm/components/primary-tablist/Component.js

@@ -16,7 +16,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
 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 = React.useRef(null);
     var _f = hooks_useTabs.useTabs({
         titles: titles,
@@ -50,7 +50,7 @@ var PrimaryTabList = function (_a) {
             React__default.default.createElement("div", { className: styles.line, ref: lineRef })));
     };
     var wrapperClassName = cn__default.default(textStyle && styles[textStyle], styles[platform]);
-    return scrollable ? (React__default.default.createElement(components_scrollableContainer_Component.ScrollableContainer, { containerWrapperClassName: wrapperClassName, activeChild: focusedTab || selectedTab, containerClassName: containerClassName, scrollControlsClassName: cn__default.default(textStyle && styles.scrollControls), fullWidthScroll: fullWidthScroll, view: 'primary', size: textStyle ? undefined : size, platform: platform }, renderContent())) : (React__default.default.createElement("div", { className: cn__default.default(styles.container, wrapperClassName, containerClassName) }, renderContent()));
+    return scrollable ? (React__default.default.createElement(components_scrollableContainer_Component.ScrollableContainer, { containerWrapperClassName: wrapperClassName, activeChild: focusedTab || selectedTab, containerClassName: containerClassName, scrollControlsClassName: cn__default.default(textStyle && styles.scrollControls), fullWidthScroll: fullWidthScroll, view: 'primary', size: textStyle ? undefined : size, platform: platform, inlineStyle: inlineStyle }, renderContent())) : (React__default.default.createElement("div", { className: cn__default.default(styles.container, wrapperClassName, containerClassName), style: inlineStyle }, renderContent()));
 };
 
 exports.PrimaryTabList = PrimaryTabList;

package/tabs/cssm/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/cssm/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 = React.useRef(null);
     var controlsRef = React.useRef(null);
     var _c = React.useState(false), overflown = _c[0], setOverflown = _c[1];
@@ -65,7 +65,7 @@ var ScrollableContainer = function (_a) {
         }
         return function () { };
     }, [platform]);
-    return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.scrollableContainerWrapper, containerWrapperClassName) },
+    return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.scrollableContainerWrapper, containerWrapperClassName), style: inlineStyle },
         React__default.default.createElement("div", { ref: containerRef, className: cn__default.default(styles__default.default.container, containerClassName, (_b = {},
                 _b[styles__default.default.fullWidthScroll] = fullWidthScroll,
                 _b)) }, children),

package/tabs/cssm/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/cssm/components/secondary-tablist/Component.js

@@ -12,7 +12,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
 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 = hooks_useTabs.useTabs({
         titles: titles,
         selectedId: selectedId,
@@ -30,7 +30,7 @@ var SecondaryTabList = function (_a) {
             return (React__default.default.createElement(TagComponent, tslib.__assign({}, getTabListItemProps(index), { shape: tagShape, view: tagView, key: item.id, className: cn__default.default(styles.title, item.toggleClassName), checked: item.id === selectedId, size: tagSize, rightAddons: item.rightAddons }), item.title));
         })));
     };
-    return scrollable ? (React__default.default.createElement(components_scrollableContainer_Component.ScrollableContainer, { activeChild: focusedTab || selectedTab, containerClassName: containerClassName, fullWidthScroll: fullWidthScroll, view: 'secondary', size: size, platform: platform }, renderContent())) : (React__default.default.createElement("div", { className: cn__default.default(styles.container, containerClassName) }, renderContent()));
+    return scrollable ? (React__default.default.createElement(components_scrollableContainer_Component.ScrollableContainer, { activeChild: focusedTab || selectedTab, containerClassName: containerClassName, fullWidthScroll: fullWidthScroll, view: 'secondary', size: size, platform: platform, inlineStyle: inlineStyle }, renderContent())) : (React__default.default.createElement("div", { className: cn__default.default(styles.container, containerClassName), style: inlineStyle }, renderContent()));
 };
 
 exports.SecondaryTabList = SecondaryTabList;