Skip to content

Excel-style filter ignores --ig-size when minHeight/maxHeight are set (22.1 regression) #17589

Description

@Timmeeeey

Description

Since 22.1 the excel-style filtering menu renders with large-size padding (1rem) even when --ig-size is small, if minHeight or maxHeight is set on igx-grid-excel-style-filtering.

In 22.0 the sizable() mixin was applied to .igx-excel-filter__menu (_excel-filtering-component.scss), so the --is-small/--is-medium/--is-large variables were always available. In 22.1 (styles bundled into the component, #15125) sizable() is only included on .igx-excel-filter__sizing. That class is bound to shouldApplySizes, which is false as soon as minHeight or maxHeight is set. Without the --is-* variables every pad()-based padding falls back to var(--is-*, 1) and max(...) resolves to the large value.

Framework

Angular

Angular Version

22.1

Ignite UI for Angular Version

22.1.3

Component / Area

Grid

Browser

Edge

Operating System

Windows

Command Not Working

Steps to Reproduce

  1. Set --ig-size: var(--ig-size-small) (e.g. on :root).
  2. Use a grid with <igx-grid-excel-style-filtering [minHeight]="'350px'" [maxHeight]="'500px'">.
  3. Open the excel-style filter.

Actual Result

Header, main area and action rows use 1rem padding. --component-size on the menu is 1, but --is-small/--is-medium/--is-large are undefined.

Expected Result

Padding follows --ig-size as in 22.0 (4px for small).

Reproduction URL

No response

Attachments

No response

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions