@sme.up/ketchup 10.3.7 → 10.3.9

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

@@ -220,13 +220,13 @@ export class KupPlannerRenderer {
     }
     render() {
         var _a, _b, _c;
-        return (h("div", { key: '211d49d829c71b61a82b45f8e66f502d0e19ad4d', class: "planner-render" }, h("kup-switcher", { key: '729c5c3c01fa6e9d512f70dc784b42cdc27ca6f4', timeUnitChange: (timeUnit) => {
+        return (h("div", { key: 'c1cc0fe4d44331b5b75fb35b0afbd913caf7f622', class: "planner-render" }, h("kup-switcher", { key: '3c125419b5912ff9c9b9c24adba71dda785fa01d', timeUnitChange: (timeUnit) => {
                 var _a, _b;
                 (_b = (_a = this.props).onSetViewMode) === null || _b === void 0 ? void 0 : _b.call(_a, timeUnit);
                 this.timeUnit = timeUnit;
                 this.viewDate = undefined;
                 this.scrollX = -1;
-            } }), this.props && (h("div", { key: 'c41a40a0887cbe4f045ff4a5446c60fd2c81f750', style: {
+            } }), this.props && (h("div", { key: 'cf92a3212f97ec496aa30ff6b7eec91e831e4b14', style: {
                 display: 'flex',
                 flexDirection: 'column',
             } }, h("kup-gantt", Object.assign({ ref: (el) => (this.mainGantt = el), ganttId: KUP_PLANNER_MAIN_GANTT_ID, key: KUP_PLANNER_MAIN_GANTT_ID, filter: this.props.mainGantt.filter, hideLabel: this.props.mainGantt.hideLabel, showSecondaryDates: this.mainGanttDoubleView, hideDependencies: this.props.mainGantt.hideDependencies, ganttHeight: this.props.mainGantt.ganttHeight, displayedStartDate: this.displayedDates.displayedStartDate, displayedEndDate: this.displayedDates.displayedEndDate, viewDate: this.viewDate, tasks: this.tasks, columnWidth: columnWidthForTimeUnit(this.timeUnit), viewMode: this.timeUnit }, this.props.mainGantt.stylingOptions, { TaskListHeader: this.props.mainGantt.taskListHeaderProject, TaskListTable: this.props.mainGantt.taskListTableProject, TooltipContent: (_a = this.props.mainGantt.tooltipContent) !== null && _a !== void 0 ? _a : CustomTooltipHOC(), barClick: (task) => {

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

@@ -16,7 +16,7 @@ export class KupSwitcher {
             this.activeButton = mode;
             this.timeUnitChange(mode);
         };
-        return (h("div", { key: '69318d1150aa4d819bd02d27b6fd1b77ddc25d0e', class: "switcher" }, this.buttonLabels.map((label) => (h("button", { type: "button", class: {
+        return (h("div", { key: 'd24d4bc2fd86820f8ec6970387020b7d2b6088d1', class: "switcher" }, this.buttonLabels.map((label) => (h("button", { type: "button", class: {
                 button: true,
                 buttonActive: this.activeButton === label,
             }, onClick: () => handleButtonClick(label) }, h("span", { class: "label" }, label.charAt(0).toUpperCase() + label.slice(1)))))));

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

@@ -34,12 +34,12 @@ export class TaskGantt {
     }
     render() {
         const newBarProps = Object.assign(Object.assign({}, this.barProps), { gridProps: this.gridProps, phaseDragScroll: this.phaseDragScroll });
-        return (h("div", { key: '149b218ceb53348f58ddc834cf2a31accb4be9ea', class: "ganttVerticalContainer", ref: (el) => (this.verticalGanttContainerRef = el), dir: "ltr" }, h("kup-gantt-calendar", { key: 'a1344fc81e46f8aee02cd7dd2f37ea50fde4c371', dateSetup: this.calendarProps.dateSetup, locale: this.calendarProps.locale, rtl: this.calendarProps.rtl, headerHeight: this.calendarProps.headerHeight, columnWidth: this.calendarProps.columnWidth, fontFamily: this.calendarProps.fontFamily, fontSize: this.calendarProps.fontSize, dateTimeFormatters: this.calendarProps.dateTimeFormatters, singleLineHeader: this.calendarProps.singleLineHeader, currentDateIndicator: this.calendarProps.currentDateIndicator, svgWidth: this.gridProps.svgWidth }), h("div", { key: 'e85f2ce4aaabbcbd3e1bd070836164818c6b3227', ref: (el) => (this.horizontalContainerRef = el), class: "horizontalContainer", style: this.ganttHeight
+        return (h("div", { key: 'e2b4a8dff37cb823329dd6cbf6ea4ed7a9b81e33', class: "ganttVerticalContainer", ref: (el) => (this.verticalGanttContainerRef = el), dir: "ltr" }, h("kup-gantt-calendar", { key: '156ef3dc8e066fa143ca2b27c945e5487299b87b', dateSetup: this.calendarProps.dateSetup, locale: this.calendarProps.locale, rtl: this.calendarProps.rtl, headerHeight: this.calendarProps.headerHeight, columnWidth: this.calendarProps.columnWidth, fontFamily: this.calendarProps.fontFamily, fontSize: this.calendarProps.fontSize, dateTimeFormatters: this.calendarProps.dateTimeFormatters, singleLineHeader: this.calendarProps.singleLineHeader, currentDateIndicator: this.calendarProps.currentDateIndicator, svgWidth: this.gridProps.svgWidth }), h("div", { key: '994c441039334c518f9c45bcb1b197ecc0ca5073', ref: (el) => (this.horizontalContainerRef = el), class: "horizontalContainer", style: this.ganttHeight
                 ? {
                     height: `${this.ganttHeight}px`,
                     width: `${this.gridProps.svgWidth}px`,
                 }
-                : { width: `${this.gridProps.svgWidth}px` } }, h("kup-grid-renderer", Object.assign({ key: '7444e2d31c716d88d97f50dcf85b94da6a006cae' }, newBarProps)))));
+                : { width: `${this.gridProps.svgWidth}px` } }, h("kup-grid-renderer", Object.assign({ key: 'f7b9656624c914819676bebc1891d9d388c7bfe7' }, newBarProps)))));
     }
     static get is() { return "kup-task-gantt"; }
     static get properties() {

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

@@ -7,22 +7,22 @@ export class KupTaskListHeader {
         this.rowWidth = undefined;
     }
     render() {
-        return (h("div", { key: 'c47ee384e374c179e86bd9442b9f82dfce4bfea3', class: "ganttTable", style: {
+        return (h("div", { key: '4efef768654d5ee326236b20138a45aac4428125', class: "ganttTable", style: {
                 fontFamily: this.fontFamily,
                 fontSize: this.fontSize,
-            } }, h("div", { key: '7e1276339822ecf67853a7187d64b44e1304aa80', class: "ganttTable_Header", style: {
+            } }, h("div", { key: '37faca5980c085750eb731dee64e3e3ed4a2897f', class: "ganttTable_Header", style: {
                 height: `${this.headerHeight - 2}px`,
-            } }, h("div", { key: '665a2129fd7f8d649e233844e4f2c7953d97890d', class: "ganttTable_HeaderItem", style: {
+            } }, h("div", { key: '19d84c87983e55eb0af2c5a1a0e6cb173616bea5', class: "ganttTable_HeaderItem", style: {
                 minWidth: this.rowWidth,
-            } }, "\u00A0Name"), h("div", { key: '4ae73cb9ae5389d88415457f26b42396cb0091dd', class: "ganttTable_HeaderSeparator", style: {
+            } }, "\u00A0Name"), h("div", { key: '1e5526e24c54a2b1a648df22eec6e40a5a0ec0be', class: "ganttTable_HeaderSeparator", style: {
                 height: `${this.headerHeight * 0.5}px`,
                 marginTop: `${this.headerHeight * 0.2}px`,
-            } }), h("div", { key: 'f6e6186d81268d1b9cd0a0a8738a18c76f453ffe', class: "ganttTable_HeaderItem", style: {
+            } }), h("div", { key: 'e5a506727de0d36230317b9920840ef5ac26fa9f', class: "ganttTable_HeaderItem", style: {
                 minWidth: this.rowWidth,
-            } }, "\u00A0From"), h("div", { key: '60b7a15ce2686b213ce49883b551daae9b8e0fc1', class: "ganttTable_HeaderSeparator", style: {
+            } }, "\u00A0From"), h("div", { key: '3346d2674ee3c6d75fe524b70e26166d68850cd4', class: "ganttTable_HeaderSeparator", style: {
                 height: `${this.headerHeight * 0.5}px`,
                 marginTop: `${this.headerHeight * 0.25}px`,
-            } }), h("div", { key: '7459e68a75fbb671fd837f0ba53797607b631582', class: "ganttTable_HeaderItem", style: {
+            } }), h("div", { key: '607b1f90fe2b97b614165e97c05926b2149f8e7c', class: "ganttTable_HeaderItem", style: {
                 minWidth: this.rowWidth,
             } }, "\u00A0To"))));
     }

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

@@ -22,7 +22,7 @@ export class TaskListTableDefault {
         return date.toLocaleDateString(this.locale, this.dateTimeOptions);
     }
     render() {
-        return (h("div", { key: '21221626aac5257800ec2cb4a3f5a8ac8a8ed457', class: "taskListWrapper", style: {
+        return (h("div", { key: 'e7368c350429accbf8713109fe99c73c4cb6a850', class: "taskListWrapper", style: {
                 fontFamily: this.fontFamily,
                 fontSize: this.fontSize,
             } }, this.tasks.map((task) => (h("div", { class: {

package/dist/collection/components/kup-planner/utils/kup-task-list/kup-task-list.css

@@ -131,6 +131,7 @@
   border-radius: var(--kup-radius-00);
   padding: var(--kup-space-05);
   margin-right: var(--kup-space-05);
+  min-width: 25%;
 }
 
 .taskListWrapper {

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

@@ -86,7 +86,7 @@ export class TaskList {
         if (TaskListTable && TaskListTable['$attrs$']) {
             Object.assign(TaskListTable['$attrs$'], Object.assign({}, tableProps));
         }
-        return (h("div", { key: '5b64f23e2882b1060b86c68f72b86885219fe96d', ref: (el) => (this.taskListRef = el) }, TaskListHeader && TaskListHeader['$attrs$'] ? (TaskListHeader) : (h("kup-custom-task-list-header", Object.assign({ label: this.label, doubleView: (_a = this.doubleView) !== null && _a !== void 0 ? _a : false, setDoubleView: this.setDoubleView }, headerProps))), h("div", { key: '160e599103d0a815e4363e0baeb99c27e0a804fb', class: `${this.horizontalContainerClass} ${this.scrollableTaskList ? 'horizontalContainerScrollable' : ''}`, style: this.ganttHeight
+        return (h("div", { key: 'f934b78d05a4851af330799a723b9afe0a2be36d', ref: (el) => (this.taskListRef = el) }, TaskListHeader && TaskListHeader['$attrs$'] ? (TaskListHeader) : (h("kup-custom-task-list-header", Object.assign({ label: this.label, doubleView: (_a = this.doubleView) !== null && _a !== void 0 ? _a : false, setDoubleView: this.setDoubleView }, headerProps))), h("div", { key: '0ee50961a474dac562d97548df584e98c07360fa', class: `${this.horizontalContainerClass} ${this.scrollableTaskList ? 'horizontalContainerScrollable' : ''}`, style: this.ganttHeight
                 ? { height: this.ganttHeight + 'px' }
                 : {}, ref: (el) => (this.horizontalContainerRef = el) }, TaskListTable && TaskListTable['$attrs$'] ? (TaskListTable) : (h("kup-custom-task-list-table", Object.assign({}, tableProps, { onclickTaskList: (id) => {
                 let row = getProjectById(id, this.currentTasks);

package/dist/collection/components/kup-planner/utils/kup-tooltip/kup-standard-tooltip.js

@@ -6,7 +6,7 @@ export class StandardTooltipContent {
         this.fontFamily = undefined;
     }
     render() {
-        return (h("div", { key: '089e9cfa6d9236e99b78618b1c477b4b45d68b6c', class: "tooltipDefaultContainer", style: { fontSize: this.fontSize, fontFamily: this.fontFamily } }, h("b", { key: '9f81c91ae6f981c7a1b4e012a687d02400f49c94', style: { fontSize: `${parseInt(this.fontSize) + 6}px` } }, `${this.task.name}: ${this.task.start.getDate()}-${this.task.start.getMonth() + 1}-${this.task.start.getFullYear()} - ${this.task.end.getDate()}-${this.task.end.getMonth() + 1}-${this.task.end.getFullYear()}`), this.task.end.getTime() - this.task.start.getTime() !== 0 && (h("p", { key: 'f5c5fa4c29207f403785e57e7de8d119cd20899b', class: "tooltipDefaultContainerParagraph" }, `Duration: ${~~((this.task.end.getTime() - this.task.start.getTime()) / (1000 * 60 * 60 * 24))} day(s)`)), h("p", { key: '2bbf90f106ac085ed28e8b940d92fff7b8fa86bd', class: "tooltipDefaultContainerParagraph" }, !!this.task.progress && `Progress: ${this.task.progress} %`)));
+        return (h("div", { key: '7427840d8808ed3ebbc8b57f8bd4653243a6e9a1', class: "tooltipDefaultContainer", style: { fontSize: this.fontSize, fontFamily: this.fontFamily } }, h("b", { key: '1d7aaa16b5fa91322952d235ac8a6ba90d4a3083', style: { fontSize: `${parseInt(this.fontSize) + 6}px` } }, `${this.task.name}: ${this.task.start.getDate()}-${this.task.start.getMonth() + 1}-${this.task.start.getFullYear()} - ${this.task.end.getDate()}-${this.task.end.getMonth() + 1}-${this.task.end.getFullYear()}`), this.task.end.getTime() - this.task.start.getTime() !== 0 && (h("p", { key: 'a30ef9c69dc7091d0f935d64d76ce6aa5eb32d4c', class: "tooltipDefaultContainerParagraph" }, `Duration: ${~~((this.task.end.getTime() - this.task.start.getTime()) / (1000 * 60 * 60 * 24))} day(s)`)), h("p", { key: '2cbb86c782ec3c4e87e2ddfaf2717bada396f664', class: "tooltipDefaultContainerParagraph" }, !!this.task.progress && `Progress: ${this.task.progress} %`)));
     }
     static get is() { return "kup-standard-tooltip"; }
     static get encapsulation() { return "shadow"; }

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

@@ -59,7 +59,7 @@ export class Tooltip {
         }
     }
     render() {
-        return (h("div", { key: '3f8e772f0d749ed05600ed69340b4d334f62d279', class: this.relatedX ? 'tooltipDetailsContainer' : 'tooltipDetailsContainerHidden', style: { left: `${this.relatedX}px`, top: `${this.relatedY}px` } }, h(this.TooltipContent, { key: 'f32d96505eac96da5d1a87cc3248626f408b3a35', task: this.task, fontSize: this.fontSize, fontFamily: this.fontFamily })));
+        return (h("div", { key: 'aacfee9b9521a7da47c42959ddba11cc13a2d86e', class: this.relatedX ? 'tooltipDetailsContainer' : 'tooltipDetailsContainerHidden', style: { left: `${this.relatedX}px`, top: `${this.relatedY}px` } }, h(this.TooltipContent, { key: 'c4c45b5f181e23ead0bdb3dc9b6cf5e78458cf6e', task: this.task, fontSize: this.fontSize, fontFamily: this.fontFamily })));
     }
     static get is() { return "kup-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/kup-planner/utils/kup-vertical-scroll/kup-vertical-scroll.js

@@ -31,11 +31,11 @@ export class KupVerticalScroll {
         };
     }
     render() {
-        return (h("div", { key: '941c4a3cdbf82645a714eba63f33c6a813771da4', style: {
+        return (h("div", { key: '8e3600213a2d21a94dbb232a0dd2b83c332fc093', style: {
                 height: `${this.ganttHeight}px`,
                 marginTop: `${this.headerHeight}px`,
                 marginLeft: this.rtl ? '' : '-1rem',
-            }, class: "scroll", onScroll: this.verticalScroll, ref: (el) => (this.scrollRef = el) }, h("div", { key: 'f97c24906454df30d9ec04cd8ef5081469e97dce', style: {
+            }, class: "scroll", onScroll: this.verticalScroll, ref: (el) => (this.scrollRef = el) }, h("div", { key: 'f11b5279bb0fafa024cf92df8a9960fb4fdaa8d5', style: {
                 height: `${this.ganttFullHeight}px`,
                 width: '1px',
             } })));

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

@@ -251,7 +251,7 @@ export class KupProbe {
         if (this.features.theme) {
             customStyle = this.kupManager.theme.setKupStyle(this.rootElement);
         }
-        return (h(Host, { key: 'c592bc740d203e9f767ea8297cab70d43ff24129' }, customStyle ? h("style", null, customStyle) : null, h("div", { key: '5f98fcbdd690d77ddd7f042a3753cc9b78fb30be', id: componentWrapperId }, this.content)));
+        return (h(Host, { key: '62508785a36efee2c2e6496aad81384ee7e3275d' }, customStyle ? h("style", null, customStyle) : null, h("div", { key: 'd2a02de79960d37fb1f1286b1cee4622fe6a927e', id: componentWrapperId }, this.content)));
     }
     disconnectedCallback() {
         if (this.features.language) {

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

@@ -102,7 +102,7 @@ export class KupProgressBar {
                 ? true
                 : false,
         };
-        return (h(Host, { key: '94a226fb07053cb0c122582eb5d64c3a73df2ff6' }, h("style", { key: 'debd9e375096b0c6ac1cdc333b86f07896fd91e2' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '1aceed94fc1ff58e3662f96bb5422dbb95b0af4d', id: componentWrapperId }, h(FProgressBar, Object.assign({ key: 'a34d56d8f05f35d24f0e94987bc952f466082a1f' }, props)))));
+        return (h(Host, { key: '6d16fbbce2878c135c67a4b56dbf69099904d529' }, h("style", { key: 'd60887a62fa3ef9f320d97d67458561cff1f7210' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '26cb5f5983fde587f5badcbfdc2b4355326ac484', id: componentWrapperId }, h(FProgressBar, Object.assign({ key: '31de915d7832b8109087d632cf06e94c104e7c63' }, props)))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);

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

@@ -110,7 +110,7 @@ export class KupQlik {
         layoutStyle = {
             ['--lyo_obj-height']: this.defobjsize,
         };
-        return (h("div", { key: '752b5cc4e42d65c838c7d8a58de84ff846950ef2', class: classLayout, style: layoutStyle }, this.divlist));
+        return (h("div", { key: 'f3eecc02e2348c5ecb70e5c1af65f81a70700df4', class: classLayout, style: layoutStyle }, this.divlist));
     }
     componentDidRender() {
         if (this.debug) {

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

@@ -91,7 +91,7 @@ export class KupRating {
                 : false,
             onClick: (i) => this.onKupClick(i),
         };
-        return (h(Host, { key: 'b4103ceb6f27d434447c69c8fff7572374e52d87' }, h("style", { key: 'c65cd936b7e5510718b9e2852af9ef8fac04e0b8' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'b9e228a246590a6ad05b228319846b9937aed321', id: componentWrapperId }, h(FRating, Object.assign({ key: '505d9988d34aa16060c392e8a97e15e4b72680ba' }, props)))));
+        return (h(Host, { key: 'd01ef2cfb73b3e72cb3d56ecede10cb7a2b66368' }, h("style", { key: '940e67e41bcaeb69205055ee5af1b56e3b015d1b' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'a3342415e91667c9e9f0677c2f5b79616a814f69', id: componentWrapperId }, h(FRating, Object.assign({ key: 'b9147b13dd6157a875c84042329874b72c3a9b0e' }, props)))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);

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

@@ -93,7 +93,7 @@ export class KupSnackbar {
         this.kupManager.debug.logRender(this, true);
     }
     render() {
-        return (h(Host, { key: 'b653204195546d6bbd439e2ebc25d5ec9ab1b3ce', "kup-visible": this.visible }, h("style", { key: 'c1d6ba70b405290df39ae96b2f6e58bf42adc512' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'e1c866f6a7d0f17bc4d6cb03a3ba899f4b050970', id: componentWrapperId }, h("div", { key: 'fbfca749586aef3f1b4845943002de19a5873bf9', class: snackbarClass }, h("div", { key: 'e7a4c57114b272d0eb2a398353fff322495c2a16', class: "snackbar__text__block" }, h("div", { key: 'c118ce5ceeb6170acf2ad874c106608983d0ab4b', class: `${snackbarClass}__header` }, this.header), h("div", { key: 'ca3cf0552f6373f50308d9b405ae28041ee9d276', class: `${snackbarClass}__text` }, this.text)), this.actionButton || this.closeButton ? (h("div", { class: `${snackbarClass}__buttons` }, this.actionButton ? (h("div", { class: `${snackbarClass}__action` }, h(FButton, Object.assign({}, this.actionButton, { onClick: () => this.onKupActionClick() })))) : null, this.closeButton ? (h("div", { class: `${snackbarClass}__close` }, h(FButton, { icon: "close", onClick: () => this.hide() }))) : null)) : null))));
+        return (h(Host, { key: '8e339635552d6add69225e0ecce153e8ec0a73b4', "kup-visible": this.visible }, h("style", { key: 'f6dd4e5705b8d2ec000c3e03e4cbbeb255825b29' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '025c173a39f349077790152a5c7c5b9cb3347cbd', id: componentWrapperId }, h("div", { key: '74223c5b382fa92880eaa5cfaef625f50b1a6b8f', class: snackbarClass }, h("div", { key: 'e9d6d1b71ed306cf1cf331957a5348fc2707fcda', class: "snackbar__text__block" }, h("div", { key: '24007c50fca61e04b98bb814b3610f161b404bfb', class: `${snackbarClass}__header` }, this.header), h("div", { key: 'b57401a3b251ca6df47161aa0137850ee6c32ea9', class: `${snackbarClass}__text` }, this.text)), this.actionButton || this.closeButton ? (h("div", { class: `${snackbarClass}__buttons` }, this.actionButton ? (h("div", { class: `${snackbarClass}__action` }, h(FButton, Object.assign({}, this.actionButton, { onClick: () => this.onKupActionClick() })))) : null, this.closeButton ? (h("div", { class: `${snackbarClass}__close` }, h(FButton, { icon: "close", onClick: () => this.hide() }))) : null)) : null))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);

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

@@ -96,59 +96,59 @@ export class KupSpinner {
             spinnerClass = 'spinner-v' + this.layout;
             if (this.layout === 7) {
                 spinnerEl = [
-                    h("div", { key: '976b54b2682a715ab838bafbd9efc5980f5212f3', class: "sk-spinner-v7-dot" }),
-                    h("div", { key: '6f97965d76d494469a6878ae72d747d5e18c70ea', class: "sk-spinner-v7-dot" }),
-                    h("div", { key: '4554ce59f9992eb41837eb1a5bb3e1658105c503', class: "sk-spinner-v7-dot" }),
-                    h("div", { key: 'a37de45a0684574dea995fe18cb5a816d776c8b4', class: "sk-spinner-v7-dot" }),
-                    h("div", { key: 'ef5cced1953be2c018b9114708e8cf0181d2ec10', class: "sk-spinner-v7-dot" }),
-                    h("div", { key: '2a4b5616f967c538fd97df2ae36796f43ee49d42', class: "sk-spinner-v7-dot" }),
+                    h("div", { key: '90da4bea524d6ae49bd7590b099d7af5bce8c4bc', class: "sk-spinner-v7-dot" }),
+                    h("div", { key: 'f625f8a469c687a328dec11def5481b47dfdc6b2', class: "sk-spinner-v7-dot" }),
+                    h("div", { key: 'fce31054830c273aceb9fe0a186daed290319d07', class: "sk-spinner-v7-dot" }),
+                    h("div", { key: '18b89c2a7b927b07a03a6aa374cc6dc9d22d5c2c', class: "sk-spinner-v7-dot" }),
+                    h("div", { key: '454dd58c7c1f2a51dcf3891198aa9108d3240347', class: "sk-spinner-v7-dot" }),
+                    h("div", { key: '5787a5461b543828af41373b963fc2c3c984d848', class: "sk-spinner-v7-dot" }),
                 ];
             }
             if (this.layout === 9) {
                 spinnerEl = [
-                    h("div", { key: 'f2688905d587fb4444ab0e6999f0f4cf0699cb8a', class: "sk-spinner-v9-bounce1" }),
-                    h("div", { key: 'e22161a648cb24d4b013728d45836b639ebfc0a4', class: "sk-spinner-v9-bounce2" }),
+                    h("div", { key: '3b44a114e62bcfa99acb7fd583ebee257c75477d', class: "sk-spinner-v9-bounce1" }),
+                    h("div", { key: '1ac2ee154b6db501a95dcb6b9bd84d9eabea213a', class: "sk-spinner-v9-bounce2" }),
                 ];
             }
             if (this.layout === 10) {
                 spinnerEl = [
-                    h("div", { key: 'de5e7cecb6e8b59a8e3a6113f8a0baffdcf05fe6', class: "sk-spinner-v10-cube1" }),
-                    h("div", { key: 'ab1947c193732753b345245c1bbd64f097a412a8', class: "sk-spinner-v10-cube2" }),
+                    h("div", { key: 'd0be49dd982f4f40197f23c758526bfc9b769991', class: "sk-spinner-v10-cube1" }),
+                    h("div", { key: '177788b950edddfb35643e46d871137532aeeb9d', class: "sk-spinner-v10-cube2" }),
                 ];
             }
             if (this.layout === 12) {
                 spinnerEl = [
-                    h("div", { key: '45fd80cfa818b4df9c1bf47a977a69c453e31507', class: "sk-spinner-v12-dot1" }),
-                    h("div", { key: 'e5fb43b9dc6a9867ee0b1fd201c3d2027f004fb7', class: "sk-spinner-v12-dot2" }),
+                    h("div", { key: '19e8c36f13d2c0eeb6a8ad24515a24a2e1cecfde', class: "sk-spinner-v12-dot1" }),
+                    h("div", { key: 'b8ac14d003d7f601437e223c72dfd59ff9954367', class: "sk-spinner-v12-dot2" }),
                 ];
             }
             if (this.layout === 13) {
                 spinnerEl = [
-                    h("div", { key: '310fd685b049d989574d7f31549838e12e669178', class: "sk-spinner-v13-cube sk-spinner-v13-cube1" }),
-                    h("div", { key: '45137e0118a81bad85cc2f16eb2d31778d1e9b8b', class: "sk-spinner-v13-cube sk-spinner-v13-cube2" }),
-                    h("div", { key: 'c690e6ba0b9392f5c6a7b60b797cf4abf663ffc5', class: "sk-spinner-v13-cube sk-spinner-v13-cube3" }),
-                    h("div", { key: '97c85f44fe97ca977bc8dd4d1418492d089b9d51', class: "sk-spinner-v13-cube sk-spinner-v13-cube4" }),
-                    h("div", { key: '287cf4c52ebf89f12e62e0f48f0caccbaa0d8ee5', class: "sk-spinner-v13-cube sk-spinner-v13-cube5" }),
-                    h("div", { key: '2fa436ad3f69f97a03b081fe9b747a14f831383a', class: "sk-spinner-v13-cube sk-spinner-v13-cube6" }),
-                    h("div", { key: '0ae6a6078cc9f2f34f9f6da9993e495a43afd931', class: "sk-spinner-v13-cube sk-spinner-v13-cube7" }),
-                    h("div", { key: '5cd676903937f21ab94bb8c5ad7677eef991699c', class: "sk-spinner-v13-cube sk-spinner-v13-cube8" }),
-                    h("div", { key: '307607fef550cd5b9c3d0a436bfe87cace057fd6', class: "sk-spinner-v13-cube sk-spinner-v13-cube9" }),
+                    h("div", { key: '0b4a4e591c6ca25e85170fb004f324822f050135', class: "sk-spinner-v13-cube sk-spinner-v13-cube1" }),
+                    h("div", { key: '668a13a54d0e383977bed6f32e95e3f1dd78285f', class: "sk-spinner-v13-cube sk-spinner-v13-cube2" }),
+                    h("div", { key: 'd2792cde124ce31a812d9b8c169b83de6e078dc2', class: "sk-spinner-v13-cube sk-spinner-v13-cube3" }),
+                    h("div", { key: '3fc0b2ba9eebddfc0c1be20cd3e958fdfb86d123', class: "sk-spinner-v13-cube sk-spinner-v13-cube4" }),
+                    h("div", { key: '3269b799012c027a320bff8256aa846223c3c213', class: "sk-spinner-v13-cube sk-spinner-v13-cube5" }),
+                    h("div", { key: '9d932019c87435a325307b9c3ca11441a3f8d2c2', class: "sk-spinner-v13-cube sk-spinner-v13-cube6" }),
+                    h("div", { key: 'e29e2d7a8f7092f03893c4654577a6636bca5ddc', class: "sk-spinner-v13-cube sk-spinner-v13-cube7" }),
+                    h("div", { key: '9ec5c8fc4a18283180a5e98c63b796e2c06bd00c', class: "sk-spinner-v13-cube sk-spinner-v13-cube8" }),
+                    h("div", { key: 'b7976b9cdbbdb933316448e6c5cd72c4d9492026', class: "sk-spinner-v13-cube sk-spinner-v13-cube9" }),
                 ];
             }
             if (this.layout === 14) {
                 spinnerEl = [
-                    h("div", { key: '042ef293a7573f83c76535f634ebcb7319884f3f', class: "sk-spinner-v14-circle1 sk-spinner-v14-circle" }),
-                    h("div", { key: '5a77f4c8c353a8840bf06a095dbc15dcd879d736', class: "sk-spinner-v14-circle2 sk-spinner-v14-circle" }),
-                    h("div", { key: 'f3a44ea237aa823810d13c98c179423d97d6c6cf', class: "sk-spinner-v14-circle3 sk-spinner-v14-circle" }),
-                    h("div", { key: '67f40d832beb253392d0a239128bab310b80bf38', class: "sk-spinner-v14-circle4 sk-spinner-v14-circle" }),
-                    h("div", { key: '1272b2dcee5c8b2c53720eb811781a19f11b7e55', class: "sk-spinner-v14-circle5 sk-spinner-v14-circle" }),
-                    h("div", { key: '7af652d0b2c5bc4804db9261ea18030764b2b3ce', class: "sk-spinner-v14-circle6 sk-spinner-v14-circle" }),
-                    h("div", { key: '534a436998a31e8b348fe62f52a9429b57875cfd', class: "sk-spinner-v14-circle7 sk-spinner-v14-circle" }),
-                    h("div", { key: '85002b71e7d36bfe9a71314db726ad457d968625', class: "sk-spinner-v14-circle8 sk-spinner-v14-circle" }),
-                    h("div", { key: '214b749d60eb94eafea8dba46231f3201c7cb2e9', class: "sk-spinner-v14-circle9 sk-spinner-v14-circle" }),
-                    h("div", { key: 'bbb3b65e6f6a284a9f3a8ed2f61d644d27930246', class: "sk-spinner-v14-circle10 sk-spinner-v14-circle" }),
-                    h("div", { key: 'e8393696699a1646751c64300c80179d5709c2ba', class: "sk-spinner-v14-circle11 sk-spinner-v14-circle" }),
-                    h("div", { key: '9828fdeed7750814c6900de4fb6b9081f0466594', class: "sk-spinner-v14-circle12 sk-spinner-v14-circle" }),
+                    h("div", { key: '43f703d9d094ba069b5bb02e92c9e74711828df1', class: "sk-spinner-v14-circle1 sk-spinner-v14-circle" }),
+                    h("div", { key: '82f2d547b8de3da9acd78f6ec69c6b5a67261e93', class: "sk-spinner-v14-circle2 sk-spinner-v14-circle" }),
+                    h("div", { key: 'a5e3f0d7d0ae729c4066fb0a64096b3021ed1c45', class: "sk-spinner-v14-circle3 sk-spinner-v14-circle" }),
+                    h("div", { key: '9e657fea86ab17b86ff5cc637597ca0501fea0a3', class: "sk-spinner-v14-circle4 sk-spinner-v14-circle" }),
+                    h("div", { key: '0f11f4fa9e91ad5265672903255fc07dfb08b07a', class: "sk-spinner-v14-circle5 sk-spinner-v14-circle" }),
+                    h("div", { key: '4dcec3ed2bc03228dfeca88976241e83d0210881', class: "sk-spinner-v14-circle6 sk-spinner-v14-circle" }),
+                    h("div", { key: 'a20a89d5a2d0d47bba54c9bb0c932e9e39c43c88', class: "sk-spinner-v14-circle7 sk-spinner-v14-circle" }),
+                    h("div", { key: '8061fd589444079388c88eff984b7d4c0e210fb6', class: "sk-spinner-v14-circle8 sk-spinner-v14-circle" }),
+                    h("div", { key: '27e9567b83cfd945abfa32f847dd80f7f71cf475', class: "sk-spinner-v14-circle9 sk-spinner-v14-circle" }),
+                    h("div", { key: '49d6b3a4f7bdbf78e99933a24fff7afc9126db63', class: "sk-spinner-v14-circle10 sk-spinner-v14-circle" }),
+                    h("div", { key: 'd870a887d28416a702279fbb2b84a73ef133d9c9', class: "sk-spinner-v14-circle11 sk-spinner-v14-circle" }),
+                    h("div", { key: '0e193a5bfc7a08c3cd8d82da2e36c0f319215125', class: "sk-spinner-v14-circle12 sk-spinner-v14-circle" }),
                 ];
             }
         }
@@ -167,7 +167,7 @@ export class KupSpinner {
         else {
             elStyle = Object.assign(Object.assign({}, elStyle), { fontSize: '3px' });
         }
-        return (h(Host, { key: 'af30b293984ca1b3c40dd167a912ad00b2007a56', style: elStyle }, h("style", { key: '7b94db80070e95446b4fff8a91a3f9742a351008' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '0149ef208e38c49a1be20646b94e1a41fc28d1bc', id: componentWrapperId, style: elStyle }, h("div", { key: '9d126f87c3802d0016b40519a6a22b2115bacb4b', id: "loading-wrapper-master", class: masterClass, style: elStyle }, h("div", { key: '5324ae5919c9f59936ab2997924f5b1186ae0c1a', id: wrapperClass, style: elStyle }, h("div", { key: 'e927477d73c687fda3280dda70b8eb3a871a609e', class: spinnerClass }, spinnerEl))))));
+        return (h(Host, { key: '047cf91e1b91090b19b9e07e8d3ed5c9e93c9b01', style: elStyle }, h("style", { key: 'c28e4baa877428442fc12ef9908ed9e3ee606e9e' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '85c8bbcacfd075b9c3a4a16074a95df1a7773f23', id: componentWrapperId, style: elStyle }, h("div", { key: '12e7ab8754db6191ec050c32ec228df99bb2c33e', id: "loading-wrapper-master", class: masterClass, style: elStyle }, h("div", { key: '7a05138502bf991b2e72e8013712f51174bd1b50', id: wrapperClass, style: elStyle }, h("div", { key: '3bccdb4bb8beefd999fbdfbb86440e0999575819', class: spinnerClass }, spinnerEl))))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);

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

@@ -123,7 +123,7 @@ export class KupSwitch {
             onChange: () => this.onKupChange(),
             onFocus: () => this.onKupFocus(),
         };
-        return (h(Host, { key: 'ea19dd0ea5069a82bd9270c9dd1fa24e6476a3aa' }, h("style", { key: '2ed2f86ad8b599a714bb7e913bd291c5fa931a21' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '212cf3d8648f188252a2975595f2c6cf741c5758', id: componentWrapperId }, h(FSwitch, Object.assign({ key: '85f9c14e7c7dd8f5df209cd6ba6f10e2794a3405' }, props)))));
+        return (h(Host, { key: '89225ee1836608a0274bbf05d86b8673345b34b1' }, h("style", { key: 'e19f9784414d547d630c24a46a2e40e6d4c1dec6' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '621a69e22881473c900fa8874e9b06a47a4e7a18', id: componentWrapperId }, h(FSwitch, Object.assign({ key: '6318405dd07e72597071f86e79985b475eaf3a58' }, props)))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);

package/dist/collection/components/kup-text-field/kup-text-field-declarations.js

@@ -22,6 +22,7 @@ export var KupTextFieldProps;
     KupTextFieldProps["integers"] = "Number of integers (should be used when inputType is number).";
     KupTextFieldProps["isClearable"] = "Enables a clear trailing icon.";
     KupTextFieldProps["label"] = "When set, its content will be shown as a label.";
+    KupTextFieldProps["labelHelper"] = "When set, the label will be accompanied by a helper text displayed on hover.";
     KupTextFieldProps["leadingLabel"] = "When set to true, the label will be on the left of the component.";
     KupTextFieldProps["max"] = "The HTML max attribute specifies the maximum value for the input element. Works with the following input types: number, range, date, datetime-local, month, time and week.";
     KupTextFieldProps["maxLength"] = "When set, the helper will display a character counter.";

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

@@ -7,14 +7,14 @@ var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (
 };
 var _KupTextField_instances, _KupTextField_getValueForOutput, _KupTextField_setValueFromEventTaget;
 import { forceUpdate, h, Host, } from "@stencil/core";
-import { kupManagerInstance, } from "../../managers/kup-manager/kup-manager";
 import { FTextField } from "../../f-components/f-text-field/f-text-field";
 import { FTextFieldMDC } from "../../f-components/f-text-field/f-text-field-mdc";
-import { KupComponentSizing, } from "../../types/GenericTypes";
-import { KupTextFieldProps, } from "./kup-text-field-declarations";
 import { KupDebugCategory } from "../../managers/kup-debug/kup-debug-declarations";
+import { kupManagerInstance, } from "../../managers/kup-manager/kup-manager";
+import { KupComponentSizing, } from "../../types/GenericTypes";
 import { getProps, setProps } from "../../utils/utils";
 import { componentWrapperId } from "../../variables/GenericVariables";
+import { KupTextFieldProps, } from "./kup-text-field-declarations";
 export class KupTextField {
     constructor() {
         _KupTextField_instances.add(this);
@@ -44,6 +44,7 @@ export class KupTextField {
         this.integers = null;
         this.isClearable = false;
         this.label = null;
+        this.labelHelper = '';
         this.lightMode = false;
         this.leadingLabel = false;
         this.max = null;
@@ -290,6 +291,7 @@ export class KupTextField {
             integers: this.integers,
             isClearable: this.isClearable,
             label: this.label,
+            labelHelper: this.labelHelper,
             leadingLabel: this.leadingLabel,
             lightMode: this.lightMode,
             max: this.max,
@@ -330,7 +332,7 @@ export class KupTextField {
             onMinusClick: (e) => this.onKupMinusClick(e),
             onPlusClick: (e) => this.onKupPlusClick(e),
         };
-        return (h(Host, { key: '78c6d41ec0ff12730f8abcf90569a4aae871c5ff' }, h("style", { key: '7668f0dba74f1e1818e1f08459fbf2ee395aab85' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'b7746c8c0075b18e84d3f7f6d93dfbe604c06446', id: componentWrapperId }, h(FTextField, Object.assign({ key: 'fcf370d0278c428d62ddbb9bf153001c4467a2c7' }, props)))));
+        return (h(Host, { key: '40071a3423f0b7bc9e69dff91af306643fb7a185' }, h("style", { key: '9bcc0c7b122867bff027c2ad275932296ff7ebcf' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'c0c3353a2d4e12596a8565e4a990f35eda93f1fb', id: componentWrapperId }, h(FTextField, Object.assign({ key: '33605938b1d3bc2b8beb61b30a1a7b0b62296f50' }, props)))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);
@@ -793,6 +795,27 @@ export class KupTextField {
                 "reflect": false,
                 "defaultValue": "null"
             },
+            "labelHelper": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "\"\""
+                        }],
+                    "text": "When set, the label will be accompanied by a helper text displayed on hover."
+                },
+                "attribute": "label-helper",
+                "reflect": false,
+                "defaultValue": "''"
+            },
             "lightMode": {
                 "type": "boolean",
                 "mutable": false,

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

@@ -431,7 +431,7 @@ export class KupTimePicker {
         this.kupManager.debug.logRender(this, true);
     }
     render() {
-        return (h(Host, { key: '3076db3f1376031b4cb23a9fdd71ff1a6ae1ebbf' }, h("style", { key: '2fe19b8ed79d27303cd9960bafecc84398dacfd6' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '26fa259fac1072c29b5602cdccfff9583c247ebc', id: componentWrapperId }, this.prepTextfield(this.getTimeForOutput()))));
+        return (h(Host, { key: '65f19ff4be56ba56c32b8620dece6485f90439e2' }, h("style", { key: 'f62b3c946c6a7c69b9890afcc1ac7301c75af349' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'b614dc8e91eed4693617300fa4aa072796465918', id: componentWrapperId }, this.prepTextfield(this.getTimeForOutput()))));
     }
     disconnectedCallback() {
         this.kupManager.dates.unregister(this);

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

@@ -74,7 +74,7 @@ export class KupTxt {
     }
     render() {
         const value = this.getValue();
-        return (h(Host, { key: '1c0356b5a02e4c88d78c74e655c6a043b5602a17' }, h("style", { key: 'b0c2a816fb4b6691fb257aca099758f46c523a42' }, __classPrivateFieldGet(this, _KupTxt_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '3cea9ef7a7dedacebec373ad03c351cc5c572d55', id: componentWrapperId }, h("div", { key: 'e984a2152cf277fbffc8c56f20c6071d51a72f6c', innerHTML: value }))));
+        return (h(Host, { key: '5f57a6c37836e641e03eebf555bee29cdc3e5bee' }, h("style", { key: '573b5bbf0370db31925a2610296a40feeb246586' }, __classPrivateFieldGet(this, _KupTxt_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '5b980450092ef3310be8f8fa427de7ba2c9dd05c', id: componentWrapperId }, h("div", { key: '73fe2f90e040d253f3a9e73466e038cd6a7346f2', innerHTML: value }))));
     }
     disconnectedCallback() {
         __classPrivateFieldGet(this, _KupTxt_kupManager, "f").theme.unregister(this);

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

@@ -235,7 +235,7 @@ export class KupTypography {
         const classObjParent = {
             'kup-typography--wrap': props.toolbar ? true : false,
         };
-        return (h(Host, { key: 'c5d8e8fcf53195019ed8eb416a7c8cfd7813ab0e' }, h("style", { key: '07fed1c7720f43b7a724233e7a19d543c2a60699' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '43db23c1f58b6ed0282391c596ed0eaa5548cb94', id: componentWrapperId, class: classObjParent, onClick: () => this.onKupClick }, h(FTypography, Object.assign({ key: '9d95e2e961712881fae7b45be28fa269cc56386b' }, props)), this.infoIcon && (h(FImage, Object.assign({ key: 'f2317403424f44fd48fc5f639df0df2f07c130e3' }, infoIcon, { onClick: async (event) => {
+        return (h(Host, { key: 'a796fb665c5b6a0f9469cae8705d09a4055fefb8' }, h("style", { key: 'eb211372a21a52103910b3b4e431bced88a462a8' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'b8e99aabf408426c5580d460ec5e6d7334742393', id: componentWrapperId, class: classObjParent, onClick: () => this.onKupClick }, h(FTypography, Object.assign({ key: '59524a232931c198d4134675d0cff1ab329e5075' }, props)), this.infoIcon && (h(FImage, Object.assign({ key: 'b2c434102df3058f07eb464c09ab513259a49974' }, infoIcon, { onClick: async (event) => {
                 event.stopPropagation();
                 const el = event.currentTarget;
                 const data = await this.infoCallBack();
@@ -246,7 +246,7 @@ export class KupTypography {
                 else {
                     this.kupManager.debug.logMessage(this, 'Toolbar data is empty, not opening dropdown.');
                 }
-            } }))), this.toolbar && (h(FImage, Object.assign({ key: '1d86fd2d64f3d833d0186e34a57f1cc8ce74a1b5' }, toolbarIcon, { onClick: async (event) => {
+            } }))), this.toolbar && (h(FImage, Object.assign({ key: '2fd02b52d80376072e8c40deec1c393bf1b4a2cf' }, toolbarIcon, { onClick: async (event) => {
                 event.stopPropagation();
                 const el = event.currentTarget;
                 const data = await this.toolbarCallback();

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

@@ -160,7 +160,7 @@ export class KupTypographyList {
     }
     render() {
         const typograhy = this.renderTypographys();
-        return (h(Host, { key: '455e867cfc1084e4a9e43c9fc942f915797e483e' }, h("style", { key: '40f69eebfc2d6fe963cfbcde32f2934b081e32aa' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '0ad09d552afcf0920cdfb1276dbd8163c1b3224e', id: componentWrapperId }, h("div", { key: 'b584680579806a2361d2418f408d898923b057dc', class: "typographies-wrapper" }, typograhy))));
+        return (h(Host, { key: 'dfc7f97e2ec1b02bb6fada06eaf886ed0077f0b5' }, h("style", { key: '701a165da1e689cd5827aa4d8dfdcc7715e711f3' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '5a39d46931703da7d0a5341b4cb0d00660715050', id: componentWrapperId }, h("div", { key: 'a9c64db46bb31d4aa67140eee1f37ef02c7029c2', class: "typographies-wrapper" }, typograhy))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);

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

@@ -202,6 +202,7 @@ const mapData = (cell, column) => {
         [FCellTypes.CHECKBOX, MainCHKAdapter.bind(this)],
         [FCellTypes.OBJECT, MainObjectAdapter.bind(this)],
         [FCellTypes.CHIP, MainCHIAdapter.bind(this)],
+        [FCellTypes.FILE_UPLOAD, MainFUPAdapter.bind(this)],
     ]);
     const adapter = dataAdapterMap.get(cellType);
     return adapter ? adapter(options, fieldLabel, currentValue, cell) : null;
@@ -246,6 +247,9 @@ const MainCMBandACPAdapter = (options, fieldLabel, currentValue, cell, _id) => {
         return Object.assign(Object.assign({}, configCMBandACP), cell.data);
     }
 };
+export const MainFUPAdapter = (_options, _fieldLabel, currentValue, cell) => {
+    return Object.assign(Object.assign({}, cell.data), { pathString: currentValue });
+};
 const optionsTreeComboAdapter = (options, currentValue) => {
     const adapter = optionsAdapterMap.get(options.type);
     if (adapter) {
@@ -643,7 +647,7 @@ function setKupCell(cellType, classObj, subcomponentProps, cell, row, column, pr
             if (isAutoCentered(props)) {
                 classObj[FCellClasses.C_CENTERED] = true;
             }
-            const buttonProps = Object.assign({ label: cell.value, icon: cell.icon, placeholderIcon: cell.placeholderIcon }, subcomponentProps);
+            const buttonProps = Object.assign({ label: cell.value, icon: cell.icon, placeholderIcon: cell.placeholderIcon, title: column.title }, subcomponentProps);
             return (h(FButton, Object.assign({}, buttonProps, { onClick: (e) => cellEvent(e, props, cellType, FCellEvents.CLICK) })));
         case FCellTypes.BUTTON_LIST:
             if (isAutoCentered(props)) {

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

@@ -24,5 +24,5 @@ export const FCheckbox = (props) => {
         sizeY: '1.15em',
         wrapperClass: 'kup-icon',
     };
-    return (h("div", Object.assign({ class: `f-checkbox ${props.danger ? 'kup-danger' : ''} ${props.error ? 'checkbox--error' : ''} ${props.info ? 'kup-info' : ''} ${props.secondary ? 'kup-secondary' : ''} ${props.success ? 'kup-success' : ''} ${props.warning ? 'kup-warning' : ''} ${props.wrapperClass ? props.wrapperClass : ''}` }, props.dataSet, { id: props.id, title: props.title }), h("div", { class: `form-field ${props.leadingLabel ? 'form-field--align-end' : ''}` }, h("div", { class: classObj }, h("input", Object.assign({ type: "checkbox", class: "checkbox__native-control", checked: props.checked, disabled: props.disabled, onBlur: props.onBlur, onChange: props.onChange, onFocus: props.onFocus }, indeterminateAttr, { value: props.checked ? 'on' : 'off' })), h("div", { class: "checkbox__background", onClick: props.onChange }, h("svg", { class: "checkbox__checkmark", viewBox: "0 0 24 24" }, h("path", { class: "checkbox__checkmark-path", fill: "none", d: "M1.73,12.91 8.1,19.28 22.79,4.59" })), h("div", { class: "checkbox__mixedmark" }))), props.label ? (h("label", { htmlFor: props.id, onClick: props.onChange }, props.label)) : undefined), props.error ? (h("div", { class: "checkbox__error-message" }, h(FImage, Object.assign({}, propsFImage)), props.error)) : props.alert ? (h("div", { class: "checkbox__alert-message" }, h(FImage, Object.assign({}, propsFImage)), props.alert)) : undefined));
+    return (h("div", Object.assign({ class: `f-checkbox ${props.danger ? 'kup-danger' : ''} ${props.error ? 'checkbox--error' : ''} ${props.info ? 'kup-info' : ''} ${props.secondary ? 'kup-secondary' : ''} ${props.success ? 'kup-success' : ''} ${props.warning ? 'kup-warning' : ''} ${props.wrapperClass ? props.wrapperClass : ''}` }, props.dataSet, { id: props.id, title: props.title }), h("div", { class: `form-field ${props.leadingLabel ? 'form-field--align-end' : ''}` }, h("div", { class: classObj }, h("input", Object.assign({ id: `${props.id}_inputEl`, type: "checkbox", class: "checkbox__native-control", checked: props.checked, disabled: props.disabled, onBlur: props.onBlur, onChange: props.onChange, onFocus: props.onFocus }, indeterminateAttr, { value: props.checked ? 'on' : 'off' })), h("div", { class: "checkbox__background", onClick: props.onChange }, h("svg", { class: "checkbox__checkmark", viewBox: "0 0 24 24" }, h("path", { class: "checkbox__checkmark-path", fill: "none", d: "M1.73,12.91 8.1,19.28 22.79,4.59" })), h("div", { class: "checkbox__mixedmark" }))), props.label ? (h("label", { htmlFor: `${props.id}_inputEl` }, props.label)) : undefined), props.error ? (h("div", { class: "checkbox__error-message" }, h(FImage, Object.assign({}, propsFImage)), props.error)) : props.alert ? (h("div", { class: "checkbox__alert-message" }, h(FImage, Object.assign({}, propsFImage)), props.alert)) : undefined));
 };

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

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 import { FChipStyling, FChipType, } from "../f-chip/f-chip-declarations";
 import { FImage } from "../f-image/f-image";
-import { KupThemeIconValues, } from "../../managers/kup-theme/kup-theme-declarations";
+import { KupThemeIconValues } from "../../managers/kup-theme/kup-theme-declarations";
 import { KupLanguageGeneric } from "../../managers/kup-language/kup-language-declarations";
 import { ItemsDisplayMode } from "../../components/kup-list/kup-list-declarations";
 import { getIdOfItemByDisplayMode } from "../../components/kup-list/kup-list-helper";

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

@@ -77,19 +77,21 @@ function createIcon(icon, color, iconClass = 'f-image__icon') {
 function createImage(props) {
     return (h("img", { class: props.placeholderResource ? HIDDEN_CLASS : '', onLoad: (e) => {
             const img = e.currentTarget;
-            const placeholder = img.parentElement.querySelector('.f-image__placeholder');
-            const iconWrapper = img.parentElement.querySelector('.iconWrapper');
-            const fWrapper = img.parentElement.parentElement.querySelector('.f-image');
-            if (props.onLoad) {
-                props.onLoad(e);
-            }
-            if (placeholder) {
-                placeholder.classList.add(HIDDEN_CLASS);
-                img.classList.remove(HIDDEN_CLASS);
-            }
-            if (iconWrapper) {
-                iconWrapper.classList.add(HIDDEN_CLASS);
-                fWrapper.classList.add('noIcon');
+            if (img && img.parentElement) {
+                const placeholder = img.parentElement.querySelector('.f-image__placeholder');
+                const iconWrapper = img.parentElement.querySelector('.iconWrapper');
+                const fWrapper = img.parentElement.parentElement.querySelector('.f-image');
+                if (props.onLoad) {
+                    props.onLoad(e);
+                }
+                if (placeholder) {
+                    placeholder.classList.add(HIDDEN_CLASS);
+                    img.classList.remove(HIDDEN_CLASS);
+                }
+                if (iconWrapper) {
+                    iconWrapper.classList.add(HIDDEN_CLASS);
+                    fWrapper.classList.add('noIcon');
+                }
             }
         }, onError: (e) => {
             const img = e.currentTarget;
@@ -125,13 +127,14 @@ function createBar(data) {
         }
         const stepId = 'step-' + i;
         const stepClass = 'css-step bottom-aligned';
+        const withPercentage = Number(data[i].width.replace(/%$/, '')) - leftProgression;
         const stepStyle = {
             backgroundColor: data[i].color,
             left: leftProgression + '%',
             height: data[i].height,
-            width: data[i].width,
+            width: withPercentage + '%',
         };
-        leftProgression += parseFloat(data[i].width);
+        leftProgression += withPercentage;
         drawStep = (h("span", { id: stepId, class: stepClass, style: stepStyle }));
         steps.push(drawStep);
     }

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

@@ -1,4 +1,4 @@
-import { Fragment, h } from "@stencil/core";
+import { h } from "@stencil/core";
 import { getParsedElements } from "../../utils/label-utils";
 import { getGCellStyle } from "../../utils/g-cell-style-generator";
 function getVNodes(parsedElements) {
@@ -12,10 +12,7 @@ export const FLabel = ({ text, classes }) => {
     const parsedElements = getParsedElements(text);
     // To avoid creating unnecessary span in the text
     // when there are no tags to format the content
-    if (parsedElements.find((p) => p.tag !== undefined)) {
-        return h("span", { class: classes }, getVNodes(parsedElements));
-    }
-    else {
-        return h(Fragment, null, text);
-    }
+    return (h("span", { class: classes }, parsedElements.find((p) => p.tag !== undefined)
+        ? getVNodes(parsedElements)
+        : text));
 };