npm - @veeqo/ui - Versions diffs - 14.10.0-beta-1 → 14.10.0-beta-2 - Mend

@veeqo/ui 14.10.0-beta-1 → 14.10.0-beta-2

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

Files changed (90) hide show

package/dist/components/DataTable/DataTable.cjs CHANGED Viewed

@@ -98,7 +98,7 @@ const DataTable = ({ actionBarSlot, borderMode, columns: initialColumns, emptySt
         }));
         return (React__default.default.createElement(Wrapper.Wrapper, { borderMode: borderMode },
             React__default.default.createElement(ScrollContainer.ScrollContainer, { ref: scrollContainerRef, onScroll: onScroll },
-                React__default.default.createElement(TableGrid.TableGrid, { css: tableCss, ref: tableRef, role: "table" },
+                React__default.default.createElement(TableGrid.TableGrid, { tableCss: tableCss, ref: tableRef, role: "table" },
                     React__default.default.createElement("thead", { role: "rowgroup" },
                         React__default.default.createElement(Row.Row, { role: "row" }, visible.map((column, i) => renderHeader.renderHeader({
                             column,
@@ -114,7 +114,7 @@ const DataTable = ({ actionBarSlot, borderMode, columns: initialColumns, emptySt
     if (rows.length === 0) {
         return (React__default.default.createElement(Wrapper.Wrapper, { borderMode: borderMode },
             React__default.default.createElement(ScrollContainer.ScrollContainer, { ref: scrollContainerRef, onScroll: onScroll },
-                React__default.default.createElement(TableGrid.TableGrid, { css: tableCss, ref: tableRef, role: "table" },
+                React__default.default.createElement(TableGrid.TableGrid, { tableCss: tableCss, ref: tableRef, role: "table" },
                     React__default.default.createElement("thead", { role: "rowgroup" },
                         React__default.default.createElement(Row.Row, { role: "row" }, visible.map((column, i) => renderHeader.renderHeader({
                             column,
@@ -185,7 +185,7 @@ const DataTable = ({ actionBarSlot, borderMode, columns: initialColumns, emptySt
         React__default.default.createElement(ScrollContainer.ScrollContainer, { ref: scrollContainerRef, onScroll: onScroll },
             enableStickyHeader && (React__default.default.createElement(StickyHead.StickyHead, { tableCss: tableCss, intersectionTargetRef: intersectionTargetRef, containerRef: scrollContainerRef, cellWidths: adjustedCellWidths, stickyHeaderTop: stickyHeaderTop }, headersMarkup)),
             React__default.default.createElement("div", { ref: intersectionTargetRef, style: { height: 0 } }),
-            React__default.default.createElement(TableGrid.TableGrid, { css: tableCss, ref: tableRef, role: "table" },
+            React__default.default.createElement(TableGrid.TableGrid, { tableCss: tableCss, ref: tableRef, role: "table" },
                 React__default.default.createElement("thead", { role: "rowgroup" }, headersMarkup),
                 renderBody(),
                 shouldRenderFooter && (React__default.default.createElement("tfoot", { role: "rowgroup" },

package/dist/components/DataTable/DataTable.cjs.map CHANGED Viewed

	@@ -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 { useDragToScroll, useScrollPosition } from '../../hooks';\n\nimport { generateTableCss } from './utils';\nimport { DataTableProps, CustomState, TableRow } from './types';\n\nimport { useCellWidths, useColumns, 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 '../../icons';\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, onScroll, enableTransition } = useScrollPosition({\n containerRef: scrollContainerRef,\n });\n const tableCss = generateTableCss({\n pinnedLeft,\n pinnedRight,\n cellWidths: adjustedCellWidths,\n scrollPosition,\n columnWidths: calcColumnWidths,\n columns: visible,\n stripingMode,\n enableTransition,\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} onScroll={onScroll}>\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} onScroll={onScroll}>\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} onScroll={onScroll}>\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	+ {"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, useScrollPosition } from '../../hooks';\n\nimport { generateTableCss } from './utils';\nimport { DataTableProps, CustomState, TableRow } from './types';\n\nimport { useCellWidths, useColumns, 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 '../../icons';\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, onScroll, enableTransition } = useScrollPosition({\n containerRef: scrollContainerRef,\n });\n const tableCss = generateTableCss({\n pinnedLeft,\n pinnedRight,\n cellWidths: adjustedCellWidths,\n scrollPosition,\n columnWidths: calcColumnWidths,\n columns: visible,\n stripingMode,\n enableTransition,\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} onScroll={onScroll}>\n <TableGrid tableCss={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} onScroll={onScroll}>\n <TableGrid tableCss={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} onScroll={onScroll}>\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 tableCss={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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"}

package/dist/components/DataTable/DataTable.js CHANGED Viewed

@@ -92,7 +92,7 @@ const DataTable = ({ actionBarSlot, borderMode, columns: initialColumns, emptySt
         }));
         return (React__default.createElement(Wrapper, { borderMode: borderMode },
             React__default.createElement(ScrollContainer, { ref: scrollContainerRef, onScroll: onScroll },
-                React__default.createElement(TableGrid, { css: tableCss, ref: tableRef, role: "table" },
+                React__default.createElement(TableGrid, { tableCss: tableCss, ref: tableRef, role: "table" },
                     React__default.createElement("thead", { role: "rowgroup" },
                         React__default.createElement(Row, { role: "row" }, visible.map((column, i) => renderHeader({
                             column,
@@ -108,7 +108,7 @@ const DataTable = ({ actionBarSlot, borderMode, columns: initialColumns, emptySt
     if (rows.length === 0) {
         return (React__default.createElement(Wrapper, { borderMode: borderMode },
             React__default.createElement(ScrollContainer, { ref: scrollContainerRef, onScroll: onScroll },
-                React__default.createElement(TableGrid, { css: tableCss, ref: tableRef, role: "table" },
+                React__default.createElement(TableGrid, { tableCss: tableCss, ref: tableRef, role: "table" },
                     React__default.createElement("thead", { role: "rowgroup" },
                         React__default.createElement(Row, { role: "row" }, visible.map((column, i) => renderHeader({
                             column,
@@ -179,7 +179,7 @@ const DataTable = ({ actionBarSlot, borderMode, columns: initialColumns, emptySt
         React__default.createElement(ScrollContainer, { ref: scrollContainerRef, onScroll: onScroll },
             enableStickyHeader && (React__default.createElement(StickyHead, { tableCss: tableCss, intersectionTargetRef: intersectionTargetRef, containerRef: scrollContainerRef, cellWidths: adjustedCellWidths, stickyHeaderTop: stickyHeaderTop }, headersMarkup)),
             React__default.createElement("div", { ref: intersectionTargetRef, style: { height: 0 } }),
-            React__default.createElement(TableGrid, { css: tableCss, ref: tableRef, role: "table" },
+            React__default.createElement(TableGrid, { tableCss: tableCss, ref: tableRef, role: "table" },
                 React__default.createElement("thead", { role: "rowgroup" }, headersMarkup),
                 renderBody(),
                 shouldRenderFooter && (React__default.createElement("tfoot", { role: "rowgroup" },

package/dist/components/DataTable/DataTable.js.map CHANGED Viewed

	@@ -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 { useDragToScroll, useScrollPosition } from '../../hooks';\n\nimport { generateTableCss } from './utils';\nimport { DataTableProps, CustomState, TableRow } from './types';\n\nimport { useCellWidths, useColumns, 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 '../../icons';\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, onScroll, enableTransition } = useScrollPosition({\n containerRef: scrollContainerRef,\n });\n const tableCss = generateTableCss({\n pinnedLeft,\n pinnedRight,\n cellWidths: adjustedCellWidths,\n scrollPosition,\n columnWidths: calcColumnWidths,\n columns: visible,\n stripingMode,\n enableTransition,\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} onScroll={onScroll}>\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} onScroll={onScroll}>\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} onScroll={onScroll}>\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, useScrollPosition } from '../../hooks';\n\nimport { generateTableCss } from './utils';\nimport { DataTableProps, CustomState, TableRow } from './types';\n\nimport { useCellWidths, useColumns, 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 '../../icons';\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, onScroll, enableTransition } = useScrollPosition({\n containerRef: scrollContainerRef,\n });\n const tableCss = generateTableCss({\n pinnedLeft,\n pinnedRight,\n cellWidths: adjustedCellWidths,\n scrollPosition,\n columnWidths: calcColumnWidths,\n columns: visible,\n stripingMode,\n enableTransition,\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} onScroll={onScroll}>\n <TableGrid tableCss={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} onScroll={onScroll}>\n <TableGrid tableCss={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} onScroll={onScroll}>\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 tableCss={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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"}

package/dist/components/DataTable/components/DataTable.module.scss.cjs CHANGED Viewed

@@ -2,8 +2,8 @@
 var ___$insertStyle = require('../../../_virtual/____insertStyle.cjs');
-___$insertStyle("/* DataTable sub-component styles */\n/* ScrollContainer */\n._scrollContainer_1biar_3 {\n  position: relative;\n  width: 100%;\n  overflow-x: auto;\n  overflow-y: hidden;\n}\n\n/* NoWrap */\n._noWrap_1biar_11 {\n  white-space: nowrap;\n}\n\n/* Truncate */\n._truncate_1biar_16 {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* LoadingCellContent */\n._loadingCellContent_1biar_23 {\n  height: 20px;\n  width: 75%;\n  border-radius: var(--radius-base);\n  background: var(--colors-neutral-grey-base);\n  background-image: linear-gradient(to right, var(--colors-neutral-grey-base) 0%, var(--colors-neutral-grey-dark) 20%, var(--colors-neutral-grey-base) 40%, var(--colors-neutral-grey-base) 100%);\n  background-repeat: no-repeat;\n  background-size: 800px 104px;\n  animation-duration: 1s;\n  animation-fill-mode: forwards;\n  animation-iteration-count: infinite;\n  animation-name: _placeholderShimmer_1biar_1;\n  animation-timing-function: linear;\n}\n\n@keyframes _placeholderShimmer_1biar_1 {\n  0% {\n    background-position: -468px 0;\n  }\n  100% {\n    background-position: 468px 0;\n  }\n}\n/* EmptyBodyContent */\n._emptyBodyContent_1biar_47 {\n  padding-top: var(--sizes-lg);\n  padding-bottom: var(--sizes-lg);\n  grid-column: 1/span var(--column-span);\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: var(--sizes-md);\n}\n\n._emptyBodyGlyphWrapper_1biar_58 {\n  padding: var(--sizes-md);\n  background-color: var(--colors-neutral-grey-light);\n  border-radius: var(--radius-full);\n}\n\n/* Cell */\n._cell_1biar_65 {\n  display: flex;\n  align-items: center;\n  justify-content: var(--cell-align, flex-start);\n  background-color: white;\n  padding-bottom: var(--density);\n  padding-top: var(--density);\n  padding-left: var(--cell-spacing, var(--sizes-3));\n  padding-right: var(--cell-spacing, var(--sizes-3));\n  color: var(--text-body-small-color);\n  font-family: var(--text-body-small-font-family);\n  font-size: var(--text-body-small-font-size);\n  font-style: var(--text-body-small-font-style);\n  font-weight: var(--text-body-small-font-weight);\n  line-height: var(--text-body-small-line-height);\n  grid-column-end: span var(--cell-span, 1);\n}\ntfoot ._cell_1biar_65 {\n  min-height: 56px;\n  border-top: 1px solid var(--colors-secondary-blue-base);\n  background-color: var(--colors-neutral-grey-lightest);\n}\n\n/* Header */\n._header_1biar_89 {\n  height: 56px;\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: var(--cell-align, flex-start);\n  z-index: var(--header-z-index, 0);\n  background-color: white;\n  padding-left: var(--cell-spacing, var(--sizes-3));\n  padding-right: var(--cell-spacing, var(--sizes-3));\n  border-bottom: 1px solid var(--colors-neutral-grey-base);\n  grid-column-end: span var(--cell-span, 1);\n}\n\n/* Row */\n._row_1biar_104 {\n  display: contents;\n}\n\n._rowSelected_1biar_108 > td {\n  background-color: var(--colors-brand-blue-lightest);\n}\n\n._rowAccentColor_1biar_112 > *:first-child {\n  position: relative;\n}\n\n._rowAccentColor_1biar_112 > *:first-child::before {\n  content: \"\";\n  position: absolute;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  width: 4px;\n  background-color: var(--row-accent-color);\n}\n\n/* Wrapper */\n._wrapper_1biar_127 {\n  width: 100%;\n  position: relative;\n  border-style: solid;\n  border-color: var(--colors-neutral-grey-dark);\n  /* stylelint-disable-next-line selector-pseudo-class-no-unknown */\n}\n._wrapper_1biar_127, ._wrapper_1biar_127 * {\n  box-sizing: border-box;\n}\n._wrapper_1biar_127 .hideHeaderDetails th {\n  /* stylelint-disable-next-line selector-pseudo-class-no-unknown */\n}\n._wrapper_1biar_127 .hideHeaderDetails th > * {\n  opacity: 0.1;\n}\n._wrapper_1biar_127 .hideHeaderDetails th .th-divider {\n  opacity: 1;\n}\n\n._borderFull_1biar_147 {\n  border-width: 1px;\n  border-radius: var(--radius-base);\n}\n\n._borderVertical_1biar_152 {\n  border-width: 0;\n  border-top-width: 1px;\n  border-bottom-width: 1px;\n}\n\n._borderNone_1biar_158 {\n  border-width: 0;\n}\n\n/* TableGrid */\n._tableGrid_1biar_163 {\n  min-width: 100%;\n  width: max-content;\n  display: grid;\n  --density: var(--sizes-base);\n}\n._tableGrid_1biar_163 thead, ._tableGrid_1biar_163 tbody, ._tableGrid_1biar_163 tfoot {\n  display: contents;\n}\n\n._tableGrid_1biar_163._tableGrid_1biar_163 tr:hover td {\n  background-color: var(--colors-brand-blue-lightest);\n}\n\n/* ColumnHeader */\n._sortIndicator_1biar_178 {\n  width: 20px;\n  height: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: white;\n  color: var(--colors-neutral-ink-lightest);\n}\n\n._headerContent_1biar_188 {\n  display: flex;\n  height: 28px;\n  align-items: center;\n  gap: var(--sizes-xs);\n  white-space: nowrap;\n  color: var(--text-heading-table-color);\n  font-family: var(--text-heading-table-font-family);\n  font-size: var(--text-heading-table-font-size);\n  font-style: var(--text-heading-table-font-style);\n  font-weight: var(--text-heading-table-font-weight);\n  line-height: var(--text-heading-table-line-height);\n}\n\n._clickableHeaderContent_1biar_202 {\n  display: flex;\n  height: 28px;\n  align-items: center;\n  gap: var(--sizes-xs);\n  white-space: nowrap;\n  color: var(--text-heading-table-color);\n  font-family: var(--text-heading-table-font-family);\n  font-size: var(--text-heading-table-font-size);\n  font-style: var(--text-heading-table-font-style);\n  font-weight: var(--text-heading-table-font-weight);\n  line-height: var(--text-heading-table-line-height);\n  appearance: none;\n  padding: 0;\n  border: 0;\n  border-radius: var(--radius-base);\n  background-color: transparent;\n}\n._clickableHeaderContent_1biar_202:not(:disabled):hover {\n  cursor: pointer;\n}\n._clickableHeaderContent_1biar_202:hover ._sortIndicator_1biar_178 {\n  background-color: var(--colors-neutral-grey-light);\n  color: var(--colors-neutral-ink-base);\n}\n._clickableHeaderContent_1biar_202:focus-visible {\n  outline: 0;\n  box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n}\n\n/* ColumnDivider ResizerBar */\n._resizerBar_1biar_233 {\n  position: absolute;\n  right: 0;\n  top: 37.5%;\n  width: 1px;\n  background: var(--colors-neutral-grey-dark);\n  min-height: 25%;\n  cursor: col-resize;\n  user-select: none;\n}\n._resizerBar_1biar_233::before {\n  content: \"\";\n  position: absolute;\n  top: -150%;\n  left: 0;\n  width: 12px;\n  min-height: 400%;\n  z-index: 1;\n  transform: translateX(-6px);\n}\n\n/* ActionBar */\n._actionBarContainer_1biar_255 {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  align-items: center;\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  z-index: 50;\n  height: 56px;\n  background-color: white;\n}\n\n._actionBarContent_1biar_268 {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  padding: 0 var(--sizes-sm);\n  border-bottom: 1px solid var(--colors-neutral-grey-base);\n}\n._actionBarContent_1biar_268 > * {\n  flex: 1;\n}");
-var styles = {"scrollContainer":"_scrollContainer_1biar_3","noWrap":"_noWrap_1biar_11","truncate":"_truncate_1biar_16","loadingCellContent":"_loadingCellContent_1biar_23","emptyBodyContent":"_emptyBodyContent_1biar_47","emptyBodyGlyphWrapper":"_emptyBodyGlyphWrapper_1biar_58","cell":"_cell_1biar_65","header":"_header_1biar_89","row":"_row_1biar_104","rowSelected":"_rowSelected_1biar_108","rowAccentColor":"_rowAccentColor_1biar_112","wrapper":"_wrapper_1biar_127","borderFull":"_borderFull_1biar_147","borderVertical":"_borderVertical_1biar_152","borderNone":"_borderNone_1biar_158","tableGrid":"_tableGrid_1biar_163","sortIndicator":"_sortIndicator_1biar_178","headerContent":"_headerContent_1biar_188","clickableHeaderContent":"_clickableHeaderContent_1biar_202","resizerBar":"_resizerBar_1biar_233","actionBarContainer":"_actionBarContainer_1biar_255","actionBarContent":"_actionBarContent_1biar_268"};
+___$insertStyle("/* DataTable sub-component styles */\n/* ScrollContainer */\n._scrollContainer_cvv55_3 {\n  position: relative;\n  width: 100%;\n  overflow-x: auto;\n  overflow-y: hidden;\n}\n\n/* NoWrap */\n._noWrap_cvv55_11 {\n  white-space: nowrap;\n}\n\n/* Truncate */\n._truncate_cvv55_16 {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* LoadingCellContent */\n._loadingCellContent_cvv55_23 {\n  height: 20px;\n  width: 75%;\n  border-radius: var(--radius-base);\n  background: var(--colors-neutral-grey-base);\n  background-image: linear-gradient(to right, var(--colors-neutral-grey-base) 0%, var(--colors-neutral-grey-dark) 20%, var(--colors-neutral-grey-base) 40%, var(--colors-neutral-grey-base) 100%);\n  background-repeat: no-repeat;\n  background-size: 800px 104px;\n  animation-duration: 1s;\n  animation-fill-mode: forwards;\n  animation-iteration-count: infinite;\n  animation-name: _placeholderShimmer_cvv55_1;\n  animation-timing-function: linear;\n}\n\n@keyframes _placeholderShimmer_cvv55_1 {\n  0% {\n    background-position: -468px 0;\n  }\n  100% {\n    background-position: 468px 0;\n  }\n}\n/* EmptyBodyContent */\n._emptyBodyContent_cvv55_47 {\n  padding-top: var(--sizes-lg);\n  padding-bottom: var(--sizes-lg);\n  grid-column: 1/span var(--column-span);\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: var(--sizes-md);\n}\n\n._emptyBodyGlyphWrapper_cvv55_58 {\n  padding: var(--sizes-md);\n  background-color: var(--colors-neutral-grey-light);\n  border-radius: var(--radius-full);\n}\n\n/* Cell */\n._cell_cvv55_65 {\n  display: flex;\n  align-items: center;\n  justify-content: var(--cell-align, flex-start);\n  background-color: white;\n  padding-bottom: var(--density);\n  padding-top: var(--density);\n  padding-left: var(--cell-spacing, var(--sizes-3));\n  padding-right: var(--cell-spacing, var(--sizes-3));\n  color: var(--text-body-small-color);\n  font-family: var(--text-body-small-font-family);\n  font-size: var(--text-body-small-font-size);\n  font-style: var(--text-body-small-font-style);\n  font-weight: var(--text-body-small-font-weight);\n  line-height: var(--text-body-small-line-height);\n  grid-column-end: span var(--cell-span, 1);\n}\ntfoot ._cell_cvv55_65 {\n  min-height: 56px;\n  border-top: 1px solid var(--colors-secondary-blue-base);\n  background-color: var(--colors-neutral-grey-lightest);\n}\n\n/* Header */\n._header_cvv55_89 {\n  height: 56px;\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: var(--cell-align, flex-start);\n  z-index: var(--header-z-index, 0);\n  background-color: white;\n  padding-left: var(--cell-spacing, var(--sizes-3));\n  padding-right: var(--cell-spacing, var(--sizes-3));\n  border-bottom: 1px solid var(--colors-neutral-grey-base);\n  grid-column-end: span var(--cell-span, 1);\n}\n\n/* Row */\n._row_cvv55_104 {\n  display: contents;\n}\n\n._rowSelected_cvv55_108 > td {\n  background-color: var(--colors-brand-blue-lightest);\n}\n\n._rowAccentColor_cvv55_112 > *:first-child {\n  position: relative;\n}\n\n._rowAccentColor_cvv55_112 > *:first-child::before {\n  content: \"\";\n  position: absolute;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  width: 4px;\n  background-color: var(--row-accent-color);\n}\n\n/* Wrapper */\n._wrapper_cvv55_127 {\n  width: 100%;\n  position: relative;\n  border-style: solid;\n  border-color: var(--colors-neutral-grey-dark);\n  /* stylelint-disable-next-line selector-pseudo-class-no-unknown */\n}\n._wrapper_cvv55_127, ._wrapper_cvv55_127 * {\n  box-sizing: border-box;\n}\n._wrapper_cvv55_127 .hideHeaderDetails th {\n  /* stylelint-disable-next-line selector-pseudo-class-no-unknown */\n}\n._wrapper_cvv55_127 .hideHeaderDetails th > * {\n  opacity: 0.1;\n}\n._wrapper_cvv55_127 .hideHeaderDetails th .th-divider {\n  opacity: 1;\n}\n\n._borderFull_cvv55_147 {\n  border-width: 1px;\n  border-radius: var(--radius-base);\n}\n\n._borderVertical_cvv55_152 {\n  border-width: 0;\n  border-top-width: 1px;\n  border-bottom-width: 1px;\n}\n\n._borderNone_cvv55_158 {\n  border-width: 0;\n}\n\n/* TableGrid */\n._tableGrid_cvv55_163 {\n  min-width: 100%;\n  width: max-content;\n  display: grid;\n  --density: var(--sizes-base);\n}\n._tableGrid_cvv55_163 thead, ._tableGrid_cvv55_163 tbody, ._tableGrid_cvv55_163 tfoot {\n  display: contents;\n}\n\n._tableGrid_cvv55_163._tableGrid_cvv55_163 tr:hover td {\n  /* No 1:1 theme token exists for this shade */\n  background-color: #f2f8fc;\n}\n\n/* ColumnHeader */\n._sortIndicator_cvv55_179 {\n  width: 20px;\n  height: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: white;\n  color: var(--colors-neutral-ink-lightest);\n}\n\n._headerContent_cvv55_189 {\n  display: flex;\n  height: 28px;\n  align-items: center;\n  gap: var(--sizes-xs);\n  white-space: nowrap;\n  color: var(--text-heading-table-color);\n  font-family: var(--text-heading-table-font-family);\n  font-size: var(--text-heading-table-font-size);\n  font-style: var(--text-heading-table-font-style);\n  font-weight: var(--text-heading-table-font-weight);\n  line-height: var(--text-heading-table-line-height);\n}\n\n._clickableHeaderContent_cvv55_203 {\n  display: flex;\n  height: 28px;\n  align-items: center;\n  gap: var(--sizes-xs);\n  white-space: nowrap;\n  color: var(--text-heading-table-color);\n  font-family: var(--text-heading-table-font-family);\n  font-size: var(--text-heading-table-font-size);\n  font-style: var(--text-heading-table-font-style);\n  font-weight: var(--text-heading-table-font-weight);\n  line-height: var(--text-heading-table-line-height);\n  appearance: none;\n  padding: 0;\n  border: 0;\n  border-radius: var(--radius-base);\n  background-color: transparent;\n}\n._clickableHeaderContent_cvv55_203:not(:disabled):hover {\n  cursor: pointer;\n}\n._clickableHeaderContent_cvv55_203:hover ._sortIndicator_cvv55_179 {\n  background-color: var(--colors-neutral-grey-light);\n  color: var(--colors-neutral-ink-base);\n}\n._clickableHeaderContent_cvv55_203:focus-visible {\n  outline: 0;\n  box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n}\n\n/* ColumnDivider ResizerBar */\n._resizerBar_cvv55_234 {\n  position: absolute;\n  right: 0;\n  top: 37.5%;\n  width: 1px;\n  background: var(--colors-neutral-grey-dark);\n  min-height: 25%;\n  cursor: col-resize;\n  user-select: none;\n}\n._resizerBar_cvv55_234::before {\n  content: \"\";\n  position: absolute;\n  top: -150%;\n  left: 0;\n  width: 12px;\n  min-height: 400%;\n  z-index: 1;\n  transform: translateX(-6px);\n}\n\n/* ActionBar */\n._actionBarContainer_cvv55_256 {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  align-items: center;\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  z-index: 50;\n  height: 56px;\n  background-color: white;\n}\n\n._actionBarContent_cvv55_269 {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  padding: 0 var(--sizes-sm);\n  border-bottom: 1px solid var(--colors-neutral-grey-base);\n}\n._actionBarContent_cvv55_269 > * {\n  flex: 1;\n}");
+var styles = {"scrollContainer":"_scrollContainer_cvv55_3","noWrap":"_noWrap_cvv55_11","truncate":"_truncate_cvv55_16","loadingCellContent":"_loadingCellContent_cvv55_23","emptyBodyContent":"_emptyBodyContent_cvv55_47","emptyBodyGlyphWrapper":"_emptyBodyGlyphWrapper_cvv55_58","cell":"_cell_cvv55_65","header":"_header_cvv55_89","row":"_row_cvv55_104","rowSelected":"_rowSelected_cvv55_108","rowAccentColor":"_rowAccentColor_cvv55_112","wrapper":"_wrapper_cvv55_127","borderFull":"_borderFull_cvv55_147","borderVertical":"_borderVertical_cvv55_152","borderNone":"_borderNone_cvv55_158","tableGrid":"_tableGrid_cvv55_163","sortIndicator":"_sortIndicator_cvv55_179","headerContent":"_headerContent_cvv55_189","clickableHeaderContent":"_clickableHeaderContent_cvv55_203","resizerBar":"_resizerBar_cvv55_234","actionBarContainer":"_actionBarContainer_cvv55_256","actionBarContent":"_actionBarContent_cvv55_269"};
 module.exports = styles;
 //# sourceMappingURL=DataTable.module.scss.cjs.map

package/dist/components/DataTable/components/DataTable.module.scss.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DataTable.module.scss.cjs","sources":["../../../../src/components/DataTable/components/DataTable.module.scss"],"sourcesContent":["/* DataTable sub-component styles /\n\n/ ScrollContainer /\n.scrollContainer {\n position: relative;\n width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n/ NoWrap /\n.noWrap {\n white-space: nowrap;\n}\n\n/ Truncate /\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/ LoadingCellContent /\n.loadingCellContent {\n height: 20px;\n width: 75%;\n border-radius: var(--radius-base);\n\n background: var(--colors-neutral-grey-base);\n background-image: linear-gradient(\n to right,\n var(--colors-neutral-grey-base) 0%,\n var(--colors-neutral-grey-dark) 20%,\n var(--colors-neutral-grey-base) 40%,\n var(--colors-neutral-grey-base) 100%\n );\n background-repeat: no-repeat;\n background-size: 800px 104px;\n\n animation-duration: 1s;\n animation-fill-mode: forwards;\n animation-iteration-count: infinite;\n animation-name: placeholderShimmer;\n animation-timing-function: linear;\n}\n\n@keyframes placeholderShimmer {\n 0% {\n background-position: -468px 0;\n }\n\n 100% {\n background-position: 468px 0;\n }\n}\n\n/ EmptyBodyContent /\n.emptyBodyContent {\n padding-top: var(--sizes-lg);\n padding-bottom: var(--sizes-lg);\n grid-column: 1 / span var(--column-span);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--sizes-md);\n}\n\n.emptyBodyGlyphWrapper {\n padding: var(--sizes-md);\n background-color: var(--colors-neutral-grey-light);\n border-radius: var(--radius-full);\n}\n\n/ Cell /\n.cell {\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n\n background-color: white;\n padding-bottom: var(--density);\n padding-top: var(--density);\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n\n grid-column-end: span var(--cell-span, 1);\n\n tfoot & {\n min-height: 56px;\n border-top: 1px solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n }\n}\n\n/ Header /\n.header {\n height: 56px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n z-index: var(--header-z-index, 0);\n\n background-color: white;\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n grid-column-end: span var(--cell-span, 1);\n}\n\n/ Row /\n.row {\n display: contents;\n}\n\n.rowSelected > td {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n.rowAccentColor > :first-child {\n position: relative;\n}\n\n.rowAccentColor > :first-child::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: 4px;\n background-color: var(--row-accent-color);\n}\n\n/ Wrapper /\n.wrapper {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n\n &,\n & {\n box-sizing: border-box;\n }\n\n /* stylelint-disable-next-line selector-pseudo-class-no-unknown /\n :global(.hideHeaderDetails) th {\n > {\n opacity: 0.1;\n }\n\n /* stylelint-disable-next-line selector-pseudo-class-no-unknown /\n :global(.th-divider) {\n opacity: 1;\n }\n }\n}\n\n.borderFull {\n border-width: 1px;\n border-radius: var(--radius-base);\n}\n\n.borderVertical {\n border-width: 0;\n border-top-width: 1px;\n border-bottom-width: 1px;\n}\n\n.borderNone {\n border-width: 0;\n}\n\n/ TableGrid /\n.tableGrid {\n min-width: 100%;\n width: max-content;\n display: grid;\n\n & thead,\n & tbody,\n & tfoot {\n display: contents;\n }\n\n --density: var(--sizes-base);\n}\n\n.tableGrid.tableGrid tr:hover td {\n background-color: ~~var(--colors-brand-blue-lightest)~~;\n}\n\n/ ColumnHeader /\n.sortIndicator {\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n color: var(--colors-neutral-ink-lightest);\n}\n\n.headerContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n}\n\n.clickableHeaderContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n\n appearance: none;\n padding: 0;\n border: 0;\n border-radius: var(--radius-base);\n background-color: transparent;\n\n &:not(:disabled):hover {\n cursor: pointer;\n }\n\n &:hover .sortIndicator {\n background-color: var(--colors-neutral-grey-light);\n color: var(--colors-neutral-ink-base);\n }\n\n &:focus-visible {\n outline: 0;\n box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n }\n}\n\n/ ColumnDivider ResizerBar /\n.resizerBar {\n position: absolute;\n right: 0;\n top: 37.5%;\n width: 1px;\n background: var(--colors-neutral-grey-dark);\n min-height: 25%;\n cursor: col-resize;\n user-select: none;\n\n &::before {\n content: '';\n position: absolute;\n top: -150%;\n left: 0;\n width: 12px;\n min-height: 400%;\n z-index: 1;\n transform: translateX(-6px);\n }\n}\n\n/ ActionBar /\n.actionBarContainer {\n display: grid;\n grid-template-columns: auto 1fr;\n align-items: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 50;\n height: 56px;\n background-color: white;\n}\n\n.actionBarContent {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n padding: 0 var(--sizes-sm);\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n & > {\n flex: 1;\n }\n}\n"],"names":[],"mappings":";;;;AAEA,eAAA,CAAA~~,u7NAAA~~;AACA,aAAA,CAAA,iBAAA,CAAA,0BAAA,CAAA,QAAA,CAAA,kBAAA,CAAA,UAAA,CAAA,oBAAA,CAAA,oBAAA,CAAA,8BAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,uBAAA,CAAA,iCAAA,CAAA,MAAA,CAAA,gBAAA,CAAA,QAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,gBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,wBAAA,CAAA,mCAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,oBAAA,CAAA,+BAAA,CAAA,kBAAA,CAAA,6BAAA;;;;"}
1	+ {"version":3,"file":"DataTable.module.scss.cjs","sources":["../../../../src/components/DataTable/components/DataTable.module.scss"],"sourcesContent":["/* DataTable sub-component styles /\n\n/ ScrollContainer /\n.scrollContainer {\n position: relative;\n width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n/ NoWrap /\n.noWrap {\n white-space: nowrap;\n}\n\n/ Truncate /\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/ LoadingCellContent /\n.loadingCellContent {\n height: 20px;\n width: 75%;\n border-radius: var(--radius-base);\n\n background: var(--colors-neutral-grey-base);\n background-image: linear-gradient(\n to right,\n var(--colors-neutral-grey-base) 0%,\n var(--colors-neutral-grey-dark) 20%,\n var(--colors-neutral-grey-base) 40%,\n var(--colors-neutral-grey-base) 100%\n );\n background-repeat: no-repeat;\n background-size: 800px 104px;\n\n animation-duration: 1s;\n animation-fill-mode: forwards;\n animation-iteration-count: infinite;\n animation-name: placeholderShimmer;\n animation-timing-function: linear;\n}\n\n@keyframes placeholderShimmer {\n 0% {\n background-position: -468px 0;\n }\n\n 100% {\n background-position: 468px 0;\n }\n}\n\n/ EmptyBodyContent /\n.emptyBodyContent {\n padding-top: var(--sizes-lg);\n padding-bottom: var(--sizes-lg);\n grid-column: 1 / span var(--column-span);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--sizes-md);\n}\n\n.emptyBodyGlyphWrapper {\n padding: var(--sizes-md);\n background-color: var(--colors-neutral-grey-light);\n border-radius: var(--radius-full);\n}\n\n/ Cell /\n.cell {\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n\n background-color: white;\n padding-bottom: var(--density);\n padding-top: var(--density);\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n\n grid-column-end: span var(--cell-span, 1);\n\n tfoot & {\n min-height: 56px;\n border-top: 1px solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n }\n}\n\n/ Header /\n.header {\n height: 56px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n z-index: var(--header-z-index, 0);\n\n background-color: white;\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n grid-column-end: span var(--cell-span, 1);\n}\n\n/ Row /\n.row {\n display: contents;\n}\n\n.rowSelected > td {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n.rowAccentColor > :first-child {\n position: relative;\n}\n\n.rowAccentColor > :first-child::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: 4px;\n background-color: var(--row-accent-color);\n}\n\n/ Wrapper /\n.wrapper {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n\n &,\n & {\n box-sizing: border-box;\n }\n\n /* stylelint-disable-next-line selector-pseudo-class-no-unknown /\n :global(.hideHeaderDetails) th {\n > {\n opacity: 0.1;\n }\n\n /* stylelint-disable-next-line selector-pseudo-class-no-unknown /\n :global(.th-divider) {\n opacity: 1;\n }\n }\n}\n\n.borderFull {\n border-width: 1px;\n border-radius: var(--radius-base);\n}\n\n.borderVertical {\n border-width: 0;\n border-top-width: 1px;\n border-bottom-width: 1px;\n}\n\n.borderNone {\n border-width: 0;\n}\n\n/ TableGrid /\n.tableGrid {\n min-width: 100%;\n width: max-content;\n display: grid;\n\n & thead,\n & tbody,\n & tfoot {\n display: contents;\n }\n\n --density: var(--sizes-base);\n}\n\n.tableGrid.tableGrid tr:hover td {\n / No 1:1 theme token exists for this shade /\n background-color: #f2f8fc;\n}\n\n/ ColumnHeader /\n.sortIndicator {\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n color: var(--colors-neutral-ink-lightest);\n}\n\n.headerContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n}\n\n.clickableHeaderContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n\n appearance: none;\n padding: 0;\n border: 0;\n border-radius: var(--radius-base);\n background-color: transparent;\n\n &:not(:disabled):hover {\n cursor: pointer;\n }\n\n &:hover .sortIndicator {\n background-color: var(--colors-neutral-grey-light);\n color: var(--colors-neutral-ink-base);\n }\n\n &:focus-visible {\n outline: 0;\n box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n }\n}\n\n/ ColumnDivider ResizerBar /\n.resizerBar {\n position: absolute;\n right: 0;\n top: 37.5%;\n width: 1px;\n background: var(--colors-neutral-grey-dark);\n min-height: 25%;\n cursor: col-resize;\n user-select: none;\n\n &::before {\n content: '';\n position: absolute;\n top: -150%;\n left: 0;\n width: 12px;\n min-height: 400%;\n z-index: 1;\n transform: translateX(-6px);\n }\n}\n\n/ ActionBar /\n.actionBarContainer {\n display: grid;\n grid-template-columns: auto 1fr;\n align-items: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 50;\n height: 56px;\n background-color: white;\n}\n\n.actionBarContent {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n padding: 0 var(--sizes-sm);\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n & > {\n flex: 1;\n }\n}\n"],"names":[],"mappings":";;;;AAEA,eAAA,CAAA,+8NAAA;AACA,aAAA,CAAA,iBAAA,CAAA,0BAAA,CAAA,QAAA,CAAA,kBAAA,CAAA,UAAA,CAAA,oBAAA,CAAA,oBAAA,CAAA,8BAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,uBAAA,CAAA,iCAAA,CAAA,MAAA,CAAA,gBAAA,CAAA,QAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,gBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,wBAAA,CAAA,mCAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,oBAAA,CAAA,+BAAA,CAAA,kBAAA,CAAA,6BAAA;;;;"}

package/dist/components/DataTable/components/DataTable.module.scss.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import insertStyle from '../../../_virtual/____insertStyle.js';
-insertStyle("/* DataTable sub-component styles */\n/* ScrollContainer */\n._scrollContainer_1biar_3 {\n  position: relative;\n  width: 100%;\n  overflow-x: auto;\n  overflow-y: hidden;\n}\n\n/* NoWrap */\n._noWrap_1biar_11 {\n  white-space: nowrap;\n}\n\n/* Truncate */\n._truncate_1biar_16 {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* LoadingCellContent */\n._loadingCellContent_1biar_23 {\n  height: 20px;\n  width: 75%;\n  border-radius: var(--radius-base);\n  background: var(--colors-neutral-grey-base);\n  background-image: linear-gradient(to right, var(--colors-neutral-grey-base) 0%, var(--colors-neutral-grey-dark) 20%, var(--colors-neutral-grey-base) 40%, var(--colors-neutral-grey-base) 100%);\n  background-repeat: no-repeat;\n  background-size: 800px 104px;\n  animation-duration: 1s;\n  animation-fill-mode: forwards;\n  animation-iteration-count: infinite;\n  animation-name: _placeholderShimmer_1biar_1;\n  animation-timing-function: linear;\n}\n\n@keyframes _placeholderShimmer_1biar_1 {\n  0% {\n    background-position: -468px 0;\n  }\n  100% {\n    background-position: 468px 0;\n  }\n}\n/* EmptyBodyContent */\n._emptyBodyContent_1biar_47 {\n  padding-top: var(--sizes-lg);\n  padding-bottom: var(--sizes-lg);\n  grid-column: 1/span var(--column-span);\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: var(--sizes-md);\n}\n\n._emptyBodyGlyphWrapper_1biar_58 {\n  padding: var(--sizes-md);\n  background-color: var(--colors-neutral-grey-light);\n  border-radius: var(--radius-full);\n}\n\n/* Cell */\n._cell_1biar_65 {\n  display: flex;\n  align-items: center;\n  justify-content: var(--cell-align, flex-start);\n  background-color: white;\n  padding-bottom: var(--density);\n  padding-top: var(--density);\n  padding-left: var(--cell-spacing, var(--sizes-3));\n  padding-right: var(--cell-spacing, var(--sizes-3));\n  color: var(--text-body-small-color);\n  font-family: var(--text-body-small-font-family);\n  font-size: var(--text-body-small-font-size);\n  font-style: var(--text-body-small-font-style);\n  font-weight: var(--text-body-small-font-weight);\n  line-height: var(--text-body-small-line-height);\n  grid-column-end: span var(--cell-span, 1);\n}\ntfoot ._cell_1biar_65 {\n  min-height: 56px;\n  border-top: 1px solid var(--colors-secondary-blue-base);\n  background-color: var(--colors-neutral-grey-lightest);\n}\n\n/* Header */\n._header_1biar_89 {\n  height: 56px;\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: var(--cell-align, flex-start);\n  z-index: var(--header-z-index, 0);\n  background-color: white;\n  padding-left: var(--cell-spacing, var(--sizes-3));\n  padding-right: var(--cell-spacing, var(--sizes-3));\n  border-bottom: 1px solid var(--colors-neutral-grey-base);\n  grid-column-end: span var(--cell-span, 1);\n}\n\n/* Row */\n._row_1biar_104 {\n  display: contents;\n}\n\n._rowSelected_1biar_108 > td {\n  background-color: var(--colors-brand-blue-lightest);\n}\n\n._rowAccentColor_1biar_112 > *:first-child {\n  position: relative;\n}\n\n._rowAccentColor_1biar_112 > *:first-child::before {\n  content: \"\";\n  position: absolute;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  width: 4px;\n  background-color: var(--row-accent-color);\n}\n\n/* Wrapper */\n._wrapper_1biar_127 {\n  width: 100%;\n  position: relative;\n  border-style: solid;\n  border-color: var(--colors-neutral-grey-dark);\n  /* stylelint-disable-next-line selector-pseudo-class-no-unknown */\n}\n._wrapper_1biar_127, ._wrapper_1biar_127 * {\n  box-sizing: border-box;\n}\n._wrapper_1biar_127 .hideHeaderDetails th {\n  /* stylelint-disable-next-line selector-pseudo-class-no-unknown */\n}\n._wrapper_1biar_127 .hideHeaderDetails th > * {\n  opacity: 0.1;\n}\n._wrapper_1biar_127 .hideHeaderDetails th .th-divider {\n  opacity: 1;\n}\n\n._borderFull_1biar_147 {\n  border-width: 1px;\n  border-radius: var(--radius-base);\n}\n\n._borderVertical_1biar_152 {\n  border-width: 0;\n  border-top-width: 1px;\n  border-bottom-width: 1px;\n}\n\n._borderNone_1biar_158 {\n  border-width: 0;\n}\n\n/* TableGrid */\n._tableGrid_1biar_163 {\n  min-width: 100%;\n  width: max-content;\n  display: grid;\n  --density: var(--sizes-base);\n}\n._tableGrid_1biar_163 thead, ._tableGrid_1biar_163 tbody, ._tableGrid_1biar_163 tfoot {\n  display: contents;\n}\n\n._tableGrid_1biar_163._tableGrid_1biar_163 tr:hover td {\n  background-color: var(--colors-brand-blue-lightest);\n}\n\n/* ColumnHeader */\n._sortIndicator_1biar_178 {\n  width: 20px;\n  height: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: white;\n  color: var(--colors-neutral-ink-lightest);\n}\n\n._headerContent_1biar_188 {\n  display: flex;\n  height: 28px;\n  align-items: center;\n  gap: var(--sizes-xs);\n  white-space: nowrap;\n  color: var(--text-heading-table-color);\n  font-family: var(--text-heading-table-font-family);\n  font-size: var(--text-heading-table-font-size);\n  font-style: var(--text-heading-table-font-style);\n  font-weight: var(--text-heading-table-font-weight);\n  line-height: var(--text-heading-table-line-height);\n}\n\n._clickableHeaderContent_1biar_202 {\n  display: flex;\n  height: 28px;\n  align-items: center;\n  gap: var(--sizes-xs);\n  white-space: nowrap;\n  color: var(--text-heading-table-color);\n  font-family: var(--text-heading-table-font-family);\n  font-size: var(--text-heading-table-font-size);\n  font-style: var(--text-heading-table-font-style);\n  font-weight: var(--text-heading-table-font-weight);\n  line-height: var(--text-heading-table-line-height);\n  appearance: none;\n  padding: 0;\n  border: 0;\n  border-radius: var(--radius-base);\n  background-color: transparent;\n}\n._clickableHeaderContent_1biar_202:not(:disabled):hover {\n  cursor: pointer;\n}\n._clickableHeaderContent_1biar_202:hover ._sortIndicator_1biar_178 {\n  background-color: var(--colors-neutral-grey-light);\n  color: var(--colors-neutral-ink-base);\n}\n._clickableHeaderContent_1biar_202:focus-visible {\n  outline: 0;\n  box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n}\n\n/* ColumnDivider ResizerBar */\n._resizerBar_1biar_233 {\n  position: absolute;\n  right: 0;\n  top: 37.5%;\n  width: 1px;\n  background: var(--colors-neutral-grey-dark);\n  min-height: 25%;\n  cursor: col-resize;\n  user-select: none;\n}\n._resizerBar_1biar_233::before {\n  content: \"\";\n  position: absolute;\n  top: -150%;\n  left: 0;\n  width: 12px;\n  min-height: 400%;\n  z-index: 1;\n  transform: translateX(-6px);\n}\n\n/* ActionBar */\n._actionBarContainer_1biar_255 {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  align-items: center;\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  z-index: 50;\n  height: 56px;\n  background-color: white;\n}\n\n._actionBarContent_1biar_268 {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  padding: 0 var(--sizes-sm);\n  border-bottom: 1px solid var(--colors-neutral-grey-base);\n}\n._actionBarContent_1biar_268 > * {\n  flex: 1;\n}");
-var styles = {"scrollContainer":"_scrollContainer_1biar_3","noWrap":"_noWrap_1biar_11","truncate":"_truncate_1biar_16","loadingCellContent":"_loadingCellContent_1biar_23","emptyBodyContent":"_emptyBodyContent_1biar_47","emptyBodyGlyphWrapper":"_emptyBodyGlyphWrapper_1biar_58","cell":"_cell_1biar_65","header":"_header_1biar_89","row":"_row_1biar_104","rowSelected":"_rowSelected_1biar_108","rowAccentColor":"_rowAccentColor_1biar_112","wrapper":"_wrapper_1biar_127","borderFull":"_borderFull_1biar_147","borderVertical":"_borderVertical_1biar_152","borderNone":"_borderNone_1biar_158","tableGrid":"_tableGrid_1biar_163","sortIndicator":"_sortIndicator_1biar_178","headerContent":"_headerContent_1biar_188","clickableHeaderContent":"_clickableHeaderContent_1biar_202","resizerBar":"_resizerBar_1biar_233","actionBarContainer":"_actionBarContainer_1biar_255","actionBarContent":"_actionBarContent_1biar_268"};
+insertStyle("/* DataTable sub-component styles */\n/* ScrollContainer */\n._scrollContainer_cvv55_3 {\n  position: relative;\n  width: 100%;\n  overflow-x: auto;\n  overflow-y: hidden;\n}\n\n/* NoWrap */\n._noWrap_cvv55_11 {\n  white-space: nowrap;\n}\n\n/* Truncate */\n._truncate_cvv55_16 {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* LoadingCellContent */\n._loadingCellContent_cvv55_23 {\n  height: 20px;\n  width: 75%;\n  border-radius: var(--radius-base);\n  background: var(--colors-neutral-grey-base);\n  background-image: linear-gradient(to right, var(--colors-neutral-grey-base) 0%, var(--colors-neutral-grey-dark) 20%, var(--colors-neutral-grey-base) 40%, var(--colors-neutral-grey-base) 100%);\n  background-repeat: no-repeat;\n  background-size: 800px 104px;\n  animation-duration: 1s;\n  animation-fill-mode: forwards;\n  animation-iteration-count: infinite;\n  animation-name: _placeholderShimmer_cvv55_1;\n  animation-timing-function: linear;\n}\n\n@keyframes _placeholderShimmer_cvv55_1 {\n  0% {\n    background-position: -468px 0;\n  }\n  100% {\n    background-position: 468px 0;\n  }\n}\n/* EmptyBodyContent */\n._emptyBodyContent_cvv55_47 {\n  padding-top: var(--sizes-lg);\n  padding-bottom: var(--sizes-lg);\n  grid-column: 1/span var(--column-span);\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: var(--sizes-md);\n}\n\n._emptyBodyGlyphWrapper_cvv55_58 {\n  padding: var(--sizes-md);\n  background-color: var(--colors-neutral-grey-light);\n  border-radius: var(--radius-full);\n}\n\n/* Cell */\n._cell_cvv55_65 {\n  display: flex;\n  align-items: center;\n  justify-content: var(--cell-align, flex-start);\n  background-color: white;\n  padding-bottom: var(--density);\n  padding-top: var(--density);\n  padding-left: var(--cell-spacing, var(--sizes-3));\n  padding-right: var(--cell-spacing, var(--sizes-3));\n  color: var(--text-body-small-color);\n  font-family: var(--text-body-small-font-family);\n  font-size: var(--text-body-small-font-size);\n  font-style: var(--text-body-small-font-style);\n  font-weight: var(--text-body-small-font-weight);\n  line-height: var(--text-body-small-line-height);\n  grid-column-end: span var(--cell-span, 1);\n}\ntfoot ._cell_cvv55_65 {\n  min-height: 56px;\n  border-top: 1px solid var(--colors-secondary-blue-base);\n  background-color: var(--colors-neutral-grey-lightest);\n}\n\n/* Header */\n._header_cvv55_89 {\n  height: 56px;\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: var(--cell-align, flex-start);\n  z-index: var(--header-z-index, 0);\n  background-color: white;\n  padding-left: var(--cell-spacing, var(--sizes-3));\n  padding-right: var(--cell-spacing, var(--sizes-3));\n  border-bottom: 1px solid var(--colors-neutral-grey-base);\n  grid-column-end: span var(--cell-span, 1);\n}\n\n/* Row */\n._row_cvv55_104 {\n  display: contents;\n}\n\n._rowSelected_cvv55_108 > td {\n  background-color: var(--colors-brand-blue-lightest);\n}\n\n._rowAccentColor_cvv55_112 > *:first-child {\n  position: relative;\n}\n\n._rowAccentColor_cvv55_112 > *:first-child::before {\n  content: \"\";\n  position: absolute;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  width: 4px;\n  background-color: var(--row-accent-color);\n}\n\n/* Wrapper */\n._wrapper_cvv55_127 {\n  width: 100%;\n  position: relative;\n  border-style: solid;\n  border-color: var(--colors-neutral-grey-dark);\n  /* stylelint-disable-next-line selector-pseudo-class-no-unknown */\n}\n._wrapper_cvv55_127, ._wrapper_cvv55_127 * {\n  box-sizing: border-box;\n}\n._wrapper_cvv55_127 .hideHeaderDetails th {\n  /* stylelint-disable-next-line selector-pseudo-class-no-unknown */\n}\n._wrapper_cvv55_127 .hideHeaderDetails th > * {\n  opacity: 0.1;\n}\n._wrapper_cvv55_127 .hideHeaderDetails th .th-divider {\n  opacity: 1;\n}\n\n._borderFull_cvv55_147 {\n  border-width: 1px;\n  border-radius: var(--radius-base);\n}\n\n._borderVertical_cvv55_152 {\n  border-width: 0;\n  border-top-width: 1px;\n  border-bottom-width: 1px;\n}\n\n._borderNone_cvv55_158 {\n  border-width: 0;\n}\n\n/* TableGrid */\n._tableGrid_cvv55_163 {\n  min-width: 100%;\n  width: max-content;\n  display: grid;\n  --density: var(--sizes-base);\n}\n._tableGrid_cvv55_163 thead, ._tableGrid_cvv55_163 tbody, ._tableGrid_cvv55_163 tfoot {\n  display: contents;\n}\n\n._tableGrid_cvv55_163._tableGrid_cvv55_163 tr:hover td {\n  /* No 1:1 theme token exists for this shade */\n  background-color: #f2f8fc;\n}\n\n/* ColumnHeader */\n._sortIndicator_cvv55_179 {\n  width: 20px;\n  height: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: white;\n  color: var(--colors-neutral-ink-lightest);\n}\n\n._headerContent_cvv55_189 {\n  display: flex;\n  height: 28px;\n  align-items: center;\n  gap: var(--sizes-xs);\n  white-space: nowrap;\n  color: var(--text-heading-table-color);\n  font-family: var(--text-heading-table-font-family);\n  font-size: var(--text-heading-table-font-size);\n  font-style: var(--text-heading-table-font-style);\n  font-weight: var(--text-heading-table-font-weight);\n  line-height: var(--text-heading-table-line-height);\n}\n\n._clickableHeaderContent_cvv55_203 {\n  display: flex;\n  height: 28px;\n  align-items: center;\n  gap: var(--sizes-xs);\n  white-space: nowrap;\n  color: var(--text-heading-table-color);\n  font-family: var(--text-heading-table-font-family);\n  font-size: var(--text-heading-table-font-size);\n  font-style: var(--text-heading-table-font-style);\n  font-weight: var(--text-heading-table-font-weight);\n  line-height: var(--text-heading-table-line-height);\n  appearance: none;\n  padding: 0;\n  border: 0;\n  border-radius: var(--radius-base);\n  background-color: transparent;\n}\n._clickableHeaderContent_cvv55_203:not(:disabled):hover {\n  cursor: pointer;\n}\n._clickableHeaderContent_cvv55_203:hover ._sortIndicator_cvv55_179 {\n  background-color: var(--colors-neutral-grey-light);\n  color: var(--colors-neutral-ink-base);\n}\n._clickableHeaderContent_cvv55_203:focus-visible {\n  outline: 0;\n  box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n}\n\n/* ColumnDivider ResizerBar */\n._resizerBar_cvv55_234 {\n  position: absolute;\n  right: 0;\n  top: 37.5%;\n  width: 1px;\n  background: var(--colors-neutral-grey-dark);\n  min-height: 25%;\n  cursor: col-resize;\n  user-select: none;\n}\n._resizerBar_cvv55_234::before {\n  content: \"\";\n  position: absolute;\n  top: -150%;\n  left: 0;\n  width: 12px;\n  min-height: 400%;\n  z-index: 1;\n  transform: translateX(-6px);\n}\n\n/* ActionBar */\n._actionBarContainer_cvv55_256 {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  align-items: center;\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  z-index: 50;\n  height: 56px;\n  background-color: white;\n}\n\n._actionBarContent_cvv55_269 {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  padding: 0 var(--sizes-sm);\n  border-bottom: 1px solid var(--colors-neutral-grey-base);\n}\n._actionBarContent_cvv55_269 > * {\n  flex: 1;\n}");
+var styles = {"scrollContainer":"_scrollContainer_cvv55_3","noWrap":"_noWrap_cvv55_11","truncate":"_truncate_cvv55_16","loadingCellContent":"_loadingCellContent_cvv55_23","emptyBodyContent":"_emptyBodyContent_cvv55_47","emptyBodyGlyphWrapper":"_emptyBodyGlyphWrapper_cvv55_58","cell":"_cell_cvv55_65","header":"_header_cvv55_89","row":"_row_cvv55_104","rowSelected":"_rowSelected_cvv55_108","rowAccentColor":"_rowAccentColor_cvv55_112","wrapper":"_wrapper_cvv55_127","borderFull":"_borderFull_cvv55_147","borderVertical":"_borderVertical_cvv55_152","borderNone":"_borderNone_cvv55_158","tableGrid":"_tableGrid_cvv55_163","sortIndicator":"_sortIndicator_cvv55_179","headerContent":"_headerContent_cvv55_189","clickableHeaderContent":"_clickableHeaderContent_cvv55_203","resizerBar":"_resizerBar_cvv55_234","actionBarContainer":"_actionBarContainer_cvv55_256","actionBarContent":"_actionBarContent_cvv55_269"};
 export { styles as default };
 //# sourceMappingURL=DataTable.module.scss.js.map

package/dist/components/DataTable/components/DataTable.module.scss.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DataTable.module.scss.js","sources":["../../../../src/components/DataTable/components/DataTable.module.scss"],"sourcesContent":["/* DataTable sub-component styles /\n\n/ ScrollContainer /\n.scrollContainer {\n position: relative;\n width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n/ NoWrap /\n.noWrap {\n white-space: nowrap;\n}\n\n/ Truncate /\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/ LoadingCellContent /\n.loadingCellContent {\n height: 20px;\n width: 75%;\n border-radius: var(--radius-base);\n\n background: var(--colors-neutral-grey-base);\n background-image: linear-gradient(\n to right,\n var(--colors-neutral-grey-base) 0%,\n var(--colors-neutral-grey-dark) 20%,\n var(--colors-neutral-grey-base) 40%,\n var(--colors-neutral-grey-base) 100%\n );\n background-repeat: no-repeat;\n background-size: 800px 104px;\n\n animation-duration: 1s;\n animation-fill-mode: forwards;\n animation-iteration-count: infinite;\n animation-name: placeholderShimmer;\n animation-timing-function: linear;\n}\n\n@keyframes placeholderShimmer {\n 0% {\n background-position: -468px 0;\n }\n\n 100% {\n background-position: 468px 0;\n }\n}\n\n/ EmptyBodyContent /\n.emptyBodyContent {\n padding-top: var(--sizes-lg);\n padding-bottom: var(--sizes-lg);\n grid-column: 1 / span var(--column-span);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--sizes-md);\n}\n\n.emptyBodyGlyphWrapper {\n padding: var(--sizes-md);\n background-color: var(--colors-neutral-grey-light);\n border-radius: var(--radius-full);\n}\n\n/ Cell /\n.cell {\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n\n background-color: white;\n padding-bottom: var(--density);\n padding-top: var(--density);\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n\n grid-column-end: span var(--cell-span, 1);\n\n tfoot & {\n min-height: 56px;\n border-top: 1px solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n }\n}\n\n/ Header /\n.header {\n height: 56px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n z-index: var(--header-z-index, 0);\n\n background-color: white;\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n grid-column-end: span var(--cell-span, 1);\n}\n\n/ Row /\n.row {\n display: contents;\n}\n\n.rowSelected > td {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n.rowAccentColor > :first-child {\n position: relative;\n}\n\n.rowAccentColor > :first-child::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: 4px;\n background-color: var(--row-accent-color);\n}\n\n/ Wrapper /\n.wrapper {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n\n &,\n & {\n box-sizing: border-box;\n }\n\n /* stylelint-disable-next-line selector-pseudo-class-no-unknown /\n :global(.hideHeaderDetails) th {\n > {\n opacity: 0.1;\n }\n\n /* stylelint-disable-next-line selector-pseudo-class-no-unknown /\n :global(.th-divider) {\n opacity: 1;\n }\n }\n}\n\n.borderFull {\n border-width: 1px;\n border-radius: var(--radius-base);\n}\n\n.borderVertical {\n border-width: 0;\n border-top-width: 1px;\n border-bottom-width: 1px;\n}\n\n.borderNone {\n border-width: 0;\n}\n\n/ TableGrid /\n.tableGrid {\n min-width: 100%;\n width: max-content;\n display: grid;\n\n & thead,\n & tbody,\n & tfoot {\n display: contents;\n }\n\n --density: var(--sizes-base);\n}\n\n.tableGrid.tableGrid tr:hover td {\n background-color: ~~var(--colors-brand-blue-lightest)~~;\n}\n\n/ ColumnHeader /\n.sortIndicator {\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n color: var(--colors-neutral-ink-lightest);\n}\n\n.headerContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n}\n\n.clickableHeaderContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n\n appearance: none;\n padding: 0;\n border: 0;\n border-radius: var(--radius-base);\n background-color: transparent;\n\n &:not(:disabled):hover {\n cursor: pointer;\n }\n\n &:hover .sortIndicator {\n background-color: var(--colors-neutral-grey-light);\n color: var(--colors-neutral-ink-base);\n }\n\n &:focus-visible {\n outline: 0;\n box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n }\n}\n\n/ ColumnDivider ResizerBar /\n.resizerBar {\n position: absolute;\n right: 0;\n top: 37.5%;\n width: 1px;\n background: var(--colors-neutral-grey-dark);\n min-height: 25%;\n cursor: col-resize;\n user-select: none;\n\n &::before {\n content: '';\n position: absolute;\n top: -150%;\n left: 0;\n width: 12px;\n min-height: 400%;\n z-index: 1;\n transform: translateX(-6px);\n }\n}\n\n/ ActionBar /\n.actionBarContainer {\n display: grid;\n grid-template-columns: auto 1fr;\n align-items: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 50;\n height: 56px;\n background-color: white;\n}\n\n.actionBarContent {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n padding: 0 var(--sizes-sm);\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n & > {\n flex: 1;\n }\n}\n"],"names":["___$insertStyle"],"mappings":";;AAEAA,WAAA,CAAA~~,u7NAAA~~;AACA,aAAA,CAAA,iBAAA,CAAA,0BAAA,CAAA,QAAA,CAAA,kBAAA,CAAA,UAAA,CAAA,oBAAA,CAAA,oBAAA,CAAA,8BAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,uBAAA,CAAA,iCAAA,CAAA,MAAA,CAAA,gBAAA,CAAA,QAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,gBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,wBAAA,CAAA,mCAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,oBAAA,CAAA,+BAAA,CAAA,kBAAA,CAAA,6BAAA;;;;"}
1	+ {"version":3,"file":"DataTable.module.scss.js","sources":["../../../../src/components/DataTable/components/DataTable.module.scss"],"sourcesContent":["/* DataTable sub-component styles /\n\n/ ScrollContainer /\n.scrollContainer {\n position: relative;\n width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n/ NoWrap /\n.noWrap {\n white-space: nowrap;\n}\n\n/ Truncate /\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/ LoadingCellContent /\n.loadingCellContent {\n height: 20px;\n width: 75%;\n border-radius: var(--radius-base);\n\n background: var(--colors-neutral-grey-base);\n background-image: linear-gradient(\n to right,\n var(--colors-neutral-grey-base) 0%,\n var(--colors-neutral-grey-dark) 20%,\n var(--colors-neutral-grey-base) 40%,\n var(--colors-neutral-grey-base) 100%\n );\n background-repeat: no-repeat;\n background-size: 800px 104px;\n\n animation-duration: 1s;\n animation-fill-mode: forwards;\n animation-iteration-count: infinite;\n animation-name: placeholderShimmer;\n animation-timing-function: linear;\n}\n\n@keyframes placeholderShimmer {\n 0% {\n background-position: -468px 0;\n }\n\n 100% {\n background-position: 468px 0;\n }\n}\n\n/ EmptyBodyContent /\n.emptyBodyContent {\n padding-top: var(--sizes-lg);\n padding-bottom: var(--sizes-lg);\n grid-column: 1 / span var(--column-span);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--sizes-md);\n}\n\n.emptyBodyGlyphWrapper {\n padding: var(--sizes-md);\n background-color: var(--colors-neutral-grey-light);\n border-radius: var(--radius-full);\n}\n\n/ Cell /\n.cell {\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n\n background-color: white;\n padding-bottom: var(--density);\n padding-top: var(--density);\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n\n grid-column-end: span var(--cell-span, 1);\n\n tfoot & {\n min-height: 56px;\n border-top: 1px solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n }\n}\n\n/ Header /\n.header {\n height: 56px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: var(--cell-align, flex-start);\n z-index: var(--header-z-index, 0);\n\n background-color: white;\n padding-left: var(--cell-spacing, var(--sizes-3));\n padding-right: var(--cell-spacing, var(--sizes-3));\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n grid-column-end: span var(--cell-span, 1);\n}\n\n/ Row /\n.row {\n display: contents;\n}\n\n.rowSelected > td {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n.rowAccentColor > :first-child {\n position: relative;\n}\n\n.rowAccentColor > :first-child::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: 4px;\n background-color: var(--row-accent-color);\n}\n\n/ Wrapper /\n.wrapper {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n\n &,\n & {\n box-sizing: border-box;\n }\n\n /* stylelint-disable-next-line selector-pseudo-class-no-unknown /\n :global(.hideHeaderDetails) th {\n > {\n opacity: 0.1;\n }\n\n /* stylelint-disable-next-line selector-pseudo-class-no-unknown /\n :global(.th-divider) {\n opacity: 1;\n }\n }\n}\n\n.borderFull {\n border-width: 1px;\n border-radius: var(--radius-base);\n}\n\n.borderVertical {\n border-width: 0;\n border-top-width: 1px;\n border-bottom-width: 1px;\n}\n\n.borderNone {\n border-width: 0;\n}\n\n/ TableGrid /\n.tableGrid {\n min-width: 100%;\n width: max-content;\n display: grid;\n\n & thead,\n & tbody,\n & tfoot {\n display: contents;\n }\n\n --density: var(--sizes-base);\n}\n\n.tableGrid.tableGrid tr:hover td {\n / No 1:1 theme token exists for this shade /\n background-color: #f2f8fc;\n}\n\n/ ColumnHeader /\n.sortIndicator {\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n color: var(--colors-neutral-ink-lightest);\n}\n\n.headerContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n}\n\n.clickableHeaderContent {\n display: flex;\n height: 28px;\n align-items: center;\n gap: var(--sizes-xs);\n white-space: nowrap;\n\n color: var(--text-heading-table-color);\n font-family: var(--text-heading-table-font-family);\n font-size: var(--text-heading-table-font-size);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n line-height: var(--text-heading-table-line-height);\n\n appearance: none;\n padding: 0;\n border: 0;\n border-radius: var(--radius-base);\n background-color: transparent;\n\n &:not(:disabled):hover {\n cursor: pointer;\n }\n\n &:hover .sortIndicator {\n background-color: var(--colors-neutral-grey-light);\n color: var(--colors-neutral-ink-base);\n }\n\n &:focus-visible {\n outline: 0;\n box-shadow: 0px 0px 0px 2px var(--colors-secondary-blue-light);\n }\n}\n\n/ ColumnDivider ResizerBar /\n.resizerBar {\n position: absolute;\n right: 0;\n top: 37.5%;\n width: 1px;\n background: var(--colors-neutral-grey-dark);\n min-height: 25%;\n cursor: col-resize;\n user-select: none;\n\n &::before {\n content: '';\n position: absolute;\n top: -150%;\n left: 0;\n width: 12px;\n min-height: 400%;\n z-index: 1;\n transform: translateX(-6px);\n }\n}\n\n/ ActionBar /\n.actionBarContainer {\n display: grid;\n grid-template-columns: auto 1fr;\n align-items: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 50;\n height: 56px;\n background-color: white;\n}\n\n.actionBarContent {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n padding: 0 var(--sizes-sm);\n border-bottom: 1px solid var(--colors-neutral-grey-base);\n\n & > {\n flex: 1;\n }\n}\n"],"names":["___$insertStyle"],"mappings":";;AAEAA,WAAA,CAAA,+8NAAA;AACA,aAAA,CAAA,iBAAA,CAAA,0BAAA,CAAA,QAAA,CAAA,kBAAA,CAAA,UAAA,CAAA,oBAAA,CAAA,oBAAA,CAAA,8BAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,uBAAA,CAAA,iCAAA,CAAA,MAAA,CAAA,gBAAA,CAAA,QAAA,CAAA,kBAAA,CAAA,KAAA,CAAA,gBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,wBAAA,CAAA,mCAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,oBAAA,CAAA,+BAAA,CAAA,kBAAA,CAAA,6BAAA;;;;"}

package/dist/components/DataTable/components/EmptyBodyContent.cjs CHANGED Viewed

@@ -10,7 +10,10 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
-const EmptyBodyContent = React__default.default.forwardRef(({ columnCount, className, children, ...rest }, ref) => (React__default.default.createElement("div", { ref: ref, className: buildClassnames.buildClassnames([DataTable_module.emptyBodyContent, className]), style: assignCssVars.assignCssVars({ columnSpan: columnCount }), ...rest }, children)));
+const EmptyBodyContent = React__default.default.forwardRef(({ columnCount, className, children, style, ...rest }, ref) => (React__default.default.createElement("div", { ref: ref, className: buildClassnames.buildClassnames([DataTable_module.emptyBodyContent, className]), style: {
+        ...assignCssVars.assignCssVars({ columnSpan: columnCount }),
+        ...style,
+    }, ...rest }, children)));
 EmptyBodyContent.displayName = 'EmptyBodyContent';
 const EmptyBodyGlyphWrapper = React__default.default.forwardRef(({ className, children, ...rest }, ref) => (React__default.default.createElement("div", { ref: ref, className: buildClassnames.buildClassnames([DataTable_module.emptyBodyGlyphWrapper, className]), ...rest }, children)));
 EmptyBodyGlyphWrapper.displayName = 'EmptyBodyGlyphWrapper';

package/dist/components/DataTable/components/EmptyBodyContent.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmptyBodyContent.cjs","sources":["../../../../src/components/DataTable/components/EmptyBodyContent.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames, assignCssVars } from '../../../utils';\nimport styles from './DataTable.module.scss';\n\nexport interface EmptyBodyContentProps extends React.HTMLAttributes<HTMLDivElement> {\n columnCount: number;\n children?: React.ReactNode;\n className?: string;\n}\n\nexport const EmptyBodyContent = React.forwardRef<HTMLDivElement, EmptyBodyContentProps>(\n ({ columnCount, className, children, ...rest }, ref) => (\n <div\n ref={ref}\n className={buildClassnames([styles.emptyBodyContent, className])}\n style={assignCssVars({ columnSpan: columnCount })}\n {...rest}\n >\n {children}\n </div>\n ),\n);\n\nEmptyBodyContent.displayName = 'EmptyBodyContent';\n\nexport interface EmptyBodyGlyphWrapperProps extends React.HTMLAttributes<HTMLDivElement> {\n children?: React.ReactNode;\n className?: string;\n}\n\nexport const EmptyBodyGlyphWrapper = React.forwardRef<HTMLDivElement, EmptyBodyGlyphWrapperProps>(\n ({ className, children, ...rest }, ref) => (\n <div ref={ref} className={buildClassnames([styles.emptyBodyGlyphWrapper, className])} {...rest}>\n {children}\n </div>\n ),\n);\n\nEmptyBodyGlyphWrapper.displayName = 'EmptyBodyGlyphWrapper';\n"],"names":["React","buildClassnames","styles","assignCssVars"],"mappings":";;;;;;;;;;;;~~AAUO~~,~~MAAM,~~gBAAgB,GAAGA,sBAAK,CAAC,UAAU,CAC9C,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,~~MACjDA~~,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAEC,+BAAe,CAAC,CAACC,gBAAM,CAAC,gBAAgB,EAAE,SAAS,CAAC,CAAC,EAChE,KAAK,~~EAAEC~~,2BAAa,CAAC,EAAE,UAAU,EAAE,WAAW,EAAE,CAAC,EAAA,~~GAC7C~~,IAAI,EAAA,EAEP,QAAQ,CACL,CACP;AAGH,gBAAgB,CAAC,WAAW,GAAG,kBAAkB;MAOpC,qBAAqB,GAAGH,sBAAK,CAAC,UAAU,CACnD,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,MACpCA,8CAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAEC,+BAAe,CAAC,CAACC,gBAAM,CAAC,qBAAqB,EAAE,SAAS,CAAC,CAAC,EAAA,GAAM,IAAI,IAC3F,QAAQ,CACL,CACP;AAGH,qBAAqB,CAAC,WAAW,GAAG,uBAAuB;;;;;"}
1	+ {"version":3,"file":"EmptyBodyContent.cjs","sources":["../../../../src/components/DataTable/components/EmptyBodyContent.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames, assignCssVars } from '../../../utils';\nimport styles from './DataTable.module.scss';\n\nexport interface EmptyBodyContentProps extends React.HTMLAttributes<HTMLDivElement> {\n columnCount: number;\n children?: React.ReactNode;\n className?: string;\n}\n\nexport const EmptyBodyContent = React.forwardRef<HTMLDivElement, EmptyBodyContentProps>(\n ({ columnCount, className, children, style, ...rest }, ref) => (\n <div\n ref={ref}\n className={buildClassnames([styles.emptyBodyContent, className])}\n style={{\n ...assignCssVars({ columnSpan: columnCount }),\n ...style,\n }}\n {...rest}\n >\n {children}\n </div>\n ),\n);\n\nEmptyBodyContent.displayName = 'EmptyBodyContent';\n\nexport interface EmptyBodyGlyphWrapperProps extends React.HTMLAttributes<HTMLDivElement> {\n children?: React.ReactNode;\n className?: string;\n}\n\nexport const EmptyBodyGlyphWrapper = React.forwardRef<HTMLDivElement, EmptyBodyGlyphWrapperProps>(\n ({ className, children, ...rest }, ref) => (\n <div ref={ref} className={buildClassnames([styles.emptyBodyGlyphWrapper, className])} {...rest}>\n {children}\n </div>\n ),\n);\n\nEmptyBodyGlyphWrapper.displayName = 'EmptyBodyGlyphWrapper';\n"],"names":["React","buildClassnames","styles","assignCssVars"],"mappings":";;;;;;;;;;;;MAUa,gBAAgB,GAAGA,sBAAK,CAAC,UAAU,CAC9C,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,MACxDA,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAEC,+BAAe,CAAC,CAACC,gBAAM,CAAC,gBAAgB,EAAE,SAAS,CAAC,CAAC,EAChE,KAAK,EAAE;AACL,QAAA,GAAGC,2BAAa,CAAC,EAAE,UAAU,EAAE,WAAW,EAAE,CAAC;AAC7C,QAAA,GAAG,KAAK;AACT,KAAA,EAAA,GACG,IAAI,EAAA,EAEP,QAAQ,CACL,CACP;AAGH,gBAAgB,CAAC,WAAW,GAAG,kBAAkB;MAOpC,qBAAqB,GAAGH,sBAAK,CAAC,UAAU,CACnD,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,MACpCA,8CAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAEC,+BAAe,CAAC,CAACC,gBAAM,CAAC,qBAAqB,EAAE,SAAS,CAAC,CAAC,EAAA,GAAM,IAAI,IAC3F,QAAQ,CACL,CACP;AAGH,qBAAqB,CAAC,WAAW,GAAG,uBAAuB;;;;;"}

package/dist/components/DataTable/components/EmptyBodyContent.js CHANGED Viewed

@@ -4,7 +4,10 @@ import 'uid/secure';
 import { assignCssVars } from '../../../utils/assignCssVars.js';
 import styles from './DataTable.module.scss.js';
-const EmptyBodyContent = React__default.forwardRef(({ columnCount, className, children, ...rest }, ref) => (React__default.createElement("div", { ref: ref, className: buildClassnames([styles.emptyBodyContent, className]), style: assignCssVars({ columnSpan: columnCount }), ...rest }, children)));
+const EmptyBodyContent = React__default.forwardRef(({ columnCount, className, children, style, ...rest }, ref) => (React__default.createElement("div", { ref: ref, className: buildClassnames([styles.emptyBodyContent, className]), style: {
+        ...assignCssVars({ columnSpan: columnCount }),
+        ...style,
+    }, ...rest }, children)));
 EmptyBodyContent.displayName = 'EmptyBodyContent';
 const EmptyBodyGlyphWrapper = React__default.forwardRef(({ className, children, ...rest }, ref) => (React__default.createElement("div", { ref: ref, className: buildClassnames([styles.emptyBodyGlyphWrapper, className]), ...rest }, children)));
 EmptyBodyGlyphWrapper.displayName = 'EmptyBodyGlyphWrapper';

package/dist/components/DataTable/components/EmptyBodyContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmptyBodyContent.js","sources":["../../../../src/components/DataTable/components/EmptyBodyContent.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames, assignCssVars } from '../../../utils';\nimport styles from './DataTable.module.scss';\n\nexport interface EmptyBodyContentProps extends React.HTMLAttributes<HTMLDivElement> {\n columnCount: number;\n children?: React.ReactNode;\n className?: string;\n}\n\nexport const EmptyBodyContent = React.forwardRef<HTMLDivElement, EmptyBodyContentProps>(\n ({ columnCount, className, children, ...rest }, ref) => (\n <div\n ref={ref}\n className={buildClassnames([styles.emptyBodyContent, className])}\n style={assignCssVars({ columnSpan: columnCount })}\n {...rest}\n >\n {children}\n </div>\n ),\n);\n\nEmptyBodyContent.displayName = 'EmptyBodyContent';\n\nexport interface EmptyBodyGlyphWrapperProps extends React.HTMLAttributes<HTMLDivElement> {\n children?: React.ReactNode;\n className?: string;\n}\n\nexport const EmptyBodyGlyphWrapper = React.forwardRef<HTMLDivElement, EmptyBodyGlyphWrapperProps>(\n ({ className, children, ...rest }, ref) => (\n <div ref={ref} className={buildClassnames([styles.emptyBodyGlyphWrapper, className])} {...rest}>\n {children}\n </div>\n ),\n);\n\nEmptyBodyGlyphWrapper.displayName = 'EmptyBodyGlyphWrapper';\n"],"names":["React"],"mappings":";;;;;;~~AAUO~~,~~MAAM,~~gBAAgB,GAAGA,cAAK,CAAC,UAAU,CAC9C,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,~~MACjDA~~,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,gBAAgB,EAAE,SAAS,CAAC,CAAC,EAChE,KAAK,EAAE,aAAa,CAAC,EAAE,UAAU,EAAE,WAAW,EAAE,CAAC,EAAA,~~GAC7C~~,IAAI,EAAA,EAEP,QAAQ,CACL,CACP;AAGH,gBAAgB,CAAC,WAAW,GAAG,kBAAkB;MAOpC,qBAAqB,GAAGA,cAAK,CAAC,UAAU,CACnD,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,MACpCA,sCAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,qBAAqB,EAAE,SAAS,CAAC,CAAC,EAAA,GAAM,IAAI,IAC3F,QAAQ,CACL,CACP;AAGH,qBAAqB,CAAC,WAAW,GAAG,uBAAuB;;;;"}
1	+ {"version":3,"file":"EmptyBodyContent.js","sources":["../../../../src/components/DataTable/components/EmptyBodyContent.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames, assignCssVars } from '../../../utils';\nimport styles from './DataTable.module.scss';\n\nexport interface EmptyBodyContentProps extends React.HTMLAttributes<HTMLDivElement> {\n columnCount: number;\n children?: React.ReactNode;\n className?: string;\n}\n\nexport const EmptyBodyContent = React.forwardRef<HTMLDivElement, EmptyBodyContentProps>(\n ({ columnCount, className, children, style, ...rest }, ref) => (\n <div\n ref={ref}\n className={buildClassnames([styles.emptyBodyContent, className])}\n style={{\n ...assignCssVars({ columnSpan: columnCount }),\n ...style,\n }}\n {...rest}\n >\n {children}\n </div>\n ),\n);\n\nEmptyBodyContent.displayName = 'EmptyBodyContent';\n\nexport interface EmptyBodyGlyphWrapperProps extends React.HTMLAttributes<HTMLDivElement> {\n children?: React.ReactNode;\n className?: string;\n}\n\nexport const EmptyBodyGlyphWrapper = React.forwardRef<HTMLDivElement, EmptyBodyGlyphWrapperProps>(\n ({ className, children, ...rest }, ref) => (\n <div ref={ref} className={buildClassnames([styles.emptyBodyGlyphWrapper, className])} {...rest}>\n {children}\n </div>\n ),\n);\n\nEmptyBodyGlyphWrapper.displayName = 'EmptyBodyGlyphWrapper';\n"],"names":["React"],"mappings":";;;;;;MAUa,gBAAgB,GAAGA,cAAK,CAAC,UAAU,CAC9C,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,MACxDA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,gBAAgB,EAAE,SAAS,CAAC,CAAC,EAChE,KAAK,EAAE;AACL,QAAA,GAAG,aAAa,CAAC,EAAE,UAAU,EAAE,WAAW,EAAE,CAAC;AAC7C,QAAA,GAAG,KAAK;AACT,KAAA,EAAA,GACG,IAAI,EAAA,EAEP,QAAQ,CACL,CACP;AAGH,gBAAgB,CAAC,WAAW,GAAG,kBAAkB;MAOpC,qBAAqB,GAAGA,cAAK,CAAC,UAAU,CACnD,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,MACpCA,sCAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,qBAAqB,EAAE,SAAS,CAAC,CAAC,EAAA,GAAM,IAAI,IAC3F,QAAQ,CACL,CACP;AAGH,qBAAqB,CAAC,WAAW,GAAG,uBAAuB;;;;"}

package/dist/components/DataTable/components/Header.cjs CHANGED Viewed

@@ -20,7 +20,7 @@ const Header = React__default.default.forwardRef(({ align = 'left', spacing = co
             cellAlign: alignmentToFlex.alignmentToFlex(align),
             cellSpacing: index.theme.sizes[spacing],
             cellSpan: span,
-            headerZIndex: zIndex,
+            'header-z-index': zIndex,
         }),
         ...style,
     }, ...rest }, children)));

package/dist/components/DataTable/components/Header.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Header.cjs","sources":["../../../../src/components/DataTable/components/Header.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames, assignCssVars } from '../../../utils';\nimport { theme } from '../../../theme';\nimport { HeaderProps } from '../types';\nimport { alignmentToFlex } from '../utils';\nimport { defaultCellSpacing } from '../constants';\nimport styles from './DataTable.module.scss';\n\nexport const Header = React.forwardRef<HTMLTableCellElement, HeaderProps>(\n ({ align = 'left', spacing = defaultCellSpacing, span = 1, zIndex = 0, className, children, style, ...rest }, ref) => (\n <th\n ref={ref}\n className={buildClassnames([styles.header, className])}\n style={{\n ...assignCssVars({\n cellAlign: alignmentToFlex(align),\n cellSpacing: theme.sizes[spacing],\n cellSpan: span,\n ~~headerZIndex~~: zIndex,\n }),\n ...style,\n }}\n {...rest}\n >\n {children}\n </th>\n ),\n);\n\nHeader.displayName = 'Header';\n"],"names":["React","defaultCellSpacing","buildClassnames","styles","assignCssVars","alignmentToFlex","theme"],"mappings":";;;;;;;;;;;;;;;;;AAQO,MAAM,MAAM,GAAGA,sBAAK,CAAC,UAAU,CACpC,CAAC,EAAE,KAAK,GAAG,MAAM,EAAE,OAAO,GAAGC,4BAAkB,EAAE,IAAI,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,MAC/GD,sBAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAEE,+BAAe,CAAC,CAACC,gBAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,EACtD,KAAK,EAAE;AACL,QAAA,GAAGC,2BAAa,CAAC;AACf,YAAA,SAAS,EAAEC,+BAAe,CAAC,KAAK,CAAC;AACjC,YAAA,WAAW,EAAEC,WAAK,CAAC,KAAK,CAAC,OAAO,CAAC;AACjC,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,~~YAAY~~,EAAE,MAAM;~~SACrB~~,CAAC;AACF,QAAA,GAAG,KAAK;AACT,KAAA,EAAA,GACG,IAAI,EAAA,EAEP,QAAQ,CACN,CACN;AAGH,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}
1	+ {"version":3,"file":"Header.cjs","sources":["../../../../src/components/DataTable/components/Header.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames, assignCssVars } from '../../../utils';\nimport { theme } from '../../../theme';\nimport { HeaderProps } from '../types';\nimport { alignmentToFlex } from '../utils';\nimport { defaultCellSpacing } from '../constants';\nimport styles from './DataTable.module.scss';\n\nexport const Header = React.forwardRef<HTMLTableCellElement, HeaderProps>(\n ({ align = 'left', spacing = defaultCellSpacing, span = 1, zIndex = 0, className, children, style, ...rest }, ref) => (\n <th\n ref={ref}\n className={buildClassnames([styles.header, className])}\n style={{\n ...assignCssVars({\n cellAlign: alignmentToFlex(align),\n cellSpacing: theme.sizes[spacing],\n cellSpan: span,\n 'header-z-index': zIndex,\n }),\n ...style,\n }}\n {...rest}\n >\n {children}\n </th>\n ),\n);\n\nHeader.displayName = 'Header';\n"],"names":["React","defaultCellSpacing","buildClassnames","styles","assignCssVars","alignmentToFlex","theme"],"mappings":";;;;;;;;;;;;;;;;;AAQO,MAAM,MAAM,GAAGA,sBAAK,CAAC,UAAU,CACpC,CAAC,EAAE,KAAK,GAAG,MAAM,EAAE,OAAO,GAAGC,4BAAkB,EAAE,IAAI,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,MAC/GD,sBAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAEE,+BAAe,CAAC,CAACC,gBAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,EACtD,KAAK,EAAE;AACL,QAAA,GAAGC,2BAAa,CAAC;AACf,YAAA,SAAS,EAAEC,+BAAe,CAAC,KAAK,CAAC;AACjC,YAAA,WAAW,EAAEC,WAAK,CAAC,KAAK,CAAC,OAAO,CAAC;AACjC,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,gBAAgB,EAAE,MAAM;SACzB,CAAC;AACF,QAAA,GAAG,KAAK;AACT,KAAA,EAAA,GACG,IAAI,EAAA,EAEP,QAAQ,CACN,CACN;AAGH,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}

package/dist/components/DataTable/components/Header.js CHANGED Viewed

@@ -14,7 +14,7 @@ const Header = React__default.forwardRef(({ align = 'left', spacing = defaultCel
             cellAlign: alignmentToFlex(align),
             cellSpacing: theme.sizes[spacing],
             cellSpan: span,
-            headerZIndex: zIndex,
+            'header-z-index': zIndex,
         }),
         ...style,
     }, ...rest }, children)));

package/dist/components/DataTable/components/Header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Header.js","sources":["../../../../src/components/DataTable/components/Header.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames, assignCssVars } from '../../../utils';\nimport { theme } from '../../../theme';\nimport { HeaderProps } from '../types';\nimport { alignmentToFlex } from '../utils';\nimport { defaultCellSpacing } from '../constants';\nimport styles from './DataTable.module.scss';\n\nexport const Header = React.forwardRef<HTMLTableCellElement, HeaderProps>(\n ({ align = 'left', spacing = defaultCellSpacing, span = 1, zIndex = 0, className, children, style, ...rest }, ref) => (\n <th\n ref={ref}\n className={buildClassnames([styles.header, className])}\n style={{\n ...assignCssVars({\n cellAlign: alignmentToFlex(align),\n cellSpacing: theme.sizes[spacing],\n cellSpan: span,\n ~~headerZIndex~~: zIndex,\n }),\n ...style,\n }}\n {...rest}\n >\n {children}\n </th>\n ),\n);\n\nHeader.displayName = 'Header';\n"],"names":["React"],"mappings":";;;;;;;;;;;AAQO,MAAM,MAAM,GAAGA,cAAK,CAAC,UAAU,CACpC,CAAC,EAAE,KAAK,GAAG,MAAM,EAAE,OAAO,GAAG,kBAAkB,EAAE,IAAI,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,MAC/GA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,EACtD,KAAK,EAAE;AACL,QAAA,GAAG,aAAa,CAAC;AACf,YAAA,SAAS,EAAE,eAAe,CAAC,KAAK,CAAC;AACjC,YAAA,WAAW,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC;AACjC,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,~~YAAY~~,EAAE,MAAM;~~SACrB~~,CAAC;AACF,QAAA,GAAG,KAAK;AACT,KAAA,EAAA,GACG,IAAI,EAAA,EAEP,QAAQ,CACN,CACN;AAGH,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}
1	+ {"version":3,"file":"Header.js","sources":["../../../../src/components/DataTable/components/Header.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames, assignCssVars } from '../../../utils';\nimport { theme } from '../../../theme';\nimport { HeaderProps } from '../types';\nimport { alignmentToFlex } from '../utils';\nimport { defaultCellSpacing } from '../constants';\nimport styles from './DataTable.module.scss';\n\nexport const Header = React.forwardRef<HTMLTableCellElement, HeaderProps>(\n ({ align = 'left', spacing = defaultCellSpacing, span = 1, zIndex = 0, className, children, style, ...rest }, ref) => (\n <th\n ref={ref}\n className={buildClassnames([styles.header, className])}\n style={{\n ...assignCssVars({\n cellAlign: alignmentToFlex(align),\n cellSpacing: theme.sizes[spacing],\n cellSpan: span,\n 'header-z-index': zIndex,\n }),\n ...style,\n }}\n {...rest}\n >\n {children}\n </th>\n ),\n);\n\nHeader.displayName = 'Header';\n"],"names":["React"],"mappings":";;;;;;;;;;;AAQO,MAAM,MAAM,GAAGA,cAAK,CAAC,UAAU,CACpC,CAAC,EAAE,KAAK,GAAG,MAAM,EAAE,OAAO,GAAG,kBAAkB,EAAE,IAAI,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,MAC/GA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,EACtD,KAAK,EAAE;AACL,QAAA,GAAG,aAAa,CAAC;AACf,YAAA,SAAS,EAAE,eAAe,CAAC,KAAK,CAAC;AACjC,YAAA,WAAW,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC;AACjC,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,gBAAgB,EAAE,MAAM;SACzB,CAAC;AACF,QAAA,GAAG,KAAK;AACT,KAAA,EAAA,GACG,IAAI,EAAA,EAEP,QAAQ,CACN,CACN;AAGH,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}

package/dist/components/DataTable/components/StickyHead.cjs CHANGED Viewed

@@ -125,18 +125,10 @@ function StickyHead({ children, intersectionTargetRef, containerRef, cellWidths,
         boxShadow: shadows.Shadows.base,
         top: `${stickyHeaderTop}px` || '0px',
     };
-    // Generate styles to sync sticky columns with "real" columns
-    const columnsCss = cellWidths
-        .map((width, index) => `
-    & th:nth-child(${index + 1}) {
-      width: ${width}px;
-    }
-  `)
-        .join('');
-    // Append to generated table styles
-    const allCss = tableCss + columnsCss;
+    // Generate rules to sync sticky columns with "real" columns
+    const columnRules = cellWidths.map((width, index) => `th:nth-child(${index + 1}) { width: ${width}px; }`);
     return (React__default.default.createElement("div", { style: containerStyle, ref: stickyContainerRef },
-        React__default.default.createElement(TableGrid.TableGrid, { css: allCss },
+        React__default.default.createElement(TableGrid.TableGrid, { tableCss: tableCss, extraRules: columnRules },
             React__default.default.createElement("thead", null, children))));
 }