@popsure/dirty-swan 0.66.26 → 0.66.28

package/dist/cjs/lib/components/tabs/Tabs.d.ts

@@ -1,6 +1,7 @@
 export interface TabItem {
     id: string;
     label: string;
+    dataTestId?: string;
 }
 export interface TabsProps {
     tabs: TabItem[];

package/dist/esm/components/table/Table.js

@@ -54,6 +54,9 @@ var defaultTextOverrides = {
     showDetails: 'Show details',
     hideDetails: 'Hide details',
 };
+var getCellDataTestId = function (cell) {
+    return cell && 'dataTestId' in cell ? cell.dataTestId : undefined;
+};
 var Table = function (_a) {
     var _b, _c, _d, _e, _f;
     var cellReplacements = _a.cellReplacements, className = _a.className, collapsibleSections = _a.collapsibleSections, _g = _a.hideColumns, hideColumns = _g === void 0 ? [] : _g, hideDetails = _a.hideDetails, _h = _a.hideRows, hideRows = _h === void 0 ? [] : _h, imageComponent = _a.imageComponent, modalContentRenderer = _a.modalContentRenderer, onModalOpen = _a.onModalOpen, onSelectionChanged = _a.onSelectionChanged, scrollOnOpen = _a.scrollOnOpen, _j = _a.scrollTopOffset, scrollTopOffset = _j === void 0 ? 0 : _j, _k = _a.stickyHeaderTopOffset, stickyHeaderTopOffset = _k === void 0 ? 0 : _k, tableData = _a.tableData, definedTextOverrides = _a.textOverrides, title = _a.title, externalActiveSection = _a.activeSection, _l = _a.hideTableNavigation, hideTableNavigation = _l === void 0 ? false : _l, _m = _a.hideStickyHeader, hideStickyHeader = _m === void 0 ? false : _m, _o = _a.showSelectedColumn, showSelectedColumn = _o === void 0 ? false : _o, _p = _a.mobileNavigationMode, mobileNavigationMode = _p === void 0 ? 'arrows' : _p;
@@ -78,6 +81,7 @@ var Table = function (_a) {
     var currentActiveSection = headerRow === null || headerRow === void 0 ? void 0 : headerRow[activeSection];
     var mobileTabs = useTabs
         ? (_d = headerRow === null || headerRow === void 0 ? void 0 : headerRow.slice(1).map(function (cell, index) {
+            var _a;
             var label = '';
             if (!cell.type)
                 label = String(cell.text || '');
@@ -85,7 +89,11 @@ var Table = function (_a) {
                 label = String(cell.title || '');
             else if (cell.type === 'BUTTON')
                 label = String(cell.buttonCaption || '');
-            return { id: String(index), label: label };
+            var replacement = cell.cellId
+                ? cellReplacements === null || cellReplacements === void 0 ? void 0 : cellReplacements[cell.cellId]
+                : undefined;
+            var dataTestId = (_a = getCellDataTestId(replacement)) !== null && _a !== void 0 ? _a : getCellDataTestId(cell);
+            return { id: String(index), label: label, dataTestId: dataTestId };
         })) !== null && _d !== void 0 ? _d : []
         : [];
     var currentActiveSectionReplacements = ((currentActiveSection === null || currentActiveSection === void 0 ? void 0 : currentActiveSection.cellId) &&

package/dist/esm/components/table/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sources":["../../../../../src/lib/components/table/Table.tsx"],"sourcesContent":["import { TableCell } from './components/TableCell/TableCell';\nimport { BottomOrRegularModal } from '../modal';\nimport { ReactNode, useCallback, useEffect, useRef, useState } from 'react';\nimport { ChevronDownIcon, ChevronUpIcon } from '../icon';\nimport { Card } from '../cards/card';\n\nimport styles from './Table.module.scss';\nimport { useMediaQuery } from '../../hooks/useMediaQuery';\nimport { TableContents } from './components/TableContents/TableContents';\nimport classNames from 'classnames';\nimport { useTableNavigation } from './utils/useTableNavigation/useTableNavigation';\nimport { TableControls } from './components/TableControls/TableControls';\nimport { TableSection } from './components/TableSection/TableSection';\nimport { useScrollSync } from './utils/useScrollSync/useScrollSync';\nimport {\n  CellReplacements,\n  isBaseCell,\n  ModalData,\n  ModalFunction,\n  TableCellData,\n  TableData,\n} from './types';\nimport { Tabs, TabItem } from '../tabs/Tabs';\n\nexport type { TableData } from './types';\n\ntype TextOverrides = {\n  showDetails?: string;\n  hideDetails?: string;\n};\n\nexport interface TableProps {\n  cellReplacements?: CellReplacements;\n  className?: string;\n  collapsibleSections?: boolean;\n  hideColumns?: number[];\n  hideDetails?: boolean;\n  hideRows?: number[];\n  imageComponent?: (args: any) => JSX.Element;\n  modalContentRenderer?: (content: ReactNode) => ReactNode;\n  onModalOpen?: ModalFunction;\n  onSelectionChanged?: (index: number) => void;\n  scrollOnOpen?: boolean;\n  scrollTopOffset?: number;\n  stickyHeaderTopOffset?: number;\n  tableData: TableData;\n  textOverrides?: TextOverrides;\n  title: string;\n  activeSection?: number;\n  hideTableNavigation?: boolean;\n  hideStickyHeader?: boolean;\n  showSelectedColumn?: boolean;\n  mobileNavigationMode?: 'arrows' | 'tabs';\n}\n\nconst defaultTextOverrides = {\n  showDetails: 'Show details',\n  hideDetails: 'Hide details',\n};\n\nconst Table = ({\n  cellReplacements,\n  className,\n  collapsibleSections,\n  hideColumns = [],\n  hideDetails,\n  hideRows = [],\n  imageComponent,\n  modalContentRenderer,\n  onModalOpen,\n  onSelectionChanged,\n  scrollOnOpen,\n  scrollTopOffset = 0,\n  stickyHeaderTopOffset = 0,\n  tableData,\n  textOverrides: definedTextOverrides,\n  title,\n  activeSection: externalActiveSection,\n  hideTableNavigation = false,\n  hideStickyHeader = false,\n  showSelectedColumn = false,\n  mobileNavigationMode = 'arrows',\n}: TableProps) => {\n  const textOverrides = { ...defaultTextOverrides, ...definedTextOverrides };\n  const isMobile = useMediaQuery('BELOW_MOBILE');\n  const [infoModalData, setInfoModalData] = useState<ModalData | null>(null);\n  const [shouldHideDetails, setShouldHideDetails] = useState(true);\n  const containerRef = useRef<HTMLDivElement | null>(null);\n  const headerRef = useRef<HTMLDivElement | null>(null);\n  const stickyHeaderRef = useRef<HTMLDivElement | null>(null);\n  const columnsLength = tableData[0].rows[0].length;\n\n  useScrollSync(headerRef, containerRef, !isMobile);\n\n  const useTabs = isMobile && mobileNavigationMode === 'tabs';\n\n  const { activeSection, navigateTable, setActiveSection, syncActiveSection } =\n    useTableNavigation({\n      enabled: isMobile,\n      containerRef,\n      initialSection: externalActiveSection ? externalActiveSection - 1 : 0,\n      onSelectionChanged,\n    });\n\n  const headerRow = tableData?.[0]?.rows?.[0];\n  const titleCell = {\n    text: '',\n    ...(headerRow?.[0] || {}),\n  };\n  const currentActiveSection = headerRow?.[activeSection];\n\n  const mobileTabs: TabItem[] = useTabs\n    ? headerRow\n        ?.slice(1)\n        .map((cell, index) => {\n          let label = '';\n          if (!cell.type) label = String(cell.text || '');\n          else if (cell.type === 'CTA') label = String(cell.title || '');\n          else if (cell.type === 'BUTTON') label = String(cell.buttonCaption || '');\n          return { id: String(index), label };\n        }) ?? []\n    : [];\n\n  const currentActiveSectionReplacements =\n    (currentActiveSection?.cellId &&\n      cellReplacements?.[currentActiveSection.cellId]) ||\n    {};\n\n  const activeCellProps = {\n    ...currentActiveSection,\n    ...currentActiveSectionReplacements,\n  } as TableCellData;\n\n  const handleOpenModal: ModalFunction = useCallback(({ body, title }) => {\n    onModalOpen?.({ body, title });\n    setInfoModalData({ body, title });\n  }, []);\n\n  useEffect(() => {\n    if (externalActiveSection && externalActiveSection !== activeSection) {\n      syncActiveSection(externalActiveSection - 1);\n    }\n  }, [externalActiveSection]);\n\n  return (\n    <div className={classNames(styles.wrapper, 'bg-white')}>\n      {isMobile ? (\n        <>\n          {!useTabs && titleCell?.text && (\n            <TableCell\n              {...titleCell}\n              align=\"left\"\n              isNavigation\n              isTopLeftCell\n              type={undefined}\n            />\n          )}\n\n          {!hideTableNavigation && currentActiveSection && (\n            useTabs ? (\n              <div\n                className={classNames(\n                  'bg-white',\n                  styles.stickyHeader\n                )}\n                style={{ top: `${stickyHeaderTopOffset}px` }}\n              >\n                <Tabs\n                  tabs={mobileTabs}\n                  activeIndex={activeSection - 1}\n                  onTabChange={(index) => setActiveSection(index)}\n                  className=\"mb16\"\n                />\n              </div>\n            ) : (\n              <TableControls\n                activeSection={activeSection}\n                columnsLength={columnsLength}\n                navigateTable={navigateTable}\n                stickyHeaderTopOffset={stickyHeaderTopOffset}\n              >\n                <TableCell\n                  {...(isBaseCell(currentActiveSection)\n                    ? {\n                        openModal: (body: ReactNode) =>\n                          handleOpenModal({\n                            body,\n                            title: currentActiveSection?.text,\n                          }),\n                      }\n                    : {})}\n                  {...activeCellProps}\n                  imageComponent={imageComponent}\n                  isNavigation\n                />\n              </TableControls>\n            )\n          )}\n        </>\n      ) : (\n        !hideStickyHeader && (\n          <div\n            ref={stickyHeaderRef}\n            aria-hidden\n            className={styles.stickyHeader}\n            style={{ top: `${stickyHeaderTopOffset}px` }}\n          >\n            <div className={styles.container} ref={headerRef}>\n              <TableSection\n                cellReplacements={cellReplacements}\n                className={className}\n                hideColumns={hideColumns}\n                hideRows={hideRows}\n                openModal={handleOpenModal}\n                tableCellRows={[tableData?.[0]?.rows?.[0]]}\n                title={title}\n                imageComponent={imageComponent}\n              />\n            </div>\n          </div>\n        )\n      )}\n\n      <div ref={containerRef} className={classNames(styles.container, 'pb8')}>\n        <TableContents\n          tableData={tableData}\n          title={title}\n          className={className}\n          collapsibleSections={collapsibleSections}\n          scrollOnOpen={scrollOnOpen}\n          scrollTopOffset={scrollTopOffset}\n          stickyHeaderRef={stickyHeaderRef}\n          hideColumns={hideColumns}\n          hideDetails={hideDetails}\n          hideRows={hideRows}\n          isMobile={isMobile}\n          shouldHideDetails={shouldHideDetails}\n          openModal={handleOpenModal}\n          cellReplacements={cellReplacements}\n          imageComponent={imageComponent}\n          selectedColumn={showSelectedColumn ? activeSection : undefined}\n          showHeader={useTabs}\n        />\n      </div>\n\n      {tableData?.length > 1 && hideDetails && (\n        <Card\n          data-testid=\"show-hide-details\"\n          classNames={{\n            buttonWrapper: classNames(styles.cardButton, 'm8 mt32'),\n            title: 'd-flex gap8 ai-center jc-center fw-bold',\n          }}\n          title={\n            <>\n              {shouldHideDetails\n                ? textOverrides.showDetails\n                : textOverrides.hideDetails}\n              {shouldHideDetails ? (\n                <ChevronDownIcon size={20} />\n              ) : (\n                <ChevronUpIcon size={20} />\n              )}\n            </>\n          }\n          actionIcon={null}\n          dropShadow={false}\n          titleVariant=\"small\"\n          density=\"xsmall\"\n          onClick={() => setShouldHideDetails((current) => !current)}\n        />\n      )}\n\n      <BottomOrRegularModal\n        isOpen={infoModalData?.body ? true : false}\n        title={infoModalData?.title}\n        onClose={() => setInfoModalData(null)}\n      >\n        <div className={classNames(styles.modalContent, 'pt8 p24 wmn6')}>\n          {modalContentRenderer\n            ? modalContentRenderer(infoModalData?.body)\n            : infoModalData?.body}\n        </div>\n      </BottomOrRegularModal>\n    </div>\n  );\n};\n\nexport { Table };\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}
+{"version":3,"file":"Table.js","sources":["../../../../../src/lib/components/table/Table.tsx"],"sourcesContent":["import { TableCell } from './components/TableCell/TableCell';\nimport { BottomOrRegularModal } from '../modal';\nimport { ReactNode, useCallback, useEffect, useRef, useState } from 'react';\nimport { ChevronDownIcon, ChevronUpIcon } from '../icon';\nimport { Card } from '../cards/card';\n\nimport styles from './Table.module.scss';\nimport { useMediaQuery } from '../../hooks/useMediaQuery';\nimport { TableContents } from './components/TableContents/TableContents';\nimport classNames from 'classnames';\nimport { useTableNavigation } from './utils/useTableNavigation/useTableNavigation';\nimport { TableControls } from './components/TableControls/TableControls';\nimport { TableSection } from './components/TableSection/TableSection';\nimport { useScrollSync } from './utils/useScrollSync/useScrollSync';\nimport {\n  CellReplacements,\n  isBaseCell,\n  ModalData,\n  ModalFunction,\n  TableCellData,\n  TableData,\n} from './types';\nimport { Tabs, TabItem } from '../tabs/Tabs';\n\nexport type { TableData } from './types';\n\ntype TextOverrides = {\n  showDetails?: string;\n  hideDetails?: string;\n};\n\nexport interface TableProps {\n  cellReplacements?: CellReplacements;\n  className?: string;\n  collapsibleSections?: boolean;\n  hideColumns?: number[];\n  hideDetails?: boolean;\n  hideRows?: number[];\n  imageComponent?: (args: any) => JSX.Element;\n  modalContentRenderer?: (content: ReactNode) => ReactNode;\n  onModalOpen?: ModalFunction;\n  onSelectionChanged?: (index: number) => void;\n  scrollOnOpen?: boolean;\n  scrollTopOffset?: number;\n  stickyHeaderTopOffset?: number;\n  tableData: TableData;\n  textOverrides?: TextOverrides;\n  title: string;\n  activeSection?: number;\n  hideTableNavigation?: boolean;\n  hideStickyHeader?: boolean;\n  showSelectedColumn?: boolean;\n  mobileNavigationMode?: 'arrows' | 'tabs';\n}\n\nconst defaultTextOverrides = {\n  showDetails: 'Show details',\n  hideDetails: 'Hide details',\n};\n\nconst getCellDataTestId = (cell?: Partial<TableCellData>) =>\n  cell && 'dataTestId' in cell ? cell.dataTestId : undefined;\n\nconst Table = ({\n  cellReplacements,\n  className,\n  collapsibleSections,\n  hideColumns = [],\n  hideDetails,\n  hideRows = [],\n  imageComponent,\n  modalContentRenderer,\n  onModalOpen,\n  onSelectionChanged,\n  scrollOnOpen,\n  scrollTopOffset = 0,\n  stickyHeaderTopOffset = 0,\n  tableData,\n  textOverrides: definedTextOverrides,\n  title,\n  activeSection: externalActiveSection,\n  hideTableNavigation = false,\n  hideStickyHeader = false,\n  showSelectedColumn = false,\n  mobileNavigationMode = 'arrows',\n}: TableProps) => {\n  const textOverrides = { ...defaultTextOverrides, ...definedTextOverrides };\n  const isMobile = useMediaQuery('BELOW_MOBILE');\n  const [infoModalData, setInfoModalData] = useState<ModalData | null>(null);\n  const [shouldHideDetails, setShouldHideDetails] = useState(true);\n  const containerRef = useRef<HTMLDivElement | null>(null);\n  const headerRef = useRef<HTMLDivElement | null>(null);\n  const stickyHeaderRef = useRef<HTMLDivElement | null>(null);\n  const columnsLength = tableData[0].rows[0].length;\n\n  useScrollSync(headerRef, containerRef, !isMobile);\n\n  const useTabs = isMobile && mobileNavigationMode === 'tabs';\n\n  const { activeSection, navigateTable, setActiveSection, syncActiveSection } =\n    useTableNavigation({\n      enabled: isMobile,\n      containerRef,\n      initialSection: externalActiveSection ? externalActiveSection - 1 : 0,\n      onSelectionChanged,\n    });\n\n  const headerRow = tableData?.[0]?.rows?.[0];\n  const titleCell = {\n    text: '',\n    ...(headerRow?.[0] || {}),\n  };\n  const currentActiveSection = headerRow?.[activeSection];\n\n  const mobileTabs: TabItem[] = useTabs\n    ? headerRow\n        ?.slice(1)\n        .map((cell, index) => {\n          let label = '';\n          if (!cell.type) label = String(cell.text || '');\n          else if (cell.type === 'CTA') label = String(cell.title || '');\n          else if (cell.type === 'BUTTON') label = String(cell.buttonCaption || '');\n          const replacement = cell.cellId\n            ? cellReplacements?.[cell.cellId]\n            : undefined;\n          const dataTestId =\n            getCellDataTestId(replacement) ?? getCellDataTestId(cell);\n          return { id: String(index), label, dataTestId };\n        }) ?? []\n    : [];\n\n  const currentActiveSectionReplacements =\n    (currentActiveSection?.cellId &&\n      cellReplacements?.[currentActiveSection.cellId]) ||\n    {};\n\n  const activeCellProps = {\n    ...currentActiveSection,\n    ...currentActiveSectionReplacements,\n  } as TableCellData;\n\n  const handleOpenModal: ModalFunction = useCallback(({ body, title }) => {\n    onModalOpen?.({ body, title });\n    setInfoModalData({ body, title });\n  }, []);\n\n  useEffect(() => {\n    if (externalActiveSection && externalActiveSection !== activeSection) {\n      syncActiveSection(externalActiveSection - 1);\n    }\n  }, [externalActiveSection]);\n\n  return (\n    <div className={classNames(styles.wrapper, 'bg-white')}>\n      {isMobile ? (\n        <>\n          {!useTabs && titleCell?.text && (\n            <TableCell\n              {...titleCell}\n              align=\"left\"\n              isNavigation\n              isTopLeftCell\n              type={undefined}\n            />\n          )}\n\n          {!hideTableNavigation && currentActiveSection && (\n            useTabs ? (\n              <div\n                className={classNames(\n                  'bg-white',\n                  styles.stickyHeader\n                )}\n                style={{ top: `${stickyHeaderTopOffset}px` }}\n              >\n                <Tabs\n                  tabs={mobileTabs}\n                  activeIndex={activeSection - 1}\n                  onTabChange={(index) => setActiveSection(index)}\n                  className=\"mb16\"\n                />\n              </div>\n            ) : (\n              <TableControls\n                activeSection={activeSection}\n                columnsLength={columnsLength}\n                navigateTable={navigateTable}\n                stickyHeaderTopOffset={stickyHeaderTopOffset}\n              >\n                <TableCell\n                  {...(isBaseCell(currentActiveSection)\n                    ? {\n                        openModal: (body: ReactNode) =>\n                          handleOpenModal({\n                            body,\n                            title: currentActiveSection?.text,\n                          }),\n                      }\n                    : {})}\n                  {...activeCellProps}\n                  imageComponent={imageComponent}\n                  isNavigation\n                />\n              </TableControls>\n            )\n          )}\n        </>\n      ) : (\n        !hideStickyHeader && (\n          <div\n            ref={stickyHeaderRef}\n            aria-hidden\n            className={styles.stickyHeader}\n            style={{ top: `${stickyHeaderTopOffset}px` }}\n          >\n            <div className={styles.container} ref={headerRef}>\n              <TableSection\n                cellReplacements={cellReplacements}\n                className={className}\n                hideColumns={hideColumns}\n                hideRows={hideRows}\n                openModal={handleOpenModal}\n                tableCellRows={[tableData?.[0]?.rows?.[0]]}\n                title={title}\n                imageComponent={imageComponent}\n              />\n            </div>\n          </div>\n        )\n      )}\n\n      <div ref={containerRef} className={classNames(styles.container, 'pb8')}>\n        <TableContents\n          tableData={tableData}\n          title={title}\n          className={className}\n          collapsibleSections={collapsibleSections}\n          scrollOnOpen={scrollOnOpen}\n          scrollTopOffset={scrollTopOffset}\n          stickyHeaderRef={stickyHeaderRef}\n          hideColumns={hideColumns}\n          hideDetails={hideDetails}\n          hideRows={hideRows}\n          isMobile={isMobile}\n          shouldHideDetails={shouldHideDetails}\n          openModal={handleOpenModal}\n          cellReplacements={cellReplacements}\n          imageComponent={imageComponent}\n          selectedColumn={showSelectedColumn ? activeSection : undefined}\n          showHeader={useTabs}\n        />\n      </div>\n\n      {tableData?.length > 1 && hideDetails && (\n        <Card\n          data-testid=\"show-hide-details\"\n          classNames={{\n            buttonWrapper: classNames(styles.cardButton, 'm8 mt32'),\n            title: 'd-flex gap8 ai-center jc-center fw-bold',\n          }}\n          title={\n            <>\n              {shouldHideDetails\n                ? textOverrides.showDetails\n                : textOverrides.hideDetails}\n              {shouldHideDetails ? (\n                <ChevronDownIcon size={20} />\n              ) : (\n                <ChevronUpIcon size={20} />\n              )}\n            </>\n          }\n          actionIcon={null}\n          dropShadow={false}\n          titleVariant=\"small\"\n          density=\"xsmall\"\n          onClick={() => setShouldHideDetails((current) => !current)}\n        />\n      )}\n\n      <BottomOrRegularModal\n        isOpen={infoModalData?.body ? true : false}\n        title={infoModalData?.title}\n        onClose={() => setInfoModalData(null)}\n      >\n        <div className={classNames(styles.modalContent, 'pt8 p24 wmn6')}>\n          {modalContentRenderer\n            ? modalContentRenderer(infoModalData?.body)\n            : infoModalData?.body}\n        </div>\n      </BottomOrRegularModal>\n    </div>\n  );\n};\n\nexport { Table };\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}

package/dist/esm/components/table/Table.test.js

@@ -195,4 +195,29 @@ describe('Table on mobile with a parent-controlled section', function () {
         expect(screen.getByTestId('next-section-button')).toBeDisabled();
     });
 });
+describe('Table on mobile with tabs navigation', function () {
+    var planTable = [
+        {
+            rows: [
+                [
+                    { text: 'Choose your plan' },
+                    { text: 'Basic', cellId: 'basic' },
+                    { text: 'Advanced', cellId: 'advanced', dataTestId: 'advanced-plan' },
+                ],
+            ],
+        },
+    ];
+    beforeAll(function () {
+        HTMLElement.prototype.scroll = jest.fn();
+        useMediaQuery.mockReturnValue(true);
+    });
+    afterAll(function () {
+        useMediaQuery.mockReturnValue(false);
+    });
+    it('forwards the header cell test ids to the tabs, preferring cell replacements', function () {
+        customRender(jsx(Table, { title: "Plans", tableData: planTable, mobileNavigationMode: "tabs", cellReplacements: { basic: { dataTestId: 'basic-plan' } } }));
+        expect(screen.getByRole('tab', { name: 'Basic' })).toHaveAttribute('data-testid', 'basic-plan');
+        expect(screen.getByRole('tab', { name: 'Advanced' })).toHaveAttribute('data-testid', 'advanced-plan');
+    });
+});
 //# sourceMappingURL=Table.test.js.map

package/dist/esm/components/table/Table.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.test.js","sources":["../../../../../src/lib/components/table/Table.test.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { render, screen } from '../../util/testUtils';\nimport { useMediaQuery } from '../../hooks/useMediaQuery';\nimport { Table } from './Table';\nimport { TableSectionData } from './types';\n\njest.mock('../../hooks/useMediaQuery', () => ({\n  useMediaQuery: jest.fn(() => false),\n}));\n\nconst tableData: TableSectionData[] = [\n  {\n    section: {\n      title: 'Section 1',\n      icon: <span>Icon 1</span>,\n    },\n    rows: [[{ text: 'Item 1', cellId: '#item1' }, { text: 'Item 2' }]],\n  },\n  {\n    section: {\n      title: 'Section 2',\n      icon: 'https://placehold.co/30x30/orange/white',\n    },\n    rows: [\n      [{ text: 'Item 3' }, { text: 'Item 4', modalContent: 'Additional item' }],\n    ],\n  },\n];\n\ndescribe('Table', () => {\n  it('renders the table with sections and items', () => {\n    render(<Table tableData={tableData} title=\"Test Table\" />);\n\n    expect(screen.getByText('Section 1')).toBeInTheDocument();\n    expect(screen.getByText('Section 2')).toBeInTheDocument();\n\n    expect(screen.getAllByText('Item 1')[0]).toBeInTheDocument();\n    expect(screen.getAllByText('Item 2')[0]).toBeInTheDocument();\n    expect(screen.getByText('Item 3')).toBeInTheDocument();\n    expect(screen.getByText('Item 4')).toBeInTheDocument();\n  });\n\n  it('renders the table without sections', () => {\n    const dataWithoutSections = [{ rows: tableData[0].rows }];\n\n    render(<Table tableData={dataWithoutSections} title=\"Test Table\" />);\n\n    expect(screen.getAllByText('Item 1')[0]).toBeVisible();\n    expect(screen.getAllByText('Item 2')[0]).toBeVisible();\n  });\n\n  it('hides the show/hide details button if hideDetails is false', () => {\n    render(<Table tableData={tableData} hideDetails title=\"Test Table\" />);\n\n    expect(screen.queryByTestId('show-hide-details')).toBeInTheDocument();\n  });\n\n  it('shows the show/hide details button if hideDetails is true', () => {\n    render(<Table tableData={tableData} hideDetails title=\"Test Table\" />);\n\n    expect(screen.getByTestId('show-hide-details')).toBeInTheDocument();\n  });\n\n  it('hides the sections if hideDetails is true', () => {\n    render(<Table tableData={tableData} hideDetails title=\"Test Table\" />);\n\n    expect(screen.queryByText('Section 2')).not.toBeInTheDocument();\n    expect(screen.getByTestId('show-hide-details')).toBeInTheDocument();\n  });\n\n  it('hides the sections if hideDetails is true and shows if clicking on button', async () => {\n    const { user } = render(\n      <Table tableData={tableData} hideDetails title=\"Test Table\" />\n    );\n\n    expect(screen.getByText('Show details')).toBeVisible();\n\n    await user.click(screen.getByTestId('show-hide-details'));\n\n    expect(screen.getByText('Section 2')).toBeVisible();\n    expect(screen.getByText('Hide details')).toBeVisible();\n  });\n\n  it('does not render the sticky header row when hideStickyHeader is true', () => {\n    const { rerender } = render(\n      <Table tableData={tableData} title=\"Test Table\" />\n    );\n    const countWithStickyHeader = screen.getAllByText('Item 1').length;\n\n    rerender(\n      <Table tableData={tableData} hideStickyHeader title=\"Test Table\" />\n    );\n\n    expect(screen.getAllByText('Item 1')).toHaveLength(\n      countWithStickyHeader - 1\n    );\n  });\n\n  it('shows a modal when clicking on info icon', async () => {\n    const { user } = render(<Table tableData={tableData} title=\"Test Table\" />);\n\n    await user.click(screen.getByTestId('ds-table-info-button'));\n\n    expect(screen.getByText('Additional item')).toBeVisible();\n  });\n\n  it('renders the table with cell replacements', () => {\n    render(\n      <Table\n        tableData={tableData}\n        title=\"Test Table\"\n        cellReplacements={{\n          '#item1': {\n            text: 'I was replaced',\n          },\n        }}\n      />\n    );\n\n    expect(screen.getByText('Section 1')).toBeInTheDocument();\n    expect(screen.getByText('Section 2')).toBeInTheDocument();\n\n    expect(screen.getAllByText('I was replaced')[0]).toBeInTheDocument();\n    expect(screen.getAllByText('Item 2')[0]).toBeInTheDocument();\n    expect(screen.getAllByText('Item 3')[0]).toBeInTheDocument();\n    expect(screen.getAllByText('Item 4')[0]).toBeInTheDocument();\n  });\n\n  it('renders icons with a custom image component', () => {\n    const CustomImageComponent = ({ src }: { src: string }) => (\n      <>\n        <p>I am custom</p>\n        <img src={src} alt=\"\" />\n      </>\n    );\n\n    render(\n      <Table\n        tableData={tableData}\n        title=\"Test Table\"\n        imageComponent={CustomImageComponent}\n      />\n    );\n\n    expect(screen.getByText('I am custom')).toBeInTheDocument();\n  });\n});\n\ndescribe('Table on mobile with a parent-controlled section', () => {\n  const planTable: TableSectionData[] = [\n    {\n      rows: [\n        [{ text: 'Choose your plan' }, { text: 'Basic' }, { text: 'Advanced' }],\n      ],\n    },\n  ];\n\n  const ControlledTable = ({\n    onSelectionChanged,\n  }: {\n    onSelectionChanged: (index: number) => void;\n  }) => {\n    const [activeSection, setActiveSection] = useState(2);\n\n    return (\n      <Table\n        title=\"Plans\"\n        tableData={planTable}\n        activeSection={activeSection}\n        onSelectionChanged={(index) => {\n          onSelectionChanged(index);\n          setActiveSection(index);\n        }}\n      />\n    );\n  };\n\n  beforeAll(() => {\n    HTMLElement.prototype.scroll = jest.fn();\n    (useMediaQuery as jest.Mock).mockReturnValue(true);\n  });\n\n  afterAll(() => {\n    (useMediaQuery as jest.Mock).mockReturnValue(false);\n  });\n\n  it('settles on the parent section instead of bouncing between columns', () => {\n    const reported: number[] = [];\n\n    render(\n      <ControlledTable\n        onSelectionChanged={(index) => {\n          reported.push(index);\n          if (reported.length > 5) {\n            throw new Error(`selection bounced: ${reported.join(',')}`);\n          }\n        }}\n      />\n    );\n\n    expect(reported).toEqual([2]);\n    expect(screen.getByTestId('previous-section-button')).toBeEnabled();\n    expect(screen.getByTestId('next-section-button')).toBeDisabled();\n  });\n});\n"],"names":["_jsx","render","_jsxs","_Fragment"],"mappings":"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"}
+{"version":3,"file":"Table.test.js","sources":["../../../../../src/lib/components/table/Table.test.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { render, screen } from '../../util/testUtils';\nimport { useMediaQuery } from '../../hooks/useMediaQuery';\nimport { Table } from './Table';\nimport { TableSectionData } from './types';\n\njest.mock('../../hooks/useMediaQuery', () => ({\n  useMediaQuery: jest.fn(() => false),\n}));\n\nconst tableData: TableSectionData[] = [\n  {\n    section: {\n      title: 'Section 1',\n      icon: <span>Icon 1</span>,\n    },\n    rows: [[{ text: 'Item 1', cellId: '#item1' }, { text: 'Item 2' }]],\n  },\n  {\n    section: {\n      title: 'Section 2',\n      icon: 'https://placehold.co/30x30/orange/white',\n    },\n    rows: [\n      [{ text: 'Item 3' }, { text: 'Item 4', modalContent: 'Additional item' }],\n    ],\n  },\n];\n\ndescribe('Table', () => {\n  it('renders the table with sections and items', () => {\n    render(<Table tableData={tableData} title=\"Test Table\" />);\n\n    expect(screen.getByText('Section 1')).toBeInTheDocument();\n    expect(screen.getByText('Section 2')).toBeInTheDocument();\n\n    expect(screen.getAllByText('Item 1')[0]).toBeInTheDocument();\n    expect(screen.getAllByText('Item 2')[0]).toBeInTheDocument();\n    expect(screen.getByText('Item 3')).toBeInTheDocument();\n    expect(screen.getByText('Item 4')).toBeInTheDocument();\n  });\n\n  it('renders the table without sections', () => {\n    const dataWithoutSections = [{ rows: tableData[0].rows }];\n\n    render(<Table tableData={dataWithoutSections} title=\"Test Table\" />);\n\n    expect(screen.getAllByText('Item 1')[0]).toBeVisible();\n    expect(screen.getAllByText('Item 2')[0]).toBeVisible();\n  });\n\n  it('hides the show/hide details button if hideDetails is false', () => {\n    render(<Table tableData={tableData} hideDetails title=\"Test Table\" />);\n\n    expect(screen.queryByTestId('show-hide-details')).toBeInTheDocument();\n  });\n\n  it('shows the show/hide details button if hideDetails is true', () => {\n    render(<Table tableData={tableData} hideDetails title=\"Test Table\" />);\n\n    expect(screen.getByTestId('show-hide-details')).toBeInTheDocument();\n  });\n\n  it('hides the sections if hideDetails is true', () => {\n    render(<Table tableData={tableData} hideDetails title=\"Test Table\" />);\n\n    expect(screen.queryByText('Section 2')).not.toBeInTheDocument();\n    expect(screen.getByTestId('show-hide-details')).toBeInTheDocument();\n  });\n\n  it('hides the sections if hideDetails is true and shows if clicking on button', async () => {\n    const { user } = render(\n      <Table tableData={tableData} hideDetails title=\"Test Table\" />\n    );\n\n    expect(screen.getByText('Show details')).toBeVisible();\n\n    await user.click(screen.getByTestId('show-hide-details'));\n\n    expect(screen.getByText('Section 2')).toBeVisible();\n    expect(screen.getByText('Hide details')).toBeVisible();\n  });\n\n  it('does not render the sticky header row when hideStickyHeader is true', () => {\n    const { rerender } = render(\n      <Table tableData={tableData} title=\"Test Table\" />\n    );\n    const countWithStickyHeader = screen.getAllByText('Item 1').length;\n\n    rerender(\n      <Table tableData={tableData} hideStickyHeader title=\"Test Table\" />\n    );\n\n    expect(screen.getAllByText('Item 1')).toHaveLength(\n      countWithStickyHeader - 1\n    );\n  });\n\n  it('shows a modal when clicking on info icon', async () => {\n    const { user } = render(<Table tableData={tableData} title=\"Test Table\" />);\n\n    await user.click(screen.getByTestId('ds-table-info-button'));\n\n    expect(screen.getByText('Additional item')).toBeVisible();\n  });\n\n  it('renders the table with cell replacements', () => {\n    render(\n      <Table\n        tableData={tableData}\n        title=\"Test Table\"\n        cellReplacements={{\n          '#item1': {\n            text: 'I was replaced',\n          },\n        }}\n      />\n    );\n\n    expect(screen.getByText('Section 1')).toBeInTheDocument();\n    expect(screen.getByText('Section 2')).toBeInTheDocument();\n\n    expect(screen.getAllByText('I was replaced')[0]).toBeInTheDocument();\n    expect(screen.getAllByText('Item 2')[0]).toBeInTheDocument();\n    expect(screen.getAllByText('Item 3')[0]).toBeInTheDocument();\n    expect(screen.getAllByText('Item 4')[0]).toBeInTheDocument();\n  });\n\n  it('renders icons with a custom image component', () => {\n    const CustomImageComponent = ({ src }: { src: string }) => (\n      <>\n        <p>I am custom</p>\n        <img src={src} alt=\"\" />\n      </>\n    );\n\n    render(\n      <Table\n        tableData={tableData}\n        title=\"Test Table\"\n        imageComponent={CustomImageComponent}\n      />\n    );\n\n    expect(screen.getByText('I am custom')).toBeInTheDocument();\n  });\n});\n\ndescribe('Table on mobile with a parent-controlled section', () => {\n  const planTable: TableSectionData[] = [\n    {\n      rows: [\n        [{ text: 'Choose your plan' }, { text: 'Basic' }, { text: 'Advanced' }],\n      ],\n    },\n  ];\n\n  const ControlledTable = ({\n    onSelectionChanged,\n  }: {\n    onSelectionChanged: (index: number) => void;\n  }) => {\n    const [activeSection, setActiveSection] = useState(2);\n\n    return (\n      <Table\n        title=\"Plans\"\n        tableData={planTable}\n        activeSection={activeSection}\n        onSelectionChanged={(index) => {\n          onSelectionChanged(index);\n          setActiveSection(index);\n        }}\n      />\n    );\n  };\n\n  beforeAll(() => {\n    HTMLElement.prototype.scroll = jest.fn();\n    (useMediaQuery as jest.Mock).mockReturnValue(true);\n  });\n\n  afterAll(() => {\n    (useMediaQuery as jest.Mock).mockReturnValue(false);\n  });\n\n  it('settles on the parent section instead of bouncing between columns', () => {\n    const reported: number[] = [];\n\n    render(\n      <ControlledTable\n        onSelectionChanged={(index) => {\n          reported.push(index);\n          if (reported.length > 5) {\n            throw new Error(`selection bounced: ${reported.join(',')}`);\n          }\n        }}\n      />\n    );\n\n    expect(reported).toEqual([2]);\n    expect(screen.getByTestId('previous-section-button')).toBeEnabled();\n    expect(screen.getByTestId('next-section-button')).toBeDisabled();\n  });\n});\n\ndescribe('Table on mobile with tabs navigation', () => {\n  const planTable: TableSectionData[] = [\n    {\n      rows: [\n        [\n          { text: 'Choose your plan' },\n          { text: 'Basic', cellId: 'basic' },\n          { text: 'Advanced', cellId: 'advanced', dataTestId: 'advanced-plan' },\n        ],\n      ],\n    },\n  ];\n\n  beforeAll(() => {\n    HTMLElement.prototype.scroll = jest.fn();\n    (useMediaQuery as jest.Mock).mockReturnValue(true);\n  });\n\n  afterAll(() => {\n    (useMediaQuery as jest.Mock).mockReturnValue(false);\n  });\n\n  it('forwards the header cell test ids to the tabs, preferring cell replacements', () => {\n    render(\n      <Table\n        title=\"Plans\"\n        tableData={planTable}\n        mobileNavigationMode=\"tabs\"\n        cellReplacements={{ basic: { dataTestId: 'basic-plan' } }}\n      />\n    );\n\n    expect(screen.getByRole('tab', { name: 'Basic' })).toHaveAttribute(\n      'data-testid',\n      'basic-plan'\n    );\n    expect(screen.getByRole('tab', { name: 'Advanced' })).toHaveAttribute(\n      'data-testid',\n      'advanced-plan'\n    );\n  });\n});\n"],"names":["_jsx","render","_jsxs","_Fragment"],"mappings":"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"}

package/dist/esm/components/table/components/TableCell/ButtonCell/ButtonCell.js

@@ -8,14 +8,14 @@ import '../../../../../_commonjsHelpers-BFTU3MAI.js';
 import '../../../../icon/IconWrapper/IconWrapper.js';
 import '../../../../../tslib.es6-CVlKGIvp.js';
 
-var css_248z = ".ButtonCell-module_buttonCell__x4NNi {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: calc(100% + 40px);\n  margin-left: -20px;\n  margin-right: -20px;\n  padding: 16px 24px;\n  border-radius: 12px;\n  border: 1px solid #e7e7ed;\n  background-color: transparent;\n  color: #26262e;\n  cursor: pointer;\n  transition: border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;\n  text-align: left;\n}\n.ButtonCell-module_buttonCell__x4NNi:hover:not(:disabled):not(.ButtonCell-module_selected__22pF_) {\n  background-color: #FAF8F5;\n}\n.ButtonCell-module_buttonCell__x4NNi:focus-visible {\n  outline: 1px solid #26262e;\n  outline-offset: 0;\n}\n@media (max-width: 34rem) {\n  .ButtonCell-module_buttonCell__x4NNi {\n    pointer-events: none;\n  }\n}\n\n.ButtonCell-module_selected__22pF_ {\n  border: 1px solid #26262e;\n  background-color: #FAF8F5;\n}\n\n.ButtonCell-module_disabled__1TmtK {\n  background-color: #f7f7fd;\n  cursor: default;\n  opacity: 1;\n  pointer-events: none;\n}";
-var styles = {"buttonCell":"ButtonCell-module_buttonCell__x4NNi","selected":"ButtonCell-module_selected__22pF_","disabled":"ButtonCell-module_disabled__1TmtK"};
+var css_248z = ".ButtonCell-module_wrapper__1H62k {\n  height: 100%;\n}\n\n.ButtonCell-module_buttonCell__x4NNi {\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: calc(100% + 40px);\n  margin-left: -20px;\n  margin-right: -20px;\n  padding: 16px 24px;\n  border-radius: 12px;\n  border: 1px solid #e7e7ed;\n  background-color: transparent;\n  color: #26262e;\n  cursor: pointer;\n  transition: border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;\n  text-align: left;\n}\n.ButtonCell-module_buttonCell__x4NNi:hover:not(:disabled):not(.ButtonCell-module_selected__22pF_) {\n  background-color: #FAF8F5;\n}\n.ButtonCell-module_buttonCell__x4NNi:focus-visible {\n  outline: 1px solid #26262e;\n  outline-offset: 0;\n}\n@media (max-width: 34rem) {\n  .ButtonCell-module_buttonCell__x4NNi {\n    pointer-events: none;\n  }\n}\n\n.ButtonCell-module_selected__22pF_ {\n  border: 1px solid #26262e;\n  background-color: #FAF8F5;\n}\n\n.ButtonCell-module_disabled__1TmtK {\n  background-color: #f7f7fd;\n  cursor: default;\n  opacity: 1;\n  pointer-events: none;\n}";
+var styles = {"wrapper":"ButtonCell-module_wrapper__1H62k","buttonCell":"ButtonCell-module_buttonCell__x4NNi","selected":"ButtonCell-module_selected__22pF_","disabled":"ButtonCell-module_disabled__1TmtK"};
 styleInject(css_248z);
 
 var ButtonCell = function (_a) {
     var _b;
     var isSelected = _a.isSelected, onClick = _a.onClick, buttonCaption = _a.buttonCaption, price = _a.price, disabled = _a.disabled, className = _a.className, dataCy = _a.dataCy, dataTestId = _a.dataTestId;
-    return (jsx("div", { className: classNames("w100 d-flex fd-column ai-start jc-center gap8", className), "data-cy": dataCy, "data-testid": dataTestId, children: jsxs("button", { className: classNames('w100 wmx5', styles.buttonCell, (_b = {},
+    return (jsx("div", { className: classNames("w100 d-flex fd-column ai-start jc-center gap8", styles.wrapper, className), "data-cy": dataCy, "data-testid": dataTestId, children: jsxs("button", { className: classNames('w100 wmx5', styles.buttonCell, (_b = {},
                 _b[styles.selected] = isSelected,
                 _b[styles.disabled] = disabled,
                 _b)), type: "button", onClick: onClick, disabled: disabled, children: [jsxs("div", { className: "d-flex fd-column ai-start", children: [jsx("span", { className: "p-p fw-bold", children: buttonCaption }), price && jsx("span", { className: "p-p", children: price })] }), !disabled && (isSelected ? (jsx(CircleSelectedIcon, { size: 16 })) : (jsx(CircleUnselectedIcon, { size: 16 })))] }) }));

package/dist/esm/components/table/components/TableCell/ButtonCell/ButtonCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonCell.js","sources":["../../../../../../../../src/lib/components/table/components/TableCell/ButtonCell/ButtonCell.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport styles from './ButtonCell.module.scss';\nimport { CircleSelectedIcon, CircleUnselectedIcon } from '../../../../icon';\nimport { ReactNode } from 'react';\n\nexport type ButtonCellProps = {\n  buttonCaption: ReactNode;\n  disabled?: boolean;\n  isSelected?: boolean;\n  onClick: () => void;\n  price?: ReactNode;\n  className?: string;\n  dataTestId?: string;\n  dataCy?: string;\n};\n\nexport const ButtonCell = ({\n  isSelected,\n  onClick,\n  buttonCaption,\n  price,\n  disabled,\n  className,\n  dataCy,\n  dataTestId,\n}: ButtonCellProps) => {\n  return (\n    <div\n      className={classNames(\n        \"w100 d-flex fd-column ai-start jc-center gap8\",\n        className,\n      )}\n      data-cy={dataCy}\n      data-testid={dataTestId}\n    >\n      <button\n        className={classNames('w100 wmx5', styles.buttonCell, {\n          [styles.selected]: isSelected,\n          [styles.disabled]: disabled,\n        })}\n        type=\"button\"\n        onClick={onClick}\n        disabled={disabled}\n      >\n        <div className=\"d-flex fd-column ai-start\">\n          <span className=\"p-p fw-bold\">{buttonCaption}</span>\n          {price && <span className=\"p-p\">{price}</span>}\n        </div>\n        {!disabled && (isSelected ? (\n          <CircleSelectedIcon size={16} />\n        ) : (\n          <CircleUnselectedIcon size={16} />\n        ))}\n      </button>\n    </div>\n  );\n};\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;;;;;AAiBO,IAAM,UAAU,GAAG,UAAC,EAST,EAAA;;QARhB,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,OAAO,GAAA,EAAA,CAAA,OAAA,EACP,aAAa,GAAA,EAAA,CAAA,aAAA,EACb,KAAK,GAAA,EAAA,CAAA,KAAA,EACL,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,UAAU,GAAA,EAAA,CAAA,UAAA;IAEV,QACEA,GAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,UAAU,CACnB,+CAA+C,EAC/C,SAAS,CACV,EAAA,SAAA,EACQ,MAAM,iBACF,UAAU,EAAA,QAAA,EAEvBC,IAAA,CAAA,QAAA,EAAA,EACE,SAAS,EAAE,UAAU,CAAC,WAAW,EAAE,MAAM,CAAC,UAAU,GAAA,EAAA,GAAA,EAAA;AAClD,gBAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,UAAU;AAC7B,gBAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC3B,gBAAA,EAAA,EAAA,EACF,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAAA,QAAA,EAAA,CAElBA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,2BAA2B,EAAA,QAAA,EAAA,CACxCD,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,aAAa,EAAA,QAAA,EAAE,aAAa,EAAA,CAAQ,EACnD,KAAK,IAAIA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,KAAK,YAAE,KAAK,EAAA,CAAQ,CAAA,EAAA,CAC1C,EACL,CAAC,QAAQ,KAAK,UAAU,IACvBA,GAAA,CAAC,kBAAkB,EAAA,EAAC,IAAI,EAAE,EAAE,EAAA,CAAI,KAEhCA,GAAA,CAAC,oBAAoB,EAAA,EAAC,IAAI,EAAE,EAAE,GAAI,CACnC,CAAC,CAAA,EAAA,CACK,EAAA,CACL;AAEV;;;;"}
+{"version":3,"file":"ButtonCell.js","sources":["../../../../../../../../src/lib/components/table/components/TableCell/ButtonCell/ButtonCell.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport styles from './ButtonCell.module.scss';\nimport { CircleSelectedIcon, CircleUnselectedIcon } from '../../../../icon';\nimport { ReactNode } from 'react';\n\nexport type ButtonCellProps = {\n  buttonCaption: ReactNode;\n  disabled?: boolean;\n  isSelected?: boolean;\n  onClick: () => void;\n  price?: ReactNode;\n  className?: string;\n  dataTestId?: string;\n  dataCy?: string;\n};\n\nexport const ButtonCell = ({\n  isSelected,\n  onClick,\n  buttonCaption,\n  price,\n  disabled,\n  className,\n  dataCy,\n  dataTestId,\n}: ButtonCellProps) => {\n  return (\n    <div\n      className={classNames(\n        \"w100 d-flex fd-column ai-start jc-center gap8\",\n        styles.wrapper,\n        className,\n      )}\n      data-cy={dataCy}\n      data-testid={dataTestId}\n    >\n      <button\n        className={classNames('w100 wmx5', styles.buttonCell, {\n          [styles.selected]: isSelected,\n          [styles.disabled]: disabled,\n        })}\n        type=\"button\"\n        onClick={onClick}\n        disabled={disabled}\n      >\n        <div className=\"d-flex fd-column ai-start\">\n          <span className=\"p-p fw-bold\">{buttonCaption}</span>\n          {price && <span className=\"p-p\">{price}</span>}\n        </div>\n        {!disabled && (isSelected ? (\n          <CircleSelectedIcon size={16} />\n        ) : (\n          <CircleUnselectedIcon size={16} />\n        ))}\n      </button>\n    </div>\n  );\n};\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;;;;;AAiBO,IAAM,UAAU,GAAG,UAAC,EAST,EAAA;;QARhB,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,OAAO,GAAA,EAAA,CAAA,OAAA,EACP,aAAa,GAAA,EAAA,CAAA,aAAA,EACb,KAAK,GAAA,EAAA,CAAA,KAAA,EACL,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,UAAU,GAAA,EAAA,CAAA,UAAA;AAEV,IAAA,QACEA,GAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,UAAU,CACnB,+CAA+C,EAC/C,MAAM,CAAC,OAAO,EACd,SAAS,CACV,EAAA,SAAA,EACQ,MAAM,EAAA,aAAA,EACF,UAAU,EAAA,QAAA,EAEvBC,IAAA,CAAA,QAAA,EAAA,EACE,SAAS,EAAE,UAAU,CAAC,WAAW,EAAE,MAAM,CAAC,UAAU,GAAA,EAAA,GAAA,EAAA;AAClD,gBAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,UAAU;AAC7B,gBAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC3B,gBAAA,EAAA,EAAA,EACF,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAAA,QAAA,EAAA,CAElBA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,2BAA2B,EAAA,QAAA,EAAA,CACxCD,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,aAAa,EAAA,QAAA,EAAE,aAAa,EAAA,CAAQ,EACnD,KAAK,IAAIA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,KAAK,YAAE,KAAK,EAAA,CAAQ,CAAA,EAAA,CAC1C,EACL,CAAC,QAAQ,KAAK,UAAU,IACvBA,GAAA,CAAC,kBAAkB,EAAA,EAAC,IAAI,EAAE,EAAE,EAAA,CAAI,KAEhCA,GAAA,CAAC,oBAAoB,EAAA,EAAC,IAAI,EAAE,EAAE,GAAI,CACnC,CAAC,CAAA,EAAA,CACK,EAAA,CACL;AAEV;;;;"}

package/dist/esm/components/table/components/TableCell/TableCell.js

@@ -27,8 +27,8 @@ import '../../../icon/icons/ChevronRight.js';
 import '../../../icon/icons/CircleSelected.js';
 import '../../../icon/icons/CircleUnselected.js';
 
-var css_248z = ".TableCell-module_th__2rjCU {\n  vertical-align: middle;\n  scroll-snap-align: end;\n  width: 50%;\n  padding: 28px 24px;\n}\n@media (min-width: 34rem) {\n  .TableCell-module_th__2rjCU {\n    width: auto;\n    scroll-snap-align: unset;\n  }\n}\n.TableCell-module_thNavigation__qZ2sY {\n  width: 100%;\n}\n@media (min-width: 34rem) {\n  .TableCell-module_thNavigation__qZ2sY {\n    width: auto;\n  }\n}\n\n.TableCell-module_navigationTitle__2FiRB {\n  padding-left: 0;\n}\n\n.TableCell-module_headerCell__aVTIn {\n  vertical-align: top;\n}\n\n.TableCell-module_subtitleCell__1DzfG {\n  vertical-align: middle;\n}\n\n.TableCell-module_fixedCell__cL3-m {\n  position: sticky;\n  left: 0;\n  z-index: 2;\n  padding-left: 0;\n}\n\n.TableCell-module_selectedColumnTop__1GcJz {\n  border-radius: 16px 16px 0 0;\n}\n\n.TableCell-module_selectedColumnBottom__qiMke {\n  border-radius: 0 0 16px 16px;\n}\n\n.TableCell-module_fixedCard__2LO8s {\n  position: sticky;\n  left: 0;\n  right: 0;\n  z-index: 2;\n  width: 100%;\n}";
-var styles = {"th":"TableCell-module_th__2rjCU","thNavigation":"TableCell-module_thNavigation__qZ2sY","navigationTitle":"TableCell-module_navigationTitle__2FiRB","headerCell":"TableCell-module_headerCell__aVTIn","subtitleCell":"TableCell-module_subtitleCell__1DzfG","fixedCell":"TableCell-module_fixedCell__cL3-m","selectedColumnTop":"TableCell-module_selectedColumnTop__1GcJz","selectedColumnBottom":"TableCell-module_selectedColumnBottom__qiMke","fixedCard":"TableCell-module_fixedCard__2LO8s"};
+var css_248z = ".TableCell-module_th__2rjCU {\n  vertical-align: middle;\n  scroll-snap-align: end;\n  width: 50%;\n  padding: 28px 24px;\n}\n@media (min-width: 34rem) {\n  .TableCell-module_th__2rjCU {\n    width: auto;\n    scroll-snap-align: unset;\n  }\n}\n.TableCell-module_thNavigation__qZ2sY {\n  width: 100%;\n}\n@media (min-width: 34rem) {\n  .TableCell-module_thNavigation__qZ2sY {\n    width: auto;\n  }\n}\n\n.TableCell-module_navigationTitle__2FiRB {\n  padding-left: 0;\n}\n\n.TableCell-module_headerCell__aVTIn {\n  vertical-align: top;\n}\n\n.TableCell-module_subtitleCell__1DzfG {\n  vertical-align: middle;\n}\n\n.TableCell-module_fixedCell__cL3-m {\n  position: sticky;\n  left: 0;\n  z-index: 2;\n  padding-left: 0;\n}\n\n.TableCell-module_buttonCell__15CRG {\n  height: 1px;\n}\n\n.TableCell-module_selectedColumnTop__1GcJz {\n  border-radius: 16px 16px 0 0;\n}\n\n.TableCell-module_selectedColumnBottom__qiMke {\n  border-radius: 0 0 16px 16px;\n}\n\n.TableCell-module_fixedCard__2LO8s {\n  position: sticky;\n  left: 0;\n  right: 0;\n  z-index: 2;\n  width: 100%;\n}";
+var styles = {"th":"TableCell-module_th__2rjCU","thNavigation":"TableCell-module_thNavigation__qZ2sY","navigationTitle":"TableCell-module_navigationTitle__2FiRB","headerCell":"TableCell-module_headerCell__aVTIn","subtitleCell":"TableCell-module_subtitleCell__1DzfG","fixedCell":"TableCell-module_fixedCell__cL3-m","buttonCell":"TableCell-module_buttonCell__15CRG","selectedColumnTop":"TableCell-module_selectedColumnTop__1GcJz","selectedColumnBottom":"TableCell-module_selectedColumnBottom__qiMke","fixedCard":"TableCell-module_fixedCard__2LO8s"};
 styleInject(css_248z);
 
 var TableCell = React__default.memo(function (_a) {
@@ -55,6 +55,7 @@ var TableCell = React__default.memo(function (_a) {
             _b[styles.navigationTitle] = isNavigation && isTopLeftCell,
             _b[styles.fixedCell] = isFirstCellInRow && colSpan < 1,
             _b[styles.fixedCard] = cellProps.type === 'CARD',
+            _b[styles.buttonCell] = cellProps.type === 'BUTTON',
             _b[styles.selectedColumnTop] = selectedColumnPosition === 'top',
             _b[styles.selectedColumnBottom] = selectedColumnPosition === 'bottom',
             _b)), colSpan: isBelowDesktop && cellProps.type === 'CARD' ? 2 : colSpan, children: [!cellProps.type && (jsx(BaseCell, __assign({}, cellProps, { fontVariant: (_c = cellProps.fontVariant) !== null && _c !== void 0 ? _c : (isTopLeftCell ? 'TITLE' : 'NORMAL') }))), cellProps.type === 'CTA' && (jsx(CTACell, __assign({}, cellProps, { centered: isNavigation }))), cellProps.type === 'BUTTON' && jsx(ButtonCell, __assign({}, cellProps)), cellProps.type === 'CARD' && jsx(CardCell, __assign({}, cellProps))] })));

package/dist/esm/components/table/components/TableCell/TableCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableCell.js","sources":["../../../../../../../src/lib/components/table/components/TableCell/TableCell.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport styles from './TableCell.module.scss';\nimport { BaseCell } from './BaseCell/BaseCell';\nimport { TableCellData } from '../../types';\nimport { CTACell } from './CTACell/CTACell';\nimport { CardCell } from './CardCell/CardCell';\nimport { ButtonCell } from './ButtonCell/ButtonCell';\nimport React from 'react';\n\ntype ExtraTableCellProps = {\n  isHeader?: boolean;\n  isFirstCellInRow?: boolean;\n  isTopLeftCell?: boolean;\n  isNavigation?: boolean;\n  isSelectedColumn?: boolean;\n  selectedColumnPosition?: 'top' | 'bottom' | 'middle';\n  imageComponent?: (args: any) => JSX.Element;\n  isBelowDesktop?: boolean;\n};\n\nexport type TableCellProps = TableCellData & ExtraTableCellProps;\n\nconst TableCell = React.memo(\n  ({\n    isFirstCellInRow = false,\n    isHeader = false,\n    isNavigation = false,\n    isSelectedColumn = false,\n    selectedColumnPosition,\n    isTopLeftCell = false,\n    colSpan = 0,\n    isBelowDesktop,\n    ...cellProps\n  }: TableCellProps) => {\n    // prettier-ignore\n    const Tag = isNavigation\n    ? 'div'\n    : isHeader || isFirstCellInRow ? 'th' : 'td';\n\n    // prettier-ignore\n    const thScope = isHeader\n    ? 'col'\n    : isFirstCellInRow ? 'row' : undefined;\n\n    const scope = {\n      scope: thScope,\n    };\n\n    return (\n      <Tag\n        {...scope}\n        className={classNames(isSelectedColumn ? 'bg-orange-50' : 'bg-white', styles.th, {\n          'ta-left': isFirstCellInRow,\n          [styles.headerCell]: isHeader,\n          [styles.subtitleCell]:\n            !cellProps.type && cellProps.fontVariant === 'SUBTITLE',\n          [styles.thNavigation]: isNavigation,\n          [styles.navigationTitle]: isNavigation && isTopLeftCell,\n          [styles.fixedCell]: isFirstCellInRow && colSpan < 1 ,\n          [styles.fixedCard]: cellProps.type === 'CARD',\n          [styles.selectedColumnTop]: selectedColumnPosition === 'top',\n          [styles.selectedColumnBottom]: selectedColumnPosition === 'bottom',\n        })}\n        colSpan={isBelowDesktop && cellProps.type === 'CARD' ? 2 : colSpan}\n      >\n        {!cellProps.type && (\n          <BaseCell\n            {...cellProps}\n            fontVariant={\n              cellProps.fontVariant ?? (isTopLeftCell ? 'TITLE' : 'NORMAL')\n            }\n          />\n        )}\n        {cellProps.type === 'CTA' && (\n          <CTACell {...cellProps} centered={isNavigation} />\n        )}\n        {cellProps.type === 'BUTTON' && <ButtonCell {...cellProps} />}\n        {cellProps.type === 'CARD' && <CardCell {...cellProps} />}\n      </Tag>\n    );\n  }\n);\n\nexport { TableCell };\n"],"names":["React","_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"TableCell.js","sources":["../../../../../../../src/lib/components/table/components/TableCell/TableCell.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport styles from './TableCell.module.scss';\nimport { BaseCell } from './BaseCell/BaseCell';\nimport { TableCellData } from '../../types';\nimport { CTACell } from './CTACell/CTACell';\nimport { CardCell } from './CardCell/CardCell';\nimport { ButtonCell } from './ButtonCell/ButtonCell';\nimport React from 'react';\n\ntype ExtraTableCellProps = {\n  isHeader?: boolean;\n  isFirstCellInRow?: boolean;\n  isTopLeftCell?: boolean;\n  isNavigation?: boolean;\n  isSelectedColumn?: boolean;\n  selectedColumnPosition?: 'top' | 'bottom' | 'middle';\n  imageComponent?: (args: any) => JSX.Element;\n  isBelowDesktop?: boolean;\n};\n\nexport type TableCellProps = TableCellData & ExtraTableCellProps;\n\nconst TableCell = React.memo(\n  ({\n    isFirstCellInRow = false,\n    isHeader = false,\n    isNavigation = false,\n    isSelectedColumn = false,\n    selectedColumnPosition,\n    isTopLeftCell = false,\n    colSpan = 0,\n    isBelowDesktop,\n    ...cellProps\n  }: TableCellProps) => {\n    // prettier-ignore\n    const Tag = isNavigation\n    ? 'div'\n    : isHeader || isFirstCellInRow ? 'th' : 'td';\n\n    // prettier-ignore\n    const thScope = isHeader\n    ? 'col'\n    : isFirstCellInRow ? 'row' : undefined;\n\n    const scope = {\n      scope: thScope,\n    };\n\n    return (\n      <Tag\n        {...scope}\n        className={classNames(isSelectedColumn ? 'bg-orange-50' : 'bg-white', styles.th, {\n          'ta-left': isFirstCellInRow,\n          [styles.headerCell]: isHeader,\n          [styles.subtitleCell]:\n            !cellProps.type && cellProps.fontVariant === 'SUBTITLE',\n          [styles.thNavigation]: isNavigation,\n          [styles.navigationTitle]: isNavigation && isTopLeftCell,\n          [styles.fixedCell]: isFirstCellInRow && colSpan < 1 ,\n          [styles.fixedCard]: cellProps.type === 'CARD',\n          [styles.buttonCell]: cellProps.type === 'BUTTON',\n          [styles.selectedColumnTop]: selectedColumnPosition === 'top',\n          [styles.selectedColumnBottom]: selectedColumnPosition === 'bottom',\n        })}\n        colSpan={isBelowDesktop && cellProps.type === 'CARD' ? 2 : colSpan}\n      >\n        {!cellProps.type && (\n          <BaseCell\n            {...cellProps}\n            fontVariant={\n              cellProps.fontVariant ?? (isTopLeftCell ? 'TITLE' : 'NORMAL')\n            }\n          />\n        )}\n        {cellProps.type === 'CTA' && (\n          <CTACell {...cellProps} centered={isNavigation} />\n        )}\n        {cellProps.type === 'BUTTON' && <ButtonCell {...cellProps} />}\n        {cellProps.type === 'CARD' && <CardCell {...cellProps} />}\n      </Tag>\n    );\n  }\n);\n\nexport { TableCell };\n"],"names":["React","_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/components/tabs/Tabs.js

@@ -32,7 +32,7 @@ var Tabs = function (_a) {
             var _a;
             return (jsx("button", { ref: setTabRef(index), type: "button", role: "tab", "aria-selected": activeIndex === index, tabIndex: activeIndex === index ? 0 : -1, className: classNames('p-p bg-transparent c-pointer', styles.tab, (_a = {},
                     _a[styles.tabActive] = activeIndex === index,
-                    _a)), onClick: function () { return onTabChange(index); }, onKeyDown: function (e) { return handleKeyDown(e, index); }, children: tab.label }, tab.id));
+                    _a)), onClick: function () { return onTabChange(index); }, onKeyDown: function (e) { return handleKeyDown(e, index); }, "data-testid": tab.dataTestId, children: tab.label }, tab.id));
         }) }));
 };
 

package/dist/esm/components/tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","sources":["../../../../../src/lib/components/tabs/Tabs.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { KeyboardEvent, useCallback, useRef } from 'react';\n\nimport styles from './Tabs.module.scss';\n\nexport interface TabItem {\n  id: string;\n  label: string;\n}\n\nexport interface TabsProps {\n  tabs: TabItem[];\n  activeIndex: number;\n  onTabChange: (index: number) => void;\n  className?: string;\n}\n\nconst Tabs = ({ tabs, activeIndex, onTabChange, className }: TabsProps) => {\n  const tabRefs = useRef<(HTMLButtonElement | null)[]>([]);\n\n  const setTabRef = useCallback(\n    (index: number) => (el: HTMLButtonElement | null) => {\n      tabRefs.current[index] = el;\n    },\n    []\n  );\n\n  const handleKeyDown = (e: KeyboardEvent, index: number) => {\n    const count = tabs.length;\n    let nextIndex: number | null = null;\n\n    if (e.key === 'ArrowRight') nextIndex = (index + 1) % count;\n    if (e.key === 'ArrowLeft') nextIndex = (index - 1 + count) % count;\n\n    if (nextIndex !== null) {\n      e.preventDefault();\n      onTabChange(nextIndex);\n      tabRefs.current[nextIndex]?.focus({ preventScroll: true });\n    }\n  };\n\n  return (\n    <div className={classNames(styles.tabs, className)} role=\"tablist\">\n      {tabs.map((tab, index) => (\n        <button\n          ref={setTabRef(index)}\n          key={tab.id}\n          type=\"button\"\n          role=\"tab\"\n          aria-selected={activeIndex === index}\n          tabIndex={activeIndex === index ? 0 : -1}\n          className={classNames('p-p bg-transparent c-pointer', styles.tab, {\n            [styles.tabActive]: activeIndex === index,\n          })}\n          onClick={() => onTabChange(index)}\n          onKeyDown={(e) => handleKeyDown(e, index)}\n        >\n          {tab.label}\n        </button>\n      ))}\n    </div>\n  );\n};\n\nexport { Tabs };\n"],"names":["_jsx"],"mappings":";;;;;;;;;;AAiBA,IAAM,IAAI,GAAG,UAAC,EAAwD,EAAA;QAAtD,IAAI,GAAA,EAAA,CAAA,IAAA,EAAE,WAAW,GAAA,EAAA,CAAA,WAAA,EAAE,WAAW,GAAA,EAAA,CAAA,WAAA,EAAE,SAAS,GAAA,EAAA,CAAA,SAAA;AACvD,IAAA,IAAM,OAAO,GAAG,MAAM,CAA+B,EAAE,CAAC;IAExD,IAAM,SAAS,GAAG,WAAW,CAC3B,UAAC,KAAa,EAAA,EAAK,OAAA,UAAC,EAA4B,EAAA;AAC9C,QAAA,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,EAAE;AAC7B,IAAA,CAAC,CAAA,CAFkB,CAElB,EACD,EAAE,CACH;AAED,IAAA,IAAM,aAAa,GAAG,UAAC,CAAgB,EAAE,KAAa,EAAA;;AACpD,QAAA,IAAM,KAAK,GAAG,IAAI,CAAC,MAAM;QACzB,IAAI,SAAS,GAAkB,IAAI;AAEnC,QAAA,IAAI,CAAC,CAAC,GAAG,KAAK,YAAY;YAAE,SAAS,GAAG,CAAC,KAAK,GAAG,CAAC,IAAI,KAAK;AAC3D,QAAA,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW;YAAE,SAAS,GAAG,CAAC,KAAK,GAAG,CAAC,GAAG,KAAK,IAAI,KAAK;AAElE,QAAA,IAAI,SAAS,KAAK,IAAI,EAAE;YACtB,CAAC,CAAC,cAAc,EAAE;YAClB,WAAW,CAAC,SAAS,CAAC;AACtB,YAAA,CAAA,EAAA,GAAA,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC;QAC5D;AACF,IAAA,CAAC;IAED,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,IAAI,EAAC,SAAS,EAAA,QAAA,EAC/D,IAAI,CAAC,GAAG,CAAC,UAAC,GAAG,EAAE,KAAK,EAAA;;YAAK,QACxBA,gBACE,GAAG,EAAE,SAAS,CAAC,KAAK,CAAC,EAErB,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,KAAK,mBACK,WAAW,KAAK,KAAK,EACpC,QAAQ,EAAE,WAAW,KAAK,KAAK,GAAG,CAAC,GAAG,EAAE,EACxC,SAAS,EAAE,UAAU,CAAC,8BAA8B,EAAE,MAAM,CAAC,GAAG,GAAA,EAAA,GAAA,EAAA;AAC9D,oBAAA,EAAA,CAAC,MAAM,CAAC,SAAS,CAAA,GAAG,WAAW,KAAK,KAAK;AACzC,oBAAA,EAAA,EAAA,EACF,OAAO,EAAE,YAAA,EAAM,OAAA,WAAW,CAAC,KAAK,CAAC,CAAA,CAAlB,CAAkB,EACjC,SAAS,EAAE,UAAC,CAAC,EAAA,EAAK,OAAA,aAAa,CAAC,CAAC,EAAE,KAAK,CAAC,EAAvB,CAAuB,EAAA,QAAA,EAExC,GAAG,CAAC,KAAK,EAAA,EAXL,GAAG,CAAC,EAAE,CAYJ;QAfe,CAgBzB,CAAC,EAAA,CACE;AAEV;;;;"}
+{"version":3,"file":"Tabs.js","sources":["../../../../../src/lib/components/tabs/Tabs.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { KeyboardEvent, useCallback, useRef } from 'react';\n\nimport styles from './Tabs.module.scss';\n\nexport interface TabItem {\n  id: string;\n  label: string;\n  dataTestId?: string;\n}\n\nexport interface TabsProps {\n  tabs: TabItem[];\n  activeIndex: number;\n  onTabChange: (index: number) => void;\n  className?: string;\n}\n\nconst Tabs = ({ tabs, activeIndex, onTabChange, className }: TabsProps) => {\n  const tabRefs = useRef<(HTMLButtonElement | null)[]>([]);\n\n  const setTabRef = useCallback(\n    (index: number) => (el: HTMLButtonElement | null) => {\n      tabRefs.current[index] = el;\n    },\n    []\n  );\n\n  const handleKeyDown = (e: KeyboardEvent, index: number) => {\n    const count = tabs.length;\n    let nextIndex: number | null = null;\n\n    if (e.key === 'ArrowRight') nextIndex = (index + 1) % count;\n    if (e.key === 'ArrowLeft') nextIndex = (index - 1 + count) % count;\n\n    if (nextIndex !== null) {\n      e.preventDefault();\n      onTabChange(nextIndex);\n      tabRefs.current[nextIndex]?.focus({ preventScroll: true });\n    }\n  };\n\n  return (\n    <div className={classNames(styles.tabs, className)} role=\"tablist\">\n      {tabs.map((tab, index) => (\n        <button\n          ref={setTabRef(index)}\n          key={tab.id}\n          type=\"button\"\n          role=\"tab\"\n          aria-selected={activeIndex === index}\n          tabIndex={activeIndex === index ? 0 : -1}\n          className={classNames('p-p bg-transparent c-pointer', styles.tab, {\n            [styles.tabActive]: activeIndex === index,\n          })}\n          onClick={() => onTabChange(index)}\n          onKeyDown={(e) => handleKeyDown(e, index)}\n          data-testid={tab.dataTestId}\n        >\n          {tab.label}\n        </button>\n      ))}\n    </div>\n  );\n};\n\nexport { Tabs };\n"],"names":["_jsx"],"mappings":";;;;;;;;;;AAkBA,IAAM,IAAI,GAAG,UAAC,EAAwD,EAAA;QAAtD,IAAI,GAAA,EAAA,CAAA,IAAA,EAAE,WAAW,GAAA,EAAA,CAAA,WAAA,EAAE,WAAW,GAAA,EAAA,CAAA,WAAA,EAAE,SAAS,GAAA,EAAA,CAAA,SAAA;AACvD,IAAA,IAAM,OAAO,GAAG,MAAM,CAA+B,EAAE,CAAC;IAExD,IAAM,SAAS,GAAG,WAAW,CAC3B,UAAC,KAAa,EAAA,EAAK,OAAA,UAAC,EAA4B,EAAA;AAC9C,QAAA,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,EAAE;AAC7B,IAAA,CAAC,CAAA,CAFkB,CAElB,EACD,EAAE,CACH;AAED,IAAA,IAAM,aAAa,GAAG,UAAC,CAAgB,EAAE,KAAa,EAAA;;AACpD,QAAA,IAAM,KAAK,GAAG,IAAI,CAAC,MAAM;QACzB,IAAI,SAAS,GAAkB,IAAI;AAEnC,QAAA,IAAI,CAAC,CAAC,GAAG,KAAK,YAAY;YAAE,SAAS,GAAG,CAAC,KAAK,GAAG,CAAC,IAAI,KAAK;AAC3D,QAAA,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW;YAAE,SAAS,GAAG,CAAC,KAAK,GAAG,CAAC,GAAG,KAAK,IAAI,KAAK;AAElE,QAAA,IAAI,SAAS,KAAK,IAAI,EAAE;YACtB,CAAC,CAAC,cAAc,EAAE;YAClB,WAAW,CAAC,SAAS,CAAC;AACtB,YAAA,CAAA,EAAA,GAAA,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC;QAC5D;AACF,IAAA,CAAC;IAED,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,IAAI,EAAC,SAAS,EAAA,QAAA,EAC/D,IAAI,CAAC,GAAG,CAAC,UAAC,GAAG,EAAE,KAAK,EAAA;;YAAK,QACxBA,gBACE,GAAG,EAAE,SAAS,CAAC,KAAK,CAAC,EAErB,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,KAAK,mBACK,WAAW,KAAK,KAAK,EACpC,QAAQ,EAAE,WAAW,KAAK,KAAK,GAAG,CAAC,GAAG,EAAE,EACxC,SAAS,EAAE,UAAU,CAAC,8BAA8B,EAAE,MAAM,CAAC,GAAG,GAAA,EAAA,GAAA,EAAA;AAC9D,oBAAA,EAAA,CAAC,MAAM,CAAC,SAAS,CAAA,GAAG,WAAW,KAAK,KAAK;AACzC,oBAAA,EAAA,EAAA,EACF,OAAO,EAAE,YAAA,EAAM,OAAA,WAAW,CAAC,KAAK,CAAC,CAAA,CAAlB,CAAkB,EACjC,SAAS,EAAE,UAAC,CAAC,EAAA,EAAK,OAAA,aAAa,CAAC,CAAC,EAAE,KAAK,CAAC,CAAA,CAAvB,CAAuB,EAAA,aAAA,EAC5B,GAAG,CAAC,UAAU,EAAA,QAAA,EAE1B,GAAG,CAAC,KAAK,EAAA,EAZL,GAAG,CAAC,EAAE,CAaJ;QAhBe,CAiBzB,CAAC,EAAA,CACE;AAEV;;;;"}

package/dist/esm/lib/components/tabs/Tabs.d.ts

@@ -1,6 +1,7 @@
 export interface TabItem {
     id: string;
     label: string;
+    dataTestId?: string;
 }
 export interface TabsProps {
     tabs: TabItem[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@popsure/dirty-swan",
-  "version": "0.66.26",
+  "version": "0.66.28",
   "author": "Vincent Audoire <vincent@getpopsure.com>",
   "license": "MIT",
   "private": false,

package/src/lib/components/table/Table.test.tsx

@@ -203,3 +203,46 @@ describe('Table on mobile with a parent-controlled section', () => {
     expect(screen.getByTestId('next-section-button')).toBeDisabled();
   });
 });
+
+describe('Table on mobile with tabs navigation', () => {
+  const planTable: TableSectionData[] = [
+    {
+      rows: [
+        [
+          { text: 'Choose your plan' },
+          { text: 'Basic', cellId: 'basic' },
+          { text: 'Advanced', cellId: 'advanced', dataTestId: 'advanced-plan' },
+        ],
+      ],
+    },
+  ];
+
+  beforeAll(() => {
+    HTMLElement.prototype.scroll = jest.fn();
+    (useMediaQuery as jest.Mock).mockReturnValue(true);
+  });
+
+  afterAll(() => {
+    (useMediaQuery as jest.Mock).mockReturnValue(false);
+  });
+
+  it('forwards the header cell test ids to the tabs, preferring cell replacements', () => {
+    render(
+      <Table
+        title="Plans"
+        tableData={planTable}
+        mobileNavigationMode="tabs"
+        cellReplacements={{ basic: { dataTestId: 'basic-plan' } }}
+      />
+    );
+
+    expect(screen.getByRole('tab', { name: 'Basic' })).toHaveAttribute(
+      'data-testid',
+      'basic-plan'
+    );
+    expect(screen.getByRole('tab', { name: 'Advanced' })).toHaveAttribute(
+      'data-testid',
+      'advanced-plan'
+    );
+  });
+});

package/src/lib/components/table/Table.tsx

@@ -58,6 +58,9 @@ const defaultTextOverrides = {
   hideDetails: 'Hide details',
 };
 
+const getCellDataTestId = (cell?: Partial<TableCellData>) =>
+  cell && 'dataTestId' in cell ? cell.dataTestId : undefined;
+
 const Table = ({
   cellReplacements,
   className,
@@ -117,7 +120,12 @@ const Table = ({
           if (!cell.type) label = String(cell.text || '');
           else if (cell.type === 'CTA') label = String(cell.title || '');
           else if (cell.type === 'BUTTON') label = String(cell.buttonCaption || '');
-          return { id: String(index), label };
+          const replacement = cell.cellId
+            ? cellReplacements?.[cell.cellId]
+            : undefined;
+          const dataTestId =
+            getCellDataTestId(replacement) ?? getCellDataTestId(cell);
+          return { id: String(index), label, dataTestId };
         }) ?? []
     : [];
 

package/src/lib/components/table/components/TableCell/ButtonCell/ButtonCell.module.scss

@@ -1,7 +1,12 @@
 @use "../../../../../scss/public/grid" as *;
 @use "../../../../../scss/public/colors" as *;
 
+.wrapper {
+  height: 100%;
+}
+
 .buttonCell {
+  flex: 1;
   display: flex;
   align-items: center;
   justify-content: space-between;

package/src/lib/components/table/components/TableCell/ButtonCell/ButtonCell.tsx

@@ -29,6 +29,7 @@ export const ButtonCell = ({
     <div
       className={classNames(
         "w100 d-flex fd-column ai-start jc-center gap8",
+        styles.wrapper,
         className,
       )}
       data-cy={dataCy}

package/src/lib/components/table/components/TableCell/TableCell.module.scss

@@ -42,6 +42,12 @@
   padding-left: 0;
 }
 
+// Lets the ButtonCell stretch (height: 100%) so buttons in the same row match
+// the tallest one; the cell still grows with its content.
+.buttonCell {
+  height: 1px;
+}
+
 .selectedColumnTop {
   border-radius: 16px 16px 0 0;
 }

package/src/lib/components/table/components/TableCell/TableCell.tsx

@@ -59,6 +59,7 @@ const TableCell = React.memo(
           [styles.navigationTitle]: isNavigation && isTopLeftCell,
           [styles.fixedCell]: isFirstCellInRow && colSpan < 1 ,
           [styles.fixedCard]: cellProps.type === 'CARD',
+          [styles.buttonCell]: cellProps.type === 'BUTTON',
           [styles.selectedColumnTop]: selectedColumnPosition === 'top',
           [styles.selectedColumnBottom]: selectedColumnPosition === 'bottom',
         })}

package/src/lib/components/tabs/Tabs.tsx

@@ -6,6 +6,7 @@ import styles from './Tabs.module.scss';
 export interface TabItem {
   id: string;
   label: string;
+  dataTestId?: string;
 }
 
 export interface TabsProps {
@@ -54,6 +55,7 @@ const Tabs = ({ tabs, activeIndex, onTabChange, className }: TabsProps) => {
           })}
           onClick={() => onTabChange(index)}
           onKeyDown={(e) => handleKeyDown(e, index)}
+          data-testid={tab.dataTestId}
         >
           {tab.label}
         </button>