@smartbit4all/ng-client 3.3.48 → 3.3.50

package/fesm2015/smartbit4all-ng-client.mjs

@@ -9513,127 +9513,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
                 args: ['forms']
             }] } });
 
-class SmartFilterService {
-    constructor() {
-        this._destroy$ = new Subject();
-        this.shouldSubmit = new Subject();
-        this.reSubscribeToSubmit = new Subject();
-        this.change = new Subject();
-    }
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    submit() {
-        return __awaiter(this, void 0, void 0, function* () {
-            this.shouldSubmit.next();
-            yield this.shouldSubmit.pipe(takeUntil(this._destroy$)).toPromise();
-            this.shouldSubmit = new Subject();
-            this.reSubscribeToSubmit.next();
-            return this.filter;
-        });
-    }
-}
-SmartFilterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-SmartFilterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }], ctorParameters: function () { return []; } });
-
-/**
- * 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.
- */
-const FilterExpressionBoolOperator$1 = {
-    And: 'AND',
-    Or: 'OR'
-};
-
-/**
- * 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.
- */
-const FilterExpressionDataType = {
-    String: 'STRING',
-    Number: 'NUMBER',
-    Date: 'DATE',
-    DateTime: 'DATE_TIME',
-    Boolean: 'BOOLEAN'
-};
-
-/**
- * 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.
- */
-const FilterExpressionFieldWidgetType = {
-    TextField: 'TEXT_FIELD',
-    TextFieldChips: 'TEXT_FIELD_CHIPS',
-    TextBox: 'TEXT_BOX',
-    Select: 'SELECT',
-    SelectMultiple: 'SELECT_MULTIPLE',
-    Date: 'DATE',
-    Time: 'TIME',
-    DateTime: 'DATE_TIME',
-    CheckBox: 'CHECK_BOX',
-    RadioButton: 'RADIO_BUTTON',
-    Range: 'RANGE'
-};
-
-/**
- * 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.
- */
-const FilterExpressionOperation = {
-    Expression: 'EXPRESSION',
-    Equal: 'EQUAL',
-    NotEqual: 'NOT_EQUAL',
-    Less: 'LESS',
-    LessOrEqual: 'LESS_OR_EQUAL',
-    Greater: 'GREATER',
-    GreaterOrEqual: 'GREATER_OR_EQUAL',
-    Like: 'LIKE',
-    NotLike: 'NOT_LIKE',
-    Between: 'BETWEEN',
-    NotBetween: 'NOT_BETWEEN',
-    IsEmpty: 'IS_EMPTY',
-    IsNotEmpty: 'IS_NOT_EMPTY',
-    Exists: 'EXISTS',
-    NotExists: 'NOT_EXISTS',
-    In: 'IN',
-    NotIn: 'NOT_IN'
-};
-
 /**
  * Filter API 2
  * Filter API 2
@@ -9649,362 +9528,76 @@ var FilterExpressionOrderBy;
 (function (FilterExpressionOrderBy) {
     FilterExpressionOrderBy.OrderEnum = {
         Asc: 'ASC',
-        Desc: 'DESC'
+        Desc: 'DESC',
     };
 })(FilterExpressionOrderBy || (FilterExpressionOrderBy = {}));
 
-var FilterExpressionBuilderGroup;
-(function (FilterExpressionBuilderGroup) {
-    FilterExpressionBuilderGroup.BuilderGroupKindEnum = {
-        Diplay: 'DIPLAY',
-        Bracket: 'BRACKET',
-        Exist: 'EXIST'
-    };
-})(FilterExpressionBuilderGroup || (FilterExpressionBuilderGroup = {}));
+var ExpandableSectionButtonType;
+(function (ExpandableSectionButtonType) {
+    ExpandableSectionButtonType[ExpandableSectionButtonType["BUTTON"] = 0] = "BUTTON";
+    ExpandableSectionButtonType[ExpandableSectionButtonType["MENU"] = 1] = "MENU";
+    ExpandableSectionButtonType[ExpandableSectionButtonType["MENU_ITEM"] = 2] = "MENU_ITEM";
+})(ExpandableSectionButtonType || (ExpandableSectionButtonType = {}));
+var ExpandableSectionButtonIconPosition;
+(function (ExpandableSectionButtonIconPosition) {
+    ExpandableSectionButtonIconPosition["PRE"] = "Pre";
+    ExpandableSectionButtonIconPosition["POST"] = "Post";
+})(ExpandableSectionButtonIconPosition || (ExpandableSectionButtonIconPosition = {}));
 
-class SmartFilterSimpleFieldComponent {
-    constructor(service, cfService) {
-        this.service = service;
+class ExpandableSectionComponent {
+    constructor(cfService) {
         this.cfService = cfService;
-        this._destroy$ = new Subject();
+        this.stateChange = new Subject();
     }
-    ngOnInit() {
-        var _a;
-        this.operation = (_a = this.filterExpressionField.expressionData) === null || _a === void 0 ? void 0 : _a.currentOperation;
-        this.currentOperation = this.getOptionLabel(this.operation);
+    onStateChange(isOpened) {
+        this.data.isExpanded = isOpened;
+        this.stateChange.next(this.data);
+        if (this.data.stateChanged) {
+            this.data.stateChanged.next({
+                data: this.data.data,
+                isExpanded: isOpened,
+                index: this.data.index,
+            });
+        }
     }
+    ngOnInit() { }
     ngAfterViewInit() {
-        this.constructForm();
-    }
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    constructFormWidget(key, label, widgetType, possibleValues) {
-        let type = widgetType;
-        if (type === FilterExpressionFieldWidgetType.Date) {
-            type = SmartFormWidgetType.DATE_PICKER;
-        }
-        else if (type === FilterExpressionFieldWidgetType.DateTime) {
-            type = SmartFormWidgetType.DATE_TIME_PICKER;
+        var _a, _b;
+        if (this.data.headerComponent) {
+            this.cfService.createComponent(this.vcRefheader, this.data.headerComponent, new Map([
+                [(_a = this.data.headerInputName) !== null && _a !== void 0 ? _a : '', this.data.headerData],
+                ['stateChange', this.stateChange],
+                ['index', this.data.index],
+                ['sectionIndex', this.index],
+            ]));
         }
-        let widget = {
-            key,
-            label,
-            type,
-            value: '',
-            showLabel: true,
-            valueList: possibleValues.map((value) => {
-                return {
-                    key: value.objectUri ? value.objectUri : value.code,
-                    label: value.displayValue,
-                    type: SmartFormWidgetType.ITEM,
-                    value: value.objectUri ? value.objectUri : value.code,
-                };
-            }),
-        };
-        return widget;
+        this.componentRef = this.cfService.createComponent(this.vcRef, this.data.customComponent, new Map([
+            [(_b = this.data.inputName) !== null && _b !== void 0 ? _b : '', this.data.data],
+            ['stateChange', this.stateChange],
+            ['index', this.data.index],
+            ['sectionIndex', this.index],
+        ]));
     }
-    constructForm() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-        (_a = this.vcRefForm) === null || _a === void 0 ? void 0 : _a.clear();
-        let widgets = [];
-        let key;
-        if (this.filterExpressionField.widgetType === 'SELECT_MULTIPLE') {
-            key = 'expressionData.operand2.selectedValues';
-        }
-        if ((_b = this.filterExpressionField.expressionData) === null || _b === void 0 ? void 0 : _b.operand2) {
-            if (key !== 'expressionData.operand2.selectedValues') {
-                key = 'expressionData.operand2.valueAsString';
-            }
-            widgets.push(this.constructFormWidget(key, this.filterExpressionField.label2, (_c = this.filterExpressionField.widgetType) !== null && _c !== void 0 ? _c : FilterExpressionFieldWidgetType.TextField, this.filterExpressionField.possibleValues));
-        }
-        if ((_d = this.filterExpressionField.expressionData) === null || _d === void 0 ? void 0 : _d.operand3) {
-            if (key !== 'selectedValues') {
-                key = 'expressionData.operand3.valueAsString';
-            }
-            widgets.push(this.constructFormWidget(key, this.filterExpressionField.label3, (_e = this.filterExpressionField.widgetType) !== null && _e !== void 0 ? _e : FilterExpressionFieldWidgetType.TextField, this.filterExpressionField.possibleValues));
+    action(button, event) {
+        event.stopPropagation();
+        if (!button.callback) {
+            throw new Error(`Button with name ${button.label} or icon ${button.icon} does not have a callback!`);
         }
-        this.operation = (_f = this.filterExpressionField.expressionData) === null || _f === void 0 ? void 0 : _f.currentOperation;
-        this.currentOperation = this.getOptionLabel(this.operation);
-        this.smartForm = {
-            direction: SmartFormWidgetDirection.ROW,
-            componentModel: { data: this.filterExpressionField },
-            useOnValueChangeEvent: true,
-            useOnBlurEvent: true,
-            submitOnEnter: (_g = this.service.filter) === null || _g === void 0 ? void 0 : _g.submitOnEnter,
-            widgets,
-            translateService: (_h = this.service.filter) === null || _h === void 0 ? void 0 : _h.translateService,
-        };
-        // Show form on page
-        this.componentRefForm = this.cfService.createComponent(this.vcRefForm, SmartformComponent, new Map([['smartForm', this.smartForm]]));
-        (_j = this.componentRefForm.instance.onValueChangeSubject) === null || _j === void 0 ? void 0 : _j.pipe(takeUntil(this._destroy$)).subscribe(() => {
-            this.submit();
-            this.service.change.next();
-        });
-        (_k = this.componentRefForm.instance.onBlurSubject) === null || _k === void 0 ? void 0 : _k.pipe(takeUntil(this._destroy$)).subscribe(() => {
-            this.submit();
-            this.service.change.next();
-        });
+        button.callback(button.args);
     }
-    submit() {
-        var _a;
-        let form = this.componentRefForm.instance.submitForm();
-        this.filterExpressionField = (_a = form.componentModel) === null || _a === void 0 ? void 0 : _a.data;
-        this.simpleFieldChildren.forEach((smartFilterFieldComponent, index) => {
-            let filterExpressionField = smartFilterFieldComponent.submit();
-            this.filterExpressionField.subFieldList.filters[index] = filterExpressionField;
-        });
-        return this.filterExpressionField;
+    setExpanded() { }
+    type() {
+        return ExpandableSectionButtonType;
     }
-    optionSelected(option) {
-        var _a, _b, _c, _d;
-        let oldOption = this.componentRefForm.instance.smartForm.componentModel.data.expressionData
-            .currentOperation;
-        this.componentRefForm.instance.smartForm.componentModel.data.expressionData.currentOperation =
-            option;
-        this.operation = option;
-        this.currentOperation = this.getOptionLabel(this.operation);
-        if (oldOption !== FilterExpressionOperation.Between &&
-            option === FilterExpressionOperation.Between) {
-            this.submit();
-            let label = this.filterExpressionField.label2;
-            this.filterExpressionField.label2 = `${label} - tól`;
-            this.filterExpressionField.label3 = `${label} - ig`;
-            this.filterExpressionField.expressionData.operand3 = {
-                isDataName: (_a = this.filterExpressionField.expressionData.operand2) === null || _a === void 0 ? void 0 : _a.isDataName,
-                type: (_b = this.filterExpressionField.expressionData.operand3) === null || _b === void 0 ? void 0 : _b.type,
-                valueAsString: (_c = this.filterExpressionField.expressionData.operand3) === null || _c === void 0 ? void 0 : _c.valueAsString,
-                selectedValues: (_d = this.filterExpressionField.expressionData.operand3) === null || _d === void 0 ? void 0 : _d.selectedValues,
-            };
-            this.constructForm();
-        }
-        else if (oldOption === FilterExpressionOperation.Between &&
-            option !== FilterExpressionOperation.Between) {
-            let label = this.filterExpressionField.label2.replace(' - tól', '');
-            this.filterExpressionField.label2 = `${label}`;
-            this.filterExpressionField.label3 = undefined;
-            this.filterExpressionField.expressionData.operand3 = undefined;
-            this.constructForm();
-        }
+    position() {
+        return ExpandableSectionButtonIconPosition;
     }
-    getOptionLabel(option) {
-        if (!option) {
-            return '';
-        }
-        else if (this.operationTranslator) {
-            return this.operationTranslator(option);
+    customButtonClicked(event, button, element) {
+        event.stopPropagation();
+        if (!button.callback) {
+            throw new Error(`Button with name ${button.label} or icon ${button.icon} does not have a callback!`);
         }
-        return option;
-    }
-}
-SmartFilterSimpleFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterSimpleFieldComponent, deps: [{ token: SmartFilterService }, { token: ComponentFactoryService }], target: i0.ɵɵFactoryTarget.Component });
-SmartFilterSimpleFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartFilterSimpleFieldComponent, selector: "smart-filter-simple-field", inputs: { operationTranslator: "operationTranslator", filterExpressionField: "filterExpressionField", showPossibleActions: "showPossibleActions" }, viewQueries: [{ propertyName: "vcRefForm", first: true, predicate: ["form"], descendants: true, read: ViewContainerRef }, { propertyName: "simpleFieldChildren", predicate: ["simpleField"], descendants: true }], ngImport: i0, template: "<div class=\"smart-filter-simple-field-container\">\r\n  <div class=\"smart-filter-simple-field-form-widget\">\r\n    <div\r\n      class=\"smart-filter-simple-field-form-widget-row\"\r\n      *ngIf=\"showPossibleActions\"\r\n    >\r\n      <p>({{ currentOperation }})</p>\r\n      <button\r\n        mat-icon-button\r\n        [matMenuTriggerFor]=\"menu\"\r\n        aria-label=\"Example icon-button with a menu\"\r\n      >\r\n        <mat-icon>more_vert</mat-icon>\r\n      </button>\r\n      <mat-menu #menu=\"matMenu\">\r\n        <button\r\n          mat-menu-item\r\n          *ngFor=\"let option of filterExpressionField.possibleOperations\"\r\n          (click)=\"optionSelected(option)\"\r\n        >\r\n          <span>\r\n            {{ getOptionLabel(option) }}\r\n          </span>\r\n        </button>\r\n      </mat-menu>\r\n    </div>\r\n    <ng-template #form></ng-template>\r\n  </div>\r\n</div>\r\n", styles: [".smart-filter-simple-field-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem}.smart-filter-simple-field-form-widget{padding:1rem;border-radius:1rem;display:flex;flex-direction:column}.smart-filter-simple-field-form-widget-row{display:flex;flex-direction:row;justify-content:space-between}.smart-filter-simple-field-form-widget-row p{color:#00000042}.smart-filter-simple-field-form-widget ::ng-deep .mat-icon-button{height:24px;width:24px}.smart-filter-simple-field-form-widget ::ng-deep .mat-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-flat-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-stroked-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-raised-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-icon-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-fab .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-mini-fab .mat-button-wrapper>*{vertical-align:inherit!important}.smart-filter-simple-field-subfields-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem}.smart-filter-simple-field-container ::ng-deep h4{margin:0}\n"], components: [{ type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i5.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i5.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterSimpleFieldComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'smart-filter-simple-field', template: "<div class=\"smart-filter-simple-field-container\">\r\n  <div class=\"smart-filter-simple-field-form-widget\">\r\n    <div\r\n      class=\"smart-filter-simple-field-form-widget-row\"\r\n      *ngIf=\"showPossibleActions\"\r\n    >\r\n      <p>({{ currentOperation }})</p>\r\n      <button\r\n        mat-icon-button\r\n        [matMenuTriggerFor]=\"menu\"\r\n        aria-label=\"Example icon-button with a menu\"\r\n      >\r\n        <mat-icon>more_vert</mat-icon>\r\n      </button>\r\n      <mat-menu #menu=\"matMenu\">\r\n        <button\r\n          mat-menu-item\r\n          *ngFor=\"let option of filterExpressionField.possibleOperations\"\r\n          (click)=\"optionSelected(option)\"\r\n        >\r\n          <span>\r\n            {{ getOptionLabel(option) }}\r\n          </span>\r\n        </button>\r\n      </mat-menu>\r\n    </div>\r\n    <ng-template #form></ng-template>\r\n  </div>\r\n</div>\r\n", styles: [".smart-filter-simple-field-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem}.smart-filter-simple-field-form-widget{padding:1rem;border-radius:1rem;display:flex;flex-direction:column}.smart-filter-simple-field-form-widget-row{display:flex;flex-direction:row;justify-content:space-between}.smart-filter-simple-field-form-widget-row p{color:#00000042}.smart-filter-simple-field-form-widget ::ng-deep .mat-icon-button{height:24px;width:24px}.smart-filter-simple-field-form-widget ::ng-deep .mat-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-flat-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-stroked-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-raised-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-icon-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-fab .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-mini-fab .mat-button-wrapper>*{vertical-align:inherit!important}.smart-filter-simple-field-subfields-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem}.smart-filter-simple-field-container ::ng-deep h4{margin:0}\n"] }]
-        }], ctorParameters: function () { return [{ type: SmartFilterService }, { type: ComponentFactoryService }]; }, propDecorators: { simpleFieldChildren: [{
-                type: ViewChildren,
-                args: ['simpleField']
-            }], operationTranslator: [{
-                type: Input
-            }], filterExpressionField: [{
-                type: Input
-            }], showPossibleActions: [{
-                type: Input
-            }], vcRefForm: [{
-                type: ViewChild,
-                args: ['form', { read: ViewContainerRef }]
-            }] } });
-
-class SmartFilterSimpleComponent {
-    constructor(service) {
-        this.service = service;
-        this._destroy$ = new Subject();
-        this.service.reSubscribeToSubmit.pipe(takeUntil(this._destroy$)).subscribe(() => {
-            this.subscribeToSubmit();
-        });
-        this.subscribeToSubmit();
-    }
-    ngOnInit() {
-        this.smartFilter = this.service.filter;
-    }
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    subscribeToSubmit() {
-        this.service.shouldSubmit.pipe(takeUntil(this._destroy$)).subscribe(() => {
-            this.submit();
-        });
-    }
-    submit() {
-        this.simpleFieldChildren.forEach((smartFilterFieldComponent, index) => {
-            this.smartFilter.data[index] = smartFilterFieldComponent.submit();
-        });
-        this.service.filter = this.smartFilter;
-        this.service.shouldSubmit.complete();
-    }
-}
-SmartFilterSimpleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterSimpleComponent, deps: [{ token: SmartFilterService }], target: i0.ɵɵFactoryTarget.Component });
-SmartFilterSimpleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartFilterSimpleComponent, selector: "smart-filter-simple", viewQueries: [{ propertyName: "simpleFieldChildren", predicate: ["simpleField"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"smartFilter\" class=\"smart-simple-fields-container\">\r\n    <div *ngFor=\"let filterExpressionField of smartFilter.data; let i = index\">\r\n        <smart-filter-simple-field\r\n            #simpleField\r\n            [filterExpressionField]=\"filterExpressionField\"\r\n            [operationTranslator]=\"smartFilter.operationTranslator\"\r\n            [showPossibleActions]=\"smartFilter.showPossibleActions\"\r\n        ></smart-filter-simple-field>\r\n        <div *ngFor=\"let subfilterExpressionField of filterExpressionField.subFieldList?.filters\">\r\n            <smart-filter-simple-field\r\n                #simpleField\r\n                [filterExpressionField]=\"filterExpressionField\"\r\n                [operationTranslator]=\"smartFilter.operationTranslator\"\r\n                [showPossibleActions]=\"smartFilter.showPossibleActions\"\r\n            ></smart-filter-simple-field>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".smart-simple-fields-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem;justify-content:center}\n"], components: [{ type: SmartFilterSimpleFieldComponent, selector: "smart-filter-simple-field", inputs: ["operationTranslator", "filterExpressionField", "showPossibleActions"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterSimpleComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "smart-filter-simple", template: "<div *ngIf=\"smartFilter\" class=\"smart-simple-fields-container\">\r\n    <div *ngFor=\"let filterExpressionField of smartFilter.data; let i = index\">\r\n        <smart-filter-simple-field\r\n            #simpleField\r\n            [filterExpressionField]=\"filterExpressionField\"\r\n            [operationTranslator]=\"smartFilter.operationTranslator\"\r\n            [showPossibleActions]=\"smartFilter.showPossibleActions\"\r\n        ></smart-filter-simple-field>\r\n        <div *ngFor=\"let subfilterExpressionField of filterExpressionField.subFieldList?.filters\">\r\n            <smart-filter-simple-field\r\n                #simpleField\r\n                [filterExpressionField]=\"filterExpressionField\"\r\n                [operationTranslator]=\"smartFilter.operationTranslator\"\r\n                [showPossibleActions]=\"smartFilter.showPossibleActions\"\r\n            ></smart-filter-simple-field>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".smart-simple-fields-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem;justify-content:center}\n"] }]
-        }], ctorParameters: function () { return [{ type: SmartFilterService }]; }, propDecorators: { simpleFieldChildren: [{
-                type: ViewChildren,
-                args: ["simpleField"]
-            }] } });
-
-class SmartFilterComponent {
-    constructor(service) {
-        this.service = service;
-    }
-    ngOnInit() {
-        if (this.filter) {
-            this.setUp();
-        }
-    }
-    ngOnChanges(changes) {
-        if (changes['filter'].currentValue) {
-            this.setUp();
-        }
-    }
-    setUp() {
-        this.service.filter = this.filter;
-    }
-    submit() {
-        return __awaiter(this, void 0, void 0, function* () {
-            return yield this.service.submit();
-        });
-    }
-}
-SmartFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterComponent, deps: [{ token: SmartFilterService }], target: i0.ɵɵFactoryTarget.Component });
-SmartFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartFilterComponent, selector: "smart-filter", inputs: { filter: "filter" }, providers: [SmartFilterService], usesOnChanges: true, ngImport: i0, template: "<smart-filter-simple *ngIf=\"filter\" #simpleFilter></smart-filter-simple>\r\n", styles: [""], components: [{ type: SmartFilterSimpleComponent, selector: "smart-filter-simple" }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'smart-filter', providers: [SmartFilterService], template: "<smart-filter-simple *ngIf=\"filter\" #simpleFilter></smart-filter-simple>\r\n", styles: [""] }]
-        }], ctorParameters: function () { return [{ type: SmartFilterService }]; }, propDecorators: { filter: [{
-                type: Input
-            }] } });
-
-class SmartFilterExpressionFieldComponent {
-    constructor() { }
-    ngOnInit() {
-    }
-}
-SmartFilterExpressionFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterExpressionFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SmartFilterExpressionFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartFilterExpressionFieldComponent, selector: "lib-smart-filter-expression-field", ngImport: i0, template: "", styles: [""] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterExpressionFieldComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-smart-filter-expression-field', template: "", styles: [""] }]
-        }], ctorParameters: function () { return []; } });
-
-class SmartFilterModule {
-}
-SmartFilterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-SmartFilterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterModule, declarations: [SmartFilterComponent,
-        SmartFilterExpressionFieldComponent,
-        SmartFilterSimpleComponent,
-        SmartFilterSimpleFieldComponent], imports: [BrowserModule, SmartformModule, MatMenuModule, MatIconModule, MatButtonModule], exports: [SmartFilterComponent] });
-SmartFilterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterModule, imports: [[BrowserModule, SmartformModule, MatMenuModule, MatIconModule, MatButtonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        SmartFilterComponent,
-                        SmartFilterExpressionFieldComponent,
-                        SmartFilterSimpleComponent,
-                        SmartFilterSimpleFieldComponent,
-                    ],
-                    imports: [BrowserModule, SmartformModule, MatMenuModule, MatIconModule, MatButtonModule],
-                    exports: [SmartFilterComponent],
-                }]
-        }] });
-
-var SmartFilterPosition;
-(function (SmartFilterPosition) {
-    SmartFilterPosition[SmartFilterPosition["TOP"] = 0] = "TOP";
-    SmartFilterPosition[SmartFilterPosition["BOTTOM"] = 1] = "BOTTOM";
-    SmartFilterPosition[SmartFilterPosition["LEFT"] = 2] = "LEFT";
-    SmartFilterPosition[SmartFilterPosition["RIGHT"] = 3] = "RIGHT";
-})(SmartFilterPosition || (SmartFilterPosition = {}));
-var SmartFilterType;
-(function (SmartFilterType) {
-    SmartFilterType[SmartFilterType["SIMPLE"] = 0] = "SIMPLE";
-    SmartFilterType[SmartFilterType["ADVANCED"] = 1] = "ADVANCED";
-})(SmartFilterType || (SmartFilterType = {}));
-
-/*
- * Public API Surface of smart-filter
- */
-
-var ExpandableSectionButtonType;
-(function (ExpandableSectionButtonType) {
-    ExpandableSectionButtonType[ExpandableSectionButtonType["BUTTON"] = 0] = "BUTTON";
-    ExpandableSectionButtonType[ExpandableSectionButtonType["MENU"] = 1] = "MENU";
-    ExpandableSectionButtonType[ExpandableSectionButtonType["MENU_ITEM"] = 2] = "MENU_ITEM";
-})(ExpandableSectionButtonType || (ExpandableSectionButtonType = {}));
-var ExpandableSectionButtonIconPosition;
-(function (ExpandableSectionButtonIconPosition) {
-    ExpandableSectionButtonIconPosition["PRE"] = "Pre";
-    ExpandableSectionButtonIconPosition["POST"] = "Post";
-})(ExpandableSectionButtonIconPosition || (ExpandableSectionButtonIconPosition = {}));
-
-class ExpandableSectionComponent {
-    constructor(cfService) {
-        this.cfService = cfService;
-        this.stateChange = new Subject();
-    }
-    onStateChange(isOpened) {
-        this.data.isExpanded = isOpened;
-        this.stateChange.next(this.data);
-        if (this.data.stateChanged) {
-            this.data.stateChanged.next({
-                data: this.data.data,
-                isExpanded: isOpened,
-                index: this.data.index,
-            });
-        }
-    }
-    ngOnInit() { }
-    ngAfterViewInit() {
-        var _a, _b;
-        if (this.data.headerComponent) {
-            this.cfService.createComponent(this.vcRefheader, this.data.headerComponent, new Map([
-                [(_a = this.data.headerInputName) !== null && _a !== void 0 ? _a : '', this.data.headerData],
-                ['stateChange', this.stateChange],
-                ['index', this.data.index],
-                ['sectionIndex', this.index],
-            ]));
-        }
-        this.componentRef = this.cfService.createComponent(this.vcRef, this.data.customComponent, new Map([
-            [(_b = this.data.inputName) !== null && _b !== void 0 ? _b : '', this.data.data],
-            ['stateChange', this.stateChange],
-            ['index', this.data.index],
-            ['sectionIndex', this.index],
-        ]));
-    }
-    action(button, event) {
-        event.stopPropagation();
-        if (!button.callback) {
-            throw new Error(`Button with name ${button.label} or icon ${button.icon} does not have a callback!`);
-        }
-        button.callback(button.args);
-    }
-    setExpanded() { }
-    type() {
-        return ExpandableSectionButtonType;
-    }
-    position() {
-        return ExpandableSectionButtonIconPosition;
-    }
-    customButtonClicked(event, button, element) {
-        event.stopPropagation();
-        if (!button.callback) {
-            throw new Error(`Button with name ${button.label} or icon ${button.icon} does not have a callback!`);
-        }
-        button.callback(button.args, element);
+        button.callback(button.args, element);
     }
 }
 ExpandableSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ExpandableSectionComponent, deps: [{ token: ComponentFactoryService }], target: i0.ɵɵFactoryTarget.Component });
@@ -12975,6 +12568,7 @@ var ComponentWidgetType;
     ComponentWidgetType["GRID"] = "grid";
     ComponentWidgetType["FILTER"] = "filter";
     ComponentWidgetType["TREE"] = "tree";
+    ComponentWidgetType["TOOLBAR"] = "toolbar";
 })(ComponentWidgetType || (ComponentWidgetType = {}));
 
 /**
@@ -13040,9 +12634,10 @@ class SmartComponentLayoutComponent {
     constructor(layoutService) {
         this.layoutService = layoutService;
         this._destroy$ = new Subject();
+        this.toolbarId = 'not_initialized_yet';
     }
     ngAfterViewInit() {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e, _f;
         if ((_a = this.smartFormList) === null || _a === void 0 ? void 0 : _a.first) {
             this.setFormComponent((_b = this.smartFormList) === null || _b === void 0 ? void 0 : _b.first);
         }
@@ -13067,6 +12662,14 @@ class SmartComponentLayoutComponent {
                 this.bindFilter();
             }
         });
+        if ((_e = this.toolbarList) === null || _e === void 0 ? void 0 : _e.first) {
+            this.setToolbarComponent((_f = this.toolbarList) === null || _f === void 0 ? void 0 : _f.first);
+        }
+        this.toolbarList.changes
+            .pipe(takeUntil(this._destroy$))
+            .subscribe((list) => {
+            this.setToolbarComponent(list.first);
+        });
         if (this.smartComponentLayout) {
             this.setUp();
         }
@@ -13082,7 +12685,7 @@ class SmartComponentLayoutComponent {
         }
     }
     setUp() {
-        var _a, _b, _c, _d, _e, _f, _g;
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         this.parent = (_a = this.smartComponentLayout) === null || _a === void 0 ? void 0 : _a.parentComponent;
         this.uuid = this.parent.uuid;
         this.treeService = this.parent.smartTreeService;
@@ -13102,6 +12705,10 @@ class SmartComponentLayoutComponent {
             else if (((_g = this.smartComponentLayout.widget) === null || _g === void 0 ? void 0 : _g.type) === ComponentWidgetType.TREE) {
                 this.constructTree();
             }
+            else if (((_h = this.smartComponentLayout.widget) === null || _h === void 0 ? void 0 : _h.type) === ComponentWidgetType.TOOLBAR) {
+                this.constructToolbar();
+            }
+            this.parent.initActions();
         }
     }
     type() {
@@ -13158,7 +12765,7 @@ class SmartComponentLayoutComponent {
     constructGrid() {
         var _a, _b;
         this.smartGrid = {
-            gridIdentifier: (_b = (_a = this.smartComponentLayout) === null || _a === void 0 ? void 0 : _a.widget) === null || _b === void 0 ? void 0 : _b.gridIdentifier,
+            gridIdentifier: (_b = (_a = this.smartComponentLayout) === null || _a === void 0 ? void 0 : _a.widget) === null || _b === void 0 ? void 0 : _b.identifier,
             gridModel: {
                 page: {},
             },
@@ -13176,153 +12783,598 @@ class SmartComponentLayoutComponent {
             this.bindGrid();
         }
     }
-    bindGrid() {
-        var _a;
-        if (this.smartGrid && this.smartGridComponent) {
-            this.smartGrid = (_a = this.parent) === null || _a === void 0 ? void 0 : _a.addGrid(this.smartGrid, {
-                rowUiActionType: GridUiActionType.POPUP_MENU,
-            }, false, this.smartGridComponent);
+    bindGrid() {
+        var _a;
+        if (this.smartGrid && this.smartGridComponent) {
+            this.smartGrid = (_a = this.parent) === null || _a === void 0 ? void 0 : _a.addGrid(this.smartGrid, {
+                rowUiActionType: GridUiActionType.POPUP_MENU,
+            }, false, this.smartGridComponent);
+        }
+    }
+    setToolbarComponent(comp) {
+        this.toolbar = comp;
+    }
+    constructFilter() {
+        var _a, _b, _c, _d;
+        this.smartFilter = this.smartComponentLayout.parentComponent.addFilter(`filter_${this.makeid(5)}`, (_b = (_a = this.smartComponentLayout) === null || _a === void 0 ? void 0 : _a.widget) === null || _b === void 0 ? void 0 : _b.filterExpressionFieldList, (_d = (_c = this.smartComponentLayout) === null || _c === void 0 ? void 0 : _c.widget) === null || _d === void 0 ? void 0 : _d.filterType, this.smartFilterComponent);
+    }
+    bindFilter() {
+        // TODO
+    }
+    constructTree() {
+        var _a, _b, _c;
+        this.parent.setUpDefaultTree((_b = (_a = this.smartComponentLayout) === null || _a === void 0 ? void 0 : _a.widget) === null || _b === void 0 ? void 0 : _b.identifier);
+        (_c = this.treeService) === null || _c === void 0 ? void 0 : _c.initialize();
+    }
+    constructToolbar() {
+        var _a, _b;
+        let toolbarId = (_b = (_a = this.smartComponentLayout) === null || _a === void 0 ? void 0 : _a.widget) === null || _b === void 0 ? void 0 : _b.identifier;
+        if (this.toolbarId !== toolbarId) {
+            this.toolbarId = toolbarId;
+        }
+    }
+}
+SmartComponentLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartComponentLayoutComponent, deps: [{ token: SmartformLayoutDefinitionService }], target: i0.ɵɵFactoryTarget.Component });
+SmartComponentLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartComponentLayoutComponent, selector: "smart-component-layout", inputs: { smartComponentLayout: "smartComponentLayout" }, viewQueries: [{ propertyName: "smartFormList", predicate: ["form"], descendants: true }, { propertyName: "smartGridList", predicate: ["grid"], descendants: true }, { propertyName: "smartFilterList", predicate: ["filter"], descendants: true }, { propertyName: "toolbarList", predicate: ["toolbar"], 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  <div\r\n    *ngIf=\"smartComponentLayout?.type === type().CONTAINER\"\r\n    [ngClass]=\"smartComponentLayout?.direction ?? 'vertical'\"\r\n  >\r\n    <smart-component-layout\r\n      *ngFor=\"let layout of smartComponentLayout?.components\"\r\n      [smartComponentLayout]=\"layout\"\r\n    ></smart-component-layout>\r\n  </div>\r\n  <smartform #form [smartForm]=\"smartForm\"></smartform>\r\n  <smart-grid #grid [smartGrid]=\"smartGrid\" [uuid]=\"uuid!\"></smart-grid>\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 #toolbar [id]=\"toolbarId\"></smart-ui-action-toolbar>\r\n</ng-template>\r\n", styles: [".horizontal{display:flex;flex-direction:row}.vertical{display:flex;flex-direction:column}\n"], components: [{ type: ExpandableSectionComponent, selector: "smart-expandable-section", inputs: ["data", "index"] }, { type: SmartComponentLayoutComponent, selector: "smart-component-layout", inputs: ["smartComponentLayout"] }, { type: SmartformComponent, selector: "smartform", inputs: ["smartForm"] }, { type: SmartGridComponent, selector: "smart-grid", inputs: ["smartGrid", "uuid", "dev"] }, { type: SmartTreeComponent, selector: "smart-tree", inputs: ["treeStyle", "treeService"] }, { type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: ["uiActionModels", "uiActionDescriptorService", "id"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", 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  <div\r\n    *ngIf=\"smartComponentLayout?.type === type().CONTAINER\"\r\n    [ngClass]=\"smartComponentLayout?.direction ?? 'vertical'\"\r\n  >\r\n    <smart-component-layout\r\n      *ngFor=\"let layout of smartComponentLayout?.components\"\r\n      [smartComponentLayout]=\"layout\"\r\n    ></smart-component-layout>\r\n  </div>\r\n  <smartform #form [smartForm]=\"smartForm\"></smartform>\r\n  <smart-grid #grid [smartGrid]=\"smartGrid\" [uuid]=\"uuid!\"></smart-grid>\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 #toolbar [id]=\"toolbarId\"></smart-ui-action-toolbar>\r\n</ng-template>\r\n", styles: [".horizontal{display:flex;flex-direction:row}.vertical{display:flex;flex-direction:column}\n"] }]
+        }], ctorParameters: function () { return [{ type: SmartformLayoutDefinitionService }]; }, propDecorators: { smartComponentLayout: [{
+                type: Input
+            }], smartFormList: [{
+                type: ViewChildren,
+                args: ['form']
+            }], smartGridList: [{
+                type: ViewChildren,
+                args: ['grid']
+            }], smartFilterList: [{
+                type: ViewChildren,
+                args: ['filter']
+            }], toolbarList: [{
+                type: ViewChildren,
+                args: ['toolbar']
+            }], components: [{
+                type: ViewChildren,
+                args: [SmartComponentLayoutComponent]
+            }] } });
+
+class SmartComponentLayoutModule {
+}
+SmartComponentLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartComponentLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SmartComponentLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartComponentLayoutModule, declarations: [SmartComponentLayoutComponent], imports: [BrowserModule,
+        MatCommonModule,
+        SmartformModule,
+        SmartGridModule,
+        SmartExpandableSectionModule,
+        SmarttreeModule,
+        SmartViewContextModule], exports: [SmartComponentLayoutComponent] });
+SmartComponentLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartComponentLayoutModule, providers: [], imports: [[
+            BrowserModule,
+            MatCommonModule,
+            SmartformModule,
+            SmartGridModule,
+            SmartExpandableSectionModule,
+            SmarttreeModule,
+            SmartViewContextModule,
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartComponentLayoutModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [SmartComponentLayoutComponent],
+                    imports: [
+                        BrowserModule,
+                        MatCommonModule,
+                        SmartformModule,
+                        SmartGridModule,
+                        SmartExpandableSectionModule,
+                        SmarttreeModule,
+                        SmartViewContextModule,
+                    ],
+                    exports: [SmartComponentLayoutComponent],
+                    providers: [],
+                }]
+        }] });
+
+class SmartFilterParamComponent {
+    constructor() { }
+    onItemClick(item) {
+        this.data.serviceToUse.peformWidgetAction({
+            code: 'ADD_FILTER_EXPRESSION',
+            params: {
+                model: item,
+            },
+        });
+    }
+}
+SmartFilterParamComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterParamComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SmartFilterParamComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartFilterParamComponent, selector: "app-target-group-filter-param", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"targetGroupFilterParamContainer\">\r\n  <div\r\n    class=\"targetGroupFilterItem\"\r\n    *ngFor=\"let data of data?.group\"\r\n    (click)=\"onItemClick(data)\"\r\n  >\r\n    <smart-icon icon=\"Ic24_Chevron_Right\" color=\"gray\"></smart-icon>\r\n    <div class=\"mat-caption\">\r\n      {{ data.label }}\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".targetGroupFilterParamContainer{display:flex;flex-direction:column;gap:.25rem}.targetGroupFilterItem{padding:.75rem;border-radius:.25rem;display:flex;flex-direction:row;gap:.5rem;cursor:pointer}.targetGroupFilterItem .mat-caption{margin:auto 0}\n"], components: [{ type: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color"] }], directives: [{ type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterParamComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-target-group-filter-param', template: "<div class=\"targetGroupFilterParamContainer\">\r\n  <div\r\n    class=\"targetGroupFilterItem\"\r\n    *ngFor=\"let data of data?.group\"\r\n    (click)=\"onItemClick(data)\"\r\n  >\r\n    <smart-icon icon=\"Ic24_Chevron_Right\" color=\"gray\"></smart-icon>\r\n    <div class=\"mat-caption\">\r\n      {{ data.label }}\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".targetGroupFilterParamContainer{display:flex;flex-direction:column;gap:.25rem}.targetGroupFilterItem{padding:.75rem;border-radius:.25rem;display:flex;flex-direction:row;gap:.5rem;cursor:pointer}.targetGroupFilterItem .mat-caption{margin:auto 0}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { data: [{
+                type: Input
+            }] } });
+
+class SmartFilterParamsComponent {
+    constructor() {
+        this._destroy$ = new Subject();
+        this.expandableSections = [];
+    }
+    ngOnInit() {
+        this.service.modelChanged.pipe(takeUntil(this._destroy$)).subscribe(() => {
+            this.setUp(this.service.model);
+        });
+        this.setUp(this.service.model);
+    }
+    ngOnDestroy() {
+        this._destroy$.next();
+        this._destroy$.complete();
+    }
+    setUp(model) {
+        if (model === null || model === void 0 ? void 0 : model.model) {
+            this.filterBuilder = model.model;
+            this.constructExpandableSections();
+        }
+    }
+    constructExpandableSections() {
+        if (this.filterBuilder.groups) {
+            this.expandableSections = this.filterBuilder.groups.map((filterExpressionBuilderGroup) => {
+                return {
+                    title: filterExpressionBuilderGroup.label,
+                    cssClass: 'filterExpressionBuilderGroup',
+                    customComponent: SmartFilterParamComponent,
+                    data: {
+                        group: filterExpressionBuilderGroup.fields,
+                        serviceToUse: this.service,
+                    },
+                    inputName: 'data',
+                    isExpanded: true,
+                };
+            });
+        }
+    }
+}
+SmartFilterParamsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterParamsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SmartFilterParamsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartFilterParamsComponent, selector: "smart-filter-group-params", inputs: { service: "service" }, viewQueries: [{ propertyName: "filterVcRef", first: true, predicate: ["smartFilter"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div\r\n  class=\"targetGroupFilterParamsContainer\"\r\n  *ngIf=\"service.model?.showGroups && !service.model?.readOnly\"\r\n>\r\n  <!-- <ng-template #smartFilter></ng-template> -->\r\n  <!-- <div class=\"dataSource-options\" *ngIf=\"service.model?.extarnalDatabase\">\r\n    <div class=\"dataSource-btns\">\r\n      <div class=\"dataSource-btn\">K\u00FCls\u0151 adatb\u00E1zis</div>\r\n      <div class=\"dataSource-btn dataSource-btn-disabled\">Bels\u0151 adatb\u00E1zis</div>\r\n    </div>\r\n    <div class=\"dataSource-add-database\">\r\n      <div class=\"dataSource-add-database-title\">\r\n        <smart-icon icon=\"Ic24_View_Table\" color=\"sucess\"></smart-icon>\r\n        Adatb\u00E1zis\r\n      </div>\r\n      <button title=\"add\" mat-icon-button (click)=\"addDataSource()\">\r\n        <smart-icon icon=\"Ic24_Plus_Circle\" color=\"success\"></smart-icon>\r\n      </button>\r\n    </div>\r\n  </div> -->\r\n  <div class=\"sections\">\r\n    <smart-expandable-section\r\n      class=\"excel\"\r\n      *ngIf=\"expandableSectionsFromExcel\"\r\n      [data]=\"expandableSectionsFromExcel!\"\r\n    ></smart-expandable-section>\r\n    <smart-expandable-section\r\n      [data]=\"data\"\r\n      *ngFor=\"let data of expandableSections\"\r\n    ></smart-expandable-section>\r\n  </div>\r\n</div>\r\n", styles: [".targetGroupFilterParamsContainer{padding:1.5rem;display:flex;flex-direction:column;gap:2.5rem;height:calc(100% - 3rem);overflow:auto;border-right:2px solid var(--primary-dark-color)}.sections{display:flex;flex-direction:column;gap:.25rem}.targetGroupFilterParamsContainer .excel::ng-deep .mat-expansion-panel-body{background-color:var(--success-lighter-color)}.targetGroupFilterParamsContainer .excel::ng-deep .mat-expansion-panel-header.mat-expanded{background-color:var(--success-color)!important}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-body{padding:0 0 0 1rem!important;background-color:var(--light-blue-color)}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header{background-color:var(--primary-light-color);padding:.75rem;height:auto}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header-title{color:var(--primary-lighter-color);font-weight:600}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header.mat-expanded{background-color:var(--accent-color)!important;padding:.75rem;height:auto}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header.mat-expanded .mat-expansion-panel-header-title{color:#fff}.dataSource-btns{display:flex;flex-direction:row;justify-content:space-around;background-color:var(--success-lighter-color);height:44px;padding:8px 12px;align-items:center;border:1.5px solid var(--success-color);border-left:6px solid var(--success-color);border-radius:4px}.dataSource-btn{display:flex;padding:1rem 2rem;justify-content:center;align-items:center;background-color:var(--success-color);border-radius:4px;cursor:pointer}.dataSource-btn-disabled{background-color:var(--success-lighter-color);cursor:auto}.dataSource-add-database{display:flex;flex-direction:row;justify-content:space-between;background-color:var(--success-lighter-color);padding:8px;border-radius:4px}.dataSource-add-database-title{display:flex;flex-direction:row;gap:1rem;align-items:center}.dataSource-options{display:flex;flex-direction:column;gap:1rem}\n"], components: [{ type: ExpandableSectionComponent, selector: "smart-expandable-section", inputs: ["data", "index"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterParamsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'smart-filter-group-params', template: "<div\r\n  class=\"targetGroupFilterParamsContainer\"\r\n  *ngIf=\"service.model?.showGroups && !service.model?.readOnly\"\r\n>\r\n  <!-- <ng-template #smartFilter></ng-template> -->\r\n  <!-- <div class=\"dataSource-options\" *ngIf=\"service.model?.extarnalDatabase\">\r\n    <div class=\"dataSource-btns\">\r\n      <div class=\"dataSource-btn\">K\u00FCls\u0151 adatb\u00E1zis</div>\r\n      <div class=\"dataSource-btn dataSource-btn-disabled\">Bels\u0151 adatb\u00E1zis</div>\r\n    </div>\r\n    <div class=\"dataSource-add-database\">\r\n      <div class=\"dataSource-add-database-title\">\r\n        <smart-icon icon=\"Ic24_View_Table\" color=\"sucess\"></smart-icon>\r\n        Adatb\u00E1zis\r\n      </div>\r\n      <button title=\"add\" mat-icon-button (click)=\"addDataSource()\">\r\n        <smart-icon icon=\"Ic24_Plus_Circle\" color=\"success\"></smart-icon>\r\n      </button>\r\n    </div>\r\n  </div> -->\r\n  <div class=\"sections\">\r\n    <smart-expandable-section\r\n      class=\"excel\"\r\n      *ngIf=\"expandableSectionsFromExcel\"\r\n      [data]=\"expandableSectionsFromExcel!\"\r\n    ></smart-expandable-section>\r\n    <smart-expandable-section\r\n      [data]=\"data\"\r\n      *ngFor=\"let data of expandableSections\"\r\n    ></smart-expandable-section>\r\n  </div>\r\n</div>\r\n", styles: [".targetGroupFilterParamsContainer{padding:1.5rem;display:flex;flex-direction:column;gap:2.5rem;height:calc(100% - 3rem);overflow:auto;border-right:2px solid var(--primary-dark-color)}.sections{display:flex;flex-direction:column;gap:.25rem}.targetGroupFilterParamsContainer .excel::ng-deep .mat-expansion-panel-body{background-color:var(--success-lighter-color)}.targetGroupFilterParamsContainer .excel::ng-deep .mat-expansion-panel-header.mat-expanded{background-color:var(--success-color)!important}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-body{padding:0 0 0 1rem!important;background-color:var(--light-blue-color)}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header{background-color:var(--primary-light-color);padding:.75rem;height:auto}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header-title{color:var(--primary-lighter-color);font-weight:600}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header.mat-expanded{background-color:var(--accent-color)!important;padding:.75rem;height:auto}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header.mat-expanded .mat-expansion-panel-header-title{color:#fff}.dataSource-btns{display:flex;flex-direction:row;justify-content:space-around;background-color:var(--success-lighter-color);height:44px;padding:8px 12px;align-items:center;border:1.5px solid var(--success-color);border-left:6px solid var(--success-color);border-radius:4px}.dataSource-btn{display:flex;padding:1rem 2rem;justify-content:center;align-items:center;background-color:var(--success-color);border-radius:4px;cursor:pointer}.dataSource-btn-disabled{background-color:var(--success-lighter-color);cursor:auto}.dataSource-add-database{display:flex;flex-direction:row;justify-content:space-between;background-color:var(--success-lighter-color);padding:8px;border-radius:4px}.dataSource-add-database-title{display:flex;flex-direction:row;gap:1rem;align-items:center}.dataSource-options{display:flex;flex-direction:column;gap:1rem}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { service: [{
+                type: Input
+            }], filterVcRef: [{
+                type: ViewChild,
+                args: ['smartFilter', { read: ViewContainerRef }]
+            }] } });
+
+class SmartFilterService {
+    constructor() {
+        this._destroy$ = new Subject();
+        this.shouldSubmit = new Subject();
+        this.reSubscribeToSubmit = new Subject();
+        this.change = new Subject();
+    }
+    ngOnDestroy() {
+        this._destroy$.next();
+        this._destroy$.complete();
+    }
+    submit() {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.shouldSubmit.next();
+            yield this.shouldSubmit.pipe(takeUntil(this._destroy$)).toPromise();
+            this.shouldSubmit = new Subject();
+            this.reSubscribeToSubmit.next();
+            return this.filter;
+        });
+    }
+}
+SmartFilterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+SmartFilterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: function () { return []; } });
+
+/**
+ * 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.
+ */
+var FilterExpressionBoolOperator$1;
+(function (FilterExpressionBoolOperator) {
+    FilterExpressionBoolOperator["AND"] = "AND";
+    FilterExpressionBoolOperator["OR"] = "OR";
+})(FilterExpressionBoolOperator$1 || (FilterExpressionBoolOperator$1 = {}));
+
+/**
+ * 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.
+ */
+var FilterExpressionDataType;
+(function (FilterExpressionDataType) {
+    FilterExpressionDataType["STRING"] = "STRING";
+    FilterExpressionDataType["NUMBER"] = "NUMBER";
+    FilterExpressionDataType["DATE"] = "DATE";
+    FilterExpressionDataType["DATE_TIME"] = "DATE_TIME";
+    FilterExpressionDataType["BOOLEAN"] = "BOOLEAN";
+})(FilterExpressionDataType || (FilterExpressionDataType = {}));
+
+/**
+ * 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.
+ */
+var FilterExpressionFieldWidgetType;
+(function (FilterExpressionFieldWidgetType) {
+    FilterExpressionFieldWidgetType["TEXT_FIELD"] = "TEXT_FIELD";
+    FilterExpressionFieldWidgetType["TEXT_FIELD_CHIPS"] = "TEXT_FIELD_CHIPS";
+    FilterExpressionFieldWidgetType["TEXT_BOX"] = "TEXT_BOX";
+    FilterExpressionFieldWidgetType["SELECT"] = "SELECT";
+    FilterExpressionFieldWidgetType["SELECT_MULTIPLE"] = "SELECT_MULTIPLE";
+    FilterExpressionFieldWidgetType["DATE"] = "DATE";
+    FilterExpressionFieldWidgetType["TIME"] = "TIME";
+    FilterExpressionFieldWidgetType["DATE_TIME"] = "DATE_TIME";
+    FilterExpressionFieldWidgetType["CHECK_BOX"] = "CHECK_BOX";
+    FilterExpressionFieldWidgetType["RADIO_BUTTON"] = "RADIO_BUTTON";
+    FilterExpressionFieldWidgetType["RANGE"] = "RANGE";
+})(FilterExpressionFieldWidgetType || (FilterExpressionFieldWidgetType = {}));
+
+/**
+ * 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.
+ */
+var FilterExpressionOperation;
+(function (FilterExpressionOperation) {
+    FilterExpressionOperation["EXPRESSION"] = "EXPRESSION";
+    FilterExpressionOperation["EQUAL"] = "EQUAL";
+    FilterExpressionOperation["NOT_EQUAL"] = "NOT_EQUAL";
+    FilterExpressionOperation["LESS"] = "LESS";
+    FilterExpressionOperation["LESS_OR_EQUAL"] = "LESS_OR_EQUAL";
+    FilterExpressionOperation["GREATER"] = "GREATER";
+    FilterExpressionOperation["GREATER_OR_EQUAL"] = "GREATER_OR_EQUAL";
+    FilterExpressionOperation["LIKE"] = "LIKE";
+    FilterExpressionOperation["NOT_LIKE"] = "NOT_LIKE";
+    FilterExpressionOperation["BETWEEN"] = "BETWEEN";
+    FilterExpressionOperation["NOT_BETWEEN"] = "NOT_BETWEEN";
+    FilterExpressionOperation["IS_EMPTY"] = "IS_EMPTY";
+    FilterExpressionOperation["IS_NOT_EMPTY"] = "IS_NOT_EMPTY";
+    FilterExpressionOperation["EXISTS"] = "EXISTS";
+    FilterExpressionOperation["NOT_EXISTS"] = "NOT_EXISTS";
+    FilterExpressionOperation["IN"] = "IN";
+    FilterExpressionOperation["NOT_IN"] = "NOT_IN";
+})(FilterExpressionOperation || (FilterExpressionOperation = {}));
+
+/**
+ * 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.
+ */
+var FilterExpressionOrderByOrderEnum;
+(function (FilterExpressionOrderByOrderEnum) {
+    FilterExpressionOrderByOrderEnum["ASC"] = "ASC";
+    FilterExpressionOrderByOrderEnum["DESC"] = "DESC";
+})(FilterExpressionOrderByOrderEnum || (FilterExpressionOrderByOrderEnum = {}));
+;
+
+var FilterExpressionBuilderGroupBuilderGroupKindEnum;
+(function (FilterExpressionBuilderGroupBuilderGroupKindEnum) {
+    FilterExpressionBuilderGroupBuilderGroupKindEnum["DIPLAY"] = "DIPLAY";
+    FilterExpressionBuilderGroupBuilderGroupKindEnum["BRACKET"] = "BRACKET";
+    FilterExpressionBuilderGroupBuilderGroupKindEnum["EXIST"] = "EXIST";
+})(FilterExpressionBuilderGroupBuilderGroupKindEnum || (FilterExpressionBuilderGroupBuilderGroupKindEnum = {}));
+;
+
+class SmartFilterSimpleFieldComponent {
+    constructor(service, cfService) {
+        this.service = service;
+        this.cfService = cfService;
+        this._destroy$ = new Subject();
+    }
+    ngOnInit() {
+        var _a;
+        this.operation = (_a = this.filterExpressionField.expressionData) === null || _a === void 0 ? void 0 : _a.currentOperation;
+        this.currentOperation = this.getOptionLabel(this.operation);
+    }
+    ngAfterViewInit() {
+        this.constructForm();
+    }
+    ngOnDestroy() {
+        this._destroy$.next();
+        this._destroy$.complete();
+    }
+    constructFormWidget(key, label, widgetType, possibleValues, placeholder) {
+        let type = widgetType;
+        if (type === FilterExpressionFieldWidgetType.DATE) {
+            type = SmartFormWidgetType.DATE_PICKER;
+        }
+        else if (type === FilterExpressionFieldWidgetType.DATE_TIME) {
+            type = SmartFormWidgetType.DATE_TIME_PICKER;
+        }
+        let widget = {
+            key,
+            label,
+            type,
+            value: '',
+            placeholder: placeholder,
+            showLabel: true,
+            valueList: possibleValues.map((value) => {
+                return {
+                    key: value.objectUri ? value.objectUri : value.code,
+                    label: value.displayValue,
+                    type: SmartFormWidgetType.ITEM,
+                    value: value.objectUri ? value.objectUri : value.code,
+                };
+            }),
+        };
+        return widget;
+    }
+    constructForm() {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+        (_a = this.vcRefForm) === null || _a === void 0 ? void 0 : _a.clear();
+        let widgets = [];
+        let key;
+        if (this.filterExpressionField.widgetType === 'SELECT_MULTIPLE') {
+            key = 'expressionData.operand2.selectedValues';
+        }
+        if ((_b = this.filterExpressionField.expressionData) === null || _b === void 0 ? void 0 : _b.operand2) {
+            if (key !== 'expressionData.operand2.selectedValues') {
+                key = 'expressionData.operand2.valueAsString';
+            }
+            widgets.push(this.constructFormWidget(key, this.filterExpressionField.label2, (_c = this.filterExpressionField.widgetType) !== null && _c !== void 0 ? _c : FilterExpressionFieldWidgetType.TEXT_FIELD, this.filterExpressionField.possibleValues, this.filterExpressionField.placeholder2));
+        }
+        if ((_d = this.filterExpressionField.expressionData) === null || _d === void 0 ? void 0 : _d.operand3) {
+            if (key !== 'selectedValues') {
+                key = 'expressionData.operand3.valueAsString';
+            }
+            widgets.push(this.constructFormWidget(key, this.filterExpressionField.label3, (_e = this.filterExpressionField.widgetType) !== null && _e !== void 0 ? _e : FilterExpressionFieldWidgetType.TEXT_FIELD, this.filterExpressionField.possibleValues, this.filterExpressionField.placeholder3));
+        }
+        this.operation = (_f = this.filterExpressionField.expressionData) === null || _f === void 0 ? void 0 : _f.currentOperation;
+        this.currentOperation = this.getOptionLabel(this.operation);
+        this.smartForm = {
+            direction: SmartFormWidgetDirection.ROW,
+            componentModel: { data: this.filterExpressionField },
+            useOnValueChangeEvent: true,
+            useOnBlurEvent: true,
+            submitOnEnter: (_g = this.service.filter) === null || _g === void 0 ? void 0 : _g.submitOnEnter,
+            widgets,
+            translateService: (_h = this.service.filter) === null || _h === void 0 ? void 0 : _h.translateService,
+        };
+        // Show form on page
+        this.componentRefForm = this.cfService.createComponent(this.vcRefForm, SmartformComponent, new Map([['smartForm', this.smartForm]]));
+        (_j = this.componentRefForm.instance.onValueChangeSubject) === null || _j === void 0 ? void 0 : _j.pipe(takeUntil(this._destroy$)).subscribe(() => {
+            this.submit();
+            this.service.change.next();
+        });
+        (_k = this.componentRefForm.instance.onBlurSubject) === null || _k === void 0 ? void 0 : _k.pipe(takeUntil(this._destroy$)).subscribe(() => {
+            this.submit();
+            this.service.change.next();
+        });
+    }
+    submit() {
+        var _a;
+        let form = this.componentRefForm.instance.submitForm();
+        this.filterExpressionField = (_a = form.componentModel) === null || _a === void 0 ? void 0 : _a.data;
+        this.simpleFieldChildren.forEach((smartFilterFieldComponent, index) => {
+            let filterExpressionField = smartFilterFieldComponent.submit();
+            this.filterExpressionField.subFieldList.filters[index] = filterExpressionField;
+        });
+        return this.filterExpressionField;
+    }
+    optionSelected(option) {
+        var _a, _b, _c, _d;
+        let oldOption = this.componentRefForm.instance.smartForm.componentModel.data.expressionData
+            .currentOperation;
+        this.componentRefForm.instance.smartForm.componentModel.data.expressionData.currentOperation =
+            option;
+        this.operation = option;
+        this.currentOperation = this.getOptionLabel(this.operation);
+        if (oldOption !== FilterExpressionOperation.BETWEEN &&
+            option === FilterExpressionOperation.BETWEEN) {
+            this.submit();
+            let label = this.filterExpressionField.label2;
+            this.filterExpressionField.label2 = `${label} - tól`;
+            this.filterExpressionField.label3 = `${label} - ig`;
+            this.filterExpressionField.expressionData.operand3 = {
+                isDataName: (_a = this.filterExpressionField.expressionData.operand2) === null || _a === void 0 ? void 0 : _a.isDataName,
+                type: (_b = this.filterExpressionField.expressionData.operand3) === null || _b === void 0 ? void 0 : _b.type,
+                valueAsString: (_c = this.filterExpressionField.expressionData.operand3) === null || _c === void 0 ? void 0 : _c.valueAsString,
+                selectedValues: (_d = this.filterExpressionField.expressionData.operand3) === null || _d === void 0 ? void 0 : _d.selectedValues,
+            };
+            this.constructForm();
+        }
+        else if (oldOption === FilterExpressionOperation.BETWEEN &&
+            option !== FilterExpressionOperation.BETWEEN) {
+            let label = this.filterExpressionField.label2.replace(' - tól', '');
+            this.filterExpressionField.label2 = `${label}`;
+            this.filterExpressionField.label3 = undefined;
+            this.filterExpressionField.expressionData.operand3 = undefined;
+            this.constructForm();
+        }
+    }
+    getOptionLabel(option) {
+        if (!option) {
+            return '';
         }
-    }
-    constructFilter() {
-        var _a, _b, _c, _d;
-        this.smartFilter = this.smartComponentLayout.parentComponent.addFilter(`filter_${this.makeid(5)}`, (_b = (_a = this.smartComponentLayout) === null || _a === void 0 ? void 0 : _a.widget) === null || _b === void 0 ? void 0 : _b.filterExpressionFieldList, (_d = (_c = this.smartComponentLayout) === null || _c === void 0 ? void 0 : _c.widget) === null || _d === void 0 ? void 0 : _d.filterType, this.smartFilterComponent);
-    }
-    bindFilter() {
-        // TODO
-    }
-    constructTree() {
-        var _a, _b, _c;
-        this.parent.setUpDefaultTree((_b = (_a = this.smartComponentLayout) === null || _a === void 0 ? void 0 : _a.widget) === null || _b === void 0 ? void 0 : _b.treeIdentifier);
-        (_c = this.treeService) === null || _c === void 0 ? void 0 : _c.initialize();
+        else if (this.operationTranslator) {
+            return this.operationTranslator(option);
+        }
+        return option;
     }
 }
-SmartComponentLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartComponentLayoutComponent, deps: [{ token: SmartformLayoutDefinitionService }], target: i0.ɵɵFactoryTarget.Component });
-SmartComponentLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartComponentLayoutComponent, selector: "smart-component-layout", inputs: { smartComponentLayout: "smartComponentLayout" }, viewQueries: [{ propertyName: "smartFormList", predicate: ["form"], descendants: true }, { propertyName: "smartGridList", predicate: ["grid"], descendants: true }, { propertyName: "smartFilterList", predicate: ["filter"], 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  <div\r\n    *ngIf=\"smartComponentLayout?.type === type().CONTAINER\"\r\n    [ngClass]=\"smartComponentLayout?.direction ?? 'vertical'\"\r\n  >\r\n    <smart-component-layout\r\n      *ngFor=\"let layout of smartComponentLayout?.components\"\r\n      [smartComponentLayout]=\"layout\"\r\n    ></smart-component-layout>\r\n  </div>\r\n  <smartform #form [smartForm]=\"smartForm\"></smartform>\r\n  <smart-grid #grid [smartGrid]=\"smartGrid\" [uuid]=\"uuid!\"></smart-grid>\r\n  <!-- <smart-filter #filter [filter]=\"smartFilter\"></smart-filter> -->\r\n  <smart-tree *ngIf=\"treeService\" [treeService]=\"treeService!\"></smart-tree>\r\n</ng-template>\r\n", styles: [".horizontal{display:flex;flex-direction:row}.vertical{display:flex;flex-direction:column}\n"], components: [{ type: ExpandableSectionComponent, selector: "smart-expandable-section", inputs: ["data", "index"] }, { type: SmartComponentLayoutComponent, selector: "smart-component-layout", inputs: ["smartComponentLayout"] }, { type: SmartformComponent, selector: "smartform", inputs: ["smartForm"] }, { type: SmartGridComponent, selector: "smart-grid", inputs: ["smartGrid", "uuid", "dev"] }, { type: SmartTreeComponent, selector: "smart-tree", inputs: ["treeStyle", "treeService"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartComponentLayoutComponent, decorators: [{
+SmartFilterSimpleFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterSimpleFieldComponent, deps: [{ token: SmartFilterService }, { token: ComponentFactoryService }], target: i0.ɵɵFactoryTarget.Component });
+SmartFilterSimpleFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartFilterSimpleFieldComponent, selector: "smart-filter-simple-field", inputs: { operationTranslator: "operationTranslator", filterExpressionField: "filterExpressionField", showPossibleActions: "showPossibleActions" }, viewQueries: [{ propertyName: "vcRefForm", first: true, predicate: ["form"], descendants: true, read: ViewContainerRef }, { propertyName: "simpleFieldChildren", predicate: ["simpleField"], descendants: true }], ngImport: i0, template: "<div class=\"smart-filter-simple-field-container\">\r\n  <div class=\"smart-filter-simple-field-form-widget\">\r\n    <div\r\n      class=\"smart-filter-simple-field-form-widget-row\"\r\n      *ngIf=\"showPossibleActions\"\r\n    >\r\n      <p>({{ currentOperation }})</p>\r\n      <button\r\n        mat-icon-button\r\n        [matMenuTriggerFor]=\"menu\"\r\n        aria-label=\"Example icon-button with a menu\"\r\n      >\r\n        <mat-icon>more_vert</mat-icon>\r\n      </button>\r\n      <mat-menu #menu=\"matMenu\">\r\n        <button\r\n          mat-menu-item\r\n          *ngFor=\"let option of filterExpressionField.possibleOperations\"\r\n          (click)=\"optionSelected(option)\"\r\n        >\r\n          <span>\r\n            {{ getOptionLabel(option) }}\r\n          </span>\r\n        </button>\r\n      </mat-menu>\r\n    </div>\r\n    <ng-template #form></ng-template>\r\n  </div>\r\n</div>\r\n", styles: [".smart-filter-simple-field-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem}.smart-filter-simple-field-form-widget{padding:1rem;border-radius:1rem;display:flex;flex-direction:column}.smart-filter-simple-field-form-widget-row{display:flex;flex-direction:row;justify-content:space-between}.smart-filter-simple-field-form-widget-row p{color:#00000042}.smart-filter-simple-field-form-widget ::ng-deep .mat-icon-button{height:24px;width:24px}.smart-filter-simple-field-form-widget ::ng-deep .mat-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-flat-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-stroked-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-raised-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-icon-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-fab .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-mini-fab .mat-button-wrapper>*{vertical-align:inherit!important}.smart-filter-simple-field-subfields-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem}.smart-filter-simple-field-container ::ng-deep h4{margin:0}\n"], components: [{ type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i5.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i5.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterSimpleFieldComponent, 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  <div\r\n    *ngIf=\"smartComponentLayout?.type === type().CONTAINER\"\r\n    [ngClass]=\"smartComponentLayout?.direction ?? 'vertical'\"\r\n  >\r\n    <smart-component-layout\r\n      *ngFor=\"let layout of smartComponentLayout?.components\"\r\n      [smartComponentLayout]=\"layout\"\r\n    ></smart-component-layout>\r\n  </div>\r\n  <smartform #form [smartForm]=\"smartForm\"></smartform>\r\n  <smart-grid #grid [smartGrid]=\"smartGrid\" [uuid]=\"uuid!\"></smart-grid>\r\n  <!-- <smart-filter #filter [filter]=\"smartFilter\"></smart-filter> -->\r\n  <smart-tree *ngIf=\"treeService\" [treeService]=\"treeService!\"></smart-tree>\r\n</ng-template>\r\n", styles: [".horizontal{display:flex;flex-direction:row}.vertical{display:flex;flex-direction:column}\n"] }]
-        }], ctorParameters: function () { return [{ type: SmartformLayoutDefinitionService }]; }, propDecorators: { smartComponentLayout: [{
-                type: Input
-            }], smartFormList: [{
-                type: ViewChildren,
-                args: ['form']
-            }], smartGridList: [{
-                type: ViewChildren,
-                args: ['grid']
-            }], smartFilterList: [{
-                type: ViewChildren,
-                args: ['filter']
-            }], components: [{
+            args: [{ selector: 'smart-filter-simple-field', template: "<div class=\"smart-filter-simple-field-container\">\r\n  <div class=\"smart-filter-simple-field-form-widget\">\r\n    <div\r\n      class=\"smart-filter-simple-field-form-widget-row\"\r\n      *ngIf=\"showPossibleActions\"\r\n    >\r\n      <p>({{ currentOperation }})</p>\r\n      <button\r\n        mat-icon-button\r\n        [matMenuTriggerFor]=\"menu\"\r\n        aria-label=\"Example icon-button with a menu\"\r\n      >\r\n        <mat-icon>more_vert</mat-icon>\r\n      </button>\r\n      <mat-menu #menu=\"matMenu\">\r\n        <button\r\n          mat-menu-item\r\n          *ngFor=\"let option of filterExpressionField.possibleOperations\"\r\n          (click)=\"optionSelected(option)\"\r\n        >\r\n          <span>\r\n            {{ getOptionLabel(option) }}\r\n          </span>\r\n        </button>\r\n      </mat-menu>\r\n    </div>\r\n    <ng-template #form></ng-template>\r\n  </div>\r\n</div>\r\n", styles: [".smart-filter-simple-field-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem}.smart-filter-simple-field-form-widget{padding:1rem;border-radius:1rem;display:flex;flex-direction:column}.smart-filter-simple-field-form-widget-row{display:flex;flex-direction:row;justify-content:space-between}.smart-filter-simple-field-form-widget-row p{color:#00000042}.smart-filter-simple-field-form-widget ::ng-deep .mat-icon-button{height:24px;width:24px}.smart-filter-simple-field-form-widget ::ng-deep .mat-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-flat-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-stroked-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-raised-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-icon-button .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-fab .mat-button-wrapper>*,.smart-filter-simple-field-form-widget ::ng-deep .mat-mini-fab .mat-button-wrapper>*{vertical-align:inherit!important}.smart-filter-simple-field-subfields-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem}.smart-filter-simple-field-container ::ng-deep h4{margin:0}\n"] }]
+        }], ctorParameters: function () { return [{ type: SmartFilterService }, { type: ComponentFactoryService }]; }, propDecorators: { simpleFieldChildren: [{
                 type: ViewChildren,
-                args: [SmartComponentLayoutComponent]
-            }] } });
-
-class SmartComponentLayoutModule {
-}
-SmartComponentLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartComponentLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-SmartComponentLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartComponentLayoutModule, declarations: [SmartComponentLayoutComponent], imports: [BrowserModule,
-        MatCommonModule,
-        SmartformModule,
-        SmartGridModule,
-        SmartExpandableSectionModule,
-        SmarttreeModule], exports: [SmartComponentLayoutComponent] });
-SmartComponentLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartComponentLayoutModule, providers: [], imports: [[
-            BrowserModule,
-            MatCommonModule,
-            SmartformModule,
-            SmartGridModule,
-            SmartExpandableSectionModule,
-            SmarttreeModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartComponentLayoutModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [SmartComponentLayoutComponent],
-                    imports: [
-                        BrowserModule,
-                        MatCommonModule,
-                        SmartformModule,
-                        SmartGridModule,
-                        SmartExpandableSectionModule,
-                        SmarttreeModule,
-                    ],
-                    exports: [SmartComponentLayoutComponent],
-                    providers: [],
-                }]
-        }] });
-
-class SmartFilterParamComponent {
-    constructor() { }
-    onItemClick(item) {
-        this.data.serviceToUse.peformWidgetAction({
-            code: 'ADD_FILTER_EXPRESSION',
-            params: {
-                model: item,
-            },
-        });
-    }
-}
-SmartFilterParamComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterParamComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SmartFilterParamComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartFilterParamComponent, selector: "app-target-group-filter-param", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"targetGroupFilterParamContainer\">\r\n  <div\r\n    class=\"targetGroupFilterItem\"\r\n    *ngFor=\"let data of data?.group\"\r\n    (click)=\"onItemClick(data)\"\r\n  >\r\n    <smart-icon icon=\"Ic24_Chevron_Right\" color=\"gray\"></smart-icon>\r\n    <div class=\"mat-caption\">\r\n      {{ data.label }}\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".targetGroupFilterParamContainer{display:flex;flex-direction:column;gap:.25rem}.targetGroupFilterItem{padding:.75rem;border-radius:.25rem;display:flex;flex-direction:row;gap:.5rem;cursor:pointer}.targetGroupFilterItem .mat-caption{margin:auto 0}\n"], components: [{ type: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color"] }], directives: [{ type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterParamComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'app-target-group-filter-param', template: "<div class=\"targetGroupFilterParamContainer\">\r\n  <div\r\n    class=\"targetGroupFilterItem\"\r\n    *ngFor=\"let data of data?.group\"\r\n    (click)=\"onItemClick(data)\"\r\n  >\r\n    <smart-icon icon=\"Ic24_Chevron_Right\" color=\"gray\"></smart-icon>\r\n    <div class=\"mat-caption\">\r\n      {{ data.label }}\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".targetGroupFilterParamContainer{display:flex;flex-direction:column;gap:.25rem}.targetGroupFilterItem{padding:.75rem;border-radius:.25rem;display:flex;flex-direction:row;gap:.5rem;cursor:pointer}.targetGroupFilterItem .mat-caption{margin:auto 0}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { data: [{
+                args: ['simpleField']
+            }], operationTranslator: [{
+                type: Input
+            }], filterExpressionField: [{
+                type: Input
+            }], showPossibleActions: [{
                 type: Input
+            }], vcRefForm: [{
+                type: ViewChild,
+                args: ['form', { read: ViewContainerRef }]
             }] } });
 
-class SmartFilterParamsComponent {
-    constructor() {
+class SmartFilterSimpleComponent {
+    constructor(service) {
+        this.service = service;
         this._destroy$ = new Subject();
-        this.expandableSections = [];
+        this.service.reSubscribeToSubmit.pipe(takeUntil(this._destroy$)).subscribe(() => {
+            this.subscribeToSubmit();
+        });
+        this.subscribeToSubmit();
     }
     ngOnInit() {
-        this.service.modelChanged.pipe(takeUntil(this._destroy$)).subscribe(() => {
-            this.setUp(this.service.model);
-        });
-        this.setUp(this.service.model);
+        this.smartFilter = this.service.filter;
     }
     ngOnDestroy() {
         this._destroy$.next();
         this._destroy$.complete();
     }
-    setUp(model) {
-        if (model === null || model === void 0 ? void 0 : model.model) {
-            this.filterBuilder = model.model;
-            this.constructExpandableSections();
+    subscribeToSubmit() {
+        this.service.shouldSubmit.pipe(takeUntil(this._destroy$)).subscribe(() => {
+            this.submit();
+        });
+    }
+    submit() {
+        this.simpleFieldChildren.forEach((smartFilterFieldComponent, index) => {
+            this.smartFilter.data[index] = smartFilterFieldComponent.submit();
+        });
+        this.service.filter = this.smartFilter;
+        this.service.shouldSubmit.complete();
+    }
+}
+SmartFilterSimpleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterSimpleComponent, deps: [{ token: SmartFilterService }], target: i0.ɵɵFactoryTarget.Component });
+SmartFilterSimpleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartFilterSimpleComponent, selector: "smart-filter-simple", viewQueries: [{ propertyName: "simpleFieldChildren", predicate: ["simpleField"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"smartFilter\" class=\"smart-simple-fields-container\">\r\n    <div *ngFor=\"let filterExpressionField of smartFilter.data; let i = index\">\r\n        <smart-filter-simple-field\r\n            #simpleField\r\n            [filterExpressionField]=\"filterExpressionField\"\r\n            [operationTranslator]=\"smartFilter.operationTranslator\"\r\n            [showPossibleActions]=\"smartFilter.showPossibleActions\"\r\n        ></smart-filter-simple-field>\r\n        <div *ngFor=\"let subfilterExpressionField of filterExpressionField.subFieldList?.filters\">\r\n            <smart-filter-simple-field\r\n                #simpleField\r\n                [filterExpressionField]=\"filterExpressionField\"\r\n                [operationTranslator]=\"smartFilter.operationTranslator\"\r\n                [showPossibleActions]=\"smartFilter.showPossibleActions\"\r\n            ></smart-filter-simple-field>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".smart-simple-fields-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem;justify-content:center}\n"], components: [{ type: SmartFilterSimpleFieldComponent, selector: "smart-filter-simple-field", inputs: ["operationTranslator", "filterExpressionField", "showPossibleActions"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterSimpleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "smart-filter-simple", template: "<div *ngIf=\"smartFilter\" class=\"smart-simple-fields-container\">\r\n    <div *ngFor=\"let filterExpressionField of smartFilter.data; let i = index\">\r\n        <smart-filter-simple-field\r\n            #simpleField\r\n            [filterExpressionField]=\"filterExpressionField\"\r\n            [operationTranslator]=\"smartFilter.operationTranslator\"\r\n            [showPossibleActions]=\"smartFilter.showPossibleActions\"\r\n        ></smart-filter-simple-field>\r\n        <div *ngFor=\"let subfilterExpressionField of filterExpressionField.subFieldList?.filters\">\r\n            <smart-filter-simple-field\r\n                #simpleField\r\n                [filterExpressionField]=\"filterExpressionField\"\r\n                [operationTranslator]=\"smartFilter.operationTranslator\"\r\n                [showPossibleActions]=\"smartFilter.showPossibleActions\"\r\n            ></smart-filter-simple-field>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".smart-simple-fields-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem;justify-content:center}\n"] }]
+        }], ctorParameters: function () { return [{ type: SmartFilterService }]; }, propDecorators: { simpleFieldChildren: [{
+                type: ViewChildren,
+                args: ["simpleField"]
+            }] } });
+
+class SmartFilterComponent {
+    constructor(service) {
+        this.service = service;
+    }
+    ngOnInit() {
+        if (this.filter) {
+            this.setUp();
         }
     }
-    constructExpandableSections() {
-        if (this.filterBuilder.groups) {
-            this.expandableSections = this.filterBuilder.groups.map((filterExpressionBuilderGroup) => {
-                return {
-                    title: filterExpressionBuilderGroup.label,
-                    cssClass: 'filterExpressionBuilderGroup',
-                    customComponent: SmartFilterParamComponent,
-                    data: {
-                        group: filterExpressionBuilderGroup.fields,
-                        serviceToUse: this.service,
-                    },
-                    inputName: 'data',
-                    isExpanded: true,
-                };
-            });
+    ngOnChanges(changes) {
+        if (changes['filter'].currentValue) {
+            this.setUp();
         }
     }
+    setUp() {
+        this.service.filter = this.filter;
+    }
+    submit() {
+        return __awaiter(this, void 0, void 0, function* () {
+            return yield this.service.submit();
+        });
+    }
 }
-SmartFilterParamsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterParamsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SmartFilterParamsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartFilterParamsComponent, selector: "smart-filter-group-params", inputs: { service: "service" }, viewQueries: [{ propertyName: "filterVcRef", first: true, predicate: ["smartFilter"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div\r\n  class=\"targetGroupFilterParamsContainer\"\r\n  *ngIf=\"service.model?.showGroups && !service.model?.readOnly\"\r\n>\r\n  <!-- <ng-template #smartFilter></ng-template> -->\r\n  <!-- <div class=\"dataSource-options\" *ngIf=\"service.model?.extarnalDatabase\">\r\n    <div class=\"dataSource-btns\">\r\n      <div class=\"dataSource-btn\">K\u00FCls\u0151 adatb\u00E1zis</div>\r\n      <div class=\"dataSource-btn dataSource-btn-disabled\">Bels\u0151 adatb\u00E1zis</div>\r\n    </div>\r\n    <div class=\"dataSource-add-database\">\r\n      <div class=\"dataSource-add-database-title\">\r\n        <smart-icon icon=\"Ic24_View_Table\" color=\"sucess\"></smart-icon>\r\n        Adatb\u00E1zis\r\n      </div>\r\n      <button title=\"add\" mat-icon-button (click)=\"addDataSource()\">\r\n        <smart-icon icon=\"Ic24_Plus_Circle\" color=\"success\"></smart-icon>\r\n      </button>\r\n    </div>\r\n  </div> -->\r\n  <div class=\"sections\">\r\n    <smart-expandable-section\r\n      class=\"excel\"\r\n      *ngIf=\"expandableSectionsFromExcel\"\r\n      [data]=\"expandableSectionsFromExcel!\"\r\n    ></smart-expandable-section>\r\n    <smart-expandable-section\r\n      [data]=\"data\"\r\n      *ngFor=\"let data of expandableSections\"\r\n    ></smart-expandable-section>\r\n  </div>\r\n</div>\r\n", styles: [".targetGroupFilterParamsContainer{padding:1.5rem;display:flex;flex-direction:column;gap:2.5rem;height:calc(100% - 3rem);overflow:auto;border-right:2px solid var(--primary-dark-color)}.sections{display:flex;flex-direction:column;gap:.25rem}.targetGroupFilterParamsContainer .excel::ng-deep .mat-expansion-panel-body{background-color:var(--success-lighter-color)}.targetGroupFilterParamsContainer .excel::ng-deep .mat-expansion-panel-header.mat-expanded{background-color:var(--success-color)!important}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-body{padding:0 0 0 1rem!important;background-color:var(--light-blue-color)}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header{background-color:var(--primary-light-color);padding:.75rem;height:auto}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header-title{color:var(--primary-lighter-color);font-weight:600}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header.mat-expanded{background-color:var(--accent-color)!important;padding:.75rem;height:auto}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header.mat-expanded .mat-expansion-panel-header-title{color:#fff}.dataSource-btns{display:flex;flex-direction:row;justify-content:space-around;background-color:var(--success-lighter-color);height:44px;padding:8px 12px;align-items:center;border:1.5px solid var(--success-color);border-left:6px solid var(--success-color);border-radius:4px}.dataSource-btn{display:flex;padding:1rem 2rem;justify-content:center;align-items:center;background-color:var(--success-color);border-radius:4px;cursor:pointer}.dataSource-btn-disabled{background-color:var(--success-lighter-color);cursor:auto}.dataSource-add-database{display:flex;flex-direction:row;justify-content:space-between;background-color:var(--success-lighter-color);padding:8px;border-radius:4px}.dataSource-add-database-title{display:flex;flex-direction:row;gap:1rem;align-items:center}.dataSource-options{display:flex;flex-direction:column;gap:1rem}\n"], components: [{ type: ExpandableSectionComponent, selector: "smart-expandable-section", inputs: ["data", "index"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterParamsComponent, decorators: [{
+SmartFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterComponent, deps: [{ token: SmartFilterService }], target: i0.ɵɵFactoryTarget.Component });
+SmartFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartFilterComponent, selector: "smart-filter", inputs: { filter: "filter" }, providers: [SmartFilterService], usesOnChanges: true, ngImport: i0, template: "<smart-filter-simple *ngIf=\"filter\" #simpleFilter></smart-filter-simple>\r\n", styles: [""], components: [{ type: SmartFilterSimpleComponent, selector: "smart-filter-simple" }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'smart-filter-group-params', template: "<div\r\n  class=\"targetGroupFilterParamsContainer\"\r\n  *ngIf=\"service.model?.showGroups && !service.model?.readOnly\"\r\n>\r\n  <!-- <ng-template #smartFilter></ng-template> -->\r\n  <!-- <div class=\"dataSource-options\" *ngIf=\"service.model?.extarnalDatabase\">\r\n    <div class=\"dataSource-btns\">\r\n      <div class=\"dataSource-btn\">K\u00FCls\u0151 adatb\u00E1zis</div>\r\n      <div class=\"dataSource-btn dataSource-btn-disabled\">Bels\u0151 adatb\u00E1zis</div>\r\n    </div>\r\n    <div class=\"dataSource-add-database\">\r\n      <div class=\"dataSource-add-database-title\">\r\n        <smart-icon icon=\"Ic24_View_Table\" color=\"sucess\"></smart-icon>\r\n        Adatb\u00E1zis\r\n      </div>\r\n      <button title=\"add\" mat-icon-button (click)=\"addDataSource()\">\r\n        <smart-icon icon=\"Ic24_Plus_Circle\" color=\"success\"></smart-icon>\r\n      </button>\r\n    </div>\r\n  </div> -->\r\n  <div class=\"sections\">\r\n    <smart-expandable-section\r\n      class=\"excel\"\r\n      *ngIf=\"expandableSectionsFromExcel\"\r\n      [data]=\"expandableSectionsFromExcel!\"\r\n    ></smart-expandable-section>\r\n    <smart-expandable-section\r\n      [data]=\"data\"\r\n      *ngFor=\"let data of expandableSections\"\r\n    ></smart-expandable-section>\r\n  </div>\r\n</div>\r\n", styles: [".targetGroupFilterParamsContainer{padding:1.5rem;display:flex;flex-direction:column;gap:2.5rem;height:calc(100% - 3rem);overflow:auto;border-right:2px solid var(--primary-dark-color)}.sections{display:flex;flex-direction:column;gap:.25rem}.targetGroupFilterParamsContainer .excel::ng-deep .mat-expansion-panel-body{background-color:var(--success-lighter-color)}.targetGroupFilterParamsContainer .excel::ng-deep .mat-expansion-panel-header.mat-expanded{background-color:var(--success-color)!important}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-body{padding:0 0 0 1rem!important;background-color:var(--light-blue-color)}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header{background-color:var(--primary-light-color);padding:.75rem;height:auto}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header-title{color:var(--primary-lighter-color);font-weight:600}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header.mat-expanded{background-color:var(--accent-color)!important;padding:.75rem;height:auto}.targetGroupFilterParamsContainer::ng-deep .mat-expansion-panel-header.mat-expanded .mat-expansion-panel-header-title{color:#fff}.dataSource-btns{display:flex;flex-direction:row;justify-content:space-around;background-color:var(--success-lighter-color);height:44px;padding:8px 12px;align-items:center;border:1.5px solid var(--success-color);border-left:6px solid var(--success-color);border-radius:4px}.dataSource-btn{display:flex;padding:1rem 2rem;justify-content:center;align-items:center;background-color:var(--success-color);border-radius:4px;cursor:pointer}.dataSource-btn-disabled{background-color:var(--success-lighter-color);cursor:auto}.dataSource-add-database{display:flex;flex-direction:row;justify-content:space-between;background-color:var(--success-lighter-color);padding:8px;border-radius:4px}.dataSource-add-database-title{display:flex;flex-direction:row;gap:1rem;align-items:center}.dataSource-options{display:flex;flex-direction:column;gap:1rem}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { service: [{
+            args: [{ selector: 'smart-filter', providers: [SmartFilterService], template: "<smart-filter-simple *ngIf=\"filter\" #simpleFilter></smart-filter-simple>\r\n", styles: [""] }]
+        }], ctorParameters: function () { return [{ type: SmartFilterService }]; }, propDecorators: { filter: [{
                 type: Input
-            }], filterVcRef: [{
-                type: ViewChild,
-                args: ['smartFilter', { read: ViewContainerRef }]
             }] } });
 
+class SmartFilterExpressionFieldComponent {
+    constructor() { }
+    ngOnInit() {
+    }
+}
+SmartFilterExpressionFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterExpressionFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SmartFilterExpressionFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SmartFilterExpressionFieldComponent, selector: "lib-smart-filter-expression-field", ngImport: i0, template: "", styles: [""] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterExpressionFieldComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-smart-filter-expression-field', template: "", styles: [""] }]
+        }], ctorParameters: function () { return []; } });
+
+class SmartFilterModule {
+}
+SmartFilterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SmartFilterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterModule, declarations: [SmartFilterComponent,
+        SmartFilterExpressionFieldComponent,
+        SmartFilterSimpleComponent,
+        SmartFilterSimpleFieldComponent], imports: [BrowserModule, SmartformModule, MatMenuModule, MatIconModule, MatButtonModule], exports: [SmartFilterComponent] });
+SmartFilterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterModule, imports: [[BrowserModule, SmartformModule, MatMenuModule, MatIconModule, MatButtonModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartFilterModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        SmartFilterComponent,
+                        SmartFilterExpressionFieldComponent,
+                        SmartFilterSimpleComponent,
+                        SmartFilterSimpleFieldComponent,
+                    ],
+                    imports: [BrowserModule, SmartformModule, MatMenuModule, MatIconModule, MatButtonModule],
+                    exports: [SmartFilterComponent],
+                }]
+        }] });
+
+var SmartFilterPosition;
+(function (SmartFilterPosition) {
+    SmartFilterPosition[SmartFilterPosition["TOP"] = 0] = "TOP";
+    SmartFilterPosition[SmartFilterPosition["BOTTOM"] = 1] = "BOTTOM";
+    SmartFilterPosition[SmartFilterPosition["LEFT"] = 2] = "LEFT";
+    SmartFilterPosition[SmartFilterPosition["RIGHT"] = 3] = "RIGHT";
+})(SmartFilterPosition || (SmartFilterPosition = {}));
+var SmartFilterType;
+(function (SmartFilterType) {
+    SmartFilterType[SmartFilterType["SIMPLE"] = 0] = "SIMPLE";
+    SmartFilterType[SmartFilterType["ADVANCED"] = 1] = "ADVANCED";
+})(SmartFilterType || (SmartFilterType = {}));
+
+/*
+ * Public API Surface of smart-filter
+ */
+
 var FilterExpressionBuilderUiModelTypeEnum;
 (function (FilterExpressionBuilderUiModelTypeEnum) {
     FilterExpressionBuilderUiModelTypeEnum["SIMPLE"] = "SIMPLE";
@@ -13519,28 +13571,28 @@ class SmartFilterEditorContentComponent {
             model[index] = filterExpressionField;
             if (filterExpressionField.widgetType === 'SELECT_MULTIPLE') {
                 key = index + '.expressionData.operand2.selectedValues';
-                widgets.push(this.constructFormWidget(key, filterExpressionField.label2, (_a = filterExpressionField.widgetType) !== null && _a !== void 0 ? _a : FilterExpressionFieldWidgetType.TextField, filterExpressionField.possibleValues, (_d = (_c = (_b = filterExpressionField.expressionData) === null || _b === void 0 ? void 0 : _b.operand2) === null || _c === void 0 ? void 0 : _c.valueAsString) !== null && _d !== void 0 ? _d : ''));
+                widgets.push(this.constructFormWidget(key, filterExpressionField.label2, (_a = filterExpressionField.widgetType) !== null && _a !== void 0 ? _a : FilterExpressionFieldWidgetType.TEXT_FIELD, filterExpressionField.possibleValues, (_d = (_c = (_b = filterExpressionField.expressionData) === null || _b === void 0 ? void 0 : _b.operand2) === null || _c === void 0 ? void 0 : _c.valueAsString) !== null && _d !== void 0 ? _d : ''));
                 return;
             }
             if (((_e = filterExpressionField.expressionData) === null || _e === void 0 ? void 0 : _e.currentOperation) === 'BETWEEN') {
                 key = index + '.expressionData.operand2.valueAsString';
-                widgets.push(this.constructFormWidget(key, filterExpressionField.label2, (_f = filterExpressionField.widgetType) !== null && _f !== void 0 ? _f : FilterExpressionFieldWidgetType.TextField, filterExpressionField.possibleValues, (_j = (_h = (_g = filterExpressionField.expressionData) === null || _g === void 0 ? void 0 : _g.operand2) === null || _h === void 0 ? void 0 : _h.valueAsString) !== null && _j !== void 0 ? _j : ''));
+                widgets.push(this.constructFormWidget(key, filterExpressionField.label2, (_f = filterExpressionField.widgetType) !== null && _f !== void 0 ? _f : FilterExpressionFieldWidgetType.TEXT_FIELD, filterExpressionField.possibleValues, (_j = (_h = (_g = filterExpressionField.expressionData) === null || _g === void 0 ? void 0 : _g.operand2) === null || _h === void 0 ? void 0 : _h.valueAsString) !== null && _j !== void 0 ? _j : ''));
                 key = index + '.expressionData.operand3.valueAsString';
-                widgets.push(this.constructFormWidget(key, filterExpressionField.label3, (_k = filterExpressionField.widgetType) !== null && _k !== void 0 ? _k : FilterExpressionFieldWidgetType.TextField, filterExpressionField.possibleValues, (_o = (_m = (_l = filterExpressionField.expressionData) === null || _l === void 0 ? void 0 : _l.operand3) === null || _m === void 0 ? void 0 : _m.valueAsString) !== null && _o !== void 0 ? _o : ''));
+                widgets.push(this.constructFormWidget(key, filterExpressionField.label3, (_k = filterExpressionField.widgetType) !== null && _k !== void 0 ? _k : FilterExpressionFieldWidgetType.TEXT_FIELD, filterExpressionField.possibleValues, (_o = (_m = (_l = filterExpressionField.expressionData) === null || _l === void 0 ? void 0 : _l.operand3) === null || _m === void 0 ? void 0 : _m.valueAsString) !== null && _o !== void 0 ? _o : ''));
                 return;
             }
             if ((_p = filterExpressionField.expressionData) === null || _p === void 0 ? void 0 : _p.operand2) {
                 if (key !== index + '.expressionData.operand2.selectedValues') {
                     key = index + '.expressionData.operand2.valueAsString';
                 }
-                widgets.push(this.constructFormWidget(key, filterExpressionField.label2, (_q = filterExpressionField.widgetType) !== null && _q !== void 0 ? _q : FilterExpressionFieldWidgetType.TextField, filterExpressionField.possibleValues, (_t = (_s = (_r = filterExpressionField.expressionData) === null || _r === void 0 ? void 0 : _r.operand2) === null || _s === void 0 ? void 0 : _s.valueAsString) !== null && _t !== void 0 ? _t : ''));
+                widgets.push(this.constructFormWidget(key, filterExpressionField.label2, (_q = filterExpressionField.widgetType) !== null && _q !== void 0 ? _q : FilterExpressionFieldWidgetType.TEXT_FIELD, filterExpressionField.possibleValues, (_t = (_s = (_r = filterExpressionField.expressionData) === null || _r === void 0 ? void 0 : _r.operand2) === null || _s === void 0 ? void 0 : _s.valueAsString) !== null && _t !== void 0 ? _t : ''));
                 return;
             }
             if ((_u = filterExpressionField === null || filterExpressionField === void 0 ? void 0 : filterExpressionField.expressionData) === null || _u === void 0 ? void 0 : _u.operand3) {
                 if (key !== index + '.selectedValues') {
                     key = index + '.expressionData.operand3.valueAsString';
                 }
-                widgets.push(this.constructFormWidget(key, filterExpressionField.label3, (_v = filterExpressionField.widgetType) !== null && _v !== void 0 ? _v : FilterExpressionFieldWidgetType.TextField, filterExpressionField.possibleValues, (_y = (_x = (_w = filterExpressionField.expressionData) === null || _w === void 0 ? void 0 : _w.operand3) === null || _x === void 0 ? void 0 : _x.valueAsString) !== null && _y !== void 0 ? _y : ''));
+                widgets.push(this.constructFormWidget(key, filterExpressionField.label3, (_v = filterExpressionField.widgetType) !== null && _v !== void 0 ? _v : FilterExpressionFieldWidgetType.TEXT_FIELD, filterExpressionField.possibleValues, (_y = (_x = (_w = filterExpressionField.expressionData) === null || _w === void 0 ? void 0 : _w.operand3) === null || _x === void 0 ? void 0 : _x.valueAsString) !== null && _y !== void 0 ? _y : ''));
                 return;
             }
         });
@@ -13654,10 +13706,10 @@ class SmartFilterEditorContentComponent {
     }
     constructFormWidget(key, label, widgetType, possibleValues, value) {
         let type = widgetType;
-        if (type === FilterExpressionFieldWidgetType.Date) {
+        if (type === FilterExpressionFieldWidgetType.DATE) {
             type = SmartFormWidgetType.DATE_PICKER;
         }
-        else if (type === FilterExpressionFieldWidgetType.DateTime) {
+        else if (type === FilterExpressionFieldWidgetType.DATE_TIME) {
             type = SmartFormWidgetType.DATE_TIME_PICKER;
         }
         let widget = {
@@ -14182,6 +14234,18 @@ class SmartComponentLayoutUtility {
         }
         return result;
     }
+    static getToolbars(comp) {
+        let result = [];
+        if (comp.components) {
+            result = comp.components
+                .map((c) => this.getToolbars(c))
+                .reduce((acc, value) => acc.concat(value), []);
+        }
+        if (comp.toolbar) {
+            result.push(comp.toolbar);
+        }
+        return result;
+    }
 }
 
 /*
@@ -14656,6 +14720,7 @@ class SmartComponentApiClient {
                     if (comp.smartComponentLayout) {
                         // TODO maybe we should set comp.parent, not comp.smartComponentLayout.parentComponent..
                         SmartComponentLayoutUtility.setParent(comp.smartComponentLayout, this);
+                        this.initActions();
                     }
                     if (this.uuid && this.uuid !== comp.uuid)
                         comp.uuid = this.uuid;
@@ -14782,13 +14847,16 @@ class SmartComponentApiClient {
         return filters;
     }
     getAllSmartUiActionToolbars() {
-        var _a, _b, _c;
+        var _a, _b, _c, _d;
         let toolbars = (_b = (_a = this.getSmartUiActionToolbarsQL()) === null || _a === void 0 ? void 0 : _a.toArray()) !== null && _b !== void 0 ? _b : [];
         (_c = this.getAllSmartGridComponents()) === null || _c === void 0 ? void 0 : _c.forEach((grid) => {
             if (grid.toolbar) {
                 toolbars.push(grid.toolbar);
             }
         });
+        (_d = this.getSmartComponentLayoutsQL()) === null || _d === void 0 ? void 0 : _d.forEach((comp) => {
+            toolbars.push(...SmartComponentLayoutUtility.getToolbars(comp));
+        });
         return toolbars;
     }
     initData() {
@@ -15352,5 +15420,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { APIS$3 as APIS, ApiModule$3 as ApiModule, ApiQueueService, BASE_PATH$5 as BASE_PATH, COLLECTION_FORMATS$5 as COLLECTION_FORMATS, CloseResult, ComponentFactoryService, ComponentFactoryServiceModule, ComponentType, ComponentWidgetType, Configuration$5 as Configuration, DIALOG_DISABLE_CLOSE, DataChangeKind, DefaultUiActionCode_CLOSE, ExpandableSectionButtonIconPosition, ExpandableSectionButtonType, ExpandableSectionComponent, FilterExpressionBoolOperator$1 as FilterExpressionBoolOperator, FilterExpressionBuilderGroup, FilterExpressionDataType, FilterExpressionFieldWidgetType, FilterExpressionOperation, FilterExpressionOrderBy, GridColumnContentType, GridDataAccessConfigKindEnum, GridSelectionMode, GridSelectionType, GridUiActionType, GridViewDescriptorKindEnum, IS_ASYNC_PARAM_NAME, IconPosition, ImageResourceKindEnum, LayoutDirection, LinkTargetEnum, MessageOptionType, MessageTextType, MessageType, SelectionDefinitionTypeEnum, SessionAPIS, SessionErrorBehaviour, SessionService, SharedModule, SimplifiedTabGroupComponent, SmartActionType, SmartAuthService, SmartComponent, SmartComponentApiClient, SmartComponentLayoutComponent, SmartComponentLayoutModule, SmartComponentLayoutUtility, SmartDatePipe, SmartDateTimePipe, SmartDialog, SmartExpandableSectionModule, SmartExpandableSectionService, SmartFileUploaderComponent, SmartFilterComponent, SmartFilterEditorContentComponent, SmartFilterEditorModule, SmartFilterEditorService, SmartFilterExpressionItemComponent, SmartFilterExpressionItemsComponent, SmartFilterModule, SmartFilterParamComponent, SmartFilterParamsComponent, SmartFilterPosition, SmartFilterType, SmartFormTextFieldButtonIconPosition, SmartFormWidgetDirection, SmartFormWidgetType, SmartFormWidgetWidth, SmartGridButtonType, SmartGridComponent, SmartGridDataLayout, SmartGridModule, SmartGridService, SmartGridType, SmartIconComponent, SmartIconModule, SmartIconService, SmartLayoutDef, SmartLinkChannelVariableInPath, SmartLinkUuidVariableInPath, SmartNavbarComponent, SmartNavbarModule, SmartNavbarService, SmartNavigationModule, SmartNavigationService, SmartNgClientModule, SmartNgClientService, SmartService, SmartSessionModule, SmartSessionService, SmartSessionTimerComponent, SmartSessionTimerService, SmartSubject, SmartTabGroupModule, SmartTabGroupService, SmartTable, SmartTableButtonType, SmartTableHeaderPropertyType, SmartTableInterfaceTypeEnum, SmartTableOptionButtonDirection, SmartTableOrder, SmartTableType, SmartTimePipe, SmartTooltipDirective, SmartTreeComponent, SmartTreeNodeButtonType, SmartUserSettinsIconPosition, SmartValidatorName, SmartViewContextErrorDialogButtonLabel, SmartViewContextErrorDialogMessage, SmartViewContextErrorDialogTitle, SmartViewContextModule, SmartViewContextService, SmartViewRedirect, SmartWidgetHintPosition, SmartWidgetHintPositionEnum, SmartWidgetSettings, SmartdialogModule, SmartdialogService, SmartfileuploaderComponent, SmartformComponent, SmartformLayoutDefinitionService, SmartformModule, SmartformwidgetComponent, SmarttableComponent, SmarttableModule, SmarttableService, SmarttreeGenericService, SmarttreeModule, SmarttreeService, TabGroupComponent, ToggleLabelPosition, UiActionButtonType, UiActionConfirmDialogComponent, UiActionConfirmDialogService, UiActionDescriptorService, UiActionDialogType, UiActionFeedbackType, UiActionInputDialogComponent, UiActionInputDialogService, UiActionInputType, UiActionService, UiActionToolbarComponent, UiActionTooltipTooltipPositionEnum, ViewEventHandlerViewEventTypeEnum, ViewService, ViewState, ViewType, WidgetMap };
+export { APIS$3 as APIS, ApiModule$3 as ApiModule, ApiQueueService, BASE_PATH$5 as BASE_PATH, COLLECTION_FORMATS$5 as COLLECTION_FORMATS, CloseResult, ComponentFactoryService, ComponentFactoryServiceModule, ComponentType, ComponentWidgetType, Configuration$5 as Configuration, DIALOG_DISABLE_CLOSE, DataChangeKind, DefaultUiActionCode_CLOSE, ExpandableSectionButtonIconPosition, ExpandableSectionButtonType, ExpandableSectionComponent, FilterExpressionBoolOperator$1 as FilterExpressionBoolOperator, FilterExpressionBuilderGroupBuilderGroupKindEnum, FilterExpressionDataType, FilterExpressionFieldWidgetType, FilterExpressionOperation, FilterExpressionOrderByOrderEnum, GridColumnContentType, GridDataAccessConfigKindEnum, GridSelectionMode, GridSelectionType, GridUiActionType, GridViewDescriptorKindEnum, IS_ASYNC_PARAM_NAME, IconPosition, ImageResourceKindEnum, LayoutDirection, LinkTargetEnum, MessageOptionType, MessageTextType, MessageType, SelectionDefinitionTypeEnum, SessionAPIS, SessionErrorBehaviour, SessionService, SharedModule, SimplifiedTabGroupComponent, SmartActionType, SmartAuthService, SmartComponent, SmartComponentApiClient, SmartComponentLayoutComponent, SmartComponentLayoutModule, SmartComponentLayoutUtility, SmartDatePipe, SmartDateTimePipe, SmartDialog, SmartExpandableSectionModule, SmartExpandableSectionService, SmartFileUploaderComponent, SmartFilterComponent, SmartFilterEditorContentComponent, SmartFilterEditorModule, SmartFilterEditorService, SmartFilterExpressionItemComponent, SmartFilterExpressionItemsComponent, SmartFilterModule, SmartFilterParamComponent, SmartFilterParamsComponent, SmartFilterPosition, SmartFilterType, SmartFormTextFieldButtonIconPosition, SmartFormWidgetDirection, SmartFormWidgetType, SmartFormWidgetWidth, SmartGridButtonType, SmartGridComponent, SmartGridDataLayout, SmartGridModule, SmartGridService, SmartGridType, SmartIconComponent, SmartIconModule, SmartIconService, SmartLayoutDef, SmartLinkChannelVariableInPath, SmartLinkUuidVariableInPath, SmartNavbarComponent, SmartNavbarModule, SmartNavbarService, SmartNavigationModule, SmartNavigationService, SmartNgClientModule, SmartNgClientService, SmartService, SmartSessionModule, SmartSessionService, SmartSessionTimerComponent, SmartSessionTimerService, SmartSubject, SmartTabGroupModule, SmartTabGroupService, SmartTable, SmartTableButtonType, SmartTableHeaderPropertyType, SmartTableInterfaceTypeEnum, SmartTableOptionButtonDirection, SmartTableOrder, SmartTableType, SmartTimePipe, SmartTooltipDirective, SmartTreeComponent, SmartTreeNodeButtonType, SmartUserSettinsIconPosition, SmartValidatorName, SmartViewContextErrorDialogButtonLabel, SmartViewContextErrorDialogMessage, SmartViewContextErrorDialogTitle, SmartViewContextModule, SmartViewContextService, SmartViewRedirect, SmartWidgetHintPosition, SmartWidgetHintPositionEnum, SmartWidgetSettings, SmartdialogModule, SmartdialogService, SmartfileuploaderComponent, SmartformComponent, SmartformLayoutDefinitionService, SmartformModule, SmartformwidgetComponent, SmarttableComponent, SmarttableModule, SmarttableService, SmarttreeGenericService, SmarttreeModule, SmarttreeService, TabGroupComponent, ToggleLabelPosition, UiActionButtonType, UiActionConfirmDialogComponent, UiActionConfirmDialogService, UiActionDescriptorService, UiActionDialogType, UiActionFeedbackType, UiActionInputDialogComponent, UiActionInputDialogService, UiActionInputType, UiActionService, UiActionToolbarComponent, UiActionTooltipTooltipPositionEnum, ViewEventHandlerViewEventTypeEnum, ViewService, ViewState, ViewType, WidgetMap };
 //# sourceMappingURL=smartbit4all-ng-client.mjs.map