fabrikantencore 2.3.16 → 2.3.19

package/fesm2020/fabrikantencore.mjs

@@ -3279,6 +3279,55 @@ class ProductsApiClient {
         }
         return of(null);
     }
+    connectBCBEigenschapOptieFilterOption(pConnectEigenschapOptieRequest) {
+        let url_ = this.baseUrl + "/api/products/connectbcbeigenschapoptiefilteroption";
+        url_ = url_.replace(/[?&]$/, "");
+        const content_ = JSON.stringify(pConnectEigenschapOptieRequest);
+        let options_ = {
+            body: content_,
+            observe: "response",
+            responseType: "blob",
+            headers: new HttpHeaders({
+                "Content-Type": "application/json",
+            })
+        };
+        return this.http.request("post", url_, options_).pipe(mergeMap((response_) => {
+            return this.processConnectBCBEigenschapOptieFilterOption(response_);
+        })).pipe(catchError((response_) => {
+            if (response_ instanceof HttpResponseBase) {
+                try {
+                    return this.processConnectBCBEigenschapOptieFilterOption(response_);
+                }
+                catch (e) {
+                    return throwError(e);
+                }
+            }
+            else
+                return throwError(response_);
+        }));
+    }
+    processConnectBCBEigenschapOptieFilterOption(response) {
+        const status = response.status;
+        const responseBlob = response instanceof HttpResponse ? response.body :
+            response.error instanceof Blob ? response.error : undefined;
+        let _headers = {};
+        if (response.headers) {
+            for (let key of response.headers.keys()) {
+                _headers[key] = response.headers.get(key);
+            }
+        }
+        if (status === 200) {
+            return blobToText(responseBlob).pipe(mergeMap((_responseText) => {
+                return of(null);
+            }));
+        }
+        else if (status !== 200 && status !== 204) {
+            return blobToText(responseBlob).pipe(mergeMap((_responseText) => {
+                return throwException("An unexpected server error occurred.", status, _responseText, _headers);
+            }));
+        }
+        return of(null);
+    }
     connectBCBEigenschapRangeInput(pConnectBCBEigenschapRangeInputRequest) {
         let url_ = this.baseUrl + "/api/products/connectbcbeigenschaprangeinput";
         url_ = url_.replace(/[?&]$/, "");
@@ -12411,6 +12460,147 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImpor
                     args: [MAT_DIALOG_DATA]
                 }] }, { type: ProductsApiClient }, { type: FiltersApiClient }, { type: ImportSetsService }, { type: ProductsService }, { type: i0.ChangeDetectorRef }]; } });
 
+class BeheerProductsKoppelFilteroptionDailogComponent {
+    constructor(dialogRef, data, FiltersApiClient, ProductsApiClient, ProductsService) {
+        this.dialogRef = dialogRef;
+        this.data = data;
+        this.FiltersApiClient = FiltersApiClient;
+        this.ProductsApiClient = ProductsApiClient;
+        this.ProductsService = ProductsService;
+        this.FilterNaamNieuw = "";
+        this.FilterOptionNaamNieuw = "";
+        this.LoadingFilters = true;
+        this.LoadingOpties = true;
+        this.BCBEigenschapOptieId = data.bcbeigenschapoptieid;
+        this.Location = data.location;
+        this.FilterNaamNieuw = data.suggestedfilter;
+        this.FilterOptionNaamNieuw = data.suggestedoption;
+    }
+    ngOnInit() {
+        this.LoadFilters();
+        //this.LoadOpties();
+    }
+    handleKeyUpFilter(e) {
+        if (e.keyCode === 13) {
+            this.NieuwFilterToevoegen();
+        }
+    }
+    handleKeyUpFilterOption(e) {
+        if (e.keyCode === 13) {
+            this.NieuwFilterOptionToevoegen();
+        }
+    }
+    NieuwFilterToevoegen() {
+        this.LoadingFilters = true;
+        var requestfilter = new CreateFilterRequest();
+        requestfilter.name = this.FilterNaamNieuw;
+        this.FiltersApiClient.createFilter(requestfilter).subscribe((model) => {
+            this.LoadingFilters = false;
+            var requestfilteroption = new CreateFilterOptionRequest();
+            requestfilteroption.filterId = model.id;
+            requestfilteroption.name = this.FilterOptionNaamNieuw;
+            this.FiltersApiClient.createFilterOption(requestfilteroption).subscribe((model) => {
+                this.LoadingFilters = false;
+                this.dialogRef.close({ filter: null, filteroption: model.id });
+            }, (error) => {
+                if (error.status == 400)
+                    console.log(error.json());
+                else {
+                    console.log('An unexpected error occured');
+                    console.log(error);
+                }
+                this.LoadingFilters = false;
+            });
+        }, (error) => {
+            if (error.status == 400)
+                console.log(error.json());
+            else {
+                console.log('An unexpected error occured');
+                console.log(error);
+            }
+            this.LoadingFilters = false;
+        });
+    }
+    NieuwFilterOptionToevoegen() {
+        this.LoadingFilters = true;
+        var requestfilteroption = new CreateFilterOptionRequest();
+        requestfilteroption.filterId = this.FilterSelected;
+        requestfilteroption.name = this.FilterOptionNaamNieuw;
+        this.FiltersApiClient.createFilterOption(requestfilteroption).subscribe((model) => {
+            this.LoadingFilters = false;
+            this.dialogRef.close({ filter: null, filteroption: model.id });
+        }, (error) => {
+            if (error.status == 400)
+                console.log(error.json());
+            else {
+                console.log('An unexpected error occured');
+                console.log(error);
+            }
+            this.LoadingFilters = false;
+        });
+    }
+    BestaandToevoegen() {
+        this.dialogRef.close({ filter: null, filteroption: this.FilterOptionSelected });
+    }
+    GetSelectedFiltersOptions() {
+        var array = new Array();
+        var temparray = this.FiltersViewModel?.filterViewModels;
+        if (temparray != null) {
+            for (var i = 0; i < temparray.length; i++) {
+                if (temparray[i].id == this.FilterSelected) {
+                    return temparray[i].filterOptionViewModels;
+                }
+            }
+        }
+        return array;
+    }
+    KoppelManyName() {
+        this.dialogRef.close({ filter: this.FilterSelected, filteroption: null });
+    }
+    Loading() {
+        return this.LoadingFilters;
+    }
+    LoadFilters() {
+        this.LoadingFilters = true;
+        this.FiltersApiClient.getFiltersViewModel().subscribe((model) => {
+            this.FiltersViewModel = model;
+            this.LoadingFilters = false;
+        }, (error) => {
+            if (error.status == 400)
+                console.log(error.json());
+            else {
+                console.log('An unexpected error occured');
+                console.log(error);
+            }
+            this.LoadingFilters = false;
+        });
+    }
+    LoadOpties() {
+        if (this.ProductsService.BCBProductViewModel != null) {
+            this.LoadingOpties = true;
+            var request = new ConnectEigenschapOptieRequest();
+            request.bcbEigenschapOptieId = this.BCBEigenschapOptieId;
+            request.bcbProductId = this.ProductsService.BCBProductViewModel.id;
+            request.location = this.Location;
+            //this.ProductsApiClient.connectBCBEigenschapOptieFilterOptionPreview(request).subscribe((model: ConnectEigenschapOptieResponse) => {
+            //  this.ConnectEigenschapOptieResponse = model;
+            //  this.LoadingOpties = false;
+            //}, (error: Response) => {
+            //  alert(error);
+            //});
+        }
+    }
+}
+BeheerProductsKoppelFilteroptionDailogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: BeheerProductsKoppelFilteroptionDailogComponent, deps: [{ token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: FiltersApiClient }, { token: ProductsApiClient }, { token: ProductsService }], target: i0.ɵɵFactoryTarget.Component });
+BeheerProductsKoppelFilteroptionDailogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: BeheerProductsKoppelFilteroptionDailogComponent, selector: "app-beheer-products-koppel-filteroption-dailog", ngImport: i0, template: "<div *ngIf=\"Loading()\">\r\n  <app-fab-loader></app-fab-loader>\r\n</div>\r\n\r\n<div *ngIf=\"!Loading()\">\r\n  <mat-tab-group>\r\n    <mat-tab label=\"Nieuwe filter\">\r\n      <div class=\"bar\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Filter</mat-label>\r\n          <input matInput [(ngModel)]=\"FilterNaamNieuw\">\r\n        </mat-form-field>\r\n\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Optie</mat-label>\r\n          <input matInput (keyup)=\"handleKeyUpFilter($event)\" [(ngModel)]=\"FilterOptionNaamNieuw\">\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"NieuwFilterToevoegen()\">Toevoegen</button>\r\n      </div>\r\n    </mat-tab>\r\n    <mat-tab label=\"Nieuwe optie\">\r\n      <div class=\"bar\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Filter</mat-label>\r\n          <mat-select [(ngModel)]=\"FilterSelected\">\r\n            <mat-option *ngFor=\"let filter of FiltersViewModel.filterViewModels\" [value]=\"filter.id\">\r\n              {{filter.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Optie</mat-label>\r\n          <input matInput (keyup)=\"handleKeyUpFilterOption($event)\" [(ngModel)]=\"FilterOptionNaamNieuw\">\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"NieuwFilterOptionToevoegen()\">Toevoegen</button>\r\n      </div>\r\n    </mat-tab>\r\n    <mat-tab label=\"Bestaand\">\r\n\r\n      <div class=\"bar\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Filter</mat-label>\r\n          <mat-select [(ngModel)]=\"FilterSelected\">\r\n            <mat-option *ngFor=\"let filter of FiltersViewModel.filterViewModels\" [value]=\"filter.id\">\r\n              {{filter.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Optie</mat-label>\r\n          <mat-select [(ngModel)]=\"FilterOptionSelected\">\r\n            <mat-option *ngFor=\"let filteroption of GetSelectedFiltersOptions()\" [value]=\"filteroption.id\">\r\n              {{filteroption.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"BestaandToevoegen()\">Toevoegen</button>\r\n      </div>\r\n    </mat-tab>\r\n    <!--<mat-tab label=\"Many Name\">\r\n      <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n        <mat-label>Filter</mat-label>\r\n        <mat-select [(ngModel)]=\"FilterSelected\">\r\n          <mat-option *ngFor=\"let filter of FiltersViewModel.filterViewModels\" [value]=\"filter.id\">\r\n            {{filter.name}}\r\n          </mat-option>\r\n        </mat-select>\r\n      </mat-form-field>\r\n\r\n      <app-beheer-connect-manyname></app-beheer-connect-manyname>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"KoppelManyName()\">Koppel</button>\r\n      </div>\r\n    </mat-tab>-->\r\n  </mat-tab-group>\r\n\r\n  <div class=\"options-container\">\r\n    <!--<div *ngFor=\"let location of ConnectEigenschapOptieResponse.locations\">\r\n      <b>{{ location.location }}</b>\r\n      <div *ngFor=\"let ebo of location.ebos\">\r\n        {{ ebo }}\r\n      </div>\r\n    </div>-->\r\n  </div>\r\n</div>\r\n", styles: [".full-width{width:100%}.options-container{max-height:300px}.tool-bar{padding:2px}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i7.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i9.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { kind: "component", type: i9.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass"], exportAs: ["matTab"] }, { kind: "component", type: i10.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i11.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: FabLoaderComponent, selector: "app-fab-loader" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: BeheerProductsKoppelFilteroptionDailogComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-beheer-products-koppel-filteroption-dailog', template: "<div *ngIf=\"Loading()\">\r\n  <app-fab-loader></app-fab-loader>\r\n</div>\r\n\r\n<div *ngIf=\"!Loading()\">\r\n  <mat-tab-group>\r\n    <mat-tab label=\"Nieuwe filter\">\r\n      <div class=\"bar\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Filter</mat-label>\r\n          <input matInput [(ngModel)]=\"FilterNaamNieuw\">\r\n        </mat-form-field>\r\n\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Optie</mat-label>\r\n          <input matInput (keyup)=\"handleKeyUpFilter($event)\" [(ngModel)]=\"FilterOptionNaamNieuw\">\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"NieuwFilterToevoegen()\">Toevoegen</button>\r\n      </div>\r\n    </mat-tab>\r\n    <mat-tab label=\"Nieuwe optie\">\r\n      <div class=\"bar\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Filter</mat-label>\r\n          <mat-select [(ngModel)]=\"FilterSelected\">\r\n            <mat-option *ngFor=\"let filter of FiltersViewModel.filterViewModels\" [value]=\"filter.id\">\r\n              {{filter.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Optie</mat-label>\r\n          <input matInput (keyup)=\"handleKeyUpFilterOption($event)\" [(ngModel)]=\"FilterOptionNaamNieuw\">\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"NieuwFilterOptionToevoegen()\">Toevoegen</button>\r\n      </div>\r\n    </mat-tab>\r\n    <mat-tab label=\"Bestaand\">\r\n\r\n      <div class=\"bar\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Filter</mat-label>\r\n          <mat-select [(ngModel)]=\"FilterSelected\">\r\n            <mat-option *ngFor=\"let filter of FiltersViewModel.filterViewModels\" [value]=\"filter.id\">\r\n              {{filter.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Optie</mat-label>\r\n          <mat-select [(ngModel)]=\"FilterOptionSelected\">\r\n            <mat-option *ngFor=\"let filteroption of GetSelectedFiltersOptions()\" [value]=\"filteroption.id\">\r\n              {{filteroption.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"BestaandToevoegen()\">Toevoegen</button>\r\n      </div>\r\n    </mat-tab>\r\n    <!--<mat-tab label=\"Many Name\">\r\n      <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n        <mat-label>Filter</mat-label>\r\n        <mat-select [(ngModel)]=\"FilterSelected\">\r\n          <mat-option *ngFor=\"let filter of FiltersViewModel.filterViewModels\" [value]=\"filter.id\">\r\n            {{filter.name}}\r\n          </mat-option>\r\n        </mat-select>\r\n      </mat-form-field>\r\n\r\n      <app-beheer-connect-manyname></app-beheer-connect-manyname>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"KoppelManyName()\">Koppel</button>\r\n      </div>\r\n    </mat-tab>-->\r\n  </mat-tab-group>\r\n\r\n  <div class=\"options-container\">\r\n    <!--<div *ngFor=\"let location of ConnectEigenschapOptieResponse.locations\">\r\n      <b>{{ location.location }}</b>\r\n      <div *ngFor=\"let ebo of location.ebos\">\r\n        {{ ebo }}\r\n      </div>\r\n    </div>-->\r\n  </div>\r\n</div>\r\n", styles: [".full-width{width:100%}.options-container{max-height:300px}.tool-bar{padding:2px}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [MAT_DIALOG_DATA]
+                }] }, { type: FiltersApiClient }, { type: ProductsApiClient }, { type: ProductsService }]; } });
+
 class BeheerProductsEigenschapBereikComponent {
     constructor() { }
     ngOnInit() {
@@ -12438,45 +12628,33 @@ class BeheerProductsEigenschapComponent {
     Toggle() {
         this.eigenschap.open = !this.eigenschap.open;
     }
-    //public Connect(id: number, filter: string, option: string): void {
-    //  var dialogRef = this.dialog.open(BeheerProductsKoppelFilteroptionDailogComponent, {
-    //    data: {
-    //      location: this.eigenschap.location,
-    //      bcbeigenschapoptieid: id,
-    //      suggestedfilter: filter,
-    //      suggestedoption: option
-    //    }
-    //  });
-    //  dialogRef.afterClosed().subscribe((result: any) => {
-    //    if (result != null) {
-    //      if (result.filteroption != null && result.filteroption > 0) {
-    //        if (this.ProductsService.BCBProductViewModel != null) {
-    //          var request = new ConnectEigenschapOptieRequest();
-    //          request.bcbEigenschapOptieId = id;
-    //          request.filterOptionId = result.filteroption;
-    //          request.bcbProductId = this.ProductsService.BCBProductViewModel.id;
-    //          request.location = this.eigenschap.location;
-    //          this.ProductsApiClient.connectBCBEigenschapOptieFilterOption(request).subscribe(() => {
-    //            this.ProductsService.LoadProduct(this.ChangeDetectorRef);
-    //          }, (error: Response) => {
-    //            alert(error);
-    //          });
-    //        }
-    //      }
-    //      else if (result.filter != null) {
-    //        var request2 = new ConnectManyNameRequest();
-    //        request2.bcbProductEigenschapOptieId = id;
-    //        request2.filterId = result.filter;
-    //        this.ProductsApiClient.connectManyName(request2).subscribe((model: ConnectManyNameResponse) => {
-    //          this.ProductsService.LoadProduct(this.ChangeDetectorRef);
-    //        }, (error: Response) => {
-    //          alert(error);
-    //        });
-    //      }
-    //    }
-    //  });
-    //}
     Connect(id) {
+        var dialogRef = this.dialog.open(BeheerProductsKoppelFilteroptionDailogComponent, {
+            data: {
+                location: this.eigenschap.location,
+                bcbeigenschapoptieid: id
+            }
+        });
+        dialogRef.afterClosed().subscribe((result) => {
+            if (result != null) {
+                if (result.filteroption != null && result.filteroption > 0) {
+                    if (this.ProductsService.BCBProductViewModel != null) {
+                        var request = new ConnectEigenschapOptieRequest();
+                        request.bcbEigenschapOptieId = id;
+                        request.filterOptionId = result.filteroption;
+                        request.bcbProductId = this.ProductsService.BCBProductViewModel.id;
+                        request.location = this.eigenschap.location;
+                        this.ProductsApiClient.connectBCBEigenschapOptieFilterOption(request).subscribe(() => {
+                            this.ProductsService.LoadProduct(this.ChangeDetectorRef);
+                        }, (error) => {
+                            alert(error);
+                        });
+                    }
+                }
+            }
+        });
+    }
+    ConnectAuto(id) {
         var dialogRef = this.dialog.open(BeheerSelectFilterDialogComponent, {
             data: {
                 name: this.eigenschap.name
@@ -12614,10 +12792,10 @@ class BeheerProductsEigenschapComponent {
     }
 }
 BeheerProductsEigenschapComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: BeheerProductsEigenschapComponent, deps: [{ token: ImportSetsService }, { token: ProductsService }, { token: i1$4.MatDialog }, { token: ProductsApiClient }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-BeheerProductsEigenschapComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: BeheerProductsEigenschapComponent, selector: "app-beheer-products-eigenschap", inputs: { eigenschap: "eigenschap" }, ngImport: i0, template: "<div class=\"container\" [ngClass]=\"{'warning': !eigenschap.connected, 'normal': eigenschap.connected}\">\r\n  <div class=\"row\" (click)=\"Toggle()\">\r\n    <div class=\"icon-td\">\r\n      <mat-icon *ngIf=\"!eigenschap.open && Show()\">expand_more</mat-icon>\r\n      <mat-icon *ngIf=\"eigenschap.open && Show()\">expand_less</mat-icon>\r\n    </div>\r\n    <div class=\"eigenschapcel\" colspan=\"2\">\r\n      {{eigenschap?.name}}\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"eigenschap.open\">\r\n    <div *ngFor=\"let bereik of eigenschap.bereiken\" class=\"bereik\">\r\n      <app-beheer-products-eigenschap-bereik [bereik]=\"bereik\"></app-beheer-products-eigenschap-bereik>\r\n    </div>\r\n    <div *ngFor=\"let toebehoren of eigenschap.toebehoren\">\r\n      {{ toebehoren.name }}\r\n    </div>\r\n    <div *ngIf=\"eigenschap.bereiken.length > 0 && eigenschap.rangeInputs != null\">\r\n      <div *ngIf=\"!eigenschap.connected\">\r\n        <button mat-raised-button (click)=\"ConnectRange()\">\r\n          Range\r\n        </button>\r\n        <button mat-raised-button (click)=\"Ignore()\">\r\n          Ignore\r\n        </button>\r\n        <button mat-raised-button (click)=\"IgnoreMany()\">\r\n          IgnoreMany\r\n        </button>\r\n      </div>\r\n      <div *ngFor=\"let range of eigenschap.rangeInputs\">\r\n        {{ range.rangeInputModel.name }}\r\n\r\n        <button mat-raised-button>\r\n          Remove\r\n        </button>\r\n      </div>\r\n    </div>\r\n    <div *ngFor=\"let optie of eigenschap.opties\" [ngClass]=\"{'warning': !optie.connected}\">\r\n      <div class=\"displayflex\">\r\n        <ng-container *ngIf=\"optie.colour != null && optie.colour != ''\">\r\n          <span [ngStyle]=\"{'background-color': optie.colour}\" class=\"colour-preview\">\r\n            &nbsp;\r\n            &nbsp;\r\n          </span>\r\n        </ng-container>\r\n        <div class=\"text-div line-height\">{{ optie.name }}</div>\r\n      </div>\r\n      <div>\r\n        <div *ngIf=\"!optie.connected\" class=\"button-row\">\r\n          <button mat-raised-button (click)=\"Connect(optie.id)\">\r\n            FilterOption\r\n          </button>\r\n          <button mat-raised-button (click)=\"ConnectMany(optie.id)\">\r\n            FilterOptionMany\r\n          </button>\r\n          <!--<button mat-raised-button (click)=\"ConnectCategory()\">\r\n            Category\r\n          </button>-->\r\n          <button mat-raised-button (click)=\"IgnoreId(optie.id)\">\r\n            Ignore\r\n          </button>\r\n        </div>\r\n        <div *ngFor=\"let connect of optie.bcbEigenschapOptieFilterOptionViewModels\">\r\n          <b>{{ connect.filterOptionViewModel.filterName }}: {{ connect.filterOptionViewModel.name }}</b>&nbsp;\r\n          <button mat-raised-button>\r\n            Remove\r\n          </button>\r\n        </div>\r\n        <div *ngFor=\"let connect of optie.bcbEigenschapOptieCategoryViewModels\">\r\n          <b>{{ connect.categoryViewModel.name }}</b>&nbsp;\r\n          <button mat-raised-button>\r\n            Remove\r\n          </button>\r\n        </div>\r\n        <div *ngIf=\"optie.ignore\">\r\n          <b>Ignore</b>&nbsp;\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".row{cursor:pointer;display:flex}.displayflex{display:flex}.line-height{line-height:36px}.colour-preview{padding:5px;margin:2px;border:1px solid #000}.eigenschapcel{flex:auto}.button-row{display:flex;gap:4px}.container{margin:5px;padding:5px;border:1px solid #000}.icon-td{width:24px;height:24px}.text-div{flex:auto}.warning{background-color:#f08080}.normal{background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i7.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: BeheerProductsEigenschapBereikComponent, selector: "app-beheer-products-eigenschap-bereik", inputs: ["bereik"] }] });
+BeheerProductsEigenschapComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: BeheerProductsEigenschapComponent, selector: "app-beheer-products-eigenschap", inputs: { eigenschap: "eigenschap" }, ngImport: i0, template: "<div class=\"container\" [ngClass]=\"{'warning': !eigenschap.connected, 'normal': eigenschap.connected}\">\r\n  <div class=\"row\" (click)=\"Toggle()\">\r\n    <div class=\"icon-td\">\r\n      <mat-icon *ngIf=\"!eigenschap.open && Show()\">expand_more</mat-icon>\r\n      <mat-icon *ngIf=\"eigenschap.open && Show()\">expand_less</mat-icon>\r\n    </div>\r\n    <div class=\"eigenschapcel\" colspan=\"2\">\r\n      {{eigenschap?.name}}\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"eigenschap.open\">\r\n    <div *ngFor=\"let bereik of eigenschap.bereiken\" class=\"bereik\">\r\n      <app-beheer-products-eigenschap-bereik [bereik]=\"bereik\"></app-beheer-products-eigenschap-bereik>\r\n    </div>\r\n    <div *ngFor=\"let toebehoren of eigenschap.toebehoren\">\r\n      {{ toebehoren.name }}\r\n    </div>\r\n    <div *ngIf=\"eigenschap.bereiken.length > 0 && eigenschap.rangeInputs != null\">\r\n      <div *ngIf=\"!eigenschap.connected\">\r\n        <button mat-raised-button (click)=\"ConnectRange()\">\r\n          Range\r\n        </button>\r\n        <button mat-raised-button (click)=\"Ignore()\">\r\n          Ignore\r\n        </button>\r\n        <button mat-raised-button (click)=\"IgnoreMany()\">\r\n          IgnoreMany\r\n        </button>\r\n      </div>\r\n      <div *ngFor=\"let range of eigenschap.rangeInputs\">\r\n        {{ range.rangeInputModel.name }}\r\n\r\n        <button mat-raised-button>\r\n          Remove\r\n        </button>\r\n      </div>\r\n    </div>\r\n    <div *ngFor=\"let optie of eigenschap.opties\" [ngClass]=\"{'warning': !optie.connected}\">\r\n      <div class=\"displayflex\">\r\n        <ng-container *ngIf=\"optie.colour != null && optie.colour != ''\">\r\n          <span [ngStyle]=\"{'background-color': optie.colour}\" class=\"colour-preview\">\r\n            &nbsp;\r\n            &nbsp;\r\n          </span>\r\n        </ng-container>\r\n        <div class=\"text-div line-height\">{{ optie.name }}</div>\r\n      </div>\r\n      <div>\r\n        <div *ngIf=\"!optie.connected\" class=\"button-row\">\r\n          <button mat-raised-button (click)=\"Connect(optie.id)\">\r\n            FilterOption\r\n          </button>\r\n          <button mat-raised-button (click)=\"ConnectAuto(optie.id)\">\r\n            FilterOptionAuto\r\n          </button>\r\n          <button mat-raised-button (click)=\"ConnectMany(optie.id)\">\r\n            FilterOptionMany\r\n          </button>\r\n          <!--<button mat-raised-button (click)=\"ConnectCategory()\">\r\n    Category\r\n  </button>-->\r\n          <button mat-raised-button (click)=\"IgnoreId(optie.id)\">\r\n            Ignore\r\n          </button>\r\n        </div>\r\n        <div *ngFor=\"let connect of optie.bcbEigenschapOptieFilterOptionViewModels\">\r\n          <b>{{ connect.filterOptionViewModel.filterName }}: {{ connect.filterOptionViewModel.name }}</b>&nbsp;\r\n          <button mat-raised-button>\r\n            Remove\r\n          </button>\r\n        </div>\r\n        <div *ngFor=\"let connect of optie.bcbEigenschapOptieCategoryViewModels\">\r\n          <b>{{ connect.categoryViewModel.name }}</b>&nbsp;\r\n          <button mat-raised-button>\r\n            Remove\r\n          </button>\r\n        </div>\r\n        <div *ngIf=\"optie.ignore\">\r\n          <b>Ignore</b>&nbsp;\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".row{cursor:pointer;display:flex}.displayflex{display:flex}.line-height{line-height:36px}.colour-preview{padding:5px;margin:2px;border:1px solid #000}.eigenschapcel{flex:auto}.button-row{display:flex;gap:4px}.container{margin:5px;padding:5px;border:1px solid #000}.icon-td{width:24px;height:24px}.text-div{flex:auto}.warning{background-color:#f08080}.normal{background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i7.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: BeheerProductsEigenschapBereikComponent, selector: "app-beheer-products-eigenschap-bereik", inputs: ["bereik"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: BeheerProductsEigenschapComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-beheer-products-eigenschap', template: "<div class=\"container\" [ngClass]=\"{'warning': !eigenschap.connected, 'normal': eigenschap.connected}\">\r\n  <div class=\"row\" (click)=\"Toggle()\">\r\n    <div class=\"icon-td\">\r\n      <mat-icon *ngIf=\"!eigenschap.open && Show()\">expand_more</mat-icon>\r\n      <mat-icon *ngIf=\"eigenschap.open && Show()\">expand_less</mat-icon>\r\n    </div>\r\n    <div class=\"eigenschapcel\" colspan=\"2\">\r\n      {{eigenschap?.name}}\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"eigenschap.open\">\r\n    <div *ngFor=\"let bereik of eigenschap.bereiken\" class=\"bereik\">\r\n      <app-beheer-products-eigenschap-bereik [bereik]=\"bereik\"></app-beheer-products-eigenschap-bereik>\r\n    </div>\r\n    <div *ngFor=\"let toebehoren of eigenschap.toebehoren\">\r\n      {{ toebehoren.name }}\r\n    </div>\r\n    <div *ngIf=\"eigenschap.bereiken.length > 0 && eigenschap.rangeInputs != null\">\r\n      <div *ngIf=\"!eigenschap.connected\">\r\n        <button mat-raised-button (click)=\"ConnectRange()\">\r\n          Range\r\n        </button>\r\n        <button mat-raised-button (click)=\"Ignore()\">\r\n          Ignore\r\n        </button>\r\n        <button mat-raised-button (click)=\"IgnoreMany()\">\r\n          IgnoreMany\r\n        </button>\r\n      </div>\r\n      <div *ngFor=\"let range of eigenschap.rangeInputs\">\r\n        {{ range.rangeInputModel.name }}\r\n\r\n        <button mat-raised-button>\r\n          Remove\r\n        </button>\r\n      </div>\r\n    </div>\r\n    <div *ngFor=\"let optie of eigenschap.opties\" [ngClass]=\"{'warning': !optie.connected}\">\r\n      <div class=\"displayflex\">\r\n        <ng-container *ngIf=\"optie.colour != null && optie.colour != ''\">\r\n          <span [ngStyle]=\"{'background-color': optie.colour}\" class=\"colour-preview\">\r\n            &nbsp;\r\n            &nbsp;\r\n          </span>\r\n        </ng-container>\r\n        <div class=\"text-div line-height\">{{ optie.name }}</div>\r\n      </div>\r\n      <div>\r\n        <div *ngIf=\"!optie.connected\" class=\"button-row\">\r\n          <button mat-raised-button (click)=\"Connect(optie.id)\">\r\n            FilterOption\r\n          </button>\r\n          <button mat-raised-button (click)=\"ConnectMany(optie.id)\">\r\n            FilterOptionMany\r\n          </button>\r\n          <!--<button mat-raised-button (click)=\"ConnectCategory()\">\r\n            Category\r\n          </button>-->\r\n          <button mat-raised-button (click)=\"IgnoreId(optie.id)\">\r\n            Ignore\r\n          </button>\r\n        </div>\r\n        <div *ngFor=\"let connect of optie.bcbEigenschapOptieFilterOptionViewModels\">\r\n          <b>{{ connect.filterOptionViewModel.filterName }}: {{ connect.filterOptionViewModel.name }}</b>&nbsp;\r\n          <button mat-raised-button>\r\n            Remove\r\n          </button>\r\n        </div>\r\n        <div *ngFor=\"let connect of optie.bcbEigenschapOptieCategoryViewModels\">\r\n          <b>{{ connect.categoryViewModel.name }}</b>&nbsp;\r\n          <button mat-raised-button>\r\n            Remove\r\n          </button>\r\n        </div>\r\n        <div *ngIf=\"optie.ignore\">\r\n          <b>Ignore</b>&nbsp;\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".row{cursor:pointer;display:flex}.displayflex{display:flex}.line-height{line-height:36px}.colour-preview{padding:5px;margin:2px;border:1px solid #000}.eigenschapcel{flex:auto}.button-row{display:flex;gap:4px}.container{margin:5px;padding:5px;border:1px solid #000}.icon-td{width:24px;height:24px}.text-div{flex:auto}.warning{background-color:#f08080}.normal{background-color:#fff}\n"] }]
+            args: [{ selector: 'app-beheer-products-eigenschap', template: "<div class=\"container\" [ngClass]=\"{'warning': !eigenschap.connected, 'normal': eigenschap.connected}\">\r\n  <div class=\"row\" (click)=\"Toggle()\">\r\n    <div class=\"icon-td\">\r\n      <mat-icon *ngIf=\"!eigenschap.open && Show()\">expand_more</mat-icon>\r\n      <mat-icon *ngIf=\"eigenschap.open && Show()\">expand_less</mat-icon>\r\n    </div>\r\n    <div class=\"eigenschapcel\" colspan=\"2\">\r\n      {{eigenschap?.name}}\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"eigenschap.open\">\r\n    <div *ngFor=\"let bereik of eigenschap.bereiken\" class=\"bereik\">\r\n      <app-beheer-products-eigenschap-bereik [bereik]=\"bereik\"></app-beheer-products-eigenschap-bereik>\r\n    </div>\r\n    <div *ngFor=\"let toebehoren of eigenschap.toebehoren\">\r\n      {{ toebehoren.name }}\r\n    </div>\r\n    <div *ngIf=\"eigenschap.bereiken.length > 0 && eigenschap.rangeInputs != null\">\r\n      <div *ngIf=\"!eigenschap.connected\">\r\n        <button mat-raised-button (click)=\"ConnectRange()\">\r\n          Range\r\n        </button>\r\n        <button mat-raised-button (click)=\"Ignore()\">\r\n          Ignore\r\n        </button>\r\n        <button mat-raised-button (click)=\"IgnoreMany()\">\r\n          IgnoreMany\r\n        </button>\r\n      </div>\r\n      <div *ngFor=\"let range of eigenschap.rangeInputs\">\r\n        {{ range.rangeInputModel.name }}\r\n\r\n        <button mat-raised-button>\r\n          Remove\r\n        </button>\r\n      </div>\r\n    </div>\r\n    <div *ngFor=\"let optie of eigenschap.opties\" [ngClass]=\"{'warning': !optie.connected}\">\r\n      <div class=\"displayflex\">\r\n        <ng-container *ngIf=\"optie.colour != null && optie.colour != ''\">\r\n          <span [ngStyle]=\"{'background-color': optie.colour}\" class=\"colour-preview\">\r\n            &nbsp;\r\n            &nbsp;\r\n          </span>\r\n        </ng-container>\r\n        <div class=\"text-div line-height\">{{ optie.name }}</div>\r\n      </div>\r\n      <div>\r\n        <div *ngIf=\"!optie.connected\" class=\"button-row\">\r\n          <button mat-raised-button (click)=\"Connect(optie.id)\">\r\n            FilterOption\r\n          </button>\r\n          <button mat-raised-button (click)=\"ConnectAuto(optie.id)\">\r\n            FilterOptionAuto\r\n          </button>\r\n          <button mat-raised-button (click)=\"ConnectMany(optie.id)\">\r\n            FilterOptionMany\r\n          </button>\r\n          <!--<button mat-raised-button (click)=\"ConnectCategory()\">\r\n    Category\r\n  </button>-->\r\n          <button mat-raised-button (click)=\"IgnoreId(optie.id)\">\r\n            Ignore\r\n          </button>\r\n        </div>\r\n        <div *ngFor=\"let connect of optie.bcbEigenschapOptieFilterOptionViewModels\">\r\n          <b>{{ connect.filterOptionViewModel.filterName }}: {{ connect.filterOptionViewModel.name }}</b>&nbsp;\r\n          <button mat-raised-button>\r\n            Remove\r\n          </button>\r\n        </div>\r\n        <div *ngFor=\"let connect of optie.bcbEigenschapOptieCategoryViewModels\">\r\n          <b>{{ connect.categoryViewModel.name }}</b>&nbsp;\r\n          <button mat-raised-button>\r\n            Remove\r\n          </button>\r\n        </div>\r\n        <div *ngIf=\"optie.ignore\">\r\n          <b>Ignore</b>&nbsp;\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".row{cursor:pointer;display:flex}.displayflex{display:flex}.line-height{line-height:36px}.colour-preview{padding:5px;margin:2px;border:1px solid #000}.eigenschapcel{flex:auto}.button-row{display:flex;gap:4px}.container{margin:5px;padding:5px;border:1px solid #000}.icon-td{width:24px;height:24px}.text-div{flex:auto}.warning{background-color:#f08080}.normal{background-color:#fff}\n"] }]
         }], ctorParameters: function () { return [{ type: ImportSetsService }, { type: ProductsService }, { type: i1$4.MatDialog }, { type: ProductsApiClient }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { eigenschap: [{
                 type: Input
             }] } });
@@ -13985,147 +14163,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImpor
             args: [{ selector: 'app-beheer-import-sets', template: "<app-beheer-nav></app-beheer-nav>\r\n\r\n<div *ngIf=\"Loading()\">\r\n  <app-fab-loader></app-fab-loader>\r\n</div>\r\n<div *ngIf=\"!Loading()\" class=\"main-content\">\r\n  <mat-card>\r\n    <div class=\"toolbar\">\r\n      <div class=\"toolbar-item\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Import set</mat-label>\r\n          <mat-select [(ngModel)]=\"ImportSetsService.BCBImportSetSelected\" (selectionChange)=\"Reload()\">\r\n            <mat-option *ngFor=\"let importset of ImportSetsService.BCBImportSetsViewModel.bcbImportSetViewModels\" [value]=\"importset.id\">\r\n              {{importset.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n      </div>\r\n      <div class=\"\">\r\n        <button mat-raised-button (click)=\"Wijzig()\">\r\n          Wijzig\r\n        </button>\r\n      </div>\r\n      <div class=\"\">\r\n        <button mat-raised-button (click)=\"Toevoegen()\">\r\n          Toevoegen\r\n        </button>\r\n      </div>\r\n    </div>\r\n    <div class=\"toolbar\" *ngIf=\"GetProducts().length > 0\">\r\n      <div class=\"toolbar-item\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Product</mat-label>\r\n          <mat-select [(ngModel)]=\"ProductsService.ProductSelected\">\r\n            <mat-option *ngFor=\"let product of GetProducts()\" [value]=\"product.id\">\r\n              {{product.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n      </div>\r\n      <div class=\"toolbar-item flex-auto\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>BCBProduct</mat-label>\r\n          <mat-select [(ngModel)]=\"ProductsService.BCBProductSelected\">\r\n            <mat-option *ngFor=\"let product of ProductsService.GetBCBProductsSelected()\" [value]=\"product.id\">\r\n              {{product.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n      </div>\r\n      <div class=\"\">\r\n        <button mat-raised-button (click)=\"Open()\">\r\n          Open\r\n        </button>\r\n      </div>\r\n    </div>\r\n  </mat-card>\r\n\r\n  <div class=\"main-block\">\r\n    <div class=\"flex-auto block\">\r\n      <mat-card>\r\n        <mat-card-content>\r\n          <div *ngIf=\"ImportSetsService.LoadingOpen\">\r\n            <app-fab-loader></app-fab-loader>\r\n          </div>\r\n          <div *ngIf=\"!ImportSetsService.LoadingOpen && ImportSetsService.BCBImportOpenResponse != null\">\r\n            <h3 class=\"title\">{{ ImportSetsService.BCBImportOpenResponse?.bcbeboViewModel?.name }}</h3>\r\n\r\n            <div class=\"opbouw\">Opbouw</div>\r\n            <app-beheer-import-sets-opbouw *ngFor=\"let opbouw of ImportSetsService.BCBImportOpenResponse.bcbImportOpbouwen\" [opbouw]=\"opbouw\"></app-beheer-import-sets-opbouw>\r\n\r\n            <div class=\"opbouw\">Eigenschap</div>\r\n            <app-beheer-import-sets-eigenschap *ngFor=\"let eigenschap of ImportSetsService.BCBImportOpenResponse.bcbImportEigenschappen\" [eigenschap]=\"eigenschap\"></app-beheer-import-sets-eigenschap>\r\n          </div>\r\n        </mat-card-content>\r\n      </mat-card>\r\n\r\n    </div>\r\n    <div class=\"importset-block block\">\r\n      <mat-card>\r\n        <mat-card-title>{{ ImportSetsService.GetActiveImportSet().name }}</mat-card-title>\r\n        <mat-card-content>\r\n          <mat-card class=\"value-block\" *ngFor=\"let value of ImportSetsService.GetActiveImportSet().bcbImportSetValueViewModels\">\r\n            <mat-card-content>\r\n              {{ value.value }}\r\n            </mat-card-content>\r\n          </mat-card>\r\n        </mat-card-content>\r\n      </mat-card>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".main-content{padding:5px}.flex-auto{flex:auto}.full-width{width:100%}.value-block{margin:3px}.importset-block{min-width:300px}.full-height{height:100%}.main-block{display:flex}.block{margin:5px}.toolbar{display:flex}.toolbar-item{margin-right:3px}.card{margin:3px}.opbouw{border-bottom:2px solid #000;font-size:20px;margin-top:5px;margin-bottom:5px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$4.MatDialog }, { type: ProductsService }, { type: ImportSetsService }, { type: ImportApiClient }, { type: i0.ChangeDetectorRef }]; } });
 
-class BeheerProductsKoppelFilteroptionDailogComponent {
-    constructor(dialogRef, data, FiltersApiClient, ProductsApiClient, ProductsService) {
-        this.dialogRef = dialogRef;
-        this.data = data;
-        this.FiltersApiClient = FiltersApiClient;
-        this.ProductsApiClient = ProductsApiClient;
-        this.ProductsService = ProductsService;
-        this.FilterNaamNieuw = "";
-        this.FilterOptionNaamNieuw = "";
-        this.LoadingFilters = true;
-        this.LoadingOpties = true;
-        this.BCBEigenschapOptieId = data.bcbeigenschapoptieid;
-        this.Location = data.location;
-        this.FilterNaamNieuw = data.suggestedfilter;
-        this.FilterOptionNaamNieuw = data.suggestedoption;
-    }
-    ngOnInit() {
-        this.LoadFilters();
-        //this.LoadOpties();
-    }
-    handleKeyUpFilter(e) {
-        if (e.keyCode === 13) {
-            this.NieuwFilterToevoegen();
-        }
-    }
-    handleKeyUpFilterOption(e) {
-        if (e.keyCode === 13) {
-            this.NieuwFilterOptionToevoegen();
-        }
-    }
-    NieuwFilterToevoegen() {
-        this.LoadingFilters = true;
-        var requestfilter = new CreateFilterRequest();
-        requestfilter.name = this.FilterNaamNieuw;
-        this.FiltersApiClient.createFilter(requestfilter).subscribe((model) => {
-            this.LoadingFilters = false;
-            var requestfilteroption = new CreateFilterOptionRequest();
-            requestfilteroption.filterId = model.id;
-            requestfilteroption.name = this.FilterOptionNaamNieuw;
-            this.FiltersApiClient.createFilterOption(requestfilteroption).subscribe((model) => {
-                this.LoadingFilters = false;
-                this.dialogRef.close({ filter: null, filteroption: model.id });
-            }, (error) => {
-                if (error.status == 400)
-                    console.log(error.json());
-                else {
-                    console.log('An unexpected error occured');
-                    console.log(error);
-                }
-                this.LoadingFilters = false;
-            });
-        }, (error) => {
-            if (error.status == 400)
-                console.log(error.json());
-            else {
-                console.log('An unexpected error occured');
-                console.log(error);
-            }
-            this.LoadingFilters = false;
-        });
-    }
-    NieuwFilterOptionToevoegen() {
-        this.LoadingFilters = true;
-        var requestfilteroption = new CreateFilterOptionRequest();
-        requestfilteroption.filterId = this.FilterSelected;
-        requestfilteroption.name = this.FilterOptionNaamNieuw;
-        this.FiltersApiClient.createFilterOption(requestfilteroption).subscribe((model) => {
-            this.LoadingFilters = false;
-            this.dialogRef.close({ filter: null, filteroption: model.id });
-        }, (error) => {
-            if (error.status == 400)
-                console.log(error.json());
-            else {
-                console.log('An unexpected error occured');
-                console.log(error);
-            }
-            this.LoadingFilters = false;
-        });
-    }
-    BestaandToevoegen() {
-        this.dialogRef.close({ filter: null, filteroption: this.FilterOptionSelected });
-    }
-    GetSelectedFiltersOptions() {
-        var array = new Array();
-        var temparray = this.FiltersViewModel?.filterViewModels;
-        if (temparray != null) {
-            for (var i = 0; i < temparray.length; i++) {
-                if (temparray[i].id == this.FilterSelected) {
-                    return temparray[i].filterOptionViewModels;
-                }
-            }
-        }
-        return array;
-    }
-    KoppelManyName() {
-        this.dialogRef.close({ filter: this.FilterSelected, filteroption: null });
-    }
-    Loading() {
-        return this.LoadingFilters;
-    }
-    LoadFilters() {
-        this.LoadingFilters = true;
-        this.FiltersApiClient.getFiltersViewModel().subscribe((model) => {
-            this.FiltersViewModel = model;
-            this.LoadingFilters = false;
-        }, (error) => {
-            if (error.status == 400)
-                console.log(error.json());
-            else {
-                console.log('An unexpected error occured');
-                console.log(error);
-            }
-            this.LoadingFilters = false;
-        });
-    }
-    LoadOpties() {
-        if (this.ProductsService.BCBProductViewModel != null) {
-            this.LoadingOpties = true;
-            var request = new ConnectEigenschapOptieRequest();
-            request.bcbEigenschapOptieId = this.BCBEigenschapOptieId;
-            request.bcbProductId = this.ProductsService.BCBProductViewModel.id;
-            request.location = this.Location;
-            //this.ProductsApiClient.connectBCBEigenschapOptieFilterOptionPreview(request).subscribe((model: ConnectEigenschapOptieResponse) => {
-            //  this.ConnectEigenschapOptieResponse = model;
-            //  this.LoadingOpties = false;
-            //}, (error: Response) => {
-            //  alert(error);
-            //});
-        }
-    }
-}
-BeheerProductsKoppelFilteroptionDailogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: BeheerProductsKoppelFilteroptionDailogComponent, deps: [{ token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: FiltersApiClient }, { token: ProductsApiClient }, { token: ProductsService }], target: i0.ɵɵFactoryTarget.Component });
-BeheerProductsKoppelFilteroptionDailogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: BeheerProductsKoppelFilteroptionDailogComponent, selector: "app-beheer-products-koppel-filteroption-dailog", ngImport: i0, template: "<div *ngIf=\"Loading()\">\r\n  <app-fab-loader></app-fab-loader>\r\n</div>\r\n\r\n<div *ngIf=\"!Loading()\">\r\n  <mat-tab-group>\r\n    <mat-tab label=\"Nieuwe filter\">\r\n      <div class=\"bar\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Filter</mat-label>\r\n          <input matInput [(ngModel)]=\"FilterNaamNieuw\">\r\n        </mat-form-field>\r\n\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Optie</mat-label>\r\n          <input matInput (keyup)=\"handleKeyUpFilter($event)\" [(ngModel)]=\"FilterOptionNaamNieuw\">\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"NieuwFilterToevoegen()\">Toevoegen</button>\r\n      </div>\r\n    </mat-tab>\r\n    <mat-tab label=\"Nieuwe optie\">\r\n      <div class=\"bar\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Filter</mat-label>\r\n          <mat-select [(ngModel)]=\"FilterSelected\">\r\n            <mat-option *ngFor=\"let filter of FiltersViewModel.filterViewModels\" [value]=\"filter.id\">\r\n              {{filter.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Optie</mat-label>\r\n          <input matInput (keyup)=\"handleKeyUpFilterOption($event)\" [(ngModel)]=\"FilterOptionNaamNieuw\">\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"NieuwFilterOptionToevoegen()\">Toevoegen</button>\r\n      </div>\r\n    </mat-tab>\r\n    <mat-tab label=\"Bestaand\">\r\n\r\n      <div class=\"bar\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Filter</mat-label>\r\n          <mat-select [(ngModel)]=\"FilterSelected\">\r\n            <mat-option *ngFor=\"let filter of FiltersViewModel.filterViewModels\" [value]=\"filter.id\">\r\n              {{filter.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Optie</mat-label>\r\n          <mat-select [(ngModel)]=\"FilterOptionSelected\">\r\n            <mat-option *ngFor=\"let filteroption of GetSelectedFiltersOptions()\" [value]=\"filteroption.id\">\r\n              {{filteroption.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"BestaandToevoegen()\">Toevoegen</button>\r\n      </div>\r\n    </mat-tab>\r\n    <!--<mat-tab label=\"Many Name\">\r\n      <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n        <mat-label>Filter</mat-label>\r\n        <mat-select [(ngModel)]=\"FilterSelected\">\r\n          <mat-option *ngFor=\"let filter of FiltersViewModel.filterViewModels\" [value]=\"filter.id\">\r\n            {{filter.name}}\r\n          </mat-option>\r\n        </mat-select>\r\n      </mat-form-field>\r\n\r\n      <app-beheer-connect-manyname></app-beheer-connect-manyname>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"KoppelManyName()\">Koppel</button>\r\n      </div>\r\n    </mat-tab>-->\r\n  </mat-tab-group>\r\n\r\n  <div class=\"options-container\">\r\n    <!--<div *ngFor=\"let location of ConnectEigenschapOptieResponse.locations\">\r\n      <b>{{ location.location }}</b>\r\n      <div *ngFor=\"let ebo of location.ebos\">\r\n        {{ ebo }}\r\n      </div>\r\n    </div>-->\r\n  </div>\r\n</div>\r\n", styles: [".full-width{width:100%}.options-container{max-height:300px}.tool-bar{padding:2px}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i7.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i9.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { kind: "component", type: i9.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass"], exportAs: ["matTab"] }, { kind: "component", type: i10.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i11.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: FabLoaderComponent, selector: "app-fab-loader" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: BeheerProductsKoppelFilteroptionDailogComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'app-beheer-products-koppel-filteroption-dailog', template: "<div *ngIf=\"Loading()\">\r\n  <app-fab-loader></app-fab-loader>\r\n</div>\r\n\r\n<div *ngIf=\"!Loading()\">\r\n  <mat-tab-group>\r\n    <mat-tab label=\"Nieuwe filter\">\r\n      <div class=\"bar\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Filter</mat-label>\r\n          <input matInput [(ngModel)]=\"FilterNaamNieuw\">\r\n        </mat-form-field>\r\n\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Optie</mat-label>\r\n          <input matInput (keyup)=\"handleKeyUpFilter($event)\" [(ngModel)]=\"FilterOptionNaamNieuw\">\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"NieuwFilterToevoegen()\">Toevoegen</button>\r\n      </div>\r\n    </mat-tab>\r\n    <mat-tab label=\"Nieuwe optie\">\r\n      <div class=\"bar\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Filter</mat-label>\r\n          <mat-select [(ngModel)]=\"FilterSelected\">\r\n            <mat-option *ngFor=\"let filter of FiltersViewModel.filterViewModels\" [value]=\"filter.id\">\r\n              {{filter.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Optie</mat-label>\r\n          <input matInput (keyup)=\"handleKeyUpFilterOption($event)\" [(ngModel)]=\"FilterOptionNaamNieuw\">\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"NieuwFilterOptionToevoegen()\">Toevoegen</button>\r\n      </div>\r\n    </mat-tab>\r\n    <mat-tab label=\"Bestaand\">\r\n\r\n      <div class=\"bar\">\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Filter</mat-label>\r\n          <mat-select [(ngModel)]=\"FilterSelected\">\r\n            <mat-option *ngFor=\"let filter of FiltersViewModel.filterViewModels\" [value]=\"filter.id\">\r\n              {{filter.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n\r\n        <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n          <mat-label>Optie</mat-label>\r\n          <mat-select [(ngModel)]=\"FilterOptionSelected\">\r\n            <mat-option *ngFor=\"let filteroption of GetSelectedFiltersOptions()\" [value]=\"filteroption.id\">\r\n              {{filteroption.name}}\r\n            </mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n      </div>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"BestaandToevoegen()\">Toevoegen</button>\r\n      </div>\r\n    </mat-tab>\r\n    <!--<mat-tab label=\"Many Name\">\r\n      <mat-form-field appearance=\"fill\" class=\"full-width\">\r\n        <mat-label>Filter</mat-label>\r\n        <mat-select [(ngModel)]=\"FilterSelected\">\r\n          <mat-option *ngFor=\"let filter of FiltersViewModel.filterViewModels\" [value]=\"filter.id\">\r\n            {{filter.name}}\r\n          </mat-option>\r\n        </mat-select>\r\n      </mat-form-field>\r\n\r\n      <app-beheer-connect-manyname></app-beheer-connect-manyname>\r\n\r\n      <div class=\"bar tool-bar\">\r\n        <button mat-raised-button (click)=\"KoppelManyName()\">Koppel</button>\r\n      </div>\r\n    </mat-tab>-->\r\n  </mat-tab-group>\r\n\r\n  <div class=\"options-container\">\r\n    <!--<div *ngFor=\"let location of ConnectEigenschapOptieResponse.locations\">\r\n      <b>{{ location.location }}</b>\r\n      <div *ngFor=\"let ebo of location.ebos\">\r\n        {{ ebo }}\r\n      </div>\r\n    </div>-->\r\n  </div>\r\n</div>\r\n", styles: [".full-width{width:100%}.options-container{max-height:300px}.tool-bar{padding:2px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [MAT_DIALOG_DATA]
-                }] }, { type: FiltersApiClient }, { type: ProductsApiClient }, { type: ProductsService }]; } });
-
 class FabFilterComponent {
     constructor(FabrikantenService, TranslateService, ChangeDetectorRef) {
         this.FabrikantenService = FabrikantenService;
@@ -14399,8 +14436,8 @@ class FabActionmenuComponent {
         return false;
     }
     DownloadBestek() {
-        if (this.BestekService.fabProductBestek != null) {
-            this.FabrikantenService.DownloadBestek(this.BestekService.fabProductBestek.nativeElement.innerText);
+        if (this.BestekService.FabrikantenBestekViewModel.suf != null) {
+            this.FabrikantenService.DownloadBestek(this.BestekService.FabrikantenBestekViewModel.suf);
         }
         else {
             alert("Error: unabled to download specifications");
@@ -14414,6 +14451,14 @@ class FabActionmenuComponent {
             alert("Error: unabled to copy specifications");
         }
     }
+    CopyToClipBoardSUF() {
+        if (this.BestekService.FabrikantenBestekViewModel.suf != null) {
+            this.BestekService.CopyToClipboard(this.BestekService.FabrikantenBestekViewModel.suf);
+        }
+        else {
+            alert("Error: unabled to copy specifications");
+        }
+    }
     ShowSTABU() {
         return this.BestekService.FabrikantenBestekViewModel?.stabu != '' && this.BestekService.FabrikantenBestekViewModel?.stabu != undefined;
     }
@@ -14456,10 +14501,10 @@ class FabActionmenuComponent {
     }
 }
 FabActionmenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: FabActionmenuComponent, deps: [{ token: MobileService }, { token: FabrikantenService }, { token: TranslateService }, { token: BestekService }, { token: TextureService }, { token: SVGService }, { token: WebGLService }, { token: ToebehorenService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-FabActionmenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: FabActionmenuComponent, selector: "app-fab-actionmenu", inputs: { display: "display" }, ngImport: i0, template: "<div class=\"column\" *ngIf=\"Show3DButtons()\">\r\n  <button mat-stroked-button class=\"toolbar-button rfa-button\" (click)=\"DownloadRevit()\" *ngIf=\"WebGLService.HasNativeRFA()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRFALoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRFALoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button arkey-adomi-button\" (click)=\"FabrikantenService.DownloadARKEYAdomi(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadARKEYAdomiLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadARKEYAdomiLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"ARKEY Adomi\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button ifc-button\" (click)=\"FabrikantenService.DownloadIFC(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadIFCLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadIFCLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"IFC\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <!--<button mat-stroked-button class=\"toolbar-button revit-plugin-button\" (click)=\"FabrikantenService.DownloadRevitPlugin(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRevitPluginLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRevitPluginLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit (plugin)\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>-->\r\n  <button mat-stroked-button class=\"toolbar-button autocad-3d-button\" (click)=\"FabrikantenService.Download3DAutoCADDwg(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download3DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download3DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"3D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button dxf-3d-button\" (click)=\"FabrikantenService.Download3DDxf(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download3DDxfLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download3DDxfLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"3D Dxf\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLink3D()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"Show2DButtons()\">\r\n  <mat-form-field appearance=\"fill\">\r\n    <mat-label class=\"select-mat-label\">{{ TranslateService.GetActiveValue(\"Common\", \"Snede\") }}</mat-label>\r\n    <mat-select [(ngModel)]=\"SVGService.Snede\" (selectionChange)=\"RefreshSnede()\">\r\n      <mat-option *ngFor=\"let snede of SVGService.Snedes\" [value]=\"snede\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", snede) }}\r\n      </mat-option>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <mat-form-field appearance=\"fill\">\r\n    <mat-label class=\"select-mat-label\">{{ TranslateService.GetActiveValue(\"Common\", \"Schaal\") }}</mat-label>\r\n    <mat-select [(ngModel)]=\"SVGService.Schaal\" (selectionChange)=\"RefreshSchaal()\">\r\n      <mat-option [value]=\"'0'\">1:1</mat-option>\r\n      <mat-option [value]=\"'1'\">1:2</mat-option>\r\n      <mat-option [value]=\"'2'\">1:5</mat-option>\r\n      <mat-option [value]=\"'3'\">1:10</mat-option>\r\n      <mat-option [value]=\"'4'\">1:20</mat-option>\r\n      <mat-option [value]=\"'5'\">1:50</mat-option>\r\n      <mat-option [value]=\"'6'\">1:100</mat-option>\r\n      <mat-option [value]=\"'7'\">1:200</mat-option>\r\n      <mat-option [value]=\"'8'\">1:500</mat-option>\r\n      <mat-option [value]=\"'9'\">1:1000</mat-option>\r\n      <mat-option [value]=\"'10'\">1:2000</mat-option>\r\n      <mat-option [value]=\"'11'\">1:5000</mat-option>\r\n      <mat-option [value]=\"'12'\">1:10000</mat-option>\r\n      <mat-option [value]=\"'13'\">1:20000</mat-option>\r\n      <mat-option [value]=\"'14'\">1:50000</mat-option>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <button mat-stroked-button class=\"toolbar-button rfa-button\" (click)=\"DownloadRevit()\" *ngIf=\"SVGService.HasNativeRFA()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRFALoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRFALoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button arkey-adomi-button\" (click)=\"FabrikantenService.DownloadARKEYAdomi(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadARKEYAdomiLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadARKEYAdomiLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"ARKEY Adomi\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button ifc-button\" (click)=\"FabrikantenService.DownloadIFC(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadIFCLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadIFCLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"IFC\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button autocad-2d-button\" (click)=\"FabrikantenService.Download2DAutoCADDwg(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button dxf-2d-button\" (click)=\"FabrikantenService.Download2DDxf(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DDxfLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DDxfLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D Dxf\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLink2D()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"ShowBestekButtons()\">\r\n  <mat-button-toggle-group [value]=\"BestekService.TypeBestek\" (change)=\"BestekService.TypeBestek = $event.source.value\" appearance=\"legacy\">\r\n    <mat-button-toggle *ngIf=\"ShowSTABU()\" value=\"STABU\">{{ TranslateService.GetActiveValue(\"Common\", \"STABU\") }}</mat-button-toggle>\r\n    <mat-button-toggle *ngIf=\"ShowOSF()\" value=\"OSF\">{{ TranslateService.GetActiveValue(\"Common\", \"OSF\") }}</mat-button-toggle>\r\n    <mat-button-toggle *ngIf=\"ShowVrij()\" value=\"Vrij\">{{ TranslateService.GetActiveValue(\"Common\", \"Specification text\") }}</mat-button-toggle>\r\n  </mat-button-toggle-group>\r\n  <div>\r\n    &nbsp;\r\n  </div>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"CopyToClipBoard()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon content_copy\">content_copy</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Clipboard\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"DownloadBestek()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Download\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLinkBestek()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"ShowTextureButtons()\">\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenLink(TextureService.FabrikantenTextureViewModel.patroonURL)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Texture\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenLink(TextureService.FabrikantenTextureViewModel.bumpURL)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Bumpmap\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLinkTexture()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"ShowToebehorenButtons()\">\r\n  <mat-form-field appearance=\"fill\">\r\n    <mat-label class=\"select-mat-label\">Toebehoren</mat-label>\r\n    <mat-select [(ngModel)]=\"FabrikantenService.SelectedToebehoren\" (selectionChange)=\"ToebehorenService.OpenToebehoren(this.ChangeDetectorRef)\">\r\n      <ng-container *ngFor=\"let item of FabrikantenService.FabrikantenViewModel.selectedProduct.fabrikantenBCBProductViewModels[0].bcbProductToebehoren\">\r\n        <mat-option *ngIf=\"!item.bcbProduct\" [value]=\"item\">\r\n          {{ TranslateService.GetActiveValueBCBEigenschapToebehoren(item.id) }}\r\n        </mat-option>\r\n        <mat-option *ngIf=\"item.bcbProduct\" [value]=\"item\">\r\n          {{ item.name }}\r\n        </mat-option>\r\n      </ng-container>\r\n    </mat-select>\r\n  </mat-form-field>\r\n\r\n  <button mat-stroked-button class=\"toolbar-button arkey-adomi-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.DownloadARKEYAdomi(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadARKEYAdomiLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadARKEYAdomiLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"ARKEY Adomi\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button ifc-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.DownloadIFC(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadIFCLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadIFCLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"IFC\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <!--<button mat-stroked-button class=\"toolbar-button revit-plugin-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.DownloadRevitPlugin(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRevitPluginLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRevitPluginLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit (plugin)\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>-->\r\n  <button mat-stroked-button class=\"toolbar-button autocad-3d-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.Download3DAutoCADDwg(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download3DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download3DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"3D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button autocad-2d-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.Download2DAutoCADDwg(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button dxf-2d-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.Download2DDxf(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DDxfLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DDxfLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D Dxf\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n", styles: ["app-fab-actionmenu .mat-stroked-button{white-space:unset!important}app-fab-actionmenu .icon{margin-right:3px}app-fab-actionmenu .toolbar-button{margin-top:3px;width:100%}app-fab-actionmenu .row{display:flex;line-height:37px}app-fab-actionmenu .row-icon{align-items:center;display:flex}app-fab-actionmenu .column{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i7.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i14.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i14.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "component", type: i10.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i11.MatOption, selector: "mat-option", exportAs: ["matOption"] }], encapsulation: i0.ViewEncapsulation.None });
+FabActionmenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: FabActionmenuComponent, selector: "app-fab-actionmenu", inputs: { display: "display" }, ngImport: i0, template: "<div class=\"column\" *ngIf=\"Show3DButtons()\">\r\n  <button mat-stroked-button class=\"toolbar-button rfa-button\" (click)=\"DownloadRevit()\" *ngIf=\"WebGLService.HasNativeRFA()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRFALoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRFALoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button arkey-adomi-button\" (click)=\"FabrikantenService.DownloadARKEYAdomi(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadARKEYAdomiLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadARKEYAdomiLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"ARKEY Adomi\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button ifc-button\" (click)=\"FabrikantenService.DownloadIFC(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadIFCLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadIFCLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"IFC\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <!--<button mat-stroked-button class=\"toolbar-button revit-plugin-button\" (click)=\"FabrikantenService.DownloadRevitPlugin(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRevitPluginLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRevitPluginLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit (plugin)\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>-->\r\n  <button mat-stroked-button class=\"toolbar-button autocad-3d-button\" (click)=\"FabrikantenService.Download3DAutoCADDwg(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download3DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download3DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"3D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button dxf-3d-button\" (click)=\"FabrikantenService.Download3DDxf(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download3DDxfLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download3DDxfLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"3D Dxf\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLink3D()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"Show2DButtons()\">\r\n  <mat-form-field appearance=\"fill\">\r\n    <mat-label class=\"select-mat-label\">{{ TranslateService.GetActiveValue(\"Common\", \"Snede\") }}</mat-label>\r\n    <mat-select [(ngModel)]=\"SVGService.Snede\" (selectionChange)=\"RefreshSnede()\">\r\n      <mat-option *ngFor=\"let snede of SVGService.Snedes\" [value]=\"snede\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", snede) }}\r\n      </mat-option>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <mat-form-field appearance=\"fill\">\r\n    <mat-label class=\"select-mat-label\">{{ TranslateService.GetActiveValue(\"Common\", \"Schaal\") }}</mat-label>\r\n    <mat-select [(ngModel)]=\"SVGService.Schaal\" (selectionChange)=\"RefreshSchaal()\">\r\n      <mat-option [value]=\"'0'\">1:1</mat-option>\r\n      <mat-option [value]=\"'1'\">1:2</mat-option>\r\n      <mat-option [value]=\"'2'\">1:5</mat-option>\r\n      <mat-option [value]=\"'3'\">1:10</mat-option>\r\n      <mat-option [value]=\"'4'\">1:20</mat-option>\r\n      <mat-option [value]=\"'5'\">1:50</mat-option>\r\n      <mat-option [value]=\"'6'\">1:100</mat-option>\r\n      <mat-option [value]=\"'7'\">1:200</mat-option>\r\n      <mat-option [value]=\"'8'\">1:500</mat-option>\r\n      <mat-option [value]=\"'9'\">1:1000</mat-option>\r\n      <mat-option [value]=\"'10'\">1:2000</mat-option>\r\n      <mat-option [value]=\"'11'\">1:5000</mat-option>\r\n      <mat-option [value]=\"'12'\">1:10000</mat-option>\r\n      <mat-option [value]=\"'13'\">1:20000</mat-option>\r\n      <mat-option [value]=\"'14'\">1:50000</mat-option>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <button mat-stroked-button class=\"toolbar-button rfa-button\" (click)=\"DownloadRevit()\" *ngIf=\"SVGService.HasNativeRFA()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRFALoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRFALoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button arkey-adomi-button\" (click)=\"FabrikantenService.DownloadARKEYAdomi(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadARKEYAdomiLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadARKEYAdomiLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"ARKEY Adomi\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button ifc-button\" (click)=\"FabrikantenService.DownloadIFC(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadIFCLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadIFCLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"IFC\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button autocad-2d-button\" (click)=\"FabrikantenService.Download2DAutoCADDwg(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button dxf-2d-button\" (click)=\"FabrikantenService.Download2DDxf(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DDxfLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DDxfLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D Dxf\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLink2D()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"ShowBestekButtons()\">\r\n  <mat-button-toggle-group [value]=\"BestekService.TypeBestek\" (change)=\"BestekService.TypeBestek = $event.source.value\" appearance=\"legacy\">\r\n    <mat-button-toggle *ngIf=\"ShowSTABU()\" value=\"STABU\">{{ TranslateService.GetActiveValue(\"Common\", \"STABU\") }}</mat-button-toggle>\r\n    <mat-button-toggle *ngIf=\"ShowOSF()\" value=\"OSF\">{{ TranslateService.GetActiveValue(\"Common\", \"OSF\") }}</mat-button-toggle>\r\n    <mat-button-toggle *ngIf=\"ShowVrij()\" value=\"Vrij\">{{ TranslateService.GetActiveValue(\"Common\", \"Specification text\") }}</mat-button-toggle>\r\n  </mat-button-toggle-group>\r\n  <div>\r\n    &nbsp;\r\n  </div>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"CopyToClipBoard()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon content_copy\">content_copy</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Clipboard\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"CopyToClipBoardSUF()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon content_copy\">content_copy</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"ClipboardSUF\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"DownloadBestek()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Download\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLinkBestek()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"ShowTextureButtons()\">\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenLink(TextureService.FabrikantenTextureViewModel.patroonURL)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Texture\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenLink(TextureService.FabrikantenTextureViewModel.bumpURL)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Bumpmap\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLinkTexture()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"ShowToebehorenButtons()\">\r\n  <mat-form-field appearance=\"fill\">\r\n    <mat-label class=\"select-mat-label\">Toebehoren</mat-label>\r\n    <mat-select [(ngModel)]=\"FabrikantenService.SelectedToebehoren\" (selectionChange)=\"ToebehorenService.OpenToebehoren(this.ChangeDetectorRef)\">\r\n      <ng-container *ngFor=\"let item of FabrikantenService.FabrikantenViewModel.selectedProduct.fabrikantenBCBProductViewModels[0].bcbProductToebehoren\">\r\n        <mat-option *ngIf=\"!item.bcbProduct\" [value]=\"item\">\r\n          {{ TranslateService.GetActiveValueBCBEigenschapToebehoren(item.id) }}\r\n        </mat-option>\r\n        <mat-option *ngIf=\"item.bcbProduct\" [value]=\"item\">\r\n          {{ item.name }}\r\n        </mat-option>\r\n      </ng-container>\r\n    </mat-select>\r\n  </mat-form-field>\r\n\r\n  <button mat-stroked-button class=\"toolbar-button arkey-adomi-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.DownloadARKEYAdomi(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadARKEYAdomiLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadARKEYAdomiLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"ARKEY Adomi\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button ifc-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.DownloadIFC(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadIFCLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadIFCLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"IFC\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <!--<button mat-stroked-button class=\"toolbar-button revit-plugin-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.DownloadRevitPlugin(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRevitPluginLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRevitPluginLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit (plugin)\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>-->\r\n  <button mat-stroked-button class=\"toolbar-button autocad-3d-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.Download3DAutoCADDwg(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download3DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download3DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"3D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button autocad-2d-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.Download2DAutoCADDwg(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button dxf-2d-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.Download2DDxf(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DDxfLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DDxfLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D Dxf\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n", styles: ["app-fab-actionmenu .mat-stroked-button{white-space:unset!important}app-fab-actionmenu .icon{margin-right:3px}app-fab-actionmenu .toolbar-button{margin-top:3px;width:100%}app-fab-actionmenu .row{display:flex;line-height:37px}app-fab-actionmenu .row-icon{align-items:center;display:flex}app-fab-actionmenu .column{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i7.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i14.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i14.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "component", type: i10.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i11.MatOption, selector: "mat-option", exportAs: ["matOption"] }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: FabActionmenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-fab-actionmenu', encapsulation: ViewEncapsulation.None, template: "<div class=\"column\" *ngIf=\"Show3DButtons()\">\r\n  <button mat-stroked-button class=\"toolbar-button rfa-button\" (click)=\"DownloadRevit()\" *ngIf=\"WebGLService.HasNativeRFA()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRFALoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRFALoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button arkey-adomi-button\" (click)=\"FabrikantenService.DownloadARKEYAdomi(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadARKEYAdomiLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadARKEYAdomiLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"ARKEY Adomi\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button ifc-button\" (click)=\"FabrikantenService.DownloadIFC(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadIFCLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadIFCLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"IFC\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <!--<button mat-stroked-button class=\"toolbar-button revit-plugin-button\" (click)=\"FabrikantenService.DownloadRevitPlugin(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRevitPluginLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRevitPluginLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit (plugin)\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>-->\r\n  <button mat-stroked-button class=\"toolbar-button autocad-3d-button\" (click)=\"FabrikantenService.Download3DAutoCADDwg(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download3DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download3DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"3D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button dxf-3d-button\" (click)=\"FabrikantenService.Download3DDxf(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download3DDxfLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download3DDxfLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"3D Dxf\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLink3D()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"Show2DButtons()\">\r\n  <mat-form-field appearance=\"fill\">\r\n    <mat-label class=\"select-mat-label\">{{ TranslateService.GetActiveValue(\"Common\", \"Snede\") }}</mat-label>\r\n    <mat-select [(ngModel)]=\"SVGService.Snede\" (selectionChange)=\"RefreshSnede()\">\r\n      <mat-option *ngFor=\"let snede of SVGService.Snedes\" [value]=\"snede\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", snede) }}\r\n      </mat-option>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <mat-form-field appearance=\"fill\">\r\n    <mat-label class=\"select-mat-label\">{{ TranslateService.GetActiveValue(\"Common\", \"Schaal\") }}</mat-label>\r\n    <mat-select [(ngModel)]=\"SVGService.Schaal\" (selectionChange)=\"RefreshSchaal()\">\r\n      <mat-option [value]=\"'0'\">1:1</mat-option>\r\n      <mat-option [value]=\"'1'\">1:2</mat-option>\r\n      <mat-option [value]=\"'2'\">1:5</mat-option>\r\n      <mat-option [value]=\"'3'\">1:10</mat-option>\r\n      <mat-option [value]=\"'4'\">1:20</mat-option>\r\n      <mat-option [value]=\"'5'\">1:50</mat-option>\r\n      <mat-option [value]=\"'6'\">1:100</mat-option>\r\n      <mat-option [value]=\"'7'\">1:200</mat-option>\r\n      <mat-option [value]=\"'8'\">1:500</mat-option>\r\n      <mat-option [value]=\"'9'\">1:1000</mat-option>\r\n      <mat-option [value]=\"'10'\">1:2000</mat-option>\r\n      <mat-option [value]=\"'11'\">1:5000</mat-option>\r\n      <mat-option [value]=\"'12'\">1:10000</mat-option>\r\n      <mat-option [value]=\"'13'\">1:20000</mat-option>\r\n      <mat-option [value]=\"'14'\">1:50000</mat-option>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <button mat-stroked-button class=\"toolbar-button rfa-button\" (click)=\"DownloadRevit()\" *ngIf=\"SVGService.HasNativeRFA()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRFALoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRFALoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button arkey-adomi-button\" (click)=\"FabrikantenService.DownloadARKEYAdomi(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadARKEYAdomiLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadARKEYAdomiLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"ARKEY Adomi\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button ifc-button\" (click)=\"FabrikantenService.DownloadIFC(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadIFCLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadIFCLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"IFC\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button autocad-2d-button\" (click)=\"FabrikantenService.Download2DAutoCADDwg(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button dxf-2d-button\" (click)=\"FabrikantenService.Download2DDxf(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DDxfLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DDxfLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D Dxf\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLink2D()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"ShowBestekButtons()\">\r\n  <mat-button-toggle-group [value]=\"BestekService.TypeBestek\" (change)=\"BestekService.TypeBestek = $event.source.value\" appearance=\"legacy\">\r\n    <mat-button-toggle *ngIf=\"ShowSTABU()\" value=\"STABU\">{{ TranslateService.GetActiveValue(\"Common\", \"STABU\") }}</mat-button-toggle>\r\n    <mat-button-toggle *ngIf=\"ShowOSF()\" value=\"OSF\">{{ TranslateService.GetActiveValue(\"Common\", \"OSF\") }}</mat-button-toggle>\r\n    <mat-button-toggle *ngIf=\"ShowVrij()\" value=\"Vrij\">{{ TranslateService.GetActiveValue(\"Common\", \"Specification text\") }}</mat-button-toggle>\r\n  </mat-button-toggle-group>\r\n  <div>\r\n    &nbsp;\r\n  </div>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"CopyToClipBoard()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon content_copy\">content_copy</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Clipboard\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"DownloadBestek()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Download\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLinkBestek()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"ShowTextureButtons()\">\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenLink(TextureService.FabrikantenTextureViewModel.patroonURL)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Texture\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenLink(TextureService.FabrikantenTextureViewModel.bumpURL)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Bumpmap\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLinkTexture()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"ShowToebehorenButtons()\">\r\n  <mat-form-field appearance=\"fill\">\r\n    <mat-label class=\"select-mat-label\">Toebehoren</mat-label>\r\n    <mat-select [(ngModel)]=\"FabrikantenService.SelectedToebehoren\" (selectionChange)=\"ToebehorenService.OpenToebehoren(this.ChangeDetectorRef)\">\r\n      <ng-container *ngFor=\"let item of FabrikantenService.FabrikantenViewModel.selectedProduct.fabrikantenBCBProductViewModels[0].bcbProductToebehoren\">\r\n        <mat-option *ngIf=\"!item.bcbProduct\" [value]=\"item\">\r\n          {{ TranslateService.GetActiveValueBCBEigenschapToebehoren(item.id) }}\r\n        </mat-option>\r\n        <mat-option *ngIf=\"item.bcbProduct\" [value]=\"item\">\r\n          {{ item.name }}\r\n        </mat-option>\r\n      </ng-container>\r\n    </mat-select>\r\n  </mat-form-field>\r\n\r\n  <button mat-stroked-button class=\"toolbar-button arkey-adomi-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.DownloadARKEYAdomi(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadARKEYAdomiLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadARKEYAdomiLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"ARKEY Adomi\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button ifc-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.DownloadIFC(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadIFCLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadIFCLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"IFC\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <!--<button mat-stroked-button class=\"toolbar-button revit-plugin-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.DownloadRevitPlugin(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRevitPluginLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRevitPluginLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit (plugin)\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>-->\r\n  <button mat-stroked-button class=\"toolbar-button autocad-3d-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.Download3DAutoCADDwg(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download3DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download3DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"3D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button autocad-2d-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.Download2DAutoCADDwg(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button dxf-2d-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.Download2DDxf(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DDxfLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DDxfLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D Dxf\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n", styles: ["app-fab-actionmenu .mat-stroked-button{white-space:unset!important}app-fab-actionmenu .icon{margin-right:3px}app-fab-actionmenu .toolbar-button{margin-top:3px;width:100%}app-fab-actionmenu .row{display:flex;line-height:37px}app-fab-actionmenu .row-icon{align-items:center;display:flex}app-fab-actionmenu .column{display:flex;flex-direction:column}\n"] }]
+            args: [{ selector: 'app-fab-actionmenu', encapsulation: ViewEncapsulation.None, template: "<div class=\"column\" *ngIf=\"Show3DButtons()\">\r\n  <button mat-stroked-button class=\"toolbar-button rfa-button\" (click)=\"DownloadRevit()\" *ngIf=\"WebGLService.HasNativeRFA()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRFALoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRFALoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button arkey-adomi-button\" (click)=\"FabrikantenService.DownloadARKEYAdomi(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadARKEYAdomiLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadARKEYAdomiLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"ARKEY Adomi\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button ifc-button\" (click)=\"FabrikantenService.DownloadIFC(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadIFCLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadIFCLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"IFC\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <!--<button mat-stroked-button class=\"toolbar-button revit-plugin-button\" (click)=\"FabrikantenService.DownloadRevitPlugin(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRevitPluginLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRevitPluginLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit (plugin)\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>-->\r\n  <button mat-stroked-button class=\"toolbar-button autocad-3d-button\" (click)=\"FabrikantenService.Download3DAutoCADDwg(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download3DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download3DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"3D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button dxf-3d-button\" (click)=\"FabrikantenService.Download3DDxf(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download3DDxfLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download3DDxfLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"3D Dxf\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLink3D()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"Show2DButtons()\">\r\n  <mat-form-field appearance=\"fill\">\r\n    <mat-label class=\"select-mat-label\">{{ TranslateService.GetActiveValue(\"Common\", \"Snede\") }}</mat-label>\r\n    <mat-select [(ngModel)]=\"SVGService.Snede\" (selectionChange)=\"RefreshSnede()\">\r\n      <mat-option *ngFor=\"let snede of SVGService.Snedes\" [value]=\"snede\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", snede) }}\r\n      </mat-option>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <mat-form-field appearance=\"fill\">\r\n    <mat-label class=\"select-mat-label\">{{ TranslateService.GetActiveValue(\"Common\", \"Schaal\") }}</mat-label>\r\n    <mat-select [(ngModel)]=\"SVGService.Schaal\" (selectionChange)=\"RefreshSchaal()\">\r\n      <mat-option [value]=\"'0'\">1:1</mat-option>\r\n      <mat-option [value]=\"'1'\">1:2</mat-option>\r\n      <mat-option [value]=\"'2'\">1:5</mat-option>\r\n      <mat-option [value]=\"'3'\">1:10</mat-option>\r\n      <mat-option [value]=\"'4'\">1:20</mat-option>\r\n      <mat-option [value]=\"'5'\">1:50</mat-option>\r\n      <mat-option [value]=\"'6'\">1:100</mat-option>\r\n      <mat-option [value]=\"'7'\">1:200</mat-option>\r\n      <mat-option [value]=\"'8'\">1:500</mat-option>\r\n      <mat-option [value]=\"'9'\">1:1000</mat-option>\r\n      <mat-option [value]=\"'10'\">1:2000</mat-option>\r\n      <mat-option [value]=\"'11'\">1:5000</mat-option>\r\n      <mat-option [value]=\"'12'\">1:10000</mat-option>\r\n      <mat-option [value]=\"'13'\">1:20000</mat-option>\r\n      <mat-option [value]=\"'14'\">1:50000</mat-option>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <button mat-stroked-button class=\"toolbar-button rfa-button\" (click)=\"DownloadRevit()\" *ngIf=\"SVGService.HasNativeRFA()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRFALoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRFALoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button arkey-adomi-button\" (click)=\"FabrikantenService.DownloadARKEYAdomi(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadARKEYAdomiLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadARKEYAdomiLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"ARKEY Adomi\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button ifc-button\" (click)=\"FabrikantenService.DownloadIFC(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadIFCLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadIFCLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"IFC\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button autocad-2d-button\" (click)=\"FabrikantenService.Download2DAutoCADDwg(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button dxf-2d-button\" (click)=\"FabrikantenService.Download2DDxf(undefined)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DDxfLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DDxfLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D Dxf\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLink2D()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"ShowBestekButtons()\">\r\n  <mat-button-toggle-group [value]=\"BestekService.TypeBestek\" (change)=\"BestekService.TypeBestek = $event.source.value\" appearance=\"legacy\">\r\n    <mat-button-toggle *ngIf=\"ShowSTABU()\" value=\"STABU\">{{ TranslateService.GetActiveValue(\"Common\", \"STABU\") }}</mat-button-toggle>\r\n    <mat-button-toggle *ngIf=\"ShowOSF()\" value=\"OSF\">{{ TranslateService.GetActiveValue(\"Common\", \"OSF\") }}</mat-button-toggle>\r\n    <mat-button-toggle *ngIf=\"ShowVrij()\" value=\"Vrij\">{{ TranslateService.GetActiveValue(\"Common\", \"Specification text\") }}</mat-button-toggle>\r\n  </mat-button-toggle-group>\r\n  <div>\r\n    &nbsp;\r\n  </div>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"CopyToClipBoard()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon content_copy\">content_copy</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Clipboard\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"CopyToClipBoardSUF()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon content_copy\">content_copy</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"ClipboardSUF\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"DownloadBestek()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Download\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLinkBestek()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"ShowTextureButtons()\">\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenLink(TextureService.FabrikantenTextureViewModel.patroonURL)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Texture\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenLink(TextureService.FabrikantenTextureViewModel.bumpURL)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"Bumpmap\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button\" (click)=\"OpenBCBLinkTexture()\" *ngIf=\"ShowBCBButton()\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon open_in_new\">open_in_new</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        {{ TranslateService.GetActiveValue(\"Common\", \"BCB\") }}\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n\r\n<div class=\"column\" *ngIf=\"ShowToebehorenButtons()\">\r\n  <mat-form-field appearance=\"fill\">\r\n    <mat-label class=\"select-mat-label\">Toebehoren</mat-label>\r\n    <mat-select [(ngModel)]=\"FabrikantenService.SelectedToebehoren\" (selectionChange)=\"ToebehorenService.OpenToebehoren(this.ChangeDetectorRef)\">\r\n      <ng-container *ngFor=\"let item of FabrikantenService.FabrikantenViewModel.selectedProduct.fabrikantenBCBProductViewModels[0].bcbProductToebehoren\">\r\n        <mat-option *ngIf=\"!item.bcbProduct\" [value]=\"item\">\r\n          {{ TranslateService.GetActiveValueBCBEigenschapToebehoren(item.id) }}\r\n        </mat-option>\r\n        <mat-option *ngIf=\"item.bcbProduct\" [value]=\"item\">\r\n          {{ item.name }}\r\n        </mat-option>\r\n      </ng-container>\r\n    </mat-select>\r\n  </mat-form-field>\r\n\r\n  <button mat-stroked-button class=\"toolbar-button arkey-adomi-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.DownloadARKEYAdomi(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadARKEYAdomiLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadARKEYAdomiLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"ARKEY Adomi\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button ifc-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.DownloadIFC(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadIFCLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadIFCLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"IFC\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <!--<button mat-stroked-button class=\"toolbar-button revit-plugin-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.DownloadRevitPlugin(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.DownloadRevitPluginLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.DownloadRevitPluginLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"Revit (plugin)\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>-->\r\n  <button mat-stroked-button class=\"toolbar-button autocad-3d-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.Download3DAutoCADDwg(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download3DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download3DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"3D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button autocad-2d-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.Download2DAutoCADDwg(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DAutoCADDwgLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DAutoCADDwgLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D AutoCAD Dwg\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n  <button mat-stroked-button class=\"toolbar-button dxf-2d-button\" *ngIf=\"FabrikantenService.GetSelectedToebehoren() != null\" (click)=\"FabrikantenService.Download2DDxf(FabrikantenService.GetSelectedToebehoren()?.bcbeboId)\">\r\n    <div class=\"row\">\r\n      <div class=\"row-icon\">\r\n        <mat-icon class=\"icon file_download\">file_download</mat-icon>\r\n      </div>\r\n      <div class=\"row-title\">\r\n        <span *ngIf=\"FabrikantenService.Download2DDxfLoading\">...</span>\r\n        <span *ngIf=\"!FabrikantenService.Download2DDxfLoading\">{{ TranslateService.GetActiveValue(\"Common\", \"2D Dxf\") }}</span>\r\n      </div>\r\n    </div>\r\n  </button>\r\n</div>\r\n", styles: ["app-fab-actionmenu .mat-stroked-button{white-space:unset!important}app-fab-actionmenu .icon{margin-right:3px}app-fab-actionmenu .toolbar-button{margin-top:3px;width:100%}app-fab-actionmenu .row{display:flex;line-height:37px}app-fab-actionmenu .row-icon{align-items:center;display:flex}app-fab-actionmenu .column{display:flex;flex-direction:column}\n"] }]
         }], ctorParameters: function () { return [{ type: MobileService }, { type: FabrikantenService }, { type: TranslateService }, { type: BestekService }, { type: TextureService }, { type: SVGService }, { type: WebGLService }, { type: ToebehorenService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { display: [{
                 type: Input
             }] } });