The Angular Material Tooltip Module blocks scroll of <ion-segment>

Ionic Framework
1

Please describe the question in detail and share your code, configuration, and other relevant info.

Hi.
I’m using ionic framework with angular v11 and angular material.

My problem is quite simple.
I try to add a tooltip to my ion-segment-button so I used the Angular Material Tooltip (Angular Material UI component library) but it blocks the scroll of the segment.

does anyone had faced the issue before?

// This works
<ion-segment class="disable-zoom" (ionChange)="segmentChanged($event)" [value]="segmentIndex" id="menuSegment" mode="md"
             style="overflow-y: hidden" scrollable>
    <ion-segment-button value="0" id="menu_0" style="min-width: 55px">
        <ion-label>{{ 'face' | translate }}</ion-label>
.....


//But with matTooltip, scroll is not working
<ion-segment class="disable-zoom" (ionChange)="segmentChanged($event)" [value]="segmentIndex" id="menuSegment" mode="md"
             style="overflow-y: hidden" scrollable>
    <ion-segment-button value="0" id="menu_0" style="min-width: 55px" matTooltip={{'some tooltip text'}}>
        <ion-label>{{ 'face' | translate }}</ion-label>
.....