@easyquery/ui 7.3.3-rc01 → 7.3.4

package/dist/assets/css/easyquery.css

@@ -889,6 +889,7 @@ body {
 
 .eqjs-fb-button {
     -moz-user-select: none;
+    user-select: none;
     background-image: none;
     border: 1px solid transparent;
     border-radius: 4px;

package/dist/assets/css/easyquery.ui.css

@@ -3128,6 +3128,8 @@ body {
 
 .eqjs-fb-button {
     -moz-user-select: none;
+    -webkit-user-select: none;
+            user-select: none;
     background-image: none;
     border: 1px solid transparent;
     border-radius: 4px;
@@ -4689,9 +4691,6 @@ input.eqjs-invalid {
     top: 4px;
 }
 
-.eqjs-qp-condition-buttonsBlock {
-}
-
 .eqjs-qc-column-checkbox:hover,
 .eqjs-qp-column-checkbox:hover,
 .eqjs-column-buttonsBlock .eqjs-button:hover,
@@ -4711,15 +4710,14 @@ input.eqjs-invalid {
     align-items: center;
     justify-content: center;
     font-family: 'easyquery' !important;
-    speak: never;
     font-style: normal;
     font-weight: normal;
     font-variant: normal;
-    text-transform: none;
-    line-height: 1!important;
+    text-transform: none !important;
+    line-height: 1 !important;
     font-size: var(--icon-size);
     color: var(--button-text-color);
-    text-decoration: none;
+    text-decoration: none !important;
     padding: 0;
     outline: none;
 
@@ -4800,10 +4798,6 @@ input.eqjs-invalid {
     border-bottom: 1px solid var(--border-color);
 }
 
-.eqjs-qc-row.eqjs-qc-disabled {
-    /*min-height: 26px;*/
-}
-
 .eqjs-qc-row:not([data-show-buttons]) .eqjs-qc-column-checkbox,
 .eqjs-qc-row:not([data-show-buttons]) .eqjs-column-sortbutton.eqjs-column-sortbutton-none
 {
@@ -4864,6 +4858,11 @@ input.eqjs-invalid {
     flex-wrap: nowrap;
 }
 
+.eqjs-qp-valueelement {
+    width: auto;
+    flex-grow: 0;
+}
+
 .eqjs-qc-attrelement, .eqjs-qp-attrelement, .eqjs-qp-operelement {
     margin-left: 0;
     flex-shrink: 1;
@@ -4967,7 +4966,7 @@ input.eqjs-invalid {
 }
 
 .eqjs-menu-scrollDiv:not(.eqjs-mobile) {
-    max-height: 250px;
+    /*max-height: 500px;*/
 }
 
 .eqjs-qc-colelement {
@@ -5105,6 +5104,26 @@ input.eqjs-invalid {
 .eqjs-qc-captionelement input {
     min-width: var(--column-panel-caption-size);
     width: auto;
+}
+
+.eqjs-qp-row {
+    padding: 0 10px!important;
+}
+.eqjs-qp-condition-buttonsBlock, .eqjs-facets-total-buttons {
+    margin-right: 10px;
+}
+
+.eqjs-qp-row.eqjs-mobile {
+    border-style: solid!important;
+    margin: 0 4px;
+}
+
+.eqjs-qp-condition-buttonsBlock.eqjs-mobile {
+    top: 0!important;
+}
+
+.eqjs-cb-addrow.eqjs-mobile a, .eqjs-sb-addrow.eqjs-mobile a {
+    background: none!important;
 }
 /*setting to all page */
 #eqv-main{

package/dist/assets/css/upgrade.css

@@ -21,9 +21,6 @@
     top: 4px;
 }
 
-.eqjs-qp-condition-buttonsBlock {
-}
-
 .eqjs-qc-column-checkbox:hover,
 .eqjs-qp-column-checkbox:hover,
 .eqjs-column-buttonsBlock .eqjs-button:hover,
@@ -43,15 +40,14 @@
     align-items: center;
     justify-content: center;
     font-family: 'easyquery' !important;
-    speak: never;
     font-style: normal;
     font-weight: normal;
     font-variant: normal;
-    text-transform: none;
-    line-height: 1!important;
+    text-transform: none !important;
+    line-height: 1 !important;
     font-size: var(--icon-size);
     color: var(--button-text-color);
-    text-decoration: none;
+    text-decoration: none !important;
     padding: 0;
     outline: none;
 
@@ -132,10 +128,6 @@
     border-bottom: 1px solid var(--border-color);
 }
 
-.eqjs-qc-row.eqjs-qc-disabled {
-    /*min-height: 26px;*/
-}
-
 .eqjs-qc-row:not([data-show-buttons]) .eqjs-qc-column-checkbox,
 .eqjs-qc-row:not([data-show-buttons]) .eqjs-column-sortbutton.eqjs-column-sortbutton-none
 {
@@ -196,6 +188,11 @@
     flex-wrap: nowrap;
 }
 
+.eqjs-qp-valueelement {
+    width: auto;
+    flex-grow: 0;
+}
+
 .eqjs-qc-attrelement, .eqjs-qp-attrelement, .eqjs-qp-operelement {
     margin-left: 0;
     flex-shrink: 1;
@@ -299,7 +296,7 @@
 }
 
 .eqjs-menu-scrollDiv:not(.eqjs-mobile) {
-    max-height: 250px;
+    /*max-height: 500px;*/
 }
 
 .eqjs-qc-colelement {
@@ -435,4 +432,24 @@
 .eqjs-qc-captionelement input {
     min-width: var(--column-panel-caption-size);
     width: auto;
+}
+
+.eqjs-qp-row {
+    padding: 0 10px!important;
+}
+.eqjs-qp-condition-buttonsBlock, .eqjs-facets-total-buttons {
+    margin-right: 10px;
+}
+
+.eqjs-qp-row.eqjs-mobile {
+    border-style: solid!important;
+    margin: 0 4px;
+}
+
+.eqjs-qp-condition-buttonsBlock.eqjs-mobile {
+    top: 0!important;
+}
+
+.eqjs-cb-addrow.eqjs-mobile a, .eqjs-sb-addrow.eqjs-mobile a {
+    background: none!important;
 }

package/dist/easyquery.ui.cjs.js

@@ -21,11 +21,11 @@ function findHighestZIndex(elem) {
 }
 // simetimes setting focus in the main thread doesn't work correctly (in Firefox). So we need to 'hack' it.
 function safeFocus(element) {
-    setTimeout(_ => {
-        if (element) {
-            element.focus();
+    setTimeout((el) => {
+        if (el && el.focus) {
+            el.focus();
         }
-    }, 100);
+    }, 100, element);
 }
 const eqCssPrefix = 'eqjs';
 const eqCssMobile = 'eqjs-mobile';
@@ -1434,6 +1434,16 @@ class MenuLevel {
         levelStyle.top = y + 'px';
         this.scrollDiv.style.width = "auto";
         this.scrollDiv.style.height = "auto";
+        if (this.parentMenu.options.useMaxSpace === false) {
+            const winSize = ui.getWinSize().height;
+            if (y > winSize / 2 && this.scrollDiv.scrollHeight > winSize / 2) {
+                this.scrollDiv.style.height = (y - 16 - 56) + 'px';
+                levelStyle.top = 0 + 'px';
+            }
+            else if (this.scrollDiv.scrollHeight > winSize / 2) {
+                this.scrollDiv.style.height = (winSize - y - 56) + 'px';
+            }
+        }
         //adjusting level top position
         if (adjustTopPos) {
             y = this.adjustTopPos(y);
@@ -1468,16 +1478,15 @@ class MenuLevel {
         if (this.closeDiv != null) {
             maxHeight -= this.closeDiv.offsetHeight;
         }
-        if (this.levelDiv.offsetHeight > maxHeight) {
-            let newHeight = maxHeight;
-            if (newHeight < 50) {
-                newHeight = 50;
-            }
-            this.scrollDiv.style.height = newHeight + "px";
-        }
-        else {
-            this.scrollDiv.style.height = "auto";
-        }
+        // if (this.levelDiv.offsetHeight > maxHeight) {
+        //     let newHeight = maxHeight;
+        //     if (newHeight < 50) { newHeight = 50; }
+        //
+        //     this.scrollDiv.style.height = newHeight + "px";
+        // }
+        // else {
+        //     this.scrollDiv.style.height = "auto";
+        // }
         this.activeItem = null;
     }
     focus() {
@@ -1619,7 +1628,8 @@ class PopupMenu {
             container: document.body,
             domWriteItemsId: false,
             itemRenderedCallback: null,
-            showItemIds: false
+            showItemIds: false,
+            useMaxSpace: true,
         };
         if (options) {
             core$1.utils.assign(this.options, options);
@@ -1781,7 +1791,16 @@ class PopupMenu {
             const leftSpace = pos.x + anchorWidth - scroll.left;
             const rightSpace = winSize.width - leftSpace + anchorWidth;
             pos.x += 2;
-            this.rootLevel.showAt(pos.x, pos.y, true, true);
+            if (this.options.useMaxSpace === true) {
+                this.rootLevel.showAt(pos.x, pos.y, true, true);
+            }
+            else {
+                // console.log(this.rootLevel.levelDiv)
+                // if (this.rootLevel.levelDiv.scrollHeight > 500 && pos.y > winSize.height / 2) {
+                //     pos.y = 0
+                // }
+                this.rootLevel.showAt(pos.x, pos.y, false, true);
+            }
             this.rootLevel.levelDiv.style.width = '';
             this.rootLevel.levelDiv.style.right = '';
             if (!this.rootLevel.levelDiv.style.zIndex) {
@@ -2742,6 +2761,7 @@ class AttrColumnRendererCP extends ColumnRendererCP {
                 .title(attrCaption)
                 .text(attrCaption) //TO DO:add localization
                 .on('click', (ev) => {
+                console.log("columns expression click");
                 ev.stopPropagation();
                 this.activate();
                 this.panel.showEntitiesMenu({
@@ -3407,6 +3427,7 @@ class ColumnsPanel extends core.Widget {
                     .attr('href', 'javascript:void(0)')
                     .text(core$1.i18n.getText('CmdClickToAddColumn'))
                     .on('click', (e) => {
+                    console.log("Add new column");
                     e.preventDefault();
                     this.showEntitiesMenu({
                         anchor: e.target,
@@ -7988,7 +8009,8 @@ class QueryPanel extends core.Widget {
         return new PopupMenu(options);
     }
     showEntitiesMenu(options) {
-        this.entitiesMenu.showMenu(options);
+        this.entitiesMenu.showMenu(Object.assign({}, this.options.menuOptions, options));
+        // this.entitiesMenu.showMenu(options);
     }
     createConditionMenus() {
         //ConditionMenu
@@ -8285,6 +8307,7 @@ class FilterBar extends core.Widget {
             .text(core$1.i18n.getText('StrNoFilterClickToAdd'))
             .hide()
             .on('click', () => {
+            console.log("condition filter click");
             this.queryPanel.showEntitiesMenu({
                 anchor: this.headerLinkElement,
                 selectedIds: null,
@@ -8683,9 +8706,10 @@ class EasyGridWidget extends Grid {
      * @param options The options.
      */
     init(context, options) {
+        var _a, _b;
         super.init(context, options);
-        const gridOptions = Object.assign(Object.assign({}, options), { slot: this.slot, dataTable: context.resultTable });
-        this.options = core$1.utils.assign(this.options, options);
+        const gridOptions = Object.assign(Object.assign(Object.assign(Object.assign({}, (_a = context.options.widgets) === null || _a === void 0 ? void 0 : _a.resultGrid), (_b = context.options.widgets) === null || _b === void 0 ? void 0 : _b.easyGrid), options), { slot: this.slot, dataTable: context.resultTable });
+        this.options = core$1.utils.assign(this.options, gridOptions);
         gridOptions.onPlusButtonClick = (ev) => this.addColumnClickHandler(ev);
         gridOptions.onColumnMoved = (ev) => this.columnMovedHandler(ev);
         if (gridOptions.aggregates) {
@@ -12389,9 +12413,7 @@ class View {
         if (this.context.getQuery().isEmpty() && !this.resultOptions.fetchEmptyQueries)
             return;
         this.showResultSpinner();
-        this.context.fetchData({
-            elasticPaging: options.elasticPaging,
-            success: (result) => {
+        this.context.fetchData(Object.assign(Object.assign({}, options), { elasticPaging: options.elasticPaging, success: (result) => {
                 this.hideResultSpinner();
                 this.toggleExportButtons();
                 this.displayRecordsCount(this.context.resultTable.getTotal());
@@ -12404,11 +12426,9 @@ class View {
                 if (options.success) {
                     options.success(result);
                 }
-            },
-            error: () => {
+            }, error: () => {
                 this.hideResultSpinner();
-            }
-        });
+            } }));
     }
     toggleExportButtons() {
         if (this.enableExport && this.context.resultTable
@@ -13457,7 +13477,7 @@ class ReportView extends View {
         this.syncReportOnChange = true;
         this._reportSaveTemplate = `<div id="kdlg-dialog-form" class="kfrm-form">
             <div class="kfrm-fields label-above">
-                <label for="kdlg-dialog-form-input" id="kdlg-dialog-form-content"></label>
+                <label for="kdlg-dialog-form-input" id="kdlg-dialog-form-name-label"></label>
                 <input type="text" name="kdlg-dialog-form-input" id="kdlg-dialog-form-input" />
                 <label for="kdlg-dialog-form-textarea" id="kdlg-dialog-form-desc-label"></label>
                 <textarea type="text" name="kdlg-dialog-form-textarea" id="kdlg-dialog-form-textarea"></textarea>
@@ -13650,13 +13670,13 @@ class ReportView extends View {
             submitOnEnter: true,
             arrangeParents: false,
             beforeOpen: () => {
-                const input = document.getElementById(`kdlg-dialog-form-input`);
-                input.value = core$1.i18n.getText('NewReportDefName');
-                const content = document.getElementById('kdlg-dialog-form-content');
-                content.innerHTML = core$1.i18n.getText('SaveReportDlgLabel');
-                const label = document.getElementById('kdlg-dialog-form-desc-label');
-                label.innerHTML = core$1.i18n.getText('ReportDescLabel');
-                input.focus();
+                const nameInput = document.getElementById(`kdlg-dialog-form-input`);
+                nameInput.value = core$1.i18n.getText('NewReportDefName');
+                const nameLabel = document.getElementById('kdlg-dialog-form-name-label');
+                nameLabel.innerHTML = core$1.i18n.getText('SaveReportDlgLabel');
+                const descLabel = document.getElementById('kdlg-dialog-form-desc-label');
+                descLabel.innerHTML = core$1.i18n.getText('ReportDescLabel');
+                nameInput.focus();
             },
             onSubmit: () => {
                 const nameInput = document.getElementById(`kdlg-dialog-form-input`);
@@ -13749,12 +13769,12 @@ class ReportView extends View {
             beforeOpen: () => {
                 const input = document.getElementById(`kdlg-dialog-form-input`);
                 input.value = query.getName();
-                const content = document.getElementById('kdlg-dialog-form-content');
+                const content = document.getElementById('kdlg-dialog-form-name-label');
                 content.innerHTML = core$1.i18n.getText('SaveReportDlgLabel');
                 const label = document.getElementById('kdlg-dialog-form-desc-label');
                 label.innerHTML = core$1.i18n.getText('ReportDescLabel');
                 const text = document.getElementById(`kdlg-dialog-form-textarea`);
-                text.value = query.getDescription();
+                text.innerText = query.getDescription();
                 input.focus();
             },
             onSubmit: () => {
@@ -13924,7 +13944,7 @@ class ReportView extends View {
             this.loadReportButton = null;
         }
         if (this.saveReportButton) {
-            this.saveReportButton.addEventListener('click', this.saveReportButtonClickHandler);
+            this.saveReportButton.removeEventListener('click', this.saveReportButtonClickHandler);
             this.saveReportButton = null;
         }
         if (this.removeReportButton) {

package/dist/easyquery.ui.esm.js

@@ -1,6 +1,6 @@
 import { utils, i18n, DataType, EasyDataTable, AggregationSettings } from '@easydata/core';
 import { Widget, WidgetGroup, QueryChangePart, QueryChangeAction, ExprTag, SortDirection, i18n as i18n$1, equtils, eqconsts, ConditionPart, DataKind, Query, Expression, CondTag, EqEditorTag, EqValueEditor, EqServiceProvider, createEqContext } from '@easyquery/core';
-import { browserUtils, eqDragManager, getElementAbsolutePos, getScrollPos, getWinSize, getViewportSize, domel, DropEffect, createBrowserEvent, DomElementBuilder, DefaultDateTimePicker, slideDown, slideUp, EasyGrid, addCssClass, hideElement, showElement, isVisible, toggleVisibility, addElement, DefaultDialogService } from '@easydata/ui';
+import { browserUtils, eqDragManager, domel, getElementAbsolutePos, getScrollPos, getWinSize, getViewportSize, DropEffect, createBrowserEvent, DomElementBuilder, DefaultDateTimePicker, slideDown, slideUp, EasyGrid, addCssClass, hideElement, showElement, isVisible, toggleVisibility, addElement, DefaultDialogService } from '@easydata/ui';
 
 function findHighestZIndex(elem) {
     let highest = 0;
@@ -19,11 +19,11 @@ function findHighestZIndex(elem) {
 }
 // simetimes setting focus in the main thread doesn't work correctly (in Firefox). So we need to 'hack' it.
 function safeFocus(element) {
-    setTimeout(_ => {
-        if (element) {
-            element.focus();
+    setTimeout((el) => {
+        if (el && el.focus) {
+            el.focus();
         }
-    }, 100);
+    }, 100, element);
 }
 const eqCssPrefix = 'eqjs';
 const eqCssMobile = 'eqjs-mobile';
@@ -1432,6 +1432,16 @@ class MenuLevel {
         levelStyle.top = y + 'px';
         this.scrollDiv.style.width = "auto";
         this.scrollDiv.style.height = "auto";
+        if (this.parentMenu.options.useMaxSpace === false) {
+            const winSize = getWinSize().height;
+            if (y > winSize / 2 && this.scrollDiv.scrollHeight > winSize / 2) {
+                this.scrollDiv.style.height = (y - 16 - 56) + 'px';
+                levelStyle.top = 0 + 'px';
+            }
+            else if (this.scrollDiv.scrollHeight > winSize / 2) {
+                this.scrollDiv.style.height = (winSize - y - 56) + 'px';
+            }
+        }
         //adjusting level top position
         if (adjustTopPos) {
             y = this.adjustTopPos(y);
@@ -1466,16 +1476,15 @@ class MenuLevel {
         if (this.closeDiv != null) {
             maxHeight -= this.closeDiv.offsetHeight;
         }
-        if (this.levelDiv.offsetHeight > maxHeight) {
-            let newHeight = maxHeight;
-            if (newHeight < 50) {
-                newHeight = 50;
-            }
-            this.scrollDiv.style.height = newHeight + "px";
-        }
-        else {
-            this.scrollDiv.style.height = "auto";
-        }
+        // if (this.levelDiv.offsetHeight > maxHeight) {
+        //     let newHeight = maxHeight;
+        //     if (newHeight < 50) { newHeight = 50; }
+        //
+        //     this.scrollDiv.style.height = newHeight + "px";
+        // }
+        // else {
+        //     this.scrollDiv.style.height = "auto";
+        // }
         this.activeItem = null;
     }
     focus() {
@@ -1617,7 +1626,8 @@ class PopupMenu {
             container: document.body,
             domWriteItemsId: false,
             itemRenderedCallback: null,
-            showItemIds: false
+            showItemIds: false,
+            useMaxSpace: true,
         };
         if (options) {
             utils.assign(this.options, options);
@@ -1779,7 +1789,16 @@ class PopupMenu {
             const leftSpace = pos.x + anchorWidth - scroll.left;
             const rightSpace = winSize.width - leftSpace + anchorWidth;
             pos.x += 2;
-            this.rootLevel.showAt(pos.x, pos.y, true, true);
+            if (this.options.useMaxSpace === true) {
+                this.rootLevel.showAt(pos.x, pos.y, true, true);
+            }
+            else {
+                // console.log(this.rootLevel.levelDiv)
+                // if (this.rootLevel.levelDiv.scrollHeight > 500 && pos.y > winSize.height / 2) {
+                //     pos.y = 0
+                // }
+                this.rootLevel.showAt(pos.x, pos.y, false, true);
+            }
             this.rootLevel.levelDiv.style.width = '';
             this.rootLevel.levelDiv.style.right = '';
             if (!this.rootLevel.levelDiv.style.zIndex) {
@@ -2740,6 +2759,7 @@ class AttrColumnRendererCP extends ColumnRendererCP {
                 .title(attrCaption)
                 .text(attrCaption) //TO DO:add localization
                 .on('click', (ev) => {
+                console.log("columns expression click");
                 ev.stopPropagation();
                 this.activate();
                 this.panel.showEntitiesMenu({
@@ -3405,6 +3425,7 @@ class ColumnsPanel extends Widget {
                     .attr('href', 'javascript:void(0)')
                     .text(i18n.getText('CmdClickToAddColumn'))
                     .on('click', (e) => {
+                    console.log("Add new column");
                     e.preventDefault();
                     this.showEntitiesMenu({
                         anchor: e.target,
@@ -7986,7 +8007,8 @@ class QueryPanel extends Widget {
         return new PopupMenu(options);
     }
     showEntitiesMenu(options) {
-        this.entitiesMenu.showMenu(options);
+        this.entitiesMenu.showMenu(Object.assign({}, this.options.menuOptions, options));
+        // this.entitiesMenu.showMenu(options);
     }
     createConditionMenus() {
         //ConditionMenu
@@ -8283,6 +8305,7 @@ class FilterBar extends Widget {
             .text(i18n.getText('StrNoFilterClickToAdd'))
             .hide()
             .on('click', () => {
+            console.log("condition filter click");
             this.queryPanel.showEntitiesMenu({
                 anchor: this.headerLinkElement,
                 selectedIds: null,
@@ -8681,9 +8704,10 @@ class EasyGridWidget extends Grid {
      * @param options The options.
      */
     init(context, options) {
+        var _a, _b;
         super.init(context, options);
-        const gridOptions = Object.assign(Object.assign({}, options), { slot: this.slot, dataTable: context.resultTable });
-        this.options = utils.assign(this.options, options);
+        const gridOptions = Object.assign(Object.assign(Object.assign(Object.assign({}, (_a = context.options.widgets) === null || _a === void 0 ? void 0 : _a.resultGrid), (_b = context.options.widgets) === null || _b === void 0 ? void 0 : _b.easyGrid), options), { slot: this.slot, dataTable: context.resultTable });
+        this.options = utils.assign(this.options, gridOptions);
         gridOptions.onPlusButtonClick = (ev) => this.addColumnClickHandler(ev);
         gridOptions.onColumnMoved = (ev) => this.columnMovedHandler(ev);
         if (gridOptions.aggregates) {
@@ -12387,9 +12411,7 @@ class View {
         if (this.context.getQuery().isEmpty() && !this.resultOptions.fetchEmptyQueries)
             return;
         this.showResultSpinner();
-        this.context.fetchData({
-            elasticPaging: options.elasticPaging,
-            success: (result) => {
+        this.context.fetchData(Object.assign(Object.assign({}, options), { elasticPaging: options.elasticPaging, success: (result) => {
                 this.hideResultSpinner();
                 this.toggleExportButtons();
                 this.displayRecordsCount(this.context.resultTable.getTotal());
@@ -12402,11 +12424,9 @@ class View {
                 if (options.success) {
                     options.success(result);
                 }
-            },
-            error: () => {
+            }, error: () => {
                 this.hideResultSpinner();
-            }
-        });
+            } }));
     }
     toggleExportButtons() {
         if (this.enableExport && this.context.resultTable
@@ -13455,7 +13475,7 @@ class ReportView extends View {
         this.syncReportOnChange = true;
         this._reportSaveTemplate = `<div id="kdlg-dialog-form" class="kfrm-form">
             <div class="kfrm-fields label-above">
-                <label for="kdlg-dialog-form-input" id="kdlg-dialog-form-content"></label>
+                <label for="kdlg-dialog-form-input" id="kdlg-dialog-form-name-label"></label>
                 <input type="text" name="kdlg-dialog-form-input" id="kdlg-dialog-form-input" />
                 <label for="kdlg-dialog-form-textarea" id="kdlg-dialog-form-desc-label"></label>
                 <textarea type="text" name="kdlg-dialog-form-textarea" id="kdlg-dialog-form-textarea"></textarea>
@@ -13648,13 +13668,13 @@ class ReportView extends View {
             submitOnEnter: true,
             arrangeParents: false,
             beforeOpen: () => {
-                const input = document.getElementById(`kdlg-dialog-form-input`);
-                input.value = i18n.getText('NewReportDefName');
-                const content = document.getElementById('kdlg-dialog-form-content');
-                content.innerHTML = i18n.getText('SaveReportDlgLabel');
-                const label = document.getElementById('kdlg-dialog-form-desc-label');
-                label.innerHTML = i18n.getText('ReportDescLabel');
-                input.focus();
+                const nameInput = document.getElementById(`kdlg-dialog-form-input`);
+                nameInput.value = i18n.getText('NewReportDefName');
+                const nameLabel = document.getElementById('kdlg-dialog-form-name-label');
+                nameLabel.innerHTML = i18n.getText('SaveReportDlgLabel');
+                const descLabel = document.getElementById('kdlg-dialog-form-desc-label');
+                descLabel.innerHTML = i18n.getText('ReportDescLabel');
+                nameInput.focus();
             },
             onSubmit: () => {
                 const nameInput = document.getElementById(`kdlg-dialog-form-input`);
@@ -13747,12 +13767,12 @@ class ReportView extends View {
             beforeOpen: () => {
                 const input = document.getElementById(`kdlg-dialog-form-input`);
                 input.value = query.getName();
-                const content = document.getElementById('kdlg-dialog-form-content');
+                const content = document.getElementById('kdlg-dialog-form-name-label');
                 content.innerHTML = i18n.getText('SaveReportDlgLabel');
                 const label = document.getElementById('kdlg-dialog-form-desc-label');
                 label.innerHTML = i18n.getText('ReportDescLabel');
                 const text = document.getElementById(`kdlg-dialog-form-textarea`);
-                text.value = query.getDescription();
+                text.innerText = query.getDescription();
                 input.focus();
             },
             onSubmit: () => {
@@ -13922,7 +13942,7 @@ class ReportView extends View {
             this.loadReportButton = null;
         }
         if (this.saveReportButton) {
-            this.saveReportButton.addEventListener('click', this.saveReportButtonClickHandler);
+            this.saveReportButton.removeEventListener('click', this.saveReportButtonClickHandler);
             this.saveReportButton = null;
         }
         if (this.removeReportButton) {

package/dist/types/utils/popup_menu.d.ts

@@ -119,6 +119,10 @@ export interface PopupMenuOptions {
     showSelected?: boolean;
     /** If true - the menu will show the ID for each item (e.g. {itemId}:{itemText}) */
     showItemIds?: boolean;
+    /**
+     * If true, popup use max available space
+     */
+    useMaxSpace?: boolean;
 }
 export declare class PopupMenu {
     private static lastMenuID;

package/dist/types/views/view.d.ts

@@ -1,4 +1,4 @@
-import { Widget, EqContext, WidgetGroup, EqServiceProvider } from '@easyquery/core';
+import { Widget, EqContext, WidgetGroup, EqServiceProvider, ContextFetchDataOptions } from '@easyquery/core';
 import { DialogService } from '@easydata/ui';
 import { EqViewOptions, EqResultOptions } from './view_options';
 export declare abstract class View {
@@ -52,7 +52,7 @@ export declare abstract class View {
     * Fetches the data according to the query and other options defined in the context.
     * @param options The options.
     */
-    fetchData(options?: any): void;
+    fetchData(options?: ContextFetchDataOptions): void;
     protected enableExport: boolean;
     protected toggleExportButtons(): void;
     protected enableExportButtons(): void;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@easyquery/ui",
-    "version": "7.3.3-rc01",
+    "version": "7.3.4",
     "description": "EasyQuery.JS Community UI widgets",
     "types": "./dist/types/public_api.d.ts",
     "main": "./dist/easyquery.ui.cjs.js",
@@ -30,7 +30,7 @@
     "bugs": "https://korzh.com/support",
     "license": "LGPL-3.0",
     "peerDependencies": {
-        "@easyquery/core": "^7.3.3-rc01"
+        "@easyquery/core": "^7.3.4"
     },
     "files": [
         "dist",