npm - @popsure/dirty-swan - Versions diffs - 0.66.27 → 0.66.29 - Mend

@popsure/dirty-swan 0.66.27 → 0.66.29

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (36) hide show

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

	@@ -1 +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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"}
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\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/tabs/Tabs.js CHANGED Viewed

@@ -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 CHANGED Viewed

	@@ -1 +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;;;;"}
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 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/downloadButton/index.test.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export {};

package/dist/esm/lib/components/input/autoSuggestInput/index.test.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export {};

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

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

package/package.json CHANGED Viewed

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

package/src/lib/components/autocompleteAddress/index.test.tsx CHANGED Viewed

@@ -24,7 +24,13 @@ const setup = (
   );
 };
-const inputTestId = 'ds-input-input';
+const addressFieldTestIds = [
+  'autocomplete',
+  'autocomplete-house-number',
+  'autocomplete-additional-info',
+  'autocomplete-postcode',
+  'autocomplete-city',
+];
 describe('AutocompleteAddress component', () => {
   it('Should show all address fields once a search is completed', async () => {
@@ -55,30 +61,30 @@ describe('AutocompleteAddress component', () => {
       }
     };
-    const { getAllByTestId, getByDisplayValue, getByTestId } = setup();
+    const { getByDisplayValue, getByTestId } = setup();
-    fireEvent.change(getByTestId(inputTestId), {
+    fireEvent.change(getByTestId('autocomplete'), {
       target: { value: 'Köpeniker' },
     });
-    expect(getAllByTestId(inputTestId).length).toEqual(5);
+    addressFieldTestIds.forEach((testId) =>
+      expect(getByTestId(testId)).toBeInTheDocument()
+    );
     expect(getByDisplayValue('Köpeniker Strasse')).toBeVisible();
   });
   it('Should enable to enter the address manually', async () => {
     const callback = jest.fn();
-    const { findByText, getAllByTestId, user } = setup(undefined, callback);
+    const { findByText, getByTestId, user } = setup(undefined, callback);
     const btn = await findByText('enter address manually');
     await user.click(btn);
     // fill out all fields
-    const inputs = getAllByTestId(inputTestId);
-    await user.type(inputs[0], 'Köpeniker Strasse');
-    await user.type(inputs[1], '4000');
-    await user.type(inputs[3], '10179');
-    await user.type(inputs[4], 'Berlin');
+    await user.type(getByTestId('autocomplete'), 'Köpeniker Strasse');
+    await user.type(getByTestId('autocomplete-house-number'), '4000');
+    await user.type(getByTestId('autocomplete-postcode'), '10179');
+    await user.type(getByTestId('autocomplete-city'), 'Berlin');
     // callback should be called with a complete address
     expect(callback).toHaveBeenCalledWith(address);

package/src/lib/components/autocompleteAddress/index.tsx CHANGED Viewed

@@ -265,6 +265,7 @@ const AutocompleteAddress = ({
               id="autocomplete"
               key="autocomplete-search"
               data-cy="autocomplete"
+              data-testid="autocomplete"
               type="text"
               placeholder={
                 placeholders?.manualAddressEntry || 'Search for address'
@@ -275,6 +276,7 @@ const AutocompleteAddress = ({
             {hasLoadedGoogleAPI === false && (
               <div
                 data-cy="google-api-loader"
+                data-testid="google-api-loader"
                 className={styles['loading-spinner']}
               >
                 <div className="ds-spinner ds-spinner__m" />
@@ -287,6 +289,7 @@ const AutocompleteAddress = ({
               <Input
                 className="w100"
                 data-cy="autocomplete"
+                data-testid="autocomplete"
                 key="autocomplete-street"
                 type="text"
                 placeholder={placeholders?.street || 'Street'}
@@ -298,6 +301,7 @@ const AutocompleteAddress = ({
               <Input
                 className={`wmx2 ${styles['house-number-input']}`}
                 data-cy="autocomplete-house-number"
+                data-testid="autocomplete-house-number"
                 key="autocomplete-house-number"
                 placeholder={placeholders?.houseNumber || 'House number'}
                 value={address?.houseNumber || ''}
@@ -309,6 +313,7 @@ const AutocompleteAddress = ({
             <Input
               className="mt16"
               data-cy="autocomplete-additional-info"
+              data-testid="autocomplete-additional-info"
               key="autocomplete-additional-info"
               placeholder={
                 placeholders?.additionalInformation ||
@@ -323,6 +328,7 @@ const AutocompleteAddress = ({
               <Input
                 className="w100"
                 data-cy="autocomplete-postcode"
+                data-testid="autocomplete-postcode"
                 key="autocomplete-postcode"
                 placeholder={placeholders?.postcode || 'Postcode'}
                 value={address?.postcode || ''}
@@ -333,6 +339,7 @@ const AutocompleteAddress = ({
               <Input
                 className="w100"
                 data-cy="autocomplete-city"
+                data-testid="autocomplete-city"
                 key="autocomplete-city"
                 placeholder={placeholders?.city || 'City'}
                 value={address?.city || ''}

package/src/lib/components/downloadButton/index.test.tsx ADDED Viewed

@@ -0,0 +1,22 @@
+import { fireEvent, render, screen } from '../../util/testUtils';
+import { DownloadButton } from '.';
+describe('DownloadButton', () => {
+  it.each(['INITIAL', 'FAILED'] as const)(
+    'exposes the %s download button as download-documents-button',
+    (downloadStatus) => {
+      const onDownload = jest.fn();
+      render(
+        <DownloadButton
+          downloadStatus={downloadStatus}
+          onDownload={onDownload}
+        />
+      );
+      fireEvent.click(screen.getByTestId('download-documents-button'));
+      expect(onDownload).toHaveBeenCalledTimes(1);
+    }
+  );
+});

package/src/lib/components/downloadButton/index.tsx CHANGED Viewed

@@ -16,6 +16,7 @@ const InitialButton = ({ onDownload }: { onDownload: () => void }) => (
     leftIcon={<DownloadIcon />}
     onClick={onDownload}
     data-cy="download-documents-button"
+    data-testid="download-documents-button"
   >
     Download
   </Button>

package/src/lib/components/input/autoSuggestInput/index.test.tsx ADDED Viewed

@@ -0,0 +1,22 @@
+import { render, screen } from '../../../util/testUtils';
+import { AutoSuggestInput } from '.';
+describe('AutoSuggestInput', () => {
+  it('exposes its input as suggest-multi-select-input', () => {
+    render(
+      <AutoSuggestInput
+        currentOption=""
+        suggestions={[]}
+        handleSuggestionSelected={jest.fn()}
+        onChange={jest.fn()}
+        handleSuggestionFetchRequest={jest.fn()}
+        handleSuggestionClearRequest={jest.fn()}
+        placeholder="Search countries"
+      />
+    );
+    expect(screen.getByTestId('suggest-multi-select-input').tagName).toBe(
+      'INPUT'
+    );
+  });
+});

package/src/lib/components/input/autoSuggestInput/index.tsx CHANGED Viewed

@@ -56,6 +56,7 @@ export const AutoSuggestInput = ({
       {...autoSuggestInputProps}
       placeholder={placeholder}
       data-cy="suggest-multi-select-input"
+      data-testid="suggest-multi-select-input"
     />
   );

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

@@ -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 CHANGED Viewed

@@ -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/tabs/Tabs.tsx CHANGED Viewed

@@ -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>