@sme.up/ketchup 7.1.1 → 7.2.0

package/dist/esm/{kup-autocomplete_26.entry.js → kup-autocomplete_27.entry.js}

@@ -1,16 +1,16 @@
-import { r as registerInstance, c as createEvent, f as forceUpdate, h, H as Host, g as getElement$1, a as getAssetPath } from './index-a2197376.js';
-import { k as kupManagerInstance, g as getProps, s as setProps, K as KupThemeIconValues, a as KupDynamicPositionPlacement, b as KupThemeColorValues, c as KupDebugCategory, F as FCellShapes, d as FCellPadding, e as getMonthsAsStringByLocale, f as KupDatesFormats, D as DateTimeFormatOptionsMonth, h as KupCardBuiltInClockElements, i as KupCardCSSClasses, j as KupLanguageTotals, l as KupLanguageGeneric, m as KupLanguageColumn, n as KupDataNewColumnTypes, o as KupCardSubEvents, p as KupCardIds, q as KupLanguageRow, r as KupCardFamily, t as KupCardProps, u as getColumnByName, v as KupDates, w as formatToNumber, x as KupDatesNormalize, y as KupObjects, z as identify, G as GroupLabelDisplayMode, S as SelectionMode, A as KupLanguageGrouping, B as KupLanguageCheckbox, C as getValueForDisplay2, E as Filters, H as getValueForDisplay, I as KupLanguageSearch, J as FilterInterval, L as LoadMoreMode, P as PaginatorPos, M as ShowGrid, T as TotalLabel, N as TotalMode, O as numberToFormattedStringNumber, Q as kupDynamicPositionAttribute, R as KupPointerEventTypes, U as kupDraggableColumnAttr, V as kupDragActiveAttr, W as KupDragEffect, X as kupDraggableCellAttr, Y as KupDropEventTypes, Z as FixedCellsCSSVarsBase, _ as KupLanguageFontsize, $ as KupLanguageDensity, a0 as KupLanguageGrid, a1 as KupDataTableProps, a2 as FixedCellsClasses, a3 as SortMode, a4 as iconColumn, a5 as keyColumn, a6 as fieldColumn, a7 as FCellTypes, a8 as unformattedStringToFormattedStringNumber, a9 as formattedStringToCustomUnformattedStringTime, aa as isValidFormattedStringTime, ab as formatTime, ac as unformattedStringToFormattedStringTime, ad as addColumnValueFromRow, ae as KupGlobalFilterMode } from './kup-manager-12e99c22.js';
-import { F as FTextField } from './f-text-field-88f92118.js';
+import { r as registerInstance, c as createEvent, f as forceUpdate, h, H as Host, g as getElement$1, a as getAssetPath } from './index-8bd38435.js';
+import { k as kupManagerInstance, g as getProps, s as setProps, K as KupThemeIconValues, a as KupDynamicPositionPlacement, b as KupThemeColorValues, c as KupDebugCategory, F as FCellShapes, d as FCellPadding, e as getMonthsAsStringByLocale, f as KupDatesFormats, D as DateTimeFormatOptionsMonth, h as KupCardBuiltInClockElements, i as KupCardCSSClasses, j as KupLanguageTotals, l as KupLanguageGeneric, m as KupLanguageColumn, n as KupDataNewColumnTypes, o as KupCardSubEvents, p as KupCardIds, q as KupLanguageRow, r as KupCardFamily, t as KupCardProps, u as getColumnByName, v as KupDates, w as formatToNumber, x as KupDatesNormalize, y as KupObjects, z as identify, G as GroupLabelDisplayMode, S as SelectionMode, A as KupLanguageGrouping, B as KupLanguageCheckbox, C as getValueForDisplay2, E as Filters, H as getValueForDisplay, I as KupLanguageSearch, J as FilterInterval, L as LoadMoreMode, P as PaginatorPos, M as ShowGrid, T as TotalLabel, N as TotalMode, O as numberToFormattedStringNumber, Q as kupDynamicPositionAttribute, R as KupPointerEventTypes, U as kupDraggableColumnAttr, V as kupDragActiveAttr, W as KupDragEffect, X as kupDraggableCellAttr, Y as KupDropEventTypes, Z as FixedCellsCSSVarsBase, _ as KupLanguageFontsize, $ as KupLanguageDensity, a0 as KupLanguageGrid, a1 as KupDataTableProps, a2 as FixedCellsClasses, a3 as SortMode, a4 as iconColumn, a5 as keyColumn, a6 as fieldColumn, a7 as FCellTypes, a8 as unformattedStringToFormattedStringNumber, a9 as formattedStringToCustomUnformattedStringTime, aa as isValidFormattedStringTime, ab as formatTime, ac as unformattedStringToFormattedStringTime, ad as addColumnValueFromRow, ae as KupGlobalFilterMode } from './kup-manager-311c87ab.js';
+import { F as FTextField } from './f-text-field-b74f4b58.js';
 import { F as FTextFieldMDC } from './f-text-field-mdc-d42d3f9e.js';
+import { I as ItemsDisplayMode, F as FCell, K as KupListRole, a as KupListProps, b as FSwitch } from './f-cell-aa0acc55.js';
 import { c as componentWrapperId } from './GenericVariables-665de00a.js';
-import { F as FImage } from './f-image-52bb5950.js';
-import { F as FButton } from './f-button-9aec1bc5.js';
+import { F as FImage } from './f-image-fed7623c.js';
+import { F as FButton } from './f-button-a8843fb2.js';
 import { F as FButtonStyling } from './f-button-declarations-b1b4cac4.js';
-import { F as FCell, a as FSwitch } from './f-cell-556937d0.js';
-import { F as FChipType, a as FChip } from './f-chip-677db32a.js';
+import { F as FChipType, a as FChip } from './f-chip-4555fb98.js';
 import { M as MDCRipple } from './component-b1bedf1d.js';
-import { F as FCheckbox } from './f-checkbox-b721178e.js';
-import { F as FiltersColumnMenu, a as FiltersRows, c as calcTotals, n as normalizeRows, p as paginateRows, f as filterRows, g as groupRows, s as sortRows, b as FPaginator, d as pageChange, r as rowsPerPageChange, t as treeMainColumnName, K as KupTreeExpansionMode, e as KupTreeProps } from './f-paginator-utils-d472e336.js';
+import { F as FCheckbox } from './f-checkbox-9b3f5f5b.js';
+import { F as FiltersColumnMenu, a as FiltersRows, c as calcTotals, n as normalizeRows, p as paginateRows, f as filterRows, g as groupRows, s as sortRows, b as FPaginator, d as pageChange, r as rowsPerPageChange, t as treeMainColumnName, K as KupTreeExpansionMode, e as KupTreeProps } from './f-paginator-utils-8c88fab3.js';
 import './tslib.es6-3eea2234.js';
 
 /**
@@ -41,41 +41,6 @@ var KupAutocompleteDisplayMode;
   KupAutocompleteDisplayMode["DESCRIPTION_AND_CODE"] = "both";
 })(KupAutocompleteDisplayMode || (KupAutocompleteDisplayMode = {}));
 
-/**
- * Props of the kup-list component.
- * Used to export every prop in an object.
- */
-var KupListProps;
-(function (KupListProps) {
-  KupListProps["customStyle"] = "Custom style of the component.";
-  KupListProps["data"] = "The data of the list.";
-  KupListProps["displayMode"] = "Selects how the items must display their label and how they can be filtered for.";
-  KupListProps["filter"] = "Keeps string for filtering elements when filter mode is active";
-  KupListProps["hideText"] = "Hides rows' text, ideally to display a list of icons only.";
-  KupListProps["isMenu"] = "Defines whether the list is a menu or not.";
-  KupListProps["keyboardNavigation"] = "When true, enables items' navigation through arrow keys.";
-  KupListProps["menuVisible"] = "Sets the status of the menu, when false it's hidden otherwise it's visible.";
-  KupListProps["roleType"] = "Defines the type of selection. Values accepted: listbox, radiogroup or group.";
-  KupListProps["selectable"] = "Defines whether items are selectable or not.";
-  KupListProps["showIcons"] = "Displays the icons associated to each row when set to true.";
-  KupListProps["twoLine"] = "The list elements descriptions will be arranged in two lines.";
-})(KupListProps || (KupListProps = {}));
-/**
- * Available types of selection.
- */
-var KupListRole;
-(function (KupListRole) {
-  KupListRole["LISTBOX"] = "listbox";
-  KupListRole["RADIOGROUP"] = "radiogroup";
-  KupListRole["GROUP"] = "group";
-})(KupListRole || (KupListRole = {}));
-var ItemsDisplayMode;
-(function (ItemsDisplayMode) {
-  ItemsDisplayMode["CODE"] = "code";
-  ItemsDisplayMode["DESCRIPTION"] = "description";
-  ItemsDisplayMode["DESCRIPTION_AND_CODE"] = "both";
-})(ItemsDisplayMode || (ItemsDisplayMode = {}));
-
 function getIdOfItemByDisplayMode(item, mode, separator) {
   if (mode == ItemsDisplayMode.CODE) {
     return item.id;
@@ -118,13 +83,15 @@ function consistencyCheck(idIn, listData, listEl, selectMode, displayMode, e) {
     displayedValue = getIdOfItemByDisplayMode(selected, displayMode, ' - ');
     trueValue = getIdOfItemByDisplayMode(selected, ItemsDisplayMode.CODE, ' - ');
   }
+  const listNode = validList
+    ? listData['data'].find((x) => x.id === trueValue)
+    : null;
+  let exists = listNode ? true : false;
   return {
     value: id,
     displayedValue: displayedValue,
-    exists: validList &&
-      listData['data'].find((x) => x.id === trueValue)
-      ? true
-      : false,
+    node: listNode,
+    exists: exists,
   };
 }
 function getFirstItemSelected(listData) {
@@ -197,14 +164,14 @@ function getItemByDisplayMode(listData, id, displayMode, setSelected) {
 
 const kupAutocompleteCss = ":host{display:block;width:max-content}.kup-icon{transition:transform 0.15s}.toggled .kup-icon.kup-dropdown-icon{transform:rotate(-180deg)}.kup-icon.kup-dropdown-icon{-webkit-mask:var(--kup-dropdown-icon);mask:var(--kup-dropdown-icon)}.f-text-field{position:relative}:host(.kup-full-height){height:100%}:host(.kup-full-height) #kup-component,:host(.kup-full-height) .f-text-field,:host(.kup-full-height) .mdc-text-field{height:100%}:host(.kup-full-width){width:100%}:host(.kup-full-width) #kup-component{width:100%}:host(.kup-danger){--kup-textfield-primary-color:var(--kup-danger-color);--kup-textfield-primary-color-rgb:var(--kup-danger-color-rgb)}:host(.kup-info){--kup-textfield-primary-color:var(--kup-info-color);--kup-textfield-primary-color-rgb:var(--kup-info-color-rgb)}:host(.kup-secondary){--kup-textfield-primary-color:var(--kup-secondary-color);--kup-textfield-primary-color-rgb:var(--kup-secondary-color-rgb)}:host(.kup-success){--kup-textfield-primary-color:var(--kup-success-color);--kup-textfield-primary-color-rgb:var(--kup-success-color-rgb)}:host(.kup-warning){--kup-textfield-primary-color:var(--kup-warning-color);--kup-textfield-primary-color-rgb:var(--kup-warning-color-rgb)}";
 
-var __classPrivateFieldGet$3 = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+var __classPrivateFieldGet$5 = (undefined && undefined.__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 __classPrivateFieldSet$3 = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+var __classPrivateFieldSet$4 = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
   if (kind === "m")
     throw new TypeError("Private method is not writable");
   if (kind === "a" && !f)
@@ -258,18 +225,19 @@ const KupAutocomplete = class {
       comp: this,
       id: this.rootElement.id,
       value: this.value,
-      inputValue: __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f").value,
+      inputValue: __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f").value,
     });
   }
   onKupChange(value) {
-    __classPrivateFieldSet$3(this, _KupAutocomplete_doConsistencyCheck, true, "f");
-    const ret = __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_consistencyCheck).call(this, value, true);
+    __classPrivateFieldSet$4(this, _KupAutocomplete_doConsistencyCheck, true, "f");
+    const ret = __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_consistencyCheck).call(this, value, true);
     if (ret.exists || this.allowInconsistentValues) {
       this.kupChange.emit({
         comp: this,
         id: this.rootElement.id,
         value: this.value,
-        inputValue: __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f").value,
+        inputValue: __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f").value,
+        node: ret.node,
       });
     }
   }
@@ -278,7 +246,7 @@ const KupAutocomplete = class {
       comp: this,
       id: this.rootElement.id,
       value: this.value,
-      inputValue: __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f").value,
+      inputValue: __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f").value,
     });
   }
   onKupFocus() {
@@ -286,80 +254,82 @@ const KupAutocomplete = class {
       comp: this,
       id: this.rootElement.id,
       value: this.value,
-      inputValue: __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f").value,
+      inputValue: __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f").value,
     });
   }
   onKupInput() {
-    __classPrivateFieldSet$3(this, _KupAutocomplete_doConsistencyCheck, true, "f");
-    __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_consistencyCheck).call(this, __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f").value, false);
-    __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_openList).call(this, false);
-    if (__classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f").value.length >= this.minimumChars) {
+    __classPrivateFieldSet$4(this, _KupAutocomplete_doConsistencyCheck, true, "f");
+    const ret = __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_consistencyCheck).call(this, __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f").value, false);
+    __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_openList).call(this, false);
+    if (__classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f").value.length >= this.minimumChars) {
       this.kupInput.emit({
         comp: this,
         id: this.rootElement.id,
         value: this.value,
-        inputValue: __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f").value,
+        inputValue: __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f").value,
+        node: ret.node,
       });
     }
   }
   onKupIconClick() {
-    if (__classPrivateFieldGet$3(this, _KupAutocomplete_textfieldWrapper, "f").classList.contains('toggled')) {
-      __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_closeList).call(this);
+    if (__classPrivateFieldGet$5(this, _KupAutocomplete_textfieldWrapper, "f").classList.contains('toggled')) {
+      __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_closeList).call(this);
     }
     else {
       if (this.showDropDownIcon) {
-        __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_openList).call(this, true);
+        __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_openList).call(this, true);
       }
     }
     this.kupIconClick.emit({
       comp: this,
       id: this.rootElement.id,
       value: this.value,
-      inputValue: __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f").value,
-      open: __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldWrapper, "f").classList.contains('toggled'),
+      inputValue: __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f").value,
+      open: __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldWrapper, "f").classList.contains('toggled'),
     });
   }
   onKupItemClick(e) {
     this.onKupChange(e.detail.selected.id);
-    __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_closeList).call(this);
-    if (__classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f")) {
-      __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f").focus();
+    __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_closeList).call(this);
+    if (__classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f")) {
+      __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f").focus();
     }
     this.kupItemClick.emit({
       comp: this,
       id: this.rootElement.id,
       value: this.value,
-      inputValue: __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f").value,
+      inputValue: __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f").value,
+      node: e.detail.selected,
     });
   }
   /*-------------------------------------------------*/
   /*                L i s t e n e r s                */
   /*-------------------------------------------------*/
   listenKeydown(e) {
-    if (__classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_isListOpened).call(this)) {
+    if (__classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_isListOpened).call(this)) {
       switch (e.key) {
         case 'ArrowDown':
           e.preventDefault();
           e.stopPropagation();
-          __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f").focusNext();
+          __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f").focusNext();
           break;
         case 'ArrowUp':
           e.preventDefault();
           e.stopPropagation();
-          __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f").focusPrevious();
+          __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f").focusPrevious();
           break;
         case 'Enter':
           e.preventDefault();
           e.stopPropagation();
-          __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f").select().then(() => {
-            __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_closeList).call(this);
-            __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f").focus();
+          __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f").select().then(() => {
+            __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_closeList).call(this);
+            __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f").focus();
           });
           break;
         case 'Escape':
           e.preventDefault();
           e.stopPropagation();
-          __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_closeList).call(this);
+          __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_closeList).call(this);
           break;
       }
     }
@@ -368,14 +338,14 @@ const KupAutocomplete = class {
         case 'ArrowDown':
           e.preventDefault();
           e.stopPropagation();
-          __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_openList).call(this, false);
-          __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f").focusNext();
+          __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_openList).call(this, false);
+          __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f").focusNext();
           break;
         case 'ArrowUp':
           e.preventDefault();
           e.stopPropagation();
-          __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_openList).call(this, false);
-          __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f").focusPrevious();
+          __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_openList).call(this, false);
+          __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f").focusPrevious();
           break;
       }
     }
@@ -408,7 +378,7 @@ const KupAutocomplete = class {
    * Sets the focus to the component.
    */
   async setFocus() {
-    __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f").focus();
+    __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f").focus();
   }
   /**
    * Sets the props to the component.
@@ -422,16 +392,16 @@ const KupAutocomplete = class {
    * @param {string} value - Value of the component.
    */
   async setValue(value) {
-    __classPrivateFieldSet$3(this, _KupAutocomplete_doConsistencyCheck, true, "f");
-    __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_consistencyCheck).call(this, value, true);
+    __classPrivateFieldSet$4(this, _KupAutocomplete_doConsistencyCheck, true, "f");
+    __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_consistencyCheck).call(this, value, true);
   }
   /*-------------------------------------------------*/
   /*          L i f e c y c l e   H o o k s          */
   /*-------------------------------------------------*/
   componentWillLoad() {
-    __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").debug.logLoad(this, false);
-    __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").theme.register(this);
-    __classPrivateFieldSet$3(this, _KupAutocomplete_doConsistencyCheck, true, "f");
+    __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").debug.logLoad(this, false);
+    __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").theme.register(this);
+    __classPrivateFieldSet$4(this, _KupAutocomplete_doConsistencyCheck, true, "f");
     this.value = this.initialValue;
     if (!this.data) {
       this.data = {
@@ -441,102 +411,102 @@ const KupAutocomplete = class {
     }
   }
   componentDidLoad() {
-    __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_consistencyCheck).call(this, this.value, true);
-    __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").debug.logLoad(this, true);
+    __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_consistencyCheck).call(this, this.value, true);
+    __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").debug.logLoad(this, true);
   }
   componentWillRender() {
-    __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").debug.logRender(this, false);
+    __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").debug.logRender(this, false);
   }
   componentDidRender() {
     const root = this.rootElement.shadowRoot;
     if (root) {
       const f = root.querySelector('.f-text-field');
       if (f) {
-        __classPrivateFieldSet$3(this, _KupAutocomplete_textfieldWrapper, f, "f");
-        __classPrivateFieldSet$3(this, _KupAutocomplete_textfieldEl, f.querySelector('input'), "f");
+        __classPrivateFieldSet$4(this, _KupAutocomplete_textfieldWrapper, f, "f");
+        __classPrivateFieldSet$4(this, _KupAutocomplete_textfieldEl, f.querySelector('input'), "f");
         FTextFieldMDC(f);
       }
     }
-    __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").debug.logRender(this, true);
+    __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").debug.logRender(this, true);
   }
   render() {
     const fullHeight = this.rootElement.classList.contains('kup-full-height');
     const fullWidth = this.rootElement.classList.contains('kup-full-width');
-    return (h(Host, { class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet$3(this, _KupAutocomplete_elStyle, "f") }, h("style", null, __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId, style: __classPrivateFieldGet$3(this, _KupAutocomplete_elStyle, "f") }, h(FTextField, Object.assign({ icon: this.showDropDownIcon
+    return (h(Host, { class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet$5(this, _KupAutocomplete_elStyle, "f") }, h("style", null, __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId, style: __classPrivateFieldGet$5(this, _KupAutocomplete_elStyle, "f") }, h(FTextField, Object.assign({ icon: this.showDropDownIcon
         ? KupThemeIconValues.DROPDOWN
         : null, trailingIcon: true }, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, value: this.displayedValue, onBlur: () => this.onKupBlur(), onClick: () => this.onKupClick(), onChange: (e) => this.onKupChange(e.target.value), onFocus: () => this.onKupFocus(), onInput: () => {
-        window.clearTimeout(__classPrivateFieldGet$3(this, _KupAutocomplete_inputTimeout, "f"));
-        __classPrivateFieldSet$3(this, _KupAutocomplete_inputTimeout, window.setTimeout(() => this.onKupInput(), this.inputDelay), "f");
-      }, onIconClick: () => this.onKupIconClick() }))), __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_prepList).call(this)));
+        window.clearTimeout(__classPrivateFieldGet$5(this, _KupAutocomplete_inputTimeout, "f"));
+        __classPrivateFieldSet$4(this, _KupAutocomplete_inputTimeout, window.setTimeout(() => this.onKupInput(), this.inputDelay), "f");
+      }, onIconClick: () => this.onKupIconClick() }))), __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_prepList).call(this)));
   }
   disconnectedCallback() {
-    if (__classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f")) {
-      __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").dynamicPosition.unregister([__classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f")]);
-      __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f").remove();
+    if (__classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f")) {
+      __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").dynamicPosition.unregister([__classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f")]);
+      __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f").remove();
     }
-    __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").theme.unregister(this);
+    __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").theme.unregister(this);
   }
   get rootElement() { return getElement$1(this); }
 };
 _KupAutocomplete_doConsistencyCheck = new WeakMap(), _KupAutocomplete_elStyle = new WeakMap(), _KupAutocomplete_listEl = new WeakMap(), _KupAutocomplete_kupManager = new WeakMap(), _KupAutocomplete_textfieldWrapper = new WeakMap(), _KupAutocomplete_textfieldEl = new WeakMap(), _KupAutocomplete_clickCb = new WeakMap(), _KupAutocomplete_inputTimeout = new WeakMap(), _KupAutocomplete_instances = new WeakSet(), _KupAutocomplete_openList = function _KupAutocomplete_openList(forceOpen) {
   if (forceOpen != true &&
-    __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldEl, "f").value.length < this.minimumChars) {
-    __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_closeList).call(this);
+    __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldEl, "f").value.length < this.minimumChars) {
+    __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_closeList).call(this);
     return false;
   }
-  __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldWrapper, "f").classList.add('toggled');
-  __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f").menuVisible = true;
-  const elStyle = __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f").style;
+  __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldWrapper, "f").classList.add('toggled');
+  __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f").menuVisible = true;
+  const elStyle = __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f").style;
   elStyle.height = 'auto';
-  elStyle.minWidth = __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldWrapper, "f").clientWidth + 'px';
-  if (__classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").dynamicPosition.isRegistered(__classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f"))) {
-    __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").dynamicPosition.changeAnchor(__classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f"), __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldWrapper, "f"));
+  elStyle.minWidth = __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldWrapper, "f").clientWidth + 'px';
+  if (__classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").dynamicPosition.isRegistered(__classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f"))) {
+    __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").dynamicPosition.changeAnchor(__classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f"), __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldWrapper, "f"));
   }
   else {
-    __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").dynamicPosition.register(__classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f"), __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldWrapper, "f"), 0, KupDynamicPositionPlacement.AUTO, true);
+    __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").dynamicPosition.register(__classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f"), __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldWrapper, "f"), 0, KupDynamicPositionPlacement.AUTO, true);
   }
-  __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").dynamicPosition.start(__classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f"));
-  if (!__classPrivateFieldGet$3(this, _KupAutocomplete_clickCb, "f")) {
-    __classPrivateFieldSet$3(this, _KupAutocomplete_clickCb, {
+  __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").dynamicPosition.start(__classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f"));
+  if (!__classPrivateFieldGet$5(this, _KupAutocomplete_clickCb, "f")) {
+    __classPrivateFieldSet$4(this, _KupAutocomplete_clickCb, {
       cb: () => {
-        __classPrivateFieldGet$3(this, _KupAutocomplete_instances, "m", _KupAutocomplete_closeList).call(this);
+        __classPrivateFieldGet$5(this, _KupAutocomplete_instances, "m", _KupAutocomplete_closeList).call(this);
       },
-      el: __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f"),
+      el: __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f"),
     }, "f");
   }
-  __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").addClickCallback(__classPrivateFieldGet$3(this, _KupAutocomplete_clickCb, "f"), true);
+  __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").addClickCallback(__classPrivateFieldGet$5(this, _KupAutocomplete_clickCb, "f"), true);
   return true;
 }, _KupAutocomplete_closeList = function _KupAutocomplete_closeList() {
-  __classPrivateFieldGet$3(this, _KupAutocomplete_textfieldWrapper, "f").classList.remove('toggled');
-  __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f").menuVisible = false;
-  __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").dynamicPosition.stop(__classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f"));
-  __classPrivateFieldGet$3(this, _KupAutocomplete_kupManager, "f").removeClickCallback(__classPrivateFieldGet$3(this, _KupAutocomplete_clickCb, "f"));
+  __classPrivateFieldGet$5(this, _KupAutocomplete_textfieldWrapper, "f").classList.remove('toggled');
+  __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f").menuVisible = false;
+  __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").dynamicPosition.stop(__classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f"));
+  __classPrivateFieldGet$5(this, _KupAutocomplete_kupManager, "f").removeClickCallback(__classPrivateFieldGet$5(this, _KupAutocomplete_clickCb, "f"));
 }, _KupAutocomplete_isListOpened = function _KupAutocomplete_isListOpened() {
-  return __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f").menuVisible == true;
+  return __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f").menuVisible == true;
 }, _KupAutocomplete_consistencyCheck = function _KupAutocomplete_consistencyCheck(idIn, setValue) {
-  if (!__classPrivateFieldGet$3(this, _KupAutocomplete_doConsistencyCheck, "f")) {
+  if (!__classPrivateFieldGet$5(this, _KupAutocomplete_doConsistencyCheck, "f")) {
     return;
   }
-  __classPrivateFieldSet$3(this, _KupAutocomplete_doConsistencyCheck, false, "f");
-  const ret = consistencyCheck(idIn, this.data['kup-list'], __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f"), this.selectMode, this.displayMode);
+  __classPrivateFieldSet$4(this, _KupAutocomplete_doConsistencyCheck, false, "f");
+  const ret = consistencyCheck(idIn, this.data['kup-list'], __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f"), this.selectMode, this.displayMode);
   if (ret.exists || this.allowInconsistentValues) {
     if (setValue) {
       this.value = ret.value;
       this.displayedValue = ret.displayedValue;
     }
-    if (__classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f") != null && !this.serverHandledFilter) {
-      __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f").filter = ret.value;
+    if (__classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f") != null && !this.serverHandledFilter) {
+      __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f").filter = ret.value;
     }
   }
   else {
     this.displayedValue = idIn;
-    if (__classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f") != null && !this.serverHandledFilter) {
-      __classPrivateFieldGet$3(this, _KupAutocomplete_listEl, "f").filter = ret.value;
+    if (__classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f") != null && !this.serverHandledFilter) {
+      __classPrivateFieldGet$5(this, _KupAutocomplete_listEl, "f").filter = ret.value;
     }
   }
   return ret;
 }, _KupAutocomplete_prepList = function _KupAutocomplete_prepList() {
-  return (h("kup-list", Object.assign({ displayMode: this.displayMode }, this.data['kup-list'], { isMenu: true, "onkup-list-click": (e) => this.onKupItemClick(e), ref: (el) => (__classPrivateFieldSet$3(this, _KupAutocomplete_listEl, el, "f")) })));
+  return (h("kup-list", Object.assign({ displayMode: this.displayMode }, this.data['kup-list'], { isMenu: true, "onkup-list-click": (e) => this.onKupItemClick(e), ref: (el) => (__classPrivateFieldSet$4(this, _KupAutocomplete_listEl, el, "f")) })));
 };
 KupAutocomplete.style = kupAutocompleteCss;
 
@@ -1352,7 +1322,7 @@ function create6$4(component) {
  * @param {KupCard} component - Card component.
  * @returns {VNode} 7th box layout virtual node.
  */
-function create7$2(component) {
+function create7$3(component) {
   return create5$4(component);
 }
 /**
@@ -1372,7 +1342,7 @@ const boxLayouts = /*#__PURE__*/Object.freeze({
   create4: create4$4,
   create5: create5$4,
   create6: create6$4,
-  create7: create7$2,
+  create7: create7$3,
   create8: create8$2
 });
 
@@ -2995,6 +2965,20 @@ function create6$2(component) {
     textArray[0] ? dialogHeader(textArray[0]) : dialogHeader(''),
     h("div", { class: "section-1" }, datatableArray.length > 0 ? (h("kup-data-table", Object.assign({ id: "datatable1" }, datatableArray[0]))) : (h("kup-spinner", { active: true, dimensions: "7px", layout: 14 })))));
 }
+/**
+ * 7th dialog card layout, a raw slot.
+ * @param {KupCard} component - Card component.
+ * @returns {VNode} 1st standard layout virtual node.
+ */
+function create7$2(component) {
+  //Dialog title
+  const textArray = component.data && component.data['text'] ? component.data['text'] : [];
+  //Slot list
+  const slots = Array.prototype.slice.call(component.rootElement.children, 0);
+  return (h("div", { class: `dialog-layout-${component.layoutNumber}` },
+    textArray[0] ? dialogHeader(textArray[0]) : dialogHeader(''),
+    slots.length > 0 ? compList(slots, 'slot') : null));
+}
 /**
  * Invoked by 4th layout to switch to the previous record of the original data table.
  * Reminder: data table inside 4th layout should be transposed and valid columns should be named with numbers (strings, but numerical).
@@ -3090,7 +3074,8 @@ const dialogLayouts = /*#__PURE__*/Object.freeze({
   create3: create3$2,
   create4: create4$2,
   create5: create5$2,
-  create6: create6$2
+  create6: create6$2,
+  create7: create7$2
 });
 
 /**
@@ -5248,7 +5233,7 @@ var Picker = function () {
     Picker.StyleElement = style;
 }
 
-const kupCardCss = ".box-layout-1{background-color:var(--kup-background-color);color:var(--kup-text-color);font-size:var(--kup-font-size);padding:0.5em}.box-layout-1 table{width:100%}.box-layout-1 .label{overflow:hidden;padding:0.5em;text-overflow:ellipsis;width:50%}.box-layout-1 .value{font-weight:bold;padding:0.5em}.box-layout-2{background-color:var(--kup-background-color);color:var(--kup-text-color);font-size:var(--kup-font-size);padding:0.5em}.box-layout-2 table{width:100%}.box-layout-2 .label{max-width:50%;overflow:hidden;padding:0.5em;text-overflow:ellipsis;white-space:nowrap}.box-layout-2 .value{padding:0.5em;font-weight:bold}.box-layout-3{background-color:var(--kup-background-color);color:var(--kup-text-color);font-size:var(--kup-font-size);padding:0.5em}.box-layout-3 .container{display:flex;justify-content:space-between;overflow:hidden;width:100%}.box-layout-3 .flex-container{align-items:center;display:flex;justify-content:center;width:100%}.box-layout-3 .flex-container:first-child{justify-content:flex-start}.box-layout-3 .flex-container:last-child{justify-content:flex-end}.box-layout-3 .label{overflow:hidden;padding:0.5em;text-overflow:ellipsis;white-space:nowrap}.box-layout-3 .value{padding:0.5em;font-weight:bold}.box-layout-3 .f-cell .f-cell__text{white-space:nowrap}.box-layout-4{background-color:var(--kup-background-color);color:var(--kup-text-color);display:flex;font-size:var(--kup-font-size);height:100%;padding:0.5em}.box-layout-4 .container{margin:auto;width:100%}.box-layout-4 .image{border-radius:50%;height:64px;margin:auto;width:64px}.box-layout-4 .value{font-weight:bold;padding-top:0.5em}.box-layout-4 .f-cell.c-centered .f-cell__content img,.box-layout-4 .f-cell.c-centered .f-cell__content .f-image{margin:0}.box-layout-5{background-color:var(--kup-background-color);color:var(--kup-text-color);display:flex;font-size:var(--kup-font-size);height:100%;padding:1em 0.5em}.box-layout-5 .container{display:flex;height:100%;margin:auto;width:100%}.box-layout-5 .image{display:flex;height:100%;margin:auto;width:50%}.box-layout-5 .label,.box-layout-5 .value{padding:0.5em}.box-layout-5 .label{overflow:hidden;text-align:right;text-overflow:ellipsis;white-space:nowrap}.box-layout-5 .value{font-weight:bold}.box-layout-5 .table{box-sizing:border-box;padding:1.25em}.box-layout-5 .table,.box-layout-5 table{width:100%}.box-layout-6{background-color:var(--kup-background-color);color:var(--kup-text-color);display:flex;font-size:var(--kup-font-size);height:100%;padding:1em 0.5em}.box-layout-6 .container{display:flex;height:100%;margin:auto;width:100%}.box-layout-6 .image{display:flex;height:100%;margin:auto;width:50%}.box-layout-6 .label{padding-bottom:0.25em}.box-layout-6 .value{font-weight:bold;padding-bottom:1.25em}.box-layout-6 tr:last-child .value{padding-bottom:0}.box-layout-6 .table{box-sizing:border-box;display:flex;height:max-content;margin:auto;padding:1.25em}.box-layout-6 .table,.box-layout-6 table{width:100%}.box-layout-7{background-color:var(--kup-background-color);color:var(--kup-text-color);display:flex;font-size:var(--kup-font-size);height:100%;padding:1em 0.5em}.box-layout-7 .container{height:100%;margin:auto;width:100%}.box-layout-7 .image{width:100%}.box-layout-7 .label,.box-layout-7 .value{padding:0.25em}.box-layout-7 .label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.box-layout-7 .value{font-weight:bold}.box-layout-7 .table{box-sizing:border-box;padding:1.25em;padding-bottom:0}.box-layout-7 .table,.box-layout-7 table{width:100%}.box-layout-8{background-color:var(--kup-background-color);color:var(--kup-text-color);display:flex;font-size:var(--kup-font-size);height:100%;padding:1em 0.5em}.box-layout-8 .container{height:100%;margin:auto;width:100%}.box-layout-8 .image{width:100%}.box-layout-8 .label{overflow:hidden;padding-bottom:0.25em;text-overflow:ellipsis;white-space:nowrap}.box-layout-8 .value{font-weight:bold;padding-bottom:1.25em}.box-layout-8 tr:last-child .value{padding-bottom:0}.box-layout-8 .table{box-sizing:border-box;padding:1.25em;padding-bottom:0}.box-layout-8 .table,.box-layout-8 table{width:100%}.built-in-layout-1{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto;padding:0.5em}.built-in-layout-1 .section-1{box-sizing:border-box;height:5em;overflow:auto;padding-bottom:1em;width:100%}.built-in-layout-1 .section-1 .sub-1{display:flex;flex-direction:row;justify-content:center}.built-in-layout-1 .section-2{height:calc(100% - 60px);overflow:auto;width:100%}.built-in-layout-1 .prev-page{margin-left:auto}.built-in-layout-1 .change-view-button{margin:auto;width:12em;text-align:center}.built-in-layout-1 #change-view-button button{text-transform:capitalize}.built-in-layout-1 .next-page{margin-right:auto}.built-in-layout-1 .calendar{border-collapse:collapse;width:100%}.built-in-layout-1 thead{border-bottom:1px solid var(--kup-border-color)}.built-in-layout-1 .item-text{color:rgba(var(--kup-text-color-rgb), 0.5)}.built-in-layout-1 .item{text-align:center}.built-in-layout-1 .item:not(.selected) .item-number:hover{background-color:var(--kup-hover-background-color)}.built-in-layout-1 .item.selected .item-number,.built-in-layout-1 .item.selected .item-number:hover{background-color:rgba(var(--kup-primary-color-rgb), 0.175)}.built-in-layout-1 .item-number{border-radius:50%;cursor:pointer;display:flex;justify-content:center;line-height:2.5em;margin:auto;width:2.5em;transition:background-color 0.25s;text-transform:capitalize}.built-in-layout-2{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.built-in-layout-2 .clock{box-shadow:var(--kup-box-shadow);width:300px;height:450px;background-color:var(--kup-background-color);position:relative;font-family:var(--kup-font-family)}.built-in-layout-2 .top{background-color:var(--kup-primary-color);color:var(--kup-text-on-primary-color);height:100px;line-height:100px;font-size:50px;text-align:center}.built-in-layout-2 .top span{cursor:pointer;opacity:0.75;transition:0.25s ease-in-out}.built-in-layout-2 .top .visible{opacity:1}.built-in-layout-2 .circle{user-select:none;background-color:rgba(var(--kup-text-color-rgb), 0.1);width:250px;height:250px;border-radius:1000px;position:relative;top:25px;left:25px;box-sizing:border-box;display:none}.built-in-layout-2 .circle.visible{display:block}.built-in-layout-2 .mid{position:absolute;left:calc(50% - 0px);top:calc(50% - 0px);width:2px;height:2px;border-radius:10px;background-color:var(--kup-text-color)}.built-in-layout-2 .hour{position:absolute;height:40px;line-height:40px;width:40px;border-radius:40px;text-align:center}.built-in-layout-2 .hour.selected{z-index:2}.built-in-layout-2 .hour.selected::after{content:\"\";z-index:-1;background-color:rgba(var(--kup-primary-color-rgb), 0.5);height:1px;width:100%;position:absolute;transform:rotate(-90deg);transform-origin:100% 0%;top:50%;width:101px;right:50%}.built-in-layout-2 .hour2{z-index:2;position:absolute;height:30px;line-height:30px;width:30px;border-radius:40px;text-align:center;font-size:14px}.built-in-layout-2 .hour2.selected::after{content:\"\";background-color:rgba(var(--kup-primary-color-rgb), 0.5);height:1px;width:100%;position:absolute;transform:rotate(-90deg);transform-origin:100% 0%;top:50%;width:64px;right:50%;z-index:-1}.built-in-layout-2 .unit{position:absolute;height:20px;line-height:20px;width:20px;border-radius:40px;text-align:center;font-size:12px}.built-in-layout-2 .unit.selected::after{content:\"\";background-color:rgba(var(--kup-primary-color-rgb), 0.5);height:1px;width:100%;position:absolute;transform:rotate(-90deg);transform-origin:100% 0%;top:50%;width:101px;right:50%}.built-in-layout-2 .hour,.built-in-layout-2 .hour2,.built-in-layout-2 .unit{cursor:pointer;transition:background-color 0.25s}.built-in-layout-2 .hour:hover,.built-in-layout-2 .hour2:hover,.built-in-layout-2 .unit:hover{background-color:rgba(var(--kup-primary-color-rgb), 0.275)}.built-in-layout-2 .hour.selected,.built-in-layout-2 .hour2.selected,.built-in-layout-2 .unit.selected{background-color:var(--kup-primary-color);color:var(--kup-text-on-primary-color)}.built-in-layout-2 .actions{color:var(--kup-primary-color);font-weight:bold;font-size:20px;display:flex;justify-content:flex-end;position:absolute;width:100%;box-sizing:border-box;bottom:10px}.built-in-layout-2 .action{display:inline-block;width:100px;text-align:center;height:37.5px;line-height:37.5px;margin-right:10px;cursor:pointer;border-radius:2px}.built-in-layout-2 .clock .actions .action:hover{background-color:rgba(0, 0, 0, 0.1)}.built-in-layout-2 .clock .actions .action:visible{background-color:rgba(0, 0, 0, 0.3)}.built-in-layout-2 .hour:nth-child(12):after{transform:rotate(330deg)}.built-in-layout-2 .hour:nth-child(11):after{transform:rotate(300deg)}.built-in-layout-2 .hour:nth-child(10):after{transform:rotate(270deg)}.built-in-layout-2 .hour:nth-child(9):after{transform:rotate(240deg)}.built-in-layout-2 .hour:nth-child(8):after{transform:rotate(210deg)}.built-in-layout-2 .hour:nth-child(7):after{transform:rotate(180deg)}.built-in-layout-2 .hour:nth-child(6):after{transform:rotate(150deg)}.built-in-layout-2 .hour:nth-child(5):after{transform:rotate(120deg)}.built-in-layout-2 .hour:nth-child(4):after{transform:rotate(90deg)}.built-in-layout-2 .hour:nth-child(3):after{transform:rotate(60deg)}.built-in-layout-2 .hour:nth-child(2):after{transform:rotate(30deg)}.built-in-layout-2 .hour:nth-child(1):after{transform:rotate(0deg)}.built-in-layout-2 .hour2:nth-child(24):after{transform:rotate(690deg)}.built-in-layout-2 .hour2:nth-child(23):after{transform:rotate(660deg)}.built-in-layout-2 .hour2:nth-child(22):after{transform:rotate(630deg)}.built-in-layout-2 .hour2:nth-child(21):after{transform:rotate(600deg)}.built-in-layout-2 .hour2:nth-child(20):after{transform:rotate(570deg)}.built-in-layout-2 .hour2:nth-child(19):after{transform:rotate(540deg)}.built-in-layout-2 .hour2:nth-child(18):after{transform:rotate(510deg)}.built-in-layout-2 .hour2:nth-child(17):after{transform:rotate(480deg)}.built-in-layout-2 .hour2:nth-child(16):after{transform:rotate(450deg)}.built-in-layout-2 .hour2:nth-child(15):after{transform:rotate(420deg)}.built-in-layout-2 .hour2:nth-child(14):after{transform:rotate(390deg)}.built-in-layout-2 .hour2:nth-child(13):after{transform:rotate(360deg)}.built-in-layout-2 .unit:nth-child(60):after{transform:rotate(354deg)}.built-in-layout-2 .unit:nth-child(59):after{transform:rotate(348deg)}.built-in-layout-2 .unit:nth-child(58):after{transform:rotate(342deg)}.built-in-layout-2 .unit:nth-child(57):after{transform:rotate(336deg)}.built-in-layout-2 .unit:nth-child(56):after{transform:rotate(330deg)}.built-in-layout-2 .unit:nth-child(55):after{transform:rotate(324deg)}.built-in-layout-2 .unit:nth-child(54):after{transform:rotate(318deg)}.built-in-layout-2 .unit:nth-child(53):after{transform:rotate(312deg)}.built-in-layout-2 .unit:nth-child(52):after{transform:rotate(306deg)}.built-in-layout-2 .unit:nth-child(51):after{transform:rotate(300deg)}.built-in-layout-2 .unit:nth-child(50):after{transform:rotate(294deg)}.built-in-layout-2 .unit:nth-child(49):after{transform:rotate(288deg)}.built-in-layout-2 .unit:nth-child(48):after{transform:rotate(282deg)}.built-in-layout-2 .unit:nth-child(47):after{transform:rotate(276deg)}.built-in-layout-2 .unit:nth-child(46):after{transform:rotate(270deg)}.built-in-layout-2 .unit:nth-child(45):after{transform:rotate(264deg)}.built-in-layout-2 .unit:nth-child(44):after{transform:rotate(258deg)}.built-in-layout-2 .unit:nth-child(43):after{transform:rotate(252deg)}.built-in-layout-2 .unit:nth-child(42):after{transform:rotate(246deg)}.built-in-layout-2 .unit:nth-child(41):after{transform:rotate(240deg)}.built-in-layout-2 .unit:nth-child(40):after{transform:rotate(234deg)}.built-in-layout-2 .unit:nth-child(39):after{transform:rotate(228deg)}.built-in-layout-2 .unit:nth-child(38):after{transform:rotate(222deg)}.built-in-layout-2 .unit:nth-child(37):after{transform:rotate(216deg)}.built-in-layout-2 .unit:nth-child(36):after{transform:rotate(210deg)}.built-in-layout-2 .unit:nth-child(35):after{transform:rotate(204deg)}.built-in-layout-2 .unit:nth-child(34):after{transform:rotate(198deg)}.built-in-layout-2 .unit:nth-child(33):after{transform:rotate(192deg)}.built-in-layout-2 .unit:nth-child(32):after{transform:rotate(186deg)}.built-in-layout-2 .unit:nth-child(31):after{transform:rotate(180deg)}.built-in-layout-2 .unit:nth-child(30):after{transform:rotate(174deg)}.built-in-layout-2 .unit:nth-child(29):after{transform:rotate(168deg)}.built-in-layout-2 .unit:nth-child(28):after{transform:rotate(162deg)}.built-in-layout-2 .unit:nth-child(27):after{transform:rotate(156deg)}.built-in-layout-2 .unit:nth-child(26):after{transform:rotate(150deg)}.built-in-layout-2 .unit:nth-child(25):after{transform:rotate(144deg)}.built-in-layout-2 .unit:nth-child(24):after{transform:rotate(138deg)}.built-in-layout-2 .unit:nth-child(23):after{transform:rotate(132deg)}.built-in-layout-2 .unit:nth-child(22):after{transform:rotate(126deg)}.built-in-layout-2 .unit:nth-child(21):after{transform:rotate(120deg)}.built-in-layout-2 .unit:nth-child(20):after{transform:rotate(114deg)}.built-in-layout-2 .unit:nth-child(19):after{transform:rotate(108deg)}.built-in-layout-2 .unit:nth-child(18):after{transform:rotate(102deg)}.built-in-layout-2 .unit:nth-child(17):after{transform:rotate(96deg)}.built-in-layout-2 .unit:nth-child(16):after{transform:rotate(90deg)}.built-in-layout-2 .unit:nth-child(15):after{transform:rotate(84deg)}.built-in-layout-2 .unit:nth-child(14):after{transform:rotate(78deg)}.built-in-layout-2 .unit:nth-child(13):after{transform:rotate(72deg)}.built-in-layout-2 .unit:nth-child(12):after{transform:rotate(66deg)}.built-in-layout-2 .unit:nth-child(11):after{transform:rotate(60deg)}.built-in-layout-2 .unit:nth-child(10):after{transform:rotate(54deg)}.built-in-layout-2 .unit:nth-child(9):after{transform:rotate(48deg)}.built-in-layout-2 .unit:nth-child(8):after{transform:rotate(42deg)}.built-in-layout-2 .unit:nth-child(7):after{transform:rotate(36deg)}.built-in-layout-2 .unit:nth-child(6):after{transform:rotate(30deg)}.built-in-layout-2 .unit:nth-child(5):after{transform:rotate(24deg)}.built-in-layout-2 .unit:nth-child(4):after{transform:rotate(18deg)}.built-in-layout-2 .unit:nth-child(3):after{transform:rotate(12deg)}.built-in-layout-2 .unit:nth-child(2):after{transform:rotate(6deg)}.built-in-layout-2 .unit:nth-child(1):after{transform:rotate(0deg)}.built-in-layout-3{background:var(--kup-background-color);box-shadow:rgba(128, 128, 128, 0.1) 0px 2px 1px -1px, rgba(128, 128, 128, 0.1) 0px 1px 1px 0px, rgba(128, 128, 128, 0.6) 0px 1px 3px 0px;box-sizing:border-box;overflow:auto}.built-in-layout-3 kup-button,.built-in-layout-3 kup-combobox{margin:0 auto 0.75em auto}.built-in-layout-3 kup-combobox{width:95%}.built-in-layout-3 .sub-chip{border-top:1px solid var(--kup-border-color);max-height:33vh;overflow:auto;width:100%}.built-in-layout-4{background:var(--kup-background-color);box-shadow:rgba(128, 128, 128, 0.1) 0px 2px 1px -1px, rgba(128, 128, 128, 0.1) 0px 1px 1px 0px, rgba(128, 128, 128, 0.6) 0px 1px 3px 0px;box-sizing:border-box}.built-in-layout-4 .picker_arrow{position:absolute;z-index:-1}.built-in-layout-4 .picker_wrapper.popup{position:absolute;z-index:2;margin:1.5em}.built-in-layout-4 .picker_wrapper.popup,.built-in-layout-4 .picker_wrapper.popup .picker_arrow::before,.built-in-layout-4 .picker_wrapper.popup .picker_arrow::after{background:var(--kup-background-color);box-shadow:0 0 10px 1px rgba(0, 0, 0, 0.4)}.built-in-layout-4 .picker_wrapper.popup .picker_arrow{width:3em;height:3em;margin:0}.built-in-layout-4 .picker_wrapper.popup .picker_arrow::before,.built-in-layout-4 .picker_wrapper.popup .picker_arrow::after{content:\"\";display:block;position:absolute;top:0;left:0;z-index:-99}.built-in-layout-4 .picker_wrapper.popup .picker_arrow::before{width:100%;height:100%;transform:skew(45deg);transform-origin:0 100%}.built-in-layout-4 .picker_wrapper.popup .picker_arrow::after{width:150%;height:150%;box-shadow:none}.built-in-layout-4 .popup.popup_top{bottom:100%;left:0}.built-in-layout-4 .popup.popup_top .picker_arrow{bottom:0;left:0;transform:rotate(-90deg)}.built-in-layout-4 .popup.popup_bottom{top:100%;left:0}.built-in-layout-4 .popup.popup_bottom .picker_arrow{top:0;left:0;transform:rotate(90deg) scale(1, -1)}.built-in-layout-4 .popup.popup_left{top:0;right:100%}.built-in-layout-4 .popup.popup_left .picker_arrow{top:0;right:0;transform:scale(-1, 1)}.built-in-layout-4 .popup.popup_right{top:0;left:100%}.built-in-layout-4 .popup.popup_right .picker_arrow{top:0;left:0}.built-in-layout-4 .picker_wrapper.no_alpha .picker_alpha{display:none}.built-in-layout-4 .picker_wrapper.no_editor .picker_editor{position:absolute;z-index:-1;opacity:0}.built-in-layout-4 .picker_wrapper.no_cancel .picker_cancel{display:none}.built-in-layout-4 .layout_default.picker_wrapper{display:flex;flex-flow:row wrap;justify-content:space-between;align-items:stretch;font-size:10px;width:25em;padding:0.5em}.built-in-layout-4 .layout_default.picker_wrapper input,.built-in-layout-4 .layout_default.picker_wrapper button{font-size:1em}.built-in-layout-4 .layout_default.picker_wrapper>*{margin:0.5em}.built-in-layout-4 .layout_default.picker_wrapper::before{content:\"\";display:block;width:100%;height:0;order:1}.built-in-layout-4 .layout_default .picker_slider,.built-in-layout-4 .layout_default .picker_selector{padding:1em}.built-in-layout-4 .layout_default .picker_hue{width:100%}.built-in-layout-4 .layout_default .picker_sl{flex:1 1 auto}.built-in-layout-4 .layout_default .picker_sl::before{content:\"\";display:block;padding-bottom:100%}.built-in-layout-4 .layout_default .picker_editor{order:1;width:6.5em}.built-in-layout-4 .layout_default .picker_editor input{width:100%;height:100%}.built-in-layout-4 .layout_default .picker_sample{order:1;flex:1 1 auto}.built-in-layout-4 .layout_default .picker_done,.built-in-layout-4 .layout_default .picker_cancel{order:1}.built-in-layout-4 .picker_wrapper{box-sizing:border-box;background:var(--kup-background-color);box-shadow:0 0 0 1px var(--kup-border-color);cursor:default;font-family:sans-serif;color:#444;pointer-events:auto}.built-in-layout-4 .picker_wrapper:focus{outline:none}.built-in-layout-4 .picker_wrapper button,.built-in-layout-4 .picker_wrapper input{box-sizing:border-box;border:none;box-shadow:0 0 0 1px var(--kup-border-color);outline:none}.built-in-layout-4 .picker_wrapper button:focus,.built-in-layout-4 .picker_wrapper button:active,.built-in-layout-4 .picker_wrapper input:focus,.built-in-layout-4 .picker_wrapper input:active{box-shadow:0 0 2px 1px var(--kup-border-color)}.built-in-layout-4 .picker_wrapper button{padding:0.4em 0.6em;cursor:pointer;background-color:whitesmoke;background-image:linear-gradient(0deg, gainsboro, transparent)}.built-in-layout-4 .picker_wrapper button:active{background-image:linear-gradient(0deg, transparent, gainsboro)}.built-in-layout-4 .picker_selector{position:absolute;z-index:1;display:block;transform:translate(-50%, -50%);border:2px solid white;border-radius:100%;box-shadow:0 0 3px 1px #67b9ff;background:currentColor;cursor:pointer}.built-in-layout-4 .picker_slider .picker_selector{border-radius:2px}.built-in-layout-4 .picker_hue{position:relative;background-image:linear-gradient(90deg, red, yellow, lime, cyan, blue, magenta, red);box-shadow:0 0 0 1px var(--kup-border-color)}.built-in-layout-4 .picker_sl{position:relative;box-shadow:0 0 0 1px var(--kup-border-color);background-image:linear-gradient(180deg, white, rgba(255, 255, 255, 0) 50%), linear-gradient(0deg, black, rgba(0, 0, 0, 0) 50%), linear-gradient(90deg, #808080, rgba(128, 128, 128, 0))}.built-in-layout-4 .picker_alpha,.built-in-layout-4 .picker_sample{position:relative;background:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='2' height='2'%3E%3Cpath d='M1,0H0V1H2V2H1' fill='lightgrey'/%3E%3C/svg%3E\") left top/contain white;box-shadow:0 0 0 1px var(--kup-border-color)}.built-in-layout-4 .picker_alpha .picker_selector,.built-in-layout-4 .picker_sample .picker_selector{background:none}.built-in-layout-4 .picker_editor input{font-family:monospace;padding:0.2em 0.4em}.built-in-layout-4 .picker_sample::before{content:\"\";position:absolute;display:block;width:100%;height:100%;background:currentColor}.built-in-layout-4 .picker_done,.built-in-layout-4 .picker_arrow{display:none}.built-in-layout-4 .layout_default.picker_wrapper{bottom:unset;font-size:var(--kup-font-size);left:unset;padding:0.25em;right:unset;top:unset;width:100%}.built-in-layout-4 .layout_default .picker_editor input{background:none;color:var(--kup-text-color);font-family:var(--kup-font-family);font-size:var(--kup-font-size)}.built-in-layout-4 .picker_wrapper.popup{box-shadow:var(--kup-box-shadow);margin:0;outline:none}.built-in-layout-5{background:var(--kup-background-color);box-shadow:var(--kup-box-shadow);box-sizing:border-box;overflow:auto;padding:0.5em}.built-in-layout-5>table{width:100%}.built-in-layout-5>table>tr>td>div.value{text-align:right;color:var(--kup-primary-color);border-bottom:1px solid var(--kup-border-color);min-height:1.5em}.built-in-layout-5>table>tr>td>.f-button{display:flex;justify-content:center}.built-in-layout-5>table>tr>td>div.number{border-radius:50%;cursor:pointer;display:flex;justify-content:center;line-height:2.5em;margin:auto;width:2.5em;transition:background-color 0.25s;text-transform:capitalize}.built-in-layout-5>table>tr>td>div.number:hover{background-color:var(--kup-hover-background-color)}.built-in-layout-6{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto;padding:0.5em}.collapsible-layout-1{color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.collapsible-layout-1 .section-1{background-color:var(--color-0);display:flex;flex:0 0 10%;max-width:10%}.collapsible-layout-1 .section-2{box-sizing:border-box;height:100%;display:flex;flex:0 0 90%;flex-direction:column;max-width:90%}.collapsible-layout-1 .section-2 .sub-1{min-height:1.5em;display:flex;padding:0.6rem 0.8em 0;font-weight:bold;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.collapsible-layout-1 .section-2 .sub-1 div{font-size:1em}.collapsible-layout-1 .section-2 .sub-1 .left{text-align:left;width:80%}.collapsible-layout-1 .section-2 .sub-1 .right{text-align:right;width:20%}.collapsible-layout-1 .section-2 .sub-2{text-align:left;padding:0.6em 0.8em;font-size:0.875em}.collapsible-layout-2{color:var(--kup-text-color);box-shadow:rgba(0, 0, 0, 0.2) 0px 2px 1px -1px, rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 1px 3px 0px;border-radius:4px;display:flex;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.collapsible-layout-2 .section-1{box-sizing:border-box;height:100%;display:flex;flex-direction:column;max-width:100%;width:100%}.collapsible-layout-2 .section-1 .sub-1{text-align:left;padding:0.6em 0.8em 0;font-size:1em;font-weight:bold;max-width:75%}.collapsible-layout-2 .section-1 .sub-2{text-align:left;padding:0.6em 0.8em;max-width:75%}.collapsible-layout-2 .section-1 .sub-2 div{font-size:0.875em}.collapsible-layout-2 .section-1 .sub-3{color:var(--color-0);text-align:center;position:absolute;top:1em;right:1em;max-width:25%;text-overflow:ellipsis;overflow:hidden;max-height:calc(24px + 2.25em);padding:0 1em}.collapsible-layout-2 .section-1 .sub-3 kup-image{margin:auto}.collapsible-layout-2 .section-1 .sub-3 div{font-size:1.25em}.collapsible-card .collapsible-trigger{display:none;position:absolute;bottom:0;left:0;height:50px;width:100%}.collapsible-card .collapsible-trigger kup-button{margin:auto;width:48px}.collapsible-card .collapsible-wrapper{overflow:auto}.collapsible-card.collapsible-active{padding-bottom:50px}.collapsible-card.collapsible-active .collapsible-trigger{display:block}.dialog-layout-1{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);color:var(--kup-text-color);display:flex;flex-direction:column;height:100%;width:100%;overflow:auto}.dialog-layout-1 .section-1{display:grid;grid-gap:0.5em;grid-template-columns:repeat(2, auto);grid-template-rows:repeat(auto-fill, 1.25em);height:100%;padding:0.5em;overflow:auto;touch-action:none}.dialog-layout-1 .section-1 .text{min-width:max-content}.dialog-layout-1 .section-1 .text:not(.label){font-weight:bold}.dialog-layout-2{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;width:100%}.dialog-layout-2 .section-1{text-align:center;touch-action:none;padding-bottom:1em}.dialog-layout-2 .section-1 .text{padding-top:0.75em}.dialog-layout-2 .section-1 .text:not(.label){font-weight:bold}.dialog-layout-2 .section-2{border-top:1px solid var(--kup-border-color);display:grid;grid-gap:0.5em;grid-template-columns:repeat(2, auto);grid-template-rows:repeat(auto-fill, 1.25em);height:100%;padding:0.5em;overflow:auto;touch-action:none}.dialog-layout-2 .section-2 .text{min-width:max-content}.dialog-layout-2 .section-2 .text:not(.label){font-weight:bold}.dialog-layout-3{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;overflow:visible;flex-direction:column;height:100%;position:relative;width:100%}.dialog-layout-3 kup-button{margin-left:0}.dialog-layout-3 .section-1{background-color:var(--kup-background-color);display:flex;justify-content:flex-start;align-items:center;box-sizing:border-box;box-shadow:0px 1px 3px 0px var(--kup-text-color);height:52px;width:100%;text-align:right;touch-action:none}.dialog-layout-3 .section-1 kup-button{margin-right:0.25em}.dialog-layout-3 .section-2{height:100%;width:100%;overflow:auto;max-height:50vh}.dialog-layout-3 ::slotted(.text){color:var(--kup-text-color);font-family:var(--kup-font-family-monospace);white-space:nowrap;border-bottom:1px solid var(--kup-border-color);line-height:1.75em}.dialog-layout-4{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;width:100%}.dialog-layout-4 .section-1{display:flex;justify-content:space-evenly}.dialog-layout-4 .section-2{height:100%;overflow:auto;padding:0.25em;touch-action:none}.dialog-layout-5{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;width:100%}.dialog-layout-5 .section-1{display:flex;justify-content:space-evenly}.dialog-layout-5 .section-2{height:100%;overflow:auto}.dialog-layout-6{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;max-height:95vh;max-width:95vw;width:100%}.dialog-layout-6 .section-1{display:flex;height:100%;justify-content:space-evenly;overflow:auto}.dialog-layout-6 kup-data-table{width:100%}#drag-handle{-ms-touch-action:none;touch-action:none}#drag-handle:not(.header-bar){display:flex;height:100%}#drag-handle:not(.header-bar) .f-image{margin:auto}#drag-handle.header-bar{background-color:var(--kup-title-background-color);color:var(--kup-title-color);display:flex;flex-direction:row;height:2em;position:relative;width:100%}#drag-handle.header-bar .dialog-title{font-weight:bold;line-height:2em;padding-left:0.5em;padding-right:2em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#drag-handle.header-bar #dialog-close{cursor:pointer;margin-right:0;transition:opacity 0.25s;position:absolute;right:0;background:var(--kup-title-background-color)}#drag-handle.header-bar #dialog-close:hover{opacity:0.5}.free-layout-1{background:var(--kup-background-color);box-shadow:var(--kup-box-shadow);box-sizing:border-box;overflow:auto;padding:1em}.free-layout-2{background:var(--kup-background-color);box-shadow:var(--kup-box-shadow);box-sizing:border-box;overflow:auto}.scalable-layout-1 .descr{font-size:70%;width:100%}.scalable-layout-1 .value{font-size:220%}.scalable-layout-2 #image1 img{object-fit:contain}.scalable-layout-2 .scalable-element{display:grid;grid-template-columns:1fr 1fr 0.5fr 0.5fr}.scalable-layout-2 .icon{margin:auto;font-size:150%;margin-right:5%}.scalable-layout-2 .value-int{font-size:250%}.scalable-layout-2 .value-dec,.scalable-layout-2 .unit{font-size:130%;margin-top:auto;margin-bottom:10%}.scalable-layout-2 .value-dec{margin-left:2%}.scalable-layout-2 .unit{margin-left:4%}.scalable-layout-3 .descr{font-size:70%;width:100%}.scalable-layout-3 .value{font-size:220%}.scalable-layout-4 #image1 img{object-fit:contain}.scalable-layout-4 .scalable-element{display:grid;grid-template-columns:1fr 5fr}.scalable-layout-4 .icon{font-size:150%;margin:auto 5% auto auto}.scalable-layout-4 .value-and-unit{display:flex;color:var(--color-0)}.scalable-layout-4 .value-and-unit .value-int{font-size:250%}.scalable-layout-4 .value-and-unit .value-dec,.scalable-layout-4 .value-and-unit .unit{font-size:130%;margin-top:auto;margin-bottom:10%}.scalable-layout-4 .value-and-unit .value-dec{margin-left:2%}.scalable-layout-4 .value-and-unit .unit{margin-left:4%}.scalable-layout-4 .descr{margin-left:4%;text-align:left;font-size:80%;width:100%;min-width:max-content}.scalable-layout-5 #image1 img{object-fit:contain}.scalable-layout-5 .scalable-element{display:flex}.scalable-layout-5 .text-wrapper{margin-right:10px}.scalable-layout-5 .icon{font-size:150%;margin:auto;margin-bottom:0.35em}.scalable-layout-5 .value{font-size:200%}.scalable-layout-5 .descr{text-align:right;font-size:65%;width:100%;min-width:max-content;position:relative;bottom:-10%}.scalable-layout-6 #image1 img{object-fit:contain}.scalable-layout-6 .scalable-element{display:flex;justify-content:space-between}.scalable-layout-6 .text-wrapper{margin-left:1em}.scalable-layout-6 .icon{font-size:150%;margin:auto}.scalable-layout-6 .value{font-size:220%;text-align:right}.scalable-layout-6 .descr{font-size:80%;text-align:right;width:100%;min-width:max-content}.scalable-layout-7 #image1 img{object-fit:contain}.scalable-layout-7 .scalable-element{display:flex}.scalable-layout-7 .text-wrapper{margin-right:0.5em}.scalable-layout-7 .icon{font-size:150%;margin:auto;margin-top:0.35em}.scalable-layout-7 .value{font-size:200%}.scalable-layout-7 .descr{text-align:right;font-size:65%;width:100%;min-width:max-content;position:relative;bottom:10%}.scalable-layout-8 #image1 img{object-fit:contain}.scalable-layout-8 .scalable-element{align-items:center;display:grid;grid-template-columns:0.25fr 1.25fr 0.25fr}.scalable-layout-8 .icon{margin-right:4%;font-size:75%}.scalable-layout-8 .value{margin:0 10%;font-size:250%}.scalable-layout-8 .descr{font-size:60%;text-align:left}.scalable-layout-9{background-color:var(--color-1);color:var(--color-2);height:100%;display:flex;justify-content:unset;overflow:auto;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);border-radius:4px}.scalable-layout-9 .section-1{background-color:var(--color-0);width:20%;height:100%}.scalable-layout-9 .section-2{width:100%;height:100%;display:flex;flex-direction:column}.scalable-layout-9 .text{display:flex;justify-content:center;flex-direction:column}.scalable-layout-9 .descr{font-size:80%}.scalable-layout-9 .value{font-size:220%}.scalable-layout-9 .buttons{height:max-content;margin-bottom:2%}.scalable-layout-9 .f-button{float:right}.scalable-card{align-items:center;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);border-radius:4px;display:flex;font-size:calc(var(--kup-font-size) * var(--kup_card_multiplier));height:100%;justify-content:center;position:relative;text-align:center;word-break:normal;width:100%}.standard-layout-1{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-1 kup-button{margin-right:0}.standard-layout-1 #image1 img{object-fit:cover}.standard-layout-1.has-actions{padding-bottom:52px}.standard-layout-1.has-actions .section-2 .sub-2.description{padding-bottom:0}.standard-layout-1 .section-1{height:60%;width:100%}.standard-layout-1 .section-2{height:40%;width:100%;overflow:auto}.standard-layout-1 .section-2 .sub-2.title{color:var(--kup-text-color);padding:0 1em;padding-top:1em;text-align:left}.standard-layout-1 .section-2 .sub-2.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-1 .section-2 .sub-2.subtitle{opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-1 .section-2 .sub-2.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-1 .section-2 .sub-2.description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-1 .section-2 .sub-2.description div{font-size:0.875em;font-weight:400;letter-spacing:0.0178571429em;line-height:1.25em}.standard-layout-1 .section-3{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-1 .section-3 kup-button{margin-left:0.25em}.standard-layout-2{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-2 kup-button{margin-right:0}.standard-layout-2 #image1 img{object-fit:cover}.standard-layout-2.has-actions{padding-bottom:52px}.standard-layout-2.has-actions .section-3 .sub-3.description{padding-bottom:0}.standard-layout-2 .section-1{width:100%}.standard-layout-2 .section-1 .sub-1.title{color:var(--kup-text-color);padding:0 1em;padding-top:1em;text-align:left}.standard-layout-2 .section-1 .sub-1.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-2 .section-1 .sub-1.subtitle{opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-2 .section-1 .sub-1.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-2 .section-2{height:75%;width:100%}.standard-layout-2 .section-3{width:100%;overflow:auto}.standard-layout-2 .section-3 .sub-3.description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;opacity:0.6;padding:0 1em 8px;padding-top:1em;text-align:left}.standard-layout-2 .section-3 .sub-3.description div{font-size:0.875em;font-weight:400;letter-spacing:0.0178571429em;line-height:1.25em}.standard-layout-2 .section-4{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-2 .section-4 kup-button{margin-left:0.25em}.standard-layout-3{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-3 kup-button{margin-right:0}.standard-layout-3 #image1 img{object-fit:cover}.standard-layout-3.has-actions{padding-bottom:52px}.standard-layout-3.has-actions .section-2 .sub-2.description{padding-bottom:0}.standard-layout-3 .section-1{height:75%;width:100%}.standard-layout-3 .section-1 .media{position:relative;height:100%;width:100%}.standard-layout-3 .section-1 .text-on-media{position:absolute;bottom:0;left:0}.standard-layout-3 .section-1 .sub-1.title{color:white;padding:0 1em;padding-top:1em;text-align:left}.standard-layout-3 .section-1 .sub-1.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-3 .section-1 .sub-1.subtitle{color:white;opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-3 .section-1 .sub-1.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-3 .section-2{width:100%;overflow:auto}.standard-layout-3 .section-2 .sub-2.description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;opacity:0.6;padding:0 1em 8px;padding-top:1em;text-align:left}.standard-layout-3 .section-2 .sub-2.description div{font-size:0.875em;font-weight:400;letter-spacing:0.0178571429em;line-height:1.25em}.standard-layout-3 .section-3{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-3 .section-3 kup-button{margin-left:0.25em}.standard-layout-4{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-4 kup-button{margin-right:0}.standard-layout-4 #image1 img{object-fit:cover}.standard-layout-4.has-actions{padding-bottom:52px}.standard-layout-4.has-actions .section-3 .sub-3.description{padding-bottom:0}.standard-layout-4 .section-1{display:flex;height:100%;width:100%}.standard-layout-4 .section-1 .sub-1.image{width:33%}.standard-layout-4 .section-1 .sub-1.text{width:77%}.standard-layout-4 .section-1 .sub-1.title{color:var(--kup-text-color);padding:0 1em;padding-top:1em;text-align:left}.standard-layout-4 .section-1 .sub-1.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-4 .section-1 .sub-1.subtitle{opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-4 .section-1 .sub-1.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-4 .section-2{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-4 .section-2 kup-button{margin-left:0.25em}.standard-layout-5{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);height:100%;overflow:hidden;width:100%}.standard-layout-5 .section-1{background-color:var(--color-0);height:3%}.standard-layout-5 .section-2{display:flex;height:53%}.standard-layout-5 .section-3{display:flex;height:24%}.standard-layout-5 .section-4{display:flex;height:20%;background-color:var(--color-1)}.standard-layout-5 .sub-2{box-sizing:border-box;display:flex;flex-direction:column;flex-wrap:wrap;justify-content:center}.standard-layout-5 .sub-2.icon{min-height:20px;flex:0 0 10%;max-width:10%}.standard-layout-5 .sub-2.icon #image1{box-sizing:border-box;margin:auto;padding:0 20%}.standard-layout-5 .sub-2.icon #image1 img{object-fit:contain}.standard-layout-5 .sub-2.text{flex:0 0 70%;max-width:70%;margin:auto;height:100%;flex-wrap:nowrap;padding:1em;text-align:left}.standard-layout-5 .sub-2.image{box-sizing:border-box;flex:0 0 20%;padding:1.5vh 0;max-width:20%}.standard-layout-5 .sub-2.image #image2{box-sizing:border-box;margin:auto;padding:0 10%}.standard-layout-5 .sub-2.image #image2 img{object-fit:contain}.standard-layout-5 .sub-2 .desc-text{overflow:auto}.standard-layout-5 .sub-2 .alt-text{color:var(--kup-primary-color)}.standard-layout-5 .sub-3{box-sizing:border-box}.standard-layout-5 .sub-3.progress-bar{margin:auto;padding:0 5%;vertical-align:2px;width:80%}.standard-layout-5 .sub-3.button{margin:auto;text-align:center;width:20%}.standard-layout-5 .sub-3 kup-button{margin:auto}.standard-layout-5 .sub-4{box-sizing:border-box;margin:auto}.standard-layout-5 .sub-4.text{width:50%;font-size:0.875em}.standard-layout-5 .sub-4 div{padding:0 5%}.standard-layout-5 .sub-4 .alt-text{color:var(--color-0);font-size:1em}.standard-layout-5 .alt-text{font-weight:bold}@media screen and (max-width: 767px){.standard-layout-5 .sub-2.image{display:none}.standard-layout-5 .sub-2.icon{flex-basis:30%;max-width:30%}}.standard-layout-6{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;height:100%;overflow:hidden;width:100%}.standard-layout-6 .section-1{background-color:var(--color-0);display:flex;flex:0 0 10%;max-width:10%}.standard-layout-6 .section-1 .alt-text{color:var(--kup_card_dynamic_color_0);height:100%;text-align:center;writing-mode:vertical-lr;margin:auto;font-size:1.25em}.standard-layout-6 .section-2{box-sizing:border-box;height:100%;display:flex;flex:0 0 90%;flex-direction:column;max-width:90%}.standard-layout-6 .section-2 .sub-2{margin:auto;text-align:center}.standard-layout-6 .section-2 .sub-2 kup-progress-bar{margin-bottom:1em}.standard-layout-6 kup-button{position:absolute;bottom:2%;right:2%}.standard-layout-7{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:column;height:100%;overflow:hidden;width:100%}.standard-layout-7 #image1 img{margin:auto;object-fit:contain}.standard-layout-7 .section-1{background-color:var(--color-0);height:5%;width:100%}.standard-layout-7 .section-2{height:80%;width:100%;text-align:center;padding:25px 25%;box-sizing:border-box}.standard-layout-7 .section-2 .sub-2{margin:auto}.standard-layout-7 .section-2 .sub-2.image{box-sizing:border-box;height:65%}.standard-layout-7 .section-2 .sub-2.text{font-size:1.4em;letter-spacing:1.2px;padding-top:1em;height:35%}.standard-layout-7 .section-3{display:flex;height:15%;width:100%}.standard-layout-7 .section-3 .alt-text{margin:auto;opacity:0.75;width:50%}.standard-layout-7 .section-3 .alt-text:nth-child(1){margin-left:1em;text-align:left}.standard-layout-7 .section-3 .alt-text:nth-child(2){margin-right:1em;text-align:right}.standard-layout-8{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:column;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-8 .background{background-color:var(--color-0);content:\"\";height:100%;width:100%;opacity:0.1;pointer-events:none;position:absolute;top:0;left:0;z-index:1}.standard-layout-8 .section-1{box-sizing:border-box;display:flex;flex-direction:column;max-width:100%;overflow:auto;height:auto}.standard-layout-8 .section-1 .sub-1{text-align:left;padding:0.6em 0.8em 0;font-size:1em;font-weight:bold;max-width:75%}.standard-layout-8 .section-1 .sub-2{text-align:left;padding:0.6em 0.8em;font-size:0.875em;max-width:75%}.standard-layout-8 .section-1 .sub-3{color:var(--color-0);font-weight:bold;text-align:center;font-size:1.2em;position:absolute;top:1em;right:1em;max-width:25%;text-overflow:ellipsis;max-height:calc(24px + 2.25em);padding:0 1em;overflow:hidden}.standard-layout-8 .section-1 .sub-3 kup-image{margin:auto}.standard-layout-8 .section-2{display:flex;height:auto;overflow:auto}.standard-layout-9{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:row;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-9 #image1 img{object-fit:contain}.standard-layout-9 .section-1{margin-top:auto;margin-right:18px;margin-bottom:auto;white-space:nowrap}.standard-layout-9 .section-2{display:flex;height:100%;margin-top:auto;margin-bottom:auto;width:100%;overflow:hidden}.standard-layout-9 .sub-2{display:flex;flex-direction:row}.standard-layout-9 .text{text-align:left}.standard-layout-9 .text-wrapper{display:flex;flex-direction:column}.standard-layout-9 .icon{margin:auto;padding:0 1.25em}.standard-layout-9 .description{font-size:1.5em;letter-spacing:1px;padding-left:1.25em;padding-top:0.25em}.standard-layout-9 .title{font-size:2.75em;font-weight:bold}.standard-layout-9 .subtitle{font-size:1.5em;opacity:0.75}.standard-layout-10{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:row;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-10 #image1 img{object-fit:contain}.standard-layout-10 .section-1{display:flex;height:100%;margin-top:auto;margin-bottom:auto;width:100%;overflow:hidden}.standard-layout-10 .section-2{margin-top:auto;margin-left:18px;margin-bottom:auto;white-space:nowrap}.standard-layout-10 .sub-2{display:flex;flex-direction:row-reverse}.standard-layout-10 .text{text-align:right}.standard-layout-10 .text-wrapper{display:flex;flex-direction:column}.standard-layout-10 .icon{margin:auto;padding:0 1.25em}.standard-layout-10 .description{font-size:1.5em;letter-spacing:1px;padding-right:1.25em;padding-top:0.25em}.standard-layout-10 .title{font-size:2.75em;font-weight:bold}.standard-layout-10 .subtitle{font-size:1.5em;opacity:0.75}.standard-layout-11{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:row;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-11 #image1 img{object-fit:contain}.standard-layout-11 .section-1{display:flex;height:100%;margin-top:auto;margin-bottom:auto;min-width:6em;max-width:6em;overflow:hidden;transition:0.25s ease-in}.standard-layout-11 .section-2{display:flex;height:100%;margin-top:auto;margin-bottom:auto;width:100%;overflow:hidden}.standard-layout-11 .sub-1{background-color:var(--color-0);height:100%;text-align:center;writing-mode:vertical-lr;min-width:6em;display:flex;transition:width 0.25s ease-in}.standard-layout-11 .sub-1 div{font-size:1.25em}.standard-layout-11 .sub-2{display:flex;flex-direction:row}.standard-layout-11 .text:not(.description){text-align:left}.standard-layout-11 .text-wrapper{display:flex;flex-direction:column}.standard-layout-11 .icon{margin:auto;padding:0 1.25em}.standard-layout-11 .description{font-size:1.5em;letter-spacing:1px;margin:auto;color:var(--kup_card_dynamic_color_0)}.standard-layout-11 .title{font-size:2.75em;font-weight:bold;margin-top:auto}.standard-layout-11 .subtitle{font-size:1.5em;opacity:0.75;margin-bottom:auto}.standard-layout-12{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);color:var(--kup-text-color);min-width:200px;min-width:-moz-max-content;min-width:-webkit-max-content;}.standard-layout-12 .section-1{display:inline-flex;border-bottom:1px solid var(--kup-border-color);width:100%}.standard-layout-12 .section-1 kup-button{margin:0}.standard-layout-12 .section-2{display:flex;flex-direction:column}.standard-layout-12 .section-2.has-content{border-bottom:1px solid var(--kup-border-color);padding:0.5em 0.5em}.standard-layout-12 .section-2 kup-date-picker:first-of-type,.standard-layout-12 .section-2 kup-time-picker:first-of-type{margin-bottom:0.5em}.standard-layout-12 .section-3{backface-visibility:hidden;display:flex;flex-direction:column;max-height:20vh;overflow:auto}.standard-layout-12 .section-3 kup-checkbox{margin-left:0;margin-right:auto}.standard-layout-13{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;position:relative;width:100%}.standard-layout-13 kup-button{margin-left:0}.standard-layout-13 .section-1{background-color:var(--kup-background-color);display:flex;justify-content:flex-start;align-items:center;box-sizing:border-box;box-shadow:0px 1px 3px 0px var(--kup-text-color);height:52px;width:100%;text-align:right}.standard-layout-13 .section-1 kup-button{margin-right:0.25em}.standard-layout-13 .section-2{height:100%;width:100%;overflow:auto;max-height:50vh}.standard-layout-13 .text{color:var(--kup-text-color);font-family:var(--kup-font-family-monospace);white-space:nowrap;border-bottom:1px solid var(--kup-border-color);line-height:1.75em}.standard-layout-14{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);color:var(--kup-text-color);min-width:200px;min-width:-moz-max-content;min-width:-webkit-max-content;}.standard-layout-14 .section-1{--kup-button-font-size:0.75em;box-sizing:border-box;display:flex;padding:1em}.standard-layout-14 .section-1 .sub-1{width:100%}.standard-layout-14 .section-1 .sub-spinner{height:88px;width:88px;margin:0 10px}.standard-layout-14 .section-1 .f-image{margin:0 0.5em 0 0}.standard-layout-14 .section-1 .title{align-items:flex-end;display:flex;font-size:1.25em;font-weight:600;margin-bottom:0.5em;padding:0 0.25em 0.25em;text-align:left}.standard-layout-14 .section-1 .title .label{cursor:pointer;padding-right:0.25em;padding-top:0.5em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.standard-layout-14 .section-1 .title .label:hover{text-decoration:underline}.standard-layout-14 .section-1 .info{display:flex;padding:0 0.25em 0.25em;width:100%}.standard-layout-14 .section-1 .info .label{color:rgba(var(--kup-text-color-rgb), 0.75);margin-right:0.75em;min-width:max-content;width:auto}.standard-layout-14 .section-1 .info .value{font-weight:600;width:100%}.standard-layout-14 .sub-button{display:inline-flex;width:100%}.standard-layout-14 .sub-button kup-button{margin:0}.standard-layout-14 .sub-checkbox{backface-visibility:hidden;display:flex;flex-direction:column;max-height:20vh;overflow:auto}.standard-layout-14 .sub-checkbox kup-checkbox{margin-left:0;margin-right:auto}.standard-layout-14 .sub-formula{padding:0.5em}.standard-layout-14 .sub-chip{max-width:25vw;overflow:auto;box-shadow:0 3px 2px -2px var(--kup-border-color)}.standard-layout-14 .sub-field{display:flex;flex-direction:column}.standard-layout-14 .sub-field.has-content{border-bottom:1px solid var(--kup-border-color);padding:0.5em 0.5em}.standard-layout-14 .sub-field kup-date-picker:first-of-type,.standard-layout-14 .sub-field kup-time-picker:first-of-type{margin-bottom:0.5em}.standard-layout-14 .sub-spinner{height:100px}.standard-layout-14 .sub-autocomplete{padding-top:1em}.standard-layout-14 .sub-autocomplete kup-autocomplete{margin:auto;padding:0.5em 0;width:max-content}.standard-layout-14 .sub-switch{display:flex;justify-content:space-evenly;padding:2em}.standard-layout-14 .sub-tree{max-height:25vh;overflow:auto}.standard-layout-14 #apply{display:none;margin:auto}.standard-layout-14 #apply.visible{display:block}.standard-layout-14 #open-in-new,.standard-layout-14 #search,.standard-layout-14 #new{margin:0 0 0.5em 0}.standard-layout-15{background:var(--kup-background-color);border-radius:3px;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);color:var(--kup-text-color);display:block;font-size:var(--kup-font-size);outline:none}.standard-layout-15 .section-1{--kup-button-font-size:0.75em;box-sizing:border-box;display:flex;padding:1em}.standard-layout-15 .section-1 .sub-1{width:100%}.standard-layout-15 .section-1 .sub-spinner{height:88px;width:88px;margin:0 10px}.standard-layout-15 .section-1 .f-image{margin:0 0.5em 0 0}.standard-layout-15 .section-1 .title{align-items:flex-end;display:flex;font-size:1.25em;font-weight:600;margin-bottom:0.5em;padding:0 0.25em 0.25em;text-align:left}.standard-layout-15 .section-1 .title .label{cursor:pointer;padding-right:0.25em;padding-top:0.5em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.standard-layout-15 .section-1 .title .label:hover{text-decoration:underline}.standard-layout-15 .section-1 .info{display:flex;padding:0 0.25em 0.25em;width:100%}.standard-layout-15 .section-1 .info .label{color:rgba(var(--kup-text-color-rgb), 0.75);margin-right:0.75em;min-width:max-content;width:auto}.standard-layout-15 .section-1 .info .value{font-weight:600;width:100%}.standard-layout-15 .section-2{border-top:1px solid var(--kup-border-color);box-sizing:border-box;height:180px;opacity:1;overflow:auto;transition:height 250ms ease-out, opacity 250ms ease-out}.standard-layout-15 .section-2 .info{box-sizing:border-box;height:100%;overflow:auto;padding:1.25em}.standard-layout-15 .section-2 .detail-row{align-items:center;display:flex;justify-content:space-between}.standard-layout-15 .section-2 .detail-row:not(:last-child){margin-bottom:6px}.standard-layout-15 .section-2 .detail-row__label{color:rgba(var(--kup-text-color-rgb), 0.5);margin-top:0.175em;max-width:320px;padding-right:1.25em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.standard-layout-15 .section-2 .detail-row__value{color:var(--kup-text-color);font-size:105%;font-weight:600;max-width:320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.standard-layout-15 .section-2 kup-tree{text-align:left}.standard-layout-15 .section-3{border-top:1px solid var(--kup-border-color);display:flex;justify-content:flex-end;padding:6px;padding-top:2px;padding-bottom:2px}.standard-layout-15 .section-3 kup-button{margin:auto 0}.standard-layout-15 #open-in-new,.standard-layout-15 #search,.standard-layout-15 #new{margin:0 0 0.5em 0}:host{--kup_card_backdrop:var(--kup-card-backdrop, rgba(0, 0, 0, 0.32));--kup_card_ripple_color:var(\n    --kup-card-ripple-color,\n    var(--kup-primary-color)\n  );display:block;font-size:var(--kup-font-size);height:var(--kup_card_height);min-height:var(--kup_card_height);min-width:var(--kup_card_width);outline:none;position:relative;width:var(--kup_card_width)}:host([show-modal]) #kup-component{position:fixed;z-index:var(--kup-card-zindex);height:var(--kup_card_height);width:var(--kup_card_width);top:var(--kup_card_top);left:var(--kup_card_left);display:var(--kup_card_display, none)}:host([is-menu]){display:none;animation:fade-in 0.25s ease-out}:host([menu-visible]){box-shadow:var(--kup-box-shadow);display:block}#kup-component{height:100%;width:100%}.backdrop{background:var(--kup_card_backdrop);display:none;height:100%;left:0;position:fixed;top:0;width:100%;z-index:calc(var(--kup-card-zindex) - 1);display:block}.mdc-ripple-surface{cursor:pointer;flex-direction:column;display:flex;height:100%;position:relative}.mdc-ripple-surface:before,.mdc-ripple-surface:after{background-color:var(--kup_card_ripple_color)}.card-view{animation:fade-in 0.25s ease-out;display:none;height:100%;width:100%}.card-view.visible{display:block}";
+const kupCardCss = ".box-layout-1{background-color:var(--kup-background-color);color:var(--kup-text-color);font-size:var(--kup-font-size);padding:0.5em}.box-layout-1 table{width:100%}.box-layout-1 .label{overflow:hidden;padding:0.5em;text-overflow:ellipsis;width:50%}.box-layout-1 .value{font-weight:bold;padding:0.5em}.box-layout-2{background-color:var(--kup-background-color);color:var(--kup-text-color);font-size:var(--kup-font-size);padding:0.5em}.box-layout-2 table{width:100%}.box-layout-2 .label{max-width:50%;overflow:hidden;padding:0.5em;text-overflow:ellipsis;white-space:nowrap}.box-layout-2 .value{padding:0.5em;font-weight:bold}.box-layout-3{background-color:var(--kup-background-color);color:var(--kup-text-color);font-size:var(--kup-font-size);padding:0.5em}.box-layout-3 .container{display:flex;justify-content:space-between;overflow:hidden;width:100%}.box-layout-3 .flex-container{align-items:center;display:flex;justify-content:center;width:100%}.box-layout-3 .flex-container:first-child{justify-content:flex-start}.box-layout-3 .flex-container:last-child{justify-content:flex-end}.box-layout-3 .label{overflow:hidden;padding:0.5em;text-overflow:ellipsis;white-space:nowrap}.box-layout-3 .value{padding:0.5em;font-weight:bold}.box-layout-3 .f-cell .f-cell__text{white-space:nowrap}.box-layout-4{background-color:var(--kup-background-color);color:var(--kup-text-color);display:flex;font-size:var(--kup-font-size);height:100%;padding:0.5em}.box-layout-4 .container{margin:auto;width:100%}.box-layout-4 .image{border-radius:50%;height:64px;margin:auto;width:64px}.box-layout-4 .value{font-weight:bold;padding-top:0.5em}.box-layout-4 .f-cell.c-centered .f-cell__content img,.box-layout-4 .f-cell.c-centered .f-cell__content .f-image{margin:0}.box-layout-5{background-color:var(--kup-background-color);color:var(--kup-text-color);display:flex;font-size:var(--kup-font-size);height:100%;padding:1em 0.5em}.box-layout-5 .container{display:flex;height:100%;margin:auto;width:100%}.box-layout-5 .image{display:flex;height:100%;margin:auto;width:50%}.box-layout-5 .label,.box-layout-5 .value{padding:0.5em}.box-layout-5 .label{overflow:hidden;text-align:right;text-overflow:ellipsis;white-space:nowrap}.box-layout-5 .value{font-weight:bold}.box-layout-5 .table{box-sizing:border-box;padding:1.25em}.box-layout-5 .table,.box-layout-5 table{width:100%}.box-layout-6{background-color:var(--kup-background-color);color:var(--kup-text-color);display:flex;font-size:var(--kup-font-size);height:100%;padding:1em 0.5em}.box-layout-6 .container{display:flex;height:100%;margin:auto;width:100%}.box-layout-6 .image{display:flex;height:100%;margin:auto;width:50%}.box-layout-6 .label{padding-bottom:0.25em}.box-layout-6 .value{font-weight:bold;padding-bottom:1.25em}.box-layout-6 tr:last-child .value{padding-bottom:0}.box-layout-6 .table{box-sizing:border-box;display:flex;height:max-content;margin:auto;padding:1.25em}.box-layout-6 .table,.box-layout-6 table{width:100%}.box-layout-7{background-color:var(--kup-background-color);color:var(--kup-text-color);display:flex;font-size:var(--kup-font-size);height:100%;padding:1em 0.5em}.box-layout-7 .container{height:100%;margin:auto;width:100%}.box-layout-7 .image{width:100%}.box-layout-7 .label,.box-layout-7 .value{padding:0.25em}.box-layout-7 .label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.box-layout-7 .value{font-weight:bold}.box-layout-7 .table{box-sizing:border-box;padding:1.25em;padding-bottom:0}.box-layout-7 .table,.box-layout-7 table{width:100%}.box-layout-8{background-color:var(--kup-background-color);color:var(--kup-text-color);display:flex;font-size:var(--kup-font-size);height:100%;padding:1em 0.5em}.box-layout-8 .container{height:100%;margin:auto;width:100%}.box-layout-8 .image{width:100%}.box-layout-8 .label{overflow:hidden;padding-bottom:0.25em;text-overflow:ellipsis;white-space:nowrap}.box-layout-8 .value{font-weight:bold;padding-bottom:1.25em}.box-layout-8 tr:last-child .value{padding-bottom:0}.box-layout-8 .table{box-sizing:border-box;padding:1.25em;padding-bottom:0}.box-layout-8 .table,.box-layout-8 table{width:100%}.built-in-layout-1{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto;padding:0.5em}.built-in-layout-1 .section-1{box-sizing:border-box;height:5em;overflow:auto;padding-bottom:1em;width:100%}.built-in-layout-1 .section-1 .sub-1{display:flex;flex-direction:row;justify-content:center}.built-in-layout-1 .section-2{height:calc(100% - 60px);overflow:auto;width:100%}.built-in-layout-1 .prev-page{margin-left:auto}.built-in-layout-1 .change-view-button{margin:auto;width:12em;text-align:center}.built-in-layout-1 #change-view-button button{text-transform:capitalize}.built-in-layout-1 .next-page{margin-right:auto}.built-in-layout-1 .calendar{border-collapse:collapse;width:100%}.built-in-layout-1 thead{border-bottom:1px solid var(--kup-border-color)}.built-in-layout-1 .item-text{color:rgba(var(--kup-text-color-rgb), 0.5)}.built-in-layout-1 .item{text-align:center}.built-in-layout-1 .item:not(.selected) .item-number:hover{background-color:var(--kup-hover-background-color)}.built-in-layout-1 .item.selected .item-number,.built-in-layout-1 .item.selected .item-number:hover{background-color:rgba(var(--kup-primary-color-rgb), 0.175)}.built-in-layout-1 .item-number{border-radius:50%;cursor:pointer;display:flex;justify-content:center;line-height:2.5em;margin:auto;width:2.5em;transition:background-color 0.25s;text-transform:capitalize}.built-in-layout-2{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.built-in-layout-2 .clock{box-shadow:var(--kup-box-shadow);width:300px;height:450px;background-color:var(--kup-background-color);position:relative;font-family:var(--kup-font-family)}.built-in-layout-2 .top{background-color:var(--kup-primary-color);color:var(--kup-text-on-primary-color);height:100px;line-height:100px;font-size:50px;text-align:center}.built-in-layout-2 .top span{cursor:pointer;opacity:0.75;transition:0.25s ease-in-out}.built-in-layout-2 .top .visible{opacity:1}.built-in-layout-2 .circle{user-select:none;background-color:rgba(var(--kup-text-color-rgb), 0.1);width:250px;height:250px;border-radius:1000px;position:relative;top:25px;left:25px;box-sizing:border-box;display:none}.built-in-layout-2 .circle.visible{display:block}.built-in-layout-2 .mid{position:absolute;left:calc(50% - 0px);top:calc(50% - 0px);width:2px;height:2px;border-radius:10px;background-color:var(--kup-text-color)}.built-in-layout-2 .hour{position:absolute;height:40px;line-height:40px;width:40px;border-radius:40px;text-align:center}.built-in-layout-2 .hour.selected{z-index:2}.built-in-layout-2 .hour.selected::after{content:\"\";z-index:-1;background-color:rgba(var(--kup-primary-color-rgb), 0.5);height:1px;width:100%;position:absolute;transform:rotate(-90deg);transform-origin:100% 0%;top:50%;width:101px;right:50%}.built-in-layout-2 .hour2{z-index:2;position:absolute;height:30px;line-height:30px;width:30px;border-radius:40px;text-align:center;font-size:14px}.built-in-layout-2 .hour2.selected::after{content:\"\";background-color:rgba(var(--kup-primary-color-rgb), 0.5);height:1px;width:100%;position:absolute;transform:rotate(-90deg);transform-origin:100% 0%;top:50%;width:64px;right:50%;z-index:-1}.built-in-layout-2 .unit{position:absolute;height:20px;line-height:20px;width:20px;border-radius:40px;text-align:center;font-size:12px}.built-in-layout-2 .unit.selected::after{content:\"\";background-color:rgba(var(--kup-primary-color-rgb), 0.5);height:1px;width:100%;position:absolute;transform:rotate(-90deg);transform-origin:100% 0%;top:50%;width:101px;right:50%}.built-in-layout-2 .hour,.built-in-layout-2 .hour2,.built-in-layout-2 .unit{cursor:pointer;transition:background-color 0.25s}.built-in-layout-2 .hour:hover,.built-in-layout-2 .hour2:hover,.built-in-layout-2 .unit:hover{background-color:rgba(var(--kup-primary-color-rgb), 0.275)}.built-in-layout-2 .hour.selected,.built-in-layout-2 .hour2.selected,.built-in-layout-2 .unit.selected{background-color:var(--kup-primary-color);color:var(--kup-text-on-primary-color)}.built-in-layout-2 .actions{color:var(--kup-primary-color);font-weight:bold;font-size:20px;display:flex;justify-content:flex-end;position:absolute;width:100%;box-sizing:border-box;bottom:10px}.built-in-layout-2 .action{display:inline-block;width:100px;text-align:center;height:37.5px;line-height:37.5px;margin-right:10px;cursor:pointer;border-radius:2px}.built-in-layout-2 .clock .actions .action:hover{background-color:rgba(0, 0, 0, 0.1)}.built-in-layout-2 .clock .actions .action:visible{background-color:rgba(0, 0, 0, 0.3)}.built-in-layout-2 .hour:nth-child(12):after{transform:rotate(330deg)}.built-in-layout-2 .hour:nth-child(11):after{transform:rotate(300deg)}.built-in-layout-2 .hour:nth-child(10):after{transform:rotate(270deg)}.built-in-layout-2 .hour:nth-child(9):after{transform:rotate(240deg)}.built-in-layout-2 .hour:nth-child(8):after{transform:rotate(210deg)}.built-in-layout-2 .hour:nth-child(7):after{transform:rotate(180deg)}.built-in-layout-2 .hour:nth-child(6):after{transform:rotate(150deg)}.built-in-layout-2 .hour:nth-child(5):after{transform:rotate(120deg)}.built-in-layout-2 .hour:nth-child(4):after{transform:rotate(90deg)}.built-in-layout-2 .hour:nth-child(3):after{transform:rotate(60deg)}.built-in-layout-2 .hour:nth-child(2):after{transform:rotate(30deg)}.built-in-layout-2 .hour:nth-child(1):after{transform:rotate(0deg)}.built-in-layout-2 .hour2:nth-child(24):after{transform:rotate(690deg)}.built-in-layout-2 .hour2:nth-child(23):after{transform:rotate(660deg)}.built-in-layout-2 .hour2:nth-child(22):after{transform:rotate(630deg)}.built-in-layout-2 .hour2:nth-child(21):after{transform:rotate(600deg)}.built-in-layout-2 .hour2:nth-child(20):after{transform:rotate(570deg)}.built-in-layout-2 .hour2:nth-child(19):after{transform:rotate(540deg)}.built-in-layout-2 .hour2:nth-child(18):after{transform:rotate(510deg)}.built-in-layout-2 .hour2:nth-child(17):after{transform:rotate(480deg)}.built-in-layout-2 .hour2:nth-child(16):after{transform:rotate(450deg)}.built-in-layout-2 .hour2:nth-child(15):after{transform:rotate(420deg)}.built-in-layout-2 .hour2:nth-child(14):after{transform:rotate(390deg)}.built-in-layout-2 .hour2:nth-child(13):after{transform:rotate(360deg)}.built-in-layout-2 .unit:nth-child(60):after{transform:rotate(354deg)}.built-in-layout-2 .unit:nth-child(59):after{transform:rotate(348deg)}.built-in-layout-2 .unit:nth-child(58):after{transform:rotate(342deg)}.built-in-layout-2 .unit:nth-child(57):after{transform:rotate(336deg)}.built-in-layout-2 .unit:nth-child(56):after{transform:rotate(330deg)}.built-in-layout-2 .unit:nth-child(55):after{transform:rotate(324deg)}.built-in-layout-2 .unit:nth-child(54):after{transform:rotate(318deg)}.built-in-layout-2 .unit:nth-child(53):after{transform:rotate(312deg)}.built-in-layout-2 .unit:nth-child(52):after{transform:rotate(306deg)}.built-in-layout-2 .unit:nth-child(51):after{transform:rotate(300deg)}.built-in-layout-2 .unit:nth-child(50):after{transform:rotate(294deg)}.built-in-layout-2 .unit:nth-child(49):after{transform:rotate(288deg)}.built-in-layout-2 .unit:nth-child(48):after{transform:rotate(282deg)}.built-in-layout-2 .unit:nth-child(47):after{transform:rotate(276deg)}.built-in-layout-2 .unit:nth-child(46):after{transform:rotate(270deg)}.built-in-layout-2 .unit:nth-child(45):after{transform:rotate(264deg)}.built-in-layout-2 .unit:nth-child(44):after{transform:rotate(258deg)}.built-in-layout-2 .unit:nth-child(43):after{transform:rotate(252deg)}.built-in-layout-2 .unit:nth-child(42):after{transform:rotate(246deg)}.built-in-layout-2 .unit:nth-child(41):after{transform:rotate(240deg)}.built-in-layout-2 .unit:nth-child(40):after{transform:rotate(234deg)}.built-in-layout-2 .unit:nth-child(39):after{transform:rotate(228deg)}.built-in-layout-2 .unit:nth-child(38):after{transform:rotate(222deg)}.built-in-layout-2 .unit:nth-child(37):after{transform:rotate(216deg)}.built-in-layout-2 .unit:nth-child(36):after{transform:rotate(210deg)}.built-in-layout-2 .unit:nth-child(35):after{transform:rotate(204deg)}.built-in-layout-2 .unit:nth-child(34):after{transform:rotate(198deg)}.built-in-layout-2 .unit:nth-child(33):after{transform:rotate(192deg)}.built-in-layout-2 .unit:nth-child(32):after{transform:rotate(186deg)}.built-in-layout-2 .unit:nth-child(31):after{transform:rotate(180deg)}.built-in-layout-2 .unit:nth-child(30):after{transform:rotate(174deg)}.built-in-layout-2 .unit:nth-child(29):after{transform:rotate(168deg)}.built-in-layout-2 .unit:nth-child(28):after{transform:rotate(162deg)}.built-in-layout-2 .unit:nth-child(27):after{transform:rotate(156deg)}.built-in-layout-2 .unit:nth-child(26):after{transform:rotate(150deg)}.built-in-layout-2 .unit:nth-child(25):after{transform:rotate(144deg)}.built-in-layout-2 .unit:nth-child(24):after{transform:rotate(138deg)}.built-in-layout-2 .unit:nth-child(23):after{transform:rotate(132deg)}.built-in-layout-2 .unit:nth-child(22):after{transform:rotate(126deg)}.built-in-layout-2 .unit:nth-child(21):after{transform:rotate(120deg)}.built-in-layout-2 .unit:nth-child(20):after{transform:rotate(114deg)}.built-in-layout-2 .unit:nth-child(19):after{transform:rotate(108deg)}.built-in-layout-2 .unit:nth-child(18):after{transform:rotate(102deg)}.built-in-layout-2 .unit:nth-child(17):after{transform:rotate(96deg)}.built-in-layout-2 .unit:nth-child(16):after{transform:rotate(90deg)}.built-in-layout-2 .unit:nth-child(15):after{transform:rotate(84deg)}.built-in-layout-2 .unit:nth-child(14):after{transform:rotate(78deg)}.built-in-layout-2 .unit:nth-child(13):after{transform:rotate(72deg)}.built-in-layout-2 .unit:nth-child(12):after{transform:rotate(66deg)}.built-in-layout-2 .unit:nth-child(11):after{transform:rotate(60deg)}.built-in-layout-2 .unit:nth-child(10):after{transform:rotate(54deg)}.built-in-layout-2 .unit:nth-child(9):after{transform:rotate(48deg)}.built-in-layout-2 .unit:nth-child(8):after{transform:rotate(42deg)}.built-in-layout-2 .unit:nth-child(7):after{transform:rotate(36deg)}.built-in-layout-2 .unit:nth-child(6):after{transform:rotate(30deg)}.built-in-layout-2 .unit:nth-child(5):after{transform:rotate(24deg)}.built-in-layout-2 .unit:nth-child(4):after{transform:rotate(18deg)}.built-in-layout-2 .unit:nth-child(3):after{transform:rotate(12deg)}.built-in-layout-2 .unit:nth-child(2):after{transform:rotate(6deg)}.built-in-layout-2 .unit:nth-child(1):after{transform:rotate(0deg)}.built-in-layout-3{background:var(--kup-background-color);box-shadow:rgba(128, 128, 128, 0.1) 0px 2px 1px -1px, rgba(128, 128, 128, 0.1) 0px 1px 1px 0px, rgba(128, 128, 128, 0.6) 0px 1px 3px 0px;box-sizing:border-box;overflow:auto}.built-in-layout-3 kup-button,.built-in-layout-3 kup-combobox{margin:0 auto 0.75em auto}.built-in-layout-3 kup-combobox{width:95%}.built-in-layout-3 .sub-chip{border-top:1px solid var(--kup-border-color);max-height:33vh;overflow:auto;width:100%}.built-in-layout-4{background:var(--kup-background-color);box-shadow:rgba(128, 128, 128, 0.1) 0px 2px 1px -1px, rgba(128, 128, 128, 0.1) 0px 1px 1px 0px, rgba(128, 128, 128, 0.6) 0px 1px 3px 0px;box-sizing:border-box}.built-in-layout-4 .picker_arrow{position:absolute;z-index:-1}.built-in-layout-4 .picker_wrapper.popup{position:absolute;z-index:2;margin:1.5em}.built-in-layout-4 .picker_wrapper.popup,.built-in-layout-4 .picker_wrapper.popup .picker_arrow::before,.built-in-layout-4 .picker_wrapper.popup .picker_arrow::after{background:var(--kup-background-color);box-shadow:0 0 10px 1px rgba(0, 0, 0, 0.4)}.built-in-layout-4 .picker_wrapper.popup .picker_arrow{width:3em;height:3em;margin:0}.built-in-layout-4 .picker_wrapper.popup .picker_arrow::before,.built-in-layout-4 .picker_wrapper.popup .picker_arrow::after{content:\"\";display:block;position:absolute;top:0;left:0;z-index:-99}.built-in-layout-4 .picker_wrapper.popup .picker_arrow::before{width:100%;height:100%;transform:skew(45deg);transform-origin:0 100%}.built-in-layout-4 .picker_wrapper.popup .picker_arrow::after{width:150%;height:150%;box-shadow:none}.built-in-layout-4 .popup.popup_top{bottom:100%;left:0}.built-in-layout-4 .popup.popup_top .picker_arrow{bottom:0;left:0;transform:rotate(-90deg)}.built-in-layout-4 .popup.popup_bottom{top:100%;left:0}.built-in-layout-4 .popup.popup_bottom .picker_arrow{top:0;left:0;transform:rotate(90deg) scale(1, -1)}.built-in-layout-4 .popup.popup_left{top:0;right:100%}.built-in-layout-4 .popup.popup_left .picker_arrow{top:0;right:0;transform:scale(-1, 1)}.built-in-layout-4 .popup.popup_right{top:0;left:100%}.built-in-layout-4 .popup.popup_right .picker_arrow{top:0;left:0}.built-in-layout-4 .picker_wrapper.no_alpha .picker_alpha{display:none}.built-in-layout-4 .picker_wrapper.no_editor .picker_editor{position:absolute;z-index:-1;opacity:0}.built-in-layout-4 .picker_wrapper.no_cancel .picker_cancel{display:none}.built-in-layout-4 .layout_default.picker_wrapper{display:flex;flex-flow:row wrap;justify-content:space-between;align-items:stretch;font-size:10px;width:25em;padding:0.5em}.built-in-layout-4 .layout_default.picker_wrapper input,.built-in-layout-4 .layout_default.picker_wrapper button{font-size:1em}.built-in-layout-4 .layout_default.picker_wrapper>*{margin:0.5em}.built-in-layout-4 .layout_default.picker_wrapper::before{content:\"\";display:block;width:100%;height:0;order:1}.built-in-layout-4 .layout_default .picker_slider,.built-in-layout-4 .layout_default .picker_selector{padding:1em}.built-in-layout-4 .layout_default .picker_hue{width:100%}.built-in-layout-4 .layout_default .picker_sl{flex:1 1 auto}.built-in-layout-4 .layout_default .picker_sl::before{content:\"\";display:block;padding-bottom:100%}.built-in-layout-4 .layout_default .picker_editor{order:1;width:6.5em}.built-in-layout-4 .layout_default .picker_editor input{width:100%;height:100%}.built-in-layout-4 .layout_default .picker_sample{order:1;flex:1 1 auto}.built-in-layout-4 .layout_default .picker_done,.built-in-layout-4 .layout_default .picker_cancel{order:1}.built-in-layout-4 .picker_wrapper{box-sizing:border-box;background:var(--kup-background-color);box-shadow:0 0 0 1px var(--kup-border-color);cursor:default;font-family:sans-serif;color:#444;pointer-events:auto}.built-in-layout-4 .picker_wrapper:focus{outline:none}.built-in-layout-4 .picker_wrapper button,.built-in-layout-4 .picker_wrapper input{box-sizing:border-box;border:none;box-shadow:0 0 0 1px var(--kup-border-color);outline:none}.built-in-layout-4 .picker_wrapper button:focus,.built-in-layout-4 .picker_wrapper button:active,.built-in-layout-4 .picker_wrapper input:focus,.built-in-layout-4 .picker_wrapper input:active{box-shadow:0 0 2px 1px var(--kup-border-color)}.built-in-layout-4 .picker_wrapper button{padding:0.4em 0.6em;cursor:pointer;background-color:whitesmoke;background-image:linear-gradient(0deg, gainsboro, transparent)}.built-in-layout-4 .picker_wrapper button:active{background-image:linear-gradient(0deg, transparent, gainsboro)}.built-in-layout-4 .picker_selector{position:absolute;z-index:1;display:block;transform:translate(-50%, -50%);border:2px solid white;border-radius:100%;box-shadow:0 0 3px 1px #67b9ff;background:currentColor;cursor:pointer}.built-in-layout-4 .picker_slider .picker_selector{border-radius:2px}.built-in-layout-4 .picker_hue{position:relative;background-image:linear-gradient(90deg, red, yellow, lime, cyan, blue, magenta, red);box-shadow:0 0 0 1px var(--kup-border-color)}.built-in-layout-4 .picker_sl{position:relative;box-shadow:0 0 0 1px var(--kup-border-color);background-image:linear-gradient(180deg, white, rgba(255, 255, 255, 0) 50%), linear-gradient(0deg, black, rgba(0, 0, 0, 0) 50%), linear-gradient(90deg, #808080, rgba(128, 128, 128, 0))}.built-in-layout-4 .picker_alpha,.built-in-layout-4 .picker_sample{position:relative;background:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='2' height='2'%3E%3Cpath d='M1,0H0V1H2V2H1' fill='lightgrey'/%3E%3C/svg%3E\") left top/contain white;box-shadow:0 0 0 1px var(--kup-border-color)}.built-in-layout-4 .picker_alpha .picker_selector,.built-in-layout-4 .picker_sample .picker_selector{background:none}.built-in-layout-4 .picker_editor input{font-family:monospace;padding:0.2em 0.4em}.built-in-layout-4 .picker_sample::before{content:\"\";position:absolute;display:block;width:100%;height:100%;background:currentColor}.built-in-layout-4 .picker_done,.built-in-layout-4 .picker_arrow{display:none}.built-in-layout-4 .layout_default.picker_wrapper{bottom:unset;font-size:var(--kup-font-size);left:unset;padding:0.25em;right:unset;top:unset;width:100%}.built-in-layout-4 .layout_default .picker_editor input{background:none;color:var(--kup-text-color);font-family:var(--kup-font-family);font-size:var(--kup-font-size)}.built-in-layout-4 .picker_wrapper.popup{box-shadow:var(--kup-box-shadow);margin:0;outline:none}.built-in-layout-5{background:var(--kup-background-color);box-shadow:var(--kup-box-shadow);box-sizing:border-box;overflow:auto;padding:0.5em}.built-in-layout-5>table{width:100%}.built-in-layout-5>table>tr>td>div.value{text-align:right;color:var(--kup-primary-color);border-bottom:1px solid var(--kup-border-color);min-height:1.5em}.built-in-layout-5>table>tr>td>.f-button{display:flex;justify-content:center}.built-in-layout-5>table>tr>td>div.number{border-radius:50%;cursor:pointer;display:flex;justify-content:center;line-height:2.5em;margin:auto;width:2.5em;transition:background-color 0.25s;text-transform:capitalize}.built-in-layout-5>table>tr>td>div.number:hover{background-color:var(--kup-hover-background-color)}.built-in-layout-6{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto;padding:0.5em}.collapsible-layout-1{color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.collapsible-layout-1 .section-1{background-color:var(--color-0);display:flex;flex:0 0 10%;max-width:10%}.collapsible-layout-1 .section-2{box-sizing:border-box;height:100%;display:flex;flex:0 0 90%;flex-direction:column;max-width:90%}.collapsible-layout-1 .section-2 .sub-1{min-height:1.5em;display:flex;padding:0.6rem 0.8em 0;font-weight:bold;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.collapsible-layout-1 .section-2 .sub-1 div{font-size:1em}.collapsible-layout-1 .section-2 .sub-1 .left{text-align:left;width:80%}.collapsible-layout-1 .section-2 .sub-1 .right{text-align:right;width:20%}.collapsible-layout-1 .section-2 .sub-2{text-align:left;padding:0.6em 0.8em;font-size:0.875em}.collapsible-layout-2{color:var(--kup-text-color);box-shadow:rgba(0, 0, 0, 0.2) 0px 2px 1px -1px, rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 1px 3px 0px;border-radius:4px;display:flex;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.collapsible-layout-2 .section-1{box-sizing:border-box;height:100%;display:flex;flex-direction:column;max-width:100%;width:100%}.collapsible-layout-2 .section-1 .sub-1{text-align:left;padding:0.6em 0.8em 0;font-size:1em;font-weight:bold;max-width:75%}.collapsible-layout-2 .section-1 .sub-2{text-align:left;padding:0.6em 0.8em;max-width:75%}.collapsible-layout-2 .section-1 .sub-2 div{font-size:0.875em}.collapsible-layout-2 .section-1 .sub-3{color:var(--color-0);text-align:center;position:absolute;top:1em;right:1em;max-width:25%;text-overflow:ellipsis;overflow:hidden;max-height:calc(24px + 2.25em);padding:0 1em}.collapsible-layout-2 .section-1 .sub-3 kup-image{margin:auto}.collapsible-layout-2 .section-1 .sub-3 div{font-size:1.25em}.collapsible-card .collapsible-trigger{display:none;position:absolute;bottom:0;left:0;height:50px;width:100%}.collapsible-card .collapsible-trigger kup-button{margin:auto;width:48px}.collapsible-card .collapsible-wrapper{overflow:auto}.collapsible-card.collapsible-active{padding-bottom:50px}.collapsible-card.collapsible-active .collapsible-trigger{display:block}.dialog-layout-1{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);color:var(--kup-text-color);display:flex;flex-direction:column;height:100%;width:100%;overflow:auto}.dialog-layout-1 .section-1{display:grid;grid-gap:0.5em;grid-template-columns:repeat(2, auto);grid-template-rows:repeat(auto-fill, 1.25em);height:100%;padding:0.5em;overflow:auto;touch-action:none}.dialog-layout-1 .section-1 .text{min-width:max-content}.dialog-layout-1 .section-1 .text:not(.label){font-weight:bold}.dialog-layout-2{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;width:100%}.dialog-layout-2 .section-1{text-align:center;touch-action:none;padding-bottom:1em}.dialog-layout-2 .section-1 .text{padding-top:0.75em}.dialog-layout-2 .section-1 .text:not(.label){font-weight:bold}.dialog-layout-2 .section-2{border-top:1px solid var(--kup-border-color);display:grid;grid-gap:0.5em;grid-template-columns:repeat(2, auto);grid-template-rows:repeat(auto-fill, 1.25em);height:100%;padding:0.5em;overflow:auto;touch-action:none}.dialog-layout-2 .section-2 .text{min-width:max-content}.dialog-layout-2 .section-2 .text:not(.label){font-weight:bold}.dialog-layout-3{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;overflow:visible;flex-direction:column;height:100%;position:relative;width:100%}.dialog-layout-3 kup-button{margin-left:0}.dialog-layout-3 .section-1{background-color:var(--kup-background-color);display:flex;justify-content:flex-start;align-items:center;box-sizing:border-box;box-shadow:0px 1px 3px 0px var(--kup-text-color);height:52px;width:100%;text-align:right;touch-action:none}.dialog-layout-3 .section-1 kup-button{margin-right:0.25em}.dialog-layout-3 .section-2{height:100%;width:100%;overflow:auto;max-height:50vh}.dialog-layout-3 ::slotted(.text){color:var(--kup-text-color);font-family:var(--kup-font-family-monospace);white-space:nowrap;border-bottom:1px solid var(--kup-border-color);line-height:1.75em}.dialog-layout-4{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;width:100%}.dialog-layout-4 .section-1{display:flex;justify-content:space-evenly}.dialog-layout-4 .section-2{height:100%;overflow:auto;padding:0.25em;touch-action:none}.dialog-layout-5{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;width:100%}.dialog-layout-5 .section-1{display:flex;justify-content:space-evenly}.dialog-layout-5 .section-2{height:100%;overflow:auto}.dialog-layout-6{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;max-height:95vh;max-width:95vw;width:100%}.dialog-layout-6 .section-1{display:flex;height:100%;justify-content:space-evenly;overflow:auto}.dialog-layout-6 kup-data-table{width:100%}#drag-handle{-ms-touch-action:none;touch-action:none}#drag-handle:not(.header-bar){display:flex;height:100%}#drag-handle:not(.header-bar) .f-image{margin:auto}#drag-handle.header-bar{background-color:var(--kup-title-background-color);color:var(--kup-title-color);display:flex;flex-direction:row;height:2em;position:relative;width:100%}#drag-handle.header-bar .dialog-title{font-weight:bold;line-height:2em;padding-left:0.5em;padding-right:2em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#drag-handle.header-bar #dialog-close{cursor:pointer;margin-right:0;transition:opacity 0.25s;position:absolute;right:0;background:var(--kup-title-background-color)}#drag-handle.header-bar #dialog-close:hover{opacity:0.5}.free-layout-1{background:var(--kup-background-color);box-shadow:var(--kup-box-shadow);box-sizing:border-box;overflow:auto;padding:1em}.free-layout-2{background:var(--kup-background-color);box-shadow:var(--kup-box-shadow);box-sizing:border-box;overflow:auto}.scalable-layout-1 .descr{font-size:70%;width:100%}.scalable-layout-1 .value{font-size:220%}.scalable-layout-2 #image1 img{object-fit:contain}.scalable-layout-2 .scalable-element{display:grid;grid-template-columns:1fr 1fr 0.5fr 0.5fr}.scalable-layout-2 .icon{margin:auto;font-size:150%;margin-right:5%}.scalable-layout-2 .value-int{font-size:250%}.scalable-layout-2 .value-dec,.scalable-layout-2 .unit{font-size:130%;margin-top:auto;margin-bottom:10%}.scalable-layout-2 .value-dec{margin-left:2%}.scalable-layout-2 .unit{margin-left:4%}.scalable-layout-3 .descr{font-size:70%;width:100%}.scalable-layout-3 .value{font-size:220%}.scalable-layout-4 #image1 img{object-fit:contain}.scalable-layout-4 .scalable-element{display:grid;grid-template-columns:1fr 5fr}.scalable-layout-4 .icon{font-size:150%;margin:auto 5% auto auto}.scalable-layout-4 .value-and-unit{display:flex;color:var(--color-0)}.scalable-layout-4 .value-and-unit .value-int{font-size:250%}.scalable-layout-4 .value-and-unit .value-dec,.scalable-layout-4 .value-and-unit .unit{font-size:130%;margin-top:auto;margin-bottom:10%}.scalable-layout-4 .value-and-unit .value-dec{margin-left:2%}.scalable-layout-4 .value-and-unit .unit{margin-left:4%}.scalable-layout-4 .descr{margin-left:4%;text-align:left;font-size:80%;width:100%;min-width:max-content}.scalable-layout-5 #image1 img{object-fit:contain}.scalable-layout-5 .scalable-element{display:flex}.scalable-layout-5 .text-wrapper{margin-right:10px}.scalable-layout-5 .icon{font-size:150%;margin:auto;margin-bottom:0.35em}.scalable-layout-5 .value{font-size:200%}.scalable-layout-5 .descr{text-align:right;font-size:65%;width:100%;min-width:max-content;position:relative;bottom:-10%}.scalable-layout-6 #image1 img{object-fit:contain}.scalable-layout-6 .scalable-element{display:flex;justify-content:space-between}.scalable-layout-6 .text-wrapper{margin-left:1em}.scalable-layout-6 .icon{font-size:150%;margin:auto}.scalable-layout-6 .value{font-size:220%;text-align:right}.scalable-layout-6 .descr{font-size:80%;text-align:right;width:100%;min-width:max-content}.scalable-layout-7 #image1 img{object-fit:contain}.scalable-layout-7 .scalable-element{display:flex}.scalable-layout-7 .text-wrapper{margin-right:0.5em}.scalable-layout-7 .icon{font-size:150%;margin:auto;margin-top:0.35em}.scalable-layout-7 .value{font-size:200%}.scalable-layout-7 .descr{text-align:right;font-size:65%;width:100%;min-width:max-content;position:relative;bottom:10%}.scalable-layout-8 #image1 img{object-fit:contain}.scalable-layout-8 .scalable-element{align-items:center;display:grid;grid-template-columns:0.25fr 1.25fr 0.25fr}.scalable-layout-8 .icon{margin-right:4%;font-size:75%}.scalable-layout-8 .value{margin:0 10%;font-size:250%}.scalable-layout-8 .descr{font-size:60%;text-align:left}.scalable-layout-9{background-color:var(--color-1);color:var(--color-2);height:100%;display:flex;justify-content:unset;overflow:auto;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);border-radius:4px}.scalable-layout-9 .section-1{background-color:var(--color-0);width:20%;height:100%}.scalable-layout-9 .section-2{width:100%;height:100%;display:flex;flex-direction:column}.scalable-layout-9 .text{display:flex;justify-content:center;flex-direction:column}.scalable-layout-9 .descr{font-size:80%}.scalable-layout-9 .value{font-size:220%}.scalable-layout-9 .buttons{height:max-content;margin-bottom:2%}.scalable-layout-9 .f-button{float:right}.scalable-card{align-items:center;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);border-radius:4px;display:flex;font-size:calc(var(--kup-font-size) * var(--kup_card_multiplier));height:100%;justify-content:center;position:relative;text-align:center;word-break:normal;width:100%}.standard-layout-1{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-1 kup-button{margin-right:0}.standard-layout-1 #image1 img{object-fit:cover}.standard-layout-1.has-actions{padding-bottom:52px}.standard-layout-1.has-actions .section-2 .sub-2.description{padding-bottom:0}.standard-layout-1 .section-1{height:60%;width:100%}.standard-layout-1 .section-2{height:40%;width:100%;overflow:auto}.standard-layout-1 .section-2 .sub-2.title{color:var(--kup-text-color);padding:0 1em;padding-top:1em;text-align:left}.standard-layout-1 .section-2 .sub-2.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-1 .section-2 .sub-2.subtitle{opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-1 .section-2 .sub-2.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-1 .section-2 .sub-2.description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-1 .section-2 .sub-2.description div{font-size:0.875em;font-weight:400;letter-spacing:0.0178571429em;line-height:1.25em}.standard-layout-1 .section-3{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-1 .section-3 kup-button{margin-left:0.25em}.standard-layout-2{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-2 kup-button{margin-right:0}.standard-layout-2 #image1 img{object-fit:cover}.standard-layout-2.has-actions{padding-bottom:52px}.standard-layout-2.has-actions .section-3 .sub-3.description{padding-bottom:0}.standard-layout-2 .section-1{width:100%}.standard-layout-2 .section-1 .sub-1.title{color:var(--kup-text-color);padding:0 1em;padding-top:1em;text-align:left}.standard-layout-2 .section-1 .sub-1.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-2 .section-1 .sub-1.subtitle{opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-2 .section-1 .sub-1.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-2 .section-2{height:75%;width:100%}.standard-layout-2 .section-3{width:100%;overflow:auto}.standard-layout-2 .section-3 .sub-3.description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;opacity:0.6;padding:0 1em 8px;padding-top:1em;text-align:left}.standard-layout-2 .section-3 .sub-3.description div{font-size:0.875em;font-weight:400;letter-spacing:0.0178571429em;line-height:1.25em}.standard-layout-2 .section-4{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-2 .section-4 kup-button{margin-left:0.25em}.standard-layout-3{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-3 kup-button{margin-right:0}.standard-layout-3 #image1 img{object-fit:cover}.standard-layout-3.has-actions{padding-bottom:52px}.standard-layout-3.has-actions .section-2 .sub-2.description{padding-bottom:0}.standard-layout-3 .section-1{height:75%;width:100%}.standard-layout-3 .section-1 .media{position:relative;height:100%;width:100%}.standard-layout-3 .section-1 .text-on-media{position:absolute;bottom:0;left:0}.standard-layout-3 .section-1 .sub-1.title{color:white;padding:0 1em;padding-top:1em;text-align:left}.standard-layout-3 .section-1 .sub-1.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-3 .section-1 .sub-1.subtitle{color:white;opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-3 .section-1 .sub-1.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-3 .section-2{width:100%;overflow:auto}.standard-layout-3 .section-2 .sub-2.description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;opacity:0.6;padding:0 1em 8px;padding-top:1em;text-align:left}.standard-layout-3 .section-2 .sub-2.description div{font-size:0.875em;font-weight:400;letter-spacing:0.0178571429em;line-height:1.25em}.standard-layout-3 .section-3{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-3 .section-3 kup-button{margin-left:0.25em}.standard-layout-4{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-4 kup-button{margin-right:0}.standard-layout-4 #image1 img{object-fit:cover}.standard-layout-4.has-actions{padding-bottom:52px}.standard-layout-4.has-actions .section-3 .sub-3.description{padding-bottom:0}.standard-layout-4 .section-1{display:flex;height:100%;width:100%}.standard-layout-4 .section-1 .sub-1.image{width:33%}.standard-layout-4 .section-1 .sub-1.text{width:77%}.standard-layout-4 .section-1 .sub-1.title{color:var(--kup-text-color);padding:0 1em;padding-top:1em;text-align:left}.standard-layout-4 .section-1 .sub-1.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-4 .section-1 .sub-1.subtitle{opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-4 .section-1 .sub-1.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-4 .section-2{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-4 .section-2 kup-button{margin-left:0.25em}.standard-layout-5{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);height:100%;overflow:hidden;width:100%}.standard-layout-5 .section-1{background-color:var(--color-0);height:3%}.standard-layout-5 .section-2{display:flex;height:53%}.standard-layout-5 .section-3{display:flex;height:24%}.standard-layout-5 .section-4{display:flex;height:20%;background-color:var(--color-1)}.standard-layout-5 .sub-2{box-sizing:border-box;display:flex;flex-direction:column;flex-wrap:wrap;justify-content:center}.standard-layout-5 .sub-2.icon{min-height:20px;flex:0 0 10%;max-width:10%}.standard-layout-5 .sub-2.icon #image1{box-sizing:border-box;margin:auto;padding:0 20%}.standard-layout-5 .sub-2.icon #image1 img{object-fit:contain}.standard-layout-5 .sub-2.text{flex:0 0 70%;max-width:70%;margin:auto;height:100%;flex-wrap:nowrap;padding:1em;text-align:left}.standard-layout-5 .sub-2.image{box-sizing:border-box;flex:0 0 20%;padding:1.5vh 0;max-width:20%}.standard-layout-5 .sub-2.image #image2{box-sizing:border-box;margin:auto;padding:0 10%}.standard-layout-5 .sub-2.image #image2 img{object-fit:contain}.standard-layout-5 .sub-2 .desc-text{overflow:auto}.standard-layout-5 .sub-2 .alt-text{color:var(--kup-primary-color)}.standard-layout-5 .sub-3{box-sizing:border-box}.standard-layout-5 .sub-3.progress-bar{margin:auto;padding:0 5%;vertical-align:2px;width:80%}.standard-layout-5 .sub-3.button{margin:auto;text-align:center;width:20%}.standard-layout-5 .sub-3 kup-button{margin:auto}.standard-layout-5 .sub-4{box-sizing:border-box;margin:auto}.standard-layout-5 .sub-4.text{width:50%;font-size:0.875em}.standard-layout-5 .sub-4 div{padding:0 5%}.standard-layout-5 .sub-4 .alt-text{color:var(--color-0);font-size:1em}.standard-layout-5 .alt-text{font-weight:bold}@media screen and (max-width: 767px){.standard-layout-5 .sub-2.image{display:none}.standard-layout-5 .sub-2.icon{flex-basis:30%;max-width:30%}}.standard-layout-6{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;height:100%;overflow:hidden;width:100%}.standard-layout-6 .section-1{background-color:var(--color-0);display:flex;flex:0 0 10%;max-width:10%}.standard-layout-6 .section-1 .alt-text{color:var(--kup_card_dynamic_color_0);height:100%;text-align:center;writing-mode:vertical-lr;margin:auto;font-size:1.25em}.standard-layout-6 .section-2{box-sizing:border-box;height:100%;display:flex;flex:0 0 90%;flex-direction:column;max-width:90%}.standard-layout-6 .section-2 .sub-2{margin:auto;text-align:center}.standard-layout-6 .section-2 .sub-2 kup-progress-bar{margin-bottom:1em}.standard-layout-6 kup-button{position:absolute;bottom:2%;right:2%}.standard-layout-7{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:column;height:100%;overflow:hidden;width:100%}.standard-layout-7 #image1 img{margin:auto;object-fit:contain}.standard-layout-7 .section-1{background-color:var(--color-0);height:5%;width:100%}.standard-layout-7 .section-2{height:80%;width:100%;text-align:center;padding:25px 25%;box-sizing:border-box}.standard-layout-7 .section-2 .sub-2{margin:auto}.standard-layout-7 .section-2 .sub-2.image{box-sizing:border-box;height:65%}.standard-layout-7 .section-2 .sub-2.text{font-size:1.4em;letter-spacing:1.2px;padding-top:1em;height:35%}.standard-layout-7 .section-3{display:flex;height:15%;width:100%}.standard-layout-7 .section-3 .alt-text{margin:auto;opacity:0.75;width:50%}.standard-layout-7 .section-3 .alt-text:nth-child(1){margin-left:1em;text-align:left}.standard-layout-7 .section-3 .alt-text:nth-child(2){margin-right:1em;text-align:right}.standard-layout-8{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:column;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-8 .background{background-color:var(--color-0);content:\"\";height:100%;width:100%;opacity:0.1;pointer-events:none;position:absolute;top:0;left:0;z-index:1}.standard-layout-8 .section-1{box-sizing:border-box;display:flex;flex-direction:column;max-width:100%;overflow:auto;height:auto}.standard-layout-8 .section-1 .sub-1{text-align:left;padding:0.6em 0.8em 0;font-size:1em;font-weight:bold;max-width:75%}.standard-layout-8 .section-1 .sub-2{text-align:left;padding:0.6em 0.8em;font-size:0.875em;max-width:75%}.standard-layout-8 .section-1 .sub-3{color:var(--color-0);font-weight:bold;text-align:center;font-size:1.2em;position:absolute;top:1em;right:1em;max-width:25%;text-overflow:ellipsis;max-height:calc(24px + 2.25em);padding:0 1em;overflow:hidden}.standard-layout-8 .section-1 .sub-3 kup-image{margin:auto}.standard-layout-8 .section-2{display:flex;height:auto;overflow:auto}.standard-layout-9{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:row;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-9 #image1 img{object-fit:contain}.standard-layout-9 .section-1{margin-top:auto;margin-right:18px;margin-bottom:auto;white-space:nowrap}.standard-layout-9 .section-2{display:flex;height:100%;margin-top:auto;margin-bottom:auto;width:100%;overflow:hidden}.standard-layout-9 .sub-2{display:flex;flex-direction:row}.standard-layout-9 .text{text-align:left}.standard-layout-9 .text-wrapper{display:flex;flex-direction:column}.standard-layout-9 .icon{margin:auto;padding:0 1.25em}.standard-layout-9 .description{font-size:1.5em;letter-spacing:1px;padding-left:1.25em;padding-top:0.25em}.standard-layout-9 .title{font-size:2.75em;font-weight:bold}.standard-layout-9 .subtitle{font-size:1.5em;opacity:0.75}.standard-layout-10{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:row;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-10 #image1 img{object-fit:contain}.standard-layout-10 .section-1{display:flex;height:100%;margin-top:auto;margin-bottom:auto;width:100%;overflow:hidden}.standard-layout-10 .section-2{margin-top:auto;margin-left:18px;margin-bottom:auto;white-space:nowrap}.standard-layout-10 .sub-2{display:flex;flex-direction:row-reverse}.standard-layout-10 .text{text-align:right}.standard-layout-10 .text-wrapper{display:flex;flex-direction:column}.standard-layout-10 .icon{margin:auto;padding:0 1.25em}.standard-layout-10 .description{font-size:1.5em;letter-spacing:1px;padding-right:1.25em;padding-top:0.25em}.standard-layout-10 .title{font-size:2.75em;font-weight:bold}.standard-layout-10 .subtitle{font-size:1.5em;opacity:0.75}.standard-layout-11{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:row;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-11 #image1 img{object-fit:contain}.standard-layout-11 .section-1{display:flex;height:100%;margin-top:auto;margin-bottom:auto;min-width:6em;max-width:6em;overflow:hidden;transition:0.25s ease-in}.standard-layout-11 .section-2{display:flex;height:100%;margin-top:auto;margin-bottom:auto;width:100%;overflow:hidden}.standard-layout-11 .sub-1{background-color:var(--color-0);height:100%;text-align:center;writing-mode:vertical-lr;min-width:6em;display:flex;transition:width 0.25s ease-in}.standard-layout-11 .sub-1 div{font-size:1.25em}.standard-layout-11 .sub-2{display:flex;flex-direction:row}.standard-layout-11 .text:not(.description){text-align:left}.standard-layout-11 .text-wrapper{display:flex;flex-direction:column}.standard-layout-11 .icon{margin:auto;padding:0 1.25em}.standard-layout-11 .description{font-size:1.5em;letter-spacing:1px;margin:auto;color:var(--kup_card_dynamic_color_0)}.standard-layout-11 .title{font-size:2.75em;font-weight:bold;margin-top:auto}.standard-layout-11 .subtitle{font-size:1.5em;opacity:0.75;margin-bottom:auto}.standard-layout-12{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);color:var(--kup-text-color);min-width:200px;min-width:-moz-max-content;min-width:-webkit-max-content;}.standard-layout-12 .section-1{display:inline-flex;border-bottom:1px solid var(--kup-border-color);width:100%}.standard-layout-12 .section-1 kup-button{margin:0}.standard-layout-12 .section-2{display:flex;flex-direction:column}.standard-layout-12 .section-2.has-content{border-bottom:1px solid var(--kup-border-color);padding:0.5em 0.5em}.standard-layout-12 .section-2 kup-date-picker:first-of-type,.standard-layout-12 .section-2 kup-time-picker:first-of-type{margin-bottom:0.5em}.standard-layout-12 .section-3{backface-visibility:hidden;display:flex;flex-direction:column;max-height:20vh;overflow:auto}.standard-layout-12 .section-3 kup-checkbox{margin-left:0;margin-right:auto}.standard-layout-13{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;position:relative;width:100%}.standard-layout-13 kup-button{margin-left:0}.standard-layout-13 .section-1{background-color:var(--kup-background-color);display:flex;justify-content:flex-start;align-items:center;box-sizing:border-box;box-shadow:0px 1px 3px 0px var(--kup-text-color);height:52px;width:100%;text-align:right}.standard-layout-13 .section-1 kup-button{margin-right:0.25em}.standard-layout-13 .section-2{height:100%;width:100%;overflow:auto;max-height:50vh}.standard-layout-13 .text{color:var(--kup-text-color);font-family:var(--kup-font-family-monospace);white-space:nowrap;border-bottom:1px solid var(--kup-border-color);line-height:1.75em}.standard-layout-14{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);color:var(--kup-text-color);min-width:200px;min-width:-moz-max-content;min-width:-webkit-max-content;}.standard-layout-14 .section-1{--kup-button-font-size:0.75em;box-sizing:border-box;display:flex;padding:1em}.standard-layout-14 .section-1 .sub-1{width:100%}.standard-layout-14 .section-1 .sub-spinner{height:88px;width:88px;margin:0 10px}.standard-layout-14 .section-1 .f-image{margin:0 0.5em 0 0}.standard-layout-14 .section-1 .title{align-items:flex-end;display:flex;font-size:1.25em;font-weight:600;margin-bottom:0.5em;padding:0 0.25em 0.25em;text-align:left}.standard-layout-14 .section-1 .title .label{cursor:pointer;padding-right:0.25em;padding-top:0.5em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.standard-layout-14 .section-1 .title .label:hover{text-decoration:underline}.standard-layout-14 .section-1 .info{display:flex;padding:0 0.25em 0.25em;width:100%}.standard-layout-14 .section-1 .info .label{color:rgba(var(--kup-text-color-rgb), 0.75);margin-right:0.75em;min-width:max-content;width:auto}.standard-layout-14 .section-1 .info .value{font-weight:600;width:100%}.standard-layout-14 .sub-button{display:inline-flex;width:100%}.standard-layout-14 .sub-button kup-button{margin:0}.standard-layout-14 .sub-checkbox{backface-visibility:hidden;display:flex;flex-direction:column;max-height:20vh;overflow:auto}.standard-layout-14 .sub-checkbox kup-checkbox{margin-left:0;margin-right:auto}.standard-layout-14 .sub-formula{padding:0.5em}.standard-layout-14 .sub-chip{max-width:25vw;overflow:auto;box-shadow:0 3px 2px -2px var(--kup-border-color)}.standard-layout-14 .sub-field{display:flex;flex-direction:column}.standard-layout-14 .sub-field.has-content{border-bottom:1px solid var(--kup-border-color);padding:0.5em 0.5em}.standard-layout-14 .sub-field kup-date-picker:first-of-type,.standard-layout-14 .sub-field kup-time-picker:first-of-type{margin-bottom:0.5em}.standard-layout-14 .sub-spinner{height:100px}.standard-layout-14 .sub-autocomplete{padding-top:1em}.standard-layout-14 .sub-autocomplete kup-autocomplete{margin:auto;padding:0.5em 0;width:max-content}.standard-layout-14 .sub-switch{display:flex;justify-content:space-evenly;padding:2em}.standard-layout-14 .sub-tree{max-height:25vh;overflow:auto}.standard-layout-14 #apply{display:none;margin:auto}.standard-layout-14 #apply.visible{display:block}.standard-layout-14 #open-in-new,.standard-layout-14 #search,.standard-layout-14 #new{margin:0 0 0.5em 0}.standard-layout-15{background:var(--kup-background-color);border-radius:3px;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);color:var(--kup-text-color);display:block;font-size:var(--kup-font-size);outline:none}.standard-layout-15 .section-1{--kup-button-font-size:0.75em;box-sizing:border-box;display:flex;padding:1em}.standard-layout-15 .section-1 .sub-1{width:100%}.standard-layout-15 .section-1 .sub-spinner{height:88px;width:88px;margin:0 10px}.standard-layout-15 .section-1 .f-image{margin:0 0.5em 0 0}.standard-layout-15 .section-1 .title{align-items:flex-end;display:flex;font-size:1.25em;font-weight:600;margin-bottom:0.5em;padding:0 0.25em 0.25em;text-align:left}.standard-layout-15 .section-1 .title .label{cursor:pointer;padding-right:0.25em;padding-top:0.5em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.standard-layout-15 .section-1 .title .label:hover{text-decoration:underline}.standard-layout-15 .section-1 .info{display:flex;padding:0 0.25em 0.25em;width:100%}.standard-layout-15 .section-1 .info .label{color:rgba(var(--kup-text-color-rgb), 0.75);margin-right:0.75em;min-width:max-content;width:auto}.standard-layout-15 .section-1 .info .value{font-weight:600;width:100%}.standard-layout-15 .section-2{border-top:1px solid var(--kup-border-color);box-sizing:border-box;height:180px;opacity:1;overflow:auto;transition:height 250ms ease-out, opacity 250ms ease-out}.standard-layout-15 .section-2 .info{box-sizing:border-box;height:100%;overflow:auto;padding:1.25em}.standard-layout-15 .section-2 .detail-row{align-items:center;display:flex;justify-content:space-between}.standard-layout-15 .section-2 .detail-row:not(:last-child){margin-bottom:6px}.standard-layout-15 .section-2 .detail-row__label{color:rgba(var(--kup-text-color-rgb), 0.5);margin-top:0.175em;max-width:320px;padding-right:1.25em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.standard-layout-15 .section-2 .detail-row__value{color:var(--kup-text-color);font-size:105%;font-weight:600;max-width:320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.standard-layout-15 .section-2 kup-tree{text-align:left}.standard-layout-15 .section-3{border-top:1px solid var(--kup-border-color);display:flex;justify-content:flex-end;padding:6px;padding-top:2px;padding-bottom:2px}.standard-layout-15 .section-3 kup-button{margin:auto 0}.standard-layout-15 #open-in-new,.standard-layout-15 #search,.standard-layout-15 #new{margin:0 0 0.5em 0}:host{--kup_card_backdrop:var(--kup-card-backdrop, rgba(0, 0, 0, 0.32));--kup_card_ripple_color:var(\n    --kup-card-ripple-color,\n    var(--kup-primary-color)\n  );display:block;font-size:var(--kup-font-size);height:var(--kup_card_height);min-height:var(--kup_card_height);min-width:var(--kup_card_width);outline:none;position:relative;width:var(--kup_card_width)}:host([is-menu]){display:none;animation:fade-in 0.25s ease-out}:host([menu-visible]){box-shadow:var(--kup-box-shadow);display:block}#kup-component{height:100%;width:100%}.mdc-ripple-surface{cursor:pointer;flex-direction:column;display:flex;height:100%;position:relative}.mdc-ripple-surface:before,.mdc-ripple-surface:after{background-color:var(--kup_card_ripple_color)}.card-view{animation:fade-in 0.25s ease-out;display:none;height:100%;width:100%}.card-view.visible{display:block}";
 
 const KupCard = class {
   constructor(hostRef) {
@@ -5284,7 +5269,6 @@ const KupCard = class {
     this.layoutFamily = KupCardFamily.STANDARD;
     this.layoutNumber = 1;
     this.menuVisible = false;
-    this.showModal = false;
     this.sizeX = '100%';
     this.sizeY = '100%';
   }
@@ -5651,13 +5635,6 @@ const KupCard = class {
       }, 0);
     }
     this.kupManager.debug.logRender(this, true);
-    if (this.showModal) {
-      this.rootElement.style.setProperty('--kup_card_left', window.innerWidth / 2 - this.rootElement.clientWidth / 2 + 'px');
-      this.rootElement.style.setProperty('--kup_card_top', window.innerHeight / 2 -
-        this.rootElement.clientHeight / 2 +
-        'px');
-      this.rootElement.style.setProperty('--kup_card_display', 'block');
-    }
   }
   render() {
     if (!this.data && this.rootElement.children.length < 1) {
@@ -5667,17 +5644,7 @@ const KupCard = class {
       '--kup_card_height': this.sizeY ? this.sizeY : '100%',
       '--kup_card_width': this.sizeX ? this.sizeX : '100%',
     };
-    const backdropComp = this.showModal ? (h("div", { class: "backdrop", onClick: (e) => {
-        e.preventDefault();
-        e.stopPropagation();
-      }, onPointerDown: (e) => {
-        e.preventDefault();
-        e.stopPropagation();
-      }, onTouchStart: (e) => {
-        e.preventDefault();
-        e.stopPropagation();
-      } })) : null;
-    return (h(Host, { style: style }, h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), backdropComp, h("div", { id: componentWrapperId, onClick: () => this.onKupClick(null, null), ref: (el) => (this.componentWrapper = el) }, this.getLayout())));
+    return (h(Host, { style: style }, h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId, onClick: () => this.onKupClick(null, null), ref: (el) => (this.componentWrapper = el) }, this.getLayout())));
   }
   disconnectedCallback() {
     this.kupManager.interact.unregister([this.rootElement]);
@@ -6471,18 +6438,30 @@ 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.";
+  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["type"] = "The type of chip. Available types: input, filter, choice or empty for default.";
 })(KupChipProps || (KupChipProps = {}));
 
 const kupChipCss = ":host{display:block}";
 
+var __classPrivateFieldGet$4 = (undefined && undefined.__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 _KupChip_instances, _KupChip_changeHandler, _KupChip_stringifiedValues;
 const KupChip = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.kupBlur = createEvent(this, "kup-chip-blur", 6);
+    this.kupChange = createEvent(this, "kup-chip-change", 6);
     this.kupClick = createEvent(this, "kup-chip-click", 6);
     this.kupFocus = createEvent(this, "kup-chip-focus", 6);
     this.kupIconClick = createEvent(this, "kup-chip-iconclick", 6);
+    _KupChip_instances.add(this);
     /*-------------------------------------------------*/
     /*       I n t e r n a l   V a r i a b l e s       */
     /*-------------------------------------------------*/
@@ -6492,6 +6471,8 @@ const KupChip = class {
     this.kupManager = kupManagerInstance();
     this.customStyle = '';
     this.data = [];
+    this.displayId = false;
+    this.enableInput = false;
     this.type = FChipType.STANDARD;
   }
   onKupBlur(chip) {
@@ -6530,6 +6511,11 @@ const KupChip = class {
       id: this.rootElement.id,
       chip: this.kupManager.data.node.remove(this.data, chip),
     });
+    this.kupChange.emit({
+      comp: this,
+      id: this.rootElement.id,
+      stringifiedValues: __classPrivateFieldGet$4(this, _KupChip_instances, "m", _KupChip_stringifiedValues).call(this),
+    });
     this.refresh();
   }
   /*-------------------------------------------------*/
@@ -6605,11 +6591,13 @@ const KupChip = class {
     this.kupManager.debug.logRender(this, true);
   }
   render() {
+    var _a;
     const props = {
       danger: this.rootElement.classList.contains('kup-danger')
         ? true
         : false,
       data: this.data,
+      displayId: this.displayId,
       info: this.rootElement.classList.contains('kup-info')
         ? true
         : false,
@@ -6642,10 +6630,13 @@ const KupChip = class {
       props.onFocus.push((chip) => this.onKupFocus(chip));
       props.onIconClick.push((chip) => this.onKupIconClick(chip));
     }
-    if (!this.data || this.data.length === 0) {
-      return;
-    }
-    return (h(Host, null, h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId }, h(FChip, Object.assign({}, props)))));
+    return (h(Host, { "onKup-autocomplete-change": (e) => {
+        __classPrivateFieldGet$4(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
+      }, "onKup-combobox-change": (e) => {
+        __classPrivateFieldGet$4(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
+      }, "onKup-textfield-change": (e) => {
+        __classPrivateFieldGet$4(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
+      } }, h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId }, ((_a = this.data) === null || _a === void 0 ? void 0 : _a.length) > 0 ? h(FChip, Object.assign({}, props)) : null, h("slot", { name: "field" }))));
   }
   disconnectedCallback() {
     this.kupManager.theme.unregister(this);
@@ -6655,6 +6646,41 @@ const KupChip = class {
     "data": ["checkDataset"]
   }; }
 };
+_KupChip_instances = new WeakSet(), _KupChip_changeHandler =
+  /*-------------------------------------------------*/
+  /*           P r i v a t e   M e t h o d s         */
+  /*-------------------------------------------------*/
+  async function _KupChip_changeHandler(e) {
+    var _a, _b;
+    e.stopPropagation();
+    const value = (_a = e.detail) === null || _a === void 0 ? void 0 : _a.value;
+    const listNode = e.detail.node;
+    if (value) {
+      const node = (_b = this.data) === null || _b === void 0 ? void 0 : _b.find((node) => node.id === value);
+      if (!node) {
+        this.data = [
+          ...this.data,
+          {
+            id: listNode ? listNode.id : value,
+            value: listNode ? listNode.value : value,
+          },
+        ];
+        const slot = this.rootElement.querySelector('[slot=field]');
+        await slot.setValue('');
+        await slot.refresh();
+        await slot.setFocus();
+        this.kupChange.emit({
+          comp: this,
+          id: this.rootElement.id,
+          stringifiedValues: __classPrivateFieldGet$4(this, _KupChip_instances, "m", _KupChip_stringifiedValues).call(this),
+        });
+      }
+    }
+  }, _KupChip_stringifiedValues = function _KupChip_stringifiedValues() {
+  let stringifiedValues = '';
+  this.data.forEach((node) => (stringifiedValues += node.id + ';'));
+  return stringifiedValues;
+};
 KupChip.style = kupChipCss;
 
 /**
@@ -6935,14 +6961,14 @@ var KupComboboxProps;
 
 const kupComboboxCss = ":host{display:block;font-size:var(--kup-font-size);width:max-content}:host([is-select]) #kup-component{transition:background-color 0.2s}:host([is-select]) #kup-component:hover{background-color:rgba(var(--kup-text-color-rgb), 0.1)}:host([is-select]) .mdc-text-field:not(.mdc-text-field--disabled) input{cursor:pointer}.kup-icon{transition:transform 0.15s}.toggled .kup-icon.kup-dropdown-icon{transform:rotate(-180deg)}.kup-icon.kup-dropdown-icon{-webkit-mask:var(--kup-dropdown-icon);mask:var(--kup-dropdown-icon)}.f-text-field{position:relative}:host(.kup-full-height){height:100%}:host(.kup-full-height) #kup-component,:host(.kup-full-height) .f-text-field,:host(.kup-full-height) .mdc-text-field{height:100%}:host(.kup-full-width){width:100%}:host(.kup-full-width) #kup-component{width:100%}:host(.kup-danger){--kup-textfield-primary-color:var(--kup-danger-color);--kup-textfield-primary-color-rgb:var(--kup-danger-color-rgb)}:host(.kup-info){--kup-textfield-primary-color:var(--kup-info-color);--kup-textfield-primary-color-rgb:var(--kup-info-color-rgb)}:host(.kup-secondary){--kup-textfield-primary-color:var(--kup-secondary-color);--kup-textfield-primary-color-rgb:var(--kup-secondary-color-rgb)}:host(.kup-success){--kup-textfield-primary-color:var(--kup-success-color);--kup-textfield-primary-color-rgb:var(--kup-success-color-rgb)}:host(.kup-warning){--kup-textfield-primary-color:var(--kup-warning-color);--kup-textfield-primary-color-rgb:var(--kup-warning-color-rgb)}";
 
-var __classPrivateFieldGet$2 = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+var __classPrivateFieldGet$3 = (undefined && undefined.__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 __classPrivateFieldSet$2 = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+var __classPrivateFieldSet$3 = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
   if (kind === "m")
     throw new TypeError("Private method is not writable");
   if (kind === "a" && !f)
@@ -6991,32 +7017,33 @@ const KupCombobox = class {
       comp: this,
       id: this.rootElement.id,
       value: this.value,
-      inputValue: __classPrivateFieldGet$2(this, _KupCombobox_textfieldEl, "f").value,
+      inputValue: __classPrivateFieldGet$3(this, _KupCombobox_textfieldEl, "f").value,
     });
   }
   onKupChange(value) {
-    __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, value, true);
+    let ret = __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, value, true);
     this.kupChange.emit({
       comp: this,
       id: this.rootElement.id,
       value: this.value,
-      inputValue: __classPrivateFieldGet$2(this, _KupCombobox_textfieldEl, "f").value,
+      inputValue: __classPrivateFieldGet$3(this, _KupCombobox_textfieldEl, "f").value,
+      node: ret.node,
     });
   }
   onKupClick() {
     if (this.isSelect == true) {
-      if (__classPrivateFieldGet$2(this, _KupCombobox_textfieldWrapper, "f").classList.contains('toggled')) {
-        __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
+      if (__classPrivateFieldGet$3(this, _KupCombobox_textfieldWrapper, "f").classList.contains('toggled')) {
+        __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
       }
       else {
-        __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_openList).call(this);
+        __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_openList).call(this);
       }
     }
     this.kupClick.emit({
       comp: this,
       id: this.rootElement.id,
       value: this.value,
-      inputValue: __classPrivateFieldGet$2(this, _KupCombobox_textfieldEl, "f").value,
+      inputValue: __classPrivateFieldGet$3(this, _KupCombobox_textfieldEl, "f").value,
     });
   }
   onKupFocus() {
@@ -7024,46 +7051,47 @@ const KupCombobox = class {
       comp: this,
       id: this.rootElement.id,
       value: this.value,
-      inputValue: __classPrivateFieldGet$2(this, _KupCombobox_textfieldEl, "f").value,
+      inputValue: __classPrivateFieldGet$3(this, _KupCombobox_textfieldEl, "f").value,
     });
   }
   onKupInput() {
-    __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, __classPrivateFieldGet$2(this, _KupCombobox_textfieldEl, "f").value, false);
-    __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_openList).call(this);
+    let ret = __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, __classPrivateFieldGet$3(this, _KupCombobox_textfieldEl, "f").value, false);
+    __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_openList).call(this);
     this.kupInput.emit({
       comp: this,
       id: this.rootElement.id,
       value: this.value,
-      inputValue: __classPrivateFieldGet$2(this, _KupCombobox_textfieldEl, "f").value,
+      inputValue: __classPrivateFieldGet$3(this, _KupCombobox_textfieldEl, "f").value,
+      node: ret.node,
     });
   }
   onKupIconClick() {
-    if (__classPrivateFieldGet$2(this, _KupCombobox_textfieldWrapper, "f").classList.contains('toggled')) {
-      __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
+    if (__classPrivateFieldGet$3(this, _KupCombobox_textfieldWrapper, "f").classList.contains('toggled')) {
+      __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
     }
     else {
-      __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_openList).call(this);
+      __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_openList).call(this);
     }
     this.kupIconClick.emit({
       comp: this,
       id: this.rootElement.id,
       value: this.value,
-      inputValue: __classPrivateFieldGet$2(this, _KupCombobox_textfieldEl, "f").value,
-      open: __classPrivateFieldGet$2(this, _KupCombobox_textfieldWrapper, "f").classList.contains('toggled'),
+      inputValue: __classPrivateFieldGet$3(this, _KupCombobox_textfieldEl, "f").value,
+      open: __classPrivateFieldGet$3(this, _KupCombobox_textfieldWrapper, "f").classList.contains('toggled'),
     });
   }
   onKupItemClick(e) {
     this.onKupChange(e.detail.selected.id);
-    __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
-    if (__classPrivateFieldGet$2(this, _KupCombobox_textfieldEl, "f")) {
-      __classPrivateFieldGet$2(this, _KupCombobox_textfieldEl, "f").focus();
+    __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
+    if (__classPrivateFieldGet$3(this, _KupCombobox_textfieldEl, "f")) {
+      __classPrivateFieldGet$3(this, _KupCombobox_textfieldEl, "f").focus();
     }
     this.kupItemClick.emit({
       comp: this,
       id: this.rootElement.id,
       node: e.detail.selected,
       value: this.value,
-      inputValue: __classPrivateFieldGet$2(this, _KupCombobox_textfieldEl, "f").value,
+      inputValue: __classPrivateFieldGet$3(this, _KupCombobox_textfieldEl, "f").value,
     });
   }
   /*-------------------------------------------------*/
@@ -7076,30 +7104,30 @@ const KupCombobox = class {
   /*                L i s t e n e r s                */
   /*-------------------------------------------------*/
   listenKeydown(e) {
-    if (__classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_isListOpened).call(this)) {
+    if (__classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_isListOpened).call(this)) {
       switch (e.key) {
         case 'ArrowDown':
           e.preventDefault();
           e.stopPropagation();
-          __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f").focusNext();
+          __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f").focusNext();
           break;
         case 'ArrowUp':
           e.preventDefault();
           e.stopPropagation();
-          __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f").focusPrevious();
+          __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f").focusPrevious();
           break;
         case 'Enter':
           e.preventDefault();
           e.stopPropagation();
-          __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f").select().then(() => {
-            __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
-            __classPrivateFieldGet$2(this, _KupCombobox_textfieldEl, "f").focus();
+          __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f").select().then(() => {
+            __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
+            __classPrivateFieldGet$3(this, _KupCombobox_textfieldEl, "f").focus();
           });
           break;
         case 'Escape':
           e.preventDefault();
           e.stopPropagation();
-          __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
+          __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
           break;
       }
     }
@@ -7108,14 +7136,14 @@ const KupCombobox = class {
         case 'ArrowDown':
           e.preventDefault();
           e.stopPropagation();
-          __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_openList).call(this);
-          __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f").focusNext();
+          __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_openList).call(this);
+          __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f").focusNext();
           break;
         case 'ArrowUp':
           e.preventDefault();
           e.stopPropagation();
-          __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_openList).call(this);
-          __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f").focusPrevious();
+          __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_openList).call(this);
+          __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f").focusPrevious();
           break;
       }
     }
@@ -7148,7 +7176,7 @@ const KupCombobox = class {
    * Sets the focus to the component.
    */
   async setFocus() {
-    __classPrivateFieldGet$2(this, _KupCombobox_textfieldEl, "f").focus();
+    __classPrivateFieldGet$3(this, _KupCombobox_textfieldEl, "f").focus();
   }
   /**
    * Sets the props to the component.
@@ -7162,14 +7190,14 @@ const KupCombobox = class {
    * @param {string} value - Value to be set.
    */
   async setValue(value) {
-    __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, value, true);
+    __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, value, true);
   }
   /*-------------------------------------------------*/
   /*          L i f e c y c l e   H o o k s          */
   /*-------------------------------------------------*/
   componentWillLoad() {
-    __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").debug.logLoad(this, false);
-    __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").theme.register(this);
+    __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").debug.logLoad(this, false);
+    __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").theme.register(this);
     this.value = this.initialValue;
     if (!this.data) {
       this.data = {
@@ -7179,37 +7207,37 @@ const KupCombobox = class {
     }
   }
   componentDidLoad() {
-    __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, this.value, true);
-    __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").debug.logLoad(this, true);
+    __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_consistencyCheck).call(this, this.value, true);
+    __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").debug.logLoad(this, true);
   }
   componentWillRender() {
-    __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").debug.logRender(this, false);
+    __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").debug.logRender(this, false);
   }
   componentDidRender() {
     const root = this.rootElement.shadowRoot;
     if (root) {
       const f = root.querySelector('.f-text-field');
       if (f) {
-        __classPrivateFieldSet$2(this, _KupCombobox_textfieldWrapper, f, "f");
-        __classPrivateFieldSet$2(this, _KupCombobox_textfieldEl, f.querySelector('input'), "f");
+        __classPrivateFieldSet$3(this, _KupCombobox_textfieldWrapper, f, "f");
+        __classPrivateFieldSet$3(this, _KupCombobox_textfieldEl, f.querySelector('input'), "f");
         FTextFieldMDC(f);
       }
     }
-    __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").debug.logRender(this, true);
+    __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").debug.logRender(this, true);
   }
   render() {
     const fullHeight = this.rootElement.classList.contains('kup-full-height');
     const fullWidth = this.rootElement.classList.contains('kup-full-width');
-    return (h(Host, { class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet$2(this, _KupCombobox_elStyle, "f") }, h("style", null, __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId, style: __classPrivateFieldGet$2(this, _KupCombobox_elStyle, "f") }, h(FTextField, Object.assign({}, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, icon: this.showDropDownIcon
+    return (h(Host, { class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet$3(this, _KupCombobox_elStyle, "f") }, h("style", null, __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId, style: __classPrivateFieldGet$3(this, _KupCombobox_elStyle, "f") }, h(FTextField, Object.assign({}, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, icon: this.showDropDownIcon
         ? KupThemeIconValues.DROPDOWN
-        : null, readOnly: this.isSelect, trailingIcon: true, value: this.displayedValue, onBlur: () => this.onKupBlur(), onClick: () => this.onKupClick(), onChange: (e) => this.onKupChange(e.target.value), onFocus: () => this.onKupFocus(), onInput: () => this.onKupInput(), onIconClick: () => this.onKupIconClick() }))), __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_prepList).call(this)));
+        : null, readOnly: this.isSelect, trailingIcon: true, value: this.displayedValue, onBlur: () => this.onKupBlur(), onClick: () => this.onKupClick(), onChange: (e) => this.onKupChange(e.target.value), onFocus: () => this.onKupFocus(), onInput: () => this.onKupInput(), onIconClick: () => this.onKupIconClick() }))), __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_prepList).call(this)));
   }
   disconnectedCallback() {
-    if (__classPrivateFieldGet$2(this, _KupCombobox_listEl, "f")) {
-      __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").dynamicPosition.unregister([__classPrivateFieldGet$2(this, _KupCombobox_listEl, "f")]);
-      __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f").remove();
+    if (__classPrivateFieldGet$3(this, _KupCombobox_listEl, "f")) {
+      __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").dynamicPosition.unregister([__classPrivateFieldGet$3(this, _KupCombobox_listEl, "f")]);
+      __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f").remove();
     }
-    __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").theme.unregister(this);
+    __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").theme.unregister(this);
   }
   get rootElement() { return getElement$1(this); }
   static get watchers() { return {
@@ -7217,59 +7245,59 @@ const KupCombobox = class {
   }; }
 };
 _KupCombobox_kupManager = new WeakMap(), _KupCombobox_elStyle = new WeakMap(), _KupCombobox_listEl = new WeakMap(), _KupCombobox_textfieldWrapper = new WeakMap(), _KupCombobox_textfieldEl = new WeakMap(), _KupCombobox_clickCb = new WeakMap(), _KupCombobox_instances = new WeakSet(), _KupCombobox_openList = function _KupCombobox_openList() {
-  if (__classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_isListOpened).call(this)) {
+  if (__classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_isListOpened).call(this)) {
     return;
   }
-  __classPrivateFieldGet$2(this, _KupCombobox_textfieldWrapper, "f").classList.add('toggled');
-  __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f").menuVisible = true;
-  __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f").filter = '';
-  const elStyle = __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f").style;
+  __classPrivateFieldGet$3(this, _KupCombobox_textfieldWrapper, "f").classList.add('toggled');
+  __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f").menuVisible = true;
+  __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f").filter = '';
+  const elStyle = __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f").style;
   elStyle.height = 'auto';
-  elStyle.minWidth = __classPrivateFieldGet$2(this, _KupCombobox_textfieldWrapper, "f").clientWidth + 'px';
-  if (__classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").dynamicPosition.isRegistered(__classPrivateFieldGet$2(this, _KupCombobox_listEl, "f"))) {
-    __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").dynamicPosition.changeAnchor(__classPrivateFieldGet$2(this, _KupCombobox_listEl, "f"), __classPrivateFieldGet$2(this, _KupCombobox_textfieldWrapper, "f"));
+  elStyle.minWidth = __classPrivateFieldGet$3(this, _KupCombobox_textfieldWrapper, "f").clientWidth + 'px';
+  if (__classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").dynamicPosition.isRegistered(__classPrivateFieldGet$3(this, _KupCombobox_listEl, "f"))) {
+    __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").dynamicPosition.changeAnchor(__classPrivateFieldGet$3(this, _KupCombobox_listEl, "f"), __classPrivateFieldGet$3(this, _KupCombobox_textfieldWrapper, "f"));
   }
   else {
-    __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").dynamicPosition.register(__classPrivateFieldGet$2(this, _KupCombobox_listEl, "f"), __classPrivateFieldGet$2(this, _KupCombobox_textfieldWrapper, "f"), 0, KupDynamicPositionPlacement.AUTO, true);
+    __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").dynamicPosition.register(__classPrivateFieldGet$3(this, _KupCombobox_listEl, "f"), __classPrivateFieldGet$3(this, _KupCombobox_textfieldWrapper, "f"), 0, KupDynamicPositionPlacement.AUTO, true);
   }
-  __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").dynamicPosition.start(__classPrivateFieldGet$2(this, _KupCombobox_listEl, "f"));
-  if (!__classPrivateFieldGet$2(this, _KupCombobox_clickCb, "f")) {
-    __classPrivateFieldSet$2(this, _KupCombobox_clickCb, {
+  __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").dynamicPosition.start(__classPrivateFieldGet$3(this, _KupCombobox_listEl, "f"));
+  if (!__classPrivateFieldGet$3(this, _KupCombobox_clickCb, "f")) {
+    __classPrivateFieldSet$3(this, _KupCombobox_clickCb, {
       cb: () => {
-        __classPrivateFieldGet$2(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
+        __classPrivateFieldGet$3(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
       },
-      el: __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f"),
+      el: __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f"),
     }, "f");
   }
-  __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").addClickCallback(__classPrivateFieldGet$2(this, _KupCombobox_clickCb, "f"), true);
+  __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").addClickCallback(__classPrivateFieldGet$3(this, _KupCombobox_clickCb, "f"), true);
 }, _KupCombobox_closeList = function _KupCombobox_closeList() {
-  __classPrivateFieldGet$2(this, _KupCombobox_textfieldWrapper, "f").classList.remove('toggled');
-  __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f").menuVisible = false;
-  __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").dynamicPosition.stop(__classPrivateFieldGet$2(this, _KupCombobox_listEl, "f"));
-  __classPrivateFieldGet$2(this, _KupCombobox_kupManager, "f").removeClickCallback(__classPrivateFieldGet$2(this, _KupCombobox_clickCb, "f"));
+  __classPrivateFieldGet$3(this, _KupCombobox_textfieldWrapper, "f").classList.remove('toggled');
+  __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f").menuVisible = false;
+  __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").dynamicPosition.stop(__classPrivateFieldGet$3(this, _KupCombobox_listEl, "f"));
+  __classPrivateFieldGet$3(this, _KupCombobox_kupManager, "f").removeClickCallback(__classPrivateFieldGet$3(this, _KupCombobox_clickCb, "f"));
 }, _KupCombobox_isListOpened = function _KupCombobox_isListOpened() {
-  return __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f").menuVisible == true;
+  return __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f").menuVisible == true;
 }, _KupCombobox_consistencyCheck = function _KupCombobox_consistencyCheck(idIn, setValue) {
-  let ret = consistencyCheck(idIn, this.data['kup-list'], __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f"), this.selectMode, this.displayMode);
+  let ret = consistencyCheck(idIn, this.data['kup-list'], __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f"), this.selectMode, this.displayMode);
   if (ret.exists) {
     if (setValue) {
       this.value = ret.value;
       this.displayedValue = ret.displayedValue;
     }
-    if (__classPrivateFieldGet$2(this, _KupCombobox_listEl, "f") != null) {
-      __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f").filter = ret.value;
+    if (__classPrivateFieldGet$3(this, _KupCombobox_listEl, "f") != null) {
+      __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f").filter = ret.value;
     }
   }
   else {
     this.value = idIn;
     this.displayedValue = idIn;
-    if (__classPrivateFieldGet$2(this, _KupCombobox_listEl, "f") != null) {
-      __classPrivateFieldGet$2(this, _KupCombobox_listEl, "f").filter = ret.value;
+    if (__classPrivateFieldGet$3(this, _KupCombobox_listEl, "f") != null) {
+      __classPrivateFieldGet$3(this, _KupCombobox_listEl, "f").filter = ret.value;
     }
   }
   return ret;
 }, _KupCombobox_prepList = function _KupCombobox_prepList() {
-  return (h("kup-list", Object.assign({}, this.data['kup-list'], { displayMode: this.displayMode, "is-menu": true, "onkup-list-click": (e) => this.onKupItemClick(e), ref: (el) => (__classPrivateFieldSet$2(this, _KupCombobox_listEl, el, "f")) })));
+  return (h("kup-list", Object.assign({}, this.data['kup-list'], { displayMode: this.displayMode, "is-menu": true, "onkup-list-click": (e) => this.onKupItemClick(e), ref: (el) => (__classPrivateFieldSet$3(this, _KupCombobox_listEl, el, "f")) })));
 };
 KupCombobox.style = kupComboboxCss;
 
@@ -8050,14 +8078,14 @@ class KupColumnMenu {
 
 const kupDataTableCss = ":host{--kup_datatable_background_color:var(\n    --kup-datatable-background-color,\n    var(--kup-background-color)\n  );--kup_datatable_border:var(\n    --kup-datatable-border,\n    1px solid var(--kup-border-color)\n  );--kup_datatable_color:var(--kup-datatable-color, var(--kup-text-color));--kup_datatable_font_family:var(\n    --kup-datatable-font-family,\n    var(--kup-font-family)\n  );--kup_datatable_font_family_monospace:var(\n    --kup-datatable-font-family-monospace,\n    var(--kup-font-family-monospace)\n  );--kup_datatable_font_size:var(\n    --kup-datatable-font-size,\n    var(--kup-font-size)\n  );--kup_datatable_th_border:var(\n    --kup-datatable-th-border,\n    1px solid var(--kup-border-color)\n  );--kup_datatable_th_resize_handle_width:var(\n    --kup-datatable-th-resize-handle-width,\n    3px\n  );display:block;font-family:var(--kup_datatable_font_family);font-size:var(--kup_datatable_font_size);position:relative}:host([kup-toolbar]) .settings-trigger{height:12px}:host([kup-toolbar]) .customize-panel{visibility:visible}:host([force-one-line]) .f-cell__text{white-space:nowrap}table{background-color:var(--kup_datatable_background_color);border-spacing:0;border-collapse:separate;color:var(--kup_datatable_color);min-width:intrinsic;min-width:-moz-max-content;min-width:-webkit-max-content;text-align:left;width:100%}table.auto-width{min-width:auto;width:0}table>tbody>tr.focus td:first-of-type,table>tbody>tr[kup-drag-over] td:first-of-type{box-shadow:inset 4px 0px 0px 0px var(--kup-secondary-color)}table>tbody>tr>td:first-of-type,table>tbody>tr>td.placeholder~td:not(.placeholder){border-left:var(--kup_datatable_border)}table>tbody>tr>td:last-of-type{border-right:var(--kup_datatable_border)}table>tbody>tr:last-of-type>td{border-bottom:var(--kup_datatable_border)}table.border-top>tbody>tr:first-of-type>td{border-top:var(--kup_datatable_border)}table.row-separation>tbody>tr>td{border-bottom:var(--kup_datatable_border)}table.column-separation>tbody>tr>td{border-right:var(--kup_datatable_border)}table.noGrid,table.noGrid td{border:none}table tfoot td{border-bottom:var(--kup_datatable_border);border-right:var(--kup_datatable_border);box-sizing:border-box;height:36px;text-align:right;font-weight:bold;padding:0.5em 0.3125em}table tfoot td:hover{background-color:var(--kup_datatable_background_color)}table tfoot td:first-of-type{border-left:var(--kup_datatable_border)}#global-filter{margin:0.5em 0px;min-width:140px;width:100%}.kup-icon:not(.f-image){background-color:var(--kup-title-color);margin:0 0.25em;height:1.25em;width:1.25em}.kup-icon:not(.f-image).kup-ascending-icon,.kup-icon:not(.f-image).kup-descending-icon,.kup-icon:not(.f-image).kup-key-icon,.kup-icon:not(.f-image).kup-filter-remove-icon{height:auto}.kup-icon:not(.f-image).kup-collapsed-icon,.kup-icon:not(.f-image).kup-expanded-icon{float:left}.kup-icon:not(.f-image).kup-filter-remove-icon,.kup-icon:not(.f-image).kup-key-icon{margin:0 0.25em}.below-wrapper{backface-visibility:hidden;height:auto;overflow:auto}.below-wrapper.custom-size{overflow:unset}.below-wrapper:not(.custom-size){overflow-x:auto}.density-dense tbody>tr.group td{padding-top:0.25em;padding-bottom:0.25em}.density-wide tbody>tr.group>td{padding-top:0.75em;padding-bottom:0.75em}.fontsize-small{font-size:calc(var(--kup_datatable_font_size) * 0.75);transition:font-size 0.1s}.fontsize-small .group-cell-content>span:before{font-size:calc(var(--kup_datatable_font_size) * 1) !important}.fontsize-big{font-size:calc(var(--kup_datatable_font_size) * 1.25);transition:font-size 0.1s}.fontsize-big .group-cell-content>span:before{font-size:calc(var(--kup_datatable_font_size) * 1.5) !important}th{background-color:var(--kup-title-background-color);border:var(--kup_datatable_th_border);border-left:0 none;border-bottom-width:2px;box-sizing:border-box;top:0;touch-action:none;transition:background-color 0.25s ease;user-select:none}th:first-of-type{border-left:var(--kup_datatable_th_border)}.header-cell__content{color:var(--kup-title-color);display:flex;justify-content:space-between;padding:0.5em 0.3125em;text-overflow:ellipsis;white-space:nowrap}.header-cell--centered .header-cell__content{justify-content:center}.header-cell--is-number .header-cell__content{justify-content:flex-end}.header-cell__title{overflow:hidden;text-overflow:ellipsis;user-select:none}.header-cell__icons{display:flex}.header-cell__drag-handler{background:rgba(var(--kup-title-color-rgb), 0.25);height:100%;position:absolute;right:0;top:0;touch-action:none;user-select:none;width:var(--kup_datatable_th_resize_handle_width)}.header-cell__drag-handler:hover{background:rgba(var(--kup-title-color-rgb), 0.5)}.header-cell--sortable{cursor:pointer}.header-cell--is-icon{width:30px}tbody{cursor:auto}tbody td{height:0;padding:0}tbody td>*{border:none !important}tbody tr kup-button{max-width:max-content}tbody tr[kup-draggable]{opacity:0.5}tbody tr.selected td{background-color:rgba(var(--kup-primary-color-rgb), 0.175)}tbody tr:hover:not(.group):not(.selected) td{color:var(--kup-hover-color);background-color:var(--kup-hover-background-color)}tbody tr.group{background:var(--kup-title-background-color);border-top:var(--kup_datatable_border);color:var(--kup-title-color);font-weight:bold;cursor:pointer}tbody tr.group.group-label{border-bottom:none}tbody tr.group.group-total{border-top:none;line-height:0.5em}tbody tr.group>td{padding:0.5em 0}tbody tr.group>td .group-cell-content .indent{float:left;margin-left:0.25em}tbody tr.group>td .group-cell-content>span{display:inline-flex;outline:none;margin-left:0.25em}tbody tr.group>td.total{text-align:right;padding:0.5em 0.3125em}tbody tr.group>td.total.negative-number{color:var(--kup-danger-color)}tbody tr>td{box-sizing:border-box;transition:box-shadow 0.1s}tbody tr>td .row-expander{margin-right:0.5em}tbody tr>td .row-action{margin-right:0.2em}tbody tr [row-select-cell]{min-height:40px}tbody tr td[row-action-cell]{width:calc(3em * var(--kup_datatable_row_actions))}tbody tr td[row-action-cell] .f-image{cursor:pointer;margin-left:0.75em;display:inline-block;opacity:1;transition:0.25s ease-in-out}tbody tr td[row-action-cell] .f-image:hover{opacity:0.5}.above-wrapper{display:flex;width:100%}.kup-icon.overlay-action{display:none;position:absolute;top:0.5em;left:calc(50% - 0.625em)}th:hover .kup-icon.overlay-action{display:block}thead th{position:relative}th.obj:hover span:not(.overlay-action){opacity:0.5}.hidden span{color:transparent;position:relative;text-overflow:ellipsis;transition:color 200ms}.hidden span:hover{color:var(--kup_datatable_color)}.group-wrapper{--kup-chip-margin:0 4px}.totals-value{font-weight:bold}.settings-trigger{cursor:pointer;display:block;width:32px;height:0;border-top-left-radius:25px 30px;border-top-right-radius:25px 30px;background-color:var(--kup-border-color);transition:height 0.25s}.settings-trigger.toggled{background-color:var(--kup-primary-color)}.settings-trigger.toggled .f-image__icon{background:var(--kup-text-on-primary-color) !important}.indent{display:inline-block;height:1em;width:2em}.indent~kup-image,.indent~kup-button{margin:0;vertical-align:middle}.indent~kup-image{display:inline-block}.indent~kup-button,.indent~kup-checkbox{display:inline-block}.actions-wrapper{display:flex}.insert-button,.delete-button,.save-button{padding:1em 0.5em}.kup-icon.kup-ascending-icon{-webkit-mask:var(--kup-ascending-icon);mask:var(--kup-ascending-icon)}.kup-icon.kup-collapsed-icon{-webkit-mask:var(--kup-collapsed-icon);mask:var(--kup-collapsed-icon)}.kup-icon.kup-descending-icon{-webkit-mask:var(--kup-descending-icon);mask:var(--kup-descending-icon)}.kup-icon.kup-expanded-icon{-webkit-mask:var(--kup-expanded-icon);mask:var(--kup-expanded-icon)}.kup-icon.kup-filter-remove-icon{-webkit-mask:var(--kup-filter-remove-icon);mask:var(--kup-filter-remove-icon)}.kup-icon.kup-key-icon{-webkit-mask:var(--kup-key-icon);mask:var(--kup-key-icon)}.paginator-wrapper{display:flex;flex-flow:wrap;min-width:max-content}.paginator-tabs{width:100%}.paginator-tabs kup-paginator{display:inline-flex}.paginator-tabs kup-button{position:relative;height:100%;margin-left:0.25em;float:right}.paginator-tabs .load-more-button{margin:0.5em 0px 0px}sticky-header{display:none}.persistent-header~sticky-header{background:var(--kup-title-background-color);border-bottom:2px solid var(--kup-border-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);color:var(--kup-title-color);display:block;opacity:0;overflow:hidden;pointer-events:none;position:fixed;top:0;transition:opacity 0.25s ease-in-out;z-index:10}.persistent-header~sticky-header.activated{opacity:1;pointer-events:all}.persistent-header~sticky-header[hidden]{display:none}.persistent-header~sticky-header tr-sticky{display:inline-flex}.persistent-header~sticky-header th-sticky{box-sizing:border-box;display:inline-flex;padding:0 0.3125em}.persistent-header~sticky-header th-sticky .header-cell__content{width:100%}.fixed-column,.fixed-row{background-color:var(--kup_datatable_background_color);color:var(--kup-text-color);position:sticky}thead .fixed-column,thead .fixed-row,tfoot .fixed-column,tfoot .fixed-row{z-index:10}table.custom-size th{position:sticky;top:0;z-index:10}table.custom-size th.fixed-column{z-index:11}tr:hover .fixed-row,tr:hover .fixed-column{color:var(--kup-hover-color);background-color:var(--kup-hover-background-color)}tr.selected .fixed-column,tr.selected .fixed-row{background-color:var(--kup_datatable_background_color);background-image:linear-gradient(to right, rgba(var(--kup-primary-color-rgb), 0.175) 0%, rgba(var(--kup-primary-color-rgb), 0.175) 0.1%, rgba(var(--kup-primary-color-rgb), 0.175))}.fixed-row{top:0;z-index:4}.fixed-column{left:0;z-index:6}.fixed-column.fixed-row{z-index:8}thead tr .fixed-column,thead tr:hover:not(.group):not(.selected) .fixed-column{background-color:var(--kup-title-background-color);color:var(--kup-title-color)}tfoot tr:hover:not(.group):not(.selected) .fixed-row,tfoot tr:hover:not(.group):not(.selected) .fixed-column{color:var(--kup-text-color);background-color:var(--kup_datatable_background_color)}:host([drag-enabled]) tr{touch-action:none}th[kup-drag-over]{background-color:rgba(var(--kup-success-color-rgb), 0.25)}th[kup-draggable]{cursor:grabbing !important;opacity:0.5}.droparea{animation:fade-in 0.25s ease-out;background:var(--kup_datatable_background_color);border-radius:8px;box-shadow:var(--kup-box-shadow);display:none;padding:1em 0.5em}.droparea--visible{display:flex}.droparea__groups{border:2px dashed var(--kup-text-color)}.droparea__remove{border:2px dashed var(--kup-danger-color)}.droparea__groups,.droparea__remove{background:var(--kup_datatable_background_color);box-shadow:var(--kup-box-shadow);display:block;height:50px;margin:0 0.5em;opacity:0.5;position:relative;transition:opacity 0.25s;width:50px}.droparea__groups .f-image,.droparea__remove .f-image{width:100%;position:absolute}.droparea__groups .f-image:first-of-type,.droparea__remove .f-image:first-of-type{opacity:1}.droparea__groups .f-image:last-of-type,.droparea__remove .f-image:last-of-type{opacity:0}.droparea__groups[kup-drag-over],.droparea__remove[kup-drag-over]{opacity:1}.droparea__groups[kup-drag-over] .f-image:first-of-type,.droparea__remove[kup-drag-over] .f-image:first-of-type{opacity:0}.droparea__groups[kup-drag-over] .f-image:last-of-type,.droparea__remove[kup-drag-over] .f-image:last-of-type{opacity:1}:host(.kup-cross-selection) #kup-component th.selected{box-shadow:inset 0px 4px 0px 0px var(--kup-secondary-color)}:host(.kup-cross-selection) #kup-component td.selected{background-color:rgba(var(--kup-text-color-rgb), 0.075)}:host(.kup-cross-selection) #kup-component td.selected.fixed-column,:host(.kup-cross-selection) #kup-component td.selected.fixed-row{background-color:var(--kup_datatable_background_color);background-image:linear-gradient(to right, rgba(var(--kup-text-color-rgb), 0.075) 0%, rgba(var(--kup-text-color-rgb), 0.075) 0.1%, rgba(var(--kup-text-color-rgb), 0.075))}:host(.kup-cross-selection) #kup-component tr.selected td{background-color:rgba(var(--kup-text-color-rgb), 0.075)}:host(.kup-cross-selection) #kup-component tr.selected td:first-of-type{box-shadow:inset 4px 0px 0px 0px var(--kup-secondary-color)}:host(.kup-cross-selection) #kup-component tr.selected td.selected{background-color:rgba(var(--kup-text-color-rgb), 0.15)}:host(.kup-cross-selection) #kup-component tr.selected td.fixed-column,:host(.kup-cross-selection) #kup-component tr.selected td.fixed-row{background-color:var(--kup_datatable_background_color);background-image:linear-gradient(to right, rgba(var(--kup-text-color-rgb), 0.075) 0%, rgba(var(--kup-text-color-rgb), 0.075) 0.1%, rgba(var(--kup-text-color-rgb), 0.075))}:host(.kup-cross-selection) #kup-component tr.selected td.fixed-column.selected,:host(.kup-cross-selection) #kup-component tr.selected td.fixed-row.selected{background-image:linear-gradient(to right, rgba(var(--kup-text-color-rgb), 0.15) 0%, rgba(var(--kup-text-color-rgb), 0.15) 0.1%, rgba(var(--kup-text-color-rgb), 0.15))}:host(.kup-layout-fixed) #kup-component table{table-layout:fixed;width:100%}tr.clickable{cursor:pointer}";
 
-var __classPrivateFieldGet$1 = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+var __classPrivateFieldGet$2 = (undefined && undefined.__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 __classPrivateFieldSet$1 = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+var __classPrivateFieldSet$2 = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
   if (kind === "m")
     throw new TypeError("Private method is not writable");
   if (kind === "a" && !f)
@@ -8066,7 +8094,7 @@ var __classPrivateFieldSet$1 = (undefined && undefined.__classPrivateFieldSet) |
     throw new TypeError("Cannot write private member to an object whose class did not declare it");
   return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
 };
-var _KupDataTable_instances, _KupDataTable_initialized, _KupDataTable_rows, _KupDataTable_rowsLength, _KupDataTable_paginatedRows, _KupDataTable_paginatedRowsLength, _KupDataTable_footer, _KupDataTable_kupManager, _KupDataTable_renderedRows, _KupDataTable_loadMoreEventCounter, _KupDataTable_loadMoreEventPreviousQuantity, _KupDataTable_theadRef, _KupDataTable_tableRef, _KupDataTable_originalData, _KupDataTable_tableAreaRef, _KupDataTable_stickyTheadRef, _KupDataTable_customizeTopButtonRef, _KupDataTable_customizeTopPanelRef, _KupDataTable_sizedColumns, _KupDataTable_intObserver, _KupDataTable_navBarHeight, _KupDataTable_theadIntersecting, _KupDataTable_tableIntersecting, _KupDataTable_isSafariBrowser, _KupDataTable_isRestoringState, _KupDataTable_globalFilterTimeout, _KupDataTable_totalMenuCoords, _KupDataTable_clickTimeout, _KupDataTable_thRefs, _KupDataTable_rowsRefs, _KupDataTable_oldWidth, _KupDataTable_hold, _KupDataTable_interactableDrag, _KupDataTable_interactableDrop, _KupDataTable_interactableResize, _KupDataTable_interactableTouch, _KupDataTable_dropareaRef, _KupDataTable_removeDropareaRef, _KupDataTable_groupsDropareaRef, _KupDataTable_clickCb, _KupDataTable_clickCbCustomPanel, _KupDataTable_clickCbDropCard, _KupDataTable_resizeTimeout, _KupDataTable_columnMenuInstance, _KupDataTable_filtersColumnMenuInstance, _KupDataTable_filtersRowsInstance, _KupDataTable_detailCard, _KupDataTable_insertCard, _KupDataTable_confirmDeleteCard, _KupDataTable_columnMenuCard, _KupDataTable_columnDropCard, _KupDataTable_columnDropCardAnchor, _KupDataTable_insertCount, _KupDataTable_BUTTON_CANCEL_ID, _KupDataTable_BUTTON_SUBMIT_ID, _KupDataTable_FIELDS_FORM_ID, _KupDataTable_MESSAGE_ID, _KupDataTable_MESSAGE_WRAPPER_ID, _KupDataTable_INSERT_PREFIX, _KupDataTable_closeDropCard, _KupDataTable_createDropCard, _KupDataTable_calculateData, _KupDataTable_getRow, _KupDataTable_getTransposedData, _KupDataTable_setTransposedData, _KupDataTable_switchToTotalsMatrix, _KupDataTable_setObjForTotalsMatrix, _KupDataTable_stickyHeaderPosition, _KupDataTable_updateStickyHeaderSize, _KupDataTable_setObserver, _KupDataTable_didLoadInteractables, _KupDataTable_didRenderInteractables, _KupDataTable_didLoadObservers, _KupDataTable_didRenderObservers, _KupDataTable_didLoadEventHandling, _KupDataTable_scrollStickyHeader, _KupDataTable_checkScrollOnHover, _KupDataTable_customizePanelPosition, _KupDataTable_rowsPointLength, _KupDataTable_paginatedRowsPointLength, _KupDataTable__rowsLength, _KupDataTable_setDynPosElements, _KupDataTable_getEventPath, _KupDataTable_resetSelectedRows, _KupDataTable_getSizedColumns, _KupDataTable_rowDetail, _KupDataTable_rowInsertForm, _KupDataTable_rowsDelete, _KupDataTable_getEventDetails, _KupDataTable_clickHandler, _KupDataTable_contextMenuHandler, _KupDataTable_dblClickHandler, _KupDataTable_initRows, _KupDataTable_filterRows, _KupDataTable_isGrouping, _KupDataTable_hasRowActions, _KupDataTable_removeGroup, _KupDataTable_hasTotals, _KupDataTable_tableHasAutoWidth, _KupDataTable_forceGroupExpansion, _KupDataTable_forceRowGroupExpansion, _KupDataTable_adjustPaginator, _KupDataTable_composeFixedCellStyleAndClass, _KupDataTable_updateFixedRowsAndColumnsCssVariables, _KupDataTable_onColumnSort, _KupDataTable_onRemoveFilter, _KupDataTable_getFilterValueForTooltip, _KupDataTable_onGlobalFilterChange, _KupDataTable_handlePageChange, _KupDataTable_handleRowsPerPageChange, _KupDataTable_onRowClick, _KupDataTable_selectColumn, _KupDataTable_deselectColumn, _KupDataTable_onDefaultRowActionClick, _KupDataTable_onRowActionExpanderClick, _KupDataTable_handleRowSelect, _KupDataTable_onRowExpand, _KupDataTable_onSelectAll, _KupDataTable_openTotalMenu, _KupDataTable_closeTotalMenu, _KupDataTable_isOpenedTotalMenuForColumn, _KupDataTable_groupRows, _KupDataTable_onLoadMoreClick, _KupDataTable_adjustGroupState, _KupDataTable_adjustGroupStateFromRow, _KupDataTable_sortRows, _KupDataTable_getSortIcon, _KupDataTable_getSortDecode, _KupDataTable_calculateColspan, _KupDataTable_isGroupExpanded, _KupDataTable_handleColumnSort, _KupDataTable_moveSortedColumns, _KupDataTable_applyLineBreaks, _KupDataTable_composeHeaderCellClassAndStyle, _KupDataTable_renderHeader, _KupDataTable_renderStickyHeader, _KupDataTable_totalMenuPosition, _KupDataTable_onTotalMenuOpen, _KupDataTable_renderRow, _KupDataTable_renderActions, _KupDataTable_onCustomSettingsClick, _KupDataTable_openCustomSettings, _KupDataTable_closeCustomSettings, _KupDataTable_renderPaginator, _KupDataTable_columnRemoveArea, _KupDataTable_columnGroupArea, _KupDataTable_hideShowColumnDropArea, _KupDataTable_handleColumnGroup, _KupDataTable_transcodeItem, _KupDataTable_createListData, _KupDataTable_FONTSIZE_CODES, _KupDataTable_FONTSIZE_DECODES, _KupDataTable_FONTSIZE_ICONS, _KupDataTable_getFontSizeCodeFromDecode, _KupDataTable_renderFontSizePanel, _KupDataTable_DENSITY_DECODES, _KupDataTable_DENSITY_ICONS, _KupDataTable_getDensityCodeFromDecode, _KupDataTable_renderDensityPanel, _KupDataTable_GRID_CODES, _KupDataTable_GRID_DECODES, _KupDataTable_GRID_ICONS, _KupDataTable_getGridCodeFromDecode, _KupDataTable_renderTransposeSwitch, _KupDataTable_renderTotalsMatrix, _KupDataTable_renderGridPanel;
+var _KupDataTable_instances, _KupDataTable_initialized, _KupDataTable_rows, _KupDataTable_rowsLength, _KupDataTable_paginatedRows, _KupDataTable_paginatedRowsLength, _KupDataTable_footer, _KupDataTable_kupManager, _KupDataTable_renderedRows, _KupDataTable_loadMoreEventCounter, _KupDataTable_loadMoreEventPreviousQuantity, _KupDataTable_theadRef, _KupDataTable_tableRef, _KupDataTable_originalData, _KupDataTable_tableAreaRef, _KupDataTable_stickyTheadRef, _KupDataTable_customizeTopButtonRef, _KupDataTable_customizeTopPanelRef, _KupDataTable_sizedColumns, _KupDataTable_intObserver, _KupDataTable_navBarHeight, _KupDataTable_theadIntersecting, _KupDataTable_tableIntersecting, _KupDataTable_isSafariBrowser, _KupDataTable_isRestoringState, _KupDataTable_globalFilterTimeout, _KupDataTable_totalMenuCoords, _KupDataTable_clickTimeout, _KupDataTable_thRefs, _KupDataTable_rowsRefs, _KupDataTable_oldWidth, _KupDataTable_hold, _KupDataTable_interactableDrag, _KupDataTable_interactableDrop, _KupDataTable_interactableResize, _KupDataTable_interactableTouch, _KupDataTable_dropareaRef, _KupDataTable_removeDropareaRef, _KupDataTable_groupsDropareaRef, _KupDataTable_clickCb, _KupDataTable_clickCbCustomPanel, _KupDataTable_clickCbDropCard, _KupDataTable_resizeTimeout, _KupDataTable_columnMenuInstance, _KupDataTable_filtersColumnMenuInstance, _KupDataTable_filtersRowsInstance, _KupDataTable_detailCard, _KupDataTable_insertCard, _KupDataTable_confirmDeleteCard, _KupDataTable_confirmDeleteDialog, _KupDataTable_columnMenuCard, _KupDataTable_columnDropCard, _KupDataTable_columnDropCardAnchor, _KupDataTable_insertCount, _KupDataTable_BUTTON_CANCEL_ID, _KupDataTable_BUTTON_SUBMIT_ID, _KupDataTable_FIELDS_FORM_ID, _KupDataTable_MESSAGE_ID, _KupDataTable_MESSAGE_WRAPPER_ID, _KupDataTable_INSERT_PREFIX, _KupDataTable_closeDropCard, _KupDataTable_createDropCard, _KupDataTable_calculateData, _KupDataTable_getRow, _KupDataTable_getTransposedData, _KupDataTable_setTransposedData, _KupDataTable_switchToTotalsMatrix, _KupDataTable_setObjForTotalsMatrix, _KupDataTable_stickyHeaderPosition, _KupDataTable_updateStickyHeaderSize, _KupDataTable_setObserver, _KupDataTable_didLoadInteractables, _KupDataTable_didRenderInteractables, _KupDataTable_didLoadObservers, _KupDataTable_didRenderObservers, _KupDataTable_didLoadEventHandling, _KupDataTable_scrollStickyHeader, _KupDataTable_checkScrollOnHover, _KupDataTable_customizePanelPosition, _KupDataTable_rowsPointLength, _KupDataTable_paginatedRowsPointLength, _KupDataTable__rowsLength, _KupDataTable_setDynPosElements, _KupDataTable_getEventPath, _KupDataTable_resetSelectedRows, _KupDataTable_getSizedColumns, _KupDataTable_rowDetail, _KupDataTable_rowInsertForm, _KupDataTable_rowsDelete, _KupDataTable_getEventDetails, _KupDataTable_clickHandler, _KupDataTable_contextMenuHandler, _KupDataTable_dblClickHandler, _KupDataTable_initRows, _KupDataTable_filterRows, _KupDataTable_isGrouping, _KupDataTable_hasRowActions, _KupDataTable_removeGroup, _KupDataTable_hasTotals, _KupDataTable_tableHasAutoWidth, _KupDataTable_forceGroupExpansion, _KupDataTable_forceRowGroupExpansion, _KupDataTable_adjustPaginator, _KupDataTable_composeFixedCellStyleAndClass, _KupDataTable_updateFixedRowsAndColumnsCssVariables, _KupDataTable_onColumnSort, _KupDataTable_onRemoveFilter, _KupDataTable_getFilterValueForTooltip, _KupDataTable_onGlobalFilterChange, _KupDataTable_handlePageChange, _KupDataTable_handleRowsPerPageChange, _KupDataTable_onRowClick, _KupDataTable_selectColumn, _KupDataTable_deselectColumn, _KupDataTable_onDefaultRowActionClick, _KupDataTable_onRowActionExpanderClick, _KupDataTable_handleRowSelect, _KupDataTable_onRowExpand, _KupDataTable_onSelectAll, _KupDataTable_openTotalMenu, _KupDataTable_closeTotalMenu, _KupDataTable_isOpenedTotalMenuForColumn, _KupDataTable_groupRows, _KupDataTable_onLoadMoreClick, _KupDataTable_adjustGroupState, _KupDataTable_adjustGroupStateFromRow, _KupDataTable_sortRows, _KupDataTable_getSortIcon, _KupDataTable_getSortDecode, _KupDataTable_calculateColspan, _KupDataTable_isGroupExpanded, _KupDataTable_handleColumnSort, _KupDataTable_moveSortedColumns, _KupDataTable_applyLineBreaks, _KupDataTable_composeHeaderCellClassAndStyle, _KupDataTable_renderHeader, _KupDataTable_renderStickyHeader, _KupDataTable_totalMenuPosition, _KupDataTable_onTotalMenuOpen, _KupDataTable_renderRow, _KupDataTable_renderActions, _KupDataTable_onCustomSettingsClick, _KupDataTable_openCustomSettings, _KupDataTable_closeCustomSettings, _KupDataTable_renderPaginator, _KupDataTable_columnRemoveArea, _KupDataTable_columnGroupArea, _KupDataTable_hideShowColumnDropArea, _KupDataTable_handleColumnGroup, _KupDataTable_transcodeItem, _KupDataTable_createListData, _KupDataTable_FONTSIZE_CODES, _KupDataTable_FONTSIZE_DECODES, _KupDataTable_FONTSIZE_ICONS, _KupDataTable_getFontSizeCodeFromDecode, _KupDataTable_renderFontSizePanel, _KupDataTable_DENSITY_DECODES, _KupDataTable_DENSITY_ICONS, _KupDataTable_getDensityCodeFromDecode, _KupDataTable_renderDensityPanel, _KupDataTable_GRID_CODES, _KupDataTable_GRID_DECODES, _KupDataTable_GRID_ICONS, _KupDataTable_getGridCodeFromDecode, _KupDataTable_renderTransposeSwitch, _KupDataTable_renderTotalsMatrix, _KupDataTable_renderGridPanel;
 const KupDataTable = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
@@ -8150,6 +8178,7 @@ const KupDataTable = class {
     _KupDataTable_detailCard.set(this, null);
     _KupDataTable_insertCard.set(this, null);
     _KupDataTable_confirmDeleteCard.set(this, null);
+    _KupDataTable_confirmDeleteDialog.set(this, null);
     _KupDataTable_columnMenuCard.set(this, null);
     _KupDataTable_columnDropCard.set(this, null);
     _KupDataTable_columnDropCardAnchor.set(this, null);
@@ -8161,18 +8190,18 @@ const KupDataTable = class {
     _KupDataTable_MESSAGE_WRAPPER_ID.set(this, 'messageWrapper');
     _KupDataTable_INSERT_PREFIX.set(this, 'insert_');
     _KupDataTable_stickyHeaderPosition.set(this, () => {
-      if (__classPrivateFieldGet$1(this, _KupDataTable_tableRef, "f")) {
-        if (__classPrivateFieldGet$1(this, _KupDataTable_tableIntersecting, "f")) {
-          if (!__classPrivateFieldGet$1(this, _KupDataTable_theadIntersecting, "f")) {
-            __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_updateStickyHeaderSize).call(this);
-            __classPrivateFieldGet$1(this, _KupDataTable_stickyTheadRef, "f").classList.add('activated');
+      if (__classPrivateFieldGet$2(this, _KupDataTable_tableRef, "f")) {
+        if (__classPrivateFieldGet$2(this, _KupDataTable_tableIntersecting, "f")) {
+          if (!__classPrivateFieldGet$2(this, _KupDataTable_theadIntersecting, "f")) {
+            __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_updateStickyHeaderSize).call(this);
+            __classPrivateFieldGet$2(this, _KupDataTable_stickyTheadRef, "f").classList.add('activated');
           }
           else {
-            __classPrivateFieldGet$1(this, _KupDataTable_stickyTheadRef, "f").classList.remove('activated');
+            __classPrivateFieldGet$2(this, _KupDataTable_stickyTheadRef, "f").classList.remove('activated');
           }
         }
         else {
-          __classPrivateFieldGet$1(this, _KupDataTable_stickyTheadRef, "f").classList.remove('activated');
+          __classPrivateFieldGet$2(this, _KupDataTable_stickyTheadRef, "f").classList.remove('activated');
         }
       }
     });
@@ -8266,7 +8295,7 @@ const KupDataTable = class {
     if (this.store && this.stateId) {
       const state = this.store.getState(this.stateId);
       if (state != null) {
-        __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Initializing stateId ' + this.stateId);
+        __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Initializing stateId ' + this.stateId);
         // *** PROPS ***
         this.filters = Object.assign({}, state.filters);
         this.groups = [...state.groups];
@@ -8302,116 +8331,116 @@ const KupDataTable = class {
   persistState() {
     if (this.store && this.stateId) {
       let somethingChanged = false;
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.filters, this.filters)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.filters, this.filters)) {
         this.state.filters = Object.assign({}, this.filters);
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.groups, this.groups)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.groups, this.groups)) {
         this.state.groups = [...this.groups];
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.sort, this.sort)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.sort, this.sort)) {
         this.state.sort = [...this.sort];
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.expandGroups, this.expandGroups)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.expandGroups, this.expandGroups)) {
         this.state.expandGroups = this.expandGroups;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.groupLabelDisplay, this.groupLabelDisplay)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.groupLabelDisplay, this.groupLabelDisplay)) {
         this.state.groupLabelDisplay = this.groupLabelDisplay;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.density, this.density)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.density, this.density)) {
         this.state.density = this.density;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.enableExtraColumns, this.enableExtraColumns)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.enableExtraColumns, this.enableExtraColumns)) {
         this.state.enableExtraColumns = this.enableExtraColumns;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.enableSortableColumns, this.enableSortableColumns)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.enableSortableColumns, this.enableSortableColumns)) {
         this.state.enableSortableColumns = this.enableSortableColumns;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.forceOneLine, this.forceOneLine)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.forceOneLine, this.forceOneLine)) {
         this.state.forceOneLine = this.forceOneLine;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.globalFilter, this.globalFilter)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.globalFilter, this.globalFilter)) {
         this.state.globalFilter = this.globalFilter;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.globalFilterValue, this.globalFilterValue)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.globalFilterValue, this.globalFilterValue)) {
         this.state.globalFilterValue = this.globalFilterValue;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.headerIsPersistent, this.headerIsPersistent)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.headerIsPersistent, this.headerIsPersistent)) {
         this.state.headerIsPersistent = this.headerIsPersistent;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.lazyLoadRows, this.lazyLoadRows)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.lazyLoadRows, this.lazyLoadRows)) {
         this.state.lazyLoadRows = this.lazyLoadRows;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.loadMoreLimit, this.loadMoreLimit)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.loadMoreLimit, this.loadMoreLimit)) {
         this.state.loadMoreLimit = this.loadMoreLimit;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.selection, this.selection)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.selection, this.selection)) {
         this.state.selection = this.selection;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.rowsPerPage, this.currentRowsPerPage)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.rowsPerPage, this.currentRowsPerPage)) {
         this.state.rowsPerPage = this.currentRowsPerPage;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.showFilters, this.showFilters)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.showFilters, this.showFilters)) {
         this.state.showFilters = this.showFilters;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.showGroups, this.showGroups)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.showGroups, this.showGroups)) {
         this.state.showGroups = this.showGroups;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.showHeader, this.showHeader)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.showHeader, this.showHeader)) {
         this.state.showHeader = this.showHeader;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.showLoadMore, this.showLoadMore)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.showLoadMore, this.showLoadMore)) {
         this.state.showLoadMore = this.showLoadMore;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.sortEnabled, this.sortEnabled)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.sortEnabled, this.sortEnabled)) {
         this.state.sortEnabled = this.sortEnabled;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.sortableColumnsMutateData, this.sortableColumnsMutateData)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.sortableColumnsMutateData, this.sortableColumnsMutateData)) {
         this.state.sortableColumnsMutateData =
           this.sortableColumnsMutateData;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.pageSelected, this.currentPage)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.pageSelected, this.currentPage)) {
         this.state.pageSelected = this.currentPage;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.dragEnabled, this.dragEnabled)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.dragEnabled, this.dragEnabled)) {
         this.state.dragEnabled = this.dragEnabled;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.dropEnabled, this.dropEnabled)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.dropEnabled, this.dropEnabled)) {
         this.state.dropEnabled = this.dropEnabled;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.showFooter, this.showFooter)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.showFooter, this.showFooter)) {
         this.state.showFooter = this.showFooter;
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.totals, this.totals)) {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.totals, this.totals)) {
         this.state.totals = Object.assign({}, this.totals);
         somethingChanged = true;
       }
-      if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.selectRowsById, this.selectedRows.reduce((accumulator, row, currentIndex) => {
+      if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.deepEqual(this.state.selectRowsById, this.selectedRows.reduce((accumulator, row, currentIndex) => {
         const prefix = currentIndex > 0 ? ';' : '';
         return accumulator + prefix + row.id;
       }, ''))) {
@@ -8426,7 +8455,7 @@ const KupDataTable = class {
         return;
       }
       if (somethingChanged) {
-        __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Persisting stateId ' + this.stateId);
+        __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Persisting stateId ' + this.stateId);
         this.store.persistState(this.stateId, this.state);
       }
     }
@@ -8435,33 +8464,33 @@ const KupDataTable = class {
     this.currentRowsPerPage = newValue;
   }
   expandGroupsHandler() {
-    if (!__classPrivateFieldGet$1(this, _KupDataTable_isRestoringState, "f")) {
+    if (!__classPrivateFieldGet$2(this, _KupDataTable_isRestoringState, "f")) {
       this.recalculateRows();
       // reset group state
       this.groupState = {};
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_forceGroupExpansion).call(this);
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_forceGroupExpansion).call(this);
     }
   }
   filtersChanged() {
     this.expandGroupsHandler();
   }
   recalculateRows() {
-    if (!__classPrivateFieldGet$1(this, _KupDataTable_isRestoringState, "f")) {
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_initRows).call(this);
+    if (!__classPrivateFieldGet$2(this, _KupDataTable_isRestoringState, "f")) {
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_initRows).call(this);
     }
   }
   identifyAndInitRows() {
     identify(this.getRows());
     this.expandGroupsHandler();
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_resetSelectedRows).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_resetSelectedRows).call(this);
   }
   recalculateRowsAndUndoSelections() {
-    if (!__classPrivateFieldGet$1(this, _KupDataTable_isRestoringState, "f")) {
+    if (!__classPrivateFieldGet$2(this, _KupDataTable_isRestoringState, "f")) {
       this.recalculateRows();
       // reset group state
       this.groupState = {};
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_forceGroupExpansion).call(this);
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_resetSelectedRows).call(this);
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_forceGroupExpansion).call(this);
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_resetSelectedRows).call(this);
     }
   }
   controlFixedRowsColumns() {
@@ -8477,8 +8506,8 @@ const KupDataTable = class {
     }
   }
   recalculateData() {
-    if (__classPrivateFieldGet$1(this, _KupDataTable_initialized, "f")) {
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_calculateData).call(this);
+    if (__classPrivateFieldGet$2(this, _KupDataTable_initialized, "f")) {
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_calculateData).call(this);
     }
   }
   /**
@@ -8486,14 +8515,14 @@ const KupDataTable = class {
    */
   async closeColumnMenu() {
     this.columnMenuAnchor = null;
-    if (__classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f")) {
-      __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").data = null;
+    if (__classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f")) {
+      __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").data = null;
     }
-    __classPrivateFieldGet$1(this, _KupDataTable_columnMenuInstance, "f").close(__classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f"));
+    __classPrivateFieldGet$2(this, _KupDataTable_columnMenuInstance, "f").close(__classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f"));
     this.kupDataTableColumnMenu.emit({
       comp: this,
       id: this.rootElement.id,
-      card: __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f"),
+      card: __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f"),
       event: null,
       open: false,
     });
@@ -8536,18 +8565,19 @@ const KupDataTable = class {
    * Closes the insert new record card (called by backend, on success)
    */
   async closeInsertCard() {
-    if (__classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f")) {
-      __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").remove();
-      __classPrivateFieldSet$1(this, _KupDataTable_insertCard, null, "f");
+    if (__classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f")) {
+      __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").remove();
+      __classPrivateFieldSet$2(this, _KupDataTable_insertCard, null, "f");
     }
   }
   /**
    * Closes the delete confirm card (called by backend, on success)
    */
   async closeConfirmDeleteCard() {
-    if (__classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f")) {
-      __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").remove();
-      __classPrivateFieldSet$1(this, _KupDataTable_confirmDeleteCard, null, "f");
+    if (__classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteDialog, "f")) {
+      __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteDialog, "f").close();
+      __classPrivateFieldSet$2(this, _KupDataTable_confirmDeleteCard, null, "f");
+      __classPrivateFieldSet$2(this, _KupDataTable_confirmDeleteDialog, null, "f");
     }
   }
   /**
@@ -8555,23 +8585,23 @@ const KupDataTable = class {
    */
   async getCards() {
     const obj = {};
-    if (__classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f")) {
+    if (__classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f")) {
       obj['insertCard'] = {
-        el: __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f"),
-        messageWrapper: __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").querySelector('#' + __classPrivateFieldGet$1(this, _KupDataTable_MESSAGE_WRAPPER_ID, "f")),
-        message: __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").querySelector('#' + __classPrivateFieldGet$1(this, _KupDataTable_MESSAGE_ID, "f")),
-        submitButton: __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").querySelector('#' + __classPrivateFieldGet$1(this, _KupDataTable_BUTTON_SUBMIT_ID, "f")),
-        cancelButton: __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").querySelector('#' + __classPrivateFieldGet$1(this, _KupDataTable_BUTTON_CANCEL_ID, "f")),
-        form: __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").querySelector('#' + __classPrivateFieldGet$1(this, _KupDataTable_FIELDS_FORM_ID, "f")),
+        el: __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f"),
+        messageWrapper: __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").querySelector('#' + __classPrivateFieldGet$2(this, _KupDataTable_MESSAGE_WRAPPER_ID, "f")),
+        message: __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").querySelector('#' + __classPrivateFieldGet$2(this, _KupDataTable_MESSAGE_ID, "f")),
+        submitButton: __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").querySelector('#' + __classPrivateFieldGet$2(this, _KupDataTable_BUTTON_SUBMIT_ID, "f")),
+        cancelButton: __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").querySelector('#' + __classPrivateFieldGet$2(this, _KupDataTable_BUTTON_CANCEL_ID, "f")),
+        form: __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").querySelector('#' + __classPrivateFieldGet$2(this, _KupDataTable_FIELDS_FORM_ID, "f")),
       };
     }
-    if (__classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f")) {
+    if (__classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f")) {
       obj['confirmDeleteCard'] = {
-        el: __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f"),
-        messageWrapper: __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").querySelector('#' + __classPrivateFieldGet$1(this, _KupDataTable_MESSAGE_WRAPPER_ID, "f")),
-        message: __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").querySelector('#' + __classPrivateFieldGet$1(this, _KupDataTable_MESSAGE_ID, "f")),
-        submitButton: __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").querySelector('#' + __classPrivateFieldGet$1(this, _KupDataTable_BUTTON_SUBMIT_ID, "f")),
-        cancelButton: __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").querySelector('#' + __classPrivateFieldGet$1(this, _KupDataTable_BUTTON_CANCEL_ID, "f")),
+        el: __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f"),
+        messageWrapper: __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").querySelector('#' + __classPrivateFieldGet$2(this, _KupDataTable_MESSAGE_WRAPPER_ID, "f")),
+        message: __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f").querySelector('#' + __classPrivateFieldGet$2(this, _KupDataTable_MESSAGE_ID, "f")),
+        submitButton: __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f").querySelector('#' + __classPrivateFieldGet$2(this, _KupDataTable_BUTTON_SUBMIT_ID, "f")),
+        cancelButton: __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f").querySelector('#' + __classPrivateFieldGet$2(this, _KupDataTable_BUTTON_CANCEL_ID, "f")),
       };
     }
     /*
@@ -8625,7 +8655,7 @@ const KupDataTable = class {
    * @param {KupDataColumn} column - Column to hide.
    */
   async hideColumn(column) {
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").data.column.hide(this.data, [column.name]);
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").data.column.hide(this.data, [column.name]);
     this.kupColumnRemove.emit({
       comp: this,
       id: this.rootElement.id,
@@ -8640,7 +8670,7 @@ const KupDataTable = class {
    * @returns {string|KupDataColumn} Returns the new column created or a string containing the error message if something went wrong.
    */
   async newColumn(type, options) {
-    const result = __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").data.column.new(this.data, type, options);
+    const result = __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").data.column.new(this.data, type, options);
     const error = !!(typeof result === 'string' || result instanceof String);
     if (!error) {
       this.refresh();
@@ -8653,40 +8683,40 @@ const KupDataTable = class {
    */
   async openColumnMenu(column) {
     this.columnMenuAnchor = column;
-    if (!__classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f")) {
-      __classPrivateFieldSet$1(this, _KupDataTable_columnMenuCard, document.createElement('kup-card'), "f");
-      __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").isMenu = true;
-      __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").layoutNumber = 12;
-      __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").sizeX = 'auto';
-      __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").sizeY = 'auto';
-      __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").addEventListener('kup-card-click', (e) => {
+    if (!__classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f")) {
+      __classPrivateFieldSet$2(this, _KupDataTable_columnMenuCard, document.createElement('kup-card'), "f");
+      __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").isMenu = true;
+      __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").layoutNumber = 12;
+      __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").sizeX = 'auto';
+      __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").sizeY = 'auto';
+      __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").addEventListener('kup-card-click', (e) => {
         this.kupDataTableColumnMenu.emit({
           comp: this,
           id: this.rootElement.id,
-          card: __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f"),
+          card: __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f"),
           event: e,
-          open: __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").menuVisible,
+          open: __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").menuVisible,
         });
       });
-      __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").addEventListener('kup-card-event', (e) => {
-        __classPrivateFieldGet$1(this, _KupDataTable_columnMenuInstance, "f").eventHandlers(e, this);
+      __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").addEventListener('kup-card-event', (e) => {
+        __classPrivateFieldGet$2(this, _KupDataTable_columnMenuInstance, "f").eventHandlers(e, this);
         this.kupDataTableColumnMenu.emit({
           comp: this,
           id: this.rootElement.id,
-          card: __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f"),
+          card: __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f"),
           event: e,
-          open: __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").menuVisible,
+          open: __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").menuVisible,
         });
       });
     }
-    __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").setAttribute('data-column', column);
-    __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").data = __classPrivateFieldGet$1(this, _KupDataTable_columnMenuInstance, "f").prepData(this, getColumnByName(this.getVisibleColumns(), column));
-    __classPrivateFieldGet$1(this, _KupDataTable_columnMenuInstance, "f").open(this, column);
-    __classPrivateFieldGet$1(this, _KupDataTable_columnMenuInstance, "f").reposition(this, __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f"));
+    __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").setAttribute('data-column', column);
+    __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").data = __classPrivateFieldGet$2(this, _KupDataTable_columnMenuInstance, "f").prepData(this, getColumnByName(this.getVisibleColumns(), column));
+    __classPrivateFieldGet$2(this, _KupDataTable_columnMenuInstance, "f").open(this, column);
+    __classPrivateFieldGet$2(this, _KupDataTable_columnMenuInstance, "f").reposition(this, __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f"));
     this.kupDataTableColumnMenu.emit({
       comp: this,
       id: this.rootElement.id,
-      card: __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f"),
+      card: __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f"),
       event: null,
       open: true,
     });
@@ -8696,7 +8726,7 @@ const KupDataTable = class {
    */
   async refresh(recalcRows) {
     if (recalcRows) {
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_initRows).call(this);
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_initRows).call(this);
     }
     forceUpdate(this);
   }
@@ -8705,9 +8735,9 @@ const KupDataTable = class {
    */
   async resizeCallback() {
     if (this.lazyLoadCells &&
-      this.rootElement.clientWidth !== __classPrivateFieldGet$1(this, _KupDataTable_oldWidth, "f")) {
-      window.clearTimeout(__classPrivateFieldGet$1(this, _KupDataTable_resizeTimeout, "f"));
-      __classPrivateFieldSet$1(this, _KupDataTable_resizeTimeout, window.setTimeout(() => this.refresh(), 300), "f");
+      this.rootElement.clientWidth !== __classPrivateFieldGet$2(this, _KupDataTable_oldWidth, "f")) {
+      window.clearTimeout(__classPrivateFieldGet$2(this, _KupDataTable_resizeTimeout, "f"));
+      __classPrivateFieldSet$2(this, _KupDataTable_resizeTimeout, window.setTimeout(() => this.refresh(), 300), "f");
     }
   }
   /**
@@ -8721,7 +8751,7 @@ const KupDataTable = class {
     if (!column) {
       return;
     }
-    const row = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getRow).call(this, rowId);
+    const row = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getRow).call(this, rowId);
     if (!row) {
       return;
     }
@@ -8779,7 +8809,7 @@ const KupDataTable = class {
     this.selectedRows = [];
     for (let index = 0; index < rowsIdentifiers.length; index++) {
       const id = rowsIdentifiers[index];
-      this.selectedRows.push(__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getRow).call(this, id));
+      this.selectedRows.push(__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getRow).call(this, id));
     }
     if (emitEvent !== false) {
       this.kupRowSelected.emit({
@@ -8793,17 +8823,17 @@ const KupDataTable = class {
   }
   //---- Lifecycle hooks ----
   componentWillLoad() {
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").debug.logLoad(this, false);
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.register(this);
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").theme.register(this);
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").toolbar.register(this.rootElement);
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").debug.logLoad(this, false);
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.register(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").theme.register(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").toolbar.register(this.rootElement);
     if (!this.emptyDataLabel) {
-      this.emptyDataLabel = __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.EMPTY_DATA);
+      this.emptyDataLabel = __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.EMPTY_DATA);
     }
-    __classPrivateFieldSet$1(this, _KupDataTable_columnMenuInstance, new KupColumnMenu(), "f");
-    __classPrivateFieldSet$1(this, _KupDataTable_filtersColumnMenuInstance, new FiltersColumnMenu(), "f");
-    __classPrivateFieldSet$1(this, _KupDataTable_filtersRowsInstance, new FiltersRows(), "f");
-    __classPrivateFieldSet$1(this, _KupDataTable_isRestoringState, true, "f");
+    __classPrivateFieldSet$2(this, _KupDataTable_columnMenuInstance, new KupColumnMenu(), "f");
+    __classPrivateFieldSet$2(this, _KupDataTable_filtersColumnMenuInstance, new FiltersColumnMenu(), "f");
+    __classPrivateFieldSet$2(this, _KupDataTable_filtersRowsInstance, new FiltersRows(), "f");
+    __classPrivateFieldSet$2(this, _KupDataTable_isRestoringState, true, "f");
     // *** Store
     this.initWithPersistedState();
     // ***
@@ -8811,29 +8841,29 @@ const KupDataTable = class {
       this.currentPage = this.pageSelected;
     }
     this.currentRowsPerPage = this.rowsPerPage;
-    __classPrivateFieldSet$1(this, _KupDataTable_isRestoringState, false, "f");
+    __classPrivateFieldSet$2(this, _KupDataTable_isRestoringState, false, "f");
     //this.identifyAndInitRows();
     identify(this.getRows());
     this.expandGroupsHandler();
     if (document.querySelector('.header')) {
-      __classPrivateFieldSet$1(this, _KupDataTable_navBarHeight, document.querySelector('.header').clientHeight, "f");
+      __classPrivateFieldSet$2(this, _KupDataTable_navBarHeight, document.querySelector('.header').clientHeight, "f");
     }
     else {
-      __classPrivateFieldSet$1(this, _KupDataTable_navBarHeight, 0, "f");
+      __classPrivateFieldSet$2(this, _KupDataTable_navBarHeight, 0, "f");
     }
     if (document.querySelector('.topbar')) {
-      __classPrivateFieldSet$1(this, _KupDataTable_navBarHeight, __classPrivateFieldGet$1(this, _KupDataTable_navBarHeight, "f") + document.querySelector('.topbar').clientHeight, "f");
+      __classPrivateFieldSet$2(this, _KupDataTable_navBarHeight, __classPrivateFieldGet$2(this, _KupDataTable_navBarHeight, "f") + document.querySelector('.topbar').clientHeight, "f");
     }
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_setObserver).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_setObserver).call(this);
     //this.recalculateRows();
     // Detects is the browser is Safari. If needed, this function can be moved into an external file and then imported into components
-    __classPrivateFieldSet$1(this, _KupDataTable_isSafariBrowser, CSS.supports('position', '-webkit-sticky') ||
+    __classPrivateFieldSet$2(this, _KupDataTable_isSafariBrowser, CSS.supports('position', '-webkit-sticky') ||
       !!(window && window.safari), "f");
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_calculateData).call(this);
-    __classPrivateFieldSet$1(this, _KupDataTable_initialized, true, "f");
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_calculateData).call(this);
+    __classPrivateFieldSet$2(this, _KupDataTable_initialized, true, "f");
   }
   componentWillRender() {
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").debug.logRender(this, false);
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").debug.logRender(this, false);
   }
   componentDidRender() {
     const root = this.rootElement.shadowRoot;
@@ -8844,40 +8874,40 @@ const KupDataTable = class {
       }
     }
     if (this.showCustomization) {
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_customizePanelPosition).call(this);
-    }
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_totalMenuPosition).call(this);
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_checkScrollOnHover).call(this);
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_didRenderObservers).call(this);
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_didRenderInteractables).call(this);
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_hideShowColumnDropArea).call(this, false);
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_setDynPosElements).call(this);
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_customizePanelPosition).call(this);
+    }
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_totalMenuPosition).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_checkScrollOnHover).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_didRenderObservers).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_didRenderInteractables).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_hideShowColumnDropArea).call(this, false);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_setDynPosElements).call(this);
     if (this.headerIsPersistent &&
       this.tableHeight === undefined &&
       this.tableWidth === undefined) {
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_updateStickyHeaderSize).call(this);
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_updateStickyHeaderSize).call(this);
     }
-    setTimeout(() => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_updateFixedRowsAndColumnsCssVariables).call(this), 50);
+    setTimeout(() => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_updateFixedRowsAndColumnsCssVariables).call(this), 50);
     // *** Store
     if (this.lazyLoadCells) {
       this.persistState();
     }
     // ***
-    __classPrivateFieldSet$1(this, _KupDataTable_oldWidth, this.rootElement.clientWidth, "f");
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").debug.logRender(this, true);
+    __classPrivateFieldSet$2(this, _KupDataTable_oldWidth, this.rootElement.clientWidth, "f");
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").debug.logRender(this, true);
   }
   componentDidLoad() {
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_didLoadObservers).call(this);
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_didLoadEventHandling).call(this);
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_didLoadInteractables).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_didLoadObservers).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_didLoadEventHandling).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_didLoadInteractables).call(this);
     this.lazyLoadCells = true;
     this.kupDidLoad.emit({ comp: this, id: this.rootElement.id });
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").resize.observe(this.rootElement);
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").debug.logLoad(this, true);
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").resize.observe(this.rootElement);
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").debug.logLoad(this, true);
   }
   resetCurrentPage() {
     this.currentPage = 1;
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_resetSelectedRows).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_resetSelectedRows).call(this);
   }
   getColumns() {
     return this.data && this.data.columns
@@ -8888,7 +8918,7 @@ const KupDataTable = class {
     // TODO: change into `visible ?? true` when TS dependency has been updated
     const visibleColumns = this.getColumns().filter(({ visible }) => visible !== undefined ? visible : true);
     // check grouping
-    if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this)) {
+    if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this)) {
       // filtering column based on group visibility
       return visibleColumns.filter((column) => {
         // check if in group
@@ -8912,7 +8942,7 @@ const KupDataTable = class {
     return visibleColumns;
   }
   getGroupByName(column) {
-    if (!__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this)) {
+    if (!__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this)) {
       return null;
     }
     for (let group of this.groups) {
@@ -8923,7 +8953,7 @@ const KupDataTable = class {
     return null;
   }
   getColumnValues(column) {
-    return __classPrivateFieldGet$1(this, _KupDataTable_filtersRowsInstance, "f").getColumnValues(this, column, this.globalFilterValue, __classPrivateFieldGet$1(this, _KupDataTable_filtersColumnMenuInstance, "f"));
+    return __classPrivateFieldGet$2(this, _KupDataTable_filtersRowsInstance, "f").getColumnValues(this, column, this.globalFilterValue, __classPrivateFieldGet$2(this, _KupDataTable_filtersColumnMenuInstance, "f"));
   }
   getRows() {
     return this.data && this.data.rows ? this.data.rows : [];
@@ -8938,7 +8968,7 @@ const KupDataTable = class {
   }
   async defaultSortingFunction(columns, receivingColumnIndex, sortedColumnIndex, useNewObject = false) {
     const toSort = !useNewObject ? columns : [...columns];
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_moveSortedColumns).call(this, toSort, receivingColumnIndex, sortedColumnIndex);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_moveSortedColumns).call(this, toSort, receivingColumnIndex, sortedColumnIndex);
     return toSort;
   }
   areTotalsSelected(column) {
@@ -8946,7 +8976,7 @@ const KupDataTable = class {
   }
   onTotalsChange(event, column) {
     // close menu
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_closeTotalMenu).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_closeTotalMenu).call(this);
     if (column) {
       // must do this
       // otherwise does not fire the watcher
@@ -8969,14 +8999,14 @@ const KupDataTable = class {
     let selectRowCell = null;
     if (this.selection === SelectionMode.MULTIPLE_CHECKBOX) {
       extraCells++;
-      const fixedCellStyle = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, extraCells, 0, extraCells);
+      const fixedCellStyle = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, extraCells, 0, extraCells);
       selectRowCell = (h("td", { class: fixedCellStyle ? fixedCellStyle.fixedCellClasses : null, style: fixedCellStyle ? fixedCellStyle.fixedCellStyle : null }));
     }
     // Action cell
     let actionsCell = null;
-    if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this)) {
+    if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this)) {
       extraCells++;
-      const selectionStyleAndClass = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, extraCells, 0, extraCells);
+      const selectionStyleAndClass = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, extraCells, 0, extraCells);
       actionsCell = (h("td", { class: selectionStyleAndClass
           ? selectionStyleAndClass.fixedCellClasses
           : {}, style: selectionStyleAndClass
@@ -8984,19 +9014,19 @@ const KupDataTable = class {
           : {} }));
     }
     const footerCells = this.getVisibleColumns().map((column, columnIndex) => {
-      const fixedCellStyle = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, columnIndex + 1 + extraCells, 0, extraCells);
+      const fixedCellStyle = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, columnIndex + 1 + extraCells, 0, extraCells);
       let totalMenu = undefined;
       let menuLabel = TotalLabel.CALC;
       const translation = {
-        [TotalLabel.AVERAGE]: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.AVERAGE),
-        [TotalLabel.CALC]: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.CALCULATE),
-        [TotalLabel.CANC]: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.CANCEL),
-        [TotalLabel.COUNT]: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.COUNT),
-        [TotalLabel.DISTINCT]: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.DISTINCT),
-        [TotalLabel.MATH]: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.FORMULA),
-        [TotalLabel.MAX]: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.MAXIMUM),
-        [TotalLabel.MIN]: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.MINIMUM),
-        [TotalLabel.SUM]: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.SUM),
+        [TotalLabel.AVERAGE]: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.AVERAGE),
+        [TotalLabel.CALC]: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.CALCULATE),
+        [TotalLabel.CANC]: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.CANCEL),
+        [TotalLabel.COUNT]: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.COUNT),
+        [TotalLabel.DISTINCT]: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.DISTINCT),
+        [TotalLabel.MATH]: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.FORMULA),
+        [TotalLabel.MAX]: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.MAXIMUM),
+        [TotalLabel.MIN]: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.MINIMUM),
+        [TotalLabel.SUM]: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageTotals.SUM),
       };
       if (this.totals) {
         const totalValue = this.totals[column.name];
@@ -9028,7 +9058,7 @@ const KupDataTable = class {
           }
         }
       }
-      if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_isOpenedTotalMenuForColumn).call(this, column.name)) {
+      if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_isOpenedTotalMenuForColumn).call(this, column.name)) {
         const listData = [
           {
             id: TotalMode.COUNT,
@@ -9039,7 +9069,7 @@ const KupDataTable = class {
             value: translation[TotalLabel.DISTINCT],
           },
         ];
-        if (__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isNumber(column.obj)) {
+        if (__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isNumber(column.obj)) {
           // TODO Move these objects in declarations
           listData.push({
             id: TotalMode.SUM,
@@ -9056,7 +9086,7 @@ const KupDataTable = class {
             value: translation[TotalLabel.MAX],
           });
         }
-        else if (__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isDate(column.obj)) {
+        else if (__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isDate(column.obj)) {
           listData.push({
             id: TotalMode.MIN,
             separator: true,
@@ -9081,14 +9111,14 @@ const KupDataTable = class {
       }
       // TODO please use getValueForDisplay
       let value;
-      const footerValue = __classPrivateFieldGet$1(this, _KupDataTable_footer, "f")[column.name];
+      const footerValue = __classPrivateFieldGet$2(this, _KupDataTable_footer, "f")[column.name];
       if (menuLabel === TotalLabel.COUNT ||
         menuLabel === TotalLabel.DISTINCT) {
         value = footerValue;
       }
       else if ((menuLabel === TotalLabel.MAX ||
         menuLabel === TotalLabel.MIN) &&
-        __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isDate(column.obj)) {
+        __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isDate(column.obj)) {
         if (footerValue) {
           value = footerValue;
         }
@@ -9112,38 +9142,38 @@ const KupDataTable = class {
     let transpose = undefined;
     let totalsMatrix = undefined;
     if (this.openedCustomSettings) {
-      density = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_renderDensityPanel).call(this);
-      fontsize = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_renderFontSizePanel).call(this);
-      grid = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_renderGridPanel).call(this);
-      transpose = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_renderTransposeSwitch).call(this);
+      density = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_renderDensityPanel).call(this);
+      fontsize = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_renderFontSizePanel).call(this);
+      grid = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_renderGridPanel).call(this);
+      transpose = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_renderTransposeSwitch).call(this);
       if (this.totals && this.groups.length > 0) {
-        totalsMatrix = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_renderTotalsMatrix).call(this);
+        totalsMatrix = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_renderTotalsMatrix).call(this);
       }
     }
     return (h("kup-card", { customStyle: "::slotted(kup-switch) { width: max-content !important; } ::slotted(*) { margin: auto !important; } ::slotted(.customize-element) { margin: auto !important; padding: 0 1em 1em 1em !important; width: max-content !important; } ::slotted(.customize-element):nth-child(1) { padding-top: 1em !important; }", isMenu: true, layoutFamily: KupCardFamily.FREE, ref: (el) => {
-        __classPrivateFieldSet$1(this, _KupDataTable_customizeTopPanelRef, el, "f");
-      }, sizeX: "360px", sizeY: "300px" }, density, grid, fontsize, transpose, h("kup-switch", { class: "customize-element", checked: this.dragEnabled, label: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.DRAG_AND_DROP), leadingLabel: true, "onkup-switch-change": () => (this.dragEnabled = !this.dragEnabled) }), h("kup-switch", { class: "customize-element", checked: this.editableData, label: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.EDITABLE), leadingLabel: true, "onkup-switch-change": () => (this.editableData = !this.editableData) }), h("kup-button", { title: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.TOGGLE) +
+        __classPrivateFieldSet$2(this, _KupDataTable_customizeTopPanelRef, el, "f");
+      }, sizeX: "360px", sizeY: "300px" }, density, grid, fontsize, transpose, h("kup-switch", { class: "customize-element", checked: this.dragEnabled, label: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.DRAG_AND_DROP), leadingLabel: true, "onkup-switch-change": () => (this.dragEnabled = !this.dragEnabled) }), h("kup-switch", { class: "customize-element", checked: this.editableData, label: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.EDITABLE), leadingLabel: true, "onkup-switch-change": () => (this.editableData = !this.editableData) }), h("kup-button", { title: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.TOGGLE) +
         ' Magic Box ' +
         '(' +
-        __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.EXPERIMENTAL_FEAT) +
-        ')', icon: "auto-fix", "onkup-button-click": () => __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").toggleMagicBox() }), totalsMatrix));
+        __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.EXPERIMENTAL_FEAT) +
+        ')', icon: "auto-fix", "onkup-button-click": () => __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").toggleMagicBox() }), totalsMatrix));
   }
   render() {
-    __classPrivateFieldSet$1(this, _KupDataTable_thRefs, [], "f");
-    __classPrivateFieldSet$1(this, _KupDataTable_rowsRefs, [], "f");
-    __classPrivateFieldSet$1(this, _KupDataTable_renderedRows, [], "f");
+    __classPrivateFieldSet$2(this, _KupDataTable_thRefs, [], "f");
+    __classPrivateFieldSet$2(this, _KupDataTable_rowsRefs, [], "f");
+    __classPrivateFieldSet$2(this, _KupDataTable_renderedRows, [], "f");
     let elStyle = undefined;
-    __classPrivateFieldSet$1(this, _KupDataTable_sizedColumns, __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getSizedColumns).call(this), "f");
+    __classPrivateFieldSet$2(this, _KupDataTable_sizedColumns, __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getSizedColumns).call(this), "f");
     let rows = null;
-    if (__classPrivateFieldGet$1(this, _KupDataTable_paginatedRowsLength, "f") === 0) {
-      rows = (h("tr", { ref: (el) => __classPrivateFieldGet$1(this, _KupDataTable_rowsRefs, "f").push(el) }, h("td", { colSpan: __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_calculateColspan).call(this) }, this.emptyDataLabel)));
+    if (__classPrivateFieldGet$2(this, _KupDataTable_paginatedRowsLength, "f") === 0) {
+      rows = (h("tr", { ref: (el) => __classPrivateFieldGet$2(this, _KupDataTable_rowsRefs, "f").push(el) }, h("td", { colSpan: __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_calculateColspan).call(this) }, this.emptyDataLabel)));
     }
     else {
       rows = [];
-      __classPrivateFieldGet$1(this, _KupDataTable_paginatedRows, "f")
+      __classPrivateFieldGet$2(this, _KupDataTable_paginatedRows, "f")
         // We must pass the previous element of the array to check if we must hide or display the value of the cell
         // When the column has specified the parameter hideValuesRepetitions
-        .map((row, rowIndex, currentArray) => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_renderRow).call(this, row, 0, rowIndex + 1, rowIndex > 0 ? currentArray[rowIndex - 1] : null))
+        .map((row, rowIndex, currentArray) => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_renderRow).call(this, row, 0, rowIndex + 1, rowIndex > 0 ? currentArray[rowIndex - 1] : null))
         .forEach((jsxRow) => {
         if (Array.isArray(jsxRow)) {
           jsxRow.forEach((jr) => rows.push(jr));
@@ -9155,24 +9185,24 @@ const KupDataTable = class {
     }
     // header
     // for multi selection purposes, this should be called before this.renderedRows has been evaluated
-    const header = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_renderHeader).call(this);
-    const stickyHeader = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_renderStickyHeader).call(this);
+    const header = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_renderHeader).call(this);
+    const stickyHeader = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_renderStickyHeader).call(this);
     let paginatorTop = undefined;
     let paginatorBottom = undefined;
-    if ((!this.lazyLoadRows && __classPrivateFieldGet$1(this, _KupDataTable_rowsLength, "f") > this.rowsPerPage) ||
+    if ((!this.lazyLoadRows && __classPrivateFieldGet$2(this, _KupDataTable_rowsLength, "f") > this.rowsPerPage) ||
       this.showCustomization ||
       this.showLoadMore) {
       if (PaginatorPos.TOP === this.paginatorPos ||
         PaginatorPos.BOTH === this.paginatorPos) {
-        paginatorTop = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_renderPaginator).call(this, true);
+        paginatorTop = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_renderPaginator).call(this, true);
       }
       if (PaginatorPos.BOTTOM === this.paginatorPos ||
         PaginatorPos.BOTH === this.paginatorPos) {
-        paginatorBottom = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_renderPaginator).call(this, false);
+        paginatorBottom = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_renderPaginator).call(this, false);
       }
     }
     let groupChips = null;
-    if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this)) {
+    if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this)) {
       const chipsData = [];
       for (let index = 0; index < this.groups.length; index++) {
         const group = this.groups[index];
@@ -9185,7 +9215,7 @@ const KupDataTable = class {
           });
         }
         else {
-          __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Grouped for a non-existent column! (' +
+          __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Grouped for a non-existent column! (' +
             group.column +
             ')', KupDebugCategory.WARNING);
         }
@@ -9198,7 +9228,7 @@ const KupDataTable = class {
           onIconClick: [],
         };
         for (let i = 0; i < chipsData.length; i++) {
-          props.onIconClick.push(() => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_removeGroup).call(this, i));
+          props.onIconClick.push(() => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_removeGroup).call(this, i));
         }
         groupChips = h(FChip, Object.assign({}, props));
       }
@@ -9206,7 +9236,7 @@ const KupDataTable = class {
     const tableClass = {
       // Class to specify whether the table should have width: auto or not.
       // Mandatory to check with custom column size.
-      'auto-width': __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_tableHasAutoWidth).call(this),
+      'auto-width': __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_tableHasAutoWidth).call(this),
       'column-separation': ShowGrid.COMPLETE === this.showGrid ||
         ShowGrid.COL === this.showGrid,
       // When there are columns with a specified width, we must add table-layout: fixed to force the table to respect them
@@ -9233,7 +9263,7 @@ const KupDataTable = class {
     if (this.headerIsPersistent &&
       this.tableHeight === undefined &&
       this.tableWidth === undefined) {
-      stickyEl = (h("sticky-header", { class: "hover-scrolling-child", hidden: !this.showHeader, ref: (el) => (__classPrivateFieldSet$1(this, _KupDataTable_stickyTheadRef, el, "f")) }, h("thead-sticky", null, h("tr-sticky", null, stickyHeader))));
+      stickyEl = (h("sticky-header", { class: "hover-scrolling-child", hidden: !this.showHeader, ref: (el) => (__classPrivateFieldSet$2(this, _KupDataTable_stickyTheadRef, el, "f")) }, h("thead-sticky", null, h("tr-sticky", null, stickyHeader))));
     }
     let belowClass = 'below-wrapper';
     if (this.tableHeight !== undefined || this.tableWidth !== undefined) {
@@ -9256,32 +9286,32 @@ const KupDataTable = class {
         }
       }
     };
-    const compCreated = (h(Host, { "onKup-cell-input": autoselectOnAction, "onKup-cell-update": autoselectOnAction }, h("style", null, __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId }, h("div", { class: "above-wrapper" }, this.globalFilter ? (h("div", { id: "global-filter" }, h(FTextField, { fullWidth: true, icon: KupThemeIconValues.SEARCH, label: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageSearch.SEARCH), value: this.globalFilterValue, onInput: (event) => {
+    const compCreated = (h(Host, { "onKup-cell-input": autoselectOnAction, "onKup-cell-update": autoselectOnAction }, h("style", null, __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId }, h("div", { class: "above-wrapper" }, this.globalFilter ? (h("div", { id: "global-filter" }, h(FTextField, { fullWidth: true, icon: KupThemeIconValues.SEARCH, label: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageSearch.SEARCH), value: this.globalFilterValue, onInput: (event) => {
         const t = event.target;
-        window.clearTimeout(__classPrivateFieldGet$1(this, _KupDataTable_globalFilterTimeout, "f"));
-        __classPrivateFieldSet$1(this, _KupDataTable_globalFilterTimeout, window.setTimeout(() => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_onGlobalFilterChange).call(this, t), 600, t), "f");
+        window.clearTimeout(__classPrivateFieldGet$2(this, _KupDataTable_globalFilterTimeout, "f"));
+        __classPrivateFieldSet$2(this, _KupDataTable_globalFilterTimeout, window.setTimeout(() => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_onGlobalFilterChange).call(this, t), 600, t), "f");
       } }))) : null, paginatorTop), h("div", { class: "group-wrapper" }, groupChips), h("div", { class: "actions-wrapper" }, this.insertMode !== '' ? (h(FButton, { icon: "plus", onClick: async () => {
         var _a;
         if (this.insertMode === 'form') {
-          __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_rowInsertForm).call(this);
+          __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_rowInsertForm).call(this);
         }
         else {
-          __classPrivateFieldSet$1(this, _KupDataTable_insertCount, (_a = __classPrivateFieldGet$1(this, _KupDataTable_insertCount, "f"), _a++, _a), "f");
+          __classPrivateFieldSet$2(this, _KupDataTable_insertCount, (_a = __classPrivateFieldGet$2(this, _KupDataTable_insertCount, "f"), _a++, _a), "f");
           const cells = {};
           for (let index = 0; index < this.data.columns.length; index++) {
             const column = this.data.columns[index];
             cells[column.name] = {
               isEditable: column.isKey ||
                 column.isEditable,
-              obj: column.obj,
+              obj: Object.assign({}, column.obj),
               shape: column.shape,
               value: '',
             };
           }
           const row = {
             cells,
-            id: __classPrivateFieldGet$1(this, _KupDataTable_INSERT_PREFIX, "f") +
-              __classPrivateFieldGet$1(this, _KupDataTable_insertCount, "f"),
+            id: __classPrivateFieldGet$2(this, _KupDataTable_INSERT_PREFIX, "f") +
+              __classPrivateFieldGet$2(this, _KupDataTable_insertCount, "f"),
           };
           this.data.rows.unshift(row);
           await this.refresh(true);
@@ -9295,45 +9325,45 @@ const KupDataTable = class {
         });
       }, styling: FButtonStyling.OUTLINED, title: "Save", wrapperClass: "save-button" })) : null, this.showDeleteButton &&
       this.selectedRows.length > 0 ? (h(FButton, { icon: "delete", onClick: () => {
-        __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_rowsDelete).call(this);
-      }, styling: FButtonStyling.OUTLINED, title: "Delete selected rows", wrapperClass: "delete-button" })) : null), h("div", { class: "droparea", ref: (el) => (__classPrivateFieldSet$1(this, _KupDataTable_dropareaRef, el, "f")) }, this.showGroups ? __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_columnGroupArea).call(this) : null, this.removableColumns
-      ? __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_columnRemoveArea).call(this)
-      : null), h("div", { style: elStyle, class: belowClass, ref: (el) => (__classPrivateFieldSet$1(this, _KupDataTable_tableAreaRef, el, "f")) }, this.showCustomization
+        __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_rowsDelete).call(this);
+      }, styling: FButtonStyling.OUTLINED, title: "Delete selected rows", wrapperClass: "delete-button" })) : null), h("div", { class: "droparea", ref: (el) => (__classPrivateFieldSet$2(this, _KupDataTable_dropareaRef, el, "f")) }, this.showGroups ? __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_columnGroupArea).call(this) : null, this.removableColumns
+      ? __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_columnRemoveArea).call(this)
+      : null), h("div", { style: elStyle, class: belowClass, ref: (el) => (__classPrivateFieldSet$2(this, _KupDataTable_tableAreaRef, el, "f")) }, this.showCustomization
       ? [
         h("div", { class: "settings-trigger", onClick: () => {
-            __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_onCustomSettingsClick).call(this);
+            __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_onCustomSettingsClick).call(this);
           }, ref: (el) => {
-            __classPrivateFieldSet$1(this, _KupDataTable_customizeTopButtonRef, el, "f");
+            __classPrivateFieldSet$2(this, _KupDataTable_customizeTopButtonRef, el, "f");
           } }, h(FImage, { color: `var(${KupThemeColorValues.TITLE})`, resource: "settings", sizeX: "10px" })),
         this.renderCustomizePanel(),
       ]
-      : null, h("table", { class: tableClass, ref: (el) => (__classPrivateFieldSet$1(this, _KupDataTable_tableRef, el, "f")), onMouseLeave: (ev) => {
+      : null, h("table", { class: tableClass, ref: (el) => (__classPrivateFieldSet$2(this, _KupDataTable_tableRef, el, "f")), onMouseLeave: (ev) => {
         ev.stopPropagation();
       }, onContextMenu: (e) => {
         e.preventDefault();
-      } }, h("thead", { hidden: !this.showHeader, ref: (el) => (__classPrivateFieldSet$1(this, _KupDataTable_theadRef, el, "f")) }, h("tr", null, header)), h("tbody", null, rows), this.showFooter || __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_hasTotals).call(this)
+      } }, h("thead", { hidden: !this.showHeader, ref: (el) => (__classPrivateFieldSet$2(this, _KupDataTable_theadRef, el, "f")) }, h("tr", null, header)), h("tbody", null, rows), this.showFooter || __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_hasTotals).call(this)
       ? this.renderFooter()
       : null), stickyEl), paginatorBottom)));
     return compCreated;
   }
   disconnectedCallback() {
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").interact.unregister(__classPrivateFieldGet$1(this, _KupDataTable_interactableDrag, "f").concat(__classPrivateFieldGet$1(this, _KupDataTable_interactableDrop, "f"), __classPrivateFieldGet$1(this, _KupDataTable_interactableResize, "f"), __classPrivateFieldGet$1(this, _KupDataTable_interactableTouch, "f")));
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.unregister(this);
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").theme.unregister(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").interact.unregister(__classPrivateFieldGet$2(this, _KupDataTable_interactableDrag, "f").concat(__classPrivateFieldGet$2(this, _KupDataTable_interactableDrop, "f"), __classPrivateFieldGet$2(this, _KupDataTable_interactableResize, "f"), __classPrivateFieldGet$2(this, _KupDataTable_interactableTouch, "f")));
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.unregister(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").theme.unregister(this);
     const dynamicPositionElements = this.rootElement.shadowRoot.querySelectorAll('[' + kupDynamicPositionAttribute + ']');
     if (dynamicPositionElements.length > 0) {
-      __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dynamicPosition.unregister(Array.prototype.slice.call(dynamicPositionElements));
+      __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dynamicPosition.unregister(Array.prototype.slice.call(dynamicPositionElements));
     }
-    if (__classPrivateFieldGet$1(this, _KupDataTable_customizeTopPanelRef, "f")) {
-      __classPrivateFieldGet$1(this, _KupDataTable_customizeTopPanelRef, "f").remove();
+    if (__classPrivateFieldGet$2(this, _KupDataTable_customizeTopPanelRef, "f")) {
+      __classPrivateFieldGet$2(this, _KupDataTable_customizeTopPanelRef, "f").remove();
     }
-    if (__classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f")) {
-      __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").remove();
+    if (__classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f")) {
+      __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").remove();
     }
     if (this.scrollOnHover) {
-      __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").scrollOnHover.unregister(__classPrivateFieldGet$1(this, _KupDataTable_tableAreaRef, "f"));
+      __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").scrollOnHover.unregister(__classPrivateFieldGet$2(this, _KupDataTable_tableAreaRef, "f"));
     }
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").resize.unobserve(this.rootElement);
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").resize.unobserve(this.rootElement);
     this.kupDidUnload.emit({ comp: this, id: this.rootElement.id });
   }
   get rootElement() { return getElement$1(this); }
@@ -9353,17 +9383,17 @@ const KupDataTable = class {
     "transpose": ["recalculateData"]
   }; }
 };
-_KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _KupDataTable_rowsLength = new WeakMap(), _KupDataTable_paginatedRows = new WeakMap(), _KupDataTable_paginatedRowsLength = new WeakMap(), _KupDataTable_footer = new WeakMap(), _KupDataTable_kupManager = new WeakMap(), _KupDataTable_renderedRows = new WeakMap(), _KupDataTable_loadMoreEventCounter = new WeakMap(), _KupDataTable_loadMoreEventPreviousQuantity = new WeakMap(), _KupDataTable_theadRef = new WeakMap(), _KupDataTable_tableRef = new WeakMap(), _KupDataTable_originalData = new WeakMap(), _KupDataTable_tableAreaRef = new WeakMap(), _KupDataTable_stickyTheadRef = new WeakMap(), _KupDataTable_customizeTopButtonRef = new WeakMap(), _KupDataTable_customizeTopPanelRef = new WeakMap(), _KupDataTable_sizedColumns = new WeakMap(), _KupDataTable_intObserver = new WeakMap(), _KupDataTable_navBarHeight = new WeakMap(), _KupDataTable_theadIntersecting = new WeakMap(), _KupDataTable_tableIntersecting = new WeakMap(), _KupDataTable_isSafariBrowser = new WeakMap(), _KupDataTable_isRestoringState = new WeakMap(), _KupDataTable_globalFilterTimeout = new WeakMap(), _KupDataTable_totalMenuCoords = new WeakMap(), _KupDataTable_clickTimeout = new WeakMap(), _KupDataTable_thRefs = new WeakMap(), _KupDataTable_rowsRefs = new WeakMap(), _KupDataTable_oldWidth = new WeakMap(), _KupDataTable_hold = new WeakMap(), _KupDataTable_interactableDrag = new WeakMap(), _KupDataTable_interactableDrop = new WeakMap(), _KupDataTable_interactableResize = new WeakMap(), _KupDataTable_interactableTouch = new WeakMap(), _KupDataTable_dropareaRef = new WeakMap(), _KupDataTable_removeDropareaRef = new WeakMap(), _KupDataTable_groupsDropareaRef = new WeakMap(), _KupDataTable_clickCb = new WeakMap(), _KupDataTable_clickCbCustomPanel = new WeakMap(), _KupDataTable_clickCbDropCard = new WeakMap(), _KupDataTable_resizeTimeout = new WeakMap(), _KupDataTable_columnMenuInstance = new WeakMap(), _KupDataTable_filtersColumnMenuInstance = new WeakMap(), _KupDataTable_filtersRowsInstance = new WeakMap(), _KupDataTable_detailCard = new WeakMap(), _KupDataTable_insertCard = new WeakMap(), _KupDataTable_confirmDeleteCard = new WeakMap(), _KupDataTable_columnMenuCard = new WeakMap(), _KupDataTable_columnDropCard = new WeakMap(), _KupDataTable_columnDropCardAnchor = new WeakMap(), _KupDataTable_insertCount = new WeakMap(), _KupDataTable_BUTTON_CANCEL_ID = new WeakMap(), _KupDataTable_BUTTON_SUBMIT_ID = new WeakMap(), _KupDataTable_FIELDS_FORM_ID = new WeakMap(), _KupDataTable_MESSAGE_ID = new WeakMap(), _KupDataTable_MESSAGE_WRAPPER_ID = new WeakMap(), _KupDataTable_INSERT_PREFIX = new WeakMap(), _KupDataTable_stickyHeaderPosition = new WeakMap(), _KupDataTable_FONTSIZE_CODES = new WeakMap(), _KupDataTable_FONTSIZE_DECODES = new WeakMap(), _KupDataTable_FONTSIZE_ICONS = new WeakMap(), _KupDataTable_DENSITY_DECODES = new WeakMap(), _KupDataTable_DENSITY_ICONS = new WeakMap(), _KupDataTable_GRID_CODES = new WeakMap(), _KupDataTable_GRID_DECODES = new WeakMap(), _KupDataTable_GRID_ICONS = new WeakMap(), _KupDataTable_instances = new WeakSet(), _KupDataTable_closeDropCard = function _KupDataTable_closeDropCard() {
-  __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dynamicPosition.stop(__classPrivateFieldGet$1(this, _KupDataTable_columnDropCard, "f"));
-  __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").removeClickCallback(__classPrivateFieldGet$1(this, _KupDataTable_clickCbDropCard, "f"));
-  __classPrivateFieldGet$1(this, _KupDataTable_columnDropCard, "f").remove();
-  __classPrivateFieldSet$1(this, _KupDataTable_columnDropCard, null, "f");
+_KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _KupDataTable_rowsLength = new WeakMap(), _KupDataTable_paginatedRows = new WeakMap(), _KupDataTable_paginatedRowsLength = new WeakMap(), _KupDataTable_footer = new WeakMap(), _KupDataTable_kupManager = new WeakMap(), _KupDataTable_renderedRows = new WeakMap(), _KupDataTable_loadMoreEventCounter = new WeakMap(), _KupDataTable_loadMoreEventPreviousQuantity = new WeakMap(), _KupDataTable_theadRef = new WeakMap(), _KupDataTable_tableRef = new WeakMap(), _KupDataTable_originalData = new WeakMap(), _KupDataTable_tableAreaRef = new WeakMap(), _KupDataTable_stickyTheadRef = new WeakMap(), _KupDataTable_customizeTopButtonRef = new WeakMap(), _KupDataTable_customizeTopPanelRef = new WeakMap(), _KupDataTable_sizedColumns = new WeakMap(), _KupDataTable_intObserver = new WeakMap(), _KupDataTable_navBarHeight = new WeakMap(), _KupDataTable_theadIntersecting = new WeakMap(), _KupDataTable_tableIntersecting = new WeakMap(), _KupDataTable_isSafariBrowser = new WeakMap(), _KupDataTable_isRestoringState = new WeakMap(), _KupDataTable_globalFilterTimeout = new WeakMap(), _KupDataTable_totalMenuCoords = new WeakMap(), _KupDataTable_clickTimeout = new WeakMap(), _KupDataTable_thRefs = new WeakMap(), _KupDataTable_rowsRefs = new WeakMap(), _KupDataTable_oldWidth = new WeakMap(), _KupDataTable_hold = new WeakMap(), _KupDataTable_interactableDrag = new WeakMap(), _KupDataTable_interactableDrop = new WeakMap(), _KupDataTable_interactableResize = new WeakMap(), _KupDataTable_interactableTouch = new WeakMap(), _KupDataTable_dropareaRef = new WeakMap(), _KupDataTable_removeDropareaRef = new WeakMap(), _KupDataTable_groupsDropareaRef = new WeakMap(), _KupDataTable_clickCb = new WeakMap(), _KupDataTable_clickCbCustomPanel = new WeakMap(), _KupDataTable_clickCbDropCard = new WeakMap(), _KupDataTable_resizeTimeout = new WeakMap(), _KupDataTable_columnMenuInstance = new WeakMap(), _KupDataTable_filtersColumnMenuInstance = new WeakMap(), _KupDataTable_filtersRowsInstance = new WeakMap(), _KupDataTable_detailCard = new WeakMap(), _KupDataTable_insertCard = new WeakMap(), _KupDataTable_confirmDeleteCard = new WeakMap(), _KupDataTable_confirmDeleteDialog = new WeakMap(), _KupDataTable_columnMenuCard = new WeakMap(), _KupDataTable_columnDropCard = new WeakMap(), _KupDataTable_columnDropCardAnchor = new WeakMap(), _KupDataTable_insertCount = new WeakMap(), _KupDataTable_BUTTON_CANCEL_ID = new WeakMap(), _KupDataTable_BUTTON_SUBMIT_ID = new WeakMap(), _KupDataTable_FIELDS_FORM_ID = new WeakMap(), _KupDataTable_MESSAGE_ID = new WeakMap(), _KupDataTable_MESSAGE_WRAPPER_ID = new WeakMap(), _KupDataTable_INSERT_PREFIX = new WeakMap(), _KupDataTable_stickyHeaderPosition = new WeakMap(), _KupDataTable_FONTSIZE_CODES = new WeakMap(), _KupDataTable_FONTSIZE_DECODES = new WeakMap(), _KupDataTable_FONTSIZE_ICONS = new WeakMap(), _KupDataTable_DENSITY_DECODES = new WeakMap(), _KupDataTable_DENSITY_ICONS = new WeakMap(), _KupDataTable_GRID_CODES = new WeakMap(), _KupDataTable_GRID_DECODES = new WeakMap(), _KupDataTable_GRID_ICONS = new WeakMap(), _KupDataTable_instances = new WeakSet(), _KupDataTable_closeDropCard = function _KupDataTable_closeDropCard() {
+  __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dynamicPosition.stop(__classPrivateFieldGet$2(this, _KupDataTable_columnDropCard, "f"));
+  __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").removeClickCallback(__classPrivateFieldGet$2(this, _KupDataTable_clickCbDropCard, "f"));
+  __classPrivateFieldGet$2(this, _KupDataTable_columnDropCard, "f").remove();
+  __classPrivateFieldSet$2(this, _KupDataTable_columnDropCard, null, "f");
 }, _KupDataTable_createDropCard = function _KupDataTable_createDropCard(starter, receiving) {
-  if (__classPrivateFieldGet$1(this, _KupDataTable_columnDropCard, "f")) {
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_closeDropCard).call(this);
+  if (__classPrivateFieldGet$2(this, _KupDataTable_columnDropCard, "f")) {
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_closeDropCard).call(this);
   }
-  __classPrivateFieldSet$1(this, _KupDataTable_columnDropCard, document.createElement('kup-card'), "f");
-  __classPrivateFieldGet$1(this, _KupDataTable_columnDropCard, "f").data = {
+  __classPrivateFieldSet$2(this, _KupDataTable_columnDropCard, document.createElement('kup-card'), "f");
+  __classPrivateFieldGet$2(this, _KupDataTable_columnDropCard, "f").data = {
     options: {
       data: this.data,
       enableFormula: this.enableColumnsFormula,
@@ -9372,46 +9402,46 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       receivingColumn: receiving,
       starterColumn: starter,
       formulaCb: () => {
-        __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_closeDropCard).call(this);
+        __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_closeDropCard).call(this);
         this.refresh();
       },
       mergeCb: () => {
         this.newColumn(KupDataNewColumnTypes.CONCATENATE, {
           columns: [receiving.name, starter.name],
         });
-        __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_closeDropCard).call(this);
+        __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_closeDropCard).call(this);
       },
       moveCb: () => {
-        __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_handleColumnSort).call(this, receiving, starter);
-        __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_closeDropCard).call(this);
+        __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_handleColumnSort).call(this, receiving, starter);
+        __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_closeDropCard).call(this);
       },
     },
   };
-  __classPrivateFieldGet$1(this, _KupDataTable_columnDropCard, "f").layoutFamily = KupCardFamily.BUILT_IN;
-  __classPrivateFieldGet$1(this, _KupDataTable_columnDropCard, "f").layoutNumber = 3;
-  __classPrivateFieldGet$1(this, _KupDataTable_columnDropCard, "f").isMenu = true;
-  __classPrivateFieldGet$1(this, _KupDataTable_columnDropCard, "f").sizeX = '280px';
-  __classPrivateFieldGet$1(this, _KupDataTable_columnDropCard, "f").sizeY = 'auto';
-  __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dynamicPosition.register(__classPrivateFieldGet$1(this, _KupDataTable_columnDropCard, "f"), __classPrivateFieldGet$1(this, _KupDataTable_columnDropCardAnchor, "f"), 0, KupDynamicPositionPlacement.AUTO, true);
-  __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dynamicPosition.start(__classPrivateFieldGet$1(this, _KupDataTable_columnDropCard, "f"));
-  __classPrivateFieldSet$1(this, _KupDataTable_clickCbDropCard, {
+  __classPrivateFieldGet$2(this, _KupDataTable_columnDropCard, "f").layoutFamily = KupCardFamily.BUILT_IN;
+  __classPrivateFieldGet$2(this, _KupDataTable_columnDropCard, "f").layoutNumber = 3;
+  __classPrivateFieldGet$2(this, _KupDataTable_columnDropCard, "f").isMenu = true;
+  __classPrivateFieldGet$2(this, _KupDataTable_columnDropCard, "f").sizeX = '280px';
+  __classPrivateFieldGet$2(this, _KupDataTable_columnDropCard, "f").sizeY = 'auto';
+  __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dynamicPosition.register(__classPrivateFieldGet$2(this, _KupDataTable_columnDropCard, "f"), __classPrivateFieldGet$2(this, _KupDataTable_columnDropCardAnchor, "f"), 0, KupDynamicPositionPlacement.AUTO, true);
+  __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dynamicPosition.start(__classPrivateFieldGet$2(this, _KupDataTable_columnDropCard, "f"));
+  __classPrivateFieldSet$2(this, _KupDataTable_clickCbDropCard, {
     cb: () => {
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_closeDropCard).call(this);
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_closeDropCard).call(this);
     },
-    el: __classPrivateFieldGet$1(this, _KupDataTable_columnDropCard, "f"),
+    el: __classPrivateFieldGet$2(this, _KupDataTable_columnDropCard, "f"),
   }, "f");
-  __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").addClickCallback(__classPrivateFieldGet$1(this, _KupDataTable_clickCbDropCard, "f"), true);
-  __classPrivateFieldGet$1(this, _KupDataTable_columnDropCard, "f").menuVisible = true;
+  __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").addClickCallback(__classPrivateFieldGet$2(this, _KupDataTable_clickCbDropCard, "f"), true);
+  __classPrivateFieldGet$2(this, _KupDataTable_columnDropCard, "f").menuVisible = true;
 }, _KupDataTable_calculateData = function _KupDataTable_calculateData() {
   if (!this.transpose) {
     // restore
-    if (__classPrivateFieldGet$1(this, _KupDataTable_originalData, "f")) {
-      this.data = Object.assign({}, __classPrivateFieldGet$1(this, _KupDataTable_originalData, "f"));
+    if (__classPrivateFieldGet$2(this, _KupDataTable_originalData, "f")) {
+      this.data = Object.assign({}, __classPrivateFieldGet$2(this, _KupDataTable_originalData, "f"));
     }
   }
   else {
     // transpose
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_setTransposedData).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_setTransposedData).call(this);
   }
 }, _KupDataTable_getRow = function _KupDataTable_getRow(id) {
   let row = null;
@@ -9428,26 +9458,26 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       row = rows.find((row) => row.id === id);
     }
   };
-  if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this) && typeof id === 'string') {
-    __classPrivateFieldGet$1(this, _KupDataTable_paginatedRows, "f").forEach((row) => search(row.group.children));
+  if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this) && typeof id === 'string') {
+    __classPrivateFieldGet$2(this, _KupDataTable_paginatedRows, "f").forEach((row) => search(row.group.children));
   }
   else {
-    test(__classPrivateFieldGet$1(this, _KupDataTable_rows, "f"));
+    test(__classPrivateFieldGet$2(this, _KupDataTable_rows, "f"));
   }
   return row;
 }, _KupDataTable_getTransposedData = function _KupDataTable_getTransposedData(column) {
   if (column) {
     this.filters = {};
   }
-  return __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").data.transpose(this.data, column);
+  return __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").data.transpose(this.data, column);
 }, _KupDataTable_setTransposedData = function _KupDataTable_setTransposedData() {
   // transpose
-  __classPrivateFieldSet$1(this, _KupDataTable_originalData, Object.assign({}, this.data), "f");
+  __classPrivateFieldSet$2(this, _KupDataTable_originalData, Object.assign({}, this.data), "f");
   if (this.data.columns.length > 0) {
-    this.data = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getTransposedData).call(this, this.data.columns[0].name);
+    this.data = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getTransposedData).call(this, this.data.columns[0].name);
   }
 }, _KupDataTable_switchToTotalsMatrix = function _KupDataTable_switchToTotalsMatrix() {
-  if (__classPrivateFieldGet$1(this, _KupDataTable_rows, "f").length === 0 || !__classPrivateFieldGet$1(this, _KupDataTable_rows, "f")[0].group)
+  if (__classPrivateFieldGet$2(this, _KupDataTable_rows, "f").length === 0 || !__classPrivateFieldGet$2(this, _KupDataTable_rows, "f")[0].group)
     return;
   // calc totals matrix data
   const totalsMatrixData = {};
@@ -9455,9 +9485,9 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   // note that the sorting of the columns depends on the totals selection
   // the first column is the one that is selected first in the totals, and so on...
   const ids = [];
-  ids.push(__classPrivateFieldGet$1(this, _KupDataTable_rows, "f")[0].group.column);
-  Object.keys(__classPrivateFieldGet$1(this, _KupDataTable_rows, "f")[0].group.totals).forEach((columnKey) => {
-    if (__classPrivateFieldGet$1(this, _KupDataTable_rows, "f")[0].group.column !== columnKey)
+  ids.push(__classPrivateFieldGet$2(this, _KupDataTable_rows, "f")[0].group.column);
+  Object.keys(__classPrivateFieldGet$2(this, _KupDataTable_rows, "f")[0].group.totals).forEach((columnKey) => {
+    if (__classPrivateFieldGet$2(this, _KupDataTable_rows, "f")[0].group.column !== columnKey)
       ids.push(columnKey);
   });
   // calc columns
@@ -9487,7 +9517,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
                 totalMode + ' ' + currentColumn.title;
             }
           }
-          __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_setObjForTotalsMatrix).call(this, currentColumn, this.totals);
+          __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_setObjForTotalsMatrix).call(this, currentColumn, this.totals);
         }
         totalsMatrixColumns.push(currentColumn);
       }
@@ -9498,15 +9528,15 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   // calc rows
   const totalsMatrixRows = [];
   let index = 0;
-  __classPrivateFieldGet$1(this, _KupDataTable_rows, "f").forEach((row) => {
+  __classPrivateFieldGet$2(this, _KupDataTable_rows, "f").forEach((row) => {
     const cells = {};
     ids.forEach((id) => {
       let totalValue = row.group.totals[id];
       if (!totalValue) {
         totalValue = row.group.id;
       }
-      if (__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dates.isValid(totalValue, KupDatesFormats.ISO_DATE)) {
-        totalValue = __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dates.format(totalValue);
+      if (__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dates.isValid(totalValue, KupDatesFormats.ISO_DATE)) {
+        totalValue = __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dates.format(totalValue);
       }
       cells[id] = {
         value: String(totalValue),
@@ -9546,13 +9576,13 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
 }, _KupDataTable_setObjForTotalsMatrix = function _KupDataTable_setObjForTotalsMatrix(column, totals) {
   const obj = column.obj;
   const totalMode = totals[column.name];
-  if (__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isDate(obj)) {
+  if (__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isDate(obj)) {
     // check if min or max totals mode
     if (totalMode === TotalMode.MAX || totalMode === TotalMode.MIN) {
       return;
     }
   }
-  else if (__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isNumber(obj)) {
+  else if (__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isNumber(obj)) {
     // check if percentage
     if (obj.p && obj.p.toUpperCase() === 'P') {
       if (totalMode !== TotalMode.COUNT &&
@@ -9574,20 +9604,20 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   const navBar = document.querySelector('.header');
   const topBar = document.querySelector('.topbar');
   if (navBar) {
-    __classPrivateFieldSet$1(this, _KupDataTable_navBarHeight, navBar.clientHeight, "f");
+    __classPrivateFieldSet$2(this, _KupDataTable_navBarHeight, navBar.clientHeight, "f");
   }
   else {
-    __classPrivateFieldSet$1(this, _KupDataTable_navBarHeight, 0, "f");
+    __classPrivateFieldSet$2(this, _KupDataTable_navBarHeight, 0, "f");
   }
   if (topBar) {
-    __classPrivateFieldSet$1(this, _KupDataTable_navBarHeight, __classPrivateFieldGet$1(this, _KupDataTable_navBarHeight, "f") + topBar.clientHeight, "f");
-  }
-  if (__classPrivateFieldGet$1(this, _KupDataTable_stickyTheadRef, "f")) {
-    __classPrivateFieldGet$1(this, _KupDataTable_stickyTheadRef, "f").style.top = __classPrivateFieldGet$1(this, _KupDataTable_navBarHeight, "f") + 'px';
-    const widthTable = __classPrivateFieldGet$1(this, _KupDataTable_tableAreaRef, "f").offsetWidth;
-    __classPrivateFieldGet$1(this, _KupDataTable_stickyTheadRef, "f").style.maxWidth = widthTable + 'px';
-    const thCollection = __classPrivateFieldGet$1(this, _KupDataTable_theadRef, "f").querySelectorAll('th');
-    const thStickyCollection = __classPrivateFieldGet$1(this, _KupDataTable_stickyTheadRef, "f").querySelectorAll('th-sticky');
+    __classPrivateFieldSet$2(this, _KupDataTable_navBarHeight, __classPrivateFieldGet$2(this, _KupDataTable_navBarHeight, "f") + topBar.clientHeight, "f");
+  }
+  if (__classPrivateFieldGet$2(this, _KupDataTable_stickyTheadRef, "f")) {
+    __classPrivateFieldGet$2(this, _KupDataTable_stickyTheadRef, "f").style.top = __classPrivateFieldGet$2(this, _KupDataTable_navBarHeight, "f") + 'px';
+    const widthTable = __classPrivateFieldGet$2(this, _KupDataTable_tableAreaRef, "f").offsetWidth;
+    __classPrivateFieldGet$2(this, _KupDataTable_stickyTheadRef, "f").style.maxWidth = widthTable + 'px';
+    const thCollection = __classPrivateFieldGet$2(this, _KupDataTable_theadRef, "f").querySelectorAll('th');
+    const thStickyCollection = __classPrivateFieldGet$2(this, _KupDataTable_stickyTheadRef, "f").querySelectorAll('th-sticky');
     for (let i = 0; i < thCollection.length; i++) {
       const widthTH = thCollection[i].offsetWidth;
       thStickyCollection[i].style.width = widthTH + 'px';
@@ -9598,8 +9628,8 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     entries.forEach((entry) => {
       if (entry.target.tagName === 'TR') {
         if (entry.isIntersecting) {
-          __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Last row entering the viewport, loading more elements.');
-          const delta = __classPrivateFieldGet$1(this, _KupDataTable_rows, "f").length - this.currentRowsPerPage;
+          __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Last row entering the viewport, loading more elements.');
+          const delta = __classPrivateFieldGet$2(this, _KupDataTable_rows, "f").length - this.currentRowsPerPage;
           if (delta < this.loadMoreStep) {
             this.currentRowsPerPage += delta;
           }
@@ -9611,41 +9641,41 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       }
       if (entry.target.tagName === 'THEAD') {
         if (entry.isIntersecting) {
-          __classPrivateFieldSet$1(this, _KupDataTable_theadIntersecting, true, "f");
+          __classPrivateFieldSet$2(this, _KupDataTable_theadIntersecting, true, "f");
         }
-        else if (entry.boundingClientRect.bottom > __classPrivateFieldGet$1(this, _KupDataTable_navBarHeight, "f")) {
+        else if (entry.boundingClientRect.bottom > __classPrivateFieldGet$2(this, _KupDataTable_navBarHeight, "f")) {
           //If the thead is not intersecting but it still is inside the viewport, is to be considered intersected
-          __classPrivateFieldSet$1(this, _KupDataTable_theadIntersecting, true, "f");
+          __classPrivateFieldSet$2(this, _KupDataTable_theadIntersecting, true, "f");
         }
         else {
-          __classPrivateFieldSet$1(this, _KupDataTable_theadIntersecting, false, "f");
+          __classPrivateFieldSet$2(this, _KupDataTable_theadIntersecting, false, "f");
         }
       }
       if (entry.target.tagName === 'TABLE') {
         if (entry.isIntersecting) {
-          __classPrivateFieldSet$1(this, _KupDataTable_tableIntersecting, true, "f");
+          __classPrivateFieldSet$2(this, _KupDataTable_tableIntersecting, true, "f");
         }
         else {
-          __classPrivateFieldSet$1(this, _KupDataTable_tableIntersecting, false, "f");
+          __classPrivateFieldSet$2(this, _KupDataTable_tableIntersecting, false, "f");
         }
       }
       if (this.tableHeight === undefined &&
         this.tableWidth === undefined &&
         this.headerIsPersistent) {
-        __classPrivateFieldGet$1(this, _KupDataTable_stickyHeaderPosition, "f").call(this);
+        __classPrivateFieldGet$2(this, _KupDataTable_stickyHeaderPosition, "f").call(this);
       }
     });
   };
   const options = {
     threshold: 0,
-    rootMargin: '-' + __classPrivateFieldGet$1(this, _KupDataTable_navBarHeight, "f") + 'px 0px 0px 0px',
+    rootMargin: '-' + __classPrivateFieldGet$2(this, _KupDataTable_navBarHeight, "f") + 'px 0px 0px 0px',
   };
-  __classPrivateFieldSet$1(this, _KupDataTable_intObserver, new IntersectionObserver(callback, options), "f");
+  __classPrivateFieldSet$2(this, _KupDataTable_intObserver, new IntersectionObserver(callback, options), "f");
 }, _KupDataTable_didLoadInteractables = function _KupDataTable_didLoadInteractables() {
-  __classPrivateFieldGet$1(this, _KupDataTable_interactableTouch, "f").push(__classPrivateFieldGet$1(this, _KupDataTable_tableRef, "f"));
+  __classPrivateFieldGet$2(this, _KupDataTable_interactableTouch, "f").push(__classPrivateFieldGet$2(this, _KupDataTable_tableRef, "f"));
   const tapCb = (e) => {
-    if (__classPrivateFieldGet$1(this, _KupDataTable_hold, "f")) {
-      __classPrivateFieldSet$1(this, _KupDataTable_hold, false, "f");
+    if (__classPrivateFieldGet$2(this, _KupDataTable_hold, "f")) {
+      __classPrivateFieldSet$2(this, _KupDataTable_hold, false, "f");
       return;
     }
     switch (e.button) {
@@ -9657,11 +9687,11 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
         for (const key in e) {
           clone[key] = e[key];
         }
-        __classPrivateFieldGet$1(this, _KupDataTable_clickTimeout, "f").push(setTimeout(() => {
+        __classPrivateFieldGet$2(this, _KupDataTable_clickTimeout, "f").push(setTimeout(() => {
           this.kupDataTableClick.emit({
             comp: this,
             id: this.rootElement.id,
-            details: __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_clickHandler).call(this, clone),
+            details: __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_clickHandler).call(this, clone),
           });
         }, 300));
         break;
@@ -9670,7 +9700,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
         this.kupDataTableContextMenu.emit({
           comp: this,
           id: this.rootElement.id,
-          details: __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_contextMenuHandler).call(this, e),
+          details: __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_contextMenuHandler).call(this, e),
         });
         break;
     }
@@ -9679,61 +9709,61 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     switch (e.button) {
       // left click
       case 0:
-        for (let index = 0; index < __classPrivateFieldGet$1(this, _KupDataTable_clickTimeout, "f").length; index++) {
-          clearTimeout(__classPrivateFieldGet$1(this, _KupDataTable_clickTimeout, "f")[index]);
-          __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Cleared clickHandler timeout(' +
-            __classPrivateFieldGet$1(this, _KupDataTable_clickTimeout, "f")[index] +
+        for (let index = 0; index < __classPrivateFieldGet$2(this, _KupDataTable_clickTimeout, "f").length; index++) {
+          clearTimeout(__classPrivateFieldGet$2(this, _KupDataTable_clickTimeout, "f")[index]);
+          __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Cleared clickHandler timeout(' +
+            __classPrivateFieldGet$2(this, _KupDataTable_clickTimeout, "f")[index] +
             ').');
         }
-        __classPrivateFieldSet$1(this, _KupDataTable_clickTimeout, [], "f");
+        __classPrivateFieldSet$2(this, _KupDataTable_clickTimeout, [], "f");
         this.kupDataTableDblClick.emit({
           comp: this,
           id: this.rootElement.id,
-          details: __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_dblClickHandler).call(this, e),
+          details: __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_dblClickHandler).call(this, e),
         });
         break;
     }
   };
   const holdCb = (e) => {
     if (e.pointerType === 'pen' || e.pointerType === 'touch') {
-      __classPrivateFieldSet$1(this, _KupDataTable_hold, true, "f");
+      __classPrivateFieldSet$2(this, _KupDataTable_hold, true, "f");
       this.kupDataTableContextMenu.emit({
         comp: this,
         id: this.rootElement.id,
-        details: __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_contextMenuHandler).call(this, e),
+        details: __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_contextMenuHandler).call(this, e),
       });
     }
   };
-  __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").interact.on(__classPrivateFieldGet$1(this, _KupDataTable_tableRef, "f"), KupPointerEventTypes.TAP, tapCb);
-  __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").interact.on(__classPrivateFieldGet$1(this, _KupDataTable_tableRef, "f"), KupPointerEventTypes.DOUBLETAP, doubletapCb);
-  __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").interact.on(__classPrivateFieldGet$1(this, _KupDataTable_tableRef, "f"), KupPointerEventTypes.HOLD, holdCb);
+  __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").interact.on(__classPrivateFieldGet$2(this, _KupDataTable_tableRef, "f"), KupPointerEventTypes.TAP, tapCb);
+  __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").interact.on(__classPrivateFieldGet$2(this, _KupDataTable_tableRef, "f"), KupPointerEventTypes.DOUBLETAP, doubletapCb);
+  __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").interact.on(__classPrivateFieldGet$2(this, _KupDataTable_tableRef, "f"), KupPointerEventTypes.HOLD, holdCb);
 }, _KupDataTable_didRenderInteractables = function _KupDataTable_didRenderInteractables() {
   if (this.showGroups) {
-    if (!__classPrivateFieldGet$1(this, _KupDataTable_interactableDrop, "f").includes(__classPrivateFieldGet$1(this, _KupDataTable_groupsDropareaRef, "f"))) {
-      __classPrivateFieldGet$1(this, _KupDataTable_interactableDrop, "f").push(__classPrivateFieldGet$1(this, _KupDataTable_groupsDropareaRef, "f"));
-      __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").interact.dropzone(__classPrivateFieldGet$1(this, _KupDataTable_groupsDropareaRef, "f"), {
+    if (!__classPrivateFieldGet$2(this, _KupDataTable_interactableDrop, "f").includes(__classPrivateFieldGet$2(this, _KupDataTable_groupsDropareaRef, "f"))) {
+      __classPrivateFieldGet$2(this, _KupDataTable_interactableDrop, "f").push(__classPrivateFieldGet$2(this, _KupDataTable_groupsDropareaRef, "f"));
+      __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").interact.dropzone(__classPrivateFieldGet$2(this, _KupDataTable_groupsDropareaRef, "f"), {
         accept: `[${kupDraggableColumnAttr}]`,
       }, null, {
         drop: (e) => {
           const draggedTh = e.relatedTarget;
           const grouped = getColumnByName(this.getColumns(), draggedTh.dataset.column);
-          __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_handleColumnGroup).call(this, grouped);
-          __classPrivateFieldGet$1(this, _KupDataTable_tableRef, "f").removeAttribute(kupDragActiveAttr);
+          __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_handleColumnGroup).call(this, grouped);
+          __classPrivateFieldGet$2(this, _KupDataTable_tableRef, "f").removeAttribute(kupDragActiveAttr);
         },
       });
     }
   }
   if (this.removableColumns) {
-    if (!__classPrivateFieldGet$1(this, _KupDataTable_interactableDrop, "f").includes(__classPrivateFieldGet$1(this, _KupDataTable_removeDropareaRef, "f"))) {
-      __classPrivateFieldGet$1(this, _KupDataTable_interactableDrop, "f").push(__classPrivateFieldGet$1(this, _KupDataTable_removeDropareaRef, "f"));
-      __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").interact.dropzone(__classPrivateFieldGet$1(this, _KupDataTable_removeDropareaRef, "f"), {
+    if (!__classPrivateFieldGet$2(this, _KupDataTable_interactableDrop, "f").includes(__classPrivateFieldGet$2(this, _KupDataTable_removeDropareaRef, "f"))) {
+      __classPrivateFieldGet$2(this, _KupDataTable_interactableDrop, "f").push(__classPrivateFieldGet$2(this, _KupDataTable_removeDropareaRef, "f"));
+      __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").interact.dropzone(__classPrivateFieldGet$2(this, _KupDataTable_removeDropareaRef, "f"), {
         accept: `[${kupDraggableColumnAttr}]`,
       }, null, {
         drop: (e) => {
           const draggedTh = e.relatedTarget;
           const deleted = getColumnByName(this.getColumns(), draggedTh.dataset.column);
           this.hideColumn(deleted);
-          __classPrivateFieldGet$1(this, _KupDataTable_tableRef, "f").removeAttribute(kupDragActiveAttr);
+          __classPrivateFieldGet$2(this, _KupDataTable_tableRef, "f").removeAttribute(kupDragActiveAttr);
         },
       });
     }
@@ -9763,10 +9793,10 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       const draggable = e.relatedTarget;
       const starter = draggable.kupDragDrop.column;
       const receiving = getColumnByName(this.getColumns(), e.target.dataset.column);
-      __classPrivateFieldSet$1(this, _KupDataTable_columnDropCardAnchor, e.target, "f");
+      __classPrivateFieldSet$2(this, _KupDataTable_columnDropCardAnchor, e.target, "f");
       if (receiving && starter) {
         if (onlySort) {
-          __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_handleColumnSort).call(this, receiving, starter);
+          __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_handleColumnSort).call(this, receiving, starter);
         }
         else if (onlyMerge) {
           this.newColumn(KupDataNewColumnTypes.CONCATENATE, {
@@ -9774,17 +9804,17 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
           });
         }
         else {
-          __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_createDropCard).call(this, starter, receiving);
+          __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_createDropCard).call(this, starter, receiving);
         }
       }
-      __classPrivateFieldGet$1(this, _KupDataTable_tableRef, "f").removeAttribute(kupDragActiveAttr);
+      __classPrivateFieldGet$2(this, _KupDataTable_tableRef, "f").removeAttribute(kupDragActiveAttr);
     };
     const startCb = (e) => {
       const draggable = e.target;
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_hideShowColumnDropArea).call(this, true, draggable);
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_hideShowColumnDropArea).call(this, true, draggable);
     };
     const endCb = () => {
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_hideShowColumnDropArea).call(this, false);
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_hideShowColumnDropArea).call(this, false);
     };
     const dropCallbacks = {
       drop: dropCb,
@@ -9793,14 +9823,14 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       start: startCb,
       end: endCb,
     };
-    for (let index = 0; index < __classPrivateFieldGet$1(this, _KupDataTable_thRefs, "f").length; index++) {
-      const th = __classPrivateFieldGet$1(this, _KupDataTable_thRefs, "f")[index];
-      if (th && !__classPrivateFieldGet$1(this, _KupDataTable_interactableDrag, "f").includes(th)) {
-        __classPrivateFieldGet$1(this, _KupDataTable_interactableDrag, "f").push(th);
-        __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").interact.dropzone(th, {
+    for (let index = 0; index < __classPrivateFieldGet$2(this, _KupDataTable_thRefs, "f").length; index++) {
+      const th = __classPrivateFieldGet$2(this, _KupDataTable_thRefs, "f")[index];
+      if (th && !__classPrivateFieldGet$2(this, _KupDataTable_interactableDrag, "f").includes(th)) {
+        __classPrivateFieldGet$2(this, _KupDataTable_interactableDrag, "f").push(th);
+        __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").interact.dropzone(th, {
           accept: `[${kupDraggableColumnAttr}]`,
         }, null, dropCallbacks);
-        __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").interact.draggable(th, {
+        __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").interact.draggable(th, {
           cursorChecker() {
             return null;
           },
@@ -9820,11 +9850,11 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     const callbacks = {
       move: moveCb,
     };
-    for (let index = 0; index < __classPrivateFieldGet$1(this, _KupDataTable_thRefs, "f").length; index++) {
-      const th = __classPrivateFieldGet$1(this, _KupDataTable_thRefs, "f")[index];
-      if (th && !__classPrivateFieldGet$1(this, _KupDataTable_interactableResize, "f").includes(th)) {
-        __classPrivateFieldGet$1(this, _KupDataTable_interactableResize, "f").push(th);
-        __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").interact.resizable(th, {
+    for (let index = 0; index < __classPrivateFieldGet$2(this, _KupDataTable_thRefs, "f").length; index++) {
+      const th = __classPrivateFieldGet$2(this, _KupDataTable_thRefs, "f")[index];
+      if (th && !__classPrivateFieldGet$2(this, _KupDataTable_interactableResize, "f").includes(th)) {
+        __classPrivateFieldGet$2(this, _KupDataTable_interactableResize, "f").push(th);
+        __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").interact.resizable(th, {
           allowFrom: '.header-cell__drag-handler',
           edges: {
             left: false,
@@ -9838,8 +9868,8 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     }
   }
   if (this.dragEnabled) {
-    for (let index = 0; index < __classPrivateFieldGet$1(this, _KupDataTable_rowsRefs, "f").length; index++) {
-      const row = __classPrivateFieldGet$1(this, _KupDataTable_rowsRefs, "f")[index];
+    for (let index = 0; index < __classPrivateFieldGet$2(this, _KupDataTable_rowsRefs, "f").length; index++) {
+      const row = __classPrivateFieldGet$2(this, _KupDataTable_rowsRefs, "f")[index];
       const dataCb = () => {
         const cellEl = this.rootElement.shadowRoot.querySelector('td:hover');
         return {
@@ -9852,9 +9882,9 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
           selectedRows: this.selectedRows,
         };
       };
-      if (row && !__classPrivateFieldGet$1(this, _KupDataTable_interactableDrag, "f").includes(row)) {
-        __classPrivateFieldGet$1(this, _KupDataTable_interactableDrag, "f").push(row);
-        __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").interact.draggable(row, {
+      if (row && !__classPrivateFieldGet$2(this, _KupDataTable_interactableDrag, "f").includes(row)) {
+        __classPrivateFieldGet$2(this, _KupDataTable_interactableDrag, "f").push(row);
+        __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").interact.draggable(row, {
           allowFrom: 'td',
           cursorChecker() {
             return null;
@@ -9869,11 +9899,11 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     const dataCb = () => {
       const cell = this.rootElement.shadowRoot.querySelector('td:hover');
       if (!cell) {
-        __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").debug.logMessage(this, "Couldn't find cell hovered to retrieve dropzone informations!", KupDebugCategory.WARNING);
+        __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").debug.logMessage(this, "Couldn't find cell hovered to retrieve dropzone informations!", KupDebugCategory.WARNING);
         return;
       }
-      const path = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getEventPath).call(this, cell);
-      const receivingDetails = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getEventDetails).call(this, path);
+      const path = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getEventPath).call(this, cell);
+      const receivingDetails = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getEventDetails).call(this, path);
       return {
         cell: receivingDetails.cell,
         column: receivingDetails.column,
@@ -9881,11 +9911,11 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
         row: receivingDetails.row,
       };
     };
-    for (let index = 0; index < __classPrivateFieldGet$1(this, _KupDataTable_rowsRefs, "f").length; index++) {
-      const row = __classPrivateFieldGet$1(this, _KupDataTable_rowsRefs, "f")[index];
-      if (row && !__classPrivateFieldGet$1(this, _KupDataTable_interactableDrop, "f").includes(row)) {
-        __classPrivateFieldGet$1(this, _KupDataTable_interactableDrop, "f").push(row);
-        __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").interact.dropzone(row, {
+    for (let index = 0; index < __classPrivateFieldGet$2(this, _KupDataTable_rowsRefs, "f").length; index++) {
+      const row = __classPrivateFieldGet$2(this, _KupDataTable_rowsRefs, "f")[index];
+      if (row && !__classPrivateFieldGet$2(this, _KupDataTable_interactableDrop, "f").includes(row)) {
+        __classPrivateFieldGet$2(this, _KupDataTable_interactableDrop, "f").push(row);
+        __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").interact.dropzone(row, {
           accept: `[${kupDraggableCellAttr}]`,
         }, {
           callback: dataCb,
@@ -9899,44 +9929,44 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   if (this.headerIsPersistent &&
     this.tableHeight === undefined &&
     this.tableWidth === undefined) {
-    __classPrivateFieldGet$1(this, _KupDataTable_intObserver, "f").observe(__classPrivateFieldGet$1(this, _KupDataTable_tableRef, "f"));
-    __classPrivateFieldGet$1(this, _KupDataTable_intObserver, "f").observe(__classPrivateFieldGet$1(this, _KupDataTable_theadRef, "f"));
+    __classPrivateFieldGet$2(this, _KupDataTable_intObserver, "f").observe(__classPrivateFieldGet$2(this, _KupDataTable_tableRef, "f"));
+    __classPrivateFieldGet$2(this, _KupDataTable_intObserver, "f").observe(__classPrivateFieldGet$2(this, _KupDataTable_theadRef, "f"));
   }
 }, _KupDataTable_didRenderObservers = function _KupDataTable_didRenderObservers() {
-  if (__classPrivateFieldGet$1(this, _KupDataTable_paginatedRowsLength, "f") < __classPrivateFieldGet$1(this, _KupDataTable_rowsLength, "f") && this.lazyLoadRows) {
-    __classPrivateFieldGet$1(this, _KupDataTable_intObserver, "f").observe(__classPrivateFieldGet$1(this, _KupDataTable_rowsRefs, "f")[__classPrivateFieldGet$1(this, _KupDataTable_paginatedRowsLength, "f") - 1]);
+  if (__classPrivateFieldGet$2(this, _KupDataTable_paginatedRowsLength, "f") < __classPrivateFieldGet$2(this, _KupDataTable_rowsLength, "f") && this.lazyLoadRows) {
+    __classPrivateFieldGet$2(this, _KupDataTable_intObserver, "f").observe(__classPrivateFieldGet$2(this, _KupDataTable_rowsRefs, "f")[__classPrivateFieldGet$2(this, _KupDataTable_paginatedRowsLength, "f") - 1]);
   }
 }, _KupDataTable_didLoadEventHandling = function _KupDataTable_didLoadEventHandling() {
-  __classPrivateFieldGet$1(this, _KupDataTable_tableAreaRef, "f").addEventListener('scroll', () => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_scrollStickyHeader).call(this));
+  __classPrivateFieldGet$2(this, _KupDataTable_tableAreaRef, "f").addEventListener('scroll', () => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_scrollStickyHeader).call(this));
 }, _KupDataTable_scrollStickyHeader = function _KupDataTable_scrollStickyHeader() {
-  if (!__classPrivateFieldGet$1(this, _KupDataTable_stickyTheadRef, "f")) {
+  if (!__classPrivateFieldGet$2(this, _KupDataTable_stickyTheadRef, "f")) {
     return;
   }
-  __classPrivateFieldGet$1(this, _KupDataTable_stickyTheadRef, "f").scrollLeft = __classPrivateFieldGet$1(this, _KupDataTable_tableAreaRef, "f").scrollLeft;
+  __classPrivateFieldGet$2(this, _KupDataTable_stickyTheadRef, "f").scrollLeft = __classPrivateFieldGet$2(this, _KupDataTable_tableAreaRef, "f").scrollLeft;
 }, _KupDataTable_checkScrollOnHover = function _KupDataTable_checkScrollOnHover() {
-  if (!__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").scrollOnHover.isRegistered(__classPrivateFieldGet$1(this, _KupDataTable_tableAreaRef, "f"))) {
+  if (!__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").scrollOnHover.isRegistered(__classPrivateFieldGet$2(this, _KupDataTable_tableAreaRef, "f"))) {
     if (this.scrollOnHover &&
       this.tableHeight === undefined &&
       this.tableWidth === undefined) {
-      __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").scrollOnHover.register(__classPrivateFieldGet$1(this, _KupDataTable_tableAreaRef, "f"));
+      __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").scrollOnHover.register(__classPrivateFieldGet$2(this, _KupDataTable_tableAreaRef, "f"));
     }
   }
   else {
     if (!this.scrollOnHover &&
       (this.tableHeight !== undefined ||
         this.tableWidth !== undefined)) {
-      __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").scrollOnHover.unregister(__classPrivateFieldGet$1(this, _KupDataTable_tableAreaRef, "f"));
+      __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").scrollOnHover.unregister(__classPrivateFieldGet$2(this, _KupDataTable_tableAreaRef, "f"));
     }
   }
 }, _KupDataTable_customizePanelPosition = function _KupDataTable_customizePanelPosition() {
-  if (__classPrivateFieldGet$1(this, _KupDataTable_customizeTopButtonRef, "f") &&
-    !__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dynamicPosition.isRegistered(__classPrivateFieldGet$1(this, _KupDataTable_customizeTopPanelRef, "f"))) {
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dynamicPosition.register(__classPrivateFieldGet$1(this, _KupDataTable_customizeTopPanelRef, "f"), __classPrivateFieldGet$1(this, _KupDataTable_customizeTopButtonRef, "f"), 0, KupDynamicPositionPlacement.BOTTOM, true);
+  if (__classPrivateFieldGet$2(this, _KupDataTable_customizeTopButtonRef, "f") &&
+    !__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dynamicPosition.isRegistered(__classPrivateFieldGet$2(this, _KupDataTable_customizeTopPanelRef, "f"))) {
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dynamicPosition.register(__classPrivateFieldGet$2(this, _KupDataTable_customizeTopPanelRef, "f"), __classPrivateFieldGet$2(this, _KupDataTable_customizeTopButtonRef, "f"), 0, KupDynamicPositionPlacement.BOTTOM, true);
   }
 }, _KupDataTable_rowsPointLength = function _KupDataTable_rowsPointLength() {
-  return __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable__rowsLength).call(this, __classPrivateFieldGet$1(this, _KupDataTable_rows, "f"));
+  return __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable__rowsLength).call(this, __classPrivateFieldGet$2(this, _KupDataTable_rows, "f"));
 }, _KupDataTable_paginatedRowsPointLength = function _KupDataTable_paginatedRowsPointLength() {
-  return __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable__rowsLength).call(this, __classPrivateFieldGet$1(this, _KupDataTable_paginatedRows, "f"));
+  return __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable__rowsLength).call(this, __classPrivateFieldGet$2(this, _KupDataTable_paginatedRows, "f"));
 }, _KupDataTable__rowsLength = function _KupDataTable__rowsLength(r) {
   if (r == null) {
     return 0;
@@ -9949,14 +9979,14 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     }
     count += 1;
     if (row.group != null) {
-      count += __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable__rowsLength).call(this, row.group.children);
+      count += __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable__rowsLength).call(this, row.group.children);
     }
   }
   return count;
 }, _KupDataTable_setDynPosElements = function _KupDataTable_setDynPosElements() {
   // Column menu
-  if (__classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f") && __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").data) {
-    __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").data = __classPrivateFieldGet$1(this, _KupDataTable_columnMenuInstance, "f").prepData(this, getColumnByName(this.getVisibleColumns(), this.columnMenuAnchor), __classPrivateFieldGet$1(this, _KupDataTable_columnMenuCard, "f").data);
+  if (__classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f") && __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").data) {
+    __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").data = __classPrivateFieldGet$2(this, _KupDataTable_columnMenuInstance, "f").prepData(this, getColumnByName(this.getVisibleColumns(), this.columnMenuAnchor), __classPrivateFieldGet$2(this, _KupDataTable_columnMenuCard, "f").data);
   }
 }, _KupDataTable_getEventPath = function _KupDataTable_getEventPath(currentEl) {
   const path = [];
@@ -9991,7 +10021,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     return undefined;
   }
 }, _KupDataTable_rowDetail = function _KupDataTable_rowDetail(row, x, y) {
-  const transposedData = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getTransposedData).call(this);
+  const transposedData = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getTransposedData).call(this);
   const cardData = {
     button: [
       {
@@ -10020,7 +10050,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
         showHeader: false,
       },
     ],
-    text: [__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.DETAIL)],
+    text: [__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.DETAIL)],
   };
   const columns = cardData.datatable[0].data.columns;
   const rows = cardData.datatable[0].data.rows;
@@ -10044,7 +10074,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     currentColumn.visible = true;
   }
   else {
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Invalid column name on row ID (' +
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Invalid column name on row ID (' +
       row.id +
       "), couldn't set current record!", KupDebugCategory.WARNING);
   }
@@ -10053,7 +10083,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   for (let index = 0; index < rows.length; index++) {
     const column = this.data.columns.find((x) => x.name === rows[index].transposedColumnName);
     if (!column) {
-      __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Column not found on row name (' + column + ')!', KupDebugCategory.WARNING);
+      __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").debug.logMessage(this, 'Column not found on row name (' + column + ')!', KupDebugCategory.WARNING);
       return;
     }
     const editable = rows[index].cells[row.id].isEditable
@@ -10077,8 +10107,8 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
           resource: editable ? 'edit-key' : 'key-variant',
         },
         title: editable
-          ? __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.EDITABLE_KEY)
-          : __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.KEY),
+          ? __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.EDITABLE_KEY)
+          : __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.KEY),
         value: editable ? 'edit-key' : 'key-variant',
       };
     }
@@ -10093,7 +10123,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
           color: `var(${KupThemeColorValues.TEXT})`,
           resource: 'pencil',
         },
-        title: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.EDITABLE_FIELD),
+        title: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.EDITABLE_FIELD),
         value: 'pencil',
       };
     }
@@ -10115,36 +10145,35 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     }
     rows[index].cells[iconColumn.toUpperCase()] = iconCell;
   }
-  if (!__classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f")) {
-    __classPrivateFieldSet$1(this, _KupDataTable_detailCard, document.createElement('kup-card'), "f");
-    __classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f").layoutFamily = KupCardFamily.DIALOG;
-    __classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f").layoutNumber = 4;
-    __classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f").sizeX = 'auto';
-    __classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f").sizeY = 'auto';
+  if (!__classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f")) {
+    __classPrivateFieldSet$2(this, _KupDataTable_detailCard, document.createElement('kup-card'), "f");
+    __classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f").layoutFamily = KupCardFamily.DIALOG;
+    __classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f").layoutNumber = 4;
+    __classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f").sizeX = 'auto';
+    __classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f").sizeY = 'auto';
   }
   else {
-    const children = Array.prototype.slice.call(__classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f").children, 0);
+    const children = Array.prototype.slice.call(__classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f").children, 0);
     for (let index = 0; index < children.length; index++) {
       children[index].remove();
     }
   }
-  __classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f").data = cardData;
-  __classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f").style.position = 'fixed';
-  __classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f").style.left = '0';
-  __classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f").style.top = '0';
-  __classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f").setAttribute('data-x', x.toString());
-  __classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f").setAttribute('data-y', y.toString());
-  __classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f").style.transform = 'translate(' + x + 'px,' + y + 'px)';
-  this.rootElement.shadowRoot.append(__classPrivateFieldGet$1(this, _KupDataTable_detailCard, "f"));
+  __classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f").data = cardData;
+  __classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f").style.position = 'fixed';
+  __classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f").style.left = '0';
+  __classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f").style.top = '0';
+  __classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f").setAttribute('data-x', x.toString());
+  __classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f").setAttribute('data-y', y.toString());
+  __classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f").style.transform = 'translate(' + x + 'px,' + y + 'px)';
+  this.rootElement.shadowRoot.append(__classPrivateFieldGet$2(this, _KupDataTable_detailCard, "f"));
 }, _KupDataTable_rowInsertForm = function _KupDataTable_rowInsertForm() {
   const CARD_WIDTH = 400;
   const CARD_HEIGHT = 400;
-  __classPrivateFieldSet$1(this, _KupDataTable_insertCard, document.createElement('kup-card'), "f");
-  __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").showModal = true;
-  __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").layoutFamily = KupCardFamily.FREE;
-  __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").layoutNumber = 1;
-  __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").sizeX = CARD_WIDTH + 'px';
-  __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").sizeY = CARD_HEIGHT + 'px';
+  __classPrivateFieldSet$2(this, _KupDataTable_insertCard, document.createElement('kup-card'), "f");
+  __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").layoutFamily = KupCardFamily.FREE;
+  __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").layoutNumber = 1;
+  __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").sizeX = CARD_WIDTH + 'px';
+  __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").sizeY = CARD_HEIGHT + 'px';
   const style = document.createElement('style');
   style.innerText =
     'kup-form { max-height: 40vh; overflow: auto; } .page-wrapper { display: grid; } ' +
@@ -10152,24 +10181,24 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       '.message-wrapper { display: none; justify-content: start; padding-top: 5px; padding-bottom: 5px; } ' +
       '.errorIcon { --kup-icon-color: var(--kup-danger-color); } ' +
       '.message { background-color: var(--kup-danger-color); color: white; padding: 3px; } ';
-  __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").append(style);
+  __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").append(style);
   const pageWrapper = document.createElement('div');
   pageWrapper.className = 'page-wrapper';
   const buttonWrapper = document.createElement('div');
   buttonWrapper.className = 'button-wrapper';
   const cancel = document.createElement('kup-button');
   const confirm = document.createElement('kup-button');
-  cancel.id = __classPrivateFieldGet$1(this, _KupDataTable_BUTTON_CANCEL_ID, "f");
+  cancel.id = __classPrivateFieldGet$2(this, _KupDataTable_BUTTON_CANCEL_ID, "f");
   cancel.icon = 'clear';
-  cancel.label = __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.ABORT);
+  cancel.label = __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.ABORT);
   cancel.styling = FButtonStyling.FLAT;
   cancel.addEventListener('kup-button-click', () => {
-    __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").remove();
-    __classPrivateFieldSet$1(this, _KupDataTable_insertCard, null, "f");
+    __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").remove();
+    __classPrivateFieldSet$2(this, _KupDataTable_insertCard, null, "f");
   });
-  confirm.id = __classPrivateFieldGet$1(this, _KupDataTable_BUTTON_SUBMIT_ID, "f");
+  confirm.id = __classPrivateFieldGet$2(this, _KupDataTable_BUTTON_SUBMIT_ID, "f");
   confirm.icon = 'check';
-  confirm.label = __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.CONFIRM);
+  confirm.label = __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.CONFIRM);
   let innerComp = document.createElement('kup-spinner');
   innerComp.slot = 'spinner';
   innerComp.dimensions = '0.6em';
@@ -10188,7 +10217,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   buttonWrapper.append(cancel);
   buttonWrapper.append(confirm);
   const form = document.createElement('kup-form');
-  form.id = __classPrivateFieldGet$1(this, _KupDataTable_FIELDS_FORM_ID, "f");
+  form.id = __classPrivateFieldGet$2(this, _KupDataTable_FIELDS_FORM_ID, "f");
   const row = {
     cells: {},
     id: '0',
@@ -10208,7 +10237,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   };
   const messageWrapper = document.createElement('div');
   messageWrapper.className = 'message-wrapper';
-  messageWrapper.id = __classPrivateFieldGet$1(this, _KupDataTable_MESSAGE_WRAPPER_ID, "f");
+  messageWrapper.id = __classPrivateFieldGet$2(this, _KupDataTable_MESSAGE_WRAPPER_ID, "f");
   const icon = document.createElement('kup-image');
   icon.className = 'errorIcon';
   icon.resource = 'cancel';
@@ -10217,54 +10246,43 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   messageWrapper.append(icon);
   const message = document.createElement('span');
   message.className = 'message';
-  message.id = __classPrivateFieldGet$1(this, _KupDataTable_MESSAGE_ID, "f");
+  message.id = __classPrivateFieldGet$2(this, _KupDataTable_MESSAGE_ID, "f");
   let msg = '';
   message.innerText = msg;
   messageWrapper.append(message);
   pageWrapper.append(messageWrapper);
   pageWrapper.append(form);
   pageWrapper.append(buttonWrapper);
-  __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").append(pageWrapper);
-  __classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f").data = {};
-  this.rootElement.shadowRoot.append(__classPrivateFieldGet$1(this, _KupDataTable_insertCard, "f"));
+  __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").append(pageWrapper);
+  __classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f").data = {};
+  this.rootElement.shadowRoot.append(__classPrivateFieldGet$2(this, _KupDataTable_insertCard, "f"));
 }, _KupDataTable_rowsDelete = function _KupDataTable_rowsDelete() {
   const createDeleteCard = () => {
-    const CARD_WIDTH = 250;
-    const CARD_HEIGHT = 200;
-    __classPrivateFieldSet$1(this, _KupDataTable_confirmDeleteCard, document.createElement('kup-card'), "f");
-    __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").showModal = true;
-    __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").layoutFamily = KupCardFamily.FREE;
-    __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").layoutNumber = 1;
-    __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").sizeX = CARD_WIDTH + 'px';
-    __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").sizeY = CARD_HEIGHT + 'px';
+    __classPrivateFieldSet$2(this, _KupDataTable_confirmDeleteDialog, document.createElement('kup-dialog'), "f");
+    __classPrivateFieldSet$2(this, _KupDataTable_confirmDeleteCard, document.createElement('kup-card'), "f");
+    __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f").layoutFamily = KupCardFamily.FREE;
+    __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f").layoutNumber = 1;
+    __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f").sizeX = 'auto';
+    __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f").sizeY = 'auto';
     const style = document.createElement('style');
     style.innerText =
       '.button-wrapper, .message-wrapper { display: flex; justify-content: space-around; z-index: var(--kup-card-zindex); } .message-wrapper { padding-bottom: 20px; }';
     const messageWrapper = document.createElement('div');
     messageWrapper.className = 'message-wrapper';
-    messageWrapper.id = __classPrivateFieldGet$1(this, _KupDataTable_MESSAGE_WRAPPER_ID, "f");
+    messageWrapper.id = __classPrivateFieldGet$2(this, _KupDataTable_MESSAGE_WRAPPER_ID, "f");
     const message = document.createElement('span');
     message.className = 'message';
-    message.id = __classPrivateFieldGet$1(this, _KupDataTable_MESSAGE_ID, "f");
-    let msg = __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.CONFIRM_DELETE_X_ROWS);
+    message.id = __classPrivateFieldGet$2(this, _KupDataTable_MESSAGE_ID, "f");
+    let msg = __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.CONFIRM_DELETE_X_ROWS);
     msg = msg.replace('{0}', this.selectedRows.length + '');
     message.innerText = msg;
     messageWrapper.append(message);
     const buttonWrapper = document.createElement('div');
     buttonWrapper.className = 'button-wrapper';
-    const cancel = document.createElement('kup-button');
     const confirm = document.createElement('kup-button');
-    cancel.id = __classPrivateFieldGet$1(this, _KupDataTable_BUTTON_CANCEL_ID, "f");
-    cancel.icon = 'clear';
-    cancel.label = __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.ABORT);
-    cancel.styling = FButtonStyling.FLAT;
-    cancel.addEventListener('kup-button-click', () => {
-      __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").remove();
-      __classPrivateFieldSet$1(this, _KupDataTable_confirmDeleteCard, null, "f");
-    });
-    confirm.id = __classPrivateFieldGet$1(this, _KupDataTable_BUTTON_SUBMIT_ID, "f");
+    confirm.id = __classPrivateFieldGet$2(this, _KupDataTable_BUTTON_SUBMIT_ID, "f");
     confirm.icon = 'check';
-    confirm.label = __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.CONFIRM);
+    confirm.label = __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.CONFIRM);
     let innerComp = document.createElement('kup-spinner');
     innerComp.slot = 'spinner';
     innerComp.dimensions = '0.6em';
@@ -10272,25 +10290,24 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     confirm.appendChild(innerComp);
     confirm.addEventListener('kup-button-click', () => {
       confirm.showSpinner = true;
-      cancel.disabled = true;
       this.kupDeleteRow.emit({
         comp: this,
         id: this.rootElement.id,
         selectedRows: this.selectedRows,
       });
     });
-    buttonWrapper.append(cancel);
     buttonWrapper.append(confirm);
-    __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").append(style);
-    __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").append(messageWrapper);
-    __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").append(buttonWrapper);
-    __classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f").data = {};
-    this.rootElement.shadowRoot.append(__classPrivateFieldGet$1(this, _KupDataTable_confirmDeleteCard, "f"));
+    __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f").append(style);
+    __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f").append(messageWrapper);
+    __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f").append(buttonWrapper);
+    __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f").data = {};
+    __classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteDialog, "f").append(__classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteCard, "f"));
+    document.querySelector('body').append(__classPrivateFieldGet$2(this, _KupDataTable_confirmDeleteDialog, "f"));
   };
   const insertRowsIds = [];
   const startingRows = [];
   this.selectedRows.forEach((row) => {
-    if (row.id.indexOf(__classPrivateFieldGet$1(this, _KupDataTable_INSERT_PREFIX, "f")) > -1) {
+    if (row.id.indexOf(__classPrivateFieldGet$2(this, _KupDataTable_INSERT_PREFIX, "f")) > -1) {
       insertRowsIds.push(row.id);
     }
     else {
@@ -10395,15 +10412,15 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     tr: tr ? tr : null,
   };
 }, _KupDataTable_clickHandler = function _KupDataTable_clickHandler(e) {
-  const details = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getEventDetails).call(this, __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getEventPath).call(this, e.target), e);
+  const details = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getEventDetails).call(this, __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getEventPath).call(this, e.target), e);
   if (details.area === 'header') {
     if (details.th && details.column) {
       if (details.filterRemove) {
-        __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_onRemoveFilter).call(this, details.column);
+        __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_onRemoveFilter).call(this, details.column);
         return details;
       }
       else if (this.sortEnabled) {
-        __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_onColumnSort).call(this, e, details.column.name);
+        __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_onColumnSort).call(this, e, details.column.name);
         return details;
       }
     }
@@ -10418,22 +10435,22 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       }
       details.tr.classList.add('focus');
       if (e.ctrlKey || e.metaKey) {
-        __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_rowDetail).call(this, Object.assign({}, details.row), e.clientX, e.clientY);
+        __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_rowDetail).call(this, Object.assign({}, details.row), e.clientX, e.clientY);
         return details;
       }
     }
     if (details.tr && details.row && details.isGroupRow) {
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_onRowExpand).call(this, details.row);
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_onRowExpand).call(this, details.row);
       return details;
     }
     if (details.td && details.row && !details.textfield) {
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_onRowClick).call(this, details.row, details.td, true);
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_onRowClick).call(this, details.row, details.td, true);
       return details;
     }
   }
   return details;
 }, _KupDataTable_contextMenuHandler = function _KupDataTable_contextMenuHandler(e) {
-  const details = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getEventDetails).call(this, __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getEventPath).call(this, e.target), e);
+  const details = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getEventDetails).call(this, __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getEventPath).call(this, e.target), e);
   if (details.area === 'header') {
     if (details.th && details.column) {
       this.openColumnMenu(details.column.name);
@@ -10442,35 +10459,35 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   }
   else if (details.area === 'footer') {
     if (details.td && details.column) {
-      __classPrivateFieldSet$1(this, _KupDataTable_totalMenuCoords, { x: e.clientX, y: e.clientY }, "f");
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_onTotalMenuOpen).call(this, details.column);
+      __classPrivateFieldSet$2(this, _KupDataTable_totalMenuCoords, { x: e.clientX, y: e.clientY }, "f");
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_onTotalMenuOpen).call(this, details.column);
       return details;
     }
   }
   return details;
 }, _KupDataTable_dblClickHandler = function _KupDataTable_dblClickHandler(e) {
-  const details = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getEventDetails).call(this, __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getEventPath).call(this, e.target), e);
+  const details = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getEventDetails).call(this, __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getEventPath).call(this, e.target), e);
   if (details.area === 'body') {
     if (this.selection == SelectionMode.MULTIPLE) {
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_resetSelectedRows).call(this);
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_resetSelectedRows).call(this);
     }
     if (this.selection == SelectionMode.SINGLE ||
       this.selection == SelectionMode.MULTIPLE) {
-      __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_onRowClick).call(this, details.row, details.td, false);
+      __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_onRowClick).call(this, details.row, details.td, false);
     }
   }
   return details;
 }, _KupDataTable_initRows = function _KupDataTable_initRows() {
-  __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_filterRows).call(this);
-  __classPrivateFieldSet$1(this, _KupDataTable_footer, calcTotals(normalizeRows(this.getColumns(), __classPrivateFieldGet$1(this, _KupDataTable_rows, "f")), this.totals), "f");
-  __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_groupRows).call(this);
-  __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_sortRows).call(this);
-  __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_adjustPaginator).call(this);
-  __classPrivateFieldSet$1(this, _KupDataTable_paginatedRows, paginateRows(__classPrivateFieldGet$1(this, _KupDataTable_rows, "f"), this.currentPage, this.currentRowsPerPage, __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this)), "f");
-  __classPrivateFieldSet$1(this, _KupDataTable_paginatedRowsLength, __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_paginatedRowsPointLength).call(this), "f");
+  __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_filterRows).call(this);
+  __classPrivateFieldSet$2(this, _KupDataTable_footer, calcTotals(normalizeRows(this.getColumns(), __classPrivateFieldGet$2(this, _KupDataTable_rows, "f")), this.totals), "f");
+  __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_groupRows).call(this);
+  __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_sortRows).call(this);
+  __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_adjustPaginator).call(this);
+  __classPrivateFieldSet$2(this, _KupDataTable_paginatedRows, paginateRows(__classPrivateFieldGet$2(this, _KupDataTable_rows, "f"), this.currentPage, this.currentRowsPerPage, __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this)), "f");
+  __classPrivateFieldSet$2(this, _KupDataTable_paginatedRowsLength, __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_paginatedRowsPointLength).call(this), "f");
 }, _KupDataTable_filterRows = function _KupDataTable_filterRows() {
-  __classPrivateFieldSet$1(this, _KupDataTable_rows, filterRows(this.getRows(), this.filters, this.globalFilterValue, this.getColumns()), "f");
-  __classPrivateFieldSet$1(this, _KupDataTable_rowsLength, __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_rowsPointLength).call(this), "f");
+  __classPrivateFieldSet$2(this, _KupDataTable_rows, filterRows(this.getRows(), this.filters, this.globalFilterValue, this.getColumns()), "f");
+  __classPrivateFieldSet$2(this, _KupDataTable_rowsLength, __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_rowsPointLength).call(this), "f");
 }, _KupDataTable_isGrouping = function _KupDataTable_isGrouping() {
   return this.groups && this.groups.length > 0;
 }, _KupDataTable_hasRowActions = function _KupDataTable_hasRowActions() {
@@ -10484,19 +10501,19 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
 }, _KupDataTable_hasTotals = function _KupDataTable_hasTotals() {
   return this.totals && Object.keys(this.totals).length > 0;
 }, _KupDataTable_tableHasAutoWidth = function _KupDataTable_tableHasAutoWidth() {
-  if (!__classPrivateFieldGet$1(this, _KupDataTable_sizedColumns, "f")) {
+  if (!__classPrivateFieldGet$2(this, _KupDataTable_sizedColumns, "f")) {
     return;
   }
   const visibleCols = this.getVisibleColumns();
   // Before checking each column, controls that visible columns are as many as items with custom sizes.
   // If there are more visible columns, it means that the width of the table will be set to auto.
-  if (visibleCols.length <= __classPrivateFieldGet$1(this, _KupDataTable_sizedColumns, "f").length) {
+  if (visibleCols.length <= __classPrivateFieldGet$2(this, _KupDataTable_sizedColumns, "f").length) {
     let found = false;
     // Each visible column must have its own width for the table to have a auto width
     for (let i = 0; i < visibleCols.length; i++) {
       found = false;
-      for (let j = 0; j < __classPrivateFieldGet$1(this, _KupDataTable_sizedColumns, "f").length; j++) {
-        if (visibleCols[i].name === __classPrivateFieldGet$1(this, _KupDataTable_sizedColumns, "f")[j].name) {
+      for (let j = 0; j < __classPrivateFieldGet$2(this, _KupDataTable_sizedColumns, "f").length; j++) {
+        if (visibleCols[i].name === __classPrivateFieldGet$2(this, _KupDataTable_sizedColumns, "f")[j].name) {
           found = true;
           break;
         }
@@ -10509,8 +10526,8 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   }
   return false;
 }, _KupDataTable_forceGroupExpansion = function _KupDataTable_forceGroupExpansion() {
-  __classPrivateFieldGet$1(this, _KupDataTable_rows, "f").forEach((row) => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_forceRowGroupExpansion).call(this, row));
-  __classPrivateFieldGet$1(this, _KupDataTable_paginatedRows, "f").forEach((row) => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_forceRowGroupExpansion).call(this, row));
+  __classPrivateFieldGet$2(this, _KupDataTable_rows, "f").forEach((row) => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_forceRowGroupExpansion).call(this, row));
+  __classPrivateFieldGet$2(this, _KupDataTable_paginatedRows, "f").forEach((row) => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_forceRowGroupExpansion).call(this, row));
 }, _KupDataTable_forceRowGroupExpansion = function _KupDataTable_forceRowGroupExpansion(row) {
   // check if row is group
   if (!row.group) {
@@ -10531,10 +10548,10 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   }
   this.groupState[row.group.id] = groupState;
   if (row.group.children) {
-    row.group.children.forEach((childRow) => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_forceRowGroupExpansion).call(this, childRow));
+    row.group.children.forEach((childRow) => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_forceRowGroupExpansion).call(this, childRow));
   }
 }, _KupDataTable_adjustPaginator = function _KupDataTable_adjustPaginator() {
-  const numberOfRows = __classPrivateFieldGet$1(this, _KupDataTable_rowsLength, "f");
+  const numberOfRows = __classPrivateFieldGet$2(this, _KupDataTable_rowsLength, "f");
   // check if current page is valid
   const numberOfPages = Math.ceil(numberOfRows / this.currentRowsPerPage);
   if (this.currentPage > numberOfPages) {
@@ -10543,7 +10560,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     this.resetCurrentPage();
   }
 }, _KupDataTable_composeFixedCellStyleAndClass = function _KupDataTable_composeFixedCellStyleAndClass(columnCssIndex, rowCssIndex, extraCellsCount = 0) {
-  if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this)) {
+  if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this)) {
     return undefined;
   }
   //-- Controls if there are fixed rows or columns --
@@ -10580,20 +10597,20 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
 }, _KupDataTable_updateFixedRowsAndColumnsCssVariables = function _KupDataTable_updateFixedRowsAndColumnsCssVariables() {
   // [ffbf] - Using getBoundingClientRect is mandatory since Firefox return a wrong value for ele.offsetHeight and witdh values
   // When grouping, the fixed rows and columns are not sticky
-  if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this) || !__classPrivateFieldGet$1(this, _KupDataTable_tableRef, "f"))
+  if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this) || !__classPrivateFieldGet$2(this, _KupDataTable_tableRef, "f"))
     return false;
   let toRet = false;
   if (this.fixedRows >= 1) {
-    let currentRow = __classPrivateFieldGet$1(this, _KupDataTable_tableRef, "f").querySelector('tbody > tr:first-of-type');
+    let currentRow = __classPrivateFieldGet$2(this, _KupDataTable_tableRef, "f").querySelector('tbody > tr:first-of-type');
     // The height must start from the height of the header. BUT not on Safari.
     // Safari handles the sticky position on the tables in a different way, making it start from the tbody element
     // and not on the table with a specified position of sticky. There fore in that case we must set initial height to 0.
-    let previousHeight = !__classPrivateFieldGet$1(this, _KupDataTable_isSafariBrowser, "f")
-      ? __classPrivateFieldGet$1(this, _KupDataTable_tableRef, "f").querySelector('thead > tr:first-of-type > th:first-of-type').getBoundingClientRect().height // [ffbf]
+    let previousHeight = !__classPrivateFieldGet$2(this, _KupDataTable_isSafariBrowser, "f")
+      ? __classPrivateFieldGet$2(this, _KupDataTable_tableRef, "f").querySelector('thead > tr:first-of-type > th:first-of-type').getBoundingClientRect().height // [ffbf]
       : 0;
     // [CSSCount] - I must start from 1 since we are referencing html elements e not array (with CSS selectors starting from 1)
     for (let i = 1; i <= this.fixedRows && currentRow; i++) {
-      __classPrivateFieldGet$1(this, _KupDataTable_tableAreaRef, "f").style.setProperty(FixedCellsCSSVarsBase.rows + i, previousHeight + 'px');
+      __classPrivateFieldGet$2(this, _KupDataTable_tableAreaRef, "f").style.setProperty(FixedCellsCSSVarsBase.rows + i, previousHeight + 'px');
       previousHeight += currentRow.children[0].getBoundingClientRect().height; // [ffbf]
       currentRow =
         currentRow.nextElementSibling;
@@ -10601,14 +10618,14 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     toRet = true;
   }
   if (this.fixedColumns >= 1) {
-    let currentCell = __classPrivateFieldGet$1(this, _KupDataTable_tableRef, "f").querySelector('tbody > tr:first-of-type > td:first-of-type');
+    let currentCell = __classPrivateFieldGet$2(this, _KupDataTable_tableRef, "f").querySelector('tbody > tr:first-of-type > td:first-of-type');
     let previousWidth = 0;
     const totalFixedColumns = this.fixedColumns +
-      (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this) ? 1 : 0) +
+      (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this) ? 1 : 0) +
       (this.selection === SelectionMode.MULTIPLE_CHECKBOX ? 1 : 0);
     // @See [CSSCount]
     for (let i = 1; i <= totalFixedColumns && currentCell; i++) {
-      __classPrivateFieldGet$1(this, _KupDataTable_tableAreaRef, "f").style.setProperty(FixedCellsCSSVarsBase.columns + i, previousWidth + 'px');
+      __classPrivateFieldGet$2(this, _KupDataTable_tableAreaRef, "f").style.setProperty(FixedCellsCSSVarsBase.columns + i, previousWidth + 'px');
       previousWidth += currentCell.getBoundingClientRect().width; // [ffbf]
       currentCell =
         currentCell.nextElementSibling;
@@ -10656,10 +10673,10 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   // resetting current page
   this.resetCurrentPage();
   const newFilters = Object.assign({}, this.filters);
-  __classPrivateFieldGet$1(this, _KupDataTable_filtersColumnMenuInstance, "f").removeFilter(newFilters, column.name);
+  __classPrivateFieldGet$2(this, _KupDataTable_filtersColumnMenuInstance, "f").removeFilter(newFilters, column.name);
   this.filters = newFilters;
 }, _KupDataTable_getFilterValueForTooltip = function _KupDataTable_getFilterValueForTooltip(column) {
-  return __classPrivateFieldGet$1(this, _KupDataTable_filtersColumnMenuInstance, "f").getFilterValueForTooltip(this.filters, column);
+  return __classPrivateFieldGet$2(this, _KupDataTable_filtersColumnMenuInstance, "f").getFilterValueForTooltip(this.filters, column);
 }, _KupDataTable_onGlobalFilterChange = function _KupDataTable_onGlobalFilterChange(inputEl) {
   this.resetCurrentPage();
   if (inputEl) {
@@ -10670,15 +10687,15 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     this.globalFilterValue = '';
   }
 }, _KupDataTable_handlePageChange = function _KupDataTable_handlePageChange(pageNumber) {
-  const newPage = pageChange(pageNumber, __classPrivateFieldGet$1(this, _KupDataTable_rowsLength, "f"), this.currentRowsPerPage);
+  const newPage = pageChange(pageNumber, __classPrivateFieldGet$2(this, _KupDataTable_rowsLength, "f"), this.currentRowsPerPage);
   if (newPage) {
     this.currentPage = newPage;
   }
 }, _KupDataTable_handleRowsPerPageChange = function _KupDataTable_handleRowsPerPageChange(rowsNumber) {
-  const newRows = rowsPerPageChange(rowsNumber, __classPrivateFieldGet$1(this, _KupDataTable_rowsLength, "f"));
+  const newRows = rowsPerPageChange(rowsNumber, __classPrivateFieldGet$2(this, _KupDataTable_rowsLength, "f"));
   if (newRows) {
     this.currentRowsPerPage = newRows;
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_adjustPaginator).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_adjustPaginator).call(this);
   }
 }, _KupDataTable_onRowClick = function _KupDataTable_onRowClick(row, td, emitEvent) {
   // selecting row
@@ -10708,9 +10725,9 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   if (!row.unselectable &&
     this.selection !== SelectionMode.NONE &&
     clickedColumn) {
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_deselectColumn).call(this, this.selectedColumn);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_deselectColumn).call(this, this.selectedColumn);
     this.selectedColumn = clickedColumn;
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_selectColumn).call(this, this.selectedColumn);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_selectColumn).call(this, this.selectedColumn);
     if (emitEvent !== false) {
       // emit event
       this.kupRowSelected.emit({
@@ -10785,7 +10802,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
 }, _KupDataTable_onSelectAll = function _KupDataTable_onSelectAll({ target }) {
   if (target.checked) {
     // select all rows
-    this.selectedRows = __classPrivateFieldGet$1(this, _KupDataTable_renderedRows, "f");
+    this.selectedRows = __classPrivateFieldGet$2(this, _KupDataTable_renderedRows, "f");
     // triggering event
     this.kupRowSelected.emit({
       comp: this,
@@ -10797,21 +10814,21 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   }
   else {
     // deselect all rows
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_resetSelectedRows).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_resetSelectedRows).call(this);
   }
 }, _KupDataTable_openTotalMenu = function _KupDataTable_openTotalMenu(column) {
   this.openedTotalMenu = column.name;
 }, _KupDataTable_closeTotalMenu = function _KupDataTable_closeTotalMenu() {
   this.openedTotalMenu = null;
-  __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").removeClickCallback(__classPrivateFieldGet$1(this, _KupDataTable_clickCb, "f"));
+  __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").removeClickCallback(__classPrivateFieldGet$2(this, _KupDataTable_clickCb, "f"));
 }, _KupDataTable_isOpenedTotalMenuForColumn = function _KupDataTable_isOpenedTotalMenuForColumn(column) {
   return this.openedTotalMenu === column;
 }, _KupDataTable_groupRows = function _KupDataTable_groupRows() {
-  if (!__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this)) {
+  if (!__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_isGrouping).call(this)) {
     return;
   }
-  __classPrivateFieldSet$1(this, _KupDataTable_rows, groupRows(this.getColumns(), __classPrivateFieldGet$1(this, _KupDataTable_rows, "f"), this.groups, this.totals), "f");
-  __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_adjustGroupState).call(this);
+  __classPrivateFieldSet$2(this, _KupDataTable_rows, groupRows(this.getColumns(), __classPrivateFieldGet$2(this, _KupDataTable_rows, "f"), this.groups, this.totals), "f");
+  __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_adjustGroupState).call(this);
 }, _KupDataTable_onLoadMoreClick = function _KupDataTable_onLoadMoreClick() {
   var _a;
   let loadItems = 0;
@@ -10821,11 +10838,11 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       break;
     case LoadMoreMode.CONSTANT_INCREMENT:
       loadItems =
-        this.loadMoreStep * (__classPrivateFieldGet$1(this, _KupDataTable_loadMoreEventCounter, "f") + 1);
+        this.loadMoreStep * (__classPrivateFieldGet$2(this, _KupDataTable_loadMoreEventCounter, "f") + 1);
       break;
     case LoadMoreMode.PROGRESSIVE_THRESHOLD:
       loadItems =
-        Math.max(__classPrivateFieldGet$1(this, _KupDataTable_loadMoreEventPreviousQuantity, "f"), this.loadMoreStep) * Math.min(__classPrivateFieldGet$1(this, _KupDataTable_loadMoreEventCounter, "f") + 1, 2);
+        Math.max(__classPrivateFieldGet$2(this, _KupDataTable_loadMoreEventPreviousQuantity, "f"), this.loadMoreStep) * Math.min(__classPrivateFieldGet$2(this, _KupDataTable_loadMoreEventCounter, "f") + 1, 2);
       break;
   }
   if (loadItems > this.loadMoreLimit) {
@@ -10836,16 +10853,16 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     id: this.rootElement.id,
     loadItems: loadItems,
   });
-  __classPrivateFieldSet$1(this, _KupDataTable_loadMoreEventPreviousQuantity, loadItems, "f");
-  __classPrivateFieldSet$1(this, _KupDataTable_loadMoreEventCounter, (_a = __classPrivateFieldGet$1(this, _KupDataTable_loadMoreEventCounter, "f"), _a++, _a), "f");
+  __classPrivateFieldSet$2(this, _KupDataTable_loadMoreEventPreviousQuantity, loadItems, "f");
+  __classPrivateFieldSet$2(this, _KupDataTable_loadMoreEventCounter, (_a = __classPrivateFieldGet$2(this, _KupDataTable_loadMoreEventCounter, "f"), _a++, _a), "f");
 }, _KupDataTable_adjustGroupState = function _KupDataTable_adjustGroupState() {
-  if (!__classPrivateFieldGet$1(this, _KupDataTable_rows, "f") ||
-    __classPrivateFieldGet$1(this, _KupDataTable_rowsLength, "f") === 0 ||
-    !__classPrivateFieldGet$1(this, _KupDataTable_rows, "f")[0].hasOwnProperty('group')) {
+  if (!__classPrivateFieldGet$2(this, _KupDataTable_rows, "f") ||
+    __classPrivateFieldGet$2(this, _KupDataTable_rowsLength, "f") === 0 ||
+    !__classPrivateFieldGet$2(this, _KupDataTable_rows, "f")[0].hasOwnProperty('group')) {
     // no grouping
     return;
   }
-  __classPrivateFieldGet$1(this, _KupDataTable_rows, "f").forEach((r) => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_adjustGroupStateFromRow).call(this, r));
+  __classPrivateFieldGet$2(this, _KupDataTable_rows, "f").forEach((r) => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_adjustGroupStateFromRow).call(this, r));
 }, _KupDataTable_adjustGroupStateFromRow = function _KupDataTable_adjustGroupStateFromRow(row) {
   if (!row || !row.hasOwnProperty('group')) {
     // not a groping row, nothing to do
@@ -10862,9 +10879,9 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     // update expanded
     group.expanded = groupFromState.expanded;
   }
-  group.children.forEach((child) => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_adjustGroupStateFromRow).call(this, child));
+  group.children.forEach((child) => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_adjustGroupStateFromRow).call(this, child));
 }, _KupDataTable_sortRows = function _KupDataTable_sortRows() {
-  __classPrivateFieldSet$1(this, _KupDataTable_rows, sortRows(__classPrivateFieldGet$1(this, _KupDataTable_rows, "f"), this.sort), "f");
+  __classPrivateFieldSet$2(this, _KupDataTable_rows, sortRows(__classPrivateFieldGet$2(this, _KupDataTable_rows, "f"), this.sort), "f");
 }, _KupDataTable_getSortIcon = function _KupDataTable_getSortIcon(columnName) {
   // check if column in sort array
   for (let sortObj of this.sort) {
@@ -10890,7 +10907,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   if (this.selection === SelectionMode.MULTIPLE_CHECKBOX) {
     colSpan += 1;
   }
-  if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this)) {
+  if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this)) {
     colSpan += 1;
   }
   return colSpan;
@@ -10920,7 +10937,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       sourceColumn: this.data.columns[sortedColIndex],
       targetColumn: this.data.columns[receivingColIndex],
     });
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_moveSortedColumns).call(this, this.data.columns, receivingColIndex, sortedColIndex);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_moveSortedColumns).call(this, this.data.columns, receivingColIndex, sortedColIndex);
   }
 }, _KupDataTable_moveSortedColumns = function _KupDataTable_moveSortedColumns(columns, receivingColumnIndex, sortedColumnIndex) {
   const remove = columns.splice(sortedColumnIndex, 1);
@@ -10933,25 +10950,25 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     .map((chunk, index) => (index !== 0 ? [h("br", null), chunk] : chunk));
 }, _KupDataTable_composeHeaderCellClassAndStyle = function _KupDataTable_composeHeaderCellClassAndStyle(columnIndex, extraCells = 0, column) {
   let columnClass = { ['header-cell']: true }, thStyle = column.style ? Object.assign({}, column.style) : {};
-  if (__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isBar(column.obj) ||
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isButton(column.obj) ||
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isChart(column.obj) ||
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isCheckbox(column.obj) ||
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isImage(column.obj) ||
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isIcon(column.obj) ||
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isProgressBar(column.obj) ||
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isRadio(column.obj) ||
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isVoCodver(column.obj)) {
+  if (__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isBar(column.obj) ||
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isButton(column.obj) ||
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isChart(column.obj) ||
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isCheckbox(column.obj) ||
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isImage(column.obj) ||
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isIcon(column.obj) ||
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isProgressBar(column.obj) ||
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isRadio(column.obj) ||
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isVoCodver(column.obj)) {
     columnClass['header-cell--centered'] = true;
   }
-  if (__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isNumber(column.obj)) {
+  if (__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isNumber(column.obj)) {
     columnClass['header-cell--is-number'] = true;
   }
-  if (__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isIcon(column.obj)) {
+  if (__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isIcon(column.obj)) {
     columnClass['header-cell--is-icon'] = true;
   }
   // For fixed cells styles and classes
-  const fixedCellStyle = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, columnIndex + 1 + extraCells, 0, extraCells);
+  const fixedCellStyle = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, columnIndex + 1 + extraCells, 0, extraCells);
   if (fixedCellStyle) {
     columnClass = Object.assign(Object.assign({}, columnClass), fixedCellStyle.fixedCellClasses);
     thStyle = Object.assign(Object.assign({}, thStyle), fixedCellStyle.fixedCellStyle);
@@ -10966,24 +10983,24 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   let multiSelectColumn = null;
   if (this.selection === SelectionMode.MULTIPLE_CHECKBOX) {
     specialExtraCellsCount++;
-    const selectionStyleAndClass = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, specialExtraCellsCount, 0, specialExtraCellsCount - 1);
+    const selectionStyleAndClass = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, specialExtraCellsCount, 0, specialExtraCellsCount - 1);
     const style = Object.assign({ width: '30px', margin: '0 auto' }, (selectionStyleAndClass
       ? selectionStyleAndClass.fixedCellStyle
       : {}));
     multiSelectColumn = (h("th", { class: selectionStyleAndClass
         ? selectionStyleAndClass.fixedCellClasses
-        : {}, style: style }, h("kup-checkbox", { "onkup-checkbox-change": (e) => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_onSelectAll).call(this, e), title: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.SELECTED) +
+        : {}, style: style }, h("kup-checkbox", { "onkup-checkbox-change": (e) => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_onSelectAll).call(this, e), title: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.SELECTED) +
         `: ${this.selectedRows.length},` +
-        __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.RENDERED) +
-        `: ${__classPrivateFieldGet$1(this, _KupDataTable_renderedRows, "f").length}`, checked: this.selectedRows.length > 0 &&
+        __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.RENDERED) +
+        `: ${__classPrivateFieldGet$2(this, _KupDataTable_renderedRows, "f").length}`, checked: this.selectedRows.length > 0 &&
         this.selectedRows.length ===
-          __classPrivateFieldGet$1(this, _KupDataTable_renderedRows, "f").length })));
+          __classPrivateFieldGet$2(this, _KupDataTable_renderedRows, "f").length })));
   }
   // Renders action column
   let actionsColumn = null;
-  if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this)) {
+  if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this)) {
     specialExtraCellsCount++;
-    const selectionStyleAndClass = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, specialExtraCellsCount, 0, specialExtraCellsCount - 1);
+    const selectionStyleAndClass = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, specialExtraCellsCount, 0, specialExtraCellsCount - 1);
     actionsColumn = (h("th", { class: selectionStyleAndClass
         ? selectionStyleAndClass.fixedCellClasses
         : {}, style: selectionStyleAndClass
@@ -10992,26 +11009,26 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   }
   // Renders normal cells
   const dataColumns = this.getVisibleColumns().map((column, columnIndex) => {
-    const { columnClass, thStyle } = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_composeHeaderCellClassAndStyle).call(this, columnIndex, specialExtraCellsCount, column);
+    const { columnClass, thStyle } = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_composeHeaderCellClassAndStyle).call(this, columnIndex, specialExtraCellsCount, column);
     let filter = null;
-    if (__classPrivateFieldGet$1(this, _KupDataTable_filtersColumnMenuInstance, "f").hasFiltersForColumn(this.filters, column)) {
-      const svgLabel = __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.REMOVE_FILTERS) + `: '${__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getFilterValueForTooltip).call(this, column)}'`;
+    if (__classPrivateFieldGet$2(this, _KupDataTable_filtersColumnMenuInstance, "f").hasFiltersForColumn(this.filters, column)) {
+      const svgLabel = __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.REMOVE_FILTERS) + `: '${__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getFilterValueForTooltip).call(this, column)}'`;
       filter = (h("span", { title: svgLabel, class: `kup-icon ${KupThemeIconValues.FILTER_REMOVE.replace('--', '')}` }));
     }
     let sortIcon = null;
-    let iconClass = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getSortIcon).call(this, column.name);
+    let iconClass = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getSortIcon).call(this, column.name);
     if (iconClass !== '') {
-      sortIcon = (h("span", { class: iconClass, title: __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getSortDecode).call(this, column.name) }));
+      sortIcon = (h("span", { class: iconClass, title: __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getSortDecode).call(this, column.name) }));
     }
     columnClass['header-cell--sortable'] = true;
     let keyIcon = null;
     if (column.isKey) {
-      keyIcon = (h("span", { class: `kup-icon ${KupThemeIconValues.KEY.replace('--', '')}`, title: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.KEY) }));
+      keyIcon = (h("span", { class: `kup-icon ${KupThemeIconValues.KEY.replace('--', '')}`, title: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.KEY) }));
     }
     // Sets custom columns width
-    if (__classPrivateFieldGet$1(this, _KupDataTable_sizedColumns, "f")) {
-      for (let i = 0; i < __classPrivateFieldGet$1(this, _KupDataTable_sizedColumns, "f").length; i++) {
-        const currentCol = __classPrivateFieldGet$1(this, _KupDataTable_sizedColumns, "f")[i];
+    if (__classPrivateFieldGet$2(this, _KupDataTable_sizedColumns, "f")) {
+      for (let i = 0; i < __classPrivateFieldGet$2(this, _KupDataTable_sizedColumns, "f").length; i++) {
+        const currentCol = __classPrivateFieldGet$2(this, _KupDataTable_sizedColumns, "f")[i];
         if (currentCol.name === column.name) {
           const width = currentCol.size + '';
           if (width.indexOf('ch') < 1) {
@@ -11024,7 +11041,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
         }
       }
     }
-    return (h("th", { ref: (el) => __classPrivateFieldGet$1(this, _KupDataTable_thRefs, "f").push(el), "data-cell": column, "data-column": column.name, class: columnClass, style: thStyle, title: column.name }, h("div", { class: "header-cell__content" }, h("span", { class: "header-cell__title" }, __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_applyLineBreaks).call(this, column.title)), h("span", { class: "header-cell__icons" }, keyIcon, sortIcon, filter)), this.resizableColumns ? (h("span", { class: "header-cell__drag-handler" })) : null));
+    return (h("th", { ref: (el) => __classPrivateFieldGet$2(this, _KupDataTable_thRefs, "f").push(el), "data-cell": column, "data-column": column.name, class: columnClass, style: thStyle, title: column.name }, h("div", { class: "header-cell__content" }, h("span", { class: "header-cell__title" }, __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_applyLineBreaks).call(this, column.title)), h("span", { class: "header-cell__icons" }, keyIcon, sortIcon, filter)), this.resizableColumns ? (h("span", { class: "header-cell__drag-handler" })) : null));
   });
   return [multiSelectColumn, actionsColumn, ...dataColumns];
   //  return [multiSelectColumn, groupColumn, actionsColumn, ...dataColumns];
@@ -11033,24 +11050,24 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   let multiSelectColumn = null;
   if (this.selection === SelectionMode.MULTIPLE_CHECKBOX) {
     specialExtraCellsCount++;
-    const selectionStyleAndClass = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, specialExtraCellsCount, 0, specialExtraCellsCount - 1);
+    const selectionStyleAndClass = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, specialExtraCellsCount, 0, specialExtraCellsCount - 1);
     const style = Object.assign({ width: '30px', margin: '0 auto' }, (selectionStyleAndClass
       ? selectionStyleAndClass.fixedCellStyle
       : {}));
     multiSelectColumn = (h("th-sticky", { class: selectionStyleAndClass
         ? selectionStyleAndClass.fixedCellClasses
-        : null, style: style }, h("kup-checkbox", { "onkup-checkbox-change": (e) => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_onSelectAll).call(this, e), title: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.SELECTED) +
+        : null, style: style }, h("kup-checkbox", { "onkup-checkbox-change": (e) => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_onSelectAll).call(this, e), title: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.SELECTED) +
         `: ${this.selectedRows.length},` +
-        __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.RENDERED) +
-        `: ${__classPrivateFieldGet$1(this, _KupDataTable_renderedRows, "f").length}`, checked: this.selectedRows.length > 0 &&
+        __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageRow.RENDERED) +
+        `: ${__classPrivateFieldGet$2(this, _KupDataTable_renderedRows, "f").length}`, checked: this.selectedRows.length > 0 &&
         this.selectedRows.length ===
-          __classPrivateFieldGet$1(this, _KupDataTable_renderedRows, "f").length })));
+          __classPrivateFieldGet$2(this, _KupDataTable_renderedRows, "f").length })));
   }
   // Empty cell for the actions
   let actionsColumn = null;
-  if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this)) {
+  if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this)) {
     specialExtraCellsCount++;
-    const selectionStyleAndClass = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, specialExtraCellsCount, 0, specialExtraCellsCount - 1);
+    const selectionStyleAndClass = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, specialExtraCellsCount, 0, specialExtraCellsCount - 1);
     actionsColumn = (h("th-sticky", { class: selectionStyleAndClass
         ? selectionStyleAndClass.fixedCellClasses
         : null, style: selectionStyleAndClass
@@ -11059,29 +11076,29 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   }
   // Composes normal header cells
   const dataColumns = this.getVisibleColumns().map((column, columnIndex) => {
-    const { columnClass, thStyle } = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_composeHeaderCellClassAndStyle).call(this, columnIndex, specialExtraCellsCount, column);
-    return (h("th-sticky", { class: columnClass, style: thStyle }, h("div", { class: "header-cell__content" }, h("span", { class: "header-cell__title" }, __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_applyLineBreaks).call(this, column.title)))));
+    const { columnClass, thStyle } = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_composeHeaderCellClassAndStyle).call(this, columnIndex, specialExtraCellsCount, column);
+    return (h("th-sticky", { class: columnClass, style: thStyle }, h("div", { class: "header-cell__content" }, h("span", { class: "header-cell__title" }, __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_applyLineBreaks).call(this, column.title)))));
   });
   return [multiSelectColumn, actionsColumn, ...dataColumns];
 }, _KupDataTable_totalMenuPosition = function _KupDataTable_totalMenuPosition() {
   if (this.rootElement.shadowRoot) {
     const menu = this.rootElement.shadowRoot.querySelector('#totals-menu');
     if (menu) {
-      __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dynamicPosition.register(menu, __classPrivateFieldGet$1(this, _KupDataTable_totalMenuCoords, "f"));
-      __classPrivateFieldSet$1(this, _KupDataTable_clickCb, {
+      __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dynamicPosition.register(menu, __classPrivateFieldGet$2(this, _KupDataTable_totalMenuCoords, "f"));
+      __classPrivateFieldSet$2(this, _KupDataTable_clickCb, {
         cb: () => {
-          __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_closeTotalMenu).call(this);
+          __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_closeTotalMenu).call(this);
         },
         el: menu,
       }, "f");
-      __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").addClickCallback(__classPrivateFieldGet$1(this, _KupDataTable_clickCb, "f"), true);
-      __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dynamicPosition.start(menu);
+      __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").addClickCallback(__classPrivateFieldGet$2(this, _KupDataTable_clickCb, "f"), true);
+      __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dynamicPosition.start(menu);
       menu.menuVisible = true;
     }
   }
 }, _KupDataTable_onTotalMenuOpen = function _KupDataTable_onTotalMenuOpen(column) {
-  __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_closeTotalMenu).call(this);
-  __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_openTotalMenu).call(this, column);
+  __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_closeTotalMenu).call(this);
+  __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_openTotalMenu).call(this, column);
 }, _KupDataTable_renderRow = function _KupDataTable_renderRow(row, level = 0, rowCssIndex = 0, previousRow) {
   const visibleColumns = this.getVisibleColumns();
   let rowActionsCount = 0;
@@ -11113,17 +11130,17 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     for (let i = 0; i < level; i++) {
       indent.push(h("span", { class: "indent" }));
     }
-    if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_hasTotals).call(this)) {
+    if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_hasTotals).call(this)) {
       //const colSpan = this.multiSelection ? 2 : 1;
       const cells = [];
-      if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this)) {
+      if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this)) {
         cells.push(h("td", null));
       }
       if (this.selection === SelectionMode.MULTIPLE_CHECKBOX) {
         cells.push(h("td", null));
       }
       // adding 'grouping' cell
-      const grouplabelcell = (h("td", { colSpan: __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_calculateColspan).call(this) }, h("span", { class: "group-cell-content" }, indent, h("span", { class: iconClass }), h("span", { class: "text" }, composedGroupLabel))));
+      const grouplabelcell = (h("td", { colSpan: __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_calculateColspan).call(this) }, h("span", { class: "group-cell-content" }, indent, h("span", { class: iconClass }), h("span", { class: "text" }, composedGroupLabel))));
       // adding 'totals grouping' cells
       for (let column of visibleColumns) {
         let totalClass = 'total';
@@ -11138,11 +11155,11 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
           value = totalValue;
         }
         else {
-          if (__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").objects.isDate(column.obj)) {
+          if (__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").objects.isDate(column.obj)) {
             if (totalValue) {
-              if (__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dates.isValid(totalValue, KupDatesFormats.ISO_DATE)) {
+              if (__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dates.isValid(totalValue, KupDatesFormats.ISO_DATE)) {
                 value =
-                  __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dates.format(totalValue);
+                  __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dates.format(totalValue);
               }
               else {
                 console.warn(`invalid date: ${totalValue}`);
@@ -11155,18 +11172,18 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
         }
         cells.push(h("td", { class: totalClass }, value));
       }
-      jsxRows.push(h("tr", { ref: (el) => __classPrivateFieldGet$1(this, _KupDataTable_rowsRefs, "f").push(el), "data-row": row, class: "group group-label" }, grouplabelcell));
-      jsxRows.push(h("tr", { ref: (el) => __classPrivateFieldGet$1(this, _KupDataTable_rowsRefs, "f").push(el), "data-row": row, class: "group group-total" }, cells));
+      jsxRows.push(h("tr", { ref: (el) => __classPrivateFieldGet$2(this, _KupDataTable_rowsRefs, "f").push(el), "data-row": row, class: "group group-label" }, grouplabelcell));
+      jsxRows.push(h("tr", { ref: (el) => __classPrivateFieldGet$2(this, _KupDataTable_rowsRefs, "f").push(el), "data-row": row, class: "group group-total" }, cells));
     }
     else {
-      jsxRows.push(h("tr", { ref: (el) => __classPrivateFieldGet$1(this, _KupDataTable_rowsRefs, "f").push(el), "data-row": row, class: "group" }, h("td", { colSpan: __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_calculateColspan).call(this) }, h("span", { class: "group-cell-content" }, indent, h("span", { class: iconClass }), h("span", { class: "text" }, composedGroupLabel)))));
+      jsxRows.push(h("tr", { ref: (el) => __classPrivateFieldGet$2(this, _KupDataTable_rowsRefs, "f").push(el), "data-row": row, class: "group" }, h("td", { colSpan: __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_calculateColspan).call(this) }, h("span", { class: "group-cell-content" }, indent, h("span", { class: iconClass }), h("span", { class: "text" }, composedGroupLabel)))));
     }
     // if group is expanded, add children
-    if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_isGroupExpanded).call(this, row)) {
+    if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_isGroupExpanded).call(this, row)) {
       row.group.children
         // We must pass the previous element of the array to check if we must hide or display the value of the cell
         // When the column has specified the parameter hideValuesRepetitions
-        .map((row, groupRowIndex, currentArray) => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_renderRow).call(this, row, level + 1, groupRowIndex, groupRowIndex > 0
+        .map((row, groupRowIndex, currentArray) => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_renderRow).call(this, row, level + 1, groupRowIndex, groupRowIndex > 0
         ? currentArray[groupRowIndex - 1]
         : undefined))
         .forEach((jsxRow) => {
@@ -11193,11 +11210,11 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     let selectRowCell = null;
     if (this.selection === SelectionMode.MULTIPLE_CHECKBOX) {
       specialExtraCellsCount++;
-      const selectionStyleAndClass = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, specialExtraCellsCount, rowCssIndex, specialExtraCellsCount - 1);
+      const selectionStyleAndClass = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, specialExtraCellsCount, rowCssIndex, specialExtraCellsCount - 1);
       const props = {
         checked: this.selectedRows.includes(row),
         onChange: () => {
-          __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_handleRowSelect).call(this, row);
+          __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_handleRowSelect).call(this, row);
         },
       };
       selectRowCell = (h("td", { "row-select-cell": true, class: selectionStyleAndClass
@@ -11209,18 +11226,18 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     // Renders action cell
     // If active, this can be either the first or second cell
     let rowActionsCell = null;
-    if (__classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this)) {
+    if (__classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_hasRowActions).call(this)) {
       // Increments
       specialExtraCellsCount++;
-      const actionsStyleAndClass = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, specialExtraCellsCount, rowCssIndex, specialExtraCellsCount - 1);
+      const actionsStyleAndClass = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, specialExtraCellsCount, rowCssIndex, specialExtraCellsCount - 1);
       rowActionsCount += this.rowActions.length;
-      const defaultRowActions = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_renderActions).call(this, this.rowActions, row, 'default');
+      const defaultRowActions = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_renderActions).call(this, this.rowActions, row, 'default');
       let rowActionExpander = null;
       let variableActions = null;
       if (row.actions) {
         rowActionsCount += row.actions.length;
         // adding variable actions
-        variableActions = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_renderActions).call(this, row.actions, row, 'variable');
+        variableActions = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_renderActions).call(this, row.actions, row, 'variable');
       }
       else {
         // adding expander
@@ -11229,10 +11246,10 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
           resource: 'chevron-right',
           sizeX: '1.5em',
           sizeY: '1.5em',
-          title: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.EXPAND),
+          title: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.EXPAND),
           wrapperClass: 'expander',
           onClick: (e) => {
-            __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_onRowActionExpanderClick).call(this, e, row);
+            __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_onRowActionExpanderClick).call(this, e, row);
           },
         };
         rowActionsCount++;
@@ -11281,18 +11298,18 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       let cellClass = null;
       let cellStyle = Object.assign({}, cell.style);
       //-- For fixed cells --
-      const fixedStyles = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, cellIndex + 1 + specialExtraCellsCount, rowCssIndex, specialExtraCellsCount);
+      const fixedStyles = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_composeFixedCellStyleAndClass).call(this, cellIndex + 1 + specialExtraCellsCount, rowCssIndex, specialExtraCellsCount);
       if (fixedStyles) {
         cellStyle = Object.assign(cellStyle ? cellStyle : {}, fixedStyles.fixedCellStyle);
         cellClass = Object.assign(Object.assign({}, cellClass), fixedStyles.fixedCellClasses);
       }
       // Controls if there are columns with a specified width
-      if (__classPrivateFieldGet$1(this, _KupDataTable_sizedColumns, "f")) {
+      if (__classPrivateFieldGet$2(this, _KupDataTable_sizedColumns, "f")) {
         let colWidth = '';
         // Search if this column has a specified width
-        for (let j = 0; j < __classPrivateFieldGet$1(this, _KupDataTable_sizedColumns, "f").length; j++) {
-          if (name === __classPrivateFieldGet$1(this, _KupDataTable_sizedColumns, "f")[j].name) {
-            colWidth = __classPrivateFieldGet$1(this, _KupDataTable_sizedColumns, "f")[j].size;
+        for (let j = 0; j < __classPrivateFieldGet$2(this, _KupDataTable_sizedColumns, "f").length; j++) {
+          if (name === __classPrivateFieldGet$2(this, _KupDataTable_sizedColumns, "f")[j].name) {
+            colWidth = __classPrivateFieldGet$2(this, _KupDataTable_sizedColumns, "f")[j].size;
             break;
           }
         }
@@ -11314,7 +11331,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       return (h("td", Object.assign({ title: title, colSpan: cell.span && cell.span.col ? cell.span.col : null, rowSpan: cell.span && cell.span.row ? cell.span.row : null, "data-cell": cell, "data-column": name, "data-row": row, style: cellStyle, class: cellClass }, eventHandlers), jsxCell));
     });
     // adding row to rendered rows
-    __classPrivateFieldGet$1(this, _KupDataTable_renderedRows, "f").push(row);
+    __classPrivateFieldGet$2(this, _KupDataTable_renderedRows, "f").push(row);
     const rowClass = {
       selected: this.selectedRows.includes(row),
     };
@@ -11324,7 +11341,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
     const style = {
       '--kup_datatable_row_actions': rowActionsCount,
     };
-    return (h("tr", { ref: (el) => __classPrivateFieldGet$1(this, _KupDataTable_rowsRefs, "f").push(el), "data-row": row, class: rowClass, style: style }, selectRowCell, rowActionsCell, cells));
+    return (h("tr", { ref: (el) => __classPrivateFieldGet$2(this, _KupDataTable_rowsRefs, "f").push(el), "data-row": row, class: rowClass, style: style }, selectRowCell, rowActionsCell, cells));
   }
 }, _KupDataTable_renderActions = function _KupDataTable_renderActions(actions, row, type) {
   return actions.map((action, index) => {
@@ -11335,7 +11352,7 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       sizeY: '1.5em',
       title: action.text,
       wrapperClass: 'action',
-      onClick: () => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_onDefaultRowActionClick).call(this, {
+      onClick: () => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_onDefaultRowActionClick).call(this, {
         action,
         row,
         index,
@@ -11346,58 +11363,58 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
   });
 }, _KupDataTable_onCustomSettingsClick = function _KupDataTable_onCustomSettingsClick() {
   if (!this.openedCustomSettings) {
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_openCustomSettings).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_openCustomSettings).call(this);
   }
   else {
-    __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_closeCustomSettings).call(this);
+    __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_closeCustomSettings).call(this);
   }
 }, _KupDataTable_openCustomSettings = function _KupDataTable_openCustomSettings() {
-  __classPrivateFieldGet$1(this, _KupDataTable_customizeTopPanelRef, "f").menuVisible = true;
-  __classPrivateFieldGet$1(this, _KupDataTable_customizeTopButtonRef, "f").classList.add('toggled');
-  __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dynamicPosition.start(__classPrivateFieldGet$1(this, _KupDataTable_customizeTopPanelRef, "f"));
+  __classPrivateFieldGet$2(this, _KupDataTable_customizeTopPanelRef, "f").menuVisible = true;
+  __classPrivateFieldGet$2(this, _KupDataTable_customizeTopButtonRef, "f").classList.add('toggled');
+  __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dynamicPosition.start(__classPrivateFieldGet$2(this, _KupDataTable_customizeTopPanelRef, "f"));
   this.openedCustomSettings = true;
-  if (!__classPrivateFieldGet$1(this, _KupDataTable_clickCbCustomPanel, "f")) {
-    __classPrivateFieldSet$1(this, _KupDataTable_clickCbCustomPanel, {
+  if (!__classPrivateFieldGet$2(this, _KupDataTable_clickCbCustomPanel, "f")) {
+    __classPrivateFieldSet$2(this, _KupDataTable_clickCbCustomPanel, {
       cb: () => {
-        __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_closeCustomSettings).call(this);
+        __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_closeCustomSettings).call(this);
       },
-      el: __classPrivateFieldGet$1(this, _KupDataTable_customizeTopPanelRef, "f"),
+      el: __classPrivateFieldGet$2(this, _KupDataTable_customizeTopPanelRef, "f"),
     }, "f");
   }
-  __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").addClickCallback(__classPrivateFieldGet$1(this, _KupDataTable_clickCbCustomPanel, "f"), true);
+  __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").addClickCallback(__classPrivateFieldGet$2(this, _KupDataTable_clickCbCustomPanel, "f"), true);
 }, _KupDataTable_closeCustomSettings = function _KupDataTable_closeCustomSettings() {
-  __classPrivateFieldGet$1(this, _KupDataTable_customizeTopButtonRef, "f").classList.remove('toggled');
-  if (__classPrivateFieldGet$1(this, _KupDataTable_customizeTopPanelRef, "f") == null) {
+  __classPrivateFieldGet$2(this, _KupDataTable_customizeTopButtonRef, "f").classList.remove('toggled');
+  if (__classPrivateFieldGet$2(this, _KupDataTable_customizeTopPanelRef, "f") == null) {
     return;
   }
-  __classPrivateFieldGet$1(this, _KupDataTable_customizeTopPanelRef, "f").menuVisible = false;
+  __classPrivateFieldGet$2(this, _KupDataTable_customizeTopPanelRef, "f").menuVisible = false;
   this.openedCustomSettings = false;
-  __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").removeClickCallback(__classPrivateFieldGet$1(this, _KupDataTable_clickCbCustomPanel, "f"));
+  __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").removeClickCallback(__classPrivateFieldGet$2(this, _KupDataTable_clickCbCustomPanel, "f"));
 }, _KupDataTable_renderPaginator = function _KupDataTable_renderPaginator(top) {
   return (h("div", { class: "paginator-wrapper" }, h("div", { class: "paginator-tabs" }, this.showLoadMore ||
     (!this.lazyLoadRows &&
-      __classPrivateFieldGet$1(this, _KupDataTable_rowsLength, "f") > this.rowsPerPage) ? (h(FPaginator, { id: top ? 'top-paginator' : 'bottom-paginator', currentPage: this.currentPage, max: __classPrivateFieldGet$1(this, _KupDataTable_rowsLength, "f"), perPage: this.currentRowsPerPage
+      __classPrivateFieldGet$2(this, _KupDataTable_rowsLength, "f") > this.rowsPerPage) ? (h(FPaginator, { id: top ? 'top-paginator' : 'bottom-paginator', currentPage: this.currentPage, max: __classPrivateFieldGet$2(this, _KupDataTable_rowsLength, "f"), perPage: this.currentRowsPerPage
       ? this.currentRowsPerPage
       : this.rowsPerPage, onLoadMore: this.showLoadMore
       ? () => {
-        __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_onLoadMoreClick).call(this);
+        __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_onLoadMoreClick).call(this);
       }
-      : null, onNextPage: () => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_handlePageChange).call(this, this.currentPage + 1), onPrevPage: () => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_handlePageChange).call(this, this.currentPage - 1), onPageChange: (e) => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_handlePageChange).call(this, e.detail.value), onRowsChange: (e) => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_handleRowsPerPageChange).call(this, e.detail.value) })) : null)));
+      : null, onNextPage: () => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_handlePageChange).call(this, this.currentPage + 1), onPrevPage: () => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_handlePageChange).call(this, this.currentPage - 1), onPageChange: (e) => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_handlePageChange).call(this, e.detail.value), onRowsChange: (e) => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_handleRowsPerPageChange).call(this, e.detail.value) })) : null)));
 }, _KupDataTable_columnRemoveArea = function _KupDataTable_columnRemoveArea() {
-  return (h("div", { class: "droparea__remove", ref: (el) => (__classPrivateFieldSet$1(this, _KupDataTable_removeDropareaRef, el, "f")) }, h(FImage, { resource: "delete", color: `var(${KupThemeColorValues.DANGER})`, sizeX: "30px", sizeY: "50px" }), h(FImage, { resource: "delete-empty", color: `var(${KupThemeColorValues.DANGER})`, sizeX: "30px", sizeY: "50px" })));
+  return (h("div", { class: "droparea__remove", ref: (el) => (__classPrivateFieldSet$2(this, _KupDataTable_removeDropareaRef, el, "f")) }, h(FImage, { resource: "delete", color: `var(${KupThemeColorValues.DANGER})`, sizeX: "30px", sizeY: "50px" }), h(FImage, { resource: "delete-empty", color: `var(${KupThemeColorValues.DANGER})`, sizeX: "30px", sizeY: "50px" })));
 }, _KupDataTable_columnGroupArea = function _KupDataTable_columnGroupArea() {
-  return (h("div", { class: "droparea__groups", ref: (el) => (__classPrivateFieldSet$1(this, _KupDataTable_groupsDropareaRef, el, "f")) }, h(FImage, { resource: "bookmark", color: `var(${KupThemeColorValues.TEXT})`, sizeX: "30px", sizeY: "50px" }), h(FImage, { resource: "book", color: `var(${KupThemeColorValues.TEXT})`, sizeX: "30px", sizeY: "50px" })));
+  return (h("div", { class: "droparea__groups", ref: (el) => (__classPrivateFieldSet$2(this, _KupDataTable_groupsDropareaRef, el, "f")) }, h(FImage, { resource: "bookmark", color: `var(${KupThemeColorValues.TEXT})`, sizeX: "30px", sizeY: "50px" }), h(FImage, { resource: "book", color: `var(${KupThemeColorValues.TEXT})`, sizeX: "30px", sizeY: "50px" })));
 }, _KupDataTable_hideShowColumnDropArea = function _KupDataTable_hideShowColumnDropArea(show, th) {
   if (show && th && (this.removableColumns || this.showGroups)) {
-    __classPrivateFieldGet$1(this, _KupDataTable_dropareaRef, "f").classList.add('droparea--visible');
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dynamicPosition.register(__classPrivateFieldGet$1(this, _KupDataTable_dropareaRef, "f"), th, 10, KupDynamicPositionPlacement.TOP);
-    __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dynamicPosition.start(__classPrivateFieldGet$1(this, _KupDataTable_dropareaRef, "f"));
-    __classPrivateFieldGet$1(this, _KupDataTable_dropareaRef, "f").style.marginLeft =
-      th.clientWidth / 2 - __classPrivateFieldGet$1(this, _KupDataTable_dropareaRef, "f").clientWidth / 2 + 'px';
+    __classPrivateFieldGet$2(this, _KupDataTable_dropareaRef, "f").classList.add('droparea--visible');
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dynamicPosition.register(__classPrivateFieldGet$2(this, _KupDataTable_dropareaRef, "f"), th, 10, KupDynamicPositionPlacement.TOP);
+    __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dynamicPosition.start(__classPrivateFieldGet$2(this, _KupDataTable_dropareaRef, "f"));
+    __classPrivateFieldGet$2(this, _KupDataTable_dropareaRef, "f").style.marginLeft =
+      th.clientWidth / 2 - __classPrivateFieldGet$2(this, _KupDataTable_dropareaRef, "f").clientWidth / 2 + 'px';
   }
   else {
-    __classPrivateFieldGet$1(this, _KupDataTable_dropareaRef, "f").classList.remove('droparea--visible');
-    +__classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").dynamicPosition.stop(__classPrivateFieldGet$1(this, _KupDataTable_dropareaRef, "f"));
+    __classPrivateFieldGet$2(this, _KupDataTable_dropareaRef, "f").classList.remove('droparea--visible');
+    +__classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").dynamicPosition.stop(__classPrivateFieldGet$2(this, _KupDataTable_dropareaRef, "f"));
   }
 }, _KupDataTable_handleColumnGroup = function _KupDataTable_handleColumnGroup(column2group) {
   // Get sorted column current position
@@ -11465,19 +11482,19 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
         icon: icons[i],
         id: codes[i],
         selected: selectedCode == codes[i],
-        value: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(value),
+        value: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(value),
       };
     }
   }
   return listItems;
 }, _KupDataTable_getFontSizeCodeFromDecode = function _KupDataTable_getFontSizeCodeFromDecode(decode) {
-  return __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_transcodeItem).call(this, decode, __classPrivateFieldGet$1(this, _KupDataTable_FONTSIZE_DECODES, "f"), __classPrivateFieldGet$1(this, _KupDataTable_FONTSIZE_CODES, "f"));
+  return __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_transcodeItem).call(this, decode, __classPrivateFieldGet$2(this, _KupDataTable_FONTSIZE_DECODES, "f"), __classPrivateFieldGet$2(this, _KupDataTable_FONTSIZE_CODES, "f"));
 }, _KupDataTable_renderFontSizePanel = function _KupDataTable_renderFontSizePanel() {
-  const listItems = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_createListData).call(this, __classPrivateFieldGet$1(this, _KupDataTable_FONTSIZE_CODES, "f"), __classPrivateFieldGet$1(this, _KupDataTable_FONTSIZE_ICONS, "f"), this.fontsize);
+  const listItems = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_createListData).call(this, __classPrivateFieldGet$2(this, _KupDataTable_FONTSIZE_CODES, "f"), __classPrivateFieldGet$2(this, _KupDataTable_FONTSIZE_ICONS, "f"), this.fontsize);
   const listData = { data: listItems, showIcons: true };
   const textfieldData = {
     trailingIcon: true,
-    label: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageFontsize.LABEL),
+    label: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageFontsize.LABEL),
     icon: 'arrow_drop_down',
   };
   const data = { 'kup-text-field': textfieldData, 'kup-list': listData };
@@ -11494,22 +11511,22 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       text = KupLanguageFontsize.SMALL;
       break;
   }
-  return (h("div", { class: "customize-element fontsize-panel" }, h("kup-combobox", { isSelect: true, data: data, initialValue: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(text), "onkup-combobox-itemclick": (e) => {
+  return (h("div", { class: "customize-element fontsize-panel" }, h("kup-combobox", { isSelect: true, data: data, initialValue: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(text), "onkup-combobox-itemclick": (e) => {
       e.stopPropagation();
-      this.fontsize = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getFontSizeCodeFromDecode).call(this, e.detail.node.id);
+      this.fontsize = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getFontSizeCodeFromDecode).call(this, e.detail.node.id);
     } })));
 }, _KupDataTable_getDensityCodeFromDecode = function _KupDataTable_getDensityCodeFromDecode(decode) {
-  return __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_transcodeItem).call(this, decode, __classPrivateFieldGet$1(this, _KupDataTable_DENSITY_DECODES, "f"), [
+  return __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_transcodeItem).call(this, decode, __classPrivateFieldGet$2(this, _KupDataTable_DENSITY_DECODES, "f"), [
     'dense',
     'medium',
     'wide',
   ]);
 }, _KupDataTable_renderDensityPanel = function _KupDataTable_renderDensityPanel() {
-  const listItems = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_createListData).call(this, ['dense', 'medium', 'wide'], __classPrivateFieldGet$1(this, _KupDataTable_DENSITY_ICONS, "f"), this.density);
+  const listItems = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_createListData).call(this, ['dense', 'medium', 'wide'], __classPrivateFieldGet$2(this, _KupDataTable_DENSITY_ICONS, "f"), this.density);
   const listData = { data: listItems, showIcons: true };
   const textfieldData = {
     trailingIcon: true,
-    label: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageDensity.LABEL),
+    label: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageDensity.LABEL),
     icon: 'arrow_drop_down',
   };
   const data = { 'kup-text-field': textfieldData, 'kup-list': listData };
@@ -11526,14 +11543,14 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       text = KupLanguageDensity.WIDE;
       break;
   }
-  return (h("div", { class: "customize-element density-panel" }, h("kup-combobox", { isSelect: true, initialValue: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(text), selectMode: ItemsDisplayMode.DESCRIPTION, data: data, "onkup-combobox-itemclick": (e) => {
+  return (h("div", { class: "customize-element density-panel" }, h("kup-combobox", { isSelect: true, initialValue: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(text), selectMode: ItemsDisplayMode.DESCRIPTION, data: data, "onkup-combobox-itemclick": (e) => {
       e.stopPropagation();
-      this.density = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getDensityCodeFromDecode).call(this, e.detail.node.id);
+      this.density = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getDensityCodeFromDecode).call(this, e.detail.node.id);
     } })));
 }, _KupDataTable_getGridCodeFromDecode = function _KupDataTable_getGridCodeFromDecode(decode) {
-  return __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_transcodeItem).call(this, decode, __classPrivateFieldGet$1(this, _KupDataTable_GRID_DECODES, "f"), __classPrivateFieldGet$1(this, _KupDataTable_GRID_CODES, "f"));
+  return __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_transcodeItem).call(this, decode, __classPrivateFieldGet$2(this, _KupDataTable_GRID_DECODES, "f"), __classPrivateFieldGet$2(this, _KupDataTable_GRID_CODES, "f"));
 }, _KupDataTable_renderTransposeSwitch = function _KupDataTable_renderTransposeSwitch() {
-  return (h("div", { class: "customize-element grid-panel" }, h("kup-switch", { checked: this.transpose, label: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.TRANSPOSE_DATA), leadingLabel: true, "onkup-switch-change": (e) => {
+  return (h("div", { class: "customize-element grid-panel" }, h("kup-switch", { checked: this.transpose, label: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.TRANSPOSE_DATA), leadingLabel: true, "onkup-switch-change": (e) => {
       e.stopPropagation();
       if (e.detail.value === 'on') {
         this.transpose = true;
@@ -11543,16 +11560,16 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       }
     } })));
 }, _KupDataTable_renderTotalsMatrix = function _KupDataTable_renderTotalsMatrix() {
-  return (h("div", { class: "customize-element grid-panel" }, h("kup-button", { title: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.TOTALS_TABLE) +
+  return (h("div", { class: "customize-element grid-panel" }, h("kup-button", { title: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.TOTALS_TABLE) +
       ' (' +
-      __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.EXPERIMENTAL_FEAT) +
-      ')', label: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.TOTALS_TABLE), icon: "exposure", "onkup-button-click": () => __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_switchToTotalsMatrix).call(this) })));
+      __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.EXPERIMENTAL_FEAT) +
+      ')', label: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGeneric.TOTALS_TABLE), icon: "exposure", "onkup-button-click": () => __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_switchToTotalsMatrix).call(this) })));
 }, _KupDataTable_renderGridPanel = function _KupDataTable_renderGridPanel() {
-  const listItems = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_createListData).call(this, __classPrivateFieldGet$1(this, _KupDataTable_GRID_CODES, "f"), __classPrivateFieldGet$1(this, _KupDataTable_GRID_ICONS, "f"), this.showGrid);
+  const listItems = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_createListData).call(this, __classPrivateFieldGet$2(this, _KupDataTable_GRID_CODES, "f"), __classPrivateFieldGet$2(this, _KupDataTable_GRID_ICONS, "f"), this.showGrid);
   const listData = { data: listItems, showIcons: true };
   const textfieldData = {
     trailingIcon: true,
-    label: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGrid.LABEL),
+    label: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(KupLanguageGrid.LABEL),
     icon: 'arrow_drop_down',
   };
   const data = { 'kup-text-field': textfieldData, 'kup-list': listData };
@@ -11572,9 +11589,9 @@ _KupDataTable_initialized = new WeakMap(), _KupDataTable_rows = new WeakMap(), _
       text = KupLanguageGrid.ROW;
       break;
   }
-  return (h("div", { class: "customize-element grid-panel" }, h("kup-combobox", { isSelect: true, initialValue: __classPrivateFieldGet$1(this, _KupDataTable_kupManager, "f").language.translate(text), data: data, "onkup-combobox-itemclick": (e) => {
+  return (h("div", { class: "customize-element grid-panel" }, h("kup-combobox", { isSelect: true, initialValue: __classPrivateFieldGet$2(this, _KupDataTable_kupManager, "f").language.translate(text), data: data, "onkup-combobox-itemclick": (e) => {
       e.stopPropagation();
-      const grid = __classPrivateFieldGet$1(this, _KupDataTable_instances, "m", _KupDataTable_getGridCodeFromDecode).call(this, e.detail.value);
+      const grid = __classPrivateFieldGet$2(this, _KupDataTable_instances, "m", _KupDataTable_getGridCodeFromDecode).call(this, e.detail.value);
       this.showGrid = grid;
     } })));
 };
@@ -11961,6 +11978,158 @@ const KupDatePicker = class {
 };
 KupDatePicker.style = kupDatePickerCss;
 
+/**
+ * Props of the kup-dialog component.
+ * Used to export every prop in an object.
+ */
+var KupDialogProps;
+(function (KupDialogProps) {
+  KupDialogProps["autoCenter"] = "Auto centers the dialog relatively to the viewport.";
+  KupDialogProps["customStyle"] = "Custom style of the component.";
+  KupDialogProps["header"] = "Header options.";
+  KupDialogProps["modal"] = "Set of options to display the dialog as a modal.";
+  KupDialogProps["resizable"] = "Sets whether the dialog is resizable or not.";
+  KupDialogProps["sizeX"] = "The width of the dialog, defaults to auto. Accepts any valid CSS format (px, %, vw, etc.).";
+  KupDialogProps["sizeY"] = "The height of the dialog, defaults to auto. Accepts any valid CSS format (px, %, vh, etc.).";
+})(KupDialogProps || (KupDialogProps = {}));
+
+const kupDialogCss = ":host{--kup_dialog_header_height:var(--kup-dialog-header-height, 2em);box-sizing:border-box;display:block;height:var(--kup_dialog_height);left:var(--kup_dialog_left);min-height:var(--kup_dialog_height);min-width:var(--kup_dialog_width);position:absolute;top:var(--kup_dialog_top);transition:opacity 0.25s ease-in;width:var(--kup_dialog_width)}#kup-component{height:100%;width:100%}[fade-in]{opacity:0}[fade-in] ::slotted{display:none}.header{background-color:var(--kup-title-background-color);color:var(--kup-title-color);display:flex;flex-direction:row;height:var(--kup_dialog_header_height);position:relative;width:100%}.header__title{font-weight:bold;line-height:2em;padding-left:0.5em;padding-right:2em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header__close.f-image{--kup-icon-color:var(--kup-title-color);cursor:pointer;margin-right:0;transition:opacity 0.25s;position:absolute;right:0;background:var(--kup-title-background-color)}.header__close.f-image:hover{opacity:0.5}.content{height:calc(100% - var(--kup_dialog_header_height));overflow:auto}";
+
+var __classPrivateFieldGet$1 = (undefined && undefined.__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 __classPrivateFieldSet$1 = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+  if (kind === "m")
+    throw new TypeError("Private method is not writable");
+  if (kind === "a" && !f)
+    throw new TypeError("Private accessor was defined without a setter");
+  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+    throw new TypeError("Cannot write private member to an object whose class did not declare it");
+  return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var _KupDialog_header, _KupDialog_kupManager;
+const KupDialog = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.kupClose = createEvent(this, "kup-dialog-close", 6);
+    this.kupReady = createEvent(this, "kup-dialog-ready", 6);
+    /*-------------------------------------------------*/
+    /*       I n t e r n a l   V a r i a b l e s       */
+    /*-------------------------------------------------*/
+    _KupDialog_header.set(this, null);
+    _KupDialog_kupManager.set(this, kupManagerInstance());
+    this.autoCenter = { onReady: true };
+    this.customStyle = '';
+    this.header = { icons: { close: true } };
+    this.modal = { closeOnBackdropClick: true };
+    this.resizable = true;
+    this.sizeX = 'auto';
+    this.sizeY = 'auto';
+  }
+  /*-------------------------------------------------*/
+  /*           P u b l i c   M e t h o d s           */
+  /*-------------------------------------------------*/
+  /**
+   * Closes the dialog detaching it from the DOM.
+   */
+  async close() {
+    this.kupClose.emit({
+      comp: this,
+      id: this.rootElement.id,
+    });
+    this.rootElement.remove();
+  }
+  /**
+   * Used to retrieve component's props values.
+   * @param {boolean} descriptions - When provided and true, the result will be the list of props with their description.
+   * @returns {Promise<GenericObject>} List of props as object, each key will be a prop.
+   */
+  async getProps(descriptions) {
+    return getProps(this, KupDialogProps, descriptions);
+  }
+  /**
+   * Places the dialog at the center of the screen.
+   */
+  async recalcPosition() {
+    const rect = this.rootElement.getBoundingClientRect();
+    const left = window.innerWidth / 2 - rect.width / 2;
+    const top = window.innerHeight / 2 - rect.height / 2;
+    this.rootElement.style.setProperty('--kup_dialog_left', left + 'px');
+    this.rootElement.style.setProperty('--kup_dialog_top', top + 'px');
+  }
+  /**
+   * This method is used to trigger a new render of the component.
+   */
+  async refresh() {
+    forceUpdate(this);
+  }
+  /**
+   * Sets the props to the component.
+   * @param {GenericObject} props - Object containing props that will be set to the component.
+   */
+  async setProps(props) {
+    setProps(this, KupDialogProps, props);
+  }
+  /*-------------------------------------------------*/
+  /*          L i f e c y c l e   H o o k s          */
+  /*-------------------------------------------------*/
+  componentWillLoad() {
+    __classPrivateFieldGet$1(this, _KupDialog_kupManager, "f").debug.logLoad(this, false);
+    __classPrivateFieldGet$1(this, _KupDialog_kupManager, "f").theme.register(this);
+  }
+  componentDidLoad() {
+    var _a;
+    __classPrivateFieldGet$1(this, _KupDialog_kupManager, "f").interact.dialogify(this.rootElement, __classPrivateFieldGet$1(this, _KupDialog_header, "f") ? __classPrivateFieldGet$1(this, _KupDialog_header, "f") : null, !this.resizable);
+    if ((_a = this.autoCenter) === null || _a === void 0 ? void 0 : _a.onReady) {
+      this.recalcPosition().then(() => {
+        this.rootElement.removeAttribute('fade-in');
+      });
+    }
+    else {
+      this.rootElement.removeAttribute('fade-in');
+    }
+    if (this.modal) {
+      __classPrivateFieldGet$1(this, _KupDialog_kupManager, "f").interact.showModalBackdrop(this.modal.closeOnBackdropClick
+        ? () => {
+          this.close();
+        }
+        : null);
+    }
+    this.kupReady.emit({
+      comp: this,
+      id: this.rootElement.id,
+    });
+    __classPrivateFieldGet$1(this, _KupDialog_kupManager, "f").debug.logLoad(this, true);
+  }
+  componentWillRender() {
+    __classPrivateFieldGet$1(this, _KupDialog_kupManager, "f").debug.logRender(this, false);
+  }
+  componentDidRender() {
+    __classPrivateFieldGet$1(this, _KupDialog_kupManager, "f").debug.logRender(this, true);
+  }
+  render() {
+    var _a;
+    const style = {
+      '--kup_dialog_height': this.sizeY ? this.sizeY : 'auto',
+      '--kup_dialog_width': this.sizeX ? this.sizeX : 'auto',
+    };
+    return (h(Host, { "fade-in": true, style: style }, h("style", null, __classPrivateFieldGet$1(this, _KupDialog_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId }, this.header ? (h("div", { class: "header", ref: (el) => (__classPrivateFieldSet$1(this, _KupDialog_header, el, "f")) }, this.header.title ? (h("div", { class: "header__title" }, this.header.title)) : null, ((_a = this.header.icons) === null || _a === void 0 ? void 0 : _a.close) ? (h(FImage, { onClick: () => this.close(), sizeX: "1.25em", sizeY: "100%", resource: "clear", wrapperClass: "header__close" })) : null)) : null, h("div", { class: "content" }, h("slot", null)))));
+  }
+  disconnectedCallback() {
+    if (this.modal) {
+      __classPrivateFieldGet$1(this, _KupDialog_kupManager, "f").interact.hideModalBackdrop();
+    }
+    __classPrivateFieldGet$1(this, _KupDialog_kupManager, "f").theme.unregister(this);
+  }
+  get rootElement() { return getElement$1(this); }
+};
+_KupDialog_header = new WeakMap(), _KupDialog_kupManager = new WeakMap();
+KupDialog.style = kupDialogCss;
+
 /**
  * Props of the kup-dropdown-button component.
  * Used to export every prop in an object.
@@ -14479,12 +14648,6 @@ _KupList_kupManager = new WeakMap(), _KupList_radios = new WeakMap(), _KupList_l
   if (!this.filter) {
     return true;
   }
-  if (this.displayMode == ItemsDisplayMode.CODE) {
-    return (item.id.toLowerCase().indexOf(this.filter.toLowerCase()) >= 0);
-  }
-  if (this.displayMode == ItemsDisplayMode.DESCRIPTION) {
-    return (item.value.toLowerCase().indexOf(this.filter.toLowerCase()) >= 0);
-  }
   return (item.id.toLowerCase().indexOf(this.filter.toLowerCase()) >= 0 ||
     item.value.toLowerCase().indexOf(this.filter.toLowerCase()) >= 0);
 };
@@ -17675,4 +17838,4 @@ const KupTree = class {
 };
 KupTree.style = kupTreeCss;
 
-export { KupAutocomplete as kup_autocomplete, KupBadge as kup_badge, KupButton as kup_button, KupButtonList as kup_button_list, KupCard as kup_card, KupChart as kup_chart, KupCheckbox as kup_checkbox, KupChip as kup_chip, KupColorPicker as kup_color_picker, KupCombobox as kup_combobox, KupDataTable as kup_data_table, KupDatePicker as kup_date_picker, KupDropdownButton as kup_dropdown_button, KupForm as kup_form, KupGauge as kup_gauge, KupImage as kup_image, KupList as kup_list, KupProgressBar as kup_progress_bar, KupRadio as kup_radio, KupRating as kup_rating, KupSpinner as kup_spinner, KupSwitch as kup_switch, KupTabBar as kup_tab_bar, KupTextField as kup_text_field, KupTimePicker as kup_time_picker, KupTree as kup_tree };
+export { KupAutocomplete as kup_autocomplete, KupBadge as kup_badge, KupButton as kup_button, KupButtonList as kup_button_list, KupCard as kup_card, KupChart as kup_chart, KupCheckbox as kup_checkbox, KupChip as kup_chip, KupColorPicker as kup_color_picker, KupCombobox as kup_combobox, KupDataTable as kup_data_table, KupDatePicker as kup_date_picker, KupDialog as kup_dialog, KupDropdownButton as kup_dropdown_button, KupForm as kup_form, KupGauge as kup_gauge, KupImage as kup_image, KupList as kup_list, KupProgressBar as kup_progress_bar, KupRadio as kup_radio, KupRating as kup_rating, KupSpinner as kup_spinner, KupSwitch as kup_switch, KupTabBar as kup_tab_bar, KupTextField as kup_text_field, KupTimePicker as kup_time_picker, KupTree as kup_tree };