@sme.up/ketchup 11.0.0-SNAPSHOT-20241217083229 → 11.0.0-SNAPSHOT-20241217103126

package/dist/collection/components/kup-card-list/kup-card-list.css

@@ -138,7 +138,7 @@
   --kup_cardlist_cards_max_width: var(--kup-cardlist-cards-max-width, unset);
   --kup_cardlist_cards_min_width: var(--kup-cardlist-cards-min-width, unset);
   display: block;
-  height: 100%;
+  height: fit-content;
   width: 100%;
 }
 

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

@@ -164,14 +164,14 @@ export class KupCell {
             renderKup: true,
             row: this.generateRow(),
         };
-        return (h(Host, { key: '25a6e5dffce5a657780a1c880ae62d6749a00bb7' }, h("style", { key: '1ca17513f7015ef5449aeb422aed2548324c7c59' }, __classPrivateFieldGet(this, _KupCell_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'af2ee5a39743aafdf2c793341e4a4d8839c2ed16', id: componentWrapperId, style: this.showSubmit
+        return (h(Host, { key: 'f0580dbf835cd9f4404bf227d6d3a162e0e06e0e' }, h("style", { key: '8fa06c1ca021cf209264b6341a77fdc032fb2d71' }, __classPrivateFieldGet(this, _KupCell_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '3a9959e050f4bc02dbb7441f607d32150b46505d', id: componentWrapperId, style: this.showSubmit
                 ? {
                     display: 'flex',
                     'flex-direction': submitPositionAdapter(this.submitPosition),
                     'align-items': 'center',
                     gap: '0.5rem',
                 }
-                : {} }, h(FCell, Object.assign({ key: '5315cc9821f5464dcc68f2eb4940e4305caf136d' }, props)), this.showSubmit ? (h(FButton, { buttonType: "submit", label: __classPrivateFieldGet(this, _KupCell_kupManager, "f").language.translate(KupLanguageGeneric.CONFIRM), wrapperClass: "form__submit", onClick: (e) => {
+                : {} }, h(FCell, Object.assign({ key: '6d645b64b77ccddd746f6f3ab494ca315105914c' }, props)), this.showSubmit ? (h(FButton, { buttonType: "submit", label: __classPrivateFieldGet(this, _KupCell_kupManager, "f").language.translate(KupLanguageGeneric.CONFIRM), wrapperClass: "form__submit", onClick: (e) => {
                 this.submitClick(e);
             } })) : null)));
     }

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

@@ -134,7 +134,7 @@ export class KupCheckbox {
             onChange: () => this.onKupChange(),
             onFocus: () => this.onKupFocus(),
         };
-        return (h(Host, { key: '9bc426ce9f548a47e2391de0c92e4b7f28b46ac1' }, h("style", { key: '323da2e0beabb0e8f16784b153dea13c96974a7c' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '7ee3d6e81b47037e15538cba61cf0a4f308b570e', id: componentWrapperId }, h(FCheckbox, Object.assign({ key: '3e3cf55d3b952e8e60dda14c9626e5516bbf60a9' }, props)))));
+        return (h(Host, { key: '49e622bc2765eb035a4fc7fb3bb74a4d14139814' }, h("style", { key: '84449423404feca3fbd75a958ce27966ce9df264' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '344301e2e5177f969fe51753e10096af5cd266d3', id: componentWrapperId }, h(FCheckbox, Object.assign({ key: '698c12b5ee7e07487fd571610923e468ca962113' }, props)))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);

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

@@ -192,13 +192,13 @@ export class KupChip {
             props.onFocus.push((chip) => this.onKupFocus(chip));
             props.onIconClick.push((chip) => this.onKupIconClick(chip));
         }
-        return (h(Host, { key: '8a38b8b981aadd23f3fc62ec9dc1bec8692fbb54', "onKup-autocomplete-itemclick": (e) => {
+        return (h(Host, { key: '10170c38c86ffd70e152c2aa66de827fa61bbe5d', "onKup-autocomplete-itemclick": (e) => {
                 __classPrivateFieldGet(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
             }, "onKup-combobox-itemclick": (e) => {
                 __classPrivateFieldGet(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
             }, "onKup-textfield-change": (e) => {
                 __classPrivateFieldGet(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
-            } }, h("style", { key: 'a9c2bec738240a0e281a5b5901307c072794dd0c' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '9bdd7db8c5130175a4f4315203827ccfce8ae74c', id: componentWrapperId }, ((_a = this.data) === null || _a === void 0 ? void 0 : _a.length) > 0 ? h(FChip, Object.assign({}, props)) : null, h("slot", { key: 'b6669cc2db3989ce563a5b70f31a246756ebe816', name: "field" }))));
+            } }, h("style", { key: '4b6d0bf20da0a022d4e3b1bfb7f46077d0b9311e' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'fbcd955d025dc2a46af83e845ff5547437aa9517', id: componentWrapperId }, ((_a = this.data) === null || _a === void 0 ? void 0 : _a.length) > 0 ? h(FChip, Object.assign({}, props)) : null, h("slot", { key: '7dc37ecbf9bf870abd6b095abc36b46d41abc98b', name: "field" }))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);

package/dist/collection/components/kup-color-picker/kup-color-picker.js

@@ -228,7 +228,7 @@ export class KupColorPicker {
     render() {
         let widget = null;
         if (this.swatchOnly) {
-            widget = (h("button", { key: '9038771a91cd730f94d18c35954e83726b7da0cb', disabled: this.disabled, class: "color-picker", onClick: () => this.openPicker(), style: {
+            widget = (h("button", { key: 'db40db59729d3d48f13a412cf6bbefb3ed9b5763', disabled: this.disabled, class: "color-picker", onClick: () => this.openPicker(), style: {
                     backgroundColor: this.value,
                 }, type: "button" }));
         }
@@ -238,7 +238,7 @@ export class KupColorPicker {
         const style = {
             ['--kup_colorpicker_thumb_color']: this.value ? this.value : '',
         };
-        return (h(Host, { key: '8e5696f5c34dc0b68c5ce0479c2015be1c3fb194', style: style }, h("style", { key: '7fc0fd8fc5a9ba3d7974ca76cf98e2e0bb0ef977' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'f6a806242bfd2f16db903d03110c80c618ad18e8', id: componentWrapperId }, widget)));
+        return (h(Host, { key: '8e32caa5948b79dfedc3d84d649998b2b918ac44', style: style }, h("style", { key: 'c332452428ca96ae5919450957aa70509db27d65' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '27af58056ecf3581fbe024db4bed5c8892167c4b', id: componentWrapperId }, widget)));
     }
     disconnectedCallback() {
         if (this.card) {

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

@@ -30,9 +30,6 @@ import { KupDynamicPositionPlacement } from "../../managers/kup-dynamic-position
 export class KupCombobox {
     constructor() {
         _KupCombobox_instances.add(this);
-        /*-------------------------------------------------*/
-        /*       I n t e r n a l   V a r i a b l e s       */
-        /*-------------------------------------------------*/
         /**
          * Instance of the KupManager class.
          */
@@ -53,7 +50,7 @@ export class KupCombobox {
         this.icon = null;
         this.initialValue = '';
         this.isClearable = false;
-        this.isSelect = false;
+        this.isSelect = true;
         this.label = null;
         this.leadingLabel = false;
         this.readOnly = false;
@@ -82,20 +79,35 @@ export class KupCombobox {
         });
     }
     onKupClick() {
-        if (this.isSelect == true) {
+        if (this.isSelect) {
             if (__classPrivateFieldGet(this, _KupCombobox_textfieldWrapper, "f").classList.contains('toggled')) {
                 __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
             }
             else {
                 __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_openList).call(this);
             }
+            this.kupClick.emit({
+                comp: this,
+                id: this.rootElement.id,
+                value: this.value,
+                inputValue: __classPrivateFieldGet(this, _KupCombobox_textfieldEl, "f").value,
+            });
+            this.kupIconClick.emit({
+                comp: this,
+                id: this.rootElement.id,
+                value: this.value,
+                inputValue: __classPrivateFieldGet(this, _KupCombobox_textfieldEl, "f").value,
+                open: __classPrivateFieldGet(this, _KupCombobox_textfieldWrapper, "f").classList.contains('toggled'),
+            });
+        }
+        else {
+            this.kupClick.emit({
+                comp: this,
+                id: this.rootElement.id,
+                value: this.value,
+                inputValue: __classPrivateFieldGet(this, _KupCombobox_textfieldEl, "f").value,
+            });
         }
-        this.kupClick.emit({
-            comp: this,
-            id: this.rootElement.id,
-            value: this.value,
-            inputValue: __classPrivateFieldGet(this, _KupCombobox_textfieldEl, "f").value,
-        });
     }
     onKupFocus() {
         this.kupFocus.emit({
@@ -292,6 +304,7 @@ export class KupCombobox {
             label: this.label,
             leadingLabel: this.leadingLabel,
             readOnly: this.readOnly,
+            isSelect: this.isSelect,
             sizing: this.sizing,
             success: this.rootElement.classList.contains('kup-success')
                 ? true
@@ -304,7 +317,7 @@ export class KupCombobox {
         };
         const fullHeight = this.rootElement.classList.contains('kup-full-height');
         const fullWidth = this.rootElement.classList.contains('kup-full-width');
-        return (h(Host, { key: '160fd8e3ebb787de4b6973dbabb18002e9b4cfe7', class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h("style", { key: '3faf806a201e31cb561d877b558601cf747743c8' }, __classPrivateFieldGet(this, _KupCombobox_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '4d5691b3b1fb14113ac60e2cfa46c858969edb8e', id: componentWrapperId, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h(FTextField, Object.assign({ key: 'ceb8ccb463d97aa5bec8725881b94443bb668690' }, props, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, trailingIcon: true, icon: this.showDropDownIcon
+        return (h(Host, { key: 'e3e6427593007de03f17946e49e422a8c00b2f3b', class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h("style", { key: 'ec02f526acd19b1871becd562d0c08dc7632f5b6' }, __classPrivateFieldGet(this, _KupCombobox_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '71fa4c233462c65e683f4966d666b13970563522', id: componentWrapperId, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h(FTextField, Object.assign({ key: '8d7f6d777ad6947174423cad01ae8ad4f5cc2f71' }, props, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, trailingIcon: true, icon: this.showDropDownIcon
                 ? KupThemeIconValues.DROPDOWN
                 : null, value: this.displayedValue, onBlur: () => this.onKupBlur(), onClick: () => this.onKupClick(), onChange: (e) => this.onKupChange(e.target.value), onFocus: () => this.onKupFocus(), onInput: () => this.onKupInput(), onIconClick: () => this.onKupIconClick() }))), __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_prepList).call(this)));
     }
@@ -530,11 +543,11 @@ export class KupCombobox {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Lets the combobox behave as a select element."
+                    "text": "Lets the combobox behave as a select element, making the textfield readable only but interactable."
                 },
                 "attribute": "is-select",
                 "reflect": true,
-                "defaultValue": "false"
+                "defaultValue": "true"
             },
             "label": {
                 "type": "string",
@@ -1086,5 +1099,6 @@ _KupCombobox_kupManager = new WeakMap(), _KupCombobox_elStyle = new WeakMap(), _
     }
     return ret;
 }, _KupCombobox_prepList = function _KupCombobox_prepList() {
-    return (h("kup-list", Object.assign({}, this.data['kup-list'], { displayMode: this.displayMode, "is-menu": true, "onkup-list-click": (e) => this.onKupItemClick(e), ref: (el) => (__classPrivateFieldSet(this, _KupCombobox_listEl, el, "f")) })));
+    var _a, _b;
+    return (h("kup-list", Object.assign({}, this.data['kup-list'], { displayMode: this.displayMode, "is-menu": true, showFilter: ((_b = (_a = this.data['kup-list']) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.length) >= 10 ? true : false, "onkup-list-click": (e) => this.onKupItemClick(e), ref: (el) => (__classPrivateFieldSet(this, _KupCombobox_listEl, el, "f")) })));
 };

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

@@ -376,7 +376,7 @@ export class KupDashboard {
         this.didRenderInteractables();
     }
     render() {
-        return (h(Host, { key: '2a5f7d91b832041e5c68460409f8723bcae04c25' }, h("style", { key: '00165eccb43eb45e9519e50ae383b6f237b6d293' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '66a90a4032f46aec89e48e2e8c3c95d948dee416', id: componentWrapperId }, this.buildHeader(), this.buildForm(this.internalData, null))));
+        return (h(Host, { key: 'ad8cbbbae20467e5a3f3ed0e37ca7ad752d949c2' }, h("style", { key: '692d0ec8ffe264c463f0a4e6abd5561dfd7c277d' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '26faf0b00335df455b9f9445fae97133cc630b5a', id: componentWrapperId }, this.buildHeader(), this.buildForm(this.internalData, null))));
     }
     disconnectedCallback() {
         this.unregisterInteractables();

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

@@ -1336,7 +1336,7 @@ export class KupDataTable {
         }
         let rows = null;
         if (__classPrivateFieldGet(this, _KupDataTable_paginatedRowsLength, "f") === 0) {
-            rows = (h("tr", { key: '6d09e0c370b54d11bafabf2a532016e56ba6e27d', ref: (el) => __classPrivateFieldGet(this, _KupDataTable_rowsRefs, "f").push(el) }, h("td", { key: '7987d19b7d01dc634c4bba42852937f7ba607aab', colSpan: __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_calculateColspan).call(this) }, this.emptyDataLabel)));
+            rows = (h("tr", { key: 'ea63936410964464a2025a9dd0810b6dae1abe3a', ref: (el) => __classPrivateFieldGet(this, _KupDataTable_rowsRefs, "f").push(el) }, h("td", { key: '051967eb3fda38c20a42c503a0ea8c6eda8eb567', colSpan: __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_calculateColspan).call(this) }, this.emptyDataLabel)));
         }
         else {
             rows = [];
@@ -1401,7 +1401,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: 'e48abd07934925d6d857ec993dd762113d9b916e' }, props));
+                groupChips = h(FChip, Object.assign({ key: '5cd703fedee57ecf7b801b7dbacd0d4d32799a50' }, props));
             }
         }
         const tableClass = {
@@ -1433,7 +1433,7 @@ export class KupDataTable {
         if (this.headerIsPersistent &&
             this.tableHeight === undefined &&
             this.tableWidth === undefined) {
-            stickyEl = (h("sticky-header", { key: 'a826f0b07e62fc01da85e10a57f8c0367bce8ff9', class: "hover-scrolling-child", hidden: !this.showHeader, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_stickyTheadRef, el, "f")) }, h("thead-sticky", { key: 'd1abd05e8bb445e6057801a98a217ba0d856784c' }, h("tr-sticky", { key: '12362919acda0cc236ccd205463bc36515070dd8' }, stickyHeader))));
+            stickyEl = (h("sticky-header", { key: 'cf43ed233a20754080eed885affaab5e561d0cd1', class: "hover-scrolling-child", hidden: !this.showHeader, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_stickyTheadRef, el, "f")) }, h("thead-sticky", { key: '3bba2e64f5042563bb973a3e42cba769731c2c19' }, h("tr-sticky", { key: '6d6a99788fdd06a4c4266904ab6d8f18e7d249df' }, stickyHeader))));
         }
         let belowClass = 'below-wrapper';
         if (!!this.tableHeight || !!this.tableWidth) {
@@ -1459,11 +1459,11 @@ export class KupDataTable {
                 }
             }
         };
-        const compCreated = (h(Host, { key: 'a6dddf02abe9beeee2c96e891cc66cb372b39184', "onKup-cell-input": autoselectOnAction, "onKup-cell-update": autoselectOnAction }, h("style", { key: '1af1e2c0d3843d6bfcda7f5bd7cf6b319770a43e' }, __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").theme.setKupStyle(this.rootElement)), this.updatableData ? __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_renderUpdateButtons).call(this) : null, h("div", { key: 'eb7ee03de3fef0785fe3029250372e9a84d2b88d', id: componentWrapperId, class: wrapClass }, h("div", { key: '9905494aded337acf7a24cf1e2bcd9ad0b573da7', class: "group-wrapper" }, groupChips), h("div", { key: '8b2752ff6c6bd49e89f61215429040919ff89276', class: "actions-wrapper", style: actionWrapperWidth }, this.globalFilter ? (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 compCreated = (h(Host, { key: '5ef7e6d877cff1df2a300749447c0b861b72df47', "onKup-cell-input": autoselectOnAction, "onKup-cell-update": autoselectOnAction }, h("style", { key: 'fee11527d24ecb0429a6d67c9f7237b28db972ea' }, __classPrivateFieldGet(this, _KupDataTable_kupManager, "f").theme.setKupStyle(this.rootElement)), this.updatableData ? __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_renderUpdateButtons).call(this) : null, h("div", { key: 'f9a1fb42d750316ee56450fb887cdba181597d01', id: componentWrapperId, class: wrapClass }, h("div", { key: '96cda2363c61937075cd4f810aaac54011d90a96', class: "group-wrapper" }, groupChips), h("div", { key: '8a58783dc10fdb880b717b058b706c696d91a2e1', class: "actions-wrapper", style: actionWrapperWidth }, this.globalFilter ? (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: '9b05b8a8d56d49d9d4b6b763615bee5b86c62b8d', class: "above-wrapper paginator-top" }, paginatorTop), this.insertMode !== '' &&
+            } }))) : null, h("div", { key: '17a692d6a81950c6583bc21d77af9c0ea9cea0d2', class: "above-wrapper paginator-top" }, paginatorTop), this.insertMode !== '' &&
             this.selectedRows.length > 0 ? (h(FButton, { icon: "save", onClick: () => {
                 this.kupSave.emit({
                     comp: this,
@@ -1513,9 +1513,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: '3cf3b9dd5588849ceae45d650c4aa11673338517', 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: '00f4c313660bfd22b69529356542ab1b1e2f5bdd', 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: 'f7f1635a9f148cdbb0b9df7de7c251387cb2be71', style: elStyle, class: belowClass, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_tableAreaRef, el, "f")) }, this.showCustomization
+            : null), h("div", { key: '87e958098e8eb2d4e79470f653f4c92a24755b06', 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);
@@ -1524,7 +1524,7 @@ export class KupDataTable {
                     } }, h(FImage, { color: `var(${KupThemeColorValues.TITLE})`, resource: "settings", sizeX: "10px" })),
                 this.renderCustomizePanel(),
             ]
-            : null, h("table", { key: '789e0a4319c5010b8edbb2a7fc921d8c6f87cbba', class: tableClass, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_tableRef, el, "f")), onMouseLeave: (ev) => {
+            : null, h("table", { key: 'ceaf2d707a3962edad876f49c48af952ae63923b', 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");
@@ -1532,7 +1532,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: 'd1a38a517fffca82965d85f773b8545b69289e55', hidden: !this.showHeader, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_theadRef, el, "f")) }, h("tr", { key: '008d620586ace87338985b3951f5cd43f1d5d82e' }, header)), h("tbody", { key: '5af95702fa6fc2e57acec377594a540d8ff5d2c7' }, rows), this.showFooter || __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_hasTotals).call(this)
+            } }, h("thead", { key: 'ffae62aaf3c5c971ac96a41984111226e31e0676', hidden: !this.showHeader, ref: (el) => (__classPrivateFieldSet(this, _KupDataTable_theadRef, el, "f")) }, h("tr", { key: '0cd3e2f5b7f9d52d52381a1a1ff52ef35ce62701' }, header)), h("tbody", { key: '954d2d5fac5de969863107acaf491845fe014219' }, rows), this.showFooter || __classPrivateFieldGet(this, _KupDataTable_instances, "m", _KupDataTable_hasTotals).call(this)
             ? this.renderFooter()
             : null), stickyEl), paginatorBottom)));
         return compCreated;

package/dist/collection/components/kup-date-picker/kup-date-picker.js

@@ -388,7 +388,7 @@ export class KupDatePicker {
         this.kupManager.debug.logRender(this, true);
     }
     render() {
-        return (h(Host, { key: '13a47c3a9b404c14a77d88d649fad882b4339da0' }, h("style", { key: 'cf4b70d3470ac7a1e2184826fced51eb57590a83' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '5082110224b42c1ffd5b8c7161293d50797341d6', id: componentWrapperId }, this.prepTextfield(this.getDateForOutput()))));
+        return (h(Host, { key: '46a53a55ec511a4beb0105b6a1caf5af95addc05' }, h("style", { key: '6b93ff258cacb4dfa701edcafb123f18b8b3a7f1' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'd9685f29bf32e9222f62c708250e846b84c182a1', id: componentWrapperId }, this.prepTextfield(this.getDateForOutput()))));
     }
     disconnectedCallback() {
         this.kupManager.dates.unregister(this);

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

@@ -145,7 +145,7 @@ export class KupDialog {
         if (headerSlot) {
             __classPrivateFieldSet(this, _KupDialog_header, headerSlot, "f");
         }
-        return (h(Host, { key: 'f43905df343499898224da326539ddfbb269afa9', "fade-in": true, style: style }, h("style", { key: 'f26805300b8847f08e481254e1a144cd00770d0c' }, __classPrivateFieldGet(this, _KupDialog_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '487037f1f65b1d1f83b141feedca2e5caed650dc', id: componentWrapperId }, this.header ? (h("div", { class: "header", ref: (el) => (__classPrivateFieldSet(this, _KupDialog_header, el, "f")) }, this.header.title ? (h("div", { class: "header__title" }, this.header.title)) : null, ((_a = this.header.icons) === null || _a === void 0 ? void 0 : _a.close) ? (h(FImage, { onClick: () => this.close(), sizeX: "1.25em", sizeY: "100%", resource: "clear", wrapperClass: "header__close" })) : null)) : headerSlot ? (h("slot", { name: "header" })) : null, h("div", { key: 'f707d046770ca02e82fbeebec60203622336c113', class: "content" }, h("slot", { key: '9e253ef007261663063e56843b72056755ef65c6', name: "content" })))));
+        return (h(Host, { key: '677afdac900b1d07b1a2874869f3d8415a508f31', "fade-in": true, style: style }, h("style", { key: '22e733f191cd089e832746c87ad41e831e0af07f' }, __classPrivateFieldGet(this, _KupDialog_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'b2a99bc3c9dec0ae5774b62423882d4e98d9a22b', id: componentWrapperId }, this.header ? (h("div", { class: "header", ref: (el) => (__classPrivateFieldSet(this, _KupDialog_header, el, "f")) }, this.header.title ? (h("div", { class: "header__title" }, this.header.title)) : null, ((_a = this.header.icons) === null || _a === void 0 ? void 0 : _a.close) ? (h(FImage, { onClick: () => this.close(), sizeX: "1.25em", sizeY: "100%", resource: "clear", wrapperClass: "header__close" })) : null)) : headerSlot ? (h("slot", { name: "header" })) : null, h("div", { key: 'c069c53fe1a71fdf84984ea725cfeb5876485686', class: "content" }, h("slot", { key: '1682932aeb2e0352bcf6d6f3685ea1b7f0be30b7', name: "content" })))));
     }
     disconnectedCallback() {
         if (this.modal) {

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

@@ -108,7 +108,7 @@ export class KupDrawer {
         this.kupManager.debug.logRender(this, true);
     }
     render() {
-        return (h(Host, { key: '47b6e1195efa7ac6696505f19808aaeed8804c81', "kup-opened": this.opened }, h("style", { key: '2ae05ab9c05ad338fa42f7ea827139883dc370c9' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '9574a0c126fbedb4022932c0388d96874bca3a71', class: "backdrop", onClick: (e) => {
+        return (h(Host, { key: '8a9d2198973d5a7ec57918a2064e790682764845', "kup-opened": this.opened }, h("style", { key: 'e3abd215c9b0196074011bf4325bf8a7ab9092ed' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '71daac9c19301460a3fe3edad3f320c01f11bad5', class: "backdrop", onClick: (e) => {
                 e.preventDefault();
                 e.stopPropagation();
             }, onPointerDown: (e) => {
@@ -118,7 +118,7 @@ export class KupDrawer {
             }, onTouchStart: (e) => {
                 e.preventDefault();
                 e.stopPropagation();
-            } }), h("div", { key: 'bb38d8793e68860b78c53a82e067e5ee765db93b', id: componentWrapperId }, h("div", { key: 'fb7a2c5bc9cd9fcac56a6e7e73066995e31e78b3', class: drawerClass }, this.content()))));
+            } }), h("div", { key: '47e90864a92415cca083f56e2d25cd05efe56df9', id: componentWrapperId }, h("div", { key: '47bfb804ce58fa47dc1fa7a574df7a05bd92b116', class: drawerClass }, this.content()))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);

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

@@ -293,7 +293,7 @@ export class KupDropdownButton {
         return buttons;
     }
     render() {
-        return (h(Host, { key: '9f0b15f4510c169fe9beda4f7536d55bbad28b4f' }, h("style", { key: '85819d0d93e7572fc9f8a1d5dc4af120b245d940' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '8e3065921f29bcf4f2a2ebe124b89ae29f2cd4f8', id: componentWrapperId }, h("div", { key: 'b314369d46e48fd0d20dd0f0ac9e7390a4c7a9b8', class: "dropdown-button--wrapper" }, this.renderButtons()), h("kup-list", Object.assign({ key: 'c07fd0d7a4f3d094e59d48623de84d3df82896b4' }, this.data['kup-list'], { displayMode: this.displayMode, isMenu: true, "onKup-list-click": (e) => this.onKupItemClick(e), id: this.rootElement.id + '_list', ref: (el) => (this.listEl = el) })))));
+        return (h(Host, { key: 'ccae4dfa0806f3fdbf1bed5fbd19fadd7de8429d' }, h("style", { key: '0173c39b549a40914975036cfdf000b1fb00aabd' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '11845d0c420acc71324ec35a666efa13640be822', id: componentWrapperId }, h("div", { key: '4f589eb69851af86e9e4c42c531445626741c008', class: "dropdown-button--wrapper" }, this.renderButtons()), h("kup-list", Object.assign({ key: '058216a70f437d213f51c0f07ac62bb30544e9fb' }, this.data['kup-list'], { displayMode: this.displayMode, isMenu: true, "onKup-list-click": (e) => this.onKupItemClick(e), id: this.rootElement.id + '_list', ref: (el) => (this.listEl = el) })))));
     }
     disconnectedCallback() {
         if (this.listEl) {

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

@@ -139,7 +139,7 @@ export class KupEchart {
             '--kup_echart_height': this.sizeY ? this.sizeY : '100%',
             '--kup_echart_width': this.sizeX ? this.sizeX : '100%',
         };
-        return (h(Host, { key: '6a1b9da9ca8a55642d2c5a7b4cbe6e344c0657af', style: style }, h("style", { key: 'c72c65a0c8a4099c8b08a9c1cbd3ed06e17df686' }, __classPrivateFieldGet(this, _KupEchart_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'eb0e06939e0ea612ca39d35a480ee74a5e04c5c5', id: componentWrapperId, ref: (chartContainer) => (__classPrivateFieldSet(this, _KupEchart_chartContainer, chartContainer, "f")) })));
+        return (h(Host, { key: 'f40d78d9bd1b54cb01ed05e18edef28c29d33473', style: style }, h("style", { key: 'd341281f3b58021c7de43822b5bb3d9b0fc6c4fd' }, __classPrivateFieldGet(this, _KupEchart_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'd71b62b4761cdb56e05ba1d736a375e12c52f964', id: componentWrapperId, ref: (chartContainer) => (__classPrivateFieldSet(this, _KupEchart_chartContainer, chartContainer, "f")) })));
     }
     disconnectedCallback() {
         __classPrivateFieldGet(this, _KupEchart_kupManager, "f").theme.unregister(this);

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

@@ -389,7 +389,7 @@ export class KupEditor {
         __classPrivateFieldGet(this, _KupEditor_kupManager, "f").debug.logRender(this, true);
     }
     render() {
-        return (h(Host, { key: 'e732ebc91b5f48c0bc515cfffa8cc2d1d6d7485f' }, h("div", { key: '560b1ac7dcdab0bf90db09bb92e847a9e5d14f7e', id: componentWrapperId }, h("div", { key: this.rootElement.id, ref: (el) => (this.editorRef = el), class: "kup-editor" }))));
+        return (h(Host, { key: 'ffbd575e5192cccaf2c070c4586215cc7573f9ce' }, h("div", { key: '21e2b1a060db3009c6595eb92f78361adff24d6c', id: componentWrapperId }, h("div", { key: this.rootElement.id, ref: (el) => (this.editorRef = el), class: "kup-editor" }))));
     }
     disconnectedCallback() {
         __classPrivateFieldGet(this, _KupEditor_kupManager, "f").theme.unregister(this);

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

@@ -149,12 +149,12 @@ export class KupFamilyTree {
         __classPrivateFieldGet(this, _KupFamilyTree_kupManager, "f").debug.logRender(this, true);
     }
     render() {
-        return (h(Host, { key: '602bb95f29dfe9e017313b01a3fc485c23dd2f97', onDrag: (e) => e.preventDefault(), onPointerDown: (e) => {
+        return (h(Host, { key: '6788b54f8c964ddeda1e5c4a7922613eb2efd59f', onDrag: (e) => e.preventDefault(), onPointerDown: (e) => {
                 e.preventDefault();
                 __classPrivateFieldGet(this, _KupFamilyTree_instances, "m", _KupFamilyTree_startPanning).call(this, e);
             }, onWheel: (e) => {
                 __classPrivateFieldGet(this, _KupFamilyTree_instances, "m", _KupFamilyTree_zoomTree).call(this, e);
-            } }, h("style", { key: 'becb707b0e477aff23e752bbb7ce335c01b428bd' }, __classPrivateFieldGet(this, _KupFamilyTree_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'aa50336a80b5499f3241b277639bb234c9e3eee5', id: componentWrapperId }, __classPrivateFieldGet(this, _KupFamilyTree_instances, "m", _KupFamilyTree_createTree).call(this))));
+            } }, h("style", { key: '40f38048045b0c3726164c999dc9fa15ea778291' }, __classPrivateFieldGet(this, _KupFamilyTree_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '9d4209faa777da38726d8113582cbba14ace1df7', id: componentWrapperId }, __classPrivateFieldGet(this, _KupFamilyTree_instances, "m", _KupFamilyTree_createTree).call(this))));
     }
     disconnectedCallback() {
         __classPrivateFieldGet(this, _KupFamilyTree_kupManager, "f").language.unregister(this);

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

@@ -408,7 +408,7 @@ export class KupForm {
     render() {
         let formContent = null;
         if (this.data.rows.length === 0) {
-            formContent = (h("p", { key: '3745e06e9f57294d4957cf2ce2700235f1efbc20' }, this.kupManager.language.translate(KupLanguageGeneric.EMPTY_DATA)));
+            formContent = (h("p", { key: '3c206215642b1662964c975671c3a2f7720eb470' }, this.kupManager.language.translate(KupLanguageGeneric.EMPTY_DATA)));
         }
         else {
             const rows = this.data.rows;
@@ -419,7 +419,7 @@ export class KupForm {
                 formContent.push(this.renderRow(rows[cnt++]));
             }
         }
-        return (h(Host, { key: '8bb39e913c0bb04bdb20e5680f86c4d92971aae9' }, h("style", { key: '998fbdf757d808b818bc45e30281038ad96690d9' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '6098ba93cc85091acc8671dfb75c318cf1e5a779', id: componentWrapperId }, formContent)));
+        return (h(Host, { key: 'bc740600eab0fde6bce214eb57ce0a883a70bc50' }, h("style", { key: '73cf8c044cbe93249f7943e42b657b5d70247531' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '2fe3feca10d6237f4135453b91334527ba2ca311', id: componentWrapperId }, formContent)));
     }
     disconnectedCallback() {
         this.kupManager.language.unregister(this);

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

@@ -67,7 +67,7 @@ export class KupHTM {
     }
     render() {
         const isLink = __classPrivateFieldGet(this, _KupHTM_kupManager, "f").objects.isLink(this.data.obj);
-        return (h(Host, { key: 'e973cfb80ddc6aba894dd2994b3be82fc93a07bc' }, h("style", { key: 'cd5f18859b77dfbaa1008cfe37183e18780b8e38' }, __classPrivateFieldGet(this, _KupHTM_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '69a912436a0c644bbe0ca38efe2aff60c31b15e4', id: componentWrapperId }, h("div", { key: '5e057d8c92cbfd479a57c10c205e96be51475007', class: `kup-htm ${isLink ? 'is-link' : ''}` }, isLink ? (h(Fragment, null, h("a", { href: this.data.value, target: "_blank", rel: "noopener noreferrer" }, __classPrivateFieldGet(this, _KupHTM_kupManager, "f").language.translate(KupLanguageGeneric.OPEN_IN_NEW_TAB)), h("iframe", { src: this.data.value, frameBorder: "0" }))) : (h("div", { innerHTML: this.data.value }))))));
+        return (h(Host, { key: '4900e8b6dd9c84c1f3a173b43951a0066bc8ec92' }, h("style", { key: 'fae888455749d9310efb85b2543a1f2dd9c458e5' }, __classPrivateFieldGet(this, _KupHTM_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'b134d6fc361dcb972d831b5658ae5529a949efa5', id: componentWrapperId }, h("div", { key: 'd8490ada53de8bf4cd93c7d4fb1e0db18cc3a42d', class: `kup-htm ${isLink ? 'is-link' : ''}` }, isLink ? (h(Fragment, null, h("a", { href: this.data.value, target: "_blank", rel: "noopener noreferrer" }, __classPrivateFieldGet(this, _KupHTM_kupManager, "f").language.translate(KupLanguageGeneric.OPEN_IN_NEW_TAB)), h("iframe", { src: this.data.value, frameBorder: "0" }))) : (h("div", { innerHTML: this.data.value }))))));
     }
     disconnectedCallback() {
         __classPrivateFieldGet(this, _KupHTM_kupManager, "f").theme.unregister(this);

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

@@ -204,14 +204,14 @@ export class KupImageList {
         }
         const imlClass = 'image-list' +
             (this.showFullDescription ? ' full-description' : '');
-        return (h(Host, { key: 'aaefac38b6fc8edb0a3378edce114b31dcd4c982' }, h("style", { key: '80541c8e96c4949ae9d3635342458ed4636aa4f3' }, __classPrivateFieldGet(this, _KupImageList_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'e21da53853b397147fae86eb46c4ec73ab1918c8', id: componentWrapperId, ref: (el) => {
+        return (h(Host, { key: '6b1b27c8e736754f479770ec67603d5708a78191' }, h("style", { key: '998b454b9acbe6078e18b5303667a373ef17a352' }, __classPrivateFieldGet(this, _KupImageList_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '9dfe6fefea846bbe367f5c76fd2d336840190ae9', id: componentWrapperId, ref: (el) => {
                 __classPrivateFieldSet(this, _KupImageList_el, el, "f");
-            } }, h("div", { key: '2ea71db6523c5ed84e6e04bc36844199208ae69f', class: "navigation-bar" }, hasNavigation ? (h("div", { class: `navigation-bar__wrapper ${this.navigationBarToggled
+            } }, h("div", { key: '8e6ba7408c4358862f1cccc8b564c5f225410074', class: "navigation-bar" }, hasNavigation ? (h("div", { class: `navigation-bar__wrapper ${this.navigationBarToggled
                 ? 'navigation-bar__wrapper--active'
                 : ''}` }, h("div", { class: `navigation-bar__title`, onClick: () => {
                 this.navigationBarToggled =
                     !this.navigationBarToggled;
-            } }, h(FImage, { fit: true, resource: this.currentNode.icon, placeholderResource: this.currentNode.placeholderIcon, sizeX: "1.25em", sizeY: "1.25em", wrapperClass: "navigation-bar__title__image" }), h("div", { class: "navigation-bar__title__label" }, this.currentNode.value)), h(FButton, Object.assign({}, __classPrivateFieldGet(this, _KupImageList_backProps, "f"), { label: __classPrivateFieldGet(this, _KupImageList_kupManager, "f").language.translate(KupLanguageGeneric.BACK) })), h(FButton, Object.assign({}, __classPrivateFieldGet(this, _KupImageList_topProps, "f"), { label: __classPrivateFieldGet(this, _KupImageList_kupManager, "f").language.translate(KupLanguageGeneric.TOP) })))) : null), h("div", { key: 'cca51c44ab0f8eb8a3010d070ef2c39ce4eea04b', class: imlClass, style: combinedGridStyle }, ...__classPrivateFieldGet(this, _KupImageList_instances, "m", _KupImageList_createList).call(this)))));
+            } }, h(FImage, { fit: true, resource: this.currentNode.icon, placeholderResource: this.currentNode.placeholderIcon, sizeX: "1.25em", sizeY: "1.25em", wrapperClass: "navigation-bar__title__image" }), h("div", { class: "navigation-bar__title__label" }, this.currentNode.value)), h(FButton, Object.assign({}, __classPrivateFieldGet(this, _KupImageList_backProps, "f"), { label: __classPrivateFieldGet(this, _KupImageList_kupManager, "f").language.translate(KupLanguageGeneric.BACK) })), h(FButton, Object.assign({}, __classPrivateFieldGet(this, _KupImageList_topProps, "f"), { label: __classPrivateFieldGet(this, _KupImageList_kupManager, "f").language.translate(KupLanguageGeneric.TOP) })))) : null), h("div", { key: '4c007ebfba4fe8b1b8aaffbae9261c27db9b00df', class: imlClass, style: combinedGridStyle }, ...__classPrivateFieldGet(this, _KupImageList_instances, "m", _KupImageList_createList).call(this)))));
     }
     disconnectedCallback() {
         __classPrivateFieldGet(this, _KupImageList_kupManager, "f").interact.unregister(__classPrivateFieldGet(this, _KupImageList_interactableTouch, "f"));

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

@@ -199,7 +199,7 @@ export class KupInputPanel {
                 h("p", null, __classPrivateFieldGet(this, _KupInputPanel_kupManager, "f").language.translate(KupLanguageGeneric.EMPTY_DATA)),
             ]
             : this.inputPanelCells.map((inputPanelCell) => __classPrivateFieldGet(this, _KupInputPanel_instances, "m", _KupInputPanel_renderRow).call(this, inputPanelCell));
-        return (h(Host, { key: '6e21e639b2d2f9e1f5338319cc965c4d588c5fbe' }, h("style", { key: '435b0e0cbebad1f25b642ffc327168afe3855250' }, __classPrivateFieldGet(this, _KupInputPanel_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '4cf09729bf357a5f91363c23e24dad8f414973cd', id: componentWrapperId }, inputPanelContent)));
+        return (h(Host, { key: 'fd7cb43c2e106e5ee0792ebf06cb7d97feb08a5a' }, h("style", { key: 'e9c94d1db637c291c024ca4c20391e72d977aff2' }, __classPrivateFieldGet(this, _KupInputPanel_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '3a43c79c02826a018af22e00d869b48fdf60ebe4', id: componentWrapperId }, inputPanelContent)));
     }
     disconnectedCallback() {
         __classPrivateFieldGet(this, _KupInputPanel_kupManager, "f").language.unregister(this);

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

@@ -108,39 +108,39 @@ export class KupLazy {
         switch (this.componentName) {
             case 'kup-button':
                 //call_to_action.svg
-                resource = (h("svg", { key: '220fa65d9836c520dfed8e3dae2700c6b2b0cb9a', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '1d1e33f3ed89c32e6ee9ad2b1996fb65037cc3f2', d: "M42 6H6c-2.2 0-4 1.8-4 4v28c0 2.2 1.8 4 4 4h36c2.2 0 4-1.8 4-4V10c0-2.2-1.8-4-4-4zm0 32H6v-6h36v6z" })));
+                resource = (h("svg", { key: '665704637b3354494ef01a225fd4d37a0188c34f', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '6a0391862537ed0250af6780a7c0fef06130b831', d: "M42 6H6c-2.2 0-4 1.8-4 4v28c0 2.2 1.8 4 4 4h36c2.2 0 4-1.8 4-4V10c0-2.2-1.8-4-4-4zm0 32H6v-6h36v6z" })));
                 break;
             case 'kup-card':
                 //art_track.svg
-                resource = (h("svg", { key: 'd799cc013987de74e23c34201ecd2186c57b13f1', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: 'de98ef94a3f714e45e56a02877d4a139a8804424', d: "M44 26H28v-4h16v4zm0-12H28v4h16v-4zM28 34h16v-4H28v4zm-4-16v12c0 2.2-1.8 4-4 4H8c-2.2 0-4-1.8-4-4V18c0-2.2 1.8-4 4-4h12c2.2 0 4 1.8 4 4zm-3 12l-4.5-6-3.5 4.51-2.5-3.01L7 30h14z" })));
+                resource = (h("svg", { key: 'a91f941eaf227d71122f52ef990999697e5140d2', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '9b757b8dae5fbb1d30ba262087274d6ed177b713', d: "M44 26H28v-4h16v4zm0-12H28v4h16v-4zM28 34h16v-4H28v4zm-4-16v12c0 2.2-1.8 4-4 4H8c-2.2 0-4-1.8-4-4V18c0-2.2 1.8-4 4-4h12c2.2 0 4 1.8 4 4zm-3 12l-4.5-6-3.5 4.51-2.5-3.01L7 30h14z" })));
                 break;
             case 'kup-checkbox':
                 //check_box_outline_blank.svg
-                resource = (h("svg", { key: '26ad78503d5c00f5b902b2bddb782a14f1a13b73', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '03ae544d551c47e0dce8f8fbaa92b1a2a1024c55', d: "M38 10v28H10V10h28m0-4H10c-2.21 0-4 1.79-4 4v28c0 2.21 1.79 4 4 4h28c2.21 0 4-1.79 4-4V10c0-2.21-1.79-4-4-4z" })));
+                resource = (h("svg", { key: 'dd4f4172b01ef1784c3a4947940e11f6cacbe746', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '4a65af5a391cfaf3d1e82c229db9a361b493cf49', d: "M38 10v28H10V10h28m0-4H10c-2.21 0-4 1.79-4 4v28c0 2.21 1.79 4 4 4h28c2.21 0 4-1.79 4-4V10c0-2.21-1.79-4-4-4z" })));
                 break;
             case 'kup-chart':
                 //chart-bar.svg
-                resource = (h("svg", { key: 'cc70b61653552ff28e1b6eda65ca7bec5bbbe7d2', xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "100%", height: "100%", viewBox: "0 0 24 24" }, h("path", { key: 'f63b011d43b7c6649e1392de9426b325259e9f38', d: "M22,21H2V3H4V19H6V10H10V19H12V6H16V19H18V14H22V21Z" })));
+                resource = (h("svg", { key: '593f6aa43a513b12ea0b49f7feb6680e2931c36c', xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "100%", height: "100%", viewBox: "0 0 24 24" }, h("path", { key: '0a24ba272bc6830f9bf356585d4a16d769b37b52', d: "M22,21H2V3H4V19H6V10H10V19H12V6H16V19H18V14H22V21Z" })));
                 break;
             case 'kup-data-table':
                 //table-large.svg
-                resource = (h("svg", { key: '3c6218a9e78c22aa2cfdd787a77fd7575409b926', xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "100%", height: "100%", viewBox: "0 0 24 24" }, h("path", { key: '28aaf9eb0e27fd2ad901866bd1f93ff181eba283', d: "M4,3H20A2,2 0 0,1 22,5V20A2,2 0 0,1 20,22H4A2,2 0 0,1 2,20V5A2,2 0 0,1 4,3M4,7V10H8V7H4M10,7V10H14V7H10M20,10V7H16V10H20M4,12V15H8V12H4M4,20H8V17H4V20M10,12V15H14V12H10M10,20H14V17H10V20M20,20V17H16V20H20M20,12H16V15H20V12Z" })));
+                resource = (h("svg", { key: 'fccd6198bf2c7d9b67fd9df526483f8f9dafee21', xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "100%", height: "100%", viewBox: "0 0 24 24" }, h("path", { key: '976cebc69cdc6153f4f91e935e48c18d5d345544', d: "M4,3H20A2,2 0 0,1 22,5V20A2,2 0 0,1 20,22H4A2,2 0 0,1 2,20V5A2,2 0 0,1 4,3M4,7V10H8V7H4M10,7V10H14V7H10M20,10V7H16V10H20M4,12V15H8V12H4M4,20H8V17H4V20M10,12V15H14V12H10M10,20H14V17H10V20M20,20V17H16V20H20M20,12H16V15H20V12Z" })));
                 break;
             case 'kup-image':
                 //photo.svg
-                resource = (h("svg", { key: '695002a63b98d0c090f350df167e2dec9b85c8f6', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '160f2450a206b3da182ef9514e41d0e9cfebd7dd', d: "M42 38V10c0-2.21-1.79-4-4-4H10c-2.21 0-4 1.79-4 4v28c0 2.21 1.79 4 4 4h28c2.21 0 4-1.79 4-4zM17 27l5 6.01L29 24l9 12H10l7-9z" })));
+                resource = (h("svg", { key: '17b1e569dabdfb945ea6880e770ae52566c14964', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '8208a3be977f5294e724adc8e0c168f3e0447940', d: "M42 38V10c0-2.21-1.79-4-4-4H10c-2.21 0-4 1.79-4 4v28c0 2.21 1.79 4 4 4h28c2.21 0 4-1.79 4-4zM17 27l5 6.01L29 24l9 12H10l7-9z" })));
                 break;
             case 'kup-progress-bar':
                 //linear_scale.svg
-                resource = (h("svg", { key: 'e7f09d307522f61e8448975f881fb435f0c585bd', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '2ad28af4bed1da877edb16db6acdc392bfbfb47b', d: "M39 19c-2.05 0-3.81 1.23-4.58 3h-5.84c-.77-1.77-2.53-3-4.58-3s-3.81 1.23-4.58 3h-5.84c-.77-1.77-2.53-3-4.58-3-2.77 0-5 2.23-5 5s2.23 5 5 5c2.05 0 3.81-1.23 4.58-3h5.84c.77 1.77 2.53 3 4.58 3s3.81-1.23 4.58-3h5.84c.77 1.77 2.53 3 4.58 3 2.77 0 5-2.23 5-5s-2.23-5-5-5z" })));
+                resource = (h("svg", { key: 'd75588e7fdd9dd67ca01598159316c0a480ff7b2', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: 'b6cb40a0509a7da7a0d764cb11b8170a4b083932', d: "M39 19c-2.05 0-3.81 1.23-4.58 3h-5.84c-.77-1.77-2.53-3-4.58-3s-3.81 1.23-4.58 3h-5.84c-.77-1.77-2.53-3-4.58-3-2.77 0-5 2.23-5 5s2.23 5 5 5c2.05 0 3.81-1.23 4.58-3h5.84c.77 1.77 2.53 3 4.58 3s3.81-1.23 4.58-3h5.84c.77 1.77 2.53 3 4.58 3 2.77 0 5-2.23 5-5s-2.23-5-5-5z" })));
                 break;
             case 'kup-radio':
                 //radio_button_unchecked.svg
-                resource = (h("svg", { key: 'c60a5e10b12c2945bdc8d0558d1fb9c46cb4ca90', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: 'f016960b177263ba06c3b63c4761fef4a06a4fd3', d: "M24 4C12.95 4 4 12.95 4 24s8.95 20 20 20 20-8.95 20-20S35.05 4 24 4zm0 36c-8.84 0-16-7.16-16-16S15.16 8 24 8s16 7.16 16 16-7.16 16-16 16z" })));
+                resource = (h("svg", { key: '1b18bc766908f4da555824535f7dbdc93779bb60', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '0feac444636e26df8fded6a7e566252087e60e86', d: "M24 4C12.95 4 4 12.95 4 24s8.95 20 20 20 20-8.95 20-20S35.05 4 24 4zm0 36c-8.84 0-16-7.16-16-16S15.16 8 24 8s16 7.16 16 16-7.16 16-16 16z" })));
                 break;
             default:
                 //art_track.svg
-                resource = (h("svg", { key: 'f221046bcd689deebeb597f557d547292518a34a', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '8cd9ec1705efd526543348dcfe793c0705399482', d: "M44 26H28v-4h16v4zm0-12H28v4h16v-4zM28 34h16v-4H28v4zm-4-16v12c0 2.2-1.8 4-4 4H8c-2.2 0-4-1.8-4-4V18c0-2.2 1.8-4 4-4h12c2.2 0 4 1.8 4 4zm-3 12l-4.5-6-3.5 4.51-2.5-3.01L7 30h14z" })));
+                resource = (h("svg", { key: '455a2d22a5d9d50f071e8facd31b50b7bd3f5d92', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: 'fefd08ea2bbd6eaa7e4ee0fefe2b25afa81165cf', d: "M44 26H28v-4h16v4zm0-12H28v4h16v-4zM28 34h16v-4H28v4zm-4-16v12c0 2.2-1.8 4-4 4H8c-2.2 0-4-1.8-4-4V18c0-2.2 1.8-4 4-4h12c2.2 0 4 1.8 4 4zm-3 12l-4.5-6-3.5 4.51-2.5-3.01L7 30h14z" })));
                 break;
         }
         if ((this.renderMode === KupLazyRender.VIEWPORT && this.isInViewport) ||
@@ -149,14 +149,14 @@ export class KupLazy {
                 this.data &&
                 this.isInViewport)) {
             let Tag = this.componentName;
-            content = (h(Tag, Object.assign({ key: 'b856e5475a8fc048cf96c0ee534f17fa2ad261fe' }, this.data, { ref: (el) => (this.lazyComponent = el) })));
+            content = (h(Tag, Object.assign({ key: 'd1d563697c56db2c3fdcf3252aae2a2966b06858' }, this.data, { ref: (el) => (this.lazyComponent = el) })));
             className += ' kup-loaded';
         }
         else if (this.showPlaceholder) {
             content = resource;
             className += ' kup-to-be-loaded';
         }
-        return (h(Host, { key: 'de01035df24b5d3811ca54bb3840bf232287103d', class: className }, h("style", { key: 'db6f4fe85ed90c8a17b598a4805eff35fbfc11af' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '00c41dbaa1579061edf0b9472b19e6c5c8f24eb9', id: componentWrapperId }, content)));
+        return (h(Host, { key: '4a055d835d8e6d3fb06bd4870fe5b13c2e4e922e', class: className }, h("style", { key: '5a8b37cd487d2db656dc8614469ba37c11809343' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '21ace7612895c14f8d63303fc171f04a66016427', id: componentWrapperId }, content)));
     }
     disconnectedCallback() {
         var _a;

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

@@ -198,6 +198,11 @@
   outline: none;
 }
 
+.scroll-list {
+  overflow-y: auto;
+  max-height: var(--kup_list_max_height_as_menu);
+}
+
 .list {
   background: var(--kup_list_background_color);
   color: var(--kup_list_text_color);
@@ -336,7 +341,6 @@
   color: var(--kup-text-color);
   display: none;
   max-height: var(--kup_list_max_height_as_menu);
-  overflow: auto;
   position: relative;
   transform: none;
   transform-origin: unset;