<mat-toolbar class="simple-toolbar">
    <span>
        Example resizing
        <span *ngIf="table.isRendered">({{ table.source?.length }}x{{ table.displayedColumns.length }})</span>
    </span>
    <button
        mat-raised-button
        class="show-simple"
        (click)="showSample()"
    >
        show code sample
    </button>
</mat-toolbar>

<b>Default col width</b>
: 150px
<br />
<br />

<ngx-table-builder
    #table
    [exclude-keys]="['guid']"
    [row-height]="55"
    [source]="data"
    [vertical-border]="false"
    (schemaChanges)="updatedSchema($event)"
>
    <!--
       <ngx-options /> - declaration common options for columns

       Also you can customize your columns manually
       <ngx-column key="myKey" [resizable]="true">...</ngx-column>
    -->
    <ngx-options
        is-draggable
        [nowrap]="false"
    />

    <ngx-column
        important-template
        key="id"
        sticky
        width="80"
    />
</ngx-table-builder>
