diff --git a/packages/main/src/components/AnalyticalTable/AnalyticalTable.module.css b/packages/main/src/components/AnalyticalTable/AnalyticalTable.module.css index db500e95828..38bd553390d 100644 --- a/packages/main/src/components/AnalyticalTable/AnalyticalTable.module.css +++ b/packages/main/src/components/AnalyticalTable/AnalyticalTable.module.css @@ -173,10 +173,6 @@ box-sizing: border-box; display: flex; - &:hover:not([data-empty-row]) { - background-color: var(--sapList_Hover_Background); - } - &[data-is-selected] { border-block-end: 1px solid var(--sapList_SelectionBorderColor); background-color: var(--sapList_SelectionBackgroundColor); @@ -187,8 +183,22 @@ } } +/* ObjectStatus deltas */ +[data-sap-theme^='sap_'][data-sap-theme$='_hcw'], +[data-sap-theme^='sap_'][data-sap-theme$='_hcb'] { + .tr[data-is-selected], + .trActive:hover { + & [data-component-name='ObjectStatus'][data-inverted='false']:not([data-state^='Indication']) { + color: var(--sapContent_ContrastTextColor); + } + } +} + .trActive { cursor: pointer; + &:hover:not([data-empty-row]) { + background-color: var(--sapList_Hover_Background); + } } .tableGroupHeader.tr { diff --git a/packages/main/src/components/AnalyticalTable/AnalyticalTable.stories.tsx b/packages/main/src/components/AnalyticalTable/AnalyticalTable.stories.tsx index 6228fa2d062..254b03aba9c 100644 --- a/packages/main/src/components/AnalyticalTable/AnalyticalTable.stories.tsx +++ b/packages/main/src/components/AnalyticalTable/AnalyticalTable.stories.tsx @@ -30,10 +30,11 @@ import { Select } from '../../webComponents/Select/index.js'; import { Tag } from '../../webComponents/Tag/index.js'; import { Text } from '../../webComponents/Text/index.js'; import { FlexBox } from '../FlexBox/index.js'; -import type { AnalyticalTableColumnDefinition } from './index.js'; +import { ObjectStatus } from '../ObjectStatus/index.js'; +import type { AnalyticalTableColumnDefinition, AnalyticalTablePropTypes } from './index.js'; import { AnalyticalTable } from './index.js'; -const kitchenSinkArgs = { +const kitchenSinkArgs: AnalyticalTablePropTypes = { data: dataLarge, columns: [ { @@ -91,6 +92,14 @@ const kitchenSinkArgs = { ); }, }, + { + Header: 'Status', + id: 'os', + Cell: (instance) => { + const state = instance.row.index % 2 === 0 ? 'Positive' : 'Negative'; + return {state}; + }, + }, { id: 'actions', Header: 'Actions', diff --git a/packages/main/src/components/ObjectStatus/index.tsx b/packages/main/src/components/ObjectStatus/index.tsx index bd48a2a24f3..2653b2f27ba 100644 --- a/packages/main/src/components/ObjectStatus/index.tsx +++ b/packages/main/src/components/ObjectStatus/index.tsx @@ -236,6 +236,9 @@ const ObjectStatus = forwardRef {!interactive && (