Skip to content

LeaderboardChart interactive rows change row spacing #50129

Description

@dognose24

Impact

LeaderboardChart rows change spacing depending on whether a row is interactive. Widgets that drill down from clickable parent rows into non-clickable child rows visibly jump because the first-level rows have different layout metrics from the second-level rows.

This is currently visible in Premium Analytics drill-down widgets such as Locations, UTM Insights, and Clicks.

Steps to Reproduce

  1. Render LeaderboardChart with rows that include onClick.
  2. Click a row and replace the chart data with child rows that do not include onClick.
  3. Compare the row spacing before and after drill-down.

Actual

Rows with onClick are rendered as a button using .interactiveRow. That class reserves focus-ring space with padding: var(--focus-ring-width).

Rows without onClick are rendered as fragments and do not receive the same padding. This means interactive rows are slightly taller / more inset than non-interactive rows, so the list appears to shift when the chart switches between parent and child rows.

Expected

Whether a row is interactive should not change the row's layout metrics. Hover, focus, and pressed affordances should be visual-only and should not change row spacing.

Suggested Fix

Keep .interactiveRow layout-compatible with non-interactive rows by removing the layout padding and keeping the focus ring inset via outline styling, or otherwise ensure both interactive and non-interactive rows reserve identical space.

截圖 2026-07-02 凌晨3.33.38.png

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions