[Dataspreadsheet]: Selection highlight has weird behavior

[AustinGitHub]

Package

Carbon for IBM Products

Description

https://github.com/carbon-design-system/ibm-products/assets/10100397/a7869bb1-ec8d-438c-8f6f-a11c0a45e385

This is different selection issue than the ones I've reported previously. Looks like there is some weird offset occurring here

Component(s) impacted

Data spreadsheets

Browser

Chrome

@carbon/ibm-products (previously @carbon/ibm-cloud-cognitive) version

2.42

Severity

Severity 3 = The problem is visible or noticeable to users but does not impede the usability or functionality. Affects minor functionality, has a workaround.

Product/offering

IBM

CodeSandbox or Stackblitz example

https://carbon-for-ibm-products.netlify.app/?path=/story/ibm-products-components-data-spreadsheet-dataspreadsheet--data-spreadsheet&globals=viewport:basic

Steps to reproduce the issue (if applicable)

https://carbon-for-ibm-products.netlify.app/?path=/story/ibm-products-components-data-spreadsheet-dataspreadsheet--data-spreadsheet&globals=viewport:basic

Release date (if applicable)

No response

Code of Conduct

• [X] I agree to follow this project's Code of Conduct
• [X] I checked the current issues for duplicate issues

[AustinGitHub]

Will take a look at this and try to fix if I can, I think this might be due to that -4 on the createCellSelectionArea.js and createActiveCellFn.js for one of the issues I noticed

[AustinGitHub]

 left: placementElement
      ? placementElement.getBoundingClientRect().left -
        bodyContainer.getBoundingClientRect().left
      : lowestColumnIndex === 0
      ? 0 + (defaultColumn.rowHeaderWidth - 4)
      : defaultColumn.width * lowestColumnIndex +
        (defaultColumn.rowHeaderWidth - 4), // calculate left value here if virtualized row is not in DOM, accounting for row header cell width (including borders)

This doesn't make sense because when it is in the 3rd condition defaultColumn.width * lowestColumnIndex assumes that the first column is the same width as the default but in this case it isn't. The Row Index column is 275px but the default is 150px

I think there are some more inconsistencies as well. Need to check

[AustinGitHub]

The more I take a look at the logic here, the less I understand the reasoning. @matthewgallo Are all the columns supposed to be the same width or can they be different widths? Because the logic written for the selection assumes they are all the same width but in all the stories listed Row Index is different width which throws off the computation being made.

Going to leave this one for now as I think issue is beyond scope of what we need for DataStage implementation of this and we'll just mark it as a known issue on our end. Thanks!

[matthewgallo]

Just adding that I only see this happening if you select a column, then scroll to select the row. If you don't scroll to select the row it works as expected.