[Bug]: DataTable sort icons cause ugly wrapping

[hughess]

Describe the bug

Sometimes when clicking to sort columns in DataTable, sort icon will jump to next row. This shouldn't happen

Steps to Reproduce

See example: https://x.com/jmduke/status/1852148356161659062

Logs

No response

System Info

No response

Severity

annoyance

Additional Information, or Workarounds

A few ideas:

• Add small right gutter to all columns with enough space to put a smaller sort icon when sorted
• Alex Prejean's suggestion: What if there was a transparent graded color fill on the header cell with darker transitioning to lighter top to bottom to show descending order and inverse for ascending. Eye is quickly drawn to the column being sorted and you keep all the real estate in the column name cell
• Add the sort icon in a layer above the column header cell - when applied it appears with a semi-transparent background. If it overlaps the text, it will partially block the text but keep the cell size the same

Requirements:

• No default icon - only show when sort is applied (too cluttered otherwise)
• Eliminate cell shift/resizing
• Sort icon should never be on its own on a row

[archiewood]

I would vote for gutter here

[kwongz]

just for reference