@sme.up/ketchup 9.6.3 → 9.6.5

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: '359be367c94c07c33890de1ed3b603841761c936', class: "sk-spinner-v7-dot" }),
-                    h("div", { key: 'dd610e61f79f4fb3bf3a75b2f8033a3de9059e57', class: "sk-spinner-v7-dot" }),
-                    h("div", { key: 'fd2a76c433135c56f8f7ff01e33c175813c2a843', class: "sk-spinner-v7-dot" }),
-                    h("div", { key: '100a69fbea8fae1b420d9dc67d3762cd06951232', class: "sk-spinner-v7-dot" }),
-                    h("div", { key: 'fcd6789d7c97391b519ac9adffd2d86cd8392c5f', class: "sk-spinner-v7-dot" }),
-                    h("div", { key: '0dabff76162459dfebd5dac161e01c27478bf312', class: "sk-spinner-v7-dot" }),
+                    h("div", { key: 'dec18ff5da6e447ef0a88748af4ba69876433347', class: "sk-spinner-v7-dot" }),
+                    h("div", { key: '622999cb044516e25647e295acaae27633a8bee4', class: "sk-spinner-v7-dot" }),
+                    h("div", { key: '9c4123cd6c450454f8834aa54fc6d9d0fd152cb3', class: "sk-spinner-v7-dot" }),
+                    h("div", { key: '2cf01d336aebb720a588b64b97b372aef7f61f5f', class: "sk-spinner-v7-dot" }),
+                    h("div", { key: '7a871149a9869d035a19f33c29bb743051547bc9', class: "sk-spinner-v7-dot" }),
+                    h("div", { key: 'eef22904455b6dc3def9ee7f93f6d2907b2e6779', class: "sk-spinner-v7-dot" }),
                 ];
             }
             if (this.layout === 9) {
                 spinnerEl = [
-                    h("div", { key: '6097993bc339582792e4ba872d49618337297d31', class: "sk-spinner-v9-bounce1" }),
-                    h("div", { key: '77d72d881258fe5ef3f852b5f566899e326baab4', class: "sk-spinner-v9-bounce2" }),
+                    h("div", { key: '508d469d81d31c69ae6ac0414b65d25793fa2cc6', class: "sk-spinner-v9-bounce1" }),
+                    h("div", { key: 'b7035400b3171be8af748564b90567a6af521a9e', class: "sk-spinner-v9-bounce2" }),
                 ];
             }
             if (this.layout === 10) {
                 spinnerEl = [
-                    h("div", { key: 'f6b6405c20f8e4545a1d1fb76b4c282614055b90', class: "sk-spinner-v10-cube1" }),
-                    h("div", { key: '439ccf9e4679b9f84d9c2d5d78de3f4fefa29d9b', class: "sk-spinner-v10-cube2" }),
+                    h("div", { key: 'c63bfed904f73228827666b23dd84cb5eb25cfe4', class: "sk-spinner-v10-cube1" }),
+                    h("div", { key: '3485e52f1019a3bf313d40db97623a4f2df75756', class: "sk-spinner-v10-cube2" }),
                 ];
             }
             if (this.layout === 12) {
                 spinnerEl = [
-                    h("div", { key: '0560fbe74edcd2cc7e2669f0d2e8694e4f7d024a', class: "sk-spinner-v12-dot1" }),
-                    h("div", { key: '6c3d65e391c185581cdd937dc6d1018a8cab1f05', class: "sk-spinner-v12-dot2" }),
+                    h("div", { key: '9c45d4d1a45d63f26fc54128150a811ee68ebbff', class: "sk-spinner-v12-dot1" }),
+                    h("div", { key: '2c5d61ccfab2caeaea818c16233d8f679b186a01', class: "sk-spinner-v12-dot2" }),
                 ];
             }
             if (this.layout === 13) {
                 spinnerEl = [
-                    h("div", { key: '69b86ac19c0a5514784603f30a5d1894fc75801b', class: "sk-spinner-v13-cube sk-spinner-v13-cube1" }),
-                    h("div", { key: '00d221803e1466b85e1b679bf5ec1c898dc1b9aa', class: "sk-spinner-v13-cube sk-spinner-v13-cube2" }),
-                    h("div", { key: '5194a1c883a16a0a15ce430c05dc89f0e4d7d818', class: "sk-spinner-v13-cube sk-spinner-v13-cube3" }),
-                    h("div", { key: '06997f1b7f6dc4c7d9fed22536cd7b1bb4def915', class: "sk-spinner-v13-cube sk-spinner-v13-cube4" }),
-                    h("div", { key: '9645b92f0840866b75f08087860cd7df3ad9189c', class: "sk-spinner-v13-cube sk-spinner-v13-cube5" }),
-                    h("div", { key: '062757580932383e18ed19dff2cd32b77c63fbf4', class: "sk-spinner-v13-cube sk-spinner-v13-cube6" }),
-                    h("div", { key: 'e2db26066dfb926ac869ce19e4524d9220766d4f', class: "sk-spinner-v13-cube sk-spinner-v13-cube7" }),
-                    h("div", { key: 'd3d5d979ec844f7480db8e764e86a2d5d428b661', class: "sk-spinner-v13-cube sk-spinner-v13-cube8" }),
-                    h("div", { key: '33ee04b71b70e16e38823299fdd04066c88b3894', class: "sk-spinner-v13-cube sk-spinner-v13-cube9" }),
+                    h("div", { key: '846d41928a6673d5d0be23c7f2012d855f94f7d5', class: "sk-spinner-v13-cube sk-spinner-v13-cube1" }),
+                    h("div", { key: 'f89e6198b2ca96761f26e0199e135052e1d8bd7b', class: "sk-spinner-v13-cube sk-spinner-v13-cube2" }),
+                    h("div", { key: '817f79a413618a55214bd34d3d3e8dcdf94ccac1', class: "sk-spinner-v13-cube sk-spinner-v13-cube3" }),
+                    h("div", { key: 'f5327bd00519954be0739a199f722fbebce2476e', class: "sk-spinner-v13-cube sk-spinner-v13-cube4" }),
+                    h("div", { key: 'b2ecb76d9ec7ccb8d5a5b749c73e064ffd8af65e', class: "sk-spinner-v13-cube sk-spinner-v13-cube5" }),
+                    h("div", { key: '36a10200a66c50a15006d850052a8162b7fb9fae', class: "sk-spinner-v13-cube sk-spinner-v13-cube6" }),
+                    h("div", { key: '9ad2b1d081c67eb20b0679e15a8dad65472d9861', class: "sk-spinner-v13-cube sk-spinner-v13-cube7" }),
+                    h("div", { key: '2b8ca22ce51296daf61db3390f050621c00a0f18', class: "sk-spinner-v13-cube sk-spinner-v13-cube8" }),
+                    h("div", { key: 'e7dda224be4f1d0db8afe8f75d20de6954164949', class: "sk-spinner-v13-cube sk-spinner-v13-cube9" }),
                 ];
             }
             if (this.layout === 14) {
                 spinnerEl = [
-                    h("div", { key: '93929d740397ab1e70896abca6df56ca07239397', class: "sk-spinner-v14-circle1 sk-spinner-v14-circle" }),
-                    h("div", { key: '2e8ef8edffaf868e7d07a68a9692c2a442ab2004', class: "sk-spinner-v14-circle2 sk-spinner-v14-circle" }),
-                    h("div", { key: '470de093a1a1e00c7cd1d820bf1047679e95023a', class: "sk-spinner-v14-circle3 sk-spinner-v14-circle" }),
-                    h("div", { key: '9451f27fcaa437c518354168dac1fda9dcb5d1c8', class: "sk-spinner-v14-circle4 sk-spinner-v14-circle" }),
-                    h("div", { key: '01fad1595f607900cc76dd63ab2e49f51ab1e8a1', class: "sk-spinner-v14-circle5 sk-spinner-v14-circle" }),
-                    h("div", { key: '127c9f2d7ad50a463f3ca9bdd5ab0640a8581358', class: "sk-spinner-v14-circle6 sk-spinner-v14-circle" }),
-                    h("div", { key: '7b722ba2c270d743aebcc6995cff8322cf0a014d', class: "sk-spinner-v14-circle7 sk-spinner-v14-circle" }),
-                    h("div", { key: '56ec617ec9f367543798bebf8b6ae2f153a89f11', class: "sk-spinner-v14-circle8 sk-spinner-v14-circle" }),
-                    h("div", { key: 'c2974a187a0f3600210a24bb276407e5fd758dee', class: "sk-spinner-v14-circle9 sk-spinner-v14-circle" }),
-                    h("div", { key: '8bcdf75c43b61ff44f617799fa06cab21757fb43', class: "sk-spinner-v14-circle10 sk-spinner-v14-circle" }),
-                    h("div", { key: '2bb19eb0cd5ae87ff035e8dc2519dd6d4b6ef93c', class: "sk-spinner-v14-circle11 sk-spinner-v14-circle" }),
-                    h("div", { key: '149a1519ecd99be2bce3d050936dcacc605509d4', class: "sk-spinner-v14-circle12 sk-spinner-v14-circle" }),
+                    h("div", { key: '59e710de566984ccd0bac936a524ce1bad873b40', class: "sk-spinner-v14-circle1 sk-spinner-v14-circle" }),
+                    h("div", { key: '40f84d200ca27b547a14ae92cb021f4d998307cb', class: "sk-spinner-v14-circle2 sk-spinner-v14-circle" }),
+                    h("div", { key: 'b7318e8ec59b8b253584ab329d0a11cdde77812f', class: "sk-spinner-v14-circle3 sk-spinner-v14-circle" }),
+                    h("div", { key: '3411fd3d32934adb2d5dc7820ddcddf9770aa743', class: "sk-spinner-v14-circle4 sk-spinner-v14-circle" }),
+                    h("div", { key: 'feb7271af14e53ba11625b6bd29a3e20aea1b0bf', class: "sk-spinner-v14-circle5 sk-spinner-v14-circle" }),
+                    h("div", { key: '3efd6f88fe0853f7e32b490be477918dc5bd9bde', class: "sk-spinner-v14-circle6 sk-spinner-v14-circle" }),
+                    h("div", { key: 'fbf7f1d6bcdb163e5ec773496701f3e5d97a329c', class: "sk-spinner-v14-circle7 sk-spinner-v14-circle" }),
+                    h("div", { key: 'b494589d43c870963482b26b2b576bd90795504f', class: "sk-spinner-v14-circle8 sk-spinner-v14-circle" }),
+                    h("div", { key: '1aa3c9ba0103913eb902c39f9d9c7ec5e8053c18', class: "sk-spinner-v14-circle9 sk-spinner-v14-circle" }),
+                    h("div", { key: 'f47f8d129e2eafc9a138c3d7a20c3e980154cbae', class: "sk-spinner-v14-circle10 sk-spinner-v14-circle" }),
+                    h("div", { key: 'c5944798de2558b722409d4b7a09cb81d7c95f94', class: "sk-spinner-v14-circle11 sk-spinner-v14-circle" }),
+                    h("div", { key: '9da29e9774277ce3f4a870ff5dbc29c22e02a6dd', 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: '3edd3d9661f7cfdbf6a1603bf8590a4e1a627801', style: elStyle }, h("style", { key: 'cd3bdb042c3cbe8c0f912644e2367481cba4a47c' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '0138498d99b3b19099bd1e9dc49b1a3dbd0664e6', id: componentWrapperId, style: elStyle }, h("div", { key: '6affd0a909dc637476750c8a6b3d8ee5f54952ee', id: "loading-wrapper-master", class: masterClass, style: elStyle }, h("div", { key: '5932de28b966bd18ca4e5509c8485dca25878827', id: wrapperClass, style: elStyle }, h("div", { key: '9e83b1b3cb175bdd115d428b08f4e2e59450e833', class: spinnerClass }, spinnerEl))))));
+        return (h(Host, { key: '5b9de6c2d309bc15744353796e662fef611f44f6', style: elStyle }, h("style", { key: 'e6a21638735f7fdf44bcec63fd8067924cdafdf5' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '9e83ab0c16965cfe9cda127c854d08949ea0078f', id: componentWrapperId, style: elStyle }, h("div", { key: 'd033eda03cf43d5ef8ee02fee0890a36d986a893', id: "loading-wrapper-master", class: masterClass, style: elStyle }, h("div", { key: 'd6695bf8595fc0ae3e1a31578d8c2f550585b77b', id: wrapperClass, style: elStyle }, h("div", { key: 'e06bce173a197cf9fd6aa036865104b625badef1', class: spinnerClass }, spinnerEl))))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);

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

@@ -120,7 +120,7 @@ export class KupSwitch {
             onChange: () => this.onKupChange(),
             onFocus: () => this.onKupFocus(),
         };
-        return (h(Host, { key: '4858e80e63b496834cbfcec2eaf0443721ff97ac' }, h("style", { key: 'cc5e607c829cf53ecc4fcbecb17599bf71ddd3c6' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '03f13f6cd8bd27733aad62d7fb9dfc8d883aebd5', id: componentWrapperId }, h(FSwitch, Object.assign({ key: 'ee60ee3e801c6e0015321a1736a04cf9949ac156' }, props)))));
+        return (h(Host, { key: 'c58e0bc0af97047925631605157669d49eaafb32' }, h("style", { key: '961d94935464a5bd1dff1bddc28fc46452bb6dba' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'ec020595d887abb848346106b981c13a577db96f', id: componentWrapperId }, h(FSwitch, Object.assign({ key: '0a7d447ac4e7aa9a6a3fd5aef2f3f73f257ee1e4' }, props)))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);

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

@@ -405,7 +405,7 @@ export class KupTimePicker {
         this.kupManager.debug.logRender(this, true);
     }
     render() {
-        return (h(Host, { key: '6e64fa08f58a91eaca3aa1676ef29f27fd9c9c36' }, h("style", { key: 'a832d907fff749ae04b9fbf90b8b5c446e25f431' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'dec81378d73e1cceb3b5c5eefef150cc24455943', id: componentWrapperId }, this.prepTextfield(this.getTimeForOutput()))));
+        return (h(Host, { key: '93b86314772e012c9c5e51b5ca9f787526b8b488' }, h("style", { key: '39720990860be688caad0e0573b7ece58a986f70' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '07fd86c0e40d99d8871a60b908cd8116a120847a', id: componentWrapperId }, this.prepTextfield(this.getTimeForOutput()))));
     }
     disconnectedCallback() {
         this.kupManager.dates.unregister(this);

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

@@ -14,9 +14,8 @@ import { FButton } from "../f-button/f-button";
 import { FProgressBar } from "../f-progress-bar/f-progress-bar";
 import { FRadio } from "../f-radio/f-radio";
 import { FRating } from "../f-rating/f-rating";
+import { KupDebugCategory } from "../../managers/kup-debug/kup-debug-declarations";
 const dom = document.documentElement;
-let touchEndTime = 0;
-let touchStartTime = 0;
 /*-------------------------------------------------*/
 /*                C o m p o n e n t                */
 /*-------------------------------------------------*/
@@ -113,27 +112,7 @@ export const FCell = (props, children) => {
     }
     return (h("div", { onKeyUp: (e) => cellEvent(e, props, cellType, FCellEvents.KEYUP), class: classObj, "kup-get-cell-props": () => {
             return props;
-        }, onTouchEnd: dom.ketchup.interact.isMobileDevice()
-            ? () => {
-                if (touchStartTime) {
-                    touchEndTime = performance.now();
-                    const delta = touchEndTime - touchStartTime;
-                    // 600ms is interact's default "hold" value
-                    if (delta < 600) {
-                        const newEvt = document.createEvent('MouseEvents');
-                        cellEvent(newEvt, props, cellType, FCellEvents.CLICK);
-                    }
-                    touchEndTime = 0;
-                    touchStartTime = 0;
-                }
-            }
-            : null, onTouchStart: dom.ketchup.interact.isMobileDevice()
-            ? (e) => {
-                touchEndTime = 0;
-                touchStartTime = performance.now();
-                e.preventDefault();
-            }
-            : null, ref: (el) => (cell.element = el), style: cell.style }, h("div", { class: "f-cell__content", style: cell.styleContent, title: cellTitle }, children && children.length > 0
+        }, ref: (el) => (cell.element = el), style: cell.style }, h("div", { class: "f-cell__content", style: cell.styleContent, title: cellTitle }, children && children.length > 0
         ? children
         : [props.indents, infoEl, icon, content])));
 };
@@ -474,7 +453,9 @@ function cellEvent(e, props, cellType, cellEventName) {
             try {
                 comp.refresh();
             }
-            catch (error) { }
+            catch (error) {
+                dom.ketchup.debug.logMessage(comp, error, KupDebugCategory.ERROR);
+            }
         }
     }
 }

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

@@ -1,6 +1,5 @@
 import { FImageShape } from "./f-image-declarations";
 import { getAssetPath, h } from "@stencil/core";
-import { KupThemeColorValues } from "../../managers/kup-theme/kup-theme-declarations";
 /*-------------------------------------------------*/
 /*                C o m p o n e n t                */
 /*-------------------------------------------------*/
@@ -38,7 +37,7 @@ export const FImage = (props) => {
             badgeCollection.push(h("kup-badge", Object.assign({}, props.badgeData[index])));
         }
     }
-    return (h("div", Object.assign({ class: `f-image ${props.wrapperClass ? props.wrapperClass : ''} ${props.fit ? 'kup-fit' : ''}` }, props.dataSet, { id: props.id, style: style, title: props.title, onClick: props.onClick }), el, ...badgeCollection));
+    return (h("div", Object.assign({ class: `f-image ${props.wrapperClass ? props.wrapperClass : ''} ` }, props.dataSet, { id: props.id, style: style, title: props.title, onClick: props.onClick }), el, ...badgeCollection));
 };
 /*-------------------------------------------------*/
 /*                  M e t h o d s                  */
@@ -48,9 +47,7 @@ function createIcon(props) {
         'f-image__icon': true,
     };
     const style = {
-        background: props.color
-            ? props.color
-            : `var(${KupThemeColorValues.ICON})`,
+        background: props.color ? props.color : `var(--kup-gray-color-70)`,
     };
     if (props.resource.indexOf('--kup') > -1) {
         let themeIcon = props.resource.replace('--', '');

package/dist/collection/managers/kup-theme/kup-theme-declarations.js

@@ -17,6 +17,7 @@ export const fButtonUsers = [
     KupTagNames.DROPDOWN_BUTTON,
     KupTagNames.FAMILY_TREE,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.IMAGE_LIST,
     KupTagNames.SNACKBAR,
 ];
@@ -29,6 +30,7 @@ export const fCellUsers = [
     KupTagNames.CELL,
     KupTagNames.DATA_TABLE,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.TREE,
 ];
 /**
@@ -41,6 +43,7 @@ export const fCheckboxUsers = [
     KupTagNames.DASHBOARD,
     KupTagNames.DATA_TABLE,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.LIST,
     KupTagNames.TREE,
 ];
@@ -54,6 +57,7 @@ export const fChipUsers = [
     KupTagNames.CHIP,
     KupTagNames.DATA_TABLE,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.TREE,
 ];
 /**
@@ -106,6 +110,7 @@ export const fRadioUsers = [
     KupTagNames.CELL,
     KupTagNames.DATA_TABLE,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.RADIO,
     KupTagNames.TREE,
 ];
@@ -128,6 +133,7 @@ export const fSwitchUsers = [
     KupTagNames.CELL,
     KupTagNames.DATA_TABLE,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.SWITCH,
     KupTagNames.TREE,
 ];
@@ -144,6 +150,7 @@ export const fTextFieldUsers = [
     KupTagNames.DATA_TABLE,
     KupTagNames.DATE_PICKER,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.NUMERIC_PICKER,
     KupTagNames.PLANNER,
     KupTagNames.TEXT_FIELD,

package/dist/collection/types/GenericTypes.js

@@ -31,6 +31,7 @@ export var KupTagNames;
     KupTagNames["IFRAME"] = "KUP-IFRAME";
     KupTagNames["IMAGE"] = "KUP-IMAGE";
     KupTagNames["IMAGE_LIST"] = "KUP-IMAGE-LIST";
+    KupTagNames["INPUT_PANEL"] = "KUP-INPUT-PANEL";
     KupTagNames["LAZY"] = "KUP-LAZY";
     KupTagNames["LIST"] = "KUP-LIST";
     KupTagNames["MAGIC_BOX"] = "KUP-MAGIC-BOX";

package/dist/components/_commonjsHelpers.js

@@ -0,0 +1,26 @@
+var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
+function getDefaultExportFromCjs (x) {
+	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+}
+
+function getAugmentedNamespace(n) {
+	if (n.__esModule) return n;
+	var a = Object.defineProperty({}, '__esModule', {value: true});
+	Object.keys(n).forEach(function (k) {
+		var d = Object.getOwnPropertyDescriptor(n, k);
+		Object.defineProperty(a, k, d.get ? d : {
+			enumerable: true,
+			get: function () {
+				return n[k];
+			}
+		});
+	});
+	return a;
+}
+
+function commonjsRequire (path) {
+	throw new Error('Could not dynamically require "' + path + '". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup/plugin-commonjs appropriately for this require call to work.');
+}
+
+export { getAugmentedNamespace as a, commonjsRequire as b, commonjsGlobal as c, getDefaultExportFromCjs as g };

package/dist/components/custom-task-list-header.js

@@ -14,11 +14,11 @@ const KupCustomTaskListHeader = /*@__PURE__*/ proxyCustomElement(class KupCustom
         this.fontSize = undefined;
     }
     render() {
-        return (h("div", { key: '25542e1e426f9f035bdd3b894acf915100609cec', class: "custom-task-list-wrapper", style: {
+        return (h("div", { key: '777c24c612e5d8c93b74a4a8466248cd9a84cd31', class: "custom-task-list-wrapper", style: {
                 height: '50px',
                 fontFamily: this.fontFamily,
                 fontSize: this.fontSize,
-            } }, h("div", { key: 'b64868e8a15fda0a259e30e77a1572fef34cf9a9', class: "title" }, h("span", { key: '4bb87686a421a211ff7caa2c53105764f2e15c0a' }, this.label)), this.setDoubleView !== undefined && (h("div", { class: "toggler" }, h("label", { htmlFor: "ch2", class: "switch" }, h("input", { class: "input", id: "ch2", type: "checkbox", checked: this.doubleView, onClick: () => this.setDoubleView(!this.doubleView) }), h("span", { class: "slider" })), h("span", { class: "label" }, "Previsioni")))));
+            } }, h("div", { key: '8a00184f85811656ea2f4c6e69fee0db3ef85f48', class: "title" }, h("span", { key: '170a1bef8a7663064ebaaa600a3aaa40beb84243' }, this.label)), this.setDoubleView !== undefined && (h("div", { class: "toggler" }, h("label", { htmlFor: "ch2", class: "switch" }, h("input", { class: "input", id: "ch2", type: "checkbox", checked: this.doubleView, onClick: () => this.setDoubleView(!this.doubleView) }), h("span", { class: "slider" })), h("span", { class: "label" }, "Previsioni")))));
     }
     static get style() { return KupCustomTaskListHeaderStyle0; }
 }, [0, "kup-custom-task-list-header", {

package/dist/components/custom-task-list-table.js

@@ -1,7 +1,8 @@
 import { proxyCustomElement, HTMLElement, h, Fragment } from '@stencil/core/internal/client';
 import { b as KupDates } from './kup-dates.js';
+import { c as createArrayFromNum } from './other.helpers.js';
 
-const ganttTableModuleCss = ".kup-body-compact-01{font-family:var(--kup-font-family);font-size:14px;line-height:18px;font-weight:400;letter-spacing:0.16px}.kup-body-01{font-family:var(--kup-font-family);font-size:14px;line-height:20px;font-weight:400;letter-spacing:0.16px}.kup-code-01{font-family:var(--kup-font-family-monospace);font-size:12px;line-height:16px;font-weight:400;letter-spacing:0.32px}.kup-label-01{font-family:var(--kup-font-family);font-size:12px;line-height:16px;font-weight:400;letter-spacing:0.32px}.kup-caption-02{font-family:var(--kup-font-family);font-size:12px;line-height:15px;font-weight:500;letter-spacing:1px}.kup-caption-01{font-family:var(--kup-font-family);font-size:10px;line-height:13px;font-weight:400;letter-spacing:1px}.kup-small-label-01{font-family:var(--kup-font-family);font-size:6px;line-height:9px;font-weight:400;letter-spacing:1px}.kup-heading-compact-01{font-family:var(--kup-font-family);font-size:14px;line-height:18px;font-weight:600;letter-spacing:0.16px}.kup-heading-01{font-family:var(--kup-font-family);font-size:14px;line-height:20px;font-weight:600;letter-spacing:0.16px}.kup-heading-02{font-family:var(--kup-font-family);font-size:16px;line-height:24px;font-weight:500;letter-spacing:0}.kup-heading-03{font-family:var(--kup-font-family);font-size:20px;line-height:28px;font-weight:400;letter-spacing:0}.kup-heading-04{font-family:var(--kup-font-family);font-size:28px;line-height:36px;font-weight:400;letter-spacing:0}.kup-heading-05{font-family:var(--kup-font-family);font-size:32px;line-height:40px;font-weight:300;letter-spacing:0}.kup-heading-06{font-family:var(--kup-font-family);font-size:42px;line-height:50px;font-weight:300;letter-spacing:0}.kup-heading-07{font-family:var(--kup-font-family);font-size:54px;line-height:64px;font-weight:300;letter-spacing:0}.kup-heading-08{font-family:var(--kup-font-family);font-size:54px;line-height:64px;font-weight:600;letter-spacing:0}.container{padding:0 10px;margin-right:10px}.project{background:var(--kup-background-color, #ffffff);border:1px solid var(--kup-border-color, #acacac);border-radius:4px;box-sizing:border-box;color:var(--kup-text-color, #595959);cursor:pointer;display:grid;font-weight:400;grid-template-columns:var(--grid-project-columns, 1fr 1fr 1fr);place-items:center}.project>*{font-size:14px;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.project .main{font-weight:700;width:100%;padding-left:4px}.subrow{cursor:pointer;display:grid;border-width:1px;border-style:solid;border-color:#acacac;border-bottom-left-radius:4px;border-bottom-right-radius:4px;box-sizing:border-box;grid-template-columns:var(--grid-fasi-columns, 1fr 1fr 1fr);place-items:center;background:#ffffff;color:#595959;font-weight:400}.subrow>*{font-size:12px;line-height:14px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;width:100%}.subrow:has(+.subrow),.project:has(+.subrow){border-bottom-left-radius:0;border-bottom-right-radius:0}.timeline{cursor:pointer;display:grid;border-width:1px;border-style:solid;border-color:#cbcbcb;border-radius:4px;grid-template-columns:var(--grid-fasi-columns, 1fr 1fr 1fr);place-items:center;background:#fff;color:#595959;font-weight:400;box-sizing:border-box}.timeline>*{font-size:14px;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.timeline .main{font-weight:700;width:100%;padding-left:4px}";
+const ganttTableModuleCss = ".kup-body-compact-01{font-family:var(--kup-font-family);font-size:14px;line-height:18px;font-weight:400;letter-spacing:0.16px}.kup-body-01{font-family:var(--kup-font-family);font-size:14px;line-height:20px;font-weight:400;letter-spacing:0.16px}.kup-code-01{font-family:var(--kup-font-family-monospace);font-size:12px;line-height:16px;font-weight:400;letter-spacing:0.32px}.kup-label-01{font-family:var(--kup-font-family);font-size:12px;line-height:16px;font-weight:400;letter-spacing:0.32px}.kup-caption-02{font-family:var(--kup-font-family);font-size:12px;line-height:15px;font-weight:500;letter-spacing:1px}.kup-caption-01{font-family:var(--kup-font-family);font-size:10px;line-height:13px;font-weight:400;letter-spacing:1px}.kup-small-label-01{font-family:var(--kup-font-family);font-size:6px;line-height:9px;font-weight:400;letter-spacing:1px}.kup-heading-compact-01{font-family:var(--kup-font-family);font-size:14px;line-height:18px;font-weight:600;letter-spacing:0.16px}.kup-heading-01{font-family:var(--kup-font-family);font-size:14px;line-height:20px;font-weight:600;letter-spacing:0.16px}.kup-heading-02{font-family:var(--kup-font-family);font-size:16px;line-height:24px;font-weight:500;letter-spacing:0}.kup-heading-03{font-family:var(--kup-font-family);font-size:20px;line-height:28px;font-weight:400;letter-spacing:0}.kup-heading-04{font-family:var(--kup-font-family);font-size:28px;line-height:36px;font-weight:400;letter-spacing:0}.kup-heading-05{font-family:var(--kup-font-family);font-size:32px;line-height:40px;font-weight:300;letter-spacing:0}.kup-heading-06{font-family:var(--kup-font-family);font-size:42px;line-height:50px;font-weight:300;letter-spacing:0}.kup-heading-07{font-family:var(--kup-font-family);font-size:54px;line-height:64px;font-weight:300;letter-spacing:0}.kup-heading-08{font-family:var(--kup-font-family);font-size:54px;line-height:64px;font-weight:600;letter-spacing:0}.container{padding:0 10px;margin-right:10px}.scrollable{overflow-x:auto;scrollbar-width:0}.scrollable .project-wrapper{display:table}.scrollable .project{width:100% !important;display:table-row}.scrollable .project>*{overflow:unset;padding-right:10px;display:table-cell;vertical-align:middle;border-bottom:1px solid var(--kup-border-color, #acacac);border-top:1px solid var(--kup-border-color, #acacac);padding-left:12px}.scrollable .project>*:first-child{border-left:1px solid var(--kup-border-color, #acacac);border-bottom-left-radius:4px;border-top-left-radius:4px}.scrollable .project>*:last-child{border-right:1px solid var(--kup-border-color, #acacac);border-bottom-right-radius:4px;border-top-right-radius:4px}.scrollable .subrow{width:100% !important;display:table-row}.scrollable .subrow>*{overflow:unset;padding-right:10px;display:table-cell;vertical-align:middle;border-bottom:1px solid #acacac;border-top:1px solid #acacac;padding-left:12px}.scrollable .subrow>*:first-child{border-left:1px solid #acacac}.scrollable .subrow>*:last-child{border-right:1px solid #acacac}.scrollable .timeline{width:100% !important;display:table-row}.scrollable .timeline>*{overflow:unset;padding-right:10px;display:table-cell;vertical-align:middle;border-bottom:1px solid #acacac;border-top:1px solid #acacac;padding-left:12px}.scrollable .timeline>*:first-child{border-left:1px solid #acacac}.scrollable .timeline>*:last-child{border-right:1px solid #acacac}.scrollable .project:has(+.subrow)>*{border-bottom-left-radius:0;border-bottom-right-radius:0}.scrollable::-webkit-scrollbar{width:0;height:0}.project{background:var(--kup-background-color, #ffffff);border:1px solid var(--kup-border-color, #acacac);border-radius:4px;box-sizing:border-box;color:var(--kup-text-color, #595959);cursor:pointer;display:grid;font-weight:400;grid-template-columns:var(--grid-project-columns, 1fr 1fr 1fr);place-items:center}.project>*{font-size:14px;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.project .main{font-weight:700;width:100%;padding-left:4px}.subrow{cursor:pointer;display:grid;border-width:1px;border-style:solid;border-color:#acacac;border-bottom-left-radius:4px;border-bottom-right-radius:4px;box-sizing:border-box;grid-template-columns:var(--grid-fasi-columns, 1fr 1fr 1fr);place-items:center;background:#ffffff;color:#595959;font-weight:400}.subrow>*{font-size:12px;line-height:14px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;width:100%}.subrow:has(+.subrow),.project:has(+.subrow){border-bottom-left-radius:0 !important;border-bottom-right-radius:0 !important}.timeline{cursor:pointer;display:grid;border-width:1px;border-style:solid;border-color:#cbcbcb;border-radius:4px;grid-template-columns:var(--grid-fasi-columns, 1fr 1fr 1fr);place-items:center;background:#fff;color:#595959;font-weight:400;box-sizing:border-box}.timeline>*{font-size:14px;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.timeline .main{font-weight:700;width:100%;padding-left:4px}";
 const KupCustomTaskListTableStyle0 = ganttTableModuleCss;
 
 const KupCustomTaskListTable = /*@__PURE__*/ proxyCustomElement(class KupCustomTaskListTable extends HTMLElement {
@@ -14,15 +15,37 @@ const KupCustomTaskListTable = /*@__PURE__*/ proxyCustomElement(class KupCustomT
         this.rowWidth = '';
         this.fontFamily = '';
         this.fontSize = '';
+        this.scrollableTaskList = undefined;
+        this.taskListScrollX = undefined;
         this.setSelectedTask = undefined;
         this.onclickTaskList = undefined;
         this.ondblclickTaskList = undefined;
         this.oncontextmenuTaskList = undefined;
+        this.ontaskListScrollWidth = undefined;
+    }
+    componentDidLoad() {
+        var _a;
+        this.ontaskListScrollWidth((_a = this.projectWrapperRef) === null || _a === void 0 ? void 0 : _a.clientWidth);
+    }
+    componentDidUpdate() {
+        var _a;
+        this.ontaskListScrollWidth((_a = this.projectWrapperRef) === null || _a === void 0 ? void 0 : _a.clientWidth);
+    }
+    updateTaskListScroll() {
+        this.projectWrapperRef &&
+            (this.projectWrapperRef.parentElement.scrollLeft = this.taskListScrollX);
     }
     render() {
         const kupDates = new KupDates();
-        return (h("div", { key: 'aa6299da80dde8682f3fe8c1a8e244d6c15e5c5c', class: "container" }, this.tasks.map((task) => {
-            var _a, _b, _c;
+        const scrollableStyle = {};
+        if (this.scrollableTaskList) {
+            scrollableStyle['width'] = this.rowWidth;
+        }
+        const spansToShow = this.tasks.reduce((prev, curr) => {
+            return prev.valuesToShow.length > curr.valuesToShow.length ? prev : curr;
+        }).valuesToShow.length + 1;
+        return (h("div", { class: `container ${this.scrollableTaskList ? 'scrollable' : ''}`, style: scrollableStyle }, h("div", { class: "project-wrapper", ref: (el) => (this.projectWrapperRef = el) }, this.tasks.map((task) => {
+            var _a, _b, _c, _d;
             return (h(Fragment, null, task.type === 'project' ? (h("div", { class: "project", style: {
                     height: `${this.rowHeight}px`,
                     width: this.rowWidth,
@@ -39,11 +62,15 @@ const KupCustomTaskListTable = /*@__PURE__*/ proxyCustomElement(class KupCustomT
                     e.preventDefault();
                     this.setSelectedTask(task.id);
                     this.oncontextmenuTaskList(e, task.id);
-                } }, (_a = task.valuesToShow) === null || _a === void 0 ? void 0 : _a.map((v, index) => (h("span", { class: index === 0 ? 'main' : undefined, title: v.length > 10 ? v : undefined, key: `task_${task.id}_valuesToShow_${index}` }, v === '#START#'
-                ? kupDates.formatToLocaleSimple(task.start)
-                : v === '#END#'
-                    ? kupDates.formatToLocaleSimple(task.end)
-                    : v))))) : task.type === 'task' ? (h("div", { class: "subrow", style: {
+                } }, (_a = task.valuesToShow) === null || _a === void 0 ? void 0 :
+                _a.map((v, index) => (h("span", { class: index === 0 ? 'main' : undefined, title: v.length > 10 ? v : undefined, key: `task_${task.id}_valuesToShow_${index}` }, v === '#START#'
+                    ? kupDates.formatToLocaleSimple(task.start)
+                    : v === '#END#'
+                        ? kupDates.formatToLocaleSimple(task.end)
+                        : v))), this.scrollableTaskList && spansToShow > task.valuesToShow.length && ((() => {
+                const spansToIterate = createArrayFromNum(spansToShow - task.valuesToShow.length);
+                return (spansToIterate.map((element) => (h("span", { key: element }))));
+            })()))) : task.type === 'task' ? (h("div", { class: "subrow", style: {
                     height: `${this.rowHeight}px`,
                     width: this.rowWidth,
                     fontFamily: this.fontFamily,
@@ -59,16 +86,26 @@ const KupCustomTaskListTable = /*@__PURE__*/ proxyCustomElement(class KupCustomT
                     e.preventDefault();
                     this.setSelectedTask(task.id);
                     this.oncontextmenuTaskList(e, task.id);
+                } }, this.scrollableTaskList ? (h("div", { style: {
+                    textAlign: 'end',
                 } }, h("span", { key: `phase_${task.id}_valuesToShow_color`, style: {
                     height: '16px',
                     width: '16px',
+                    display: 'inline-block',
                     backgroundColor: (_b = task.styles) === null || _b === void 0 ? void 0 : _b.backgroundColor,
-                } }), (_c = task.valuesToShow) === null || _c === void 0 ? void 0 :
-                _c.map((v, index) => (h("span", { class: index === 0 ? 'main' : undefined, title: v.length > 10 ? v : undefined, key: `phase_${task.id}_valuesToShow_${index}` }, v === '#START#'
+                } }))) : (h("span", { key: `phase_${task.id}_valuesToShow_color`, style: {
+                    height: '16px',
+                    width: '16px',
+                    backgroundColor: (_c = task.styles) === null || _c === void 0 ? void 0 : _c.backgroundColor,
+                } })), (_d = task.valuesToShow) === null || _d === void 0 ? void 0 :
+                _d.map((v, index) => (h("span", { class: index === 0 ? 'main' : undefined, title: v.length > 10 ? v : undefined, key: `phase_${task.id}_valuesToShow_${index}` }, v === '#START#'
                     ? kupDates.formatToLocaleSimple(task.start)
                     : v === '#END#'
                         ? kupDates.formatToLocaleSimple(task.end)
-                        : v))))) : ((() => {
+                        : v))), this.scrollableTaskList && spansToShow > task.valuesToShow.length && ((() => {
+                const spansToIterate = createArrayFromNum(spansToShow - task.valuesToShow.length - 1);
+                return (spansToIterate.map((element) => (h("span", { key: element }))));
+            })()))) : ((() => {
                 var _a;
                 let str = '';
                 for (let i = 0; i < task.valuesToShow.length; i++) {
@@ -90,8 +127,11 @@ const KupCustomTaskListTable = /*@__PURE__*/ proxyCustomElement(class KupCustomT
                         ? v
                         : undefined, key: `detail_${task.id}_valuesToShow_${index}` }, v)))));
             })())));
-        })));
+        }))));
     }
+    static get watchers() { return {
+        "taskListScrollX": ["updateTaskListScroll"]
+    }; }
     static get style() { return KupCustomTaskListTableStyle0; }
 }, [0, "kup-custom-task-list-table", {
         "ganttId": [1, "gantt-id"],
@@ -100,10 +140,15 @@ const KupCustomTaskListTable = /*@__PURE__*/ proxyCustomElement(class KupCustomT
         "rowWidth": [1, "row-width"],
         "fontFamily": [1, "font-family"],
         "fontSize": [1, "font-size"],
+        "scrollableTaskList": [4, "scrollable-task-list"],
+        "taskListScrollX": [2, "task-list-scroll-x"],
         "setSelectedTask": [16],
         "onclickTaskList": [16],
         "ondblclickTaskList": [16],
-        "oncontextmenuTaskList": [16]
+        "oncontextmenuTaskList": [16],
+        "ontaskListScrollWidth": [16]
+    }, undefined, {
+        "taskListScrollX": ["updateTaskListScroll"]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {