@genexus/genexus-ide-ui 0.0.45 → 0.0.47

package/dist/cjs/ch-global-stylesheet-0e78f960.js

@@ -0,0 +1,20 @@
+'use strict';
+
+const CH_GLOBAL_STYLESHEET = new CSSStyleSheet({ disabled: true });
+function adoptGlobalStyleSheet(adoptedStyleSheets) {
+  adoptedStyleSheets.push(CH_GLOBAL_STYLESHEET);
+}
+function appendStyle(text) {
+  const styleSheetParser = new CSSStyleSheet({ disabled: true });
+  styleSheetParser.replace(text);
+  for (let i = 0; i < styleSheetParser.cssRules.length; i++) {
+    CH_GLOBAL_STYLESHEET.insertRule(styleSheetParser.cssRules.item(i).cssText);
+  }
+}
+function enableStyleSheet() {
+  CH_GLOBAL_STYLESHEET.disabled = false;
+}
+
+exports.adoptGlobalStyleSheet = adoptGlobalStyleSheet;
+exports.appendStyle = appendStyle;
+exports.enableStyleSheet = enableStyleSheet;

package/dist/cjs/ch-grid-action-refresh_6.cjs.entry.js

@@ -83,59 +83,55 @@ const ChPaginator = class {
   }
   navigateClickedHandler(eventInfo) {
     eventInfo.stopPropagation();
-    switch (eventInfo.detail.type) {
-      case "first":
-        this.first();
-        break;
-      case "previous":
-        this.previous();
-        break;
-      case "next":
-        this.next();
-        break;
-      case "last":
-        this.last();
-        break;
-    }
-    this.pageNavigationRequested.emit({ type: eventInfo.detail.type });
+    this.navigate(eventInfo.detail.type);
   }
   pageChangedHandler(eventInfo) {
     eventInfo.stopPropagation();
-    const emitPageNavigationRequested = this.activePage !== eventInfo.detail.page;
-    this.activePage = eventInfo.detail.page;
-    if (emitPageNavigationRequested) {
-      this.pageNavigationRequested.emit({
-        type: "goto",
-        page: eventInfo.detail.page
-      });
-    }
-  }
-  loadElements() {
-    this.elPages = this.el.querySelector("ch-paginator-pages");
-    this.elFirst = this.el.querySelector("ch-paginator-navigate[type='first']");
-    this.elPrevious = this.el.querySelector("ch-paginator-navigate[type='previous']");
-    this.elNext = this.el.querySelector("ch-paginator-navigate[type='next']");
-    this.elLast = this.el.querySelector("ch-paginator-navigate[type='last']");
+    this.navigate("goto", eventInfo.detail.page);
   }
   keyDownHandler(eventInfo) {
     switch (eventInfo.key) {
       case "Home":
-        this.first();
-        this.elFirst.focus();
+        this.navigate("first");
         break;
       case "PageUp":
-        this.previous();
-        this.elPrevious.focus();
+        this.navigate("previous");
         break;
       case "PageDown":
-        this.next();
-        this.elNext.focus();
+        this.navigate("next");
         break;
       case "End":
+        this.navigate("last");
+        break;
+    }
+  }
+  navigate(type, page) {
+    var _a, _b, _c, _d;
+    const emitPageNavigationRequested = !page || page !== this.activePage;
+    switch (type) {
+      case "first":
+        this.first();
+        (_a = this.elFirst) === null || _a === void 0 ? void 0 : _a.focus();
+        break;
+      case "previous":
+        this.previous();
+        (_b = this.elPrevious) === null || _b === void 0 ? void 0 : _b.focus();
+        break;
+      case "next":
+        this.next();
+        (_c = this.elNext) === null || _c === void 0 ? void 0 : _c.focus();
+        break;
+      case "last":
         this.last();
-        this.elLast.focus();
+        (_d = this.elLast) === null || _d === void 0 ? void 0 : _d.focus();
+        break;
+      case "goto":
+        this.goto(page);
         break;
     }
+    if (emitPageNavigationRequested) {
+      this.pageNavigationRequested.emit({ type, page });
+    }
   }
   first() {
     this.activePage = 1;
@@ -152,6 +148,16 @@ const ChPaginator = class {
   last() {
     this.activePage = this.totalPages;
   }
+  goto(page) {
+    this.activePage = Math.max(Math.min(page, this.totalPages), 1);
+  }
+  loadElements() {
+    this.elPages = this.el.querySelector("ch-paginator-pages");
+    this.elFirst = this.el.querySelector("ch-paginator-navigate[type='first']");
+    this.elPrevious = this.el.querySelector("ch-paginator-navigate[type='previous']");
+    this.elNext = this.el.querySelector("ch-paginator-navigate[type='next']");
+    this.elLast = this.el.querySelector("ch-paginator-navigate[type='last']");
+  }
   render() {
     if (this.elPages) {
       this.elPages.totalPages = this.totalPages;

package/dist/cjs/ch-grid-infinite-scroll.cjs.entry.js

@@ -0,0 +1,57 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-5a32426a.js');
+
+const chGridInfiniteScrollCss = ":host{display:flex;grid-column-start:1;grid-column-end:-1}.loading:not([hidden]){display:contents}";
+
+const ChGridInfiniteScroll = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.infinite = index.createEvent(this, "infinite", 7);
+    /**
+     * Indicates whether the grid is loading or already loaded.
+     */
+    this.status = "loaded";
+    this.intersectionObserverHandler = (entries, observer) => {
+      const hasGridScroll = this.gridLayoutElement.scrollHeight !==
+        this.gridLayoutElement.clientHeight;
+      const emitInfinite = observer.root ? hasGridScroll : !hasGridScroll;
+      if (emitInfinite && entries[0].isIntersecting && this.status === "loaded") {
+        this.status = "loading";
+        this.infinite.emit();
+      }
+    };
+  }
+  componentWillLoad() {
+    this.gridLayoutElement = this.el.assignedSlot.closest("section.main");
+    this.intersectionGridLayoutObserver = new IntersectionObserver(this.intersectionObserverHandler, {
+      root: this.gridLayoutElement,
+      rootMargin: "1px"
+    });
+    this.intersectionGridLayoutObserver.observe(this.el);
+    this.intersectionDocumentObserver = new IntersectionObserver(this.intersectionObserverHandler, {
+      rootMargin: "1px"
+    });
+    this.intersectionDocumentObserver.observe(this.el);
+  }
+  disconnectedCallback() {
+    if (this.intersectionGridLayoutObserver) {
+      this.intersectionGridLayoutObserver.disconnect();
+    }
+  }
+  /**
+   * Indicates that the grid is already loaded.
+   */
+  async complete() {
+    this.status = "loaded";
+  }
+  render() {
+    return (index.h("div", { class: "loading", hidden: !(this.status === "loading") }, index.h("slot", null)));
+  }
+  get el() { return index.getElement(this); }
+};
+ChGridInfiniteScroll.style = chGridInfiniteScrollCss;
+
+exports.ch_grid_infinite_scroll = ChGridInfiniteScroll;

package/dist/cjs/ch-grid-virtual-scroller.cjs.entry.js

@@ -10,6 +10,7 @@ const ChGridVirtualScrollerLegend = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.viewPortItemsChanged = index.createEvent(this, "viewPortItemsChanged", 7);
+    this.resizeObserver = new ResizeObserver(this.resizeHandler.bind(this));
     /**
      * Height of each row in pixels.
      */
@@ -30,34 +31,12 @@ const ChGridVirtualScrollerLegend = class {
      * The maximum number of items that can fit on the screen at any given time.
      */
     this.maxViewPortItems = 1;
-    this.resizeObserver = new ResizeObserver(this.resizeHandler.bind(this));
-  }
-  componentWillLoad() {
-    this.gridMainEl = this.el.assignedSlot.parentElement;
-    this.resizeObserver.observe(this.gridMainEl);
-    this.resizeObserver.observe(document.documentElement);
-  }
-  componentDidLoad() {
-    this.updateViewPortItems();
-  }
-  disconnectedCallback() {
-    this.resizeObserver.disconnect();
-  }
-  itemsHandler() {
-    if (this.gridMainEl) {
-      this.updateViewPortItems();
-    }
   }
   rowHeightHandler() {
     if (this.gridMainEl) {
       this.updateViewPortItems();
     }
   }
-  maxViewPortItemsHandler() {
-    if (this.gridMainEl) {
-      this.updateViewPortItems();
-    }
-  }
   hasScrollHandler() {
     if (this.hasGridScroll) {
       this.gridMainEl.addEventListener("scroll", this.updateViewPortItems.bind(this), { passive: true });
@@ -78,6 +57,32 @@ const ChGridVirtualScrollerLegend = class {
     }
     this.updateViewPortItems();
   }
+  maxViewPortItemsHandler() {
+    if (this.gridMainEl) {
+      this.updateViewPortItems();
+    }
+  }
+  itemsHandler() {
+    if (this.gridMainEl) {
+      this.updateViewPortItems();
+    }
+  }
+  itemsCountHandler() {
+    if (this.gridMainEl) {
+      this.updateViewPortItems();
+    }
+  }
+  componentWillLoad() {
+    this.gridMainEl = this.el.assignedSlot.parentElement;
+    this.resizeObserver.observe(this.gridMainEl);
+    this.resizeObserver.observe(document.documentElement);
+  }
+  componentDidLoad() {
+    this.updateViewPortItems();
+  }
+  disconnectedCallback() {
+    this.resizeObserver.disconnect();
+  }
   resizeHandler() {
     const rowHeights = getComputedStyle(this.gridMainEl).gridTemplateRows.split(" ");
     this.browserHeight = document.documentElement.clientHeight;
@@ -133,11 +138,12 @@ const ChGridVirtualScrollerLegend = class {
   }
   get el() { return index.getElement(this); }
   static get watchers() { return {
-    "items": ["itemsHandler"],
     "rowHeight": ["rowHeightHandler"],
-    "maxViewPortItems": ["maxViewPortItemsHandler"],
     "hasGridScroll": ["hasScrollHandler"],
-    "hasWindowScroll": ["hasWindowScrollHandler"]
+    "hasWindowScroll": ["hasWindowScrollHandler"],
+    "maxViewPortItems": ["maxViewPortItemsHandler"],
+    "items": ["itemsHandler"],
+    "itemsCount": ["itemsCountHandler"]
   }; }
 };
 ChGridVirtualScrollerLegend.style = chGridVirtualScrollerCss;

package/dist/cjs/ch-grid_8.cjs.entry.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5a32426a.js');
-const chGlobalStylesheet = require('./ch-global-stylesheet-145c4b20.js');
-const helpers = require('./helpers-8845f008.js');
+const chGlobalStylesheet = require('./ch-global-stylesheet-0e78f960.js');
+const helpers = require('./helpers-291cb1cb.js');
 const store = require('./store-0866de9f.js');
 
 /**
@@ -1508,7 +1508,7 @@ class ChGridManager {
     this.styleSheet.insertRule(`:host {}`, StyleRule.BASE_LAYER);
     this.styleSheet.insertRule(".main {}", StyleRule.COLUMNS_WIDTH);
     this.grid.shadowRoot.adoptedStyleSheets.push(this.styleSheet);
-    this.grid.shadowRoot.adoptedStyleSheets.push(chGlobalStylesheet.CH_GLOBAL_STYLESHEET);
+    chGlobalStylesheet.adoptGlobalStyleSheet(this.grid.shadowRoot.adoptedStyleSheets);
     this.columns = new ChGridManagerColumns(this);
     this.selection = new ChGridManagerSelection(this);
     this.rowActions = new ChGridManagerRowActions(this);
@@ -1975,7 +1975,7 @@ const ChGrid = class {
     }
   }
   windowKeyDownHandler(eventInfo) {
-    if (document.activeElement === this.el &&
+    if (helpers.focusComposedPath()[0] === this.el &&
       [
         " ",
         "+",
@@ -1993,7 +1993,7 @@ const ChGrid = class {
     }
   }
   keyDownHandler(eventInfo) {
-    if (document.activeElement === this.el) {
+    if (helpers.focusComposedPath()[0] === this.el) {
       switch (eventInfo.key) {
         case " ":
           this.toggleRowsMarked();
@@ -2044,17 +2044,23 @@ const ChGrid = class {
             ? this.rowHighlighted
             : null);
     }
-    if (this.manager.selection.selecting) {
-      const row = this.manager.getRowEventTarget(eventInfo);
-      const cell = this.manager.getCellEventTarget(eventInfo);
-      if (row &&
-        (this.manager.selection.selectingRow !== row ||
-          this.manager.selection.selectingCell !== cell)) {
-        const isKeyModifierPressed = helpers.mouseEventModifierKey(eventInfo);
-        const isMouseButtonRightPressed = helpers.mouseEventHasButtonPressed(eventInfo, helpers.MouseEventButtons.RIGHT);
-        this.selectByPointerEvent(row, cell, isKeyModifierPressed && !isMouseButtonRightPressed, !isMouseButtonRightPressed, isMouseButtonRightPressed);
-        this.manager.selection.selectingRow = row;
-        this.manager.selection.selectingCell = cell;
+    selectingBlock: {
+      if (this.manager.selection.selecting) {
+        if (helpers.focusComposedPath()[0] !== this.el) {
+          this.stopSelecting();
+          break selectingBlock;
+        }
+        const row = this.manager.getRowEventTarget(eventInfo);
+        const cell = this.manager.getCellEventTarget(eventInfo);
+        if (row &&
+          (this.manager.selection.selectingRow !== row ||
+            this.manager.selection.selectingCell !== cell)) {
+          const isKeyModifierPressed = helpers.mouseEventModifierKey(eventInfo);
+          const isMouseButtonRightPressed = helpers.mouseEventHasButtonPressed(eventInfo, helpers.MouseEventButtons.RIGHT);
+          this.selectByPointerEvent(row, cell, isKeyModifierPressed && !isMouseButtonRightPressed, !isMouseButtonRightPressed, isMouseButtonRightPressed);
+          this.manager.selection.selectingRow = row;
+          this.manager.selection.selectingCell = cell;
+        }
       }
     }
   }
@@ -2077,9 +2083,7 @@ const ChGrid = class {
     }
   }
   mouseUpHandler() {
-    this.manager.selection.selecting = false;
-    this.manager.selection.selectingRow = null;
-    this.manager.selection.selectingCell = null;
+    this.stopSelecting();
   }
   dblclickHandler(eventInfo) {
     const row = this.manager.getRowEventTarget(eventInfo);
@@ -2105,8 +2109,8 @@ const ChGrid = class {
       const cellFocused = ((_a = this.cellSelected) === null || _a === void 0 ? void 0 : _a.row) === targetRow ? this.cellSelected : null;
       const rowContextMenuEventInfo = this.rowContextMenu.emit({
         rowId: targetRow.rowId,
-        cellId: cellFocused.cellId,
-        columnId: cellFocused.column.columnId,
+        cellId: cellFocused === null || cellFocused === void 0 ? void 0 : cellFocused.cellId,
+        columnId: cellFocused === null || cellFocused === void 0 ? void 0 : cellFocused.column.columnId,
         selectedRowsId: this.rowsSelected.map(row => row.rowId),
         clientX: eventInfo.clientX,
         clientY: eventInfo.clientY
@@ -2443,6 +2447,11 @@ const ChGrid = class {
     this.cellSelected = cellSelected;
     rowFocused === null || rowFocused === void 0 ? void 0 : rowFocused.ensureVisible();
   }
+  stopSelecting() {
+    this.manager.selection.selecting = false;
+    this.manager.selection.selectingRow = null;
+    this.manager.selection.selectingCell = null;
+  }
   renderSettings() {
     return (index.h("ch-grid-settings", { grid: this.el, ref: el => (this.settingsUI = el), exportparts: "\n          mask:settings-mask,\n          window:settings-window,\n          header:settings-header,\n          caption:settings-caption,\n          close:settings-close,\n          main:settings-main,\n          footer:settings-footer\n        " }, index.h("slot", { name: "settings" }, index.h("ch-grid-settings-columns", { part: "settings-columns", columns: [...this.manager.getColumns()], exportparts: "\n              column:settings-columns-item,\n              column-label:settings-columns-label,\n              column-visible:settings-columns-visible,\n              column-visible-checked:settings-columns-visible-checked\n            " }))));
   }

package/dist/cjs/ch-style.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5a32426a.js');
-const chGlobalStylesheet = require('./ch-global-stylesheet-145c4b20.js');
+const chGlobalStylesheet = require('./ch-global-stylesheet-0e78f960.js');
 
 const chStyleCss = ":host{display:none}";
 
@@ -16,15 +16,15 @@ const ChStyle = class {
       fetch(this.href).then(response => {
         if (response.ok) {
           response.text().then(style => {
-            chGlobalStylesheet.CH_GLOBAL_STYLESHEET.replace(style);
-            chGlobalStylesheet.CH_GLOBAL_STYLESHEET.disabled = false;
+            chGlobalStylesheet.appendStyle(style);
+            chGlobalStylesheet.enableStyleSheet();
           });
         }
       });
     }
     else {
-      chGlobalStylesheet.CH_GLOBAL_STYLESHEET.replace(this.el.innerText);
-      chGlobalStylesheet.CH_GLOBAL_STYLESHEET.disabled = false;
+      chGlobalStylesheet.appendStyle(this.el.innerText);
+      chGlobalStylesheet.enableStyleSheet();
     }
   }
   get el() { return index.getElement(this); }

package/dist/cjs/ch-suggest_4.cjs.entry.js

@@ -315,7 +315,7 @@ const ChSuggestListItem = class {
 };
 ChSuggestListItem.style = chSuggestListItemCss;
 
-const stylesCss = "@charset \"UTF-8\";:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-01--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-02{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-02--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-03{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-03--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-04{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-04--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-05{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em}.gxg-title-05--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em;color:var(--color-on-primary)}.gxg-text{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-text--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-text--gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--gray-05)}.gxg-quote{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;font-style:italic}.gxg-quote--negative{color:var(--color-on-primary)}.gxg-link{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--color-primary-hover)}.gxg-link:active{color:var(--color-primary-active)}.gxg-link-gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04)}.gxg-link-gray:hover{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04);color:var(--gray-06)}.gxg-alert-error{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-error-dark);display:inline-block}.gxg-alert-warning{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-warning-dark);display:inline-block}.gxg-alert-success{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-success-dark);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-button-styles{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:6px;height:6px}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host(.gxg-validation--warning) .form-element{border-color:var(--color-warning-dark)}:host(.gxg-validation--warning) .form-element:focus{outline-color:var(--color-warning-dark);border-color:var(--color-warning-dark)}:host(.gxg-validation--warning) .form-element:focus+.checkmark{--checkmark-border-color:var(--color-warning-dark)}:host(.gxg-validation--error) .form-element{border-color:var(--color-error-dark)}:host(.gxg-validation--error) .form-element:focus{outline-color:var(--color-error-dark);border-color:var(--color-error-dark)}:host(.gxg-validation--error) .form-element:focus+.checkmark{--checkmark-border-color:var(--color-error-dark)}:host(.gxg-validation--success) .form-element{border-color:var(--color-success-dark)}:host(.gxg-validation--success) .form-element:focus{outline-color:var(--color-success-dark);border-color:var(--color-success-dark)}:host(.gxg-validation--success) .form-element:focus+.checkmark{--checkmark-border-color:var(--color-success-dark)}ch-suggest{font-family:var(--font-family-primary);font-size:var(--font-size-lg);color:var(--color-on-background);}ch-suggest::-webkit-scrollbar{width:6px;height:6px}ch-suggest::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}ch-suggest::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}ch-suggest::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}ch-suggest ::-webkit-scrollbar{width:6px;height:6px}ch-suggest ::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}ch-suggest ::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}ch-suggest ::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}ch-suggest::part(label){font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;display:flex;align-items:center;cursor:default;font-size:inherit}ch-suggest[label-position=start]::part(label){margin-inline-end:var(--gxg-label-margin-horizontal)}ch-suggest[label-position=above]::part(label){margin-block-end:var(--gxg-label-margin-vertical)}ch-suggest::part(input){height:var(--spacing-comp-05);border:var(--border-width-sm) solid var(--gxg-border-color--regular);padding:var(--spacing-comp-01) var(--spacing-comp-02);box-sizing:border-box;background-color:var(--color-background)}ch-suggest::part(input):focus{outline-style:solid;outline-color:var(--color-primary-active);outline-width:var(--border-width-md);outline-offset:-2px}ch-suggest::part(input):focus{outline-style:solid;outline-color:var(--color-primary-active);outline-width:var(--border-width-md);outline-offset:-2px}ch-suggest::part(header){display:block;padding-block-end:var(--spacing-comp-02);display:flex;justify-content:flex-end}ch-suggest::part(close-button){height:var(--spacing-comp-05);width:var(--spacing-comp-05);background-color:var(--color-background);color:var(--color-primary-hover);border:1px solid var(--color-primary-hover);box-sizing:border-box;cursor:pointer;display:block}ch-suggest::part(close-button):hover{background-color:var(--color-primary-hover-opacity-01)}ch-suggest::part(close-button)::after{content:\"✖\";width:100%;display:block;line-height:24px;text-align:center}ch-suggest::part(close-button):focus{outline-style:solid;outline-color:var(--color-primary-active);outline-width:var(--border-width-md);outline-offset:-2px}ch-suggest::part(dropdown){background-color:var(--color-background);margin-top:var(--spacing-comp-01);padding:var(--spacing-comp-02);box-shadow:var(--box-shadow-02);}ch-suggest::part(dropdown)::-webkit-scrollbar{width:6px;height:6px}ch-suggest::part(dropdown)::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}ch-suggest::part(dropdown)::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}ch-suggest::part(dropdown)::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}ch-suggest::part(dropdown) ::-webkit-scrollbar{width:6px;height:6px}ch-suggest::part(dropdown) ::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}ch-suggest::part(dropdown) ::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}ch-suggest::part(dropdown) ::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.messages-wrapper{margin-top:var(--spacing-comp-02);display:flex;gap:var(--spacing-comp-01);flex-direction:column}gxg-suggest.gxg-validation--success ch-suggest::part(input){outline-color:var(--color-success-dark);border-color:var(--color-success-dark)}gxg-suggest.gxg-validation--success ch-suggest::part(input)+.checkmark{--checkmark-border-color:var(--color-success-dark)}gxg-suggest.gxg-validation--warning ch-suggest::part(input){outline-color:var(--color-warning-dark);border-color:var(--color-warning-dark)}gxg-suggest.gxg-validation--warning ch-suggest::part(input)+.checkmark{--checkmark-border-color:var(--color-warning-dark)}gxg-suggest.gxg-validation--error ch-suggest::part(input){outline-color:var(--color-error-dark);border-color:var(--color-error-dark)}gxg-suggest.gxg-validation--error ch-suggest::part(input)+.checkmark{--checkmark-border-color:var(--color-error-dark)}gxg-suggest.gxg--disabled ch-suggest{pointer-events:none}gxg-suggest.gxg--disabled ch-suggest::part(input){background-color:var(--gray-01);color:var(--color-on-disabled)}gxg-suggest[ellipsis]:not([ellipsis=false]) ch-suggest-list-item::part(content-wrapper){white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}ch-suggest-list{margin-block-start:var(--spacing-comp-02);font-family:inherit;border:var(--border-width-sm) solid var(--gxg-border-color--regular)}ch-suggest-list:first-child{margin-block-start:0}ch-suggest-list:last-child{margin-block-end:0}ch-suggest-list::part(title){text-transform:uppercase;font-weight:var(--font-weight-semibold);margin:var(--spacing-comp-01) 0 0 0;padding:var(--spacing-comp-01) var(--spacing-comp-02)}ch-suggest-list:first-child{margin-block-start:0}ch-suggest-list+ch-suggest-list{margin-block-start:0;border-block-start:0}ch-suggest-list+ch-suggest-list::part(title){margin-block-start:0}ch-suggest-list-item{}ch-suggest-list-item::part(button){padding:var(--spacing-comp-01) var(--spacing-comp-02);align-items:center;gap:var(--spacing-comp-01);box-sizing:border-box}ch-suggest-list-item::part(button):focus{outline-style:solid;outline-color:var(--color-primary-active);outline-width:var(--border-width-md);outline-offset:-2px}ch-suggest-list-item::part(description)::before{content:\" - \"}ch-suggest-list-item gxg-icon::part(ch-icon){--icon-size:16px;margin-right:2px}ch-suggest-list-item:hover{background-color:var(--gxg-background-color-item-hover)}";
+const stylesCss = "@charset \"UTF-8\";:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-01--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-02{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-02--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-03{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-03--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-04{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-04--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-05{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em}.gxg-title-05--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em;color:var(--color-on-primary)}.gxg-text{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-text--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-text--gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--gray-05)}.gxg-quote{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;font-style:italic}.gxg-quote--negative{color:var(--color-on-primary)}.gxg-link{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--color-primary-hover)}.gxg-link:active{color:var(--color-primary-active)}.gxg-link-gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04)}.gxg-link-gray:hover{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04);color:var(--gray-06)}.gxg-alert-error{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-error-dark);display:inline-block}.gxg-alert-warning{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-warning-dark);display:inline-block}.gxg-alert-success{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-success-dark);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-button-styles{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:6px;height:6px}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host(.gxg-validation--warning) .form-element{border-color:var(--color-warning-dark)}:host(.gxg-validation--warning) .form-element:focus{outline-color:var(--color-warning-dark);border-color:var(--color-warning-dark)}:host(.gxg-validation--warning) .form-element:focus+.checkmark{--checkmark-border-color:var(--color-warning-dark)}:host(.gxg-validation--error) .form-element{border-color:var(--color-error-dark)}:host(.gxg-validation--error) .form-element:focus{outline-color:var(--color-error-dark);border-color:var(--color-error-dark)}:host(.gxg-validation--error) .form-element:focus+.checkmark{--checkmark-border-color:var(--color-error-dark)}:host(.gxg-validation--success) .form-element{border-color:var(--color-success-dark)}:host(.gxg-validation--success) .form-element:focus{outline-color:var(--color-success-dark);border-color:var(--color-success-dark)}:host(.gxg-validation--success) .form-element:focus+.checkmark{--checkmark-border-color:var(--color-success-dark)}ch-suggest{font-family:var(--font-family-primary);font-size:var(--font-size-lg);color:var(--color-on-background);}ch-suggest::-webkit-scrollbar{width:6px;height:6px}ch-suggest::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}ch-suggest::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}ch-suggest::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}ch-suggest ::-webkit-scrollbar{width:6px;height:6px}ch-suggest ::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}ch-suggest ::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}ch-suggest ::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}ch-suggest::part(label){font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;display:flex;align-items:center;cursor:default;font-size:inherit}ch-suggest[label-position=start]::part(label){margin-inline-end:var(--gxg-label-margin-horizontal)}ch-suggest[label-position=above]::part(label){margin-block-end:var(--gxg-label-margin-vertical)}ch-suggest::part(input){height:var(--spacing-comp-05);border:var(--border-width-sm) solid var(--gxg-border-color--regular);padding:var(--spacing-comp-01) var(--spacing-comp-02);box-sizing:border-box;background-color:var(--color-background)}ch-suggest::part(input):focus{outline-style:solid;outline-color:var(--gxg-border-color--focused);outline-width:var(--border-width-md);outline-offset:-2px}ch-suggest::part(input):focus{outline-style:solid;outline-color:var(--gxg-border-color--focused);outline-width:var(--border-width-md);outline-offset:-2px}ch-suggest::part(header){display:block;padding-block-end:var(--spacing-comp-02);display:flex;justify-content:flex-end}ch-suggest::part(close-button){height:var(--spacing-comp-05);width:var(--spacing-comp-05);background-color:var(--color-background);color:var(--color-primary-hover);border:1px solid var(--color-primary-hover);box-sizing:border-box;cursor:pointer;display:block}ch-suggest::part(close-button):hover{background-color:var(--color-primary-hover-opacity-01)}ch-suggest::part(close-button)::after{content:\"✖\";width:100%;display:block;line-height:24px;text-align:center}ch-suggest::part(close-button):focus{outline-style:solid;outline-color:var(--gxg-border-color--focused);outline-width:var(--border-width-md);outline-offset:-2px}ch-suggest::part(dropdown){background-color:var(--color-background);margin-top:var(--spacing-comp-01);padding:var(--spacing-comp-02);box-shadow:var(--box-shadow-02);}ch-suggest::part(dropdown)::-webkit-scrollbar{width:6px;height:6px}ch-suggest::part(dropdown)::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}ch-suggest::part(dropdown)::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}ch-suggest::part(dropdown)::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}ch-suggest::part(dropdown) ::-webkit-scrollbar{width:6px;height:6px}ch-suggest::part(dropdown) ::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}ch-suggest::part(dropdown) ::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}ch-suggest::part(dropdown) ::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.messages-wrapper{margin-top:var(--spacing-comp-02);display:flex;gap:var(--spacing-comp-01);flex-direction:column}gxg-suggest.gxg-validation--success ch-suggest::part(input){outline-color:var(--color-success-dark);border-color:var(--color-success-dark)}gxg-suggest.gxg-validation--success ch-suggest::part(input)+.checkmark{--checkmark-border-color:var(--color-success-dark)}gxg-suggest.gxg-validation--warning ch-suggest::part(input){outline-color:var(--color-warning-dark);border-color:var(--color-warning-dark)}gxg-suggest.gxg-validation--warning ch-suggest::part(input)+.checkmark{--checkmark-border-color:var(--color-warning-dark)}gxg-suggest.gxg-validation--error ch-suggest::part(input){outline-color:var(--color-error-dark);border-color:var(--color-error-dark)}gxg-suggest.gxg-validation--error ch-suggest::part(input)+.checkmark{--checkmark-border-color:var(--color-error-dark)}gxg-suggest.gxg--disabled ch-suggest{pointer-events:none}gxg-suggest.gxg--disabled ch-suggest::part(input){background-color:var(--gray-01);color:var(--color-on-disabled)}gxg-suggest[ellipsis]:not([ellipsis=false]) ch-suggest-list-item::part(content-wrapper){white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}ch-suggest-list{margin-block-start:var(--spacing-comp-02);font-family:inherit;border:var(--border-width-sm) solid var(--gxg-border-color--regular)}ch-suggest-list:first-child{margin-block-start:0}ch-suggest-list:last-child{margin-block-end:0}ch-suggest-list::part(title){text-transform:uppercase;font-weight:var(--font-weight-semibold);margin:var(--spacing-comp-01) 0 0 0;padding:var(--spacing-comp-01) var(--spacing-comp-02)}ch-suggest-list:first-child{margin-block-start:0}ch-suggest-list+ch-suggest-list{margin-block-start:0;border-block-start:0}ch-suggest-list+ch-suggest-list::part(title){margin-block-start:0}ch-suggest-list-item{}ch-suggest-list-item::part(button){padding:var(--spacing-comp-01) var(--spacing-comp-02);align-items:center;gap:var(--spacing-comp-01);box-sizing:border-box}ch-suggest-list-item::part(button):focus{outline-style:solid;outline-color:var(--gxg-border-color--focused);outline-width:var(--border-width-md);outline-offset:-2px}ch-suggest-list-item::part(description)::before{content:\" - \"}ch-suggest-list-item gxg-icon::part(ch-icon){--icon-size:16px;margin-right:2px}ch-suggest-list-item:hover{background-color:var(--gxg-background-color--hover)}";
 
 const GxgSuggest = class {
   constructor(hostRef) {

package/dist/cjs/ch-test-tree-x.cjs.entry.js

@@ -4,8 +4,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5a32426a.js');
 
-const testTreeXCss = "ch-test-tree-x{display:grid;grid-template-columns:350px max-content;grid-template-rows:1fr;height:100%}.tree-buttons{display:grid;grid-auto-rows:max-content;row-gap:8px}:not(.ch-tree-x-dragging-item) ch-tree-x-list-item:not([selected])::part(header):hover{background-color:#e8e8e9}.ch-tree-x-list-item--drag-enter{background-color:#eee;box-shadow:inset 0 0 1px 0px black}.ch-tree-x-list-item--drag-enter[selected]::part(header){background-color:#eee}ch-tree-x-list-item::part(header){border:1px solid transparent}ch-tree-x-list-item[selected]::part(header){background-color:#cfdee6;border-color:#0266a0}ch-tree-x-list-item.ch-tree-x-list-item--editing::part(header){background-color:rgba(207, 222, 230, 0.5);border-color:transparent}ch-tree-x-list-item:not(.ch-tree-x-list-item--editing)::part(header):focus-visible{border-color:black;z-index:1}.ch-tree-x-drag-info{padding-inline:6px;padding-block:2px;background-color:#cfdee6;border:1px solid #0266a0;border-radius:10px;font-size:8px}";
+const testTreeXCss = "ch-test-tree-x{display:grid;grid-template-columns:500px max-content;grid-template-rows:1fr;height:100%}.tree-buttons{display:grid;grid-auto-rows:max-content;row-gap:8px}:not(.ch-tree-x-dragging-item) ch-tree-x-list-item:not([selected])::part(header):hover{background-color:#e8e8e9}.ch-tree-x-list-item--drag-enter{background-color:#eee;box-shadow:inset 0 0 1px 0px black}.ch-tree-x-list-item--drag-enter[selected]::part(header){background-color:#eee}ch-tree-x-list-item::part(header){border:1px solid transparent}ch-tree-x-list-item[selected]::part(header){background-color:#cfdee6;border-color:#0266a0}ch-tree-x-list-item.ch-tree-x-list-item--editing::part(header){background-color:rgba(207, 222, 230, 0.5);border-color:transparent}ch-tree-x-list-item:not(.ch-tree-x-list-item--editing)::part(header):focus-visible{border-color:black;z-index:1}.ch-tree-x-drag-info{padding-inline:6px;padding-block:2px;background-color:#cfdee6;border:1px solid #0266a0;border-radius:10px;font-size:8px}";
 
+const DEFAULT_DRAG_DISABLED_VALUE = false;
+const DEFAULT_DROP_DISABLED_VALUE = false;
 const DEFAULT_EXPANDED_VALUE = false;
 const DEFAULT_INDETERMINATE_VALUE = false;
 const DEFAULT_LAZY_VALUE = false;
@@ -22,6 +24,16 @@ const ChTestTreeX = class {
      * of items.
      */
     this.waitDropProcessing = false;
+    /**
+     * This attribute lets you specify if the drag operation is disabled in all
+     * items by default. If `true`, the control can't be dragged.
+     */
+    this.dragDisabled = DEFAULT_DRAG_DISABLED_VALUE;
+    /**
+     * This attribute lets you specify if the drop operation is disabled in all
+     * items by default. If `true`, the control won't accept any drops.
+     */
+    this.dropDisabled = DEFAULT_DROP_DISABLED_VALUE;
     /**
      * This property lets you define the model of the ch-tree-x control.
      */
@@ -90,7 +102,7 @@ const ChTestTreeX = class {
       }
       const promise = this.dropItemsCallback(dataTransferInfo);
       this.waitDropProcessing = true;
-      promise.then(response => {
+      promise.then(async (response) => {
         this.waitDropProcessing = false;
         if (!response.acceptDrop) {
           return;
@@ -101,6 +113,11 @@ const ChTestTreeX = class {
           // Add the UI models to the new container and remove the UI models from
           // the old containers
           draggedItems.forEach(this.moveItemToNewParent(newParentUIModel));
+          // When the selected items are moved, the tree must remove its internal
+          // state to not have undefined references
+          if (dataTransferInfo.draggingSelectedItems) {
+            await this.treeRef.clearSelectedItemsInfo();
+          }
         }
         // Add the new items
         else {
@@ -130,9 +147,12 @@ const ChTestTreeX = class {
       // Reference the new parent in the item
       itemUIModelExtended.parentItem = newParentUIModel;
     };
-    this.renderSubModel = (treeSubModel) => (index.h("ch-tree-x-list-item", { id: treeSubModel.id, caption: treeSubModel.caption, checkbox: treeSubModel.checkbox, checked: treeSubModel.checked, class: treeSubModel.class, disabled: treeSubModel.disabled, expanded: treeSubModel.expanded, indeterminate: treeSubModel.indeterminate, lazyLoad: treeSubModel.lazy, leaf: treeSubModel.leaf, leftImgSrc: treeSubModel.leftImgSrc, metadata: treeSubModel.metadata, rightImgSrc: treeSubModel.rightImgSrc, selected: treeSubModel.selected, showExpandableButton: treeSubModel.showExpandableButton, toggleCheckboxes: treeSubModel.toggleCheckboxes }, !treeSubModel.leaf &&
-      treeSubModel.items != null &&
-      treeSubModel.items.length !== 0 && (index.h("ch-tree-x-list", { slot: "tree" }, treeSubModel.items.map(this.renderSubModel)))));
+    this.renderSubModel = (treeSubModel, lastItem, level) => {
+      var _a, _b;
+      return (index.h("ch-tree-x-list-item", { id: treeSubModel.id, caption: treeSubModel.caption, checkbox: treeSubModel.checkbox, checked: treeSubModel.checked, class: treeSubModel.class, disabled: treeSubModel.disabled, dragDisabled: (_a = treeSubModel.dragDisabled) !== null && _a !== void 0 ? _a : this.dragDisabled, dropDisabled: (_b = treeSubModel.dropDisabled) !== null && _b !== void 0 ? _b : this.dropDisabled, expanded: treeSubModel.expanded, indeterminate: treeSubModel.indeterminate, lastItem: lastItem, lazyLoad: treeSubModel.lazy, leaf: treeSubModel.leaf, leftImgSrc: treeSubModel.leftImgSrc, level: level, metadata: treeSubModel.metadata, rightImgSrc: treeSubModel.rightImgSrc, selected: treeSubModel.selected, showExpandableButton: treeSubModel.showExpandableButton, showLines: this.showLines, toggleCheckboxes: treeSubModel.toggleCheckboxes }, !treeSubModel.leaf &&
+        treeSubModel.items != null &&
+        treeSubModel.items.length !== 0 && (index.h("ch-tree-x-list", { slot: "tree", level: level + 1 }, treeSubModel.items.map((subModel, index) => this.renderSubModel(subModel, this.showLines && index === treeSubModel.items.length - 1, level + 1))))));
+    };
     this.flattenItemUIModel = (parentModel) => (item) => {
       var _a, _b, _c, _d;
       this.flattenedTreeModel.set(item.id, {
@@ -325,7 +345,7 @@ const ChTestTreeX = class {
     this.flattenModel();
   }
   render() {
-    return (index.h(index.Host, null, index.h("ch-tree-x", { multiSelection: this.multiSelection, showLines: this.showLines, waitDropProcessing: this.waitDropProcessing, onDroppableZoneEnter: this.handleDroppableZoneEnter, onExpandedItemChange: this.handleExpandedItemChange, onItemsDropped: this.handleItemsDropped, onSelectedItemsChange: this.handleSelectedItemsChange, ref: el => (this.treeRef = el) }, index.h("ch-tree-x-list", null, this.treeModel.items.map(this.renderSubModel))), index.h("div", { class: "tree-buttons" })));
+    return (index.h(index.Host, null, index.h("ch-tree-x", { multiSelection: this.multiSelection, waitDropProcessing: this.waitDropProcessing, onDroppableZoneEnter: this.handleDroppableZoneEnter, onExpandedItemChange: this.handleExpandedItemChange, onItemsDropped: this.handleItemsDropped, onSelectedItemsChange: this.handleSelectedItemsChange, ref: el => (this.treeRef = el) }, index.h("ch-tree-x-list", { level: 0 }, this.treeModel.items.map((subModel, index) => this.renderSubModel(subModel, this.showLines && index === this.treeModel.items.length - 1, 0)))), index.h("div", { class: "tree-buttons" })));
   }
   static get watchers() { return {
     "treeModel": ["handleTreeModelChange"]

package/dist/cjs/ch-window_2.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5a32426a.js');
-const chGlobalStylesheet = require('./ch-global-stylesheet-145c4b20.js');
+const chGlobalStylesheet = require('./ch-global-stylesheet-0e78f960.js');
 
 const chWindowCss = ":host{--ch-window-offset-x:0px;--ch-window-offset-y:0px;--ch-window-separation-x:0px;--ch-window-separation-y:0px;--ch-window-x-outside:0px;--ch-window-y-outside:0px}:host(:not([hidden])){display:contents}:host(:is(:not([modal]),[modal=\"false\"])) .mask{pointer-events:none}.window{pointer-events:all}.mask{display:flex;position:fixed;inset:0;left:calc( var(--ch-window-inset-inline-start) + var(--ch-window-offset-x) + var(--ch-window-separation-x) );inset-block-start:calc( var(--ch-window-inset-block-start) + var(--ch-window-offset-y) + var(--ch-window-separation-y) );width:var(--ch-window-mask-width);height:var(--ch-window-mask-height);z-index:var(--ch-window-mask-z-index, 1000)}:host(:is([x-align=\"outside-start\"],[x-align=\"inside-start\"])) .mask{justify-content:flex-start}:host([x-align=center]) .mask{justify-content:center}:host(:is([x-align=\"outside-end\"],[x-align=\"inside-end\"])) .mask{justify-content:flex-end}:host(:is([y-align=\"outside-start\"],[y-align=\"inside-start\"])) .mask{align-items:flex-start}:host([y-align=center]) .mask{align-items:center}:host(:is([y-align=\"outside-end\"],[y-align=\"inside-end\"])) .mask{align-items:flex-end}.window{display:flex;flex-direction:column;transform:translate(var(--ch-window-x-outside), var(--ch-window-y-outside)) translate(var(--ch-window-x-drag, 0px), var(--ch-window-y-drag, 0px));z-index:inherit}:host([x-align=outside-start]) .window{--ch-window-x-outside:-100%}:host([x-align=outside-end]) .window{--ch-window-x-outside:100%}:host([y-align=outside-start]) .window{--ch-window-y-outside:-100%}:host([y-align=outside-end]) .window{--ch-window-y-outside:100%}.separation{position:fixed;inset:0;pointer-events:all}.separation--x{top:var(--ch-window-inset-block-start);width:var(--ch-window-separation);height:var(--ch-window-mask-height)}.separation--y{left:var(--ch-window-inset-inline-start);width:var(--ch-window-mask-width);height:var(--ch-window-separation)}.separation--both{width:calc(var(--ch-window-separation) * 4);height:calc(var(--ch-window-separation) * 4)}:host([x-align=outside-start]) .separation{left:calc( var(--ch-window-inset-inline-start) - var(--ch-window-separation) )}:host([x-align=outside-start]) .separation--both{left:calc( var(--ch-window-inset-inline-start) - var(--ch-window-separation) * 3 )}:host([x-align=outside-end]) .separation{left:calc( var(--ch-window-inset-inline-start) + var(--ch-window-mask-width) )}:host([x-align=outside-end]) .separation--both{left:calc( var(--ch-window-inset-inline-start) + var(--ch-window-mask-width) - var(--ch-window-separation) )}:host([y-align=outside-start]) .separation{top:calc(var(--ch-window-inset-block-start) - var(--ch-window-separation))}:host([y-align=outside-start]) .separation--both{top:calc( var(--ch-window-inset-block-start) - var(--ch-window-separation) * 3 )}:host([y-align=outside-end]) .separation{top:calc( var(--ch-window-inset-block-start) + var(--ch-window-mask-height) )}:host([y-align=outside-end]) .separation--both{top:calc( var(--ch-window-inset-block-start) + var(--ch-window-mask-height) - var(--ch-window-separation) )}";
 
@@ -226,7 +226,7 @@ const ChWindow = class {
     });
   }
   loadGlobalStyleSheet() {
-    this.el.shadowRoot.adoptedStyleSheets.push(chGlobalStylesheet.CH_GLOBAL_STYLESHEET);
+    chGlobalStylesheet.adoptGlobalStyleSheet(this.el.shadowRoot.adoptedStyleSheets);
   }
   render() {
     const separationY = this.yAlign === "outside-start" || this.yAlign === "outside-end";

package/dist/cjs/{common-facb7f18.js → common-5d08e273.js}

@@ -32,17 +32,23 @@ const renderFormItems = (componentType = "gxg-combo-box-item", options, group =
  * @param gxOptions An array of GxOptions's
  * @returns The first option in the array that is 'selected'. If no one found it returns null.
  */
-const getSelectedGxOption = (gxOptions) => {
-  let found;
-  if (gxOptions === null || gxOptions === void 0 ? void 0 : gxOptions.length) {
+const getSelectedGxOption = (gxOptions, onlyId = true) => {
+  if ((gxOptions === null || gxOptions === void 0 ? void 0 : gxOptions.length) > 0) {
+    let found = null;
     for (let i = 0; i < gxOptions.length; i++) {
       if (gxOptions[i].selected) {
         found = gxOptions[i];
         break;
       }
     }
+    if (found && onlyId) {
+      return found.id;
+    }
+    else if (!found && onlyId) {
+      return gxOptions[0].id;
+    }
+    return found;
   }
-  return found;
 };
 
 exports.getSelectedGxOption = getSelectedGxOption;