bug(TABS): tabs with fitInkBarToContent does not follow Material 3 design specs

[shhdharmen]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

As per Material 3 guidelines, primary tabs should have active indicator's height of 3px and shape of 3px 3px 0 0. In Angular Material, primary tabs' behaviour can be achieved using [fitInkBarToContent]=true input.

But, they have height of 2px, and shape of 0, which is right only for secondary tabs.

We can override it by using tabs-overrides mixin like below:

@use '@angular/material' as mat;

[fitInkBarToContent],
[ng-reflect-fit-ink-bar-to-content='true'] {
  > .mat-mdc-tab-header {
    @include mat.tabs-overrides(
      (
        active-indicator-shape: 3px 3px 0 0,
        active-indicator-height: 3px,
      )
    );
  }
}

But, it should be the default behaviour as per Material 3 specs.

Reproduction

Not needed.

Expected Behavior

Tabs with [fitInkBarToContent]=true should have active indicator's height of 3px and shape of 3px 3px 0 0.

Actual Behavior

Tabs with [fitInkBarToContent]=true have active indicator's height of 2px, and shape of 0.

Environment

• Angular: 19
• CDK/Material: 19
• Browser(s): Edge
• Operating System (e.g. Windows, macOS, Ubuntu): Windows