@veeqo/ui 9.8.0 → 9.9.1
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.
- package/dist/components/ActionMenu/ActionMenu.cjs +1 -0
- package/dist/components/ActionMenu/ActionMenu.cjs.map +1 -1
- package/dist/components/ActionMenu/ActionMenu.js +1 -0
- package/dist/components/ActionMenu/ActionMenu.js.map +1 -1
- package/dist/components/DataGrid/DataGrid.cjs +129 -0
- package/dist/components/DataGrid/DataGrid.cjs.map +1 -0
- package/dist/components/DataGrid/DataGrid.d.ts +21 -0
- package/dist/components/DataGrid/DataGrid.js +123 -0
- package/dist/components/DataGrid/DataGrid.js.map +1 -0
- package/dist/components/DataGrid/DataGrid.module.css.cjs +13 -0
- package/dist/components/DataGrid/DataGrid.module.css.cjs.map +1 -0
- package/dist/components/DataGrid/DataGrid.module.css.js +10 -0
- package/dist/components/DataGrid/DataGrid.module.css.js.map +1 -0
- package/dist/components/DataGrid/components/Body/Body.cjs +21 -0
- package/dist/components/DataGrid/components/Body/Body.cjs.map +1 -0
- package/dist/components/DataGrid/components/Body/Body.d.ts +23 -0
- package/dist/components/DataGrid/components/Body/Body.js +14 -0
- package/dist/components/DataGrid/components/Body/Body.js.map +1 -0
- package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.cjs +31 -0
- package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.cjs.map +1 -0
- package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.d.ts +18 -0
- package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.js +25 -0
- package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.js.map +1 -0
- package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.module.css.cjs +11 -0
- package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.module.css.cjs.map +1 -0
- package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.module.css.js +9 -0
- package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.module.css.js.map +1 -0
- package/dist/components/DataGrid/components/Body/BodyCell/index.d.ts +1 -0
- package/dist/components/DataGrid/components/Body/Row/Row.cjs +14 -0
- package/dist/components/DataGrid/components/Body/Row/Row.cjs.map +1 -0
- package/dist/components/DataGrid/components/Body/Row/Row.d.ts +18 -0
- package/dist/components/DataGrid/components/Body/Row/Row.js +8 -0
- package/dist/components/DataGrid/components/Body/Row/Row.js.map +1 -0
- package/dist/components/DataGrid/components/Body/Row/index.d.ts +1 -0
- package/dist/components/DataGrid/components/Body/index.d.ts +1 -0
- package/dist/components/DataGrid/components/CellContent/CellContent.cjs +21 -0
- package/dist/components/DataGrid/components/CellContent/CellContent.cjs.map +1 -0
- package/dist/components/DataGrid/components/CellContent/CellContent.d.ts +15 -0
- package/dist/components/DataGrid/components/CellContent/CellContent.js +15 -0
- package/dist/components/DataGrid/components/CellContent/CellContent.js.map +1 -0
- package/dist/components/DataGrid/components/CellContent/CellContent.module.css.cjs +11 -0
- package/dist/components/DataGrid/components/CellContent/CellContent.module.css.cjs.map +1 -0
- package/dist/components/DataGrid/components/CellContent/CellContent.module.css.js +9 -0
- package/dist/components/DataGrid/components/CellContent/CellContent.module.css.js.map +1 -0
- package/dist/components/DataGrid/components/CellContent/index.d.ts +1 -0
- package/dist/components/DataGrid/components/Columns/Columns.cjs +56 -0
- package/dist/components/DataGrid/components/Columns/Columns.cjs.map +1 -0
- package/dist/components/DataGrid/components/Columns/Columns.d.ts +17 -0
- package/dist/components/DataGrid/components/Columns/Columns.js +50 -0
- package/dist/components/DataGrid/components/Columns/Columns.js.map +1 -0
- package/dist/components/DataGrid/components/Columns/index.d.ts +1 -0
- package/dist/components/DataGrid/components/Footer/Footer.cjs +18 -0
- package/dist/components/DataGrid/components/Footer/Footer.cjs.map +1 -0
- package/dist/components/DataGrid/components/Footer/Footer.d.ts +15 -0
- package/dist/components/DataGrid/components/Footer/Footer.js +12 -0
- package/dist/components/DataGrid/components/Footer/Footer.js.map +1 -0
- package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.cjs +33 -0
- package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.cjs.map +1 -0
- package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.d.ts +18 -0
- package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.js +27 -0
- package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.js.map +1 -0
- package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.module.css.cjs +11 -0
- package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.module.css.cjs.map +1 -0
- package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.module.css.js +9 -0
- package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.module.css.js.map +1 -0
- package/dist/components/DataGrid/components/Footer/FooterCell/index.d.ts +1 -0
- package/dist/components/DataGrid/components/Footer/index.d.ts +1 -0
- package/dist/components/DataGrid/components/GridContainer/Container/Container.cjs +23 -0
- package/dist/components/DataGrid/components/GridContainer/Container/Container.cjs.map +1 -0
- package/dist/components/DataGrid/components/GridContainer/Container/Container.d.ts +21 -0
- package/dist/components/DataGrid/components/GridContainer/Container/Container.js +17 -0
- package/dist/components/DataGrid/components/GridContainer/Container/Container.js.map +1 -0
- package/dist/components/DataGrid/components/GridContainer/Container/Container.module.css.cjs +17 -0
- package/dist/components/DataGrid/components/GridContainer/Container/Container.module.css.cjs.map +1 -0
- package/dist/components/DataGrid/components/GridContainer/Container/Container.module.css.js +12 -0
- package/dist/components/DataGrid/components/GridContainer/Container/Container.module.css.js.map +1 -0
- package/dist/components/DataGrid/components/GridContainer/Container/index.d.ts +1 -0
- package/dist/components/DataGrid/components/GridContainer/GridContainer.cjs +30 -0
- package/dist/components/DataGrid/components/GridContainer/GridContainer.cjs.map +1 -0
- package/dist/components/DataGrid/components/GridContainer/GridContainer.d.ts +49 -0
- package/dist/components/DataGrid/components/GridContainer/GridContainer.js +24 -0
- package/dist/components/DataGrid/components/GridContainer/GridContainer.js.map +1 -0
- package/dist/components/DataGrid/components/GridContainer/GridContainer.module.css.cjs +11 -0
- package/dist/components/DataGrid/components/GridContainer/GridContainer.module.css.cjs.map +1 -0
- package/dist/components/DataGrid/components/GridContainer/GridContainer.module.css.js +9 -0
- package/dist/components/DataGrid/components/GridContainer/GridContainer.module.css.js.map +1 -0
- package/dist/components/DataGrid/components/GridContainer/index.d.ts +1 -0
- package/dist/components/DataGrid/components/Header/Header.cjs +20 -0
- package/dist/components/DataGrid/components/Header/Header.cjs.map +1 -0
- package/dist/components/DataGrid/components/Header/Header.d.ts +13 -0
- package/dist/components/DataGrid/components/Header/Header.js +14 -0
- package/dist/components/DataGrid/components/Header/Header.js.map +1 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.cjs +64 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.cjs.map +1 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.d.ts +22 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.js +58 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.js.map +1 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.module.css.cjs +19 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.module.css.cjs.map +1 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.module.css.js +13 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.module.css.js.map +1 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.cjs +29 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.cjs.map +1 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.d.ts +10 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.js +23 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.js.map +1 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/index.d.ts +1 -0
- package/dist/components/DataGrid/components/Header/HeaderCell/index.d.ts +1 -0
- package/dist/components/DataGrid/components/Header/Resizer/Resizer.cjs +25 -0
- package/dist/components/DataGrid/components/Header/Resizer/Resizer.cjs.map +1 -0
- package/dist/components/DataGrid/components/Header/Resizer/Resizer.d.ts +21 -0
- package/dist/components/DataGrid/components/Header/Resizer/Resizer.js +19 -0
- package/dist/components/DataGrid/components/Header/Resizer/Resizer.js.map +1 -0
- package/dist/components/DataGrid/components/Header/Resizer/Resizer.module.css.cjs +11 -0
- package/dist/components/DataGrid/components/Header/Resizer/Resizer.module.css.cjs.map +1 -0
- package/dist/components/DataGrid/components/Header/Resizer/Resizer.module.css.js +9 -0
- package/dist/components/DataGrid/components/Header/Resizer/Resizer.module.css.js.map +1 -0
- package/dist/components/DataGrid/components/Header/Resizer/index.d.ts +1 -0
- package/dist/components/DataGrid/components/Header/index.d.ts +1 -0
- package/dist/components/DataGrid/components/index.d.ts +5 -0
- package/dist/components/DataGrid/constants.cjs +12 -0
- package/dist/components/DataGrid/constants.cjs.map +1 -0
- package/dist/components/DataGrid/constants.d.ts +4 -0
- package/dist/components/DataGrid/constants.js +7 -0
- package/dist/components/DataGrid/constants.js.map +1 -0
- package/dist/components/DataGrid/hooks/index.d.ts +3 -0
- package/dist/components/DataGrid/hooks/usePinnedColumnLayout.cjs +39 -0
- package/dist/components/DataGrid/hooks/usePinnedColumnLayout.cjs.map +1 -0
- package/dist/components/DataGrid/hooks/usePinnedColumnLayout.d.ts +15 -0
- package/dist/components/DataGrid/hooks/usePinnedColumnLayout.js +37 -0
- package/dist/components/DataGrid/hooks/usePinnedColumnLayout.js.map +1 -0
- package/dist/components/DataGrid/hooks/usePinnedColumnStyles.cjs +22 -0
- package/dist/components/DataGrid/hooks/usePinnedColumnStyles.cjs.map +1 -0
- package/dist/components/DataGrid/hooks/usePinnedColumnStyles.d.ts +13 -0
- package/dist/components/DataGrid/hooks/usePinnedColumnStyles.js +20 -0
- package/dist/components/DataGrid/hooks/usePinnedColumnStyles.js.map +1 -0
- package/dist/components/DataGrid/hooks/useSortingState.cjs +40 -0
- package/dist/components/DataGrid/hooks/useSortingState.cjs.map +1 -0
- package/dist/components/DataGrid/hooks/useSortingState.d.ts +23 -0
- package/dist/components/DataGrid/hooks/useSortingState.js +38 -0
- package/dist/components/DataGrid/hooks/useSortingState.js.map +1 -0
- package/dist/components/DataGrid/index.d.ts +1 -0
- package/dist/components/DataGrid/types/AriaRoles.d.ts +4 -0
- package/dist/components/DataGrid/types/ColumnDefinition.d.ts +77 -0
- package/dist/components/DataGrid/types/DataGridProps.d.ts +85 -0
- package/dist/components/DataGrid/types/PinnedColumnState.d.ts +4 -0
- package/dist/components/DataGrid/types/SortState.d.ts +5 -0
- package/dist/components/DataGrid/types/declarations.d.ts +9 -0
- package/dist/components/DataGrid/types/enums.d.ts +3 -0
- package/dist/components/DataGrid/types/index.d.ts +6 -0
- package/dist/components/DataGrid/utils/ColumnMapper.cjs +96 -0
- package/dist/components/DataGrid/utils/ColumnMapper.cjs.map +1 -0
- package/dist/components/DataGrid/utils/ColumnMapper.d.ts +10 -0
- package/dist/components/DataGrid/utils/ColumnMapper.js +94 -0
- package/dist/components/DataGrid/utils/ColumnMapper.js.map +1 -0
- package/dist/components/DataGrid/utils/getAriaRoles.cjs +11 -0
- package/dist/components/DataGrid/utils/getAriaRoles.cjs.map +1 -0
- package/dist/components/DataGrid/utils/getAriaRoles.d.ts +2 -0
- package/dist/components/DataGrid/utils/getAriaRoles.js +9 -0
- package/dist/components/DataGrid/utils/getAriaRoles.js.map +1 -0
- package/dist/components/DataGrid/utils/index.d.ts +4 -0
- package/dist/components/DataGrid/utils/isLastColumn.cjs +11 -0
- package/dist/components/DataGrid/utils/isLastColumn.cjs.map +1 -0
- package/dist/components/DataGrid/utils/isLastColumn.d.ts +2 -0
- package/dist/components/DataGrid/utils/isLastColumn.js +9 -0
- package/dist/components/DataGrid/utils/isLastColumn.js.map +1 -0
- package/dist/components/DataGrid/utils/pinnedColumnUtils.cjs +33 -0
- package/dist/components/DataGrid/utils/pinnedColumnUtils.cjs.map +1 -0
- package/dist/components/DataGrid/utils/pinnedColumnUtils.d.ts +4 -0
- package/dist/components/DataGrid/utils/pinnedColumnUtils.js +30 -0
- package/dist/components/DataGrid/utils/pinnedColumnUtils.js.map +1 -0
- package/dist/components/DataTable/DataTable.cjs +5 -2
- package/dist/components/DataTable/DataTable.cjs.map +1 -1
- package/dist/components/DataTable/DataTable.js +5 -2
- package/dist/components/DataTable/DataTable.js.map +1 -1
- package/dist/components/DataTable/hooks/index.d.ts +0 -1
- package/dist/components/DataTable/index.d.ts +1 -1
- package/dist/components/FilterTag/FilterTag.cjs +1 -0
- package/dist/components/FilterTag/FilterTag.cjs.map +1 -1
- package/dist/components/FilterTag/FilterTag.js +1 -0
- package/dist/components/FilterTag/FilterTag.js.map +1 -1
- package/dist/components/SelectDropdown/ListItem/ListItem.cjs +1 -0
- package/dist/components/SelectDropdown/ListItem/ListItem.cjs.map +1 -1
- package/dist/components/SelectDropdown/ListItem/ListItem.js +1 -0
- package/dist/components/SelectDropdown/ListItem/ListItem.js.map +1 -1
- package/dist/components/VideoModal/VideoModal.cjs +1 -0
- package/dist/components/VideoModal/VideoModal.cjs.map +1 -1
- package/dist/components/VideoModal/VideoModal.js +1 -0
- package/dist/components/VideoModal/VideoModal.js.map +1 -1
- package/dist/components/View/View.cjs +1 -0
- package/dist/components/View/View.cjs.map +1 -1
- package/dist/components/View/View.js +1 -0
- package/dist/components/View/View.js.map +1 -1
- package/dist/components/ViewTab/ViewTab.cjs +1 -0
- package/dist/components/ViewTab/ViewTab.cjs.map +1 -1
- package/dist/components/ViewTab/ViewTab.js +1 -0
- package/dist/components/ViewTab/ViewTab.js.map +1 -1
- package/dist/components/index.d.ts +2 -1
- package/dist/hooks/index.d.ts +3 -0
- package/dist/{components/DataTable/hooks → hooks}/useDragToScroll.cjs +10 -2
- package/dist/hooks/useDragToScroll.cjs.map +1 -0
- package/dist/hooks/useDragToScroll.d.ts +12 -0
- package/dist/{components/DataTable/hooks → hooks}/useDragToScroll.js +10 -2
- package/dist/hooks/useDragToScroll.js.map +1 -0
- package/dist/hooks/useIntersectionObserver.cjs +57 -0
- package/dist/hooks/useIntersectionObserver.cjs.map +1 -0
- package/dist/hooks/useIntersectionObserver.d.ts +15 -0
- package/dist/hooks/useIntersectionObserver.js +51 -0
- package/dist/hooks/useIntersectionObserver.js.map +1 -0
- package/dist/hooks/useResizeObserver.cjs +67 -0
- package/dist/hooks/useResizeObserver.cjs.map +1 -0
- package/dist/hooks/useResizeObserver.d.ts +18 -0
- package/dist/hooks/useResizeObserver.js +61 -0
- package/dist/hooks/useResizeObserver.js.map +1 -0
- package/dist/index.cjs +8 -2
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +4 -1
- package/dist/index.js.map +1 -1
- package/dist/theme/index.d.ts +1 -0
- package/dist/theme/modules/layers.cjs +1 -0
- package/dist/theme/modules/layers.cjs.map +1 -1
- package/dist/theme/modules/layers.d.ts +1 -0
- package/dist/theme/modules/layers.js +1 -0
- package/dist/theme/modules/layers.js.map +1 -1
- package/package.json +2 -1
- package/dist/components/DataTable/hooks/useDragToScroll.cjs.map +0 -1
- package/dist/components/DataTable/hooks/useDragToScroll.d.ts +0 -2
- package/dist/components/DataTable/hooks/useDragToScroll.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.cjs","sources":["../../../src/components/DataTable/DataTable.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-redundant-roles */\n\nimport React, { useRef } from 'react';\nimport { Stack } from '../Stack';\nimport { Text } from '../Text';\n\nimport { generateTableCss } from './utils';\nimport { DataTableProps, CustomState, TableRow } from './types';\n\nimport {\n useCellWidths,\n useColumns,\n useDragToScroll,\n useScrollPosition,\n useSelection,\n} from './hooks';\n\nimport {\n renderCell,\n renderFooter,\n renderHeader,\n renderLoadingCell,\n renderNestedCell,\n} from './renderers';\n\nimport { ActionBar } from './components/ActionBar';\nimport { Cell } from './components/Cell';\nimport { ColumnMenu } from './components/ColumnMenu';\nimport { EmptyBodyContent, EmptyBodyGlyphWrapper } from './components/EmptyBodyContent';\nimport { Header } from './components/Header';\nimport { NoWrap } from './components/NoWrap';\nimport { Row } from './components/Row';\nimport { ScrollContainer } from './components/ScrollContainer';\nimport { TableGrid } from './components/TableGrid';\nimport { Truncate } from './components/Truncate';\nimport { Wrapper } from './components/Wrapper';\nimport { SelectionCell } from './components/SelectionCell';\nimport { SelectionHeader } from './components/SelectionHeader';\nimport { StickyHead } from './components/StickyHead';\n\nimport { getRowState } from './utils/getRowState';\nimport { InfoIcon } from '../../tempIcons/InfoIcon';\n\nconst defaultEmptyState: CustomState = {\n iconSlot: <InfoIcon width={48} height={48} />,\n heading: 'No results',\n};\n\nconst emptyAction = () => {};\n\nexport const DataTable = ({\n actionBarSlot,\n borderMode,\n columns: initialColumns,\n emptyState = defaultEmptyState,\n expandedRowIds,\n loading,\n loadingRowCount,\n onChangeSort,\n rows,\n disabledRowIds,\n selectionMode,\n selectionState,\n setExpanded,\n sortState,\n stripingMode,\n enableStickyHeader,\n resizeableColumns,\n onResizeColumns,\n columnWidths,\n stickyHeaderTop,\n}: DataTableProps) => {\n // Refs\n\n const scrollContainerRef = useRef<HTMLDivElement>(null);\n const tableRef = useRef<HTMLTableElement>(null);\n const intersectionTargetRef = useRef<HTMLDivElement>(null);\n\n useDragToScroll(scrollContainerRef);\n\n // Configure row selection\n\n const enabledRowIds = rows.map((row) => row.id).filter((id) => !disabledRowIds?.includes(id));\n\n const { selectionEnabled, selectedRowIds, selectionColumn, setSelected } = useSelection({\n selectionMode,\n selectionState,\n enabledRowIds,\n });\n\n // Assign actions\n\n const actions = {\n setSelected: setSelected || emptyAction,\n setExpanded: setExpanded || emptyAction,\n };\n\n // Process columns\n\n const columnsWithSelection = [selectionColumn, ...initialColumns];\n const allColumns = selectionEnabled ? columnsWithSelection : initialColumns;\n\n const cellWidths = useCellWidths(tableRef, scrollContainerRef);\n const {\n visible,\n pinnedLeft,\n pinnedRight,\n setColumnWidth,\n columnWidths: calcColumnWidths,\n } = useColumns(allColumns, tableRef, onResizeColumns, columnWidths);\n const adjustedCellWidths =\n cellWidths.length === visible.length\n ? (visible.map((col, i) =>\n Number.isNaN(calcColumnWidths[col.id] || '') ? cellWidths[i] : calcColumnWidths[col.id],\n ) as number[])\n : cellWidths;\n\n // Generate styles\n const { scrollPosition } = useScrollPosition(scrollContainerRef);\n const tableCss = generateTableCss({\n pinnedLeft,\n pinnedRight,\n cellWidths: adjustedCellWidths,\n scrollPosition,\n columnWidths: calcColumnWidths,\n columns: visible,\n stripingMode,\n });\n\n // Render states\n\n if (loading) {\n const loadingRows: Array<TableRow> = new Array(loadingRowCount).fill(true).map(() => ({\n // generate random ID forcing all rows to re-render avoid animation de-sync\n id: Math.random() * 1000,\n data: null,\n }));\n\n return (\n <Wrapper borderMode={borderMode}>\n <ScrollContainer ref={scrollContainerRef}>\n <TableGrid css={tableCss} ref={tableRef} role=\"table\">\n <thead role=\"rowgroup\">\n <Row role=\"row\">\n {visible.map((column, i) =>\n renderHeader({\n column,\n sortState,\n onChangeSort,\n resizeableColumns,\n setColumnWidth,\n columnCount: visible.length,\n columnI: i,\n }),\n )}\n </Row>\n </thead>\n <tbody role=\"rowgroup\">\n {loadingRows.map((row) => (\n <Row key={row.id}>{visible.map((col) => renderLoadingCell(row, col))}</Row>\n ))}\n </tbody>\n </TableGrid>\n </ScrollContainer>\n </Wrapper>\n );\n }\n\n if (rows.length === 0) {\n return (\n <Wrapper borderMode={borderMode}>\n <ScrollContainer ref={scrollContainerRef}>\n <TableGrid css={tableCss} ref={tableRef} role=\"table\">\n <thead role=\"rowgroup\">\n <Row role=\"row\">\n {visible.map((column, i) =>\n renderHeader({\n column,\n sortState,\n onChangeSort,\n resizeableColumns,\n setColumnWidth,\n columnCount: visible.length,\n columnI: i,\n }),\n )}\n </Row>\n </thead>\n <tbody role=\"rowgroup\">\n <EmptyBodyContent columnCount={visible.length}>\n <EmptyBodyGlyphWrapper>\n {/* Should be 48x48px */}\n {emptyState.iconSlot}\n </EmptyBodyGlyphWrapper>\n <Stack spacing=\"sm\" alignX=\"center\">\n <Text variant=\"headingMedium\">{emptyState.heading}</Text>\n {emptyState.subheading && (\n <Text variant=\"subheadingMedium\">{emptyState.subheading}</Text>\n )}\n </Stack>\n </EmptyBodyContent>\n </tbody>\n </TableGrid>\n </ScrollContainer>\n </Wrapper>\n );\n }\n\n const renderRow = (row: TableRow) => {\n const { e2eClassName = '', accentColor } = row;\n const rowState = getRowState(row.id, { selectedRowIds, expandedRowIds, disabledRowIds });\n\n return (\n <Row role=\"row\" key={row.id} accentColor={accentColor} className={e2eClassName} {...rowState}>\n {visible.map((col) => renderCell(row, col, actions, rowState))}\n </Row>\n );\n };\n\n const renderNestedRow = (nestedRow: TableRow, rowId: TableRow['id']) => {\n const nestedRowE2eClassName = nestedRow?.data?.e2eClassNames?.row;\n const rowState = getRowState(rowId, { selectedRowIds, expandedRowIds, disabledRowIds });\n return (\n <Row role=\"row\" key={nestedRow.id} className={nestedRowE2eClassName}>\n {visible.map((col) => renderNestedCell(nestedRow, col, rowState))}\n </Row>\n );\n };\n\n const renderSection = (row: TableRow) => {\n const isExpanded = expandedRowIds?.includes(row.id);\n return (\n <tbody role=\"rowgroup\" key={row.id}>\n {renderRow(row)}\n {isExpanded && row.nestedRows?.map((nestedRow) => renderNestedRow(nestedRow, row.id))}\n </tbody>\n );\n };\n\n const renderBody = () => {\n const hasNestedRows = !!expandedRowIds;\n const hasMultipleSections = hasNestedRows && stripingMode === 'nested';\n\n if (hasMultipleSections) {\n return rows.map(renderSection);\n }\n\n if (hasNestedRows) {\n return (\n <tbody role=\"rowgroup\">\n {rows.map((row) => {\n const rowElement = renderRow(row);\n const isExpanded = expandedRowIds?.includes(row.id);\n const nestedRowElements =\n (isExpanded &&\n row.nestedRows?.map((nestedRow) => renderNestedRow(nestedRow, row.id))) ||\n [];\n return [rowElement, ...nestedRowElements];\n })}\n </tbody>\n );\n }\n\n return <tbody role=\"rowgroup\">{rows.map(renderRow)}</tbody>;\n };\n\n const headersMarkup = (\n <Row role=\"row\">\n {visible.map((column, i) =>\n renderHeader({\n column,\n sortState,\n onChangeSort,\n resizeableColumns,\n setColumnWidth,\n columnCount: visible.length,\n columnI: i,\n }),\n )}\n </Row>\n );\n\n const shouldRenderFooter = initialColumns.some((column) => !!column.renderFooter);\n const shouldRenderActionBar = selectedRowIds.length > 0 && !!actionBarSlot;\n\n return (\n <Wrapper borderMode={borderMode}>\n {shouldRenderActionBar && (\n <ActionBar\n selectionColumn={selectionColumn}\n intersectionTargetRef={intersectionTargetRef}\n containerRef={scrollContainerRef}\n >\n {actionBarSlot}\n </ActionBar>\n )}\n <ScrollContainer ref={scrollContainerRef}>\n {enableStickyHeader && (\n <StickyHead\n tableCss={tableCss}\n intersectionTargetRef={intersectionTargetRef}\n containerRef={scrollContainerRef}\n cellWidths={adjustedCellWidths}\n stickyHeaderTop={stickyHeaderTop}\n >\n {headersMarkup}\n </StickyHead>\n )}\n <div ref={intersectionTargetRef} style={{ height: 0 }} />\n <TableGrid css={tableCss} ref={tableRef} role=\"table\">\n <thead role=\"rowgroup\">{headersMarkup}</thead>\n {renderBody()}\n {shouldRenderFooter && (\n <tfoot role=\"rowgroup\">\n <Row role=\"row\">{visible.map((column) => renderFooter({ column }))}</Row>\n </tfoot>\n )}\n </TableGrid>\n </ScrollContainer>\n </Wrapper>\n );\n};\n\nDataTable.defaultProps = {\n loading: false,\n loadingRowCount: 5,\n selectionMode: 'multiple',\n stripingMode: 'row',\n enableStickyHeader: true,\n};\n\nDataTable.Cell = Cell;\nDataTable.ColumnMenu = ColumnMenu;\nDataTable.SelectionCell = SelectionCell;\nDataTable.SelectionHeader = SelectionHeader;\nDataTable.Header = Header;\nDataTable.Truncate = Truncate;\nDataTable.NoWrap = NoWrap;\n"],"names":["React","InfoIcon","useRef","useDragToScroll","useSelection","useCellWidths","useColumns","useScrollPosition","generateTableCss","Wrapper","ScrollContainer","TableGrid","Row","renderHeader","renderLoadingCell","EmptyBodyContent","EmptyBodyGlyphWrapper","Stack","Text","getRowState","renderCell","renderNestedCell","ActionBar","StickyHead","renderFooter","Cell","ColumnMenu","SelectionCell","SelectionHeader","Header","Truncate","NoWrap"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AA2CA,MAAM,iBAAiB,GAAgB;IACrC,QAAQ,EAAEA,sBAAC,CAAA,aAAA,CAAAC,iBAAQ,EAAC,EAAA,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAI,CAAA;AAC7C,IAAA,OAAO,EAAE,YAAY;CACtB;AAED,MAAM,WAAW,GAAG,MAAK,GAAG;MAEf,SAAS,GAAG,CAAC,EACxB,aAAa,EACb,UAAU,EACV,OAAO,EAAE,cAAc,EACvB,UAAU,GAAG,iBAAiB,EAC9B,cAAc,EACd,OAAO,EACP,eAAe,EACf,YAAY,EACZ,IAAI,EACJ,cAAc,EACd,aAAa,EACb,cAAc,EACd,WAAW,EACX,SAAS,EACT,YAAY,EACZ,kBAAkB,EAClB,iBAAiB,EACjB,eAAe,EACf,YAAY,EACZ,eAAe,GACA,KAAI;;AAGnB,IAAA,MAAM,kBAAkB,GAAGC,YAAM,CAAiB,IAAI,CAAC;AACvD,IAAA,MAAM,QAAQ,GAAGA,YAAM,CAAmB,IAAI,CAAC;AAC/C,IAAA,MAAM,qBAAqB,GAAGA,YAAM,CAAiB,IAAI,CAAC;IAE1DC,+BAAe,CAAC,kBAAkB,CAAC;;AAInC,IAAA,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAC,cAAc,KAAd,IAAA,IAAA,cAAc,KAAd,SAAA,GAAA,SAAA,GAAA,cAAc,CAAE,QAAQ,CAAC,EAAE,CAAC,CAAA,CAAC;IAE7F,MAAM,EAAE,gBAAgB,EAAE,cAAc,EAAE,eAAe,EAAE,WAAW,EAAE,GAAGC,yBAAY,CAAC;QACtF,aAAa;QACb,cAAc;QACd,aAAa;AACd,KAAA,CAAC;;AAIF,IAAA,MAAM,OAAO,GAAG;QACd,WAAW,EAAE,WAAW,IAAI,WAAW;QACvC,WAAW,EAAE,WAAW,IAAI,WAAW;KACxC;;IAID,MAAM,oBAAoB,GAAG,CAAC,eAAe,EAAE,GAAG,cAAc,CAAC;IACjE,MAAM,UAAU,GAAG,gBAAgB,GAAG,oBAAoB,GAAG,cAAc;IAE3E,MAAM,UAAU,GAAGC,2BAAa,CAAC,QAAQ,EAAE,kBAAkB,CAAC;IAC9D,MAAM,EACJ,OAAO,EACP,UAAU,EACV,WAAW,EACX,cAAc,EACd,YAAY,EAAE,gBAAgB,GAC/B,GAAGC,qBAAU,CAAC,UAAU,EAAE,QAAQ,EAAE,eAAe,EAAE,YAAY,CAAC;IACnE,MAAM,kBAAkB,GACtB,UAAU,CAAC,MAAM,KAAK,OAAO,CAAC;AAC5B,UAAG,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAClB,MAAM,CAAC,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,GAAG,gBAAgB,CAAC,GAAG,CAAC,EAAE,CAAC;UAEzF,UAAU;;IAGhB,MAAM,EAAE,cAAc,EAAE,GAAGC,mCAAiB,CAAC,kBAAkB,CAAC;IAChE,MAAM,QAAQ,GAAGC,iCAAgB,CAAC;QAChC,UAAU;QACV,WAAW;AACX,QAAA,UAAU,EAAE,kBAAkB;QAC9B,cAAc;AACd,QAAA,YAAY,EAAE,gBAAgB;AAC9B,QAAA,OAAO,EAAE,OAAO;QAChB,YAAY;AACb,KAAA,CAAC;;AAIF,IAAA,IAAI,OAAO,EAAE;AACX,QAAA,MAAM,WAAW,GAAoB,IAAI,KAAK,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,OAAO;;AAEpF,YAAA,EAAE,EAAE,IAAI,CAAC,MAAM,EAAE,GAAG,IAAI;AACxB,YAAA,IAAI,EAAE,IAAI;AACX,SAAA,CAAC,CAAC;AAEH,QAAA,QACER,sBAAC,CAAA,aAAA,CAAAS,eAAO,EAAC,EAAA,UAAU,EAAE,UAAU,EAAA;AAC7B,YAAAT,sBAAA,CAAA,aAAA,CAACU,+BAAe,EAAA,EAAC,GAAG,EAAE,kBAAkB,EAAA;AACtC,gBAAAV,sBAAA,CAAA,aAAA,CAACW,mBAAS,EAAA,EAAC,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAC,OAAO,EAAA;oBACnDX,sBAAO,CAAA,aAAA,CAAA,OAAA,EAAA,EAAA,IAAI,EAAC,UAAU,EAAA;AACpB,wBAAAA,sBAAA,CAAA,aAAA,CAACY,OAAG,EAAC,EAAA,IAAI,EAAC,KAAK,EAAA,EACZ,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,KACrBC,yBAAY,CAAC;4BACX,MAAM;4BACN,SAAS;4BACT,YAAY;4BACZ,iBAAiB;4BACjB,cAAc;4BACd,WAAW,EAAE,OAAO,CAAC,MAAM;AAC3B,4BAAA,OAAO,EAAE,CAAC;yBACX,CAAC,CACH,CACG,CACA;oBACRb,sBAAO,CAAA,aAAA,CAAA,OAAA,EAAA,EAAA,IAAI,EAAC,UAAU,EAAA,EACnB,WAAW,CAAC,GAAG,CAAC,CAAC,GAAG,MACnBA,sBAAC,CAAA,aAAA,CAAAY,OAAG,IAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAA,EAAG,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,KAAKE,mCAAiB,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAO,CAC5E,CAAC,CACI,CACE,CACI,CACV;AAEb;AAED,IAAA,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,EAAE;AACrB,QAAA,QACEd,sBAAC,CAAA,aAAA,CAAAS,eAAO,EAAC,EAAA,UAAU,EAAE,UAAU,EAAA;AAC7B,YAAAT,sBAAA,CAAA,aAAA,CAACU,+BAAe,EAAA,EAAC,GAAG,EAAE,kBAAkB,EAAA;AACtC,gBAAAV,sBAAA,CAAA,aAAA,CAACW,mBAAS,EAAA,EAAC,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAC,OAAO,EAAA;oBACnDX,sBAAO,CAAA,aAAA,CAAA,OAAA,EAAA,EAAA,IAAI,EAAC,UAAU,EAAA;AACpB,wBAAAA,sBAAA,CAAA,aAAA,CAACY,OAAG,EAAC,EAAA,IAAI,EAAC,KAAK,EAAA,EACZ,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,KACrBC,yBAAY,CAAC;4BACX,MAAM;4BACN,SAAS;4BACT,YAAY;4BACZ,iBAAiB;4BACjB,cAAc;4BACd,WAAW,EAAE,OAAO,CAAC,MAAM;AAC3B,4BAAA,OAAO,EAAE,CAAC;yBACX,CAAC,CACH,CACG,CACA;oBACRb,sBAAO,CAAA,aAAA,CAAA,OAAA,EAAA,EAAA,IAAI,EAAC,UAAU,EAAA;AACpB,wBAAAA,sBAAA,CAAA,aAAA,CAACe,iCAAgB,EAAC,EAAA,WAAW,EAAE,OAAO,CAAC,MAAM,EAAA;AAC3C,4BAAAf,sBAAA,CAAA,aAAA,CAACgB,sCAAqB,EAAA,IAAA,EAEnB,UAAU,CAAC,QAAQ,CACE;4BACxBhB,sBAAC,CAAA,aAAA,CAAAiB,WAAK,IAAC,OAAO,EAAC,IAAI,EAAC,MAAM,EAAC,QAAQ,EAAA;gCACjCjB,sBAAC,CAAA,aAAA,CAAAkB,SAAI,IAAC,OAAO,EAAC,eAAe,EAAE,EAAA,UAAU,CAAC,OAAO,CAAQ;gCACxD,UAAU,CAAC,UAAU,KACpBlB,qCAACkB,SAAI,EAAA,EAAC,OAAO,EAAC,kBAAkB,EAAA,EAAE,UAAU,CAAC,UAAU,CAAQ,CAChE,CACK,CACS,CACb,CACE,CACI,CACV;AAEb;AAED,IAAA,MAAM,SAAS,GAAG,CAAC,GAAa,KAAI;QAClC,MAAM,EAAE,YAAY,GAAG,EAAE,EAAE,WAAW,EAAE,GAAG,GAAG;AAC9C,QAAA,MAAM,QAAQ,GAAGC,uBAAW,CAAC,GAAG,CAAC,EAAE,EAAE,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,CAAC;QAExF,QACEnB,qCAACY,OAAG,EAAA,EAAC,IAAI,EAAC,KAAK,EAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,YAAY,EAAM,GAAA,QAAQ,IACzF,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,KAAKQ,qBAAU,CAAC,GAAG,EAAE,GAAG,EAAE,OAAO,EAAE,QAAQ,CAAC,CAAC,CAC1D;AAEV,KAAC;AAED,IAAA,MAAM,eAAe,GAAG,CAAC,SAAmB,EAAE,KAAqB,KAAI;;AACrE,QAAA,MAAM,qBAAqB,GAAG,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,SAAS,KAAT,IAAA,IAAA,SAAS,KAAT,SAAA,GAAA,SAAA,GAAA,SAAS,CAAE,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,aAAa,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,GAAG;AACjE,QAAA,MAAM,QAAQ,GAAGD,uBAAW,CAAC,KAAK,EAAE,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,CAAC;AACvF,QAAA,QACEnB,sBAAC,CAAA,aAAA,CAAAY,OAAG,EAAC,EAAA,IAAI,EAAC,KAAK,EAAC,GAAG,EAAE,SAAS,CAAC,EAAE,EAAE,SAAS,EAAE,qBAAqB,EAChE,EAAA,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,KAAKS,iCAAgB,CAAC,SAAS,EAAE,GAAG,EAAE,QAAQ,CAAC,CAAC,CAC7D;AAEV,KAAC;AAED,IAAA,MAAM,aAAa,GAAG,CAAC,GAAa,KAAI;;AACtC,QAAA,MAAM,UAAU,GAAG,cAAc,KAAA,IAAA,IAAd,cAAc,KAAd,SAAA,GAAA,SAAA,GAAA,cAAc,CAAE,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;QACnD,QACErB,sBAAO,CAAA,aAAA,CAAA,OAAA,EAAA,EAAA,IAAI,EAAC,UAAU,EAAC,GAAG,EAAE,GAAG,CAAC,EAAE,EAAA;YAC/B,SAAS,CAAC,GAAG,CAAC;YACd,UAAU,KAAI,CAAA,EAAA,GAAA,GAAG,CAAC,UAAU,gDAAE,GAAG,CAAC,CAAC,SAAS,KAAK,eAAe,CAAC,SAAS,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC,CAAA,CAC/E;AAEZ,KAAC;IAED,MAAM,UAAU,GAAG,MAAK;AACtB,QAAA,MAAM,aAAa,GAAG,CAAC,CAAC,cAAc;AACtC,QAAA,MAAM,mBAAmB,GAAG,aAAa,IAAI,YAAY,KAAK,QAAQ;AAEtE,QAAA,IAAI,mBAAmB,EAAE;AACvB,YAAA,OAAO,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC;AAC/B;AAED,QAAA,IAAI,aAAa,EAAE;AACjB,YAAA,QACEA,sBAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAO,IAAI,EAAC,UAAU,EAAA,EACnB,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,KAAI;;AAChB,gBAAA,MAAM,UAAU,GAAG,SAAS,CAAC,GAAG,CAAC;AACjC,gBAAA,MAAM,UAAU,GAAG,cAAc,KAAA,IAAA,IAAd,cAAc,KAAd,SAAA,GAAA,SAAA,GAAA,cAAc,CAAE,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;gBACnD,MAAM,iBAAiB,GACrB,CAAC,UAAU;qBACT,CAAA,EAAA,GAAA,GAAG,CAAC,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,GAAG,CAAC,CAAC,SAAS,KAAK,eAAe,CAAC,SAAS,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC,CAAA;AACxE,oBAAA,EAAE;AACJ,gBAAA,OAAO,CAAC,UAAU,EAAE,GAAG,iBAAiB,CAAC;aAC1C,CAAC,CACI;AAEX;AAED,QAAA,OAAOA,sBAAO,CAAA,aAAA,CAAA,OAAA,EAAA,EAAA,IAAI,EAAC,UAAU,EAAE,EAAA,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,CAAS;AAC7D,KAAC;IAED,MAAM,aAAa,IACjBA,sBAAA,CAAA,aAAA,CAACY,OAAG,EAAC,EAAA,IAAI,EAAC,KAAK,EACZ,EAAA,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,KACrBC,yBAAY,CAAC;QACX,MAAM;QACN,SAAS;QACT,YAAY;QACZ,iBAAiB;QACjB,cAAc;QACd,WAAW,EAAE,OAAO,CAAC,MAAM;AAC3B,QAAA,OAAO,EAAE,CAAC;KACX,CAAC,CACH,CACG,CACP;AAED,IAAA,MAAM,kBAAkB,GAAG,cAAc,CAAC,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC;IACjF,MAAM,qBAAqB,GAAG,cAAc,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,CAAC,aAAa;AAE1E,IAAA,QACEb,sBAAC,CAAA,aAAA,CAAAS,eAAO,EAAC,EAAA,UAAU,EAAE,UAAU,EAAA;AAC5B,QAAA,qBAAqB,KACpBT,sBAAA,CAAA,aAAA,CAACsB,mBAAS,EACR,EAAA,eAAe,EAAE,eAAe,EAChC,qBAAqB,EAAE,qBAAqB,EAC5C,YAAY,EAAE,kBAAkB,EAE/B,EAAA,aAAa,CACJ,CACb;AACD,QAAAtB,sBAAA,CAAA,aAAA,CAACU,+BAAe,EAAA,EAAC,GAAG,EAAE,kBAAkB,EAAA;YACrC,kBAAkB,KACjBV,sBAAA,CAAA,aAAA,CAACuB,qBAAU,EAAA,EACT,QAAQ,EAAE,QAAQ,EAClB,qBAAqB,EAAE,qBAAqB,EAC5C,YAAY,EAAE,kBAAkB,EAChC,UAAU,EAAE,kBAAkB,EAC9B,eAAe,EAAE,eAAe,EAAA,EAE/B,aAAa,CACH,CACd;YACDvB,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,qBAAqB,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EAAI,CAAA;AACzD,YAAAA,sBAAA,CAAA,aAAA,CAACW,mBAAS,EAAA,EAAC,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAC,OAAO,EAAA;AACnD,gBAAAX,sBAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAO,IAAI,EAAC,UAAU,EAAA,EAAE,aAAa,CAAS;AAC7C,gBAAA,UAAU,EAAE;AACZ,gBAAA,kBAAkB,KACjBA,sBAAO,CAAA,aAAA,CAAA,OAAA,EAAA,EAAA,IAAI,EAAC,UAAU,EAAA;AACpB,oBAAAA,sBAAA,CAAA,aAAA,CAACY,OAAG,EAAA,EAAC,IAAI,EAAC,KAAK,EAAA,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,KAAKY,yBAAY,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC,CAAO,CACnE,CACT,CACS,CACI,CACV;AAEd;AAEA,SAAS,CAAC,YAAY,GAAG;AACvB,IAAA,OAAO,EAAE,KAAK;AACd,IAAA,eAAe,EAAE,CAAC;AAClB,IAAA,aAAa,EAAE,UAAU;AACzB,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,kBAAkB,EAAE,IAAI;CACzB;AAED,SAAS,CAAC,IAAI,GAAGC,SAAI;AACrB,SAAS,CAAC,UAAU,GAAGC,qBAAU;AACjC,SAAS,CAAC,aAAa,GAAGC,2BAAa;AACvC,SAAS,CAAC,eAAe,GAAGC,+BAAe;AAC3C,SAAS,CAAC,MAAM,GAAGC,aAAM;AACzB,SAAS,CAAC,QAAQ,GAAGC,iBAAQ;AAC7B,SAAS,CAAC,MAAM,GAAGC,aAAM;;;;"}
|
|
1
|
+
{"version":3,"file":"DataTable.cjs","sources":["../../../src/components/DataTable/DataTable.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-redundant-roles */\n\nimport React, { useRef } from 'react';\nimport { Stack } from '../Stack';\nimport { Text } from '../Text';\n\nimport { useDragToScroll } from '../../hooks';\n\nimport { generateTableCss } from './utils';\nimport { DataTableProps, CustomState, TableRow } from './types';\n\nimport { useCellWidths, useColumns, useScrollPosition, useSelection } from './hooks';\n\nimport {\n renderCell,\n renderFooter,\n renderHeader,\n renderLoadingCell,\n renderNestedCell,\n} from './renderers';\n\nimport { ActionBar } from './components/ActionBar';\nimport { Cell } from './components/Cell';\nimport { ColumnMenu } from './components/ColumnMenu';\nimport { EmptyBodyContent, EmptyBodyGlyphWrapper } from './components/EmptyBodyContent';\nimport { Header } from './components/Header';\nimport { NoWrap } from './components/NoWrap';\nimport { Row } from './components/Row';\nimport { ScrollContainer } from './components/ScrollContainer';\nimport { TableGrid } from './components/TableGrid';\nimport { Truncate } from './components/Truncate';\nimport { Wrapper } from './components/Wrapper';\nimport { SelectionCell } from './components/SelectionCell';\nimport { SelectionHeader } from './components/SelectionHeader';\nimport { StickyHead } from './components/StickyHead';\n\nimport { getRowState } from './utils/getRowState';\nimport { InfoIcon } from '../../tempIcons/InfoIcon';\n\nconst defaultEmptyState: CustomState = {\n iconSlot: <InfoIcon width={48} height={48} />,\n heading: 'No results',\n};\n\nconst emptyAction = () => {};\n\nexport const DataTable = ({\n actionBarSlot,\n borderMode,\n columns: initialColumns,\n emptyState = defaultEmptyState,\n expandedRowIds,\n loading,\n loadingRowCount,\n onChangeSort,\n rows,\n disabledRowIds,\n selectionMode,\n selectionState,\n setExpanded,\n sortState,\n stripingMode,\n enableStickyHeader,\n resizeableColumns,\n onResizeColumns,\n columnWidths,\n stickyHeaderTop,\n}: DataTableProps) => {\n // Refs\n\n const scrollContainerRef = useRef<HTMLDivElement>(null);\n const tableRef = useRef<HTMLTableElement>(null);\n const intersectionTargetRef = useRef<HTMLDivElement>(null);\n\n useDragToScroll({ targetRef: scrollContainerRef, ignoreClassName: 'th-divider' });\n\n // Configure row selection\n\n const enabledRowIds = rows.map((row) => row.id).filter((id) => !disabledRowIds?.includes(id));\n\n const { selectionEnabled, selectedRowIds, selectionColumn, setSelected } = useSelection({\n selectionMode,\n selectionState,\n enabledRowIds,\n });\n\n // Assign actions\n\n const actions = {\n setSelected: setSelected || emptyAction,\n setExpanded: setExpanded || emptyAction,\n };\n\n // Process columns\n\n const columnsWithSelection = [selectionColumn, ...initialColumns];\n const allColumns = selectionEnabled ? columnsWithSelection : initialColumns;\n\n const cellWidths = useCellWidths(tableRef, scrollContainerRef);\n const {\n visible,\n pinnedLeft,\n pinnedRight,\n setColumnWidth,\n columnWidths: calcColumnWidths,\n } = useColumns(allColumns, tableRef, onResizeColumns, columnWidths);\n const adjustedCellWidths =\n cellWidths.length === visible.length\n ? (visible.map((col, i) =>\n Number.isNaN(calcColumnWidths[col.id] || '') ? cellWidths[i] : calcColumnWidths[col.id],\n ) as number[])\n : cellWidths;\n\n // Generate styles\n const { scrollPosition } = useScrollPosition(scrollContainerRef);\n const tableCss = generateTableCss({\n pinnedLeft,\n pinnedRight,\n cellWidths: adjustedCellWidths,\n scrollPosition,\n columnWidths: calcColumnWidths,\n columns: visible,\n stripingMode,\n });\n\n // Render states\n\n if (loading) {\n const loadingRows: Array<TableRow> = new Array(loadingRowCount).fill(true).map(() => ({\n // generate random ID forcing all rows to re-render avoid animation de-sync\n id: Math.random() * 1000,\n data: null,\n }));\n\n return (\n <Wrapper borderMode={borderMode}>\n <ScrollContainer ref={scrollContainerRef}>\n <TableGrid css={tableCss} ref={tableRef} role=\"table\">\n <thead role=\"rowgroup\">\n <Row role=\"row\">\n {visible.map((column, i) =>\n renderHeader({\n column,\n sortState,\n onChangeSort,\n resizeableColumns,\n setColumnWidth,\n columnCount: visible.length,\n columnI: i,\n }),\n )}\n </Row>\n </thead>\n <tbody role=\"rowgroup\">\n {loadingRows.map((row) => (\n <Row key={row.id}>{visible.map((col) => renderLoadingCell(row, col))}</Row>\n ))}\n </tbody>\n </TableGrid>\n </ScrollContainer>\n </Wrapper>\n );\n }\n\n if (rows.length === 0) {\n return (\n <Wrapper borderMode={borderMode}>\n <ScrollContainer ref={scrollContainerRef}>\n <TableGrid css={tableCss} ref={tableRef} role=\"table\">\n <thead role=\"rowgroup\">\n <Row role=\"row\">\n {visible.map((column, i) =>\n renderHeader({\n column,\n sortState,\n onChangeSort,\n resizeableColumns,\n setColumnWidth,\n columnCount: visible.length,\n columnI: i,\n }),\n )}\n </Row>\n </thead>\n <tbody role=\"rowgroup\">\n <EmptyBodyContent columnCount={visible.length}>\n <EmptyBodyGlyphWrapper>\n {/* Should be 48x48px */}\n {emptyState.iconSlot}\n </EmptyBodyGlyphWrapper>\n <Stack spacing=\"sm\" alignX=\"center\">\n <Text variant=\"headingMedium\">{emptyState.heading}</Text>\n {emptyState.subheading && (\n <Text variant=\"subheadingMedium\">{emptyState.subheading}</Text>\n )}\n </Stack>\n </EmptyBodyContent>\n </tbody>\n </TableGrid>\n </ScrollContainer>\n </Wrapper>\n );\n }\n\n const renderRow = (row: TableRow) => {\n const { e2eClassName = '', accentColor } = row;\n const rowState = getRowState(row.id, { selectedRowIds, expandedRowIds, disabledRowIds });\n\n return (\n <Row role=\"row\" key={row.id} accentColor={accentColor} className={e2eClassName} {...rowState}>\n {visible.map((col) => renderCell(row, col, actions, rowState))}\n </Row>\n );\n };\n\n const renderNestedRow = (nestedRow: TableRow, rowId: TableRow['id']) => {\n const nestedRowE2eClassName = nestedRow?.data?.e2eClassNames?.row;\n const rowState = getRowState(rowId, { selectedRowIds, expandedRowIds, disabledRowIds });\n return (\n <Row role=\"row\" key={nestedRow.id} className={nestedRowE2eClassName}>\n {visible.map((col) => renderNestedCell(nestedRow, col, rowState))}\n </Row>\n );\n };\n\n const renderSection = (row: TableRow) => {\n const isExpanded = expandedRowIds?.includes(row.id);\n return (\n <tbody role=\"rowgroup\" key={row.id}>\n {renderRow(row)}\n {isExpanded && row.nestedRows?.map((nestedRow) => renderNestedRow(nestedRow, row.id))}\n </tbody>\n );\n };\n\n const renderBody = () => {\n const hasNestedRows = !!expandedRowIds;\n const hasMultipleSections = hasNestedRows && stripingMode === 'nested';\n\n if (hasMultipleSections) {\n return rows.map(renderSection);\n }\n\n if (hasNestedRows) {\n return (\n <tbody role=\"rowgroup\">\n {rows.map((row) => {\n const rowElement = renderRow(row);\n const isExpanded = expandedRowIds?.includes(row.id);\n const nestedRowElements =\n (isExpanded &&\n row.nestedRows?.map((nestedRow) => renderNestedRow(nestedRow, row.id))) ||\n [];\n return [rowElement, ...nestedRowElements];\n })}\n </tbody>\n );\n }\n\n return <tbody role=\"rowgroup\">{rows.map(renderRow)}</tbody>;\n };\n\n const headersMarkup = (\n <Row role=\"row\">\n {visible.map((column, i) =>\n renderHeader({\n column,\n sortState,\n onChangeSort,\n resizeableColumns,\n setColumnWidth,\n columnCount: visible.length,\n columnI: i,\n }),\n )}\n </Row>\n );\n\n const shouldRenderFooter = initialColumns.some((column) => !!column.renderFooter);\n const shouldRenderActionBar = selectedRowIds.length > 0 && !!actionBarSlot;\n\n return (\n <Wrapper borderMode={borderMode}>\n {shouldRenderActionBar && (\n <ActionBar\n selectionColumn={selectionColumn}\n intersectionTargetRef={intersectionTargetRef}\n containerRef={scrollContainerRef}\n >\n {actionBarSlot}\n </ActionBar>\n )}\n <ScrollContainer ref={scrollContainerRef}>\n {enableStickyHeader && (\n <StickyHead\n tableCss={tableCss}\n intersectionTargetRef={intersectionTargetRef}\n containerRef={scrollContainerRef}\n cellWidths={adjustedCellWidths}\n stickyHeaderTop={stickyHeaderTop}\n >\n {headersMarkup}\n </StickyHead>\n )}\n <div ref={intersectionTargetRef} style={{ height: 0 }} />\n <TableGrid css={tableCss} ref={tableRef} role=\"table\">\n <thead role=\"rowgroup\">{headersMarkup}</thead>\n {renderBody()}\n {shouldRenderFooter && (\n <tfoot role=\"rowgroup\">\n <Row role=\"row\">{visible.map((column) => renderFooter({ column }))}</Row>\n </tfoot>\n )}\n </TableGrid>\n </ScrollContainer>\n </Wrapper>\n );\n};\n\nDataTable.defaultProps = {\n loading: false,\n loadingRowCount: 5,\n selectionMode: 'multiple',\n stripingMode: 'row',\n enableStickyHeader: true,\n};\n\nDataTable.Cell = Cell;\nDataTable.ColumnMenu = ColumnMenu;\nDataTable.SelectionCell = SelectionCell;\nDataTable.SelectionHeader = SelectionHeader;\nDataTable.Header = Header;\nDataTable.Truncate = Truncate;\nDataTable.NoWrap = NoWrap;\n"],"names":["React","InfoIcon","useRef","useDragToScroll","useSelection","useCellWidths","useColumns","useScrollPosition","generateTableCss","Wrapper","ScrollContainer","TableGrid","Row","renderHeader","renderLoadingCell","EmptyBodyContent","EmptyBodyGlyphWrapper","Stack","Text","getRowState","renderCell","renderNestedCell","ActionBar","StickyHead","renderFooter","Cell","ColumnMenu","SelectionCell","SelectionHeader","Header","Truncate","NoWrap"],"mappings":"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"}
|
|
@@ -1,6 +1,10 @@
|
|
|
1
1
|
import React__default, { useRef } from 'react';
|
|
2
2
|
import { Stack } from '../Stack/Stack.js';
|
|
3
3
|
import { Text } from '../Text/Text.js';
|
|
4
|
+
import '../../hooks/useFocusVisible.js';
|
|
5
|
+
import 'uid/secure';
|
|
6
|
+
import { useDragToScroll } from '../../hooks/useDragToScroll.js';
|
|
7
|
+
import 'lodash.throttle';
|
|
4
8
|
import { generateTableCss } from './utils/generateTableCss.js';
|
|
5
9
|
import './types.js';
|
|
6
10
|
import '../../theme/modules/shadows.js';
|
|
@@ -9,7 +13,6 @@ import '../../theme/modules/text.js';
|
|
|
9
13
|
import 'styled-components';
|
|
10
14
|
import { useCellWidths } from './hooks/useCellWidths.js';
|
|
11
15
|
import { useColumns } from './hooks/useColumns.js';
|
|
12
|
-
import { useDragToScroll } from './hooks/useDragToScroll.js';
|
|
13
16
|
import { useScrollPosition } from './hooks/useScrollPosition.js';
|
|
14
17
|
import { useSelection } from './hooks/useSelection.js';
|
|
15
18
|
import { renderCell } from './renderers/renderCell.js';
|
|
@@ -45,7 +48,7 @@ const DataTable = ({ actionBarSlot, borderMode, columns: initialColumns, emptySt
|
|
|
45
48
|
const scrollContainerRef = useRef(null);
|
|
46
49
|
const tableRef = useRef(null);
|
|
47
50
|
const intersectionTargetRef = useRef(null);
|
|
48
|
-
useDragToScroll(scrollContainerRef);
|
|
51
|
+
useDragToScroll({ targetRef: scrollContainerRef, ignoreClassName: 'th-divider' });
|
|
49
52
|
// Configure row selection
|
|
50
53
|
const enabledRowIds = rows.map((row) => row.id).filter((id) => !(disabledRowIds === null || disabledRowIds === undefined ? undefined : disabledRowIds.includes(id)));
|
|
51
54
|
const { selectionEnabled, selectedRowIds, selectionColumn, setSelected } = useSelection({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.js","sources":["../../../src/components/DataTable/DataTable.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-redundant-roles */\n\nimport React, { useRef } from 'react';\nimport { Stack } from '../Stack';\nimport { Text } from '../Text';\n\nimport { generateTableCss } from './utils';\nimport { DataTableProps, CustomState, TableRow } from './types';\n\nimport {\n useCellWidths,\n useColumns,\n useDragToScroll,\n useScrollPosition,\n useSelection,\n} from './hooks';\n\nimport {\n renderCell,\n renderFooter,\n renderHeader,\n renderLoadingCell,\n renderNestedCell,\n} from './renderers';\n\nimport { ActionBar } from './components/ActionBar';\nimport { Cell } from './components/Cell';\nimport { ColumnMenu } from './components/ColumnMenu';\nimport { EmptyBodyContent, EmptyBodyGlyphWrapper } from './components/EmptyBodyContent';\nimport { Header } from './components/Header';\nimport { NoWrap } from './components/NoWrap';\nimport { Row } from './components/Row';\nimport { ScrollContainer } from './components/ScrollContainer';\nimport { TableGrid } from './components/TableGrid';\nimport { Truncate } from './components/Truncate';\nimport { Wrapper } from './components/Wrapper';\nimport { SelectionCell } from './components/SelectionCell';\nimport { SelectionHeader } from './components/SelectionHeader';\nimport { StickyHead } from './components/StickyHead';\n\nimport { getRowState } from './utils/getRowState';\nimport { InfoIcon } from '../../tempIcons/InfoIcon';\n\nconst defaultEmptyState: CustomState = {\n iconSlot: <InfoIcon width={48} height={48} />,\n heading: 'No results',\n};\n\nconst emptyAction = () => {};\n\nexport const DataTable = ({\n actionBarSlot,\n borderMode,\n columns: initialColumns,\n emptyState = defaultEmptyState,\n expandedRowIds,\n loading,\n loadingRowCount,\n onChangeSort,\n rows,\n disabledRowIds,\n selectionMode,\n selectionState,\n setExpanded,\n sortState,\n stripingMode,\n enableStickyHeader,\n resizeableColumns,\n onResizeColumns,\n columnWidths,\n stickyHeaderTop,\n}: DataTableProps) => {\n // Refs\n\n const scrollContainerRef = useRef<HTMLDivElement>(null);\n const tableRef = useRef<HTMLTableElement>(null);\n const intersectionTargetRef = useRef<HTMLDivElement>(null);\n\n useDragToScroll(scrollContainerRef);\n\n // Configure row selection\n\n const enabledRowIds = rows.map((row) => row.id).filter((id) => !disabledRowIds?.includes(id));\n\n const { selectionEnabled, selectedRowIds, selectionColumn, setSelected } = useSelection({\n selectionMode,\n selectionState,\n enabledRowIds,\n });\n\n // Assign actions\n\n const actions = {\n setSelected: setSelected || emptyAction,\n setExpanded: setExpanded || emptyAction,\n };\n\n // Process columns\n\n const columnsWithSelection = [selectionColumn, ...initialColumns];\n const allColumns = selectionEnabled ? columnsWithSelection : initialColumns;\n\n const cellWidths = useCellWidths(tableRef, scrollContainerRef);\n const {\n visible,\n pinnedLeft,\n pinnedRight,\n setColumnWidth,\n columnWidths: calcColumnWidths,\n } = useColumns(allColumns, tableRef, onResizeColumns, columnWidths);\n const adjustedCellWidths =\n cellWidths.length === visible.length\n ? (visible.map((col, i) =>\n Number.isNaN(calcColumnWidths[col.id] || '') ? cellWidths[i] : calcColumnWidths[col.id],\n ) as number[])\n : cellWidths;\n\n // Generate styles\n const { scrollPosition } = useScrollPosition(scrollContainerRef);\n const tableCss = generateTableCss({\n pinnedLeft,\n pinnedRight,\n cellWidths: adjustedCellWidths,\n scrollPosition,\n columnWidths: calcColumnWidths,\n columns: visible,\n stripingMode,\n });\n\n // Render states\n\n if (loading) {\n const loadingRows: Array<TableRow> = new Array(loadingRowCount).fill(true).map(() => ({\n // generate random ID forcing all rows to re-render avoid animation de-sync\n id: Math.random() * 1000,\n data: null,\n }));\n\n return (\n <Wrapper borderMode={borderMode}>\n <ScrollContainer ref={scrollContainerRef}>\n <TableGrid css={tableCss} ref={tableRef} role=\"table\">\n <thead role=\"rowgroup\">\n <Row role=\"row\">\n {visible.map((column, i) =>\n renderHeader({\n column,\n sortState,\n onChangeSort,\n resizeableColumns,\n setColumnWidth,\n columnCount: visible.length,\n columnI: i,\n }),\n )}\n </Row>\n </thead>\n <tbody role=\"rowgroup\">\n {loadingRows.map((row) => (\n <Row key={row.id}>{visible.map((col) => renderLoadingCell(row, col))}</Row>\n ))}\n </tbody>\n </TableGrid>\n </ScrollContainer>\n </Wrapper>\n );\n }\n\n if (rows.length === 0) {\n return (\n <Wrapper borderMode={borderMode}>\n <ScrollContainer ref={scrollContainerRef}>\n <TableGrid css={tableCss} ref={tableRef} role=\"table\">\n <thead role=\"rowgroup\">\n <Row role=\"row\">\n {visible.map((column, i) =>\n renderHeader({\n column,\n sortState,\n onChangeSort,\n resizeableColumns,\n setColumnWidth,\n columnCount: visible.length,\n columnI: i,\n }),\n )}\n </Row>\n </thead>\n <tbody role=\"rowgroup\">\n <EmptyBodyContent columnCount={visible.length}>\n <EmptyBodyGlyphWrapper>\n {/* Should be 48x48px */}\n {emptyState.iconSlot}\n </EmptyBodyGlyphWrapper>\n <Stack spacing=\"sm\" alignX=\"center\">\n <Text variant=\"headingMedium\">{emptyState.heading}</Text>\n {emptyState.subheading && (\n <Text variant=\"subheadingMedium\">{emptyState.subheading}</Text>\n )}\n </Stack>\n </EmptyBodyContent>\n </tbody>\n </TableGrid>\n </ScrollContainer>\n </Wrapper>\n );\n }\n\n const renderRow = (row: TableRow) => {\n const { e2eClassName = '', accentColor } = row;\n const rowState = getRowState(row.id, { selectedRowIds, expandedRowIds, disabledRowIds });\n\n return (\n <Row role=\"row\" key={row.id} accentColor={accentColor} className={e2eClassName} {...rowState}>\n {visible.map((col) => renderCell(row, col, actions, rowState))}\n </Row>\n );\n };\n\n const renderNestedRow = (nestedRow: TableRow, rowId: TableRow['id']) => {\n const nestedRowE2eClassName = nestedRow?.data?.e2eClassNames?.row;\n const rowState = getRowState(rowId, { selectedRowIds, expandedRowIds, disabledRowIds });\n return (\n <Row role=\"row\" key={nestedRow.id} className={nestedRowE2eClassName}>\n {visible.map((col) => renderNestedCell(nestedRow, col, rowState))}\n </Row>\n );\n };\n\n const renderSection = (row: TableRow) => {\n const isExpanded = expandedRowIds?.includes(row.id);\n return (\n <tbody role=\"rowgroup\" key={row.id}>\n {renderRow(row)}\n {isExpanded && row.nestedRows?.map((nestedRow) => renderNestedRow(nestedRow, row.id))}\n </tbody>\n );\n };\n\n const renderBody = () => {\n const hasNestedRows = !!expandedRowIds;\n const hasMultipleSections = hasNestedRows && stripingMode === 'nested';\n\n if (hasMultipleSections) {\n return rows.map(renderSection);\n }\n\n if (hasNestedRows) {\n return (\n <tbody role=\"rowgroup\">\n {rows.map((row) => {\n const rowElement = renderRow(row);\n const isExpanded = expandedRowIds?.includes(row.id);\n const nestedRowElements =\n (isExpanded &&\n row.nestedRows?.map((nestedRow) => renderNestedRow(nestedRow, row.id))) ||\n [];\n return [rowElement, ...nestedRowElements];\n })}\n </tbody>\n );\n }\n\n return <tbody role=\"rowgroup\">{rows.map(renderRow)}</tbody>;\n };\n\n const headersMarkup = (\n <Row role=\"row\">\n {visible.map((column, i) =>\n renderHeader({\n column,\n sortState,\n onChangeSort,\n resizeableColumns,\n setColumnWidth,\n columnCount: visible.length,\n columnI: i,\n }),\n )}\n </Row>\n );\n\n const shouldRenderFooter = initialColumns.some((column) => !!column.renderFooter);\n const shouldRenderActionBar = selectedRowIds.length > 0 && !!actionBarSlot;\n\n return (\n <Wrapper borderMode={borderMode}>\n {shouldRenderActionBar && (\n <ActionBar\n selectionColumn={selectionColumn}\n intersectionTargetRef={intersectionTargetRef}\n containerRef={scrollContainerRef}\n >\n {actionBarSlot}\n </ActionBar>\n )}\n <ScrollContainer ref={scrollContainerRef}>\n {enableStickyHeader && (\n <StickyHead\n tableCss={tableCss}\n intersectionTargetRef={intersectionTargetRef}\n containerRef={scrollContainerRef}\n cellWidths={adjustedCellWidths}\n stickyHeaderTop={stickyHeaderTop}\n >\n {headersMarkup}\n </StickyHead>\n )}\n <div ref={intersectionTargetRef} style={{ height: 0 }} />\n <TableGrid css={tableCss} ref={tableRef} role=\"table\">\n <thead role=\"rowgroup\">{headersMarkup}</thead>\n {renderBody()}\n {shouldRenderFooter && (\n <tfoot role=\"rowgroup\">\n <Row role=\"row\">{visible.map((column) => renderFooter({ column }))}</Row>\n </tfoot>\n )}\n </TableGrid>\n </ScrollContainer>\n </Wrapper>\n );\n};\n\nDataTable.defaultProps = {\n loading: false,\n loadingRowCount: 5,\n selectionMode: 'multiple',\n stripingMode: 'row',\n enableStickyHeader: true,\n};\n\nDataTable.Cell = Cell;\nDataTable.ColumnMenu = ColumnMenu;\nDataTable.SelectionCell = SelectionCell;\nDataTable.SelectionHeader = SelectionHeader;\nDataTable.Header = Header;\nDataTable.Truncate = Truncate;\nDataTable.NoWrap = NoWrap;\n"],"names":["React"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DataTable.js","sources":["../../../src/components/DataTable/DataTable.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-redundant-roles */\n\nimport React, { useRef } from 'react';\nimport { Stack } from '../Stack';\nimport { Text } from '../Text';\n\nimport { useDragToScroll } from '../../hooks';\n\nimport { generateTableCss } from './utils';\nimport { DataTableProps, CustomState, TableRow } from './types';\n\nimport { useCellWidths, useColumns, useScrollPosition, useSelection } from './hooks';\n\nimport {\n renderCell,\n renderFooter,\n renderHeader,\n renderLoadingCell,\n renderNestedCell,\n} from './renderers';\n\nimport { ActionBar } from './components/ActionBar';\nimport { Cell } from './components/Cell';\nimport { ColumnMenu } from './components/ColumnMenu';\nimport { EmptyBodyContent, EmptyBodyGlyphWrapper } from './components/EmptyBodyContent';\nimport { Header } from './components/Header';\nimport { NoWrap } from './components/NoWrap';\nimport { Row } from './components/Row';\nimport { ScrollContainer } from './components/ScrollContainer';\nimport { TableGrid } from './components/TableGrid';\nimport { Truncate } from './components/Truncate';\nimport { Wrapper } from './components/Wrapper';\nimport { SelectionCell } from './components/SelectionCell';\nimport { SelectionHeader } from './components/SelectionHeader';\nimport { StickyHead } from './components/StickyHead';\n\nimport { getRowState } from './utils/getRowState';\nimport { InfoIcon } from '../../tempIcons/InfoIcon';\n\nconst defaultEmptyState: CustomState = {\n iconSlot: <InfoIcon width={48} height={48} />,\n heading: 'No results',\n};\n\nconst emptyAction = () => {};\n\nexport const DataTable = ({\n actionBarSlot,\n borderMode,\n columns: initialColumns,\n emptyState = defaultEmptyState,\n expandedRowIds,\n loading,\n loadingRowCount,\n onChangeSort,\n rows,\n disabledRowIds,\n selectionMode,\n selectionState,\n setExpanded,\n sortState,\n stripingMode,\n enableStickyHeader,\n resizeableColumns,\n onResizeColumns,\n columnWidths,\n stickyHeaderTop,\n}: DataTableProps) => {\n // Refs\n\n const scrollContainerRef = useRef<HTMLDivElement>(null);\n const tableRef = useRef<HTMLTableElement>(null);\n const intersectionTargetRef = useRef<HTMLDivElement>(null);\n\n useDragToScroll({ targetRef: scrollContainerRef, ignoreClassName: 'th-divider' });\n\n // Configure row selection\n\n const enabledRowIds = rows.map((row) => row.id).filter((id) => !disabledRowIds?.includes(id));\n\n const { selectionEnabled, selectedRowIds, selectionColumn, setSelected } = useSelection({\n selectionMode,\n selectionState,\n enabledRowIds,\n });\n\n // Assign actions\n\n const actions = {\n setSelected: setSelected || emptyAction,\n setExpanded: setExpanded || emptyAction,\n };\n\n // Process columns\n\n const columnsWithSelection = [selectionColumn, ...initialColumns];\n const allColumns = selectionEnabled ? columnsWithSelection : initialColumns;\n\n const cellWidths = useCellWidths(tableRef, scrollContainerRef);\n const {\n visible,\n pinnedLeft,\n pinnedRight,\n setColumnWidth,\n columnWidths: calcColumnWidths,\n } = useColumns(allColumns, tableRef, onResizeColumns, columnWidths);\n const adjustedCellWidths =\n cellWidths.length === visible.length\n ? (visible.map((col, i) =>\n Number.isNaN(calcColumnWidths[col.id] || '') ? cellWidths[i] : calcColumnWidths[col.id],\n ) as number[])\n : cellWidths;\n\n // Generate styles\n const { scrollPosition } = useScrollPosition(scrollContainerRef);\n const tableCss = generateTableCss({\n pinnedLeft,\n pinnedRight,\n cellWidths: adjustedCellWidths,\n scrollPosition,\n columnWidths: calcColumnWidths,\n columns: visible,\n stripingMode,\n });\n\n // Render states\n\n if (loading) {\n const loadingRows: Array<TableRow> = new Array(loadingRowCount).fill(true).map(() => ({\n // generate random ID forcing all rows to re-render avoid animation de-sync\n id: Math.random() * 1000,\n data: null,\n }));\n\n return (\n <Wrapper borderMode={borderMode}>\n <ScrollContainer ref={scrollContainerRef}>\n <TableGrid css={tableCss} ref={tableRef} role=\"table\">\n <thead role=\"rowgroup\">\n <Row role=\"row\">\n {visible.map((column, i) =>\n renderHeader({\n column,\n sortState,\n onChangeSort,\n resizeableColumns,\n setColumnWidth,\n columnCount: visible.length,\n columnI: i,\n }),\n )}\n </Row>\n </thead>\n <tbody role=\"rowgroup\">\n {loadingRows.map((row) => (\n <Row key={row.id}>{visible.map((col) => renderLoadingCell(row, col))}</Row>\n ))}\n </tbody>\n </TableGrid>\n </ScrollContainer>\n </Wrapper>\n );\n }\n\n if (rows.length === 0) {\n return (\n <Wrapper borderMode={borderMode}>\n <ScrollContainer ref={scrollContainerRef}>\n <TableGrid css={tableCss} ref={tableRef} role=\"table\">\n <thead role=\"rowgroup\">\n <Row role=\"row\">\n {visible.map((column, i) =>\n renderHeader({\n column,\n sortState,\n onChangeSort,\n resizeableColumns,\n setColumnWidth,\n columnCount: visible.length,\n columnI: i,\n }),\n )}\n </Row>\n </thead>\n <tbody role=\"rowgroup\">\n <EmptyBodyContent columnCount={visible.length}>\n <EmptyBodyGlyphWrapper>\n {/* Should be 48x48px */}\n {emptyState.iconSlot}\n </EmptyBodyGlyphWrapper>\n <Stack spacing=\"sm\" alignX=\"center\">\n <Text variant=\"headingMedium\">{emptyState.heading}</Text>\n {emptyState.subheading && (\n <Text variant=\"subheadingMedium\">{emptyState.subheading}</Text>\n )}\n </Stack>\n </EmptyBodyContent>\n </tbody>\n </TableGrid>\n </ScrollContainer>\n </Wrapper>\n );\n }\n\n const renderRow = (row: TableRow) => {\n const { e2eClassName = '', accentColor } = row;\n const rowState = getRowState(row.id, { selectedRowIds, expandedRowIds, disabledRowIds });\n\n return (\n <Row role=\"row\" key={row.id} accentColor={accentColor} className={e2eClassName} {...rowState}>\n {visible.map((col) => renderCell(row, col, actions, rowState))}\n </Row>\n );\n };\n\n const renderNestedRow = (nestedRow: TableRow, rowId: TableRow['id']) => {\n const nestedRowE2eClassName = nestedRow?.data?.e2eClassNames?.row;\n const rowState = getRowState(rowId, { selectedRowIds, expandedRowIds, disabledRowIds });\n return (\n <Row role=\"row\" key={nestedRow.id} className={nestedRowE2eClassName}>\n {visible.map((col) => renderNestedCell(nestedRow, col, rowState))}\n </Row>\n );\n };\n\n const renderSection = (row: TableRow) => {\n const isExpanded = expandedRowIds?.includes(row.id);\n return (\n <tbody role=\"rowgroup\" key={row.id}>\n {renderRow(row)}\n {isExpanded && row.nestedRows?.map((nestedRow) => renderNestedRow(nestedRow, row.id))}\n </tbody>\n );\n };\n\n const renderBody = () => {\n const hasNestedRows = !!expandedRowIds;\n const hasMultipleSections = hasNestedRows && stripingMode === 'nested';\n\n if (hasMultipleSections) {\n return rows.map(renderSection);\n }\n\n if (hasNestedRows) {\n return (\n <tbody role=\"rowgroup\">\n {rows.map((row) => {\n const rowElement = renderRow(row);\n const isExpanded = expandedRowIds?.includes(row.id);\n const nestedRowElements =\n (isExpanded &&\n row.nestedRows?.map((nestedRow) => renderNestedRow(nestedRow, row.id))) ||\n [];\n return [rowElement, ...nestedRowElements];\n })}\n </tbody>\n );\n }\n\n return <tbody role=\"rowgroup\">{rows.map(renderRow)}</tbody>;\n };\n\n const headersMarkup = (\n <Row role=\"row\">\n {visible.map((column, i) =>\n renderHeader({\n column,\n sortState,\n onChangeSort,\n resizeableColumns,\n setColumnWidth,\n columnCount: visible.length,\n columnI: i,\n }),\n )}\n </Row>\n );\n\n const shouldRenderFooter = initialColumns.some((column) => !!column.renderFooter);\n const shouldRenderActionBar = selectedRowIds.length > 0 && !!actionBarSlot;\n\n return (\n <Wrapper borderMode={borderMode}>\n {shouldRenderActionBar && (\n <ActionBar\n selectionColumn={selectionColumn}\n intersectionTargetRef={intersectionTargetRef}\n containerRef={scrollContainerRef}\n >\n {actionBarSlot}\n </ActionBar>\n )}\n <ScrollContainer ref={scrollContainerRef}>\n {enableStickyHeader && (\n <StickyHead\n tableCss={tableCss}\n intersectionTargetRef={intersectionTargetRef}\n containerRef={scrollContainerRef}\n cellWidths={adjustedCellWidths}\n stickyHeaderTop={stickyHeaderTop}\n >\n {headersMarkup}\n </StickyHead>\n )}\n <div ref={intersectionTargetRef} style={{ height: 0 }} />\n <TableGrid css={tableCss} ref={tableRef} role=\"table\">\n <thead role=\"rowgroup\">{headersMarkup}</thead>\n {renderBody()}\n {shouldRenderFooter && (\n <tfoot role=\"rowgroup\">\n <Row role=\"row\">{visible.map((column) => renderFooter({ column }))}</Row>\n </tfoot>\n )}\n </TableGrid>\n </ScrollContainer>\n </Wrapper>\n );\n};\n\nDataTable.defaultProps = {\n loading: false,\n loadingRowCount: 5,\n selectionMode: 'multiple',\n stripingMode: 'row',\n enableStickyHeader: true,\n};\n\nDataTable.Cell = Cell;\nDataTable.ColumnMenu = ColumnMenu;\nDataTable.SelectionCell = SelectionCell;\nDataTable.SelectionHeader = SelectionHeader;\nDataTable.Header = Header;\nDataTable.Truncate = Truncate;\nDataTable.NoWrap = NoWrap;\n"],"names":["React"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { DataTable } from './DataTable';
|
|
2
|
-
export { useCellWidths, useColumns,
|
|
2
|
+
export { useCellWidths, useColumns, useNested, useScrollPosition, useSelection } from './hooks';
|
|
@@ -5,6 +5,7 @@ var useDropdown = require('../../hooks/useDropdown.cjs');
|
|
|
5
5
|
require('../../hooks/useFocusVisible.cjs');
|
|
6
6
|
var buildClassnames = require('../../utils/buildClassnames.cjs');
|
|
7
7
|
require('uid/secure');
|
|
8
|
+
require('lodash.throttle');
|
|
8
9
|
var colors = require('../../theme/modules/colors.cjs');
|
|
9
10
|
var styled = require('./styled.cjs');
|
|
10
11
|
var useHandleFocus = require('../Popover/hooks/useHandleFocus.cjs');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FilterTag.cjs","sources":["../../../src/components/FilterTag/FilterTag.tsx"],"sourcesContent":["import React, { MouseEventHandler, useCallback, useState } from 'react';\nimport { useDropdown } from '../../hooks';\n\nimport { colors } from '../../theme/modules/colors';\n\nimport { FilterTagProps } from './types';\n\nimport {\n Container,\n Text,\n Dropdown,\n GroupLabel,\n MainIcon,\n CrossIcon,\n Content,\n Header,\n} from './styled';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { useHandleFocus } from '../Popover/hooks/useHandleFocus';\n\nexport interface ClassNamesReturnPayload {\n filterTagDropdown?: string;\n container?: string;\n cross?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n filterTagDropdown: prefix ? `${prefix}-filter-tag-dropdown` : undefined,\n container: prefix ? `${prefix}-container` : undefined,\n cross: prefix ? `${prefix}-cross` : undefined,\n});\n\nexport const FilterTag = ({\n className,\n e2eClassName,\n label,\n text,\n iconSlot,\n fill = colors.secondary.blue.base,\n content,\n footer,\n header,\n onClickAway,\n onClick,\n shouldCloseOnClickAway = true,\n}: FilterTagProps) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n\n const [anchorElement, setAnchorElement] = useState<HTMLDivElement | null>(null);\n const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n\n const { shouldShowDropdown, toggleShouldShowDropdown, closeDropdown } = useDropdown({\n anchorElement,\n });\n\n const { handleKeyDown } = useHandleFocus({\n popperElement,\n anchorElement,\n onClose: closeDropdown,\n });\n\n const handleClick: MouseEventHandler<HTMLDivElement> = useCallback(\n (event) => {\n if (shouldShowDropdown) closeDropdown();\n else toggleShouldShowDropdown();\n\n if (onClickAway && shouldShowDropdown) onClickAway(event as any);\n },\n [shouldShowDropdown, closeDropdown, toggleShouldShowDropdown, onClickAway],\n );\n\n const handleClickAway = useCallback(\n (event: any) => {\n // Escape hatch to apply custom behavior when clicked away\n if (onClickAway) onClickAway(event, closeDropdown);\n\n // Default clickAway behavior (closes the dropdown)\n if (shouldCloseOnClickAway) closeDropdown();\n },\n [onClickAway, closeDropdown, shouldCloseOnClickAway],\n );\n\n const shouldShowSimple = !content;\n\n if (shouldShowSimple) {\n return (\n <Container\n className={buildClassnames([classNames?.container, e2eClassNames?.container])}\n onClick={onClick}\n >\n {label && <GroupLabel variant=\"subheadingSmallBold\">{`${label}:`}</GroupLabel>}\n <Text>{text}</Text>\n <CrossIcon\n className={buildClassnames([classNames?.cross, e2eClassNames?.cross])}\n name=\"cross\"\n size=\"base\"\n color={colors.neutral.ink.base}\n />\n </Container>\n );\n }\n\n return (\n <Dropdown\n className={classNames.filterTagDropdown}\n shouldShowDropdown={shouldShowDropdown}\n onClickAway={handleClickAway}\n cta={\n <Container className={classNames.container} onClick={handleClick} ref={setAnchorElement}>\n {label && <GroupLabel variant=\"subheadingSmallBold\">{`${label}:`}</GroupLabel>}\n <Text>{text}</Text>\n <MainIcon\n color={colors.neutral.ink.base}\n name=\"downArrow\"\n $shouldShow={shouldShowDropdown}\n />\n </Container>\n }\n >\n <Content ref={setPopperElement} onKeyDown={handleKeyDown}>\n <Header color={fill}>\n {header || (\n <>\n {iconSlot}\n <Text variant=\"bodyBold\">{label}</Text>\n </>\n )}\n </Header>\n {content}\n {footer}\n </Content>\n </Dropdown>\n );\n};\n"],"names":["colors","useState","useDropdown","useHandleFocus","useCallback","React","Container","buildClassnames","GroupLabel","Text","CrossIcon","Dropdown","MainIcon","Content","Header"],"mappings":"
|
|
1
|
+
{"version":3,"file":"FilterTag.cjs","sources":["../../../src/components/FilterTag/FilterTag.tsx"],"sourcesContent":["import React, { MouseEventHandler, useCallback, useState } from 'react';\nimport { useDropdown } from '../../hooks';\n\nimport { colors } from '../../theme/modules/colors';\n\nimport { FilterTagProps } from './types';\n\nimport {\n Container,\n Text,\n Dropdown,\n GroupLabel,\n MainIcon,\n CrossIcon,\n Content,\n Header,\n} from './styled';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { useHandleFocus } from '../Popover/hooks/useHandleFocus';\n\nexport interface ClassNamesReturnPayload {\n filterTagDropdown?: string;\n container?: string;\n cross?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n filterTagDropdown: prefix ? `${prefix}-filter-tag-dropdown` : undefined,\n container: prefix ? `${prefix}-container` : undefined,\n cross: prefix ? `${prefix}-cross` : undefined,\n});\n\nexport const FilterTag = ({\n className,\n e2eClassName,\n label,\n text,\n iconSlot,\n fill = colors.secondary.blue.base,\n content,\n footer,\n header,\n onClickAway,\n onClick,\n shouldCloseOnClickAway = true,\n}: FilterTagProps) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n\n const [anchorElement, setAnchorElement] = useState<HTMLDivElement | null>(null);\n const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n\n const { shouldShowDropdown, toggleShouldShowDropdown, closeDropdown } = useDropdown({\n anchorElement,\n });\n\n const { handleKeyDown } = useHandleFocus({\n popperElement,\n anchorElement,\n onClose: closeDropdown,\n });\n\n const handleClick: MouseEventHandler<HTMLDivElement> = useCallback(\n (event) => {\n if (shouldShowDropdown) closeDropdown();\n else toggleShouldShowDropdown();\n\n if (onClickAway && shouldShowDropdown) onClickAway(event as any);\n },\n [shouldShowDropdown, closeDropdown, toggleShouldShowDropdown, onClickAway],\n );\n\n const handleClickAway = useCallback(\n (event: any) => {\n // Escape hatch to apply custom behavior when clicked away\n if (onClickAway) onClickAway(event, closeDropdown);\n\n // Default clickAway behavior (closes the dropdown)\n if (shouldCloseOnClickAway) closeDropdown();\n },\n [onClickAway, closeDropdown, shouldCloseOnClickAway],\n );\n\n const shouldShowSimple = !content;\n\n if (shouldShowSimple) {\n return (\n <Container\n className={buildClassnames([classNames?.container, e2eClassNames?.container])}\n onClick={onClick}\n >\n {label && <GroupLabel variant=\"subheadingSmallBold\">{`${label}:`}</GroupLabel>}\n <Text>{text}</Text>\n <CrossIcon\n className={buildClassnames([classNames?.cross, e2eClassNames?.cross])}\n name=\"cross\"\n size=\"base\"\n color={colors.neutral.ink.base}\n />\n </Container>\n );\n }\n\n return (\n <Dropdown\n className={classNames.filterTagDropdown}\n shouldShowDropdown={shouldShowDropdown}\n onClickAway={handleClickAway}\n cta={\n <Container className={classNames.container} onClick={handleClick} ref={setAnchorElement}>\n {label && <GroupLabel variant=\"subheadingSmallBold\">{`${label}:`}</GroupLabel>}\n <Text>{text}</Text>\n <MainIcon\n color={colors.neutral.ink.base}\n name=\"downArrow\"\n $shouldShow={shouldShowDropdown}\n />\n </Container>\n }\n >\n <Content ref={setPopperElement} onKeyDown={handleKeyDown}>\n <Header color={fill}>\n {header || (\n <>\n {iconSlot}\n <Text variant=\"bodyBold\">{label}</Text>\n </>\n )}\n </Header>\n {content}\n {footer}\n </Content>\n </Dropdown>\n );\n};\n"],"names":["colors","useState","useDropdown","useHandleFocus","useCallback","React","Container","buildClassnames","GroupLabel","Text","CrossIcon","Dropdown","MainIcon","Content","Header"],"mappings":"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"}
|
|
@@ -3,6 +3,7 @@ import { useDropdown } from '../../hooks/useDropdown.js';
|
|
|
3
3
|
import '../../hooks/useFocusVisible.js';
|
|
4
4
|
import { buildClassnames } from '../../utils/buildClassnames.js';
|
|
5
5
|
import 'uid/secure';
|
|
6
|
+
import 'lodash.throttle';
|
|
6
7
|
import { colors } from '../../theme/modules/colors.js';
|
|
7
8
|
import { Container, GroupLabel, CrossIcon as StyledCrossIcon, MainIcon, Content, Header } from './styled.js';
|
|
8
9
|
import { useHandleFocus } from '../Popover/hooks/useHandleFocus.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FilterTag.js","sources":["../../../src/components/FilterTag/FilterTag.tsx"],"sourcesContent":["import React, { MouseEventHandler, useCallback, useState } from 'react';\nimport { useDropdown } from '../../hooks';\n\nimport { colors } from '../../theme/modules/colors';\n\nimport { FilterTagProps } from './types';\n\nimport {\n Container,\n Text,\n Dropdown,\n GroupLabel,\n MainIcon,\n CrossIcon,\n Content,\n Header,\n} from './styled';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { useHandleFocus } from '../Popover/hooks/useHandleFocus';\n\nexport interface ClassNamesReturnPayload {\n filterTagDropdown?: string;\n container?: string;\n cross?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n filterTagDropdown: prefix ? `${prefix}-filter-tag-dropdown` : undefined,\n container: prefix ? `${prefix}-container` : undefined,\n cross: prefix ? `${prefix}-cross` : undefined,\n});\n\nexport const FilterTag = ({\n className,\n e2eClassName,\n label,\n text,\n iconSlot,\n fill = colors.secondary.blue.base,\n content,\n footer,\n header,\n onClickAway,\n onClick,\n shouldCloseOnClickAway = true,\n}: FilterTagProps) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n\n const [anchorElement, setAnchorElement] = useState<HTMLDivElement | null>(null);\n const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n\n const { shouldShowDropdown, toggleShouldShowDropdown, closeDropdown } = useDropdown({\n anchorElement,\n });\n\n const { handleKeyDown } = useHandleFocus({\n popperElement,\n anchorElement,\n onClose: closeDropdown,\n });\n\n const handleClick: MouseEventHandler<HTMLDivElement> = useCallback(\n (event) => {\n if (shouldShowDropdown) closeDropdown();\n else toggleShouldShowDropdown();\n\n if (onClickAway && shouldShowDropdown) onClickAway(event as any);\n },\n [shouldShowDropdown, closeDropdown, toggleShouldShowDropdown, onClickAway],\n );\n\n const handleClickAway = useCallback(\n (event: any) => {\n // Escape hatch to apply custom behavior when clicked away\n if (onClickAway) onClickAway(event, closeDropdown);\n\n // Default clickAway behavior (closes the dropdown)\n if (shouldCloseOnClickAway) closeDropdown();\n },\n [onClickAway, closeDropdown, shouldCloseOnClickAway],\n );\n\n const shouldShowSimple = !content;\n\n if (shouldShowSimple) {\n return (\n <Container\n className={buildClassnames([classNames?.container, e2eClassNames?.container])}\n onClick={onClick}\n >\n {label && <GroupLabel variant=\"subheadingSmallBold\">{`${label}:`}</GroupLabel>}\n <Text>{text}</Text>\n <CrossIcon\n className={buildClassnames([classNames?.cross, e2eClassNames?.cross])}\n name=\"cross\"\n size=\"base\"\n color={colors.neutral.ink.base}\n />\n </Container>\n );\n }\n\n return (\n <Dropdown\n className={classNames.filterTagDropdown}\n shouldShowDropdown={shouldShowDropdown}\n onClickAway={handleClickAway}\n cta={\n <Container className={classNames.container} onClick={handleClick} ref={setAnchorElement}>\n {label && <GroupLabel variant=\"subheadingSmallBold\">{`${label}:`}</GroupLabel>}\n <Text>{text}</Text>\n <MainIcon\n color={colors.neutral.ink.base}\n name=\"downArrow\"\n $shouldShow={shouldShowDropdown}\n />\n </Container>\n }\n >\n <Content ref={setPopperElement} onKeyDown={handleKeyDown}>\n <Header color={fill}>\n {header || (\n <>\n {iconSlot}\n <Text variant=\"bodyBold\">{label}</Text>\n </>\n )}\n </Header>\n {content}\n {footer}\n </Content>\n </Dropdown>\n );\n};\n"],"names":["React","CrossIcon","Dropdown"],"mappings":"
|
|
1
|
+
{"version":3,"file":"FilterTag.js","sources":["../../../src/components/FilterTag/FilterTag.tsx"],"sourcesContent":["import React, { MouseEventHandler, useCallback, useState } from 'react';\nimport { useDropdown } from '../../hooks';\n\nimport { colors } from '../../theme/modules/colors';\n\nimport { FilterTagProps } from './types';\n\nimport {\n Container,\n Text,\n Dropdown,\n GroupLabel,\n MainIcon,\n CrossIcon,\n Content,\n Header,\n} from './styled';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { useHandleFocus } from '../Popover/hooks/useHandleFocus';\n\nexport interface ClassNamesReturnPayload {\n filterTagDropdown?: string;\n container?: string;\n cross?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n filterTagDropdown: prefix ? `${prefix}-filter-tag-dropdown` : undefined,\n container: prefix ? `${prefix}-container` : undefined,\n cross: prefix ? `${prefix}-cross` : undefined,\n});\n\nexport const FilterTag = ({\n className,\n e2eClassName,\n label,\n text,\n iconSlot,\n fill = colors.secondary.blue.base,\n content,\n footer,\n header,\n onClickAway,\n onClick,\n shouldCloseOnClickAway = true,\n}: FilterTagProps) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n\n const [anchorElement, setAnchorElement] = useState<HTMLDivElement | null>(null);\n const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n\n const { shouldShowDropdown, toggleShouldShowDropdown, closeDropdown } = useDropdown({\n anchorElement,\n });\n\n const { handleKeyDown } = useHandleFocus({\n popperElement,\n anchorElement,\n onClose: closeDropdown,\n });\n\n const handleClick: MouseEventHandler<HTMLDivElement> = useCallback(\n (event) => {\n if (shouldShowDropdown) closeDropdown();\n else toggleShouldShowDropdown();\n\n if (onClickAway && shouldShowDropdown) onClickAway(event as any);\n },\n [shouldShowDropdown, closeDropdown, toggleShouldShowDropdown, onClickAway],\n );\n\n const handleClickAway = useCallback(\n (event: any) => {\n // Escape hatch to apply custom behavior when clicked away\n if (onClickAway) onClickAway(event, closeDropdown);\n\n // Default clickAway behavior (closes the dropdown)\n if (shouldCloseOnClickAway) closeDropdown();\n },\n [onClickAway, closeDropdown, shouldCloseOnClickAway],\n );\n\n const shouldShowSimple = !content;\n\n if (shouldShowSimple) {\n return (\n <Container\n className={buildClassnames([classNames?.container, e2eClassNames?.container])}\n onClick={onClick}\n >\n {label && <GroupLabel variant=\"subheadingSmallBold\">{`${label}:`}</GroupLabel>}\n <Text>{text}</Text>\n <CrossIcon\n className={buildClassnames([classNames?.cross, e2eClassNames?.cross])}\n name=\"cross\"\n size=\"base\"\n color={colors.neutral.ink.base}\n />\n </Container>\n );\n }\n\n return (\n <Dropdown\n className={classNames.filterTagDropdown}\n shouldShowDropdown={shouldShowDropdown}\n onClickAway={handleClickAway}\n cta={\n <Container className={classNames.container} onClick={handleClick} ref={setAnchorElement}>\n {label && <GroupLabel variant=\"subheadingSmallBold\">{`${label}:`}</GroupLabel>}\n <Text>{text}</Text>\n <MainIcon\n color={colors.neutral.ink.base}\n name=\"downArrow\"\n $shouldShow={shouldShowDropdown}\n />\n </Container>\n }\n >\n <Content ref={setPopperElement} onKeyDown={handleKeyDown}>\n <Header color={fill}>\n {header || (\n <>\n {iconSlot}\n <Text variant=\"bodyBold\">{label}</Text>\n </>\n )}\n </Header>\n {content}\n {footer}\n </Content>\n </Dropdown>\n );\n};\n"],"names":["React","CrossIcon","Dropdown"],"mappings":"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"}
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
var React = require('react');
|
|
4
4
|
require('../../../hooks/useFocusVisible.cjs');
|
|
5
5
|
var useId = require('../../../hooks/useId.cjs');
|
|
6
|
+
require('lodash.throttle');
|
|
6
7
|
var styled = require('./styled.cjs');
|
|
7
8
|
var ListItemContent = require('./components/ListItemContent.cjs');
|
|
8
9
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItem.cjs","sources":["../../../../src/components/SelectDropdown/ListItem/ListItem.tsx"],"sourcesContent":["import React from 'react';\nimport { ListBoxItemRenderProps } from 'react-aria-components';\nimport { useId } from '../../../hooks';\nimport { StyledListItem } from './styled';\nimport { ListItemProps } from './types';\nimport { ListItemContent } from './components/ListItemContent';\n\nexport const ListItem = ({ id, label, href, ...props }: ListItemProps) => {\n const idComputed = useId({ id, prefix: 'list-item' });\n return (\n <StyledListItem id={idComputed} textValue={label} href={href} {...props}>\n {/* use react aria's render props to add more such as isHovered */}\n {({ selectionMode, allowsDragging, isSelected }: ListBoxItemRenderProps) => (\n <ListItemContent\n selectionMode={selectionMode}\n allowsDragging={allowsDragging}\n isSelected={isSelected}\n label={label}\n isLink={Boolean(href)}\n {...props}\n />\n )}\n </StyledListItem>\n );\n};\n"],"names":["useId","React","StyledListItem","ListItemContent"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ListItem.cjs","sources":["../../../../src/components/SelectDropdown/ListItem/ListItem.tsx"],"sourcesContent":["import React from 'react';\nimport { ListBoxItemRenderProps } from 'react-aria-components';\nimport { useId } from '../../../hooks';\nimport { StyledListItem } from './styled';\nimport { ListItemProps } from './types';\nimport { ListItemContent } from './components/ListItemContent';\n\nexport const ListItem = ({ id, label, href, ...props }: ListItemProps) => {\n const idComputed = useId({ id, prefix: 'list-item' });\n return (\n <StyledListItem id={idComputed} textValue={label} href={href} {...props}>\n {/* use react aria's render props to add more such as isHovered */}\n {({ selectionMode, allowsDragging, isSelected }: ListBoxItemRenderProps) => (\n <ListItemContent\n selectionMode={selectionMode}\n allowsDragging={allowsDragging}\n isSelected={isSelected}\n label={label}\n isLink={Boolean(href)}\n {...props}\n />\n )}\n </StyledListItem>\n );\n};\n"],"names":["useId","React","StyledListItem","ListItemContent"],"mappings":";;;;;;;;;;;;;AAOa,MAAA,QAAQ,GAAG,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,KAAK,EAAiB,KAAI;AACvE,IAAA,MAAM,UAAU,GAAGA,WAAK,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,CAAC;AACrD,IAAA,QACEC,sBAAA,CAAA,aAAA,CAACC,qBAAc,EAAA,EAAC,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAA,GAAM,KAAK,EAAA,EAEpE,CAAC,EAAE,aAAa,EAAE,cAAc,EAAE,UAAU,EAA0B,MACrED,sBAAC,CAAA,aAAA,CAAAE,+BAAe,EACd,EAAA,aAAa,EAAE,aAAa,EAC5B,cAAc,EAAE,cAAc,EAC9B,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,OAAO,CAAC,IAAI,CAAC,EAAA,GACjB,KAAK,EAAA,CACT,CACH,CACc;AAErB;;;;"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React__default from 'react';
|
|
2
2
|
import '../../../hooks/useFocusVisible.js';
|
|
3
3
|
import { useId } from '../../../hooks/useId.js';
|
|
4
|
+
import 'lodash.throttle';
|
|
4
5
|
import { StyledListItem } from './styled.js';
|
|
5
6
|
import { ListItemContent } from './components/ListItemContent.js';
|
|
6
7
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItem.js","sources":["../../../../src/components/SelectDropdown/ListItem/ListItem.tsx"],"sourcesContent":["import React from 'react';\nimport { ListBoxItemRenderProps } from 'react-aria-components';\nimport { useId } from '../../../hooks';\nimport { StyledListItem } from './styled';\nimport { ListItemProps } from './types';\nimport { ListItemContent } from './components/ListItemContent';\n\nexport const ListItem = ({ id, label, href, ...props }: ListItemProps) => {\n const idComputed = useId({ id, prefix: 'list-item' });\n return (\n <StyledListItem id={idComputed} textValue={label} href={href} {...props}>\n {/* use react aria's render props to add more such as isHovered */}\n {({ selectionMode, allowsDragging, isSelected }: ListBoxItemRenderProps) => (\n <ListItemContent\n selectionMode={selectionMode}\n allowsDragging={allowsDragging}\n isSelected={isSelected}\n label={label}\n isLink={Boolean(href)}\n {...props}\n />\n )}\n </StyledListItem>\n );\n};\n"],"names":["React"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ListItem.js","sources":["../../../../src/components/SelectDropdown/ListItem/ListItem.tsx"],"sourcesContent":["import React from 'react';\nimport { ListBoxItemRenderProps } from 'react-aria-components';\nimport { useId } from '../../../hooks';\nimport { StyledListItem } from './styled';\nimport { ListItemProps } from './types';\nimport { ListItemContent } from './components/ListItemContent';\n\nexport const ListItem = ({ id, label, href, ...props }: ListItemProps) => {\n const idComputed = useId({ id, prefix: 'list-item' });\n return (\n <StyledListItem id={idComputed} textValue={label} href={href} {...props}>\n {/* use react aria's render props to add more such as isHovered */}\n {({ selectionMode, allowsDragging, isSelected }: ListBoxItemRenderProps) => (\n <ListItemContent\n selectionMode={selectionMode}\n allowsDragging={allowsDragging}\n isSelected={isSelected}\n label={label}\n isLink={Boolean(href)}\n {...props}\n />\n )}\n </StyledListItem>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;AAOa,MAAA,QAAQ,GAAG,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,KAAK,EAAiB,KAAI;AACvE,IAAA,MAAM,UAAU,GAAG,KAAK,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,CAAC;AACrD,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,cAAc,EAAA,EAAC,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAA,GAAM,KAAK,EAAA,EAEpE,CAAC,EAAE,aAAa,EAAE,cAAc,EAAE,UAAU,EAA0B,MACrEA,cAAC,CAAA,aAAA,CAAA,eAAe,EACd,EAAA,aAAa,EAAE,aAAa,EAC5B,cAAc,EAAE,cAAc,EAC9B,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,OAAO,CAAC,IAAI,CAAC,EAAA,GACjB,KAAK,EAAA,CACT,CACH,CACc;AAErB;;;;"}
|
|
@@ -6,6 +6,7 @@ var styled = require('./styled.cjs');
|
|
|
6
6
|
var useClickOutside = require('../../hooks/useClickOutside.cjs');
|
|
7
7
|
require('../../hooks/useFocusVisible.cjs');
|
|
8
8
|
require('uid/secure');
|
|
9
|
+
require('lodash.throttle');
|
|
9
10
|
var CrossIcon = require('../../tempIcons/CrossIcon.cjs');
|
|
10
11
|
|
|
11
12
|
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VideoModal.cjs","sources":["../../../src/components/VideoModal/VideoModal.tsx"],"sourcesContent":["import React from 'react';\nimport { Popup } from './components/Popup';\nimport { VideoModalProps } from './types';\nimport { PopupContent, VideoWrapper, ButtonSC } from './styled';\nimport { useClickOutside } from '../../hooks';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\n\nexport const VideoModal = ({\n id,\n youtubeVideoId,\n showVideoModal,\n handleCloseClick,\n}: VideoModalProps) => {\n const ref = useClickOutside(showVideoModal, handleCloseClick);\n\n return (\n <Popup shouldShow={showVideoModal} className={`${id}-video`}>\n <PopupContent\n data-testid=\"video-modal_popup-content\"\n className={`video-modal--${showVideoModal ? 'visible' : 'hidden'}`}\n >\n <VideoWrapper ref={ref}>\n <iframe\n title={`${id}-video`}\n src={`https://www.youtube.com/embed/${youtubeVideoId}`}\n frameBorder=\"0\"\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n allowFullScreen\n />\n <ButtonSC\n variant=\"flat\"\n onClick={handleCloseClick}\n data-testid=\"video-modal--close\"\n iconSlot={<CrossIcon color=\"white\" />}\n />\n </VideoWrapper>\n </PopupContent>\n </Popup>\n );\n};\n"],"names":["useClickOutside","React","Popup","PopupContent","VideoWrapper","ButtonSC","CrossIcon"],"mappings":"
|
|
1
|
+
{"version":3,"file":"VideoModal.cjs","sources":["../../../src/components/VideoModal/VideoModal.tsx"],"sourcesContent":["import React from 'react';\nimport { Popup } from './components/Popup';\nimport { VideoModalProps } from './types';\nimport { PopupContent, VideoWrapper, ButtonSC } from './styled';\nimport { useClickOutside } from '../../hooks';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\n\nexport const VideoModal = ({\n id,\n youtubeVideoId,\n showVideoModal,\n handleCloseClick,\n}: VideoModalProps) => {\n const ref = useClickOutside(showVideoModal, handleCloseClick);\n\n return (\n <Popup shouldShow={showVideoModal} className={`${id}-video`}>\n <PopupContent\n data-testid=\"video-modal_popup-content\"\n className={`video-modal--${showVideoModal ? 'visible' : 'hidden'}`}\n >\n <VideoWrapper ref={ref}>\n <iframe\n title={`${id}-video`}\n src={`https://www.youtube.com/embed/${youtubeVideoId}`}\n frameBorder=\"0\"\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n allowFullScreen\n />\n <ButtonSC\n variant=\"flat\"\n onClick={handleCloseClick}\n data-testid=\"video-modal--close\"\n iconSlot={<CrossIcon color=\"white\" />}\n />\n </VideoWrapper>\n </PopupContent>\n </Popup>\n );\n};\n"],"names":["useClickOutside","React","Popup","PopupContent","VideoWrapper","ButtonSC","CrossIcon"],"mappings":";;;;;;;;;;;;;;;AAOO,MAAM,UAAU,GAAG,CAAC,EACzB,EAAE,EACF,cAAc,EACd,cAAc,EACd,gBAAgB,GACA,KAAI;IACpB,MAAM,GAAG,GAAGA,+BAAe,CAAC,cAAc,EAAE,gBAAgB,CAAC;AAE7D,IAAA,QACEC,sBAAA,CAAA,aAAA,CAACC,WAAK,EAAA,EAAC,UAAU,EAAE,cAAc,EAAE,SAAS,EAAE,CAAG,EAAA,EAAE,CAAQ,MAAA,CAAA,EAAA;AACzD,QAAAD,sBAAA,CAAA,aAAA,CAACE,mBAAY,EACC,EAAA,aAAA,EAAA,2BAA2B,EACvC,SAAS,EAAE,CAAgB,aAAA,EAAA,cAAc,GAAG,SAAS,GAAG,QAAQ,CAAE,CAAA,EAAA;AAElE,YAAAF,sBAAA,CAAA,aAAA,CAACG,mBAAY,EAAA,EAAC,GAAG,EAAE,GAAG,EAAA;gBACpBH,sBACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,KAAK,EAAE,CAAG,EAAA,EAAE,QAAQ,EACpB,GAAG,EAAE,CAAiC,8BAAA,EAAA,cAAc,EAAE,EACtD,WAAW,EAAC,GAAG,EACf,KAAK,EAAC,0FAA0F,EAChG,eAAe,EACf,IAAA,EAAA,CAAA;gBACFA,sBAAC,CAAA,aAAA,CAAAI,eAAQ,EACP,EAAA,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,gBAAgB,EACb,aAAA,EAAA,oBAAoB,EAChC,QAAQ,EAAEJ,sBAAC,CAAA,aAAA,CAAAK,mBAAS,EAAC,EAAA,KAAK,EAAC,OAAO,EAAG,CAAA,EAAA,CACrC,CACW,CACF,CACT;AAEZ;;;;"}
|
|
@@ -4,6 +4,7 @@ import { PopupContent, VideoWrapper, ButtonSC } from './styled.js';
|
|
|
4
4
|
import { useClickOutside } from '../../hooks/useClickOutside.js';
|
|
5
5
|
import '../../hooks/useFocusVisible.js';
|
|
6
6
|
import 'uid/secure';
|
|
7
|
+
import 'lodash.throttle';
|
|
7
8
|
import { CrossIcon } from '../../tempIcons/CrossIcon.js';
|
|
8
9
|
|
|
9
10
|
const VideoModal = ({ id, youtubeVideoId, showVideoModal, handleCloseClick, }) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VideoModal.js","sources":["../../../src/components/VideoModal/VideoModal.tsx"],"sourcesContent":["import React from 'react';\nimport { Popup } from './components/Popup';\nimport { VideoModalProps } from './types';\nimport { PopupContent, VideoWrapper, ButtonSC } from './styled';\nimport { useClickOutside } from '../../hooks';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\n\nexport const VideoModal = ({\n id,\n youtubeVideoId,\n showVideoModal,\n handleCloseClick,\n}: VideoModalProps) => {\n const ref = useClickOutside(showVideoModal, handleCloseClick);\n\n return (\n <Popup shouldShow={showVideoModal} className={`${id}-video`}>\n <PopupContent\n data-testid=\"video-modal_popup-content\"\n className={`video-modal--${showVideoModal ? 'visible' : 'hidden'}`}\n >\n <VideoWrapper ref={ref}>\n <iframe\n title={`${id}-video`}\n src={`https://www.youtube.com/embed/${youtubeVideoId}`}\n frameBorder=\"0\"\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n allowFullScreen\n />\n <ButtonSC\n variant=\"flat\"\n onClick={handleCloseClick}\n data-testid=\"video-modal--close\"\n iconSlot={<CrossIcon color=\"white\" />}\n />\n </VideoWrapper>\n </PopupContent>\n </Popup>\n );\n};\n"],"names":["React"],"mappings":"
|
|
1
|
+
{"version":3,"file":"VideoModal.js","sources":["../../../src/components/VideoModal/VideoModal.tsx"],"sourcesContent":["import React from 'react';\nimport { Popup } from './components/Popup';\nimport { VideoModalProps } from './types';\nimport { PopupContent, VideoWrapper, ButtonSC } from './styled';\nimport { useClickOutside } from '../../hooks';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\n\nexport const VideoModal = ({\n id,\n youtubeVideoId,\n showVideoModal,\n handleCloseClick,\n}: VideoModalProps) => {\n const ref = useClickOutside(showVideoModal, handleCloseClick);\n\n return (\n <Popup shouldShow={showVideoModal} className={`${id}-video`}>\n <PopupContent\n data-testid=\"video-modal_popup-content\"\n className={`video-modal--${showVideoModal ? 'visible' : 'hidden'}`}\n >\n <VideoWrapper ref={ref}>\n <iframe\n title={`${id}-video`}\n src={`https://www.youtube.com/embed/${youtubeVideoId}`}\n frameBorder=\"0\"\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n allowFullScreen\n />\n <ButtonSC\n variant=\"flat\"\n onClick={handleCloseClick}\n data-testid=\"video-modal--close\"\n iconSlot={<CrossIcon color=\"white\" />}\n />\n </VideoWrapper>\n </PopupContent>\n </Popup>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;;;AAOO,MAAM,UAAU,GAAG,CAAC,EACzB,EAAE,EACF,cAAc,EACd,cAAc,EACd,gBAAgB,GACA,KAAI;IACpB,MAAM,GAAG,GAAG,eAAe,CAAC,cAAc,EAAE,gBAAgB,CAAC;AAE7D,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,KAAK,EAAA,EAAC,UAAU,EAAE,cAAc,EAAE,SAAS,EAAE,CAAG,EAAA,EAAE,CAAQ,MAAA,CAAA,EAAA;AACzD,QAAAA,cAAA,CAAA,aAAA,CAAC,YAAY,EACC,EAAA,aAAA,EAAA,2BAA2B,EACvC,SAAS,EAAE,CAAgB,aAAA,EAAA,cAAc,GAAG,SAAS,GAAG,QAAQ,CAAE,CAAA,EAAA;AAElE,YAAAA,cAAA,CAAA,aAAA,CAAC,YAAY,EAAA,EAAC,GAAG,EAAE,GAAG,EAAA;gBACpBA,cACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,KAAK,EAAE,CAAG,EAAA,EAAE,QAAQ,EACpB,GAAG,EAAE,CAAiC,8BAAA,EAAA,cAAc,EAAE,EACtD,WAAW,EAAC,GAAG,EACf,KAAK,EAAC,0FAA0F,EAChG,eAAe,EACf,IAAA,EAAA,CAAA;gBACFA,cAAC,CAAA,aAAA,CAAA,QAAQ,EACP,EAAA,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,gBAAgB,EACb,aAAA,EAAA,oBAAoB,EAChC,QAAQ,EAAEA,cAAC,CAAA,aAAA,CAAA,SAAS,EAAC,EAAA,KAAK,EAAC,OAAO,EAAG,CAAA,EAAA,CACrC,CACW,CACF,CACT;AAEZ;;;;"}
|
|
@@ -5,6 +5,7 @@ require('../../hooks/useFocusVisible.cjs');
|
|
|
5
5
|
var useHover = require('../../hooks/useHover.cjs');
|
|
6
6
|
var buildClassnames = require('../../utils/buildClassnames.cjs');
|
|
7
7
|
require('uid/secure');
|
|
8
|
+
require('lodash.throttle');
|
|
8
9
|
var colors = require('../../theme/modules/colors.cjs');
|
|
9
10
|
var types = require('./types.cjs');
|
|
10
11
|
var styled = require('./styled.cjs');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"View.cjs","sources":["../../../src/components/View/View.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\n\nimport { useHover } from '../../hooks';\nimport { colors } from '../../theme/modules/colors';\n\nimport { ViewProps, ViewTypes } from './types';\n\nimport {\n Container,\n Contour,\n CounterContainer,\n CounterText,\n CustomIconWrapper,\n IconStyling,\n Text,\n} from './styled';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\nimport { EditIcon } from '../../tempIcons/EditIcon';\n\nexport interface ClassNamesReturnPayload {\n delete?: string;\n options?: string;\n edit?: string;\n container?: string;\n active?: string;\n counter?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n delete: prefix ? `${prefix}-delete` : undefined,\n options: prefix ? `${prefix}-options` : undefined,\n edit: prefix ? `${prefix}-edit` : undefined,\n container: prefix ? `${prefix}-container` : undefined,\n active: prefix ? `${prefix}-active` : undefined,\n counter: prefix ? `${prefix}-counter` : undefined,\n});\n\n/**\n *\n * @deprecated\n *\n * use ViewTab component instead\n *\n */\nexport const View = ({\n id,\n iconSlot,\n name,\n type,\n className,\n colourPalette = colors.secondary.blue,\n customTextColour,\n count,\n active = false,\n onClick,\n onDelete,\n onEdit,\n e2eClassName,\n}: ViewProps) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n const [isHovered, handleEnter, handleLeave] = useHover();\n\n const handleClick = useCallback(() => onClick(id), [id, onClick]);\n const handleDelete = useCallback(\n (event) => {\n event.stopPropagation();\n if (onDelete) onDelete(id);\n },\n [onDelete, id],\n );\n const handleEdit = useCallback(\n (event) => {\n event.stopPropagation();\n if (onEdit) onEdit(id);\n },\n [onEdit, id],\n );\n\n const isDraft = type === ViewTypes.draft;\n const isSaved = type === ViewTypes.saved;\n const fill = active ? colors.neutral.ink.dark : colors.neutral.ink.base;\n\n return (\n <Container\n className={`${buildClassnames([classNames?.container, e2eClassNames?.container])} ${\n (active && e2eClassNames?.active) || ''\n }`}\n onClick={handleClick}\n >\n <Contour\n active={active}\n onMouseEnter={handleEnter}\n onMouseLeave={handleLeave}\n colourPalette={colourPalette}\n customTextColour={customTextColour}\n >\n {iconSlot && <CustomIconWrapper>{iconSlot}</CustomIconWrapper>}\n <Text variant=\"bodyBold\">{name}</Text>\n {count && (\n <CounterContainer\n active={active || isHovered}\n colourPalette={colourPalette}\n customTextColour={customTextColour}\n >\n <CounterText className={e2eClassNames?.counter} variant=\"subheadingSmall\">\n {count}\n </CounterText>\n </CounterContainer>\n )}\n {isDraft && (\n <CrossIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.delete}\n onClick={handleDelete}\n />\n )}\n {isSaved && active && (\n <EditIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.edit}\n onClick={handleEdit}\n />\n )}\n </Contour>\n </Container>\n );\n};\n"],"names":["colors","useHover","useCallback","ViewTypes","React","Container","buildClassnames","Contour","CustomIconWrapper","Text","CounterContainer","CounterText","CrossIcon","IconStyling","EditIcon"],"mappings":"
|
|
1
|
+
{"version":3,"file":"View.cjs","sources":["../../../src/components/View/View.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\n\nimport { useHover } from '../../hooks';\nimport { colors } from '../../theme/modules/colors';\n\nimport { ViewProps, ViewTypes } from './types';\n\nimport {\n Container,\n Contour,\n CounterContainer,\n CounterText,\n CustomIconWrapper,\n IconStyling,\n Text,\n} from './styled';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\nimport { EditIcon } from '../../tempIcons/EditIcon';\n\nexport interface ClassNamesReturnPayload {\n delete?: string;\n options?: string;\n edit?: string;\n container?: string;\n active?: string;\n counter?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n delete: prefix ? `${prefix}-delete` : undefined,\n options: prefix ? `${prefix}-options` : undefined,\n edit: prefix ? `${prefix}-edit` : undefined,\n container: prefix ? `${prefix}-container` : undefined,\n active: prefix ? `${prefix}-active` : undefined,\n counter: prefix ? `${prefix}-counter` : undefined,\n});\n\n/**\n *\n * @deprecated\n *\n * use ViewTab component instead\n *\n */\nexport const View = ({\n id,\n iconSlot,\n name,\n type,\n className,\n colourPalette = colors.secondary.blue,\n customTextColour,\n count,\n active = false,\n onClick,\n onDelete,\n onEdit,\n e2eClassName,\n}: ViewProps) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n const [isHovered, handleEnter, handleLeave] = useHover();\n\n const handleClick = useCallback(() => onClick(id), [id, onClick]);\n const handleDelete = useCallback(\n (event) => {\n event.stopPropagation();\n if (onDelete) onDelete(id);\n },\n [onDelete, id],\n );\n const handleEdit = useCallback(\n (event) => {\n event.stopPropagation();\n if (onEdit) onEdit(id);\n },\n [onEdit, id],\n );\n\n const isDraft = type === ViewTypes.draft;\n const isSaved = type === ViewTypes.saved;\n const fill = active ? colors.neutral.ink.dark : colors.neutral.ink.base;\n\n return (\n <Container\n className={`${buildClassnames([classNames?.container, e2eClassNames?.container])} ${\n (active && e2eClassNames?.active) || ''\n }`}\n onClick={handleClick}\n >\n <Contour\n active={active}\n onMouseEnter={handleEnter}\n onMouseLeave={handleLeave}\n colourPalette={colourPalette}\n customTextColour={customTextColour}\n >\n {iconSlot && <CustomIconWrapper>{iconSlot}</CustomIconWrapper>}\n <Text variant=\"bodyBold\">{name}</Text>\n {count && (\n <CounterContainer\n active={active || isHovered}\n colourPalette={colourPalette}\n customTextColour={customTextColour}\n >\n <CounterText className={e2eClassNames?.counter} variant=\"subheadingSmall\">\n {count}\n </CounterText>\n </CounterContainer>\n )}\n {isDraft && (\n <CrossIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.delete}\n onClick={handleDelete}\n />\n )}\n {isSaved && active && (\n <EditIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.edit}\n onClick={handleEdit}\n />\n )}\n </Contour>\n </Container>\n );\n};\n"],"names":["colors","useHover","useCallback","ViewTypes","React","Container","buildClassnames","Contour","CustomIconWrapper","Text","CounterContainer","CounterText","CrossIcon","IconStyling","EditIcon"],"mappings":"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"}
|
|
@@ -3,6 +3,7 @@ import '../../hooks/useFocusVisible.js';
|
|
|
3
3
|
import { useHover } from '../../hooks/useHover.js';
|
|
4
4
|
import { buildClassnames } from '../../utils/buildClassnames.js';
|
|
5
5
|
import 'uid/secure';
|
|
6
|
+
import 'lodash.throttle';
|
|
6
7
|
import { colors } from '../../theme/modules/colors.js';
|
|
7
8
|
import { ViewTypes } from './types.js';
|
|
8
9
|
import { Container, Contour, CustomIconWrapper, CounterContainer, CounterText, IconStyling } from './styled.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"View.js","sources":["../../../src/components/View/View.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\n\nimport { useHover } from '../../hooks';\nimport { colors } from '../../theme/modules/colors';\n\nimport { ViewProps, ViewTypes } from './types';\n\nimport {\n Container,\n Contour,\n CounterContainer,\n CounterText,\n CustomIconWrapper,\n IconStyling,\n Text,\n} from './styled';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\nimport { EditIcon } from '../../tempIcons/EditIcon';\n\nexport interface ClassNamesReturnPayload {\n delete?: string;\n options?: string;\n edit?: string;\n container?: string;\n active?: string;\n counter?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n delete: prefix ? `${prefix}-delete` : undefined,\n options: prefix ? `${prefix}-options` : undefined,\n edit: prefix ? `${prefix}-edit` : undefined,\n container: prefix ? `${prefix}-container` : undefined,\n active: prefix ? `${prefix}-active` : undefined,\n counter: prefix ? `${prefix}-counter` : undefined,\n});\n\n/**\n *\n * @deprecated\n *\n * use ViewTab component instead\n *\n */\nexport const View = ({\n id,\n iconSlot,\n name,\n type,\n className,\n colourPalette = colors.secondary.blue,\n customTextColour,\n count,\n active = false,\n onClick,\n onDelete,\n onEdit,\n e2eClassName,\n}: ViewProps) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n const [isHovered, handleEnter, handleLeave] = useHover();\n\n const handleClick = useCallback(() => onClick(id), [id, onClick]);\n const handleDelete = useCallback(\n (event) => {\n event.stopPropagation();\n if (onDelete) onDelete(id);\n },\n [onDelete, id],\n );\n const handleEdit = useCallback(\n (event) => {\n event.stopPropagation();\n if (onEdit) onEdit(id);\n },\n [onEdit, id],\n );\n\n const isDraft = type === ViewTypes.draft;\n const isSaved = type === ViewTypes.saved;\n const fill = active ? colors.neutral.ink.dark : colors.neutral.ink.base;\n\n return (\n <Container\n className={`${buildClassnames([classNames?.container, e2eClassNames?.container])} ${\n (active && e2eClassNames?.active) || ''\n }`}\n onClick={handleClick}\n >\n <Contour\n active={active}\n onMouseEnter={handleEnter}\n onMouseLeave={handleLeave}\n colourPalette={colourPalette}\n customTextColour={customTextColour}\n >\n {iconSlot && <CustomIconWrapper>{iconSlot}</CustomIconWrapper>}\n <Text variant=\"bodyBold\">{name}</Text>\n {count && (\n <CounterContainer\n active={active || isHovered}\n colourPalette={colourPalette}\n customTextColour={customTextColour}\n >\n <CounterText className={e2eClassNames?.counter} variant=\"subheadingSmall\">\n {count}\n </CounterText>\n </CounterContainer>\n )}\n {isDraft && (\n <CrossIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.delete}\n onClick={handleDelete}\n />\n )}\n {isSaved && active && (\n <EditIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.edit}\n onClick={handleEdit}\n />\n )}\n </Contour>\n </Container>\n );\n};\n"],"names":["React"],"mappings":"
|
|
1
|
+
{"version":3,"file":"View.js","sources":["../../../src/components/View/View.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\n\nimport { useHover } from '../../hooks';\nimport { colors } from '../../theme/modules/colors';\n\nimport { ViewProps, ViewTypes } from './types';\n\nimport {\n Container,\n Contour,\n CounterContainer,\n CounterText,\n CustomIconWrapper,\n IconStyling,\n Text,\n} from './styled';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\nimport { EditIcon } from '../../tempIcons/EditIcon';\n\nexport interface ClassNamesReturnPayload {\n delete?: string;\n options?: string;\n edit?: string;\n container?: string;\n active?: string;\n counter?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n delete: prefix ? `${prefix}-delete` : undefined,\n options: prefix ? `${prefix}-options` : undefined,\n edit: prefix ? `${prefix}-edit` : undefined,\n container: prefix ? `${prefix}-container` : undefined,\n active: prefix ? `${prefix}-active` : undefined,\n counter: prefix ? `${prefix}-counter` : undefined,\n});\n\n/**\n *\n * @deprecated\n *\n * use ViewTab component instead\n *\n */\nexport const View = ({\n id,\n iconSlot,\n name,\n type,\n className,\n colourPalette = colors.secondary.blue,\n customTextColour,\n count,\n active = false,\n onClick,\n onDelete,\n onEdit,\n e2eClassName,\n}: ViewProps) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n const [isHovered, handleEnter, handleLeave] = useHover();\n\n const handleClick = useCallback(() => onClick(id), [id, onClick]);\n const handleDelete = useCallback(\n (event) => {\n event.stopPropagation();\n if (onDelete) onDelete(id);\n },\n [onDelete, id],\n );\n const handleEdit = useCallback(\n (event) => {\n event.stopPropagation();\n if (onEdit) onEdit(id);\n },\n [onEdit, id],\n );\n\n const isDraft = type === ViewTypes.draft;\n const isSaved = type === ViewTypes.saved;\n const fill = active ? colors.neutral.ink.dark : colors.neutral.ink.base;\n\n return (\n <Container\n className={`${buildClassnames([classNames?.container, e2eClassNames?.container])} ${\n (active && e2eClassNames?.active) || ''\n }`}\n onClick={handleClick}\n >\n <Contour\n active={active}\n onMouseEnter={handleEnter}\n onMouseLeave={handleLeave}\n colourPalette={colourPalette}\n customTextColour={customTextColour}\n >\n {iconSlot && <CustomIconWrapper>{iconSlot}</CustomIconWrapper>}\n <Text variant=\"bodyBold\">{name}</Text>\n {count && (\n <CounterContainer\n active={active || isHovered}\n colourPalette={colourPalette}\n customTextColour={customTextColour}\n >\n <CounterText className={e2eClassNames?.counter} variant=\"subheadingSmall\">\n {count}\n </CounterText>\n </CounterContainer>\n )}\n {isDraft && (\n <CrossIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.delete}\n onClick={handleDelete}\n />\n )}\n {isSaved && active && (\n <EditIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.edit}\n onClick={handleEdit}\n />\n )}\n </Contour>\n </Container>\n );\n};\n"],"names":["React"],"mappings":"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"}
|
|
@@ -5,6 +5,7 @@ require('../../hooks/useFocusVisible.cjs');
|
|
|
5
5
|
var useHover = require('../../hooks/useHover.cjs');
|
|
6
6
|
var buildClassnames = require('../../utils/buildClassnames.cjs');
|
|
7
7
|
require('uid/secure');
|
|
8
|
+
require('lodash.throttle');
|
|
8
9
|
var colors = require('../../theme/modules/colors.cjs');
|
|
9
10
|
var types = require('./types.cjs');
|
|
10
11
|
var styled = require('./styled.cjs');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ViewTab.cjs","sources":["../../../src/components/ViewTab/ViewTab.tsx"],"sourcesContent":["import React, { Ref } from 'react';\n\nimport { useHover } from '../../hooks';\nimport { colors } from '../../theme/modules/colors';\n\nimport { ViewTabProps, ViewTabTypes } from './types';\n\nimport {\n Contour,\n CounterContainer,\n CounterText,\n CrossIconStyling,\n CustomIconWrapper,\n IconStyling,\n Text,\n ThreeDotsIconStyling,\n ViewButton,\n} from './styled';\nimport { buildClassnames } from '../../utils/buildClassnames';\n\nexport interface ClassNamesReturnPayload {\n delete?: string;\n edit?: string;\n container?: string;\n active?: string;\n counter?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n delete: prefix ? `${prefix}-delete` : undefined,\n edit: prefix ? `${prefix}-edit` : undefined,\n container: prefix ? `${prefix}-view` : undefined,\n active: prefix ? `${prefix}-active` : undefined,\n counter: prefix ? `${prefix}-counter` : undefined,\n});\n\nexport const ViewTab = React.forwardRef<HTMLButtonElement, ViewTabProps>(\n (\n {\n id,\n iconSlot,\n name,\n type,\n className,\n colourPalette = colors.secondary.blue,\n customTextColour,\n count,\n active = false,\n onClick,\n subAction,\n ariaContext,\n ...props\n }: ViewTabProps,\n ref: Ref<HTMLButtonElement>,\n ) => {\n const classNames = generateClassNames(className);\n const [isHovered, handleEnter, handleLeave] = useHover();\n\n const action = active && subAction ? subAction : onClick;\n const handleAction = () => action(id);\n\n const isDraft = type === ViewTabTypes.draft;\n const isSaved = type === ViewTabTypes.saved;\n\n const getLabelAction = () => {\n if (active && isDraft) return 'Delete';\n if (active && isSaved) return 'Edit';\n return '';\n };\n\n return (\n <ViewButton\n className={buildClassnames([classNames?.container])}\n onClick={handleAction}\n role=\"tab\"\n aria-selected={active}\n aria-label={`${getLabelAction()} ${name} view ${\n count ? `with ${count} ${ariaContext}` : ''\n }`}\n customTextColour={customTextColour}\n ref={ref}\n {...props}\n >\n <Contour\n active={active}\n onMouseEnter={handleEnter}\n onMouseLeave={handleLeave}\n colourPalette={colourPalette}\n customTextColour={customTextColour}\n >\n {iconSlot && <CustomIconWrapper>{iconSlot}</CustomIconWrapper>}\n <Text variant=\"bodyBold\">{name}</Text>\n {count !== undefined && count !== null && (\n <CounterContainer\n data-testid=\"countContainer\"\n active={active || isHovered}\n colourPalette={colourPalette}\n customTextColour={customTextColour}\n >\n <CounterText variant=\"subheadingSmall\">{count}</CounterText>\n </CounterContainer>\n )}\n {isDraft && <CrossIconStyling {...IconStyling} aria-label=\"delete icon\" />}\n {isSaved && active && <ThreeDotsIconStyling {...IconStyling} aria-label=\"edit icon\" />}\n </Contour>\n </ViewButton>\n );\n },\n);\n"],"names":["React","colors","useHover","ViewTabTypes","ViewButton","buildClassnames","Contour","CustomIconWrapper","Text","CounterContainer","CounterText","CrossIconStyling","IconStyling","ThreeDotsIconStyling"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ViewTab.cjs","sources":["../../../src/components/ViewTab/ViewTab.tsx"],"sourcesContent":["import React, { Ref } from 'react';\n\nimport { useHover } from '../../hooks';\nimport { colors } from '../../theme/modules/colors';\n\nimport { ViewTabProps, ViewTabTypes } from './types';\n\nimport {\n Contour,\n CounterContainer,\n CounterText,\n CrossIconStyling,\n CustomIconWrapper,\n IconStyling,\n Text,\n ThreeDotsIconStyling,\n ViewButton,\n} from './styled';\nimport { buildClassnames } from '../../utils/buildClassnames';\n\nexport interface ClassNamesReturnPayload {\n delete?: string;\n edit?: string;\n container?: string;\n active?: string;\n counter?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n delete: prefix ? `${prefix}-delete` : undefined,\n edit: prefix ? `${prefix}-edit` : undefined,\n container: prefix ? `${prefix}-view` : undefined,\n active: prefix ? `${prefix}-active` : undefined,\n counter: prefix ? `${prefix}-counter` : undefined,\n});\n\nexport const ViewTab = React.forwardRef<HTMLButtonElement, ViewTabProps>(\n (\n {\n id,\n iconSlot,\n name,\n type,\n className,\n colourPalette = colors.secondary.blue,\n customTextColour,\n count,\n active = false,\n onClick,\n subAction,\n ariaContext,\n ...props\n }: ViewTabProps,\n ref: Ref<HTMLButtonElement>,\n ) => {\n const classNames = generateClassNames(className);\n const [isHovered, handleEnter, handleLeave] = useHover();\n\n const action = active && subAction ? subAction : onClick;\n const handleAction = () => action(id);\n\n const isDraft = type === ViewTabTypes.draft;\n const isSaved = type === ViewTabTypes.saved;\n\n const getLabelAction = () => {\n if (active && isDraft) return 'Delete';\n if (active && isSaved) return 'Edit';\n return '';\n };\n\n return (\n <ViewButton\n className={buildClassnames([classNames?.container])}\n onClick={handleAction}\n role=\"tab\"\n aria-selected={active}\n aria-label={`${getLabelAction()} ${name} view ${\n count ? `with ${count} ${ariaContext}` : ''\n }`}\n customTextColour={customTextColour}\n ref={ref}\n {...props}\n >\n <Contour\n active={active}\n onMouseEnter={handleEnter}\n onMouseLeave={handleLeave}\n colourPalette={colourPalette}\n customTextColour={customTextColour}\n >\n {iconSlot && <CustomIconWrapper>{iconSlot}</CustomIconWrapper>}\n <Text variant=\"bodyBold\">{name}</Text>\n {count !== undefined && count !== null && (\n <CounterContainer\n data-testid=\"countContainer\"\n active={active || isHovered}\n colourPalette={colourPalette}\n customTextColour={customTextColour}\n >\n <CounterText variant=\"subheadingSmall\">{count}</CounterText>\n </CounterContainer>\n )}\n {isDraft && <CrossIconStyling {...IconStyling} aria-label=\"delete icon\" />}\n {isSaved && active && <ThreeDotsIconStyling {...IconStyling} aria-label=\"edit icon\" />}\n </Contour>\n </ViewButton>\n );\n },\n);\n"],"names":["React","colors","useHover","ViewTabTypes","ViewButton","buildClassnames","Contour","CustomIconWrapper","Text","CounterContainer","CounterText","CrossIconStyling","IconStyling","ThreeDotsIconStyling"],"mappings":"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"}
|
|
@@ -3,6 +3,7 @@ import '../../hooks/useFocusVisible.js';
|
|
|
3
3
|
import { useHover } from '../../hooks/useHover.js';
|
|
4
4
|
import { buildClassnames } from '../../utils/buildClassnames.js';
|
|
5
5
|
import 'uid/secure';
|
|
6
|
+
import 'lodash.throttle';
|
|
6
7
|
import { colors } from '../../theme/modules/colors.js';
|
|
7
8
|
import { ViewTabTypes } from './types.js';
|
|
8
9
|
import { ViewButton, Contour, CustomIconWrapper, CounterContainer, CounterText, CrossIconStyling, IconStyling, ThreeDotsIconStyling } from './styled.js';
|