@sme.up/ketchup 9.5.2 → 9.6.1

package/dist/collection/collection-manifest.json

@@ -24,6 +24,7 @@
     "components/kup-dialog/kup-dialog.js",
     "components/kup-drawer/kup-drawer.js",
     "components/kup-echart/kup-echart.js",
+    "components/kup-editor/kup-editor.js",
     "components/kup-family-tree/kup-family-tree.js",
     "components/kup-form/kup-form.js",
     "components/kup-gauge/kup-gauge.js",
@@ -66,8 +67,8 @@
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.8.2",
-    "typescriptVersion": "5.2.2"
+    "version": "4.12.1",
+    "typescriptVersion": "5.3.3"
   },
   "collections": [],
   "bundles": []

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

@@ -179,7 +179,7 @@ export class KupAccordion {
     }
     render() {
         const content = this.data && this.data.columns ? this.renderItems() : null;
-        return (h(Host, null, h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId }, h("div", { class: "accordion" }, content))));
+        return (h(Host, { key: '12da47dc3f3462e4d3e78b5266ee5416c26a2a99' }, h("style", { key: 'af0aa37c789ba350584ffd5289e5e08a581a2bb7' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'e662e0fb3e38440eb105a18f0e6302d5b619a958', id: componentWrapperId }, h("div", { key: 'e5860263f1b09c6f9f64d3a15ccbde1d2d88a316', class: "accordion" }, content))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);
@@ -339,11 +339,9 @@ export class KupAccordion {
                 "complexType": {
                     "signature": "(descriptions?: boolean) => Promise<GenericObject>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "descriptions - When provided and true, the result will be the list of props with their description."
-                                }],
-                            "text": "- When provided and true, the result will be the list of props with their description."
+                            "name": "descriptions",
+                            "type": "boolean",
+                            "docs": "- When provided and true, the result will be the list of props with their description."
                         }],
                     "references": {
                         "Promise": {
@@ -390,11 +388,9 @@ export class KupAccordion {
                 "complexType": {
                     "signature": "(props: GenericObject) => Promise<void>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "props - Object containing props that will be set to the component."
-                                }],
-                            "text": "- Object containing props that will be set to the component."
+                            "name": "props",
+                            "type": "GenericObject",
+                            "docs": "- Object containing props that will be set to the component."
                         }],
                     "references": {
                         "Promise": {
@@ -421,11 +417,9 @@ export class KupAccordion {
                 "complexType": {
                     "signature": "(itemName: string) => Promise<void>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "itemName - Name of the item."
-                                }],
-                            "text": "- Name of the item."
+                            "name": "itemName",
+                            "type": "string",
+                            "docs": "- Name of the item."
                         }],
                     "references": {
                         "Promise": {

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

@@ -269,7 +269,7 @@ export class KupAutocomplete {
     render() {
         const fullHeight = this.rootElement.classList.contains('kup-full-height');
         const fullWidth = this.rootElement.classList.contains('kup-full-width');
-        return (h(Host, { class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet(this, _KupAutocomplete_elStyle, "f") }, h("style", null, __classPrivateFieldGet(this, _KupAutocomplete_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId, style: __classPrivateFieldGet(this, _KupAutocomplete_elStyle, "f") }, h(FTextField, Object.assign({ icon: this.showDropDownIcon
+        return (h(Host, { key: '88774505c1f13b133ce2be0bda250290f6de04a6', class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet(this, _KupAutocomplete_elStyle, "f") }, h("style", { key: '2f8ca0e34b61255f0820ca1c9ac36d872642e009' }, __classPrivateFieldGet(this, _KupAutocomplete_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '0cafe0954f744146d3fdd0c8452be08ea2f2193d', id: componentWrapperId, style: __classPrivateFieldGet(this, _KupAutocomplete_elStyle, "f") }, h(FTextField, Object.assign({ key: '6b84b32bd60fbc96c17f88257a439a5134243df1', icon: this.showDropDownIcon
                 ? KupThemeIconValues.DROPDOWN
                 : null, trailingIcon: true }, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, value: this.displayedValue, onBlur: () => this.onKupBlur(), onClick: () => this.onKupClick(), onChange: (e) => this.onKupChange(e.target.value), onFocus: () => this.onKupFocus(), onInput: () => {
                 window.clearTimeout(__classPrivateFieldGet(this, _KupAutocomplete_inputTimeout, "f"));
@@ -710,11 +710,9 @@ export class KupAutocomplete {
                 "complexType": {
                     "signature": "(descriptions?: boolean) => Promise<GenericObject>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "descriptions - When provided and true, the result will be the list of props with their description."
-                                }],
-                            "text": "- When provided and true, the result will be the list of props with their description."
+                            "name": "descriptions",
+                            "type": "boolean",
+                            "docs": "- When provided and true, the result will be the list of props with their description."
                         }],
                     "references": {
                         "Promise": {
@@ -798,11 +796,9 @@ export class KupAutocomplete {
                 "complexType": {
                     "signature": "(props: GenericObject) => Promise<void>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "props - Object containing props that will be set to the component."
-                                }],
-                            "text": "- Object containing props that will be set to the component."
+                            "name": "props",
+                            "type": "GenericObject",
+                            "docs": "- Object containing props that will be set to the component."
                         }],
                     "references": {
                         "Promise": {
@@ -829,11 +825,9 @@ export class KupAutocomplete {
                 "complexType": {
                     "signature": "(value: string) => Promise<void>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "value - Value of the component."
-                                }],
-                            "text": "- Value of the component."
+                            "name": "value",
+                            "type": "string",
+                            "docs": "- Value of the component."
                         }],
                     "references": {
                         "Promise": {

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

@@ -76,9 +76,9 @@ export class KupBadge {
             if (!this.imageData.color) {
                 this.imageData.color = `var(${KupThemeColorValues.TEXT_ON_PRIMARY})`;
             }
-            imageEl = h(FImage, Object.assign({}, this.imageData));
+            imageEl = h(FImage, Object.assign({ key: '13d604cf44b52b9a914eaa17dd40501400476847' }, this.imageData));
         }
-        return (h(Host, null, h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId, onClick: () => this.onKupClick() }, this.text, imageEl)));
+        return (h(Host, { key: 'a88511192e2f63f9e527485ada0786df92d6aa6f' }, h("style", { key: '127e5883c7a23cdb3302d8f6a2db82d1d8bedcce' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'f06c0031f262f1214426b8916bc6d81690894045', id: componentWrapperId, onClick: () => this.onKupClick() }, this.text, imageEl)));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);
@@ -199,11 +199,9 @@ export class KupBadge {
                 "complexType": {
                     "signature": "(descriptions?: boolean) => Promise<GenericObject>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "descriptions - When provided and true, the result will be the list of props with their description."
-                                }],
-                            "text": "- When provided and true, the result will be the list of props with their description."
+                            "name": "descriptions",
+                            "type": "boolean",
+                            "docs": "- When provided and true, the result will be the list of props with their description."
                         }],
                     "references": {
                         "Promise": {
@@ -250,11 +248,9 @@ export class KupBadge {
                 "complexType": {
                     "signature": "(props: GenericObject) => Promise<void>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "props - Object containing props that will be set to the component."
-                                }],
-                            "text": "- Object containing props that will be set to the component."
+                            "name": "props",
+                            "type": "GenericObject",
+                            "docs": "- Object containing props that will be set to the component."
                         }],
                     "references": {
                         "Promise": {

package/dist/collection/components/kup-box/kup-box-declarations.js

@@ -17,6 +17,9 @@ export var KupBoxProps;
     KupBoxProps["kanban"] = "Displays the boxlist as a Kanban.";
     KupBoxProps["layout"] = "How the field will be displayed. If not present, a default one will be created.";
     KupBoxProps["lazyLoadRows"] = "When set to true, extra rows will be automatically loaded once the last row enters the viewport.";
+    KupBoxProps["loadMoreLimit"] = "Sets a maximum limit of new records which can be required by the load more functionality.";
+    KupBoxProps["loadMoreMode"] = "Establish the modality of how many new records will be downloaded. This property is regulated also by loadMoreStep.";
+    KupBoxProps["loadMoreStep"] = "The number of records which will be requested to be downloaded when clicking on the load more button. This property is regulated also by loadMoreMode.";
     KupBoxProps["multiSelection"] = "Enable multi selection.";
     KupBoxProps["pageSelected"] = "Current page number.";
     KupBoxProps["pagination"] = "Enables pagination.";
@@ -24,6 +27,7 @@ export var KupBoxProps;
     KupBoxProps["scrollOnHover"] = "Activates the scroll on hover function.";
     KupBoxProps["selectBox"] = "Automatically selects the box at the specified index.";
     KupBoxProps["selectedRowsState"] = "Multiple selection.";
+    KupBoxProps["showLoadMore"] = "If set to true, displays the button to load more records.";
     KupBoxProps["showSelection"] = "If enabled, highlights the selected box/boxes.";
     KupBoxProps["sortBy"] = "If sorting is enabled, specifies which column to sort.";
     KupBoxProps["sortEnabled"] = "Enable sorting.";
@@ -31,3 +35,10 @@ export var KupBoxProps;
     KupBoxProps["store"] = "";
     KupBoxProps["swipeDisabled"] = "Disable swipe.";
 })(KupBoxProps || (KupBoxProps = {}));
+//---- *NEXT functionality AKA load more ----
+export var LoadMoreMode;
+(function (LoadMoreMode) {
+    LoadMoreMode["CONSTANT"] = "constant";
+    LoadMoreMode["CONSTANT_INCREMENT"] = "constant_increment";
+    LoadMoreMode["PROGRESSIVE_THRESHOLD"] = "progressive_threshold";
+})(LoadMoreMode || (LoadMoreMode = {}));

package/dist/collection/components/kup-box/kup-box-state.js

@@ -6,6 +6,8 @@ export class KupBoxState {
         this.pageSelected = 1;
         this.rowsPerPage = 0;
         this.load = false;
+        this.loadMoreLimit = 1000;
+        this.showLoadMore = false;
     }
     /*Add attribute*/
     toDebugString() {

package/dist/collection/components/kup-box/kup-box.css

@@ -55,7 +55,7 @@
 #box-container.is-kanban .box-wrapper .box {
   overflow: auto;
 }
-#box-container * {
+#box-container *:not(.progress-bar-percentage) {
   box-sizing: border-box;
 }
 #box-container .box-wrapper {

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

@@ -14,10 +14,10 @@ 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 _KupBox_instances, _KupBox_intObserver, _KupBox_rowsRefs, _KupBox_navBarHeight, _KupBox_didRenderObservers, _KupBox_setObserver;
+var _KupBox_instances, _KupBox_intObserver, _KupBox_rowsRefs, _KupBox_navBarHeight, _KupBox_loadMoreEventCounter, _KupBox_loadMoreEventPreviousQuantity, _KupBox_didRenderObservers, _KupBox_setObserver, _KupBox_onLoadMoreClick;
 import { forceUpdate, h, Host, } from "@stencil/core";
 import { SortMode, } from "../kup-data-table/kup-data-table-declarations";
-import { KupBoxProps, } from "./kup-box-declarations";
+import { KupBoxProps, LoadMoreMode, } from "./kup-box-declarations";
 import { getColumnByName } from "../../utils/cell-utils";
 import { filterRows, sortRows, paginateRows, } from "../kup-data-table/kup-data-table-helper";
 import { kupManagerInstance, } from "../../managers/kup-manager/kup-manager";
@@ -32,7 +32,6 @@ import { KupThemeIconValues } from "../../managers/kup-theme/kup-theme-declarati
 import { KupDragEffect, kupDraggableAttr, KupDropEventTypes, KupPointerEventTypes, } from "../../managers/kup-interact/kup-interact-declarations";
 import { FCell } from "../../f-components/f-cell/f-cell";
 import { FPaginator } from "../../f-components/f-paginator/f-paginator";
-import { FPaginatorMode } from "../../f-components/f-paginator/f-paginator-declarations";
 import { pageChange, rowsPerPageChange, } from "../../f-components/f-paginator/f-paginator-utils";
 import { FTextFieldMDC } from "../../f-components/f-text-field/f-text-field-mdc";
 export class KupBox {
@@ -58,6 +57,8 @@ export class KupBox {
         _KupBox_intObserver.set(this, undefined);
         _KupBox_rowsRefs.set(this, []);
         _KupBox_navBarHeight.set(this, 0);
+        _KupBox_loadMoreEventCounter.set(this, 0);
+        _KupBox_loadMoreEventPreviousQuantity.set(this, 0);
         this.collapsedSection = {};
         this.selectedRows = [];
         this.rowActionMenuOpened = undefined;
@@ -77,6 +78,9 @@ export class KupBox {
         this.kanban = null;
         this.layout = undefined;
         this.lazyLoadRows = false;
+        this.loadMoreLimit = 1000;
+        this.loadMoreMode = LoadMoreMode.PROGRESSIVE_THRESHOLD;
+        this.loadMoreStep = 60;
         this.multiSelection = false;
         this.pageSelected = 1;
         this.pagination = false;
@@ -84,6 +88,7 @@ export class KupBox {
         this.scrollOnHover = false;
         this.selectBox = undefined;
         this.selectedRowsState = undefined;
+        this.showLoadMore = false;
         this.showSelection = true;
         this.sortBy = undefined;
         this.sortEnabled = false;
@@ -105,6 +110,8 @@ export class KupBox {
                 this.selectedRowsState = this.state.selectedRowsState;
                 this.pageSelected = this.state.pageSelected;
                 this.rowsPerPage = this.state.rowsPerPage;
+                this.loadMoreLimit = state.loadMoreLimit;
+                this.showLoadMore = state.showLoadMore;
             }
         }
     }
@@ -135,6 +142,14 @@ export class KupBox {
                 this.state.selectedRowsState = selectedRowsState;
                 somethingChanged = true;
             }
+            if (!this.kupManager.objects.deepEqual(this.state.loadMoreLimit, this.loadMoreLimit)) {
+                this.state.loadMoreLimit = this.loadMoreLimit;
+                somethingChanged = true;
+            }
+            if (!this.kupManager.objects.deepEqual(this.state.showLoadMore, this.showLoadMore)) {
+                this.state.showLoadMore = this.showLoadMore;
+                somethingChanged = true;
+            }
             if (!this.state.load) {
                 this.state.load = true;
                 return;
@@ -1164,10 +1179,18 @@ export class KupBox {
                 } })));
         }
         let paginator = null;
-        if (!this.lazyLoadRows && this.pagination) {
-            paginator = (h(FPaginator, { id: top ? 'top-paginator' : 'bottom-paginator', currentPage: this.currentPage, max: this.filteredRows.length, mode: FPaginatorMode.SIMPLE, perPage: this.currentRowsPerPage
+        // paginaltorPos prop not managed yet
+        const top = true;
+        if (this.showLoadMore || (!this.lazyLoadRows && this.pagination)) {
+            paginator = (h(FPaginator, { id: top ? 'top-paginator' : 'bottom-paginator', currentPage: this.currentPage, max: this.filteredRows.length,
+                // mode={FPaginatorMode.SIMPLE}
+                perPage: this.currentRowsPerPage
                     ? this.currentRowsPerPage
-                    : this.rowsPerPage, onPageChange: (e) => this.handlePageChange(e.detail.value), onRowsChange: (e) => this.handleRowsPerPageChange(e.detail.value) }));
+                    : this.rowsPerPage, onLoadMore: this.showLoadMore
+                    ? () => {
+                        __classPrivateFieldGet(this, _KupBox_instances, "m", _KupBox_onLoadMoreClick).call(this);
+                    }
+                    : null, onNextPage: () => this.handlePageChange(this.currentPage + 1), onPrevPage: () => this.handlePageChange(this.currentPage - 1), onPageChange: (e) => this.handlePageChange(e.detail.value), onRowsChange: (e) => this.handleRowsPerPageChange(e.detail.value) }));
         }
         let boxContent = null;
         let containerStyle = {};
@@ -1531,6 +1554,78 @@ export class KupBox {
                 "reflect": false,
                 "defaultValue": "false"
             },
+            "loadMoreLimit": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Sets a maximum limit of new records which can be required by the load more functionality."
+                },
+                "attribute": "load-more-limit",
+                "reflect": false,
+                "defaultValue": "1000"
+            },
+            "loadMoreMode": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "LoadMoreMode",
+                    "resolved": "LoadMoreMode.CONSTANT | LoadMoreMode.CONSTANT_INCREMENT | LoadMoreMode.PROGRESSIVE_THRESHOLD",
+                    "references": {
+                        "LoadMoreMode": {
+                            "location": "import",
+                            "path": "./kup-box-declarations",
+                            "id": "src/components/kup-box/kup-box-declarations.ts::LoadMoreMode"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "see",
+                            "text": "loadMoreStep *"
+                        }, {
+                            "name": "see",
+                            "text": "loadMoreLimit"
+                        }],
+                    "text": "Establish the modality of how many new records will be downloaded.\r\n\r\nThis property is regulated also by loadMoreStep."
+                },
+                "attribute": "load-more-mode",
+                "reflect": false,
+                "defaultValue": "LoadMoreMode.PROGRESSIVE_THRESHOLD"
+            },
+            "loadMoreStep": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "see",
+                            "text": "loadMoreMode *"
+                        }, {
+                            "name": "see",
+                            "text": "loadMoreLimit"
+                        }],
+                    "text": "The number of records which will be requested to be downloaded when clicking on the load more button.\r\n\r\nThis property is regulated also by loadMoreMode."
+                },
+                "attribute": "load-more-step",
+                "reflect": false,
+                "defaultValue": "60"
+            },
             "multiSelection": {
                 "type": "boolean",
                 "mutable": false,
@@ -1675,6 +1770,24 @@ export class KupBox {
                 "attribute": "selected-rows-state",
                 "reflect": false
             },
+            "showLoadMore": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "If set to true, displays the button to load more records."
+                },
+                "attribute": "show-load-more",
+                "reflect": false,
+                "defaultValue": "false"
+            },
             "showSelection": {
                 "type": "boolean",
                 "mutable": false,
@@ -1977,6 +2090,27 @@ export class KupBox {
                         }
                     }
                 }
+            }, {
+                "method": "kupLoadMoreClick",
+                "name": "kup-box-loadmoreclick",
+                "bubbles": true,
+                "cancelable": false,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "KupBoxLoadMoreClickEventPayload",
+                    "resolved": "KupBoxLoadMoreClickEventPayload",
+                    "references": {
+                        "KupBoxLoadMoreClickEventPayload": {
+                            "location": "import",
+                            "path": "./kup-box-declarations",
+                            "id": "src/components/kup-box/kup-box-declarations.ts::KupBoxLoadMoreClickEventPayload"
+                        }
+                    }
+                }
             }];
     }
     static get methods() {
@@ -1985,11 +2119,9 @@ export class KupBox {
                 "complexType": {
                     "signature": "(descriptions?: boolean) => Promise<GenericObject>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "descriptions - When provided and true, the result will be the list of props with their description."
-                                }],
-                            "text": "- When provided and true, the result will be the list of props with their description."
+                            "name": "descriptions",
+                            "type": "boolean",
+                            "docs": "- When provided and true, the result will be the list of props with their description."
                         }],
                     "references": {
                         "Promise": {
@@ -2019,11 +2151,13 @@ export class KupBox {
                 "complexType": {
                     "signature": "(row: KupBoxRow, actions: KupDataRowAction[]) => Promise<void>",
                     "parameters": [{
-                            "tags": [],
-                            "text": ""
+                            "name": "row",
+                            "type": "KupBoxRow",
+                            "docs": ""
                         }, {
-                            "tags": [],
-                            "text": ""
+                            "name": "actions",
+                            "type": "KupDataRowAction[]",
+                            "docs": ""
                         }],
                     "references": {
                         "Promise": {
@@ -2069,11 +2203,9 @@ export class KupBox {
                 "complexType": {
                     "signature": "(props: GenericObject) => Promise<void>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "props - Object containing props that will be set to the component."
-                                }],
-                            "text": "- Object containing props that will be set to the component."
+                            "name": "props",
+                            "type": "GenericObject",
+                            "docs": "- Object containing props that will be set to the component."
                         }],
                     "references": {
                         "Promise": {
@@ -2133,7 +2265,7 @@ export class KupBox {
             }];
     }
 }
-_KupBox_intObserver = new WeakMap(), _KupBox_rowsRefs = new WeakMap(), _KupBox_navBarHeight = new WeakMap(), _KupBox_instances = new WeakSet(), _KupBox_didRenderObservers = function _KupBox_didRenderObservers() {
+_KupBox_intObserver = new WeakMap(), _KupBox_rowsRefs = new WeakMap(), _KupBox_navBarHeight = new WeakMap(), _KupBox_loadMoreEventCounter = new WeakMap(), _KupBox_loadMoreEventPreviousQuantity = new WeakMap(), _KupBox_instances = new WeakSet(), _KupBox_didRenderObservers = function _KupBox_didRenderObservers() {
     if (this.lazyLoadRows &&
         this.currentRowsPerPage < this.data.rows.length) {
         __classPrivateFieldGet(this, _KupBox_intObserver, "f").observe(__classPrivateFieldGet(this, _KupBox_rowsRefs, "f")[__classPrivateFieldGet(this, _KupBox_rowsRefs, "f").length - 1]);
@@ -2144,11 +2276,11 @@ _KupBox_intObserver = new WeakMap(), _KupBox_rowsRefs = new WeakMap(), _KupBox_n
             if (entry.isIntersecting) {
                 this.kupManager.debug.logMessage(this, 'Last row entering the viewport, loading more elements.');
                 const delta = this.data.rows.length - this.currentRowsPerPage;
-                if (delta < 10) {
+                if (delta < this.loadMoreStep) {
                     this.currentRowsPerPage += delta;
                 }
                 else {
-                    this.currentRowsPerPage += 10;
+                    this.currentRowsPerPage += this.loadMoreStep;
                 }
                 entry.target.classList.remove('last-row');
                 __classPrivateFieldGet(this, _KupBox_intObserver, "f").unobserve(entry.target);
@@ -2160,4 +2292,30 @@ _KupBox_intObserver = new WeakMap(), _KupBox_rowsRefs = new WeakMap(), _KupBox_n
         rootMargin: '-' + __classPrivateFieldGet(this, _KupBox_navBarHeight, "f") + 'px 0px 0px 0px',
     };
     __classPrivateFieldSet(this, _KupBox_intObserver, new IntersectionObserver(callback, options), "f");
+}, _KupBox_onLoadMoreClick = function _KupBox_onLoadMoreClick() {
+    var _a;
+    let loadItems = 0;
+    switch (this.loadMoreMode) {
+        case LoadMoreMode.CONSTANT:
+            loadItems = this.loadMoreStep;
+            break;
+        case LoadMoreMode.CONSTANT_INCREMENT:
+            loadItems =
+                this.loadMoreStep * (__classPrivateFieldGet(this, _KupBox_loadMoreEventCounter, "f") + 1);
+            break;
+        case LoadMoreMode.PROGRESSIVE_THRESHOLD:
+            loadItems =
+                Math.max(__classPrivateFieldGet(this, _KupBox_loadMoreEventPreviousQuantity, "f"), this.loadMoreStep) * Math.min(__classPrivateFieldGet(this, _KupBox_loadMoreEventCounter, "f") + 1, 2);
+            break;
+    }
+    if (loadItems > this.loadMoreLimit) {
+        loadItems = this.loadMoreLimit;
+    }
+    this.kupLoadMoreClick.emit({
+        comp: this,
+        id: this.rootElement.id,
+        loadItems: loadItems,
+    });
+    __classPrivateFieldSet(this, _KupBox_loadMoreEventPreviousQuantity, loadItems, "f");
+    __classPrivateFieldSet(this, _KupBox_loadMoreEventCounter, (_a = __classPrivateFieldGet(this, _KupBox_loadMoreEventCounter, "f"), _a++, _a), "f");
 };

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

@@ -505,11 +505,9 @@ export class KupButton {
                 "complexType": {
                     "signature": "(descriptions?: boolean) => Promise<GenericObject>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "descriptions - When provided and true, the result will be the list of props with their description."
-                                }],
-                            "text": "- When provided and true, the result will be the list of props with their description."
+                            "name": "descriptions",
+                            "type": "boolean",
+                            "docs": "- When provided and true, the result will be the list of props with their description."
                         }],
                     "references": {
                         "Promise": {
@@ -556,11 +554,9 @@ export class KupButton {
                 "complexType": {
                     "signature": "(props: GenericObject) => Promise<void>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "props - Object containing props that will be set to the component."
-                                }],
-                            "text": "- Object containing props that will be set to the component."
+                            "name": "props",
+                            "type": "GenericObject",
+                            "docs": "- Object containing props that will be set to the component."
                         }],
                     "references": {
                         "Promise": {

package/dist/collection/components/kup-button-list/kup-button-list.js

@@ -250,7 +250,7 @@ export class KupButtonList {
             'button-list--container': true,
             'show-selection': this.showSelection && this.selected ? true : false,
         };
-        return (h(Host, { style: hostStyle }, h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId }, h("div", { class: classObj }, buttons))));
+        return (h(Host, { key: 'a01db9921adbf39f2d78e4dab8f36628cfa6c36b', style: hostStyle }, h("style", { key: '48e3bd8c16086c166b34b4ff7131257d4258e627' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '849c6b0831fce22ca8cc3c462e5889146088f214', id: componentWrapperId }, h("div", { key: '61423fbc92aa0f2336b54b976719e48736c22e62', class: classObj }, buttons))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);
@@ -445,11 +445,9 @@ export class KupButtonList {
                 "complexType": {
                     "signature": "(descriptions?: boolean) => Promise<GenericObject>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "descriptions - When provided and true, the result will be the list of props with their description."
-                                }],
-                            "text": "- When provided and true, the result will be the list of props with their description."
+                            "name": "descriptions",
+                            "type": "boolean",
+                            "docs": "- When provided and true, the result will be the list of props with their description."
                         }],
                     "references": {
                         "Promise": {
@@ -496,11 +494,9 @@ export class KupButtonList {
                 "complexType": {
                     "signature": "(props: GenericObject) => Promise<void>",
                     "parameters": [{
-                            "tags": [{
-                                    "name": "param",
-                                    "text": "props - Object containing props that will be set to the component."
-                                }],
-                            "text": "- Object containing props that will be set to the component."
+                            "name": "props",
+                            "type": "GenericObject",
+                            "docs": "- Object containing props that will be set to the component."
                         }],
                     "references": {
                         "Promise": {