raise-common-lib 0.0.192 → 0.0.194

package/bundles/raise-common-lib.umd.js

@@ -1003,7 +1003,7 @@
         CommonGridComponent.decorators = [
             { type: core.Component, args: [{
                         selector: "rs-common-grid",
-                        template: "<ejs-grid\r\n  #grid\r\n  [id]=\"gridId\"\r\n  [ngClass]=\"{\r\n    'hide-Check-box': !alwaysShowCheckbox,\r\n    'grid-loading': className === 'grid-loading'\r\n  }\"\r\n  [dataSource]=\"dataSource\"\r\n  [allowPaging]=\"allowPaging && pageSettings\"\r\n  [allowResizing]=\"true\"\r\n  [pageSettings]=\"pageSettings\"\r\n  [showColumnMenu]=\"true\"\r\n  [allowSorting]=\"true\"\r\n  [allowFiltering]=\"true\"\r\n  [allowExcelExport]=\"true\"\r\n  [allowRowDragAndDrop]=\"allowRowDragAndDrop\"\r\n  [filterSettings]=\"filterSettings\"\r\n  [resizeSettings]=\"resizeSettings\"\r\n  [allowSelection]=\"true\"\r\n  [editSettings]=\"editSettings\"\r\n  [childGrid]=\"childGrid\"\r\n  [contextMenuItems]=\"dataSource && dataSource.length ? contextMenuItems : null\"\r\n  [selectionSettings]=\"selectionSettings\"\r\n  (recordClick)=\"_recordClick($event)\"\r\n  (recordDoubleClick)=\"_recordDoubleClick($event)\"\r\n  (actionBegin)=\"_actionBegin($event)\"\r\n  (actionComplete)=\"_actionHandler($event)\"\r\n  (rowSelected)=\"_rowSelected($event)\"\r\n  (rowDeselecting)=\"_rowDeselecting($event)\"\r\n  (rowDeselected)=\"_rowDeselected($event)\"\r\n  style=\"border: none\"\r\n  (contextMenuClick)=\"_onContextMenu($event)\"\r\n  (contextMenuOpen)=\"contextMenuOpen($event)\"\r\n  (queryCellInfo)=\"customiseCell($event)\"\r\n  (dataBound)=\"_dataBound($event)\"\r\n  (rowDataBound)=\"_rowDataBound($event)\"\r\n  (rowSelecting)=\"_rowSelecting($event)\"\r\n  (excelQueryCellInfo)=\"_exportQueryCellInfo($event)\"\r\n  (rowDrop)=\"onRowDrop($event)\"\r\n  (rowDragStart)=\"_rowDragStart($event)\"\r\n  (rowDrag)=\"_rowDrag($event)\"\r\n  (load)=\"_load()\"\r\n  [frozenColumns]=\"frozenColumns\"\r\n  [columnChooserSettings]=\"columnChooserSettings\"\r\n>\r\n  <e-columns>\r\n    <e-column\r\n      *ngIf=\"showCheckBox\"\r\n      type=\"checkbox\"\r\n      [width]=\"checkBoxWidth\"\r\n      [minWidth]=\"checkBoxWidth\"\r\n      [showColumnMenu]=\"false\"\r\n      [allowResizing]=\"false\"\r\n    ></e-column>\r\n    <e-column\r\n      *ngFor=\"let item of fields; trackBy: trackByFn; let last = last\"\r\n      [field]=\"item.columnName\"\r\n      [filter]=\"item.filter ? item.filter : { type: 'CheckBox' }\"\r\n      [customAttributes]=\"\r\n        item.colName === 'entityUserList' || item.colName === 'kycProgress'\r\n          ? { class: 'hideColumnFilterClass' }\r\n          : {}\r\n      \"\r\n      [headerText]=\"item.columnDisplayName\"\r\n      [textAlign]=\"item.textAlign\"\r\n      [showColumnMenu]=\"item.showColumnMenu === undefined ? true : false\"\r\n      [allowFiltering]=\"item.allowFiltering === undefined ? true : false\"\r\n      [allowSorting]=\"item.allowSorting === undefined ? true : false\"\r\n      [editType]=\"item.editType\"\r\n      [validationRules]=\"item.validationRules\"\r\n      [type]=\"item.dataType || 'string'\"\r\n      [width]=\"item.width\"\r\n      [minWidth]=\"item.minWidth\"\r\n      [format]=\"item.format\"\r\n      [visible]=\"item.visible\"\r\n      [template]=\"item.showTemplate ? columnTemplate : undefined\"\r\n      [clipMode]=\"\r\n        item.clipMode ? item.clipMode : clipMode || 'EllipsisWithTooltip'\r\n      \"\r\n      [sortComparer]=\"item.dateComparer || null\"\r\n      [allowResizing]=\"!last\"\r\n    >\r\n    </e-column>\r\n  </e-columns>\r\n</ejs-grid>\r\n",
+                        template: "<ejs-grid\r\n  #grid\r\n  [id]=\"gridId\"\r\n  [ngClass]=\"{\r\n    'hide-Check-box': !alwaysShowCheckbox,\r\n    'grid-loading': className === 'grid-loading'\r\n  }\"\r\n  [dataSource]=\"dataSource\"\r\n  [allowPaging]=\"allowPaging && pageSettings\"\r\n  [allowResizing]=\"true\"\r\n  [pageSettings]=\"pageSettings\"\r\n  [showColumnMenu]=\"true\"\r\n  [allowSorting]=\"true\"\r\n  [allowFiltering]=\"true\"\r\n  [allowExcelExport]=\"true\"\r\n  [allowRowDragAndDrop]=\"allowRowDragAndDrop\"\r\n  [filterSettings]=\"filterSettings\"\r\n  [resizeSettings]=\"resizeSettings\"\r\n  [allowSelection]=\"true\"\r\n  [editSettings]=\"editSettings\"\r\n  [childGrid]=\"childGrid\"\r\n  [contextMenuItems]=\"dataSource && dataSource.length ? contextMenuItems : null\"\r\n  [selectionSettings]=\"selectionSettings\"\r\n  (recordClick)=\"_recordClick($event)\"\r\n  (recordDoubleClick)=\"_recordDoubleClick($event)\"\r\n  (actionBegin)=\"_actionBegin($event)\"\r\n  (actionComplete)=\"_actionHandler($event)\"\r\n  (rowSelected)=\"_rowSelected($event)\"\r\n  (rowDeselecting)=\"_rowDeselecting($event)\"\r\n  (rowDeselected)=\"_rowDeselected($event)\"\r\n  style=\"border: none\"\r\n  (contextMenuClick)=\"_onContextMenu($event)\"\r\n  (contextMenuOpen)=\"contextMenuOpen($event)\"\r\n  (queryCellInfo)=\"customiseCell($event)\"\r\n  (dataBound)=\"_dataBound($event)\"\r\n  (rowDataBound)=\"_rowDataBound($event)\"\r\n  (rowSelecting)=\"_rowSelecting($event)\"\r\n  (excelQueryCellInfo)=\"_exportQueryCellInfo($event)\"\r\n  (rowDrop)=\"onRowDrop($event)\"\r\n  (rowDragStart)=\"_rowDragStart($event)\"\r\n  (rowDrag)=\"_rowDrag($event)\"\r\n  (load)=\"_load()\"\r\n  [frozenColumns]=\"frozenColumns\"\r\n  [columnChooserSettings]=\"columnChooserSettings\"\r\n>\r\n  <e-columns>\r\n    <e-column\r\n      *ngIf=\"showCheckBox\"\r\n      type=\"checkbox\"\r\n      [width]=\"checkBoxWidth\"\r\n      [minWidth]=\"checkBoxWidth\"\r\n      [showColumnMenu]=\"false\"\r\n      [allowResizing]=\"false\"\r\n    ></e-column>\r\n    <e-column\r\n      *ngFor=\"let item of fields; trackBy: trackByFn; let last = last\"\r\n      [field]=\"item.columnName\"\r\n      [filter]=\"item.filter ? item.filter : { type: 'CheckBox' }\"\r\n      [customAttributes]=\"\r\n        item.colName === 'entityUserList' || item.colName === 'kycProgress'\r\n          ? { class: 'hideColumnFilterClass' }\r\n          : {}\r\n      \"\r\n      [headerText]=\"item.columnDisplayName\"\r\n      [textAlign]=\"item.textAlign\"\r\n      [showColumnMenu]=\"item.showColumnMenu === undefined ? true : false\"\r\n      [allowFiltering]=\"item.allowFiltering === undefined ? true : false\"\r\n      [allowSorting]=\"item.allowSorting === undefined ? true : false\"\r\n      [showInColumnChooser]=\"\r\n        item.showInColumnChooser === undefined ? true : item.showInColumnChooser\r\n      \"\r\n      [editType]=\"item.editType\"\r\n      [validationRules]=\"item.validationRules\"\r\n      [type]=\"item.dataType || 'string'\"\r\n      [width]=\"item.width\"\r\n      [minWidth]=\"item.minWidth\"\r\n      [format]=\"item.format\"\r\n      [visible]=\"item.visible\"\r\n      [template]=\"item.showTemplate ? columnTemplate : undefined\"\r\n      [clipMode]=\"\r\n        item.clipMode ? item.clipMode : clipMode || 'EllipsisWithTooltip'\r\n      \"\r\n      [sortComparer]=\"item.dateComparer || null\"\r\n      [allowResizing]=\"!last\"\r\n    >\r\n    </e-column>\r\n  </e-columns>\r\n</ejs-grid>\r\n",
                         styles: [""]
                     }] }
         ];
@@ -3000,6 +3000,7 @@
             this.customPageTitle = false;
             this.tabList = [];
             this.tabChange = new core.EventEmitter();
+            this.selectedItemIndex = 0;
             this.animation = {
                 previous: { effect: "", duration: 0, easing: "" },
                 next: { effect: "", duration: 0, easing: "" },
@@ -3048,6 +3049,7 @@
             var index = e.selectedItem.dataset.id.split('_')[1] // sy的bug只能这么取了
             ;
             if (e.isInteracted) {
+                this.selectedItemIndex = index;
                 this.tabChange.emit(this.tabList[index]);
             }
         };
@@ -3069,7 +3071,7 @@
         RsPageTabComponent.decorators = [
             { type: core.Component, args: [{
                         selector: "rs-page-tab",
-                        template: "<div class=\"rs-page-list-wrap\">\r\n  <ng-container *ngIf=\"customPageTitle; else defaultTitle\">\r\n    <ng-content select=\"[titleSlot]\"></ng-content>\r\n  </ng-container>\r\n  <ng-template #defaultTitle>\r\n    <div class=\"rs-page-title\" *ngIf=\"pageTitle\">{{ pageTitle }}</div>\r\n  </ng-template>\r\n  <ejs-tab\r\n    class=\"rs-tab\"\r\n    #tabObj\r\n    (selected)=\"onTabClick($event)\"\r\n    [animation]=\"animation\"\r\n\t  overflowMode=\"Popup\"\r\n    heightAdjustMode=\"None\"\r\n  >\r\n    <e-tabitems>\r\n      <e-tabitem *ngFor=\"let item of tabList\">\r\n        <ng-template #headerText>\r\n          <div>{{ item.title }}</div>\r\n        </ng-template>\r\n      </e-tabitem>\r\n    </e-tabitems>\r\n  </ejs-tab>\r\n  <div class=\"rs-grid-wrap\">\r\n    <ng-content select=\"[tabContentSlot]\"></ng-content>\r\n  </div>\r\n</div>\r\n",
+                        template: "<div class=\"rs-page-list-wrap\">\r\n  <ng-container *ngIf=\"customPageTitle; else defaultTitle\">\r\n    <ng-content select=\"[titleSlot]\"></ng-content>\r\n  </ng-container>\r\n  <ng-template #defaultTitle>\r\n    <div class=\"rs-page-title\" *ngIf=\"pageTitle\">{{ pageTitle }}</div>\r\n  </ng-template>\r\n  <ejs-tab\r\n    class=\"rs-tab\"\r\n    #tabObj\r\n    (selected)=\"onTabClick($event)\"\r\n    [animation]=\"animation\"\r\n\t  overflowMode=\"Popup\"\r\n    heightAdjustMode=\"None\"\r\n    [selectedItem]=\"selectedItemIndex\"\r\n  >\r\n    <e-tabitems>\r\n      <e-tabitem *ngFor=\"let item of tabList\">\r\n        <ng-template #headerText>\r\n          <div>{{ item.title }}</div>\r\n        </ng-template>\r\n      </e-tabitem>\r\n    </e-tabitems>\r\n  </ejs-tab>\r\n  <div class=\"rs-grid-wrap\">\r\n    <ng-content select=\"[tabContentSlot]\"></ng-content>\r\n  </div>\r\n</div>\r\n",
                         styles: [".rs-page-list-wrap{height:100%;display:flex;flex-direction:column;position:relative;margin:0 auto;max-width:1885px}.rs-page-list-wrap .rs-page-title{font-family:var(--rs-font-family);font-size:var(--rs-page-title-font-size);font-weight:700;text-align:left;color:var(--rs-page-title-color);display:flex;align-items:center;padding:16px 8px 12px 20px}.rs-page-list-wrap .rs-tab{padding:0 20px}.rs-page-list-wrap .rs-tab .e-tab-header::before{display:none}.rs-page-list-wrap .rs-tab .e-toolbar-items{gap:32px;min-height:36px}.rs-page-list-wrap .rs-tab .e-toolbar-items .e-toolbar-item{border:0}.rs-page-list-wrap .rs-tab .e-toolbar-items .e-toolbar-item .e-tab-wrap{padding:0;border:0;position:relative;height:36px}.rs-page-list-wrap .rs-tab .e-toolbar-items .e-toolbar-item .e-tab-wrap::before{content:\" \";position:absolute;left:0;bottom:0;width:100%;height:2px;background-color:transparent}.rs-page-list-wrap .rs-tab .e-toolbar-items .e-toolbar-item .e-tab-text{color:#5f6f81;font-family:Arial;font-size:13px;font-style:normal;font-weight:400;line-height:16px}.rs-page-list-wrap .rs-tab .e-toolbar-items .e-toolbar-item.e-active .e-tab-wrap::before{background-color:#1f7bff}.rs-page-list-wrap .rs-tab .e-toolbar-items .e-toolbar-item.e-active .e-tab-text{color:#44566c}.rs-page-list-wrap .rs-tab .e-hor-nav{width:24px;height:24px;min-height:24px;top:3px;border-radius:4px;background-color:transparent!important;border:1px solid #eaedf0!important}.rs-page-list-wrap .rs-tab .e-hor-nav .e-icons{box-shadow:none;background-color:transparent!important;border-color:transparent!important;background-image:url(../../../assets/img/icon-more.svg);background-size:14px 3px;background-repeat:no-repeat;background-position:4px 14px}.rs-page-list-wrap .rs-tab .e-hor-nav .e-icons::before{display:none}.rs-page-list-wrap .rs-tab .e-hor-nav .e-icons:hover{background-color:#eff5fb!important;border-color:#b1d0fc!important;background-image:url(../../../assets/img/icon-more-active.svg)}.rs-page-list-wrap .rs-tab .e-toolbar-pop{min-width:160px;border-radius:10px;background:#fff;box-shadow:0 0 8px 0 rgba(0,0,0,.25);padding:8px}.rs-page-list-wrap .rs-tab .e-toolbar-pop .e-toolbar-item .e-tab-wrap{padding:0 8px}.rs-page-list-wrap .rs-tab .e-toolbar-pop .e-toolbar-item .e-tab-wrap .e-tab-text{color:#44566c;font-family:Arial;font-size:13px;font-weight:400;line-height:16px}.rs-page-list-wrap .rs-tab .e-toolbar-pop .e-toolbar-item .e-tab-wrap:hover{border-radius:6px;background:rgba(31,123,255,.05)}.rs-page-list-wrap .rs-grid-wrap{flex:1;height:0}"]
                     }] }
         ];
@@ -3097,6 +3099,8 @@
         /** @type {?} */
         RsPageTabComponent.prototype.tabChange;
         /** @type {?} */
+        RsPageTabComponent.prototype.selectedItemIndex;
+        /** @type {?} */
         RsPageTabComponent.prototype.animation;
     }
 
@@ -22425,9 +22429,12 @@
      * Generated from: lib/form/drawer-form/drawer-form.component.ts
      * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
      */
+    /** @type {?} */
+    var FORM_PROXY_TAG = Symbol.for("form-proxy");
     var DrawerFormComponent = /** @class */ (function () {
         function DrawerFormComponent(ref) {
             this.ref = ref;
+            this._form = {};
             this._sections = [];
             this.optionsMap = {};
             this.formDisabled = false;
@@ -22439,12 +22446,14 @@
                 groupBy: null,
             };
             this.showFilterNumber = 10;
-            this.form = {};
+            this.dateFormat = "yyyy-MM-dd";
             this.formChange = new core.EventEmitter();
             this.fieldChange = new core.EventEmitter();
             this.sections = [];
-            this.filterOptionsMap = {};
+            this.form = {};
             this.fieldValidMap = {};
+            // 存储 datepicker 的值
+            this.dateForm = {};
             this.dateValidMap = {};
             this.scrollIndex = 0;
             this.isClickAnchor = false;
@@ -22465,13 +22474,19 @@
          * @return {?}
          */
         function (changes) {
+            if (changes._form) {
+                if (!changes._form.currentValue[FORM_PROXY_TAG]) {
+                    this.form = this.getFormProxy(changes._form.currentValue);
+                    this.formChange.emit(this.form);
+                }
+                if (!changes._form.firstChange) {
+                    this.checkFormChange(changes._form.previousValue, changes._form.currentValue);
+                }
+            }
             if (changes._sections) {
                 this.sections = filterShowSection(changes._sections.currentValue);
                 this.formatForm(this.sections);
             }
-            if (changes.form && !changes.form.firstChange) {
-                this.checkFormChange(changes.form.previousValue, changes.form.currentValue);
-            }
         };
         /**
          * @return {?}
@@ -22603,6 +22618,23 @@
                 }
             }));
         };
+        /**
+         * @param {?} field
+         * @param {?} value
+         * @return {?}
+         */
+        DrawerFormComponent.prototype.syncFormToDateForm = /**
+         * @param {?} field
+         * @param {?} value
+         * @return {?}
+         */
+        function (field, value) {
+            if (value) {
+                /** @type {?} */
+                var date = moment(value);
+                this.dateForm[field.formKey] = date.isValid() ? date.toDate() : null;
+            }
+        };
         /**
          * @param {?} sections
          * @return {?}
@@ -22638,6 +22670,9 @@
                             case "Switch":
                                 _this.form[field.formKey] = false;
                                 break;
+                            case "Datepicker":
+                                _this.syncFormToDateForm(field, _this.form[field.formKey]);
+                                break;
                             default:
                                 _this.form[field.formKey] = null;
                         }
@@ -22645,6 +22680,43 @@
                 }));
             }));
         };
+        /**
+         * @param {?} form
+         * @return {?}
+         */
+        DrawerFormComponent.prototype.getFormProxy = /**
+         * @param {?} form
+         * @return {?}
+         */
+        function (form) {
+            var _this = this;
+            // 现在除了 tag 之外不支持嵌套 form 属性，只对浅层进行处理
+            /** @type {?} */
+            var proxyForm = new Proxy(form, {
+                set: (/**
+                 * @param {?} target
+                 * @param {?} prop
+                 * @param {?} value
+                 * @return {?}
+                 */
+                function (target, prop, value) {
+                    target[prop] = value;
+                    /** @type {?} */
+                    var field = _this.getField(prop);
+                    if (field && field.fieldFormType === "Datepicker") {
+                        _this.syncFormToDateForm(field, value);
+                    }
+                    return true;
+                }),
+            });
+            Object.defineProperty(proxyForm, FORM_PROXY_TAG, {
+                value: true,
+                writable: false,
+                enumerable: false,
+                configurable: false,
+            });
+            return proxyForm;
+        };
         // 表单提交前会触发这个函数
         // 表单提交前会触发这个函数
         /**
@@ -22660,12 +22732,8 @@
          * @return {?}
          */
         function (value, field) {
-            var _a;
-            /** @type {?} */
-            var newForm = __assign({}, this.form, (_a = {}, _a[field.formKey] = value, _a));
-            // 修复错误提示显示 bug，不设置一下有概率拿不到最新的值
-            this.form = newForm;
-            this.formChange.emit(newForm);
+            this.form[field.formKey] = value;
+            this.formChange.emit(this.form);
             this.fieldChange.emit({ field: field, value: value });
         };
         /**
@@ -22832,13 +22900,14 @@
             if (!event.isInteracted) {
                 return;
             }
-            /** @type {?} */
-            var value = event.value;
-            if (field.fieldFormType === "Datepicker") {
-                /** @type {?} */
-                var date = moment(value);
-                value = date.isValid() ? date.format("YYYY-MM-DD") : null;
+            if (field.fieldFormType !== "Datepicker") {
+                this.onChange(event.value, field);
+                return;
             }
+            console.log("change", event);
+            /** @type {?} */
+            var value = event.value ? moment(event.value).format("YYYY-MM-DD") : null;
+            this.dateForm[field.formKey] = event.value;
             this.onChange(value, field);
         };
         /**
@@ -22866,17 +22935,21 @@
          * @return {?}
          */
         function (event, field) {
+            var _this = this;
             this.onBlur(field);
-            /** @type {?} */
-            var $input = event.model.element.querySelector("input");
-            if (!$input || !$input.value) {
-                delete this.dateValidMap[field.formKey];
-                return;
-            }
-            /** @type {?} */
-            var date = moment($input.value);
-            this.onChange(date.isValid() ? date.format("YYYY-MM-DD") : null, field);
-            this.dateValidMap[field.formKey] = date.isValid();
+            setTimeout((/**
+             * @return {?}
+             */
+            function () {
+                /** @type {?} */
+                var $input = event.model.element.querySelector("input");
+                if ($input && $input.value && !_this.dateForm[field.formKey]) {
+                    _this.dateValidMap[field.formKey] = false;
+                }
+                else {
+                    delete _this.dateValidMap[field.formKey];
+                }
+            }), 50);
         };
         /**
          * @param {?} field
@@ -22916,23 +22989,24 @@
             if (event.text) {
                 query.where(this.optionFields.text, "contains", event.text, true);
             }
-            event.updateData(this.optionsMap[field.optionKey] || [], query);
+            event.updateData(this.getOptions(field), query);
         };
         /**
          * @param {?} field
          * @return {?}
          */
-        DrawerFormComponent.prototype.getValue = /**
+        DrawerFormComponent.prototype.getOptions = /**
          * @param {?} field
          * @return {?}
          */
         function (field) {
-            if (field.fieldFormType === "Datepicker" && this.form[field.formKey]) {
-                /** @type {?} */
-                var date = moment(this.form[field.formKey]);
-                return date.isValid() ? date.toDate() : null;
+            if (Array.isArray(this.optionsMap[field.optionKey])) {
+                return this.optionsMap[field.optionKey];
+            }
+            if (Array.isArray(this.optionsMap[field.formKey])) {
+                return this.optionsMap[field.formKey];
             }
-            return this.form[field.formKey];
+            return [];
         };
         /**
          * @param {?} field
@@ -23053,7 +23127,7 @@
         DrawerFormComponent.decorators = [
             { type: core.Component, args: [{
                         selector: "rs-drawer-form",
-                        template: "<div #drawerFormEl class=\"rs-drawer-form-container\">\r\n  <div class=\"section-container\">\r\n    <div #sectionEl class=\"section-item\" *ngFor=\"let section of sections\">\r\n      <input\r\n        type=\"checkbox\"\r\n        class=\"section-expand-checkbox\"\r\n        *ngIf=\"section.title\"\r\n      />\r\n      <div class=\"section-title\" *ngIf=\"section.title\">\r\n        <span>{{ section.title }}</span>\r\n      </div>\r\n      <div class=\"section-form\" *ngIf=\"!section.customKey\">\r\n        <div\r\n          class=\"form-item\"\r\n          *ngFor=\"let field of section.fields\"\r\n          [attr.data-required]=\"field.required ? 'yes' : 'no'\"\r\n          [attr.data-disabled]=\"field.disabled || formDisabled ? 'yes' : 'no'\"\r\n          [attr.data-error]=\"\r\n            fieldValidMap[field.formKey] === false ? 'yes' : 'no'\r\n          \"\r\n        >\r\n          <div class=\"form-label\">\r\n            <span>{{ field.label }}</span>\r\n            <ejs-tooltip\r\n              class=\"form-tooltip\"\r\n              cssClass=\"rs-drawer-tooltip\"\r\n              *ngIf=\"field.tooltip\"\r\n              position=\"RightCenter\"\r\n              [content]=\"field.tooltip\"\r\n            >\r\n              <span class=\"tooltip-icon\"></span>\r\n            </ejs-tooltip>\r\n          </div>\r\n          <div class=\"form-content\">\r\n            <!-- Radio -->\r\n            <rs-radio-group\r\n              *ngIf=\"field.fieldFormType === 'Radio'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [dataSource]=\"optionsMap[field.optionKey]\"\r\n              [fields]=\"getOptionFields(field)\"\r\n              [disabled]=\"getDisabled(field)\"\r\n              [error]=\"fieldValidMap[field.formKey] === false\"\r\n              (valueChange)=\"onChange($event, field)\"\r\n            ></rs-radio-group>\r\n            <!-- Checkbox -->\r\n            <rs-checkbox-group\r\n              *ngIf=\"field.fieldFormType === 'Checkbox'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [dataSource]=\"optionsMap[field.optionKey]\"\r\n              [fields]=\"getOptionFields(field)\"\r\n              [disabled]=\"getDisabled(field)\"\r\n              [error]=\"fieldValidMap[field.formKey] === false\"\r\n              (valueChange)=\"onChange($event, field)\"\r\n            ></rs-checkbox-group>\r\n            <!-- Switch -->\r\n            <rs-switch-input\r\n              *ngIf=\"field.fieldFormType === 'Switch'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [disabled]=\"getDisabled(field)\"\r\n              (valueChange)=\"onChange($event, field)\"\r\n            ></rs-switch-input>\r\n            <!-- Input -->\r\n            <input\r\n              class=\"e-input\"\r\n              *ngIf=\"\r\n                field.fieldFormType === 'Text' ||\r\n                field.fieldFormType === 'Email'\r\n              \"\r\n              [value]=\"form[field.formKey]\"\r\n              [disabled]=\"getDisabled(field)\"\r\n              [required]=\"field.required\"\r\n              [attr.maxlength]=\"field.maxlength\"\r\n              [attr.minlength]=\"field.minlength\"\r\n              [class.error]=\"fieldValidMap[field.formKey] === false\"\r\n              (input)=\"onInput($event.target.value, field)\"\r\n              (change)=\"onChange($event.target.value, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n              autocomplete=\"off\"\r\n            />\r\n            <!-- Textarea -->\r\n            <textarea\r\n              class=\"e-input\"\r\n              *ngIf=\"field.fieldFormType === 'Textarea'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [disabled]=\"getDisabled(field)\"\r\n              [required]=\"field.required\"\r\n              [attr.maxlength]=\"field.maxlength\"\r\n              [attr.minlength]=\"field.minlength\"\r\n              [class.error]=\"fieldValidMap[field.formKey] === false\"\r\n              (input)=\"onInput($event.target.value, field)\"\r\n              (change)=\"onChange($event.target.value, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n              autocomplete=\"off\"\r\n              rows=\"3\"\r\n            ></textarea>\r\n            <!-- Number Input -->\r\n            <ejs-numerictextbox\r\n              *ngIf=\"field.fieldFormType === 'Number'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [max]=\"field.max\"\r\n              [min]=\"field.min\"\r\n              [step]=\"field.step\"\r\n              [decimals]=\"field.decimals\"\r\n              [format]=\"field.format\"\r\n              [enabled]=\"!getDisabled(field)\"\r\n              [class.error]=\"fieldValidMap[field.formKey] === false\"\r\n              (change)=\"onComponentChange($event, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n            ></ejs-numerictextbox>\r\n            <!-- Tags Input -->\r\n            <rs-tag-input\r\n              *ngIf=\"field.fieldFormType === 'Tags'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [fields]=\"getOptionFields(field)\"\r\n              [inputMaxlength]=\"field.maxlength\"\r\n              [inputMinlength]=\"field.minlength\"\r\n              [disabled]=\"getDisabled(field)\"\r\n              [error]=\"fieldValidMap[field.formKey] === false\"\r\n              (valueChange)=\"onChange($event, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n            ></rs-tag-input>\r\n            <!-- AutoComplete -->\r\n            <ejs-autocomplete\r\n              *ngIf=\"field.fieldFormType === 'AutoComplete'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [dataSource]=\"optionsMap[field.optionKey]\"\r\n              [fields]=\"getOptionFields(field)\"\r\n              [enabled]=\"!getDisabled(field)\"\r\n              [class.error]=\"fieldValidMap[field.formKey] === false\"\r\n              (filtering)=\"onFiltering($event, field)\"\r\n              (change)=\"onComponentChange($event, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n            ></ejs-autocomplete>\r\n            <!-- Dropdown -->\r\n            <ejs-dropdownlist\r\n              *ngIf=\"field.fieldFormType === 'Dropdown'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [dataSource]=\"optionsMap[field.optionKey]\"\r\n              [fields]=\"getOptionFields(field)\"\r\n              [allowFiltering]=\"true\"\r\n              [showClearButton]=\"true\"\r\n              [enabled]=\"!getDisabled(field)\"\r\n              [class.error]=\"fieldValidMap[field.formKey] === false\"\r\n              (filtering)=\"onFiltering($event, field)\"\r\n              (change)=\"onComponentChange($event, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n            ></ejs-dropdownlist>\r\n            <!-- MultiSelect -->\r\n            <ejs-multiselect\r\n              *ngIf=\"field.fieldFormType === 'MultiSelect'\"\r\n              mode=\"CheckBox\"\r\n              [ngModel]=\"form[field.formKey]\"\r\n              [dataSource]=\"optionsMap[field.optionKey]\"\r\n              [fields]=\"getOptionFields(field)\"\r\n              [allowFiltering]=\"true\"\r\n              [showDropDownIcon]=\"true\"\r\n              [enabled]=\"!getDisabled(field)\"\r\n              [class.error]=\"fieldValidMap[field.formKey] === false\"\r\n              (filtering)=\"onFiltering($event, field)\"\r\n              (change)=\"onComponentChange($event, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n            >\r\n            </ejs-multiselect>\r\n            <!-- Datepicker -->\r\n            <ejs-datepicker\r\n              *ngIf=\"field.fieldFormType === 'Datepicker'\"\r\n              [value]=\"getValue(field)\"\r\n              [format]=\"field.format || 'dd-MMM-yyyy'\"\r\n              [enabled]=\"!getDisabled(field)\"\r\n              [class.error]=\"\r\n                fieldValidMap[field.formKey] === false ||\r\n                dateValidMap[field.formKey] === false\r\n              \"\r\n              (change)=\"onComponentChange($event, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onDatePickerBlur($event, field)\"\r\n            ></ejs-datepicker>\r\n            <ng-template\r\n              #customTemplateContainer\r\n              *ngIf=\"field.fieldFormType === 'Custom'\"\r\n            ></ng-template>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"section-form\" *ngIf=\"section.customKey\">\r\n        <ng-template #customSectionContainer></ng-template>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"sections.length > 1 && showAnchor\" class=\"anchor-container\">\r\n    <div\r\n      class=\"anchor-item\"\r\n      *ngFor=\"let section of sections; let index = index\"\r\n      [style.display]=\"section.title ? 'block' : 'none'\"\r\n      [attr.data-active]=\"scrollIndex === index ? 'yes' : 'no'\"\r\n      [attr.data-content]=\"section.title\"\r\n      (click)=\"onClickAnchor(index)\"\r\n    ></div>\r\n  </div>\r\n</div>\r\n",
+                        template: "<div #drawerFormEl class=\"rs-drawer-form-container\">\r\n  <div class=\"section-container\">\r\n    <div #sectionEl class=\"section-item\" *ngFor=\"let section of sections\">\r\n      <input\r\n        type=\"checkbox\"\r\n        class=\"section-expand-checkbox\"\r\n        *ngIf=\"section.title\"\r\n      />\r\n      <div class=\"section-title\" *ngIf=\"section.title\">\r\n        <span>{{ section.title }}</span>\r\n      </div>\r\n      <div class=\"section-form\" *ngIf=\"!section.customKey\">\r\n        <div\r\n          class=\"form-item\"\r\n          *ngFor=\"let field of section.fields\"\r\n          [attr.data-required]=\"field.required ? 'yes' : 'no'\"\r\n          [attr.data-disabled]=\"field.disabled || formDisabled ? 'yes' : 'no'\"\r\n          [attr.data-error]=\"\r\n            fieldValidMap[field.formKey] === false ? 'yes' : 'no'\r\n          \"\r\n        >\r\n          <div class=\"form-label\">\r\n            <span>{{ field.label }}</span>\r\n            <ejs-tooltip\r\n              class=\"form-tooltip\"\r\n              cssClass=\"rs-drawer-tooltip\"\r\n              *ngIf=\"field.tooltip\"\r\n              position=\"RightCenter\"\r\n              [content]=\"field.tooltip\"\r\n            >\r\n              <span class=\"tooltip-icon\"></span>\r\n            </ejs-tooltip>\r\n          </div>\r\n          <div class=\"form-content\">\r\n            <!-- Radio -->\r\n            <rs-radio-group\r\n              *ngIf=\"field.fieldFormType === 'Radio'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [dataSource]=\"getOptions(field)\"\r\n              [fields]=\"getOptionFields(field)\"\r\n              [disabled]=\"getDisabled(field)\"\r\n              [error]=\"fieldValidMap[field.formKey] === false\"\r\n              (valueChange)=\"onChange($event, field)\"\r\n            ></rs-radio-group>\r\n            <!-- Checkbox -->\r\n            <rs-checkbox-group\r\n              *ngIf=\"field.fieldFormType === 'Checkbox'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [dataSource]=\"getOptions(field)\"\r\n              [fields]=\"getOptionFields(field)\"\r\n              [disabled]=\"getDisabled(field)\"\r\n              [error]=\"fieldValidMap[field.formKey] === false\"\r\n              (valueChange)=\"onChange($event, field)\"\r\n            ></rs-checkbox-group>\r\n            <!-- Switch -->\r\n            <rs-switch-input\r\n              *ngIf=\"field.fieldFormType === 'Switch'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [disabled]=\"getDisabled(field)\"\r\n              (valueChange)=\"onChange($event, field)\"\r\n            ></rs-switch-input>\r\n            <!-- Input -->\r\n            <input\r\n              class=\"e-input\"\r\n              *ngIf=\"\r\n                field.fieldFormType === 'Text' ||\r\n                field.fieldFormType === 'Email'\r\n              \"\r\n              [value]=\"form[field.formKey]\"\r\n              [disabled]=\"getDisabled(field)\"\r\n              [required]=\"field.required\"\r\n              [attr.maxlength]=\"field.maxlength\"\r\n              [attr.minlength]=\"field.minlength\"\r\n              [class.error]=\"fieldValidMap[field.formKey] === false\"\r\n              (input)=\"onInput($event.target.value, field)\"\r\n              (change)=\"onChange($event.target.value, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n              autocomplete=\"off\"\r\n            />\r\n            <!-- Textarea -->\r\n            <textarea\r\n              class=\"e-input\"\r\n              *ngIf=\"field.fieldFormType === 'Textarea'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [disabled]=\"getDisabled(field)\"\r\n              [required]=\"field.required\"\r\n              [attr.maxlength]=\"field.maxlength\"\r\n              [attr.minlength]=\"field.minlength\"\r\n              [class.error]=\"fieldValidMap[field.formKey] === false\"\r\n              (input)=\"onInput($event.target.value, field)\"\r\n              (change)=\"onChange($event.target.value, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n              autocomplete=\"off\"\r\n              rows=\"3\"\r\n            ></textarea>\r\n            <!-- Number Input -->\r\n            <ejs-numerictextbox\r\n              *ngIf=\"field.fieldFormType === 'Number'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [max]=\"field.max\"\r\n              [min]=\"field.min\"\r\n              [step]=\"field.step\"\r\n              [decimals]=\"field.decimals\"\r\n              [format]=\"field.format || numberFormat\"\r\n              [enabled]=\"!getDisabled(field)\"\r\n              [class.error]=\"fieldValidMap[field.formKey] === false\"\r\n              (change)=\"onComponentChange($event, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n            ></ejs-numerictextbox>\r\n            <!-- Tags Input -->\r\n            <rs-tag-input\r\n              *ngIf=\"field.fieldFormType === 'Tags'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [fields]=\"getOptionFields(field)\"\r\n              [inputMaxlength]=\"field.maxlength\"\r\n              [inputMinlength]=\"field.minlength\"\r\n              [disabled]=\"getDisabled(field)\"\r\n              [error]=\"fieldValidMap[field.formKey] === false\"\r\n              (valueChange)=\"onChange($event, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n            ></rs-tag-input>\r\n            <!-- AutoComplete -->\r\n            <ejs-autocomplete\r\n              *ngIf=\"field.fieldFormType === 'AutoComplete'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [dataSource]=\"getOptions(field)\"\r\n              [fields]=\"getOptionFields(field)\"\r\n              [enabled]=\"!getDisabled(field)\"\r\n              [class.error]=\"fieldValidMap[field.formKey] === false\"\r\n              (filtering)=\"onFiltering($event, field)\"\r\n              (change)=\"onComponentChange($event, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n            ></ejs-autocomplete>\r\n            <!-- Dropdown -->\r\n            <ejs-dropdownlist\r\n              *ngIf=\"field.fieldFormType === 'Dropdown'\"\r\n              [value]=\"form[field.formKey]\"\r\n              [dataSource]=\"getOptions(field)\"\r\n              [fields]=\"getOptionFields(field)\"\r\n              [allowFiltering]=\"true\"\r\n              [showClearButton]=\"true\"\r\n              [enabled]=\"!getDisabled(field)\"\r\n              [class.error]=\"fieldValidMap[field.formKey] === false\"\r\n              (filtering)=\"onFiltering($event, field)\"\r\n              (change)=\"onComponentChange($event, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n            ></ejs-dropdownlist>\r\n            <!-- MultiSelect -->\r\n            <ejs-multiselect\r\n              *ngIf=\"field.fieldFormType === 'MultiSelect'\"\r\n              mode=\"CheckBox\"\r\n              [ngModel]=\"form[field.formKey]\"\r\n              [dataSource]=\"getOptions(field)\"\r\n              [fields]=\"getOptionFields(field)\"\r\n              [allowFiltering]=\"true\"\r\n              [showDropDownIcon]=\"true\"\r\n              [enabled]=\"!getDisabled(field)\"\r\n              [class.error]=\"fieldValidMap[field.formKey] === false\"\r\n              (filtering)=\"onFiltering($event, field)\"\r\n              (change)=\"onComponentChange($event, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onBlur(field)\"\r\n            >\r\n            </ejs-multiselect>\r\n            <!-- Datepicker -->\r\n            <ejs-datepicker\r\n              *ngIf=\"field.fieldFormType === 'Datepicker'\"\r\n              [(value)]=\"dateForm[field.formKey]\"\r\n              [format]=\"field.format || dateFormat\"\r\n              [enabled]=\"!getDisabled(field)\"\r\n              [class.error]=\"\r\n                fieldValidMap[field.formKey] === false ||\r\n                dateValidMap[field.formKey] === false\r\n              \"\r\n              (change)=\"onComponentChange($event, field)\"\r\n              (focus)=\"onFocus(field)\"\r\n              (blur)=\"onDatePickerBlur($event, field)\"\r\n            ></ejs-datepicker>\r\n            <ng-template\r\n              #customTemplateContainer\r\n              *ngIf=\"field.fieldFormType === 'Custom'\"\r\n            ></ng-template>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"section-form\" *ngIf=\"section.customKey\">\r\n        <ng-template #customSectionContainer></ng-template>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"sections.length > 1 && showAnchor\" class=\"anchor-container\">\r\n    <div\r\n      class=\"anchor-item\"\r\n      *ngFor=\"let section of sections; let index = index\"\r\n      [style.display]=\"section.title ? 'block' : 'none'\"\r\n      [attr.data-active]=\"scrollIndex === index ? 'yes' : 'no'\"\r\n      [attr.data-content]=\"section.title\"\r\n      (click)=\"onClickAnchor(index)\"\r\n    ></div>\r\n  </div>\r\n</div>\r\n",
                         styles: [":host{display:block;margin-top:16px}.rs-drawer-form-container{display:flex;flex-flow:row nowrap;align-items:flex-start;gap:32px}.rs-drawer-form-container .section-container{flex:auto;display:flex;flex-flow:column nowrap;max-width:1576px}.rs-drawer-form-container .section-item{position:relative}.rs-drawer-form-container .section-item:not(:first-child){border-top:1px solid #eaedf0}.rs-drawer-form-container .section-expand-checkbox{display:block;width:100%;height:28px;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;position:absolute;top:0;left:0}.rs-drawer-form-container .section-expand-checkbox:checked+.section-title::before{transform:rotate(-90deg)}.rs-drawer-form-container .section-expand-checkbox:checked+.section-title+.section-form{max-height:0;overflow:hidden}.rs-drawer-form-container .section-title{padding:6px 0;margin-bottom:12px;color:#44566c;font-family:Arial;font-size:13px;font-style:normal;font-weight:700;line-height:16px;display:flex;flex-flow:row nowrap;align-items:center;pointer-events:none}.rs-drawer-form-container .section-title::before{content:url(../../../assets/img/down-arrow.svg);display:block;height:16px;width:16px;margin-right:8px}.rs-drawer-form-container .section-form{display:flex;flex-flow:row wrap;justify-content:space-between;gap:12px 56px;max-width:1576px;padding:0 24px;margin-bottom:20px}.rs-drawer-form-container .section-form .form-item{min-height:28px;min-width:400px;max-width:700px;width:calc((100% - 56px)/ 2);display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:flex-start}.rs-drawer-form-container .section-form .form-item[data-required=yes] .form-label>span:first-child::after{content:\"*\";color:var(--rs-input-require-label-color)}.rs-drawer-form-container .section-form .form-item .form-label{flex:none;width:144px;height:28px;margin-right:16px;color:#43566c;font-family:Arial;font-size:12px;font-style:normal;font-weight:400;line-height:14px;display:flex;flex-flow:row nowrap;align-items:center}.rs-drawer-form-container .section-form .form-item .form-label .form-tooltip{margin-left:4px}.rs-drawer-form-container .section-form .form-item .form-label .form-tooltip .tooltip-icon::before{content:\" \";display:block;width:14px;height:14px;background-image:url(../../../assets/img/tooltip-icon.svg);background-size:contain;cursor:pointer}.rs-drawer-form-container .section-form .form-item .form-content{flex:auto}@media (max-width:1420px){.rs-drawer-form-container .section-form .form-item{width:100%}}.rs-drawer-form-container .anchor-container{flex:none;display:flex;flex-flow:column nowrap;gap:4px;min-width:120px;height:auto;position:-webkit-sticky;position:sticky;top:56px}.rs-drawer-form-container .anchor-item{min-width:120px;padding:4px 12px;border-left:1px solid #eaedf0;cursor:pointer;color:#44566c;font-family:Arial;font-size:11px;font-style:normal;font-weight:400;line-height:16px;position:relative}.rs-drawer-form-container .anchor-item::before{content:attr(data-content);color:#44566c;font-weight:400;position:absolute;left:12px}.rs-drawer-form-container .anchor-item::after{content:attr(data-content);visibility:hidden;color:#1364b3;font-weight:700}.rs-drawer-form-container .anchor-item[data-active=yes]{border-color:#1f7bff}.rs-drawer-form-container .anchor-item[data-active=yes]::before{visibility:hidden}.rs-drawer-form-container .anchor-item[data-active=yes]::after{visibility:visible}.rs-drawer-tooltip.e-tooltip-wrap{border:none;background-color:#44566c}.rs-drawer-tooltip.e-tooltip-wrap .e-arrow-tip{height:4px;visibility:hidden}"]
                     }] }
         ];
@@ -23062,15 +23136,17 @@
             { type: core.ChangeDetectorRef }
         ]; };
         DrawerFormComponent.propDecorators = {
+            _form: [{ type: core.Input, args: ["form",] }],
             _sections: [{ type: core.Input, args: ["sections",] }],
             optionsMap: [{ type: core.Input, args: ["optionsMap",] }],
-            customTemplate: [{ type: core.Input, args: ["customTemplate",] }],
-            customSectionTemplate: [{ type: core.Input, args: ["customSectionTemplate",] }],
             formDisabled: [{ type: core.Input, args: ["disabled",] }],
             showAnchor: [{ type: core.Input, args: ["showAnchor",] }],
+            customTemplate: [{ type: core.Input, args: ["customTemplate",] }],
+            customSectionTemplate: [{ type: core.Input, args: ["customSectionTemplate",] }],
             optionFields: [{ type: core.Input, args: ["optionFields",] }],
             showFilterNumber: [{ type: core.Input, args: ["showFilterNumber",] }],
-            form: [{ type: core.Input, args: ["form",] }],
+            numberFormat: [{ type: core.Input, args: ["numberFormat",] }],
+            dateFormat: [{ type: core.Input, args: ["dateFormat",] }],
             formChange: [{ type: core.Output, args: ["formChange",] }],
             fieldChange: [{ type: core.Output, args: ["fieldChange",] }],
             rootEl: [{ type: core.ViewChild, args: ["drawerFormEl", { static: false },] }],
@@ -23081,24 +23157,28 @@
         return DrawerFormComponent;
     }());
     if (false) {
+        /** @type {?} */
+        DrawerFormComponent.prototype._form;
         /** @type {?} */
         DrawerFormComponent.prototype._sections;
         /** @type {?} */
         DrawerFormComponent.prototype.optionsMap;
         /** @type {?} */
-        DrawerFormComponent.prototype.customTemplate;
-        /** @type {?} */
-        DrawerFormComponent.prototype.customSectionTemplate;
-        /** @type {?} */
         DrawerFormComponent.prototype.formDisabled;
         /** @type {?} */
         DrawerFormComponent.prototype.showAnchor;
         /** @type {?} */
+        DrawerFormComponent.prototype.customTemplate;
+        /** @type {?} */
+        DrawerFormComponent.prototype.customSectionTemplate;
+        /** @type {?} */
         DrawerFormComponent.prototype.optionFields;
         /** @type {?} */
         DrawerFormComponent.prototype.showFilterNumber;
         /** @type {?} */
-        DrawerFormComponent.prototype.form;
+        DrawerFormComponent.prototype.numberFormat;
+        /** @type {?} */
+        DrawerFormComponent.prototype.dateFormat;
         /** @type {?} */
         DrawerFormComponent.prototype.formChange;
         /** @type {?} */
@@ -23118,10 +23198,12 @@
         /** @type {?} */
         DrawerFormComponent.prototype.sections;
         /** @type {?} */
-        DrawerFormComponent.prototype.filterOptionsMap;
+        DrawerFormComponent.prototype.form;
         /** @type {?} */
         DrawerFormComponent.prototype.fieldValidMap;
         /** @type {?} */
+        DrawerFormComponent.prototype.dateForm;
+        /** @type {?} */
         DrawerFormComponent.prototype.dateValidMap;
         /** @type {?} */
         DrawerFormComponent.prototype.sectionEls;
@@ -23703,6 +23785,1227 @@
         ConfirmSelectComponent.prototype.isInteracted;
     }
 
+    /**
+     * @fileoverview added by tsickle
+     * Generated from: lib/form/richtexteditor/ai-config.ts
+     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    /**
+     * @record
+     */
+    function AIConfig() { }
+    if (false) {
+        /** @type {?} */
+        AIConfig.prototype.endpoint;
+        /** @type {?} */
+        AIConfig.prototype.apiKey;
+        /** @type {?} */
+        AIConfig.prototype.deployment;
+        /** @type {?} */
+        AIConfig.prototype.apiVersion;
+        /** @type {?} */
+        AIConfig.prototype.enabled;
+    }
+    // 从环境配置获取AI配置
+    /**
+     * @return {?}
+     */
+    function getAIConfig() {
+        return {
+            endpoint: "https://aidevused.openai.azure.com/",
+            apiKey: "ccba76e279f64653a50ac4fee90afe5c",
+            deployment: "gpt-4",
+            apiVersion: "2025-01-01-preview",
+            enabled: true,
+        };
+    }
+    // 检查配置是否有效
+    /**
+     * @param {?} config
+     * @return {?}
+     */
+    function isAIConfigValid(config) {
+        // 检查是否为aidevused端点且有有效API密钥
+        return !!((config.endpoint &&
+            config.apiKey &&
+            config.deployment &&
+            config.enabled &&
+            config.endpoint === "https://aidevused.openai.azure.com/" &&
+            config.apiKey !== "your-api-key-here") // Azure OpenAI API密钥通常以sk-开头
+        );
+    }
+    // 从后端API获取AI配置（推荐方式）
+    /**
+     * @return {?}
+     * @this {*}
+     */
+    function getAIConfigFromBackend() {
+        return __awaiter(this, void 0, void 0, function () {
+            return __generator(this, function (_a) {
+                try {
+                    // 这里应该调用你的后端API来获取AI配置
+                    // 例如：return await this.http.get('/api/ai-config');
+                    // 临时返回默认配置
+                    return [2 /*return*/, getAIConfig()];
+                }
+                catch (error) {
+                    console.error("Failed to get AI config from backend:", error);
+                    return [2 /*return*/, getAIConfig()];
+                }
+                return [2 /*return*/];
+            });
+        });
+    }
+
+    /**
+     * @fileoverview added by tsickle
+     * Generated from: lib/form/richtexteditor/openapi.ts
+     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    // import { testAIFunction } from './ai-test';
+    // testAIFunction();
+    // 使用fetch API发送请求到Azure OpenAI
+    /**
+     * @param {?} messages
+     * @param {?} config
+     * @return {?}
+     * @this {*}
+     */
+    function sendAIRequest(messages, config) {
+        return __awaiter(this, void 0, void 0, function () {
+            var url, url1, response, errorText, data, error_1;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        _a.trys.push([0, 5, , 6]);
+                        url = config.endpoint + "/openai/deployments/" + config.deployment + "/chat/completions?api-version=" + config.apiVersion;
+                        url1 = "" + config.endpoint;
+                        return [4 /*yield*/, fetch(url, {
+                                method: 'POST',
+                                headers: {
+                                    'Content-Type': 'application/json',
+                                    'api-key': config.apiKey,
+                                },
+                                body: JSON.stringify({
+                                    messages: messages,
+                                    max_tokens: 1000,
+                                    temperature: 0.7,
+                                    top_p: 1,
+                                    frequency_penalty: 0,
+                                    presence_penalty: 0,
+                                }),
+                            })];
+                    case 1:
+                        response = _a.sent();
+                        if (!!response.ok) return [3 /*break*/, 3];
+                        return [4 /*yield*/, response.text()];
+                    case 2:
+                        errorText = _a.sent();
+                        throw new Error("HTTP error! status: " + response.status + ", message: " + errorText);
+                    case 3: return [4 /*yield*/, response.json()];
+                    case 4:
+                        data = _a.sent();
+                        if (!data.choices || !data.choices[0] || !data.choices[0].message) {
+                            throw new Error('Invalid response format from AI service');
+                        }
+                        return [2 /*return*/, data.choices[0].message.content];
+                    case 5:
+                        error_1 = _a.sent();
+                        console.error('AI request failed:', error_1);
+                        throw error_1;
+                    case 6: return [2 /*return*/];
+                }
+            });
+        });
+    }
+    // 备用方案：使用模拟数据（用于开发测试）
+    /**
+     * @param {?} subQuery
+     * @param {?} promptQuery
+     * @return {?}
+     */
+    function getMockAIResponse(subQuery, promptQuery) {
+        var e_1, _a;
+        /** @type {?} */
+        var mockResponses = {
+            Rephrase: "Rephrased: " + promptQuery,
+            Grammar: "Corrected: " + promptQuery,
+            Summarize: "Summary: " + promptQuery.substring(0, 100) + "...",
+            Elaborate: "Elaborated: " + promptQuery + " with additional details and context.",
+            Translate: "Translated: " + promptQuery,
+            SentimentAnalysis: '😊 Positive',
+        };
+        try {
+            for (var _b = __values(Object.entries(mockResponses)), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var _d = __read(_c.value, 2), key = _d[0], value = _d[1];
+                if (subQuery.includes(key)) {
+                    return value;
+                }
+            }
+        }
+        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+        finally {
+            try {
+                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            }
+            finally { if (e_1) throw e_1.error; }
+        }
+        return "AI processed: " + promptQuery;
+    }
+    // 主要的AI请求方法
+    /**
+     * @param {?} subQuery
+     * @param {?} promptQuery
+     * @return {?}
+     * @this {*}
+     */
+    function OpenAiModelRTE(subQuery, promptQuery) {
+        return __awaiter(this, void 0, void 0, function () {
+            var config, messages, result, error_2;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        _a.trys.push([0, 2, , 3]);
+                        config = getAIConfig();
+                        // 检查配置是否有效
+                        if (!isAIConfigValid(config)) {
+                            console.warn('AI configuration is incomplete or disabled, using mock response');
+                            return [2 /*return*/, getMockAIResponse(subQuery, promptQuery)];
+                        }
+                        messages = [
+                            {
+                                role: 'system',
+                                content: subQuery.includes('emoji followed by the sentiment in the format')
+                                    ? 'You are a helpful assistant. Please respond in string format.'
+                                    : "NOTE: Return same html format just do changes content only. don't change html formats.",
+                            },
+                            {
+                                role: 'user',
+                                content: subQuery + " " + promptQuery,
+                            },
+                        ];
+                        return [4 /*yield*/, sendAIRequest(messages, config)];
+                    case 1:
+                        result = _a.sent();
+                        return [2 /*return*/, result];
+                    case 2:
+                        error_2 = _a.sent();
+                        console.error('AI request failed, using mock response:', error_2);
+                        return [2 /*return*/, getMockAIResponse(subQuery, promptQuery)];
+                    case 3: return [2 /*return*/];
+                }
+            });
+        });
+    }
+    // 兼容性方法（保持向后兼容）
+    /**
+     * @param {?} options
+     * @return {?}
+     * @this {*}
+     */
+    function getAzureChatAIRequest(options) {
+        return __awaiter(this, void 0, void 0, function () {
+            var config, result, err_1;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        _a.trys.push([0, 2, , 3]);
+                        config = getAIConfig();
+                        if (!isAIConfigValid(config)) {
+                            return [2 /*return*/, null];
+                        }
+                        return [4 /*yield*/, sendAIRequest(options.messages, config)];
+                    case 1:
+                        result = _a.sent();
+                        return [2 /*return*/, result];
+                    case 2:
+                        err_1 = _a.sent();
+                        console.error('Error occurred:', err_1);
+                        return [2 /*return*/, null];
+                    case 3: return [2 /*return*/];
+                }
+            });
+        });
+    }
+    /**
+     * @param {?} prompt
+     * @return {?}
+     * @this {*}
+     */
+    function getAzureTextAIRequest(prompt) {
+        return __awaiter(this, void 0, void 0, function () {
+            var config, messages, result, err_2;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        _a.trys.push([0, 2, , 3]);
+                        config = getAIConfig();
+                        if (!isAIConfigValid(config)) {
+                            return [2 /*return*/, undefined];
+                        }
+                        messages = [
+                            {
+                                role: 'user',
+                                content: prompt,
+                            },
+                        ];
+                        return [4 /*yield*/, sendAIRequest(messages, config)];
+                    case 1:
+                        result = _a.sent();
+                        return [2 /*return*/, result];
+                    case 2:
+                        err_2 = _a.sent();
+                        console.error('Error occurred:', err_2);
+                        return [2 /*return*/, undefined];
+                    case 3: return [2 /*return*/];
+                }
+            });
+        });
+    }
+
+    /**
+     * @fileoverview added by tsickle
+     * Generated from: lib/form/richtexteditor/data-config.ts
+     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    // font family
+    /** @type {?} */
+    var fontFamily = {
+        default: "Arial",
+        items: [
+            {
+                text: "Arial",
+                value: "Arial, Helvetica, sans-serif",
+                cssClass: "e-arial",
+                command: "Font",
+                subCommand: "FontName",
+            },
+            {
+                text: "Times New Roman",
+                value: "Times New Roman,Times,serif",
+                cssClass: "e-times-new-roman",
+                command: "Font",
+                subCommand: "FontName",
+            },
+            {
+                text: "Helvetica",
+                value: "Helvetica",
+                cssClass: "e-helvetica",
+                command: "Font",
+                subCommand: "FontName",
+            },
+            {
+                text: "Calibri",
+                value: "Calibri, Helvetica, sans-serif",
+                cssClass: "e-calibri",
+                command: "Font",
+                subCommand: "FontName",
+            },
+            {
+                text: "Verdana",
+                value: "Verdana,Geneva,sans-serif",
+                cssClass: "e-verdana",
+                command: "Font",
+                subCommand: "FontName",
+            },
+            {
+                text: "Georgia",
+                value: "Georgia,serif",
+                cssClass: "e-georgia",
+                command: "Font",
+                subCommand: "FontName",
+            },
+            {
+                text: "Open Sans",
+                value: "Open Sans, sans-serif",
+                cssClass: "e-open-sans",
+                command: "Font",
+                subCommand: "FontName",
+            },
+            {
+                text: "Roboto",
+                value: "Roboto",
+                cssClass: "e-roboto",
+                command: "Font",
+                subCommand: "FontName",
+            },
+            {
+                text: "Lato",
+                value: "Lato, sans-serif",
+                cssClass: "e-lato",
+                command: "Font",
+                subCommand: "FontName",
+            },
+            {
+                text: "Montserrat",
+                value: "Montserrat, sans-serif",
+                cssClass: "e-montserrat",
+                command: "Font",
+                subCommand: "FontName",
+            },
+            {
+                text: "Segoe UI",
+                value: "Segoe UI",
+                cssClass: "e-segoe-ui",
+                command: "Font",
+                subCommand: "FontName",
+            },
+            {
+                text: "Impact",
+                value: "Impact,Charcoal,sans-serif",
+                cssClass: "e-impact",
+                command: "Font",
+                subCommand: "FontName",
+            },
+        ],
+    };
+    // line height配置
+    /** @type {?} */
+    var lineHeight_items = [
+        {
+            text: "1.0",
+        },
+        {
+            text: "1.15",
+        },
+        {
+            text: "1.5",
+        },
+        {
+            text: "2.0",
+        },
+        {
+            text: "2.5",
+        },
+        {
+            text: "3.0",
+        },
+    ];
+    /**
+     * @record
+     */
+    function BulletStyle() { }
+    if (false) {
+        /** @type {?} */
+        BulletStyle.prototype.id;
+        /** @type {?} */
+        BulletStyle.prototype.text;
+        /** @type {?} */
+        BulletStyle.prototype.symbol;
+        /** @type {?} */
+        BulletStyle.prototype.iconCss;
+        /** @type {?} */
+        BulletStyle.prototype.description;
+    }
+    /** @type {?} */
+    var BULLET_STYLES = [
+        {
+            id: "disc",
+            text: "● 实心圆点",
+            symbol: "●",
+            iconCss: "e-icons e-bullet-disc",
+            description: "标准实心圆点",
+        },
+        {
+            id: "circle",
+            text: "○ 空心圆点",
+            symbol: "○",
+            iconCss: "e-icons e-bullet-circle",
+            description: "空心圆点",
+        },
+        {
+            id: "square",
+            text: "■ 实心方块",
+            symbol: "■",
+            iconCss: "e-icons e-bullet-square",
+            description: "实心方块",
+        },
+        {
+            id: "diamond",
+            text: "◆ 实心菱形",
+            symbol: "◆",
+            iconCss: "e-icons e-bullet-diamond",
+            description: "实心菱形",
+        },
+        {
+            id: "triangle",
+            text: "► 实心三角",
+            symbol: "►",
+            iconCss: "e-icons e-bullet-triangle",
+            description: "实心三角形",
+        },
+        {
+            id: "arrow",
+            text: "➤ 箭头",
+            symbol: "➤",
+            iconCss: "e-icons e-bullet-arrow",
+            description: "箭头符号",
+        },
+        {
+            id: "star",
+            text: "★ 星形",
+            symbol: "★",
+            iconCss: "e-icons e-bullet-star",
+            description: "星形符号",
+        },
+        {
+            id: "check",
+            text: "✓ 对勾",
+            symbol: "✓",
+            iconCss: "e-icons e-bullet-check",
+            description: "对勾符号",
+        },
+        {
+            id: "heart",
+            text: "♥ 心形",
+            symbol: "♥",
+            iconCss: "e-icons e-bullet-heart",
+            description: "心形符号",
+        },
+        {
+            id: "bullet",
+            text: "• 小圆点",
+            symbol: "•",
+            iconCss: "e-icons e-bullet-bullet",
+            description: "小圆点",
+        },
+    ];
+    // 获取符号样式
+    /**
+     * @param {?} id
+     * @return {?}
+     */
+    function getBulletStyle(id) {
+        return BULLET_STYLES.find((/**
+         * @param {?} style
+         * @return {?}
+         */
+        function (style) { return style.id === id; }));
+    }
+    // 获取所有符号样式
+    /**
+     * @return {?}
+     */
+    function getAllBulletStyles() {
+        return BULLET_STYLES;
+    }
+    // 应用符号样式到列表
+    /**
+     * @param {?} ul
+     * @param {?} style
+     * @return {?}
+     */
+    function applyBulletStyle(ul, style) {
+        if (style.id === "disc" || style.id === "circle" || style.id === "square") {
+            // 使用CSS list-style-type
+            ul.style.listStyleType = style.id;
+            // 移除自定义符号
+            ul.querySelectorAll(".custom-bullet").forEach((/**
+             * @param {?} bullet
+             * @return {?}
+             */
+            function (bullet) { return bullet.remove(); }));
+        }
+        else {
+            // 使用自定义符号
+            ul.style.listStyleType = "none";
+            ul.setAttribute("data-bullet-style", style.id);
+            /** @type {?} */
+            var listItems = ul.querySelectorAll("li");
+            listItems.forEach((/**
+             * @param {?} li
+             * @return {?}
+             */
+            function (li) {
+                // 移除现有的自定义符号
+                /** @type {?} */
+                var existingBullet = li.querySelector(".custom-bullet");
+                if (existingBullet) {
+                    existingBullet.remove();
+                }
+                // 添加新的自定义符号
+                /** @type {?} */
+                var bullet = document.createElement("span");
+                bullet.className = "custom-bullet";
+                bullet.textContent = style.symbol;
+                bullet.style.marginRight = "8px";
+                bullet.style.color = "#666";
+                // 将符号插入到列表项的开头
+                li.insertBefore(bullet, li.firstChild);
+            }));
+        }
+    }
+
+    /**
+     * @fileoverview added by tsickle
+     * Generated from: lib/form/richtexteditor/index.component.ts
+     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    var RichtexteditorComponent = /** @class */ (function () {
+        function RichtexteditorComponent(ref) {
+            this.ref = ref;
+            // @ViewChild("chipList", { static: false }) public chipList!: ChipListComponent;
+            this.placeholder = "";
+            this.value = "";
+            this.height = 150;
+            this.autoSaveOnIdle = true;
+            this.target = "#container"; // dialog 弹窗父级
+            // dialog 弹窗父级
+            this.toolbarClick = new core.EventEmitter();
+            this.change = new core.EventEmitter();
+            // @Output() change = new EventEmitter();
+            this.family = fontFamily;
+            this.dialogWidth = "800px";
+            this.dialogHeight = "642px";
+            this.showZoomBtn = true;
+            this.showMsg = false;
+            this.insertImageSettings = {
+                saveFormat: "Blob",
+                allowedTypes: [".svg", ".png"],
+                display: "none",
+            };
+            this.size = "";
+            this.dropValIndex = 0;
+            this.queryList = [
+                { id: "Rephrase", text: "Rephrase" },
+                { id: "Grammar", text: "Correct Grammar" },
+                { id: "Summarize", text: "Summarize" },
+                { id: "Elaborate", text: "Elaborate" },
+                { id: "Translate", text: "Translate" },
+                { id: "SentimentAnalysis", text: "Sentiment Analysis" },
+            ];
+            this.rephraseTyleList = [
+                { text: "Standard", id: "Standard" },
+                { text: "Fluent", id: "Fluent" },
+                { text: "Professional", id: "Professional" },
+            ];
+            this.languageList = [
+                { id: "EN", text: "English" },
+                { id: "ZH", text: "Chinese (Simplified)" },
+                { id: "ES", text: "Spanish" },
+                { id: "ZHT", text: "Chinese (Traditional)" },
+                { id: "HI", text: "Hindi" },
+                { id: "AR", text: "Arabic" },
+                { id: "BN", text: "Bengali" },
+                { id: "PT", text: "Portuguese" },
+                { id: "RU", text: "Russian" },
+                { id: "JA", text: "Japanese" },
+                { id: "DE", text: "German" },
+                { id: "KO", text: "Korean" },
+                { id: "FR", text: "French" },
+                { id: "IT", text: "Italian" },
+                { id: "TR", text: "Turkish" },
+            ];
+            this.promptQuery = "";
+            this.isSentimentCheck = false;
+            this.subQuery = "";
+            this.chipValue = "Standard";
+            this.tools = {
+                enableFloating: false,
+                items: [
+                    {
+                        tooltipText: "AI Assist",
+                        template: '<button class="e-tbar-btn e-btn" tabindex="-1" id="ai_assistant_button_tbar" style="width:100%"><div class="e-rte-dropdown-btn-text">AI Assist</div></button>',
+                    },
+                    "Bold",
+                    "Italic",
+                    "Underline",
+                    "StrikeThrough",
+                    "FontName",
+                    "FontSize",
+                    "FontColor",
+                    "BackgroundColor",
+                    "LowerCase",
+                    "UpperCase",
+                    "|",
+                    "CreateTable",
+                    "Formats",
+                    "Alignments",
+                    {
+                        tooltipText: "Line Height",
+                        template: '<button class="e-tbar-btn e-btn" tabindex="-1" id="lineheight_tbar"  style="width:100%"></button>',
+                    },
+                    "OrderedList",
+                    "UnorderedList",
+                    "Outdent",
+                    "Indent",
+                    "|",
+                    "CreateLink",
+                    {
+                        tooltipText: "",
+                        template: '<button class="e-tbar-btn e-btn" tabindex="-1" id="custom_tbar"  style="width:100%">' +
+                            '<div class="e-tbar-btn-text" style="font-weight: 500;"><img src="/assets/img/file-icon.svg" style="position: relative;top: -2px;"/><div class="uploadActions"><div id="uploadFromUser">Computer File</div><div id="relationDom">Ticket Attachment</div></div></div></button>',
+                    },
+                    "|",
+                    "FormatPainter",
+                    "ClearFormat",
+                    "|",
+                    "Undo",
+                    "Redo",
+                ],
+            };
+        }
+        /**
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.ngOnInit = /**
+         * @return {?}
+         */
+        function () { };
+        /**
+         * @param {?} args
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.onContentChange = /**
+         * @param {?} args
+         * @return {?}
+         */
+        function (args) {
+            /** @type {?} */
+            var tables = document.querySelectorAll("table.e-rte-table");
+            tables.forEach((/**
+             * @param {?} table
+             * @return {?}
+             */
+            function (table) {
+                /** @type {?} */
+                var htmlTable = (/** @type {?} */ (table));
+                htmlTable.style.marginBottom = "10px";
+                htmlTable.style.borderCollapse = "collapse";
+                htmlTable.style.emptyCells = "show";
+                /** @type {?} */
+                var tdElements = table.querySelectorAll("td");
+                tdElements.forEach((/**
+                 * @param {?} td
+                 * @return {?}
+                 */
+                function (td) {
+                    td.style.border = "1px solid #adb5bd";
+                    td.style.height = "20px";
+                    td.style.minWidth = "20px";
+                    td.style.padding = "2px 5px";
+                    td.style.boxSizing = "border-box";
+                }));
+            }));
+            this.change.emit(args);
+        };
+        /**
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.onCreate = /**
+         * @return {?}
+         */
+        function () {
+            var _this = this;
+            //bind the a click event
+            // let editorContent = this.rteObj.contentModule.getEditPanel() as HTMLElement;
+            // editorContent.addEventListener('click', this.OnClicked.bind(this));
+            //add the line height
+            this.editorManager = this.rteObj.formatter.editorManager;
+            /** @type {?} */
+            var splitButton = new ej2AngularSplitbuttons.DropDownButton({
+                items: lineHeight_items,
+                iconCss: "e-icons e-line-spacing",
+                select: this.onSelect.bind(this),
+            });
+            splitButton.appendTo("#lineheight_tbar");
+            // ai assist
+            /** @type {?} */
+            var aiassistantButton = new ej2AngularSplitbuttons.DropDownButton({
+                items: this.queryList,
+                // iconCss: "e-btn-icon e-icons e-assistview-icon e-icon-left",
+                select: (/**
+                 * @param {?} args
+                 * @return {?}
+                 */
+                function (args) { return _this.aiQuerySelectedMenu(args); }),
+            });
+            aiassistantButton.appendTo("#ai_assistant_button_tbar");
+        };
+        /**
+         * @private
+         * @param {?} args
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.onSelect = /**
+         * @private
+         * @param {?} args
+         * @return {?}
+         */
+        function (args) {
+            if (this.rteObj.formatter.getUndoRedoStack().length === 0) {
+                this.rteObj.formatter.saveData();
+            }
+            /** @type {?} */
+            var nodes = this.editorManager.domNode.blockNodes();
+            for (var i = 0; nodes.length > i; i++) {
+                ((/** @type {?} */ (nodes[i]))).style.lineHeight = args.item.text;
+            }
+            this.rteObj.formatter.saveData();
+            this.rteObj.formatter.enableUndo(this.rteObj);
+        };
+        /**
+         * @private
+         * @param {?} args
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.aiQuerySelectedMenu = /**
+         * @private
+         * @param {?} args
+         * @return {?}
+         */
+        function (args) {
+            this.dialogueOpen(args.item.text);
+        };
+        /**
+         * @param {?} selectedQuery
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.dialogueOpen = /**
+         * @param {?} selectedQuery
+         * @return {?}
+         */
+        function (selectedQuery) {
+            var _this = this;
+            /** @type {?} */
+            var selectionText = this.rteObj.getSelectedHtml();
+            this.selectedQuery = selectedQuery;
+            if (selectionText) {
+                /** @type {?} */
+                var range = ((/** @type {?} */ (this.rteObj))).formatter.editorManager.nodeSelection.getRange(((/** @type {?} */ (this.rteObj))).contentModule.getDocument());
+                ((/** @type {?} */ (this.rteObj))).formatter.editorManager.nodeSelection.save(range, ((/** @type {?} */ (this.rteObj))).contentModule.getDocument());
+                this.dropValIndex = this.queryList.findIndex((/**
+                 * @param {?} q
+                 * @return {?}
+                 */
+                function (q) { return q.text.toLowerCase() === selectedQuery.toLowerCase(); }));
+                this.queryCategory.index = this.dropValIndex;
+                this.leftRte.value = this.promptQuery = selectionText;
+                this.leftRte.refreshUI();
+                this.AIdialog.show();
+                this.updateAISugesstionsData(selectedQuery);
+            }
+            else {
+                this.showMsg = true;
+                setTimeout((/**
+                 * @return {?}
+                 */
+                function () {
+                    _this.showMsg = false;
+                }), 3000);
+                console.log("Please select the content to perform the AI operation.");
+            }
+        };
+        /**
+         * @param {?} selectedQuery
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.updateAISugesstionsData = /**
+         * @param {?} selectedQuery
+         * @return {?}
+         */
+        function (selectedQuery) {
+            this.isSentimentCheck = false;
+            switch (selectedQuery) {
+                case "Summarize":
+                    this.subQuery = "Summarize the upcoming sentence shortly.";
+                    break;
+                case "Elaborate":
+                    this.subQuery = "Elaborate on the upcoming sentence.";
+                    break;
+                case "Rephrase":
+                    this.subQuery = this.chipValue + " rephrase the upcoming sentence.";
+                    break;
+                case "Correct Grammar":
+                    this.subQuery = "Correct the grammar of the upcoming sentence.";
+                    break;
+                case "Translate":
+                    this.subQuery =
+                        "Translate the upcoming sentence to " + this.translatelanguage + ".";
+                    break;
+                case "Sentiment Analysis":
+                    this.isSentimentCheck = true;
+                    this.subQuery =
+                        'Analyze the sentiment and grammar of the following paragraphs and provide the expression score with an emoji followed by the sentiment in the format: "😊 Neutral". \n\nNOTE: Avoid any additional text or explanation:';
+                    break;
+            }
+            this.updateAISugesstions();
+        };
+        /**
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.updateAISugesstions = /**
+         * @return {?}
+         */
+        function () {
+            var _this = this;
+            try {
+                if (this.promptQuery) {
+                    ((/** @type {?} */ (document.getElementById("skeletonId")))).style.display =
+                        "";
+                    ((/** @type {?} */ (document.getElementById("rightRte")))).style.display =
+                        "none";
+                    this.sentimentButton.element.style.display = "none";
+                    this.regenerateButton.disabled = true;
+                    this.copyButton.disabled = true;
+                    this.replaceButton.disabled = true;
+                    this.apiResultData = this.getResponseFromOpenAI(this.subQuery, this.promptQuery);
+                    this.apiResultData.then((/**
+                     * @param {?} result
+                     * @return {?}
+                     */
+                    function (result) {
+                        _this.AIResult = _this.isSentimentCheck ? _this.promptQuery : result;
+                        _this.sentimentButton.content = result
+                            .toLowerCase()
+                            .includes("positive")
+                            ? "😊 Positive"
+                            : result.toLowerCase().includes("negative")
+                                ? "😞 Negative"
+                                : "😐 Neutral";
+                        _this.sentimentButton.element.style.display = !_this.isSentimentCheck
+                            ? "none"
+                            : "";
+                        _this.rightRte.value = _this.AIResult;
+                        /** @type {?} */
+                        var noResultsFound = !(_this.AIResult || _this.promptQuery);
+                        ((/** @type {?} */ (document.getElementById("no-results-found")))).style.display = noResultsFound ? "" : "none";
+                        _this.regenerateButton.disabled = noResultsFound;
+                        _this.copyButton.disabled = noResultsFound;
+                        _this.replaceButton.disabled = noResultsFound;
+                        ((/** @type {?} */ (document.getElementById("skeletonId")))).style.display =
+                            "none";
+                        ((/** @type {?} */ (document.getElementById("rightRte")))).style.display =
+                            noResultsFound ? "none" : "";
+                        console.log(noResultsFound, ((/** @type {?} */ (document.getElementById("rightRte")))).style);
+                        // this.ref.markForCheck();
+                    }));
+                }
+            }
+            catch (_a) {
+                // this.toastObj.show();
+            }
+        };
+        /**
+         * @param {?} subQuery
+         * @param {?} promptQuery
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.getResponseFromOpenAI = /**
+         * @param {?} subQuery
+         * @param {?} promptQuery
+         * @return {?}
+         */
+        function (subQuery, promptQuery) {
+            return __awaiter(this, void 0, void 0, function () {
+                var content;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0: return [4 /*yield*/, OpenAiModelRTE(subQuery, promptQuery)];
+                        case 1:
+                            content = _a.sent();
+                            return [2 /*return*/, content ? ((/** @type {?} */ (content))) : ""];
+                    }
+                });
+            });
+        };
+        /**
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.dialogShow = /**
+         * @return {?}
+         */
+        function () {
+            var _this = this;
+            (/** @type {?} */ (this.regenerateButton)).element.addEventListener("click", (/**
+             * @return {?}
+             */
+            function () {
+                _this.updateAISugesstions();
+            }));
+            (/** @type {?} */ (this.copyButton)).element.addEventListener("click", (/**
+             * @return {?}
+             */
+            function () {
+                _this.copyTextToClipboard(_this.AIResult);
+            }));
+            (/** @type {?} */ (this.replaceButton)).element.addEventListener("click", (/**
+             * @return {?}
+             */
+            function () {
+                /** @type {?} */
+                var range = ((/** @type {?} */ (_this.rteObj))).formatter.editorManager.nodeSelection.getRange(((/** @type {?} */ (_this.rteObj))).contentModule.getDocument());
+                ((/** @type {?} */ (_this.rteObj))).formatter.editorManager.nodeSelection.restore(range);
+                ((/** @type {?} */ (_this.rteObj))).executeCommand("insertHTML", _this.AIResult, {
+                    undo: true,
+                });
+                _this.closeDialog();
+            }));
+            ((/** @type {?} */ (this.AIdialog))).element.style.display = "";
+        };
+        /**
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.closeDialog = /**
+         * @return {?}
+         */
+        function () {
+            this.AIdialog.hide();
+            this.rightRte.value = "";
+            this.leftRte.value = "";
+            this.promptQuery = "";
+            this.chipValue = "Standard";
+            this.AIResult = "";
+            this.dropValIndex = 0;
+            this.selectedQuery = "Rephrase";
+            this.sentimentButton.content = "😊 Neutral";
+        };
+        /**
+         * @param {?} text
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.copyTextToClipboard = /**
+         * @param {?} text
+         * @return {?}
+         */
+        function (text) {
+            if (navigator.clipboard) {
+                navigator.clipboard
+                    .writeText(text)
+                    .then((/**
+                 * @return {?}
+                 */
+                function () {
+                    console.log("Text copied to clipboard successfully!");
+                }))
+                    .catch((/**
+                 * @param {?} err
+                 * @return {?}
+                 */
+                function (err) {
+                    console.error("Failed to copy text: ", err);
+                }));
+            }
+            else {
+                // Fallback for browsers that do not support the Clipboard API
+                /** @type {?} */
+                var textarea = document.createElement("textarea");
+                textarea.value = text;
+                document.body.appendChild(textarea);
+                textarea.select();
+                try {
+                    document.execCommand("copy");
+                    console.log("Text copied to clipboard using execCommand");
+                }
+                catch (err) {
+                    console.error("Failed to copy text: ", err);
+                }
+                finally {
+                    document.body.removeChild(textarea);
+                }
+            }
+        };
+        /**
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.onOverlayClick = /**
+         * @return {?}
+         */
+        function () {
+            /** @type {?} */
+            var activeEle = this.AIdialog.element.querySelector(".char_block.e-active");
+            if (activeEle) {
+                activeEle.classList.remove("e-active");
+            }
+            this.closeDialog();
+        };
+        /**
+         * @param {?} args
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.onQuerySelect = /**
+         * @param {?} args
+         * @return {?}
+         */
+        function (args) {
+            // this.chipList.selectedChips = 0;
+            this.translatelanguage = "EN";
+            this.selectedQuery = args.itemData.text;
+            this.updateAISugesstionsData(args.itemData.text);
+        };
+        /**
+         * @param {?} args
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.onLanguageSelect = /**
+         * @param {?} args
+         * @return {?}
+         */
+        function (args) {
+            this.translatelanguage = args.itemData.id;
+            this.updateAISugesstionsData("Translate");
+        };
+        /**
+         * @param {?} args
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.onChipClick = /**
+         * @param {?} args
+         * @return {?}
+         */
+        function (args) {
+            this.chipValue = args.itemData.text;
+            // 事件会触发两次 必须判断args.text是否有值
+            if (args.itemData.text)
+                this.updateAISugesstionsData("Rephrase");
+        };
+        /**
+         * @param {?} args
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype._toolbarClick = /**
+         * @param {?} args
+         * @return {?}
+         */
+        function (args) {
+            this.toolbarClick.emit(args);
+        };
+        /**
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.hideToast = /**
+         * @return {?}
+         */
+        function () {
+            this.showMsg = false;
+        };
+        /**
+         * @return {?}
+         */
+        RichtexteditorComponent.prototype.onZoom = /**
+         * @return {?}
+         */
+        function () {
+            if (this.size === "largest") {
+                this.size = ""; // 恢复到原始大小
+            }
+            else {
+                this.size = "largest"; // 设置为最大化
+            }
+        };
+        RichtexteditorComponent.decorators = [
+            { type: core.Component, args: [{
+                        selector: "rs-richtext-editor",
+                        template: "<div class=\"editor_box\" id=\"container\">\r\n  <ejs-richtexteditor\r\n    #editor\r\n    id=\"editor\"\r\n    [height]=\"height\"\r\n    [saveInterval]=\"0\"\r\n    [autoSaveOnIdle]=\"autoSaveOnIdle\"\r\n    [toolbarSettings]=\"tools\"\r\n    [fontFamily]=\"family\"\r\n    [insertImageSettings]=\"insertImageSettings\"\r\n    [(value)]=\"value\"\r\n    (change)=\"onContentChange($event)\"\r\n    (created)=\"onCreate()\"\r\n    (toolbarClick)=\"_toolbarClick($event)\"\r\n  >\r\n  </ejs-richtexteditor>\r\n  <ejs-dialog\r\n    #AIdialog\r\n    id=\"AIdialog\"\r\n    [ngClass]=\"size\"\r\n    [visible]=\"false\"\r\n    [target]=\"target\"\r\n    [isModal]=\"true\"\r\n    [height]=\"dialogHeight\"\r\n    [width]=\"dialogWidth\"\r\n    maxHeight=\"80%\"\r\n    cssClass=\"e-rte-elements custom-dialog-rte\"\r\n    zIndex=\"1000\"\r\n    (close)=\"closeDialog()\"\r\n    (overlayClick)=\"onOverlayClick()\"\r\n    (open)=\"dialogShow()\"\r\n  >\r\n    <ng-template #header>\r\n      <div class=\"header-title\">AI Assist</div>\r\n      <div class=\"header-buttons\">\r\n        <div *ngIf=\"showZoomBtn\" class=\"header-zoom\" (click)=\"onZoom()\">\r\n          <img\r\n            class=\"header-icon\"\r\n            *ngIf=\"size === 'largest'\"\r\n            src=\"../../../assets/img/dialog-shrink.svg\"\r\n          />\r\n          <img\r\n            class=\"header-icon\"\r\n            *ngIf=\"size !== 'largest'\"\r\n            src=\"../../../assets/img/dialog-grow.svg\"\r\n          />\r\n        </div>\r\n        <div class=\"header-btn\" (click)=\"closeDialog()\">\r\n          <img class=\"header-icon\" src=\"../../../assets/img/dialog-close.svg\" />\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n    <ng-template #footerTemplate>\r\n      <div id=\"dialog-footer-content\">\r\n        <div class=\"custom-row-0\">\r\n          <div\r\n            class=\"cuscol-0\"\r\n            style=\"width: 100%; align-items: center; justify-content: left\"\r\n          ></div>\r\n          <div\r\n            class=\"cuscol-1\"\r\n            style=\"\r\n              display: flex;\r\n              flex-direction: column;\r\n              justify-content: center;\r\n              align-items: center;\r\n              width: 100%;\r\n            \"\r\n          >\r\n            <div style=\"text-align: right; width: 100%\">\r\n              <button\r\n                ejs-button\r\n                #sentimentButton\r\n                content=\"\uD83D\uDE0A Neutral\"\r\n                disabled=\"false\"\r\n                cssClass=\"sentiment\"\r\n              ></button>\r\n              <button\r\n                ejs-button\r\n                #copyButton\r\n                content=\"Copy\"\r\n                disabled=\"false\"\r\n                class=\"copy-btn\"\r\n              ></button>\r\n              <button\r\n                ejs-button\r\n                #replaceButton\r\n                content=\"Replace\"\r\n                isPrimary=\"true\"\r\n                disabled=\"false\"\r\n              ></button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n    <ng-template #content>\r\n      <div class=\"dialog-content\" style=\"height: 100%\">\r\n        <div class=\"custom-row-0\">\r\n          <div class=\"cuscol-0\" style=\"width: 100%\">\r\n            <ejs-dropdownlist\r\n              #queryCategory\r\n              style=\"width: 200px\"\r\n              id=\"queryCategory\"\r\n              [dataSource]=\"queryList\"\r\n              index=\"0\"\r\n              [fields]=\"{ text: 'text', value: 'id' }\"\r\n              (select)=\"onQuerySelect($event)\"\r\n            >\r\n              Rephrase\r\n            </ejs-dropdownlist>\r\n            <ejs-dropdownlist\r\n              *ngIf=\"selectedQuery == 'Rephrase'\"\r\n              id=\"chips-container\"\r\n              #chipList\r\n              style=\"width: 160px\"\r\n              [(ngModel)]=\"chipValue\"\r\n              [dataSource]=\"rephraseTyleList\"\r\n              [fields]=\"{ text: 'text', value: 'id' }\"\r\n              (select)=\"onChipClick($event)\"\r\n            >\r\n            </ejs-dropdownlist>\r\n            <ejs-dropdownlist\r\n              *ngIf=\"selectedQuery == 'Translate'\"\r\n              #languageCategory\r\n              index=\"0\"\r\n              id=\"language-Category\"\r\n              [dataSource]=\"languageList\"\r\n              [fields]=\"{ text: 'text', value: 'id' }\"\r\n              (select)=\"onLanguageSelect($event)\"\r\n            >\r\n            </ejs-dropdownlist>\r\n          </div>\r\n          <div\r\n            class=\"cuscol-1\"\r\n            style=\"\r\n              justify-content: space-between;\r\n              align-items: center;\r\n              width: 100%;\r\n            \"\r\n          >\r\n            <!-- <ejs-chiplist\r\n              id=\"chips-container\"\r\n              #chipList\r\n              [chips]=\"['Standard', 'Fluent', 'Professional']\"\r\n              selection=\"Single\"\r\n              cssClass=\"e-outline\"\r\n              [selectedChips]=\"[0]\"\r\n              (click)=\"onChipClick($event)\"\r\n            >\r\n            </ejs-chiplist> -->\r\n            <button\r\n              ejs-button\r\n              #regenerateButton\r\n              content=\"Regenerate\"\r\n              isPrimary=\"true\"\r\n              disabled=\"false\"\r\n            ></button>\r\n          </div>\r\n        </div>\r\n        <div class=\"custom-row-1\" style=\"height: calc(100% - 40px)\">\r\n          <div\r\n            class=\"cuscol-0\"\r\n            style=\"\r\n              width: 100%;\r\n              height: 100%;\r\n              align-items: center;\r\n              justify-content: left;\r\n            \"\r\n          >\r\n            <div style=\"text-align: left; height: 100%\">\r\n              <ejs-richtexteditor\r\n                #leftRte\r\n                id=\"leftRte\"\r\n                height=\"100%\"\r\n                [toolbarSettings]=\"{ enable: false }\"\r\n                placeholder=\"Analysis of AI Support\"\r\n                cssClass=\"e-outline\"\r\n              >\r\n              </ejs-richtexteditor>\r\n            </div>\r\n          </div>\r\n          <div\r\n            class=\"cuscol-1\"\r\n            style=\"\r\n              display: flex;\r\n              justify-content: space-between;\r\n              width: 100%;\r\n              height: 100%;\r\n            \"\r\n          >\r\n            <div style=\"text-align: left; width: 100%; height: 100%\">\r\n              <ejs-richtexteditor\r\n                #rightRte\r\n                id=\"rightRte\"\r\n                height=\"100%\"\r\n                [toolbarSettings]=\"{ enable: false }\"\r\n                placeholder=\"Analysis of AI Support\"\r\n                cssClass=\"e-outline\"\r\n              >\r\n                <!-- style=\"display: none\" -->\r\n              </ejs-richtexteditor>\r\n              <div\r\n                class=\"no-results-found\"\r\n                id=\"no-results-found\"\r\n                style=\"display: none; height: 244px; align-content: center\"\r\n              >\r\n                <img\r\n                  height=\"50\"\r\n                  width=\"50\"\r\n                  src=\"https://storage.googleapis.com/cdn-bolddesk/agent-angular-app/images/light/no-records-warning.svg\"\r\n                />\r\n                <div>No results found</div>\r\n              </div>\r\n              <div id=\"skeletonId\" style=\"display: none\">\r\n                <ejs-skeleton\r\n                  #skeletonId1\r\n                  shape=\"Rectangle\"\r\n                  height=\"20px\"\r\n                  width=\"100%\"\r\n                ></ejs-skeleton\r\n                ><br />\r\n                <ejs-skeleton\r\n                  #skeletonId2\r\n                  shape=\"Rectangle\"\r\n                  height=\"20px\"\r\n                  width=\"90%\"\r\n                ></ejs-skeleton\r\n                ><br />\r\n                <ejs-skeleton\r\n                  #skeletonId3\r\n                  shape=\"Rectangle\"\r\n                  height=\"20px\"\r\n                  width=\"70%\"\r\n                ></ejs-skeleton\r\n                ><br />\r\n                <ejs-skeleton\r\n                  #skeletonId4\r\n                  shape=\"Rectangle\"\r\n                  height=\"20px\"\r\n                  width=\"50%\"\r\n                ></ejs-skeleton\r\n                ><br />\r\n                <ejs-skeleton\r\n                  #skeletonId5\r\n                  shape=\"Rectangle\"\r\n                  height=\"20px\"\r\n                  width=\"30%\"\r\n                ></ejs-skeleton\r\n                ><br />\r\n                <ejs-skeleton\r\n                  #skeletonId6\r\n                  shape=\"Rectangle\"\r\n                  height=\"20px\"\r\n                  width=\"10%\"\r\n                ></ejs-skeleton\r\n                ><br />\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </ejs-dialog>\r\n  <div class=\"toast\" *ngIf=\"showMsg\">\r\n    <span class=\"toast_text\">First, Select some text</span\r\n    ><span class=\"close_icon\" (click)=\"hideToast()\"></span>\r\n  </div>\r\n</div>\r\n",
+                        styles: [".editor_box{position:relative;width:100%;height:100%}.editor_box .toast{position:absolute;left:35%;top:110px;z-index:1;width:400px;border-radius:4px;border:1px solid #e8f2ff;background:#f4f8ff;padding:4px 12px;color:#1f3f5c;font-size:12px;font-style:normal;font-weight:400;height:32px;font-family:Arial;display:flex;align-items:center;justify-content:space-between}.editor_box .toast .toast_text::before{content:url(../../../assets/img/info.svg);display:inline-block;width:16px;height:16px;vertical-align:bottom;margin-right:8px}.editor_box .toast .close_icon{background-image:url(../../../assets/img/notification-close.svg);cursor:pointer;display:inline-block;width:16px;height:16px}.custom-dialog-rte{padding:0 20px;border-radius:10px}.custom-row-0,.custom-row-1,.custom-row-2{display:flex;align-items:center;padding:12px 24px}.e-rte-dropdown-btn-text{padding-left:4px}.no-results-found{text-align:center}.no-results-found img{display:block;margin:0 auto}.e-custom{margin-right:.5rem;border-radius:25px!important}.custom-dialog-rte .skeleton-rectangle{border-radius:4px}@media (max-width:767px){.cuscol-0,.cuscol-1,.cuscol-2{justify-content:center!important}.custom-row-0,.custom-row-1,.custom-row-2{flex-direction:column!important}.cuscol-1{border-right:none!important}.cuscol-0{width:100%;align-items:center}::ng-deep:host .e-dialog{max-height:80%!important}.custom-dialog-rte .e-dialog .e-dlg-content{overflow-y:auto!important}.custom-dialog-rte .e-dialog .e-dlg-content .e-richtexteditor{height:100px!important}.cuscol-noresult{padding-bottom:20px!important}.e-chip-list{padding:5px!important}.cuscol{padding-right:.2rem!important;width:auto!important}.custom-row-1{height:auto!important}}.cuscol-1{display:flex;flex-direction:row!important}.cuscol-2{display:flex;flex-direction:column!important}.sentiment{color:#000!important}.custom-dialog-rte .e-dialog .e-dlg-content{padding:0!important;overflow-y:hidden}.custom-dialog-rte .e-dialog .e-dlg-header-content{padding:20px 0!important;border:0!important}.custom-dialog-rte .e-dialog .e-dlg-header-content .e-dlg-header{display:flex;align-items:center;line-height:18px;justify-content:space-between}.custom-dialog-rte .e-dialog .e-dlg-header-content .e-dlg-header .header-title{font-family:Arial;font-size:15px;font-weight:700;font-style:normal}.custom-dialog-rte .e-dialog .e-dlg-header-content .header-buttons{display:flex}.custom-dialog-rte .e-dialog .e-dlg-header-content .header-buttons img{width:16px;height:16px;cursor:pointer;padding:2px;margin-left:12px}.custom-dialog-rte .e-dialog .e-footer-content{padding:0!important}.custom-dialog-rte .e-dialog .e-dlg-content .e-richtexteditor.e-rte-tb-expand .e-rte-content,.e-richtexteditor.e-rte-tb-expand .e-source-content{border:0;border-bottom:1px solid #dee2e6;border-top:0 solid #dee2e6!important}.custom-dialog-rte .dialog-content .custom-row-0{border-top:0 solid #ddd!important;padding:0;margin-bottom:12px}.custom-dialog-rte .dialog-content .custom-row-0 .cuscol-0{justify-content:left;border-right:none!important;padding:0;display:flex;gap:12px}.custom-dialog-rte .dialog-content .custom-row-0 .cuscol-1{padding:0;margin-left:12px}.custom-dialog-rte .dialog-content .custom-row-0 .cuscol-1 .e-primary{color:#44566c;border-radius:4px;border:1px solid #dbe1e7;background:#fff;width:87px;margin:0;padding:2px 12px;font-family:Arial;font-size:12px;font-style:normal;font-weight:400;line-height:14px;height:28px}.custom-dialog-rte .dialog-content .custom-row-1{padding:0;height:calc(100% - 40px);gap:12px}.custom-dialog-rte .e-footer-content{border:0}.custom-dialog-rte .e-footer-content .custom-row-0{padding:20px 0}.custom-dialog-rte .e-footer-content .e-control.e-btn{font-family:Arial;font-size:12px;line-height:14px;padding:2px 12px;height:28px;background:#fff;color:#44566c}.custom-dialog-rte .e-footer-content .e-control.e-btn.copy-btn{border-color:#dbe1e7}.custom-dialog-rte .e-footer-content .e-control.e-btn.copy-btn::before{content:url(../../../assets/img/editor-copy.svg);vertical-align:middle;margin-right:6px}.custom-dialog-rte .e-footer-content .e-control.e-btn.e-primary{color:#fff;background:#1364b3}.editor_box .e-dialog.largest{width:96vw!important;height:88vh!important;max-height:88vh;max-width:2100px}"]
+                    }] }
+        ];
+        /** @nocollapse */
+        RichtexteditorComponent.ctorParameters = function () { return [
+            { type: core.ChangeDetectorRef }
+        ]; };
+        RichtexteditorComponent.propDecorators = {
+            rteObj: [{ type: core.ViewChild, args: ["editor", { static: false },] }],
+            queryCategory: [{ type: core.ViewChild, args: ["queryCategory", { static: false },] }],
+            leftRte: [{ type: core.ViewChild, args: ["leftRte", { static: false },] }],
+            rightRte: [{ type: core.ViewChild, args: ["rightRte", { static: false },] }],
+            AIdialog: [{ type: core.ViewChild, args: ["AIdialog", { static: true },] }],
+            sentimentButton: [{ type: core.ViewChild, args: ["sentimentButton", { static: false },] }],
+            regenerateButton: [{ type: core.ViewChild, args: ["regenerateButton", { static: false },] }],
+            copyButton: [{ type: core.ViewChild, args: ["copyButton", { static: false },] }],
+            replaceButton: [{ type: core.ViewChild, args: ["replaceButton", { static: false },] }],
+            placeholder: [{ type: core.Input }],
+            value: [{ type: core.Input }],
+            height: [{ type: core.Input }],
+            autoSaveOnIdle: [{ type: core.Input }],
+            target: [{ type: core.Input }],
+            toolbarClick: [{ type: core.Output }],
+            change: [{ type: core.Output }]
+        };
+        return RichtexteditorComponent;
+    }());
+    if (false) {
+        /** @type {?} */
+        RichtexteditorComponent.prototype.rteObj;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.queryCategory;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.leftRte;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.rightRte;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.AIdialog;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.sentimentButton;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.regenerateButton;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.copyButton;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.replaceButton;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.placeholder;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.value;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.height;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.autoSaveOnIdle;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.target;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.toolbarClick;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.change;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.family;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.dialogWidth;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.dialogHeight;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.showZoomBtn;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.showMsg;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.insertImageSettings;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.editorManager;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.size;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.selectedQuery;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.dropValIndex;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.queryList;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.rephraseTyleList;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.languageList;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.promptQuery;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.isSentimentCheck;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.subQuery;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.translatelanguage;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.chipValue;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.apiResultData;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.AIResult;
+        /** @type {?} */
+        RichtexteditorComponent.prototype.tools;
+        /**
+         * @type {?}
+         * @private
+         */
+        RichtexteditorComponent.prototype.ref;
+    }
+
     /**
      * @fileoverview added by tsickle
      * Generated from: lib/raise-common-lib.module.ts
@@ -23729,6 +25032,7 @@
                             TagInputComponent,
                             RadioGroupComponent,
                             CheckboxGroupComponent,
+                            RichtexteditorComponent,
                             SwitchInputComponent,
                             EncryptedInputComponent,
                             SearchInputComponent,
@@ -23762,6 +25066,7 @@
                             ej2AngularButtons.CheckBoxModule,
                             ej2AngularButtons.RadioButtonModule,
                             ej2AngularButtons.ButtonModule,
+                            ej2AngularButtons.ChipListModule,
                             ej2AngularDiagrams.DiagramModule,
                             ej2AngularPopups.TooltipModule,
                             ej2AngularPopups.DialogModule,
@@ -23846,6 +25151,7 @@
                             ej2AngularButtons.CheckBoxModule,
                             ej2AngularButtons.RadioButtonModule,
                             ej2AngularButtons.ButtonModule,
+                            ej2AngularButtons.ChipListModule,
                             ej2AngularDiagrams.DiagramModule,
                             ej2AngularPopups.TooltipModule,
                             ej2AngularPopups.DialogModule,
@@ -23891,6 +25197,7 @@
                             TagInputComponent,
                             RadioGroupComponent,
                             CheckboxGroupComponent,
+                            RichtexteditorComponent,
                             SwitchInputComponent,
                             EncryptedInputComponent,
                             SearchInputComponent,
@@ -23953,9 +25260,10 @@
     exports.TruncatedTextToggleComponent = TruncatedTextToggleComponent;
     exports.filterShowSection = filterShowSection;
     exports.ɵa = Debounce;
-    exports.ɵb = ConfirmSelectComponent;
-    exports.ɵc = NewActionNotificationComponent;
-    exports.ɵd = CommonDeleteComponent;
+    exports.ɵb = RichtexteditorComponent;
+    exports.ɵc = ConfirmSelectComponent;
+    exports.ɵd = NewActionNotificationComponent;
+    exports.ɵe = CommonDeleteComponent;
 
     Object.defineProperty(exports, '__esModule', { value: true });