dev@100: <div class="container">
dev@505:   <mat-list dense>
dev@423:     <ng-container
dev@100:       *ngFor="let extractor of extractors"
dev@100:     >
dev@505:       <h3 mat-subheader>{{extractor.name}}</h3>
dev@505:       <mat-list-item
dev@431:         *ngFor="let output of extractor.outputs"
dev@431:         (click)="extract(output)">
dev@505:         <mat-icon mat-list-icon>{{getFeatureIconName(output)}}</mat-icon>
dev@505:         <h4 mat-line>{{output.name}}</h4>
dev@505:         <p mat-line>{{output.combinedKey}}</p>
dev@505:         <button mat-icon-button
dev@432:                 (click)="extract(output); $event.stopPropagation()"
dev@432:                 [disabled]="disabled">
dev@505:           <mat-icon>add</mat-icon>
dev@423:         </button>
dev@505:       </mat-list-item>
dev@505:       <mat-divider></mat-divider>
dev@423:     </ng-container>
dev@505:   </mat-list>
dev@505:   <mat-spinner
dev@505:     *ngIf="isLoading"
dev@505:     [diameter]="25"
dev@505:     [strokeWidth]="2"
dev@505:   ></mat-spinner>
dev@433:   <button
dev@505:     mat-button
dev@433:     (click)="load()"
dev@434:     [disabled]="isLoading"
dev@437:   >Load more</button>
dev@100: </div>