diff --git a/libs/docs/platform/table/examples/platform-table-responsive-columns-example.component.html b/libs/docs/platform/table/examples/platform-table-responsive-columns-example.component.html index 2f4e2ec66d4..c2b49fc9aa7 100644 --- a/libs/docs/platform/table/examples/platform-table-responsive-columns-example.component.html +++ b/libs/docs/platform/table/examples/platform-table-responsive-columns-example.component.html @@ -6,10 +6,12 @@ 0) { } @if (row.children.length === 0 && (row.childItemsLoading$ | async)) { diff --git a/libs/platform/table/table.component.scss b/libs/platform/table/table.component.scss index dbab8ad6969..b005f4b5894 100644 --- a/libs/platform/table/table.component.scss +++ b/libs/platform/table/table.component.scss @@ -499,6 +499,10 @@ fdk-dynamic-portal { white-space: nowrap !important; } } + + &:hover { + background-color: var(--sapList_Hover_Background); + } } .#{$block} { @@ -648,3 +652,7 @@ fdk-dynamic-portal { th.fd-table__cell .fd-table__inner { font-weight: 700; } + +.fd-tr-hovered { + background-color: var(--sapList_Hover_Background) !important; +} diff --git a/libs/platform/table/table.component.ts b/libs/platform/table/table.component.ts index a62cb2ae268..071b6b6ee67 100644 --- a/libs/platform/table/table.component.ts +++ b/libs/platform/table/table.component.ts @@ -611,6 +611,9 @@ export class TableComponent /** Total loaded items. */ loadedRows$ = signal(0); + /** @hidden */ + hoveredRowIndex$ = signal>(null); + /** @hidden */ get initialSortBy(): CollectionSort[] { return this.initialState?.initialSortBy ?? []; @@ -1710,6 +1713,16 @@ export class TableComponent }); } + /** @hidden */ + handleMouseEnter(rowIndex: number): void { + this.hoveredRowIndex$.set(rowIndex); + } + + /** @hidden */ + handleMouseLeave(): void { + this.hoveredRowIndex$.set(null); + } + /** Manually update index after we add new items to the main array */ private _reIndexTableRows(): void { this._tableRows.map((row, index) => (row.index = index));