@smartbit4all/ng-client 6.0.54 → 6.0.56

package/fesm2022/smartbit4all-ng-client.mjs

@@ -7547,7 +7547,7 @@ class SmartfileuploaderComponent {
             this.files = [validFiles[0]];
         }
         if (this.autoUpload && this.errors.length == 0) {
-            this.uploadFile();
+            this.uploadFile(null);
         }
     }
     getFile(event) {
@@ -7589,7 +7589,10 @@ class SmartfileuploaderComponent {
     remove(index) {
         this.files.splice(index, 1);
     }
-    uploadFile() {
+    uploadFile(event) {
+        if (event && event.event) {
+            event.event.stopPropagation();
+        }
         this.uploadCallback(this.files);
     }
     formatSize(bytes) {
@@ -7649,11 +7652,11 @@ class SmartfileuploaderComponent {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartfileuploaderComponent, deps: [{ token: i1$4.MatSnackBar }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartfileuploaderComponent, selector: "smartfileuploader", inputs: { uploadCallback: "uploadCallback", fileFormats: "fileFormats", maxSizeMb: "maxSizeMb", i18n: "i18n", useIconButton: "useIconButton", isMultiple: "isMultiple", autoUpload: "autoUpload", isDisabled: "isDisabled" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div\r\n  class=\"container\"\r\n  [ngClass]=\"{ disabledWidget: isDisabled }\"\r\n  (dragover)=\"onDragOver($event)\"\r\n  (dragleave)=\"onDragLeave($event)\"\r\n  (drop)=\"onDrop($event)\"\r\n  [class.dragover]=\"isDragOver\"\r\n>\r\n  <div class=\"fileContainer\" (click)=\"fileInput.click()\">\r\n    <input\r\n      #fileInput\r\n      id=\"addFile\"\r\n      placeholder=\"fileInput\"\r\n      type=\"file\"\r\n      (change)=\"getFile($event)\"\r\n      class=\"file\"\r\n      accept=\"{{ fileFormats?.join(', ') }}\"\r\n      [size]=\"maxSizeMb\"\r\n      [multiple]=\"isMultiple\"\r\n      [disabled]=\"isDisabled\"\r\n      style=\"display: none\"\r\n    />\r\n    <div class=\"fileUploadContentContainer\">\r\n      <div class=\"icon\">\r\n        <mat-label *ngIf=\"useIconButton\" class=\"addFileButton\">\r\n          <mat-icon color=\"primary\" class=\"addCircle\">add_circle</mat-icon>\r\n        </mat-label>\r\n        <button *ngIf=\"!useIconButton\" mat-raised-button color=\"primary\" class=\"addFileButton\">\r\n          {{ i18n!.addFile }}\r\n        </button>\r\n      </div>\r\n      <div class=\"labels\">\r\n        <mat-label *ngIf=\"useIconButton\" class=\"label primary title\">\r\n          {{ i18n!.addFile }}\r\n        </mat-label>\r\n        <mat-label class=\"label secondary\"> {{ i18n!.browseOrDrag }} </mat-label>\r\n        <mat-label class=\"subLabel primary\"> {{ i18n!.maxSize }} </mat-label>\r\n        <mat-label class=\"subLabel primary\"> {{ i18n!.formats }} </mat-label>\r\n      </div>\r\n      <div class=\"uploadButton\" *ngIf=\"files.length\">\r\n        <ui-action-button\r\n          (actionClick)=\"uploadFile()\"\r\n          [code]=\"'default-upload'\"\r\n          [descriptor]=\"uploadButton\"\r\n        >\r\n        </ui-action-button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"errors.length\" class=\"errorMessage\">\r\n    <smart-icon [icon]=\"'error'\" [color]=\"'warn'\"></smart-icon>\r\n    <div class=\"errors\">\r\n      <span *ngFor=\"let error of errors\">{{ error }}</span>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"files.length\" class=\"uploadedFilesContainer\">\r\n    <div *ngFor=\"let file of files; let i = index\" class=\"uploadedFile\">\r\n      <ng-container *ngIf=\"filePreviewUrl(file); else fileIcon\">\r\n        <img [src]=\"filePreviewUrl(file)\" [alt]=\"file.name\" width=\"50\" height=\"50\" />\r\n      </ng-container>\r\n      <ng-template #fileIcon>\r\n        <smart-icon [icon]=\"'insert_drive_file'\"></smart-icon>\r\n      </ng-template>\r\n\r\n      <div class=\"fileData\">\r\n        <div class=\"fileDataContainer\">\r\n          <span class=\"fileName\">{{ file.name }}</span>\r\n          <span class=\"fileSize\">{{ formatSize(file.size) }}</span>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"fileActions\">\r\n        <smart-icon\r\n          class=\"downloadIcon\"\r\n          icon=\"download\"\r\n          (click)=\"downloadFile(file)\"\r\n          [attr.data-testid]=\"'default_download'\"\r\n        ></smart-icon>\r\n        <smart-icon\r\n          class=\"removeIcon\"\r\n          icon=\"delete\"\r\n          [attr.data-testid]=\"'default_remove'\"\r\n          (click)=\"remove(i)\"\r\n        ></smart-icon>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [":host{--border-color: #a6aabd60;--warninig-color: #be2d2e;--def-border-radius: .5rem}.container{display:flex;flex-direction:column;border:2px dashed var(--border-color);border-radius:var(--def-border-radius)}.fileContainer{cursor:pointer;padding:1rem;display:flex;flex-direction:column}.fileContainer:hover{background-color:rgb(from var(--border-color) r g b / .1)}.disabledWidget ::ng-deep .fileContainer:hover{background-color:unset;cursor:unset}.disabledWidget ::ng-deep *{opacity:.85}.dragover{background-color:rgb(from var(--border-color) r g b / .1)}.fileUploadContentContainer{display:flex;flex-direction:row;gap:1rem}.icon mat-icon{font-size:3rem;width:unset;height:unset}.icon{align-content:center}.labels{flex:1;display:flex;flex-direction:column;justify-content:center;width:fit-content}.uploadButton{align-content:center}.primary{color:var(--primary-color)}.secondary{color:var(--gray)}.label{margin:unset}.subLabel{font-size:smaller}.title{padding-bottom:.3rem}.errorMessage,.uploadedFilesContainer{border-top:2px solid var(--border-color)}.errorMessage{display:flex;flex-direction:row;align-items:center;color:var(--warninig-color);padding:.5rem 1rem;gap:1rem}.errorMessage ::ng-deep mat-icon{color:var(--warninig-color)}.errors{display:flex;flex-direction:column}.uploadedFile{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;padding:1rem;border-bottom:1px solid #e0e0e0;gap:1rem}.uploadedFile:last-child{border-bottom:none}.fileSize{display:flex;flex-direction:row;font-size:smaller}.fileData{flex:1;display:flex;flex-direction:column}.fileDataContainer{display:flex;flex-direction:column;justify-content:flex-end;width:fit-content}.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}smart-icon ::ng-deep mat-icon{font-size:3rem;width:unset;height:unset}.fileActions{display:flex;flex-direction:row;justify-content:flex-end;gap:.5rem}.fileActions ::ng-deep .pi{width:unset!important}.removeIcon ::ng-deep i,.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}.removeIcon ::ng-deep .pi,.downloadIcon ::ng-deep .pi{font-size:1.5rem!important}.removeIcon ::ng-deep mat-icon,.downloadIcon ::ng-deep mat-icon{font-size:2rem}.removeIcon:hover,.downloadIcon:hover{cursor:pointer}smart-icon{display:flex;align-items:center}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "directive", type: i11.MatLabel, selector: "mat-label" }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "identifier", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartfileuploaderComponent, selector: "smartfileuploader", inputs: { uploadCallback: "uploadCallback", fileFormats: "fileFormats", maxSizeMb: "maxSizeMb", i18n: "i18n", useIconButton: "useIconButton", isMultiple: "isMultiple", autoUpload: "autoUpload", isDisabled: "isDisabled" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div\r\n  class=\"container\"\r\n  [ngClass]=\"{ disabledWidget: isDisabled }\"\r\n  (dragover)=\"onDragOver($event)\"\r\n  (dragleave)=\"onDragLeave($event)\"\r\n  (drop)=\"onDrop($event)\"\r\n  [class.dragover]=\"isDragOver\"\r\n>\r\n  <div class=\"fileContainer\" (click)=\"fileInput.click()\">\r\n    <input\r\n      #fileInput\r\n      id=\"addFile\"\r\n      placeholder=\"fileInput\"\r\n      type=\"file\"\r\n      (change)=\"getFile($event)\"\r\n      class=\"file\"\r\n      accept=\"{{ fileFormats?.join(', ') }}\"\r\n      [size]=\"maxSizeMb\"\r\n      [multiple]=\"isMultiple\"\r\n      [disabled]=\"isDisabled\"\r\n      style=\"display: none\"\r\n    />\r\n    <div class=\"fileUploadContentContainer\">\r\n      <div class=\"icon\">\r\n        <mat-label *ngIf=\"useIconButton\" class=\"addFileButton\">\r\n          <mat-icon color=\"primary\" class=\"addCircle\">add_circle</mat-icon>\r\n        </mat-label>\r\n        <button *ngIf=\"!useIconButton\" mat-raised-button color=\"primary\" class=\"addFileButton\">\r\n          {{ i18n!.addFile }}\r\n        </button>\r\n      </div>\r\n      <div class=\"labels\">\r\n        <mat-label *ngIf=\"useIconButton\" class=\"label primary title\">\r\n          {{ i18n!.addFile }}\r\n        </mat-label>\r\n        <mat-label class=\"label secondary\"> {{ i18n!.browseOrDrag }} </mat-label>\r\n        <mat-label class=\"subLabel primary\"> {{ i18n!.maxSize }} </mat-label>\r\n        <mat-label class=\"subLabel primary\"> {{ i18n!.formats }} </mat-label>\r\n      </div>\r\n      <div class=\"uploadButton\" *ngIf=\"files.length\">\r\n        <ui-action-button\r\n          (actionClick)=\"uploadFile($event)\"\r\n          [code]=\"'default-upload'\"\r\n          [descriptor]=\"uploadButton\"\r\n        >\r\n        </ui-action-button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"errors.length\" class=\"errorMessage\">\r\n    <smart-icon [icon]=\"'error'\" [color]=\"'warn'\"></smart-icon>\r\n    <div class=\"errors\">\r\n      <span *ngFor=\"let error of errors\">{{ error }}</span>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"files.length\" class=\"uploadedFilesContainer\">\r\n    <div *ngFor=\"let file of files; let i = index\" class=\"uploadedFile\">\r\n      <ng-container *ngIf=\"filePreviewUrl(file); else fileIcon\">\r\n        <img [src]=\"filePreviewUrl(file)\" [alt]=\"file.name\" width=\"50\" height=\"50\" />\r\n      </ng-container>\r\n      <ng-template #fileIcon>\r\n        <smart-icon [icon]=\"'insert_drive_file'\"></smart-icon>\r\n      </ng-template>\r\n\r\n      <div class=\"fileData\">\r\n        <div class=\"fileDataContainer\">\r\n          <span class=\"fileName\">{{ file.name }}</span>\r\n          <span class=\"fileSize\">{{ formatSize(file.size) }}</span>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"fileActions\">\r\n        <smart-icon\r\n          class=\"downloadIcon\"\r\n          icon=\"download\"\r\n          (click)=\"downloadFile(file)\"\r\n          [attr.data-testid]=\"'default_download'\"\r\n        ></smart-icon>\r\n        <smart-icon\r\n          class=\"removeIcon\"\r\n          icon=\"delete\"\r\n          [attr.data-testid]=\"'default_remove'\"\r\n          (click)=\"remove(i)\"\r\n        ></smart-icon>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [":host{--border-color: #a6aabd60;--warninig-color: #be2d2e;--def-border-radius: .5rem}.container{display:flex;flex-direction:column;border:2px dashed var(--border-color);border-radius:var(--def-border-radius)}.fileContainer{cursor:pointer;padding:1rem;display:flex;flex-direction:column}.fileContainer:hover{background-color:rgb(from var(--border-color) r g b / .1)}.disabledWidget ::ng-deep .fileContainer:hover{background-color:unset;cursor:unset}.disabledWidget ::ng-deep *{opacity:.85}.dragover{background-color:rgb(from var(--border-color) r g b / .1)}.fileUploadContentContainer{display:flex;flex-direction:row;gap:1rem}.icon mat-icon{font-size:3rem;width:unset;height:unset}.icon{align-content:center}.labels{flex:1;display:flex;flex-direction:column;justify-content:center;width:fit-content}.uploadButton{align-content:center}.primary{color:var(--primary-color)}.secondary{color:var(--gray)}.label{margin:unset}.subLabel{font-size:smaller}.title{padding-bottom:.3rem}.errorMessage,.uploadedFilesContainer{border-top:2px solid var(--border-color)}.errorMessage{display:flex;flex-direction:row;align-items:center;color:var(--warninig-color);padding:.5rem 1rem;gap:1rem}.errorMessage ::ng-deep mat-icon{color:var(--warninig-color)}.errors{display:flex;flex-direction:column}.uploadedFile{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;padding:1rem;border-bottom:1px solid #e0e0e0;gap:1rem}.uploadedFile:last-child{border-bottom:none}.fileSize{display:flex;flex-direction:row;font-size:smaller}.fileData{flex:1;display:flex;flex-direction:column}.fileDataContainer{display:flex;flex-direction:column;justify-content:flex-end;width:fit-content}.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}smart-icon ::ng-deep mat-icon{font-size:3rem;width:unset;height:unset}.fileActions{display:flex;flex-direction:row;justify-content:flex-end;gap:.5rem}.fileActions ::ng-deep .pi{width:unset!important}.removeIcon ::ng-deep i,.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}.removeIcon ::ng-deep .pi,.downloadIcon ::ng-deep .pi{font-size:1.5rem!important}.removeIcon ::ng-deep mat-icon,.downloadIcon ::ng-deep mat-icon{font-size:2rem}.removeIcon:hover,.downloadIcon:hover{cursor:pointer}smart-icon{display:flex;align-items:center}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "directive", type: i11.MatLabel, selector: "mat-label" }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "identifier", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartfileuploaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'smartfileuploader', template: "<div\r\n  class=\"container\"\r\n  [ngClass]=\"{ disabledWidget: isDisabled }\"\r\n  (dragover)=\"onDragOver($event)\"\r\n  (dragleave)=\"onDragLeave($event)\"\r\n  (drop)=\"onDrop($event)\"\r\n  [class.dragover]=\"isDragOver\"\r\n>\r\n  <div class=\"fileContainer\" (click)=\"fileInput.click()\">\r\n    <input\r\n      #fileInput\r\n      id=\"addFile\"\r\n      placeholder=\"fileInput\"\r\n      type=\"file\"\r\n      (change)=\"getFile($event)\"\r\n      class=\"file\"\r\n      accept=\"{{ fileFormats?.join(', ') }}\"\r\n      [size]=\"maxSizeMb\"\r\n      [multiple]=\"isMultiple\"\r\n      [disabled]=\"isDisabled\"\r\n      style=\"display: none\"\r\n    />\r\n    <div class=\"fileUploadContentContainer\">\r\n      <div class=\"icon\">\r\n        <mat-label *ngIf=\"useIconButton\" class=\"addFileButton\">\r\n          <mat-icon color=\"primary\" class=\"addCircle\">add_circle</mat-icon>\r\n        </mat-label>\r\n        <button *ngIf=\"!useIconButton\" mat-raised-button color=\"primary\" class=\"addFileButton\">\r\n          {{ i18n!.addFile }}\r\n        </button>\r\n      </div>\r\n      <div class=\"labels\">\r\n        <mat-label *ngIf=\"useIconButton\" class=\"label primary title\">\r\n          {{ i18n!.addFile }}\r\n        </mat-label>\r\n        <mat-label class=\"label secondary\"> {{ i18n!.browseOrDrag }} </mat-label>\r\n        <mat-label class=\"subLabel primary\"> {{ i18n!.maxSize }} </mat-label>\r\n        <mat-label class=\"subLabel primary\"> {{ i18n!.formats }} </mat-label>\r\n      </div>\r\n      <div class=\"uploadButton\" *ngIf=\"files.length\">\r\n        <ui-action-button\r\n          (actionClick)=\"uploadFile()\"\r\n          [code]=\"'default-upload'\"\r\n          [descriptor]=\"uploadButton\"\r\n        >\r\n        </ui-action-button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"errors.length\" class=\"errorMessage\">\r\n    <smart-icon [icon]=\"'error'\" [color]=\"'warn'\"></smart-icon>\r\n    <div class=\"errors\">\r\n      <span *ngFor=\"let error of errors\">{{ error }}</span>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"files.length\" class=\"uploadedFilesContainer\">\r\n    <div *ngFor=\"let file of files; let i = index\" class=\"uploadedFile\">\r\n      <ng-container *ngIf=\"filePreviewUrl(file); else fileIcon\">\r\n        <img [src]=\"filePreviewUrl(file)\" [alt]=\"file.name\" width=\"50\" height=\"50\" />\r\n      </ng-container>\r\n      <ng-template #fileIcon>\r\n        <smart-icon [icon]=\"'insert_drive_file'\"></smart-icon>\r\n      </ng-template>\r\n\r\n      <div class=\"fileData\">\r\n        <div class=\"fileDataContainer\">\r\n          <span class=\"fileName\">{{ file.name }}</span>\r\n          <span class=\"fileSize\">{{ formatSize(file.size) }}</span>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"fileActions\">\r\n        <smart-icon\r\n          class=\"downloadIcon\"\r\n          icon=\"download\"\r\n          (click)=\"downloadFile(file)\"\r\n          [attr.data-testid]=\"'default_download'\"\r\n        ></smart-icon>\r\n        <smart-icon\r\n          class=\"removeIcon\"\r\n          icon=\"delete\"\r\n          [attr.data-testid]=\"'default_remove'\"\r\n          (click)=\"remove(i)\"\r\n        ></smart-icon>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [":host{--border-color: #a6aabd60;--warninig-color: #be2d2e;--def-border-radius: .5rem}.container{display:flex;flex-direction:column;border:2px dashed var(--border-color);border-radius:var(--def-border-radius)}.fileContainer{cursor:pointer;padding:1rem;display:flex;flex-direction:column}.fileContainer:hover{background-color:rgb(from var(--border-color) r g b / .1)}.disabledWidget ::ng-deep .fileContainer:hover{background-color:unset;cursor:unset}.disabledWidget ::ng-deep *{opacity:.85}.dragover{background-color:rgb(from var(--border-color) r g b / .1)}.fileUploadContentContainer{display:flex;flex-direction:row;gap:1rem}.icon mat-icon{font-size:3rem;width:unset;height:unset}.icon{align-content:center}.labels{flex:1;display:flex;flex-direction:column;justify-content:center;width:fit-content}.uploadButton{align-content:center}.primary{color:var(--primary-color)}.secondary{color:var(--gray)}.label{margin:unset}.subLabel{font-size:smaller}.title{padding-bottom:.3rem}.errorMessage,.uploadedFilesContainer{border-top:2px solid var(--border-color)}.errorMessage{display:flex;flex-direction:row;align-items:center;color:var(--warninig-color);padding:.5rem 1rem;gap:1rem}.errorMessage ::ng-deep mat-icon{color:var(--warninig-color)}.errors{display:flex;flex-direction:column}.uploadedFile{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;padding:1rem;border-bottom:1px solid #e0e0e0;gap:1rem}.uploadedFile:last-child{border-bottom:none}.fileSize{display:flex;flex-direction:row;font-size:smaller}.fileData{flex:1;display:flex;flex-direction:column}.fileDataContainer{display:flex;flex-direction:column;justify-content:flex-end;width:fit-content}.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}smart-icon ::ng-deep mat-icon{font-size:3rem;width:unset;height:unset}.fileActions{display:flex;flex-direction:row;justify-content:flex-end;gap:.5rem}.fileActions ::ng-deep .pi{width:unset!important}.removeIcon ::ng-deep i,.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}.removeIcon ::ng-deep .pi,.downloadIcon ::ng-deep .pi{font-size:1.5rem!important}.removeIcon ::ng-deep mat-icon,.downloadIcon ::ng-deep mat-icon{font-size:2rem}.removeIcon:hover,.downloadIcon:hover{cursor:pointer}smart-icon{display:flex;align-items:center}\n"] }]
+            args: [{ selector: 'smartfileuploader', template: "<div\r\n  class=\"container\"\r\n  [ngClass]=\"{ disabledWidget: isDisabled }\"\r\n  (dragover)=\"onDragOver($event)\"\r\n  (dragleave)=\"onDragLeave($event)\"\r\n  (drop)=\"onDrop($event)\"\r\n  [class.dragover]=\"isDragOver\"\r\n>\r\n  <div class=\"fileContainer\" (click)=\"fileInput.click()\">\r\n    <input\r\n      #fileInput\r\n      id=\"addFile\"\r\n      placeholder=\"fileInput\"\r\n      type=\"file\"\r\n      (change)=\"getFile($event)\"\r\n      class=\"file\"\r\n      accept=\"{{ fileFormats?.join(', ') }}\"\r\n      [size]=\"maxSizeMb\"\r\n      [multiple]=\"isMultiple\"\r\n      [disabled]=\"isDisabled\"\r\n      style=\"display: none\"\r\n    />\r\n    <div class=\"fileUploadContentContainer\">\r\n      <div class=\"icon\">\r\n        <mat-label *ngIf=\"useIconButton\" class=\"addFileButton\">\r\n          <mat-icon color=\"primary\" class=\"addCircle\">add_circle</mat-icon>\r\n        </mat-label>\r\n        <button *ngIf=\"!useIconButton\" mat-raised-button color=\"primary\" class=\"addFileButton\">\r\n          {{ i18n!.addFile }}\r\n        </button>\r\n      </div>\r\n      <div class=\"labels\">\r\n        <mat-label *ngIf=\"useIconButton\" class=\"label primary title\">\r\n          {{ i18n!.addFile }}\r\n        </mat-label>\r\n        <mat-label class=\"label secondary\"> {{ i18n!.browseOrDrag }} </mat-label>\r\n        <mat-label class=\"subLabel primary\"> {{ i18n!.maxSize }} </mat-label>\r\n        <mat-label class=\"subLabel primary\"> {{ i18n!.formats }} </mat-label>\r\n      </div>\r\n      <div class=\"uploadButton\" *ngIf=\"files.length\">\r\n        <ui-action-button\r\n          (actionClick)=\"uploadFile($event)\"\r\n          [code]=\"'default-upload'\"\r\n          [descriptor]=\"uploadButton\"\r\n        >\r\n        </ui-action-button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"errors.length\" class=\"errorMessage\">\r\n    <smart-icon [icon]=\"'error'\" [color]=\"'warn'\"></smart-icon>\r\n    <div class=\"errors\">\r\n      <span *ngFor=\"let error of errors\">{{ error }}</span>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"files.length\" class=\"uploadedFilesContainer\">\r\n    <div *ngFor=\"let file of files; let i = index\" class=\"uploadedFile\">\r\n      <ng-container *ngIf=\"filePreviewUrl(file); else fileIcon\">\r\n        <img [src]=\"filePreviewUrl(file)\" [alt]=\"file.name\" width=\"50\" height=\"50\" />\r\n      </ng-container>\r\n      <ng-template #fileIcon>\r\n        <smart-icon [icon]=\"'insert_drive_file'\"></smart-icon>\r\n      </ng-template>\r\n\r\n      <div class=\"fileData\">\r\n        <div class=\"fileDataContainer\">\r\n          <span class=\"fileName\">{{ file.name }}</span>\r\n          <span class=\"fileSize\">{{ formatSize(file.size) }}</span>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"fileActions\">\r\n        <smart-icon\r\n          class=\"downloadIcon\"\r\n          icon=\"download\"\r\n          (click)=\"downloadFile(file)\"\r\n          [attr.data-testid]=\"'default_download'\"\r\n        ></smart-icon>\r\n        <smart-icon\r\n          class=\"removeIcon\"\r\n          icon=\"delete\"\r\n          [attr.data-testid]=\"'default_remove'\"\r\n          (click)=\"remove(i)\"\r\n        ></smart-icon>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [":host{--border-color: #a6aabd60;--warninig-color: #be2d2e;--def-border-radius: .5rem}.container{display:flex;flex-direction:column;border:2px dashed var(--border-color);border-radius:var(--def-border-radius)}.fileContainer{cursor:pointer;padding:1rem;display:flex;flex-direction:column}.fileContainer:hover{background-color:rgb(from var(--border-color) r g b / .1)}.disabledWidget ::ng-deep .fileContainer:hover{background-color:unset;cursor:unset}.disabledWidget ::ng-deep *{opacity:.85}.dragover{background-color:rgb(from var(--border-color) r g b / .1)}.fileUploadContentContainer{display:flex;flex-direction:row;gap:1rem}.icon mat-icon{font-size:3rem;width:unset;height:unset}.icon{align-content:center}.labels{flex:1;display:flex;flex-direction:column;justify-content:center;width:fit-content}.uploadButton{align-content:center}.primary{color:var(--primary-color)}.secondary{color:var(--gray)}.label{margin:unset}.subLabel{font-size:smaller}.title{padding-bottom:.3rem}.errorMessage,.uploadedFilesContainer{border-top:2px solid var(--border-color)}.errorMessage{display:flex;flex-direction:row;align-items:center;color:var(--warninig-color);padding:.5rem 1rem;gap:1rem}.errorMessage ::ng-deep mat-icon{color:var(--warninig-color)}.errors{display:flex;flex-direction:column}.uploadedFile{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;padding:1rem;border-bottom:1px solid #e0e0e0;gap:1rem}.uploadedFile:last-child{border-bottom:none}.fileSize{display:flex;flex-direction:row;font-size:smaller}.fileData{flex:1;display:flex;flex-direction:column}.fileDataContainer{display:flex;flex-direction:column;justify-content:flex-end;width:fit-content}.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}smart-icon ::ng-deep mat-icon{font-size:3rem;width:unset;height:unset}.fileActions{display:flex;flex-direction:row;justify-content:flex-end;gap:.5rem}.fileActions ::ng-deep .pi{width:unset!important}.removeIcon ::ng-deep i,.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}.removeIcon ::ng-deep .pi,.downloadIcon ::ng-deep .pi{font-size:1.5rem!important}.removeIcon ::ng-deep mat-icon,.downloadIcon ::ng-deep mat-icon{font-size:2rem}.removeIcon:hover,.downloadIcon:hover{cursor:pointer}smart-icon{display:flex;align-items:center}\n"] }]
         }], ctorParameters: () => [{ type: i1$4.MatSnackBar }], propDecorators: { fileInput: [{
                 type: ViewChild,
                 args: ['fileInput']
@@ -21247,6 +21250,27 @@ class SmartComponentLayoutUtility {
         }
         return result;
     }
+    /**
+     * The editors of the filter widgets in the layout tree. A widget whose builder model has not
+     * arrived yet has no editor and is left out until it does.
+     */
+    static getFilters(comp) {
+        const result = [];
+        if (comp.components) {
+            const children = comp.components
+                .map((c) => SmartComponentLayoutUtility.getFilters(c))
+                .reduce((acc, value) => acc.concat(value), []);
+            result.push(...children);
+        }
+        const expandable = this.getExpandableComponent(comp);
+        if (expandable) {
+            result.push(...this.getFilters(expandable));
+        }
+        if (comp.smartFilterComponent?.contentComponent) {
+            result.push(comp.smartFilterComponent.contentComponent);
+        }
+        return result;
+    }
     static getTrees(comp) {
         let result = [];
         if (comp.components) {
@@ -22340,501 +22364,389 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
                 type: Output
             }] } });
 
-class SmartComponentLayoutComponent {
-    get testId() {
-        return this.smartComponentLayout?.identifier ?? null;
-    }
-    get isHorizontal() {
-        return (this.smartComponentLayout?.type === this.type().CONTAINER &&
-            this.smartComponentLayout?.direction === 'horizontal');
+/**
+ * Custom HttpParameterCodec
+ * Workaround for https://github.com/angular/angular/issues/18261
+ */
+class CustomHttpParameterCodec {
+    encodeKey(k) {
+        return encodeURIComponent(k);
     }
-    get isVertical() {
-        return (this.smartComponentLayout?.type === this.type().CONTAINER &&
-            (this.smartComponentLayout?.direction ?? 'vertical') === 'vertical');
+    encodeValue(v) {
+        return encodeURIComponent(v);
     }
-    set embeddedSlotVcRefSetter(vcRef) {
-        this._embeddedSlotVcRef = vcRef;
-        if (vcRef) {
-            this.tryRegisterEmbeddedSlot();
-        }
+    decodeKey(k) {
+        return decodeURIComponent(k);
     }
-    constructor(layoutService, viewContext, element, renderer) {
-        this.layoutService = layoutService;
-        this.viewContext = viewContext;
-        this.element = element;
-        this.renderer = renderer;
-        this._destroy$ = new Subject();
-        this.appRef = inject(ApplicationRef);
-        this.formRef = viewChild(SmartformComponent);
-        this.onFormChange = effect(() => {
-            const form = this.formRef();
-            if (this.smartForm && form && this.parentSmartComponent) {
-                this.parentSmartComponent.handleDataChangeSubscriptions(form);
-                this.parentSmartComponent.handleUploadCallback(form);
-                form.markAllWidgetsForChangeDetection();
-            }
-        });
-        this.pendingOrphanCleanup = false;
-        this.embeddedSlotActive = false;
+    decodeValue(v) {
+        return decodeURIComponent(v);
     }
-    ngAfterViewInit() {
-        if (this.smartFormList?.first) {
-            this.setFormComponent(this.smartFormList?.first);
-        }
-        this.smartFormList.changes
-            .pipe(takeUntil(this._destroy$))
-            .subscribe((list) => {
-            this.setFormComponent(list.first);
-        });
-        if (this.smartGridList?.first) {
-            this.setGridComponent(this.smartGridList?.first);
+}
+
+const BASE_PATH = new InjectionToken('basePath');
+const COLLECTION_FORMATS = {
+    'csv': ',',
+    'tsv': '   ',
+    'ssv': ' ',
+    'pipes': '|'
+};
+
+class Configuration {
+    constructor(configurationParameters = {}) {
+        this.apiKeys = configurationParameters.apiKeys;
+        this.username = configurationParameters.username;
+        this.password = configurationParameters.password;
+        this.accessToken = configurationParameters.accessToken;
+        this.basePath = configurationParameters.basePath;
+        this.withCredentials = configurationParameters.withCredentials;
+        this.encoder = configurationParameters.encoder;
+        if (configurationParameters.encodeParam) {
+            this.encodeParam = configurationParameters.encodeParam;
         }
-        this.smartGridList.changes
-            .pipe(takeUntil(this._destroy$))
-            .subscribe((list) => {
-            this.setGridComponent(list.first);
-        });
-        if (this.smartMapList?.first) {
-            this.setMapComponent(this.smartMapList?.first);
+        else {
+            this.encodeParam = param => this.defaultEncodeParam(param);
         }
-        this.smartMapList.changes.pipe(takeUntil(this._destroy$)).subscribe((maps) => {
-            this.setMapComponent(maps.first);
-        });
-        if (this.smartDiagramList?.first) {
-            this.setDiagramComponent(this.smartDiagramList?.first);
+        if (configurationParameters.credentials) {
+            this.credentials = configurationParameters.credentials;
         }
-        this.smartDiagramList.changes.pipe(takeUntil(this._destroy$)).subscribe((diagrams) => {
-            this.setDiagramComponent(diagrams.first);
-        });
-        this.smartFilterList.changes
-            .pipe(takeUntil(this._destroy$))
-            .subscribe((list) => {
-            if (!this.smartFilterComponent) {
-                this.smartFilterComponent = list.first;
-                this.bindFilter();
-            }
-        });
-        if (this.toolbarList?.first) {
-            this.setToolbarComponent(this.toolbarList?.first);
+        else {
+            this.credentials = {};
         }
-        this.toolbarList.changes
-            .pipe(takeUntil(this._destroy$))
-            .subscribe((list) => {
-            this.setToolbarComponent(list.first);
-        });
-        this.setUp();
     }
-    ngAfterViewChecked() {
-        if (this.pendingOrphanCleanup) {
-            this.pendingOrphanCleanup = false;
-            this.viewContext.cleanupOrphanedEmbeddedViews(this.uuid);
+    /**
+     * Select the correct content-type to use for a request.
+     * Uses {@link Configuration#isJsonMime} to determine the correct content-type.
+     * If no content type is found return the first found type if the contentTypes is not empty
+     * @param contentTypes - the array of content types that are available for selection
+     * @returns the selected content-type or <code>undefined</code> if no selection could be made.
+     */
+    selectHeaderContentType(contentTypes) {
+        if (contentTypes.length === 0) {
+            return undefined;
+        }
+        const type = contentTypes.find((x) => this.isJsonMime(x));
+        if (type === undefined) {
+            return contentTypes[0];
         }
+        return type;
     }
-    ngOnDestroy() {
-        if (this.embeddedSlotContainerId && this.uuid) {
-            this.viewContext.unregisterEmbeddedSlot(this.uuid, this.embeddedSlotContainerId);
+    /**
+     * Select the correct accept content-type to use for a request.
+     * Uses {@link Configuration#isJsonMime} to determine the correct accept content-type.
+     * If no content type is found return the first found type if the contentTypes is not empty
+     * @param accepts - the array of content types that are available for selection.
+     * @returns the selected content-type or <code>undefined</code> if no selection could be made.
+     */
+    selectHeaderAccept(accepts) {
+        if (accepts.length === 0) {
+            return undefined;
         }
-        this._destroy$.next();
-        this._destroy$.complete();
+        const type = accepts.find((x) => this.isJsonMime(x));
+        if (type === undefined) {
+            return accepts[0];
+        }
+        return type;
     }
-    ngOnChanges(changes) {
-        this.setUp();
+    /**
+     * Check if the given MIME is a JSON MIME.
+     * JSON MIME examples:
+     *   application/json
+     *   application/json; charset=UTF8
+     *   APPLICATION/JSON
+     *   application/vnd.company+json
+     * @param mime - MIME (Multipurpose Internet Mail Extensions)
+     * @return True if the given MIME is JSON, false otherwise.
+     */
+    isJsonMime(mime) {
+        const jsonMime = new RegExp('^(application\/json|[^;/ \t]+\/[^;/ \t]+[+]json)[ \t]*(;.*)?$', 'i');
+        return mime !== null && (jsonMime.test(mime) || mime.toLowerCase() === 'application/json-patch+json');
     }
-    setUp() {
-        if (!this.parentSmartComponent || !this.smartComponentLayout) {
-            return;
+    lookupCredential(key) {
+        const value = this.credentials[key];
+        return typeof value === 'function'
+            ? value()
+            : value;
+    }
+    defaultEncodeParam(param) {
+        // This implementation exists as fallback for missing configuration
+        // and for backwards compatibility to older typescript-angular generator versions.
+        // It only works for the 'simple' parameter style.
+        // Date-handling only works for the 'date-time' format.
+        // All other styles and Date-formats are probably handled incorrectly.
+        //
+        // But: if that's all you need (i.e.: the most common use-case): no need for customization!
+        const value = param.dataFormat === 'date-time' && param.value instanceof Date
+            ? param.value.toISOString()
+            : param.value;
+        return encodeURIComponent(String(value));
+    }
+}
+
+/**
+ * Filter API 2
+ * Filter API 2
+ *
+ * The version of the OpenAPI document: 1.0.0
+ * Contact: info@it4all.hu
+ *
+ * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
+ * https://openapi-generator.tech
+ * Do not edit the class manually.
+ */
+/* tslint:disable:no-unused-variable member-ordering */
+class FilterService {
+    constructor(httpClient, basePath, configuration) {
+        this.httpClient = httpClient;
+        this.basePath = 'http://localhost';
+        this.defaultHeaders = new HttpHeaders();
+        this.configuration = new Configuration();
+        if (configuration) {
+            this.configuration = configuration;
         }
-        if (deepEqual(this.smartComponentLayout, this.currentLayout)) {
-            // no layout change, keep current state
-            this.smartComponentLayout = this.currentLayout;
-            return;
+        if (typeof this.configuration.basePath !== 'string') {
+            if (Array.isArray(basePath) && basePath.length > 0) {
+                basePath = basePath[0];
+            }
+            if (typeof basePath !== 'string') {
+                basePath = this.basePath;
+            }
+            this.configuration.basePath = basePath;
         }
-        // layout changed, render, but save current
-        // this.currentLayout = JSON.parse(JSON.stringify(this.smartComponentLayout));
-        SmartComponentLayoutUtility.clearFormHandlers(this);
-        this.currentLayout = this.smartComponentLayout;
-        this.uuid = this.parentSmartComponent.uuid;
-        this.treeService = this.parentSmartComponent.smartTreeService;
-        // Top-level layout: detach embedded views before the tree is re-rendered,
-        // so they survive *ngFor component destruction
-        if (!this.parentLayoutComponent && this.uuid) {
-            this.viewContext.detachAllEmbeddedViews(this.uuid);
-            this.pendingOrphanCleanup = true;
+        this.encoder = this.configuration.encoder || new CustomHttpParameterCodec();
+    }
+    // @ts-ignore
+    addToHttpParams(httpParams, value, key) {
+        if (typeof value === "object" && value instanceof Date === false) {
+            httpParams = this.addToHttpParamsRecursive(httpParams, value);
         }
-        this.smartComponentLayout?.direction;
-        // the nature of the layout might have changed (e.g. from GRID to FORM), we null out every
-        // template-related element, so no stale data is left on screen:
-        this.expandableSection = undefined;
-        this.smartForm = undefined;
-        this.smartFormComponent = undefined;
-        this.smartGrid = undefined;
-        this.smartGridComponent = undefined;
-        this.smartFilter = undefined;
-        this.smartFilterComponent = undefined;
-        this.smartGrid = undefined;
-        this.toolbarId = undefined;
-        this.toolbar = undefined;
-        // null out toolbar?
-        this.mapId = undefined;
-        this.smartDiagramId = undefined;
-        if (this.embeddedSlotContainerId && this.uuid) {
-            this.viewContext.unregisterEmbeddedSlot(this.uuid, this.embeddedSlotContainerId);
-        }
-        this.embeddedSlotActive = false;
-        this.embeddedSlotContainerId = undefined;
-        if (this.smartComponentLayout?.expandable) {
-            this.constructExpandableSection();
+        else {
+            httpParams = this.addToHttpParamsRecursive(httpParams, value, key);
         }
-        else if (this.smartComponentLayout?.type === ComponentType.FORM) {
-            this.constructForm();
+        return httpParams;
+    }
+    addToHttpParamsRecursive(httpParams, value, key) {
+        if (value == null) {
+            return httpParams;
         }
-        else if (this.smartComponentLayout?.type === ComponentType.WIDGET) {
-            if (this.smartComponentLayout.widget?.type === ComponentWidgetType.GRID) {
-                this.constructGrid();
-            }
-            else if (this.smartComponentLayout.widget?.type === ComponentWidgetType.FILTER) {
-                console.warn('ComponentWidgetType.FILTER is not supported');
-                // this.constructFilter();
-            }
-            else if (this.smartComponentLayout.widget?.type === ComponentWidgetType.TREE) {
-                this.constructTree();
-            }
-            else if (this.smartComponentLayout.widget?.type === ComponentWidgetType.TOOLBAR) {
-                this.constructToolbar();
-            }
-            else if (this.smartComponentLayout.widget?.type === ComponentWidgetType.MAP) {
-                this.constructMap();
-            }
-            else if (this.smartComponentLayout.widget?.type === ComponentWidgetType.DIAGRAM) {
-                this.construcDiagram();
+        if (typeof value === "object") {
+            if (Array.isArray(value)) {
+                value.forEach(elem => httpParams = this.addToHttpParamsRecursive(httpParams, elem, key));
             }
-            else if (this.smartComponentLayout.widget?.type === ComponentWidgetType.EMBEDDED_SLOT) {
-                this.constructEmbeddedSlot();
+            else if (value instanceof Date) {
+                if (key != null) {
+                    httpParams = httpParams.append(key, value.toISOString().substr(0, 10));
+                }
+                else {
+                    throw Error("key may not be null if value is Date");
+                }
             }
-            if (!this.parentLayoutComponent) {
-                // only top level component should call init actions
-                this.parentSmartComponent.initActions();
+            else {
+                Object.keys(value).forEach(k => httpParams = this.addToHttpParamsRecursive(httpParams, value[k], key != null ? `${key}.${k}` : k));
             }
         }
-        SmartStyleUtility.applyStyle(this.smartComponentLayout.style, this.element, this.renderer);
-    }
-    type() {
-        return ComponentType;
-    }
-    constructExpandableSection() {
-        let data = { ...this.smartComponentLayout };
-        data.expandable = false;
-        this.expandableSection = {
-            title: this.smartComponentLayout?.expandableSectionLabel ?? '',
-            inputs: new Map([
-                ['smartComponentLayout', data],
-                ['parentSmartComponent', this.parentSmartComponent],
-                ['parentLayoutComponent', this.parentLayoutComponent],
-            ]),
-            headerToolbarId: this.smartComponentLayout?.expandableSectionHeaderToolbarId,
-            customComponent: SmartComponentLayoutComponent,
-        };
-    }
-    constructForm() {
-        const widgets = this.layoutService.render({
-            layoutDefinitions: this.smartComponentLayout?.form,
-        });
-        if (this.gridRow && !this.gridRow.valueSets && this.parentSmartComponent?.model) {
-            this.gridRow.valueSets = this.parentSmartComponent.model.valueSets;
+        else if (key != null) {
+            httpParams = httpParams.append(key, value);
         }
-        this.smartForm = {
-            direction: this.getFormLayout(),
-            componentModel: this.gridRow ? this.gridRow : this.parentSmartComponent?.model,
-            widgets,
-        };
-        this.bindForm();
-    }
-    getFormLayout() {
-        if (this.smartComponentLayout?.direction) {
-            return this.smartComponentLayout?.direction === LayoutDirection.HORIZONTAL
-                ? SmartFormWidgetDirection.ROW
-                : SmartFormWidgetDirection.COL;
+        else {
+            throw Error("key may not be null if value is not object or array");
         }
-        return SmartFormWidgetDirection.COL;
+        return httpParams;
     }
-    setFormComponent(comp) {
-        if (!this.smartFormComponent) {
-            this.smartFormComponent = comp;
-            this.bindForm();
+    load(uuid, filterIdentifier, observe = 'body', reportProgress = false, options) {
+        if (uuid === null || uuid === undefined) {
+            throw new Error('Required parameter uuid was null or undefined when calling load.');
         }
-    }
-    bindForm() {
-        if (this.parentSmartComponent?.useQueryLists) {
-            return;
+        if (filterIdentifier === null || filterIdentifier === undefined) {
+            throw new Error('Required parameter filterIdentifier was null or undefined when calling load.');
         }
-        if (this.smartForm && this.smartFormComponent) {
-            this.parentSmartComponent?.addForm(
-            // unique identifier for the form
-            `form_${this.makeid(5)}`, this.smartForm, this.smartFormComponent);
+        let localVarHeaders = this.defaultHeaders;
+        let localVarHttpHeaderAcceptSelected = options && options.httpHeaderAccept;
+        if (localVarHttpHeaderAcceptSelected === undefined) {
+            // to determine the Accept header
+            const httpHeaderAccepts = [
+                'application/json'
+            ];
+            localVarHttpHeaderAcceptSelected = this.configuration.selectHeaderAccept(httpHeaderAccepts);
         }
-    }
-    makeid(length) {
-        let result = '';
-        const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
-        const charactersLength = characters.length;
-        let counter = 0;
-        while (counter < length) {
-            result += characters.charAt(Math.floor(Math.random() * charactersLength));
-            counter += 1;
+        if (localVarHttpHeaderAcceptSelected !== undefined) {
+            localVarHeaders = localVarHeaders.set('Accept', localVarHttpHeaderAcceptSelected);
         }
-        return result;
-    }
-    constructGrid() {
-        this.smartGrid = {
-            gridIdentifier: this.smartComponentLayout?.widget?.identifier,
-            gridModel: {
-                page: {},
-            },
-            options: {
-                rowUiActionType: GridUiActionType.POPUP_MENU,
-            },
-            layoutDef: SmartLayoutDef.TABLE,
-            paginator: false,
-            layoutComponent: SmartComponentLayoutComponent,
-            layoutUtility: SmartComponentLayoutUtility,
-        };
-        this.bindGrid();
-    }
-    setGridComponent(comp) {
-        if (!this.smartGridComponent) {
-            this.smartGridComponent = comp;
-            this.bindGrid();
+        let localVarHttpContext = options && options.context;
+        if (localVarHttpContext === undefined) {
+            localVarHttpContext = new HttpContext();
         }
-    }
-    bindGrid() {
-        if (this.parentSmartComponent?.useQueryLists) {
-            if (this.smartGrid && this.smartGridComponent && this.parentSmartComponent) {
-                this.parentSmartComponent.setupGridServices(this.smartGridComponent);
+        let responseType_ = 'json';
+        if (localVarHttpHeaderAcceptSelected) {
+            if (localVarHttpHeaderAcceptSelected.startsWith('text')) {
+                responseType_ = 'text';
+            }
+            else if (this.configuration.isJsonMime(localVarHttpHeaderAcceptSelected)) {
+                responseType_ = 'json';
+            }
+            else {
+                responseType_ = 'blob';
             }
-            return;
-        }
-        if (this.smartGrid && this.smartGridComponent) {
-            this.smartGrid = this.parentSmartComponent?.addGrid(this.smartGrid, {
-                rowUiActionType: GridUiActionType.POPUP_MENU,
-            }, false, this.smartGridComponent);
         }
+        let localVarPath = `/filter/${this.configuration.encodeParam({ name: "uuid", value: uuid, in: "path", style: "simple", explode: false, dataType: "string", dataFormat: "uuid" })}/${this.configuration.encodeParam({ name: "filterIdentifier", value: filterIdentifier, in: "path", style: "simple", explode: false, dataType: "string", dataFormat: undefined })}/load`;
+        return this.httpClient.request('get', `${this.configuration.basePath}${localVarPath}`, {
+            context: localVarHttpContext,
+            responseType: responseType_,
+            withCredentials: this.configuration.withCredentials,
+            headers: localVarHeaders,
+            observe: observe,
+            reportProgress: reportProgress
+        });
     }
-    constructMap() {
-        this.mapId = this.smartComponentLayout?.widget?.identifier;
-        this.bindMap();
-    }
-    construcDiagram() {
-        this.smartDiagramId = this.smartComponentLayout?.widget?.identifier;
-        this.bindDiagram();
-    }
-    setMapComponent(comp) {
-        if (!this.smartMapComponent) {
-            this.smartMapComponent = comp;
-            this.bindMap();
+    performWidgetAction(uuid, filterIdentifier, body, observe = 'body', reportProgress = false, options) {
+        if (uuid === null || uuid === undefined) {
+            throw new Error('Required parameter uuid was null or undefined when calling performWidgetAction.');
         }
-    }
-    setDiagramComponent(comp) {
-        if (!this.smartDiagramComponent) {
-            this.smartDiagramComponent = comp;
-            this.bindDiagram();
+        if (filterIdentifier === null || filterIdentifier === undefined) {
+            throw new Error('Required parameter filterIdentifier was null or undefined when calling performWidgetAction.');
         }
-    }
-    bindMap() {
-        if (this.parentSmartComponent.useQueryLists) {
-            return;
+        if (body === null || body === undefined) {
+            throw new Error('Required parameter body was null or undefined when calling performWidgetAction.');
         }
-        console.warn('Map components are only supported through QueryLists!');
-    }
-    bindDiagram() {
-        if (this.parentSmartComponent.useQueryLists) {
-            return;
+        let localVarHeaders = this.defaultHeaders;
+        let localVarHttpHeaderAcceptSelected = options && options.httpHeaderAccept;
+        if (localVarHttpHeaderAcceptSelected === undefined) {
+            // to determine the Accept header
+            const httpHeaderAccepts = [
+                'application/json'
+            ];
+            localVarHttpHeaderAcceptSelected = this.configuration.selectHeaderAccept(httpHeaderAccepts);
         }
-        console.warn('Diagram components are only supported through QueryLists!');
-    }
-    setToolbarComponent(comp) {
-        this.toolbar = comp;
-    }
-    // NOT USED, DOESN'T WORK
-    // constructFilter(): void {
-    //   this.smartFilter = (this.smartComponentLayout!.parentComponent as any).addFilter(
-    //     `filter_${this.makeid(5)}`,
-    //     this.smartComponentLayout?.widget?.filterExpressionFieldList,
-    //     this.smartComponentLayout?.widget?.filterType,
-    //     this.smartFilterComponent
-    //   );
-    // }
-    bindFilter() {
-        // TODO
-    }
-    constructTree() {
-        if (this.parentSmartComponent?.useQueryLists) {
-            return;
+        if (localVarHttpHeaderAcceptSelected !== undefined) {
+            localVarHeaders = localVarHeaders.set('Accept', localVarHttpHeaderAcceptSelected);
         }
-        this.parentSmartComponent.setUpDefaultTree(this.smartComponentLayout?.widget?.identifier);
-        this.treeService?.initialize();
-    }
-    constructToolbar() {
-        let toolbarId = this.smartComponentLayout?.widget?.identifier;
-        if (this.toolbarId !== toolbarId) {
-            this.toolbarId = toolbarId;
+        let localVarHttpContext = options && options.context;
+        if (localVarHttpContext === undefined) {
+            localVarHttpContext = new HttpContext();
         }
-        let properties = this.smartComponentLayout?.widget?.properties;
-        if (properties && properties['toolbar_properties']) {
-            this.toolbarPropertes = properties['toolbar_properties'];
+        // to determine the Content-Type header
+        const consumes = [
+            'application/json'
+        ];
+        const httpContentTypeSelected = this.configuration.selectHeaderContentType(consumes);
+        if (httpContentTypeSelected !== undefined) {
+            localVarHeaders = localVarHeaders.set('Content-Type', httpContentTypeSelected);
         }
+        let responseType_ = 'json';
+        if (localVarHttpHeaderAcceptSelected) {
+            if (localVarHttpHeaderAcceptSelected.startsWith('text')) {
+                responseType_ = 'text';
+            }
+            else if (this.configuration.isJsonMime(localVarHttpHeaderAcceptSelected)) {
+                responseType_ = 'json';
+            }
+            else {
+                responseType_ = 'blob';
+            }
+        }
+        let localVarPath = `/filter/${this.configuration.encodeParam({ name: "uuid", value: uuid, in: "path", style: "simple", explode: false, dataType: "string", dataFormat: "uuid" })}/${this.configuration.encodeParam({ name: "filterIdentifier", value: filterIdentifier, in: "path", style: "simple", explode: false, dataType: "string", dataFormat: undefined })}/performWidgetAction`;
+        return this.httpClient.request('post', `${this.configuration.basePath}${localVarPath}`, {
+            context: localVarHttpContext,
+            body: body,
+            responseType: responseType_,
+            withCredentials: this.configuration.withCredentials,
+            headers: localVarHeaders,
+            observe: observe,
+            reportProgress: reportProgress
+        });
     }
-    constructEmbeddedSlot() {
-        this.embeddedSlotContainerId = this.smartComponentLayout?.widget?.identifier;
-        this.embeddedSlotActive = true;
-        this.tryRegisterEmbeddedSlot();
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FilterService, deps: [{ token: i1.HttpClient }, { token: BASE_PATH, optional: true }, { token: Configuration, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FilterService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FilterService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [BASE_PATH]
+                }] }, { type: Configuration, decorators: [{
+                    type: Optional
+                }] }] });
+
+class SmartFilterEditorService {
+    constructor(service, viewCtxService) {
+        this.service = service;
+        this.viewCtxService = viewCtxService;
+        this.modelChanged = new Subject();
+        this.submit = new Subject();
+        this.itemSelected = new Subject();
+        this.toolbars = [];
     }
-    tryRegisterEmbeddedSlot() {
-        if (this.embeddedSlotContainerId && this.uuid && this._embeddedSlotVcRef) {
-            // An EMBEDDED_SLOT widget slot is LAYOUT-kind: it lives inside the re-rendering
-            // layout *ngFor, so its child must be detached before a top-level re-render and
-            // reattaches when this slot re-registers. (#28870)
-            this.viewContext.registerEmbeddedSlot(this.uuid, this.embeddedSlotContainerId, this._embeddedSlotVcRef, 'layout');
+    submitForm(validate) {
+        // NOPE
+    }
+    getInvalidFields() {
+        return { invalidFieldKeys: [], invalidFieldNames: [] };
+    }
+    getComplexToolbars() {
+        return [...this.toolbars];
+    }
+    setComplexToolbars(toolbars) {
+        this.toolbars = [...toolbars];
+        this.parentSmartComponent?.initActions();
+    }
+    async load() {
+        if (this.config.uuid) {
+            this.model = await this.service.load(this.config.uuid, this.config.identifier).toPromise();
+            this.modelChanged.next();
         }
     }
-    updateUuid(newUuid) {
-        const oldUuid = this.uuid;
-        this.uuid = newUuid;
-        if (oldUuid !== newUuid && this.embeddedSlotContainerId) {
-            if (oldUuid) {
-                this.viewContext.unregisterEmbeddedSlot(oldUuid, this.embeddedSlotContainerId);
+    async peformWidgetAction(request) {
+        if (this.config.uuid) {
+            let filterView = this.viewCtxService
+                .getCurrentViewContext()
+                ?.views.find((view) => view.uuid == this.config.uuid);
+            if (filterView && filterView.state != ViewState.CLOSED) {
+                this.model = await this.service
+                    .performWidgetAction(this.config.uuid, this.config.identifier, request)
+                    .toPromise();
+                this.modelChanged.next();
             }
-            this.tryRegisterEmbeddedSlot();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartComponentLayoutComponent, deps: [{ token: SmartformLayoutDefinitionService }, { token: SmartViewContextService }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: SmartComponentLayoutComponent, selector: "smart-component-layout", inputs: { smartComponentLayout: "smartComponentLayout", parentLayoutComponent: "parentLayoutComponent", parentSmartComponent: "parentSmartComponent", gridRow: "gridRow" }, host: { properties: { "attr.data-testid": "this.testId", "class.horizontal": "this.isHorizontal", "class.vertical": "this.isVertical" } }, viewQueries: [{ propertyName: "formRef", first: true, predicate: SmartformComponent, descendants: true, isSignal: true }, { propertyName: "embeddedSlotVcRefSetter", first: true, predicate: ["embeddedSlot"], descendants: true, read: ViewContainerRef }, { propertyName: "smartFormList", predicate: ["form"], descendants: true }, { propertyName: "smartGridList", predicate: ["grid"], descendants: true }, { propertyName: "smartMapList", predicate: ["map"], descendants: true }, { propertyName: "smartDiagramList", predicate: ["diagram"], descendants: true }, { propertyName: "smartFilterList", predicate: ["filter"], descendants: true }, { propertyName: "toolbarList", predicate: ["toolbar"], descendants: true }, { propertyName: "expandableComponents", predicate: ExpandableSectionComponent, descendants: true }, { propertyName: "components", predicate: SmartComponentLayoutComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"smartComponentLayout?.expandable; then expandable; else normal\"> </div>\r\n\r\n<ng-template #expandable>\r\n  <smart-expandable-section\r\n    *ngIf=\"expandableSection\"\r\n    [data]=\"expandableSection\"\r\n  ></smart-expandable-section>\r\n</ng-template>\r\n\r\n<ng-template #normal>\r\n  @if (smartComponentLayout?.type === type().CONTAINER) {\r\n    <smart-component-layout\r\n      *ngFor=\"let layout of smartComponentLayout?.components\"\r\n      [parentSmartComponent]=\"parentSmartComponent\"\r\n      [parentLayoutComponent]=\"this\"\r\n      [smartComponentLayout]=\"layout\"\r\n      [gridRow]=\"gridRow\"\r\n    ></smart-component-layout>\r\n  }\r\n  <smartform *ngIf=\"smartForm\" #form [smartForm]=\"smartForm\"></smartform>\r\n  <smart-grid\r\n    *ngIf=\"smartGrid\"\r\n    #grid\r\n    [smartGrid]=\"smartGrid\"\r\n    [uuid]=\"uuid!\"\r\n    [parentLayoutComponent]=\"this\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-grid>\r\n  <smart-map\r\n    *ngIf=\"!!uuid && !!mapId\"\r\n    #map\r\n    [uuid]=\"uuid\"\r\n    [identifier]=\"mapId\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-map>\r\n  <smart-diagram\r\n    *ngIf=\"!!uuid && !!smartDiagramId\"\r\n    #diagram\r\n    [uuid]=\"uuid\"\r\n    [identifier]=\"smartDiagramId\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-diagram>\r\n  <!-- <smart-filter #filter [filter]=\"smartFilter\"></smart-filter> -->\r\n  <smart-tree *ngIf=\"treeService\" [treeService]=\"treeService!\"></smart-tree>\r\n  <smart-ui-action-toolbar\r\n    *ngIf=\"!!toolbarId\"\r\n    #toolbar\r\n    [id]=\"toolbarId\"\r\n    [toolbarPropertes]=\"toolbarPropertes\"\r\n  ></smart-ui-action-toolbar>\r\n  <ng-container *ngIf=\"embeddedSlotActive\" #embeddedSlot></ng-container>\r\n</ng-template>\r\n", styles: [":host(.horizontal){display:flex;flex-direction:row}:host(.vertical){display:flex;flex-direction:column}:host(.horizontal) smart-component-layout{display:flex}:host(.horizontal) smartform{flex:1;display:flex}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SmartGridComponent, selector: "smart-grid", inputs: ["smartGrid", "uuid", "parent", "parentLayoutComponent", "dev"] }, { kind: "component", type: ExpandableSectionComponent, selector: "smart-expandable-section", inputs: ["data", "index"] }, { kind: "component", type: SmartTreeComponent, selector: "smart-tree", inputs: ["treeStyle", "treeService"] }, { kind: "component", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: ["uiActionModels", "uiActionDescriptorService", "id", "scrollOnWrap", "toolbarPropertes"] }, { kind: "component", type: SmartformComponent, selector: "smartform", inputs: ["smartForm"] }, { kind: "component", type: SmartMapComponent, selector: "smart-map", inputs: ["uuid", "identifier", "parent"] }, { kind: "component", type: SmartDiagramComponent, selector: "smart-diagram", inputs: ["uuid", "identifier", "parent", "diagramModel", "options", "plugins"], outputs: ["elementSelect", "canvasClick", "dataClick"] }, { kind: "component", type: SmartComponentLayoutComponent, selector: "smart-component-layout", inputs: ["smartComponentLayout", "parentLayoutComponent", "parentSmartComponent", "gridRow"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartComponentLayoutComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'smart-component-layout', template: "<div *ngIf=\"smartComponentLayout?.expandable; then expandable; else normal\"> </div>\r\n\r\n<ng-template #expandable>\r\n  <smart-expandable-section\r\n    *ngIf=\"expandableSection\"\r\n    [data]=\"expandableSection\"\r\n  ></smart-expandable-section>\r\n</ng-template>\r\n\r\n<ng-template #normal>\r\n  @if (smartComponentLayout?.type === type().CONTAINER) {\r\n    <smart-component-layout\r\n      *ngFor=\"let layout of smartComponentLayout?.components\"\r\n      [parentSmartComponent]=\"parentSmartComponent\"\r\n      [parentLayoutComponent]=\"this\"\r\n      [smartComponentLayout]=\"layout\"\r\n      [gridRow]=\"gridRow\"\r\n    ></smart-component-layout>\r\n  }\r\n  <smartform *ngIf=\"smartForm\" #form [smartForm]=\"smartForm\"></smartform>\r\n  <smart-grid\r\n    *ngIf=\"smartGrid\"\r\n    #grid\r\n    [smartGrid]=\"smartGrid\"\r\n    [uuid]=\"uuid!\"\r\n    [parentLayoutComponent]=\"this\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-grid>\r\n  <smart-map\r\n    *ngIf=\"!!uuid && !!mapId\"\r\n    #map\r\n    [uuid]=\"uuid\"\r\n    [identifier]=\"mapId\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-map>\r\n  <smart-diagram\r\n    *ngIf=\"!!uuid && !!smartDiagramId\"\r\n    #diagram\r\n    [uuid]=\"uuid\"\r\n    [identifier]=\"smartDiagramId\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-diagram>\r\n  <!-- <smart-filter #filter [filter]=\"smartFilter\"></smart-filter> -->\r\n  <smart-tree *ngIf=\"treeService\" [treeService]=\"treeService!\"></smart-tree>\r\n  <smart-ui-action-toolbar\r\n    *ngIf=\"!!toolbarId\"\r\n    #toolbar\r\n    [id]=\"toolbarId\"\r\n    [toolbarPropertes]=\"toolbarPropertes\"\r\n  ></smart-ui-action-toolbar>\r\n  <ng-container *ngIf=\"embeddedSlotActive\" #embeddedSlot></ng-container>\r\n</ng-template>\r\n", styles: [":host(.horizontal){display:flex;flex-direction:row}:host(.vertical){display:flex;flex-direction:column}:host(.horizontal) smart-component-layout{display:flex}:host(.horizontal) smartform{flex:1;display:flex}\n"] }]
-        }], ctorParameters: () => [{ type: SmartformLayoutDefinitionService }, { type: SmartViewContextService }, { type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { smartComponentLayout: [{
-                type: Input
-            }], parentLayoutComponent: [{
-                type: Input
-            }], parentSmartComponent: [{
-                type: Input
-            }], gridRow: [{
-                type: Input
-            }], testId: [{
-                type: HostBinding,
-                args: ['attr.data-testid']
-            }], isHorizontal: [{
-                type: HostBinding,
-                args: ['class.horizontal']
-            }], isVertical: [{
-                type: HostBinding,
-                args: ['class.vertical']
-            }], smartFormList: [{
-                type: ViewChildren,
-                args: ['form']
-            }], smartGridList: [{
-                type: ViewChildren,
-                args: ['grid']
-            }], smartMapList: [{
-                type: ViewChildren,
-                args: ['map']
-            }], smartDiagramList: [{
-                type: ViewChildren,
-                args: ['diagram']
-            }], smartFilterList: [{
-                type: ViewChildren,
-                args: ['filter']
-            }], toolbarList: [{
-                type: ViewChildren,
-                args: ['toolbar']
-            }], embeddedSlotVcRefSetter: [{
-                type: ViewChild,
-                args: ['embeddedSlot', { read: ViewContainerRef, static: false }]
-            }], expandableComponents: [{
-                type: ViewChildren,
-                args: [ExpandableSectionComponent]
-            }], components: [{
-                type: ViewChildren,
-                args: [SmartComponentLayoutComponent]
-            }] } });
-
-const DEFAULT_PROVIDERS = [
-    DefaultChartOptionsProvider,
-    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: barChart, multi: true },
-    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: scatterChart, multi: true },
-    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: bubbleChart, multi: true },
-    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: horizontalBarChart, multi: true },
-    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: stackedBarChart, multi: true },
-    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: horizontalStackedBarChart, multi: true },
-    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: multiAxisLineChart, multi: true },
-    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: polarAreaChart, multi: true },
-    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: radarChart, multi: true },
-    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: doughnutChart, multi: true },
-    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: pieChart, multi: true },
-];
-class SmartDiagramModule {
-    static forRoot(providers) {
+    getModel() {
+        return this.model;
+    }
+    async performUiActionRequest(uiActionRequest, widgetId, nodeId) {
+        await this.peformWidgetAction(uiActionRequest);
+    }
+    async handleSpecificDemandsAsynchronously(uiAction, uiActionRequest) {
         return {
-            ngModule: SmartDiagramModule,
-            providers: [...DEFAULT_PROVIDERS, ...providers],
+            shouldPerformAction: true,
+            uiActionRequest: uiActionRequest,
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartDiagramModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.11", ngImport: i0, type: SmartDiagramModule, declarations: [SmartDiagramComponent], imports: [BrowserModule, ChartModule], exports: [SmartDiagramComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartDiagramModule, imports: [BrowserModule, ChartModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartDiagramModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [SmartDiagramComponent],
-                    imports: [BrowserModule, ChartModule],
-                    exports: [SmartDiagramComponent],
-                }]
-        }] });
-
-class SmartComponentLayoutModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartComponentLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.11", ngImport: i0, type: SmartComponentLayoutModule, declarations: [SmartComponentLayoutComponent], imports: [BrowserModule,
-            MatCommonModule,
-            SmartGridModule,
-            SmartExpandableSectionModule,
-            SmarttreeModule,
-            SmartViewContextModule,
-            SmartMapModule,
-            SmartDiagramModule,
-            InputGroupModule,
-            InputGroupAddonModule], exports: [SmartComponentLayoutComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartComponentLayoutModule, imports: [BrowserModule,
-            MatCommonModule,
-            SmartGridModule,
-            SmartExpandableSectionModule,
-            SmarttreeModule,
-            SmartViewContextModule,
-            SmartMapModule,
-            SmartDiagramModule,
-            InputGroupModule,
-            InputGroupAddonModule] }); }
+    getAdditionalParams(uiAction) {
+        throw new Error('Method not implemented.');
+    }
+    async bulkUpdateFilterExpression(operationType, item) {
+        if (!this.model?.readOnly) {
+            if (item) {
+                item.expressionData.boolOperator = operationType;
+            }
+            await this.peformWidgetAction({
+                code: 'BULK_UPDATE_FILTER_EXPRESSION',
+                params: {
+                    model: item,
+                    operator: operationType,
+                },
+            });
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartFilterEditorService, deps: [{ token: FilterService }, { token: SmartViewContextService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartFilterEditorService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartComponentLayoutModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [SmartComponentLayoutComponent],
-                    imports: [
-                        BrowserModule,
-                        MatCommonModule,
-                        SmartGridModule,
-                        SmartExpandableSectionModule,
-                        SmarttreeModule,
-                        SmartViewContextModule,
-                        SmartMapModule,
-                        SmartDiagramModule,
-                        InputGroupModule,
-                        InputGroupAddonModule,
-                    ],
-                    exports: [SmartComponentLayoutComponent],
-                    providers: [],
-                }]
-        }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartFilterEditorService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: FilterService }, { type: SmartViewContextService }] });
 
 class SmartFilterParamComponent {
     constructor() { }
@@ -23468,397 +23380,516 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
                     type: Optional
                 }] }], propDecorators: { service: [{
                 type: Input
-            }], vcRef: [{
-                type: ViewChild,
-                args: ['form', { read: ViewContainerRef }]
-            }], simpleFilterVcRef: [{
+            }], vcRef: [{
+                type: ViewChild,
+                args: ['form', { read: ViewContainerRef }]
+            }], simpleFilterVcRef: [{
+                type: ViewChild,
+                args: ['simpleFilterFromChild', { read: ViewContainerRef }]
+            }] } });
+
+/**
+ * A filter builder placed in a component layout. The identifier is the builder's filterId in the
+ * view: the widget loads the builder by it, and the client above the layout finds the widget by it
+ * for push updates and toolbar collection. Each widget owns its own SmartFilterEditorService.
+ */
+class SmartFilterWidgetComponent {
+    // A template reference instead of the class token: a value import of the editor would pull
+    // the library's module cycle into this file. The editor subscribes to modelChanged in its own
+    // ngAfterViewInit, which runs before this setter fires, so the action refresh below always
+    // follows the editor's toolbar rebuild.
+    set contentComponentSetter(comp) {
+        if (comp && !this.contentComponent) {
+            this.service.modelChanged
+                .pipe(takeUntil(this._destroy$))
+                .subscribe(() => this.parent?.initActions());
+        }
+        this.contentComponent = comp;
+    }
+    constructor(service) {
+        this.service = service;
+        this._destroy$ = new Subject();
+    }
+    ngOnChanges() {
+        this.service.config = { uuid: this.uuid, identifier: this.identifier };
+        this.service.parentSmartComponent = this.parent;
+        if (this.uuid) {
+            this.service.load();
+        }
+    }
+    ngOnDestroy() {
+        this._destroy$.next();
+        this._destroy$.complete();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartFilterWidgetComponent, deps: [{ token: SmartFilterEditorService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartFilterWidgetComponent, selector: "smart-filter-widget", inputs: { uuid: "uuid", identifier: "identifier", parent: "parent" }, providers: [SmartFilterEditorService], viewQueries: [{ propertyName: "contentComponentSetter", first: true, predicate: ["editor"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"filter-widget-container\" *ngIf=\"service.model\">\r\n  <smart-filter-group-params [service]=\"service\"></smart-filter-group-params>\r\n  <smart-filter-expression-editor #editor [service]=\"service\"></smart-filter-expression-editor>\r\n</div>\r\n", styles: [".filter-widget-container{display:flex;flex-direction:row}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SmartFilterParamsComponent, selector: "smart-filter-group-params", inputs: ["service"] }, { kind: "component", type: SmartFilterEditorContentComponent, selector: "smart-filter-expression-editor", inputs: ["service"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartFilterWidgetComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'smart-filter-widget', providers: [SmartFilterEditorService], template: "<div class=\"filter-widget-container\" *ngIf=\"service.model\">\r\n  <smart-filter-group-params [service]=\"service\"></smart-filter-group-params>\r\n  <smart-filter-expression-editor #editor [service]=\"service\"></smart-filter-expression-editor>\r\n</div>\r\n", styles: [".filter-widget-container{display:flex;flex-direction:row}\n"] }]
+        }], ctorParameters: () => [{ type: SmartFilterEditorService }], propDecorators: { uuid: [{
+                type: Input
+            }], identifier: [{
+                type: Input
+            }], parent: [{
+                type: Input
+            }], contentComponentSetter: [{
                 type: ViewChild,
-                args: ['simpleFilterFromChild', { read: ViewContainerRef }]
+                args: ['editor']
             }] } });
 
-/**
- * Custom HttpParameterCodec
- * Workaround for https://github.com/angular/angular/issues/18261
- */
-class CustomHttpParameterCodec {
-    encodeKey(k) {
-        return encodeURIComponent(k);
+class SmartComponentLayoutComponent {
+    get testId() {
+        return this.smartComponentLayout?.identifier ?? null;
     }
-    encodeValue(v) {
-        return encodeURIComponent(v);
+    get isHorizontal() {
+        return (this.smartComponentLayout?.type === this.type().CONTAINER &&
+            this.smartComponentLayout?.direction === 'horizontal');
     }
-    decodeKey(k) {
-        return decodeURIComponent(k);
+    get isVertical() {
+        return (this.smartComponentLayout?.type === this.type().CONTAINER &&
+            (this.smartComponentLayout?.direction ?? 'vertical') === 'vertical');
     }
-    decodeValue(v) {
-        return decodeURIComponent(v);
+    set embeddedSlotVcRefSetter(vcRef) {
+        this._embeddedSlotVcRef = vcRef;
+        if (vcRef) {
+            this.tryRegisterEmbeddedSlot();
+        }
     }
-}
-
-const BASE_PATH = new InjectionToken('basePath');
-const COLLECTION_FORMATS = {
-    'csv': ',',
-    'tsv': '   ',
-    'ssv': ' ',
-    'pipes': '|'
-};
-
-class Configuration {
-    constructor(configurationParameters = {}) {
-        this.apiKeys = configurationParameters.apiKeys;
-        this.username = configurationParameters.username;
-        this.password = configurationParameters.password;
-        this.accessToken = configurationParameters.accessToken;
-        this.basePath = configurationParameters.basePath;
-        this.withCredentials = configurationParameters.withCredentials;
-        this.encoder = configurationParameters.encoder;
-        if (configurationParameters.encodeParam) {
-            this.encodeParam = configurationParameters.encodeParam;
+    constructor(layoutService, viewContext, element, renderer) {
+        this.layoutService = layoutService;
+        this.viewContext = viewContext;
+        this.element = element;
+        this.renderer = renderer;
+        this._destroy$ = new Subject();
+        this.appRef = inject(ApplicationRef);
+        this.formRef = viewChild(SmartformComponent);
+        this.onFormChange = effect(() => {
+            const form = this.formRef();
+            if (this.smartForm && form && this.parentSmartComponent) {
+                this.parentSmartComponent.handleDataChangeSubscriptions(form);
+                this.parentSmartComponent.handleUploadCallback(form);
+                form.markAllWidgetsForChangeDetection();
+            }
+        });
+        this.pendingOrphanCleanup = false;
+        this.embeddedSlotActive = false;
+    }
+    ngAfterViewInit() {
+        if (this.smartFormList?.first) {
+            this.setFormComponent(this.smartFormList?.first);
         }
-        else {
-            this.encodeParam = param => this.defaultEncodeParam(param);
+        this.smartFormList.changes
+            .pipe(takeUntil(this._destroy$))
+            .subscribe((list) => {
+            this.setFormComponent(list.first);
+        });
+        if (this.smartGridList?.first) {
+            this.setGridComponent(this.smartGridList?.first);
         }
-        if (configurationParameters.credentials) {
-            this.credentials = configurationParameters.credentials;
+        this.smartGridList.changes
+            .pipe(takeUntil(this._destroy$))
+            .subscribe((list) => {
+            this.setGridComponent(list.first);
+        });
+        if (this.smartMapList?.first) {
+            this.setMapComponent(this.smartMapList?.first);
         }
-        else {
-            this.credentials = {};
+        this.smartMapList.changes.pipe(takeUntil(this._destroy$)).subscribe((maps) => {
+            this.setMapComponent(maps.first);
+        });
+        if (this.smartDiagramList?.first) {
+            this.setDiagramComponent(this.smartDiagramList?.first);
         }
-    }
-    /**
-     * Select the correct content-type to use for a request.
-     * Uses {@link Configuration#isJsonMime} to determine the correct content-type.
-     * If no content type is found return the first found type if the contentTypes is not empty
-     * @param contentTypes - the array of content types that are available for selection
-     * @returns the selected content-type or <code>undefined</code> if no selection could be made.
-     */
-    selectHeaderContentType(contentTypes) {
-        if (contentTypes.length === 0) {
-            return undefined;
+        this.smartDiagramList.changes.pipe(takeUntil(this._destroy$)).subscribe((diagrams) => {
+            this.setDiagramComponent(diagrams.first);
+        });
+        if (this.smartFilterList?.first) {
+            this.setFilterComponent(this.smartFilterList?.first);
         }
-        const type = contentTypes.find((x) => this.isJsonMime(x));
-        if (type === undefined) {
-            return contentTypes[0];
+        this.smartFilterList.changes.pipe(takeUntil(this._destroy$)).subscribe((filters) => {
+            this.setFilterComponent(filters.first);
+        });
+        if (this.toolbarList?.first) {
+            this.setToolbarComponent(this.toolbarList?.first);
         }
-        return type;
+        this.toolbarList.changes
+            .pipe(takeUntil(this._destroy$))
+            .subscribe((list) => {
+            this.setToolbarComponent(list.first);
+        });
+        this.setUp();
     }
-    /**
-     * Select the correct accept content-type to use for a request.
-     * Uses {@link Configuration#isJsonMime} to determine the correct accept content-type.
-     * If no content type is found return the first found type if the contentTypes is not empty
-     * @param accepts - the array of content types that are available for selection.
-     * @returns the selected content-type or <code>undefined</code> if no selection could be made.
-     */
-    selectHeaderAccept(accepts) {
-        if (accepts.length === 0) {
-            return undefined;
-        }
-        const type = accepts.find((x) => this.isJsonMime(x));
-        if (type === undefined) {
-            return accepts[0];
+    ngAfterViewChecked() {
+        if (this.pendingOrphanCleanup) {
+            this.pendingOrphanCleanup = false;
+            this.viewContext.cleanupOrphanedEmbeddedViews(this.uuid);
         }
-        return type;
-    }
-    /**
-     * Check if the given MIME is a JSON MIME.
-     * JSON MIME examples:
-     *   application/json
-     *   application/json; charset=UTF8
-     *   APPLICATION/JSON
-     *   application/vnd.company+json
-     * @param mime - MIME (Multipurpose Internet Mail Extensions)
-     * @return True if the given MIME is JSON, false otherwise.
-     */
-    isJsonMime(mime) {
-        const jsonMime = new RegExp('^(application\/json|[^;/ \t]+\/[^;/ \t]+[+]json)[ \t]*(;.*)?$', 'i');
-        return mime !== null && (jsonMime.test(mime) || mime.toLowerCase() === 'application/json-patch+json');
     }
-    lookupCredential(key) {
-        const value = this.credentials[key];
-        return typeof value === 'function'
-            ? value()
-            : value;
+    ngOnDestroy() {
+        if (this.embeddedSlotContainerId && this.uuid) {
+            this.viewContext.unregisterEmbeddedSlot(this.uuid, this.embeddedSlotContainerId);
+        }
+        this._destroy$.next();
+        this._destroy$.complete();
     }
-    defaultEncodeParam(param) {
-        // This implementation exists as fallback for missing configuration
-        // and for backwards compatibility to older typescript-angular generator versions.
-        // It only works for the 'simple' parameter style.
-        // Date-handling only works for the 'date-time' format.
-        // All other styles and Date-formats are probably handled incorrectly.
-        //
-        // But: if that's all you need (i.e.: the most common use-case): no need for customization!
-        const value = param.dataFormat === 'date-time' && param.value instanceof Date
-            ? param.value.toISOString()
-            : param.value;
-        return encodeURIComponent(String(value));
+    ngOnChanges(changes) {
+        this.setUp();
     }
-}
-
-/**
- * Filter API 2
- * Filter API 2
- *
- * The version of the OpenAPI document: 1.0.0
- * Contact: info@it4all.hu
- *
- * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
- * https://openapi-generator.tech
- * Do not edit the class manually.
- */
-/* tslint:disable:no-unused-variable member-ordering */
-class FilterService {
-    constructor(httpClient, basePath, configuration) {
-        this.httpClient = httpClient;
-        this.basePath = 'http://localhost';
-        this.defaultHeaders = new HttpHeaders();
-        this.configuration = new Configuration();
-        if (configuration) {
-            this.configuration = configuration;
+    setUp() {
+        if (!this.parentSmartComponent || !this.smartComponentLayout) {
+            return;
         }
-        if (typeof this.configuration.basePath !== 'string') {
-            if (Array.isArray(basePath) && basePath.length > 0) {
-                basePath = basePath[0];
-            }
-            if (typeof basePath !== 'string') {
-                basePath = this.basePath;
-            }
-            this.configuration.basePath = basePath;
+        if (deepEqual(this.smartComponentLayout, this.currentLayout)) {
+            // no layout change, keep current state
+            this.smartComponentLayout = this.currentLayout;
+            return;
         }
-        this.encoder = this.configuration.encoder || new CustomHttpParameterCodec();
-    }
-    // @ts-ignore
-    addToHttpParams(httpParams, value, key) {
-        if (typeof value === "object" && value instanceof Date === false) {
-            httpParams = this.addToHttpParamsRecursive(httpParams, value);
+        // layout changed, render, but save current
+        // this.currentLayout = JSON.parse(JSON.stringify(this.smartComponentLayout));
+        SmartComponentLayoutUtility.clearFormHandlers(this);
+        this.currentLayout = this.smartComponentLayout;
+        this.uuid = this.parentSmartComponent.uuid;
+        this.treeService = this.parentSmartComponent.smartTreeService;
+        // Top-level layout: detach embedded views before the tree is re-rendered,
+        // so they survive *ngFor component destruction
+        if (!this.parentLayoutComponent && this.uuid) {
+            this.viewContext.detachAllEmbeddedViews(this.uuid);
+            this.pendingOrphanCleanup = true;
+        }
+        this.smartComponentLayout?.direction;
+        // the nature of the layout might have changed (e.g. from GRID to FORM), we null out every
+        // template-related element, so no stale data is left on screen:
+        this.expandableSection = undefined;
+        this.smartForm = undefined;
+        this.smartFormComponent = undefined;
+        this.smartGrid = undefined;
+        this.smartGridComponent = undefined;
+        this.filterId = undefined;
+        this.smartFilterComponent = undefined;
+        this.smartGrid = undefined;
+        this.toolbarId = undefined;
+        this.toolbar = undefined;
+        // null out toolbar?
+        this.mapId = undefined;
+        this.smartDiagramId = undefined;
+        if (this.embeddedSlotContainerId && this.uuid) {
+            this.viewContext.unregisterEmbeddedSlot(this.uuid, this.embeddedSlotContainerId);
         }
-        else {
-            httpParams = this.addToHttpParamsRecursive(httpParams, value, key);
+        this.embeddedSlotActive = false;
+        this.embeddedSlotContainerId = undefined;
+        if (this.smartComponentLayout?.expandable) {
+            this.constructExpandableSection();
         }
-        return httpParams;
-    }
-    addToHttpParamsRecursive(httpParams, value, key) {
-        if (value == null) {
-            return httpParams;
+        else if (this.smartComponentLayout?.type === ComponentType.FORM) {
+            this.constructForm();
         }
-        if (typeof value === "object") {
-            if (Array.isArray(value)) {
-                value.forEach(elem => httpParams = this.addToHttpParamsRecursive(httpParams, elem, key));
+        else if (this.smartComponentLayout?.type === ComponentType.WIDGET) {
+            if (this.smartComponentLayout.widget?.type === ComponentWidgetType.GRID) {
+                this.constructGrid();
             }
-            else if (value instanceof Date) {
-                if (key != null) {
-                    httpParams = httpParams.append(key, value.toISOString().substr(0, 10));
-                }
-                else {
-                    throw Error("key may not be null if value is Date");
-                }
+            else if (this.smartComponentLayout.widget?.type === ComponentWidgetType.FILTER) {
+                this.constructFilter();
             }
-            else {
-                Object.keys(value).forEach(k => httpParams = this.addToHttpParamsRecursive(httpParams, value[k], key != null ? `${key}.${k}` : k));
+            else if (this.smartComponentLayout.widget?.type === ComponentWidgetType.TREE) {
+                this.constructTree();
             }
-        }
-        else if (key != null) {
-            httpParams = httpParams.append(key, value);
-        }
-        else {
-            throw Error("key may not be null if value is not object or array");
-        }
-        return httpParams;
-    }
-    load(uuid, filterIdentifier, observe = 'body', reportProgress = false, options) {
-        if (uuid === null || uuid === undefined) {
-            throw new Error('Required parameter uuid was null or undefined when calling load.');
-        }
-        if (filterIdentifier === null || filterIdentifier === undefined) {
-            throw new Error('Required parameter filterIdentifier was null or undefined when calling load.');
-        }
-        let localVarHeaders = this.defaultHeaders;
-        let localVarHttpHeaderAcceptSelected = options && options.httpHeaderAccept;
-        if (localVarHttpHeaderAcceptSelected === undefined) {
-            // to determine the Accept header
-            const httpHeaderAccepts = [
-                'application/json'
-            ];
-            localVarHttpHeaderAcceptSelected = this.configuration.selectHeaderAccept(httpHeaderAccepts);
-        }
-        if (localVarHttpHeaderAcceptSelected !== undefined) {
-            localVarHeaders = localVarHeaders.set('Accept', localVarHttpHeaderAcceptSelected);
-        }
-        let localVarHttpContext = options && options.context;
-        if (localVarHttpContext === undefined) {
-            localVarHttpContext = new HttpContext();
-        }
-        let responseType_ = 'json';
-        if (localVarHttpHeaderAcceptSelected) {
-            if (localVarHttpHeaderAcceptSelected.startsWith('text')) {
-                responseType_ = 'text';
+            else if (this.smartComponentLayout.widget?.type === ComponentWidgetType.TOOLBAR) {
+                this.constructToolbar();
             }
-            else if (this.configuration.isJsonMime(localVarHttpHeaderAcceptSelected)) {
-                responseType_ = 'json';
+            else if (this.smartComponentLayout.widget?.type === ComponentWidgetType.MAP) {
+                this.constructMap();
             }
-            else {
-                responseType_ = 'blob';
+            else if (this.smartComponentLayout.widget?.type === ComponentWidgetType.DIAGRAM) {
+                this.construcDiagram();
+            }
+            else if (this.smartComponentLayout.widget?.type === ComponentWidgetType.EMBEDDED_SLOT) {
+                this.constructEmbeddedSlot();
+            }
+            if (!this.parentLayoutComponent) {
+                // only top level component should call init actions
+                this.parentSmartComponent.initActions();
             }
         }
-        let localVarPath = `/filter/${this.configuration.encodeParam({ name: "uuid", value: uuid, in: "path", style: "simple", explode: false, dataType: "string", dataFormat: "uuid" })}/${this.configuration.encodeParam({ name: "filterIdentifier", value: filterIdentifier, in: "path", style: "simple", explode: false, dataType: "string", dataFormat: undefined })}/load`;
-        return this.httpClient.request('get', `${this.configuration.basePath}${localVarPath}`, {
-            context: localVarHttpContext,
-            responseType: responseType_,
-            withCredentials: this.configuration.withCredentials,
-            headers: localVarHeaders,
-            observe: observe,
-            reportProgress: reportProgress
-        });
+        SmartStyleUtility.applyStyle(this.smartComponentLayout.style, this.element, this.renderer);
     }
-    performWidgetAction(uuid, filterIdentifier, body, observe = 'body', reportProgress = false, options) {
-        if (uuid === null || uuid === undefined) {
-            throw new Error('Required parameter uuid was null or undefined when calling performWidgetAction.');
-        }
-        if (filterIdentifier === null || filterIdentifier === undefined) {
-            throw new Error('Required parameter filterIdentifier was null or undefined when calling performWidgetAction.');
+    type() {
+        return ComponentType;
+    }
+    constructExpandableSection() {
+        let data = { ...this.smartComponentLayout };
+        data.expandable = false;
+        this.expandableSection = {
+            title: this.smartComponentLayout?.expandableSectionLabel ?? '',
+            inputs: new Map([
+                ['smartComponentLayout', data],
+                ['parentSmartComponent', this.parentSmartComponent],
+                ['parentLayoutComponent', this.parentLayoutComponent],
+            ]),
+            headerToolbarId: this.smartComponentLayout?.expandableSectionHeaderToolbarId,
+            customComponent: SmartComponentLayoutComponent,
+        };
+    }
+    constructForm() {
+        const widgets = this.layoutService.render({
+            layoutDefinitions: this.smartComponentLayout?.form,
+        });
+        if (this.gridRow && !this.gridRow.valueSets && this.parentSmartComponent?.model) {
+            this.gridRow.valueSets = this.parentSmartComponent.model.valueSets;
         }
-        if (body === null || body === undefined) {
-            throw new Error('Required parameter body was null or undefined when calling performWidgetAction.');
+        this.smartForm = {
+            direction: this.getFormLayout(),
+            componentModel: this.gridRow ? this.gridRow : this.parentSmartComponent?.model,
+            widgets,
+        };
+        this.bindForm();
+    }
+    getFormLayout() {
+        if (this.smartComponentLayout?.direction) {
+            return this.smartComponentLayout?.direction === LayoutDirection.HORIZONTAL
+                ? SmartFormWidgetDirection.ROW
+                : SmartFormWidgetDirection.COL;
         }
-        let localVarHeaders = this.defaultHeaders;
-        let localVarHttpHeaderAcceptSelected = options && options.httpHeaderAccept;
-        if (localVarHttpHeaderAcceptSelected === undefined) {
-            // to determine the Accept header
-            const httpHeaderAccepts = [
-                'application/json'
-            ];
-            localVarHttpHeaderAcceptSelected = this.configuration.selectHeaderAccept(httpHeaderAccepts);
+        return SmartFormWidgetDirection.COL;
+    }
+    setFormComponent(comp) {
+        if (!this.smartFormComponent) {
+            this.smartFormComponent = comp;
+            this.bindForm();
         }
-        if (localVarHttpHeaderAcceptSelected !== undefined) {
-            localVarHeaders = localVarHeaders.set('Accept', localVarHttpHeaderAcceptSelected);
+    }
+    bindForm() {
+        if (this.parentSmartComponent?.useQueryLists) {
+            return;
         }
-        let localVarHttpContext = options && options.context;
-        if (localVarHttpContext === undefined) {
-            localVarHttpContext = new HttpContext();
+        if (this.smartForm && this.smartFormComponent) {
+            this.parentSmartComponent?.addForm(
+            // unique identifier for the form
+            `form_${this.makeid(5)}`, this.smartForm, this.smartFormComponent);
         }
-        // to determine the Content-Type header
-        const consumes = [
-            'application/json'
-        ];
-        const httpContentTypeSelected = this.configuration.selectHeaderContentType(consumes);
-        if (httpContentTypeSelected !== undefined) {
-            localVarHeaders = localVarHeaders.set('Content-Type', httpContentTypeSelected);
+    }
+    makeid(length) {
+        let result = '';
+        const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+        const charactersLength = characters.length;
+        let counter = 0;
+        while (counter < length) {
+            result += characters.charAt(Math.floor(Math.random() * charactersLength));
+            counter += 1;
         }
-        let responseType_ = 'json';
-        if (localVarHttpHeaderAcceptSelected) {
-            if (localVarHttpHeaderAcceptSelected.startsWith('text')) {
-                responseType_ = 'text';
-            }
-            else if (this.configuration.isJsonMime(localVarHttpHeaderAcceptSelected)) {
-                responseType_ = 'json';
-            }
-            else {
-                responseType_ = 'blob';
-            }
+        return result;
+    }
+    constructGrid() {
+        this.smartGrid = {
+            gridIdentifier: this.smartComponentLayout?.widget?.identifier,
+            gridModel: {
+                page: {},
+            },
+            options: {
+                rowUiActionType: GridUiActionType.POPUP_MENU,
+            },
+            layoutDef: SmartLayoutDef.TABLE,
+            paginator: false,
+            layoutComponent: SmartComponentLayoutComponent,
+            layoutUtility: SmartComponentLayoutUtility,
+        };
+        this.bindGrid();
+    }
+    setGridComponent(comp) {
+        if (!this.smartGridComponent) {
+            this.smartGridComponent = comp;
+            this.bindGrid();
         }
-        let localVarPath = `/filter/${this.configuration.encodeParam({ name: "uuid", value: uuid, in: "path", style: "simple", explode: false, dataType: "string", dataFormat: "uuid" })}/${this.configuration.encodeParam({ name: "filterIdentifier", value: filterIdentifier, in: "path", style: "simple", explode: false, dataType: "string", dataFormat: undefined })}/performWidgetAction`;
-        return this.httpClient.request('post', `${this.configuration.basePath}${localVarPath}`, {
-            context: localVarHttpContext,
-            body: body,
-            responseType: responseType_,
-            withCredentials: this.configuration.withCredentials,
-            headers: localVarHeaders,
-            observe: observe,
-            reportProgress: reportProgress
-        });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FilterService, deps: [{ token: i1.HttpClient }, { token: BASE_PATH, optional: true }, { token: Configuration, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FilterService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FilterService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [BASE_PATH]
-                }] }, { type: Configuration, decorators: [{
-                    type: Optional
-                }] }] });
-
-class SmartFilterEditorService {
-    constructor(service, viewCtxService) {
-        this.service = service;
-        this.viewCtxService = viewCtxService;
-        this.modelChanged = new Subject();
-        this.submit = new Subject();
-        this.itemSelected = new Subject();
-        this.toolbars = [];
+    bindGrid() {
+        if (this.parentSmartComponent?.useQueryLists) {
+            if (this.smartGrid && this.smartGridComponent && this.parentSmartComponent) {
+                this.parentSmartComponent.setupGridServices(this.smartGridComponent);
+            }
+            return;
+        }
+        if (this.smartGrid && this.smartGridComponent) {
+            this.smartGrid = this.parentSmartComponent?.addGrid(this.smartGrid, {
+                rowUiActionType: GridUiActionType.POPUP_MENU,
+            }, false, this.smartGridComponent);
+        }
     }
-    submitForm(validate) {
-        // NOPE
+    constructMap() {
+        this.mapId = this.smartComponentLayout?.widget?.identifier;
+        this.bindMap();
     }
-    getInvalidFields() {
-        return { invalidFieldKeys: [], invalidFieldNames: [] };
+    construcDiagram() {
+        this.smartDiagramId = this.smartComponentLayout?.widget?.identifier;
+        this.bindDiagram();
     }
-    getComplexToolbars() {
-        return [...this.toolbars];
+    setMapComponent(comp) {
+        if (!this.smartMapComponent) {
+            this.smartMapComponent = comp;
+            this.bindMap();
+        }
     }
-    setComplexToolbars(toolbars) {
-        this.toolbars = [...toolbars];
-        this.parentSmartComponent?.initActions();
+    setDiagramComponent(comp) {
+        if (!this.smartDiagramComponent) {
+            this.smartDiagramComponent = comp;
+            this.bindDiagram();
+        }
     }
-    async load() {
-        if (this.config.uuid) {
-            this.model = await this.service.load(this.config.uuid, this.config.identifier).toPromise();
-            this.modelChanged.next();
+    setFilterComponent(comp) {
+        if (!this.smartFilterComponent) {
+            this.smartFilterComponent = comp;
+            this.bindFilter();
         }
     }
-    async peformWidgetAction(request) {
-        if (this.config.uuid) {
-            let filterView = this.viewCtxService
-                .getCurrentViewContext()
-                ?.views.find((view) => view.uuid == this.config.uuid);
-            if (filterView && filterView.state != ViewState.CLOSED) {
-                this.model = await this.service
-                    .performWidgetAction(this.config.uuid, this.config.identifier, request)
-                    .toPromise();
-                this.modelChanged.next();
-            }
+    bindMap() {
+        if (this.parentSmartComponent.useQueryLists) {
+            return;
         }
+        console.warn('Map components are only supported through QueryLists!');
     }
-    getModel() {
-        return this.model;
+    bindDiagram() {
+        if (this.parentSmartComponent.useQueryLists) {
+            return;
+        }
+        console.warn('Diagram components are only supported through QueryLists!');
     }
-    async performUiActionRequest(uiActionRequest, widgetId, nodeId) {
-        await this.peformWidgetAction(uiActionRequest);
+    setToolbarComponent(comp) {
+        this.toolbar = comp;
     }
-    async handleSpecificDemandsAsynchronously(uiAction, uiActionRequest) {
-        return {
-            shouldPerformAction: true,
-            uiActionRequest: uiActionRequest,
-        };
+    constructFilter() {
+        this.filterId = this.smartComponentLayout?.widget?.identifier;
+        this.bindFilter();
     }
-    getAdditionalParams(uiAction) {
-        throw new Error('Method not implemented.');
+    bindFilter() {
+        if (this.parentSmartComponent.useQueryLists) {
+            return;
+        }
+        console.warn('Filter widgets are only supported through QueryLists!');
     }
-    async bulkUpdateFilterExpression(operationType, item) {
-        if (!this.model?.readOnly) {
-            if (item) {
-                item.expressionData.boolOperator = operationType;
+    constructTree() {
+        if (this.parentSmartComponent?.useQueryLists) {
+            return;
+        }
+        this.parentSmartComponent.setUpDefaultTree(this.smartComponentLayout?.widget?.identifier);
+        this.treeService?.initialize();
+    }
+    constructToolbar() {
+        let toolbarId = this.smartComponentLayout?.widget?.identifier;
+        if (this.toolbarId !== toolbarId) {
+            this.toolbarId = toolbarId;
+        }
+        let properties = this.smartComponentLayout?.widget?.properties;
+        if (properties && properties['toolbar_properties']) {
+            this.toolbarPropertes = properties['toolbar_properties'];
+        }
+    }
+    constructEmbeddedSlot() {
+        this.embeddedSlotContainerId = this.smartComponentLayout?.widget?.identifier;
+        this.embeddedSlotActive = true;
+        this.tryRegisterEmbeddedSlot();
+    }
+    tryRegisterEmbeddedSlot() {
+        if (this.embeddedSlotContainerId && this.uuid && this._embeddedSlotVcRef) {
+            // An EMBEDDED_SLOT widget slot is LAYOUT-kind: it lives inside the re-rendering
+            // layout *ngFor, so its child must be detached before a top-level re-render and
+            // reattaches when this slot re-registers. (#28870)
+            this.viewContext.registerEmbeddedSlot(this.uuid, this.embeddedSlotContainerId, this._embeddedSlotVcRef, 'layout');
+        }
+    }
+    updateUuid(newUuid) {
+        const oldUuid = this.uuid;
+        this.uuid = newUuid;
+        if (oldUuid !== newUuid && this.embeddedSlotContainerId) {
+            if (oldUuid) {
+                this.viewContext.unregisterEmbeddedSlot(oldUuid, this.embeddedSlotContainerId);
             }
-            await this.peformWidgetAction({
-                code: 'BULK_UPDATE_FILTER_EXPRESSION',
-                params: {
-                    model: item,
-                    operator: operationType,
-                },
-            });
+            this.tryRegisterEmbeddedSlot();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartFilterEditorService, deps: [{ token: FilterService }, { token: SmartViewContextService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartFilterEditorService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartComponentLayoutComponent, deps: [{ token: SmartformLayoutDefinitionService }, { token: SmartViewContextService }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: SmartComponentLayoutComponent, selector: "smart-component-layout", inputs: { smartComponentLayout: "smartComponentLayout", parentLayoutComponent: "parentLayoutComponent", parentSmartComponent: "parentSmartComponent", gridRow: "gridRow" }, host: { properties: { "attr.data-testid": "this.testId", "class.horizontal": "this.isHorizontal", "class.vertical": "this.isVertical" } }, viewQueries: [{ propertyName: "formRef", first: true, predicate: SmartformComponent, descendants: true, isSignal: true }, { propertyName: "embeddedSlotVcRefSetter", first: true, predicate: ["embeddedSlot"], descendants: true, read: ViewContainerRef }, { propertyName: "smartFormList", predicate: ["form"], descendants: true }, { propertyName: "smartGridList", predicate: ["grid"], descendants: true }, { propertyName: "smartMapList", predicate: ["map"], descendants: true }, { propertyName: "smartDiagramList", predicate: ["diagram"], descendants: true }, { propertyName: "smartFilterList", predicate: ["filter"], descendants: true }, { propertyName: "toolbarList", predicate: ["toolbar"], descendants: true }, { propertyName: "expandableComponents", predicate: ExpandableSectionComponent, descendants: true }, { propertyName: "components", predicate: SmartComponentLayoutComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"smartComponentLayout?.expandable; then expandable; else normal\"> </div>\r\n\r\n<ng-template #expandable>\r\n  <smart-expandable-section\r\n    *ngIf=\"expandableSection\"\r\n    [data]=\"expandableSection\"\r\n  ></smart-expandable-section>\r\n</ng-template>\r\n\r\n<ng-template #normal>\r\n  @if (smartComponentLayout?.type === type().CONTAINER) {\r\n    <smart-component-layout\r\n      *ngFor=\"let layout of smartComponentLayout?.components\"\r\n      [parentSmartComponent]=\"parentSmartComponent\"\r\n      [parentLayoutComponent]=\"this\"\r\n      [smartComponentLayout]=\"layout\"\r\n      [gridRow]=\"gridRow\"\r\n    ></smart-component-layout>\r\n  }\r\n  <smartform *ngIf=\"smartForm\" #form [smartForm]=\"smartForm\"></smartform>\r\n  <smart-grid\r\n    *ngIf=\"smartGrid\"\r\n    #grid\r\n    [smartGrid]=\"smartGrid\"\r\n    [uuid]=\"uuid!\"\r\n    [parentLayoutComponent]=\"this\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-grid>\r\n  <smart-map\r\n    *ngIf=\"!!uuid && !!mapId\"\r\n    #map\r\n    [uuid]=\"uuid\"\r\n    [identifier]=\"mapId\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-map>\r\n  <smart-diagram\r\n    *ngIf=\"!!uuid && !!smartDiagramId\"\r\n    #diagram\r\n    [uuid]=\"uuid\"\r\n    [identifier]=\"smartDiagramId\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-diagram>\r\n  <smart-filter-widget\r\n    *ngIf=\"!!uuid && !!filterId\"\r\n    #filter\r\n    [uuid]=\"uuid\"\r\n    [identifier]=\"filterId\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-filter-widget>\r\n  <smart-tree *ngIf=\"treeService\" [treeService]=\"treeService!\"></smart-tree>\r\n  <smart-ui-action-toolbar\r\n    *ngIf=\"!!toolbarId\"\r\n    #toolbar\r\n    [id]=\"toolbarId\"\r\n    [toolbarPropertes]=\"toolbarPropertes\"\r\n  ></smart-ui-action-toolbar>\r\n  <ng-container *ngIf=\"embeddedSlotActive\" #embeddedSlot></ng-container>\r\n</ng-template>\r\n", styles: [":host(.horizontal){display:flex;flex-direction:row}:host(.vertical){display:flex;flex-direction:column}:host(.horizontal) smart-component-layout{display:flex}:host(.horizontal) smartform{flex:1;display:flex}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SmartGridComponent, selector: "smart-grid", inputs: ["smartGrid", "uuid", "parent", "parentLayoutComponent", "dev"] }, { kind: "component", type: ExpandableSectionComponent, selector: "smart-expandable-section", inputs: ["data", "index"] }, { kind: "component", type: SmartTreeComponent, selector: "smart-tree", inputs: ["treeStyle", "treeService"] }, { kind: "component", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: ["uiActionModels", "uiActionDescriptorService", "id", "scrollOnWrap", "toolbarPropertes"] }, { kind: "component", type: SmartformComponent, selector: "smartform", inputs: ["smartForm"] }, { kind: "component", type: SmartMapComponent, selector: "smart-map", inputs: ["uuid", "identifier", "parent"] }, { kind: "component", type: SmartDiagramComponent, selector: "smart-diagram", inputs: ["uuid", "identifier", "parent", "diagramModel", "options", "plugins"], outputs: ["elementSelect", "canvasClick", "dataClick"] }, { kind: "component", type: SmartFilterWidgetComponent, selector: "smart-filter-widget", inputs: ["uuid", "identifier", "parent"] }, { kind: "component", type: SmartComponentLayoutComponent, selector: "smart-component-layout", inputs: ["smartComponentLayout", "parentLayoutComponent", "parentSmartComponent", "gridRow"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartFilterEditorService, decorators: [{
-            type: Injectable
-        }], ctorParameters: () => [{ type: FilterService }, { type: SmartViewContextService }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartComponentLayoutComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'smart-component-layout', template: "<div *ngIf=\"smartComponentLayout?.expandable; then expandable; else normal\"> </div>\r\n\r\n<ng-template #expandable>\r\n  <smart-expandable-section\r\n    *ngIf=\"expandableSection\"\r\n    [data]=\"expandableSection\"\r\n  ></smart-expandable-section>\r\n</ng-template>\r\n\r\n<ng-template #normal>\r\n  @if (smartComponentLayout?.type === type().CONTAINER) {\r\n    <smart-component-layout\r\n      *ngFor=\"let layout of smartComponentLayout?.components\"\r\n      [parentSmartComponent]=\"parentSmartComponent\"\r\n      [parentLayoutComponent]=\"this\"\r\n      [smartComponentLayout]=\"layout\"\r\n      [gridRow]=\"gridRow\"\r\n    ></smart-component-layout>\r\n  }\r\n  <smartform *ngIf=\"smartForm\" #form [smartForm]=\"smartForm\"></smartform>\r\n  <smart-grid\r\n    *ngIf=\"smartGrid\"\r\n    #grid\r\n    [smartGrid]=\"smartGrid\"\r\n    [uuid]=\"uuid!\"\r\n    [parentLayoutComponent]=\"this\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-grid>\r\n  <smart-map\r\n    *ngIf=\"!!uuid && !!mapId\"\r\n    #map\r\n    [uuid]=\"uuid\"\r\n    [identifier]=\"mapId\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-map>\r\n  <smart-diagram\r\n    *ngIf=\"!!uuid && !!smartDiagramId\"\r\n    #diagram\r\n    [uuid]=\"uuid\"\r\n    [identifier]=\"smartDiagramId\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-diagram>\r\n  <smart-filter-widget\r\n    *ngIf=\"!!uuid && !!filterId\"\r\n    #filter\r\n    [uuid]=\"uuid\"\r\n    [identifier]=\"filterId\"\r\n    [parent]=\"parentSmartComponent\"\r\n  ></smart-filter-widget>\r\n  <smart-tree *ngIf=\"treeService\" [treeService]=\"treeService!\"></smart-tree>\r\n  <smart-ui-action-toolbar\r\n    *ngIf=\"!!toolbarId\"\r\n    #toolbar\r\n    [id]=\"toolbarId\"\r\n    [toolbarPropertes]=\"toolbarPropertes\"\r\n  ></smart-ui-action-toolbar>\r\n  <ng-container *ngIf=\"embeddedSlotActive\" #embeddedSlot></ng-container>\r\n</ng-template>\r\n", styles: [":host(.horizontal){display:flex;flex-direction:row}:host(.vertical){display:flex;flex-direction:column}:host(.horizontal) smart-component-layout{display:flex}:host(.horizontal) smartform{flex:1;display:flex}\n"] }]
+        }], ctorParameters: () => [{ type: SmartformLayoutDefinitionService }, { type: SmartViewContextService }, { type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { smartComponentLayout: [{
+                type: Input
+            }], parentLayoutComponent: [{
+                type: Input
+            }], parentSmartComponent: [{
+                type: Input
+            }], gridRow: [{
+                type: Input
+            }], testId: [{
+                type: HostBinding,
+                args: ['attr.data-testid']
+            }], isHorizontal: [{
+                type: HostBinding,
+                args: ['class.horizontal']
+            }], isVertical: [{
+                type: HostBinding,
+                args: ['class.vertical']
+            }], smartFormList: [{
+                type: ViewChildren,
+                args: ['form']
+            }], smartGridList: [{
+                type: ViewChildren,
+                args: ['grid']
+            }], smartMapList: [{
+                type: ViewChildren,
+                args: ['map']
+            }], smartDiagramList: [{
+                type: ViewChildren,
+                args: ['diagram']
+            }], smartFilterList: [{
+                type: ViewChildren,
+                args: ['filter']
+            }], toolbarList: [{
+                type: ViewChildren,
+                args: ['toolbar']
+            }], embeddedSlotVcRefSetter: [{
+                type: ViewChild,
+                args: ['embeddedSlot', { read: ViewContainerRef, static: false }]
+            }], expandableComponents: [{
+                type: ViewChildren,
+                args: [ExpandableSectionComponent]
+            }], components: [{
+                type: ViewChildren,
+                args: [SmartComponentLayoutComponent]
+            }] } });
+
+const DEFAULT_PROVIDERS = [
+    DefaultChartOptionsProvider,
+    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: barChart, multi: true },
+    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: scatterChart, multi: true },
+    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: bubbleChart, multi: true },
+    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: horizontalBarChart, multi: true },
+    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: stackedBarChart, multi: true },
+    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: horizontalStackedBarChart, multi: true },
+    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: multiAxisLineChart, multi: true },
+    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: polarAreaChart, multi: true },
+    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: radarChart, multi: true },
+    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: doughnutChart, multi: true },
+    { provide: CUSTOM_DIAGRAM_OPTIONS, useValue: pieChart, multi: true },
+];
+class SmartDiagramModule {
+    static forRoot(providers) {
+        return {
+            ngModule: SmartDiagramModule,
+            providers: [...DEFAULT_PROVIDERS, ...providers],
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartDiagramModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.11", ngImport: i0, type: SmartDiagramModule, declarations: [SmartDiagramComponent], imports: [BrowserModule, ChartModule], exports: [SmartDiagramComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartDiagramModule, imports: [BrowserModule, ChartModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartDiagramModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [SmartDiagramComponent],
+                    imports: [BrowserModule, ChartModule],
+                    exports: [SmartDiagramComponent],
+                }]
+        }] });
 
 class SmartFilterEditorModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartFilterEditorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
@@ -23869,7 +23900,8 @@ class SmartFilterEditorModule {
             SmartFilterExpressionItemComponent,
             AdvancedSmartFilterExpressionItemComponent,
             AdvancedRelationButtonComponent,
-            ExpressionEditorDialogComponent], imports: [CommonModule,
+            ExpressionEditorDialogComponent,
+            SmartFilterWidgetComponent], imports: [CommonModule,
             SmartIconModule,
             SmartExpandableSectionModule,
             SmartViewContextModule,
@@ -23882,7 +23914,8 @@ class SmartFilterEditorModule {
             SmartFilterExpressionItemComponent,
             AdvancedSmartFilterExpressionItemComponent,
             AdvancedRelationButtonComponent,
-            ExpressionEditorDialogComponent] }); }
+            ExpressionEditorDialogComponent,
+            SmartFilterWidgetComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartFilterEditorModule, imports: [CommonModule,
             SmartIconModule,
             SmartExpandableSectionModule,
@@ -23903,6 +23936,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
                         AdvancedSmartFilterExpressionItemComponent,
                         AdvancedRelationButtonComponent,
                         ExpressionEditorDialogComponent,
+                        SmartFilterWidgetComponent,
                     ],
                     imports: [
                         CommonModule,
@@ -23922,7 +23956,55 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
                         AdvancedSmartFilterExpressionItemComponent,
                         AdvancedRelationButtonComponent,
                         ExpressionEditorDialogComponent,
+                        SmartFilterWidgetComponent,
+                    ],
+                    providers: [],
+                }]
+        }] });
+
+class SmartComponentLayoutModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartComponentLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.11", ngImport: i0, type: SmartComponentLayoutModule, declarations: [SmartComponentLayoutComponent], imports: [BrowserModule,
+            MatCommonModule,
+            SmartGridModule,
+            SmartExpandableSectionModule,
+            SmarttreeModule,
+            SmartViewContextModule,
+            SmartMapModule,
+            SmartDiagramModule,
+            SmartFilterEditorModule,
+            InputGroupModule,
+            InputGroupAddonModule], exports: [SmartComponentLayoutComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartComponentLayoutModule, imports: [BrowserModule,
+            MatCommonModule,
+            SmartGridModule,
+            SmartExpandableSectionModule,
+            SmarttreeModule,
+            SmartViewContextModule,
+            SmartMapModule,
+            SmartDiagramModule,
+            SmartFilterEditorModule,
+            InputGroupModule,
+            InputGroupAddonModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartComponentLayoutModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [SmartComponentLayoutComponent],
+                    imports: [
+                        BrowserModule,
+                        MatCommonModule,
+                        SmartGridModule,
+                        SmartExpandableSectionModule,
+                        SmarttreeModule,
+                        SmartViewContextModule,
+                        SmartMapModule,
+                        SmartDiagramModule,
+                        SmartFilterEditorModule,
+                        InputGroupModule,
+                        InputGroupAddonModule,
                     ],
+                    exports: [SmartComponentLayoutComponent],
                     providers: [],
                 }]
         }] });
@@ -24509,6 +24591,9 @@ class SmartComponentApiClient {
     }
     getAllSmartFilterEditorContentComponents() {
         let filters = this.getSmartFilterEditorContentComponentsQL()?.toArray() ?? [];
+        this.getSmartComponentLayoutsQL()?.forEach((comp) => {
+            filters.push(...SmartComponentLayoutUtility.getFilters(comp));
+        });
         return filters;
     }
     getAllSmartUiActionToolbars() {
@@ -25970,5 +26055,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { APIS$5 as APIS, AbstractMap, AclEditingViewComponent, AdvancedRelationButtonComponent, AdvancedSmartFilterExpressionItemComponent, ApiModule$5 as ApiModule, ApiQueueService, BASE_PATH$7 as BASE_PATH, COLLECTION_FORMATS$7 as COLLECTION_FORMATS, COMPONENT_LIBRARY, CUSTOM_DIAGRAM_OPTIONS, ClickMenuComponent, CloseResult, ComparableDropdownDirective, ComparableMultiselectDirective, ComponentFactoryService, ComponentFactoryServiceModule, ComponentLibrary, ComponentType, ComponentWidgetType, Configuration$7 as Configuration, DIALOG_DISABLE_CLOSE, DataChangeKind, DefaultChartOptionsProvider, DefaultUiActionCode_CLOSE, DrawTime, EMPTY_PARAMS, ExpandableSectionButtonIconPosition, ExpandableSectionButtonType, ExpandableSectionComponent, ExpressionEditorDialogComponent, FilterExpressionBoolOperator$1 as FilterExpressionBoolOperator, FilterExpressionBuilderGroupBuilderGroupKindEnum, FilterExpressionDataType, FilterExpressionFieldWidgetType, FilterExpressionOperation, FilterExpressionOrderByOrderEnum, GenericPageComponent, GeoMapDataLoadingMode, GeoMapDataSourceType, GeoMapItemKind, GeoMapOperationMode, GeoMapSelectionMode, GeoMapTextType, GoogleMap, GridColumnContentType, GridDataAccessConfigKindEnum, GridSelectionMode, GridSelectionType, GridUiActionType, GridViewDescriptorKindEnum, HighlightPipe, HoverMenuComponent, IS_ASYNC_PARAM_NAME, IconPosition, ImageResourceKindEnum, InvalidSmartlinkComponent, LayoutDirection, LeafletMap, LinkTargetEnum, MAP_ENGINE, MapEngine, MenuOpenDirection, MenuTriggerType, MessageOptionType, MessageTextType, MessageType, NAMED_VALIDATOR, NamedValidatorOperationEnum, NamedValidatorService, NoPermissionPageComponent, PhotoCaptureWidgetComponent, REUSE_ROUTER_SLOT_COMPONENT, ROOT_CONTAINER_UUID, ROUTER_SLOT_ID, RecordingUploaderPropertiesOpenDirectionEnum, SMART_DEFAULT_VIEW_COMPONENTS, SearchPageComponent, SelectionDefinitionTypeEnum, SelectionDefinitionValueSetValueTypeEnum, ServerRequestType, SessionAPIS, SessionErrorBehaviour, SessionService, SharedModule, SmartActionType, SmartBackendBootstrapService, SmartComponent, SmartComponentApiClient, SmartComponentLayoutComponent, SmartComponentLayoutModule, SmartComponentLayoutUtility, SmartDatePipe, SmartDateTimePipe, SmartDefaultErrorUiService, SmartDiagramComponent, SmartDiagramModule, SmartDialog, SmartEmbeddedSlotDirective, SmartExpandableSectionModule, SmartExpandableSectionService, SmartFileEditorComponent, SmartFileUploaderComponent, SmartFilterComponent, SmartFilterEditorContentComponent, SmartFilterEditorModule, SmartFilterEditorService, SmartFilterExpressionItemComponent, SmartFilterExpressionItemsComponent, SmartFilterModule, SmartFilterParamComponent, SmartFilterParamsComponent, SmartFilterPosition, SmartFilterType, SmartFormInputMode, SmartFormTextFieldButtonIconPosition, SmartFormWidgetDirection, SmartFormWidgetType, SmartFormWidgetWidth, SmartGenericPagesModule, SmartGridButtonType, SmartGridComponent, SmartGridDataLayout, SmartGridModule, SmartGridService, SmartGridType, SmartIconComponent, SmartIconModule, SmartIconService, SmartLayoutDef, SmartLinkChannelVariableInPath, SmartLinkMigrationStatusStatusEnum, SmartLinkUuidVariableInPath, SmartMapComponent, SmartMapModule, SmartMultiFileEditorComponent, SmartNavbarComponent, SmartNavbarModule, SmartNavbarService, SmartNavigationModule, SmartNavigationService, SmartNgClientModule, SmartNgClientService, SmartService, SmartSessionModule, SmartSessionService, SmartSessionTimerComponent, SmartSubject, SmartTabGroupModule, SmartTable, SmartTableButtonType, SmartTableHeaderPropertyType, SmartTableInterfaceTypeEnum, SmartTableOptionButtonDirection, SmartTableOrder, SmartTableType, SmartTimePipe, SmartTooltipDirective, SmartTreeComponent, SmartTreeNodeButtonType, SmartUserSettinsIconPosition, SmartValidationModule, SmartValidatorName, SmartViewContextErrorDialogButtonLabel, SmartViewContextErrorDialogMessage, SmartViewContextErrorDialogTitle, SmartViewContextModule, SmartViewContextService, SmartViewRedirect, SmartVoiceRecorderComponent, SmartWidgetHintPosition, SmartWidgetHintPositionEnum, SmartWidgetSettings, SmartdialogModule, SmartdialogService, SmartfileuploaderComponent, SmartformComponent, SmartformLayoutDefinitionService, SmartformwidgetComponent, SmarttableComponent, SmarttableModule, SmarttableService, SmarttreeGenericService, SmarttreeModule, SmarttreeService, SubjectSelectorComponent, ThemeService, ToggleLabelPosition, ToolbarAlignment, ToolbarDirection, USE_ADVANCED_FILTER, UiActionButtonComponent, UiActionButtonType, UiActionConfirmDialogComponent, UiActionConfirmDialogService, UiActionDescriptorService, UiActionDialogButtonComponent, UiActionDialogType, UiActionFeedbackType, UiActionInputDialogComponent, UiActionInputDialogService, UiActionInputType, UiActionService, UiActionToolbarComponent, UiActionTooltipTooltipPositionEnum, UiBadgeComponent, UiBadgeDirective, UploadWidgetComponent, UploadWidgetType, ValidationResultPageComponent, ValueChangeMode, ViewContextRebuiltError, ViewEventHandlerViewEventTypeEnum, ViewService, ViewState, ViewType, VoiceRecordWidgetComponent, barChart, bubbleChart, createBasicOptions, doughnutChart, horizontalBarChart, horizontalStackedBarChart, multiAxisLineChart, pieChart, polarAreaChart, radarChart, resolveSlot, resolveViewHandler, scatterChart, stackedBarChart, transformDataToBarLikeDataSet, transformDataToBasicDataSets, transformDataToBubble, transformDataToScatter };
+export { APIS$5 as APIS, AbstractMap, AclEditingViewComponent, AdvancedRelationButtonComponent, AdvancedSmartFilterExpressionItemComponent, ApiModule$5 as ApiModule, ApiQueueService, BASE_PATH$7 as BASE_PATH, COLLECTION_FORMATS$7 as COLLECTION_FORMATS, COMPONENT_LIBRARY, CUSTOM_DIAGRAM_OPTIONS, ClickMenuComponent, CloseResult, ComparableDropdownDirective, ComparableMultiselectDirective, ComponentFactoryService, ComponentFactoryServiceModule, ComponentLibrary, ComponentType, ComponentWidgetType, Configuration$7 as Configuration, DIALOG_DISABLE_CLOSE, DataChangeKind, DefaultChartOptionsProvider, DefaultUiActionCode_CLOSE, DrawTime, EMPTY_PARAMS, ExpandableSectionButtonIconPosition, ExpandableSectionButtonType, ExpandableSectionComponent, ExpressionEditorDialogComponent, FilterExpressionBoolOperator$1 as FilterExpressionBoolOperator, FilterExpressionBuilderGroupBuilderGroupKindEnum, FilterExpressionDataType, FilterExpressionFieldWidgetType, FilterExpressionOperation, FilterExpressionOrderByOrderEnum, GenericPageComponent, GeoMapDataLoadingMode, GeoMapDataSourceType, GeoMapItemKind, GeoMapOperationMode, GeoMapSelectionMode, GeoMapTextType, GoogleMap, GridColumnContentType, GridDataAccessConfigKindEnum, GridSelectionMode, GridSelectionType, GridUiActionType, GridViewDescriptorKindEnum, HighlightPipe, HoverMenuComponent, IS_ASYNC_PARAM_NAME, IconPosition, ImageResourceKindEnum, InvalidSmartlinkComponent, LayoutDirection, LeafletMap, LinkTargetEnum, MAP_ENGINE, MapEngine, MenuOpenDirection, MenuTriggerType, MessageOptionType, MessageTextType, MessageType, NAMED_VALIDATOR, NamedValidatorOperationEnum, NamedValidatorService, NoPermissionPageComponent, PhotoCaptureWidgetComponent, REUSE_ROUTER_SLOT_COMPONENT, ROOT_CONTAINER_UUID, ROUTER_SLOT_ID, RecordingUploaderPropertiesOpenDirectionEnum, SMART_DEFAULT_VIEW_COMPONENTS, SearchPageComponent, SelectionDefinitionTypeEnum, SelectionDefinitionValueSetValueTypeEnum, ServerRequestType, SessionAPIS, SessionErrorBehaviour, SessionService, SharedModule, SmartActionType, SmartBackendBootstrapService, SmartComponent, SmartComponentApiClient, SmartComponentLayoutComponent, SmartComponentLayoutModule, SmartComponentLayoutUtility, SmartDatePipe, SmartDateTimePipe, SmartDefaultErrorUiService, SmartDiagramComponent, SmartDiagramModule, SmartDialog, SmartEmbeddedSlotDirective, SmartExpandableSectionModule, SmartExpandableSectionService, SmartFileEditorComponent, SmartFileUploaderComponent, SmartFilterComponent, SmartFilterEditorContentComponent, SmartFilterEditorModule, SmartFilterEditorService, SmartFilterExpressionItemComponent, SmartFilterExpressionItemsComponent, SmartFilterModule, SmartFilterParamComponent, SmartFilterParamsComponent, SmartFilterPosition, SmartFilterType, SmartFilterWidgetComponent, SmartFormInputMode, SmartFormTextFieldButtonIconPosition, SmartFormWidgetDirection, SmartFormWidgetType, SmartFormWidgetWidth, SmartGenericPagesModule, SmartGridButtonType, SmartGridComponent, SmartGridDataLayout, SmartGridModule, SmartGridService, SmartGridType, SmartIconComponent, SmartIconModule, SmartIconService, SmartLayoutDef, SmartLinkChannelVariableInPath, SmartLinkMigrationStatusStatusEnum, SmartLinkUuidVariableInPath, SmartMapComponent, SmartMapModule, SmartMultiFileEditorComponent, SmartNavbarComponent, SmartNavbarModule, SmartNavbarService, SmartNavigationModule, SmartNavigationService, SmartNgClientModule, SmartNgClientService, SmartService, SmartSessionModule, SmartSessionService, SmartSessionTimerComponent, SmartSubject, SmartTabGroupModule, SmartTable, SmartTableButtonType, SmartTableHeaderPropertyType, SmartTableInterfaceTypeEnum, SmartTableOptionButtonDirection, SmartTableOrder, SmartTableType, SmartTimePipe, SmartTooltipDirective, SmartTreeComponent, SmartTreeNodeButtonType, SmartUserSettinsIconPosition, SmartValidationModule, SmartValidatorName, SmartViewContextErrorDialogButtonLabel, SmartViewContextErrorDialogMessage, SmartViewContextErrorDialogTitle, SmartViewContextModule, SmartViewContextService, SmartViewRedirect, SmartVoiceRecorderComponent, SmartWidgetHintPosition, SmartWidgetHintPositionEnum, SmartWidgetSettings, SmartdialogModule, SmartdialogService, SmartfileuploaderComponent, SmartformComponent, SmartformLayoutDefinitionService, SmartformwidgetComponent, SmarttableComponent, SmarttableModule, SmarttableService, SmarttreeGenericService, SmarttreeModule, SmarttreeService, SubjectSelectorComponent, ThemeService, ToggleLabelPosition, ToolbarAlignment, ToolbarDirection, USE_ADVANCED_FILTER, UiActionButtonComponent, UiActionButtonType, UiActionConfirmDialogComponent, UiActionConfirmDialogService, UiActionDescriptorService, UiActionDialogButtonComponent, UiActionDialogType, UiActionFeedbackType, UiActionInputDialogComponent, UiActionInputDialogService, UiActionInputType, UiActionService, UiActionToolbarComponent, UiActionTooltipTooltipPositionEnum, UiBadgeComponent, UiBadgeDirective, UploadWidgetComponent, UploadWidgetType, ValidationResultPageComponent, ValueChangeMode, ViewContextRebuiltError, ViewEventHandlerViewEventTypeEnum, ViewService, ViewState, ViewType, VoiceRecordWidgetComponent, barChart, bubbleChart, createBasicOptions, doughnutChart, horizontalBarChart, horizontalStackedBarChart, multiAxisLineChart, pieChart, polarAreaChart, radarChart, resolveSlot, resolveViewHandler, scatterChart, stackedBarChart, transformDataToBarLikeDataSet, transformDataToBasicDataSets, transformDataToBubble, transformDataToScatter };
 //# sourceMappingURL=smartbit4all-ng-client.mjs.map