Skip to content

SVG icons hidden unconditionally in DataTable headers due to overly broad CSS selector #7286

@MrChrisW

Description

@MrChrisW

Problem

SVG icons that are not related to sorting (e.g., custom IconButton components) are being hidden in table headers in DataTable because of an overly broad CSS rule, such as:

.Table th svg { visibility: hidden; }

This causes all SVGs in headers to be hidden by default, not just sort icons. This makes it impossible to display custom SVG icons or IconButton components in DataTable column headers.

Expected

  • Only sort icons (e.g., those with .TableSortIcon) should be hidden by default; arbitrary SVGs should be visible and usable in headers.

Actual

  • All SVG elements inside table headers are hidden, breaking custom header content.

Proposed fix

  • Update CSS rules so only sort icons are affected (e.g., .TableSortIcon { visibility: hidden; }) and do not hide all SVGs.

This breaks customization and is blocking use-cases such as column actions or indicators.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions