@sme.up/ketchup 10.3.1 → 10.3.2

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

@@ -99,7 +99,7 @@ export class KupTabBar {
         });
     }
     onKupToolbarItemClick(e) {
-        this.kupItemClick.emit({
+        this.kupToolbarItemClick.emit({
             comp: this,
             id: this.rootElement.id,
             value: this.value,
@@ -313,27 +313,31 @@ export class KupTabBar {
                 'kup-dense': this.dense,
                 'kup-danger': node.danger,
             };
-            const tabEl = (h("f-button", { class: tabClass, role: "tab", "aria-selected": this.data[i].active ? true : false, tabIndex: i, title: node.title ? node.title : null, onBlur: () => this.onKupBlur(i, node), onClick: () => this.onKupClick(i, node), onFocus: () => this.onKupFocus(i, node) }, h("span", { class: "tab__content" }, node.icon ? (h(FImage, { color: `var(${KupThemeColorValues.PRIMARY})`, resource: node.icon, placeholderResource: node.placeholderIcon, wrapperClass: "tab__icon" })) : null, node.value ? (h("span", { class: "tab__text-label" }, this.data[i].value)) : null), this.infoIcon && (h(FImage, { resource: "info_outline", sizeX: "16px", sizeY: "16px", onClick: async (event) => {
-                    event.stopPropagation();
-                    const el = event.currentTarget;
-                    const data = await this.infoCallback();
-                    this.infoState = data;
-                    if (this.infoState.length > 0) {
-                        this.onKupInfoIconClick(el);
-                    }
-                    else {
-                        this.kupManager.debug.logMessage(this, 'InfoIcon data is empty, not opening dropdown.');
+            const tabEl = (h("f-button", { class: tabClass, role: "tab", "aria-selected": node.active ? true : false, tabIndex: i, title: node.title ? node.title : null, onBlur: () => this.onKupBlur(i, node), onClick: () => this.onKupClick(i, node), onFocus: () => this.onKupFocus(i, node) }, h("span", { class: "tab__content" }, node.icon ? (h(FImage, { color: `var(${KupThemeColorValues.PRIMARY})`, resource: node.icon, placeholderResource: node.placeholderIcon, wrapperClass: "tab__icon" })) : null, node.value ? (h("span", { class: "tab__text-label" }, node.value)) : null), this.infoIcon && (h(FImage, { resource: "info_outline", sizeX: "16px", sizeY: "16px", onClick: async (event) => {
+                    if (node.active) {
+                        event.stopPropagation();
+                        const el = event.currentTarget;
+                        const data = await this.infoCallback();
+                        this.infoState = data;
+                        if (this.infoState.length > 0) {
+                            this.onKupInfoIconClick(el);
+                        }
+                        else {
+                            this.kupManager.debug.logMessage(this, 'InfoIcon data is empty, not opening dropdown.');
+                        }
                     }
                 }, wrapperClass: "tab__iconToolbar iconInfo" })), this.toolbar && (h(FImage, { resource: "more_vert", sizeX: "16px", sizeY: "16px", onClick: async (event) => {
-                    event.stopPropagation();
-                    const el = event.currentTarget;
-                    const data = await this.toolbarCallback();
-                    this.toolbarState = data;
-                    if (this.toolbarState.length > 0) {
-                        this.onKupIconClick(el);
-                    }
-                    else {
-                        this.kupManager.debug.logMessage(this, 'Toolbar data is empty, not opening dropdown.');
+                    if (node.active) {
+                        event.stopPropagation();
+                        const el = event.currentTarget;
+                        const data = await this.toolbarCallback();
+                        this.toolbarState = data;
+                        if (this.toolbarState.length > 0) {
+                            this.onKupIconClick(el);
+                        }
+                        else {
+                            this.kupManager.debug.logMessage(this, 'Toolbar data is empty, not opening dropdown.');
+                        }
                     }
                 }, wrapperClass: "tab__iconToolbar iconToolbar" })), h("span", { class: `tab-indicator ${node.active ? ' tab-indicator--active' : ''}` }, h("span", { class: "tab-indicator__content tab-indicator__content--underline" }))));
             tabBar.push(tabEl);
@@ -650,27 +654,6 @@ export class KupTabBar {
                         }
                     }
                 }
-            }, {
-                "method": "kupInfoIconClick",
-                "name": "kup-tabbar-infoiconclick",
-                "bubbles": true,
-                "cancelable": false,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Triggered when the icon inside tab is clicked."
-                },
-                "complexType": {
-                    "original": "KupTabBarEventPayload",
-                    "resolved": "KupTabBarEventPayload",
-                    "references": {
-                        "KupTabBarEventPayload": {
-                            "location": "import",
-                            "path": "./kup-tab-bar-declarations",
-                            "id": "src/components/kup-tab-bar/kup-tab-bar-declarations.ts::KupTabBarEventPayload"
-                        }
-                    }
-                }
             }, {
                 "method": "kupFocus",
                 "name": "kup-tabbar-focus",
@@ -693,8 +676,8 @@ export class KupTabBar {
                     }
                 }
             }, {
-                "method": "kupItemClick",
-                "name": "kup-tabbar-itemclick",
+                "method": "kupToolbarItemClick",
+                "name": "kup-tabbar-toolbaritemclick",
                 "bubbles": true,
                 "cancelable": false,
                 "composed": true,

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

@@ -185,13 +185,27 @@
   position: absolute;
   top: 0;
   left: 100%;
-  display: none;
+  visibility: hidden;
+  opacity: 0;
   z-index: 10;
-  transition: display 0.2s ease;
+  transition: opacity 0.2s ease, visibility 0.2s ease;
   background-color: var(--kup-gray-color-10);
   box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 6px 6px rgba(0, 0, 0, 0.05);
   width: inherit;
-  max-width: 200px;
+  pointer-events: none;
+}
+.parent-class > .nested-class.align-left {
+  left: auto;
+  right: 100%;
+}
+.parent-class > .nested-class.align-right {
+  left: 100%;
+  right: auto;
+}
+.parent-class:hover:not(.toolbar-item-disabled) > .nested-class {
+  visibility: visible;
+  opacity: 1;
+  pointer-events: auto;
 }
 .parent-class .chevron-right {
   float: right;
@@ -203,9 +217,6 @@
   font-weight: 400;
   letter-spacing: 1px;
 }
-.parent-class:hover:not(.toolbar-item-disabled) > .nested-class {
-  display: block;
-}
 
 .chevron-type-wrapper {
   display: flex;

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

@@ -1367,23 +1367,20 @@ export class KupTree {
         // Calculates if header must be shown or not
         const visibleHeader = this.showHeader && this.showColumns;
         let filterField = null;
-        if (this.globalFilter &&
-            this.data &&
-            this.data.length &&
-            this.data.length > 0) {
-            filterField = (h("div", { key: 'b9095e93e4a60648ccda218cbc7fcd738a108d8a', id: "global-filter" }, h("kup-text-field", { key: 'f98a0639052c43ce4e0ef13296136e467182ac4e', fullWidth: true, label: __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageSearch.SEARCH), sizing: KupComponentSizing.EXTRA_SMALL, icon: KupThemeIconValues.SEARCH, initialValue: this.globalFilterValue, "onkup-textfield-input": (event) => {
+        if (this.globalFilter) {
+            filterField = (h("div", { key: '7567ac1ef9545bea4bc979736a90604aafabe599', id: "global-filter" }, h("kup-text-field", { key: '9d4320f25390cdd9916b69b10c176c6aa6f3ee19', fullWidth: true, label: __classPrivateFieldGet(this, _KupTree_kupManager, "f").language.translate(KupLanguageSearch.SEARCH), sizing: KupComponentSizing.EXTRA_SMALL, icon: KupThemeIconValues.SEARCH, initialValue: this.globalFilterValue, "onkup-textfield-input": (event) => {
                     window.clearTimeout(this.globalFilterTimeout);
                     this.globalFilterTimeout = window.setTimeout(() => this.onGlobalFilterChange(event), 600);
                 } })));
         }
-        return (h(Host, { key: '15ef1ec888317912adcf8db2df390dbf06b906a5', "onKup-cell-click": (e) => {
+        return (h(Host, { key: '1707b7cb390d30ef0786500509bf5ba6eac9194c', "onKup-cell-click": (e) => {
                 this.kupTreeCellClick.emit(e.detail);
-            } }, h("style", { key: '46df5fad7874e3c272adcc78e909ee6035536ccc' }, __classPrivateFieldGet(this, _KupTree_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'd61be1bdc5e5e659a7169fc70dbf74ec09318ae2', id: componentWrapperId, class: wrapperClass, style: wrapperStyle }, filterField, h("div", { key: 'b35a3be92fdbf4f30e6e2b87fec7a7228db5aaa1', class: "wrapper", ref: (el) => (this.treeWrapperRef =
-                el) }, h("table", { key: '7bcd57a6d631589197c28de1088f0689bcaff46d', class: "kup-tree", "data-show-columns": this.showColumns, onContextMenu: (e) => {
+            } }, h("style", { key: 'ba9df04a579abe0848f08eb7ade8023dc4198438' }, __classPrivateFieldGet(this, _KupTree_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '0c1a22cbf5a8a33e58d4b7d39f3f6083f07beab2', id: componentWrapperId, class: wrapperClass, style: wrapperStyle }, filterField, h("div", { key: '32dde2e7b8f85421ed3506f60421348205e0214d', class: "wrapper", ref: (el) => (this.treeWrapperRef =
+                el) }, h("table", { key: '0ee43ca41e9fe5a0dfbf0e446c687a7bf89f8acf', class: "kup-tree", "data-show-columns": this.showColumns, onContextMenu: (e) => {
                 e.preventDefault();
-            } }, h("thead", { key: 'a0f63e145ce0f6c2c0f3f612b06edbf08ece937e', class: {
+            } }, h("thead", { key: 'd65ad49173c71366513c9c3a0900132b0865ab9a', class: {
                 'header--is-visible': visibleHeader,
-            } }, h("tr", { key: '5c3dce5b4828fdf00e91354aa9308798a3bf282d' }, visibleHeader ? this.renderHeader() : null)), h("tbody", { key: '2599e820e154176730bc67879708d68120eb4579' }, treeNodes), (this.showFooter || this.hasTotals()) &&
+            } }, h("tr", { key: '19d41241f8db4ea2509d8e203275a32ee72e8a0e' }, visibleHeader ? this.renderHeader() : null)), h("tbody", { key: 'acdb52709fbe70f644128e034d28b3db414845b0' }, treeNodes), (this.showFooter || this.hasTotals()) &&
             this.columns
             ? this.renderFooter()
             : null)))));

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

@@ -915,7 +915,8 @@ function cellEvent(e, props, cellType, cellEventName) {
 }
 function getValueFromEventTarget(e, cellType) {
     var _a;
-    const isInputEvent = !!(e.target.tagName === 'INPUT' || 'TEXTAREA');
+    const isInputEvent = !!(e.target.tagName === 'INPUT' ||
+        e.target.tagName === 'TEXTAREA');
     let value = isInputEvent
         ? e.target.value
         : e.detail.value;

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

@@ -36,7 +36,7 @@ export const FRadio = (props) => {
                     props.onChange(i, e);
                 }
                 e.stopPropagation();
-            } }, radioType === FRadioType.CHEVRON && (h(FImage, { resource: data.icon, sizeX: "14px", sizeY: "14px" })), h("label", { htmlFor: 'radio-element' }, data.label ? data.label : ''))));
+            } }, radioType === FRadioType.CHEVRON && (h(FImage, { resource: data.icon, sizeX: "14px", sizeY: "14px" })), h("label", { htmlFor: 'radio-element' }, data.label ? data.label : ''), data.shortcutLabel && (h("div", { class: "shortcut" }, data.shortcutLabel)))));
     }
     const styleObj = {
         '--kup_radio_columns': hasColumns

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

@@ -247,7 +247,7 @@ function setContent(props) {
                 e.preventDefault();
                 return;
             }
-        } })), props.trailingIcon ? iconEl : undefined, props.helperIcon && props.error ? (h("div", { class: "mdc-error-icon" }, h(FImage, Object.assign({}, propsFImage)))) : props.helperIcon && props.alert ? (h("div", { class: "mdc-alert-icon" }, h(FImage, Object.assign({}, propsFImage)))) : undefined, props.quantityButtons && (h("div", { class: "mdc-quantity-buttons" }, h("button", { onClick: props.onMinusClick }, minusEl), h("button", { onClick: props.onPlusClick }, plusEl))), props.isClearable ? (h("span", { class: `mdc-text-field__icon kup-icon ${KupThemeIconValues.CLEAR.replace('--', '')}`, onClick: props.onClearIconClick })) : undefined)));
+        } })), props.trailingIcon ? iconEl : undefined, props.helperIcon && props.error ? (h("div", { class: "mdc-error-icon" }, h(FImage, Object.assign({}, propsFImage)))) : props.helperIcon && props.alert ? (h("div", { class: "mdc-alert-icon" }, h(FImage, Object.assign({}, propsFImage)))) : undefined, props.quantityButtons && (h("div", { class: "mdc-quantity-buttons" }, h("button", { onClick: props.onMinusClick }, minusEl), h("button", { onClick: props.onPlusClick }, plusEl))), props.isClearable && props.value ? (h("span", { class: `mdc-text-field__icon kup-icon ${KupThemeIconValues.CLEAR.replace('--', '')}`, onClick: props.onClearIconClick })) : undefined)));
 }
 /**
  * Generates a helper HTML element for a text field based on the provided properties.

package/dist/collection/managers/kup-data/kup-data.js

@@ -234,6 +234,8 @@ export class KupData {
              * @returns {boolean} if cell contain action showed on f-cell
              */
             hasActionCell: (cell, commands) => {
+                if (!cell || !cell.obj)
+                    return false;
                 return commands.some((command) => this.cell.isActionCell(command, cell));
             },
             /**

package/dist/collection/managers/kup-dynamic-position/kup-dynamic-position.js

@@ -1,3 +1,11 @@
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f)
+        throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+        throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _KupDynamicPosition_instances, _KupDynamicPosition_setSubMenuPosition;
 import { kupDynamicPositionActiveClass, kupDynamicPositionAnchorAttribute, kupDynamicPositionAttribute, } from "./kup-dynamic-position-declarations";
 import { KupDynamicPositionPlacement } from "./kup-dynamic-position-declarations";
 const dom = document.documentElement;
@@ -10,6 +18,7 @@ export class KupDynamicPosition {
      * Initializes KupDynamicPosition.
      */
     constructor() {
+        _KupDynamicPosition_instances.add(this);
         this.container = document.createElement('div');
         this.container.setAttribute('kup-dynamic-position', '');
         document.body.appendChild(this.container);
@@ -241,6 +250,7 @@ export class KupDynamicPosition {
                 el.style.left = `${left}px`;
             }
         }
+        __classPrivateFieldGet(this, _KupDynamicPosition_instances, "m", _KupDynamicPosition_setSubMenuPosition).call(this, el);
     }
     reposition(el) {
         if (el.isConnected &&
@@ -276,6 +286,9 @@ export class KupDynamicPosition {
     }
     addRepositionListeners(el) {
         var _a;
+        if (el._repositionListener) {
+            return;
+        }
         const repositionListener = () => this.reposition(el);
         window.addEventListener('resize', repositionListener);
         window.addEventListener('scroll', repositionListener);
@@ -297,7 +310,9 @@ export class KupDynamicPosition {
         if ((_a = el === null || el === void 0 ? void 0 : el.kupDynamicPosition) === null || _a === void 0 ? void 0 : _a.anchor) {
             let container = this.getAnchorContainer(el);
             this.updateEventListenerOnAncestors(container, (el) => {
-                el.removeEventListener('scroll', repositionListener);
+                if (this.isScrollable(el)) {
+                    el.removeEventListener('scroll', repositionListener);
+                }
             });
         }
         delete el._repositionListener;
@@ -309,3 +324,32 @@ export class KupDynamicPosition {
             : undefined;
     }
 }
+_KupDynamicPosition_instances = new WeakSet(), _KupDynamicPosition_setSubMenuPosition = function _KupDynamicPosition_setSubMenuPosition(parentElement) {
+    var _a;
+    const SubMenuClass = {
+        MAIN: 'nested-class',
+        ALIGN_RIGHT: 'align-right',
+        ALIGN_LEFT: 'align-left',
+    };
+    const subMenuElementList = (_a = parentElement === null || parentElement === void 0 ? void 0 : parentElement.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll(`.${SubMenuClass.MAIN}`);
+    if (!(subMenuElementList === null || subMenuElementList === void 0 ? void 0 : subMenuElementList.length)) {
+        return;
+    }
+    const menuRect = parentElement.getBoundingClientRect();
+    subMenuElementList.forEach((subMenuElement) => {
+        subMenuElement.classList.remove(SubMenuClass.ALIGN_LEFT, SubMenuClass.ALIGN_RIGHT);
+        const subMenuRect = subMenuElement.getBoundingClientRect();
+        const subMenuRightEdge = menuRect.right + subMenuRect.width;
+        const isOverflowRight = subMenuRightEdge > window.innerWidth;
+        const subMenuLeftEdge = menuRect.left - subMenuRect.width;
+        const isOverflowLeft = subMenuLeftEdge < 0;
+        if (isOverflowRight && isOverflowLeft) {
+            return;
+        }
+        subMenuElement.classList.add(isOverflowRight
+            ? // Render on the left side of the menu
+                SubMenuClass.ALIGN_LEFT
+            : // Render on the right side of the menu
+                SubMenuClass.ALIGN_RIGHT);
+    });
+};

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

@@ -148,6 +148,8 @@ export var KupLanguageGeneric;
     KupLanguageGeneric["REQUIRED_VALUE"] = "genericRequiredValue";
     KupLanguageGeneric["UPLOAD"] = "genericUpload";
     KupLanguageGeneric["CHOOSE"] = "genericChoose";
+    KupLanguageGeneric["TYPE_CODE_OR_DESCR"] = "genericTypeCodeOrDescr";
+    KupLanguageGeneric["PARTIAL_FILTERS_LIST"] = "genericPartialFiltersList";
 })(KupLanguageGeneric || (KupLanguageGeneric = {}));
 /**
  * Grid decodes (data table customization settings).

package/dist/collection/managers/kup-manager/kup-manager.js

@@ -133,9 +133,10 @@ export class KupManager {
         this.toolbar = new KupToolbar();
         this.tooltip = new KupTooltip(tooltipDelay, tooltipFCellCallbacks, tooltipModal);
         this.perfTuning = new KupPerfTuning({
-            maxCellsPerPage: Number.MAX_VALUE,
+            maxCellsPerPage: 25000,
             maxRowsPerPage: 1000,
-            priority: KupPerfTuningPriority.ROWS_PER_PAGE,
+            filtersMaxLength: 200,
+            priority: KupPerfTuningPriority.DYNAMIC_ROWS_PER_PAGE,
         });
         this.perfMonitoring = new KupPerfMonitoring();
         document.addEventListener('pointerdown', (e) => {

package/dist/collection/managers/kup-perf-tuning/kup-perf-tuning-declarations.js

@@ -2,4 +2,5 @@ export var KupPerfTuningPriority;
 (function (KupPerfTuningPriority) {
     KupPerfTuningPriority["CELLS_PER_PAGE"] = "cells-per-page";
     KupPerfTuningPriority["ROWS_PER_PAGE"] = "rows-per-page";
+    KupPerfTuningPriority["DYNAMIC_ROWS_PER_PAGE"] = "dynamic-rows-per-page";
 })(KupPerfTuningPriority || (KupPerfTuningPriority = {}));

package/dist/collection/managers/kup-perf-tuning/kup-perf-tuning.js

@@ -1,3 +1,4 @@
+import { KupPerfTuningPriority, } from "./kup-perf-tuning-declarations";
 export class KupPerfTuning {
     constructor(data) {
         this.data = data;
@@ -21,4 +22,28 @@ export class KupPerfTuning {
         this.data.maxCellsPerPage = 5000 * perfFactor;
         console.log(`perfIndex ${perfIndex}, maxCellsPerPage ${this.data.maxCellsPerPage}`);
     }
+    maxRowsPerPageProvider(columnsNumber, rowsNumber, maxRowsConsumer) {
+        switch (this.data.priority) {
+            case KupPerfTuningPriority.ROWS_PER_PAGE:
+                maxRowsConsumer(this.data.maxRowsPerPage);
+                break;
+            case KupPerfTuningPriority.CELLS_PER_PAGE:
+                computeRowCount(this.data.maxCellsPerPage);
+                break;
+            case KupPerfTuningPriority.DYNAMIC_ROWS_PER_PAGE:
+                if (columnsNumber <= 25) {
+                    maxRowsConsumer(this.data.maxRowsPerPage);
+                }
+                else {
+                    computeRowCount(this.data.maxCellsPerPage);
+                }
+        }
+        function computeRowCount(maxCellsNumberPerPage) {
+            const cellsNumber = columnsNumber * rowsNumber;
+            if (cellsNumber > maxCellsNumberPerPage) {
+                // Rounds a number up to the nearest multiple of ten.
+                maxRowsConsumer(Math.ceil(maxCellsNumberPerPage / columnsNumber / 10) * 10);
+            }
+        }
+    }
 }

package/dist/collection/utils/cell-utils.js

@@ -194,6 +194,7 @@ export const RADAdapter = (value, options) => ({
         ? options === null || options === void 0 ? void 0 : options.map((option) => ({
             value: option.id,
             label: option.label,
+            shortcutLabel: option.shortcutLabel,
             checked: option.id == value,
             icon: option.icon,
         }))
@@ -266,3 +267,23 @@ export function adaptContentToDisplayMode(cell, content, separator) {
             return (_d = content !== null && content !== void 0 ? content : code) !== null && _d !== void 0 ? _d : '';
     }
 }
+export function getSizeOfInputElement(data, displayMode, size) {
+    var _a, _b;
+    if ((_a = data['kup-text-field']) === null || _a === void 0 ? void 0 : _a.size) {
+        return (_b = data['kup-text-field']) === null || _b === void 0 ? void 0 : _b.size;
+    }
+    else {
+        switch (displayMode) {
+            case ItemsDisplayMode.CODE:
+                return size || 15;
+            case ItemsDisplayMode.DESCRIPTION:
+                return 35;
+            case ItemsDisplayMode.CODE_AND_DESC:
+            case ItemsDisplayMode.CODE_AND_DESC_ALIAS:
+            case ItemsDisplayMode.DESC_AND_CODE:
+                return 50;
+            default:
+                return 35;
+        }
+    }
+}

package/dist/components/index.js

@@ -1,5 +1,5 @@
 export { g as getAssetPath, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-ef8cbd35.js';
-import { K as KupManager } from './p-73922583.js';
+import { K as KupManager } from './p-9859e801.js';
 
 /** used for obtain a KupManager instance without a dom document (for UT)  */
 function newKupManager(init) {