igniteui-angular-sovn/src/lib/grids/toolbar/grid-toolbar-hiding.component.html

Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps

<ng-container *ngIf="grid.rendered$ | async">
    <button [title]="grid?.resourceStrings.igx_grid_toolbar_hiding_button_tooltip" #btn igxButton="outlined" type="button"
        name="btnColumnHiding" (click)="toggle(btn, ref, actions)" [displayDensity]="grid.displayDensity">
        <igx-icon>{{ !grid.hiddenColumnsCount ? 'visibility' : 'visibility_off' }}</igx-icon>
        <span>{{ grid.hiddenColumnsCount }}</span>
        <span>{{ buttonText }}</span>
    </button>
    <igx-column-actions #actions igxColumnHiding igxToggle (opened)="focusSearch(ref.element)" #ref="toggle"
        [grid]="grid" [title]="title || grid?.resourceStrings.igx_grid_toolbar_hiding_title"
        [filterColumnsPrompt]="prompt || grid?.resourceStrings.igx_grid_toolbar_actions_filter_prompt"
        [hideFilter]="hideFilter" [filterCriteria]="filterCriteria" [columnDisplayOrder]="columnDisplayOrder" [columnsAreaMaxHeight]="columnsAreaMaxHeight"
        [uncheckAllText]="uncheckAllText" [checkAllText]="checkAllText" [indentation]="indentetion">
    </igx-column-actions>
</ng-container>