@sme.up/ketchup 11.0.0-SNAPSHOT-20241217120821 → 11.0.0-SNAPSHOT-20241217144747

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

@@ -19,7 +19,7 @@ import { forceUpdate, h, Host, } from "@stencil/core";
 import { KupComponentSizing, } from "../../types/GenericTypes";
 import { kupManagerInstance, } from "../../managers/kup-manager/kup-manager";
 import { ItemsDisplayMode, } from "../kup-list/kup-list-declarations";
-import { consistencyCheck } from "../kup-list/kup-list-helper";
+import { consistencyCheck, getIdOfItemByDisplayMode, } from "../kup-list/kup-list-helper";
 import { FTextField } from "../../f-components/f-text-field/f-text-field";
 import { FTextFieldMDC } from "../../f-components/f-text-field/f-text-field-mdc";
 import { KupComboboxProps, } from "./kup-combobox-declarations";
@@ -49,6 +49,7 @@ export class KupCombobox {
         this.error = '';
         this.icon = null;
         this.initialValue = '';
+        this.initialValueDecode = '';
         this.isClearable = false;
         this.isSelect = true;
         this.label = null;
@@ -69,7 +70,7 @@ export class KupCombobox {
         });
     }
     onKupChange(value) {
-        let ret = __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, value, true);
+        let ret = __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, value, undefined, true);
         this.kupChange.emit({
             comp: this,
             id: this.rootElement.id,
@@ -118,7 +119,7 @@ export class KupCombobox {
         });
     }
     onKupInput() {
-        let ret = __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, __classPrivateFieldGet(this, _KupCombobox_textfieldEl, "f").value, false);
+        let ret = __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, __classPrivateFieldGet(this, _KupCombobox_textfieldEl, "f").value, undefined, false);
         __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_openList).call(this);
         this.kupInput.emit({
             comp: this,
@@ -161,7 +162,11 @@ export class KupCombobox {
     /*                  W a t c h e r s                */
     /*-------------------------------------------------*/
     initialValueChange(newValue) {
-        this.setValue(newValue);
+        this.initialValueDecode = undefined;
+        this.setValue(newValue, undefined);
+    }
+    initialValueDecodeChange(newValue) {
+        this.setValue(this.initialValue, newValue);
     }
     /*-------------------------------------------------*/
     /*                L i s t e n e r s                */
@@ -252,8 +257,8 @@ export class KupCombobox {
      * Sets the component's value.
      * @param {string} value - Value to be set.
      */
-    async setValue(value) {
-        __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, value, true);
+    async setValue(value, valueDecode) {
+        __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, value, valueDecode, true);
     }
     /*-------------------------------------------------*/
     /*          L i f e c y c l e   H o o k s          */
@@ -270,7 +275,7 @@ export class KupCombobox {
         }
     }
     componentDidLoad() {
-        __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, this.value, true);
+        __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, this.value, this.initialValueDecode, true);
         __classPrivateFieldGet(this, _KupCombobox_kupManager, "f").debug.logLoad(this, true);
     }
     componentWillRender() {
@@ -317,7 +322,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: '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
+        return (h(Host, { key: '4288932134731d8923bfabfe12b699a8cd2da762', class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h("style", { key: 'a21e8ac16f00c02d50290582842d09c59ed6fbf5' }, __classPrivateFieldGet(this, _KupCombobox_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'd3de05f1906daf13beeac3453257382df7a20740', id: componentWrapperId, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h(FTextField, Object.assign({ key: '6128749591c290c78e51afc59313d4db69394873' }, 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)));
     }
@@ -510,6 +515,24 @@ export class KupCombobox {
                 "reflect": false,
                 "defaultValue": "''"
             },
+            "initialValueDecode": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Sets the initial value decode of the component"
+                },
+                "attribute": "initial-value-decode",
+                "reflect": false,
+                "defaultValue": "''"
+            },
             "isClearable": {
                 "type": "boolean",
                 "mutable": false,
@@ -1000,11 +1023,15 @@ export class KupCombobox {
             },
             "setValue": {
                 "complexType": {
-                    "signature": "(value: string) => Promise<void>",
+                    "signature": "(value: string, valueDecode?: string) => Promise<void>",
                     "parameters": [{
                             "name": "value",
                             "type": "string",
                             "docs": "- Value to be set."
+                        }, {
+                            "name": "valueDecode",
+                            "type": "string",
+                            "docs": ""
                         }],
                     "references": {
                         "Promise": {
@@ -1029,6 +1056,9 @@ export class KupCombobox {
         return [{
                 "propName": "initialValue",
                 "methodName": "initialValueChange"
+            }, {
+                "propName": "initialValueDecode",
+                "methodName": "initialValueDecodeChange"
             }];
     }
     static get listeners() {
@@ -1079,7 +1109,7 @@ _KupCombobox_kupManager = new WeakMap(), _KupCombobox_elStyle = new WeakMap(), _
     __classPrivateFieldGet(this, _KupCombobox_kupManager, "f").removeClickCallback(__classPrivateFieldGet(this, _KupCombobox_clickCb, "f"));
 }, _KupCombobox_isListOpened = function _KupCombobox_isListOpened() {
     return __classPrivateFieldGet(this, _KupCombobox_listEl, "f").menuVisible == true;
-}, _KupCombobox_consistencyCheck = function _KupCombobox_consistencyCheck(idIn, setValue) {
+}, _KupCombobox_consistencyCheck = function _KupCombobox_consistencyCheck(idIn, idInDecode, setValue) {
     let ret = consistencyCheck(idIn, this.data['kup-list'], __classPrivateFieldGet(this, _KupCombobox_listEl, "f"), this.selectMode, this.displayMode);
     if (ret.exists) {
         if (setValue) {
@@ -1092,7 +1122,12 @@ _KupCombobox_kupManager = new WeakMap(), _KupCombobox_elStyle = new WeakMap(), _
     }
     else {
         this.value = idIn;
-        this.displayedValue = idIn;
+        if (setValue) {
+            this.displayedValue = getIdOfItemByDisplayMode({ id: idIn, value: idInDecode !== null && idInDecode !== void 0 ? idInDecode : idIn }, this.displayMode, ' - ');
+        }
+        else {
+            this.displayedValue = idIn;
+        }
         if (__classPrivateFieldGet(this, _KupCombobox_listEl, "f") != null) {
             __classPrivateFieldGet(this, _KupCombobox_listEl, "f").filter = ret.value;
         }

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

@@ -376,7 +376,7 @@ export class KupDashboard {
         this.didRenderInteractables();
     }
     render() {
-        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))));
+        return (h(Host, { key: '392d3e40007af89151bc6745d150048ada7c4717' }, h("style", { key: '35afed7b1aed860a86c328ba3817ae5b72b670a7' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'e91bdebc3263fd673501f15d841bd042b8a34280', id: componentWrapperId }, this.buildHeader(), this.buildForm(this.internalData, null))));
     }
     disconnectedCallback() {
         this.unregisterInteractables();

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: '46a53a55ec511a4beb0105b6a1caf5af95addc05' }, h("style", { key: '6b93ff258cacb4dfa701edcafb123f18b8b3a7f1' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'd9685f29bf32e9222f62c708250e846b84c182a1', id: componentWrapperId }, this.prepTextfield(this.getDateForOutput()))));
+        return (h(Host, { key: '4e30c74703bcd1eb4d6deeb130e9744639b186d7' }, h("style", { key: '0dc7ca2e29337272a3a551a1320d180e59a0df7d' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'f2f4304d4d815bec1fbb077d45c0a831907e99ab', 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: '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" })))));
+        return (h(Host, { key: 'f1ddf60b563705289df8bcac7b67fd9a4ed7b2e4', "fade-in": true, style: style }, h("style", { key: 'daafa62322845d8913844c00a5a148f856bbb327' }, __classPrivateFieldGet(this, _KupDialog_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '6408c03e635a80657661b7c19bac8f43809df0d2', 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: '24026dd774bbe8efba75cf25df64dabb8aff0c1a', class: "content" }, h("slot", { key: '052be700dbf2257b204da95524bab4f7c95acfbe', 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: '8a9d2198973d5a7ec57918a2064e790682764845', "kup-opened": this.opened }, h("style", { key: 'e3abd215c9b0196074011bf4325bf8a7ab9092ed' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '71daac9c19301460a3fe3edad3f320c01f11bad5', class: "backdrop", onClick: (e) => {
+        return (h(Host, { key: '93f1b8abbecb61a277b9e727363a63a79bec6b2f', "kup-opened": this.opened }, h("style", { key: 'a4adae4c503ce4cd85171f3aba656d00cc537e11' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '241bc8dd79fc0a01b7912a525f6b7cb56ef7c8f6', 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: '47e90864a92415cca083f56e2d25cd05efe56df9', id: componentWrapperId }, h("div", { key: '47bfb804ce58fa47dc1fa7a574df7a05bd92b116', class: drawerClass }, this.content()))));
+            } }), h("div", { key: 'b267c124462e0ca0b7255c004bbc25fd85897775', id: componentWrapperId }, h("div", { key: 'fa2ed194e5be92c1dabee9cd32fd641a4960561d', class: drawerClass }, this.content()))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);

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: '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")) })));
+        return (h(Host, { key: 'fd5e8286acc85f85185f91e360b3620537b57188', style: style }, h("style", { key: '0f69dbba75b69c8dfaa8704c9e45d0d202067724' }, __classPrivateFieldGet(this, _KupEchart_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'd7fd942164bf8c078a08ff51d6da32929a58aba1', 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: 'ffbd575e5192cccaf2c070c4586215cc7573f9ce' }, h("div", { key: '21e2b1a060db3009c6595eb92f78361adff24d6c', id: componentWrapperId }, h("div", { key: this.rootElement.id, ref: (el) => (this.editorRef = el), class: "kup-editor" }))));
+        return (h(Host, { key: '07d0005e073f28636c6f49ceb082fcca0a735beb' }, h("div", { key: '9a59105ef8c70cd840adeada556259e739dd0818', 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: '6788b54f8c964ddeda1e5c4a7922613eb2efd59f', onDrag: (e) => e.preventDefault(), onPointerDown: (e) => {
+        return (h(Host, { key: '09a067148b3438469a9773c276c6aaddecda73fa', 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: '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))));
+            } }, h("style", { key: 'dbae8f187ff51f8168d4df72de2ba563ef7a9d7c' }, __classPrivateFieldGet(this, _KupFamilyTree_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'cf23802e9e58e68d0c89ee7fdd13fde331a04705', 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: '3c206215642b1662964c975671c3a2f7720eb470' }, this.kupManager.language.translate(KupLanguageGeneric.EMPTY_DATA)));
+            formContent = (h("p", { key: '4b4c768ddde3a3e5b716aa6c78f19d124fe472ff' }, 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: 'bc740600eab0fde6bce214eb57ce0a883a70bc50' }, h("style", { key: '73cf8c044cbe93249f7943e42b657b5d70247531' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '2fe3feca10d6237f4135453b91334527ba2ca311', id: componentWrapperId }, formContent)));
+        return (h(Host, { key: 'fef68da43868f5b70c76102cc08fc53557b0feb8' }, h("style", { key: 'c8265a9f9c5a9bce97c8c2bbf64d3d7cbf1f57ee' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'de6c69d454396ebf0e82b5de27c7541132038eeb', 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: '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 }))))));
+        return (h(Host, { key: 'e9898d021074e1265d66d5f25f99b54a2951b732' }, h("style", { key: 'fdd334f8659e6132c6f000d84fbed0df4a7331fe' }, __classPrivateFieldGet(this, _KupHTM_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '95290081ea536d6eaefcf985c2d9f006ad935f41', id: componentWrapperId }, h("div", { key: 'c9814a4fa6b24d89fd262b340310106cdd8c02a3', 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: '6b1b27c8e736754f479770ec67603d5708a78191' }, h("style", { key: '998b454b9acbe6078e18b5303667a373ef17a352' }, __classPrivateFieldGet(this, _KupImageList_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '9dfe6fefea846bbe367f5c76fd2d336840190ae9', id: componentWrapperId, ref: (el) => {
+        return (h(Host, { key: '8622f01ec87a1aafd4818ef24059d828afeece44' }, h("style", { key: 'acfeaf13e960c3e21bac9cc39c4d201565422f6b' }, __classPrivateFieldGet(this, _KupImageList_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'a03b3eb875abe7948596d286a36c81b6173dfafe', id: componentWrapperId, ref: (el) => {
                 __classPrivateFieldSet(this, _KupImageList_el, el, "f");
-            } }, h("div", { key: '8e6ba7408c4358862f1cccc8b564c5f225410074', class: "navigation-bar" }, hasNavigation ? (h("div", { class: `navigation-bar__wrapper ${this.navigationBarToggled
+            } }, h("div", { key: '78ca055bdda2fc1a8cca73a5744e45ead5063857', 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: '4c007ebfba4fe8b1b8aaffbae9261c27db9b00df', 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: '339f5dcc216ed2cbac3c7acfcdb08c1e853b0c5b', 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

@@ -190,9 +190,9 @@ 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: '77e1409d760b149f1a3ae34963b9f7bec250513e', "onKup-cell-blur": __classPrivateFieldGet(this, _KupInputPanel_instances, "m", _KupInputPanel_onBlurHandler).bind(this), "onKup-tabbar-click": (e) => {
+        return (h(Host, { key: 'c0a40ba2669f4738b350c09f2261e8c9e1a98d36', "onKup-cell-blur": __classPrivateFieldGet(this, _KupInputPanel_instances, "m", _KupInputPanel_onBlurHandler).bind(this), "onKup-tabbar-click": (e) => {
                 this.tabSelected = e.detail.node.id;
-            }, "onKup-autocomplete-input": __classPrivateFieldGet(this, _KupInputPanel_instances, "m", _KupInputPanel_getOptionHandler).bind(this), "onKup-autocomplete-iconclick": __classPrivateFieldGet(this, _KupInputPanel_instances, "m", _KupInputPanel_getOptionHandler).bind(this), "onKup-combobox-iconclick": __classPrivateFieldGet(this, _KupInputPanel_instances, "m", _KupInputPanel_getOptionHandler).bind(this) }, h("style", { key: 'aae1d4252362f1243fffdf1712423021e11e1ed6' }, __classPrivateFieldGet(this, _KupInputPanel_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '90c0918bd6d3ef402f21272654a21b507ded99cb', id: componentWrapperId }, inputPanelContent)));
+            }, "onKup-autocomplete-input": __classPrivateFieldGet(this, _KupInputPanel_instances, "m", _KupInputPanel_getOptionHandler).bind(this), "onKup-autocomplete-iconclick": __classPrivateFieldGet(this, _KupInputPanel_instances, "m", _KupInputPanel_getOptionHandler).bind(this), "onKup-combobox-iconclick": __classPrivateFieldGet(this, _KupInputPanel_instances, "m", _KupInputPanel_getOptionHandler).bind(this) }, h("style", { key: 'a4509c3e5cdcb75e143fc16671e924b3ac3de074' }, __classPrivateFieldGet(this, _KupInputPanel_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'ead1de0f14ac0d3d65005ebbd1a9f88f5e9584f9', 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: '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" })));
+                resource = (h("svg", { key: 'fb2b8362e3dc1b12b70f15e99928a57d7b12fedf', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '436f390f7b97422e6748b2a7759d592f44c506dc', 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: '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" })));
+                resource = (h("svg", { key: 'f3c05242075e730bc7105c53bd62b18aecf5ec3d', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: 'a2eee16a6ace543cac444d960a62b59a086eb744', 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: '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" })));
+                resource = (h("svg", { key: 'f6716e9ce1594db32cc40769a2670f5eaab944ec', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '7a5d24b382c912f86930086ea47d5352f7d268c0', 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: '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" })));
+                resource = (h("svg", { key: '282e8485c65d6c90cc6742fab3ea8826eeb3579a', xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "100%", height: "100%", viewBox: "0 0 24 24" }, h("path", { key: 'ff9a9420e091b9f5ccf64c2a248715445a3ea89b', d: "M22,21H2V3H4V19H6V10H10V19H12V6H16V19H18V14H22V21Z" })));
                 break;
             case 'kup-data-table':
                 //table-large.svg
-                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" })));
+                resource = (h("svg", { key: 'eaffa11808d13d6a30fff31bea6530830f69d88f', xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "100%", height: "100%", viewBox: "0 0 24 24" }, h("path", { key: 'c0eac37b259ccaa3176fb122208202dc8885de85', 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: '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" })));
+                resource = (h("svg", { key: '0fc683ca7735ac9d5f48d9c1350d67549444a37e', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: 'dc800aa000585a00f390e3e92f9456af2c83b121', 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: '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" })));
+                resource = (h("svg", { key: '6703f804c86f98915b6fca8d561b79e818480ee0', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '5b473c7582738c69b3e693b653eb8e83f0a5bd7d', 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: '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" })));
+                resource = (h("svg", { key: 'b5020673fe0d60ddcb887878d027f9be1a04f611', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: 'ca7c15a6029ffb8468db47603eae20f8db8eaa54', 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: '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" })));
+                resource = (h("svg", { key: '6e916204ad921b9387a2da59225277a12bdfee97', xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: "0 0 48 48" }, h("path", { key: '2397c3c58a7ac2ddfe1c4d95680c805b410a1cda', 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: 'd1d563697c56db2c3fdcf3252aae2a2966b06858' }, this.data, { ref: (el) => (this.lazyComponent = el) })));
+            content = (h(Tag, Object.assign({ key: '55d8ffa08667bdf2f90e278bd6d28e94d5a5fd90' }, 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: '4a055d835d8e6d3fb06bd4870fe5b13c2e4e922e', class: className }, h("style", { key: '5a8b37cd487d2db656dc8614469ba37c11809343' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '21ace7612895c14f8d63303fc171f04a66016427', id: componentWrapperId }, content)));
+        return (h(Host, { key: 'b51dd829f66bf9958780ca2a106bd265097e0212', class: className }, h("style", { key: '5f16dbbf7222c11e5e3daf2d914b0cbb4f7d757a' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'c0c9f7471b8e6529fa510db940edbbd2505deb86', id: componentWrapperId }, content)));
     }
     disconnectedCallback() {
         var _a;

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

@@ -7,7 +7,9 @@ export function getIdOfItemByDisplayMode(item, mode, separator) {
         return item.value;
     }
     if (mode == ItemsDisplayMode.DESCRIPTION_AND_CODE) {
-        return item.id + separator + item.value;
+        if (item.id || item.value) {
+            return item.id + separator + item.value;
+        }
     }
     return item.id;
 }

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

@@ -263,11 +263,11 @@ export class KupMagicBox {
         this.kupManager.debug.logRender(this, true);
     }
     render() {
-        return (h(Host, { key: 'cc7eb83eaccd2507c886ec16bc37d2fa567ac52e' }, h("style", { key: '809d326e5dcbf28e7aadc8901b0b4958442de680' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '1f05d7964adaebc3e44123e766f54b913b6427a4', id: componentWrapperId }, h("div", { key: '08e3fe041eca609baf1bffc35d19711a54557b92', class: "magic-box-wrapper" }, h("div", { key: 'a66c16ca2910391f07eeca825443cd13d1a9eaef', class: "actions", id: "drag-handle" }, h("kup-combobox", Object.assign({ key: '8751f6abdbb318c30470954b6b59a5ee331b3ab9' }, this.comboboxProps())), h("kup-button", { key: 'aaae57d304a47b6371f87e7be3ec6e52d6dac92f', styling: FButtonStyling.FLAT, icon: "delete", label: "Reset", "onkup-button-click": () => {
+        return (h(Host, { key: '579cf183f0915d864820f3d06bc1576ab11ae1a4' }, h("style", { key: '9128110fcaca2c1da80ce29a30b17f26d287ccb3' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'a23742c2083fc1ef92fbc370da846dc8b9182116', id: componentWrapperId }, h("div", { key: '1c23fa7eb08e82493c2279f975425297dbcc46fd', class: "magic-box-wrapper" }, h("div", { key: '3c1f251962659f982d0d68108fdb0476d0fa065a', class: "actions", id: "drag-handle" }, h("kup-combobox", Object.assign({ key: '30fbff2375c6872fc6ae239a7a215928a4512e3c' }, this.comboboxProps())), h("kup-button", { key: 'de990f96f370f26bd847d90bb555cd818ce59b4e', styling: FButtonStyling.FLAT, icon: "delete", label: "Reset", "onkup-button-click": () => {
                 this.data = null;
-            } }), h("kup-button", { key: '295644dff6eff6d80df769fd54d5e0db43de8473', id: "close-dialog", customStyle: `:host{${KupThemeColorValues.PRIMARY}: var(${KupThemeColorValues.TITLE});}`, icon: "clear", "onkup-button-click": () => {
+            } }), h("kup-button", { key: '867ec9ed075ae869dc9350e00096036d3af780e6', id: "close-dialog", customStyle: `:host{${KupThemeColorValues.PRIMARY}: var(${KupThemeColorValues.TITLE});}`, icon: "clear", "onkup-button-click": () => {
                 this.kupManager.hideMagicBox();
-            } })), h("div", { key: '3aedf43217a1a013c78170af418adbde5994e0cc', class: "content", ref: (el) => (this.wrapperRef = el) }, this.setContent())))));
+            } })), h("div", { key: '279780fb00c2ad681ff42f266ad08a25705928fe', class: "content", ref: (el) => (this.wrapperRef = el) }, this.setContent())))));
     }
     disconnectedCallback() {
         this.kupManager.interact.unregister([

package/dist/collection/components/kup-nav-bar/kup-nav-bar.js

@@ -98,7 +98,7 @@ export class KupNavBar {
         this.kupManager.debug.logRender(this, true);
     }
     render() {
-        return (h(Host, { key: '2a384dc4de4b550cfaaf9490579dc4ffdb469076', class: "header" }, h("style", { key: 'b91849a849d6e9509b9456f1a90be1042f7d9499' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'e1182a3b34dd471a8dd73a90119af6a408f2604e', id: componentWrapperId }, h("header", { key: '13a6491135dab2490042558ae00bfe23a55b5ed8', class: `${navbarClass} ${navbarClass}--${this.styling.toLowerCase()} ` }, h("div", { key: '2b8cae0eaf58a12769ce158effc25fc31f7ee0c9', class: `${navbarClass}__row` }, this.content())))));
+        return (h(Host, { key: '78c7f252d8e16460a2108c898e025209183103c8', class: "header" }, h("style", { key: 'f18b1188fbc590427245dd6acaeed14f3aba3033' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '58a440f172111617ad78da7352b3803356a16015', id: componentWrapperId }, h("header", { key: 'cb2783014d79eee887c8507a06d504fa614fdd77', class: `${navbarClass} ${navbarClass}--${this.styling.toLowerCase()} ` }, h("div", { key: 'e9ca378c0a88b69abc3933780fcc4f33a6d9e6ed', class: `${navbarClass}__row` }, this.content())))));
     }
     disconnectedCallback() {
         this.kupManager.language.unregister(this);

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

@@ -321,7 +321,7 @@ export class KupNumericPicker {
         this.kupManager.debug.logRender(this, true);
     }
     render() {
-        return (h(Host, { key: 'de9de7129302c8b4da71cf3d7a344ac8e6a5dfaf' }, h("style", { key: 'd4b96735e89a534a50349bbd3c12d69fbf3cd32e' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '9ddac65757ea1d436f6e845155d8f4d4a1610183', id: componentWrapperId }, this.prepTextfield())));
+        return (h(Host, { key: 'e4971105409f3f1d053379189bb98a5cee25e986' }, h("style", { key: 'a15921df3d5f4bf5542216219197383b5a8c04e1' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'e1e1ccc7e4a954956fb4a49f2aeb43a113e25030', id: componentWrapperId }, this.prepTextfield())));
     }
     disconnectedCallback() {
         this.kupManager.dates.unregister(this);

package/dist/collection/components/kup-object-field/kup-object-field.js

@@ -78,7 +78,7 @@ export class KupObjectField {
             data: (_a = this.data) !== null && _a !== void 0 ? _a : {},
             inputValue: this.inputValue,
         };
-        return (h(Host, { key: 'c50277b235f4bbe5945086c619d1a747d83f4172' }, h("style", { key: 'c238a76b7a96eb1c8ae29edb1d6241540a6deb01' }, __classPrivateFieldGet(this, _KupObjectField_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '78fd4c7c17b76033f7e11d741086065bc9beed5a', id: componentWrapperId }, h(FObjectField, Object.assign({ key: 'a2b16512ef5eec7e4c45f8116d3d5fc6aca2cb93' }, props)))));
+        return (h(Host, { key: '64b0ed1c52ab60b6b62f37e2540c615c7734df2b' }, h("style", { key: '632c2c4ea945e8f2229026b139716e20afd3c513' }, __classPrivateFieldGet(this, _KupObjectField_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '83e433664f2a2a2f9cccd96fec89be504683d860', id: componentWrapperId }, h(FObjectField, Object.assign({ key: 'dc274a9635608d774373bfa27f068fc2ad7d38b4' }, props)))));
     }
     disconnectedCallback() {
         __classPrivateFieldGet(this, _KupObjectField_kupManager, "f").theme.unregister(this);

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

@@ -105,7 +105,7 @@ export class KupPdf {
         catch (error) { }
     }
     render() {
-        return (h(Host, { key: '0d03119a101b40970f9c0790bd265cb229cd766b' }, h("div", { key: '35b6c0bea491e84639e58bde9978cf936747a567', id: componentWrapperId, ref: (el) => (this.wrapperRef = el) })));
+        return (h(Host, { key: 'f2613b15accb59fe68734ffd1972aecf216bed74' }, h("div", { key: 'a9738ed98a36d3fc46e7ae91716ccbfae4898776', id: componentWrapperId, ref: (el) => (this.wrapperRef = el) })));
     }
     disconnectedCallback() {
         __classPrivateFieldGet(this, _KupPdf_kupManager, "f").theme.unregister(this);

package/dist/collection/components/kup-photo-frame/kup-photo-frame.js

@@ -99,9 +99,9 @@ export class KupPhotoFrame {
         if (this.isInViewport && !__classPrivateFieldGet(this, _KupPhotoFrame_renderResource, "f")) {
             __classPrivateFieldSet(this, _KupPhotoFrame_renderResource, true, "f");
         }
-        return (h(Host, { key: '1ef1d33f9d166a88c06992b34c92c6ffbe2571e5' }, h("style", { key: '19ec6c7e0eece08b10c74dcccd872a80a5c376b6' }, __classPrivateFieldGet(this, _KupPhotoFrame_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '92e2b1633bfb1bc8552789ea130d4730f06630a3', id: componentWrapperId, ref: (el) => {
+        return (h(Host, { key: 'fced79527b2a6530e421a5da370fc92c3b856bab' }, h("style", { key: '9f3a8702d820381ce546b1da05a1a59bf18241a3' }, __classPrivateFieldGet(this, _KupPhotoFrame_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '4ac2c7956b8602bb1ba65911e84576658973a805', id: componentWrapperId, ref: (el) => {
                 __classPrivateFieldSet(this, _KupPhotoFrame_wrapperEl, el, "f");
-            } }, h("img", Object.assign({ key: '1ed369fd4c2abb9050f16a81f01b3167a31e1852' }, this.placeholderAttrs, { class: "placeholder", ref: (el) => (__classPrivateFieldSet(this, _KupPhotoFrame_placeholderEl, el, "f")), onLoad: () => {
+            } }, h("img", Object.assign({ key: '78a244bdcc4ba6d8e9310a3ebf1c7c20a0e560b9' }, this.placeholderAttrs, { class: "placeholder", ref: (el) => (__classPrivateFieldSet(this, _KupPhotoFrame_placeholderEl, el, "f")), onLoad: () => {
                 if (__classPrivateFieldGet(this, _KupPhotoFrame_placeholderEl, "f").naturalWidth >
                     __classPrivateFieldGet(this, _KupPhotoFrame_placeholderEl, "f").naturalHeight) {
                     __classPrivateFieldGet(this, _KupPhotoFrame_wrapperEl, "f").classList.add('horizontal');

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

@@ -523,7 +523,7 @@ export class KupPlanner {
         if ((_b = this.plannerProps) === null || _b === void 0 ? void 0 : _b.secondaryGantt) {
             plannerProps.secondaryGantt = Object.assign(Object.assign({}, this.plannerProps.secondaryGantt), { onScrollY: this.handleDetailGanttScrollY.bind(this) });
         }
-        return (h(Host, { key: 'ddb478b51648fb372faa628d04e63197eb77501b' }, h("style", { key: 'a3faab027e8da261f3ff07aa8d475277e39a7b20' }, __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '4f2203fcf11cf8eefa00e53fc9f6616601cad9a6', id: componentWrapperId, style: { maxWidth: this.maxWidth } }, this.plannerProps && (h("kup-planner-renderer", { key: 'c66e2658463a114ea99f8e14e6451e5dea13314c', props: plannerProps, ref: (el) => (this.plannerRenderer = el) }))), h("div", { key: 'b480ac83dd9c8d56ac18594b4012a6f5f4444a90', style: { display: this.plannerProps ? 'none' : '' } }, h(FTextField, { key: '813747f78ad25f6aa402ce9f593b0d0b1f4b50f6', icon: KupThemeIconValues.SEARCH, id: "main-filter", label: __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").language.translate(KupLanguageSearch.SEARCH), onKeyDown: (e) => {
+        return (h(Host, { key: 'ec47712382d7f76463e7805015fc2038da69be2b' }, h("style", { key: 'b1f45b5373f54f28256a5b9a65cbf7db46de1d08' }, __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '7b048a1dd16a7b1c9d82a1a92393fbb395e3f19e', id: componentWrapperId, style: { maxWidth: this.maxWidth } }, this.plannerProps && (h("kup-planner-renderer", { key: 'df324c79666c4d3e9c6a410b68065b333da15677', props: plannerProps, ref: (el) => (this.plannerRenderer = el) }))), h("div", { key: 'f2b527fbe72c4fb91ffdb9675c31ceddfc3fe695', style: { display: this.plannerProps ? 'none' : '' } }, h(FTextField, { key: 'c7844fbd7037996ddc56430f45ca96685f717e19', icon: KupThemeIconValues.SEARCH, id: "main-filter", label: __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").language.translate(KupLanguageSearch.SEARCH), onKeyDown: (e) => {
                 if (e.key === 'Enter') {
                     __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_onFilter).call(this, e.target.value);
                 }

package/dist/collection/components/kup-planner/utils/custom-task-list-header.js

@@ -8,11 +8,11 @@ export class KupCustomTaskListHeader {
         this.fontSize = undefined;
     }
     render() {
-        return (h("div", { key: '0dda65a73efcc5b8217019bf8d1d5d4a66277df6', class: "custom-task-list-wrapper", style: {
+        return (h("div", { key: '324d47927324515f29b44acfeaa6314788ec4da7', class: "custom-task-list-wrapper", style: {
                 height: '25px',
                 fontFamily: this.fontFamily,
                 fontSize: this.fontSize,
-            } }, h("div", { key: '07bfcbb99f759ae7968cb76af97e04666cdfb84f', class: "title" }, h("span", { key: '59b6656d24f1b381455888534075a704eadf3757' }, this.label)), this.setDoubleView !== undefined && (h("div", { key: '7d6f5eca5945d49fd784089cc97906400f9279fe', class: "toggler" }, h("label", { key: '6badb37501bdc190948b6fd101a04695b556fa87', htmlFor: "ch2", class: "switch" }, h("input", { key: '07f2f293bec60e83caf3ff8590277c05a8cad26a', class: "input", id: "ch2", type: "checkbox", checked: this.doubleView, onClick: () => this.setDoubleView(!this.doubleView) }), h("span", { key: 'a6cb9c1484bf2fbec6a1e9cdb6b2fac06a35c03f', class: "slider" })), h("span", { key: '4def4a9d08f8eb2fecf7058ad24d44d0cf626dec', class: "label" }, "Previsioni")))));
+            } }, h("div", { key: '86d1d95d940db2bb3dee1e2c6469feb1d3267652', class: "title" }, h("span", { key: 'dc45d5cf947b5573ed7548fc89c2002717fed017' }, this.label)), this.setDoubleView !== undefined && (h("div", { key: 'aeb990e6ce011948a6ac3600a114872949bfa00a', class: "toggler" }, h("label", { key: 'a6e550a4526b00c961746552c8932c04382788fe', htmlFor: "ch2", class: "switch" }, h("input", { key: 'be713ceaf3c1f213eb30234a118c367d75ac42c6', class: "input", id: "ch2", type: "checkbox", checked: this.doubleView, onClick: () => this.setDoubleView(!this.doubleView) }), h("span", { key: '0659f75ad8e22c4c375d4f7d0b5f541937ad9fea', class: "slider" })), h("span", { key: '5560587e2ed422b7e5ecf90e249e2edfce7ab2e2', class: "label" }, "Previsioni")))));
     }
     static get is() { return "kup-custom-task-list-header"; }
     static get originalStyleUrls() {

package/dist/collection/components/kup-planner/utils/kup-gantt/kup-gantt.js

@@ -563,9 +563,9 @@ export class KupGantt {
             TaskListHeader: this.TaskListHeader,
             TaskListTable: this.TaskListTable
         };
-        return (h("div", { key: '7ca3df83876dbea0f57536a3eb9a7978af4f18f2', class: "gannt-wrapper-main" }, h("div", { key: '411ce55a1a2de1fb2c77b6fa5395237d7f93d857', class: "wrapper", onKeyDown: this.handleKeyDown.bind(this), tabIndex: 0, ref: (el) => (this.wrapperRef = el) }, this.listCellWidth && (h("kup-task-list", Object.assign({ key: '64361b6d13020fa1b26a8742ea6fb14007c5f946', currentTasks: this.currentTasks, handleClick: this.handleClick, handleDblClick: this.handleDblClick, handleContextMenu: this.handleContextMenu, ganttOnClick: this.ganttOnClick, ganttOnDblClick: this.ganttOnDblClick, ganttonOnContextMenu: this.ganttonOnContextMenu, label: this.label, doubleView: this.doubleView, setDoubleView: this.setDoubleView }, tableProps, { class: "tasks", scrollableTaskList: this.scrollableTaskList, updateTaskListScrollX: this.ignoreScrollEvent, ontaskListScrollWidth: (width) => {
+        return (h("div", { key: '818930e7cdf7b7d2a734ef9767fbaa633b764245', class: "gannt-wrapper-main" }, h("div", { key: '51619f1317a5428f603208961c8c05e0a18a8b62', class: "wrapper", onKeyDown: this.handleKeyDown.bind(this), tabIndex: 0, ref: (el) => (this.wrapperRef = el) }, this.listCellWidth && (h("kup-task-list", Object.assign({ key: 'ee80c9b92bf3fbaacb6e012a8c47c23a79dff364', currentTasks: this.currentTasks, handleClick: this.handleClick, handleDblClick: this.handleDblClick, handleContextMenu: this.handleContextMenu, ganttOnClick: this.ganttOnClick, ganttOnDblClick: this.ganttOnDblClick, ganttonOnContextMenu: this.ganttonOnContextMenu, label: this.label, doubleView: this.doubleView, setDoubleView: this.setDoubleView }, tableProps, { class: "tasks", scrollableTaskList: this.scrollableTaskList, updateTaskListScrollX: this.ignoreScrollEvent, ontaskListScrollWidth: (width) => {
                 this.taskListScrollWidth = width;
-            }, taskListScrollX: this.taskListScrollX, ref: (el) => (this.taskListTrueRef = el) }))), h("kup-task-gantt", { key: 'd34dcf0103274551222a40e44a17a93d770458d6', gridProps: gridProps, calendarProps: calendarProps, barProps: barProps, ganttHeight: this.ganttHeight, taskGanttRef: this.taskGanttRef, scrollY: this.scrollY, scrollX: this.scrollX, phaseDragScroll: this.handlePhaseDragScroll.bind(this), class: "ganttContainer" }), this.ganttEvent.changedTask && (h("kup-tooltip", { key: '97d5ed31d1fe2afc1675a20a6ad176c75262adc0', arrowIndent: this.arrowIndent, rowHeight: this.rowHeight, svgContainerHeight: this.svgContainerHeight, svgContainerWidth: this.svgContainerWidth, fontFamily: this.fontFamily, fontSize: this.fontSize, scrollX: this.scrollX, scrollY: this.scrollY, task: this.ganttEvent.changedTask, headerHeight: this.headerHeight, taskListWidth: this.taskListWidth, TooltipContent: this.TooltipContent, rtl: this.rtl, svgWidth: this.svgWidth })), h("kup-vertical-scroll", { key: '6020a60fc2d928cd5e89f8e1f58957f001b59445', ganttFullHeight: this.ganttFullHeight, ganttHeight: this.ganttHeight, headerHeight: this.headerHeight, scrollNumber: this.scrollY, verticalScroll: this.handleScrollY.bind(this), rtl: this.rtl })), this.taskGanttRef && (h("kup-horizontal-scroll", { key: '1a7891ac340db8c729ea2ef6237b81baede2b02d', svgWidth: this.svgWidth, taskListTrueRef: this.taskListTrueRef, taskListWidth: this.taskListWidth, scrollNumber: this.scrollX, rtl: this.rtl, horizontalScroll: this.handleScrollX.bind(this), horizontalTaskListScroll: this.handleTaskListScrollX.bind(this), listCellWidth: this.listCellWidth, scrollableTaskList: this.scrollableTaskList, taskListScrollWidth: this.taskListScrollWidth, taskListScrollNumber: this.taskListScrollX }))));
+            }, taskListScrollX: this.taskListScrollX, ref: (el) => (this.taskListTrueRef = el) }))), h("kup-task-gantt", { key: '09bf9b1ba7c12634ad8cff558ac4369c3b5f4521', gridProps: gridProps, calendarProps: calendarProps, barProps: barProps, ganttHeight: this.ganttHeight, taskGanttRef: this.taskGanttRef, scrollY: this.scrollY, scrollX: this.scrollX, phaseDragScroll: this.handlePhaseDragScroll.bind(this), class: "ganttContainer" }), this.ganttEvent.changedTask && (h("kup-tooltip", { key: '187c6bec18c73cfb59d797bae2bdf11c6eddad86', arrowIndent: this.arrowIndent, rowHeight: this.rowHeight, svgContainerHeight: this.svgContainerHeight, svgContainerWidth: this.svgContainerWidth, fontFamily: this.fontFamily, fontSize: this.fontSize, scrollX: this.scrollX, scrollY: this.scrollY, task: this.ganttEvent.changedTask, headerHeight: this.headerHeight, taskListWidth: this.taskListWidth, TooltipContent: this.TooltipContent, rtl: this.rtl, svgWidth: this.svgWidth })), h("kup-vertical-scroll", { key: 'f1b68b38471ce97b934bce439ccfcfd5b540b2b0', ganttFullHeight: this.ganttFullHeight, ganttHeight: this.ganttHeight, headerHeight: this.headerHeight, scrollNumber: this.scrollY, verticalScroll: this.handleScrollY.bind(this), rtl: this.rtl })), this.taskGanttRef && (h("kup-horizontal-scroll", { key: '9ef52219a92fa78b79504ff5c1aba0c532e1ede1', svgWidth: this.svgWidth, taskListTrueRef: this.taskListTrueRef, taskListWidth: this.taskListWidth, scrollNumber: this.scrollX, rtl: this.rtl, horizontalScroll: this.handleScrollX.bind(this), horizontalTaskListScroll: this.handleTaskListScrollX.bind(this), listCellWidth: this.listCellWidth, scrollableTaskList: this.scrollableTaskList, taskListScrollWidth: this.taskListScrollWidth, taskListScrollNumber: this.taskListScrollX }))));
     }
     static get is() { return "kup-gantt"; }
     static get originalStyleUrls() {

package/dist/collection/components/kup-planner/utils/kup-gantt-calendar/kup-gantt-calendar.js

@@ -225,11 +225,11 @@ export class KupGanttCalendar {
         this.simplifiedHeader =
             this.singleLineHeader && this.dateSetup.viewMode !== 'year';
         const [topValues, bottomValues] = this.getTopAndBottomValues();
-        return (h("svg", { key: 'cb25f41952a9df647dde916bdec8777008f8fef3', xmlns: "http://www.w3.org/2000/svg", width: this.svgWidth, height: this.headerHeight }, h("g", { key: '1b2a22e86f120867dc36588d13d4529e85406b99', class: "calendar", "font-size": this.fontSize, "font-family": this.fontFamily }, h("rect", { key: '6fcae9075fdd1228f4d8975390abbe55acd3f659', x: 0, y: 0, width: this.columnWidth * this.dateSetup.dates.length, height: this.headerHeight, class: "calendarHeader" }), this.simplifiedHeader ? null : bottomValues, this.simplifiedHeader
+        return (h("svg", { key: '842b2be16fd56d8c65f971ed37d32845a1798dc6', xmlns: "http://www.w3.org/2000/svg", width: this.svgWidth, height: this.headerHeight }, h("g", { key: '842526c0379044e0464bb3a5953390938d2f537d', class: "calendar", "font-size": this.fontSize, "font-family": this.fontFamily }, h("rect", { key: 'd93c1bda5be1c8ba4bedccc232f0d3d87d013240', x: 0, y: 0, width: this.columnWidth * this.dateSetup.dates.length, height: this.headerHeight, class: "calendarHeader" }), this.simplifiedHeader ? null : bottomValues, this.simplifiedHeader
             ? topValues.map((topValue) => (h("g", { class: "calendarTop" }, h("line", { x1: topValue.x1Line, y1: topValue.y2Line * 2, x2: topValue.x1Line, y2: topValue.y2Line, class: "calendarTopTick", key: topValue.value + 'line' }), h("text", { key: topValue.value + 'text', y: topValue.yText, x: topValue.xText, class: "calendarTopText" }, topValue.value))))
             : topValues.map((topValue) => (h("g", { class: "calendarTop" }, h("line", { x1: topValue.x1Line, y1: topValue.y1Line, x2: topValue.x1Line, y2: topValue.y2Line, class: "calendarTopTick", key: topValue.value + 'line' }), h("text", { key: topValue.value + 'text', y: topValue.yText, x: topValue.xText, class: "calendarTopText" }, topValue.value)))), this.currentDateIndicator && (
         // current date indicator
-        h("circle", { key: '049fd3ba1ebcef54ae8fe3e78ead566e21c5f76b', fill: this.currentDateIndicator.color, cx: this.currentDateIndicator.x + 2.5, cy: this.headerHeight - 8, r: "8" })))));
+        h("circle", { key: 'f7d1ec8fabefd15a34fcbb88e3d4bde7267cc76e', fill: this.currentDateIndicator.color, cx: this.currentDateIndicator.x + 2.5, cy: this.headerHeight - 8, r: "8" })))));
     }
     static get is() { return "kup-gantt-calendar"; }
     static get originalStyleUrls() {