@alfalab/core-components-tabs 9.1.0 → 9.2.0

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

@@ -1,3 +1,3 @@
 import React from 'react';
-import { TabListProps } from '../../typings';
+import { type TabListProps } from '../../typings';
 export declare const CollapsiblePrimaryTabList: ({ size, className, containerClassName, titles, selectedId, collapsedTabsIds, fullWidthScroll, onChange, dataTestId, breakpoint, client, defaultMatchMediaValue, textStyle, showSkeleton, skeletonProps, }: TabListProps) => React.JSX.Element;

package/components/primary-tablist/Component.collapsible.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.collapsible.js","sources":["../../src/components/primary-tablist/Component.collapsible.tsx"],"sourcesContent":["import React, { Ref, useEffect, useMemo, useRef } from 'react';\nimport cn from 'classnames';\n\nimport { Badge } from '@alfalab/core-components-badge';\nimport { KeyboardFocusable } from '@alfalab/core-components-keyboard-focusable';\nimport {\n    PickerButtonDesktop,\n    PickerButtonDesktopProps,\n} from '@alfalab/core-components-picker-button/desktop';\n\nimport { useTablistTitles } from '../../hooks/use-tablist-titles';\nimport { createSyntheticMouseEvent } from '../../synthetic-events';\nimport { TabListProps } from '../../typings';\nimport { Title } from '../title';\n\nimport styles from './index.module.css';\n\nexport const CollapsiblePrimaryTabList = ({\n    size = 'm',\n    className,\n    containerClassName,\n    titles = [],\n    selectedId = titles.length ? titles[0].id : undefined,\n    collapsedTabsIds,\n    fullWidthScroll,\n    onChange,\n    dataTestId,\n    breakpoint,\n    client,\n    defaultMatchMediaValue,\n    textStyle,\n    showSkeleton,\n    skeletonProps,\n}: TabListProps) => {\n    const lineRef = useRef<HTMLDivElement>(null);\n\n    const { containerRef, addonRef, tablistTitles, selectedTab, getTabListItemProps } =\n        useTablistTitles({\n            titles,\n            selectedId,\n            collapsedTabsIds,\n            onChange,\n            breakpoint,\n            client,\n            defaultMatchMediaValue,\n        });\n\n    useEffect(() => {\n        if (selectedTab && lineRef.current) {\n            lineRef.current.style.width = `${selectedTab.offsetWidth}px`;\n            lineRef.current.style.transform = `translateX(${selectedTab.offsetLeft}px)`;\n        }\n    }, [selectedTab, tablistTitles]);\n\n    const collapsedOptions = useMemo(\n        () =>\n            tablistTitles.reduce<PickerButtonDesktopProps['options']>(\n                (options, { toggleRef, ...title }) => {\n                    if (title.collapsed) {\n                        options.push({\n                            key: String(title.id),\n                            value: title.id,\n                            content: (\n                                <Title\n                                    {...title}\n                                    ref={toggleRef as Ref<HTMLButtonElement>}\n                                    styles={styles}\n                                    isOption={true}\n                                />\n                            ),\n                        });\n                    }\n\n                    return options;\n                },\n                [],\n            ),\n        [tablistTitles],\n    );\n\n    const collapsedAddonsLength = tablistTitles.filter(\n        (title) => title.collapsed && title.rightAddons,\n    ).length;\n\n    const handleOptionsChange = (\n        payload: Parameters<Required<PickerButtonDesktopProps>['onChange']>[0],\n    ) => {\n        if (payload.selected?.value && onChange) {\n            const nativeMouseEvent = new MouseEvent('change');\n            const syntheticMouseEvent = createSyntheticMouseEvent(nativeMouseEvent);\n\n            onChange(syntheticMouseEvent, { selectedId: payload.selected.value });\n        }\n    };\n\n    const renderContent = () => (\n        <div\n            role='tablist'\n            data-test-id={dataTestId}\n            className={cn(styles.component, className, !textStyle && size && styles[size], {\n                [styles.fullWidthScroll]: fullWidthScroll,\n            })}\n        >\n            {tablistTitles.map(({ dataTestId: _, toggleRef: __, ...restTitleProps }, index) => (\n                <KeyboardFocusable key={restTitleProps.id}>\n                    {(ref, focused) => (\n                        <Title\n                            {...getTabListItemProps(index, ref)}\n                            {...restTitleProps}\n                            focused={focused}\n                            styles={styles}\n                            showSkeleton={showSkeleton}\n                            skeletonProps={skeletonProps}\n                        />\n                    )}\n                </KeyboardFocusable>\n            ))}\n\n            {collapsedOptions.length ? (\n                <span ref={addonRef} role='menu' className={styles.pickerWrapper}>\n                    <PickerButtonDesktop\n                        fieldClassName={styles.title}\n                        optionClassName={cn(size && styles[size])}\n                        options={collapsedOptions}\n                        onChange={handleOptionsChange}\n                        rightAddons={\n                            collapsedAddonsLength ? (\n                                <Badge view='count' content={collapsedAddonsLength} />\n                            ) : null\n                        }\n                        size='m'\n                        view='text'\n                        label='Ещё'\n                        popoverPosition='bottom-end'\n                        disabled={showSkeleton}\n                    />\n                </span>\n            ) : null}\n\n            <div className={styles.line} ref={lineRef} />\n        </div>\n    );\n\n    return (\n        <div\n            ref={containerRef}\n            className={cn(\n                styles.container,\n                textStyle && styles[textStyle],\n                styles.desktop,\n                containerClassName,\n            )}\n        >\n            {renderContent()}\n        </div>\n    );\n};\n"],"names":["useRef","useTablistTitles","useEffect","useMemo","__rest","React","Title","__assign","styles","createSyntheticMouseEvent","cn","KeyboardFocusable","PickerButtonDesktop","Badge"],"mappings":";;;;;;;;;;;;;;;;;;;;AAiBO,IAAM,yBAAyB,GAAG,UAAC,EAgB3B,EAAA;AAfX,IAAA,IAAA,EAAA,GAAA,EAAA,CAAA,IAAU,EAAV,IAAI,GAAG,EAAA,KAAA,MAAA,GAAA,GAAG,KAAA,EACV,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,kBAAkB,GAAA,EAAA,CAAA,kBAAA,EAClB,EAAA,GAAA,EAAA,CAAA,MAAW,EAAX,MAAM,GAAA,EAAA,KAAA,MAAA,GAAG,EAAE,GAAA,EAAA,EACX,EAAA,GAAA,EAAA,CAAA,UAAqD,EAArD,UAAU,mBAAG,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,GAAG,SAAS,GAAA,EAAA,EACrD,gBAAgB,GAAA,EAAA,CAAA,gBAAA,EAChB,eAAe,GAAA,EAAA,CAAA,eAAA,EACf,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,sBAAsB,GAAA,EAAA,CAAA,sBAAA,EACtB,SAAS,eAAA,EACT,YAAY,GAAA,EAAA,CAAA,YAAA,EACZ,aAAa,GAAA,EAAA,CAAA,aAAA;AAEb,IAAA,IAAM,OAAO,GAAGA,YAAM,CAAiB,IAAI,CAAC;IAEtC,IAAA,EAAA,GACFC,iCAAgB,CAAC;AACb,QAAA,MAAM,EAAA,MAAA;AACN,QAAA,UAAU,EAAA,UAAA;AACV,QAAA,gBAAgB,EAAA,gBAAA;AAChB,QAAA,QAAQ,EAAA,QAAA;AACR,QAAA,UAAU,EAAA,UAAA;AACV,QAAA,MAAM,EAAA,MAAA;AACN,QAAA,sBAAsB,EAAA,sBAAA;AACzB,KAAA,CAAC,EATE,YAAY,GAAA,EAAA,CAAA,YAAA,EAAE,QAAQ,GAAA,EAAA,CAAA,QAAA,EAAE,aAAa,GAAA,EAAA,CAAA,aAAA,EAAE,WAAW,GAAA,EAAA,CAAA,WAAA,EAAE,mBAAmB,yBASzE;AAEN,IAAAC,eAAS,CAAC,YAAA;AACN,QAAA,IAAI,WAAW,IAAI,OAAO,CAAC,OAAO,EAAE;AAChC,YAAA,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,EAAA,CAAA,MAAA,CAAG,WAAW,CAAC,WAAW,EAAA,IAAA,CAAI;AAC5D,YAAA,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,aAAA,CAAA,MAAA,CAAc,WAAW,CAAC,UAAU,EAAA,KAAA,CAAK;AAC9E;AACL,KAAC,EAAE,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;IAEhC,IAAM,gBAAgB,GAAGC,aAAO,CAC5B,YAAA;AACI,QAAA,OAAA,aAAa,CAAC,MAAM,CAChB,UAAC,OAAO,EAAE,EAAuB,EAAA;AAArB,YAAA,IAAA,SAAS,GAAA,EAAA,CAAA,SAAA,EAAK,KAAK,GAAAC,YAAA,CAAA,EAAA,EAArB,aAAuB,CAAF;YAC3B,IAAI,KAAK,CAAC,SAAS,EAAE;gBACjB,OAAO,CAAC,IAAI,CAAC;AACT,oBAAA,GAAG,EAAE,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC;oBACrB,KAAK,EAAE,KAAK,CAAC,EAAE;AACf,oBAAA,OAAO,GACHC,sBAAA,CAAA,aAAA,CAACC,eAAK,EACEC,cAAA,CAAA,EAAA,EAAA,KAAK,IACT,GAAG,EAAE,SAAmC,EACxC,MAAM,EAAEC,YAAM,EACd,QAAQ,EAAE,IAAI,IAChB,CACL;AACJ,iBAAA,CAAC;AACL;AAED,YAAA,OAAO,OAAO;SACjB,EACD,EAAE,CACL;AApBD,KAoBC,EACL,CAAC,aAAa,CAAC,CAClB;IAED,IAAM,qBAAqB,GAAG,aAAa,CAAC,MAAM,CAC9C,UAAC,KAAK,EAAA,EAAK,OAAA,KAAK,CAAC,SAAS,IAAI,KAAK,CAAC,WAAW,GAAA,CAClD,CAAC,MAAM;IAER,IAAM,mBAAmB,GAAG,UACxB,OAAsE,EAAA;;QAEtE,IAAI,CAAA,MAAA,OAAO,CAAC,QAAQ,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,KAAK,KAAI,QAAQ,EAAE;AACrC,YAAA,IAAM,gBAAgB,GAAG,IAAI,UAAU,CAAC,QAAQ,CAAC;AACjD,YAAA,IAAM,mBAAmB,GAAGC,yCAAyB,CAAC,gBAAgB,CAAC;AAEvE,YAAA,QAAQ,CAAC,mBAAmB,EAAE,EAAE,UAAU,EAAE,OAAO,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;AACxE;AACL,KAAC;AAED,IAAA,IAAM,aAAa,GAAG,YAAA;;QAAM,QACxBJ,sBACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,IAAI,EAAC,SAAS,EACA,cAAA,EAAA,UAAU,EACxB,SAAS,EAAEK,mBAAE,CAACF,YAAM,CAAC,SAAS,EAAE,SAAS,EAAE,CAAC,SAAS,IAAI,IAAI,IAAIA,YAAM,CAAC,IAAI,CAAC,GAAA,EAAA,GAAA,EAAA;AACzE,gBAAA,EAAA,CAACA,YAAM,CAAC,eAAe,CAAA,GAAG,eAAe;AAC3C,gBAAA,EAAA,EAAA,EAAA;AAED,YAAA,aAAa,CAAC,GAAG,CAAC,UAAC,EAAmD,EAAE,KAAK,EAAA;6BAA3C,CAAa,aAAE,CAAK,KAAA,cAAc,GAAjDJ,YAAA,CAAA,EAAA,EAAA,CAAA,YAAA,EAAA,WAAA,CAAmD;gBAAY,QAC/EC,qCAACM,iDAAiB,EAAA,EAAC,GAAG,EAAE,cAAc,CAAC,EAAE,EACpC,EAAA,UAAC,GAAG,EAAE,OAAO,EAAK,EAAA,QACfN,sBAAA,CAAA,aAAA,CAACC,eAAK,EACEC,cAAA,CAAA,EAAA,EAAA,mBAAmB,CAAC,KAAK,EAAE,GAAG,CAAC,EAC/B,cAAc,IAClB,OAAO,EAAE,OAAO,EAChB,MAAM,EAAEC,YAAM,EACd,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,aAAa,EAAA,CAAA,CAC9B,EARa,EASlB,CACe;aACvB,CAAC;AAED,YAAA,gBAAgB,CAAC,MAAM,IACpBH,+CAAM,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAC,MAAM,EAAC,SAAS,EAAEG,YAAM,CAAC,aAAa,EAAA;AAC5D,gBAAAH,sBAAA,CAAA,aAAA,CAACO,2BAAmB,EAChB,EAAA,cAAc,EAAEJ,YAAM,CAAC,KAAK,EAC5B,eAAe,EAAEE,mBAAE,CAAC,IAAI,IAAIF,YAAM,CAAC,IAAI,CAAC,CAAC,EACzC,OAAO,EAAE,gBAAgB,EACzB,QAAQ,EAAE,mBAAmB,EAC7B,WAAW,EACP,qBAAqB,IACjBH,qCAACQ,yBAAK,EAAA,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,qBAAqB,GAAI,IACtD,IAAI,EAEZ,IAAI,EAAC,GAAG,EACR,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,oBAAK,EACX,eAAe,EAAC,YAAY,EAC5B,QAAQ,EAAE,YAAY,EACxB,CAAA,CACC,IACP,IAAI;YAERR,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEG,YAAM,CAAC,IAAI,EAAE,GAAG,EAAE,OAAO,EAAI,CAAA,CAC3C;AA7CkB,KA8C3B;AAED,IAAA,QACIH,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACI,GAAG,EAAE,YAAY,EACjB,SAAS,EAAEK,mBAAE,CACTF,YAAM,CAAC,SAAS,EAChB,SAAS,IAAIA,YAAM,CAAC,SAAS,CAAC,EAC9BA,YAAM,CAAC,OAAO,EACd,kBAAkB,CACrB,EAEA,EAAA,aAAa,EAAE,CACd;AAEd;;;;"}
+{"version":3,"file":"Component.collapsible.js","sources":["../../src/components/primary-tablist/Component.collapsible.tsx"],"sourcesContent":["import React, { type Ref, useEffect, useMemo, useRef } from 'react';\nimport cn from 'classnames';\n\nimport { Badge } from '@alfalab/core-components-badge';\nimport { KeyboardFocusable } from '@alfalab/core-components-keyboard-focusable';\nimport {\n    PickerButtonDesktop,\n    type PickerButtonDesktopProps,\n} from '@alfalab/core-components-picker-button/desktop';\n\nimport { useTablistTitles } from '../../hooks/use-tablist-titles';\nimport { createSyntheticMouseEvent } from '../../synthetic-events';\nimport { type TabListProps } from '../../typings';\nimport { Title } from '../title';\n\nimport styles from './index.module.css';\n\nexport const CollapsiblePrimaryTabList = ({\n    size = 'm',\n    className,\n    containerClassName,\n    titles = [],\n    selectedId = titles.length ? titles[0].id : undefined,\n    collapsedTabsIds,\n    fullWidthScroll,\n    onChange,\n    dataTestId,\n    breakpoint,\n    client,\n    defaultMatchMediaValue,\n    textStyle,\n    showSkeleton,\n    skeletonProps,\n}: TabListProps) => {\n    const lineRef = useRef<HTMLDivElement>(null);\n\n    const { containerRef, addonRef, tablistTitles, selectedTab, getTabListItemProps } =\n        useTablistTitles({\n            titles,\n            selectedId,\n            collapsedTabsIds,\n            onChange,\n            breakpoint,\n            client,\n            defaultMatchMediaValue,\n        });\n\n    useEffect(() => {\n        if (selectedTab && lineRef.current) {\n            lineRef.current.style.width = `${selectedTab.offsetWidth}px`;\n            lineRef.current.style.transform = `translateX(${selectedTab.offsetLeft}px)`;\n        }\n    }, [selectedTab, tablistTitles]);\n\n    const collapsedOptions = useMemo(\n        () =>\n            tablistTitles.reduce<PickerButtonDesktopProps['options']>(\n                (options, { toggleRef, ...title }) => {\n                    if (title.collapsed) {\n                        options.push({\n                            key: String(title.id),\n                            value: title.id,\n                            content: (\n                                <Title\n                                    {...title}\n                                    ref={toggleRef as Ref<HTMLButtonElement>}\n                                    styles={styles}\n                                    isOption={true}\n                                />\n                            ),\n                        });\n                    }\n\n                    return options;\n                },\n                [],\n            ),\n        [tablistTitles],\n    );\n\n    const collapsedAddonsLength = tablistTitles.filter(\n        (title) => title.collapsed && title.rightAddons,\n    ).length;\n\n    const handleOptionsChange = (\n        payload: Parameters<Required<PickerButtonDesktopProps>['onChange']>[0],\n    ) => {\n        if (payload.selected?.value && onChange) {\n            const nativeMouseEvent = new MouseEvent('change');\n            const syntheticMouseEvent = createSyntheticMouseEvent(nativeMouseEvent);\n\n            onChange(syntheticMouseEvent, { selectedId: payload.selected.value });\n        }\n    };\n\n    const renderContent = () => (\n        <div\n            role='tablist'\n            data-test-id={dataTestId}\n            className={cn(styles.component, className, !textStyle && size && styles[size], {\n                [styles.fullWidthScroll]: fullWidthScroll,\n            })}\n        >\n            {tablistTitles.map(({ dataTestId: _, toggleRef: __, ...restTitleProps }, index) => (\n                <KeyboardFocusable key={restTitleProps.id}>\n                    {(ref, focused) => (\n                        <Title\n                            {...getTabListItemProps(index, ref)}\n                            {...restTitleProps}\n                            focused={focused}\n                            styles={styles}\n                            showSkeleton={showSkeleton}\n                            skeletonProps={skeletonProps}\n                        />\n                    )}\n                </KeyboardFocusable>\n            ))}\n\n            {collapsedOptions.length ? (\n                <span ref={addonRef} role='menu' className={styles.pickerWrapper}>\n                    <PickerButtonDesktop\n                        fieldClassName={styles.title}\n                        optionClassName={cn(size && styles[size])}\n                        options={collapsedOptions}\n                        onChange={handleOptionsChange}\n                        rightAddons={\n                            collapsedAddonsLength ? (\n                                <Badge view='count' content={collapsedAddonsLength} />\n                            ) : null\n                        }\n                        size='m'\n                        view='text'\n                        label='Ещё'\n                        popoverPosition='bottom-end'\n                        disabled={showSkeleton}\n                    />\n                </span>\n            ) : null}\n\n            <div className={styles.line} ref={lineRef} />\n        </div>\n    );\n\n    return (\n        <div\n            ref={containerRef}\n            className={cn(\n                styles.container,\n                textStyle && styles[textStyle],\n                styles.desktop,\n                containerClassName,\n            )}\n        >\n            {renderContent()}\n        </div>\n    );\n};\n"],"names":["useRef","useTablistTitles","useEffect","useMemo","__rest","React","Title","__assign","styles","createSyntheticMouseEvent","cn","KeyboardFocusable","PickerButtonDesktop","Badge"],"mappings":"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"}

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

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

package/components/primary-tablist/Component.desktop.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-import { TabListProps } from '../../typings';
+import { type TabListProps } from '../../typings';
 export declare const PrimaryTabListDesktop: ({ size, ...restProps }: TabListProps) => React.JSX.Element;

package/components/primary-tablist/Component.desktop.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.desktop.js","sources":["../../src/components/primary-tablist/Component.desktop.tsx"],"sourcesContent":["import React from 'react';\n\nimport { TabListProps } from '../../typings';\n\nimport { PrimaryTabList } from './Component';\n\nimport styles from './index.module.css';\n\nexport const PrimaryTabListDesktop = ({ size = 'm', ...restProps }: TabListProps) => (\n    <PrimaryTabList {...restProps} size={size} styles={styles} platform='desktop' />\n);\n"],"names":["__rest","React","PrimaryTabList","styles"],"mappings":";;;;;;;;;;;;;AAQO,IAAM,qBAAqB,GAAG,UAAC,EAA0C,EAAA;IAAxC,IAAA,EAAA,GAAA,EAAA,CAAA,IAAU,EAAV,IAAI,GAAG,EAAA,KAAA,MAAA,GAAA,GAAG,KAAA,EAAK,SAAS,GAA1BA,YAAA,CAAA,EAAA,EAAA,CAAA,MAAA,CAA4B,CAAF;AAAqB,IAAA,QACjFC,sBAAC,CAAA,aAAA,CAAAC,wBAAc,qBAAK,SAAS,EAAA,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAEC,YAAM,EAAE,QAAQ,EAAC,SAAS,EAAA,CAAA,CAAG;;;;;"}
+{"version":3,"file":"Component.desktop.js","sources":["../../src/components/primary-tablist/Component.desktop.tsx"],"sourcesContent":["import React from 'react';\n\nimport { type TabListProps } from '../../typings';\n\nimport { PrimaryTabList } from './Component';\n\nimport styles from './index.module.css';\n\nexport const PrimaryTabListDesktop = ({ size = 'm', ...restProps }: TabListProps) => (\n    <PrimaryTabList {...restProps} size={size} styles={styles} platform='desktop' />\n);\n"],"names":["__rest","React","PrimaryTabList","styles"],"mappings":";;;;;;;;;;;;;AAQO,IAAM,qBAAqB,GAAG,UAAC,EAA0C,EAAA;IAAxC,IAAA,EAAA,GAAA,EAAA,CAAA,IAAU,EAAV,IAAI,GAAG,EAAA,KAAA,MAAA,GAAA,GAAG,KAAA,EAAK,SAAS,GAA1BA,YAAA,CAAA,EAAA,EAAA,CAAA,MAAA,CAA4B,CAAF;AAAqB,IAAA,QACjFC,sBAAC,CAAA,aAAA,CAAAC,wBAAc,qBAAK,SAAS,EAAA,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAEC,YAAM,EAAE,QAAQ,EAAC,SAAS,EAAA,CAAA,CAAG;;;;;"}

package/components/primary-tablist/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../src/components/primary-tablist/Component.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef } from 'react';\nimport { ResizeObserver as ResizeObserverPolyfill } from '@juggle/resize-observer';\nimport cn from 'classnames';\n\nimport { KeyboardFocusable } from '@alfalab/core-components-keyboard-focusable';\nimport { fnUtils } from '@alfalab/core-components-shared';\n\nimport { useTabs } from '../../hooks/use-tabs';\nimport { PlatformProps, Styles, TabListProps } from '../../typings';\nimport { ScrollableContainer } from '../scrollable-container';\nimport { Title } from '../title';\n\nexport const PrimaryTabList = ({\n    size,\n    styles = {},\n    className,\n    containerClassName,\n    titles = [],\n    selectedId = titles.length ? titles[0].id : undefined,\n    scrollable = true,\n    fullWidthScroll,\n    onChange,\n    dataTestId,\n    platform,\n    textStyle,\n    inlineStyle,\n    showSkeleton,\n    skeletonProps,\n}: TabListProps & Styles & PlatformProps) => {\n    const lineRef = useRef<HTMLDivElement>(null);\n\n    const { selectedTab, focusedTab, getTabListItemProps } = useTabs({\n        titles,\n        selectedId,\n        onChange,\n    });\n\n    // расчет размера и положения нижней полосы\n    useEffect(() => {\n        if (selectedTab) {\n            const updateLineWidth = () => {\n                if (lineRef.current) {\n                    lineRef.current.style.width = `${selectedTab.offsetWidth}px`;\n                    lineRef.current.style.transform = `translateX(${selectedTab.offsetLeft}px)`;\n                }\n            };\n\n            const ResizeObserver = window.ResizeObserver || ResizeObserverPolyfill;\n            const observer = new ResizeObserver(updateLineWidth);\n\n            observer.observe(selectedTab);\n\n            return () => observer.disconnect();\n        }\n\n        return fnUtils.noop;\n    }, [selectedTab, titles]);\n\n    const handleTitleResize = useCallback(() => {\n        if (selectedTab && lineRef.current) {\n            lineRef.current.style.width = `${selectedTab.offsetWidth}px`;\n            lineRef.current.style.transform = `translateX(${selectedTab.offsetLeft}px)`;\n        }\n    }, [selectedTab]);\n\n    const renderContent = () => (\n        <div\n            role='tablist'\n            data-test-id={dataTestId}\n            className={cn(styles.component, className, !textStyle && size && styles[size], {\n                [styles.fullWidthScroll]: fullWidthScroll,\n            })}\n        >\n            {titles.map(({ dataTestId: _, toggleRef: __, ...restTitleProps }, index) => (\n                <KeyboardFocusable key={restTitleProps.id}>\n                    {(ref, focused) => (\n                        <Title\n                            {...getTabListItemProps(index, ref)}\n                            {...restTitleProps}\n                            focused={focused}\n                            styles={styles}\n                            showSkeleton={showSkeleton}\n                            skeletonProps={skeletonProps}\n                            onResize={handleTitleResize}\n                        />\n                    )}\n                </KeyboardFocusable>\n            ))}\n\n            <div className={styles.line} ref={lineRef} />\n        </div>\n    );\n\n    const wrapperClassName = cn(textStyle && styles[textStyle], styles[platform]);\n\n    return scrollable ? (\n        <ScrollableContainer\n            containerWrapperClassName={wrapperClassName}\n            activeChild={focusedTab || selectedTab}\n            containerClassName={containerClassName}\n            scrollControlsClassName={cn(textStyle && styles.scrollControls)}\n            fullWidthScroll={fullWidthScroll}\n            view='primary'\n            size={textStyle ? undefined : size}\n            platform={platform}\n            inlineStyle={inlineStyle}\n            showSkeleton={showSkeleton}\n        >\n            {renderContent()}\n        </ScrollableContainer>\n    ) : (\n        <div\n            className={cn(styles.container, wrapperClassName, containerClassName)}\n            style={inlineStyle}\n        >\n            {renderContent()}\n        </div>\n    );\n};\n"],"names":["useRef","useTabs","useEffect","ResizeObserverPolyfill","fnUtils","useCallback","React","cn","__rest","KeyboardFocusable","Title","__assign","ScrollableContainer"],"mappings":"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"}
+{"version":3,"file":"Component.js","sources":["../../src/components/primary-tablist/Component.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef } from 'react';\nimport { ResizeObserver as ResizeObserverPolyfill } from '@juggle/resize-observer';\nimport cn from 'classnames';\n\nimport { KeyboardFocusable } from '@alfalab/core-components-keyboard-focusable';\nimport { fnUtils } from '@alfalab/core-components-shared';\n\nimport { useTabs } from '../../hooks/use-tabs';\nimport { type PlatformProps, type Styles, type TabListProps } from '../../typings';\nimport { ScrollableContainer } from '../scrollable-container';\nimport { Title } from '../title';\n\nexport const PrimaryTabList = ({\n    size,\n    styles = {},\n    className,\n    containerClassName,\n    titles = [],\n    selectedId = titles.length ? titles[0].id : undefined,\n    scrollable = true,\n    fullWidthScroll,\n    onChange,\n    dataTestId,\n    platform,\n    textStyle,\n    inlineStyle,\n    showSkeleton,\n    skeletonProps,\n}: TabListProps & Styles & PlatformProps) => {\n    const lineRef = useRef<HTMLDivElement>(null);\n\n    const { selectedTab, focusedTab, getTabListItemProps } = useTabs({\n        titles,\n        selectedId,\n        onChange,\n    });\n\n    // расчет размера и положения нижней полосы\n    useEffect(() => {\n        if (selectedTab) {\n            const updateLineWidth = () => {\n                if (lineRef.current) {\n                    lineRef.current.style.width = `${selectedTab.offsetWidth}px`;\n                    lineRef.current.style.transform = `translateX(${selectedTab.offsetLeft}px)`;\n                }\n            };\n\n            const ResizeObserver = window.ResizeObserver || ResizeObserverPolyfill;\n            const observer = new ResizeObserver(updateLineWidth);\n\n            observer.observe(selectedTab);\n\n            return () => observer.disconnect();\n        }\n\n        return fnUtils.noop;\n    }, [selectedTab, titles]);\n\n    const handleTitleResize = useCallback(() => {\n        if (selectedTab && lineRef.current) {\n            lineRef.current.style.width = `${selectedTab.offsetWidth}px`;\n            lineRef.current.style.transform = `translateX(${selectedTab.offsetLeft}px)`;\n        }\n    }, [selectedTab]);\n\n    const renderContent = () => (\n        <div\n            role='tablist'\n            data-test-id={dataTestId}\n            className={cn(styles.component, className, !textStyle && size && styles[size], {\n                [styles.fullWidthScroll]: fullWidthScroll,\n            })}\n        >\n            {titles.map(({ dataTestId: _, toggleRef: __, ...restTitleProps }, index) => (\n                <KeyboardFocusable key={restTitleProps.id}>\n                    {(ref, focused) => (\n                        <Title\n                            {...getTabListItemProps(index, ref)}\n                            {...restTitleProps}\n                            focused={focused}\n                            styles={styles}\n                            showSkeleton={showSkeleton}\n                            skeletonProps={skeletonProps}\n                            onResize={handleTitleResize}\n                        />\n                    )}\n                </KeyboardFocusable>\n            ))}\n\n            <div className={styles.line} ref={lineRef} />\n        </div>\n    );\n\n    const wrapperClassName = cn(textStyle && styles[textStyle], styles[platform]);\n\n    return scrollable ? (\n        <ScrollableContainer\n            containerWrapperClassName={wrapperClassName}\n            activeChild={focusedTab || selectedTab}\n            containerClassName={containerClassName}\n            scrollControlsClassName={cn(textStyle && styles.scrollControls)}\n            fullWidthScroll={fullWidthScroll}\n            view='primary'\n            size={textStyle ? undefined : size}\n            platform={platform}\n            inlineStyle={inlineStyle}\n            showSkeleton={showSkeleton}\n        >\n            {renderContent()}\n        </ScrollableContainer>\n    ) : (\n        <div\n            className={cn(styles.container, wrapperClassName, containerClassName)}\n            style={inlineStyle}\n        >\n            {renderContent()}\n        </div>\n    );\n};\n"],"names":["useRef","useTabs","useEffect","ResizeObserverPolyfill","fnUtils","useCallback","React","cn","__rest","KeyboardFocusable","Title","__assign","ScrollableContainer"],"mappings":"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"}

package/components/primary-tablist/Component.mobile.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { TabListProps } from '../../typings';
+import { type TabListProps } from '../../typings';
 export declare type PrimaryTabListMobileProps = Omit<TabListProps, 'size' | 'collapsedTabsIds'>;
 export declare const PrimaryTabListMobile: (props: PrimaryTabListMobileProps) => React.JSX.Element;

package/components/primary-tablist/Component.mobile.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.mobile.js","sources":["../../src/components/primary-tablist/Component.mobile.tsx"],"sourcesContent":["import React from 'react';\n\nimport { TabListProps } from '../../typings';\n\nimport { PrimaryTabList } from './Component';\n\nimport commonStyles from './index.module.css';\nimport mobileStyles from './mobile.module.css';\n\nconst styles = {\n    ...commonStyles,\n    ...mobileStyles,\n};\n\nexport type PrimaryTabListMobileProps = Omit<TabListProps, 'size' | 'collapsedTabsIds'>;\n\nexport const PrimaryTabListMobile = (props: PrimaryTabListMobileProps) => (\n    <PrimaryTabList {...props} styles={styles} platform='mobile' />\n);\n"],"names":["__assign","commonStyles","mobileStyles","React","PrimaryTabList"],"mappings":";;;;;;;;;;;;;;AASA,IAAM,MAAM,GACLA,cAAA,CAAAA,cAAA,CAAA,EAAA,EAAAC,YAAY,CACZ,EAAAC,aAAY,CAClB;AAIY,IAAA,oBAAoB,GAAG,UAAC,KAAgC,EAAK,EAAA,QACtEC,sBAAA,CAAA,aAAA,CAACC,wBAAc,EAAAJ,cAAA,CAAA,EAAA,EAAK,KAAK,EAAE,EAAA,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAC,QAAQ,EAAG,CAAA,CAAA,EADO;;;;"}
+{"version":3,"file":"Component.mobile.js","sources":["../../src/components/primary-tablist/Component.mobile.tsx"],"sourcesContent":["import React from 'react';\n\nimport { type TabListProps } from '../../typings';\n\nimport { PrimaryTabList } from './Component';\n\nimport commonStyles from './index.module.css';\nimport mobileStyles from './mobile.module.css';\n\nconst styles = {\n    ...commonStyles,\n    ...mobileStyles,\n};\n\nexport type PrimaryTabListMobileProps = Omit<TabListProps, 'size' | 'collapsedTabsIds'>;\n\nexport const PrimaryTabListMobile = (props: PrimaryTabListMobileProps) => (\n    <PrimaryTabList {...props} styles={styles} platform='mobile' />\n);\n"],"names":["__assign","commonStyles","mobileStyles","React","PrimaryTabList"],"mappings":";;;;;;;;;;;;;;AASA,IAAM,MAAM,GACLA,cAAA,CAAAA,cAAA,CAAA,EAAA,EAAAC,YAAY,CACZ,EAAAC,aAAY,CAClB;AAIY,IAAA,oBAAoB,GAAG,UAAC,KAAgC,EAAK,EAAA,QACtEC,sBAAA,CAAA,aAAA,CAACC,wBAAc,EAAAJ,cAAA,CAAA,EAAA,EAAK,KAAK,EAAE,EAAA,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAC,QAAQ,EAAG,CAAA,CAAA,EADO;;;;"}

package/components/primary-tablist/Component.responsive.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-import { TabListProps } from '../../typings';
+import { type TabListProps } from '../../typings';
 export declare const PrimaryTabListResponsive: ({ size, breakpoint, client, fullWidthScroll, defaultMatchMediaValue, ...restProps }: TabListProps) => React.JSX.Element;

package/components/primary-tablist/Component.responsive.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.responsive.js","sources":["../../src/components/primary-tablist/Component.responsive.tsx"],"sourcesContent":["import React from 'react';\n\nimport { useIsDesktop } from '@alfalab/core-components-mq';\n\nimport { TabListProps } from '../../typings';\n\nimport { PrimaryTabListDesktop } from './Component.desktop';\nimport { PrimaryTabListMobile } from './Component.mobile';\n\nexport const PrimaryTabListResponsive = ({\n    size,\n    breakpoint,\n    client,\n    fullWidthScroll,\n    defaultMatchMediaValue = client === undefined ? undefined : client === 'desktop',\n    ...restProps\n}: TabListProps) => {\n    const isDesktop = useIsDesktop(breakpoint, defaultMatchMediaValue);\n\n    return isDesktop ? (\n        <PrimaryTabListDesktop\n            breakpoint={breakpoint}\n            size={size}\n            defaultMatchMediaValue={defaultMatchMediaValue}\n            {...restProps}\n        />\n    ) : (\n        <PrimaryTabListMobile\n            breakpoint={breakpoint}\n            defaultMatchMediaValue={defaultMatchMediaValue}\n            fullWidthScroll={fullWidthScroll}\n            {...restProps}\n        />\n    );\n};\n"],"names":["__rest","useIsDesktop","React","PrimaryTabListDesktop","PrimaryTabListMobile","__assign"],"mappings":";;;;;;;;;;;;;;AASO,IAAM,wBAAwB,GAAG,UAAC,EAO1B,EAAA;AANX,IAAA,IAAA,IAAI,GAAA,EAAA,CAAA,IAAA,EACJ,UAAU,gBAAA,EACV,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,eAAe,GAAA,EAAA,CAAA,eAAA,EACf,EAAgF,GAAA,EAAA,CAAA,sBAAA,EAAhF,sBAAsB,GAAG,EAAA,KAAA,MAAA,GAAA,MAAM,KAAK,SAAS,GAAG,SAAS,GAAG,MAAM,KAAK,SAAS,GAAA,EAAA,EAC7E,SAAS,GAAAA,YAAA,CAAA,EAAA,EANyB,6EAOxC,CADe;IAEZ,IAAM,SAAS,GAAGC,6BAAY,CAAC,UAAU,EAAE,sBAAsB,CAAC;IAElE,OAAO,SAAS,IACZC,sBAAC,CAAA,aAAA,CAAAC,uCAAqB,mBAClB,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,sBAAsB,EAAE,sBAAsB,IAC1C,SAAS,CAAA,CACf,KAEFD,sBAAA,CAAA,aAAA,CAACE,qCAAoB,EACjBC,cAAA,CAAA,EAAA,UAAU,EAAE,UAAU,EACtB,sBAAsB,EAAE,sBAAsB,EAC9C,eAAe,EAAE,eAAe,EAC5B,EAAA,SAAS,CACf,CAAA,CACL;AACL;;;;"}
+{"version":3,"file":"Component.responsive.js","sources":["../../src/components/primary-tablist/Component.responsive.tsx"],"sourcesContent":["import React from 'react';\n\nimport { useIsDesktop } from '@alfalab/core-components-mq';\n\nimport { type TabListProps } from '../../typings';\n\nimport { PrimaryTabListDesktop } from './Component.desktop';\nimport { PrimaryTabListMobile } from './Component.mobile';\n\nexport const PrimaryTabListResponsive = ({\n    size,\n    breakpoint,\n    client,\n    fullWidthScroll,\n    defaultMatchMediaValue = client === undefined ? undefined : client === 'desktop',\n    ...restProps\n}: TabListProps) => {\n    const isDesktop = useIsDesktop(breakpoint, defaultMatchMediaValue);\n\n    return isDesktop ? (\n        <PrimaryTabListDesktop\n            breakpoint={breakpoint}\n            size={size}\n            defaultMatchMediaValue={defaultMatchMediaValue}\n            {...restProps}\n        />\n    ) : (\n        <PrimaryTabListMobile\n            breakpoint={breakpoint}\n            defaultMatchMediaValue={defaultMatchMediaValue}\n            fullWidthScroll={fullWidthScroll}\n            {...restProps}\n        />\n    );\n};\n"],"names":["__rest","useIsDesktop","React","PrimaryTabListDesktop","PrimaryTabListMobile","__assign"],"mappings":";;;;;;;;;;;;;;AASO,IAAM,wBAAwB,GAAG,UAAC,EAO1B,EAAA;AANX,IAAA,IAAA,IAAI,GAAA,EAAA,CAAA,IAAA,EACJ,UAAU,gBAAA,EACV,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,eAAe,GAAA,EAAA,CAAA,eAAA,EACf,EAAgF,GAAA,EAAA,CAAA,sBAAA,EAAhF,sBAAsB,GAAG,EAAA,KAAA,MAAA,GAAA,MAAM,KAAK,SAAS,GAAG,SAAS,GAAG,MAAM,KAAK,SAAS,GAAA,EAAA,EAC7E,SAAS,GAAAA,YAAA,CAAA,EAAA,EANyB,6EAOxC,CADe;IAEZ,IAAM,SAAS,GAAGC,6BAAY,CAAC,UAAU,EAAE,sBAAsB,CAAC;IAElE,OAAO,SAAS,IACZC,sBAAC,CAAA,aAAA,CAAAC,uCAAqB,mBAClB,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,sBAAsB,EAAE,sBAAsB,IAC1C,SAAS,CAAA,CACf,KAEFD,sBAAA,CAAA,aAAA,CAACE,qCAAoB,EACjBC,cAAA,CAAA,EAAA,UAAU,EAAE,UAAU,EACtB,sBAAsB,EAAE,sBAAsB,EAC9C,eAAe,EAAE,eAAe,EAC5B,EAAA,SAAS,CACf,CAAA,CACL;AACL;;;;"}