@sme.up/ketchup 11.0.0-SNAPSHOT-20250129113902 → 11.0.0-SNAPSHOT-20250129133724

package/dist/collection/components/kup-data-table/kup-data-table.js

@@ -14,7 +14,7 @@ var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (
         throw new TypeError("Cannot write private member to an object whose class did not declare it");
     return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
 };
-var _KupDataTable_instances, _KupDataTable_initialized, _KupDataTable_rows, _KupDataTable_rowsLength, _KupDataTable_paginatedRows, _KupDataTable_paginatedRowsLength, _KupDataTable_footer, _KupDataTable_kupManager, _KupDataTable_renderedRows, _KupDataTable_loadMoreEventCounter, _KupDataTable_loadMoreEventPreviousQuantity, _KupDataTable_theadRef, _KupDataTable_tableRef, _KupDataTable_originalData, _KupDataTable_originalDataLoaded, _KupDataTable_originalDataLoadedMaxId, _KupDataTable_insertedRowIds, _KupDataTable_tableAreaRef, _KupDataTable_stickyTheadRef, _KupDataTable_lastPointerDetails, _KupDataTable_customizeTopButtonRef, _KupDataTable_customizeTopPanelRef, _KupDataTable_sizedColumns, _KupDataTable_intObserver, _KupDataTable_navBarHeight, _KupDataTable_theadIntersecting, _KupDataTable_tableIntersecting, _KupDataTable_isSafariBrowser, _KupDataTable_isRestoringState, _KupDataTable_globalFilterTimeout, _KupDataTable_totalMenuCoords, _KupDataTable_clickTimeout, _KupDataTable_thRefs, _KupDataTable_rowsRefs, _KupDataTable_oldWidth, _KupDataTable_hold, _KupDataTable_interactableDrag, _KupDataTable_interactableDrop, _KupDataTable_interactableResize, _KupDataTable_interactableTouch, _KupDataTable_dropareaRef, _KupDataTable_removeDropareaRef, _KupDataTable_groupsDropareaRef, _KupDataTable_clickCb, _KupDataTable_clickCbCustomPanel, _KupDataTable_clickCbDropCard, _KupDataTable_resizeTimeout, _KupDataTable_columnMenuInstance, _KupDataTable_filtersColumnMenuInstance, _KupDataTable_filtersRowsInstance, _KupDataTable_detailCard, _KupDataTable_insertCard, _KupDataTable_actionsCard, _KupDataTable_confirmDeleteCard, _KupDataTable_confirmDeleteDialog, _KupDataTable_columnMenuCard, _KupDataTable_columnDropCard, _KupDataTable_columnDropCardAnchor, _KupDataTable_dropDownActionCardAnchor, _KupDataTable_insertCount, _KupDataTable_lastFocusedRow, _KupDataTable_BUTTON_CANCEL_ID, _KupDataTable_BUTTON_SUBMIT_ID, _KupDataTable_FIELDS_FORM_ID, _KupDataTable_MESSAGE_ID, _KupDataTable_MESSAGE_WRAPPER_ID, _KupDataTable_INSERT_PREFIX, _KupDataTable_DEFAULT_ROWS_FOR_GLOBAL_FILTER, _KupDataTable_eventBlurNames, _KupDataTable_closeDropCard, _KupDataTable_createDropCard, _KupDataTable_calculateData, _KupDataTable_getRow, _KupDataTable__getRow, _KupDataTable_getTransposedData, _KupDataTable_setTransposedData, _KupDataTable_switchToTotalsMatrix, _KupDataTable_setObjForTotalsMatrix, _KupDataTable_stickyHeaderPosition, _KupDataTable_updateStickyHeaderSize, _KupDataTable_setObserver, _KupDataTable_didLoadInteractables, _KupDataTable_didRenderInteractables, _KupDataTable_didLoadObservers, _KupDataTable_didRenderObservers, _KupDataTable_didLoadEventHandling, _KupDataTable_scrollStickyHeader, _KupDataTable_checkScrollOnHover, _KupDataTable_customizePanelPosition, _KupDataTable_rowsPointLength, _KupDataTable_paginatedRowsPointLength, _KupDataTable__rowsLength, _KupDataTable_resetSelectedRows, _KupDataTable_getSizedColumns, _KupDataTable_rowDetail, _KupDataTable_dropDownActions, _KupDataTable_createDropDownActionsCard, _KupDataTable_clearSearchActionsCard, _KupDataTable_filterRowActionsCard, _KupDataTable_closeRowActionsCard, _KupDataTable_closeColumnMenuCard, _KupDataTable_prepareDataForActionsCard, _KupDataTable_rowInsertForm, _KupDataTable_rowsDelete, _KupDataTable_getEventDetails, _KupDataTable_clickHandler, _KupDataTable_cellActionsMenuHandler, _KupDataTable_contextMenuHandler, _KupDataTable_dblClickHandler, _KupDataTable_initRows, _KupDataTable_filterRows, _KupDataTable_isGrouping, _KupDataTable_hasRowActions, _KupDataTable_removeGroup, _KupDataTable_hasTotals, _KupDataTable_tableHasAutoWidth, _KupDataTable_forceGroupExpansion, _KupDataTable_forceRowGroupExpansion, _KupDataTable_adjustPaginator, _KupDataTable_setCellEditability, _KupDataTable_composeFixedCellStyleAndClass, _KupDataTable_updateFixedRowsAndColumnsCssVariables, _KupDataTable_onColumnSort, _KupDataTable_onRemoveFilter, _KupDataTable_getFilterValueForTooltip, _KupDataTable_onGlobalFilterChange, _KupDataTable_handlePageChange, _KupDataTable_handleRowsPerPageChange, _KupDataTable_onRowClick, _KupDataTable_selectColumn, _KupDataTable_deselectColumn, _KupDataTable_onRowActionExpanderClick, _KupDataTable_handleRowSelect, _KupDataTable_onRowExpand, _KupDataTable_onSelectAll, _KupDataTable_openTotalMenu, _KupDataTable_closeTotalMenu, _KupDataTable_isOpenedTotalMenuForColumn, _KupDataTable_groupRows, _KupDataTable_onLoadMoreClick, _KupDataTable_adjustGroupState, _KupDataTable_adjustGroupStateFromRow, _KupDataTable_sortRows, _KupDataTable_getSortIcon, _KupDataTable_getSortDecode, _KupDataTable_calculateColspan, _KupDataTable_isGroupExpanded, _KupDataTable_handleColumnSort, _KupDataTable_moveSortedColumns, _KupDataTable_handleUpdateClick, _KupDataTable_onBlurHandler, _KupDataTable_applyLineBreaks, _KupDataTable_composeHeaderCellClassAndStyle, _KupDataTable_renderHeader, _KupDataTable_renderStickyHeader, _KupDataTable_totalMenuPosition, _KupDataTable_onTotalMenuOpen, _KupDataTable_renderRow, _KupDataTable_onCustomSettingsClick, _KupDataTable_openCustomSettings, _KupDataTable_closeCustomSettings, _KupDataTable_renderPaginator, _KupDataTable_columnRemoveArea, _KupDataTable_columnGroupArea, _KupDataTable_hideShowColumnDropArea, _KupDataTable_handleColumnGroup, _KupDataTable_transcodeItem, _KupDataTable_createListData, _KupDataTable_FONTSIZE_CODES, _KupDataTable_FONTSIZE_DECODES, _KupDataTable_FONTSIZE_ICONS, _KupDataTable_getFontSizeCodeFromDecode, _KupDataTable_renderFontSizePanel, _KupDataTable_DENSITY_DECODES, _KupDataTable_DENSITY_ICONS, _KupDataTable_getDensityCodeFromDecode, _KupDataTable_renderDensityPanel, _KupDataTable_GRID_CODES, _KupDataTable_GRID_DECODES, _KupDataTable_GRID_ICONS, _KupDataTable_getGridCodeFromDecode, _KupDataTable_renderTransposeSwitch, _KupDataTable_renderTotalsMatrix, _KupDataTable_renderGridPanel, _KupDataTable_renderCommandButton, _KupDataTable_renderCommandDropDownButton, _KupDataTable_renderUpdateButtons;
+var _KupDataTable_instances, _KupDataTable_initialized, _KupDataTable_rows, _KupDataTable_rowsLength, _KupDataTable_paginatedRows, _KupDataTable_paginatedRowsLength, _KupDataTable_footer, _KupDataTable_kupManager, _KupDataTable_renderedRows, _KupDataTable_loadMoreEventCounter, _KupDataTable_loadMoreEventPreviousQuantity, _KupDataTable_theadRef, _KupDataTable_tableRef, _KupDataTable_originalData, _KupDataTable_originalDataLoaded, _KupDataTable_originalDataLoadedMaxId, _KupDataTable_insertedRowIds, _KupDataTable_tableAreaRef, _KupDataTable_stickyTheadRef, _KupDataTable_lastPointerDetails, _KupDataTable_customizeTopButtonRef, _KupDataTable_customizeTopPanelRef, _KupDataTable_sizedColumns, _KupDataTable_intObserver, _KupDataTable_navBarHeight, _KupDataTable_theadIntersecting, _KupDataTable_tableIntersecting, _KupDataTable_isSafariBrowser, _KupDataTable_isRestoringState, _KupDataTable_globalFilterTimeout, _KupDataTable_totalMenuCoords, _KupDataTable_clickTimeout, _KupDataTable_thRefs, _KupDataTable_rowsRefs, _KupDataTable_oldWidth, _KupDataTable_hold, _KupDataTable_interactableDrag, _KupDataTable_interactableDrop, _KupDataTable_interactableResize, _KupDataTable_interactableTouch, _KupDataTable_dropareaRef, _KupDataTable_removeDropareaRef, _KupDataTable_groupsDropareaRef, _KupDataTable_clickCb, _KupDataTable_clickCbCustomPanel, _KupDataTable_clickCbDropCard, _KupDataTable_resizeTimeout, _KupDataTable_columnMenuInstance, _KupDataTable_filtersColumnMenuInstance, _KupDataTable_filtersRowsInstance, _KupDataTable_detailCard, _KupDataTable_insertCard, _KupDataTable_actionsCard, _KupDataTable_confirmDeleteCard, _KupDataTable_confirmDeleteDialog, _KupDataTable_columnMenuCard, _KupDataTable_columnDropCard, _KupDataTable_columnDropCardAnchor, _KupDataTable_dropDownActionCardAnchor, _KupDataTable_insertCount, _KupDataTable_lastFocusedRow, _KupDataTable_maxRowsPerPage, _KupDataTable_BUTTON_CANCEL_ID, _KupDataTable_BUTTON_SUBMIT_ID, _KupDataTable_FIELDS_FORM_ID, _KupDataTable_MESSAGE_ID, _KupDataTable_MESSAGE_WRAPPER_ID, _KupDataTable_INSERT_PREFIX, _KupDataTable_DEFAULT_ROWS_FOR_GLOBAL_FILTER, _KupDataTable_eventBlurNames, _KupDataTable_closeDropCard, _KupDataTable_createDropCard, _KupDataTable_calculateData, _KupDataTable_getRow, _KupDataTable__getRow, _KupDataTable_getTransposedData, _KupDataTable_setTransposedData, _KupDataTable_switchToTotalsMatrix, _KupDataTable_setObjForTotalsMatrix, _KupDataTable_stickyHeaderPosition, _KupDataTable_updateStickyHeaderSize, _KupDataTable_setObserver, _KupDataTable_didLoadInteractables, _KupDataTable_didRenderInteractables, _KupDataTable_didLoadObservers, _KupDataTable_didRenderObservers, _KupDataTable_didLoadEventHandling, _KupDataTable_scrollStickyHeader, _KupDataTable_checkScrollOnHover, _KupDataTable_customizePanelPosition, _KupDataTable_rowsPointLength, _KupDataTable_paginatedRowsPointLength, _KupDataTable__rowsLength, _KupDataTable_resetSelectedRows, _KupDataTable_getSizedColumns, _KupDataTable_rowDetail, _KupDataTable_dropDownActions, _KupDataTable_createDropDownActionsCard, _KupDataTable_clearSearchActionsCard, _KupDataTable_filterRowActionsCard, _KupDataTable_closeRowActionsCard, _KupDataTable_closeColumnMenuCard, _KupDataTable_prepareDataForActionsCard, _KupDataTable_rowInsertForm, _KupDataTable_rowsDelete, _KupDataTable_getEventDetails, _KupDataTable_clickHandler, _KupDataTable_cellActionsMenuHandler, _KupDataTable_contextMenuHandler, _KupDataTable_dblClickHandler, _KupDataTable_initRows, _KupDataTable_filterRows, _KupDataTable_isGrouping, _KupDataTable_hasRowActions, _KupDataTable_removeGroup, _KupDataTable_hasTotals, _KupDataTable_tableHasAutoWidth, _KupDataTable_forceGroupExpansion, _KupDataTable_forceRowGroupExpansion, _KupDataTable_adjustPaginator, _KupDataTable_setCellEditability, _KupDataTable_composeFixedCellStyleAndClass, _KupDataTable_updateFixedRowsAndColumnsCssVariables, _KupDataTable_onColumnSort, _KupDataTable_onRemoveFilter, _KupDataTable_getFilterValueForTooltip, _KupDataTable_onGlobalFilterChange, _KupDataTable_handlePageChange, _KupDataTable_handleRowsPerPageChange, _KupDataTable_onRowClick, _KupDataTable_selectColumn, _KupDataTable_deselectColumn, _KupDataTable_onRowActionExpanderClick, _KupDataTable_handleRowSelect, _KupDataTable_onRowExpand, _KupDataTable_onSelectAll, _KupDataTable_openTotalMenu, _KupDataTable_closeTotalMenu, _KupDataTable_isOpenedTotalMenuForColumn, _KupDataTable_groupRows, _KupDataTable_onLoadMoreClick, _KupDataTable_adjustGroupState, _KupDataTable_adjustGroupStateFromRow, _KupDataTable_sortRows, _KupDataTable_getSortIcon, _KupDataTable_getSortDecode, _KupDataTable_calculateColspan, _KupDataTable_isGroupExpanded, _KupDataTable_handleColumnSort, _KupDataTable_moveSortedColumns, _KupDataTable_handleUpdateClick, _KupDataTable_onBlurHandler, _KupDataTable_applyLineBreaks, _KupDataTable_composeHeaderCellClassAndStyle, _KupDataTable_renderHeader, _KupDataTable_renderStickyHeader, _KupDataTable_totalMenuPosition, _KupDataTable_onTotalMenuOpen, _KupDataTable_renderRow, _KupDataTable_onCustomSettingsClick, _KupDataTable_openCustomSettings, _KupDataTable_closeCustomSettings, _KupDataTable_renderPaginator, _KupDataTable_columnRemoveArea, _KupDataTable_columnGroupArea, _KupDataTable_hideShowColumnDropArea, _KupDataTable_handleColumnGroup, _KupDataTable_transcodeItem, _KupDataTable_createListData, _KupDataTable_FONTSIZE_CODES, _KupDataTable_FONTSIZE_DECODES, _KupDataTable_FONTSIZE_ICONS, _KupDataTable_getFontSizeCodeFromDecode, _KupDataTable_renderFontSizePanel, _KupDataTable_DENSITY_DECODES, _KupDataTable_DENSITY_ICONS, _KupDataTable_getDensityCodeFromDecode, _KupDataTable_renderDensityPanel, _KupDataTable_GRID_CODES, _KupDataTable_GRID_DECODES, _KupDataTable_GRID_ICONS, _KupDataTable_getGridCodeFromDecode, _KupDataTable_renderTransposeSwitch, _KupDataTable_renderTotalsMatrix, _KupDataTable_renderGridPanel, _KupDataTable_renderCommandButton, _KupDataTable_renderCommandDropDownButton, _KupDataTable_renderUpdateButtons;
 import { forceUpdate, h, Host, } from "@stencil/core";
 import { FixedCellsClasses, FixedCellsCSSVarsBase, GroupLabelDisplayMode, LoadMoreMode, PaginatorPos, ShowGrid, SortMode, TotalMode, TotalLabel, KupDataTableProps, fieldColumn, iconColumn, keyColumn, SelectionMode, DataTableAreasEnum, } from "./kup-data-table-declarations";
 import { getColumnByName, getValueForDisplay } from "../../utils/cell-utils";
@@ -137,6 +137,7 @@ export class KupDataTable {
         _KupDataTable_dropDownActionCardAnchor.set(this, null);
         _KupDataTable_insertCount.set(this, 0);
         _KupDataTable_lastFocusedRow.set(this, null);
+        _KupDataTable_maxRowsPerPage.set(this, void 0);
         _KupDataTable_BUTTON_CANCEL_ID.set(this, 'cancel');
         _KupDataTable_BUTTON_SUBMIT_ID.set(this, 'submit');
         _KupDataTable_FIELDS_FORM_ID.set(this, 'fieldsForm');
@@ -496,6 +497,20 @@ export class KupDataTable {
                 : -1, "f");
         }
     }
+    computeMaxRowsPerPage() {
+        var _a, _b, _c, _d;
+        if (((_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a.columns) === null || _b === void 0 ? void 0 : _b.length) > 0 && ((_d = (_c = this.data) === null || _c === void 0 ? void 0 : _c.rows) === null || _d === void 0 ? void 0 : _d.length) > 0) {
+            const columnsNumber = this.data.columns.length;
+            const cellsNumber = this.data.rows.reduce((acc, r) => acc + Object.keys(r.cells).length, 0);
+            const maxCellsNumberPerPage = __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").perfTuning.data.maxCellsPerPage;
+            if (cellsNumber > maxCellsNumberPerPage) {
+                // Rounds a number up to the nearest multiple of ten.
+                __classPrivateFieldSet(this, _KupDataTable_maxRowsPerPage, Math.ceil(maxCellsNumberPerPage / columnsNumber / 10) * 10, "f");
+            }
+            if (this.rowsPerPage > __classPrivateFieldGet(this, _KupDataTable_maxRowsPerPage, "f"))
+                this.rowsPerPage = __classPrivateFieldGet(this, _KupDataTable_maxRowsPerPage, "f");
+        }
+    }
     recalculateRowsAndUndoSelections() {
         if (!__classPrivateFieldGet(this, _KupDataTable_isRestoringState, "f")) {
             this.recalculateRows();
@@ -959,6 +974,7 @@ export class KupDataTable {
         if (this.pageSelected > 0) {
             this.currentPage = this.pageSelected;
         }
+        this.computeMaxRowsPerPage();
         this.currentRowsPerPage = this.rowsPerPage;
         __classPrivateFieldSet(this, _KupDataTable_isRestoringState, false, "f");
         //this.identifyAndInitRows();
@@ -986,6 +1002,10 @@ export class KupDataTable {
         __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").debug.logRender(this, false);
     }
     componentDidRender() {
+        // If the component is not connected this method must not be executed
+        if (!this.rootElement.isConnected) {
+            return;
+        }
         const root = this.rootElement.shadowRoot;
         if (root) {
             const fs = root.querySelectorAll('.f-text-field');
@@ -1329,7 +1349,7 @@ export class KupDataTable {
         }
         let rows = null;
         if (__classPrivateFieldGet(this, _KupDataTable_paginatedRowsLength, "f") === 0) {
-            rows = (h("tr", { key: '5ea64b218672da840081c5bf02cdc94ddef0324b', ref: (el) => __classPrivateFieldGet(this, _KupDataTable_rowsRefs, "f").push(el) }, h("td", { key: '432ffb2cac603e2b68b9e8cf640501c1673d968d', colSpan: __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_calculateColspan).call(this) }, this.emptyDataLabel)));
+            rows = (h("tr", { key: '6d9d16167f4002b03b7c74ac1b98d2e0a94c4638', ref: (el) => __classPrivateFieldGet(this, _KupDataTable_rowsRefs, "f").push(el) }, h("td", { key: '443765e1268b32685159b10edb405f52d306363e', colSpan: __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_calculateColspan).call(this) }, this.emptyDataLabel)));
         }
         else {
             rows = [];
@@ -1394,7 +1414,7 @@ export class KupDataTable {
                 for (let i = 0; i < chipsData.length; i++) {
                     props.onIconClick.push(() => __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_removeGroup).call(this, i));
                 }
-                groupChips = h(FChip, Object.assign({ key: '46b690b3112c1e54d3eb6dcc297222270e264872' }, props));
+                groupChips = h(FChip, Object.assign({ key: '199d6b555188e62513d0a7bf9c63907ef4f7d885' }, props));
             }
         }
         const tableClass = {
@@ -1426,7 +1446,7 @@ export class KupDataTable {
         if (this.headerIsPersistent &&
             this.tableHeight === undefined &&
             this.tableWidth === undefined) {
-            stickyEl = (h("sticky-header", { key: 'ad4427c0f8c874acc175e3265787504bc7368404', class: "hover-scrolling-child", hidden: !this.showHeader, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_stickyTheadRef, el, "f")) }, h("thead-sticky", { key: '96eef0b1b399de25aa16d0f6ab7f7b6195ee2294' }, h("tr-sticky", { key: '3e9739c131e68e64a345b0c97a5f503bd28723a5' }, stickyHeader))));
+            stickyEl = (h("sticky-header", { key: '88f5e4ab2045c7c73ec4c9b867988a1676cd612c', class: "hover-scrolling-child", hidden: !this.showHeader, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_stickyTheadRef, el, "f")) }, h("thead-sticky", { key: '3b369852380887a46c52dd891d83173aec6adcdc' }, h("tr-sticky", { key: '5d4d2eb2c1c859742ff0cdd828edca2663420f67' }, stickyHeader))));
         }
         let belowClass = 'below-wrapper';
         if (!!this.tableHeight || !!this.tableWidth) {
@@ -1472,7 +1492,7 @@ export class KupDataTable {
         const useGlobalFilter = !this.legacyLook &&
             (this.globalFilter ||
                 this.getRows().length > __classPrivateFieldGet(this, _KupDataTable_DEFAULT_ROWS_FOR_GLOBAL_FILTER, "f"));
-        const compCreated = (h(Host, { key: 'fb5ac0fe168288eb48b8cd7ef6d131924ac64d3d', "onKup-drop": (e) => {
+        const compCreated = (h(Host, { key: '12778f3149ab617e0e59865f5649af9bf5ca2ec0', "onKup-drop": (e) => {
                 this.kupDataTableDrop.emit(e.detail);
             }, "onKup-cell-input": (e) => {
                 autoselectOnAction(e);
@@ -1487,11 +1507,11 @@ export class KupDataTable {
                 this.kupDataTableObjectFieldOpenSearchMenu.emit(e.detail);
             }, "onKup-objectfield-selectedmenuitem": (e) => {
                 this.kupDataTableObjectFieldSelectedMenuItem.emit(e.detail);
-            } }, h("style", { key: '8c64b0c405aa7a0e8d3825c4f63e2322a39b4480' }, __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").theme.setKupStyle(this.rootElement)), this.updatableData ? __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_renderUpdateButtons).call(this) : null, h("div", { key: '32206172f7bd83fb6617e787194e6bc77856a32d', id: componentWrapperId, class: wrapClass }, h("div", { key: '0e75faa91fe043a3dfedffb13562d5b1bdcae868', class: "group-wrapper" }, groupChips), h("div", { key: '9055b81861aa50281fb7be1538d52baaefec472e', class: "actions-wrapper", style: actionWrapperWidth }, useGlobalFilter ? (h("div", { id: "global-filter" }, h(FTextField, { fullWidth: true, icon: KupThemeIconValues.SEARCH, label: __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageSearch.SEARCH), value: this.globalFilterValue, onInput: (event) => {
+            } }, h("style", { key: '0217d86bf4de1547426ac289ec5acc71066eb7fe' }, __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").theme.setKupStyle(this.rootElement)), this.updatableData ? __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_renderUpdateButtons).call(this) : null, h("div", { key: '577c666a4101c0bc7dd2fab660edb414be45a92d', id: componentWrapperId, class: wrapClass }, h("div", { key: '847bfb77ff66455d1160149986dca0fc6f40073b', class: "group-wrapper" }, groupChips), h("div", { key: '3e07732ced2c982eab556b444caecc57c77627fb', class: "actions-wrapper", style: actionWrapperWidth }, useGlobalFilter ? (h("div", { id: "global-filter" }, h(FTextField, { fullWidth: true, icon: KupThemeIconValues.SEARCH, label: __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageSearch.SEARCH), value: this.globalFilterValue, onInput: (event) => {
                 const t = event.target;
                 window.clearTimeout(__classPrivateFieldGet(this, _KupDataTable_globalFilterTimeout, "f"));
                 __classPrivateFieldSet(this, _KupDataTable_globalFilterTimeout, window.setTimeout(() => __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_onGlobalFilterChange).call(this, t), 600, t), "f");
-            } }))) : null, h("div", { key: '770456c9c7377628bc9f2d031f8afbd271351d9c', class: "above-wrapper paginator-top" }, paginatorTop), this.insertMode !== '' &&
+            } }))) : null, h("div", { key: 'a16daa7a120a68fbe51d78e283241840be42638d', class: "above-wrapper paginator-top" }, paginatorTop), this.insertMode !== '' &&
             this.selectedRows.length > 0 ? (h(FButton, { icon: "save", onClick: () => {
                 this.kupSave.emit({
                     comp: this,
@@ -1541,9 +1561,9 @@ export class KupDataTable {
                     this.data.rows.unshift(row);
                     await this.refresh(true);
                 }
-            }, sizing: KupComponentSizing.MEDIUM, styling: FButtonStyling.RAISED, title: "Insert row", wrapperClass: "insert-button" })) : null), h("div", { key: '51e4244dd325c21dd8d2f8d03ad5ff3b3cd04786', class: "droparea", ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_dropareaRef, el, "f")) }, this.showGroups ? __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_columnGroupArea).call(this) : null, this.removableColumns
+            }, sizing: KupComponentSizing.MEDIUM, styling: FButtonStyling.RAISED, title: "Insert row", wrapperClass: "insert-button" })) : null), h("div", { key: '902ecd2774e059728e3d8154d57d79224988488c', class: "droparea", ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_dropareaRef, el, "f")) }, this.showGroups ? __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_columnGroupArea).call(this) : null, this.removableColumns
             ? __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_columnRemoveArea).call(this)
-            : null), h("div", { key: 'f129997ef39c8722e3b309db11d73fb7e9ab73b9', style: elStyle, class: belowClass, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_tableAreaRef, el, "f")) }, this.showCustomization
+            : null), h("div", { key: 'fd68ebe495ff8c2494f0d554f7cf029784fe49ed', style: elStyle, class: belowClass, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_tableAreaRef, el, "f")) }, this.showCustomization
             ? [
                 h("div", { class: "settings-trigger", onClick: () => {
                         __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_onCustomSettingsClick).call(this);
@@ -1552,7 +1572,7 @@ export class KupDataTable {
                     } }, h(FImage, { color: `var(${KupThemeColorValues.TITLE})`, resource: "settings", sizeX: "10px" })),
                 this.renderCustomizePanel(),
             ]
-            : null, h("table", { key: 'a3702096a93aad8283972d9e6865ef5cf3f9bc39', class: tableClass, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_tableRef, el, "f")), onMouseLeave: (ev) => {
+            : null, h("table", { key: 'b62b7bebd0e9637778de0277921a92704986eb31', class: tableClass, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_tableRef, el, "f")), onMouseLeave: (ev) => {
                 ev.stopPropagation();
             }, onPointerDown: (e) => {
                 __classPrivateFieldSet(this, _KupDataTable_lastPointerDetails, __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_getEventDetails).call(this, __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").getEventPath(e.target, this.rootElement), e), "f");
@@ -1560,7 +1580,7 @@ export class KupDataTable {
                 __classPrivateFieldSet(this, _KupDataTable_lastPointerDetails, __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_getEventDetails).call(this, __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").getEventPath(e.target, this.rootElement), e), "f");
             }, onContextMenu: (e) => {
                 e.preventDefault();
-            } }, h("thead", { key: '5f530f4e85b709564c0f0d07034147a423c736e5', hidden: !this.showHeader, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_theadRef, el, "f")) }, h("tr", { key: '708cf966753f1e1b15c91103c526307cf3ac8eb3' }, header)), h("tbody", { key: '5b9fe64f7ca2fe430747adec0768471daace5895' }, rows), this.showFooter || __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_hasTotals).call(this)
+            } }, h("thead", { key: '15d2f44898034c0c43c9afe444cb9f8a00d4ac3c', hidden: !this.showHeader, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_theadRef, el, "f")) }, h("tr", { key: '74e064a7d69f840c32757d4c1dd1c9e30f6eda37' }, header)), h("tbody", { key: '0703f5ed36888fe194963fbfcb43405281eae5b8' }, rows), this.showFooter || __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_hasTotals).call(this)
             ? this.renderFooter()
             : null), stickyEl), paginatorBottom)));
         return compCreated;
@@ -1569,6 +1589,11 @@ export class KupDataTable {
         __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").interact.unregister(__classPrivateFieldGet(this, _KupDataTable_interactableDrag, "f").concat(__classPrivateFieldGet(this, _KupDataTable_interactableDrop, "f"), __classPrivateFieldGet(this, _KupDataTable_interactableResize, "f"), __classPrivateFieldGet(this, _KupDataTable_interactableTouch, "f")));
         __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").language.unregister(this);
         __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").theme.unregister(this);
+        __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").toolbar.unregister([this.rootElement]);
+        if (__classPrivateFieldGet(this, _KupDataTable_customizeTopPanelRef, "f"))
+            __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").dynamicPosition.unregister([
+                __classPrivateFieldGet(this, _KupDataTable_customizeTopPanelRef, "f"),
+            ]);
         const dynamicPositionElements = this.rootElement.shadowRoot.querySelectorAll('[' + kupDynamicPositionAttribute + ']');
         if (dynamicPositionElements.length > 0) {
             __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").dynamicPosition.unregister(Array.prototype.slice.call(dynamicPositionElements));
@@ -2404,7 +2429,7 @@ export class KupDataTable {
             },
             "rowsPerPage": {
                 "type": "number",
-                "mutable": false,
+                "mutable": true,
                 "complexType": {
                     "original": "number",
                     "resolved": "number",
@@ -4107,6 +4132,9 @@ export class KupDataTable {
             }, {
                 "propName": "data",
                 "methodName": "decorateAndInitForUpdTable"
+            }, {
+                "propName": "data",
+                "methodName": "computeMaxRowsPerPage"
             }, {
                 "propName": "groups",
                 "methodName": "recalculateRowsAndUndoSelections"
@@ -4125,7 +4153,7 @@ export class KupDataTable {
             }];
     }
 }
-_KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _KupDataTable_rowsLength = new WeakMap(), _KupDataTable_paginatedRows = new WeakMap(), _KupDataTable_paginatedRowsLength = new WeakMap(), _KupDataTable_footer = new WeakMap(), _KupDataTable_kupManager = new WeakMap(), _KupDataTable_renderedRows = new WeakMap(), _KupDataTable_loadMoreEventCounter = new WeakMap(), _KupDataTable_loadMoreEventPreviousQuantity = new WeakMap(), _KupDataTable_theadRef = new WeakMap(), _KupDataTable_tableRef = new WeakMap(), _KupDataTable_originalData = new WeakMap(), _KupDataTable_originalDataLoaded = new WeakMap(), _KupDataTable_originalDataLoadedMaxId = new WeakMap(), _KupDataTable_insertedRowIds = new WeakMap(), _KupDataTable_tableAreaRef = new WeakMap(), _KupDataTable_stickyTheadRef = new WeakMap(), _KupDataTable_lastPointerDetails = new WeakMap(), _KupDataTable_customizeTopButtonRef = new WeakMap(), _KupDataTable_customizeTopPanelRef = new WeakMap(), _KupDataTable_sizedColumns = new WeakMap(), _KupDataTable_intObserver = new WeakMap(), _KupDataTable_navBarHeight = new WeakMap(), _KupDataTable_theadIntersecting = new WeakMap(), _KupDataTable_tableIntersecting = new WeakMap(), _KupDataTable_isSafariBrowser = new WeakMap(), _KupDataTable_isRestoringState = new WeakMap(), _KupDataTable_globalFilterTimeout = new WeakMap(), _KupDataTable_totalMenuCoords = new WeakMap(), _KupDataTable_clickTimeout = new WeakMap(), _KupDataTable_thRefs = new WeakMap(), _KupDataTable_rowsRefs = new WeakMap(), _KupDataTable_oldWidth = new WeakMap(), _KupDataTable_hold = new WeakMap(), _KupDataTable_interactableDrag = new WeakMap(), _KupDataTable_interactableDrop = new WeakMap(), _KupDataTable_interactableResize = new WeakMap(), _KupDataTable_interactableTouch = new WeakMap(), _KupDataTable_dropareaRef = new WeakMap(), _KupDataTable_removeDropareaRef = new WeakMap(), _KupDataTable_groupsDropareaRef = new WeakMap(), _KupDataTable_clickCb = new WeakMap(), _KupDataTable_clickCbCustomPanel = new WeakMap(), _KupDataTable_clickCbDropCard = new WeakMap(), _KupDataTable_resizeTimeout = new WeakMap(), _KupDataTable_columnMenuInstance = new WeakMap(), _KupDataTable_filtersColumnMenuInstance = new WeakMap(), _KupDataTable_filtersRowsInstance = new WeakMap(), _KupDataTable_detailCard = new WeakMap(), _KupDataTable_insertCard = new WeakMap(), _KupDataTable_actionsCard = new WeakMap(), _KupDataTable_confirmDeleteCard = new WeakMap(), _KupDataTable_confirmDeleteDialog = new WeakMap(), _KupDataTable_columnMenuCard = new WeakMap(), _KupDataTable_columnDropCard = new WeakMap(), _KupDataTable_columnDropCardAnchor = new WeakMap(), _KupDataTable_dropDownActionCardAnchor = new WeakMap(), _KupDataTable_insertCount = new WeakMap(), _KupDataTable_lastFocusedRow = new WeakMap(), _KupDataTable_BUTTON_CANCEL_ID = new WeakMap(), _KupDataTable_BUTTON_SUBMIT_ID = new WeakMap(), _KupDataTable_FIELDS_FORM_ID = new WeakMap(), _KupDataTable_MESSAGE_ID = new WeakMap(), _KupDataTable_MESSAGE_WRAPPER_ID = new WeakMap(), _KupDataTable_INSERT_PREFIX = new WeakMap(), _KupDataTable_DEFAULT_ROWS_FOR_GLOBAL_FILTER = new WeakMap(), _KupDataTable_eventBlurNames = new WeakMap(), _KupDataTable_stickyHeaderPosition = new WeakMap(), _KupDataTable_handleUpdateClick = new WeakMap(), _KupDataTable_FONTSIZE_CODES = new WeakMap(), _KupDataTable_FONTSIZE_DECODES = new WeakMap(), _KupDataTable_FONTSIZE_ICONS = new WeakMap(), _KupDataTable_DENSITY_DECODES = new WeakMap(), _KupDataTable_DENSITY_ICONS = new WeakMap(), _KupDataTable_GRID_CODES = new WeakMap(), _KupDataTable_GRID_DECODES = new WeakMap(), _KupDataTable_GRID_ICONS = new WeakMap(), _KupDataTable_instances = new WeakSet(), _KupDataTable_closeDropCard = function _KupDataTable_closeDropCard() {
+_KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _KupDataTable_rowsLength = new WeakMap(), _KupDataTable_paginatedRows = new WeakMap(), _KupDataTable_paginatedRowsLength = new WeakMap(), _KupDataTable_footer = new WeakMap(), _KupDataTable_kupManager = new WeakMap(), _KupDataTable_renderedRows = new WeakMap(), _KupDataTable_loadMoreEventCounter = new WeakMap(), _KupDataTable_loadMoreEventPreviousQuantity = new WeakMap(), _KupDataTable_theadRef = new WeakMap(), _KupDataTable_tableRef = new WeakMap(), _KupDataTable_originalData = new WeakMap(), _KupDataTable_originalDataLoaded = new WeakMap(), _KupDataTable_originalDataLoadedMaxId = new WeakMap(), _KupDataTable_insertedRowIds = new WeakMap(), _KupDataTable_tableAreaRef = new WeakMap(), _KupDataTable_stickyTheadRef = new WeakMap(), _KupDataTable_lastPointerDetails = new WeakMap(), _KupDataTable_customizeTopButtonRef = new WeakMap(), _KupDataTable_customizeTopPanelRef = new WeakMap(), _KupDataTable_sizedColumns = new WeakMap(), _KupDataTable_intObserver = new WeakMap(), _KupDataTable_navBarHeight = new WeakMap(), _KupDataTable_theadIntersecting = new WeakMap(), _KupDataTable_tableIntersecting = new WeakMap(), _KupDataTable_isSafariBrowser = new WeakMap(), _KupDataTable_isRestoringState = new WeakMap(), _KupDataTable_globalFilterTimeout = new WeakMap(), _KupDataTable_totalMenuCoords = new WeakMap(), _KupDataTable_clickTimeout = new WeakMap(), _KupDataTable_thRefs = new WeakMap(), _KupDataTable_rowsRefs = new WeakMap(), _KupDataTable_oldWidth = new WeakMap(), _KupDataTable_hold = new WeakMap(), _KupDataTable_interactableDrag = new WeakMap(), _KupDataTable_interactableDrop = new WeakMap(), _KupDataTable_interactableResize = new WeakMap(), _KupDataTable_interactableTouch = new WeakMap(), _KupDataTable_dropareaRef = new WeakMap(), _KupDataTable_removeDropareaRef = new WeakMap(), _KupDataTable_groupsDropareaRef = new WeakMap(), _KupDataTable_clickCb = new WeakMap(), _KupDataTable_clickCbCustomPanel = new WeakMap(), _KupDataTable_clickCbDropCard = new WeakMap(), _KupDataTable_resizeTimeout = new WeakMap(), _KupDataTable_columnMenuInstance = new WeakMap(), _KupDataTable_filtersColumnMenuInstance = new WeakMap(), _KupDataTable_filtersRowsInstance = new WeakMap(), _KupDataTable_detailCard = new WeakMap(), _KupDataTable_insertCard = new WeakMap(), _KupDataTable_actionsCard = new WeakMap(), _KupDataTable_confirmDeleteCard = new WeakMap(), _KupDataTable_confirmDeleteDialog = new WeakMap(), _KupDataTable_columnMenuCard = new WeakMap(), _KupDataTable_columnDropCard = new WeakMap(), _KupDataTable_columnDropCardAnchor = new WeakMap(), _KupDataTable_dropDownActionCardAnchor = new WeakMap(), _KupDataTable_insertCount = new WeakMap(), _KupDataTable_lastFocusedRow = new WeakMap(), _KupDataTable_maxRowsPerPage = new WeakMap(), _KupDataTable_BUTTON_CANCEL_ID = new WeakMap(), _KupDataTable_BUTTON_SUBMIT_ID = new WeakMap(), _KupDataTable_FIELDS_FORM_ID = new WeakMap(), _KupDataTable_MESSAGE_ID = new WeakMap(), _KupDataTable_MESSAGE_WRAPPER_ID = new WeakMap(), _KupDataTable_INSERT_PREFIX = new WeakMap(), _KupDataTable_DEFAULT_ROWS_FOR_GLOBAL_FILTER = new WeakMap(), _KupDataTable_eventBlurNames = new WeakMap(), _KupDataTable_stickyHeaderPosition = new WeakMap(), _KupDataTable_handleUpdateClick = new WeakMap(), _KupDataTable_FONTSIZE_CODES = new WeakMap(), _KupDataTable_FONTSIZE_DECODES = new WeakMap(), _KupDataTable_FONTSIZE_ICONS = new WeakMap(), _KupDataTable_DENSITY_DECODES = new WeakMap(), _KupDataTable_DENSITY_ICONS = new WeakMap(), _KupDataTable_GRID_CODES = new WeakMap(), _KupDataTable_GRID_DECODES = new WeakMap(), _KupDataTable_GRID_ICONS = new WeakMap(), _KupDataTable_instances = new WeakSet(), _KupDataTable_closeDropCard = function _KupDataTable_closeDropCard() {
     __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").dynamicPosition.stop(__classPrivateFieldGet(this, _KupDataTable_columnDropCard, "f"));
     __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").removeClickCallback(__classPrivateFieldGet(this, _KupDataTable_clickCbDropCard, "f"));
     __classPrivateFieldGet(this, _KupDataTable_columnDropCard, "f").remove();
@@ -6334,11 +6362,12 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     this.openedCustomSettings = false;
     __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").removeClickCallback(__classPrivateFieldGet(this, _KupDataTable_clickCbCustomPanel, "f"));
 }, _KupDataTable_renderPaginator = function _KupDataTable_renderPaginator(top) {
+    var _a;
     return (h("div", { class: "paginator-wrapper" }, h("div", { class: "paginator-tabs" }, this.showLoadMore ||
         (!this.lazyLoadRows &&
             __classPrivateFieldGet(this, _KupDataTable_rowsLength, "f") > this.rowsPerPage) ? (h(FPaginator, { id: top ? 'top-paginator' : 'bottom-paginator', currentPage: this.currentPage, max: __classPrivateFieldGet(this, _KupDataTable_rowsLength, "f"), perPage: this.currentRowsPerPage
             ? this.currentRowsPerPage
-            : this.rowsPerPage, onLoadMore: this.showLoadMore
+            : this.rowsPerPage, maxRowsPerPage: (_a = __classPrivateFieldGet(this, _KupDataTable_maxRowsPerPage, "f")) !== null && _a !== void 0 ? _a : __classPrivateFieldGet(this, _KupDataTable_rowsLength, "f"), onLoadMore: this.showLoadMore
             ? () => {
                 __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_onLoadMoreClick).call(this);
             }

package/dist/collection/components/kup-input-panel/kup-input-panel.css

@@ -153,6 +153,14 @@
     --kup-input-panel-font-size,
     var(--kup-font-size)
   );
+  --kup_textfield_textarea_height_input_panel: var(
+    --kup-textfield-textarea-height-input_panel,
+    200px
+  );
+  --kup_textfield_textarea_width_input_panel: var(
+    --kup-textfield-textarea-width-input_panel,
+    300px
+  );
   --kup_input_panel_label_alignment: var(--kup-input-panel-label-alignment);
   --kup_input_panel_label_width: var(--kup-input-panel-label-width);
   --kup_input_panel_padding: var(--kup-input-panel-padding, 1em 0);
@@ -203,6 +211,10 @@
 :host .input-panel__section .f-cell__content > * {
   width: 100%;
 }
+:host .input-panel .f-text-field .mdc-text-field.mdc-text-field--textarea {
+  min-height: var(--kup_textfield_textarea_height_input_panel) !important;
+  min-width: var(--kup_textfield_textarea_width_input_panel) !important;
+}
 :host .input-panel__horizontal-section {
   display: inline-grid;
 }

package/dist/collection/components/kup-tree/kup-tree.js

@@ -1374,9 +1374,10 @@ export class KupTree {
             : null)))));
     }
     disconnectedCallback() {
-        __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.register(this);
+        __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.unregister(this);
         __classPrivateFieldGet(this, _KupTree_kupManager, "f").resize.unobserve(this.rootElement);
         __classPrivateFieldGet(this, _KupTree_kupManager, "f").theme.unregister(this);
+        __classPrivateFieldGet(this, _KupTree_kupManager, "f").interact.unregister([this.treeWrapperRef]);
         const dynamicPositionElements = this.rootElement.shadowRoot.querySelectorAll('[' + kupDynamicPositionAttribute + ']');
         if (dynamicPositionElements.length > 0) {
             __classPrivateFieldGet(this, _KupTree_kupManager, "f").dynamicPosition.unregister(Array.prototype.slice.call(dynamicPositionElements));

package/dist/collection/components/kup-typography/kup-typography.js

@@ -72,6 +72,7 @@ export class KupTypography {
             this.kupManager.dynamicPosition.stop(this.toolbarList);
             this.kupManager.removeClickCallback(__classPrivateFieldGet(this, _KupTypography_clickCbDropCard, "f"));
             this.toolbarList.remove();
+            this.kupManager.dynamicPosition.unregister([this.toolbarList]);
             this.toolbarList = null;
         }
     }
@@ -157,13 +158,16 @@ export class KupTypography {
         const classObjParent = {
             'kup-typography--wrap': props.toolbar ? true : false,
         };
-        return (h(Host, { key: 'fe286e66a636ad6890be311317613cb93837bdd1' }, h("style", { key: '1b4b502d27ed32c6debe91a84ef7cf1275be6191' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '42a989c3c72a7b5fc2da0a7e21c1558581382d97', id: componentWrapperId, class: classObjParent, onClick: () => this.onKupClick }, h(FTypography, Object.assign({ key: 'c9f07cdedcc9954d1b1676af6df80f626c4d5e7c' }, props)), this.toolbar && (h(FImage, Object.assign({ key: 'd681aaed0b6369a8ad77b43ba7537d4bac8e74f8' }, propsFImage, { onClick: (event) => {
+        return (h(Host, { key: '27f9ac7bf67392fd5db9855b7e66bdc913553492' }, h("style", { key: '6609e32fd74eefed92a8e4acd1fe6000c76fb976' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'f21fdabcc4c3db2c90f11abb4a68cb4e410d6d2f', id: componentWrapperId, class: classObjParent, onClick: () => this.onKupClick }, h(FTypography, Object.assign({ key: 'fcfd6add0b15ad0651ed2daaba19be3d31f0c9c0' }, props)), this.toolbar && (h(FImage, Object.assign({ key: '84e33be94c0a024be8003ce0e44b8aa024ddf363' }, propsFImage, { onClick: (event) => {
                 event.stopPropagation();
                 this.onKupIconClick(event.currentTarget);
             } }))))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);
+        if (this.toolbarList) {
+            this.kupManager.dynamicPosition.unregister([this.toolbarList]);
+        }
     }
     static get is() { return "kup-typography"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/f-components/f-cell/f-cell.js

@@ -424,12 +424,6 @@ function setEditableCell(cellType, classObj, cell, column, props) {
         case FCellTypes.DATE:
             return (h("kup-date-picker", Object.assign({ key: column.name + props.row.id, initialValue: cell.value }, cell.data, { class: isFullWidth(props) ? 'kup-full-width' : '', "onkup-datepicker-change": (e) => cellEvent(e, props, cellType, FCellEvents.UPDATE), "onkup-datepicker-input": (e) => cellEvent(e, props, cellType, FCellEvents.INPUT), "onKup-datepicker-blur": (e) => cellEvent(e, props, cellType, FCellEvents.BLUR), "onkup-datepicker-textfieldsubmit": (e) => cellEvent(e, props, cellType, FCellEvents.UPDATE) })));
         case FCellTypes.EDITOR:
-            try {
-                cell.value = JSON.parse(`"${cell.value}"`);
-            }
-            catch (e) {
-                cell.value = JSON.parse(JSON.stringify(cell.value));
-            }
             return (h(FTextField, Object.assign({}, cell.data, { textArea: true, sizing: KupComponentSizing.EXTRA_LARGE, label: column.title, fullWidth: isFullWidth(props) ? true : false, maxLength: cell.data.maxLength, value: cell.value, onChange: (e) => {
                     cellEvent(e, props, cellType, FCellEvents.UPDATE);
                 }, onInput: (e) => {
@@ -477,7 +471,7 @@ function setEditableCell(cellType, classObj, cell, column, props) {
             const onKeyDown = (e) => {
                 var _a, _b;
                 (_b = (_a = cell.data) === null || _a === void 0 ? void 0 : _a.onKeyDown) === null || _b === void 0 ? void 0 : _b.call(_a, e); // call onKeyDown handler if it is set as prop
-                if (e.key === 'Enter' || /^F[1-9]|F1[0-2]$/.test(e.key)) {
+                if (/^F[1-9]|F1[0-2]$/.test(e.key)) {
                     cellEvent(e, props, cellType, FCellEvents.UPDATE);
                 }
             };
@@ -489,10 +483,11 @@ function setEditableCell(cellType, classObj, cell, column, props) {
                 return (h("input", { class: 'input-field', onChange: onChange, onInput: onInput, onKeyDown: onKeyDown, type: type, value: value, maxLength: (_d = (_c = column.cellData) === null || _c === void 0 ? void 0 : _c.maxLength) !== null && _d !== void 0 ? _d : -1 }));
             }
             else {
-                return (h(FTextField, Object.assign({ textArea: (cell.shape
-                        ? cell.shape === FCellShapes.MEMO
-                        : false) ||
-                        (cellType ? cellType === FCellTypes.MEMO : false), inputType: type, fullWidth: isFullWidth(props) ? true : false }, cell.data, { maxLength: (cellType == FCellTypes.NUMBER &&
+                const isTextArea = (cell.shape ? cell.shape === FCellShapes.MEMO : false) ||
+                    (cellType ? cellType === FCellTypes.MEMO : false);
+                return (h(FTextField, Object.assign({}, cell.data, { textArea: isTextArea, sizing: isTextArea
+                        ? KupComponentSizing.EXTRA_LARGE
+                        : KupComponentSizing.SMALL, inputType: type, fullWidth: isFullWidth(props) ? true : false, maxLength: (cellType == FCellTypes.NUMBER &&
                         ((props.column.decimals &&
                             props.column.decimals > 0) ||
                             props.column.group)) ||
@@ -848,6 +843,7 @@ function cellEvent(e, props, cellType, cellEventName) {
                 }
                 break;
             case FCellTypes.EDITOR:
+            case FCellTypes.STRING:
                 value = JSON.stringify(value).slice(1, -1);
                 break;
         }

package/dist/collection/f-components/f-paginator/f-paginator.js

@@ -61,11 +61,12 @@ function getPageItems(props, maxNumberOfPage) {
 }
 function getRowsItems(props) {
     const rowsPerPageItems = [];
+    const max = Math.min(props.max, props.maxRowsPerPage);
     let i = props.perPage;
     if (i === 0) {
         return rowsPerPageItems;
     }
-    while (i < props.max) {
+    while (i < max) {
         const selected = i == props.perPage;
         rowsPerPageItems.push({
             id: i.toString(),
@@ -74,11 +75,11 @@ function getRowsItems(props) {
         });
         i = i * 2;
     }
-    const selected = props.max == props.perPage;
+    const selected = max == props.perPage;
     rowsPerPageItems.push({
-        id: props.max.toString(),
+        id: max.toString(),
         selected: selected,
-        value: props.max.toString(),
+        value: max.toString(),
     });
     return rowsPerPageItems;
 }

package/dist/collection/f-components/f-text-field/f-text-field.js

@@ -124,6 +124,14 @@ function setContent(props) {
         };
         value = formatValue(value, options, false);
     }
+    if (props.textArea) {
+        try {
+            value = JSON.parse(`"${value}"`);
+        }
+        catch (e) {
+            value = JSON.parse(JSON.stringify(value));
+        }
+    }
     return (h("div", { class: classContainerObj }, !props.fullWidth ? labelEl : undefined, h("div", { class: classObj }, !props.trailingIcon ? iconEl : undefined, props.textArea ? (h("span", { class: "mdc-text-field__resizer" }, h("textarea", { class: "mdc-text-field__input", disabled: props.disabled, maxlength: props.maxLength, value: value, autoComplete: (_f = props.autocomplete) !== null && _f !== void 0 ? _f : 'off', onBlur: props.onBlur, onClick: props.onClick, onChange: props.onChange, onFocus: props.onFocus, onInput: props.onInput, onKeyDown: props.onKeyDown }))) : (h("input", { type: inputType, inputmode: props.inputMode ? props.inputMode : undefined, step: props.step, min: props.min, max: props.max, name: props.name, class: "mdc-text-field__input", disabled: props.disabled, placeholder: props.placeholder, maxlength: props.maxLength, size: props.size, value: value, readOnly: props.isSelect, autoComplete: (_g = props.autocomplete) !== null && _g !== void 0 ? _g : 'off', onBlur: (e) => {
             var _a, _b, _c, _d;
             if (persManageForNumberFormat) {

package/dist/collection/managers/kup-dynamic-position/kup-dynamic-position.js

@@ -64,12 +64,12 @@ export class KupDynamicPosition {
             placement: placement ? placement : KupDynamicPositionPlacement.AUTO,
             rAF: null,
         };
+        const self = this;
         const mutObserver = new MutationObserver(function (mutations) {
             const target = mutations[0].target;
             if (target.classList.contains(kupDynamicPositionActiveClass)) {
-                requestAnimationFrame(function () {
-                    dom.ketchup.dynamicPosition.run(el);
-                });
+                self.addRepositionListeners(el);
+                self.run(el);
             }
         });
         mutObserver.observe(el, {
@@ -93,6 +93,7 @@ export class KupDynamicPosition {
     unregister(elements) {
         if (this.managedElements) {
             for (let index = 0; index < elements.length; index++) {
+                this.removeRepositionListeners(elements[index]);
                 this.managedElements.delete(elements[index]);
             }
         }
@@ -118,6 +119,7 @@ export class KupDynamicPosition {
      */
     stop(el) {
         el.classList.remove(kupDynamicPositionActiveClass);
+        this.removeRepositionListeners(el);
     }
     /**
      * This function calculates where to place the element in order to correctly display it attached to its anchor point.
@@ -126,11 +128,9 @@ export class KupDynamicPosition {
     run(el) {
         if (!el.isConnected) {
             dom.ketchup.dynamicPosition.managedElements.delete(el);
-            cancelAnimationFrame(el.kupDynamicPosition.rAF);
             return;
         }
         if (!el.classList.contains(kupDynamicPositionActiveClass)) {
-            cancelAnimationFrame(el.kupDynamicPosition.rAF);
             return;
         }
         // Reset placement
@@ -230,9 +230,71 @@ export class KupDynamicPosition {
                 el.style.left = `${left}px`;
             }
         }
-        // Testing behavior: always anchored - 2024-09-25
-        el.kupDynamicPosition.rAF = requestAnimationFrame(function () {
+    }
+    reposition(el) {
+        if (el.isConnected &&
+            el.classList.contains(kupDynamicPositionActiveClass)) {
             dom.ketchup.dynamicPosition.run(el);
-        });
+        }
+    }
+    isScrollable(el) {
+        const style = getComputedStyle(el);
+        const hasScrollableOverflow = ['auto', 'scroll'].includes(style.overflow) ||
+            ['auto', 'scroll'].includes(style.overflowX) ||
+            ['auto', 'scroll'].includes(style.overflowY);
+        const canScrollVertically = el.scrollHeight > el.clientHeight;
+        const canScrollHorizontally = el.scrollWidth > el.clientWidth;
+        return (hasScrollableOverflow &&
+            (canScrollVertically || canScrollHorizontally));
+    }
+    updateEventListenerOnAncestors(container, updateCallback) {
+        while (container && container !== document.documentElement) {
+            updateCallback(container);
+            if (container.parentElement) {
+                container = container.parentElement;
+            }
+            else if (container.getRootNode &&
+                container.getRootNode() instanceof ShadowRoot) {
+                container = container.getRootNode()
+                    .host;
+            }
+            else {
+                container = null;
+            }
+        }
+    }
+    addRepositionListeners(el) {
+        var _a;
+        const repositionListener = () => this.reposition(el);
+        window.addEventListener('resize', repositionListener);
+        window.addEventListener('scroll', repositionListener);
+        if ((_a = el === null || el === void 0 ? void 0 : el.kupDynamicPosition) === null || _a === void 0 ? void 0 : _a.anchor) {
+            let container = this.getAnchorContainer(el);
+            this.updateEventListenerOnAncestors(container, (el) => {
+                if (this.isScrollable(el)) {
+                    el.addEventListener('scroll', repositionListener);
+                }
+            });
+        }
+        el._repositionListener = repositionListener;
+    }
+    removeRepositionListeners(el) {
+        var _a;
+        const repositionListener = el._repositionListener;
+        window.removeEventListener('resize', repositionListener);
+        window.removeEventListener('scroll', repositionListener);
+        if ((_a = el === null || el === void 0 ? void 0 : el.kupDynamicPosition) === null || _a === void 0 ? void 0 : _a.anchor) {
+            let container = this.getAnchorContainer(el);
+            this.updateEventListenerOnAncestors(container, (el) => {
+                el.removeEventListener('scroll', repositionListener);
+            });
+        }
+        delete el._repositionListener;
+    }
+    getAnchorContainer(el) {
+        return el.kupDynamicPosition.anchor &&
+            this.anchorIsHTMLElement(el.kupDynamicPosition.anchor)
+            ? el.kupDynamicPosition.anchor.parentElement
+            : undefined;
     }
 }

package/dist/collection/managers/kup-manager/kup-manager.js

@@ -19,6 +19,7 @@ import { setAssetPath } from "@stencil/core";
 import html2canvas from "html2canvas";
 import { KupOpenAI } from "../kup-openai/kup-openai";
 import { KupKeysBinding } from "../kup-keys-binding/kup-keys-binding";
+import { KupPerfTuning } from "../kup-perf-tuning/kup-perf-tuning";
 const dom = document.documentElement;
 /**
  * This class controls every other Ketchup utility suite.
@@ -131,6 +132,7 @@ export class KupManager {
         this.toolbar = new KupToolbar();
         this.keysBinding = new KupKeysBinding();
         this.tooltip = new KupTooltip(tooltipDelay, tooltipFCellCallbacks, tooltipModal);
+        this.perfTuning = new KupPerfTuning({ maxCellsPerPage: 5000 });
         document.addEventListener('pointerdown', (e) => {
             const paths = e.composedPath();
             const lastString = paths[0].innerText || paths[0].value;
@@ -287,6 +289,28 @@ export class KupManager {
     removeClickCallback(cb) {
         this.utilities.clickCallbacks.delete(cb);
     }
+    /**
+     * Removes elements disconnected by active DOM,
+     * use only from browser console
+     */
+    removeDisconnectedElements() {
+        const containers = [
+            this.dynamicPosition.managedElements,
+            this.theme.managedComponents,
+            this.language.managedComponents,
+            this.interact.managedElements,
+            this.toolbar.managedElements,
+            this.tooltip.managedElements,
+            this.dates.managedComponents,
+        ];
+        containers.forEach((e) => {
+            for (const element of e) {
+                if (!element.isConnected) {
+                    e.delete(element);
+                }
+            }
+        });
+    }
 }
 /**
  * Called by the Ketchup components to retrieve the instance of KupManager (or creating a new one when missing).

package/dist/collection/managers/kup-perf-tuning/kup-perf-tuning-declarations.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/managers/kup-perf-tuning/kup-perf-tuning.js

@@ -0,0 +1,24 @@
+export class KupPerfTuning {
+    constructor(data) {
+        this.data = data;
+    }
+    getPerfIndex(duration) {
+        const endTime = performance.now() + duration;
+        let operations = 0;
+        while (performance.now() < endTime) {
+            Math.sqrt(Math.random());
+            const a = Math.floor(Math.random() * 1000);
+            const b = Math.floor(Math.random() * 1000);
+            const c = a * b + a - b;
+            operations++;
+        }
+        return Math.round(operations / 1e6);
+    }
+    performPerfTuning(duration = 1000) {
+        const perfIndex = this.getPerfIndex(duration);
+        // 11 was evaluated on my hardare
+        const perfFactor = perfIndex / 11;
+        this.data.maxCellsPerPage = 5000 * perfFactor;
+        console.log(`perfIndex ${perfIndex}, maxCellsPerPage ${this.data.maxCellsPerPage}`);
+    }
+}

package/dist/components/index.js

@@ -1,5 +1,5 @@
 export { g as getAssetPath, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-2e5f2e07.js';
-import { K as KupManager } from './p-0c4c10f2.js';
+import { K as KupManager } from './p-27005da8.js';
 
 /** used for obtain a KupManager instance without a dom document (for UT)  */
 function newKupManager(init) {

package/dist/components/kup-accordion.js

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, c as createEvent, f as forceUpdate, h, d as Host } from './p-2e5f2e07.js';
-import { k as kupManagerInstance, a as KupComponentSizing, g as getProps, s as setProps, b as KupThemeColorValues, c as KupThemeIconValues } from './p-0c4c10f2.js';
-import { M as MDCRipple, F as FImage, c as componentWrapperId, d as defineCustomElement$2, a as defineCustomElement$3, b as defineCustomElement$4, e as defineCustomElement$5, f as defineCustomElement$6, g as defineCustomElement$7, h as defineCustomElement$8, i as defineCustomElement$9, j as defineCustomElement$a, k as defineCustomElement$b, l as defineCustomElement$c, m as defineCustomElement$d, n as defineCustomElement$e, o as defineCustomElement$f, p as defineCustomElement$g, q as defineCustomElement$h, r as defineCustomElement$i, s as defineCustomElement$j, t as defineCustomElement$k, u as defineCustomElement$l, v as defineCustomElement$m, w as defineCustomElement$n, x as defineCustomElement$o, y as defineCustomElement$p, z as defineCustomElement$q, A as defineCustomElement$r, B as defineCustomElement$s, C as defineCustomElement$t } from './p-4d78f4b5.js';
+import { k as kupManagerInstance, a as KupComponentSizing, g as getProps, s as setProps, b as KupThemeColorValues, c as KupThemeIconValues } from './p-27005da8.js';
+import { M as MDCRipple, F as FImage, c as componentWrapperId, d as defineCustomElement$2, a as defineCustomElement$3, b as defineCustomElement$4, e as defineCustomElement$5, f as defineCustomElement$6, g as defineCustomElement$7, h as defineCustomElement$8, i as defineCustomElement$9, j as defineCustomElement$a, k as defineCustomElement$b, l as defineCustomElement$c, m as defineCustomElement$d, n as defineCustomElement$e, o as defineCustomElement$f, p as defineCustomElement$g, q as defineCustomElement$h, r as defineCustomElement$i, s as defineCustomElement$j, t as defineCustomElement$k, u as defineCustomElement$l, v as defineCustomElement$m, w as defineCustomElement$n, x as defineCustomElement$o, y as defineCustomElement$p, z as defineCustomElement$q, A as defineCustomElement$r, B as defineCustomElement$s, C as defineCustomElement$t } from './p-94a659ba.js';
 
 /**
  * Props of the kup-accordion component.

package/dist/components/kup-activity-timeline.js

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, c as createEvent, f as forceUpdate, h, F as Fragment, d as Host } from './p-2e5f2e07.js';
-import { k as kupManagerInstance, g as getProps, s as setProps, t as KupDebugCategory, m as getCellValueForDisplay } from './p-0c4c10f2.js';
-import { c as componentWrapperId, D as sortRows, d as defineCustomElement$2, a as defineCustomElement$3, b as defineCustomElement$4, e as defineCustomElement$5, f as defineCustomElement$6, g as defineCustomElement$7, h as defineCustomElement$8, i as defineCustomElement$9, j as defineCustomElement$a, k as defineCustomElement$b, l as defineCustomElement$c, m as defineCustomElement$d, n as defineCustomElement$e, o as defineCustomElement$f, p as defineCustomElement$g, q as defineCustomElement$h, r as defineCustomElement$i, s as defineCustomElement$j, t as defineCustomElement$k, u as defineCustomElement$l, v as defineCustomElement$m, w as defineCustomElement$n, x as defineCustomElement$o, y as defineCustomElement$p, z as defineCustomElement$q, A as defineCustomElement$r, B as defineCustomElement$s, C as defineCustomElement$t, F as FImage } from './p-4d78f4b5.js';
+import { k as kupManagerInstance, g as getProps, s as setProps, t as KupDebugCategory, m as getCellValueForDisplay } from './p-27005da8.js';
+import { c as componentWrapperId, D as sortRows, d as defineCustomElement$2, a as defineCustomElement$3, b as defineCustomElement$4, e as defineCustomElement$5, f as defineCustomElement$6, g as defineCustomElement$7, h as defineCustomElement$8, i as defineCustomElement$9, j as defineCustomElement$a, k as defineCustomElement$b, l as defineCustomElement$c, m as defineCustomElement$d, n as defineCustomElement$e, o as defineCustomElement$f, p as defineCustomElement$g, q as defineCustomElement$h, r as defineCustomElement$i, s as defineCustomElement$j, t as defineCustomElement$k, u as defineCustomElement$l, v as defineCustomElement$m, w as defineCustomElement$n, x as defineCustomElement$o, y as defineCustomElement$p, z as defineCustomElement$q, A as defineCustomElement$r, B as defineCustomElement$s, C as defineCustomElement$t, F as FImage } from './p-94a659ba.js';
 
 var KupActivityTimelineProps;
 (function (KupActivityTimelineProps) {

package/dist/components/kup-autocomplete.js

@@ -1,4 +1,4 @@
-import { K as KupAutocomplete$1, C as defineCustomElement$1 } from './p-4d78f4b5.js';
+import { K as KupAutocomplete$1, C as defineCustomElement$1 } from './p-94a659ba.js';
 
 const KupAutocomplete = KupAutocomplete$1;
 const defineCustomElement = defineCustomElement$1;