@sme.up/ketchup 6.2.0 → 6.4.0

package/dist/collection/assets/family-tree.js

@@ -13,7 +13,7 @@ const dataStaff = {
                                             children: [],
                                             disabled: false,
                                             expandable: false,
-                                            icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                                            icon: 'favorite',
                                             isExpanded: false,
                                             obj: {
                                                 k: 'LOCEXD',
@@ -30,7 +30,7 @@ const dataStaff = {
                                             children: [],
                                             disabled: false,
                                             expandable: false,
-                                            icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                                            icon: 'favorite',
                                             isExpanded: false,
                                             obj: {
                                                 k: 'LOCEXD',
@@ -46,7 +46,7 @@ const dataStaff = {
                                     ],
                                     disabled: false,
                                     expandable: false,
-                                    icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                                    icon: 'favorite',
                                     id: 'LOCEXD',
                                     isExpanded: false,
                                     obj: {
@@ -83,7 +83,7 @@ const dataStaff = {
                                             children: [],
                                             disabled: false,
                                             expandable: false,
-                                            icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                                            icon: 'favorite',
                                             isExpanded: false,
                                             obj: {
                                                 k: 'LOCEXD',
@@ -100,7 +100,7 @@ const dataStaff = {
                                             children: [],
                                             disabled: false,
                                             expandable: false,
-                                            icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                                            icon: 'favorite',
                                             isExpanded: false,
                                             obj: {
                                                 k: 'LOCEXD',
@@ -116,7 +116,7 @@ const dataStaff = {
                                     ],
                                     disabled: false,
                                     expandable: false,
-                                    icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                                    icon: 'favorite',
                                     isExpanded: false,
                                     obj: {
                                         k: 'LOCEXD',
@@ -132,7 +132,7 @@ const dataStaff = {
                                     children: [],
                                     disabled: false,
                                     expandable: false,
-                                    icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCTML.jsf?ln=smeupIcons',
+                                    icon: 'favorite',
                                     id: 'LOCTML',
                                     isExpanded: false,
                                     obj: {
@@ -149,7 +149,7 @@ const dataStaff = {
                                     children: [],
                                     disabled: false,
                                     expandable: false,
-                                    icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                                    icon: 'favorite',
                                     isExpanded: false,
                                     obj: {
                                         k: 'LOCEXD',
@@ -166,7 +166,7 @@ const dataStaff = {
                                     children: [],
                                     disabled: false,
                                     expandable: false,
-                                    icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                                    icon: 'favorite',
                                     isExpanded: false,
                                     obj: {
                                         k: 'LOCEXD',
@@ -183,7 +183,7 @@ const dataStaff = {
                                     children: [],
                                     disabled: false,
                                     expandable: false,
-                                    icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                                    icon: 'favorite',
                                     isExpanded: false,
                                     obj: {
                                         k: 'LOCEXD',
@@ -216,7 +216,7 @@ const dataStaff = {
                             children: [],
                             disabled: false,
                             expandable: false,
-                            icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                            icon: 'favorite',
                             isExpanded: false,
                             obj: {
                                 k: 'LOCEXD',
@@ -233,7 +233,7 @@ const dataStaff = {
                             children: [],
                             disabled: false,
                             expandable: false,
-                            icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                            icon: 'favorite',
                             isExpanded: false,
                             obj: {
                                 k: 'LOCEXD',
@@ -270,7 +270,7 @@ const dataStaff = {
                                     children: [],
                                     disabled: false,
                                     expandable: false,
-                                    icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCTML.jsf?ln=smeupIcons',
+                                    icon: 'favorite',
                                     id: 'LOCTML',
                                     isExpanded: false,
                                     obj: {
@@ -287,7 +287,7 @@ const dataStaff = {
                                     children: [],
                                     disabled: false,
                                     expandable: false,
-                                    icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                                    icon: 'favorite',
                                     isExpanded: false,
                                     obj: {
                                         k: 'LOCEXD',
@@ -304,7 +304,7 @@ const dataStaff = {
                                     children: [],
                                     disabled: false,
                                     expandable: false,
-                                    icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                                    icon: 'favorite',
                                     isExpanded: false,
                                     obj: {
                                         k: 'LOCEXD',
@@ -321,7 +321,7 @@ const dataStaff = {
                                     children: [],
                                     disabled: false,
                                     expandable: false,
-                                    icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCTML.jsf?ln=smeupIcons',
+                                    icon: 'favorite',
                                     isExpanded: false,
                                     obj: {
                                         k: 'LOCTML',
@@ -369,7 +369,7 @@ const dataStaff = {
                     children: [],
                     disabled: false,
                     expandable: false,
-                    icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                    icon: 'favorite',
                     isExpanded: false,
                     obj: {
                         k: 'LOCEXD',
@@ -386,7 +386,7 @@ const dataStaff = {
                     children: [],
                     disabled: false,
                     expandable: false,
-                    icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3AMO%253BLOCEXD.jsf?ln=smeupIcons',
+                    icon: 'favorite',
                     isExpanded: false,
                     obj: {
                         k: 'LOCEXD',
@@ -419,7 +419,7 @@ const dataStaff = {
             ],
             disabled: false,
             expandable: true,
-            icon: '/Web/javax.faces.resource/TA%253BB%25C2%25A3A%253BD0.jsf?ln=smeupIcons',
+            icon: 'account',
             id: 'D0',
             isExpanded: false,
             obj: {
@@ -2385,6 +2385,218 @@ const dataLayout = {
     ],
 };
 
+const dataStacked = {
+    columns: [],
+    rows: [
+        {
+            children: [
+                {
+                    children: [
+                        {
+                            children: [
+                                {
+                                    disabled: false,
+                                    expandable: false,
+                                    icon: 'favorite',
+                                    id: 'LOCEXD',
+                                    isExpanded: false,
+                                    obj: {
+                                        k: 'LOCEXD',
+                                        p: 'B£AMO',
+                                        t: 'TA',
+                                    },
+                                    options: true,
+                                    style: {},
+                                    value: 'Scheda oggetto',
+                                    visible: true,
+                                },
+                            ],
+                            disabled: false,
+                            expandable: true,
+                            icon: 'table-large',
+                            id: 'FOS',
+                            isExpanded: true,
+                            obj: {
+                                k: 'FOS',
+                                p: 'BRE',
+                                t: 'TA',
+                            },
+                            options: true,
+                            style: {},
+                            value: 'FOR Debiti operaz. societ.',
+                            visible: true,
+                        },
+                        {
+                            children: [
+                                {
+                                    disabled: false,
+                                    expandable: false,
+                                    icon: 'favorite',
+                                    isExpanded: false,
+                                    obj: {
+                                        k: 'LOCEXD',
+                                        p: 'B£AMO',
+                                        t: 'TA',
+                                    },
+                                    options: true,
+                                    style: {},
+                                    value: 'Scheda oggetto',
+                                    visible: true,
+                                },
+                                {
+                                    children: [],
+                                    disabled: false,
+                                    expandable: false,
+                                    icon: 'favorite',
+                                    id: 'LOCTML',
+                                    isExpanded: false,
+                                    obj: {
+                                        k: 'LOCTML',
+                                        p: 'B£AMO',
+                                        t: 'TA',
+                                    },
+                                    options: true,
+                                    style: {},
+                                    value: 'Timeline',
+                                    visible: true,
+                                },
+                            ],
+                            disabled: false,
+                            expandable: true,
+                            icon: 'table-large',
+                            id: 'FOS',
+                            isExpanded: true,
+                            obj: {
+                                k: 'FOS',
+                                p: 'BRE',
+                                t: 'TA',
+                            },
+                            options: true,
+                            style: {},
+                            value: 'FOR Debiti operaz. societ.',
+                            visible: true,
+                        },
+                        {
+                            children: [],
+                            disabled: false,
+                            expandable: false,
+                            icon: 'table-large',
+                            id: 'AGE',
+                            isExpanded: false,
+                            isWeird: true,
+                            obj: {
+                                k: 'AGE',
+                                p: 'BRE',
+                                t: 'TA',
+                            },
+                            options: true,
+                            style: {},
+                            value: 'Agente',
+                            visible: true,
+                        },
+                        {
+                            children: [
+                                {
+                                    children: [],
+                                    disabled: false,
+                                    expandable: false,
+                                    icon: 'favorite',
+                                    id: 'LOCTML',
+                                    isExpanded: false,
+                                    obj: {
+                                        k: 'LOCTML',
+                                        p: 'B£AMO',
+                                        t: 'TA',
+                                    },
+                                    options: true,
+                                    style: {},
+                                    value: 'Timeline',
+                                    visible: true,
+                                },
+                                {
+                                    children: [],
+                                    disabled: false,
+                                    expandable: false,
+                                    icon: 'favorite',
+                                    isExpanded: false,
+                                    obj: {
+                                        k: 'LOCTML',
+                                        p: 'B£AMO',
+                                        t: 'TA',
+                                    },
+                                    options: true,
+                                    style: {},
+                                    value: 'Timeline',
+                                    visible: true,
+                                },
+                            ],
+                            disabled: false,
+                            expandable: true,
+                            icon: 'table-large',
+                            id: 'BAN',
+                            isExpanded: true,
+                            obj: {
+                                k: 'BAN',
+                                p: 'BRE',
+                                t: 'TA',
+                            },
+                            options: true,
+                            style: {},
+                            value: 'Banche',
+                            visible: true,
+                        },
+                    ],
+                    disabled: false,
+                    expandable: true,
+                    icon: 'table-large',
+                    id: '03',
+                    isExpanded: true,
+                    obj: {
+                        k: '03',
+                        p: 'V§R',
+                        t: 'TA',
+                    },
+                    options: true,
+                    style: {},
+                    value: 'Lombardia',
+                    visible: true,
+                },
+                {
+                    children: [],
+                    disabled: false,
+                    expandable: false,
+                    icon: 'table-large',
+                    id: '14',
+                    isExpanded: false,
+                    obj: {
+                        k: '14',
+                        p: 'V§R',
+                        t: 'TA',
+                    },
+                    options: true,
+                    style: {},
+                    value: 'Molise',
+                    visible: true,
+                },
+            ],
+            disabled: false,
+            expandable: true,
+            icon: 'favorite',
+            id: 'D0',
+            isExpanded: true,
+            obj: {
+                k: 'D0',
+                p: 'B£A',
+                t: 'TA',
+            },
+            options: true,
+            style: {},
+            value: 'AcosUP Costi Avanzati',
+            visible: true,
+        },
+    ],
+};
+
 const layout = {
     horizontal: true,
     sections: [
@@ -2422,9 +2634,14 @@ const layout = {
 
 const familyTreeLayout = document.getElementById('layout');
 const familyTreeStaff = document.getElementById('staff');
+const familyTreeStacked = document.getElementById('stacked');
 familyTreeLayout.data = dataLayout;
 familyTreeLayout.layout = layout;
 familyTreeStaff.data = dataStaff;
+familyTreeStaff.layout = 2;
+familyTreeStacked.data = dataStacked;
+familyTreeStacked.collapsible = false;
+familyTreeStacked.stackedLeaves = true;
 
 document.addEventListener('kup-familytree-click', (e) => {
     console.log(e);

package/dist/collection/assets/form.js

@@ -427,7 +427,48 @@ const layoutData = {
     ],
 };
 
+const dataAutocomplete = {
+    columns: [
+        {
+            name: 'ACC',
+            title: 'Username',
+        },
+        {
+            name: 'DES',
+            title: 'Password',
+        },
+    ],
+    rows: [
+        {
+            cells: {
+                ACC: {
+                    value: '',
+                    isEditable: true,
+                    data: {
+                        label: 'Username',
+                        name: 'something',
+                        outlined: true,
+                    },
+                },
+                DES: {
+                    value: '',
+                    isEditable: true,
+                    data: {
+                        inputType: 'password',
+                        label: 'Password',
+                        name: 'something-else',
+                        outlined: true,
+                    },
+                },
+            },
+            id: '0',
+        },
+    ],
+};
+
 const form = document.getElementById('form');
 form.data = data;
 const formWithLayout = document.getElementById('form-with-layout');
 formWithLayout.data = layoutData;
+const formWithAutocomplete = document.getElementById('form-with-autocomplete');
+formWithAutocomplete.data = dataAutocomplete;

package/dist/collection/assets/index.js

@@ -126,6 +126,10 @@ components.data = [
         value: 'KupData',
         id: 'kupdata.html',
     },
+    {
+        value: 'KupInteract',
+        id: 'kupinteract.html',
+    },
     {
         value: 'KupTooltip',
         id: 'kuptooltip.html',

package/dist/collection/assets/kupinteract.js

@@ -0,0 +1,68 @@
+const items = document.querySelectorAll('.item');
+const wrapper = document.querySelector('#wrapper');
+
+const initialize = () => {
+    kupManager.interact.dropzone(
+        wrapper,
+        null,
+        {
+            dispatcher: wrapper,
+            type: 'text/generic',
+        },
+        {
+            drop: (e) => {
+                let delta = null;
+                let el = null;
+                items.forEach((item) => {
+                    const rect = item.getBoundingClientRect();
+                    let tempDelta = e.dragEvent.client.y - rect.y;
+                    if (tempDelta < 0) {
+                        tempDelta = tempDelta * -1;
+                    }
+                    if (delta === null || tempDelta < delta) {
+                        delta = tempDelta;
+                        el = item;
+                    }
+                });
+                if (!el || e.relatedTarget === el) {
+                    console.log('Not moved.');
+                } else {
+                    console.log(
+                        'Moved to position ' + el.id + '. (delta ' + delta + ')'
+                    );
+                    e.relatedTarget.remove();
+                    wrapper.insertBefore(e.relatedTarget, el);
+                }
+            },
+        }
+    );
+    for (let index = 0; index < items.length; index++) {
+        const item = items[index];
+        const randomColor = kupManager.theme.randomColor(50);
+        item.style.backgroundColor = randomColor;
+        item.style.color = kupManager.theme.colorContrast(randomColor);
+        const handleEl = item.querySelector('.handle');
+        kupManager.interact.draggable(
+            item,
+            {
+                allowFrom: handleEl ? handleEl : null,
+            },
+            null,
+            'clone',
+            {
+                end: () => {
+                    kupManager.scrollOnHover.stop(wrapper);
+                    kupManager.scrollOnHover.unregister(wrapper);
+                },
+                start: () => {
+                    kupManager.scrollOnHover.register(wrapper, true, {
+                        back: 0.3,
+                        forward: 0.7,
+                    });
+                },
+            }
+        );
+    }
+};
+
+document.addEventListener('kup-manager-ready', initialize);

package/dist/collection/collection-manifest.json

@@ -1,13 +1,13 @@
 {
   "entries": [
+    "./components/kup-text-field/kup-text-field.js",
+    "./components/kup-chart/kup-chart.js",
+    "./components/kup-tree/kup-tree.js",
+    "./components/kup-data-table/kup-data-table.js",
     "./components/kup-card/kup-card.js",
     "./components/kup-badge/kup-badge.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",
@@ -50,7 +50,7 @@
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "2.17.0",
+    "version": "2.17.3",
     "typescriptVersion": "4.5.4"
   },
   "collections": [],

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

@@ -1018,9 +1018,11 @@ export class KupBox {
     return {
       jsx: kanbanJSX,
       style: {
-        'grid-template-columns': this.kanban.size
-          ? `repeat(${Object.keys(kanbanSections).length}, ${this.kanban.size})`
-          : `repeat(${Object.keys(kanbanSections).length}, 1fr)`,
+        'grid-template-columns': this.kanban.isStacked
+          ? 'repeat(1fr)'
+          : this.kanban.size
+            ? `repeat(${Object.keys(kanbanSections).length}, ${this.kanban.size})`
+            : `repeat(${Object.keys(kanbanSections).length}, 1fr)`,
       },
     };
   }

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

@@ -4,6 +4,7 @@
  */
 export var KupButtonProps;
 (function (KupButtonProps) {
+  KupButtonProps["buttonType"] = "Sets the type of the button.";
   KupButtonProps["checked"] = "When set to true, the icon button state will be on.";
   KupButtonProps["customStyle"] = "Custom style of the component.";
   KupButtonProps["disabled"] = "Defaults at false. When set to true, the component is disabled.";

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

@@ -19,6 +19,11 @@ export class KupButton {
     /*-------------------------------------------------*/
     /*                    P r o p s                    */
     /*-------------------------------------------------*/
+    /**
+     * Sets the type of the button.
+     * @default null
+     */
+    this.buttonType = null;
     /**
      * When set to true, the icon button state will be on.
      * @default false
@@ -165,6 +170,7 @@ export class KupButton {
   }
   render() {
     const props = {
+      buttonType: this.buttonType,
       checked: this.checked,
       danger: this.rootElement.classList.contains('kup-danger')
         ? true
@@ -233,6 +239,27 @@ export class KupButton {
     "$": ["kup-button.css"]
   }; }
   static get properties() { return {
+    "buttonType": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "default",
+            "text": "null"
+          }],
+        "text": "Sets the type of the button."
+      },
+      "attribute": "button-type",
+      "reflect": false,
+      "defaultValue": "null"
+    },
     "checked": {
       "type": "boolean",
       "mutable": true,

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

@@ -25,6 +25,7 @@
   padding: 1em;
   grid-gap: 0.5em;
   border: 1px solid var(--kup-primary-color);
+  height: auto;
 }
 
 .section {
@@ -64,6 +65,12 @@
   padding: 1em;
 }
 
+.section-placeholder {
+  background-color: rgba(var(--kup-secondary-color-rgb), 0.5);
+  min-height: 1em;
+  min-width: 1em;
+}
+
 .component {
   height: fit-content;
   padding: 1em;