cat-qw-lib 0.48.2 → 0.48.4

package/fesm2022/cat-qw-lib.mjs

@@ -3461,6 +3461,10 @@ class DdItemModel extends BaseModel {
     isActive = true;
 }
 
+/**
+ * DictionaryStore
+ * @description Store for managing dictionary state
+ */
 let DictionaryStore = class DictionaryStore extends BaseStore {
     setPropertiesData(value) {
         this.update({ propertyData: value });
@@ -3505,6 +3509,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: DictionaryStore }, { type: i1$1.HttpClient }, { type: AppConfigService }, { type: ListService }] });
 
+/**
+ * DictionaryQuery
+ * @description Query for managing dictionary state
+ */
 class DictionaryQuery extends BaseQuery {
     store;
     constructor(store) {
@@ -3536,6 +3544,10 @@ class DdAttributeSidebarViewModel {
     propertyList = SHARED.EMPTY;
 }
 
+/**
+ * DdAdminItemFormComponent
+ * This component is used to create and edit item expressions and style expressions.
+ */
 class DdAdminItemFormComponent {
     dictionaryStore;
     dictionaryQuery;
@@ -3555,32 +3567,36 @@ class DdAdminItemFormComponent {
         this.baseStore = baseStore;
         this.attributeRecord = new DdAttributeSidebarViewModel();
     }
-    ngOnInit() {
-        this.loadPropertyOption();
-    }
     ngOnChanges(changes) {
         if (changes[SHARED.ISITEMEXPRESSION]) {
             this.attributeRecord.mappingInfo = (this.isItemExpression ? this.ddItemRecord.itemExpression : this.ddItemRecord.styleExpression) ?? SHARED.EMPTY;
         }
+        this.loadPropertyOption();
     }
     loadPropertyOption() {
         this.subscriptions.add(this.dictionaryQuery.selectPropertyData().subscribe((res) => {
+            this.propertyOptions = [];
             if (res) {
-                if (res?.properties?.length) {
-                    res.properties.forEach((property) => {
-                        this.propertyOptions.push({ label: `${res.name}.${property}`, value: `${res.name}.${property}` });
-                    });
-                }
-                if (res?.childApis?.length) {
-                    res.childApis.forEach((childApi) => {
-                        childApi.properties.forEach((property) => {
-                            this.propertyOptions.push({ label: `${res.name}.${childApi.name}.${property}`, value: `${res.name}.${childApi.name}.${property}` });
-                        });
-                    });
-                }
+                this.mapProperties(res);
             }
         }));
     }
+    mapProperties(res) {
+        if (res?.properties?.length) {
+            this.propertyOptions.push(...res.properties.map((property) => ({
+                label: `${res.name}.${property}`,
+                value: `${res.name}.${property}`
+            })));
+        }
+        if (res?.childApis?.length) {
+            res.childApis.forEach((childApi) => {
+                this.propertyOptions.push(...childApi.properties.map((property) => ({
+                    label: `${res.name}.${childApi.name}.${property}`,
+                    value: `${res.name}.${childApi.name}.${property}`
+                })));
+            });
+        }
+    }
     handleSaveBtnClick(event) {
         if (this.isItemExpression) {
             if (this.baseStore)
@@ -3605,13 +3621,15 @@ class DdAdminItemFormComponent {
     }
     ngOnDestroy() {
         this.subscriptions.unsubscribe();
+        this.propertyOptions = [];
+        this.attributeRecord = new DdAttributeSidebarViewModel();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DdAdminItemFormComponent, deps: [{ token: DictionaryStore }, { token: DictionaryQuery }, { token: BaseStore }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DdAdminItemFormComponent, isStandalone: false, selector: "lib-dd-admin-item-form", inputs: { ddItemRecord: "ddItemRecord", isItemExpression: "isItemExpression", isSidebarVisible: "isSidebarVisible" }, outputs: { saveClick: "saveClick" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"dicitonary-edit-action px-3\">\n    <div class=\"flex align-items-center justify-content-end mt-3\">\n        <lib-button\n        [store]=\"dictionaryStore\"\n        [record]=\"attributeRecord\"\n        [attributeModel]=\"{\n          buttonLabel: 'Save',\n          isDisabled: false,\n        }\"\n        (onBtnClick)=\"handleSaveBtnClick($event)\"\n        >\n      </lib-button>\n    </div>\n\n    <div class=\"col-12 md:col-12 mt-5\">\n      <label *ngIf=\"!isItemExpression\" for=\"styleInput\" class=\"text-gray-600 text-sm mb-2 block\">\n        Hint: Use key-value pairs for styles.\n        <br/>\n        Example:<code>\n          'background-color': 'lightgray',\n          'font-size': '16px',<br>\n          'padding': '10px'\n        </code>\n      </label>\n        <text-area\n            [store]=\"dictionaryStore\"\n            [record]=\"attributeRecord\"\n            [attributeModel]=\"{\n              displayText: 'Expression',\n              readonly : false,\n              name : 'mappingInfo',\n              isRequired : isItemExpression ? true : false,\n              placeholder : 'Enter Text',\n              customPadding: '12px',\n            }\"\n            ></text-area>\n    </div>\n    <div class=\"col-12 md:col-12\">\n        <div class=\"p-field queue-list-wrapper\">\n            <dropdown [store]=\"dictionaryStore\" [record]=\"attributeRecord\" [attributeModel]=\"{\n            name:'propertyList',\n            displayText : 'Select properties',\n            isRequired:false,\n            options : propertyOptions,\n            filter : true\n        }\">\n            </dropdown>\n        </div>\n    </div>\n    <div class=\"col-12 md:col-3\">\n        <lib-button\n        [store]=\"dictionaryStore\"\n        [record]=\"attributeRecord\"\n        [attributeModel]=\"{\n          buttonLabel: 'Add to expression',\n          isDisabled: false,\n        }\"\n        (onBtnClick)=\"handleAddExpressionClick($event)\"\n        >\n      </lib-button>\n    </div>\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DropdownComponent, selector: "dropdown", inputs: ["isStaticDropdown"] }, { kind: "component", type: ButtonComponent, selector: "lib-button" }, { kind: "component", type: TextAreaComponent, selector: "text-area", inputs: ["rowspan"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DdAdminItemFormComponent, isStandalone: false, selector: "lib-dd-admin-item-form", inputs: { ddItemRecord: "ddItemRecord", isItemExpression: "isItemExpression", isSidebarVisible: "isSidebarVisible" }, outputs: { saveClick: "saveClick" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"dicitonary-edit-action px-3\">\n    <div class=\"flex align-items-center justify-content-end mt-3\">\n        <lib-button\n        [store]=\"dictionaryStore\"\n        [record]=\"attributeRecord\"\n        [attributeModel]=\"{\n          buttonLabel: 'Save',\n          isDisabled: false,\n        }\"\n        (onBtnClick)=\"handleSaveBtnClick($event)\"\n        >\n      </lib-button>\n    </div>\n\n    <div class=\"col-12 md:col-12 mt-5\">\n      <label *ngIf=\"!isItemExpression\" for=\"styleInput\" class=\"text-gray-600 text-sm mb-2 block\">\n        Hint: Use key-value pairs for styles.\n        <br/>\n        Example:<code>\n          'background-color': 'lightgray',\n          'font-size': '16px',<br>\n          'padding': '10px'\n        </code>\n      </label>\n        <text-area\n            [store]=\"dictionaryStore\"\n            [record]=\"attributeRecord\"\n            [attributeModel]=\"{\n              displayText: 'Expression',\n              readonly : false,\n              name : 'mappingInfo',\n              isRequired : isItemExpression ? true : false,\n              placeholder : 'Enter Text',\n              customPadding: '12px',\n            }\"\n            ></text-area>\n    </div>\n    <div class=\"col-12 md:col-12\">\n        <div class=\"p-field queue-list-wrapper\">\n            <dropdown [store]=\"dictionaryStore\" [isStaticDropdown]=\"true\" [record]=\"attributeRecord\" [attributeModel]=\"{\n            name:'propertyList',\n            displayText : 'Select properties',\n            isRequired:false,\n            listLabelProperty: 'label',\n            listValueProperty: 'value',\n            options : propertyOptions,\n            filter : true\n        }\">\n            </dropdown>\n        </div>\n    </div>\n    <div class=\"col-12 md:col-3\">\n        <lib-button\n        [store]=\"dictionaryStore\"\n        [record]=\"attributeRecord\"\n        [attributeModel]=\"{\n          buttonLabel: 'Add to expression',\n          isDisabled: false,\n        }\"\n        (onBtnClick)=\"handleAddExpressionClick($event)\"\n        >\n      </lib-button>\n    </div>\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DropdownComponent, selector: "dropdown", inputs: ["isStaticDropdown"] }, { kind: "component", type: ButtonComponent, selector: "lib-button" }, { kind: "component", type: TextAreaComponent, selector: "text-area", inputs: ["rowspan"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DdAdminItemFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-dd-admin-item-form', standalone: false, template: "<div class=\"dicitonary-edit-action px-3\">\n    <div class=\"flex align-items-center justify-content-end mt-3\">\n        <lib-button\n        [store]=\"dictionaryStore\"\n        [record]=\"attributeRecord\"\n        [attributeModel]=\"{\n          buttonLabel: 'Save',\n          isDisabled: false,\n        }\"\n        (onBtnClick)=\"handleSaveBtnClick($event)\"\n        >\n      </lib-button>\n    </div>\n\n    <div class=\"col-12 md:col-12 mt-5\">\n      <label *ngIf=\"!isItemExpression\" for=\"styleInput\" class=\"text-gray-600 text-sm mb-2 block\">\n        Hint: Use key-value pairs for styles.\n        <br/>\n        Example:<code>\n          'background-color': 'lightgray',\n          'font-size': '16px',<br>\n          'padding': '10px'\n        </code>\n      </label>\n        <text-area\n            [store]=\"dictionaryStore\"\n            [record]=\"attributeRecord\"\n            [attributeModel]=\"{\n              displayText: 'Expression',\n              readonly : false,\n              name : 'mappingInfo',\n              isRequired : isItemExpression ? true : false,\n              placeholder : 'Enter Text',\n              customPadding: '12px',\n            }\"\n            ></text-area>\n    </div>\n    <div class=\"col-12 md:col-12\">\n        <div class=\"p-field queue-list-wrapper\">\n            <dropdown [store]=\"dictionaryStore\" [record]=\"attributeRecord\" [attributeModel]=\"{\n            name:'propertyList',\n            displayText : 'Select properties',\n            isRequired:false,\n            options : propertyOptions,\n            filter : true\n        }\">\n            </dropdown>\n        </div>\n    </div>\n    <div class=\"col-12 md:col-3\">\n        <lib-button\n        [store]=\"dictionaryStore\"\n        [record]=\"attributeRecord\"\n        [attributeModel]=\"{\n          buttonLabel: 'Add to expression',\n          isDisabled: false,\n        }\"\n        (onBtnClick)=\"handleAddExpressionClick($event)\"\n        >\n      </lib-button>\n    </div>\n</div>" }]
+            args: [{ selector: 'lib-dd-admin-item-form', standalone: false, template: "<div class=\"dicitonary-edit-action px-3\">\n    <div class=\"flex align-items-center justify-content-end mt-3\">\n        <lib-button\n        [store]=\"dictionaryStore\"\n        [record]=\"attributeRecord\"\n        [attributeModel]=\"{\n          buttonLabel: 'Save',\n          isDisabled: false,\n        }\"\n        (onBtnClick)=\"handleSaveBtnClick($event)\"\n        >\n      </lib-button>\n    </div>\n\n    <div class=\"col-12 md:col-12 mt-5\">\n      <label *ngIf=\"!isItemExpression\" for=\"styleInput\" class=\"text-gray-600 text-sm mb-2 block\">\n        Hint: Use key-value pairs for styles.\n        <br/>\n        Example:<code>\n          'background-color': 'lightgray',\n          'font-size': '16px',<br>\n          'padding': '10px'\n        </code>\n      </label>\n        <text-area\n            [store]=\"dictionaryStore\"\n            [record]=\"attributeRecord\"\n            [attributeModel]=\"{\n              displayText: 'Expression',\n              readonly : false,\n              name : 'mappingInfo',\n              isRequired : isItemExpression ? true : false,\n              placeholder : 'Enter Text',\n              customPadding: '12px',\n            }\"\n            ></text-area>\n    </div>\n    <div class=\"col-12 md:col-12\">\n        <div class=\"p-field queue-list-wrapper\">\n            <dropdown [store]=\"dictionaryStore\" [isStaticDropdown]=\"true\" [record]=\"attributeRecord\" [attributeModel]=\"{\n            name:'propertyList',\n            displayText : 'Select properties',\n            isRequired:false,\n            listLabelProperty: 'label',\n            listValueProperty: 'value',\n            options : propertyOptions,\n            filter : true\n        }\">\n            </dropdown>\n        </div>\n    </div>\n    <div class=\"col-12 md:col-3\">\n        <lib-button\n        [store]=\"dictionaryStore\"\n        [record]=\"attributeRecord\"\n        [attributeModel]=\"{\n          buttonLabel: 'Add to expression',\n          isDisabled: false,\n        }\"\n        (onBtnClick)=\"handleAddExpressionClick($event)\"\n        >\n      </lib-button>\n    </div>\n</div>" }]
         }], ctorParameters: () => [{ type: DictionaryStore }, { type: DictionaryQuery }, { type: BaseStore }], propDecorators: { ddItemRecord: [{
                 type: Input
             }], isItemExpression: [{
@@ -3622,6 +3640,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
                 type: Output
             }] } });
 
+/**
+ * DdAdminFormComponent
+ * @description Component for managing dictionary form
+ */
 class DdAdminFormComponent extends BaseFormComponent {
     service;
     dictionaryQuery;