@sme.up/ketchup 10.3.6 → 10.3.8

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

@@ -347,7 +347,8 @@ export class KupCalendar {
             if (!this.dateCol || !this.descrCol) {
                 throw new Error('dateCol or/and descrCol are not specified, check calendarColums props');
             }
-            events = this.getRows().map((row) => {
+            events = this.getRows()
+                .map((row) => {
                 const cell = row.cells[this.dateCol];
                 if (cell) {
                     let startDate = this.kupManager.dates.toDayjs(cell.value);
@@ -394,9 +395,12 @@ export class KupCalendar {
                             : `invalid start date: ${cell.value}`}. ${endDate
                             ? `end date: ${endDate}`
                             : `invalid end date: ${cell.value}`}]`, KupDebugCategory.WARNING);
+                        return null;
                     }
                 }
-            });
+                return null;
+            })
+                .filter((event) => event !== null);
         }
         catch (error) {
             this.kupManager.debug.logMessage(this, `Unable to create calendard events, caused by: ${error}`, KupDebugCategory.ERROR);
@@ -461,11 +465,11 @@ export class KupCalendar {
         this.kupManager.debug.logRender(this, true);
     }
     render() {
-        return (h(Host, { key: '694d6c782eed06ec64232acc3ef163236c157711' }, h("style", { key: 'eaa3dca371969bb1cedb5b45e019ad6b563d3a0f' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '8d1d89e4526d1b50649d9486f5f292ff328d5457', id: componentWrapperId }, h("div", { key: 'fd7ce40682db901688644ff02e4fcd56f79c9256', class: "navigation" }, !this.hideNavigation ? (h("div", { class: "navigation__left" }, h(FButton, { icon: "chevron_left", onClick: () => this.onPrev(), title: this.kupManager.language.translate(KupLanguageGeneric.PREVIOUS), wrapperClass: "navigation__prev" }), h(FButton, { icon: "calendar", onClick: () => this.onToday(), title: this.kupManager.language.translate(KupLanguageGeneric.TODAY), wrapperClass: "navigation__today" }), h(FButton, { icon: "chevron_right", onClick: () => this.onNext(), title: this.kupManager.language.translate(KupLanguageGeneric.NEXT), wrapperClass: "navigation__next" }))) : null, h("div", { key: '832adde7b78762398fb46d100159bc9e3ad31ea3', class: `navigation__title ${this.hideNavigation
+        return (h(Host, { key: '84b96d480944784ba43b426e8d01e536f1bafc67' }, h("style", { key: 'bdaf0c3a8ee5cc6bdc7dc9e9cbc13529ea611e28' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '3ae0c2d73d9d70be0cf3a13f56eaf09fc5b29126', id: componentWrapperId }, h("div", { key: '06aa3eea99f3c49e88509c4393231fd47d7eeace', class: "navigation" }, !this.hideNavigation ? (h("div", { class: "navigation__left" }, h(FButton, { icon: "chevron_left", onClick: () => this.onPrev(), title: this.kupManager.language.translate(KupLanguageGeneric.PREVIOUS), wrapperClass: "navigation__prev" }), h(FButton, { icon: "calendar", onClick: () => this.onToday(), title: this.kupManager.language.translate(KupLanguageGeneric.TODAY), wrapperClass: "navigation__today" }), h(FButton, { icon: "chevron_right", onClick: () => this.onNext(), title: this.kupManager.language.translate(KupLanguageGeneric.NEXT), wrapperClass: "navigation__next" }))) : null, h("div", { key: 'bcf1061ef340154ce810504963c635677d7b08ec', class: `navigation__title ${this.hideNavigation
                 ? 'navigation__title--centered'
                 : ''}`, ref: (el) => {
                 this.navTitle = el;
-            } }), h("div", { key: '93d4d527539c090ca8a29ee76c04ef8ee0c36d29', class: "navigation__right" }, this.enableChangeView ? (h(FChip, Object.assign({}, this.setChipProps()))) : null)), h("div", { key: 'cf94727499fdd2dd62a8e0fb0481575b631efb4f', class: "calendar", ref: (el) => (this.calendarContainer = el) }))));
+            } }), h("div", { key: 'd0da3cdd51e56c4d707789af64e55c1d19a24973', class: "navigation__right" }, this.enableChangeView ? (h(FChip, Object.assign({}, this.setChipProps()))) : null)), h("div", { key: 'c8cd358bceae781d6add7ff26cc09878ef0b5834', class: "calendar", ref: (el) => (this.calendarContainer = el) }))));
     }
     disconnectedCallback() {
         if (this.calendar) {

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

@@ -6,7 +6,12 @@ export var KupChipProps;
 (function (KupChipProps) {
     KupChipProps["customStyle"] = "Custom style of the component.";
     KupChipProps["data"] = "List of elements.";
-    KupChipProps["displayId"] = "When enabled, the chip's text will display both the id and the value.";
+    // displayId = "When enabled, the chip's text will display both the id and the value.",
+    KupChipProps["disabled"] = "When true, the chip cannot be edited, nor removed.";
+    KupChipProps["displayMode"] = "When enabled, the chip will display both the id and description of the data.";
     KupChipProps["enableInput"] = "When enabled, it's possible to add items to the chip's dataset through an input slot (kup-autocomplete, kup-combobox, kup-text-field).";
+    KupChipProps["label"] = "When set, will be shown a label on the chips.";
+    KupChipProps["sizing"] = "The size of the chip. Available sizes: small, medium.";
+    KupChipProps["styling"] = "The style of the chip. Available styles: outlined, raised.";
     KupChipProps["type"] = "The type of chip. Available types: input, filter, choice or empty for default.";
 })(KupChipProps || (KupChipProps = {}));

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

@@ -27,13 +27,13 @@ export class KupChip {
         this.kupManager = kupManagerInstance();
         this.customStyle = '';
         this.data = [];
-        this.enableInput = false;
         this.disabled = false;
-        this.type = FChipType.STANDARD;
-        this.sizing = FChipSize.SMALL;
-        this.styling = FChipStyling.RAISED;
         this.displayMode = ItemsDisplayMode.DESCRIPTION;
+        this.enableInput = false;
         this.label = null;
+        this.sizing = FChipSize.SMALL;
+        this.styling = FChipStyling.RAISED;
+        this.type = FChipType.STANDARD;
     }
     onKupBlur(chip) {
         this.kupBlur.emit({
@@ -196,7 +196,7 @@ export class KupChip {
             props.onFocus.push((chip) => this.onKupFocus(chip));
             props.onIconClick.push((chip) => this.onKupIconClick(chip));
         }
-        return (h(Host, { key: '9e280d8351e8a26e8c7ab5d130b27c354738257d', "onKup-autocomplete-itemclick": (e) => {
+        return (h(Host, { key: '092919df319761de61a7e6535f0dd18976463c6c', "onKup-autocomplete-itemclick": (e) => {
                 __classPrivateFieldGet(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
             }, "onKup-combobox-itemclick": (e) => {
                 __classPrivateFieldGet(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
@@ -206,7 +206,7 @@ export class KupChip {
                 __classPrivateFieldGet(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
             }, "onKup-textfield-submit": (e) => {
                 __classPrivateFieldGet(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
-            } }, h("style", { key: '4cea204a7aa31ca3f91ee3f0f94cc088e7f7373f' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '46238eff774c3ff26846cf401a870bfd24d8cd59', id: componentWrapperId }, this.label ? (h("div", { class: "mdc-text-field__label-container" }, h("label", { class: "mdc-label" }, this.label))) : null, ((_a = this.data) === null || _a === void 0 ? void 0 : _a.length) > 0 ? h(FChip, Object.assign({}, props)) : null, h("slot", { key: '2c59e3ee549a3d2797aa81129d85661aa440bb58', name: "field" }))));
+            } }, h("style", { key: '3cc916a8db665b151f59f4224d5f6f168268f842' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '57500014b7c3f0fe98add9eb950fa88615e6eec0', id: componentWrapperId }, this.label ? (h("div", { class: "mdc-text-field__label-container" }, h("label", { class: "mdc-label" }, this.label))) : null, ((_a = this.data) === null || _a === void 0 ? void 0 : _a.length) > 0 ? h(FChip, Object.assign({}, props)) : null, h("slot", { key: '92f0d3996bddacc0be40eab0298c4716de3783c1', name: "field" }))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);
@@ -274,7 +274,7 @@ export class KupChip {
                 },
                 "defaultValue": "[]"
             },
-            "enableInput": {
+            "disabled": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -289,13 +289,40 @@ export class KupChip {
                             "name": "default",
                             "text": "false"
                         }],
-                    "text": "When enabled, it's possible to add items to the chip's dataset through an input slot (kup-autocomplete, kup-combobox, kup-text-field)."
+                    "text": "When true, the chip cannot be edited, nor removed."
                 },
-                "attribute": "enable-input",
+                "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"
             },
-            "disabled": {
+            "displayMode": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "ItemsDisplayMode",
+                    "resolved": "ItemsDisplayMode.CODE | ItemsDisplayMode.CODE_AND_DESC | ItemsDisplayMode.CODE_AND_DESC_ALIAS | ItemsDisplayMode.DESCRIPTION | ItemsDisplayMode.DESC_AND_CODE",
+                    "references": {
+                        "ItemsDisplayMode": {
+                            "location": "import",
+                            "path": "../kup-list/kup-list-declarations",
+                            "id": "src/components/kup-list/kup-list-declarations.ts::ItemsDisplayMode"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "ItemsDisplayMode.DESCRIPTION"
+                        }],
+                    "text": "When enabled, the chip's text will display both the id and description."
+                },
+                "attribute": "display-mode",
+                "reflect": false,
+                "defaultValue": "ItemsDisplayMode.DESCRIPTION"
+            },
+            "enableInput": {
                 "type": "boolean",
                 "mutable": false,
                 "complexType": {
@@ -310,38 +337,32 @@ export class KupChip {
                             "name": "default",
                             "text": "false"
                         }],
-                    "text": "When true, the chip cannot be edited, nor removed."
+                    "text": "When enabled, it's possible to add items to the chip's dataset through an input slot (kup-autocomplete, kup-combobox, kup-text-field)."
                 },
-                "attribute": "disabled",
+                "attribute": "enable-input",
                 "reflect": false,
                 "defaultValue": "false"
             },
-            "type": {
+            "label": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "FChipType",
-                    "resolved": "FChipType.CHOICE | FChipType.FILTER | FChipType.INPUT | FChipType.STANDARD",
-                    "references": {
-                        "FChipType": {
-                            "location": "import",
-                            "path": "../../f-components/f-chip/f-chip-declarations",
-                            "id": "src/f-components/f-chip/f-chip-declarations.ts::FChipType"
-                        }
-                    }
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
                 },
                 "required": false,
                 "optional": false,
                 "docs": {
                     "tags": [{
                             "name": "default",
-                            "text": "FChipType.STANDARD"
+                            "text": "null"
                         }],
-                    "text": "The type of chip. Available types: input, filter, choice or empty for default."
+                    "text": "When set,will be shown a label on the chips"
                 },
-                "attribute": "type",
+                "attribute": "label",
                 "reflect": false,
-                "defaultValue": "FChipType.STANDARD"
+                "defaultValue": "null"
             },
             "sizing": {
                 "type": "string",
@@ -397,17 +418,17 @@ export class KupChip {
                 "reflect": false,
                 "defaultValue": "FChipStyling.RAISED"
             },
-            "displayMode": {
+            "type": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "ItemsDisplayMode",
-                    "resolved": "ItemsDisplayMode.CODE | ItemsDisplayMode.CODE_AND_DESC | ItemsDisplayMode.CODE_AND_DESC_ALIAS | ItemsDisplayMode.DESCRIPTION | ItemsDisplayMode.DESC_AND_CODE",
+                    "original": "FChipType",
+                    "resolved": "FChipType.CHOICE | FChipType.FILTER | FChipType.INPUT | FChipType.STANDARD",
                     "references": {
-                        "ItemsDisplayMode": {
+                        "FChipType": {
                             "location": "import",
-                            "path": "../kup-list/kup-list-declarations",
-                            "id": "src/components/kup-list/kup-list-declarations.ts::ItemsDisplayMode"
+                            "path": "../../f-components/f-chip/f-chip-declarations",
+                            "id": "src/f-components/f-chip/f-chip-declarations.ts::FChipType"
                         }
                     }
                 },
@@ -416,34 +437,13 @@ export class KupChip {
                 "docs": {
                     "tags": [{
                             "name": "default",
-                            "text": "ItemsDisplayMode.DESCRIPTION"
-                        }],
-                    "text": "When enabled, the chip's text will display both the id and description."
-                },
-                "attribute": "display-mode",
-                "reflect": false,
-                "defaultValue": "ItemsDisplayMode.DESCRIPTION"
-            },
-            "label": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [{
-                            "name": "default",
-                            "text": "null"
+                            "text": "FChipType.STANDARD"
                         }],
-                    "text": "When set,will be shown a label on the chips"
+                    "text": "The type of chip. Available types: input, filter, choice or empty for default."
                 },
-                "attribute": "label",
+                "attribute": "type",
                 "reflect": false,
-                "defaultValue": "null"
+                "defaultValue": "FChipType.STANDARD"
             }
         };
     }

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

@@ -328,12 +328,14 @@ export class KupCombobox {
                 : false,
             showMarker: this.showMarker,
             legacyLook: this.legacyLook,
-            size: getSizeOfInputElement(this.data, this.displayMode, this.size),
+            size: this.size
+                ? this.size
+                : getSizeOfInputElement(this.data, this.displayMode, this.size),
             title: (_a = this.displayedValue) !== null && _a !== void 0 ? _a : '',
         };
         const fullHeight = this.rootElement.classList.contains('kup-full-height');
         const fullWidth = this.rootElement.classList.contains('kup-full-width');
-        return (h(Host, { key: 'b419cdf58d190601c58d0ab1501e6cfeeb215c4f', class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h("style", { key: '9c5b4ad2ae9303e607ab0667cd31d2fe95f50524' }, __classPrivateFieldGet(this, _KupCombobox_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '759809bb42d7f30abdcb5db1abb4a0e5689fc731', id: componentWrapperId, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h(FTextField, Object.assign({ key: '9e864b76be8ad6602186797f68d237980ebd307d' }, props, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, trailingIcon: true, icon: this.showDropDownIcon
+        return (h(Host, { key: '8bb8eace416a6799a32f5d5222759ead3525ed7d', class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h("style", { key: 'bf9817caafcbd303719c862f4f84111ef6da27c1' }, __classPrivateFieldGet(this, _KupCombobox_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '1052268f4d6e8227b3fdc6c6a25ea2004f21d197', id: componentWrapperId, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h(FTextField, Object.assign({ key: 'df2cf6672cfe3c9360476df936cedff6449861b6' }, props, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, trailingIcon: true, icon: this.showDropDownIcon
                 ? KupThemeIconValues.DROPDOWN
                 : null, value: this.displayedValue, onBlur: () => this.onKupBlur(), onClick: () => this.onKupIconClick(), onChange: (e) => this.onKupChange(e.target.value), onFocus: () => this.onKupFocus(), onInput: () => this.onKupInput(), onIconClick: () => this.onKupIconClick(), onClearIconClick: () => this.onKupClearIconClick() }))), __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_prepList).call(this)));
     }

package/dist/collection/components/kup-data-table/kup-data-table-declarations.js

@@ -67,6 +67,7 @@ export var KupDataTableProps;
     KupDataTableProps["transpose"] = "Transposes the data of the data table.";
     KupDataTableProps["updatableData"] = "When set to true, editable cells will be rendered using input components and update button will appair below the matrix";
     KupDataTableProps["updateOnClick"] = "When set to true, editable checkbox will call update";
+    KupDataTableProps["visibleColumns"] = "Defines the columns that are visible in the table";
 })(KupDataTableProps || (KupDataTableProps = {}));
 export var SortMode;
 (function (SortMode) {

package/dist/collection/components/kup-data-table/kup-data-table-helper.js

@@ -763,12 +763,16 @@ function cloneRowGroup(group) {
  * @param includesAlsoEmptyRows
  * @returns
  */
-export function getDiffData(originalData, modifiedData, includesAlsoEmptyRows = false) {
+export function getDiffData(originalData, modifiedData, includesAlsoEmptyRows = false, insertedRowsIds = []) {
     const diffDataTable = {
         columns: modifiedData.columns.filter((col) => col.visible),
         rows: [],
     };
     for (const modifiedRow of modifiedData.rows) {
+        if (insertedRowsIds.includes(modifiedRow.id)) {
+            diffDataTable.rows.push(modifiedRow);
+            continue;
+        }
         const newRow = { cells: {}, id: modifiedRow.id };
         for (const column of diffDataTable.columns) {
             const cellKey = column.name;

package/dist/collection/components/kup-data-table/kup-data-table.css

@@ -226,6 +226,14 @@
     --kup-fcell-padding-wide,
     var(--kup-space-04) var(--kup-space-03)
   );
+  --kup_datatable_inserted_row_background: var(
+    --kup-datatable-inserted-row-background,
+    #c8e6c9
+  );
+  --kup_datatable_modified_row_background: var(
+    --kup-datatable-modified-row-background,
+    #ffd8a6
+  );
   display: block;
   font-family: var(--kup_datatable_font_family);
   font-size: var(--kup_datatable_font_size);
@@ -467,6 +475,12 @@ tbody tr[kup-draggable] {
 tbody tr.selected td {
   background-color: var(--kup_datatable_background_color_selected);
 }
+tbody tr.inserted td {
+  background-color: var(--kup_datatable_inserted_row_background);
+}
+tbody tr.modified td {
+  background-color: var(--kup_datatable_modified_row_background);
+}
 tbody tr:hover:not(.group):not(.selected) td {
   color: var(--kup_datatable_text_color_hover);
   background-color: var(--kup_datatable_background_color_hover);
@@ -669,7 +683,7 @@ th.obj:hover span:not(.overlay-action) {
   mask: var(--kup-key-icon);
 }
 
-@media (max-width: 678px) {
+@media (max-width: 830px) {
   .actions-wrapper {
     flex-direction: column-reverse;
   }
@@ -718,6 +732,7 @@ th.obj:hover span:not(.overlay-action) {
 
 .paginator-tabs {
   width: 100%;
+  display: flex;
 }
 .paginator-tabs kup-paginator {
   display: inline-flex;
@@ -729,13 +744,15 @@ th.obj:hover span:not(.overlay-action) {
   float: right;
 }
 
+@media (max-width: 830px) {
+  .above-wrapper.paginator-top {
+    border-bottom: 1px solid var(--kup-border-subtle);
+  }
+}
 @media (max-width: 500px) {
   .paginator-wrapper {
     min-width: fit-content;
   }
-  .above-wrapper.paginator-top {
-    border-bottom: 1px solid var(--kup-border-subtle);
-  }
 }
 sticky-header {
   display: none;