@prt-ts/fluent-react-table-v2 9.46.8-build.7.0 → 9.46.8-build.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.cjs.js +6 -6
- package/index.esm.js +6 -6
- package/package.json +1 -1
package/index.cjs.js
CHANGED
|
@@ -1532,7 +1532,7 @@ const useTableHeaderStyles = reactComponents.makeStyles({
|
|
|
1532
1532
|
tHeadRow: {
|
|
1533
1533
|
backgroundColor: reactComponents.tokens.colorNeutralCardBackgroundSelected,
|
|
1534
1534
|
},
|
|
1535
|
-
tHeadCell: Object.assign({ zIndex:
|
|
1535
|
+
tHeadCell: Object.assign({ zIndex: 9, position: 'relative', fontSize: reactComponents.tokens.fontSizeBase300, fontWeight: reactComponents.tokens.fontWeightBold, minWidth: '1rem' }, reactComponents.shorthands.padding('2px', '4px')),
|
|
1536
1536
|
tHeadNonLeafCell: Object.assign({}, reactComponents.shorthands.borderBottom(0)),
|
|
1537
1537
|
tHeadNonLeafCellFakeBorder: Object.assign({ width: '100%', height: '1px', position: "sticky", bottom: 0 }, reactComponents.shorthands.borderBottom('1px', 'solid', reactComponents.tokens.colorBrandBackgroundInverted)),
|
|
1538
1538
|
tHeadCellDraggable: {
|
|
@@ -1566,7 +1566,7 @@ const getHeaderCellPinningStyles = (column, isDragging, additionalStyles) => {
|
|
|
1566
1566
|
? '-4px 0 4px -4px gray inset'
|
|
1567
1567
|
: isFirstRightPinnedColumn
|
|
1568
1568
|
? '4px 0 4px -4px gray inset'
|
|
1569
|
-
: undefined, left: isPinned === 'left' ? `${column.getStart('left')}px` : undefined, right: isPinned === 'right' ? `${column.getAfter('right')}px` : undefined, opacity: isDragging ? 0.8 : (isPinned ? 0.95 : 1), position: isPinned ? 'sticky' : 'relative', zIndex: isDragging ?
|
|
1569
|
+
: undefined, left: isPinned === 'left' ? `${column.getStart('left')}px` : undefined, right: isPinned === 'right' ? `${column.getAfter('right')}px` : undefined, opacity: isDragging ? 0.8 : (isPinned ? 0.95 : 1), position: isPinned ? 'sticky' : 'relative', zIndex: isDragging ? 10 : (isPinned ? 9 : 1), backgroundColor: reactComponents.tokens.colorNeutralCardBackgroundSelected, whiteSpace: 'wrap' }, additionalStyles);
|
|
1570
1570
|
return styles;
|
|
1571
1571
|
};
|
|
1572
1572
|
const getBodyCellPinningStyles = (column, isDragging, additionalStyles) => {
|
|
@@ -1577,7 +1577,7 @@ const getBodyCellPinningStyles = (column, isDragging, additionalStyles) => {
|
|
|
1577
1577
|
? '-4px 0 4px -4px gray inset'
|
|
1578
1578
|
: isFirstRightPinnedColumn
|
|
1579
1579
|
? '4px 0 4px -4px gray inset'
|
|
1580
|
-
: undefined, left: isPinned === 'left' ? `${column.getStart('left')}px` : undefined, right: isPinned === 'right' ? `${column.getAfter('right')}px` : undefined, position: isPinned ? 'sticky' : 'relative', opacity: isDragging ? 0.85 : (isPinned ? 0.95 : 1), zIndex: isDragging ?
|
|
1580
|
+
: undefined, left: isPinned === 'left' ? `${column.getStart('left')}px` : undefined, right: isPinned === 'right' ? `${column.getAfter('right')}px` : undefined, position: isPinned ? 'sticky' : 'relative', opacity: isDragging ? 0.85 : (isPinned ? 0.95 : 1), zIndex: isDragging ? 2 : (isPinned ? 1 : 0) }, additionalStyles);
|
|
1581
1581
|
return styles;
|
|
1582
1582
|
};
|
|
1583
1583
|
|
|
@@ -1857,20 +1857,20 @@ function TableBody(props) {
|
|
|
1857
1857
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(reactControlFlow.Show, { when: (topRows === null || topRows === void 0 ? void 0 : topRows.length) > 0, children: jsxRuntime.jsx("thead", { style: {
|
|
1858
1858
|
position: "sticky",
|
|
1859
1859
|
top: 0,
|
|
1860
|
-
zIndex:
|
|
1860
|
+
zIndex: 9
|
|
1861
1861
|
}, children: jsxRuntime.jsx(reactControlFlow.For, { each: topRows, children: (row, index) => (jsxRuntime.jsx(PinnedRow, { row: row, rowSelectionMode: rowSelectionMode, bottomRowLength: bottomRows === null || bottomRows === void 0 ? void 0 : bottomRows.length }, row.id)) }) }) }), jsxRuntime.jsxs("tbody", { className: styles.tBody, children: [paddingTop > 0 && (jsxRuntime.jsx("tr", { className: styles.tBodyRow, "aria-hidden": true, children: jsxRuntime.jsx("td", { style: { height: `${paddingTop}px` } }) })), jsxRuntime.jsx(reactControlFlow.For, { each: virtualRows || [], children: (virtualRow) => {
|
|
1862
1862
|
const row = rows[virtualRow.index];
|
|
1863
1863
|
return (jsxRuntime.jsx(TableRow, { row: row, rowSelectionMode: rowSelectionMode }, row.id));
|
|
1864
1864
|
} }), paddingBottom > 0 && (jsxRuntime.jsx("tr", { className: styles.tBodyRow, "aria-hidden": true, children: jsxRuntime.jsx("td", { style: { height: `${paddingBottom}px` } }) }))] }), jsxRuntime.jsx(reactControlFlow.Show, { when: rowSelectionMode === 'multiple' && (rows === null || rows === void 0 ? void 0 : rows.length) > 0, children: jsxRuntime.jsx("tfoot", { style: {
|
|
1865
1865
|
position: "sticky",
|
|
1866
1866
|
bottom: 0,
|
|
1867
|
-
zIndex:
|
|
1867
|
+
zIndex: 9
|
|
1868
1868
|
}, children: jsxRuntime.jsxs("tr", { style: { backgroundColor: "white" }, children: [jsxRuntime.jsx("td", { className: "p-1", children: jsxRuntime.jsx(reactComponents.Checkbox, { checked: table.getIsSomePageRowsSelected()
|
|
1869
1869
|
? 'mixed'
|
|
1870
1870
|
: table.getIsAllPageRowsSelected(), onChange: table.getToggleAllPageRowsSelectedHandler(), "aria-label": "Select All Current Page Rows", title: 'Select All Current Page Rows' }) }), jsxRuntime.jsxs("td", { colSpan: 20, children: [table.getIsAllPageRowsSelected() ? 'Unselect' : 'Select', " All Current Page Rows (", table.getRowModel().rows.length, ")"] })] }) }) }), jsxRuntime.jsx(reactControlFlow.Show, { when: (bottomRows === null || bottomRows === void 0 ? void 0 : bottomRows.length) > 0, children: jsxRuntime.jsx("tfoot", { style: {
|
|
1871
1871
|
position: "sticky",
|
|
1872
1872
|
bottom: 0,
|
|
1873
|
-
zIndex:
|
|
1873
|
+
zIndex: 9
|
|
1874
1874
|
}, children: jsxRuntime.jsx(reactControlFlow.For, { each: bottomRows, children: (row) => (jsxRuntime.jsx(PinnedRow, { row: row, rowSelectionMode: rowSelectionMode, bottomRowLength: bottomRows === null || bottomRows === void 0 ? void 0 : bottomRows.length }, row.id)) }) }) })] }));
|
|
1875
1875
|
}
|
|
1876
1876
|
|
package/index.esm.js
CHANGED
|
@@ -1510,7 +1510,7 @@ const useTableHeaderStyles = makeStyles({
|
|
|
1510
1510
|
tHeadRow: {
|
|
1511
1511
|
backgroundColor: tokens.colorNeutralCardBackgroundSelected,
|
|
1512
1512
|
},
|
|
1513
|
-
tHeadCell: Object.assign({ zIndex:
|
|
1513
|
+
tHeadCell: Object.assign({ zIndex: 9, position: 'relative', fontSize: tokens.fontSizeBase300, fontWeight: tokens.fontWeightBold, minWidth: '1rem' }, shorthands.padding('2px', '4px')),
|
|
1514
1514
|
tHeadNonLeafCell: Object.assign({}, shorthands.borderBottom(0)),
|
|
1515
1515
|
tHeadNonLeafCellFakeBorder: Object.assign({ width: '100%', height: '1px', position: "sticky", bottom: 0 }, shorthands.borderBottom('1px', 'solid', tokens.colorBrandBackgroundInverted)),
|
|
1516
1516
|
tHeadCellDraggable: {
|
|
@@ -1544,7 +1544,7 @@ const getHeaderCellPinningStyles = (column, isDragging, additionalStyles) => {
|
|
|
1544
1544
|
? '-4px 0 4px -4px gray inset'
|
|
1545
1545
|
: isFirstRightPinnedColumn
|
|
1546
1546
|
? '4px 0 4px -4px gray inset'
|
|
1547
|
-
: undefined, left: isPinned === 'left' ? `${column.getStart('left')}px` : undefined, right: isPinned === 'right' ? `${column.getAfter('right')}px` : undefined, opacity: isDragging ? 0.8 : (isPinned ? 0.95 : 1), position: isPinned ? 'sticky' : 'relative', zIndex: isDragging ?
|
|
1547
|
+
: undefined, left: isPinned === 'left' ? `${column.getStart('left')}px` : undefined, right: isPinned === 'right' ? `${column.getAfter('right')}px` : undefined, opacity: isDragging ? 0.8 : (isPinned ? 0.95 : 1), position: isPinned ? 'sticky' : 'relative', zIndex: isDragging ? 10 : (isPinned ? 9 : 1), backgroundColor: tokens.colorNeutralCardBackgroundSelected, whiteSpace: 'wrap' }, additionalStyles);
|
|
1548
1548
|
return styles;
|
|
1549
1549
|
};
|
|
1550
1550
|
const getBodyCellPinningStyles = (column, isDragging, additionalStyles) => {
|
|
@@ -1555,7 +1555,7 @@ const getBodyCellPinningStyles = (column, isDragging, additionalStyles) => {
|
|
|
1555
1555
|
? '-4px 0 4px -4px gray inset'
|
|
1556
1556
|
: isFirstRightPinnedColumn
|
|
1557
1557
|
? '4px 0 4px -4px gray inset'
|
|
1558
|
-
: undefined, left: isPinned === 'left' ? `${column.getStart('left')}px` : undefined, right: isPinned === 'right' ? `${column.getAfter('right')}px` : undefined, position: isPinned ? 'sticky' : 'relative', opacity: isDragging ? 0.85 : (isPinned ? 0.95 : 1), zIndex: isDragging ?
|
|
1558
|
+
: undefined, left: isPinned === 'left' ? `${column.getStart('left')}px` : undefined, right: isPinned === 'right' ? `${column.getAfter('right')}px` : undefined, position: isPinned ? 'sticky' : 'relative', opacity: isDragging ? 0.85 : (isPinned ? 0.95 : 1), zIndex: isDragging ? 2 : (isPinned ? 1 : 0) }, additionalStyles);
|
|
1559
1559
|
return styles;
|
|
1560
1560
|
};
|
|
1561
1561
|
|
|
@@ -1835,20 +1835,20 @@ function TableBody(props) {
|
|
|
1835
1835
|
return (jsxs(Fragment, { children: [jsx(Show, { when: (topRows === null || topRows === void 0 ? void 0 : topRows.length) > 0, children: jsx("thead", { style: {
|
|
1836
1836
|
position: "sticky",
|
|
1837
1837
|
top: 0,
|
|
1838
|
-
zIndex:
|
|
1838
|
+
zIndex: 9
|
|
1839
1839
|
}, children: jsx(For, { each: topRows, children: (row, index) => (jsx(PinnedRow, { row: row, rowSelectionMode: rowSelectionMode, bottomRowLength: bottomRows === null || bottomRows === void 0 ? void 0 : bottomRows.length }, row.id)) }) }) }), jsxs("tbody", { className: styles.tBody, children: [paddingTop > 0 && (jsx("tr", { className: styles.tBodyRow, "aria-hidden": true, children: jsx("td", { style: { height: `${paddingTop}px` } }) })), jsx(For, { each: virtualRows || [], children: (virtualRow) => {
|
|
1840
1840
|
const row = rows[virtualRow.index];
|
|
1841
1841
|
return (jsx(TableRow, { row: row, rowSelectionMode: rowSelectionMode }, row.id));
|
|
1842
1842
|
} }), paddingBottom > 0 && (jsx("tr", { className: styles.tBodyRow, "aria-hidden": true, children: jsx("td", { style: { height: `${paddingBottom}px` } }) }))] }), jsx(Show, { when: rowSelectionMode === 'multiple' && (rows === null || rows === void 0 ? void 0 : rows.length) > 0, children: jsx("tfoot", { style: {
|
|
1843
1843
|
position: "sticky",
|
|
1844
1844
|
bottom: 0,
|
|
1845
|
-
zIndex:
|
|
1845
|
+
zIndex: 9
|
|
1846
1846
|
}, children: jsxs("tr", { style: { backgroundColor: "white" }, children: [jsx("td", { className: "p-1", children: jsx(Checkbox, { checked: table.getIsSomePageRowsSelected()
|
|
1847
1847
|
? 'mixed'
|
|
1848
1848
|
: table.getIsAllPageRowsSelected(), onChange: table.getToggleAllPageRowsSelectedHandler(), "aria-label": "Select All Current Page Rows", title: 'Select All Current Page Rows' }) }), jsxs("td", { colSpan: 20, children: [table.getIsAllPageRowsSelected() ? 'Unselect' : 'Select', " All Current Page Rows (", table.getRowModel().rows.length, ")"] })] }) }) }), jsx(Show, { when: (bottomRows === null || bottomRows === void 0 ? void 0 : bottomRows.length) > 0, children: jsx("tfoot", { style: {
|
|
1849
1849
|
position: "sticky",
|
|
1850
1850
|
bottom: 0,
|
|
1851
|
-
zIndex:
|
|
1851
|
+
zIndex: 9
|
|
1852
1852
|
}, children: jsx(For, { each: bottomRows, children: (row) => (jsx(PinnedRow, { row: row, rowSelectionMode: rowSelectionMode, bottomRowLength: bottomRows === null || bottomRows === void 0 ? void 0 : bottomRows.length }, row.id)) }) }) })] }));
|
|
1853
1853
|
}
|
|
1854
1854
|
|