@acorex/platform 18.0.8 → 18.0.10

package/fesm2022/acorex-platform-layouts.mjs

@@ -227,14 +227,14 @@ class AXPEntityCreateCustomViewComponent extends AXBasePageComponent {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityCreateCustomViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXPEntityCreateCustomViewComponent, selector: "ng-component", inputs: { loader: "loader", mode: "mode", selectedView: "selectedView" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityCreateCustomViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: AXPEntityCreateCustomViewComponent, selector: "ng-component", inputs: { loader: "loader", mode: "mode", selectedView: "selectedView" }, providers: [
             {
                 provide: AXUnsubscriber,
             },
-        ], usesInheritance: true, ngImport: i0, template: "<ax-header class=\"ax-p-4 ax-flex ax-justify-between ax-border-b\">\n  <div class=\"ax-flex ax-items-center\">\n    @if (showNameInput() && mode==='create') {\n    <div class=\"ax-w-60\">\n      <ax-text-box class=\"ax-sm\" [(ngModel)]=\"selectedView.title\">\n        @if(showNameInput()){\n        <ax-suffix>\n          <ax-button (onClick)=\"changeViewNameToggle()\" look=\"default\">\n            <ax-icon class=\"fa-sodild fas fa-check ax-text-sm\"> </ax-icon>\n          </ax-button>\n        </ax-suffix>\n        }\n      </ax-text-box>\n    </div>\n    }@else {\n    <span class=\"ax-text-lg ax-font-semibold\">{{ selectedView.title }}</span>\n    } @if (mode===\"create\") {\n    <ax-button class=\"ax-xs\" (onClick)=\"changeViewNameToggle()\" color=\"default\">\n      @if(!showNameInput() ){\n      <ax-icon class=\"fa-regular fa-pen ax-text-sm ax-text-neutral-600\"> </ax-icon>\n      }\n    </ax-button>\n    }\n  </div>\n  <ax-close-button></ax-close-button>\n</ax-header>\n<div class=\"ax-p-4\">\n  <ax-tabs [content]=\"contents\" look=\"with-line\">\n    <ax-tab-item [text]=\"('entity.columns' | translate | async) ?? 'Columns'\">\n      <ax-suffix>\n        <ax-badge [text]=\"visibleColumns().length.toString()\" color=\"primary\"> </ax-badge>\n      </ax-suffix>\n      <ax-content>\n        <div class=\"ax-flex ax-flex-col ax-gap-4 ax-p-4 ax-select-none ax-h-[400px]\" cdkDropList (cdkDropListDropped)=\"drop('columns', $event)\">\n          <div class=\"ax-flex ax-flex-col ax-gap-3 ax-w-full ax-sorted-list ax-overflow-auto ax-pe-2\">\n            <ng-container *ngFor=\"let item of columns()\">\n              <div class=\"ax-flex ax-py-1 ax-items-center ax-justify-between\" cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n                <div class=\"ax-flex ax-items-center ax-gap-3\" cdkDragHandle>\n                  <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\"></ax-icon>\n                  <p class=\"ax-font-medium ax-text-sm\">{{ item.title }}</p>\n                </div>\n                <ax-switch class=\"ax-sm\" [(ngModel)]=\"item.visible\" (onValueChanged)=\"updateColumnItem($event, item.name)\"></ax-switch>\n              </div>\n            </ng-container>\n          </div>\n        </div>\n      </ax-content>\n    </ax-tab-item>\n    <ax-tab-item text=\"Conditions\">\n      <ax-suffix>\n        <ax-badge [text]=\"conditions().length.toString()\" color=\"primary\"> </ax-badge>\n      </ax-suffix>\n      <ax-content>\n        <div\n          class=\"ax-flex ax-flex-col ax-justify-start ax-gap-4 ax-py-4 ax-select-none ax-h-[400px]\"\n          [class.ax-justify-center]=\"!conditions().length\"\n        >\n          @if(!conditions().length){\n          <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center\">\n            <ax-image src=\"assets/documents.svg\"></ax-image>\n            <p class=\"ax-mt-6 ax-mb-1 ax-font-bold\">No Filters Selected</p>\n            <span class=\"ax-text-neutral-400 ax-text-sm md:ax-text-md\">Please select field(s) that you want to filter</span>\n          </div>\n          } @else {\n          <div class=\"ax-sorted-list ax-px-4 ax-py-1 ax-overflow-auto\">\n            <div cdkDropList (cdkDropListDropped)=\"drop('conditions', $event)\" class=\"ax-flex ax-flex-col ax-gap-2\">\n              @for(item of conditions(); track item.name ){\n              <div cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n                <div class=\"ax-ms-4 ax-flex ax-items-start ax-gap-2\">\n                  <ax-label>{{ loader.getProp(item.name)?.title }}</ax-label>\n                  @if(getOperatorTitle(item.name,item.operator)){\n                  <ax-badge class=\"ax-text-xs\" color=\"primary\" [look]=\"'twotone'\" [text]=\"getOperatorTitle(item.name, item.operator)\"></ax-badge>\n                  }\n                </div>\n                <div class=\"ax-flex ax-group ax-items-center ax-gap-2\">\n                  <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\" cdkDragHandle></ax-icon>\n                  <div class=\"ax-w-full\">\n                    <axp-widget-filter-renderer\n                      [schema]=\"getSchema(item.name)\"\n                      [prop]=\"loader.getProp(item.name)\"\n                      [(value)]=\"item.value\"\n                      [(operator)]=\"item.operator\"\n                    >\n                    </axp-widget-filter-renderer>\n                  </div>\n                  <ax-button look=\"blank\" color=\"danger\" class=\"ax-sm\" (onClick)=\"removeCondition(item)\">\n                    <ax-icon class=\"fa-solid fa-trash-can\"></ax-icon>\n                  </ax-button>\n                </div>\n              </div>\n              }\n            </div>\n          </div>\n          }\n          <div class=\"ax-flex ax-gap-2\">\n            <div class=\"ax-w-full\" #addField>\n              @if(conditions().length){\n              <ax-button color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"blank\" class=\"ax-sm\"></ax-button>\n              }@else {\n              <div class=\"ax-flex ax-justify-center ax-w-full\">\n                <ax-button color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"outline\" class=\"ax-md ax-w-56\"></ax-button>\n              </div>\n              }\n              <ax-popover\n                #conditionsPopover\n                [target]=\"addField\"\n                [placement]=\"conditions().length ? 'bottom-start' : 'bottom'\"\n                [offsetY]=\"8\"\n                [openOn]=\"'toggle'\"\n                [closeOn]=\"'clickOut'\"\n                [adaptivityEnabled]=\"true\"\n                (onOpened)=\"resetSelectedFieldNames()\"\n              >\n                <div class=\"ax-bg-surface ax-border ax-border-default ax-rounded-md ax-shadow-md ax-w-full ax-min-w-[250px]\">\n                  <div class=\"ax-border-b-[1px] ax-pb-2 ax-mb-2 ax-p-3\">\n                    <ax-title class=\"ax-font-bold\">Fields</ax-title>\n                  </div>\n                  <div class=\"ax-max-h-48 ax-overflow-auto\">\n                    <ax-selection-list\n                      [valueField]=\"'name'\"\n                      [textField]=\"'title'\"\n                      [(ngModel)]=\"selectedConditionNames\"\n                      [direction]=\"'vertical'\"\n                      [items]=\"props()\"\n                      [multiple]=\"true\"\n                    ></ax-selection-list>\n                  </div>\n                  <div class=\"ax-flex ax-justify-end ax-border-t-[1px] ax-p-3\">\n                    <ax-button (onClick)=\"addCondition(); conditionsPopover.close()\" class=\"ax-sm\" text=\"Confirm\" color=\"primary\"> </ax-button>\n                  </div>\n                </div>\n              </ax-popover>\n            </div>\n          </div>\n        </div>\n      </ax-content>\n    </ax-tab-item>\n    <ax-tab-item text=\"Sorting\">\n      <ax-suffix>\n        <ax-badge [text]=\"sorts().length.toString()\" color=\"primary\"> </ax-badge>\n      </ax-suffix>\n      <ax-content>\n        <div\n          class=\"ax-flex ax-p-4 ax-flex-col ax-justify-start ax-gap-4 ax-select-none ax-overflow-auto ax-h-[400px]\"\n          [class.ax-justify-center]=\"!sorts().length\"\n        >\n          @if(!sorts().length){\n          <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center\">\n            <ax-image src=\"assets/documents.svg\"></ax-image>\n            <p class=\"ax-mt-6 ax-mb-1 ax-font-bold\">{{ 'entity.no-sort' | translate | async }}</p>\n            <span class=\"ax-text-neutral-400 ax-text-sm md:ax-text-md\">{{ 'entity.ask-sort' | translate | async }}</span>\n          </div>\n          }@else {\n          <div\n            cdkDropList\n            (cdkDropListDropped)=\"drop('sorts', $event)\"\n            class=\"ax-flex ax-flex-col ax-gap-3 ax-w-full ax-sorted-list ax-py-1 ax-overflow-auto\"\n          >\n            <ng-container *ngFor=\"let item of sorts()\">\n              <div class=\"ax-flex ax-gap-2 ax-items-center\" cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n                <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\" cdkDragHandle></ax-icon>\n                <ax-select-box [dataSource]=\"props()\" valueField=\"name\" textField=\"title\" [(ngModel)]=\"item.name\"> </ax-select-box>\n                <ax-button [color]=\"'default'\" class=\"ax-sm\" (click)=\"updateSortItem(item)\">\n                  <ax-icon [class.ax-text-primary]=\"item.dir == 'asc'\" class=\"fa-solid fa-arrow-up-long ax-text-neutral-400\"></ax-icon>\n                  <ax-icon [class.ax-text-primary]=\"item.dir == 'desc'\" class=\"fa-solid fa-arrow-down-long ax-text-neutral-400\"></ax-icon>\n                </ax-button>\n\n                <ax-button look=\"blank\" (onClick)=\"removeSortItem(item)\">\n                  <ax-icon class=\"fa-solid fa-trash-can ax-text-danger-500\"></ax-icon>\n                </ax-button>\n              </div>\n            </ng-container>\n          </div>\n          }\n\n          <div class=\"ax-flex ax-gap-2\">\n            <div class=\"ax-w-full\" #addField>\n              @if(sorts().length){\n              <ax-button\n                (onClick)=\"addSortItem()\"\n                color=\"primary\"\n                [text]=\"'entity.add-field' | translate | async\"\n                look=\"blank\"\n                class=\"ax-sm\"\n              ></ax-button>\n              }@else {\n              <div class=\"ax-flex ax-justify-center ax-w-full\">\n                <ax-button\n                  (onClick)=\"addSortItem()\"\n                  color=\"primary\"\n                  [text]=\"'entity.add-field' | translate | async\"\n                  look=\"outline\"\n                  class=\"ax-md ax-w-56\"\n                ></ax-button>\n              </div>\n              }\n            </div>\n          </div>\n        </div>\n      </ax-content>\n    </ax-tab-item>\n  </ax-tabs>\n  <ng-template [axTabContent] #contents=\"axTabContent\"> </ng-template>\n</div>\n<ax-footer class=\"!ax-justify-end\">\n  @if (mode===\"edit\") {\n  <ax-dropdown-button [text]=\"'discard' | translate | async\" (onClick)=\"handleDiscardClick()\">\n    <ax-button-item-list>\n      <ax-button-item [text]=\"('reset' | translate | async) ?? ' '\" (onClick)=\"handleResetClick()\">\n        <ax-prefix>\n          <ax-icon icon=\"fa-solid fa-rotate-left fa-flip-horizontal\"></ax-icon>\n        </ax-prefix>\n      </ax-button-item>\n      <ax-button-item class=\"ax-text-danger\" text=\"Delete\" (onClick)=\"handleDeleteClick()\">\n        <ax-prefix> <ax-icon icon=\"fas fa-trash fa-flip-horizontal\"></ax-icon> </ax-prefix\n      ></ax-button-item>\n    </ax-button-item-list>\n  </ax-dropdown-button>\n  } @else {\n  <ax-button [text]=\"'cancel' | translate | async\" look=\"outline\" (onClick)=\"handleCancelClick()\"></ax-button>\n  }\n  <ax-button [text]=\"mode === 'create' ? ('save' | translate | async) : ('save-changes' | translate | async)\" color=\"primary\" (onClick)=\"handleApplyClick()\"></ax-button>\n</ax-footer>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i4.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i4.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i5.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "component", type: i6.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i7.AXImageComponent, selector: "ax-image", inputs: ["overlayMode", "src", "alt", "priority", "lazy"], outputs: ["onLoad", "onError"] }, { kind: "component", type: i8.AXSwitchComponent, selector: "ax-switch", inputs: ["disabled", "readonly", "color", "tabIndex", "value", "name", "isLoading"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "component", type: i9.AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged"] }, { kind: "component", type: i9.AXTabItemComponent, selector: "ax-tab-item", inputs: ["disabled", "text", "key", "headerTemplate", "active"], outputs: ["disabledChange", "onClick", "onBlur", "onFocus", "activeChange"] }, { kind: "directive", type: i9.AXTabContentDirective, selector: "[axTabContent]", inputs: ["axTabContent"], exportAs: ["axTabContent"] }, { kind: "component", type: i10.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "textTemplate", "dataSource", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "component", type: i11.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "mask-options", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: i7$1.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "component", type: i13.AXSelectionListComponent, selector: "ax-selection-list", inputs: ["id", "name", "disabled", "readonly", "tabIndex", "size", "value", "valueField", "textField", "hintField", "disabledField", "readonlyField", "multiple", "direction", "customTemplate", "showControl", "items", "look"], outputs: ["onValueChanged", "onBlur", "onFocus"] }, { kind: "component", type: i14.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "directive", type: i15.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i15.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i15.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i10$1.AXPWidgetFilterRendererComponent, selector: "axp-widget-filter-renderer", inputs: ["value", "operator", "prop", "schema"], outputs: ["valueChange", "operatorChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i8$1.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesInheritance: true, ngImport: i0, template: "<ax-header class=\"ax-p-4 ax-flex ax-justify-between ax-border-b\">\n  <div class=\"ax-flex ax-items-center\">\n    @if (showNameInput() && mode==='create') {\n    <div class=\"ax-w-60\">\n      <ax-text-box class=\"ax-sm\" [(ngModel)]=\"selectedView.title\">\n        @if(showNameInput()){\n        <ax-suffix>\n          <ax-button (onClick)=\"changeViewNameToggle()\" look=\"default\">\n            <ax-icon class=\"fa-sodild fas fa-check ax-text-sm\"> </ax-icon>\n          </ax-button>\n        </ax-suffix>\n        }\n      </ax-text-box>\n    </div>\n    }@else {\n    <span class=\"ax-text-lg ax-font-semibold\">{{ selectedView.title }}</span>\n    } @if (mode===\"create\") {\n    <ax-button class=\"ax-xs\" (onClick)=\"changeViewNameToggle()\" color=\"default\">\n      @if(!showNameInput() ){\n      <ax-icon class=\"fa-regular fa-pen ax-text-sm ax-text-neutral-600\"> </ax-icon>\n      }\n    </ax-button>\n    }\n  </div>\n  <ax-close-button></ax-close-button>\n</ax-header>\n<div class=\"ax-p-4\">\n  <ax-tabs [content]=\"contents\" look=\"with-line\">\n    <ax-tab-item [text]=\"('entity.columns' | translate | async) ?? 'Columns'\">\n      <ax-suffix>\n        <ax-badge [text]=\"visibleColumns().length.toString()\" color=\"primary\"> </ax-badge>\n      </ax-suffix>\n      <ax-content>\n        <div class=\"ax-flex ax-flex-col ax-gap-4 ax-p-4 ax-select-none ax-h-[400px]\" cdkDropList (cdkDropListDropped)=\"drop('columns', $event)\">\n          <div class=\"ax-flex ax-flex-col ax-gap-3 ax-w-full ax-sorted-list ax-overflow-auto ax-pe-2\">\n            <ng-container *ngFor=\"let item of columns()\">\n              <div class=\"ax-flex ax-py-1 ax-items-center ax-justify-between\" cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n                <div class=\"ax-flex ax-items-center ax-gap-3\" cdkDragHandle>\n                  <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\"></ax-icon>\n                  <p class=\"ax-font-medium ax-text-sm\">{{ item.title }}</p>\n                </div>\n                <ax-switch class=\"ax-sm\" [(ngModel)]=\"item.visible\" (onValueChanged)=\"updateColumnItem($event, item.name)\"></ax-switch>\n              </div>\n            </ng-container>\n          </div>\n        </div>\n      </ax-content>\n    </ax-tab-item>\n    <ax-tab-item text=\"Conditions\">\n      <ax-suffix>\n        <ax-badge [text]=\"conditions().length.toString()\" color=\"primary\"> </ax-badge>\n      </ax-suffix>\n      <ax-content>\n        <div\n          class=\"ax-flex ax-flex-col ax-justify-start ax-gap-4 ax-py-4 ax-select-none ax-h-[400px]\"\n          [class.ax-justify-center]=\"!conditions().length\"\n        >\n          @if(!conditions().length){\n          <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center\">\n            <ax-image src=\"assets/documents.svg\"></ax-image>\n            <p class=\"ax-mt-6 ax-mb-1 ax-font-bold\">No Filters Selected</p>\n            <span class=\"ax-text-neutral-400 ax-text-sm md:ax-text-md\">Please select field(s) that you want to filter</span>\n          </div>\n          } @else {\n          <div class=\"ax-sorted-list ax-px-4 ax-py-1 ax-overflow-auto\">\n            <div cdkDropList (cdkDropListDropped)=\"drop('conditions', $event)\" class=\"ax-flex ax-flex-col ax-gap-2\">\n              @for(item of conditions(); track item.name ){\n              <div cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n                <div class=\"ax-ms-4 ax-flex ax-items-start ax-gap-2\">\n                  <ax-label>{{ loader.getProp(item.name)?.title }}</ax-label>\n                  @if(getOperatorTitle(item.name,item.operator)){\n                  <ax-badge class=\"ax-text-xs\" color=\"primary\" [look]=\"'twotone'\" [text]=\"getOperatorTitle(item.name, item.operator)\"></ax-badge>\n                  }\n                </div>\n                <div class=\"ax-flex ax-group ax-items-center ax-gap-2\">\n                  <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\" cdkDragHandle></ax-icon>\n                  <div class=\"ax-w-full\">\n                    <axp-widget-filter-renderer\n                      [schema]=\"getSchema(item.name)\"\n                      [prop]=\"loader.getProp(item.name)\"\n                      [(value)]=\"item.value\"\n                      [(operator)]=\"item.operator\"\n                    >\n                    </axp-widget-filter-renderer>\n                  </div>\n                  <ax-button look=\"blank\" color=\"danger\" class=\"ax-sm\" (onClick)=\"removeCondition(item)\">\n                    <ax-icon class=\"fa-solid fa-trash-can\"></ax-icon>\n                  </ax-button>\n                </div>\n              </div>\n              }\n            </div>\n          </div>\n          }\n          <div class=\"ax-flex ax-gap-2\">\n            <div class=\"ax-w-full\" #addField>\n              @if(conditions().length){\n              <ax-button color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"blank\" class=\"ax-sm\"></ax-button>\n              }@else {\n              <div class=\"ax-flex ax-justify-center ax-w-full\">\n                <ax-button color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"outline\" class=\"ax-md ax-w-56\"></ax-button>\n              </div>\n              }\n              <ax-popover\n                #conditionsPopover\n                [target]=\"addField\"\n                [placement]=\"conditions().length ? 'bottom-start' : 'bottom'\"\n                [offsetY]=\"8\"\n                [openOn]=\"'toggle'\"\n                [closeOn]=\"'clickOut'\"\n                [adaptivityEnabled]=\"true\"\n                (onOpened)=\"resetSelectedFieldNames()\"\n              >\n                <div class=\"ax-bg-surface ax-border ax-border-default ax-rounded-md ax-shadow-md ax-w-full ax-min-w-[250px]\">\n                  <div class=\"ax-border-b-[1px] ax-pb-2 ax-mb-2 ax-p-3\">\n                    <ax-title class=\"ax-font-bold\">Fields</ax-title>\n                  </div>\n                  <div class=\"ax-max-h-48 ax-overflow-auto\">\n                    <ax-selection-list\n                      [valueField]=\"'name'\"\n                      [textField]=\"'title'\"\n                      [(ngModel)]=\"selectedConditionNames\"\n                      [direction]=\"'vertical'\"\n                      [items]=\"props()\"\n                      [multiple]=\"true\"\n                    ></ax-selection-list>\n                  </div>\n                  <div class=\"ax-flex ax-justify-end ax-border-t-[1px] ax-p-3\">\n                    <ax-button (onClick)=\"addCondition(); conditionsPopover.close()\" class=\"ax-sm\" text=\"Confirm\" color=\"primary\"> </ax-button>\n                  </div>\n                </div>\n              </ax-popover>\n            </div>\n          </div>\n        </div>\n      </ax-content>\n    </ax-tab-item>\n    <ax-tab-item text=\"Sorting\">\n      <ax-suffix>\n        <ax-badge [text]=\"sorts().length.toString()\" color=\"primary\"> </ax-badge>\n      </ax-suffix>\n      <ax-content>\n        <div\n          class=\"ax-flex ax-p-4 ax-flex-col ax-justify-start ax-gap-4 ax-select-none ax-overflow-auto ax-h-[400px]\"\n          [class.ax-justify-center]=\"!sorts().length\"\n        >\n          @if(!sorts().length){\n          <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center\">\n            <ax-image src=\"assets/documents.svg\"></ax-image>\n            <p class=\"ax-mt-6 ax-mb-1 ax-font-bold\">{{ 'entity.no-sort' | translate | async }}</p>\n            <span class=\"ax-text-neutral-400 ax-text-sm md:ax-text-md\">{{ 'entity.ask-sort' | translate | async }}</span>\n          </div>\n          }@else {\n          <div\n            cdkDropList\n            (cdkDropListDropped)=\"drop('sorts', $event)\"\n            class=\"ax-flex ax-flex-col ax-gap-3 ax-w-full ax-sorted-list ax-py-1 ax-overflow-auto\"\n          >\n            <ng-container *ngFor=\"let item of sorts()\">\n              <div class=\"ax-flex ax-gap-2 ax-items-center\" cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n                <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\" cdkDragHandle></ax-icon>\n                <ax-select-box [dataSource]=\"props()\" valueField=\"name\" textField=\"title\" [(ngModel)]=\"item.name\"> </ax-select-box>\n                <ax-button [color]=\"'default'\" class=\"ax-sm\" (click)=\"updateSortItem(item)\">\n                  <ax-icon [class.ax-text-primary]=\"item.dir == 'asc'\" class=\"fa-solid fa-arrow-up-long ax-text-neutral-400\"></ax-icon>\n                  <ax-icon [class.ax-text-primary]=\"item.dir == 'desc'\" class=\"fa-solid fa-arrow-down-long ax-text-neutral-400\"></ax-icon>\n                </ax-button>\n\n                <ax-button look=\"blank\" (onClick)=\"removeSortItem(item)\">\n                  <ax-icon class=\"fa-solid fa-trash-can ax-text-danger-500\"></ax-icon>\n                </ax-button>\n              </div>\n            </ng-container>\n          </div>\n          }\n\n          <div class=\"ax-flex ax-gap-2\">\n            <div class=\"ax-w-full\" #addField>\n              @if(sorts().length){\n              <ax-button\n                (onClick)=\"addSortItem()\"\n                color=\"primary\"\n                [text]=\"'entity.add-field' | translate | async\"\n                look=\"blank\"\n                class=\"ax-sm\"\n              ></ax-button>\n              }@else {\n              <div class=\"ax-flex ax-justify-center ax-w-full\">\n                <ax-button\n                  (onClick)=\"addSortItem()\"\n                  color=\"primary\"\n                  [text]=\"'entity.add-field' | translate | async\"\n                  look=\"outline\"\n                  class=\"ax-md ax-w-56\"\n                ></ax-button>\n              </div>\n              }\n            </div>\n          </div>\n        </div>\n      </ax-content>\n    </ax-tab-item>\n  </ax-tabs>\n  <ng-template [axTabContent] #contents=\"axTabContent\"> </ng-template>\n</div>\n<ax-footer class=\"!ax-justify-end\">\n  @if (mode===\"edit\") {\n  <ax-dropdown-button [text]=\"'discard' | translate | async\" (onClick)=\"handleDiscardClick()\">\n    <ax-button-item-list>\n      <ax-button-item [text]=\"('reset' | translate | async) ?? ' '\" (onClick)=\"handleResetClick()\">\n        <ax-prefix>\n          <ax-icon icon=\"fa-solid fa-rotate-left fa-flip-horizontal\"></ax-icon>\n        </ax-prefix>\n      </ax-button-item>\n      <ax-button-item class=\"ax-text-danger\" text=\"Delete\" (onClick)=\"handleDeleteClick()\">\n        <ax-prefix> <ax-icon icon=\"fas fa-trash fa-flip-horizontal\"></ax-icon> </ax-prefix\n      ></ax-button-item>\n    </ax-button-item-list>\n  </ax-dropdown-button>\n  } @else {\n  <ax-button [text]=\"'cancel' | translate | async\" look=\"outline\" (onClick)=\"handleCancelClick()\"></ax-button>\n  }\n  <ax-button [text]=\"mode === 'create' ? ('save' | translate | async) : ('save-changes' | translate | async)\" color=\"primary\" (onClick)=\"handleApplyClick()\"></ax-button>\n</ax-footer>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "responsiveOn", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "responsiveOnChange", "loadingTextChange"] }, { kind: "component", type: i4.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i4.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i5.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "component", type: i6.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i7.AXImageComponent, selector: "ax-image", inputs: ["overlayMode", "src", "alt", "priority", "lazy"], outputs: ["onLoad", "onError"] }, { kind: "component", type: i8.AXSwitchComponent, selector: "ax-switch", inputs: ["disabled", "readonly", "color", "tabIndex", "value", "name", "isLoading"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "component", type: i9.AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged"] }, { kind: "component", type: i9.AXTabItemComponent, selector: "ax-tab-item", inputs: ["disabled", "text", "key", "headerTemplate", "active"], outputs: ["disabledChange", "onClick", "onBlur", "onFocus", "activeChange"] }, { kind: "directive", type: i9.AXTabContentDirective, selector: "[axTabContent]", inputs: ["axTabContent"], exportAs: ["axTabContent"] }, { kind: "component", type: i10.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "textTemplate", "dataSource", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "component", type: i11.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "mask-options", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: i7$1.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "component", type: i13.AXSelectionListComponent, selector: "ax-selection-list", inputs: ["id", "name", "disabled", "readonly", "tabIndex", "size", "value", "valueField", "textField", "hintField", "disabledField", "readonlyField", "multiple", "direction", "customTemplate", "showControl", "items", "look"], outputs: ["onValueChanged", "onBlur", "onFocus"] }, { kind: "component", type: i14.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "directive", type: i15.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i15.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i15.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i10$1.AXPWidgetFilterRendererComponent, selector: "axp-widget-filter-renderer", inputs: ["value", "operator", "prop", "schema"], outputs: ["valueChange", "operatorChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i8$1.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityCreateCustomViewComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityCreateCustomViewComponent, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
@@ -281,10 +281,10 @@ class AXPListViewOptionsColumnsComponent {
         });
         this.onClosed.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewOptionsColumnsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: AXPListViewOptionsColumnsComponent, selector: "axp-list-view-option-columns", inputs: { loader: "loader" }, outputs: { onClosed: "onClosed" }, ngImport: i0, template: "<ax-header class=\"ax-flex ax-items-center\">\n  <h2 class=\"ax-text-xl ax-font-bold\">{{ 'entity.columns' | translate | async }}</h2>\n  <ax-button (onClick)=\"handleClose()\" [look]=\"'blank'\">\n    <ax-icon class=\"fa-solid fa-close ax-text-neutral-400 ax-text-xl\"> </ax-icon>\n  </ax-button>\n</ax-header>\n<div class=\"ax-flex ax-flex-col ax-gap-4 ax-p-4 ax-select-none\" cdkDropList (cdkDropListDropped)=\"drop($event)\">\n  <div class=\"ax-flex ax-flex-col ax-gap-3 ax-w-full ax-sorted-list ax-max-h-[calc(100vh-280px)] ax-overflow-auto\">\n    <ng-container *ngFor=\"let item of columns$ | async\">\n      <div class=\"ax-flex ax-py-1 ax-items-center ax-justify-between\" cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n        <div class=\"ax-flex ax-items-center ax-gap-3\" cdkDragHandle>\n          <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\"></ax-icon>\n          <p class=\"ax-font-medium ax-text-sm\">{{ item.title }}</p>\n        </div>\n        <ax-switch class=\"ax-sm\" [ngModel]=\"item.visible\" (onValueChanged)=\"handleVisibilityChange($event, item.name)\"></ax-switch>\n      </div>\n    </ng-container>\n  </div>\n</div>\n<ax-footer class=\"!ax-justify-start ax-absolute ax-bottom-0 ax-w-full\">\n  <ax-button [text]=\"'apply' | translate | async\" color=\"primary\" (onClick)=\"handleApplyClick()\"></ax-button>\n  <ax-button [text]=\"'reset' | translate | async\" color=\"ghost\" (onClick)=\"handleResetClick()\"></ax-button>\n</ax-footer>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i8.AXSwitchComponent, selector: "ax-switch", inputs: ["disabled", "readonly", "color", "tabIndex", "value", "name", "isLoading"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "directive", type: i15.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i15.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i15.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i8$1.AXTranslatorPipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewOptionsColumnsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: AXPListViewOptionsColumnsComponent, selector: "axp-list-view-option-columns", inputs: { loader: "loader" }, outputs: { onClosed: "onClosed" }, ngImport: i0, template: "<ax-header class=\"ax-flex ax-items-center\">\n  <h2 class=\"ax-text-xl ax-font-bold\">{{ 'entity.columns' | translate | async }}</h2>\n  <ax-button (onClick)=\"handleClose()\" [look]=\"'blank'\">\n    <ax-icon class=\"fa-solid fa-close ax-text-neutral-400 ax-text-xl\"> </ax-icon>\n  </ax-button>\n</ax-header>\n<div class=\"ax-flex ax-flex-col ax-gap-4 ax-p-4 ax-select-none\" cdkDropList (cdkDropListDropped)=\"drop($event)\">\n  <div class=\"ax-flex ax-flex-col ax-gap-3 ax-w-full ax-sorted-list ax-max-h-[calc(100vh-280px)] ax-overflow-auto\">\n    <ng-container *ngFor=\"let item of columns$ | async\">\n      <div class=\"ax-flex ax-py-1 ax-items-center ax-justify-between\" cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n        <div class=\"ax-flex ax-items-center ax-gap-3\" cdkDragHandle>\n          <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\"></ax-icon>\n          <p class=\"ax-font-medium ax-text-sm\">{{ item.title }}</p>\n        </div>\n        <ax-switch class=\"ax-sm\" [ngModel]=\"item.visible\" (onValueChanged)=\"handleVisibilityChange($event, item.name)\"></ax-switch>\n      </div>\n    </ng-container>\n  </div>\n</div>\n<ax-footer class=\"!ax-justify-start ax-absolute ax-bottom-0 ax-w-full\">\n  <ax-button [text]=\"'apply' | translate | async\" color=\"primary\" (onClick)=\"handleApplyClick()\"></ax-button>\n  <ax-button [text]=\"'reset' | translate | async\" color=\"ghost\" (onClick)=\"handleResetClick()\"></ax-button>\n</ax-footer>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "responsiveOn", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "responsiveOnChange", "loadingTextChange"] }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i8.AXSwitchComponent, selector: "ax-switch", inputs: ["disabled", "readonly", "color", "tabIndex", "value", "name", "isLoading"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "directive", type: i15.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i15.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i15.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i8$1.AXTranslatorPipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewOptionsColumnsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewOptionsColumnsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'axp-list-view-option-columns', template: "<ax-header class=\"ax-flex ax-items-center\">\n  <h2 class=\"ax-text-xl ax-font-bold\">{{ 'entity.columns' | translate | async }}</h2>\n  <ax-button (onClick)=\"handleClose()\" [look]=\"'blank'\">\n    <ax-icon class=\"fa-solid fa-close ax-text-neutral-400 ax-text-xl\"> </ax-icon>\n  </ax-button>\n</ax-header>\n<div class=\"ax-flex ax-flex-col ax-gap-4 ax-p-4 ax-select-none\" cdkDropList (cdkDropListDropped)=\"drop($event)\">\n  <div class=\"ax-flex ax-flex-col ax-gap-3 ax-w-full ax-sorted-list ax-max-h-[calc(100vh-280px)] ax-overflow-auto\">\n    <ng-container *ngFor=\"let item of columns$ | async\">\n      <div class=\"ax-flex ax-py-1 ax-items-center ax-justify-between\" cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n        <div class=\"ax-flex ax-items-center ax-gap-3\" cdkDragHandle>\n          <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\"></ax-icon>\n          <p class=\"ax-font-medium ax-text-sm\">{{ item.title }}</p>\n        </div>\n        <ax-switch class=\"ax-sm\" [ngModel]=\"item.visible\" (onValueChanged)=\"handleVisibilityChange($event, item.name)\"></ax-switch>\n      </div>\n    </ng-container>\n  </div>\n</div>\n<ax-footer class=\"!ax-justify-start ax-absolute ax-bottom-0 ax-w-full\">\n  <ax-button [text]=\"'apply' | translate | async\" color=\"primary\" (onClick)=\"handleApplyClick()\"></ax-button>\n  <ax-button [text]=\"'reset' | translate | async\" color=\"ghost\" (onClick)=\"handleResetClick()\"></ax-button>\n</ax-footer>\n" }]
         }], propDecorators: { loader: [{
@@ -369,10 +369,10 @@ class AXPListViewOptionConditionsComponent {
         });
         this.onClosed.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewOptionConditionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXPListViewOptionConditionsComponent, selector: "axp-list-view-option-conditions", inputs: { loader: "loader" }, outputs: { onClosed: "onClosed" }, ngImport: i0, template: "<ax-header class=\"ax-flex ax-items-center\">\n  <h2 class=\"ax-text-xl ax-font-bold\">Filters</h2>\n  <ax-button (onClick)=\"handleClose()\" [look]=\"'blank'\">\n    <ax-icon class=\"fa-solid fa-close ax-text-neutral-400 ax-text-xl\"> </ax-icon>\n  </ax-button>\n</ax-header>\n<div\n  class=\"ax-flex ax-flex-col ax-justify-center ax-gap-4 ax-py-4 ax-select-none\"\n  [class.ax-h-[calc(100vh-310px)]]=\"!(conditions$ | async)?.length\"\n>\n  @if(!(conditions$ | async)?.length){\n  <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center\">\n    <ax-image src=\"assets/documents.svg\"></ax-image>\n    <p class=\"ax-mt-6 ax-mb-1 ax-font-bold\">No Filters Selected</p>\n    <span class=\"ax-text-neutral-400 ax-text-sm md:ax-text-md\">Please select field(s) that you want to filter</span>\n  </div>\n  } @else {\n  <div class=\"ax-sorted-list ax-max-h-[calc(100vh-310px)] ax-px-4 ax-py-1 ax-overflow-auto\">\n    <div cdkDropList (cdkDropListDropped)=\"drop($event)\" class=\"ax-flex ax-flex-col ax-gap-2\">\n      @for(item of conditions$ | async; track item.name ){\n      <div cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n        <div class=\"ax-ms-4 ax-flex ax-items-start ax-gap-2\">\n          <ax-label>{{ loader.getProp(item.name)?.title }}</ax-label>\n          @if(getOperatorTitle(item.name,item.operator)){\n          <ax-badge\n            class=\"ax-text-xs\"\n            color=\"primary\"\n            [look]=\"'twotone'\"\n            [text]=\"getOperatorTitle(item.name, item.operator)\"\n          ></ax-badge>\n          }\n        </div>\n        <div class=\"ax-flex ax-group ax-items-center ax-gap-2\">\n          <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\" cdkDragHandle></ax-icon>\n          <div class=\"ax-w-full\">\n            <!-- <ax-text-box [(ngModel)]=\"item.value\"></ax-text-box> -->\n            <axp-widget-filter-renderer\n              [schema]=\"getSchema(item.name)\"\n              [prop]=\"loader.getProp(item.name)\"\n              [(value)]=\"item.value\"\n              [(operator)]=\"item.operator\"\n            >\n            </axp-widget-filter-renderer>\n          </div>\n          <ax-button look=\"blank\" color=\"danger\" class=\"ax-sm\" (onClick)=\"handleRemoveCondition(item)\">\n            <ax-icon class=\"fa-solid fa-trash-can\"></ax-icon>\n          </ax-button>\n        </div>\n      </div>\n      }\n    </div>\n  </div>\n  }\n  <div class=\"ax-flex ax-gap-2\">\n    <div class=\"ax-w-full\" #addField>\n      @if((conditions$ | async)?.length){\n      <ax-button color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"blank\" class=\"ax-sm\"></ax-button>\n      }@else {\n      <div class=\"ax-flex ax-justify-center ax-w-full\">\n        <ax-button color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"outline\" class=\"ax-md ax-w-56\"></ax-button>\n      </div>\n      }\n    </div>\n    <ax-popover\n      #fieldsPopover\n      [target]=\"addField\"\n      [openOn]=\"'toggle'\"\n      [closeOn]=\"'clickOut'\"\n      [adaptivityEnabled]=\"true\"\n      (onOpened)=\"resetSelectedFieldNames()\"\n      [offsetX]=\"15\"\n    >\n      <div class=\"ax-bg-surface ax-border ax-border-default ax-rounded-md ax-shadow-md ax-w-full ax-min-w-[250px]\">\n        <div class=\"ax-border-b-[1px] ax-pb-2 ax-mb-2 ax-p-3\">\n          <ax-title class=\"ax-font-bold\">Fields</ax-title>\n        </div>\n        <div class=\"ax-max-h-72 2xl:ax-max-h-80 ax-overflow-auto\">\n          <ax-selection-list\n            [valueField]=\"'name'\"\n            [textField]=\"'title'\"\n            [(ngModel)]=\"selectedFieldNames\"\n            [direction]=\"'vertical'\"\n            [items]=\"props\"\n            [multiple]=\"true\"\n          ></ax-selection-list>\n        </div>\n        <div class=\"ax-flex ax-justify-end ax-border-t-[1px] ax-p-3\">\n          <ax-button (onClick)=\"onConfirmFields(); fieldsPopover.close()\" class=\"ax-sm\" text=\"Confirm\" color=\"primary\">\n          </ax-button>\n        </div>\n      </div>\n    </ax-popover>\n  </div>\n</div>\n<ax-footer class=\"!ax-justify-start ax-absolute ax-bottom-0 ax-w-full\">\n  <ax-button [text]=\"'apply' | translate | async\" color=\"primary\" (onClick)=\"handleApplyClick()\"></ax-button>\n  <ax-button [text]=\"'reset' | translate | async\" color=\"ghost\" (onClick)=\"handleResetClick()\"></ax-button>\n</ax-footer>\n", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i5.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "component", type: i6.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i7.AXImageComponent, selector: "ax-image", inputs: ["overlayMode", "src", "alt", "priority", "lazy"], outputs: ["onLoad", "onError"] }, { kind: "component", type: i7$1.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "component", type: i13.AXSelectionListComponent, selector: "ax-selection-list", inputs: ["id", "name", "disabled", "readonly", "tabIndex", "size", "value", "valueField", "textField", "hintField", "disabledField", "readonlyField", "multiple", "direction", "customTemplate", "showControl", "items", "look"], outputs: ["onValueChanged", "onBlur", "onFocus"] }, { kind: "directive", type: i15.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i15.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i15.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i10$1.AXPWidgetFilterRendererComponent, selector: "axp-widget-filter-renderer", inputs: ["value", "operator", "prop", "schema"], outputs: ["valueChange", "operatorChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i8$1.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewOptionConditionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: AXPListViewOptionConditionsComponent, selector: "axp-list-view-option-conditions", inputs: { loader: "loader" }, outputs: { onClosed: "onClosed" }, ngImport: i0, template: "<ax-header class=\"ax-flex ax-items-center\">\n  <h2 class=\"ax-text-xl ax-font-bold\">Filters</h2>\n  <ax-button (onClick)=\"handleClose()\" [look]=\"'blank'\">\n    <ax-icon class=\"fa-solid fa-close ax-text-neutral-400 ax-text-xl\"> </ax-icon>\n  </ax-button>\n</ax-header>\n<div\n  class=\"ax-flex ax-flex-col ax-justify-center ax-gap-4 ax-py-4 ax-select-none\"\n  [class.ax-h-[calc(100vh-310px)]]=\"!(conditions$ | async)?.length\"\n>\n  @if(!(conditions$ | async)?.length){\n  <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center\">\n    <ax-image src=\"assets/documents.svg\"></ax-image>\n    <p class=\"ax-mt-6 ax-mb-1 ax-font-bold\">No Filters Selected</p>\n    <span class=\"ax-text-neutral-400 ax-text-sm md:ax-text-md\">Please select field(s) that you want to filter</span>\n  </div>\n  } @else {\n  <div class=\"ax-sorted-list ax-max-h-[calc(100vh-310px)] ax-px-4 ax-py-1 ax-overflow-auto\">\n    <div cdkDropList (cdkDropListDropped)=\"drop($event)\" class=\"ax-flex ax-flex-col ax-gap-2\">\n      @for(item of conditions$ | async; track item.name ){\n      <div cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n        <div class=\"ax-ms-4 ax-flex ax-items-start ax-gap-2\">\n          <ax-label>{{ loader.getProp(item.name)?.title }}</ax-label>\n          @if(getOperatorTitle(item.name,item.operator)){\n          <ax-badge\n            class=\"ax-text-xs\"\n            color=\"primary\"\n            [look]=\"'twotone'\"\n            [text]=\"getOperatorTitle(item.name, item.operator)\"\n          ></ax-badge>\n          }\n        </div>\n        <div class=\"ax-flex ax-group ax-items-center ax-gap-2\">\n          <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\" cdkDragHandle></ax-icon>\n          <div class=\"ax-w-full\">\n            <!-- <ax-text-box [(ngModel)]=\"item.value\"></ax-text-box> -->\n            <axp-widget-filter-renderer\n              [schema]=\"getSchema(item.name)\"\n              [prop]=\"loader.getProp(item.name)\"\n              [(value)]=\"item.value\"\n              [(operator)]=\"item.operator\"\n            >\n            </axp-widget-filter-renderer>\n          </div>\n          <ax-button look=\"blank\" color=\"danger\" class=\"ax-sm\" (onClick)=\"handleRemoveCondition(item)\">\n            <ax-icon class=\"fa-solid fa-trash-can\"></ax-icon>\n          </ax-button>\n        </div>\n      </div>\n      }\n    </div>\n  </div>\n  }\n  <div class=\"ax-flex ax-gap-2\">\n    <div class=\"ax-w-full\" #addField>\n      @if((conditions$ | async)?.length){\n      <ax-button color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"blank\" class=\"ax-sm\"></ax-button>\n      }@else {\n      <div class=\"ax-flex ax-justify-center ax-w-full\">\n        <ax-button color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"outline\" class=\"ax-md ax-w-56\"></ax-button>\n      </div>\n      }\n    </div>\n    <ax-popover\n      #fieldsPopover\n      [target]=\"addField\"\n      [openOn]=\"'toggle'\"\n      [closeOn]=\"'clickOut'\"\n      [adaptivityEnabled]=\"true\"\n      (onOpened)=\"resetSelectedFieldNames()\"\n      [offsetX]=\"15\"\n    >\n      <div class=\"ax-bg-surface ax-border ax-border-default ax-rounded-md ax-shadow-md ax-w-full ax-min-w-[250px]\">\n        <div class=\"ax-border-b-[1px] ax-pb-2 ax-mb-2 ax-p-3\">\n          <ax-title class=\"ax-font-bold\">Fields</ax-title>\n        </div>\n        <div class=\"ax-max-h-72 2xl:ax-max-h-80 ax-overflow-auto\">\n          <ax-selection-list\n            [valueField]=\"'name'\"\n            [textField]=\"'title'\"\n            [(ngModel)]=\"selectedFieldNames\"\n            [direction]=\"'vertical'\"\n            [items]=\"props\"\n            [multiple]=\"true\"\n          ></ax-selection-list>\n        </div>\n        <div class=\"ax-flex ax-justify-end ax-border-t-[1px] ax-p-3\">\n          <ax-button (onClick)=\"onConfirmFields(); fieldsPopover.close()\" class=\"ax-sm\" text=\"Confirm\" color=\"primary\">\n          </ax-button>\n        </div>\n      </div>\n    </ax-popover>\n  </div>\n</div>\n<ax-footer class=\"!ax-justify-start ax-absolute ax-bottom-0 ax-w-full\">\n  <ax-button [text]=\"'apply' | translate | async\" color=\"primary\" (onClick)=\"handleApplyClick()\"></ax-button>\n  <ax-button [text]=\"'reset' | translate | async\" color=\"ghost\" (onClick)=\"handleResetClick()\"></ax-button>\n</ax-footer>\n", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "responsiveOn", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "responsiveOnChange", "loadingTextChange"] }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i5.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "component", type: i6.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i7.AXImageComponent, selector: "ax-image", inputs: ["overlayMode", "src", "alt", "priority", "lazy"], outputs: ["onLoad", "onError"] }, { kind: "component", type: i7$1.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "component", type: i13.AXSelectionListComponent, selector: "ax-selection-list", inputs: ["id", "name", "disabled", "readonly", "tabIndex", "size", "value", "valueField", "textField", "hintField", "disabledField", "readonlyField", "multiple", "direction", "customTemplate", "showControl", "items", "look"], outputs: ["onValueChanged", "onBlur", "onFocus"] }, { kind: "directive", type: i15.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i15.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i15.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i10$1.AXPWidgetFilterRendererComponent, selector: "axp-widget-filter-renderer", inputs: ["value", "operator", "prop", "schema"], outputs: ["valueChange", "operatorChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i8$1.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewOptionConditionsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewOptionConditionsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'axp-list-view-option-conditions', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ax-header class=\"ax-flex ax-items-center\">\n  <h2 class=\"ax-text-xl ax-font-bold\">Filters</h2>\n  <ax-button (onClick)=\"handleClose()\" [look]=\"'blank'\">\n    <ax-icon class=\"fa-solid fa-close ax-text-neutral-400 ax-text-xl\"> </ax-icon>\n  </ax-button>\n</ax-header>\n<div\n  class=\"ax-flex ax-flex-col ax-justify-center ax-gap-4 ax-py-4 ax-select-none\"\n  [class.ax-h-[calc(100vh-310px)]]=\"!(conditions$ | async)?.length\"\n>\n  @if(!(conditions$ | async)?.length){\n  <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center\">\n    <ax-image src=\"assets/documents.svg\"></ax-image>\n    <p class=\"ax-mt-6 ax-mb-1 ax-font-bold\">No Filters Selected</p>\n    <span class=\"ax-text-neutral-400 ax-text-sm md:ax-text-md\">Please select field(s) that you want to filter</span>\n  </div>\n  } @else {\n  <div class=\"ax-sorted-list ax-max-h-[calc(100vh-310px)] ax-px-4 ax-py-1 ax-overflow-auto\">\n    <div cdkDropList (cdkDropListDropped)=\"drop($event)\" class=\"ax-flex ax-flex-col ax-gap-2\">\n      @for(item of conditions$ | async; track item.name ){\n      <div cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n        <div class=\"ax-ms-4 ax-flex ax-items-start ax-gap-2\">\n          <ax-label>{{ loader.getProp(item.name)?.title }}</ax-label>\n          @if(getOperatorTitle(item.name,item.operator)){\n          <ax-badge\n            class=\"ax-text-xs\"\n            color=\"primary\"\n            [look]=\"'twotone'\"\n            [text]=\"getOperatorTitle(item.name, item.operator)\"\n          ></ax-badge>\n          }\n        </div>\n        <div class=\"ax-flex ax-group ax-items-center ax-gap-2\">\n          <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\" cdkDragHandle></ax-icon>\n          <div class=\"ax-w-full\">\n            <!-- <ax-text-box [(ngModel)]=\"item.value\"></ax-text-box> -->\n            <axp-widget-filter-renderer\n              [schema]=\"getSchema(item.name)\"\n              [prop]=\"loader.getProp(item.name)\"\n              [(value)]=\"item.value\"\n              [(operator)]=\"item.operator\"\n            >\n            </axp-widget-filter-renderer>\n          </div>\n          <ax-button look=\"blank\" color=\"danger\" class=\"ax-sm\" (onClick)=\"handleRemoveCondition(item)\">\n            <ax-icon class=\"fa-solid fa-trash-can\"></ax-icon>\n          </ax-button>\n        </div>\n      </div>\n      }\n    </div>\n  </div>\n  }\n  <div class=\"ax-flex ax-gap-2\">\n    <div class=\"ax-w-full\" #addField>\n      @if((conditions$ | async)?.length){\n      <ax-button color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"blank\" class=\"ax-sm\"></ax-button>\n      }@else {\n      <div class=\"ax-flex ax-justify-center ax-w-full\">\n        <ax-button color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"outline\" class=\"ax-md ax-w-56\"></ax-button>\n      </div>\n      }\n    </div>\n    <ax-popover\n      #fieldsPopover\n      [target]=\"addField\"\n      [openOn]=\"'toggle'\"\n      [closeOn]=\"'clickOut'\"\n      [adaptivityEnabled]=\"true\"\n      (onOpened)=\"resetSelectedFieldNames()\"\n      [offsetX]=\"15\"\n    >\n      <div class=\"ax-bg-surface ax-border ax-border-default ax-rounded-md ax-shadow-md ax-w-full ax-min-w-[250px]\">\n        <div class=\"ax-border-b-[1px] ax-pb-2 ax-mb-2 ax-p-3\">\n          <ax-title class=\"ax-font-bold\">Fields</ax-title>\n        </div>\n        <div class=\"ax-max-h-72 2xl:ax-max-h-80 ax-overflow-auto\">\n          <ax-selection-list\n            [valueField]=\"'name'\"\n            [textField]=\"'title'\"\n            [(ngModel)]=\"selectedFieldNames\"\n            [direction]=\"'vertical'\"\n            [items]=\"props\"\n            [multiple]=\"true\"\n          ></ax-selection-list>\n        </div>\n        <div class=\"ax-flex ax-justify-end ax-border-t-[1px] ax-p-3\">\n          <ax-button (onClick)=\"onConfirmFields(); fieldsPopover.close()\" class=\"ax-sm\" text=\"Confirm\" color=\"primary\">\n          </ax-button>\n        </div>\n      </div>\n    </ax-popover>\n  </div>\n</div>\n<ax-footer class=\"!ax-justify-start ax-absolute ax-bottom-0 ax-w-full\">\n  <ax-button [text]=\"'apply' | translate | async\" color=\"primary\" (onClick)=\"handleApplyClick()\"></ax-button>\n  <ax-button [text]=\"'reset' | translate | async\" color=\"ghost\" (onClick)=\"handleResetClick()\"></ax-button>\n</ax-footer>\n" }]
         }], ctorParameters: () => [], propDecorators: { onClosed: [{
@@ -411,8 +411,8 @@ class AXPListViewOptionFilterOperatorComponent {
         this._value = v;
         this.valueChange.emit(v);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewOptionFilterOperatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: AXPListViewOptionFilterOperatorComponent, selector: "axp-list-view-option-filter-operator", inputs: { items: "items", value: "value" }, outputs: { valueChange: "valueChange" }, host: { styleAttribute: "display: contents;" }, viewQueries: [{ propertyName: "selectBox", first: true, predicate: AXSelectBoxComponent, descendants: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewOptionFilterOperatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: AXPListViewOptionFilterOperatorComponent, selector: "axp-list-view-option-filter-operator", inputs: { items: "items", value: "value" }, outputs: { valueChange: "valueChange" }, host: { styleAttribute: "display: contents;" }, viewQueries: [{ propertyName: "selectBox", first: true, predicate: AXSelectBoxComponent, descendants: true }], ngImport: i0, template: `
     <ax-select-box
       valueField="name"
       [dataSource]="items"
@@ -423,7 +423,7 @@ class AXPListViewOptionFilterOperatorComponent {
     </ax-select-box>
   `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i10.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "textTemplate", "dataSource", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewOptionFilterOperatorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewOptionFilterOperatorComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'axp-list-view-option-filter-operator',
@@ -483,10 +483,10 @@ class AXPListViewOptionSortingComponent {
         });
         this.onClosed.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewOptionSortingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXPListViewOptionSortingComponent, selector: "axp-list-view-option-sorting", inputs: { loader: "loader" }, outputs: { onClosed: "onClosed" }, ngImport: i0, template: "<ax-header class=\"ax-flex ax-items-center\">\n  <h2 class=\"ax-text-xl ax-font-bold\">{{'entity.sort' | translate | async}}</h2>\n  <ax-button (onClick)=\"handleClose()\" [look]=\"'blank'\">\n    <ax-icon class=\"fa-solid fa-close ax-text-neutral-400 ax-text-xl\"> </ax-icon>\n  </ax-button>\n</ax-header>\n<div class=\"ax-flex ax-p-4 ax-flex-col ax-justify-center ax-gap-4 ax-select-none\" [class.ax-h-[calc(100vh-310px)]]=\"!(sorts$ | async)?.length\">\n  @if(!(sorts$ | async)?.length){\n  <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center\">\n    <ax-image src=\"assets/documents.svg\"></ax-image>\n    <p class=\"ax-mt-6 ax-mb-1 ax-font-bold\">{{ 'entity.no-sort' | translate | async }}</p>\n    <span class=\"ax-text-neutral-400 ax-text-sm md:ax-text-md\">{{ 'entity.ask-sort' | translate | async }}</span>\n  </div>\n  }\n  <div\n    cdkDropList\n    (cdkDropListDropped)=\"drop($event)\"\n    class=\"ax-flex ax-flex-col ax-gap-3 ax-w-full ax-sorted-list ax-py-1 ax-max-h-[calc(100vh-310px)] ax-overflow-auto\"\n  >\n    <ng-container *ngFor=\"let item of sorts$ | async\">\n      <div class=\"ax-flex ax-gap-2 ax-items-center\" cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n        <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\" cdkDragHandle></ax-icon>\n        <ax-select-box [dataSource]=\"(props$ | async) ?? []\" valueField=\"name\" textField=\"title\" [(ngModel)]=\"item.name\"> </ax-select-box>\n        <ax-button [color]=\"'default'\" class=\"ax-sm\" (click)=\"changeItemSort(item)\">\n          <ax-icon [class.ax-text-primary]=\"item.dir == 'asc'\" class=\"fa-solid fa-arrow-up-long ax-text-neutral-400\"></ax-icon>\n          <ax-icon [class.ax-text-primary]=\"item.dir == 'desc'\" class=\"fa-solid fa-arrow-down-long ax-text-neutral-400\"></ax-icon>\n        </ax-button>\n\n        <ax-button look=\"blank\" (onClick)=\"loader.removeSort(item)\">\n          <ax-icon class=\"fa-solid fa-trash-can ax-text-danger-500\"></ax-icon>\n        </ax-button>\n      </div>\n    </ng-container>\n  </div>\n\n  <div class=\"ax-flex ax-gap-2\">\n    <div class=\"ax-w-full\" #addField>\n      @if((sorts$ | async)?.length){\n      <ax-button (onClick)=\"loader.addSort()\" color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"blank\" class=\"ax-sm\"></ax-button>\n      }@else {\n      <div class=\"ax-flex ax-justify-center ax-w-full\">\n        <ax-button (onClick)=\"loader.addSort()\" color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"outline\" class=\"ax-md ax-w-56\"></ax-button>\n      </div>\n      }\n    </div>\n  </div>\n</div>\n<ax-footer class=\"!ax-justify-start ax-absolute ax-bottom-0 ax-w-full\">\n  <ax-button [text]=\"'apply' | translate | async\" color=\"primary\" (onClick)=\"handleApplyClick()\"></ax-button>\n  <ax-button [text]=\"'reset' | translate | async\" color=\"ghost\" (onClick)=\"handleResetClick()\"></ax-button>\n</ax-footer>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i7.AXImageComponent, selector: "ax-image", inputs: ["overlayMode", "src", "alt", "priority", "lazy"], outputs: ["onLoad", "onError"] }, { kind: "component", type: i10.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "textTemplate", "dataSource", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "directive", type: i15.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i15.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i15.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i8$1.AXTranslatorPipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewOptionSortingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: AXPListViewOptionSortingComponent, selector: "axp-list-view-option-sorting", inputs: { loader: "loader" }, outputs: { onClosed: "onClosed" }, ngImport: i0, template: "<ax-header class=\"ax-flex ax-items-center\">\n  <h2 class=\"ax-text-xl ax-font-bold\">{{'entity.sort' | translate | async}}</h2>\n  <ax-button (onClick)=\"handleClose()\" [look]=\"'blank'\">\n    <ax-icon class=\"fa-solid fa-close ax-text-neutral-400 ax-text-xl\"> </ax-icon>\n  </ax-button>\n</ax-header>\n<div class=\"ax-flex ax-p-4 ax-flex-col ax-justify-center ax-gap-4 ax-select-none\" [class.ax-h-[calc(100vh-310px)]]=\"!(sorts$ | async)?.length\">\n  @if(!(sorts$ | async)?.length){\n  <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center\">\n    <ax-image src=\"assets/documents.svg\"></ax-image>\n    <p class=\"ax-mt-6 ax-mb-1 ax-font-bold\">{{ 'entity.no-sort' | translate | async }}</p>\n    <span class=\"ax-text-neutral-400 ax-text-sm md:ax-text-md\">{{ 'entity.ask-sort' | translate | async }}</span>\n  </div>\n  }\n  <div\n    cdkDropList\n    (cdkDropListDropped)=\"drop($event)\"\n    class=\"ax-flex ax-flex-col ax-gap-3 ax-w-full ax-sorted-list ax-py-1 ax-max-h-[calc(100vh-310px)] ax-overflow-auto\"\n  >\n    <ng-container *ngFor=\"let item of sorts$ | async\">\n      <div class=\"ax-flex ax-gap-2 ax-items-center\" cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n        <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\" cdkDragHandle></ax-icon>\n        <ax-select-box [dataSource]=\"(props$ | async) ?? []\" valueField=\"name\" textField=\"title\" [(ngModel)]=\"item.name\"> </ax-select-box>\n        <ax-button [color]=\"'default'\" class=\"ax-sm\" (click)=\"changeItemSort(item)\">\n          <ax-icon [class.ax-text-primary]=\"item.dir == 'asc'\" class=\"fa-solid fa-arrow-up-long ax-text-neutral-400\"></ax-icon>\n          <ax-icon [class.ax-text-primary]=\"item.dir == 'desc'\" class=\"fa-solid fa-arrow-down-long ax-text-neutral-400\"></ax-icon>\n        </ax-button>\n\n        <ax-button look=\"blank\" (onClick)=\"loader.removeSort(item)\">\n          <ax-icon class=\"fa-solid fa-trash-can ax-text-danger-500\"></ax-icon>\n        </ax-button>\n      </div>\n    </ng-container>\n  </div>\n\n  <div class=\"ax-flex ax-gap-2\">\n    <div class=\"ax-w-full\" #addField>\n      @if((sorts$ | async)?.length){\n      <ax-button (onClick)=\"loader.addSort()\" color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"blank\" class=\"ax-sm\"></ax-button>\n      }@else {\n      <div class=\"ax-flex ax-justify-center ax-w-full\">\n        <ax-button (onClick)=\"loader.addSort()\" color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"outline\" class=\"ax-md ax-w-56\"></ax-button>\n      </div>\n      }\n    </div>\n  </div>\n</div>\n<ax-footer class=\"!ax-justify-start ax-absolute ax-bottom-0 ax-w-full\">\n  <ax-button [text]=\"'apply' | translate | async\" color=\"primary\" (onClick)=\"handleApplyClick()\"></ax-button>\n  <ax-button [text]=\"'reset' | translate | async\" color=\"ghost\" (onClick)=\"handleResetClick()\"></ax-button>\n</ax-footer>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "responsiveOn", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "responsiveOnChange", "loadingTextChange"] }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i7.AXImageComponent, selector: "ax-image", inputs: ["overlayMode", "src", "alt", "priority", "lazy"], outputs: ["onLoad", "onError"] }, { kind: "component", type: i10.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "textTemplate", "dataSource", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "directive", type: i15.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i15.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i15.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i8$1.AXTranslatorPipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewOptionSortingComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewOptionSortingComponent, decorators: [{
             type: Component,
             args: [{ selector: 'axp-list-view-option-sorting', template: "<ax-header class=\"ax-flex ax-items-center\">\n  <h2 class=\"ax-text-xl ax-font-bold\">{{'entity.sort' | translate | async}}</h2>\n  <ax-button (onClick)=\"handleClose()\" [look]=\"'blank'\">\n    <ax-icon class=\"fa-solid fa-close ax-text-neutral-400 ax-text-xl\"> </ax-icon>\n  </ax-button>\n</ax-header>\n<div class=\"ax-flex ax-p-4 ax-flex-col ax-justify-center ax-gap-4 ax-select-none\" [class.ax-h-[calc(100vh-310px)]]=\"!(sorts$ | async)?.length\">\n  @if(!(sorts$ | async)?.length){\n  <div class=\"ax-flex ax-flex-col ax-items-center ax-justify-center\">\n    <ax-image src=\"assets/documents.svg\"></ax-image>\n    <p class=\"ax-mt-6 ax-mb-1 ax-font-bold\">{{ 'entity.no-sort' | translate | async }}</p>\n    <span class=\"ax-text-neutral-400 ax-text-sm md:ax-text-md\">{{ 'entity.ask-sort' | translate | async }}</span>\n  </div>\n  }\n  <div\n    cdkDropList\n    (cdkDropListDropped)=\"drop($event)\"\n    class=\"ax-flex ax-flex-col ax-gap-3 ax-w-full ax-sorted-list ax-py-1 ax-max-h-[calc(100vh-310px)] ax-overflow-auto\"\n  >\n    <ng-container *ngFor=\"let item of sorts$ | async\">\n      <div class=\"ax-flex ax-gap-2 ax-items-center\" cdkDrag cdkDragBoundary=\".ax-sorted-list\">\n        <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move\" cdkDragHandle></ax-icon>\n        <ax-select-box [dataSource]=\"(props$ | async) ?? []\" valueField=\"name\" textField=\"title\" [(ngModel)]=\"item.name\"> </ax-select-box>\n        <ax-button [color]=\"'default'\" class=\"ax-sm\" (click)=\"changeItemSort(item)\">\n          <ax-icon [class.ax-text-primary]=\"item.dir == 'asc'\" class=\"fa-solid fa-arrow-up-long ax-text-neutral-400\"></ax-icon>\n          <ax-icon [class.ax-text-primary]=\"item.dir == 'desc'\" class=\"fa-solid fa-arrow-down-long ax-text-neutral-400\"></ax-icon>\n        </ax-button>\n\n        <ax-button look=\"blank\" (onClick)=\"loader.removeSort(item)\">\n          <ax-icon class=\"fa-solid fa-trash-can ax-text-danger-500\"></ax-icon>\n        </ax-button>\n      </div>\n    </ng-container>\n  </div>\n\n  <div class=\"ax-flex ax-gap-2\">\n    <div class=\"ax-w-full\" #addField>\n      @if((sorts$ | async)?.length){\n      <ax-button (onClick)=\"loader.addSort()\" color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"blank\" class=\"ax-sm\"></ax-button>\n      }@else {\n      <div class=\"ax-flex ax-justify-center ax-w-full\">\n        <ax-button (onClick)=\"loader.addSort()\" color=\"primary\" [text]=\"'entity.add-field' | translate | async\" look=\"outline\" class=\"ax-md ax-w-56\"></ax-button>\n      </div>\n      }\n    </div>\n  </div>\n</div>\n<ax-footer class=\"!ax-justify-start ax-absolute ax-bottom-0 ax-w-full\">\n  <ax-button [text]=\"'apply' | translate | async\" color=\"primary\" (onClick)=\"handleApplyClick()\"></ax-button>\n  <ax-button [text]=\"'reset' | translate | async\" color=\"ghost\" (onClick)=\"handleResetClick()\"></ax-button>\n</ax-footer>\n" }]
         }], propDecorators: { onClosed: [{
@@ -617,10 +617,10 @@ class AXPEntityCreateViewLoaderFactory {
         }
         return Promise.reject('cannot fetch ');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityCreateViewLoaderFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityCreateViewLoaderFactory, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityCreateViewLoaderFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityCreateViewLoaderFactory, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityCreateViewLoaderFactory, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityCreateViewLoaderFactory, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -638,7 +638,7 @@ class AXPEntityCreatePopupAction extends AXPWorkflowAction {
     async execute(context) {
         const { module, entity: entityName } = context.getVariable('payload');
         const entity = await this.entityRegistery.resolve(module, entityName);
-        const com = await import('./acorex-platform-layouts-entity-create-view.component-DgPPnU8S.mjs');
+        const com = await import('./acorex-platform-layouts-entity-create-view.component-B2XtNJo1.mjs');
         const result = await this.popupService.open(com.AXPEntityCreateViewComponent, {
             title: this.translateService.translateSync('create-new') + ' ' + entity.title,
             size: this.platform.is('Mobile') || this.platform.is('SM') ? 'full' : 'md',
@@ -653,10 +653,10 @@ class AXPEntityCreatePopupAction extends AXPWorkflowAction {
             context.setVariable('id', result.data.recordId);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityCreatePopupAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityCreatePopupAction }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityCreatePopupAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityCreatePopupAction }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityCreatePopupAction, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityCreatePopupAction, decorators: [{
             type: Injectable
         }] });
 class AXPEntityCreateSubmittedAction extends AXPWorkflowAction {
@@ -788,10 +788,10 @@ class AXPEntityPerformDeleteAction extends AXPWorkflowAction {
             throw new Error(`The delete operation cannot be performed on ${entity.title}. This action might be restricted or not applicable for the selected item.`);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityPerformDeleteAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityPerformDeleteAction }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityPerformDeleteAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityPerformDeleteAction }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityPerformDeleteAction, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityPerformDeleteAction, decorators: [{
             type: Injectable
         }] });
 class AXPMyCustomFunc extends AXPWorkflowFunction {
@@ -803,10 +803,10 @@ class AXPMyCustomFunc extends AXPWorkflowFunction {
     async execute(val) {
         return val == 'abc';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPMyCustomFunc, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPMyCustomFunc }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPMyCustomFunc, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPMyCustomFunc }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPMyCustomFunc, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPMyCustomFunc, decorators: [{
             type: Injectable
         }] });
 const AXPDeleteEntityWorkflow = {
@@ -853,7 +853,7 @@ class AXPEntityImportPopupAction extends AXPWorkflowAction {
     async execute(context) {
         const { module, entity: entityName } = context.getVariable('payload');
         const entity = await this.entityRegistery.resolve(module, entityName);
-        const com = await import('./acorex-platform-layouts-entity-import-view.component-V50y5Jjs.mjs');
+        const com = await import('./acorex-platform-layouts-entity-import-view.component-CZpEcVi9.mjs');
         const result = await this.popupService.open(com.AXPEntityImportViewComponent, {
             title: `Import ${entity.title}`,
             size: this.platform.is('Mobile') || this.platform.is('SM') ? 'full' : 'md',
@@ -866,10 +866,10 @@ class AXPEntityImportPopupAction extends AXPWorkflowAction {
             context.setVariable('redirect', result.data.redirect);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityImportPopupAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityImportPopupAction }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityImportPopupAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityImportPopupAction }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityImportPopupAction, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityImportPopupAction, decorators: [{
             type: Injectable
         }] });
 class AXPEntityImportSubmittedAction extends AXPWorkflowAction {
@@ -1160,10 +1160,10 @@ class AXPEntityListViewComponent {
     ngOnDestroy() {
         this.dataSource.reset();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityListViewComponent, deps: [{ token: i1$2.AXActionSheetService }, { token: i2.AXUnsubscriber }, { token: i3.AXPlatform }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXPEntityListViewComponent, selector: "ng-component", providers: [AXUnsubscriber], viewQueries: [{ propertyName: "viewsTemplate", first: true, predicate: ["viewsTemplate"], descendants: true }, { propertyName: "grid", first: true, predicate: ["grid"], descendants: true }, { propertyName: "entityViewDrawer", first: true, predicate: ["entityViewDrawer"], descendants: true }], ngImport: i0, template: "<ax-drawer-container>\n  <!-- <ax-drawer #drawer location=\"start\" [collapsed]=\"true\" [mode]=\"platform.is('SM') ? 'overlay' : 'push'\">\n    <ax-content class=\"ax-w-64 ax-border-e\">\n      <div class=\"ax-p-6 ax-py-4 ax-gap-6 ax-flex ax-flex-col\">\n        <p class=\"ax-text-2xl ax-font-bold\">Folders</p>\n        <ax-side-menu>\n          <ng-container *ngFor=\"let node of menuItems\" [ngTemplateOutlet]=\"sideMenu\"\n            [ngTemplateOutletContext]=\"{ $implicit: node }\">\n          </ng-container>\n        </ax-side-menu>\n        <ng-template #sideMenu let-item>\n          <ax-side-menu-item [text]=\"item.text\">\n            <ax-prefix>\n              <ax-icon class=\"fa-solid fa-folder ax-text-warning-500\"></ax-icon>\n            </ax-prefix>\n            <ng-container *ngIf=\"item.children\">\n              <ng-container *ngFor=\"let child of item.children\" [ngTemplateOutlet]=\"sideMenu\"\n                [ngTemplateOutletContext]=\"{ $implicit: child }\">\n              </ng-container>\n            </ng-container>\n          </ax-side-menu-item>\n        </ng-template>\n      </div>\n    </ax-content>\n  </ax-drawer> -->\n  <ax-content class=\"ax-flex ax-flex-col ax-overflow-hidden\">\n    <div\n      class=\"ax-flex ax-flex-col ax-gap-0 md:ax-gap-4 ax-px-4 ax-py-3 md:ax-py-4 md:ax-px-6 ax-bg-surface ax-border-b md:ax-border-0 md:ax-bg-default\"\n    >\n      @if(platform.is('MD')){\n      <div class=\"ax-flex ax-justify-between ax-mb-4\">\n        @if(this.grid?.selectedRows?.length==0){\n        <div class=\"ax-text-xl ax-font-bold\">{{ title }}</div>\n        <div class=\"ax-flex ax-items-center ax-gap-2\">\n          @if(canCreate) {\n          <ax-button color=\"primary\" class=\"ax-sm\" (onClick)=\"handleCreateClick()\">\n            <ax-icon class=\"fa-solid fa-add\"></ax-icon>\n          </ax-button>\n          }\n          <ax-button color=\"ghost\" class=\"ax-sm\" #more>\n            <ax-icon class=\"fa-solid fa-ellipsis-vertical\"> </ax-icon>\n            <ax-dropdown-panel [adaptivityEnabled]=\"true\">\n              <ax-button-item-list>\n                <ax-button-item text=\"Export\" class=\"ax-font-semibold\">\n                  <ax-prefix>\n                    <ax-icon icon=\"fa-solid fa-file-export\"> </ax-icon>\n                  </ax-prefix>\n                </ax-button-item>\n              </ax-button-item-list>\n            </ax-dropdown-panel>\n          </ax-button>\n        </div>\n        }@else {\n        <div class=\"ax-flex ax-items-center ax-gap-3\">\n          <span class=\"ax-text-xl ax-font-bold\"> {{ this.grid?.selectedRows?.length }} Items Selected </span>\n          <span (click)=\"clearSelectedItems()\" class=\"ax-text-sm ax-text-primary dark:ax-text-primary-300 ax-underline ax-cursor-pointer\"\n            >Clear Items</span\n          >\n        </div>\n        <div class=\"ax-flex ax-items-center ax-gap-2\">\n          @if(canDelete) {\n          <ax-button color=\"danger\" class=\"ax-sm\" (onClick)=\"handleCommandClick('delete')\">\n            <ax-icon class=\"fa-solid fa-trash\"> </ax-icon>\n          </ax-button>\n          }\n          <ax-button color=\"ghost\" class=\"ax-sm\" #more>\n            <ax-icon class=\"fa-solid fa-ellipsis-vertical\"> </ax-icon>\n          </ax-button>\n        </div>\n        }\n      </div>\n\n      <div class=\"ax-flex ax-items-center ax-justify-between\">\n        <ax-button [disabled]=\"this.grid?.selectedRows?.length != 0\" [text]=\"(view$ | async)?.title\" color=\"ghost\">\n          <ax-icon class=\"fa-solid fa-eye ax-text-neutral-400\"> </ax-icon>\n          <ax-suffix>\n            <i class=\"fa-solid fa-caret-down\"></i>\n          </ax-suffix>\n          <ax-dropdown-panel [adaptivityEnabled]=\"true\">\n            <ax-button-item-list class=\"ax-bg-surface\">\n              <ax-title class=\"ax-font-bold ax-opacity-100\">{{ 'entity.public-view' | translate | async }}</ax-title>\n              <ax-button-item\n                *ngFor=\"let v of publicViews$ | async\"\n                [text]=\"v.title\"\n                [class.ax-bg-on-surface]=\"(view$ | async) == v\"\n                (onClick)=\"loader.setView(v.name)\"\n              ></ax-button-item>\n              <ax-title class=\"ax-font-bold ax-opacity-100\" *ngIf=\"hasCustomViews$ | async\">Created by me</ax-title>\n              <ax-button-item\n                *ngFor=\"let v of customViews$ | async\"\n                [text]=\"v.title\"\n                [class.ax-bg-on-surface]=\"(view$ | async) == v\"\n                (onClick)=\"loader.setView(v.name)\"\n              ></ax-button-item>\n              <ng-container *feature=\"'axp-entity-list-custom-view'\">\n                <ax-divider></ax-divider>\n                <ax-button-item (onClick)=\"addCustomViewPopup()\" text=\"Add Custom View\" class=\"ax-font-semibold ax-text-primary\"></ax-button-item>\n              </ng-container>\n            </ax-button-item-list>\n          </ax-dropdown-panel>\n        </ax-button>\n        <div class=\"ax-flex ax-gap-2\">\n          @if(searchBoxTitle){\n          <ax-button (onClick)=\"toggleSearchBox()\" [disabled]=\"this.grid?.selectedRows?.length != 0\" color=\"ghost\">\n            <ax-icon class=\"fa-solid fa-search ax-text-neutral-400\"> </ax-icon>\n          </ax-button>\n          }\n          <ax-button [disabled]=\"this.grid?.selectedRows?.length != 0\" color=\"ghost\" (onClick)=\"columnsDrawer.open()\">\n            <ax-icon class=\"fa-solid fa-bars ax-text-neutral-400\"> </ax-icon>\n          </ax-button>\n          <ax-button [disabled]=\"this.grid?.selectedRows?.length != 0\" color=\"ghost\" (onClick)=\"conditionsDrawer.open()\">\n            <ax-icon class=\"fa-solid fa-sliders ax-text-neutral-400\"> </ax-icon>\n            @if ((conditionsCount$ | async)) {\n            <ax-suffix>\n              <ax-badge [color]=\"'primary'\"></ax-badge>\n            </ax-suffix>\n            }\n          </ax-button>\n          <ax-button [disabled]=\"this.grid?.selectedRows?.length != 0\" color=\"ghost\" (onClick)=\"sortsDrawer.open()\">\n            <ax-icon class=\"fa-solid fa-bars-sort ax-text-neutral-400\"> </ax-icon>\n            @if ((sortCount$ | async)) {\n            <ax-suffix>\n              <ax-badge [color]=\"'primary'\"></ax-badge>\n            </ax-suffix>\n            }\n          </ax-button>\n        </div>\n      </div>\n      <div [class.collapsed-search-box]=\"searchBoxCollapsed\" class=\"ax-transition-all ax-mt-4\">\n        <ax-search-box [title]=\"searchBoxTitle\" [placeholder]=\"('widget.lookup.search' | translate | async) + searchBoxPlaceholder\"\n          ><ax-clear-button></ax-clear-button\n        ></ax-search-box>\n      </div>\n      } @else {\n      <div class=\"ax-flex ax-items-center ax-justify-between ax-gap-3\">\n        <div class=\"ax-text-xl md:ax-text-3xl ax-font-bold ax-mb-2\">{{ title }}</div>\n        @if(this.grid?.selectedRows?.length==0){\n        <div class=\"ax-flex ax-gap-3\">\n          @if(canCreate) {\n          <ax-button [text]=\"'create-new' | translate | async\" color=\"primary\" (onClick)=\"handleCreateClick()\">\n            <ax-prefix>\n              <i class=\"fa-solid fa-add\"></i>\n            </ax-prefix>\n          </ax-button>\n          }\n          <ax-button [text]=\"'Actions' | translate | async\" color=\"ghost\">\n            <ax-prefix>\n              <i class=\"fa-solid fa-ellipsis-vertical\"></i>\n            </ax-prefix>\n            <ax-dropdown-panel [adaptivityEnabled]=\"true\">\n              <ax-button-item-list>\n                @if(canImport){\n                <ax-button-item (onClick)=\"handleImportClick()\" text=\"Import\" class=\"ax-font-semibold\">\n                  <ax-prefix>\n                    <ax-icon icon=\"fa-solid fa-file-import\"> </ax-icon>\n                  </ax-prefix>\n                </ax-button-item>\n                }\n                <ax-button-item text=\"Export\" class=\"ax-font-semibold\">\n                  <ax-prefix>\n                    <ax-icon icon=\"fa-solid fa-file-export\"> </ax-icon>\n                  </ax-prefix>\n                </ax-button-item>\n              </ax-button-item-list>\n            </ax-dropdown-panel>\n          </ax-button>\n        </div>\n        }@else {\n        <div class=\"ax-flex ax-gap-3\">\n          @if(canDelete) {\n          <ax-button text=\"Delete Items\" color=\"danger\" (onClick)=\"handleCommandClick('delete')\">\n            <ax-prefix>\n              <i class=\"fa-solid fa-trash\"></i>\n            </ax-prefix>\n          </ax-button>\n          }\n          <ax-button [text]=\"'Actions' | translate | async\" color=\"ghost\">\n            <ax-prefix>\n              <i class=\"fa-solid fa-ellipsis-vertical\"></i>\n            </ax-prefix>\n          </ax-button>\n        </div>\n        }\n      </div>\n      <div class=\"ax-flex ax-items-center ax-justify-between\">\n        <!-----------------------  View Mode   --------------------->\n        @if(this.grid?.selectedRows?.length==0) {\n        <div class=\"ax-flex ax-w-full ax-justify-between ax-gap-3\">\n          <div class=\"ax-flex ax-gap-3\">\n            <ax-button [text]=\"(view$ | async)?.title\" #views color=\"ghost\">\n              <ax-prefix>\n                <i class=\"fa-solid fa-eye\"></i>\n              </ax-prefix>\n              <ax-suffix>\n                <i class=\"fa-solid fa-caret-down\"></i>\n              </ax-suffix>\n              <ax-dropdown-panel [adaptivityEnabled]=\"true\">\n                <ax-button-item-list class=\"ax-bg-surface\">\n                  <ax-title class=\"ax-font-bold ax-opacity-100\">{{ 'entity.public-view' | translate | async }}</ax-title>\n                  <ax-button-item\n                    *ngFor=\"let v of publicViews$ | async\"\n                    [text]=\"v.title\"\n                    [class.ax-bg-on-surface]=\"(view$ | async) == v\"\n                    (onClick)=\"loader.setView(v.name)\"\n                  ></ax-button-item>\n                  <ax-title class=\"ax-font-bold ax-opacity-100\" *ngIf=\"hasCustomViews$ | async\">Created by me</ax-title>\n                  <ax-button-item\n                    class=\"ax-pe-4 ax-flex ax-justify-between\"\n                    *ngFor=\"let v of customViews$ | async\"\n                    [text]=\"v.title\"\n                    [class.ax-bg-on-surface]=\"(view$ | async) == v\"\n                    (onClick)=\"loader.setView(v.name)\"\n                  >\n                    <ax-suffix>\n                      <ax-button (onClick)=\"updateViewPopup($event, v)\" class=\"ax-xs\" look=\"none\">\n                        <ax-icon class=\"far fa-edit\"> </ax-icon>\n                      </ax-button>\n                    </ax-suffix>\n                  </ax-button-item>\n                  <ng-container *feature=\"'axp-entity-list-custom-view'\">\n                    <ax-divider></ax-divider>\n                    <ax-button-item text=\"Add Custom View\" (onClick)=\"addCustomViewPopup()\" class=\"ax-font-semibold ax-text-primary\"></ax-button-item>\n                  </ng-container>\n                </ax-button-item-list>\n              </ax-dropdown-panel>\n            </ax-button>\n            @if(searchBoxTitle){\n            <div class=\"ax-w-72\">\n              <ax-search-box\n                [title]=\"searchBoxTitle\"\n                [(ngModel)]=\"searchValue\"\n                (onValueChanged)=\"handleChangeSearchValue($event)\"\n                [placeholder]=\"('widget.lookup.search' | translate | async) + searchBoxPlaceholder\"\n                ><ax-clear-button></ax-clear-button\n              ></ax-search-box>\n            </div>\n            }\n          </div>\n\n          <div class=\"ax-flex ax-gap-3\">\n            <ax-button [text]=\"'entity.columns' | translate | async\" color=\"ghost\" #columns (onClick)=\"columnsDrawer.open()\">\n              <ax-prefix>\n                <i class=\"fa-solid fa-bars\"></i>\n              </ax-prefix>\n              <ax-suffix>\n                <ax-badge text=\"{{ columnsCount$ | async }}\" color=\"primary\"></ax-badge>\n              </ax-suffix>\n            </ax-button>\n            <ax-button text=\"Filters\" color=\"ghost\" (onClick)=\"conditionsDrawer.open()\" #conditions>\n              <ax-prefix>\n                <i class=\"fa-solid fa-sliders\"></i>\n              </ax-prefix>\n              <ax-suffix>\n                <ax-badge text=\"{{ conditionsCount$ | async }}\" color=\"primary\"></ax-badge>\n              </ax-suffix>\n            </ax-button>\n            <ax-button [text]=\"'entity.sort' | translate | async\" color=\"ghost\" (onClick)=\"sortsDrawer.open()\">\n              <ax-prefix>\n                <i class=\"fa-solid fa-bars-sort\"></i>\n              </ax-prefix>\n              <ax-suffix *ngIf=\"(sortCount$ | async)! > 0\">\n                <ax-badge text=\"{{ sortCount$ | async }}\" color=\"primary\"></ax-badge>\n              </ax-suffix>\n            </ax-button>\n          </div>\n        </div>\n\n        } @else{\n        <!-----------------------  Selection Mode   --------------------->\n        <div>\n          <div class=\"ax-flex ax-gap-3 ax-items-center ax-h-10\">\n            <span class=\"ax-text-xl ax-font-bold\"> {{ this.grid?.selectedRows?.length }} Items Selected </span>\n            <span (click)=\"clearSelectedItems()\" class=\"ax-text-sm ax-text-primary dark:ax-text-primary-300 ax-underline ax-cursor-pointer\"\n              >Clear Items</span\n            >\n          </div>\n        </div>\n        }\n      </div>\n      }\n    </div>\n    <div class=\"ax-flex-1 ax-px-6 ax-py-4 ax-flex ax-overflow-auto\">\n      <ax-data-table\n        #grid\n        [showFooter]=\"false\"\n        class=\"ax-flex-1\"\n        [dataSource]=\"dataSource\"\n        [paging]=\"true\"\n        [fetchDataMode]=\"'manual'\"\n        (onRowDbClick)=\"handleRowDbClick($event)\"\n        [loading]=\"{ enabled: true, animation: true }\"\n      >\n        <!-- <ax-index-column *ngIf=\"!platform.is('SM')\" [width]=\"'85px'\"></ax-index-column> -->\n        <ax-select-column fixed=\"start\" [width]=\"'50px'\"></ax-select-column>\n        @for(col of (columns$ | async);track col.name) {\n        <axp-widget-column-renderer\n          *ngIf=\"col.visible\"\n          [schema]=\"col.schema\"\n          [dataField]=\"col.name\"\n          [caption]=\"col.title\"\n          [options]=\"col.options\"\n          [displayFormat]=\"col.displayFormat\"\n          [width]=\"'180px'\"\n          [allowSorting]=\"false\"\n        >\n        </axp-widget-column-renderer>\n        }\n        <ax-dropdown-command-column\n          fixed=\"end\"\n          [width]=\"'60px'\"\n          [items]=\"getDropdownRowItems\"\n          (onItemClick)=\"handleRowCommandClick($event)\"\n        ></ax-dropdown-command-column>\n        <ax-command-column fixed=\"end\" [width]=\"'60px'\" [items]=\"getInlineRowItems\" (onItemClick)=\"handleRowCommandClick($event)\"></ax-command-column>\n      </ax-data-table>\n    </div>\n  </ax-content>\n  <ax-drawer (collapsedChange)=\"closeDrawer('columns', $event)\" #columnsDrawer location=\"end\" [mode]=\"'overlay'\">\n    <ax-content class=\"ax-w-[85vw] md:ax-w-[45vw] lg:ax-w-[35vw] 2xl:ax-w-[20vw] ax-border-e\">\n      <axp-list-view-option-columns [loader]=\"loader\" (onClosed)=\"columnsDrawer.close()\"></axp-list-view-option-columns>\n    </ax-content>\n  </ax-drawer>\n  <ax-drawer (collapsedChange)=\"closeDrawer('conditions', $event)\" #conditionsDrawer location=\"end\" [mode]=\"'overlay'\">\n    <ax-content class=\"ax-w-[85vw] md:ax-w-[45vw] lg:ax-w-[35vw] 2xl:ax-w-[25vw] ax-border-e\">\n      <axp-list-view-option-conditions [loader]=\"loader\" (onClosed)=\"conditionsDrawer.close()\"></axp-list-view-option-conditions>\n    </ax-content>\n  </ax-drawer>\n  <ax-drawer (collapsedChange)=\"closeDrawer('sorts', $event)\" #sortsDrawer location=\"end\" [mode]=\"'overlay'\">\n    <ax-content class=\"ax-w-[85vw] md:ax-w-[45vw] lg:ax-w-[35vw] 2xl:ax-w-[20vw] ax-border-e\">\n      <axp-list-view-option-sorting (onClosed)=\"sortsDrawer.close()\" [loader]=\"loader\"></axp-list-view-option-sorting>\n    </ax-content>\n  </ax-drawer>\n</ax-drawer-container>\n", styles: [".cdk-drag-preview{border-radius:.375rem;border-width:1px;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);background:rgba(var(--ax-color-on-surface));padding:.5rem;height:max-content!important}.collapsed-search-box{margin-top:0;height:0px;opacity:0}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6$1.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "rowTemplate", "emptyTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged"] }, { kind: "component", type: i6$1.AXRowSelectColumnComponent, selector: "ax-select-column", inputs: ["width", "caption", "fixed"] }, { kind: "component", type: i6$1.AXRowCommandColumnComponent, selector: "ax-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "items"], outputs: ["onItemClick"] }, { kind: "component", type: i6$1.AXRowDropdownCommandColumnComponent, selector: "ax-dropdown-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "items"], outputs: ["onItemClick"] }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i4.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i4.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i5.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "component", type: i10$2.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i11$1.AXDrawerComponent, selector: "ax-drawer", inputs: ["location", "showBackdrop", "mode", "collapsed"], outputs: ["locationChange", "modeChange", "collapsedChange"] }, { kind: "component", type: i11$1.AXDrawerContainerComponent, selector: "ax-drawer-container" }, { kind: "component", type: i12.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "delayTime"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: i10$1.AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: ["width", "caption", "headerTemplate", "allowSorting", "fixed", "footerTemplate", "cellTemplate", "options", "dataField", "displayFormat", "schema"] }, { kind: "directive", type: i14$1.AXPFeatureDirective, selector: "[feature]", inputs: ["feature", "featureElse"] }, { kind: "component", type: AXPListViewOptionsColumnsComponent, selector: "axp-list-view-option-columns", inputs: ["loader"], outputs: ["onClosed"] }, { kind: "component", type: AXPListViewOptionConditionsComponent, selector: "axp-list-view-option-conditions", inputs: ["loader"], outputs: ["onClosed"] }, { kind: "component", type: AXPListViewOptionSortingComponent, selector: "axp-list-view-option-sorting", inputs: ["loader"], outputs: ["onClosed"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i8$1.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityListViewComponent, deps: [{ token: i1$2.AXActionSheetService }, { token: i2.AXUnsubscriber }, { token: i3.AXPlatform }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: AXPEntityListViewComponent, selector: "ng-component", providers: [AXUnsubscriber], viewQueries: [{ propertyName: "viewsTemplate", first: true, predicate: ["viewsTemplate"], descendants: true }, { propertyName: "grid", first: true, predicate: ["grid"], descendants: true }, { propertyName: "entityViewDrawer", first: true, predicate: ["entityViewDrawer"], descendants: true }], ngImport: i0, template: "<ax-drawer-container>\n  <!-- <ax-drawer #drawer location=\"start\" [collapsed]=\"true\" [mode]=\"platform.is('SM') ? 'overlay' : 'push'\">\n    <ax-content class=\"ax-w-64 ax-border-e\">\n      <div class=\"ax-p-6 ax-py-4 ax-gap-6 ax-flex ax-flex-col\">\n        <p class=\"ax-text-2xl ax-font-bold\">Folders</p>\n        <ax-side-menu>\n          <ng-container *ngFor=\"let node of menuItems\" [ngTemplateOutlet]=\"sideMenu\"\n            [ngTemplateOutletContext]=\"{ $implicit: node }\">\n          </ng-container>\n        </ax-side-menu>\n        <ng-template #sideMenu let-item>\n          <ax-side-menu-item [text]=\"item.text\">\n            <ax-prefix>\n              <ax-icon class=\"fa-solid fa-folder ax-text-warning-500\"></ax-icon>\n            </ax-prefix>\n            <ng-container *ngIf=\"item.children\">\n              <ng-container *ngFor=\"let child of item.children\" [ngTemplateOutlet]=\"sideMenu\"\n                [ngTemplateOutletContext]=\"{ $implicit: child }\">\n              </ng-container>\n            </ng-container>\n          </ax-side-menu-item>\n        </ng-template>\n      </div>\n    </ax-content>\n  </ax-drawer> -->\n  <ax-content class=\"ax-flex ax-flex-col ax-overflow-hidden\">\n    <div\n      class=\"ax-flex ax-flex-col ax-gap-0 md:ax-gap-4 ax-px-4 ax-py-3 md:ax-py-4 md:ax-px-6 ax-bg-surface ax-border-b md:ax-border-0 md:ax-bg-default\"\n    >\n      @if(platform.is('MD')){\n      <div class=\"ax-flex ax-justify-between ax-mb-4\">\n        @if(this.grid?.selectedRows?.length==0){\n        <div class=\"ax-text-xl ax-font-bold\">{{ title }}</div>\n        <div class=\"ax-flex ax-items-center ax-gap-2\">\n          @if(canCreate) {\n          <ax-button color=\"primary\" class=\"ax-sm\" (onClick)=\"handleCreateClick()\">\n            <ax-icon class=\"fa-solid fa-add\"></ax-icon>\n          </ax-button>\n          }\n          <ax-button color=\"ghost\" class=\"ax-sm\" #more>\n            <ax-icon class=\"fa-solid fa-ellipsis-vertical\"> </ax-icon>\n            <ax-dropdown-panel [adaptivityEnabled]=\"true\">\n              <ax-button-item-list>\n                <ax-button-item text=\"Export\" class=\"ax-font-semibold\">\n                  <ax-prefix>\n                    <ax-icon icon=\"fa-solid fa-file-export\"> </ax-icon>\n                  </ax-prefix>\n                </ax-button-item>\n              </ax-button-item-list>\n            </ax-dropdown-panel>\n          </ax-button>\n        </div>\n        }@else {\n        <div class=\"ax-flex ax-items-center ax-gap-3\">\n          <span class=\"ax-text-xl ax-font-bold\"> {{ this.grid?.selectedRows?.length }} Items Selected </span>\n          <span (click)=\"clearSelectedItems()\" class=\"ax-text-sm ax-text-primary dark:ax-text-primary-300 ax-underline ax-cursor-pointer\"\n            >Clear Items</span\n          >\n        </div>\n        <div class=\"ax-flex ax-items-center ax-gap-2\">\n          @if(canDelete) {\n          <ax-button color=\"danger\" class=\"ax-sm\" (onClick)=\"handleCommandClick('delete')\">\n            <ax-icon class=\"fa-solid fa-trash\"> </ax-icon>\n          </ax-button>\n          }\n          <ax-button color=\"ghost\" class=\"ax-sm\" #more>\n            <ax-icon class=\"fa-solid fa-ellipsis-vertical\"> </ax-icon>\n          </ax-button>\n        </div>\n        }\n      </div>\n\n      <div class=\"ax-flex ax-items-center ax-justify-between\">\n        <ax-button [disabled]=\"this.grid?.selectedRows?.length != 0\" [text]=\"(view$ | async)?.title\" color=\"ghost\">\n          <ax-icon class=\"fa-solid fa-eye ax-text-neutral-400\"> </ax-icon>\n          <ax-suffix>\n            <i class=\"fa-solid fa-caret-down\"></i>\n          </ax-suffix>\n          <ax-dropdown-panel [adaptivityEnabled]=\"true\">\n            <ax-button-item-list class=\"ax-bg-surface\">\n              <ax-title class=\"ax-font-bold ax-opacity-100\">{{ 'entity.public-view' | translate | async }}</ax-title>\n              <ax-button-item\n                *ngFor=\"let v of publicViews$ | async\"\n                [text]=\"v.title\"\n                [class.ax-bg-on-surface]=\"(view$ | async) == v\"\n                (onClick)=\"loader.setView(v.name)\"\n              ></ax-button-item>\n              <ax-title class=\"ax-font-bold ax-opacity-100\" *ngIf=\"hasCustomViews$ | async\">Created by me</ax-title>\n              <ax-button-item\n                *ngFor=\"let v of customViews$ | async\"\n                [text]=\"v.title\"\n                [class.ax-bg-on-surface]=\"(view$ | async) == v\"\n                (onClick)=\"loader.setView(v.name)\"\n              ></ax-button-item>\n              <ng-container *feature=\"'axp-entity-list-custom-view'\">\n                <ax-divider></ax-divider>\n                <ax-button-item (onClick)=\"addCustomViewPopup()\" text=\"Add Custom View\" class=\"ax-font-semibold ax-text-primary\"></ax-button-item>\n              </ng-container>\n            </ax-button-item-list>\n          </ax-dropdown-panel>\n        </ax-button>\n        <div class=\"ax-flex ax-gap-2\">\n          @if(searchBoxTitle){\n          <ax-button (onClick)=\"toggleSearchBox()\" [disabled]=\"this.grid?.selectedRows?.length != 0\" color=\"ghost\">\n            <ax-icon class=\"fa-solid fa-search ax-text-neutral-400\"> </ax-icon>\n          </ax-button>\n          }\n          <ax-button [disabled]=\"this.grid?.selectedRows?.length != 0\" color=\"ghost\" (onClick)=\"columnsDrawer.open()\">\n            <ax-icon class=\"fa-solid fa-bars ax-text-neutral-400\"> </ax-icon>\n          </ax-button>\n          <ax-button [disabled]=\"this.grid?.selectedRows?.length != 0\" color=\"ghost\" (onClick)=\"conditionsDrawer.open()\">\n            <ax-icon class=\"fa-solid fa-sliders ax-text-neutral-400\"> </ax-icon>\n            @if ((conditionsCount$ | async)) {\n            <ax-suffix>\n              <ax-badge [color]=\"'primary'\"></ax-badge>\n            </ax-suffix>\n            }\n          </ax-button>\n          <ax-button [disabled]=\"this.grid?.selectedRows?.length != 0\" color=\"ghost\" (onClick)=\"sortsDrawer.open()\">\n            <ax-icon class=\"fa-solid fa-bars-sort ax-text-neutral-400\"> </ax-icon>\n            @if ((sortCount$ | async)) {\n            <ax-suffix>\n              <ax-badge [color]=\"'primary'\"></ax-badge>\n            </ax-suffix>\n            }\n          </ax-button>\n        </div>\n      </div>\n      <div [class.collapsed-search-box]=\"searchBoxCollapsed\" class=\"ax-transition-all ax-mt-4\">\n        <ax-search-box [title]=\"searchBoxTitle\" [placeholder]=\"('widget.lookup.search' | translate | async) + searchBoxPlaceholder\"\n          ><ax-clear-button></ax-clear-button\n        ></ax-search-box>\n      </div>\n      } @else {\n      <div class=\"ax-flex ax-items-center ax-justify-between ax-gap-3\">\n        <div class=\"ax-text-xl md:ax-text-3xl ax-font-bold ax-mb-2\">{{ title }}</div>\n        @if(this.grid?.selectedRows?.length==0){\n        <div class=\"ax-flex ax-gap-3\">\n          @if(canCreate) {\n          <ax-button [text]=\"'create-new' | translate | async\" color=\"primary\" (onClick)=\"handleCreateClick()\">\n            <ax-prefix>\n              <i class=\"fa-solid fa-add\"></i>\n            </ax-prefix>\n          </ax-button>\n          }\n          <ax-button [text]=\"'Actions' | translate | async\" color=\"ghost\">\n            <ax-prefix>\n              <i class=\"fa-solid fa-ellipsis-vertical\"></i>\n            </ax-prefix>\n            <ax-dropdown-panel [adaptivityEnabled]=\"true\">\n              <ax-button-item-list>\n                @if(canImport){\n                <ax-button-item (onClick)=\"handleImportClick()\" text=\"Import\" class=\"ax-font-semibold\">\n                  <ax-prefix>\n                    <ax-icon icon=\"fa-solid fa-file-import\"> </ax-icon>\n                  </ax-prefix>\n                </ax-button-item>\n                }\n                <ax-button-item text=\"Export\" class=\"ax-font-semibold\">\n                  <ax-prefix>\n                    <ax-icon icon=\"fa-solid fa-file-export\"> </ax-icon>\n                  </ax-prefix>\n                </ax-button-item>\n              </ax-button-item-list>\n            </ax-dropdown-panel>\n          </ax-button>\n        </div>\n        }@else {\n        <div class=\"ax-flex ax-gap-3\">\n          @if(canDelete) {\n          <ax-button text=\"Delete Items\" color=\"danger\" (onClick)=\"handleCommandClick('delete')\">\n            <ax-prefix>\n              <i class=\"fa-solid fa-trash\"></i>\n            </ax-prefix>\n          </ax-button>\n          }\n          <ax-button [text]=\"'Actions' | translate | async\" color=\"ghost\">\n            <ax-prefix>\n              <i class=\"fa-solid fa-ellipsis-vertical\"></i>\n            </ax-prefix>\n          </ax-button>\n        </div>\n        }\n      </div>\n      <div class=\"ax-flex ax-items-center ax-justify-between\">\n        <!-----------------------  View Mode   --------------------->\n        @if(this.grid?.selectedRows?.length==0) {\n        <div class=\"ax-flex ax-w-full ax-justify-between ax-gap-3\">\n          <div class=\"ax-flex ax-gap-3\">\n            <ax-button [text]=\"(view$ | async)?.title\" #views color=\"ghost\">\n              <ax-prefix>\n                <i class=\"fa-solid fa-eye\"></i>\n              </ax-prefix>\n              <ax-suffix>\n                <i class=\"fa-solid fa-caret-down\"></i>\n              </ax-suffix>\n              <ax-dropdown-panel [adaptivityEnabled]=\"true\">\n                <ax-button-item-list class=\"ax-bg-surface\">\n                  <ax-title class=\"ax-font-bold ax-opacity-100\">{{ 'entity.public-view' | translate | async }}</ax-title>\n                  <ax-button-item\n                    *ngFor=\"let v of publicViews$ | async\"\n                    [text]=\"v.title\"\n                    [class.ax-bg-on-surface]=\"(view$ | async) == v\"\n                    (onClick)=\"loader.setView(v.name)\"\n                  ></ax-button-item>\n                  <ax-title class=\"ax-font-bold ax-opacity-100\" *ngIf=\"hasCustomViews$ | async\">Created by me</ax-title>\n                  <ax-button-item\n                    class=\"ax-pe-4 ax-flex ax-justify-between\"\n                    *ngFor=\"let v of customViews$ | async\"\n                    [text]=\"v.title\"\n                    [class.ax-bg-on-surface]=\"(view$ | async) == v\"\n                    (onClick)=\"loader.setView(v.name)\"\n                  >\n                    <ax-suffix>\n                      <ax-button (onClick)=\"updateViewPopup($event, v)\" class=\"ax-xs\" look=\"none\">\n                        <ax-icon class=\"far fa-edit\"> </ax-icon>\n                      </ax-button>\n                    </ax-suffix>\n                  </ax-button-item>\n                  <ng-container *feature=\"'axp-entity-list-custom-view'\">\n                    <ax-divider></ax-divider>\n                    <ax-button-item text=\"Add Custom View\" (onClick)=\"addCustomViewPopup()\" class=\"ax-font-semibold ax-text-primary\"></ax-button-item>\n                  </ng-container>\n                </ax-button-item-list>\n              </ax-dropdown-panel>\n            </ax-button>\n            @if(searchBoxTitle){\n            <div class=\"ax-w-72\">\n              <ax-search-box\n                [title]=\"searchBoxTitle\"\n                [(ngModel)]=\"searchValue\"\n                (onValueChanged)=\"handleChangeSearchValue($event)\"\n                [placeholder]=\"('widget.lookup.search' | translate | async) + searchBoxPlaceholder\"\n                ><ax-clear-button></ax-clear-button\n              ></ax-search-box>\n            </div>\n            }\n          </div>\n\n          <div class=\"ax-flex ax-gap-3\">\n            <ax-button [text]=\"'entity.columns' | translate | async\" color=\"ghost\" #columns (onClick)=\"columnsDrawer.open()\">\n              <ax-prefix>\n                <i class=\"fa-solid fa-bars\"></i>\n              </ax-prefix>\n              <ax-suffix>\n                <ax-badge text=\"{{ columnsCount$ | async }}\" color=\"primary\"></ax-badge>\n              </ax-suffix>\n            </ax-button>\n            <ax-button text=\"Filters\" color=\"ghost\" (onClick)=\"conditionsDrawer.open()\" #conditions>\n              <ax-prefix>\n                <i class=\"fa-solid fa-sliders\"></i>\n              </ax-prefix>\n              <ax-suffix>\n                <ax-badge text=\"{{ conditionsCount$ | async }}\" color=\"primary\"></ax-badge>\n              </ax-suffix>\n            </ax-button>\n            <ax-button [text]=\"'entity.sort' | translate | async\" color=\"ghost\" (onClick)=\"sortsDrawer.open()\">\n              <ax-prefix>\n                <i class=\"fa-solid fa-bars-sort\"></i>\n              </ax-prefix>\n              <ax-suffix *ngIf=\"(sortCount$ | async)! > 0\">\n                <ax-badge text=\"{{ sortCount$ | async }}\" color=\"primary\"></ax-badge>\n              </ax-suffix>\n            </ax-button>\n          </div>\n        </div>\n\n        } @else{\n        <!-----------------------  Selection Mode   --------------------->\n        <div>\n          <div class=\"ax-flex ax-gap-3 ax-items-center ax-h-10\">\n            <span class=\"ax-text-xl ax-font-bold\"> {{ this.grid?.selectedRows?.length }} Items Selected </span>\n            <span (click)=\"clearSelectedItems()\" class=\"ax-text-sm ax-text-primary dark:ax-text-primary-300 ax-underline ax-cursor-pointer\"\n              >Clear Items</span\n            >\n          </div>\n        </div>\n        }\n      </div>\n      }\n    </div>\n    <div class=\"ax-flex-1 ax-px-6 ax-py-4 ax-flex ax-overflow-auto\">\n      <ax-data-table\n        #grid\n        [showFooter]=\"false\"\n        class=\"ax-flex-1\"\n        [dataSource]=\"dataSource\"\n        [paging]=\"true\"\n        [fetchDataMode]=\"'manual'\"\n        (onRowDbClick)=\"handleRowDbClick($event)\"\n        [loading]=\"{ enabled: true, animation: true }\"\n      >\n        <!-- <ax-index-column *ngIf=\"!platform.is('SM')\" [width]=\"'85px'\"></ax-index-column> -->\n        <ax-select-column fixed=\"start\" [width]=\"'50px'\"></ax-select-column>\n        @for(col of (columns$ | async);track col.name) {\n        <axp-widget-column-renderer\n          *ngIf=\"col.visible\"\n          [schema]=\"col.schema\"\n          [dataField]=\"col.name\"\n          [caption]=\"col.title\"\n          [options]=\"col.options\"\n          [displayFormat]=\"col.displayFormat\"\n          [width]=\"'180px'\"\n          [allowSorting]=\"false\"\n        >\n        </axp-widget-column-renderer>\n        }\n        <ax-dropdown-command-column\n          fixed=\"end\"\n          [width]=\"'60px'\"\n          [items]=\"getDropdownRowItems\"\n          (onItemClick)=\"handleRowCommandClick($event)\"\n        ></ax-dropdown-command-column>\n        <ax-command-column fixed=\"end\" [width]=\"'60px'\" [items]=\"getInlineRowItems\" (onItemClick)=\"handleRowCommandClick($event)\"></ax-command-column>\n      </ax-data-table>\n    </div>\n  </ax-content>\n  <ax-drawer (collapsedChange)=\"closeDrawer('columns', $event)\" #columnsDrawer location=\"end\" [mode]=\"'overlay'\">\n    <ax-content class=\"ax-w-[85vw] md:ax-w-[45vw] lg:ax-w-[35vw] 2xl:ax-w-[20vw] ax-border-e\">\n      <axp-list-view-option-columns [loader]=\"loader\" (onClosed)=\"columnsDrawer.close()\"></axp-list-view-option-columns>\n    </ax-content>\n  </ax-drawer>\n  <ax-drawer (collapsedChange)=\"closeDrawer('conditions', $event)\" #conditionsDrawer location=\"end\" [mode]=\"'overlay'\">\n    <ax-content class=\"ax-w-[85vw] md:ax-w-[45vw] lg:ax-w-[35vw] 2xl:ax-w-[25vw] ax-border-e\">\n      <axp-list-view-option-conditions [loader]=\"loader\" (onClosed)=\"conditionsDrawer.close()\"></axp-list-view-option-conditions>\n    </ax-content>\n  </ax-drawer>\n  <ax-drawer (collapsedChange)=\"closeDrawer('sorts', $event)\" #sortsDrawer location=\"end\" [mode]=\"'overlay'\">\n    <ax-content class=\"ax-w-[85vw] md:ax-w-[45vw] lg:ax-w-[35vw] 2xl:ax-w-[20vw] ax-border-e\">\n      <axp-list-view-option-sorting (onClosed)=\"sortsDrawer.close()\" [loader]=\"loader\"></axp-list-view-option-sorting>\n    </ax-content>\n  </ax-drawer>\n</ax-drawer-container>\n", styles: [".cdk-drag-preview{border-radius:.375rem;border-width:1px;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);background:rgba(var(--ax-color-on-surface));padding:.5rem;height:max-content!important}.collapsed-search-box{margin-top:0;height:0px;opacity:0}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6$1.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "rowTemplate", "emptyTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged"] }, { kind: "component", type: i6$1.AXRowSelectColumnComponent, selector: "ax-select-column", inputs: ["width", "caption", "fixed"] }, { kind: "component", type: i6$1.AXRowCommandColumnComponent, selector: "ax-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "items"], outputs: ["onItemClick"] }, { kind: "component", type: i6$1.AXRowDropdownCommandColumnComponent, selector: "ax-dropdown-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "items"], outputs: ["onItemClick"] }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "responsiveOn", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "responsiveOnChange", "loadingTextChange"] }, { kind: "component", type: i4.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i4.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i5.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "component", type: i10$2.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i11$1.AXDrawerComponent, selector: "ax-drawer", inputs: ["location", "showBackdrop", "mode", "collapsed"], outputs: ["locationChange", "modeChange", "collapsedChange"] }, { kind: "component", type: i11$1.AXDrawerContainerComponent, selector: "ax-drawer-container" }, { kind: "component", type: i12.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "delayTime"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: i10$1.AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: ["width", "caption", "headerTemplate", "allowSorting", "fixed", "footerTemplate", "cellTemplate", "options", "dataField", "displayFormat", "schema"] }, { kind: "directive", type: i14$1.AXPFeatureDirective, selector: "[feature]", inputs: ["feature", "featureElse"] }, { kind: "component", type: AXPListViewOptionsColumnsComponent, selector: "axp-list-view-option-columns", inputs: ["loader"], outputs: ["onClosed"] }, { kind: "component", type: AXPListViewOptionConditionsComponent, selector: "axp-list-view-option-conditions", inputs: ["loader"], outputs: ["onClosed"] }, { kind: "component", type: AXPListViewOptionSortingComponent, selector: "axp-list-view-option-sorting", inputs: ["loader"], outputs: ["onClosed"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i8$1.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityListViewComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityListViewComponent, decorators: [{
             type: Component,
             args: [{ encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [AXUnsubscriber], template: "<ax-drawer-container>\n  <!-- <ax-drawer #drawer location=\"start\" [collapsed]=\"true\" [mode]=\"platform.is('SM') ? 'overlay' : 'push'\">\n    <ax-content class=\"ax-w-64 ax-border-e\">\n      <div class=\"ax-p-6 ax-py-4 ax-gap-6 ax-flex ax-flex-col\">\n        <p class=\"ax-text-2xl ax-font-bold\">Folders</p>\n        <ax-side-menu>\n          <ng-container *ngFor=\"let node of menuItems\" [ngTemplateOutlet]=\"sideMenu\"\n            [ngTemplateOutletContext]=\"{ $implicit: node }\">\n          </ng-container>\n        </ax-side-menu>\n        <ng-template #sideMenu let-item>\n          <ax-side-menu-item [text]=\"item.text\">\n            <ax-prefix>\n              <ax-icon class=\"fa-solid fa-folder ax-text-warning-500\"></ax-icon>\n            </ax-prefix>\n            <ng-container *ngIf=\"item.children\">\n              <ng-container *ngFor=\"let child of item.children\" [ngTemplateOutlet]=\"sideMenu\"\n                [ngTemplateOutletContext]=\"{ $implicit: child }\">\n              </ng-container>\n            </ng-container>\n          </ax-side-menu-item>\n        </ng-template>\n      </div>\n    </ax-content>\n  </ax-drawer> -->\n  <ax-content class=\"ax-flex ax-flex-col ax-overflow-hidden\">\n    <div\n      class=\"ax-flex ax-flex-col ax-gap-0 md:ax-gap-4 ax-px-4 ax-py-3 md:ax-py-4 md:ax-px-6 ax-bg-surface ax-border-b md:ax-border-0 md:ax-bg-default\"\n    >\n      @if(platform.is('MD')){\n      <div class=\"ax-flex ax-justify-between ax-mb-4\">\n        @if(this.grid?.selectedRows?.length==0){\n        <div class=\"ax-text-xl ax-font-bold\">{{ title }}</div>\n        <div class=\"ax-flex ax-items-center ax-gap-2\">\n          @if(canCreate) {\n          <ax-button color=\"primary\" class=\"ax-sm\" (onClick)=\"handleCreateClick()\">\n            <ax-icon class=\"fa-solid fa-add\"></ax-icon>\n          </ax-button>\n          }\n          <ax-button color=\"ghost\" class=\"ax-sm\" #more>\n            <ax-icon class=\"fa-solid fa-ellipsis-vertical\"> </ax-icon>\n            <ax-dropdown-panel [adaptivityEnabled]=\"true\">\n              <ax-button-item-list>\n                <ax-button-item text=\"Export\" class=\"ax-font-semibold\">\n                  <ax-prefix>\n                    <ax-icon icon=\"fa-solid fa-file-export\"> </ax-icon>\n                  </ax-prefix>\n                </ax-button-item>\n              </ax-button-item-list>\n            </ax-dropdown-panel>\n          </ax-button>\n        </div>\n        }@else {\n        <div class=\"ax-flex ax-items-center ax-gap-3\">\n          <span class=\"ax-text-xl ax-font-bold\"> {{ this.grid?.selectedRows?.length }} Items Selected </span>\n          <span (click)=\"clearSelectedItems()\" class=\"ax-text-sm ax-text-primary dark:ax-text-primary-300 ax-underline ax-cursor-pointer\"\n            >Clear Items</span\n          >\n        </div>\n        <div class=\"ax-flex ax-items-center ax-gap-2\">\n          @if(canDelete) {\n          <ax-button color=\"danger\" class=\"ax-sm\" (onClick)=\"handleCommandClick('delete')\">\n            <ax-icon class=\"fa-solid fa-trash\"> </ax-icon>\n          </ax-button>\n          }\n          <ax-button color=\"ghost\" class=\"ax-sm\" #more>\n            <ax-icon class=\"fa-solid fa-ellipsis-vertical\"> </ax-icon>\n          </ax-button>\n        </div>\n        }\n      </div>\n\n      <div class=\"ax-flex ax-items-center ax-justify-between\">\n        <ax-button [disabled]=\"this.grid?.selectedRows?.length != 0\" [text]=\"(view$ | async)?.title\" color=\"ghost\">\n          <ax-icon class=\"fa-solid fa-eye ax-text-neutral-400\"> </ax-icon>\n          <ax-suffix>\n            <i class=\"fa-solid fa-caret-down\"></i>\n          </ax-suffix>\n          <ax-dropdown-panel [adaptivityEnabled]=\"true\">\n            <ax-button-item-list class=\"ax-bg-surface\">\n              <ax-title class=\"ax-font-bold ax-opacity-100\">{{ 'entity.public-view' | translate | async }}</ax-title>\n              <ax-button-item\n                *ngFor=\"let v of publicViews$ | async\"\n                [text]=\"v.title\"\n                [class.ax-bg-on-surface]=\"(view$ | async) == v\"\n                (onClick)=\"loader.setView(v.name)\"\n              ></ax-button-item>\n              <ax-title class=\"ax-font-bold ax-opacity-100\" *ngIf=\"hasCustomViews$ | async\">Created by me</ax-title>\n              <ax-button-item\n                *ngFor=\"let v of customViews$ | async\"\n                [text]=\"v.title\"\n                [class.ax-bg-on-surface]=\"(view$ | async) == v\"\n                (onClick)=\"loader.setView(v.name)\"\n              ></ax-button-item>\n              <ng-container *feature=\"'axp-entity-list-custom-view'\">\n                <ax-divider></ax-divider>\n                <ax-button-item (onClick)=\"addCustomViewPopup()\" text=\"Add Custom View\" class=\"ax-font-semibold ax-text-primary\"></ax-button-item>\n              </ng-container>\n            </ax-button-item-list>\n          </ax-dropdown-panel>\n        </ax-button>\n        <div class=\"ax-flex ax-gap-2\">\n          @if(searchBoxTitle){\n          <ax-button (onClick)=\"toggleSearchBox()\" [disabled]=\"this.grid?.selectedRows?.length != 0\" color=\"ghost\">\n            <ax-icon class=\"fa-solid fa-search ax-text-neutral-400\"> </ax-icon>\n          </ax-button>\n          }\n          <ax-button [disabled]=\"this.grid?.selectedRows?.length != 0\" color=\"ghost\" (onClick)=\"columnsDrawer.open()\">\n            <ax-icon class=\"fa-solid fa-bars ax-text-neutral-400\"> </ax-icon>\n          </ax-button>\n          <ax-button [disabled]=\"this.grid?.selectedRows?.length != 0\" color=\"ghost\" (onClick)=\"conditionsDrawer.open()\">\n            <ax-icon class=\"fa-solid fa-sliders ax-text-neutral-400\"> </ax-icon>\n            @if ((conditionsCount$ | async)) {\n            <ax-suffix>\n              <ax-badge [color]=\"'primary'\"></ax-badge>\n            </ax-suffix>\n            }\n          </ax-button>\n          <ax-button [disabled]=\"this.grid?.selectedRows?.length != 0\" color=\"ghost\" (onClick)=\"sortsDrawer.open()\">\n            <ax-icon class=\"fa-solid fa-bars-sort ax-text-neutral-400\"> </ax-icon>\n            @if ((sortCount$ | async)) {\n            <ax-suffix>\n              <ax-badge [color]=\"'primary'\"></ax-badge>\n            </ax-suffix>\n            }\n          </ax-button>\n        </div>\n      </div>\n      <div [class.collapsed-search-box]=\"searchBoxCollapsed\" class=\"ax-transition-all ax-mt-4\">\n        <ax-search-box [title]=\"searchBoxTitle\" [placeholder]=\"('widget.lookup.search' | translate | async) + searchBoxPlaceholder\"\n          ><ax-clear-button></ax-clear-button\n        ></ax-search-box>\n      </div>\n      } @else {\n      <div class=\"ax-flex ax-items-center ax-justify-between ax-gap-3\">\n        <div class=\"ax-text-xl md:ax-text-3xl ax-font-bold ax-mb-2\">{{ title }}</div>\n        @if(this.grid?.selectedRows?.length==0){\n        <div class=\"ax-flex ax-gap-3\">\n          @if(canCreate) {\n          <ax-button [text]=\"'create-new' | translate | async\" color=\"primary\" (onClick)=\"handleCreateClick()\">\n            <ax-prefix>\n              <i class=\"fa-solid fa-add\"></i>\n            </ax-prefix>\n          </ax-button>\n          }\n          <ax-button [text]=\"'Actions' | translate | async\" color=\"ghost\">\n            <ax-prefix>\n              <i class=\"fa-solid fa-ellipsis-vertical\"></i>\n            </ax-prefix>\n            <ax-dropdown-panel [adaptivityEnabled]=\"true\">\n              <ax-button-item-list>\n                @if(canImport){\n                <ax-button-item (onClick)=\"handleImportClick()\" text=\"Import\" class=\"ax-font-semibold\">\n                  <ax-prefix>\n                    <ax-icon icon=\"fa-solid fa-file-import\"> </ax-icon>\n                  </ax-prefix>\n                </ax-button-item>\n                }\n                <ax-button-item text=\"Export\" class=\"ax-font-semibold\">\n                  <ax-prefix>\n                    <ax-icon icon=\"fa-solid fa-file-export\"> </ax-icon>\n                  </ax-prefix>\n                </ax-button-item>\n              </ax-button-item-list>\n            </ax-dropdown-panel>\n          </ax-button>\n        </div>\n        }@else {\n        <div class=\"ax-flex ax-gap-3\">\n          @if(canDelete) {\n          <ax-button text=\"Delete Items\" color=\"danger\" (onClick)=\"handleCommandClick('delete')\">\n            <ax-prefix>\n              <i class=\"fa-solid fa-trash\"></i>\n            </ax-prefix>\n          </ax-button>\n          }\n          <ax-button [text]=\"'Actions' | translate | async\" color=\"ghost\">\n            <ax-prefix>\n              <i class=\"fa-solid fa-ellipsis-vertical\"></i>\n            </ax-prefix>\n          </ax-button>\n        </div>\n        }\n      </div>\n      <div class=\"ax-flex ax-items-center ax-justify-between\">\n        <!-----------------------  View Mode   --------------------->\n        @if(this.grid?.selectedRows?.length==0) {\n        <div class=\"ax-flex ax-w-full ax-justify-between ax-gap-3\">\n          <div class=\"ax-flex ax-gap-3\">\n            <ax-button [text]=\"(view$ | async)?.title\" #views color=\"ghost\">\n              <ax-prefix>\n                <i class=\"fa-solid fa-eye\"></i>\n              </ax-prefix>\n              <ax-suffix>\n                <i class=\"fa-solid fa-caret-down\"></i>\n              </ax-suffix>\n              <ax-dropdown-panel [adaptivityEnabled]=\"true\">\n                <ax-button-item-list class=\"ax-bg-surface\">\n                  <ax-title class=\"ax-font-bold ax-opacity-100\">{{ 'entity.public-view' | translate | async }}</ax-title>\n                  <ax-button-item\n                    *ngFor=\"let v of publicViews$ | async\"\n                    [text]=\"v.title\"\n                    [class.ax-bg-on-surface]=\"(view$ | async) == v\"\n                    (onClick)=\"loader.setView(v.name)\"\n                  ></ax-button-item>\n                  <ax-title class=\"ax-font-bold ax-opacity-100\" *ngIf=\"hasCustomViews$ | async\">Created by me</ax-title>\n                  <ax-button-item\n                    class=\"ax-pe-4 ax-flex ax-justify-between\"\n                    *ngFor=\"let v of customViews$ | async\"\n                    [text]=\"v.title\"\n                    [class.ax-bg-on-surface]=\"(view$ | async) == v\"\n                    (onClick)=\"loader.setView(v.name)\"\n                  >\n                    <ax-suffix>\n                      <ax-button (onClick)=\"updateViewPopup($event, v)\" class=\"ax-xs\" look=\"none\">\n                        <ax-icon class=\"far fa-edit\"> </ax-icon>\n                      </ax-button>\n                    </ax-suffix>\n                  </ax-button-item>\n                  <ng-container *feature=\"'axp-entity-list-custom-view'\">\n                    <ax-divider></ax-divider>\n                    <ax-button-item text=\"Add Custom View\" (onClick)=\"addCustomViewPopup()\" class=\"ax-font-semibold ax-text-primary\"></ax-button-item>\n                  </ng-container>\n                </ax-button-item-list>\n              </ax-dropdown-panel>\n            </ax-button>\n            @if(searchBoxTitle){\n            <div class=\"ax-w-72\">\n              <ax-search-box\n                [title]=\"searchBoxTitle\"\n                [(ngModel)]=\"searchValue\"\n                (onValueChanged)=\"handleChangeSearchValue($event)\"\n                [placeholder]=\"('widget.lookup.search' | translate | async) + searchBoxPlaceholder\"\n                ><ax-clear-button></ax-clear-button\n              ></ax-search-box>\n            </div>\n            }\n          </div>\n\n          <div class=\"ax-flex ax-gap-3\">\n            <ax-button [text]=\"'entity.columns' | translate | async\" color=\"ghost\" #columns (onClick)=\"columnsDrawer.open()\">\n              <ax-prefix>\n                <i class=\"fa-solid fa-bars\"></i>\n              </ax-prefix>\n              <ax-suffix>\n                <ax-badge text=\"{{ columnsCount$ | async }}\" color=\"primary\"></ax-badge>\n              </ax-suffix>\n            </ax-button>\n            <ax-button text=\"Filters\" color=\"ghost\" (onClick)=\"conditionsDrawer.open()\" #conditions>\n              <ax-prefix>\n                <i class=\"fa-solid fa-sliders\"></i>\n              </ax-prefix>\n              <ax-suffix>\n                <ax-badge text=\"{{ conditionsCount$ | async }}\" color=\"primary\"></ax-badge>\n              </ax-suffix>\n            </ax-button>\n            <ax-button [text]=\"'entity.sort' | translate | async\" color=\"ghost\" (onClick)=\"sortsDrawer.open()\">\n              <ax-prefix>\n                <i class=\"fa-solid fa-bars-sort\"></i>\n              </ax-prefix>\n              <ax-suffix *ngIf=\"(sortCount$ | async)! > 0\">\n                <ax-badge text=\"{{ sortCount$ | async }}\" color=\"primary\"></ax-badge>\n              </ax-suffix>\n            </ax-button>\n          </div>\n        </div>\n\n        } @else{\n        <!-----------------------  Selection Mode   --------------------->\n        <div>\n          <div class=\"ax-flex ax-gap-3 ax-items-center ax-h-10\">\n            <span class=\"ax-text-xl ax-font-bold\"> {{ this.grid?.selectedRows?.length }} Items Selected </span>\n            <span (click)=\"clearSelectedItems()\" class=\"ax-text-sm ax-text-primary dark:ax-text-primary-300 ax-underline ax-cursor-pointer\"\n              >Clear Items</span\n            >\n          </div>\n        </div>\n        }\n      </div>\n      }\n    </div>\n    <div class=\"ax-flex-1 ax-px-6 ax-py-4 ax-flex ax-overflow-auto\">\n      <ax-data-table\n        #grid\n        [showFooter]=\"false\"\n        class=\"ax-flex-1\"\n        [dataSource]=\"dataSource\"\n        [paging]=\"true\"\n        [fetchDataMode]=\"'manual'\"\n        (onRowDbClick)=\"handleRowDbClick($event)\"\n        [loading]=\"{ enabled: true, animation: true }\"\n      >\n        <!-- <ax-index-column *ngIf=\"!platform.is('SM')\" [width]=\"'85px'\"></ax-index-column> -->\n        <ax-select-column fixed=\"start\" [width]=\"'50px'\"></ax-select-column>\n        @for(col of (columns$ | async);track col.name) {\n        <axp-widget-column-renderer\n          *ngIf=\"col.visible\"\n          [schema]=\"col.schema\"\n          [dataField]=\"col.name\"\n          [caption]=\"col.title\"\n          [options]=\"col.options\"\n          [displayFormat]=\"col.displayFormat\"\n          [width]=\"'180px'\"\n          [allowSorting]=\"false\"\n        >\n        </axp-widget-column-renderer>\n        }\n        <ax-dropdown-command-column\n          fixed=\"end\"\n          [width]=\"'60px'\"\n          [items]=\"getDropdownRowItems\"\n          (onItemClick)=\"handleRowCommandClick($event)\"\n        ></ax-dropdown-command-column>\n        <ax-command-column fixed=\"end\" [width]=\"'60px'\" [items]=\"getInlineRowItems\" (onItemClick)=\"handleRowCommandClick($event)\"></ax-command-column>\n      </ax-data-table>\n    </div>\n  </ax-content>\n  <ax-drawer (collapsedChange)=\"closeDrawer('columns', $event)\" #columnsDrawer location=\"end\" [mode]=\"'overlay'\">\n    <ax-content class=\"ax-w-[85vw] md:ax-w-[45vw] lg:ax-w-[35vw] 2xl:ax-w-[20vw] ax-border-e\">\n      <axp-list-view-option-columns [loader]=\"loader\" (onClosed)=\"columnsDrawer.close()\"></axp-list-view-option-columns>\n    </ax-content>\n  </ax-drawer>\n  <ax-drawer (collapsedChange)=\"closeDrawer('conditions', $event)\" #conditionsDrawer location=\"end\" [mode]=\"'overlay'\">\n    <ax-content class=\"ax-w-[85vw] md:ax-w-[45vw] lg:ax-w-[35vw] 2xl:ax-w-[25vw] ax-border-e\">\n      <axp-list-view-option-conditions [loader]=\"loader\" (onClosed)=\"conditionsDrawer.close()\"></axp-list-view-option-conditions>\n    </ax-content>\n  </ax-drawer>\n  <ax-drawer (collapsedChange)=\"closeDrawer('sorts', $event)\" #sortsDrawer location=\"end\" [mode]=\"'overlay'\">\n    <ax-content class=\"ax-w-[85vw] md:ax-w-[45vw] lg:ax-w-[35vw] 2xl:ax-w-[20vw] ax-border-e\">\n      <axp-list-view-option-sorting (onClosed)=\"sortsDrawer.close()\" [loader]=\"loader\"></axp-list-view-option-sorting>\n    </ax-content>\n  </ax-drawer>\n</ax-drawer-container>\n", styles: [".cdk-drag-preview{border-radius:.375rem;border-width:1px;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);background:rgba(var(--ax-color-on-surface));padding:.5rem;height:max-content!important}.collapsed-search-box{margin-top:0;height:0px;opacity:0}\n"] }]
         }], ctorParameters: () => [{ type: i1$2.AXActionSheetService }, { type: i2.AXUnsubscriber }, { type: i3.AXPlatform }, { type: i0.ChangeDetectorRef }], propDecorators: { viewsTemplate: [{
@@ -1178,8 +1178,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
             }] } });
 
 class AXPListViewModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewModule, declarations: [AXPEntityListViewComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewModule, declarations: [AXPEntityListViewComponent,
             AXPEntityCreateCustomViewComponent,
             AXPListViewOptionsColumnsComponent,
             AXPListViewOptionConditionsComponent,
@@ -1220,7 +1220,7 @@ class AXPListViewModule {
             AXPCommonWidgetModule,
             AXPAuthModule,
             AXTranslationModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewModule, imports: [CommonModule,
             FormsModule,
             AXCommonModule,
             AXDataTableModule,
@@ -1252,7 +1252,7 @@ class AXPListViewModule {
             AXPAuthModule,
             AXTranslationModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
@@ -1625,10 +1625,10 @@ class AXPListViewLoaderFactory {
         this.layout.setNavigationLoading(false);
         return result;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewLoaderFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewLoaderFactory, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewLoaderFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewLoaderFactory, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPListViewLoaderFactory, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPListViewLoaderFactory, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -1686,10 +1686,10 @@ class AXPEntityQuickViewComponent extends AXBasePageComponent {
                 break;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityQuickViewComponent, deps: [{ token: i1$3.Actions }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXPEntityQuickViewComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class=\"ax-flex ax-flex-col ax-gap-6 ax-p-4\">\n  <div class=\"ax-flex ax-flex-col ax-gap-2\" *ngIf=\"root.properties?.length\">\n    <div *ngFor=\"let p of getProperties(root.properties)\"\n      class=\"ax-flex ax-p-4 odd:ax-bg-on-surface odd:ax-border-t odd:ax-border-b\">\n      <div class=\"ax-min-w-[10rem] ax-text-gray-500\">\n        <span>{{ p.title }}</span>\n      </div>\n      <div class=\"ax-min-w-[30rem]\">\n        <axp-widget-renderer [schema]=\"p.schema\" [context]=\"data\" [prop]=\"p\"></axp-widget-renderer>\n      </div>\n    </div>\n  </div>\n  <div *ngFor=\"let s of root.sections\"\n    class=\"ax-flex ax-flex-col ax-pb-3 last-of-type:ax-border-none last-of-type:ax-pb-3\">\n    <div class=\"ax-pb-4\">\n      <span class=\"ax-font-bold\">{{ s.title }}</span>\n    </div>\n    <div class=\"ax-flex ax-flex-col\">\n      <div *ngFor=\"let p of getProperties(s.properties)\"\n        class=\"ax-flex ax-flex-col md:ax-flex-row ax-p-3 odd:ax-bg-on-surface odd:ax-border-t odd:ax-border-b\">\n        @if (s.options?.showPropTitle!=false) {\n        <div class=\"ax-min-w-[10rem] ax-text-neutral-500 dark:ax-text-neutral-300 ax-mb-2 md:ax-mb-0\">\n          <span>{{ p.title }}</span>\n        </div>\n        }\n        <div class=\"md:ax-min-w-[30rem]\">\n          <axp-widget-renderer [schema]=\"p.schema\" [context]=\"data\" [prop]=\"p\" [mode]=\"'view'\"></axp-widget-renderer>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n<ax-footer>\n  <ax-prefix> </ax-prefix>\n  <ax-suffix>\n    <ax-dropdown-button text=\"Close\" (onClick)=\"handleCloseClick()\">\n      <ax-button-item-list>\n        <ax-button-item text=\"View Details\" (onClick)=\"handleCommandClick('details')\">\n          <ax-prefix>\n            <ax-icon icon=\"fa-solid fa-info-circle\"></ax-icon>\n          </ax-prefix>\n        </ax-button-item>\n        @if(canDelete)\n        {\n        <ax-button-item class=\"ax-text-danger\" text=\"Delete\" (onClick)=\"handleCommandClick('delete')\">\n          <ax-prefix> <ax-icon icon=\"fas fa-trash fa-flip-horizontal\"></ax-icon> </ax-prefix></ax-button-item>\n        }\n      </ax-button-item-list>\n    </ax-dropdown-button>\n  </ax-suffix>\n</ax-footer>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: AXPSchemaModule }, { kind: "component", type: i10$1.AXPWidgetRendererComponent, selector: "axp-widget-renderer", inputs: ["context", "prop", "mode", "schema"] }, { kind: "ngmodule", type: AXPCommonWidgetModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i4.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i4.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "component", type: i14.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityQuickViewComponent, deps: [{ token: i1$3.Actions }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: AXPEntityQuickViewComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class=\"ax-flex ax-flex-col ax-gap-6 ax-p-4\">\n  <div class=\"ax-flex ax-flex-col ax-gap-2\" *ngIf=\"root.properties?.length\">\n    <div *ngFor=\"let p of getProperties(root.properties)\"\n      class=\"ax-flex ax-p-4 odd:ax-bg-on-surface odd:ax-border-t odd:ax-border-b\">\n      <div class=\"ax-min-w-[10rem] ax-text-gray-500\">\n        <span>{{ p.title }}</span>\n      </div>\n      <div class=\"ax-min-w-[30rem]\">\n        <axp-widget-renderer [schema]=\"p.schema\" [context]=\"data\" [prop]=\"p\"></axp-widget-renderer>\n      </div>\n    </div>\n  </div>\n  <div *ngFor=\"let s of root.sections\"\n    class=\"ax-flex ax-flex-col ax-pb-3 last-of-type:ax-border-none last-of-type:ax-pb-3\">\n    <div class=\"ax-pb-4\">\n      <span class=\"ax-font-bold\">{{ s.title }}</span>\n    </div>\n    <div class=\"ax-flex ax-flex-col\">\n      <div *ngFor=\"let p of getProperties(s.properties)\"\n        class=\"ax-flex ax-flex-col md:ax-flex-row ax-p-3 odd:ax-bg-on-surface odd:ax-border-t odd:ax-border-b\">\n        @if (s.options?.showPropTitle!=false) {\n        <div class=\"ax-min-w-[10rem] ax-text-neutral-500 dark:ax-text-neutral-300 ax-mb-2 md:ax-mb-0\">\n          <span>{{ p.title }}</span>\n        </div>\n        }\n        <div class=\"md:ax-min-w-[30rem]\">\n          <axp-widget-renderer [schema]=\"p.schema\" [context]=\"data\" [prop]=\"p\" [mode]=\"'view'\"></axp-widget-renderer>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n<ax-footer>\n  <ax-prefix> </ax-prefix>\n  <ax-suffix>\n    <ax-dropdown-button text=\"Close\" (onClick)=\"handleCloseClick()\">\n      <ax-button-item-list>\n        <ax-button-item text=\"View Details\" (onClick)=\"handleCommandClick('details')\">\n          <ax-prefix>\n            <ax-icon icon=\"fa-solid fa-info-circle\"></ax-icon>\n          </ax-prefix>\n        </ax-button-item>\n        @if(canDelete)\n        {\n        <ax-button-item class=\"ax-text-danger\" text=\"Delete\" (onClick)=\"handleCommandClick('delete')\">\n          <ax-prefix> <ax-icon icon=\"fas fa-trash fa-flip-horizontal\"></ax-icon> </ax-prefix></ax-button-item>\n        }\n      </ax-button-item-list>\n    </ax-dropdown-button>\n  </ax-suffix>\n</ax-footer>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: AXPSchemaModule }, { kind: "component", type: i10$1.AXPWidgetRendererComponent, selector: "axp-widget-renderer", inputs: ["context", "prop", "mode", "schema"] }, { kind: "ngmodule", type: AXPCommonWidgetModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i4.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i4.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "component", type: i14.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityQuickViewComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityQuickViewComponent, decorators: [{
             type: Component,
             args: [{ encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, AXPSchemaModule, AXPCommonWidgetModule, AXDecoratorModule, AXButtonModule, AXDropdownModule, AXDropdownButtonModule], template: "<div class=\"ax-flex ax-flex-col ax-gap-6 ax-p-4\">\n  <div class=\"ax-flex ax-flex-col ax-gap-2\" *ngIf=\"root.properties?.length\">\n    <div *ngFor=\"let p of getProperties(root.properties)\"\n      class=\"ax-flex ax-p-4 odd:ax-bg-on-surface odd:ax-border-t odd:ax-border-b\">\n      <div class=\"ax-min-w-[10rem] ax-text-gray-500\">\n        <span>{{ p.title }}</span>\n      </div>\n      <div class=\"ax-min-w-[30rem]\">\n        <axp-widget-renderer [schema]=\"p.schema\" [context]=\"data\" [prop]=\"p\"></axp-widget-renderer>\n      </div>\n    </div>\n  </div>\n  <div *ngFor=\"let s of root.sections\"\n    class=\"ax-flex ax-flex-col ax-pb-3 last-of-type:ax-border-none last-of-type:ax-pb-3\">\n    <div class=\"ax-pb-4\">\n      <span class=\"ax-font-bold\">{{ s.title }}</span>\n    </div>\n    <div class=\"ax-flex ax-flex-col\">\n      <div *ngFor=\"let p of getProperties(s.properties)\"\n        class=\"ax-flex ax-flex-col md:ax-flex-row ax-p-3 odd:ax-bg-on-surface odd:ax-border-t odd:ax-border-b\">\n        @if (s.options?.showPropTitle!=false) {\n        <div class=\"ax-min-w-[10rem] ax-text-neutral-500 dark:ax-text-neutral-300 ax-mb-2 md:ax-mb-0\">\n          <span>{{ p.title }}</span>\n        </div>\n        }\n        <div class=\"md:ax-min-w-[30rem]\">\n          <axp-widget-renderer [schema]=\"p.schema\" [context]=\"data\" [prop]=\"p\" [mode]=\"'view'\"></axp-widget-renderer>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n<ax-footer>\n  <ax-prefix> </ax-prefix>\n  <ax-suffix>\n    <ax-dropdown-button text=\"Close\" (onClick)=\"handleCloseClick()\">\n      <ax-button-item-list>\n        <ax-button-item text=\"View Details\" (onClick)=\"handleCommandClick('details')\">\n          <ax-prefix>\n            <ax-icon icon=\"fa-solid fa-info-circle\"></ax-icon>\n          </ax-prefix>\n        </ax-button-item>\n        @if(canDelete)\n        {\n        <ax-button-item class=\"ax-text-danger\" text=\"Delete\" (onClick)=\"handleCommandClick('delete')\">\n          <ax-prefix> <ax-icon icon=\"fas fa-trash fa-flip-horizontal\"></ax-icon> </ax-prefix></ax-button-item>\n        }\n      </ax-button-item-list>\n    </ax-dropdown-button>\n  </ax-suffix>\n</ax-footer>" }]
         }], ctorParameters: () => [{ type: i1$3.Actions }] });
@@ -1753,10 +1753,10 @@ class AXPEntityModifyViewLoaderFactory {
         this.layout.setNavigationLoading(false);
         return Promise.reject('cannot fetch ');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityModifyViewLoaderFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityModifyViewLoaderFactory, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityModifyViewLoaderFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityModifyViewLoaderFactory, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityModifyViewLoaderFactory, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityModifyViewLoaderFactory, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -1775,7 +1775,7 @@ class AXPEntityModifyPopupAction extends AXPWorkflowAction {
         const { module, entity: entityName, section, id } = payload;
         const entity = await this.entityRegistery.resolve(module, entityName);
         const loader = await this.entityCreateFactory.create(module, entityName, id, section);
-        const com = await import('./acorex-platform-layouts-entity-modify-view.component-Bwz4yVpK.mjs');
+        const com = await import('./acorex-platform-layouts-entity-modify-view.component-CjofXJku.mjs');
         const popup = await this.popupService.open(com.AXPEntityModifyViewComponent, {
             title: `Modify ${payload.section.title}`,
             size: this.platform.is('Mobile') || this.platform.is('SM') ? 'full' : 'md',
@@ -1792,10 +1792,10 @@ class AXPEntityModifyPopupAction extends AXPWorkflowAction {
             context.setVariable('updatedData', cloneDeep(popup.data.context));
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityModifyPopupAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityModifyPopupAction }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityModifyPopupAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityModifyPopupAction }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityModifyPopupAction, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityModifyPopupAction, decorators: [{
             type: Injectable
         }] });
 class AXPEntityModifyConfirmedAction extends AXPWorkflowAction {
@@ -1878,10 +1878,10 @@ class AXPShowQuickViewAction extends AXPWorkflowAction {
             },
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPShowQuickViewAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPShowQuickViewAction }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPShowQuickViewAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPShowQuickViewAction }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPShowQuickViewAction, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPShowQuickViewAction, decorators: [{
             type: Injectable
         }] });
 const AXPShowQuickViewWorkflow = {
@@ -1909,10 +1909,10 @@ class AXPShowDetailViewAction extends AXPWorkflowAction {
         context.setVariable('payload', newPayload);
         this.navigation.execute(context);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPShowDetailViewAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPShowDetailViewAction }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPShowDetailViewAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPShowDetailViewAction }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPShowDetailViewAction, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPShowDetailViewAction, decorators: [{
             type: Injectable
         }] });
 const AXPShowDetailsViewWorkflow = {
@@ -1939,10 +1939,10 @@ class AXPShowListViewAction extends AXPWorkflowAction {
         context.setVariable('payload', newPayload);
         this.navigation.execute(context);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPShowListViewAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPShowListViewAction }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPShowListViewAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPShowListViewAction }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPShowListViewAction, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPShowListViewAction, decorators: [{
             type: Injectable
         }] });
 const AXPShowListViewWorkflow = {
@@ -2053,12 +2053,12 @@ class AXPEntityDetailsViewComponent {
                 break;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityDetailsViewComponent, deps: [{ token: i1$3.Actions }, { token: i2.AXUnsubscriber }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXPEntityDetailsViewComponent, isStandalone: true, selector: "ng-component", providers: [AXUnsubscriber], viewQueries: [{ propertyName: "drawer", first: true, predicate: ["drawer"], descendants: true }], ngImport: i0, template: "<ax-drawer-container>\n  <!-- <ax-drawer #drawer location=\"start\" [collapsed]=\"!(isOpen | async)\" [mode]=\" (isSM | async) ? 'overlay' : 'push'\"\n    *ngIf=\"loader.hasSections$ | async\" (collapsedChange)=\"handleCollapsedChange($event)\">\n    <ax-content class=\"ax-border-e ax-p-6 ax-w-64\">\n      <p class=\"ax-text-xl ax-font-bold ax-mb-6\">{{loader.sectionTitle}}</p>\n      <ax-tabs look=\"with-line\" location=\"start\">\n        @for(tab of (loader.sections$ | async); track tab.name)\n        {\n        <ax-tab-item [text]=\"tab.title\" [active]=\"isActive(tab)\" (onClick)=\"handleMenuClick($event,tab)\"\n          [disabled]=\"editForm.context\">\n        </ax-tab-item>\n        }\n      </ax-tabs>\n    </ax-content>\n  </ax-drawer> -->\n  <ax-content #content class=\"ax-overflow-x-hidden\">\n    <div class=\"ax-flex ax-flex-col ax-gap-4 ax-min-h-full ax-px-4 ax-pb-4 md:ax-px-6 ax-bg-surface ax-border-b md:ax-border-0 md:ax-bg-default\">\n      <div\n        class=\"ax-flex ax-flex-col ax-pt-4 ax-sticky ax-top-0 ax-z-10 ax-transition-all\"\n        #sticky=\"axpSticky\"\n        [axpSticky]=\"'ax-bg-surface ax-px-6 ax-py-3 -ax-mx-6 ax-shadow-xl'\"\n        [stickyParent]=\"content.getHostElement()\"\n      >\n        <!-------- Begin Toolbar  -------->\n        <div class=\"ax-flex ax-justify-between ax-items-center\">\n          <!-------- Begin Title  -------->\n          <div class=\"ax-flex ax-gap-1 ax-items-center\">\n            <!-- <ax-button class=\"lg:ax-hidden\">\n              <ax-icon class=\"fa-solid fa-chevron-left\"></ax-icon>\n            </ax-button> -->\n            <div class=\"ax-flex ax-flex-col ax-gap-2\">\n              <div class=\"ax-text-xl md:ax-text-3xl ax-font-bold\">{{ loader.title }}</div>\n              <!-- <ax-breadcrumbs class=\"child:ax-font-normal child:ax-text-neutral-400\">\n                <ng-template #divider>\n                  <i class=\"fa-solid fa-chevron-right ax-text-xs ax-mx-2\"></i>\n                </ng-template>\n                <ax-breadcrumbs-item>\n                  <a>Home</a>\n                </ax-breadcrumbs-item>\n                <ax-breadcrumbs-item>\n                  <a>{{ loader.entity.title }}</a>\n                </ax-breadcrumbs-item>\n                <ax-breadcrumbs-item [active]=\"true\" class=\"!ax-font-semibold !ax-text-neutral-600\">\n                  {{ loader.title }}\n                </ax-breadcrumbs-item>\n              </ax-breadcrumbs> -->\n            </div>\n          </div>\n          <!-------- Finish Title  -------->\n          <!--------------------------------------------------------------->\n          <!-- Begin Action Menu  -->\n          <div class=\"ax-flex ax-items-center ax-gap-3\">\n            @if(canCreate || canUpdate) {\n            <ax-button [text]=\"(isSM | async) ? null : 'Actions'\" color=\"ghost\">\n              <ax-prefix>\n                <i class=\"fa-solid fa-ellipsis-vertical\"></i>\n              </ax-prefix>\n              <ax-dropdown-panel>\n                <ax-button-item-list>\n                  <!-- <ax-button-item text=\"Share\" class=\"ax-font-semibold\">\n                    <ax-prefix>\n                      <ax-icon icon=\"fa-solid fa-share\"> </ax-icon>\n                    </ax-prefix>\n                  </ax-button-item> \n                  <ax-divider></ax-divider>-->\n                  @if(canCreate) {\n                  <ax-button-item\n                    [text]=\"('create-new' | translate | async) ?? ' '\"\n                    class=\"ax-font-semibold ax-text-primary\"\n                    (onClick)=\"handleCommandClick('create')\"\n                  >\n                    <ax-prefix>\n                      <ax-icon icon=\"fa-solid fa-add\"> </ax-icon>\n                    </ax-prefix>\n                  </ax-button-item>\n                  } @if(canDelete) {\n                  <ax-button-item text=\"Delete\" class=\"ax-font-semibold ax-text-danger\" (onClick)=\"handleCommandClick('delete')\">\n                    <ax-prefix>\n                      <ax-icon icon=\"fa-solid fa-trash\"> </ax-icon>\n                    </ax-prefix>\n                  </ax-button-item>\n                  }\n                </ax-button-item-list>\n              </ax-dropdown-panel>\n            </ax-button>\n            }\n          </div>\n          <!-- Finish Action Menu  -->\n        </div>\n        <!----- Finish Toolbar  ----->\n        <!--------------------------------------------------------------->\n        <!-- Begin Section Tab Items  -->\n        @if((loader.hasSections$| async)) {\n        <ax-tabs look=\"with-line\" location=\"bottom\" class=\"ax-mt-2\">\n          @for(tab of (loader.sections$ | async); track tab.name) {\n          <ax-tab-item [text]=\"tab.title\" [active]=\"isActive(tab)\" (onClick)=\"handleMenuClick($event, tab)\" class=\"first:!ax-ms-0\"> </ax-tab-item>\n          }\n        </ax-tabs>\n        }\n        <!-- Finish Section Tab Items  -->\n      </div>\n      @for(section of (loader.section$ | async)?.sections; track section.name) {\n      <ax-form #form>\n        <div class=\"ax-card ax-shadow-md\">\n          <div class=\"ax-card-header\">\n            <p>{{ section.title }}</p>\n            @if(canUpdate) {\n            <ax-button text=\"Modify\" class=\"ax-sm\" color=\"primary\" (onClick)=\"handleSectionEdit(section)\">\n              <ax-icon class=\"fa-solid fa-pen\"> </ax-icon>\n            </ax-button>\n            }\n          </div>\n          <div class=\"ax-card-body ax-divide-y ax-divide-gray-100 dark:ax-divide-gray-700 !ax-gap-0\">\n            <ng-container *ngFor=\"let name of section.properties\">\n              <ng-container *ngIf=\"loader.getProp(name) as prop\">\n                <div class=\"ax-grid md:ax-grid-cols-12 ax-gap-2 ax-py-4 first:ax-pt-0 last:ax-pb-0\">\n                  @if(section.options?.showPropTitle!=false){\n                  <div class=\"ax-col-span-12 md:ax-col-span-3 lg:ax-col-span-2 ax-flex ax-items-center md:ax-items-start ax-justify-between\">\n                    <div class=\"ax-flex ax-flex-col ax-items-start\">\n                      <span class=\"ax-font-semibold\">{{ prop.title }}</span>\n                      <!-- @if(prop.description) {\n                      <i\n                        class=\"fa-solid fa-circle-info fa-sm ax-text-neutral-500 dark:ax-text-neutral-400 ax-cursor-pointer\"\n                        [axTooltip]=\"prop.description\"\n                        [axTooltipPlacement]=\"'end'\"\n                      ></i>\n                      } -->\n                      @if(prop.description) {\n                      <span class=\"ax-text-neutral-500 ax-text-xs\">{{ prop.description }}</span>\n                      }\n                    </div>\n                  </div>\n                  }\n                  <div [class]=\"section.options?.showPropTitle == false ? 'ax-col-span-12' : 'ax-col-span-12 md:ax-col-span-9 lg:ax-col-span-10'\">\n                    <axp-widget-renderer [schema]=\"prop.schema\" [context]=\"context()\" [prop]=\"prop\" [mode]=\"'view'\"></axp-widget-renderer>\n                  </div>\n                </div>\n              </ng-container>\n            </ng-container>\n          </div>\n        </div>\n      </ax-form>\n      }\n    </div>\n  </ax-content>\n</ax-drawer-container>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i4.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i4.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i10$2.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i2$1.AXFormComponent, selector: "ax-form", inputs: ["labelMode", "messageStyle", "updateOn"], outputs: ["onValidate", "updateOnChange"] }, { kind: "ngmodule", type: AXImageModule }, { kind: "ngmodule", type: AXActionSheetModule }, { kind: "ngmodule", type: AXSwitchModule }, { kind: "ngmodule", type: AXDrawerModule }, { kind: "component", type: i11$1.AXDrawerContainerComponent, selector: "ax-drawer-container" }, { kind: "ngmodule", type: AXDialogModule }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXTabsModule }, { kind: "component", type: i9.AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged"] }, { kind: "component", type: i9.AXTabItemComponent, selector: "ax-tab-item", inputs: ["disabled", "text", "key", "headerTemplate", "active"], outputs: ["disabledChange", "onClick", "onBlur", "onFocus", "activeChange"] }, { kind: "ngmodule", type: AXPSchemaModule }, { kind: "component", type: i10$1.AXPWidgetRendererComponent, selector: "axp-widget-renderer", inputs: ["context", "prop", "mode", "schema"] }, { kind: "ngmodule", type: AXTooltipModule }, { kind: "ngmodule", type: AXBreadcrumbsModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i8$1.AXTranslatorPipe, name: "translate" }, { kind: "ngmodule", type: 
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityDetailsViewComponent, deps: [{ token: i1$3.Actions }, { token: i2.AXUnsubscriber }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: AXPEntityDetailsViewComponent, isStandalone: true, selector: "ng-component", providers: [AXUnsubscriber], viewQueries: [{ propertyName: "drawer", first: true, predicate: ["drawer"], descendants: true }], ngImport: i0, template: "<ax-drawer-container>\n  <!-- <ax-drawer #drawer location=\"start\" [collapsed]=\"!(isOpen | async)\" [mode]=\" (isSM | async) ? 'overlay' : 'push'\"\n    *ngIf=\"loader.hasSections$ | async\" (collapsedChange)=\"handleCollapsedChange($event)\">\n    <ax-content class=\"ax-border-e ax-p-6 ax-w-64\">\n      <p class=\"ax-text-xl ax-font-bold ax-mb-6\">{{loader.sectionTitle}}</p>\n      <ax-tabs look=\"with-line\" location=\"start\">\n        @for(tab of (loader.sections$ | async); track tab.name)\n        {\n        <ax-tab-item [text]=\"tab.title\" [active]=\"isActive(tab)\" (onClick)=\"handleMenuClick($event,tab)\"\n          [disabled]=\"editForm.context\">\n        </ax-tab-item>\n        }\n      </ax-tabs>\n    </ax-content>\n  </ax-drawer> -->\n  <ax-content #content class=\"ax-overflow-x-hidden\">\n    <div class=\"ax-flex ax-flex-col ax-gap-4 ax-min-h-full ax-px-4 ax-pb-4 md:ax-px-6 ax-bg-surface ax-border-b md:ax-border-0 md:ax-bg-default\">\n      <div\n        class=\"ax-flex ax-flex-col ax-pt-4 ax-sticky ax-top-0 ax-z-10 ax-transition-all\"\n        #sticky=\"axpSticky\"\n        [axpSticky]=\"'ax-bg-surface ax-px-6 ax-py-3 -ax-mx-6 ax-shadow-xl'\"\n        [stickyParent]=\"content.getHostElement()\"\n      >\n        <!-------- Begin Toolbar  -------->\n        <div class=\"ax-flex ax-justify-between ax-items-center\">\n          <!-------- Begin Title  -------->\n          <div class=\"ax-flex ax-gap-1 ax-items-center\">\n            <!-- <ax-button class=\"lg:ax-hidden\">\n              <ax-icon class=\"fa-solid fa-chevron-left\"></ax-icon>\n            </ax-button> -->\n            <div class=\"ax-flex ax-flex-col ax-gap-2\">\n              <div class=\"ax-text-xl md:ax-text-3xl ax-font-bold\">{{ loader.title }}</div>\n              <!-- <ax-breadcrumbs class=\"child:ax-font-normal child:ax-text-neutral-400\">\n                <ng-template #divider>\n                  <i class=\"fa-solid fa-chevron-right ax-text-xs ax-mx-2\"></i>\n                </ng-template>\n                <ax-breadcrumbs-item>\n                  <a>Home</a>\n                </ax-breadcrumbs-item>\n                <ax-breadcrumbs-item>\n                  <a>{{ loader.entity.title }}</a>\n                </ax-breadcrumbs-item>\n                <ax-breadcrumbs-item [active]=\"true\" class=\"!ax-font-semibold !ax-text-neutral-600\">\n                  {{ loader.title }}\n                </ax-breadcrumbs-item>\n              </ax-breadcrumbs> -->\n            </div>\n          </div>\n          <!-------- Finish Title  -------->\n          <!--------------------------------------------------------------->\n          <!-- Begin Action Menu  -->\n          <div class=\"ax-flex ax-items-center ax-gap-3\">\n            @if(canCreate || canUpdate) {\n            <ax-button [text]=\"(isSM | async) ? null : 'Actions'\" color=\"ghost\">\n              <ax-prefix>\n                <i class=\"fa-solid fa-ellipsis-vertical\"></i>\n              </ax-prefix>\n              <ax-dropdown-panel>\n                <ax-button-item-list>\n                  <!-- <ax-button-item text=\"Share\" class=\"ax-font-semibold\">\n                    <ax-prefix>\n                      <ax-icon icon=\"fa-solid fa-share\"> </ax-icon>\n                    </ax-prefix>\n                  </ax-button-item> \n                  <ax-divider></ax-divider>-->\n                  @if(canCreate) {\n                  <ax-button-item\n                    [text]=\"('create-new' | translate | async) ?? ' '\"\n                    class=\"ax-font-semibold ax-text-primary\"\n                    (onClick)=\"handleCommandClick('create')\"\n                  >\n                    <ax-prefix>\n                      <ax-icon icon=\"fa-solid fa-add\"> </ax-icon>\n                    </ax-prefix>\n                  </ax-button-item>\n                  } @if(canDelete) {\n                  <ax-button-item text=\"Delete\" class=\"ax-font-semibold ax-text-danger\" (onClick)=\"handleCommandClick('delete')\">\n                    <ax-prefix>\n                      <ax-icon icon=\"fa-solid fa-trash\"> </ax-icon>\n                    </ax-prefix>\n                  </ax-button-item>\n                  }\n                </ax-button-item-list>\n              </ax-dropdown-panel>\n            </ax-button>\n            }\n          </div>\n          <!-- Finish Action Menu  -->\n        </div>\n        <!----- Finish Toolbar  ----->\n        <!--------------------------------------------------------------->\n        <!-- Begin Section Tab Items  -->\n        @if((loader.hasSections$| async)) {\n        <ax-tabs look=\"with-line\" location=\"bottom\" class=\"ax-mt-2\">\n          @for(tab of (loader.sections$ | async); track tab.name) {\n          <ax-tab-item [text]=\"tab.title\" [active]=\"isActive(tab)\" (onClick)=\"handleMenuClick($event, tab)\" class=\"first:!ax-ms-0\"> </ax-tab-item>\n          }\n        </ax-tabs>\n        }\n        <!-- Finish Section Tab Items  -->\n      </div>\n      @for(section of (loader.section$ | async)?.sections; track section.name) {\n      <ax-form #form>\n        <div class=\"ax-card ax-shadow-md\">\n          <div class=\"ax-card-header\">\n            <p>{{ section.title }}</p>\n            @if(canUpdate) {\n            <ax-button text=\"Modify\" class=\"ax-sm\" color=\"primary\" (onClick)=\"handleSectionEdit(section)\">\n              <ax-icon class=\"fa-solid fa-pen\"> </ax-icon>\n            </ax-button>\n            }\n          </div>\n          <div class=\"ax-card-body ax-divide-y ax-divide-gray-100 dark:ax-divide-gray-700 !ax-gap-0\">\n            <ng-container *ngFor=\"let name of section.properties\">\n              <ng-container *ngIf=\"loader.getProp(name) as prop\">\n                <div class=\"ax-grid md:ax-grid-cols-12 ax-gap-2 ax-py-4 first:ax-pt-0 last:ax-pb-0\">\n                  @if(section.options?.showPropTitle!=false){\n                  <div class=\"ax-col-span-12 md:ax-col-span-3 lg:ax-col-span-2 ax-flex ax-items-center md:ax-items-start ax-justify-between\">\n                    <div class=\"ax-flex ax-flex-col ax-items-start\">\n                      <span class=\"ax-font-semibold\">{{ prop.title }}</span>\n                      <!-- @if(prop.description) {\n                      <i\n                        class=\"fa-solid fa-circle-info fa-sm ax-text-neutral-500 dark:ax-text-neutral-400 ax-cursor-pointer\"\n                        [axTooltip]=\"prop.description\"\n                        [axTooltipPlacement]=\"'end'\"\n                      ></i>\n                      } -->\n                      @if(prop.description) {\n                      <span class=\"ax-text-neutral-500 ax-text-xs\">{{ prop.description }}</span>\n                      }\n                    </div>\n                  </div>\n                  }\n                  <div [class]=\"section.options?.showPropTitle == false ? 'ax-col-span-12' : 'ax-col-span-12 md:ax-col-span-9 lg:ax-col-span-10'\">\n                    <axp-widget-renderer [schema]=\"prop.schema\" [context]=\"context()\" [prop]=\"prop\" [mode]=\"'view'\"></axp-widget-renderer>\n                  </div>\n                </div>\n              </ng-container>\n            </ng-container>\n          </div>\n        </div>\n      </ax-form>\n      }\n    </div>\n  </ax-content>\n</ax-drawer-container>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "responsiveOn", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "responsiveOnChange", "loadingTextChange"] }, { kind: "component", type: i4.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i4.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i10$2.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i2$1.AXFormComponent, selector: "ax-form", inputs: ["labelMode", "messageStyle", "updateOn"], outputs: ["onValidate", "updateOnChange"] }, { kind: "ngmodule", type: AXImageModule }, { kind: "ngmodule", type: AXActionSheetModule }, { kind: "ngmodule", type: AXSwitchModule }, { kind: "ngmodule", type: AXDrawerModule }, { kind: "component", type: i11$1.AXDrawerContainerComponent, selector: "ax-drawer-container" }, { kind: "ngmodule", type: AXDialogModule }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXTabsModule }, { kind: "component", type: i9.AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged"] }, { kind: "component", type: i9.AXTabItemComponent, selector: "ax-tab-item", inputs: ["disabled", "text", "key", "headerTemplate", "active"], outputs: ["disabledChange", "onClick", "onBlur", "onFocus", "activeChange"] }, { kind: "ngmodule", type: AXPSchemaModule }, { kind: "component", type: i10$1.AXPWidgetRendererComponent, selector: "axp-widget-renderer", inputs: ["context", "prop", "mode", "schema"] }, { kind: "ngmodule", type: AXTooltipModule }, { kind: "ngmodule", type: AXBreadcrumbsModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i8$1.AXTranslatorPipe, name: "translate" }, { kind: "ngmodule", type: 
                 //
                 AXPCommonWidgetModule }, { kind: "directive", type: AXPStickyDirective, selector: "[axpSticky]", inputs: ["axpSticky", "stickyOffset", "stickyParent", "stickyTarget"], outputs: ["isStickyChange"], exportAs: ["axpSticky"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityDetailsViewComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityDetailsViewComponent, decorators: [{
             type: Component,
             args: [{ imports: [
                         CommonModule,
@@ -2202,10 +2202,10 @@ class AXPEntityDetailViewLoaderFactory {
         this.layout.setNavigationLoading(false);
         return Promise.reject('cannot fetch ');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityDetailViewLoaderFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityDetailViewLoaderFactory, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityDetailViewLoaderFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityDetailViewLoaderFactory, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityDetailViewLoaderFactory, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityDetailViewLoaderFactory, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -2242,7 +2242,7 @@ class AXPEntityModifySectionPopupAction extends AXPWorkflowAction {
         const { module, entity: entityName, section, id } = payload;
         const entity = await this.entityRegistery.resolve(module, entityName);
         const loader = await this.entityCreateFactory.create(module, entityName, id, section);
-        const com = await import('./acorex-platform-layouts-entity-modify-view.component-Bwz4yVpK.mjs');
+        const com = await import('./acorex-platform-layouts-entity-modify-view.component-CjofXJku.mjs');
         const popup = await this.popupService.open(com.AXPEntityModifyViewComponent, {
             title: `Modify ${payload.section.title}`,
             size: this.platform.is('Mobile') || this.platform.is('SM') ? 'full' : 'md',
@@ -2259,10 +2259,10 @@ class AXPEntityModifySectionPopupAction extends AXPWorkflowAction {
             context.setVariable('updatedData', cloneDeep(popup.data.context));
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityModifySectionPopupAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityModifySectionPopupAction }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityModifySectionPopupAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityModifySectionPopupAction }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPEntityModifySectionPopupAction, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPEntityModifySectionPopupAction, decorators: [{
             type: Injectable
         }] });
 const AXPModifyEntitySectionWorkflow = {
@@ -2307,9 +2307,9 @@ const AXPModifyEntitySectionWorkflow = {
 };
 
 class AXPAdminLayoutModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPAdminLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: AXPAdminLayoutModule, imports: [AXPListViewModule, i1$4.AXPWorkflowModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPAdminLayoutModule, providers: [{ provide: RouteReuseStrategy, useClass: AXPCustomReuseStrategy }], imports: [AXPListViewModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPAdminLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.0", ngImport: i0, type: AXPAdminLayoutModule, imports: [AXPListViewModule, i1$4.AXPWorkflowModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPAdminLayoutModule, providers: [{ provide: RouteReuseStrategy, useClass: AXPCustomReuseStrategy }], imports: [AXPListViewModule,
             AXPWorkflowModule.forChild({
                 actions: {
                     AXPEntityPerformDeleteAction,
@@ -2336,7 +2336,7 @@ class AXPAdminLayoutModule {
                 },
             })] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPAdminLayoutModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPAdminLayoutModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
@@ -2433,9 +2433,9 @@ const AX_ADMIN_ROUTES = [
 ];
 
 class AXPLayoutModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: AXPLayoutModule, imports: [i10$1.AXPCommonModule, i1$4.AXPWorkflowModule], exports: [RouterModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPLayoutModule, imports: [AXPCommonModule.forChild({ errorHandlers: [AXMWorkflowErrorHandler] }),
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.0", ngImport: i0, type: AXPLayoutModule, imports: [i10$1.AXPCommonModule, i1$4.AXPWorkflowModule], exports: [RouterModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPLayoutModule, imports: [AXPCommonModule.forChild({ errorHandlers: [AXMWorkflowErrorHandler] }),
             AXPWorkflowModule.forChild({
                 actions: {
                     AXPWorkflowNavigateAction,
@@ -2447,7 +2447,7 @@ class AXPLayoutModule {
                 },
             }), RouterModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPLayoutModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPLayoutModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [