diff --git a/packages/components/src/components/@shared/_kol-table-stateless-mixin.scss b/packages/components/src/components/@shared/_kol-table-stateless-mixin.scss
index 27b68b9920..da3029f070 100644
--- a/packages/components/src/components/@shared/_kol-table-stateless-mixin.scss
+++ b/packages/components/src/components/@shared/_kol-table-stateless-mixin.scss
@@ -68,6 +68,11 @@
}
}
+ tr.foot-spacer,
+ tr.head-spacer {
+ display: none;
+ }
+
.selection-header-cell {
width: 0;
}
diff --git a/packages/components/src/components/table-stateless/component.tsx b/packages/components/src/components/table-stateless/component.tsx
index 13172d8d07..a73da3a34b 100644
--- a/packages/components/src/components/table-stateless/component.tsx
+++ b/packages/components/src/components/table-stateless/component.tsx
@@ -657,19 +657,24 @@ export class KolTableStateless implements TableStatelessAPI {
);
}
- /**
- * Renders the table footer (`
`) using the provided footer data.
- * It maps over each row in the footer and renders it similarly to a body row.
- *
- * @returns {JSX.Element} - The rendered table footer or an empty string if no footer data is provided.
- */
- private renderFoot(): JSX.Element {
+
+ private renderSpacer(variant: 'foot' | 'head', cellDefs: KoliBriTableHeaderCell[][] | KoliBriTableCell[][]): JSX.Element {
+ const colspan = cellDefs?.[0].reduce((acc, row) => acc + (row.colSpan || 1), 0);
+
+ return (
+
+ |
+
+ );
+ }
+
+ private renderFoot(): JSX.Element[] | null {
if (!this.state._dataFoot || this.state._dataFoot.length === 0) {
- return '';
+ return null;
}
const rows: KoliBriTableCell[][] = this.createDataField(this.state._dataFoot, this.state._headerCells, true);
- return {rows.map(this.renderTableRow)};
+ return {[this.renderSpacer('foot', rows), rows.map(this.renderTableRow)]};
}
public render(): JSX.Element {
@@ -702,40 +707,43 @@ export class KolTableStateless implements TableStatelessAPI {
{Array.isArray(this.state._headerCells.horizontal) && (
- {this.state._headerCells.horizontal.map((cols, rowIndex) => (
-
- {this.state._selection && this.renderHeadingSelectionCell()}
- {cols.map((cell, colIndex) => {
- if (cell.asTd === true) {
- return (
- 0,
- }}
- colSpan={cell.colSpan}
- rowSpan={cell.rowSpan}
- style={{
- textAlign: cell.textAlign,
- width: cell.width,
- }}
- ref={
- typeof cell.render === 'function'
- ? (el) => {
- this.cellRender(cell, el);
- }
- : undefined
- }
- >
- {typeof cell.render !== 'function' ? cell.label : ''}
- |
- );
- } else {
- return this.renderHeadingCell(cell, rowIndex, colIndex);
- }
- })}
-
- ))}
+ {[
+ this.state._headerCells.horizontal.map((cols, rowIndex) => (
+
+ {this.state._selection && this.renderHeadingSelectionCell()}
+ {cols.map((cell, colIndex) => {
+ if (cell.asTd === true) {
+ return (
+ 0,
+ }}
+ colSpan={cell.colSpan}
+ rowSpan={cell.rowSpan}
+ style={{
+ textAlign: cell.textAlign,
+ width: cell.width,
+ }}
+ ref={
+ typeof cell.render === 'function'
+ ? (el) => {
+ this.cellRender(cell, el);
+ }
+ : undefined
+ }
+ >
+ {typeof cell.render !== 'function' ? cell.label : ''}
+ |
+ );
+ } else {
+ return this.renderHeadingCell(cell, rowIndex, colIndex);
+ }
+ })}
+
+ )),
+ this.renderSpacer('head', this.state._headerCells.horizontal),
+ ]}
)}
{dataField.map(this.renderTableRow)}
diff --git a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-handout-basic-firefox-linux.png b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-handout-basic-firefox-linux.png
index 9689ce20a2..182ab0f9e2 100644
Binary files a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-handout-basic-firefox-linux.png and b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-handout-basic-firefox-linux.png differ
diff --git a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-column-alignment-firefox-linux.png b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-column-alignment-firefox-linux.png
index d4fd740ac4..6189656a38 100644
Binary files a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-column-alignment-firefox-linux.png and b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-column-alignment-firefox-linux.png differ
diff --git a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-complex-headers-firefox-linux.png b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-complex-headers-firefox-linux.png
index d7de6f4ab8..59e64f9f4d 100644
Binary files a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-complex-headers-firefox-linux.png and b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-complex-headers-firefox-linux.png differ
diff --git a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-pagination-position-firefox-linux.png b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-pagination-position-firefox-linux.png
index 03957a0ffa..e7c9ce8c0d 100644
Binary files a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-pagination-position-firefox-linux.png and b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-pagination-position-firefox-linux.png differ
diff --git a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-sort-data-firefox-linux.png b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-sort-data-firefox-linux.png
index d48261dc0d..cca00d242b 100644
Binary files a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-sort-data-firefox-linux.png and b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-sort-data-firefox-linux.png differ
diff --git a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateful-with-selection-firefox-linux.png b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateful-with-selection-firefox-linux.png
index f8d08f514c..38230ed610 100644
Binary files a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateful-with-selection-firefox-linux.png and b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateful-with-selection-firefox-linux.png differ
diff --git a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateful-with-single-selection-firefox-linux.png b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateful-with-single-selection-firefox-linux.png
index ab6e173481..83caca3e31 100644
Binary files a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateful-with-single-selection-firefox-linux.png and b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateful-with-single-selection-firefox-linux.png differ
diff --git a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateless-firefox-linux.png b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateless-firefox-linux.png
index b3d5c841aa..f15cd8c4e8 100644
Binary files a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateless-firefox-linux.png and b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateless-firefox-linux.png differ
diff --git a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateless-with-selection-firefox-linux.png b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateless-with-selection-firefox-linux.png
index 21dcd76d06..9db93509b5 100644
Binary files a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateless-with-selection-firefox-linux.png and b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateless-with-selection-firefox-linux.png differ
diff --git a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateless-with-single-selection-firefox-linux.png b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateless-with-single-selection-firefox-linux.png
index e1a2e71bd0..3fdd8c4f92 100644
Binary files a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateless-with-single-selection-firefox-linux.png and b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-stateless-with-single-selection-firefox-linux.png differ
diff --git a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-with-footer-firefox-linux.png b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-with-footer-firefox-linux.png
index 36bda8b26e..52bfcf14cf 100644
Binary files a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-with-footer-firefox-linux.png and b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-with-footer-firefox-linux.png differ
diff --git a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-with-pagination-firefox-linux.png b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-with-pagination-firefox-linux.png
index bc89fcad10..b79311ffa0 100644
Binary files a/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-with-pagination-firefox-linux.png and b/packages/test-tag-name-transformer/snapshots/theme-default/snapshot-for-table-with-pagination-firefox-linux.png differ
diff --git a/packages/themes/bmf/snapshots/theme-bmf/snapshot-for-table-sort-data-firefox-linux.png b/packages/themes/bmf/snapshots/theme-bmf/snapshot-for-table-sort-data-firefox-linux.png
index 37e1234000..7a7b6cba17 100644
Binary files a/packages/themes/bmf/snapshots/theme-bmf/snapshot-for-table-sort-data-firefox-linux.png and b/packages/themes/bmf/snapshots/theme-bmf/snapshot-for-table-sort-data-firefox-linux.png differ
diff --git a/packages/themes/default/snapshots/theme-default/snapshot-for-handout-basic-firefox-linux.png b/packages/themes/default/snapshots/theme-default/snapshot-for-handout-basic-firefox-linux.png
index a8a6332b4e..182ab0f9e2 100644
Binary files a/packages/themes/default/snapshots/theme-default/snapshot-for-handout-basic-firefox-linux.png and b/packages/themes/default/snapshots/theme-default/snapshot-for-handout-basic-firefox-linux.png differ
diff --git a/packages/themes/default/snapshots/theme-default/snapshot-for-table-column-alignment-firefox-linux.png b/packages/themes/default/snapshots/theme-default/snapshot-for-table-column-alignment-firefox-linux.png
index d4fd740ac4..6189656a38 100644
Binary files a/packages/themes/default/snapshots/theme-default/snapshot-for-table-column-alignment-firefox-linux.png and b/packages/themes/default/snapshots/theme-default/snapshot-for-table-column-alignment-firefox-linux.png differ
diff --git a/packages/themes/default/snapshots/theme-default/snapshot-for-table-complex-headers-firefox-linux.png b/packages/themes/default/snapshots/theme-default/snapshot-for-table-complex-headers-firefox-linux.png
index d7de6f4ab8..59e64f9f4d 100644
Binary files a/packages/themes/default/snapshots/theme-default/snapshot-for-table-complex-headers-firefox-linux.png and b/packages/themes/default/snapshots/theme-default/snapshot-for-table-complex-headers-firefox-linux.png differ
diff --git a/packages/themes/default/snapshots/theme-default/snapshot-for-table-pagination-position-firefox-linux.png b/packages/themes/default/snapshots/theme-default/snapshot-for-table-pagination-position-firefox-linux.png
index d6b45a5830..e7c9ce8c0d 100644
Binary files a/packages/themes/default/snapshots/theme-default/snapshot-for-table-pagination-position-firefox-linux.png and b/packages/themes/default/snapshots/theme-default/snapshot-for-table-pagination-position-firefox-linux.png differ
diff --git a/packages/themes/default/snapshots/theme-default/snapshot-for-table-sort-data-firefox-linux.png b/packages/themes/default/snapshots/theme-default/snapshot-for-table-sort-data-firefox-linux.png
index d48261dc0d..cca00d242b 100644
Binary files a/packages/themes/default/snapshots/theme-default/snapshot-for-table-sort-data-firefox-linux.png and b/packages/themes/default/snapshots/theme-default/snapshot-for-table-sort-data-firefox-linux.png differ
diff --git a/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateful-with-selection-firefox-linux.png b/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateful-with-selection-firefox-linux.png
index 3a83c79fff..38230ed610 100644
Binary files a/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateful-with-selection-firefox-linux.png and b/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateful-with-selection-firefox-linux.png differ
diff --git a/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateful-with-single-selection-firefox-linux.png b/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateful-with-single-selection-firefox-linux.png
index a2fa24a9ef..83caca3e31 100644
Binary files a/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateful-with-single-selection-firefox-linux.png and b/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateful-with-single-selection-firefox-linux.png differ
diff --git a/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateless-firefox-linux.png b/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateless-firefox-linux.png
index b3d5c841aa..f15cd8c4e8 100644
Binary files a/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateless-firefox-linux.png and b/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateless-firefox-linux.png differ
diff --git a/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateless-with-selection-firefox-linux.png b/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateless-with-selection-firefox-linux.png
index 31fdec49ec..9db93509b5 100644
Binary files a/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateless-with-selection-firefox-linux.png and b/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateless-with-selection-firefox-linux.png differ
diff --git a/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateless-with-single-selection-firefox-linux.png b/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateless-with-single-selection-firefox-linux.png
index 366330d0e8..3fdd8c4f92 100644
Binary files a/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateless-with-single-selection-firefox-linux.png and b/packages/themes/default/snapshots/theme-default/snapshot-for-table-stateless-with-single-selection-firefox-linux.png differ
diff --git a/packages/themes/default/snapshots/theme-default/snapshot-for-table-with-footer-firefox-linux.png b/packages/themes/default/snapshots/theme-default/snapshot-for-table-with-footer-firefox-linux.png
index 36bda8b26e..52bfcf14cf 100644
Binary files a/packages/themes/default/snapshots/theme-default/snapshot-for-table-with-footer-firefox-linux.png and b/packages/themes/default/snapshots/theme-default/snapshot-for-table-with-footer-firefox-linux.png differ
diff --git a/packages/themes/default/snapshots/theme-default/snapshot-for-table-with-pagination-firefox-linux.png b/packages/themes/default/snapshots/theme-default/snapshot-for-table-with-pagination-firefox-linux.png
index 376c1bd998..b79311ffa0 100644
Binary files a/packages/themes/default/snapshots/theme-default/snapshot-for-table-with-pagination-firefox-linux.png and b/packages/themes/default/snapshots/theme-default/snapshot-for-table-with-pagination-firefox-linux.png differ
diff --git a/packages/themes/default/src/mixins/kol-table-stateless-wc.scss b/packages/themes/default/src/mixins/kol-table-stateless-wc.scss
index 310142488f..29bbc4b1df 100644
--- a/packages/themes/default/src/mixins/kol-table-stateless-wc.scss
+++ b/packages/themes/default/src/mixins/kol-table-stateless-wc.scss
@@ -51,8 +51,8 @@
}
table,
- table thead tr:last-child th,
- table thead tr:last-child td {
+ table thead tr:nth-last-child(2) th,
+ table thead tr:nth-last-child(2) td {
border-width: 0;
border-bottom-width: calc(var(--border-width) * 2);
border-style: solid;
@@ -75,7 +75,7 @@
align-items: center;
}
- tr:nth-child(even) {
+ table tbody tr:nth-child(even) {
background-color: var(--color-mute);
}
@@ -89,6 +89,17 @@
font-weight: 700;
}
+ tr.foot-spacer,
+ tr.head-spacer {
+ display: inherit;
+ height: rem(24);
+
+ td {
+ border: none;
+ padding: 0;
+ }
+ }
+
.input {
input {
&:hover {