@sme.up/ketchup 5.2.0-SNAPSHOT → 6.1.0-SNAPSHOT

package/dist/collection/assets/tree.js

@@ -190169,125 +190169,6 @@ let treeLayoutFixedEl = document.getElementById('tree-layout-fixed');
 if (treeLayoutFixedEl != null) {
     treeLayoutFixedEl.columns = tlfCols;
     treeLayoutFixedEl.data = tlfData;
-    treeLayoutFixedEl.addEventListener('kup-tooltip-loaddata', ({ detail }) => {
-        console.log(JSON.stringify(detail));
-        onLoadData(detail);
-    });
-    treeLayoutFixedEl.addEventListener(
-        'kup-tooltip-loaddetail',
-        ({ detail }) => {
-            console.log(JSON.stringify(detail));
-            onLoadDetailData(detail);
-        }
-    );
-}
-
-function onLoadData(detail) {
-    detail.comp.data = {
-        //image: this.images.bornToDie,
-        title: 'Born to die',
-        content: {
-            info1: {
-                label: 'Author',
-                value: 'Lana del Rey',
-            },
-            info2: {
-                label: 'Year',
-                value: 2012,
-            },
-        },
-    };
-    console.log('data:' + JSON.stringify(detail.comp.data));
-}
-
-function onLoadDetailData(detail) {
-    detail.comp.detailData = {
-        columns: [
-            {
-                name: 'label',
-                title: 'Label',
-                size: '10',
-            },
-            {
-                name: 'value',
-                title: 'Value',
-                size: '10',
-            },
-        ],
-        rows: [
-            {
-                cells: {
-                    label: {
-                        value: 'Born to die',
-                    },
-                    value: {
-                        value: '4:46',
-                    },
-                },
-            },
-            {
-                cells: {
-                    label: {
-                        value: 'Off to the races',
-                    },
-                    value: {
-                        value: '5:00',
-                    },
-                },
-            },
-            {
-                cells: {
-                    label: {
-                        value: 'Blue jeans',
-                    },
-                    value: {
-                        value: '3:29',
-                    },
-                },
-            },
-        ],
-        actions: {
-            /** Ne metto 7 per verificare se vengono visualizzati solo i primi 5 */
-            command: [
-                {
-                    text: 'Attiva il riconoscimento facciale',
-                    icon: 'face',
-                    exec: 'F(EXD;*SCO;) 1(CN;CLI;C0001)',
-                },
-                {
-                    text: 'Accendi la luce',
-                    icon: 'lightbulb-on',
-                    exec: 'F(EXD;*SCO;) 1(CN;CLI;C0002)',
-                },
-                {
-                    text: 'Leggi gli ultimi feed rss',
-                    icon: 'rss',
-                    exec: 'F(EXD;*SCO;) 1(CN;CLI;C0003)',
-                },
-                {
-                    text: 'Accedi a videocorso su udemy',
-                    icon: 'school',
-                    exec: 'F(EXD;*SCO;) 1(CN;CLI;C0004)',
-                },
-                {
-                    text: 'Sblocca la serratura della cantina',
-                    icon: 'lock_open',
-                    exec: 'F(EXD;*SCO;) 1(CN;CLI;C0005)',
-                },
-                {
-                    text: "Fai qualcosa d'altro",
-                    icon: 'play',
-                    exec: 'F(EXD;*SCO;) 1(CN;CLI;C0005)',
-                },
-                {
-                    text: "Fai qualcosa d'altro",
-                    icon: 'play',
-                    exec: 'F(EXD;*SCO;) 1(CN;CLI;C0006)',
-                },
-            ],
-        },
-    };
-    console.log('detailData:' + JSON.stringify(detail.comp.detailData));
 }
 
 let tmCols = [
@@ -227779,15 +227660,6 @@ let treeMixedEl = document.getElementById('tree-mixed');
 if (treeMixedEl != null) {
     treeMixedEl.columns = tmCols;
     treeMixedEl.data = tmData;
-    /*
-    treeMixedEl.addEventListener('kup-tooltip-loaddata', ({ detail }) => {
-        console.log(JSON.stringify(detail));
-        onLoadData(detail);
-    });
-    treeMixedEl.addEventListener('kup-tooltip-loaddetail', ({ detail }) => {
-        console.log(JSON.stringify(detail));
-        onLoadDetailData(detail);
-    });*/
 }
 
 let f2Data = [

package/dist/collection/collection-manifest.json

@@ -2,13 +2,12 @@
   "entries": [
     "./components/kup-card/kup-card.js",
     "./components/kup-badge/kup-badge.js",
-    "./components/kup-tooltip/kup-tooltip.js",
-    "./components/kup-text-field/kup-text-field.js",
-    "./components/kup-chart/kup-chart.js",
-    "./components/kup-data-table/kup-data-table.js",
-    "./components/kup-tree/kup-tree.js",
     "./components/kup-accordion/kup-accordion.js",
     "./components/kup-autocomplete/kup-autocomplete.js",
+    "./components/kup-chart/kup-chart.js",
+    "./components/kup-tree/kup-tree.js",
+    "./components/kup-text-field/kup-text-field.js",
+    "./components/kup-data-table/kup-data-table.js",
     "./components/kup-box/kup-box.js",
     "./components/kup-button/kup-button.js",
     "./components/kup-button-list/kup-button-list.js",
@@ -25,15 +24,18 @@
     "./components/kup-dropdown-button/kup-dropdown-button.js",
     "./components/kup-echart/kup-echart.js",
     "./components/kup-field/kup-field.js",
+    "./components/kup-form-editor/kup-form-editor.js",
     "./components/kup-gauge/kup-gauge.js",
     "./components/kup-grid/kup-grid.js",
     "./components/kup-iframe/kup-iframe.js",
     "./components/kup-image/kup-image.js",
+    "./components/kup-image-list/kup-image-list.js",
     "./components/kup-lazy/kup-lazy.js",
     "./components/kup-radio/kup-radio.js",
     "./components/kup-list/kup-list.js",
     "./components/kup-magic-box/kup-magic-box.js",
     "./components/kup-nav-bar/kup-nav-bar.js",
+    "./components/kup-numeric-picker/kup-numeric-picker.js",
     "./components/kup-photo-frame/kup-photo-frame.js",
     "./components/kup-probe/kup-probe.js",
     "./components/kup-progress-bar/kup-progress-bar.js",
@@ -47,7 +49,7 @@
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "2.14.1",
+    "version": "2.15.2",
     "typescriptVersion": "4.5.4"
   },
   "collections": [],

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

@@ -158,7 +158,7 @@ export class KupAutocomplete {
     });
   }
   onKupItemClick(e) {
-    this.onKupChange(e.detail.selected.value);
+    this.onKupChange(e.detail.selected.id);
     this.closeList();
     if (this.textfieldEl) {
       this.textfieldEl.focus();

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

@@ -25,13 +25,9 @@ export var KupBoxProps;
   KupBoxProps["selectBox"] = "Automatically selects the box at the specified index.";
   KupBoxProps["selectedRowsState"] = "Multiple selection.";
   KupBoxProps["showSelection"] = "If enabled, highlights the selected box/boxes.";
-  KupBoxProps["showTooltipOnRightClick"] = "If set to true, displays tooltip on right click; if set to false, displays tooltip on mouseOver.";
   KupBoxProps["sortBy"] = "If sorting is enabled, specifies which column to sort.";
   KupBoxProps["sortEnabled"] = "Enable sorting.";
   KupBoxProps["stateId"] = "";
   KupBoxProps["store"] = "";
   KupBoxProps["swipeDisabled"] = "Disable swipe.";
-  KupBoxProps["tooltipDetailTimeout"] = "Defines the timeout for tooltip detail.";
-  KupBoxProps["tooltipEnabled"] = "Enable show tooltip.";
-  KupBoxProps["tooltipLoadTimeout"] = "Defines the timeout for tooltip load.";
 })(KupBoxProps || (KupBoxProps = {}));

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

@@ -5,7 +5,6 @@ import { getColumnByName } from '../../utils/cell-utils';
 import { filterRows, sortRows, paginateRows, } from '../kup-data-table/kup-data-table-helper';
 import { kupManagerInstance, } from '../../managers/kup-manager/kup-manager';
 import { KupBoxState } from './kup-box-state';
-import { setTooltip, unsetTooltip } from '../../utils/helpers';
 import { getProps, identify, setProps } from '../../utils/utils';
 import { FImage } from '../../f-components/f-image/f-image';
 import { FChip } from '../../f-components/f-chip/f-chip';
@@ -123,11 +122,6 @@ export class KupBox {
      * @default true
      */
     this.showSelection = true;
-    /**
-     * If set to true, displays tooltip on right click; if set to false, displays tooltip on mouseOver.
-     * @default true
-     */
-    this.showTooltipOnRightClick = true;
     /**
      * Enable sorting
      * @default false
@@ -139,11 +133,6 @@ export class KupBox {
      * @default false
      */
     this.swipeDisabled = false;
-    /**
-     * Enable show tooltip
-     * @default true
-     */
-    this.tooltipEnabled = true;
     /*-------------------------------------------------*/
     /*       I n t e r n a l   V a r i a b l e s       */
     /*-------------------------------------------------*/
@@ -386,7 +375,7 @@ export class KupBox {
       });
     }
   }
-  getEventDetails(el) {
+  getEventDetails(el, e) {
     let boxObject = null;
     let cell = null;
     let row = null;
@@ -402,16 +391,14 @@ export class KupBox {
     }
     return {
       boxObject: boxObject ? boxObject : null,
-      row: row ? row : null,
       column: column ? column : null,
       cell: cell ? cell : null,
+      originalEvent: e,
+      row: row ? row : null,
     };
   }
   contextMenuHandler(e) {
-    const details = this.getEventDetails(e.target);
-    if (this.showTooltipOnRightClick && details.boxObject && details.cell) {
-      setTooltip(e, details.row.id, details.column.name, details.cell, this.tooltip);
-    }
+    const details = this.getEventDetails(e.target, e);
     return details;
   }
   /**
@@ -923,33 +910,14 @@ export class KupBox {
       column = this.data.columns.find((x) => x.name === boxObject.column);
     }
     const cell = row.cells[boxObject.column];
-    let _hasTooltip = false;
     let title = undefined;
-    if (_hasTooltip) {
+    if (cell && !this.kupManager.objects.isEmptyKupObj(cell.obj)) {
       classObj['is-obj'] = true;
       if (this.kupManager.debug.isDebug()) {
         title =
           cell.obj.t + '; ' + cell.obj.p + '; ' + cell.obj.k + ';';
       }
     }
-    let tipEvents = null;
-    if (_hasTooltip) {
-      if (!this.showTooltipOnRightClick) {
-        tipEvents = {
-          onMouseEnter: (ev) => {
-            if (_hasTooltip) {
-              setTooltip(ev, row.id, boxObject.column, cell, this.tooltip);
-            }
-            else if (!_hasTooltip) {
-              unsetTooltip(this.tooltip);
-            }
-          },
-          onMouseLeave: () => {
-            unsetTooltip(this.tooltip);
-          },
-        };
-      }
-    }
     const cellProps = {
       cell: cell,
       column: column,
@@ -960,7 +928,7 @@ export class KupBox {
       setSizes: true,
       shape: boxObject.shape,
     };
-    return (h("div", Object.assign({ "data-cell": cell, "data-row": row, "data-column": boxObject.column, class: classObj, style: boStyle, title: title }, tipEvents), cell && column ? (h(FCell, Object.assign({}, cellProps))) : (h("span", null, boxObject.value))));
+    return (h("div", { "data-cell": cell, "data-row": row, "data-column": boxObject.column, class: classObj, style: boStyle, title: title }, cell && column ? (h(FCell, Object.assign({}, cellProps))) : (h("span", null, boxObject.value))));
   }
   /**
    * Prepares the kanban sections by sorting the boxlist's data.
@@ -1053,14 +1021,6 @@ export class KupBox {
       },
     };
   }
-  renderTooltip() {
-    if (this.tooltipEnabled == false) {
-      return null;
-    }
-    return (h("kup-tooltip", { class: "box-tooltip", owner: this.rootElement.tagName, loadTimeout: this.showTooltipOnRightClick == true
-        ? 0
-        : this.tooltipLoadTimeout, detailTimeout: this.tooltipDetailTimeout, ref: (el) => (this.tooltip = el) }));
-  }
   didLoadInteractables() {
     this.interactableTouch.push(this.boxContainer);
     const tapCb = (e) => {
@@ -1069,7 +1029,6 @@ export class KupBox {
         return;
       }
       switch (e.button) {
-        // right click
         case 2:
           this.kupBoxContextMenu.emit({
             comp: this,
@@ -1266,7 +1225,6 @@ export class KupBox {
         boxContent.push(this.renderRow(rows[cnt++]));
       }
     }
-    const tooltip = this.renderTooltip();
     return (h(Host, null,
       h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)),
       h("div", { id: componentWrapperId },
@@ -1276,12 +1234,8 @@ export class KupBox {
           paginator,
           h("div", { class: isKanban ? 'is-kanban' : '', id: 'box-container', style: containerStyle, onContextMenu: (e) => {
               e.preventDefault();
-            }, onMouseLeave: (ev) => {
-              ev.stopPropagation();
-              unsetTooltip(this.tooltip);
             }, ref: (el) => (this.boxContainer =
-              el) }, boxContent),
-          tooltip))));
+              el) }, boxContent)))));
   }
   disconnectedCallback() {
     this.kupManager.interact.unregister(this.interactableDrag.concat(this.interactableDrop));
@@ -1776,27 +1730,6 @@ export class KupBox {
       "reflect": false,
       "defaultValue": "true"
     },
-    "showTooltipOnRightClick": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "true"
-          }],
-        "text": "If set to true, displays tooltip on right click; if set to false, displays tooltip on mouseOver."
-      },
-      "attribute": "show-tooltip-on-right-click",
-      "reflect": false,
-      "defaultValue": "true"
-    },
     "sortBy": {
       "type": "string",
       "mutable": true,
@@ -1896,67 +1829,6 @@ export class KupBox {
       "attribute": "swipe-disabled",
       "reflect": false,
       "defaultValue": "false"
-    },
-    "tooltipDetailTimeout": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "undefined"
-          }],
-        "text": "Defines the timeout for tooltip detail"
-      },
-      "attribute": "tooltip-detail-timeout",
-      "reflect": false
-    },
-    "tooltipEnabled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "true"
-          }],
-        "text": "Enable show tooltip"
-      },
-      "attribute": "tooltip-enabled",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "tooltipLoadTimeout": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "undefined"
-          }],
-        "text": "Defines the timeout for tooltip load"
-      },
-      "attribute": "tooltip-load-timeout",
-      "reflect": false
     }
   }; }
   static get states() { return {

package/dist/collection/components/kup-card/built-in/kup-card-built-in.js

@@ -3,6 +3,7 @@ import { KupCardCSSClasses } from '../kup-card-declarations';
 import { prepareCalendar } from './kup-card-calendar';
 import { prepareClock } from './kup-card-clock';
 import { prepareColumnDropMenu } from './kup-card-column-drop-menu';
+import { prepareNumeric } from './kup-card-numeric';
 /**
  * 1st built-in layout, calendar view.
  * @param {KupCard} component - Card component.
@@ -36,3 +37,12 @@ export function create3(component) {
 export function create4(component) {
   return (h("div", { class: `built-in-layout-${component.layoutNumber} ${KupCardCSSClasses.BUILT_IN_CARD}` }));
 }
+/**
+ * 5th built-in layout, numeric picker.
+ * This layout is rendered after the render cycle completes.
+ * @param {KupCard} component - Card component.
+ * @returns {VNode} 4th built-in layout virtual node.
+ */
+export function create5(component) {
+  return (h("div", { class: `built-in-layout-${component.layoutNumber} ${KupCardCSSClasses.BUILT_IN_CARD}` }, prepareNumeric(component)));
+}

package/dist/collection/components/kup-card/built-in/kup-card-clock.js

@@ -83,7 +83,7 @@ function prepTimeArea(component) {
 function onKupClockItemClick(e, component, value) {
   if (e != null) {
     if (value == null) {
-      value = e.detail.selected.value;
+      value = e.detail.selected.id;
     }
   }
   setClockValueSelected(component, value);

package/dist/collection/components/kup-card/built-in/kup-card-column-drop-menu.js

@@ -119,8 +119,7 @@ function typeColumn(e, component) {
   });
 }
 function listClick(e, options) {
-  const value = e.detail.selected.value;
-  switch (value) {
+  switch (e.detail.selected.id) {
     case KupLanguageGeneric.MERGE:
       if (options.mergeCb) {
         options.mergeCb();

package/dist/collection/components/kup-card/built-in/kup-card-numeric.js

@@ -0,0 +1,153 @@
+import { h } from '@stencil/core';
+import { FButton } from '../../../f-components/f-button/f-button';
+const dom = document.documentElement;
+const maximumFractionDigits = 14;
+export function prepareNumeric(component) {
+  const el = component.rootElement;
+  if (!el.kupData)
+    el.kupData = {
+      value: null,
+      localeValue: '',
+    };
+  let decimals = false;
+  let negative = false;
+  const options = getOptions(component);
+  if (options.resetStatus) {
+    el.kupData = {
+      value: null,
+      localeValue: '',
+    };
+    const obj = options.initialValue;
+    if (options.initialValue) {
+      if (obj && obj.k)
+        el.kupData.value = obj.k;
+      else
+        el.kupData.value = options.initialValue.toString();
+      el.kupData.localeValue = dom.ketchup.math.numbers.toLocaleString(el.kupData.value);
+    }
+    options.resetStatus = false;
+  }
+  if (options.negative)
+    negative = true;
+  if (options.decimals)
+    decimals = true;
+  const clearButtonProp = {
+    icon: 'cancel',
+    onClick: () => clearValue(component),
+  };
+  const saveButtonProp = {
+    icon: 'save',
+    onClick: () => saveValue(component),
+  };
+  const decChar = getDecimalChar();
+  return (h("table", null,
+    h("tr", null,
+      h("td", { colSpan: 3 },
+        h("div", { class: "value" }, el.kupData.localeValue))),
+    h("tr", null,
+      h("td", null,
+        h("div", { class: "number", onClick: () => setValue(component, '1') }, "1")),
+      h("td", null,
+        h("div", { class: "number", onClick: () => setValue(component, '2') }, "2")),
+      h("td", null,
+        h("div", { class: "number", onClick: () => setValue(component, '3') }, "3"))),
+    h("tr", null,
+      h("td", null,
+        h("div", { class: "number", onClick: () => setValue(component, '4') }, "4")),
+      h("td", null,
+        h("div", { class: "number", onClick: () => setValue(component, '5') }, "5")),
+      h("td", null,
+        h("div", { class: "number", onClick: () => setValue(component, '6') }, "6"))),
+    h("tr", null,
+      h("td", null,
+        h("div", { class: "number", onClick: () => setValue(component, '7') }, "7")),
+      h("td", null,
+        h("div", { class: "number", onClick: () => setValue(component, '8') }, "8")),
+      h("td", null,
+        h("div", { class: "number", onClick: () => setValue(component, '9') }, "9"))),
+    h("tr", null,
+      h("td", null, negative
+        ? [
+          h("div", { class: "number", onClick: () => setSign(component) }, "-"),
+        ]
+        : []),
+      h("td", null,
+        h("div", { class: "number", onClick: () => setValue(component, '0') }, "0")),
+      h("td", null, decimals
+        ? [
+          h("div", { class: "number", onClick: () => setValue(component, '.') }, decChar),
+        ]
+        : [])),
+    h("tr", null,
+      h("td", null),
+      h("td", null,
+        h(FButton, Object.assign({}, clearButtonProp))),
+      h("td", null,
+        h(FButton, Object.assign({}, saveButtonProp))))));
+}
+function getOptions(component) {
+  if (component.data.options)
+    return component.data.options;
+  else
+    return { resetStatus: false };
+}
+function setSign(component) {
+  const el = component.rootElement;
+  let strVal = el.kupData.value ? el.kupData.value : '0';
+  if (strVal.startsWith('-'))
+    return;
+  strVal = '-' + strVal;
+  el.kupData.value = strVal;
+  el.kupData.localeValue = dom.ketchup.math.numbers.toLocaleString(strVal);
+  component.refresh();
+}
+function setValue(component, value) {
+  const options = getOptions(component);
+  const el = component.rootElement;
+  const decChar = '.';
+  let strVal = el.kupData.value ? el.kupData.value.toString() : '0';
+  // if the first value is 0 and the character you want to insert is not a comma, I clear the field.
+  if (strVal == '0' && value != decChar) {
+    strVal = '';
+  }
+  // if I have already entered a decimal sign I stop.
+  if (value == decChar && strVal.includes(decChar))
+    return;
+  // if the text field contains the maximum number entered, excluding the comma, I stop.
+  if (options.maxLength &&
+    strVal.replace(decChar, '').length == options.maxLength)
+    return;
+  // if a maximum number of integers is required, and I don't have the comma, I check to be right with the values.
+  if (options.maxIntegers &&
+    value != decChar &&
+    !strVal.includes(decChar) &&
+    strVal.length == options.maxIntegers)
+    return;
+  // if a maximum number of decimals has been requested, check where we are.
+  if (options.maxDecimals &&
+    strVal.includes(decChar) &&
+    strVal.substring(strVal.indexOf(decChar) + 1).length ==
+      options.maxDecimals)
+    return;
+  // if the maximum number of decimals in JS has been reached, I stop.
+  if (strVal.includes(decChar) &&
+    strVal.substring(strVal.indexOf(decChar) + 1).length == 14)
+    return;
+  strVal += value;
+  el.kupData.value = strVal;
+  el.kupData.localeValue = dom.ketchup.math.numbers.toLocaleString(strVal);
+  component.refresh();
+}
+function clearValue(component) {
+  const el = component.rootElement;
+  el.kupData.value = null;
+  el.kupData.localeValue = '';
+  component.refresh();
+}
+function getDecimalChar() {
+  return (0.1).toLocaleString(dom.ketchup.math.locale).substring(1, 2);
+}
+function saveValue(component) {
+  const el = component.rootElement;
+  component.onKupClick(component.rootElement.id, el.kupData.value ? Number(el.kupData.value).toString() : '');
+}