Skip to content

fix(pivot-grid): prevent selector dimensions list from being clipped when scrolled - #17624

Merged
simeonoff merged 3 commits into
masterfrom
simeonoff/fix-17585-22.2.x
Sep 17, 2026
Merged

simeonoff merged 3 commits into
masterfrom
simeonoff/fix-17585-22.2.x

Conversation

@simeonoff

Copy link
Copy Markdown
Member

Closes #17585

Description

The pivot grid selector's dimensions/values list (.igx-pivot-data-selector__filter) did not have flex-shrink: 0 set on itself or on the inner igx-list. When the overall selector panel didn't have enough vertical space (e.g. larger row density, more checked dimensions, shorter grid), the flex column layout shrank the filter container below the height its content needs. Since the container also has overflow: hidden, this silently clipped the bottom of the scrollable list, cutting off the last item even when fully scrolled.

Added flex-shrink: 0 to .igx-pivot-data-selector__filter and its inner igx-list in projects/igniteui-angular/grids/pivot-grid/src/themes/_base.scss so the section keeps its natural min/max height and scrolls properly instead of being clipped.

Motivation / Context

Pivot grid selector dimensions list does not scroll to the end.

Type of Change (check all that apply):

  • Bug fix

Component(s) / Area(s) Affected:

Pivot Grid (selector dimensions/values list)

How Has This Been Tested?

  • Manual testing

Test Configuration:

  • Browser(s): Chrome

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟢 Approval recommended

The focused fix addresses the clipping issue; the remaining test suggestion is a minor nit.

Pull request overview

Fixes Pivot Grid selector list clipping by preventing the filter container and inner list from shrinking.

Changes:

  • Adds flex-shrink: 0 to the filter container.
  • Adds flex-shrink: 0 to the inner list.
File summaries
File Description
projects/igniteui-angular/grids/pivot-grid/src/themes/_base.scss Preserves the selector list’s usable height during flex layout.
Review details

Suppressed comments (1)

projects/igniteui-angular/grids/pivot-grid/src/themes/_base.scss:114

  • This fixes a user-visible scrolling regression, but the existing pivot-data-selector.spec.ts only checks which items render and does not cover a constrained selector/list being scrolled to its end. Please add a regression test that exercises the short-height case and verifies the last item is fully reachable, so a future flex-layout change cannot silently reintroduce this bug.
            flex-shrink: 0;
  • Files reviewed: 1/1 changed files
  • Comments generated: 0
  • Review effort level: Lite

💡 Add a code-review agent skill for context-aware, tailored reviews. Learn more in the docs.

@mddragnev mddragnev assigned igdmdimitrov and unassigned mddragnev Sep 16, 2026
@igdmdimitrov igdmdimitrov added ✅ status: verified Applies to PRs that have passed manual verification and removed ❌ status: awaiting-test PRs awaiting manual verification labels Sep 17, 2026
@simeonoff
simeonoff enabled auto-merge (squash) September 17, 2026 13:20
@simeonoff
simeonoff merged commit 3e5e9a4 into master Sep 17, 2026
6 of 7 checks passed
@simeonoff
simeonoff deleted the simeonoff/fix-17585-22.2.x branch September 17, 2026 13:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

grid: pivot ✨ themes version: 22.2.x ✅ status: verified Applies to PRs that have passed manual verification

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Pivot grid selector dimensions list does not scroll to the end

6 participants