@alfalab/core-components 42.0.0-beta.0 → 42.0.0-beta.1

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

@@ -2,28 +2,26 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var tslib = require('tslib');
 var React = require('react');
-var hooks = require('@alfalab/hooks');
+var coreComponentsMq = require('../../../mq');
 var components_secondaryTablist_Component_desktop = require('./Component.desktop.js');
 var components_secondaryTablist_Component_mobile = require('./Component.mobile.js');
 require('./Component.js');
 require('classnames');
 require('../../../tag');
 require('../../hooks/use-tabs.js');
+require('../../../shared');
 require('../scrollable-container/Component.js');
 require('compute-scroll-into-view');
-require('../../index.module-3d16c020.js');
+require('../../index.module-44b9585d.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 var SecondaryTabListResponsive = function (_a) {
-    var size = _a.size, _b = _a.defaultMatch, defaultMatch = _b === void 0 ? 'desktop' : _b, fullWidthScroll = _a.fullWidthScroll, restProps = tslib.__rest(_a, ["size", "defaultMatch", "fullWidthScroll"]);
-    var view = hooks.useMedia([
-        ['mobile', '(max-width: 767px)'],
-        ['desktop', '(min-width: 768px)'],
-    ], defaultMatch)[0];
-    return view === 'desktop' ? (React__default.default.createElement(components_secondaryTablist_Component_desktop.SecondaryTabListDesktop, tslib.__assign({ size: size }, restProps))) : (React__default.default.createElement(components_secondaryTablist_Component_mobile.SecondaryTabListMobile, tslib.__assign({ fullWidthScroll: fullWidthScroll }, restProps)));
+    var size = _a.size, defaultMatchMediaValue = _a.defaultMatchMediaValue, fullWidthScroll = _a.fullWidthScroll, _b = _a.breakpoint, breakpoint = _b === void 0 ? 768 : _b, restProps = tslib.__rest(_a, ["size", "defaultMatchMediaValue", "fullWidthScroll", "breakpoint"]);
+    var isDesktop = coreComponentsMq.useMatchMedia("(min-width: ".concat(breakpoint, "px)"), defaultMatchMediaValue)[0];
+    return isDesktop ? (React__default.default.createElement(components_secondaryTablist_Component_desktop.SecondaryTabListDesktop, tslib.__assign({ size: size, breakpoint: breakpoint }, restProps))) : (React__default.default.createElement(components_secondaryTablist_Component_mobile.SecondaryTabListMobile, tslib.__assign({ fullWidthScroll: fullWidthScroll, breakpoint: breakpoint }, restProps)));
 };
 
 exports.SecondaryTabListResponsive = SecondaryTabListResponsive;

package/tabs/components/tabs/Component.collabsible.desktop.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { TabsProps } from "../../typings";
+type TabsCollapsibleDesktopProps = Omit<TabsProps, 'TabList' | 'fullWidthScroll' | 'scrollable' | 'view'>;
+declare const TabsCollapsibleDesktop: ({ ...restProps }: TabsCollapsibleDesktopProps) => JSX.Element;
+export { TabsCollapsibleDesktopProps, TabsCollapsibleDesktop };

package/tabs/components/tabs/Component.collabsible.desktop.js

@@ -0,0 +1,32 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var components_primaryTablist_Component_collapsible_desktop = require('../primary-tablist/Component.collapsible.desktop.js');
+var components_tabs_Component = require('./Component.js');
+require('../primary-tablist/Component.collapsible.js');
+require('classnames');
+require('../../../badge');
+require('../../../keyboard-focusable');
+require('../../../picker-button/desktop');
+require('../../hooks/use-tablist-titles.js');
+require('../../../mq');
+require('../../hooks/use-collapsible-elements.js');
+require('@juggle/resize-observer');
+require('@alfalab/hooks');
+require('../../hooks/use-tabs.js');
+require('../../../shared');
+require('../../synthetic-events.js');
+require('../title/Component.js');
+require('../../index.module-77258299.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var TabsCollapsibleDesktop = function (_a) {
+    var restProps = tslib.__rest(_a, []);
+    return (React__default.default.createElement(components_tabs_Component.Tabs, tslib.__assign({ TabList: components_primaryTablist_Component_collapsible_desktop.CollapsiblePrimaryTabListDesktop }, restProps)));
+};
+
+exports.TabsCollapsibleDesktop = TabsCollapsibleDesktop;

package/tabs/components/tabs/Component.collapsible.mobile.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { TabsProps } from "../../typings";
+type TabsCollapsibleMobileProps = Omit<TabsProps, 'TabList' | 'scrollable' | 'view' | 'size'>;
+declare const TabsCollapsibleMobile: ({ ...restProps }: TabsCollapsibleMobileProps) => JSX.Element;
+export { TabsCollapsibleMobileProps, TabsCollapsibleMobile };

package/tabs/components/tabs/Component.collapsible.mobile.js

@@ -0,0 +1,33 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var components_primaryTablist_Component_collapsible_mobile = require('../primary-tablist/Component.collapsible.mobile.js');
+var components_tabs_Component = require('./Component.js');
+require('classnames');
+require('../primary-tablist/Component.collapsible.js');
+require('../../../badge');
+require('../../../keyboard-focusable');
+require('../../../picker-button/desktop');
+require('../../hooks/use-tablist-titles.js');
+require('../../../mq');
+require('../../hooks/use-collapsible-elements.js');
+require('@juggle/resize-observer');
+require('@alfalab/hooks');
+require('../../hooks/use-tabs.js');
+require('../../../shared');
+require('../../synthetic-events.js');
+require('../title/Component.js');
+require('../../index.module-77258299.js');
+require('../../mobile.module-d6badaee.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var TabsCollapsibleMobile = function (_a) {
+    var restProps = tslib.__rest(_a, []);
+    return (React__default.default.createElement(components_tabs_Component.Tabs, tslib.__assign({ TabList: components_primaryTablist_Component_collapsible_mobile.CollapsiblePrimaryTabListMobile }, restProps)));
+};
+
+exports.TabsCollapsibleMobile = TabsCollapsibleMobile;

package/tabs/components/tabs/Component.collapsible.responsive.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { TabsProps } from "../../typings";
+type TabsCollapsibleResponsiveProps = Omit<TabsProps, 'TabList' | 'scrollable' | 'view'>;
+declare const TabsCollapsibleResponsive: ({ ...restProps }: TabsCollapsibleResponsiveProps) => JSX.Element;
+export { TabsCollapsibleResponsiveProps, TabsCollapsibleResponsive };

package/tabs/components/tabs/Component.collapsible.responsive.js

@@ -0,0 +1,35 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var components_primaryTablist_Component_collapsible_responsive = require('../primary-tablist/Component.collapsible.responsive.js');
+var components_tabs_Component = require('./Component.js');
+require('../../../mq');
+require('../primary-tablist/Component.collapsible.desktop.js');
+require('../primary-tablist/Component.collapsible.js');
+require('classnames');
+require('../../../badge');
+require('../../../keyboard-focusable');
+require('../../../picker-button/desktop');
+require('../../hooks/use-tablist-titles.js');
+require('../../hooks/use-collapsible-elements.js');
+require('@juggle/resize-observer');
+require('@alfalab/hooks');
+require('../../hooks/use-tabs.js');
+require('../../../shared');
+require('../../synthetic-events.js');
+require('../title/Component.js');
+require('../../index.module-77258299.js');
+require('../primary-tablist/Component.collapsible.mobile.js');
+require('../../mobile.module-d6badaee.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var TabsCollapsibleResponsive = function (_a) {
+    var restProps = tslib.__rest(_a, []);
+    return (React__default.default.createElement(components_tabs_Component.Tabs, tslib.__assign({ TabList: components_primaryTablist_Component_collapsible_responsive.CollapsiblePrimaryTabListResponsive }, restProps)));
+};
+
+exports.TabsCollapsibleResponsive = TabsCollapsibleResponsive;

package/tabs/components/tabs/Component.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { TabsProps } from "../../typings";
-declare const Tabs: ({ TabList, className, containerClassName, size, defaultMatch, children, selectedId, scrollable, collapsible, collapsedTabsIds, fullWidthScroll, keepMounted, dataTestId, onChange, }: Omit<TabsProps, 'view'>) => JSX.Element;
+declare const Tabs: ({ TabList, className, containerClassName, size, defaultMatchMediaValue, children, selectedId, scrollable, collapsedTabsIds, fullWidthScroll, keepMounted, dataTestId, onChange, }: Omit<TabsProps, 'view'>) => JSX.Element;
 export { Tabs };

package/tabs/components/tabs/Component.desktop.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { TabsProps } from "../../typings";
-type TabsDesktopProps = Omit<TabsProps, 'TabList' | 'fullWidthScroll'>;
+type TabsDesktopProps = Omit<TabsProps, 'TabList' | 'fullWidthScroll' | 'collapsedTabsIds'>;
 declare const TabsDesktop: ({ view, scrollable, size, ...restProps }: TabsDesktopProps) => JSX.Element;
 export { TabsDesktopProps, TabsDesktop };

package/tabs/components/tabs/Component.desktop.js

@@ -7,22 +7,16 @@ var components_secondaryTablist_Component_desktop = require('../secondary-tablis
 var components_tabs_Component = require('./Component.js');
 require('../primary-tablist/Component.js');
 require('classnames');
-require('../../../badge');
 require('../../../keyboard-focusable');
-require('../../../picker-button/desktop');
-require('../../hooks/use-tablist-titles.js');
-require('@alfalab/hooks');
-require('../../hooks/use-collapsible-elements.js');
-require('@juggle/resize-observer');
 require('../../hooks/use-tabs.js');
-require('../../synthetic-events.js');
+require('../../../shared');
 require('../scrollable-container/Component.js');
 require('compute-scroll-into-view');
 require('../title/Component.js');
-require('../../index.module-07411303.js');
+require('../../index.module-77258299.js');
 require('../secondary-tablist/Component.js');
 require('../../../tag');
-require('../../index.module-3d16c020.js');
+require('../../index.module-44b9585d.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 

package/tabs/components/tabs/Component.js

@@ -7,7 +7,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 var Tabs = function (_a) {
-    var TabList = _a.TabList, className = _a.className, containerClassName = _a.containerClassName, size = _a.size, defaultMatch = _a.defaultMatch, children = _a.children, selectedId = _a.selectedId, scrollable = _a.scrollable, collapsible = _a.collapsible, collapsedTabsIds = _a.collapsedTabsIds, _b = _a.fullWidthScroll, fullWidthScroll = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, dataTestId = _a.dataTestId, onChange = _a.onChange;
+    var TabList = _a.TabList, className = _a.className, containerClassName = _a.containerClassName, size = _a.size, defaultMatchMediaValue = _a.defaultMatchMediaValue, children = _a.children, selectedId = _a.selectedId, scrollable = _a.scrollable, collapsedTabsIds = _a.collapsedTabsIds, _b = _a.fullWidthScroll, fullWidthScroll = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, dataTestId = _a.dataTestId, onChange = _a.onChange;
     var tabsArray = React__default.default.Children.toArray(children);
     var titles = tabsArray.map(function (_a) {
         var _b = _a.props, title = _b.title, id = _b.id, rightAddons = _b.rightAddons, disabled = _b.disabled, hidden = _b.hidden, toggleClassName = _b.toggleClassName, toggleTestId = _b.dataTestId;
@@ -23,7 +23,7 @@ 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 },
-        React__default.default.createElement(TabList, { containerClassName: containerClassName, size: size, titles: titles, selectedId: selectedId, scrollable: scrollable, collapsible: collapsible, collapsedTabsIds: collapsedTabsIds, onChange: onChange, dataTestId: dataTestId, defaultMatch: defaultMatch, fullWidthScroll: fullWidthScroll }),
+        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 }),
         tabs.map(function (tab) { return React.cloneElement(tab, { hidden: tab.props.id !== selectedId }); })));
 };
 

package/tabs/components/tabs/Component.mobile.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { TabsProps } from "../../typings";
-type TabsMobileProps = Omit<TabsProps, 'TabList' | 'size' | 'collapsible' | 'collapsedTabsIds'>;
+type TabsMobileProps = Omit<TabsProps, 'TabList' | 'size' | 'collapsedTabsIds'>;
 declare const TabsMobile: ({ view, scrollable, ...restProps }: TabsMobileProps) => JSX.Element;
 export { TabsMobileProps, TabsMobile };

package/tabs/components/tabs/Component.mobile.js

@@ -7,22 +7,17 @@ var components_secondaryTablist_Component_mobile = require('../secondary-tablist
 var components_tabs_Component = require('./Component.js');
 require('classnames');
 require('../primary-tablist/Component.js');
-require('../../../badge');
 require('../../../keyboard-focusable');
-require('../../../picker-button/desktop');
-require('../../hooks/use-tablist-titles.js');
-require('@alfalab/hooks');
-require('../../hooks/use-collapsible-elements.js');
-require('@juggle/resize-observer');
 require('../../hooks/use-tabs.js');
-require('../../synthetic-events.js');
+require('../../../shared');
 require('../scrollable-container/Component.js');
 require('compute-scroll-into-view');
 require('../title/Component.js');
-require('../../index.module-07411303.js');
+require('../../index.module-77258299.js');
+require('../../mobile.module-d6badaee.js');
 require('../secondary-tablist/Component.js');
 require('../../../tag');
-require('../../index.module-3d16c020.js');
+require('../../index.module-44b9585d.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 

package/tabs/components/tabs/Component.responsive.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { TabsProps } from "../../typings";
-type TabsResponsiveProps = Omit<TabsProps, 'TabList'>;
+type TabsResponsiveProps = Omit<TabsProps, 'TabList' | 'collapsedTabsIds'>;
 declare const TabsResponsive: ({ view, scrollable, ...restProps }: TabsResponsiveProps) => JSX.Element;
 export { TabsResponsiveProps, TabsResponsive };

package/tabs/components/tabs/Component.responsive.js

@@ -5,27 +5,23 @@ var React = require('react');
 var components_primaryTablist_Component_responsive = require('../primary-tablist/Component.responsive.js');
 var components_secondaryTablist_Component_responsive = require('../secondary-tablist/Component.responsive.js');
 var components_tabs_Component = require('./Component.js');
-require('@alfalab/hooks');
+require('../../../mq');
 require('../primary-tablist/Component.desktop.js');
 require('../primary-tablist/Component.js');
 require('classnames');
-require('../../../badge');
 require('../../../keyboard-focusable');
-require('../../../picker-button/desktop');
-require('../../hooks/use-tablist-titles.js');
-require('../../hooks/use-collapsible-elements.js');
-require('@juggle/resize-observer');
 require('../../hooks/use-tabs.js');
-require('../../synthetic-events.js');
+require('../../../shared');
 require('../scrollable-container/Component.js');
 require('compute-scroll-into-view');
 require('../title/Component.js');
-require('../../index.module-07411303.js');
+require('../../index.module-77258299.js');
 require('../primary-tablist/Component.mobile.js');
+require('../../mobile.module-d6badaee.js');
 require('../secondary-tablist/Component.desktop.js');
 require('../secondary-tablist/Component.js');
 require('../../../tag');
-require('../../index.module-3d16c020.js');
+require('../../index.module-44b9585d.js');
 require('../secondary-tablist/Component.mobile.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }

package/tabs/cssm/Component-4cd3936b.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { FC, SVGProps } from 'react';
+import { OptionShape } from "./shared-4cd3936b";
+import { OptionProps as BaseOptionProps } from "./shared-4cd3936b";
+type OptionProps = Omit<BaseOptionProps, 'option'> & {
+    option: OptionShape & {
+        icon?: FC<SVGProps<SVGSVGElement>>;
+    };
+};
+declare const Option: ({ option, children, ...restProps }: OptionProps) => JSX.Element;
+export { Option };

package/tabs/cssm/Component-5e1b8383.d.ts

@@ -1,4 +1,72 @@
 /// <reference types="react" />
-import { CheckmarkProps } from "./typings-5e1b8383";
-declare const BaseCheckmark: ({ selected, disabled, className, multiple, }: CheckmarkProps) => JSX.Element;
-export { BaseCheckmark };
+import React from 'react';
+import { ReactNode } from "react";
+import { BottomSheetProps } from "./index-f12ee135";
+import { BaseSelectProps } from "./typings-5e1b8383";
+type SelectMobileProps = Omit<BaseSelectProps, 'Checkmark' | 'onScroll'> & {
+    /**
+     * Футер
+     * @deprecated Используйте bottomSheetProps.actionButton
+     */
+    footer?: ReactNode;
+    /**
+     * Будет ли свайпаться шторка
+     * @deprecated Используйте bottomSheetProps.swipeable
+     */
+    swipeable?: boolean;
+    /**
+     * Отображать в BottomSheet
+     */
+    isBottomSheet?: boolean;
+    /**
+     * Дополнительные пропсы шторки
+     */
+    bottomSheetProps?: Partial<BottomSheetProps>;
+    /**
+     *  Дополнительные пропсы модалки
+     */
+    modalProps?: Partial<React.ComponentProps<typeof ModalMobile>>;
+    /**
+     *  Дополнительные пропсы шапки модалки
+     */
+    modalHeaderProps?: Partial<React.ComponentProps<typeof ModalMobile.Header>>;
+    /**
+     *  Дополнительные пропсы футера модалки
+     */
+    modalFooterProps?: Partial<React.ComponentProps<typeof ModalMobile.Footer>>;
+};
+declare const BaseSelectMobile: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "onScroll" | "Checkmark"> & {
+    /**
+     * Футер
+     * @deprecated Используйте bottomSheetProps.actionButton
+     */
+    footer?: ReactNode;
+    /**
+     * Будет ли свайпаться шторка
+     * @deprecated Используйте bottomSheetProps.swipeable
+     */
+    swipeable?: boolean | undefined;
+    /**
+     * Отображать в BottomSheet
+     */
+    isBottomSheet?: boolean | undefined;
+    /**
+     * Дополнительные пропсы шторки
+     */
+    bottomSheetProps?: Partial<BottomSheetProps> | undefined;
+    /**
+     *  Дополнительные пропсы модалки
+     */
+    modalProps?: Partial<ModalMobileProps & React.RefAttributes<HTMLDivElement>> | undefined;
+    /**
+     *  Дополнительные пропсы шапки модалки
+     */
+    modalHeaderProps?: Partial<import("./Component.mobile-e81c389f").HeaderProps> | undefined;
+    /**
+     *  Дополнительные пропсы футера модалки
+     */
+    modalFooterProps?: Partial<import("./Component.mobile-e81c389f").FooterProps> | undefined;
+} & React.RefAttributes<unknown>>;
+export * from "./Component.mobile-e81c389f";
+export { ModalMobileProps } from "./typings-bdb4c6b9";
+export { SelectMobileProps, BaseSelectMobile };

package/tabs/cssm/Component.mobile-e81c389f.d.ts

@@ -0,0 +1,38 @@
+/// <reference types="react" />
+import React from "react";
+import { FC, ReactNode } from "react";
+import { NavigationBarProps } from "./index-e81c389f";
+import { ContentProps, ModalMobileProps } from "./typings-bdb4c6b9";
+type HeaderProps = Omit<NavigationBarProps, "size" | "view" | "parentRef">;
+declare const Header: FC<HeaderProps>;
+declare const Content: FC<ContentProps>;
+type FooterProps = {
+    /**
+     * Контент футера
+     */
+    children?: ReactNode;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Фиксирует футер
+     */
+    sticky?: boolean;
+    /**
+     * Выравнивание элементов футера
+     */
+    layout?: "start" | "center" | "space-between" | "column";
+    /**
+     * Отступы между элементами футера
+     */
+    gap?: 16 | 24 | 32;
+};
+declare const Footer: FC<FooterProps>;
+declare const ModalMobile: React.ForwardRefExoticComponent<ModalMobileProps & React.RefAttributes<HTMLDivElement>> & {
+    Content: React.FC<import("./typings-bdb4c6b9").ContentProps>;
+    Header: React.FC<HeaderProps>;
+    Footer: React.FC<FooterProps>;
+    Closer: React.FC<import("./index-e81c389f").CloserProps>;
+};
+export { HeaderProps, Header, Content, FooterProps, Footer, ModalMobile };

package/tabs/cssm/collapsible.d.ts

@@ -0,0 +1,7 @@
+export { TabsCollapsibleResponsive as TabsCollapsible, TabsCollapsibleResponsiveProps as TabsCollapsibleProps } from "./components/tabs/Component.collapsible.responsive";
+export * from "./components/tabs/Component.collabsible.desktop";
+export * from "./components/tabs/Component.collapsible.mobile";
+export * from "./components/primary-tablist/Component.collapsible.responsive";
+export * from "./components/primary-tablist/Component.collapsible.desktop";
+export * from "./components/primary-tablist/Component.collapsible.mobile";
+export * from "./components/tab/index";

package/tabs/cssm/collapsible.js

@@ -0,0 +1,39 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_tabs_Component_collapsible_responsive = require('./components/tabs/Component.collapsible.responsive.js');
+var components_tabs_Component_collabsible_desktop = require('./components/tabs/Component.collabsible.desktop.js');
+var components_tabs_Component_collapsible_mobile = require('./components/tabs/Component.collapsible.mobile.js');
+var components_primaryTablist_Component_collapsible_responsive = require('./components/primary-tablist/Component.collapsible.responsive.js');
+var components_primaryTablist_Component_collapsible_desktop = require('./components/primary-tablist/Component.collapsible.desktop.js');
+var components_primaryTablist_Component_collapsible_mobile = require('./components/primary-tablist/Component.collapsible.mobile.js');
+var components_tab_Component = require('./components/tab/Component.js');
+require('tslib');
+require('react');
+require('./components/tabs/Component.js');
+require('../../mq/cssm');
+require('./components/primary-tablist/Component.collapsible.js');
+require('classnames');
+require('../../badge/cssm');
+require('../../keyboard-focusable/cssm');
+require('../../picker-button/cssm/desktop');
+require('./hooks/use-tablist-titles.js');
+require('./hooks/use-collapsible-elements.js');
+require('@juggle/resize-observer');
+require('@alfalab/hooks');
+require('./hooks/use-tabs.js');
+require('../../shared/cssm');
+require('./synthetic-events.js');
+require('./components/title/Component.js');
+require('./components/primary-tablist/index.module.css');
+require('./components/primary-tablist/mobile.module.css');
+require('./components/tab/index.module.css');
+
+
+
+exports.TabsCollapsible = components_tabs_Component_collapsible_responsive.TabsCollapsibleResponsive;
+exports.TabsCollapsibleDesktop = components_tabs_Component_collabsible_desktop.TabsCollapsibleDesktop;
+exports.TabsCollapsibleMobile = components_tabs_Component_collapsible_mobile.TabsCollapsibleMobile;
+exports.CollapsiblePrimaryTabListResponsive = components_primaryTablist_Component_collapsible_responsive.CollapsiblePrimaryTabListResponsive;
+exports.CollapsiblePrimaryTabListDesktop = components_primaryTablist_Component_collapsible_desktop.CollapsiblePrimaryTabListDesktop;
+exports.CollapsiblePrimaryTabListMobile = components_primaryTablist_Component_collapsible_mobile.CollapsiblePrimaryTabListMobile;
+exports.Tab = components_tab_Component.Tab;

package/tabs/cssm/components/primary-tablist/Component.collapsible.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { Styles, TabListProps } from "../../typings";
+declare const CollapsiblePrimaryTabList: ({ size, className, containerClassName, titles, styles, selectedId, collapsedTabsIds, fullWidthScroll, onChange, dataTestId, breakpoint, defaultMatchMediaValue, }: TabListProps & Styles) => JSX.Element;
+export { CollapsiblePrimaryTabList };

package/tabs/cssm/components/primary-tablist/Component.collapsible.desktop.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { TabListProps } from "../../typings";
+declare const CollapsiblePrimaryTabListDesktop: ({ size, ...restProps }: TabListProps) => JSX.Element;
+export { CollapsiblePrimaryTabListDesktop };

package/tabs/cssm/components/primary-tablist/Component.collapsible.desktop.js

@@ -0,0 +1,31 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var components_primaryTablist_Component_collapsible = require('./Component.collapsible.js');
+var styles = require('./index.module.css');
+require('classnames');
+require('../../../../badge/cssm');
+require('../../../../keyboard-focusable/cssm');
+require('../../../../picker-button/cssm/desktop');
+require('../../hooks/use-tablist-titles.js');
+require('../../../../mq/cssm');
+require('../../hooks/use-collapsible-elements.js');
+require('@juggle/resize-observer');
+require('@alfalab/hooks');
+require('../../hooks/use-tabs.js');
+require('../../../../shared/cssm');
+require('../../synthetic-events.js');
+require('../title/Component.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var CollapsiblePrimaryTabListDesktop = function (_a) {
+    var _b = _a.size, size = _b === void 0 ? 'm' : _b, restProps = tslib.__rest(_a, ["size"]);
+    return (React__default.default.createElement(components_primaryTablist_Component_collapsible.CollapsiblePrimaryTabList, tslib.__assign({}, restProps, { size: size, styles: styles__default.default })));
+};
+
+exports.CollapsiblePrimaryTabListDesktop = CollapsiblePrimaryTabListDesktop;

package/tabs/cssm/components/primary-tablist/Component.collapsible.js

@@ -0,0 +1,79 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var cn = require('classnames');
+var coreComponentsBadge = require('../../../../badge/cssm');
+var coreComponentsKeyboardFocusable = require('../../../../keyboard-focusable/cssm');
+var desktop = require('../../../../picker-button/cssm/desktop');
+var hooks_useTablistTitles = require('../../hooks/use-tablist-titles.js');
+var syntheticEvents = require('../../synthetic-events.js');
+var components_title_Component = require('../title/Component.js');
+require('../../../../mq/cssm');
+require('../../hooks/use-collapsible-elements.js');
+require('@juggle/resize-observer');
+require('@alfalab/hooks');
+require('../../hooks/use-tabs.js');
+require('../../../../shared/cssm');
+
+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 DEFAULT_STYLES = {};
+var CollapsiblePrimaryTabList = function (_a) {
+    var size = _a.size, className = _a.className, containerClassName = _a.containerClassName, _b = _a.titles, titles = _b === void 0 ? [] : _b, _c = _a.styles, styles = _c === void 0 ? DEFAULT_STYLES : _c, _d = _a.selectedId, selectedId = _d === void 0 ? titles.length ? titles[0].id : undefined : _d, collapsedTabsIds = _a.collapsedTabsIds, fullWidthScroll = _a.fullWidthScroll, onChange = _a.onChange, dataTestId = _a.dataTestId, _e = _a.breakpoint, breakpoint = _e === void 0 ? 768 : _e, defaultMatchMediaValue = _a.defaultMatchMediaValue;
+    var lineRef = React.useRef(null);
+    var _f = hooks_useTablistTitles.useTablistTitles({
+        titles: titles,
+        selectedId: selectedId,
+        collapsedTabsIds: collapsedTabsIds,
+        breakpoint: breakpoint,
+        onChange: onChange,
+        defaultMatchMediaValue: defaultMatchMediaValue,
+    }), containerRef = _f.containerRef, addonRef = _f.addonRef, tablistTitles = _f.tablistTitles, selectedTab = _f.selectedTab, getTabListItemProps = _f.getTabListItemProps;
+    React.useEffect(function () {
+        if (selectedTab && lineRef.current) {
+            lineRef.current.style.width = "".concat(selectedTab.offsetWidth, "px");
+            lineRef.current.style.transform = "translateX(".concat(selectedTab.offsetLeft, "px)");
+        }
+    }, [selectedTab, tablistTitles]);
+    var collapsedOptions = React.useMemo(function () {
+        return tablistTitles.reduce(function (options, title) {
+            if (title.collapsed) {
+                options.push({
+                    key: title.title,
+                    value: title.id,
+                    content: React__default.default.createElement(components_title_Component.Title, tslib.__assign({}, title, { styles: styles, isOption: true })),
+                });
+            }
+            return options;
+        }, []);
+    }, [tablistTitles, styles]);
+    var collapsedAddonsLength = tablistTitles.filter(function (title) { return title.collapsed && title.rightAddons; }).length;
+    var handleOptionsChange = function (payload) {
+        var _a;
+        if (((_a = payload.selected) === null || _a === void 0 ? void 0 : _a.value) && onChange) {
+            var nativeMouseEvent = new MouseEvent('change');
+            var syntheticMouseEvent = syntheticEvents.createSyntheticMouseEvent(nativeMouseEvent);
+            onChange(syntheticMouseEvent, { selectedId: payload.selected.value });
+        }
+    };
+    var renderContent = function () {
+        var _a;
+        return (React__default.default.createElement("div", { role: 'tablist', "data-test-id": dataTestId, className: cn__default.default(styles.component, className, size && styles[size], (_a = {},
+                _a[styles.fullWidthScroll] = fullWidthScroll,
+                _a)) },
+            tablistTitles.map(function (_a, index) {
+                _a.dataTestId; var restTitleProps = tslib.__rest(_a, ["dataTestId"]);
+                return (React__default.default.createElement(coreComponentsKeyboardFocusable.KeyboardFocusable, { key: restTitleProps.id }, function (ref, focused) { return (React__default.default.createElement(components_title_Component.Title, tslib.__assign({}, getTabListItemProps(index, ref), restTitleProps, { focused: focused, styles: styles }))); }));
+            }),
+            collapsedOptions.length ? (React__default.default.createElement("span", { ref: addonRef, role: 'menu', className: styles.pickerWrapper },
+                React__default.default.createElement(desktop.PickerButtonDesktop, { fieldClassName: styles.title, optionClassName: cn__default.default(styles.pickerOption, size && styles[size]), options: collapsedOptions, onChange: handleOptionsChange, rightAddons: collapsedAddonsLength ? (React__default.default.createElement(coreComponentsBadge.Badge, { view: 'count', content: collapsedAddonsLength })) : null, size: 'l', view: 'ghost', label: '\u0415\u0449\u0451', popoverPosition: 'bottom-end' }))) : null,
+            React__default.default.createElement("div", { className: styles.line, ref: lineRef })));
+    };
+    return (React__default.default.createElement("div", { ref: containerRef, className: cn__default.default(styles.container, containerClassName) }, renderContent()));
+};
+
+exports.CollapsiblePrimaryTabList = CollapsiblePrimaryTabList;

package/tabs/cssm/components/primary-tablist/Component.collapsible.mobile.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { TabListProps } from "../../typings";
+type CollapsiblePrimaryTabListMobileProps = Omit<TabListProps, 'size'>;
+declare const CollapsiblePrimaryTabListMobile: ({ className, ...restProps }: CollapsiblePrimaryTabListMobileProps) => JSX.Element;
+export { CollapsiblePrimaryTabListMobileProps, CollapsiblePrimaryTabListMobile };