@alfalab/core-components-tab-bar 4.0.2 → 4.0.3

package/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["src/Component.tsx"],"sourcesContent":["import React, { Children, cloneElement, forwardRef } from 'react';\nimport cn from 'classnames';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { Tab } from './components/tab';\nimport { type TabBarProps } from './types';\n\nimport styles from './index.module.css';\n\nconst TabBarComponent = forwardRef<HTMLDivElement, TabBarProps>(\n    (\n        {\n            children,\n            className,\n            selectedId,\n            border,\n            dataTestId,\n            tabClassNames,\n            onChange,\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        if (Children.count(children) > 5) {\n            // eslint-disable-next-line no-console\n            console.error('Компонент TabBar не может содержать больше 5 табов');\n        }\n\n        return (\n            <nav\n                data-test-id={dataTestId}\n                {...restProps}\n                ref={ref}\n                className={cn(styles.component, styles[bgColor], className, {\n                    [styles.border]: border,\n                })}\n            >\n                {Children.map(children, (tab) =>\n                    cloneElement(tab, {\n                        bgColor,\n                        accentColor,\n                        selected: tab.props.id === selectedId,\n                        onChange,\n                        tabClassNames,\n                        dataTestId: getDataTestId(dataTestId, 'tab'),\n                    }),\n                )}\n            </nav>\n        );\n    },\n);\n\nTabBarComponent.displayName = 'TabBarComponent';\n\nexport const TabBar = Object.assign(TabBarComponent, { Tab });\n"],"names":["forwardRef","__rest","Children","React","cn","styles","cloneElement","getDataTestId","Tab"],"mappings":";;;;;;;;;;;;;;;;AAUA,IAAM,eAAe,GAAGA,gBAAU,CAC9B,UACI,EAWC,EACD,GAAG,EAAA;;AAXC,IAAA,IAAA,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,MAAM,YAAA,EACN,UAAU,gBAAA,EACV,aAAa,mBAAA,EACb,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,mBAAuB,EAAvB,WAAW,GAAG,EAAA,KAAA,MAAA,GAAA,SAAS,KAAA,EACvB,EAAA,GAAA,EAAA,CAAA,OAA4B,EAA5B,OAAO,mBAAG,kBAAkB,GAAA,EAAA,EACzB,SAAS,GAAAC,YAAA,CAAA,EAAA,EAVhB,sHAWC,CADe;IAIhB,IAAIC,cAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;;AAE9B,QAAA,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC;AACtE;IAED,QACIC,6EACkB,UAAU,EAAA,EACpB,SAAS,EACb,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAEC,mBAAE,CAACC,YAAM,CAAC,SAAS,EAAEA,YAAM,CAAC,OAAO,CAAC,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACtD,YAAA,EAAA,CAACA,YAAM,CAAC,MAAM,CAAA,GAAG,MAAM;AACzB,YAAA,EAAA,EAAA,EAAA,CAAA,EAEDH,cAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAC,GAAG,EAAA;QACxB,OAAAI,kBAAY,CAAC,GAAG,EAAE;AACd,YAAA,OAAO,EAAA,OAAA;AACP,YAAA,WAAW,EAAA,WAAA;AACX,YAAA,QAAQ,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE,KAAK,UAAU;AACrC,YAAA,QAAQ,EAAA,QAAA;AACR,YAAA,aAAa,EAAA,aAAA;AACb,YAAA,UAAU,EAAEC,kCAAa,CAAC,UAAU,EAAE,KAAK,CAAC;SAC/C,CAAC;KAAA,CACL,CACC;AAEd,CAAC,CACJ;AAED,eAAe,CAAC,WAAW,GAAG,iBAAiB;AAExC,IAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE,EAAE,GAAG,EAAAC,aAAA,EAAE;;;;"}
+{"version":3,"file":"Component.js","sources":["src/Component.tsx"],"sourcesContent":["import React, { Children, cloneElement, forwardRef } from 'react';\nimport cn from 'classnames';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { Tab } from './components/tab';\nimport { type TabBarProps } from './types';\n\nimport styles from './index.module.css';\n\nconst TabBarComponent = forwardRef<HTMLDivElement, TabBarProps>(\n    (\n        {\n            children,\n            className,\n            selectedId,\n            border,\n            dataTestId,\n            tabClassNames,\n            onChange,\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        if (Children.count(children) > 5) {\n            // eslint-disable-next-line no-console\n            console.error('Компонент TabBar не может содержать больше 5 табов');\n        }\n\n        return (\n            <nav\n                data-test-id={dataTestId}\n                {...restProps}\n                ref={ref}\n                className={cn(styles.component, styles[bgColor], className, {\n                    [styles.border]: border,\n                })}\n            >\n                {Children.map(children, (tab) =>\n                    cloneElement(tab, {\n                        bgColor,\n                        accentColor,\n                        selected: tab.props.id === selectedId,\n                        onChange,\n                        tabClassNames,\n                        dataTestId: getDataTestId(dataTestId, 'tab'),\n                    }),\n                )}\n            </nav>\n        );\n    },\n);\n\nTabBarComponent.displayName = 'TabBarComponent';\n\nexport const TabBar = Object.assign(TabBarComponent, { Tab });\n"],"names":["forwardRef","__rest","Children","React","cn","styles","cloneElement","getDataTestId","Tab"],"mappings":";;;;;;;;;;;;;;;;AAUA,IAAM,eAAe,GAAGA,gBAAU,CAC9B,UACI,EAWC,EACD,GAAG,EAAA;;AAXC,IAAA,IAAA,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,MAAM,YAAA,EACN,UAAU,gBAAA,EACV,aAAa,mBAAA,EACb,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,mBAAuB,EAAvB,WAAW,GAAG,EAAA,KAAA,MAAA,GAAA,SAAS,KAAA,EACvB,EAAA,GAAA,EAAA,CAAA,OAA4B,EAA5B,OAAO,mBAAG,kBAAkB,GAAA,EAAA,EACzB,SAAS,GAAAC,YAAA,CAAA,EAAA,EAVhB,sHAWC,CADe;IAIhB,IAAIC,cAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;;AAE9B,QAAA,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC;;IAGvE,QACIC,6EACkB,UAAU,EAAA,EACpB,SAAS,EACb,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAEC,mBAAE,CAACC,YAAM,CAAC,SAAS,EAAEA,YAAM,CAAC,OAAO,CAAC,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACtD,YAAA,EAAA,CAACA,YAAM,CAAC,MAAM,CAAA,GAAG,MAAM;AACzB,YAAA,EAAA,EAAA,EAAA,CAAA,EAEDH,cAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAC,GAAG,EAAA;QACxB,OAAAI,kBAAY,CAAC,GAAG,EAAE;AACd,YAAA,OAAO,EAAA,OAAA;AACP,YAAA,WAAW,EAAA,WAAA;AACX,YAAA,QAAQ,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE,KAAK,UAAU;AACrC,YAAA,QAAQ,EAAA,QAAA;AACR,YAAA,aAAa,EAAA,aAAA;AACb,YAAA,UAAU,EAAEC,kCAAa,CAAC,UAAU,EAAE,KAAK,CAAC;SAC/C,CAAC;KAAA,CACL,CACC;AAEd,CAAC,CACJ;AAED,eAAe,CAAC,WAAW,GAAG,iBAAiB;AAExC,IAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE,EAAE,GAAG,EAAAC,aAAA,EAAE;;;;"}

package/components/tab/Component.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
+import { type ForwardRefExoticComponent, type RefAttributes } from 'react';
 import { type PublicTabProps } from '../../types';
-export declare const Tab: React.ForwardRefExoticComponent<PublicTabProps & React.RefAttributes<HTMLElement>>;
+export declare const Tab: ForwardRefExoticComponent<PublicTabProps & RefAttributes<HTMLElement>>;

package/components/tab/Component.js

@@ -26,10 +26,14 @@ var TabComponent = React.forwardRef(function (_a, ref) {
     return (React__default.default.createElement(Component, tslib.__assign({ "data-test-id": dataTestId, tabIndex: 0 }, (Component === 'button' ? { type: 'button' } : null), restProps, { href: href, id: id, ref: ref, className: cn__default.default(index_module.component, commonClassName, className, selected && commonSelectedClassName, selected && selectedClassName, (_b = {},
             _b[index_module[accentColor]] = selected,
             _b)), onClick: handleClick }),
-        React__default.default.createElement("div", { className: cn__default.default(index_module.icon, commonIconClassName, iconClassName) }, React.isValidElement(icon) ? React.cloneElement(icon, { selected: selected }) : icon),
+        React__default.default.createElement("div", { className: cn__default.default(index_module.icon, commonIconClassName, iconClassName) }, React.isValidElement(icon)
+            ? React.cloneElement(icon, { selected: selected })
+            : icon),
         React__default.default.createElement(coreComponentsTypography.TypographyText, { weight: 'medium', view: 'secondary-small', className: cn__default.default(index_module.label, commonLabelClassName, labelClassName, (_c = {},
                 _c[index_module.labelSelected] = selected,
-                _c)) }, React.isValidElement(label) ? React.cloneElement(label, { selected: selected }) : label),
+                _c)) }, React.isValidElement(label)
+            ? React.cloneElement(label, { selected: selected })
+            : label),
         showIndicator && (React__default.default.createElement("div", { className: index_module.indicator },
             React__default.default.createElement(coreComponentsIndicator.Indicator, tslib.__assign({}, indicatorProps, { height: (indicatorProps === null || indicatorProps === void 0 ? void 0 : indicatorProps.value) ? 16 : undefined, border: {
                     width: 2,

package/components/tab/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../src/components/tab/Component.tsx"],"sourcesContent":["import React, {\n    cloneElement,\n    forwardRef,\n    type ForwardRefExoticComponent,\n    isValidElement,\n    type MouseEventHandler,\n    type RefAttributes,\n} from 'react';\nimport cn from 'classnames';\n\nimport { Indicator } from '@alfalab/core-components-indicator';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { INDICATOR_BG_COLOR, INDICATOR_BORDER_COLOR } from '../../consts';\nimport { type AllTabProps, type PublicTabProps } from '../../types';\n\nimport styles from './index.module.css';\n\nconst TabComponent = forwardRef<HTMLElement, AllTabProps>(\n    (\n        {\n            showIndicator,\n            indicatorProps,\n            label,\n            icon,\n            id,\n            selected,\n            onChange,\n            onClick,\n            tabClassNames = {},\n            dataTestId,\n            className,\n            labelClassName,\n            selectedClassName,\n            iconClassName,\n            href,\n            Component = href ? 'a' : 'button',\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        const handleClick: MouseEventHandler<HTMLElement> = (event) => {\n            onChange?.(id);\n            onClick?.(event);\n        };\n\n        const {\n            className: commonClassName,\n            labelClassName: commonLabelClassName,\n            selectedClassName: commonSelectedClassName,\n            iconClassName: commonIconClassName,\n        } = tabClassNames;\n\n        return (\n            <Component\n                data-test-id={dataTestId}\n                tabIndex={0}\n                {...(Component === 'button' ? { type: 'button' } : null)}\n                {...restProps}\n                href={href}\n                id={id}\n                ref={ref}\n                className={cn(\n                    styles.component,\n                    commonClassName,\n                    className,\n                    selected && commonSelectedClassName,\n                    selected && selectedClassName,\n                    {\n                        [styles[accentColor]]: selected,\n                    },\n                )}\n                onClick={handleClick}\n            >\n                <div className={cn(styles.icon, commonIconClassName, iconClassName)}>\n                    {isValidElement(icon) ? cloneElement(icon, { selected }) : icon}\n                </div>\n\n                <TypographyText\n                    weight='medium'\n                    view='secondary-small'\n                    className={cn(styles.label, commonLabelClassName, labelClassName, {\n                        [styles.labelSelected]: selected,\n                    })}\n                >\n                    {isValidElement(label) ? cloneElement(label, { selected }) : label}\n                </TypographyText>\n\n                {showIndicator && (\n                    <div className={styles.indicator}>\n                        <Indicator\n                            {...indicatorProps}\n                            height={indicatorProps?.value ? 16 : undefined}\n                            border={{\n                                width: 2,\n                                color: INDICATOR_BORDER_COLOR[bgColor],\n                            }}\n                            backgroundColor={INDICATOR_BG_COLOR[accentColor]}\n                        />\n                    </div>\n                )}\n            </Component>\n        );\n    },\n);\n\nexport const Tab = TabComponent as ForwardRefExoticComponent<\n    PublicTabProps & RefAttributes<HTMLElement>\n>;\n"],"names":["forwardRef","__rest","React","__assign","cn","styles","isValidElement","cloneElement","TypographyText","Indicator","INDICATOR_BORDER_COLOR","INDICATOR_BG_COLOR"],"mappings":"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"}
+{"version":3,"file":"Component.js","sources":["../../src/components/tab/Component.tsx"],"sourcesContent":["import React, {\n    cloneElement,\n    forwardRef,\n    type ForwardRefExoticComponent,\n    isValidElement,\n    type MouseEventHandler,\n    type RefAttributes,\n} from 'react';\nimport cn from 'classnames';\n\nimport { Indicator } from '@alfalab/core-components-indicator';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { INDICATOR_BG_COLOR, INDICATOR_BORDER_COLOR } from '../../consts';\nimport { type AllTabProps, type PublicTabProps } from '../../types';\n\nimport styles from './index.module.css';\n\nconst TabComponent = forwardRef<HTMLElement, AllTabProps>(\n    (\n        {\n            showIndicator,\n            indicatorProps,\n            label,\n            icon,\n            id,\n            selected,\n            onChange,\n            onClick,\n            tabClassNames = {},\n            dataTestId,\n            className,\n            labelClassName,\n            selectedClassName,\n            iconClassName,\n            href,\n            Component = href ? 'a' : 'button',\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        const handleClick: MouseEventHandler<HTMLElement> = (event) => {\n            onChange?.(id);\n            onClick?.(event);\n        };\n\n        const {\n            className: commonClassName,\n            labelClassName: commonLabelClassName,\n            selectedClassName: commonSelectedClassName,\n            iconClassName: commonIconClassName,\n        } = tabClassNames;\n\n        return (\n            <Component\n                data-test-id={dataTestId}\n                tabIndex={0}\n                {...(Component === 'button' ? { type: 'button' } : null)}\n                {...restProps}\n                href={href}\n                id={id}\n                ref={ref}\n                className={cn(\n                    styles.component,\n                    commonClassName,\n                    className,\n                    selected && commonSelectedClassName,\n                    selected && selectedClassName,\n                    {\n                        [styles[accentColor]]: selected,\n                    },\n                )}\n                onClick={handleClick}\n            >\n                <div className={cn(styles.icon, commonIconClassName, iconClassName)}>\n                    {isValidElement<{ selected: unknown }>(icon)\n                        ? cloneElement(icon, { selected })\n                        : icon}\n                </div>\n\n                <TypographyText\n                    weight='medium'\n                    view='secondary-small'\n                    className={cn(styles.label, commonLabelClassName, labelClassName, {\n                        [styles.labelSelected]: selected,\n                    })}\n                >\n                    {isValidElement<{ selected: unknown }>(label)\n                        ? cloneElement(label, { selected })\n                        : label}\n                </TypographyText>\n\n                {showIndicator && (\n                    <div className={styles.indicator}>\n                        <Indicator\n                            {...indicatorProps}\n                            height={indicatorProps?.value ? 16 : undefined}\n                            border={{\n                                width: 2,\n                                color: INDICATOR_BORDER_COLOR[bgColor],\n                            }}\n                            backgroundColor={INDICATOR_BG_COLOR[accentColor]}\n                        />\n                    </div>\n                )}\n            </Component>\n        );\n    },\n);\n\nexport const Tab = TabComponent as ForwardRefExoticComponent<\n    PublicTabProps & RefAttributes<HTMLElement>\n>;\n"],"names":["forwardRef","__rest","React","__assign","cn","styles","isValidElement","cloneElement","TypographyText","Indicator","INDICATOR_BORDER_COLOR","INDICATOR_BG_COLOR"],"mappings":"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"}

package/components/tab/index.css

@@ -14,7 +14,7 @@
     --gap-4: var(--gap-2xs);
     --gap-8: var(--gap-xs);
 }
-.tab-bar__component_1318s {
+.tab-bar__component_1gp7j {
     -webkit-tap-highlight-color: transparent;
     box-sizing: border-box;
     background-color: transparent;
@@ -42,20 +42,20 @@
     padding: var(--gap-8) var(--gap-0);
     color: var(--color-light-neutral-translucent-700);
 }
-.tab-bar__primary_1318s {
+.tab-bar__primary_1gp7j {
     color: var(--color-light-accent-primary);
 }
-.tab-bar__secondary_1318s {
+.tab-bar__secondary_1gp7j {
     color: var(--color-light-accent-secondary);
 }
-.tab-bar__icon_1318s {
+.tab-bar__icon_1gp7j {
     display: flex;
     align-items: center;
     justify-content: center;
     flex-grow: 1;
     width: 100%;
 }
-.tab-bar__label_1318s {
+.tab-bar__label_1gp7j {
     -webkit-line-clamp: 1;
     display: -webkit-box;
     -webkit-box-orient: vertical;
@@ -65,10 +65,10 @@
 
     color: var(--color-light-text-secondary);
 }
-.tab-bar__labelSelected_1318s {
+.tab-bar__labelSelected_1gp7j {
     color: inherit;
 }
-.tab-bar__indicator_1318s {
+.tab-bar__indicator_1gp7j {
     position: absolute;
     top: 3px;
     left: calc(50% + var(--gap-4));

package/components/tab/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"component":"tab-bar__component_1318s","primary":"tab-bar__primary_1318s","secondary":"tab-bar__secondary_1318s","icon":"tab-bar__icon_1318s","label":"tab-bar__label_1318s","labelSelected":"tab-bar__labelSelected_1318s","indicator":"tab-bar__indicator_1318s"};
+var styles = {"component":"tab-bar__component_1gp7j","primary":"tab-bar__primary_1gp7j","secondary":"tab-bar__secondary_1gp7j","icon":"tab-bar__icon_1gp7j","label":"tab-bar__label_1gp7j","labelSelected":"tab-bar__labelSelected_1gp7j","indicator":"tab-bar__indicator_1gp7j"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/components/tab/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../src/components/tab/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n\n.component {\n    @mixin button-reset;\n\n    position: relative;\n    display: inline-flex;\n    flex-direction: column;\n    flex: 1 0 0;\n    align-items: center;\n    padding: var(--gap-8) var(--gap-0);\n    color: var(--color-light-neutral-translucent-700);\n}\n\n.primary {\n    color: var(--color-light-accent-primary);\n}\n\n.secondary {\n    color: var(--color-light-accent-secondary);\n}\n\n.icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-grow: 1;\n    width: 100%;\n}\n\n.label {\n    @mixin row_limit 1;\n    word-break: break-all;\n    flex-shrink: 0;\n\n    color: var(--color-light-text-secondary);\n}\n\n.labelSelected {\n    color: inherit;\n}\n\n.indicator {\n    position: absolute;\n    top: 3px;\n    left: calc(50% + var(--gap-4));\n    height: 16px;\n    min-width: 16px;\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,SAAS,CAAC,wBAAwB,CAAC,WAAW,CAAC,0BAA0B,CAAC,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,sBAAsB,CAAC,eAAe,CAAC,8BAA8B,CAAC,WAAW,CAAC,0BAA0B,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/tab/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.component {\n    @mixin button-reset;\n\n    position: relative;\n    display: inline-flex;\n    flex-direction: column;\n    flex: 1 0 0;\n    align-items: center;\n    padding: var(--gap-8) var(--gap-0);\n    color: var(--color-light-neutral-translucent-700);\n}\n\n.primary {\n    color: var(--color-light-accent-primary);\n}\n\n.secondary {\n    color: var(--color-light-accent-secondary);\n}\n\n.icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-grow: 1;\n    width: 100%;\n}\n\n.label {\n    @mixin row_limit 1;\n    word-break: break-all;\n    flex-shrink: 0;\n\n    color: var(--color-light-text-secondary);\n}\n\n.labelSelected {\n    color: inherit;\n}\n\n.indicator {\n    position: absolute;\n    top: 3px;\n    left: calc(50% + var(--gap-4));\n    height: 16px;\n    min-width: 16px;\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,SAAS,CAAC,wBAAwB,CAAC,WAAW,CAAC,0BAA0B,CAAC,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,sBAAsB,CAAC,eAAe,CAAC,8BAA8B,CAAC,WAAW,CAAC,0BAA0B,CAAC;;;;"}

package/cssm/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["import React, { Children, cloneElement, forwardRef } from 'react';\nimport cn from 'classnames';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { Tab } from './components/tab';\nimport { type TabBarProps } from './types';\n\nimport styles from './index.module.css';\n\nconst TabBarComponent = forwardRef<HTMLDivElement, TabBarProps>(\n    (\n        {\n            children,\n            className,\n            selectedId,\n            border,\n            dataTestId,\n            tabClassNames,\n            onChange,\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        if (Children.count(children) > 5) {\n            // eslint-disable-next-line no-console\n            console.error('Компонент TabBar не может содержать больше 5 табов');\n        }\n\n        return (\n            <nav\n                data-test-id={dataTestId}\n                {...restProps}\n                ref={ref}\n                className={cn(styles.component, styles[bgColor], className, {\n                    [styles.border]: border,\n                })}\n            >\n                {Children.map(children, (tab) =>\n                    cloneElement(tab, {\n                        bgColor,\n                        accentColor,\n                        selected: tab.props.id === selectedId,\n                        onChange,\n                        tabClassNames,\n                        dataTestId: getDataTestId(dataTestId, 'tab'),\n                    }),\n                )}\n            </nav>\n        );\n    },\n);\n\nTabBarComponent.displayName = 'TabBarComponent';\n\nexport const TabBar = Object.assign(TabBarComponent, { Tab });\n"],"names":["forwardRef","__rest","Children","React","cn","styles","cloneElement","getDataTestId","Tab"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAM,eAAe,GAAGA,gBAAU,CAC9B,UACI,EAWC,EACD,GAAG,EAAA;;AAXC,IAAA,IAAA,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,MAAM,YAAA,EACN,UAAU,gBAAA,EACV,aAAa,mBAAA,EACb,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,mBAAuB,EAAvB,WAAW,GAAG,EAAA,KAAA,MAAA,GAAA,SAAS,KAAA,EACvB,EAAA,GAAA,EAAA,CAAA,OAA4B,EAA5B,OAAO,mBAAG,kBAAkB,GAAA,EAAA,EACzB,SAAS,GAAAC,YAAA,CAAA,EAAA,EAVhB,sHAWC,CADe;IAIhB,IAAIC,cAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;;AAE9B,QAAA,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC;AACtE;IAED,QACIC,6EACkB,UAAU,EAAA,EACpB,SAAS,EACb,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAEC,mBAAE,CAACC,uBAAM,CAAC,SAAS,EAAEA,uBAAM,CAAC,OAAO,CAAC,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACtD,YAAA,EAAA,CAACA,uBAAM,CAAC,MAAM,CAAA,GAAG,MAAM;AACzB,YAAA,EAAA,EAAA,EAAA,CAAA,EAEDH,cAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAC,GAAG,EAAA;QACxB,OAAAI,kBAAY,CAAC,GAAG,EAAE;AACd,YAAA,OAAO,EAAA,OAAA;AACP,YAAA,WAAW,EAAA,WAAA;AACX,YAAA,QAAQ,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE,KAAK,UAAU;AACrC,YAAA,QAAQ,EAAA,QAAA;AACR,YAAA,aAAa,EAAA,aAAA;AACb,YAAA,UAAU,EAAEC,kBAAa,CAAC,UAAU,EAAE,KAAK,CAAC;SAC/C,CAAC;KAAA,CACL,CACC;AAEd,CAAC,CACJ;AAED,eAAe,CAAC,WAAW,GAAG,iBAAiB;AAExC,IAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE,EAAE,GAAG,EAAAC,aAAA,EAAE;;;;"}
+{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["import React, { Children, cloneElement, forwardRef } from 'react';\nimport cn from 'classnames';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { Tab } from './components/tab';\nimport { type TabBarProps } from './types';\n\nimport styles from './index.module.css';\n\nconst TabBarComponent = forwardRef<HTMLDivElement, TabBarProps>(\n    (\n        {\n            children,\n            className,\n            selectedId,\n            border,\n            dataTestId,\n            tabClassNames,\n            onChange,\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        if (Children.count(children) > 5) {\n            // eslint-disable-next-line no-console\n            console.error('Компонент TabBar не может содержать больше 5 табов');\n        }\n\n        return (\n            <nav\n                data-test-id={dataTestId}\n                {...restProps}\n                ref={ref}\n                className={cn(styles.component, styles[bgColor], className, {\n                    [styles.border]: border,\n                })}\n            >\n                {Children.map(children, (tab) =>\n                    cloneElement(tab, {\n                        bgColor,\n                        accentColor,\n                        selected: tab.props.id === selectedId,\n                        onChange,\n                        tabClassNames,\n                        dataTestId: getDataTestId(dataTestId, 'tab'),\n                    }),\n                )}\n            </nav>\n        );\n    },\n);\n\nTabBarComponent.displayName = 'TabBarComponent';\n\nexport const TabBar = Object.assign(TabBarComponent, { Tab });\n"],"names":["forwardRef","__rest","Children","React","cn","styles","cloneElement","getDataTestId","Tab"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAM,eAAe,GAAGA,gBAAU,CAC9B,UACI,EAWC,EACD,GAAG,EAAA;;AAXC,IAAA,IAAA,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,MAAM,YAAA,EACN,UAAU,gBAAA,EACV,aAAa,mBAAA,EACb,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,mBAAuB,EAAvB,WAAW,GAAG,EAAA,KAAA,MAAA,GAAA,SAAS,KAAA,EACvB,EAAA,GAAA,EAAA,CAAA,OAA4B,EAA5B,OAAO,mBAAG,kBAAkB,GAAA,EAAA,EACzB,SAAS,GAAAC,YAAA,CAAA,EAAA,EAVhB,sHAWC,CADe;IAIhB,IAAIC,cAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;;AAE9B,QAAA,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC;;IAGvE,QACIC,6EACkB,UAAU,EAAA,EACpB,SAAS,EACb,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAEC,mBAAE,CAACC,uBAAM,CAAC,SAAS,EAAEA,uBAAM,CAAC,OAAO,CAAC,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACtD,YAAA,EAAA,CAACA,uBAAM,CAAC,MAAM,CAAA,GAAG,MAAM;AACzB,YAAA,EAAA,EAAA,EAAA,CAAA,EAEDH,cAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAC,GAAG,EAAA;QACxB,OAAAI,kBAAY,CAAC,GAAG,EAAE;AACd,YAAA,OAAO,EAAA,OAAA;AACP,YAAA,WAAW,EAAA,WAAA;AACX,YAAA,QAAQ,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE,KAAK,UAAU;AACrC,YAAA,QAAQ,EAAA,QAAA;AACR,YAAA,aAAa,EAAA,aAAA;AACb,YAAA,UAAU,EAAEC,kBAAa,CAAC,UAAU,EAAE,KAAK,CAAC;SAC/C,CAAC;KAAA,CACL,CACC;AAEd,CAAC,CACJ;AAED,eAAe,CAAC,WAAW,GAAG,iBAAiB;AAExC,IAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE,EAAE,GAAG,EAAAC,aAAA,EAAE;;;;"}

package/cssm/components/tab/Component.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
+import { type ForwardRefExoticComponent, type RefAttributes } from 'react';
 import { type PublicTabProps } from '../../types';
-export declare const Tab: React.ForwardRefExoticComponent<PublicTabProps & React.RefAttributes<HTMLElement>>;
+export declare const Tab: ForwardRefExoticComponent<PublicTabProps & RefAttributes<HTMLElement>>;

package/cssm/components/tab/Component.js

@@ -27,10 +27,14 @@ var TabComponent = React.forwardRef(function (_a, ref) {
     return (React__default.default.createElement(Component, tslib.__assign({ "data-test-id": dataTestId, tabIndex: 0 }, (Component === 'button' ? { type: 'button' } : null), restProps, { href: href, id: id, ref: ref, className: cn__default.default(styles__default.default.component, commonClassName, className, selected && commonSelectedClassName, selected && selectedClassName, (_b = {},
             _b[styles__default.default[accentColor]] = selected,
             _b)), onClick: handleClick }),
-        React__default.default.createElement("div", { className: cn__default.default(styles__default.default.icon, commonIconClassName, iconClassName) }, React.isValidElement(icon) ? React.cloneElement(icon, { selected: selected }) : icon),
+        React__default.default.createElement("div", { className: cn__default.default(styles__default.default.icon, commonIconClassName, iconClassName) }, React.isValidElement(icon)
+            ? React.cloneElement(icon, { selected: selected })
+            : icon),
         React__default.default.createElement(cssm.TypographyText, { weight: 'medium', view: 'secondary-small', className: cn__default.default(styles__default.default.label, commonLabelClassName, labelClassName, (_c = {},
                 _c[styles__default.default.labelSelected] = selected,
-                _c)) }, React.isValidElement(label) ? React.cloneElement(label, { selected: selected }) : label),
+                _c)) }, React.isValidElement(label)
+            ? React.cloneElement(label, { selected: selected })
+            : label),
         showIndicator && (React__default.default.createElement("div", { className: styles__default.default.indicator },
             React__default.default.createElement(cssm$1.Indicator, tslib.__assign({}, indicatorProps, { height: (indicatorProps === null || indicatorProps === void 0 ? void 0 : indicatorProps.value) ? 16 : undefined, border: {
                     width: 2,

package/cssm/components/tab/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../../src/components/tab/Component.tsx"],"sourcesContent":["import React, {\n    cloneElement,\n    forwardRef,\n    type ForwardRefExoticComponent,\n    isValidElement,\n    type MouseEventHandler,\n    type RefAttributes,\n} from 'react';\nimport cn from 'classnames';\n\nimport { Indicator } from '@alfalab/core-components-indicator';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { INDICATOR_BG_COLOR, INDICATOR_BORDER_COLOR } from '../../consts';\nimport { type AllTabProps, type PublicTabProps } from '../../types';\n\nimport styles from './index.module.css';\n\nconst TabComponent = forwardRef<HTMLElement, AllTabProps>(\n    (\n        {\n            showIndicator,\n            indicatorProps,\n            label,\n            icon,\n            id,\n            selected,\n            onChange,\n            onClick,\n            tabClassNames = {},\n            dataTestId,\n            className,\n            labelClassName,\n            selectedClassName,\n            iconClassName,\n            href,\n            Component = href ? 'a' : 'button',\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        const handleClick: MouseEventHandler<HTMLElement> = (event) => {\n            onChange?.(id);\n            onClick?.(event);\n        };\n\n        const {\n            className: commonClassName,\n            labelClassName: commonLabelClassName,\n            selectedClassName: commonSelectedClassName,\n            iconClassName: commonIconClassName,\n        } = tabClassNames;\n\n        return (\n            <Component\n                data-test-id={dataTestId}\n                tabIndex={0}\n                {...(Component === 'button' ? { type: 'button' } : null)}\n                {...restProps}\n                href={href}\n                id={id}\n                ref={ref}\n                className={cn(\n                    styles.component,\n                    commonClassName,\n                    className,\n                    selected && commonSelectedClassName,\n                    selected && selectedClassName,\n                    {\n                        [styles[accentColor]]: selected,\n                    },\n                )}\n                onClick={handleClick}\n            >\n                <div className={cn(styles.icon, commonIconClassName, iconClassName)}>\n                    {isValidElement(icon) ? cloneElement(icon, { selected }) : icon}\n                </div>\n\n                <TypographyText\n                    weight='medium'\n                    view='secondary-small'\n                    className={cn(styles.label, commonLabelClassName, labelClassName, {\n                        [styles.labelSelected]: selected,\n                    })}\n                >\n                    {isValidElement(label) ? cloneElement(label, { selected }) : label}\n                </TypographyText>\n\n                {showIndicator && (\n                    <div className={styles.indicator}>\n                        <Indicator\n                            {...indicatorProps}\n                            height={indicatorProps?.value ? 16 : undefined}\n                            border={{\n                                width: 2,\n                                color: INDICATOR_BORDER_COLOR[bgColor],\n                            }}\n                            backgroundColor={INDICATOR_BG_COLOR[accentColor]}\n                        />\n                    </div>\n                )}\n            </Component>\n        );\n    },\n);\n\nexport const Tab = TabComponent as ForwardRefExoticComponent<\n    PublicTabProps & RefAttributes<HTMLElement>\n>;\n"],"names":["forwardRef","__rest","React","__assign","cn","styles","isValidElement","cloneElement","TypographyText","Indicator","INDICATOR_BORDER_COLOR","INDICATOR_BG_COLOR"],"mappings":"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"}
+{"version":3,"file":"Component.js","sources":["../../../src/components/tab/Component.tsx"],"sourcesContent":["import React, {\n    cloneElement,\n    forwardRef,\n    type ForwardRefExoticComponent,\n    isValidElement,\n    type MouseEventHandler,\n    type RefAttributes,\n} from 'react';\nimport cn from 'classnames';\n\nimport { Indicator } from '@alfalab/core-components-indicator';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { INDICATOR_BG_COLOR, INDICATOR_BORDER_COLOR } from '../../consts';\nimport { type AllTabProps, type PublicTabProps } from '../../types';\n\nimport styles from './index.module.css';\n\nconst TabComponent = forwardRef<HTMLElement, AllTabProps>(\n    (\n        {\n            showIndicator,\n            indicatorProps,\n            label,\n            icon,\n            id,\n            selected,\n            onChange,\n            onClick,\n            tabClassNames = {},\n            dataTestId,\n            className,\n            labelClassName,\n            selectedClassName,\n            iconClassName,\n            href,\n            Component = href ? 'a' : 'button',\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        const handleClick: MouseEventHandler<HTMLElement> = (event) => {\n            onChange?.(id);\n            onClick?.(event);\n        };\n\n        const {\n            className: commonClassName,\n            labelClassName: commonLabelClassName,\n            selectedClassName: commonSelectedClassName,\n            iconClassName: commonIconClassName,\n        } = tabClassNames;\n\n        return (\n            <Component\n                data-test-id={dataTestId}\n                tabIndex={0}\n                {...(Component === 'button' ? { type: 'button' } : null)}\n                {...restProps}\n                href={href}\n                id={id}\n                ref={ref}\n                className={cn(\n                    styles.component,\n                    commonClassName,\n                    className,\n                    selected && commonSelectedClassName,\n                    selected && selectedClassName,\n                    {\n                        [styles[accentColor]]: selected,\n                    },\n                )}\n                onClick={handleClick}\n            >\n                <div className={cn(styles.icon, commonIconClassName, iconClassName)}>\n                    {isValidElement<{ selected: unknown }>(icon)\n                        ? cloneElement(icon, { selected })\n                        : icon}\n                </div>\n\n                <TypographyText\n                    weight='medium'\n                    view='secondary-small'\n                    className={cn(styles.label, commonLabelClassName, labelClassName, {\n                        [styles.labelSelected]: selected,\n                    })}\n                >\n                    {isValidElement<{ selected: unknown }>(label)\n                        ? cloneElement(label, { selected })\n                        : label}\n                </TypographyText>\n\n                {showIndicator && (\n                    <div className={styles.indicator}>\n                        <Indicator\n                            {...indicatorProps}\n                            height={indicatorProps?.value ? 16 : undefined}\n                            border={{\n                                width: 2,\n                                color: INDICATOR_BORDER_COLOR[bgColor],\n                            }}\n                            backgroundColor={INDICATOR_BG_COLOR[accentColor]}\n                        />\n                    </div>\n                )}\n            </Component>\n        );\n    },\n);\n\nexport const Tab = TabComponent as ForwardRefExoticComponent<\n    PublicTabProps & RefAttributes<HTMLElement>\n>;\n"],"names":["forwardRef","__rest","React","__assign","cn","styles","isValidElement","cloneElement","TypographyText","Indicator","INDICATOR_BORDER_COLOR","INDICATOR_BG_COLOR"],"mappings":";;;;;;;;;;;;;;;;;;AAkBA,IAAM,YAAY,GAAGA,gBAAU,CAC3B,UACI,EAoBC,EACD,GAAG,EAAA;;AApBC,IAAA,IAAA,aAAa,GAAA,EAAA,CAAA,aAAA,EACb,cAAc,GAAA,EAAA,CAAA,cAAA,EACd,KAAK,GAAA,EAAA,CAAA,KAAA,EACL,IAAI,UAAA,EACJ,EAAE,QAAA,EACF,QAAQ,cAAA,EACR,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,OAAO,GAAA,EAAA,CAAA,OAAA,EACP,EAAkB,GAAA,EAAA,CAAA,aAAA,EAAlB,aAAa,GAAG,EAAA,KAAA,MAAA,GAAA,EAAE,GAAA,EAAA,EAClB,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,cAAc,GAAA,EAAA,CAAA,cAAA,EACd,iBAAiB,GAAA,EAAA,CAAA,iBAAA,EACjB,aAAa,GAAA,EAAA,CAAA,aAAA,EACb,IAAI,UAAA,EACJ,EAAA,GAAA,EAAA,CAAA,SAAiC,EAAjC,SAAS,mBAAG,IAAI,GAAG,GAAG,GAAG,QAAQ,GAAA,EAAA,EACjC,EAAuB,GAAA,EAAA,CAAA,WAAA,EAAvB,WAAW,GAAG,EAAA,KAAA,MAAA,GAAA,SAAS,KAAA,EACvB,EAAA,GAAA,EAAA,CAAA,OAA4B,EAA5B,OAAO,mBAAG,kBAAkB,GAAA,EAAA,EACzB,SAAS,GAAAC,YAAA,CAAA,EAAA,EAnBhB,gPAoBC,CADe;IAIhB,IAAM,WAAW,GAAmC,UAAC,KAAK,EAAA;AACtD,QAAA,QAAQ,aAAR,QAAQ,KAAA,MAAA,GAAA,MAAA,GAAR,QAAQ,CAAG,EAAE,CAAC;AACd,QAAA,OAAO,aAAP,OAAO,KAAA,MAAA,GAAA,MAAA,GAAP,OAAO,CAAG,KAAK,CAAC;AACpB,KAAC;AAGG,IAAA,IAAW,eAAe,GAI1B,aAAa,UAJa,EACV,oBAAoB,GAGpC,aAAa,CAAA,cAHuB,EACjB,uBAAuB,GAE1C,aAAa,CAF6B,iBAAA,EAC3B,mBAAmB,GAClC,aAAa,cADqB;AAGtC,IAAA,QACIC,sBAAA,CAAA,aAAA,CAAC,SAAS,EAAAC,cAAA,CAAA,EAAA,cAAA,EACQ,UAAU,EACxB,QAAQ,EAAE,CAAC,EAAA,GACN,SAAS,KAAK,QAAQ,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,GACnD,SAAS,EAAA,EACb,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,SAAS,EAAEC,mBAAE,CACTC,uBAAM,CAAC,SAAS,EAChB,eAAe,EACf,SAAS,EACT,QAAQ,IAAI,uBAAuB,EACnC,QAAQ,IAAI,iBAAiB,GAAA,EAAA,GAAA,EAAA;AAEzB,YAAA,EAAA,CAACA,uBAAM,CAAC,WAAW,CAAC,IAAG,QAAQ;gBAEtC,EACD,OAAO,EAAE,WAAW,EAAA,CAAA;AAEpB,QAAAH,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEE,mBAAE,CAACC,uBAAM,CAAC,IAAI,EAAE,mBAAmB,EAAE,aAAa,CAAC,EAAA,EAC9DC,oBAAc,CAAwB,IAAI;cACrCC,kBAAY,CAAC,IAAI,EAAE,EAAE,QAAQ,EAAA,QAAA,EAAE;cAC/B,IAAI,CACR;QAENL,sBAAC,CAAA,aAAA,CAAAM,mBAAc,IACX,MAAM,EAAC,QAAQ,EACf,IAAI,EAAC,iBAAiB,EACtB,SAAS,EAAEJ,mBAAE,CAACC,uBAAM,CAAC,KAAK,EAAE,oBAAoB,EAAE,cAAc,GAAA,EAAA,GAAA,EAAA;AAC5D,gBAAA,EAAA,CAACA,uBAAM,CAAC,aAAa,CAAA,GAAG,QAAQ;oBAClC,EAED,EAAAC,oBAAc,CAAwB,KAAK;cACtCC,kBAAY,CAAC,KAAK,EAAE,EAAE,QAAQ,EAAA,QAAA,EAAE;cAChC,KAAK,CACE;AAEhB,QAAA,aAAa,KACVL,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEG,uBAAM,CAAC,SAAS,EAAA;YAC5BH,sBAAC,CAAA,aAAA,CAAAO,gBAAS,EACFN,cAAA,CAAA,EAAA,EAAA,cAAc,EAClB,EAAA,MAAM,EAAE,CAAA,cAAc,KAAd,IAAA,IAAA,cAAc,KAAd,MAAA,GAAA,MAAA,GAAA,cAAc,CAAE,KAAK,IAAG,EAAE,GAAG,SAAS,EAC9C,MAAM,EAAE;AACJ,oBAAA,KAAK,EAAE,CAAC;AACR,oBAAA,KAAK,EAAEO,6BAAsB,CAAC,OAAO,CAAC;iBACzC,EACD,eAAe,EAAEC,yBAAkB,CAAC,WAAW,CAAC,EAAA,CAAA,CAClD,CACA,CACT,CACO;AAEpB,CAAC,CACJ;AAEM,IAAM,GAAG,GAAG;;;;"}

package/cssm/types.d.ts

@@ -1,7 +1,7 @@
 import { type AllHTMLAttributes, type ElementType, type ForwardRefExoticComponent, type HTMLAttributes, type ReactElement, type ReactNode, type RefAttributes } from 'react';
 import { type IndicatorProps } from '@alfalab/core-components-indicator/cssm';
-export declare type AllTabProps = PublicTabProps & PrivateTabProps;
-declare type TabElementType = ReactElement<AllTabProps, ForwardRefExoticComponent<AllTabProps & RefAttributes<HTMLElement>>>;
+export type AllTabProps = PublicTabProps & PrivateTabProps;
+type TabElementType = ReactElement<AllTabProps, ForwardRefExoticComponent<AllTabProps & RefAttributes<HTMLElement>>>;
 export interface TabBarProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
     /**
      * Дополнительный класс

package/esm/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["import React, { Children, cloneElement, forwardRef } from 'react';\nimport cn from 'classnames';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { Tab } from './components/tab';\nimport { type TabBarProps } from './types';\n\nimport styles from './index.module.css';\n\nconst TabBarComponent = forwardRef<HTMLDivElement, TabBarProps>(\n    (\n        {\n            children,\n            className,\n            selectedId,\n            border,\n            dataTestId,\n            tabClassNames,\n            onChange,\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        if (Children.count(children) > 5) {\n            // eslint-disable-next-line no-console\n            console.error('Компонент TabBar не может содержать больше 5 табов');\n        }\n\n        return (\n            <nav\n                data-test-id={dataTestId}\n                {...restProps}\n                ref={ref}\n                className={cn(styles.component, styles[bgColor], className, {\n                    [styles.border]: border,\n                })}\n            >\n                {Children.map(children, (tab) =>\n                    cloneElement(tab, {\n                        bgColor,\n                        accentColor,\n                        selected: tab.props.id === selectedId,\n                        onChange,\n                        tabClassNames,\n                        dataTestId: getDataTestId(dataTestId, 'tab'),\n                    }),\n                )}\n            </nav>\n        );\n    },\n);\n\nTabBarComponent.displayName = 'TabBarComponent';\n\nexport const TabBar = Object.assign(TabBarComponent, { Tab });\n"],"names":[],"mappings":";;;;;;;AAUA,IAAM,eAAe,GAAG,UAAU,CAC9B,UACI,EAWC,EACD,GAAG,EAAA;;AAXC,IAAA,IAAA,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,MAAM,YAAA,EACN,UAAU,gBAAA,EACV,aAAa,mBAAA,EACb,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,mBAAuB,EAAvB,WAAW,GAAG,EAAA,KAAA,MAAA,GAAA,SAAS,KAAA,EACvB,EAAA,GAAA,EAAA,CAAA,OAA4B,EAA5B,OAAO,mBAAG,kBAAkB,GAAA,EAAA,EACzB,SAAS,GAAA,MAAA,CAAA,EAAA,EAVhB,sHAWC,CADe;IAIhB,IAAI,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;;AAE9B,QAAA,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC;AACtE;IAED,QACI,sDACkB,UAAU,EAAA,EACpB,SAAS,EACb,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACtD,YAAA,EAAA,CAAC,MAAM,CAAC,MAAM,CAAA,GAAG,MAAM;AACzB,YAAA,EAAA,EAAA,EAAA,CAAA,EAED,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAC,GAAG,EAAA;QACxB,OAAA,YAAY,CAAC,GAAG,EAAE;AACd,YAAA,OAAO,EAAA,OAAA;AACP,YAAA,WAAW,EAAA,WAAA;AACX,YAAA,QAAQ,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE,KAAK,UAAU;AACrC,YAAA,QAAQ,EAAA,QAAA;AACR,YAAA,aAAa,EAAA,aAAA;AACb,YAAA,UAAU,EAAE,aAAa,CAAC,UAAU,EAAE,KAAK,CAAC;SAC/C,CAAC;KAAA,CACL,CACC;AAEd,CAAC,CACJ;AAED,eAAe,CAAC,WAAW,GAAG,iBAAiB;AAExC,IAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE,EAAE,GAAG,EAAA,GAAA,EAAE;;;;"}
+{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["import React, { Children, cloneElement, forwardRef } from 'react';\nimport cn from 'classnames';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { Tab } from './components/tab';\nimport { type TabBarProps } from './types';\n\nimport styles from './index.module.css';\n\nconst TabBarComponent = forwardRef<HTMLDivElement, TabBarProps>(\n    (\n        {\n            children,\n            className,\n            selectedId,\n            border,\n            dataTestId,\n            tabClassNames,\n            onChange,\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        if (Children.count(children) > 5) {\n            // eslint-disable-next-line no-console\n            console.error('Компонент TabBar не может содержать больше 5 табов');\n        }\n\n        return (\n            <nav\n                data-test-id={dataTestId}\n                {...restProps}\n                ref={ref}\n                className={cn(styles.component, styles[bgColor], className, {\n                    [styles.border]: border,\n                })}\n            >\n                {Children.map(children, (tab) =>\n                    cloneElement(tab, {\n                        bgColor,\n                        accentColor,\n                        selected: tab.props.id === selectedId,\n                        onChange,\n                        tabClassNames,\n                        dataTestId: getDataTestId(dataTestId, 'tab'),\n                    }),\n                )}\n            </nav>\n        );\n    },\n);\n\nTabBarComponent.displayName = 'TabBarComponent';\n\nexport const TabBar = Object.assign(TabBarComponent, { Tab });\n"],"names":[],"mappings":";;;;;;;AAUA,IAAM,eAAe,GAAG,UAAU,CAC9B,UACI,EAWC,EACD,GAAG,EAAA;;AAXC,IAAA,IAAA,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,MAAM,YAAA,EACN,UAAU,gBAAA,EACV,aAAa,mBAAA,EACb,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,mBAAuB,EAAvB,WAAW,GAAG,EAAA,KAAA,MAAA,GAAA,SAAS,KAAA,EACvB,EAAA,GAAA,EAAA,CAAA,OAA4B,EAA5B,OAAO,mBAAG,kBAAkB,GAAA,EAAA,EACzB,SAAS,GAAA,MAAA,CAAA,EAAA,EAVhB,sHAWC,CADe;IAIhB,IAAI,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;;AAE9B,QAAA,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC;;IAGvE,QACI,sDACkB,UAAU,EAAA,EACpB,SAAS,EACb,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACtD,YAAA,EAAA,CAAC,MAAM,CAAC,MAAM,CAAA,GAAG,MAAM;AACzB,YAAA,EAAA,EAAA,EAAA,CAAA,EAED,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAC,GAAG,EAAA;QACxB,OAAA,YAAY,CAAC,GAAG,EAAE;AACd,YAAA,OAAO,EAAA,OAAA;AACP,YAAA,WAAW,EAAA,WAAA;AACX,YAAA,QAAQ,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE,KAAK,UAAU;AACrC,YAAA,QAAQ,EAAA,QAAA;AACR,YAAA,aAAa,EAAA,aAAA;AACb,YAAA,UAAU,EAAE,aAAa,CAAC,UAAU,EAAE,KAAK,CAAC;SAC/C,CAAC;KAAA,CACL,CACC;AAEd,CAAC,CACJ;AAED,eAAe,CAAC,WAAW,GAAG,iBAAiB;AAExC,IAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE,EAAE,GAAG,EAAA,GAAA,EAAE;;;;"}

package/esm/components/tab/Component.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
+import { type ForwardRefExoticComponent, type RefAttributes } from 'react';
 import { type PublicTabProps } from '../../types';
-export declare const Tab: React.ForwardRefExoticComponent<PublicTabProps & React.RefAttributes<HTMLElement>>;
+export declare const Tab: ForwardRefExoticComponent<PublicTabProps & RefAttributes<HTMLElement>>;

package/esm/components/tab/Component.js

@@ -17,10 +17,14 @@ var TabComponent = forwardRef(function (_a, ref) {
     return (React.createElement(Component, __assign({ "data-test-id": dataTestId, tabIndex: 0 }, (Component === 'button' ? { type: 'button' } : null), restProps, { href: href, id: id, ref: ref, className: cn(styles.component, commonClassName, className, selected && commonSelectedClassName, selected && selectedClassName, (_b = {},
             _b[styles[accentColor]] = selected,
             _b)), onClick: handleClick }),
-        React.createElement("div", { className: cn(styles.icon, commonIconClassName, iconClassName) }, isValidElement(icon) ? cloneElement(icon, { selected: selected }) : icon),
+        React.createElement("div", { className: cn(styles.icon, commonIconClassName, iconClassName) }, isValidElement(icon)
+            ? cloneElement(icon, { selected: selected })
+            : icon),
         React.createElement(TypographyText, { weight: 'medium', view: 'secondary-small', className: cn(styles.label, commonLabelClassName, labelClassName, (_c = {},
                 _c[styles.labelSelected] = selected,
-                _c)) }, isValidElement(label) ? cloneElement(label, { selected: selected }) : label),
+                _c)) }, isValidElement(label)
+            ? cloneElement(label, { selected: selected })
+            : label),
         showIndicator && (React.createElement("div", { className: styles.indicator },
             React.createElement(Indicator, __assign({}, indicatorProps, { height: (indicatorProps === null || indicatorProps === void 0 ? void 0 : indicatorProps.value) ? 16 : undefined, border: {
                     width: 2,

package/esm/components/tab/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../../src/components/tab/Component.tsx"],"sourcesContent":["import React, {\n    cloneElement,\n    forwardRef,\n    type ForwardRefExoticComponent,\n    isValidElement,\n    type MouseEventHandler,\n    type RefAttributes,\n} from 'react';\nimport cn from 'classnames';\n\nimport { Indicator } from '@alfalab/core-components-indicator';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { INDICATOR_BG_COLOR, INDICATOR_BORDER_COLOR } from '../../consts';\nimport { type AllTabProps, type PublicTabProps } from '../../types';\n\nimport styles from './index.module.css';\n\nconst TabComponent = forwardRef<HTMLElement, AllTabProps>(\n    (\n        {\n            showIndicator,\n            indicatorProps,\n            label,\n            icon,\n            id,\n            selected,\n            onChange,\n            onClick,\n            tabClassNames = {},\n            dataTestId,\n            className,\n            labelClassName,\n            selectedClassName,\n            iconClassName,\n            href,\n            Component = href ? 'a' : 'button',\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        const handleClick: MouseEventHandler<HTMLElement> = (event) => {\n            onChange?.(id);\n            onClick?.(event);\n        };\n\n        const {\n            className: commonClassName,\n            labelClassName: commonLabelClassName,\n            selectedClassName: commonSelectedClassName,\n            iconClassName: commonIconClassName,\n        } = tabClassNames;\n\n        return (\n            <Component\n                data-test-id={dataTestId}\n                tabIndex={0}\n                {...(Component === 'button' ? { type: 'button' } : null)}\n                {...restProps}\n                href={href}\n                id={id}\n                ref={ref}\n                className={cn(\n                    styles.component,\n                    commonClassName,\n                    className,\n                    selected && commonSelectedClassName,\n                    selected && selectedClassName,\n                    {\n                        [styles[accentColor]]: selected,\n                    },\n                )}\n                onClick={handleClick}\n            >\n                <div className={cn(styles.icon, commonIconClassName, iconClassName)}>\n                    {isValidElement(icon) ? cloneElement(icon, { selected }) : icon}\n                </div>\n\n                <TypographyText\n                    weight='medium'\n                    view='secondary-small'\n                    className={cn(styles.label, commonLabelClassName, labelClassName, {\n                        [styles.labelSelected]: selected,\n                    })}\n                >\n                    {isValidElement(label) ? cloneElement(label, { selected }) : label}\n                </TypographyText>\n\n                {showIndicator && (\n                    <div className={styles.indicator}>\n                        <Indicator\n                            {...indicatorProps}\n                            height={indicatorProps?.value ? 16 : undefined}\n                            border={{\n                                width: 2,\n                                color: INDICATOR_BORDER_COLOR[bgColor],\n                            }}\n                            backgroundColor={INDICATOR_BG_COLOR[accentColor]}\n                        />\n                    </div>\n                )}\n            </Component>\n        );\n    },\n);\n\nexport const Tab = TabComponent as ForwardRefExoticComponent<\n    PublicTabProps & RefAttributes<HTMLElement>\n>;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Component.js","sources":["../../../src/components/tab/Component.tsx"],"sourcesContent":["import React, {\n    cloneElement,\n    forwardRef,\n    type ForwardRefExoticComponent,\n    isValidElement,\n    type MouseEventHandler,\n    type RefAttributes,\n} from 'react';\nimport cn from 'classnames';\n\nimport { Indicator } from '@alfalab/core-components-indicator';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { INDICATOR_BG_COLOR, INDICATOR_BORDER_COLOR } from '../../consts';\nimport { type AllTabProps, type PublicTabProps } from '../../types';\n\nimport styles from './index.module.css';\n\nconst TabComponent = forwardRef<HTMLElement, AllTabProps>(\n    (\n        {\n            showIndicator,\n            indicatorProps,\n            label,\n            icon,\n            id,\n            selected,\n            onChange,\n            onClick,\n            tabClassNames = {},\n            dataTestId,\n            className,\n            labelClassName,\n            selectedClassName,\n            iconClassName,\n            href,\n            Component = href ? 'a' : 'button',\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        const handleClick: MouseEventHandler<HTMLElement> = (event) => {\n            onChange?.(id);\n            onClick?.(event);\n        };\n\n        const {\n            className: commonClassName,\n            labelClassName: commonLabelClassName,\n            selectedClassName: commonSelectedClassName,\n            iconClassName: commonIconClassName,\n        } = tabClassNames;\n\n        return (\n            <Component\n                data-test-id={dataTestId}\n                tabIndex={0}\n                {...(Component === 'button' ? { type: 'button' } : null)}\n                {...restProps}\n                href={href}\n                id={id}\n                ref={ref}\n                className={cn(\n                    styles.component,\n                    commonClassName,\n                    className,\n                    selected && commonSelectedClassName,\n                    selected && selectedClassName,\n                    {\n                        [styles[accentColor]]: selected,\n                    },\n                )}\n                onClick={handleClick}\n            >\n                <div className={cn(styles.icon, commonIconClassName, iconClassName)}>\n                    {isValidElement<{ selected: unknown }>(icon)\n                        ? cloneElement(icon, { selected })\n                        : icon}\n                </div>\n\n                <TypographyText\n                    weight='medium'\n                    view='secondary-small'\n                    className={cn(styles.label, commonLabelClassName, labelClassName, {\n                        [styles.labelSelected]: selected,\n                    })}\n                >\n                    {isValidElement<{ selected: unknown }>(label)\n                        ? cloneElement(label, { selected })\n                        : label}\n                </TypographyText>\n\n                {showIndicator && (\n                    <div className={styles.indicator}>\n                        <Indicator\n                            {...indicatorProps}\n                            height={indicatorProps?.value ? 16 : undefined}\n                            border={{\n                                width: 2,\n                                color: INDICATOR_BORDER_COLOR[bgColor],\n                            }}\n                            backgroundColor={INDICATOR_BG_COLOR[accentColor]}\n                        />\n                    </div>\n                )}\n            </Component>\n        );\n    },\n);\n\nexport const Tab = TabComponent as ForwardRefExoticComponent<\n    PublicTabProps & RefAttributes<HTMLElement>\n>;\n"],"names":[],"mappings":";;;;;;;;AAkBA,IAAM,YAAY,GAAG,UAAU,CAC3B,UACI,EAoBC,EACD,GAAG,EAAA;;AApBC,IAAA,IAAA,aAAa,GAAA,EAAA,CAAA,aAAA,EACb,cAAc,GAAA,EAAA,CAAA,cAAA,EACd,KAAK,GAAA,EAAA,CAAA,KAAA,EACL,IAAI,UAAA,EACJ,EAAE,QAAA,EACF,QAAQ,cAAA,EACR,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,OAAO,GAAA,EAAA,CAAA,OAAA,EACP,EAAkB,GAAA,EAAA,CAAA,aAAA,EAAlB,aAAa,GAAG,EAAA,KAAA,MAAA,GAAA,EAAE,GAAA,EAAA,EAClB,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,cAAc,GAAA,EAAA,CAAA,cAAA,EACd,iBAAiB,GAAA,EAAA,CAAA,iBAAA,EACjB,aAAa,GAAA,EAAA,CAAA,aAAA,EACb,IAAI,UAAA,EACJ,EAAA,GAAA,EAAA,CAAA,SAAiC,EAAjC,SAAS,mBAAG,IAAI,GAAG,GAAG,GAAG,QAAQ,GAAA,EAAA,EACjC,EAAuB,GAAA,EAAA,CAAA,WAAA,EAAvB,WAAW,GAAG,EAAA,KAAA,MAAA,GAAA,SAAS,KAAA,EACvB,EAAA,GAAA,EAAA,CAAA,OAA4B,EAA5B,OAAO,mBAAG,kBAAkB,GAAA,EAAA,EACzB,SAAS,GAAA,MAAA,CAAA,EAAA,EAnBhB,gPAoBC,CADe;IAIhB,IAAM,WAAW,GAAmC,UAAC,KAAK,EAAA;AACtD,QAAA,QAAQ,aAAR,QAAQ,KAAA,MAAA,GAAA,MAAA,GAAR,QAAQ,CAAG,EAAE,CAAC;AACd,QAAA,OAAO,aAAP,OAAO,KAAA,MAAA,GAAA,MAAA,GAAP,OAAO,CAAG,KAAK,CAAC;AACpB,KAAC;AAGG,IAAA,IAAW,eAAe,GAI1B,aAAa,UAJa,EACV,oBAAoB,GAGpC,aAAa,CAAA,cAHuB,EACjB,uBAAuB,GAE1C,aAAa,CAF6B,iBAAA,EAC3B,mBAAmB,GAClC,aAAa,cADqB;AAGtC,IAAA,QACI,KAAA,CAAA,aAAA,CAAC,SAAS,EAAA,QAAA,CAAA,EAAA,cAAA,EACQ,UAAU,EACxB,QAAQ,EAAE,CAAC,EAAA,GACN,SAAS,KAAK,QAAQ,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,GACnD,SAAS,EAAA,EACb,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACT,MAAM,CAAC,SAAS,EAChB,eAAe,EACf,SAAS,EACT,QAAQ,IAAI,uBAAuB,EACnC,QAAQ,IAAI,iBAAiB,GAAA,EAAA,GAAA,EAAA;AAEzB,YAAA,EAAA,CAAC,MAAM,CAAC,WAAW,CAAC,IAAG,QAAQ;gBAEtC,EACD,OAAO,EAAE,WAAW,EAAA,CAAA;AAEpB,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,mBAAmB,EAAE,aAAa,CAAC,EAAA,EAC9D,cAAc,CAAwB,IAAI;cACrC,YAAY,CAAC,IAAI,EAAE,EAAE,QAAQ,EAAA,QAAA,EAAE;cAC/B,IAAI,CACR;QAEN,KAAC,CAAA,aAAA,CAAA,cAAc,IACX,MAAM,EAAC,QAAQ,EACf,IAAI,EAAC,iBAAiB,EACtB,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,oBAAoB,EAAE,cAAc,GAAA,EAAA,GAAA,EAAA;AAC5D,gBAAA,EAAA,CAAC,MAAM,CAAC,aAAa,CAAA,GAAG,QAAQ;oBAClC,EAED,EAAA,cAAc,CAAwB,KAAK;cACtC,YAAY,CAAC,KAAK,EAAE,EAAE,QAAQ,EAAA,QAAA,EAAE;cAChC,KAAK,CACE;AAEhB,QAAA,aAAa,KACV,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,SAAS,EAAA;YAC5B,KAAC,CAAA,aAAA,CAAA,SAAS,EACF,QAAA,CAAA,EAAA,EAAA,cAAc,EAClB,EAAA,MAAM,EAAE,CAAA,cAAc,KAAd,IAAA,IAAA,cAAc,KAAd,MAAA,GAAA,MAAA,GAAA,cAAc,CAAE,KAAK,IAAG,EAAE,GAAG,SAAS,EAC9C,MAAM,EAAE;AACJ,oBAAA,KAAK,EAAE,CAAC;AACR,oBAAA,KAAK,EAAE,sBAAsB,CAAC,OAAO,CAAC;iBACzC,EACD,eAAe,EAAE,kBAAkB,CAAC,WAAW,CAAC,EAAA,CAAA,CAClD,CACA,CACT,CACO;AAEpB,CAAC,CACJ;AAEM,IAAM,GAAG,GAAG;;;;"}

package/esm/components/tab/index.css

@@ -14,7 +14,7 @@
     --gap-4: var(--gap-2xs);
     --gap-8: var(--gap-xs);
 }
-.tab-bar__component_1318s {
+.tab-bar__component_1gp7j {
     -webkit-tap-highlight-color: transparent;
     box-sizing: border-box;
     background-color: transparent;
@@ -42,20 +42,20 @@
     padding: var(--gap-8) var(--gap-0);
     color: var(--color-light-neutral-translucent-700);
 }
-.tab-bar__primary_1318s {
+.tab-bar__primary_1gp7j {
     color: var(--color-light-accent-primary);
 }
-.tab-bar__secondary_1318s {
+.tab-bar__secondary_1gp7j {
     color: var(--color-light-accent-secondary);
 }
-.tab-bar__icon_1318s {
+.tab-bar__icon_1gp7j {
     display: flex;
     align-items: center;
     justify-content: center;
     flex-grow: 1;
     width: 100%;
 }
-.tab-bar__label_1318s {
+.tab-bar__label_1gp7j {
     -webkit-line-clamp: 1;
     display: -webkit-box;
     -webkit-box-orient: vertical;
@@ -65,10 +65,10 @@
 
     color: var(--color-light-text-secondary);
 }
-.tab-bar__labelSelected_1318s {
+.tab-bar__labelSelected_1gp7j {
     color: inherit;
 }
-.tab-bar__indicator_1318s {
+.tab-bar__indicator_1gp7j {
     position: absolute;
     top: 3px;
     left: calc(50% + var(--gap-4));

package/esm/components/tab/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"component":"tab-bar__component_1318s","primary":"tab-bar__primary_1318s","secondary":"tab-bar__secondary_1318s","icon":"tab-bar__icon_1318s","label":"tab-bar__label_1318s","labelSelected":"tab-bar__labelSelected_1318s","indicator":"tab-bar__indicator_1318s"};
+var styles = {"component":"tab-bar__component_1gp7j","primary":"tab-bar__primary_1gp7j","secondary":"tab-bar__secondary_1gp7j","icon":"tab-bar__icon_1gp7j","label":"tab-bar__label_1gp7j","labelSelected":"tab-bar__labelSelected_1gp7j","indicator":"tab-bar__indicator_1gp7j"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/tab/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../src/components/tab/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n\n.component {\n    @mixin button-reset;\n\n    position: relative;\n    display: inline-flex;\n    flex-direction: column;\n    flex: 1 0 0;\n    align-items: center;\n    padding: var(--gap-8) var(--gap-0);\n    color: var(--color-light-neutral-translucent-700);\n}\n\n.primary {\n    color: var(--color-light-accent-primary);\n}\n\n.secondary {\n    color: var(--color-light-accent-secondary);\n}\n\n.icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-grow: 1;\n    width: 100%;\n}\n\n.label {\n    @mixin row_limit 1;\n    word-break: break-all;\n    flex-shrink: 0;\n\n    color: var(--color-light-text-secondary);\n}\n\n.labelSelected {\n    color: inherit;\n}\n\n.indicator {\n    position: absolute;\n    top: 3px;\n    left: calc(50% + var(--gap-4));\n    height: 16px;\n    min-width: 16px;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,SAAS,CAAC,wBAAwB,CAAC,WAAW,CAAC,0BAA0B,CAAC,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,sBAAsB,CAAC,eAAe,CAAC,8BAA8B,CAAC,WAAW,CAAC,0BAA0B,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/tab/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.component {\n    @mixin button-reset;\n\n    position: relative;\n    display: inline-flex;\n    flex-direction: column;\n    flex: 1 0 0;\n    align-items: center;\n    padding: var(--gap-8) var(--gap-0);\n    color: var(--color-light-neutral-translucent-700);\n}\n\n.primary {\n    color: var(--color-light-accent-primary);\n}\n\n.secondary {\n    color: var(--color-light-accent-secondary);\n}\n\n.icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-grow: 1;\n    width: 100%;\n}\n\n.label {\n    @mixin row_limit 1;\n    word-break: break-all;\n    flex-shrink: 0;\n\n    color: var(--color-light-text-secondary);\n}\n\n.labelSelected {\n    color: inherit;\n}\n\n.indicator {\n    position: absolute;\n    top: 3px;\n    left: calc(50% + var(--gap-4));\n    height: 16px;\n    min-width: 16px;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,SAAS,CAAC,wBAAwB,CAAC,WAAW,CAAC,0BAA0B,CAAC,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,sBAAsB,CAAC,eAAe,CAAC,8BAA8B,CAAC,WAAW,CAAC,0BAA0B,CAAC;;;;"}

package/esm/index.css

@@ -9,7 +9,7 @@
 :root {
     --sab: env(safe-area-inset-bottom, var(--gap-0));
 }
-.tab-bar__component_zhhlm {
+.tab-bar__component_1ks6h {
     display: flex;
     justify-content: center;
     height: 64px;
@@ -18,17 +18,17 @@
     overflow: hidden;
     transition: box-shadow 0.2s ease;
 }
-.tab-bar__component_zhhlm.tab-bar__modal-bg-primary_zhhlm {
+.tab-bar__component_1ks6h.tab-bar__modal-bg-primary_1ks6h {
         background-color: var(--color-light-base-bg-primary);
     }
-.tab-bar__component_zhhlm.tab-bar__modal-bg-alt-primary_zhhlm {
+.tab-bar__component_1ks6h.tab-bar__modal-bg-alt-primary_1ks6h {
         background-color: var(--color-light-base-bg-alt-primary);
     }
 @media (display-mode: standalone) {
-.tab-bar__component_zhhlm {
+.tab-bar__component_1ks6h {
         padding-bottom: var(--sab);
 }
     }
-.tab-bar__border_zhhlm {
+.tab-bar__border_1ks6h {
     box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);
 }

package/esm/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"component":"tab-bar__component_zhhlm","modal-bg-primary":"tab-bar__modal-bg-primary_zhhlm","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_zhhlm","border":"tab-bar__border_zhhlm"};
+var styles = {"component":"tab-bar__component_1ks6h","modal-bg-primary":"tab-bar__modal-bg-primary_1ks6h","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_1ks6h","border":"tab-bar__border_1ks6h"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '@alfalab/core-components-vars/src/safe-area.css';\n\n.component {\n    display: flex;\n    justify-content: center;\n    height: 64px;\n    max-height: 64px;\n    box-sizing: border-box;\n    overflow: hidden;\n    transition: box-shadow 0.2s ease;\n\n    &.modal-bg-primary {\n        background-color: var(--color-light-base-bg-primary);\n    }\n\n    &.modal-bg-alt-primary {\n        background-color: var(--color-light-base-bg-alt-primary);\n    }\n\n    @media (display-mode: standalone) {\n        padding-bottom: var(--sab);\n    }\n}\n\n.border {\n    box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,QAAQ,CAAC,uBAAuB,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '@alfalab/core-components-vars/src/safe-area.css';\n\n.component {\n    display: flex;\n    justify-content: center;\n    height: 64px;\n    max-height: 64px;\n    box-sizing: border-box;\n    overflow: hidden;\n    transition: box-shadow 0.2s ease;\n\n    &.modal-bg-primary {\n        background-color: var(--color-light-base-bg-primary);\n    }\n\n    &.modal-bg-alt-primary {\n        background-color: var(--color-light-base-bg-alt-primary);\n    }\n\n    @media (display-mode: standalone) {\n        padding-bottom: var(--sab);\n    }\n}\n\n.border {\n    box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,QAAQ,CAAC,uBAAuB,CAAC;;;;"}

package/esm/types.d.ts

@@ -1,7 +1,7 @@
 import { type AllHTMLAttributes, type ElementType, type ForwardRefExoticComponent, type HTMLAttributes, type ReactElement, type ReactNode, type RefAttributes } from 'react';
 import { type IndicatorProps } from '@alfalab/core-components-indicator/esm';
-export declare type AllTabProps = PublicTabProps & PrivateTabProps;
-declare type TabElementType = ReactElement<AllTabProps, ForwardRefExoticComponent<AllTabProps & RefAttributes<HTMLElement>>>;
+export type AllTabProps = PublicTabProps & PrivateTabProps;
+type TabElementType = ReactElement<AllTabProps, ForwardRefExoticComponent<AllTabProps & RefAttributes<HTMLElement>>>;
 export interface TabBarProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
     /**
      * Дополнительный класс

package/index.css

@@ -9,7 +9,7 @@
 :root {
     --sab: env(safe-area-inset-bottom, var(--gap-0));
 }
-.tab-bar__component_zhhlm {
+.tab-bar__component_1ks6h {
     display: flex;
     justify-content: center;
     height: 64px;
@@ -18,17 +18,17 @@
     overflow: hidden;
     transition: box-shadow 0.2s ease;
 }
-.tab-bar__component_zhhlm.tab-bar__modal-bg-primary_zhhlm {
+.tab-bar__component_1ks6h.tab-bar__modal-bg-primary_1ks6h {
         background-color: var(--color-light-base-bg-primary);
     }
-.tab-bar__component_zhhlm.tab-bar__modal-bg-alt-primary_zhhlm {
+.tab-bar__component_1ks6h.tab-bar__modal-bg-alt-primary_1ks6h {
         background-color: var(--color-light-base-bg-alt-primary);
     }
 @media (display-mode: standalone) {
-.tab-bar__component_zhhlm {
+.tab-bar__component_1ks6h {
         padding-bottom: var(--sab);
 }
     }
-.tab-bar__border_zhhlm {
+.tab-bar__border_1ks6h {
     box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);
 }

package/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"component":"tab-bar__component_zhhlm","modal-bg-primary":"tab-bar__modal-bg-primary_zhhlm","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_zhhlm","border":"tab-bar__border_zhhlm"};
+var styles = {"component":"tab-bar__component_1ks6h","modal-bg-primary":"tab-bar__modal-bg-primary_1ks6h","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_1ks6h","border":"tab-bar__border_1ks6h"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '@alfalab/core-components-vars/src/safe-area.css';\n\n.component {\n    display: flex;\n    justify-content: center;\n    height: 64px;\n    max-height: 64px;\n    box-sizing: border-box;\n    overflow: hidden;\n    transition: box-shadow 0.2s ease;\n\n    &.modal-bg-primary {\n        background-color: var(--color-light-base-bg-primary);\n    }\n\n    &.modal-bg-alt-primary {\n        background-color: var(--color-light-base-bg-alt-primary);\n    }\n\n    @media (display-mode: standalone) {\n        padding-bottom: var(--sab);\n    }\n}\n\n.border {\n    box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,QAAQ,CAAC,uBAAuB,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '@alfalab/core-components-vars/src/safe-area.css';\n\n.component {\n    display: flex;\n    justify-content: center;\n    height: 64px;\n    max-height: 64px;\n    box-sizing: border-box;\n    overflow: hidden;\n    transition: box-shadow 0.2s ease;\n\n    &.modal-bg-primary {\n        background-color: var(--color-light-base-bg-primary);\n    }\n\n    &.modal-bg-alt-primary {\n        background-color: var(--color-light-base-bg-alt-primary);\n    }\n\n    @media (display-mode: standalone) {\n        padding-bottom: var(--sab);\n    }\n}\n\n.border {\n    box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,QAAQ,CAAC,uBAAuB,CAAC;;;;"}

package/modern/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["import React, { Children, cloneElement, forwardRef } from 'react';\nimport cn from 'classnames';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { Tab } from './components/tab';\nimport { type TabBarProps } from './types';\n\nimport styles from './index.module.css';\n\nconst TabBarComponent = forwardRef<HTMLDivElement, TabBarProps>(\n    (\n        {\n            children,\n            className,\n            selectedId,\n            border,\n            dataTestId,\n            tabClassNames,\n            onChange,\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        if (Children.count(children) > 5) {\n            // eslint-disable-next-line no-console\n            console.error('Компонент TabBar не может содержать больше 5 табов');\n        }\n\n        return (\n            <nav\n                data-test-id={dataTestId}\n                {...restProps}\n                ref={ref}\n                className={cn(styles.component, styles[bgColor], className, {\n                    [styles.border]: border,\n                })}\n            >\n                {Children.map(children, (tab) =>\n                    cloneElement(tab, {\n                        bgColor,\n                        accentColor,\n                        selected: tab.props.id === selectedId,\n                        onChange,\n                        tabClassNames,\n                        dataTestId: getDataTestId(dataTestId, 'tab'),\n                    }),\n                )}\n            </nav>\n        );\n    },\n);\n\nTabBarComponent.displayName = 'TabBarComponent';\n\nexport const TabBar = Object.assign(TabBarComponent, { Tab });\n"],"names":[],"mappings":";;;;;;AAUA,MAAM,eAAe,GAAG,UAAU,CAC9B,CACI,EACI,QAAQ,EACR,SAAS,EACT,UAAU,EACV,MAAM,EACN,UAAU,EACV,aAAa,EACb,QAAQ,EACR,WAAW,GAAG,SAAS,EACvB,OAAO,GAAG,kBAAkB,EAC5B,GAAG,SAAS,EACf,EACD,GAAG,KACH;IACA,IAAI,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;;AAE9B,QAAA,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC;AACtE;IAED,QACI,KACkB,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,cAAA,EAAA,UAAU,EACpB,GAAA,SAAS,EACb,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,SAAS,EAAE;AACxD,YAAA,CAAC,MAAM,CAAC,MAAM,GAAG,MAAM;AAC1B,SAAA,CAAC,EAED,EAAA,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,GAAG,KACxB,YAAY,CAAC,GAAG,EAAE;QACd,OAAO;QACP,WAAW;AACX,QAAA,QAAQ,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE,KAAK,UAAU;QACrC,QAAQ;QACR,aAAa;AACb,QAAA,UAAU,EAAE,aAAa,CAAC,UAAU,EAAE,KAAK,CAAC;KAC/C,CAAC,CACL,CACC;AAEd,CAAC,CACJ;AAED,eAAe,CAAC,WAAW,GAAG,iBAAiB;AAExC,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE,EAAE,GAAG,EAAE;;;;"}
+{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["import React, { Children, cloneElement, forwardRef } from 'react';\nimport cn from 'classnames';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { Tab } from './components/tab';\nimport { type TabBarProps } from './types';\n\nimport styles from './index.module.css';\n\nconst TabBarComponent = forwardRef<HTMLDivElement, TabBarProps>(\n    (\n        {\n            children,\n            className,\n            selectedId,\n            border,\n            dataTestId,\n            tabClassNames,\n            onChange,\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        if (Children.count(children) > 5) {\n            // eslint-disable-next-line no-console\n            console.error('Компонент TabBar не может содержать больше 5 табов');\n        }\n\n        return (\n            <nav\n                data-test-id={dataTestId}\n                {...restProps}\n                ref={ref}\n                className={cn(styles.component, styles[bgColor], className, {\n                    [styles.border]: border,\n                })}\n            >\n                {Children.map(children, (tab) =>\n                    cloneElement(tab, {\n                        bgColor,\n                        accentColor,\n                        selected: tab.props.id === selectedId,\n                        onChange,\n                        tabClassNames,\n                        dataTestId: getDataTestId(dataTestId, 'tab'),\n                    }),\n                )}\n            </nav>\n        );\n    },\n);\n\nTabBarComponent.displayName = 'TabBarComponent';\n\nexport const TabBar = Object.assign(TabBarComponent, { Tab });\n"],"names":[],"mappings":";;;;;;AAUA,MAAM,eAAe,GAAG,UAAU,CAC9B,CACI,EACI,QAAQ,EACR,SAAS,EACT,UAAU,EACV,MAAM,EACN,UAAU,EACV,aAAa,EACb,QAAQ,EACR,WAAW,GAAG,SAAS,EACvB,OAAO,GAAG,kBAAkB,EAC5B,GAAG,SAAS,EACf,EACD,GAAG,KACH;IACA,IAAI,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;;AAE9B,QAAA,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC;;IAGvE,QACI,KACkB,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,cAAA,EAAA,UAAU,EACpB,GAAA,SAAS,EACb,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,SAAS,EAAE;AACxD,YAAA,CAAC,MAAM,CAAC,MAAM,GAAG,MAAM;AAC1B,SAAA,CAAC,EAED,EAAA,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,GAAG,KACxB,YAAY,CAAC,GAAG,EAAE;QACd,OAAO;QACP,WAAW;AACX,QAAA,QAAQ,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE,KAAK,UAAU;QACrC,QAAQ;QACR,aAAa;AACb,QAAA,UAAU,EAAE,aAAa,CAAC,UAAU,EAAE,KAAK,CAAC;KAC/C,CAAC,CACL,CACC;AAEd,CAAC,CACJ;AAED,eAAe,CAAC,WAAW,GAAG,iBAAiB;AAExC,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE,EAAE,GAAG,EAAE;;;;"}

package/modern/components/tab/Component.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
+import { type ForwardRefExoticComponent, type RefAttributes } from 'react';
 import { type PublicTabProps } from '../../types';
-export declare const Tab: React.ForwardRefExoticComponent<PublicTabProps & React.RefAttributes<HTMLElement>>;
+export declare const Tab: ForwardRefExoticComponent<PublicTabProps & RefAttributes<HTMLElement>>;

package/modern/components/tab/Component.js

@@ -14,10 +14,14 @@ const TabComponent = forwardRef(({ showIndicator, indicatorProps, label, icon, i
     return (React.createElement(Component, { "data-test-id": dataTestId, tabIndex: 0, ...(Component === 'button' ? { type: 'button' } : null), ...restProps, href: href, id: id, ref: ref, className: cn(styles.component, commonClassName, className, selected && commonSelectedClassName, selected && selectedClassName, {
             [styles[accentColor]]: selected,
         }), onClick: handleClick },
-        React.createElement("div", { className: cn(styles.icon, commonIconClassName, iconClassName) }, isValidElement(icon) ? cloneElement(icon, { selected }) : icon),
+        React.createElement("div", { className: cn(styles.icon, commonIconClassName, iconClassName) }, isValidElement(icon)
+            ? cloneElement(icon, { selected })
+            : icon),
         React.createElement(TypographyText, { weight: 'medium', view: 'secondary-small', className: cn(styles.label, commonLabelClassName, labelClassName, {
                 [styles.labelSelected]: selected,
-            }) }, isValidElement(label) ? cloneElement(label, { selected }) : label),
+            }) }, isValidElement(label)
+            ? cloneElement(label, { selected })
+            : label),
         showIndicator && (React.createElement("div", { className: styles.indicator },
             React.createElement(Indicator, { ...indicatorProps, height: indicatorProps?.value ? 16 : undefined, border: {
                     width: 2,

package/modern/components/tab/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../../src/components/tab/Component.tsx"],"sourcesContent":["import React, {\n    cloneElement,\n    forwardRef,\n    type ForwardRefExoticComponent,\n    isValidElement,\n    type MouseEventHandler,\n    type RefAttributes,\n} from 'react';\nimport cn from 'classnames';\n\nimport { Indicator } from '@alfalab/core-components-indicator';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { INDICATOR_BG_COLOR, INDICATOR_BORDER_COLOR } from '../../consts';\nimport { type AllTabProps, type PublicTabProps } from '../../types';\n\nimport styles from './index.module.css';\n\nconst TabComponent = forwardRef<HTMLElement, AllTabProps>(\n    (\n        {\n            showIndicator,\n            indicatorProps,\n            label,\n            icon,\n            id,\n            selected,\n            onChange,\n            onClick,\n            tabClassNames = {},\n            dataTestId,\n            className,\n            labelClassName,\n            selectedClassName,\n            iconClassName,\n            href,\n            Component = href ? 'a' : 'button',\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        const handleClick: MouseEventHandler<HTMLElement> = (event) => {\n            onChange?.(id);\n            onClick?.(event);\n        };\n\n        const {\n            className: commonClassName,\n            labelClassName: commonLabelClassName,\n            selectedClassName: commonSelectedClassName,\n            iconClassName: commonIconClassName,\n        } = tabClassNames;\n\n        return (\n            <Component\n                data-test-id={dataTestId}\n                tabIndex={0}\n                {...(Component === 'button' ? { type: 'button' } : null)}\n                {...restProps}\n                href={href}\n                id={id}\n                ref={ref}\n                className={cn(\n                    styles.component,\n                    commonClassName,\n                    className,\n                    selected && commonSelectedClassName,\n                    selected && selectedClassName,\n                    {\n                        [styles[accentColor]]: selected,\n                    },\n                )}\n                onClick={handleClick}\n            >\n                <div className={cn(styles.icon, commonIconClassName, iconClassName)}>\n                    {isValidElement(icon) ? cloneElement(icon, { selected }) : icon}\n                </div>\n\n                <TypographyText\n                    weight='medium'\n                    view='secondary-small'\n                    className={cn(styles.label, commonLabelClassName, labelClassName, {\n                        [styles.labelSelected]: selected,\n                    })}\n                >\n                    {isValidElement(label) ? cloneElement(label, { selected }) : label}\n                </TypographyText>\n\n                {showIndicator && (\n                    <div className={styles.indicator}>\n                        <Indicator\n                            {...indicatorProps}\n                            height={indicatorProps?.value ? 16 : undefined}\n                            border={{\n                                width: 2,\n                                color: INDICATOR_BORDER_COLOR[bgColor],\n                            }}\n                            backgroundColor={INDICATOR_BG_COLOR[accentColor]}\n                        />\n                    </div>\n                )}\n            </Component>\n        );\n    },\n);\n\nexport const Tab = TabComponent as ForwardRefExoticComponent<\n    PublicTabProps & RefAttributes<HTMLElement>\n>;\n"],"names":[],"mappings":";;;;;;;AAkBA,MAAM,YAAY,GAAG,UAAU,CAC3B,CACI,EACI,aAAa,EACb,cAAc,EACd,KAAK,EACL,IAAI,EACJ,EAAE,EACF,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,aAAa,GAAG,EAAE,EAClB,UAAU,EACV,SAAS,EACT,cAAc,EACd,iBAAiB,EACjB,aAAa,EACb,IAAI,EACJ,SAAS,GAAG,IAAI,GAAG,GAAG,GAAG,QAAQ,EACjC,WAAW,GAAG,SAAS,EACvB,OAAO,GAAG,kBAAkB,EAC5B,GAAG,SAAS,EACf,EACD,GAAG,KACH;AACA,IAAA,MAAM,WAAW,GAAmC,CAAC,KAAK,KAAI;AAC1D,QAAA,QAAQ,GAAG,EAAE,CAAC;AACd,QAAA,OAAO,GAAG,KAAK,CAAC;AACpB,KAAC;AAED,IAAA,MAAM,EACF,SAAS,EAAE,eAAe,EAC1B,cAAc,EAAE,oBAAoB,EACpC,iBAAiB,EAAE,uBAAuB,EAC1C,aAAa,EAAE,mBAAmB,GACrC,GAAG,aAAa;AAEjB,IAAA,QACI,KAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EAAA,cAAA,EACQ,UAAU,EACxB,QAAQ,EAAE,CAAC,EAAA,IACN,SAAS,KAAK,QAAQ,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,EAAA,GACpD,SAAS,EACb,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACT,MAAM,CAAC,SAAS,EAChB,eAAe,EACf,SAAS,EACT,QAAQ,IAAI,uBAAuB,EACnC,QAAQ,IAAI,iBAAiB,EAC7B;AACI,YAAA,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,QAAQ;SAClC,CACJ,EACD,OAAO,EAAE,WAAW,EAAA;AAEpB,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,mBAAmB,EAAE,aAAa,CAAC,EAAA,EAC9D,cAAc,CAAC,IAAI,CAAC,GAAG,YAAY,CAAC,IAAI,EAAE,EAAE,QAAQ,EAAE,CAAC,GAAG,IAAI,CAC7D;QAEN,KAAC,CAAA,aAAA,CAAA,cAAc,IACX,MAAM,EAAC,QAAQ,EACf,IAAI,EAAC,iBAAiB,EACtB,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,oBAAoB,EAAE,cAAc,EAAE;AAC9D,gBAAA,CAAC,MAAM,CAAC,aAAa,GAAG,QAAQ;aACnC,CAAC,EAAA,EAED,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,CAAC,GAAG,KAAK,CACrD;AAEhB,QAAA,aAAa,KACV,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,SAAS,EAAA;AAC5B,YAAA,KAAA,CAAA,aAAA,CAAC,SAAS,EACF,EAAA,GAAA,cAAc,EAClB,MAAM,EAAE,cAAc,EAAE,KAAK,GAAG,EAAE,GAAG,SAAS,EAC9C,MAAM,EAAE;AACJ,oBAAA,KAAK,EAAE,CAAC;AACR,oBAAA,KAAK,EAAE,sBAAsB,CAAC,OAAO,CAAC;iBACzC,EACD,eAAe,EAAE,kBAAkB,CAAC,WAAW,CAAC,EAAA,CAClD,CACA,CACT,CACO;AAEpB,CAAC,CACJ;AAEM,MAAM,GAAG,GAAG;;;;"}
+{"version":3,"file":"Component.js","sources":["../../../src/components/tab/Component.tsx"],"sourcesContent":["import React, {\n    cloneElement,\n    forwardRef,\n    type ForwardRefExoticComponent,\n    isValidElement,\n    type MouseEventHandler,\n    type RefAttributes,\n} from 'react';\nimport cn from 'classnames';\n\nimport { Indicator } from '@alfalab/core-components-indicator';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { INDICATOR_BG_COLOR, INDICATOR_BORDER_COLOR } from '../../consts';\nimport { type AllTabProps, type PublicTabProps } from '../../types';\n\nimport styles from './index.module.css';\n\nconst TabComponent = forwardRef<HTMLElement, AllTabProps>(\n    (\n        {\n            showIndicator,\n            indicatorProps,\n            label,\n            icon,\n            id,\n            selected,\n            onChange,\n            onClick,\n            tabClassNames = {},\n            dataTestId,\n            className,\n            labelClassName,\n            selectedClassName,\n            iconClassName,\n            href,\n            Component = href ? 'a' : 'button',\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        const handleClick: MouseEventHandler<HTMLElement> = (event) => {\n            onChange?.(id);\n            onClick?.(event);\n        };\n\n        const {\n            className: commonClassName,\n            labelClassName: commonLabelClassName,\n            selectedClassName: commonSelectedClassName,\n            iconClassName: commonIconClassName,\n        } = tabClassNames;\n\n        return (\n            <Component\n                data-test-id={dataTestId}\n                tabIndex={0}\n                {...(Component === 'button' ? { type: 'button' } : null)}\n                {...restProps}\n                href={href}\n                id={id}\n                ref={ref}\n                className={cn(\n                    styles.component,\n                    commonClassName,\n                    className,\n                    selected && commonSelectedClassName,\n                    selected && selectedClassName,\n                    {\n                        [styles[accentColor]]: selected,\n                    },\n                )}\n                onClick={handleClick}\n            >\n                <div className={cn(styles.icon, commonIconClassName, iconClassName)}>\n                    {isValidElement<{ selected: unknown }>(icon)\n                        ? cloneElement(icon, { selected })\n                        : icon}\n                </div>\n\n                <TypographyText\n                    weight='medium'\n                    view='secondary-small'\n                    className={cn(styles.label, commonLabelClassName, labelClassName, {\n                        [styles.labelSelected]: selected,\n                    })}\n                >\n                    {isValidElement<{ selected: unknown }>(label)\n                        ? cloneElement(label, { selected })\n                        : label}\n                </TypographyText>\n\n                {showIndicator && (\n                    <div className={styles.indicator}>\n                        <Indicator\n                            {...indicatorProps}\n                            height={indicatorProps?.value ? 16 : undefined}\n                            border={{\n                                width: 2,\n                                color: INDICATOR_BORDER_COLOR[bgColor],\n                            }}\n                            backgroundColor={INDICATOR_BG_COLOR[accentColor]}\n                        />\n                    </div>\n                )}\n            </Component>\n        );\n    },\n);\n\nexport const Tab = TabComponent as ForwardRefExoticComponent<\n    PublicTabProps & RefAttributes<HTMLElement>\n>;\n"],"names":[],"mappings":";;;;;;;AAkBA,MAAM,YAAY,GAAG,UAAU,CAC3B,CACI,EACI,aAAa,EACb,cAAc,EACd,KAAK,EACL,IAAI,EACJ,EAAE,EACF,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,aAAa,GAAG,EAAE,EAClB,UAAU,EACV,SAAS,EACT,cAAc,EACd,iBAAiB,EACjB,aAAa,EACb,IAAI,EACJ,SAAS,GAAG,IAAI,GAAG,GAAG,GAAG,QAAQ,EACjC,WAAW,GAAG,SAAS,EACvB,OAAO,GAAG,kBAAkB,EAC5B,GAAG,SAAS,EACf,EACD,GAAG,KACH;AACA,IAAA,MAAM,WAAW,GAAmC,CAAC,KAAK,KAAI;AAC1D,QAAA,QAAQ,GAAG,EAAE,CAAC;AACd,QAAA,OAAO,GAAG,KAAK,CAAC;AACpB,KAAC;AAED,IAAA,MAAM,EACF,SAAS,EAAE,eAAe,EAC1B,cAAc,EAAE,oBAAoB,EACpC,iBAAiB,EAAE,uBAAuB,EAC1C,aAAa,EAAE,mBAAmB,GACrC,GAAG,aAAa;AAEjB,IAAA,QACI,KAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EAAA,cAAA,EACQ,UAAU,EACxB,QAAQ,EAAE,CAAC,EAAA,IACN,SAAS,KAAK,QAAQ,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,EAAA,GACpD,SAAS,EACb,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACT,MAAM,CAAC,SAAS,EAChB,eAAe,EACf,SAAS,EACT,QAAQ,IAAI,uBAAuB,EACnC,QAAQ,IAAI,iBAAiB,EAC7B;AACI,YAAA,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,QAAQ;SAClC,CACJ,EACD,OAAO,EAAE,WAAW,EAAA;AAEpB,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,mBAAmB,EAAE,aAAa,CAAC,EAAA,EAC9D,cAAc,CAAwB,IAAI;cACrC,YAAY,CAAC,IAAI,EAAE,EAAE,QAAQ,EAAE;cAC/B,IAAI,CACR;QAEN,KAAC,CAAA,aAAA,CAAA,cAAc,IACX,MAAM,EAAC,QAAQ,EACf,IAAI,EAAC,iBAAiB,EACtB,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,oBAAoB,EAAE,cAAc,EAAE;AAC9D,gBAAA,CAAC,MAAM,CAAC,aAAa,GAAG,QAAQ;AACnC,aAAA,CAAC,EAED,EAAA,cAAc,CAAwB,KAAK;cACtC,YAAY,CAAC,KAAK,EAAE,EAAE,QAAQ,EAAE;cAChC,KAAK,CACE;AAEhB,QAAA,aAAa,KACV,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,SAAS,EAAA;AAC5B,YAAA,KAAA,CAAA,aAAA,CAAC,SAAS,EACF,EAAA,GAAA,cAAc,EAClB,MAAM,EAAE,cAAc,EAAE,KAAK,GAAG,EAAE,GAAG,SAAS,EAC9C,MAAM,EAAE;AACJ,oBAAA,KAAK,EAAE,CAAC;AACR,oBAAA,KAAK,EAAE,sBAAsB,CAAC,OAAO,CAAC;iBACzC,EACD,eAAe,EAAE,kBAAkB,CAAC,WAAW,CAAC,EAAA,CAClD,CACA,CACT,CACO;AAEpB,CAAC,CACJ;AAEM,MAAM,GAAG,GAAG;;;;"}

package/modern/components/tab/index.css

@@ -14,7 +14,7 @@
     --gap-4: var(--gap-2xs);
     --gap-8: var(--gap-xs);
 }
-.tab-bar__component_1318s {
+.tab-bar__component_1gp7j {
     -webkit-tap-highlight-color: transparent;
     box-sizing: border-box;
     background-color: transparent;
@@ -42,20 +42,20 @@
     padding: var(--gap-8) var(--gap-0);
     color: var(--color-light-neutral-translucent-700);
 }
-.tab-bar__primary_1318s {
+.tab-bar__primary_1gp7j {
     color: var(--color-light-accent-primary);
 }
-.tab-bar__secondary_1318s {
+.tab-bar__secondary_1gp7j {
     color: var(--color-light-accent-secondary);
 }
-.tab-bar__icon_1318s {
+.tab-bar__icon_1gp7j {
     display: flex;
     align-items: center;
     justify-content: center;
     flex-grow: 1;
     width: 100%;
 }
-.tab-bar__label_1318s {
+.tab-bar__label_1gp7j {
     -webkit-line-clamp: 1;
     display: -webkit-box;
     -webkit-box-orient: vertical;
@@ -65,10 +65,10 @@
 
     color: var(--color-light-text-secondary);
 }
-.tab-bar__labelSelected_1318s {
+.tab-bar__labelSelected_1gp7j {
     color: inherit;
 }
-.tab-bar__indicator_1318s {
+.tab-bar__indicator_1gp7j {
     position: absolute;
     top: 3px;
     left: calc(50% + var(--gap-4));

package/modern/components/tab/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-const styles = {"component":"tab-bar__component_1318s","primary":"tab-bar__primary_1318s","secondary":"tab-bar__secondary_1318s","icon":"tab-bar__icon_1318s","label":"tab-bar__label_1318s","labelSelected":"tab-bar__labelSelected_1318s","indicator":"tab-bar__indicator_1318s"};
+const styles = {"component":"tab-bar__component_1gp7j","primary":"tab-bar__primary_1gp7j","secondary":"tab-bar__secondary_1gp7j","icon":"tab-bar__icon_1gp7j","label":"tab-bar__label_1gp7j","labelSelected":"tab-bar__labelSelected_1gp7j","indicator":"tab-bar__indicator_1gp7j"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/modern/components/tab/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../src/components/tab/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n\n.component {\n    @mixin button-reset;\n\n    position: relative;\n    display: inline-flex;\n    flex-direction: column;\n    flex: 1 0 0;\n    align-items: center;\n    padding: var(--gap-8) var(--gap-0);\n    color: var(--color-light-neutral-translucent-700);\n}\n\n.primary {\n    color: var(--color-light-accent-primary);\n}\n\n.secondary {\n    color: var(--color-light-accent-secondary);\n}\n\n.icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-grow: 1;\n    width: 100%;\n}\n\n.label {\n    @mixin row_limit 1;\n    word-break: break-all;\n    flex-shrink: 0;\n\n    color: var(--color-light-text-secondary);\n}\n\n.labelSelected {\n    color: inherit;\n}\n\n.indicator {\n    position: absolute;\n    top: 3px;\n    left: calc(50% + var(--gap-4));\n    height: 16px;\n    min-width: 16px;\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,SAAS,CAAC,wBAAwB,CAAC,WAAW,CAAC,0BAA0B,CAAC,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,sBAAsB,CAAC,eAAe,CAAC,8BAA8B,CAAC,WAAW,CAAC,0BAA0B,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/tab/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.component {\n    @mixin button-reset;\n\n    position: relative;\n    display: inline-flex;\n    flex-direction: column;\n    flex: 1 0 0;\n    align-items: center;\n    padding: var(--gap-8) var(--gap-0);\n    color: var(--color-light-neutral-translucent-700);\n}\n\n.primary {\n    color: var(--color-light-accent-primary);\n}\n\n.secondary {\n    color: var(--color-light-accent-secondary);\n}\n\n.icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-grow: 1;\n    width: 100%;\n}\n\n.label {\n    @mixin row_limit 1;\n    word-break: break-all;\n    flex-shrink: 0;\n\n    color: var(--color-light-text-secondary);\n}\n\n.labelSelected {\n    color: inherit;\n}\n\n.indicator {\n    position: absolute;\n    top: 3px;\n    left: calc(50% + var(--gap-4));\n    height: 16px;\n    min-width: 16px;\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,SAAS,CAAC,wBAAwB,CAAC,WAAW,CAAC,0BAA0B,CAAC,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,sBAAsB,CAAC,eAAe,CAAC,8BAA8B,CAAC,WAAW,CAAC,0BAA0B,CAAC;;;;"}

package/modern/index.css

@@ -9,7 +9,7 @@
 :root {
     --sab: env(safe-area-inset-bottom, var(--gap-0));
 }
-.tab-bar__component_zhhlm {
+.tab-bar__component_1ks6h {
     display: flex;
     justify-content: center;
     height: 64px;
@@ -18,17 +18,17 @@
     overflow: hidden;
     transition: box-shadow 0.2s ease;
 }
-.tab-bar__component_zhhlm.tab-bar__modal-bg-primary_zhhlm {
+.tab-bar__component_1ks6h.tab-bar__modal-bg-primary_1ks6h {
         background-color: var(--color-light-base-bg-primary);
     }
-.tab-bar__component_zhhlm.tab-bar__modal-bg-alt-primary_zhhlm {
+.tab-bar__component_1ks6h.tab-bar__modal-bg-alt-primary_1ks6h {
         background-color: var(--color-light-base-bg-alt-primary);
     }
 @media (display-mode: standalone) {
-.tab-bar__component_zhhlm {
+.tab-bar__component_1ks6h {
         padding-bottom: var(--sab);
 }
     }
-.tab-bar__border_zhhlm {
+.tab-bar__border_1ks6h {
     box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);
 }

package/modern/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-const styles = {"component":"tab-bar__component_zhhlm","modal-bg-primary":"tab-bar__modal-bg-primary_zhhlm","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_zhhlm","border":"tab-bar__border_zhhlm"};
+const styles = {"component":"tab-bar__component_1ks6h","modal-bg-primary":"tab-bar__modal-bg-primary_1ks6h","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_1ks6h","border":"tab-bar__border_1ks6h"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/modern/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '@alfalab/core-components-vars/src/safe-area.css';\n\n.component {\n    display: flex;\n    justify-content: center;\n    height: 64px;\n    max-height: 64px;\n    box-sizing: border-box;\n    overflow: hidden;\n    transition: box-shadow 0.2s ease;\n\n    &.modal-bg-primary {\n        background-color: var(--color-light-base-bg-primary);\n    }\n\n    &.modal-bg-alt-primary {\n        background-color: var(--color-light-base-bg-alt-primary);\n    }\n\n    @media (display-mode: standalone) {\n        padding-bottom: var(--sab);\n    }\n}\n\n.border {\n    box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,QAAQ,CAAC,uBAAuB,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '@alfalab/core-components-vars/src/safe-area.css';\n\n.component {\n    display: flex;\n    justify-content: center;\n    height: 64px;\n    max-height: 64px;\n    box-sizing: border-box;\n    overflow: hidden;\n    transition: box-shadow 0.2s ease;\n\n    &.modal-bg-primary {\n        background-color: var(--color-light-base-bg-primary);\n    }\n\n    &.modal-bg-alt-primary {\n        background-color: var(--color-light-base-bg-alt-primary);\n    }\n\n    @media (display-mode: standalone) {\n        padding-bottom: var(--sab);\n    }\n}\n\n.border {\n    box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,QAAQ,CAAC,uBAAuB,CAAC;;;;"}

package/modern/types.d.ts

@@ -1,7 +1,7 @@
 import { type AllHTMLAttributes, type ElementType, type ForwardRefExoticComponent, type HTMLAttributes, type ReactElement, type ReactNode, type RefAttributes } from 'react';
 import { type IndicatorProps } from '@alfalab/core-components-indicator/modern';
-export declare type AllTabProps = PublicTabProps & PrivateTabProps;
-declare type TabElementType = ReactElement<AllTabProps, ForwardRefExoticComponent<AllTabProps & RefAttributes<HTMLElement>>>;
+export type AllTabProps = PublicTabProps & PrivateTabProps;
+type TabElementType = ReactElement<AllTabProps, ForwardRefExoticComponent<AllTabProps & RefAttributes<HTMLElement>>>;
 export interface TabBarProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
     /**
      * Дополнительный класс

package/moderncssm/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["import React, { Children, cloneElement, forwardRef } from 'react';\nimport cn from 'classnames';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { Tab } from './components/tab';\nimport { type TabBarProps } from './types';\n\nimport styles from './index.module.css';\n\nconst TabBarComponent = forwardRef<HTMLDivElement, TabBarProps>(\n    (\n        {\n            children,\n            className,\n            selectedId,\n            border,\n            dataTestId,\n            tabClassNames,\n            onChange,\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        if (Children.count(children) > 5) {\n            // eslint-disable-next-line no-console\n            console.error('Компонент TabBar не может содержать больше 5 табов');\n        }\n\n        return (\n            <nav\n                data-test-id={dataTestId}\n                {...restProps}\n                ref={ref}\n                className={cn(styles.component, styles[bgColor], className, {\n                    [styles.border]: border,\n                })}\n            >\n                {Children.map(children, (tab) =>\n                    cloneElement(tab, {\n                        bgColor,\n                        accentColor,\n                        selected: tab.props.id === selectedId,\n                        onChange,\n                        tabClassNames,\n                        dataTestId: getDataTestId(dataTestId, 'tab'),\n                    }),\n                )}\n            </nav>\n        );\n    },\n);\n\nTabBarComponent.displayName = 'TabBarComponent';\n\nexport const TabBar = Object.assign(TabBarComponent, { Tab });\n"],"names":[],"mappings":";;;;;;AAUA,MAAM,eAAe,GAAG,UAAU,CAC9B,CACI,EACI,QAAQ,EACR,SAAS,EACT,UAAU,EACV,MAAM,EACN,UAAU,EACV,aAAa,EACb,QAAQ,EACR,WAAW,GAAG,SAAS,EACvB,OAAO,GAAG,kBAAkB,EAC5B,GAAG,SAAS,EACf,EACD,GAAG,KACH;IACA,IAAI,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;;AAE9B,QAAA,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC;AACtE;IAED,QACI,KACkB,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,cAAA,EAAA,UAAU,EACpB,GAAA,SAAS,EACb,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,SAAS,EAAE;AACxD,YAAA,CAAC,MAAM,CAAC,MAAM,GAAG,MAAM;AAC1B,SAAA,CAAC,EAED,EAAA,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,GAAG,KACxB,YAAY,CAAC,GAAG,EAAE;QACd,OAAO;QACP,WAAW;AACX,QAAA,QAAQ,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE,KAAK,UAAU;QACrC,QAAQ;QACR,aAAa;AACb,QAAA,UAAU,EAAE,aAAa,CAAC,UAAU,EAAE,KAAK,CAAC;KAC/C,CAAC,CACL,CACC;AAEd,CAAC,CACJ;AAED,eAAe,CAAC,WAAW,GAAG,iBAAiB;AAExC,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE,EAAE,GAAG,EAAE;;;;"}
+{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["import React, { Children, cloneElement, forwardRef } from 'react';\nimport cn from 'classnames';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { Tab } from './components/tab';\nimport { type TabBarProps } from './types';\n\nimport styles from './index.module.css';\n\nconst TabBarComponent = forwardRef<HTMLDivElement, TabBarProps>(\n    (\n        {\n            children,\n            className,\n            selectedId,\n            border,\n            dataTestId,\n            tabClassNames,\n            onChange,\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        if (Children.count(children) > 5) {\n            // eslint-disable-next-line no-console\n            console.error('Компонент TabBar не может содержать больше 5 табов');\n        }\n\n        return (\n            <nav\n                data-test-id={dataTestId}\n                {...restProps}\n                ref={ref}\n                className={cn(styles.component, styles[bgColor], className, {\n                    [styles.border]: border,\n                })}\n            >\n                {Children.map(children, (tab) =>\n                    cloneElement(tab, {\n                        bgColor,\n                        accentColor,\n                        selected: tab.props.id === selectedId,\n                        onChange,\n                        tabClassNames,\n                        dataTestId: getDataTestId(dataTestId, 'tab'),\n                    }),\n                )}\n            </nav>\n        );\n    },\n);\n\nTabBarComponent.displayName = 'TabBarComponent';\n\nexport const TabBar = Object.assign(TabBarComponent, { Tab });\n"],"names":[],"mappings":";;;;;;AAUA,MAAM,eAAe,GAAG,UAAU,CAC9B,CACI,EACI,QAAQ,EACR,SAAS,EACT,UAAU,EACV,MAAM,EACN,UAAU,EACV,aAAa,EACb,QAAQ,EACR,WAAW,GAAG,SAAS,EACvB,OAAO,GAAG,kBAAkB,EAC5B,GAAG,SAAS,EACf,EACD,GAAG,KACH;IACA,IAAI,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;;AAE9B,QAAA,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC;;IAGvE,QACI,KACkB,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,cAAA,EAAA,UAAU,EACpB,GAAA,SAAS,EACb,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,SAAS,EAAE;AACxD,YAAA,CAAC,MAAM,CAAC,MAAM,GAAG,MAAM;AAC1B,SAAA,CAAC,EAED,EAAA,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,GAAG,KACxB,YAAY,CAAC,GAAG,EAAE;QACd,OAAO;QACP,WAAW;AACX,QAAA,QAAQ,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE,KAAK,UAAU;QACrC,QAAQ;QACR,aAAa;AACb,QAAA,UAAU,EAAE,aAAa,CAAC,UAAU,EAAE,KAAK,CAAC;KAC/C,CAAC,CACL,CACC;AAEd,CAAC,CACJ;AAED,eAAe,CAAC,WAAW,GAAG,iBAAiB;AAExC,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE,EAAE,GAAG,EAAE;;;;"}

package/moderncssm/components/tab/Component.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
+import { type ForwardRefExoticComponent, type RefAttributes } from 'react';
 import { type PublicTabProps } from '../../types';
-export declare const Tab: React.ForwardRefExoticComponent<PublicTabProps & React.RefAttributes<HTMLElement>>;
+export declare const Tab: ForwardRefExoticComponent<PublicTabProps & RefAttributes<HTMLElement>>;

package/moderncssm/components/tab/Component.js

@@ -14,10 +14,14 @@ const TabComponent = forwardRef(({ showIndicator, indicatorProps, label, icon, i
     return (React.createElement(Component, { "data-test-id": dataTestId, tabIndex: 0, ...(Component === 'button' ? { type: 'button' } : null), ...restProps, href: href, id: id, ref: ref, className: cn(styles.component, commonClassName, className, selected && commonSelectedClassName, selected && selectedClassName, {
             [styles[accentColor]]: selected,
         }), onClick: handleClick },
-        React.createElement("div", { className: cn(styles.icon, commonIconClassName, iconClassName) }, isValidElement(icon) ? cloneElement(icon, { selected }) : icon),
+        React.createElement("div", { className: cn(styles.icon, commonIconClassName, iconClassName) }, isValidElement(icon)
+            ? cloneElement(icon, { selected })
+            : icon),
         React.createElement(TypographyText, { weight: 'medium', view: 'secondary-small', className: cn(styles.label, commonLabelClassName, labelClassName, {
                 [styles.labelSelected]: selected,
-            }) }, isValidElement(label) ? cloneElement(label, { selected }) : label),
+            }) }, isValidElement(label)
+            ? cloneElement(label, { selected })
+            : label),
         showIndicator && (React.createElement("div", { className: styles.indicator },
             React.createElement(Indicator, { ...indicatorProps, height: indicatorProps?.value ? 16 : undefined, border: {
                     width: 2,

package/moderncssm/components/tab/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../../src/components/tab/Component.tsx"],"sourcesContent":["import React, {\n    cloneElement,\n    forwardRef,\n    type ForwardRefExoticComponent,\n    isValidElement,\n    type MouseEventHandler,\n    type RefAttributes,\n} from 'react';\nimport cn from 'classnames';\n\nimport { Indicator } from '@alfalab/core-components-indicator';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { INDICATOR_BG_COLOR, INDICATOR_BORDER_COLOR } from '../../consts';\nimport { type AllTabProps, type PublicTabProps } from '../../types';\n\nimport styles from './index.module.css';\n\nconst TabComponent = forwardRef<HTMLElement, AllTabProps>(\n    (\n        {\n            showIndicator,\n            indicatorProps,\n            label,\n            icon,\n            id,\n            selected,\n            onChange,\n            onClick,\n            tabClassNames = {},\n            dataTestId,\n            className,\n            labelClassName,\n            selectedClassName,\n            iconClassName,\n            href,\n            Component = href ? 'a' : 'button',\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        const handleClick: MouseEventHandler<HTMLElement> = (event) => {\n            onChange?.(id);\n            onClick?.(event);\n        };\n\n        const {\n            className: commonClassName,\n            labelClassName: commonLabelClassName,\n            selectedClassName: commonSelectedClassName,\n            iconClassName: commonIconClassName,\n        } = tabClassNames;\n\n        return (\n            <Component\n                data-test-id={dataTestId}\n                tabIndex={0}\n                {...(Component === 'button' ? { type: 'button' } : null)}\n                {...restProps}\n                href={href}\n                id={id}\n                ref={ref}\n                className={cn(\n                    styles.component,\n                    commonClassName,\n                    className,\n                    selected && commonSelectedClassName,\n                    selected && selectedClassName,\n                    {\n                        [styles[accentColor]]: selected,\n                    },\n                )}\n                onClick={handleClick}\n            >\n                <div className={cn(styles.icon, commonIconClassName, iconClassName)}>\n                    {isValidElement(icon) ? cloneElement(icon, { selected }) : icon}\n                </div>\n\n                <TypographyText\n                    weight='medium'\n                    view='secondary-small'\n                    className={cn(styles.label, commonLabelClassName, labelClassName, {\n                        [styles.labelSelected]: selected,\n                    })}\n                >\n                    {isValidElement(label) ? cloneElement(label, { selected }) : label}\n                </TypographyText>\n\n                {showIndicator && (\n                    <div className={styles.indicator}>\n                        <Indicator\n                            {...indicatorProps}\n                            height={indicatorProps?.value ? 16 : undefined}\n                            border={{\n                                width: 2,\n                                color: INDICATOR_BORDER_COLOR[bgColor],\n                            }}\n                            backgroundColor={INDICATOR_BG_COLOR[accentColor]}\n                        />\n                    </div>\n                )}\n            </Component>\n        );\n    },\n);\n\nexport const Tab = TabComponent as ForwardRefExoticComponent<\n    PublicTabProps & RefAttributes<HTMLElement>\n>;\n"],"names":[],"mappings":";;;;;;;AAkBA,MAAM,YAAY,GAAG,UAAU,CAC3B,CACI,EACI,aAAa,EACb,cAAc,EACd,KAAK,EACL,IAAI,EACJ,EAAE,EACF,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,aAAa,GAAG,EAAE,EAClB,UAAU,EACV,SAAS,EACT,cAAc,EACd,iBAAiB,EACjB,aAAa,EACb,IAAI,EACJ,SAAS,GAAG,IAAI,GAAG,GAAG,GAAG,QAAQ,EACjC,WAAW,GAAG,SAAS,EACvB,OAAO,GAAG,kBAAkB,EAC5B,GAAG,SAAS,EACf,EACD,GAAG,KACH;AACA,IAAA,MAAM,WAAW,GAAmC,CAAC,KAAK,KAAI;AAC1D,QAAA,QAAQ,GAAG,EAAE,CAAC;AACd,QAAA,OAAO,GAAG,KAAK,CAAC;AACpB,KAAC;AAED,IAAA,MAAM,EACF,SAAS,EAAE,eAAe,EAC1B,cAAc,EAAE,oBAAoB,EACpC,iBAAiB,EAAE,uBAAuB,EAC1C,aAAa,EAAE,mBAAmB,GACrC,GAAG,aAAa;AAEjB,IAAA,QACI,KAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EAAA,cAAA,EACQ,UAAU,EACxB,QAAQ,EAAE,CAAC,EAAA,IACN,SAAS,KAAK,QAAQ,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,EAAA,GACpD,SAAS,EACb,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACT,MAAM,CAAC,SAAS,EAChB,eAAe,EACf,SAAS,EACT,QAAQ,IAAI,uBAAuB,EACnC,QAAQ,IAAI,iBAAiB,EAC7B;AACI,YAAA,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,QAAQ;SAClC,CACJ,EACD,OAAO,EAAE,WAAW,EAAA;AAEpB,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,mBAAmB,EAAE,aAAa,CAAC,EAAA,EAC9D,cAAc,CAAC,IAAI,CAAC,GAAG,YAAY,CAAC,IAAI,EAAE,EAAE,QAAQ,EAAE,CAAC,GAAG,IAAI,CAC7D;QAEN,KAAC,CAAA,aAAA,CAAA,cAAc,IACX,MAAM,EAAC,QAAQ,EACf,IAAI,EAAC,iBAAiB,EACtB,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,oBAAoB,EAAE,cAAc,EAAE;AAC9D,gBAAA,CAAC,MAAM,CAAC,aAAa,GAAG,QAAQ;aACnC,CAAC,EAAA,EAED,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,CAAC,GAAG,KAAK,CACrD;AAEhB,QAAA,aAAa,KACV,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,SAAS,EAAA;AAC5B,YAAA,KAAA,CAAA,aAAA,CAAC,SAAS,EACF,EAAA,GAAA,cAAc,EAClB,MAAM,EAAE,cAAc,EAAE,KAAK,GAAG,EAAE,GAAG,SAAS,EAC9C,MAAM,EAAE;AACJ,oBAAA,KAAK,EAAE,CAAC;AACR,oBAAA,KAAK,EAAE,sBAAsB,CAAC,OAAO,CAAC;iBACzC,EACD,eAAe,EAAE,kBAAkB,CAAC,WAAW,CAAC,EAAA,CAClD,CACA,CACT,CACO;AAEpB,CAAC,CACJ;AAEM,MAAM,GAAG,GAAG;;;;"}
+{"version":3,"file":"Component.js","sources":["../../../src/components/tab/Component.tsx"],"sourcesContent":["import React, {\n    cloneElement,\n    forwardRef,\n    type ForwardRefExoticComponent,\n    isValidElement,\n    type MouseEventHandler,\n    type RefAttributes,\n} from 'react';\nimport cn from 'classnames';\n\nimport { Indicator } from '@alfalab/core-components-indicator';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { INDICATOR_BG_COLOR, INDICATOR_BORDER_COLOR } from '../../consts';\nimport { type AllTabProps, type PublicTabProps } from '../../types';\n\nimport styles from './index.module.css';\n\nconst TabComponent = forwardRef<HTMLElement, AllTabProps>(\n    (\n        {\n            showIndicator,\n            indicatorProps,\n            label,\n            icon,\n            id,\n            selected,\n            onChange,\n            onClick,\n            tabClassNames = {},\n            dataTestId,\n            className,\n            labelClassName,\n            selectedClassName,\n            iconClassName,\n            href,\n            Component = href ? 'a' : 'button',\n            accentColor = 'primary',\n            bgColor = 'modal-bg-primary',\n            ...restProps\n        },\n        ref,\n    ) => {\n        const handleClick: MouseEventHandler<HTMLElement> = (event) => {\n            onChange?.(id);\n            onClick?.(event);\n        };\n\n        const {\n            className: commonClassName,\n            labelClassName: commonLabelClassName,\n            selectedClassName: commonSelectedClassName,\n            iconClassName: commonIconClassName,\n        } = tabClassNames;\n\n        return (\n            <Component\n                data-test-id={dataTestId}\n                tabIndex={0}\n                {...(Component === 'button' ? { type: 'button' } : null)}\n                {...restProps}\n                href={href}\n                id={id}\n                ref={ref}\n                className={cn(\n                    styles.component,\n                    commonClassName,\n                    className,\n                    selected && commonSelectedClassName,\n                    selected && selectedClassName,\n                    {\n                        [styles[accentColor]]: selected,\n                    },\n                )}\n                onClick={handleClick}\n            >\n                <div className={cn(styles.icon, commonIconClassName, iconClassName)}>\n                    {isValidElement<{ selected: unknown }>(icon)\n                        ? cloneElement(icon, { selected })\n                        : icon}\n                </div>\n\n                <TypographyText\n                    weight='medium'\n                    view='secondary-small'\n                    className={cn(styles.label, commonLabelClassName, labelClassName, {\n                        [styles.labelSelected]: selected,\n                    })}\n                >\n                    {isValidElement<{ selected: unknown }>(label)\n                        ? cloneElement(label, { selected })\n                        : label}\n                </TypographyText>\n\n                {showIndicator && (\n                    <div className={styles.indicator}>\n                        <Indicator\n                            {...indicatorProps}\n                            height={indicatorProps?.value ? 16 : undefined}\n                            border={{\n                                width: 2,\n                                color: INDICATOR_BORDER_COLOR[bgColor],\n                            }}\n                            backgroundColor={INDICATOR_BG_COLOR[accentColor]}\n                        />\n                    </div>\n                )}\n            </Component>\n        );\n    },\n);\n\nexport const Tab = TabComponent as ForwardRefExoticComponent<\n    PublicTabProps & RefAttributes<HTMLElement>\n>;\n"],"names":[],"mappings":";;;;;;;AAkBA,MAAM,YAAY,GAAG,UAAU,CAC3B,CACI,EACI,aAAa,EACb,cAAc,EACd,KAAK,EACL,IAAI,EACJ,EAAE,EACF,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,aAAa,GAAG,EAAE,EAClB,UAAU,EACV,SAAS,EACT,cAAc,EACd,iBAAiB,EACjB,aAAa,EACb,IAAI,EACJ,SAAS,GAAG,IAAI,GAAG,GAAG,GAAG,QAAQ,EACjC,WAAW,GAAG,SAAS,EACvB,OAAO,GAAG,kBAAkB,EAC5B,GAAG,SAAS,EACf,EACD,GAAG,KACH;AACA,IAAA,MAAM,WAAW,GAAmC,CAAC,KAAK,KAAI;AAC1D,QAAA,QAAQ,GAAG,EAAE,CAAC;AACd,QAAA,OAAO,GAAG,KAAK,CAAC;AACpB,KAAC;AAED,IAAA,MAAM,EACF,SAAS,EAAE,eAAe,EAC1B,cAAc,EAAE,oBAAoB,EACpC,iBAAiB,EAAE,uBAAuB,EAC1C,aAAa,EAAE,mBAAmB,GACrC,GAAG,aAAa;AAEjB,IAAA,QACI,KAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EAAA,cAAA,EACQ,UAAU,EACxB,QAAQ,EAAE,CAAC,EAAA,IACN,SAAS,KAAK,QAAQ,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,EAAA,GACpD,SAAS,EACb,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACT,MAAM,CAAC,SAAS,EAChB,eAAe,EACf,SAAS,EACT,QAAQ,IAAI,uBAAuB,EACnC,QAAQ,IAAI,iBAAiB,EAC7B;AACI,YAAA,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,QAAQ;SAClC,CACJ,EACD,OAAO,EAAE,WAAW,EAAA;AAEpB,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,mBAAmB,EAAE,aAAa,CAAC,EAAA,EAC9D,cAAc,CAAwB,IAAI;cACrC,YAAY,CAAC,IAAI,EAAE,EAAE,QAAQ,EAAE;cAC/B,IAAI,CACR;QAEN,KAAC,CAAA,aAAA,CAAA,cAAc,IACX,MAAM,EAAC,QAAQ,EACf,IAAI,EAAC,iBAAiB,EACtB,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,oBAAoB,EAAE,cAAc,EAAE;AAC9D,gBAAA,CAAC,MAAM,CAAC,aAAa,GAAG,QAAQ;AACnC,aAAA,CAAC,EAED,EAAA,cAAc,CAAwB,KAAK;cACtC,YAAY,CAAC,KAAK,EAAE,EAAE,QAAQ,EAAE;cAChC,KAAK,CACE;AAEhB,QAAA,aAAa,KACV,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,SAAS,EAAA;AAC5B,YAAA,KAAA,CAAA,aAAA,CAAC,SAAS,EACF,EAAA,GAAA,cAAc,EAClB,MAAM,EAAE,cAAc,EAAE,KAAK,GAAG,EAAE,GAAG,SAAS,EAC9C,MAAM,EAAE;AACJ,oBAAA,KAAK,EAAE,CAAC;AACR,oBAAA,KAAK,EAAE,sBAAsB,CAAC,OAAO,CAAC;iBACzC,EACD,eAAe,EAAE,kBAAkB,CAAC,WAAW,CAAC,EAAA,CAClD,CACA,CACT,CACO;AAEpB,CAAC,CACJ;AAEM,MAAM,GAAG,GAAG;;;;"}

package/moderncssm/types.d.ts

@@ -1,7 +1,7 @@
 import { type AllHTMLAttributes, type ElementType, type ForwardRefExoticComponent, type HTMLAttributes, type ReactElement, type ReactNode, type RefAttributes } from 'react';
 import { type IndicatorProps } from '@alfalab/core-components-indicator/moderncssm';
-export declare type AllTabProps = PublicTabProps & PrivateTabProps;
-declare type TabElementType = ReactElement<AllTabProps, ForwardRefExoticComponent<AllTabProps & RefAttributes<HTMLElement>>>;
+export type AllTabProps = PublicTabProps & PrivateTabProps;
+type TabElementType = ReactElement<AllTabProps, ForwardRefExoticComponent<AllTabProps & RefAttributes<HTMLElement>>>;
 export interface TabBarProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
     /**
      * Дополнительный класс

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alfalab/core-components-tab-bar",
-    "version": "4.0.2",
+    "version": "4.0.3",
     "description": "",
     "keywords": [],
     "license": "MIT",
@@ -10,9 +10,9 @@
     "main": "index.js",
     "module": "./esm/index.js",
     "dependencies": {
-        "@alfalab/core-components-indicator": "^4.0.1",
-        "@alfalab/core-components-shared": "^2.1.0",
-        "@alfalab/core-components-typography": "^6.0.2",
+        "@alfalab/core-components-indicator": "^4.0.2",
+        "@alfalab/core-components-shared": "^2.1.1",
+        "@alfalab/core-components-typography": "^6.0.3",
         "classnames": "^2.5.1",
         "tslib": "^2.4.0"
     },
@@ -24,6 +24,6 @@
         "access": "public",
         "directory": "dist"
     },
-    "themesVersion": "15.0.1",
-    "varsVersion": "11.0.1"
+    "themesVersion": "15.0.2",
+    "varsVersion": "11.0.2"
 }

package/src/components/tab/Component.tsx

@@ -75,7 +75,9 @@ const TabComponent = forwardRef<HTMLElement, AllTabProps>(
                 onClick={handleClick}
             >
                 <div className={cn(styles.icon, commonIconClassName, iconClassName)}>
-                    {isValidElement(icon) ? cloneElement(icon, { selected }) : icon}
+                    {isValidElement<{ selected: unknown }>(icon)
+                        ? cloneElement(icon, { selected })
+                        : icon}
                 </div>
 
                 <TypographyText
@@ -85,7 +87,9 @@ const TabComponent = forwardRef<HTMLElement, AllTabProps>(
                         [styles.labelSelected]: selected,
                     })}
                 >
-                    {isValidElement(label) ? cloneElement(label, { selected }) : label}
+                    {isValidElement<{ selected: unknown }>(label)
+                        ? cloneElement(label, { selected })
+                        : label}
                 </TypographyText>
 
                 {showIndicator && (

package/src/components/tab/index.module.css

@@ -1,4 +1,4 @@
-@import '@alfalab/core-components-vars/src/no-typography-index.css';
+@import '@alfalab/core-components-vars/src/index.css';
 
 .component {
     @mixin button-reset;

package/src/index.module.css

@@ -1,4 +1,4 @@
-@import '@alfalab/core-components-vars/src/no-typography-index.css';
+@import '@alfalab/core-components-vars/src/index.css';
 @import '@alfalab/core-components-vars/src/safe-area.css';
 
 .component {

package/types.d.ts

@@ -1,7 +1,7 @@
 import { type AllHTMLAttributes, type ElementType, type ForwardRefExoticComponent, type HTMLAttributes, type ReactElement, type ReactNode, type RefAttributes } from 'react';
 import { type IndicatorProps } from '@alfalab/core-components-indicator';
-export declare type AllTabProps = PublicTabProps & PrivateTabProps;
-declare type TabElementType = ReactElement<AllTabProps, ForwardRefExoticComponent<AllTabProps & RefAttributes<HTMLElement>>>;
+export type AllTabProps = PublicTabProps & PrivateTabProps;
+type TabElementType = ReactElement<AllTabProps, ForwardRefExoticComponent<AllTabProps & RefAttributes<HTMLElement>>>;
 export interface TabBarProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
     /**
      * Дополнительный класс