@genexus/genexus-ide-ui 0.0.61 → 0.0.63

package/dist/esm/gxg-tree_2.entry.js

@@ -1,757 +0,0 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-0da01575.js';
-import { e as exportParts } from './export-parts-7f208d57.js';
-
-const gxgTreeCss = ":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:var(--gxg-scrollbar-width, 6px)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background, --gray-02);border-radius:var(--gxg-scrollbar-track-border-radius, 10px)}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gxg-scrollbar-track-thumb-background, --gray-05);border-radius:var(--gxg-scrollbar-track-thumb-radius, 10px)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gxg-scrollbar-track-thumb-hover-background, --gray-04);cursor:pointer}:host{display:block;--gxg-tree-item-inner-spacing:var(--spacing-comp-01);overflow:auto;height:100%}:host::-webkit-scrollbar{width:var(--gxg-scrollbar-width, 6px)}:host::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background, --gray-02);border-radius:var(--gxg-scrollbar-track-border-radius, 10px)}:host::-webkit-scrollbar-thumb{background:var(--gxg-scrollbar-track-thumb-background, --gray-05);border-radius:var(--gxg-scrollbar-track-thumb-radius, 10px)}:host::-webkit-scrollbar-thumb:hover{background:var(--gxg-scrollbar-track-thumb-hover-background, --gray-04);cursor:pointer}:host ul{margin:0;padding-left:0;width:100%}";
-
-const GxgTree = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.treeItemStateChanged = createEvent(this, "treeItemStateChanged", 7);
-    /*
-  INDEX:
-  1.OWN PROPERTIES
-  2.REFERENCE TO ELEMENTS
-  3.STATE() VARIABLES
-  4.PUBLIC PROPERTY API | WATCH'S
-  5.EVENTS (EMIT)
-  6.COMPONENT LIFECYCLE METHODS
-  7.LISTENERS
-  8.PUBLIC METHODS API
-  9.LOCAL METHODS
-  10.RENDER() FUNCTION
-  */
-    // 1.OWN PROPERTIES //
-    this.masterTree = false;
-    // 3.STATE() VARIABLES //
-    // 4.PUBLIC PROPERTY API | WATCH'S //
-    /**
-     * Set this attribute if you want all the items to have a checkbox.
-     */
-    this.checkbox = true;
-    /**
-     * Set this attribute if you want all the items to be checked by default.
-     */
-    this.checked = false;
-    /**
-     * Set this attribute if you want all the items to be opened by default.
-     */
-    this.opened = true;
-    /**
-     * Set this attribute if you want all the items checkboxes to be toggled when the parent tree item checkbox is toggled.
-     */
-    this.toggleCheckboxes = false;
-    /**
-     * Set this attribute if you want to allow multi selection of the items. This property should only be set on the master tree.
-     */
-    this.multiSelection = false;
-    // 9.LOCAL METHODS //
-    /**
-     * This method evaluates if this tree is the master tree
-     */
-    this.evaluateIsMasterTree = () => {
-      var _a;
-      const grandFather = (_a = this.el.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement;
-      if (grandFather === undefined || grandFather.nodeName !== "GXG-TREE") {
-        this.masterTree = true;
-      }
-    };
-    this.initialConfig = () => {
-      const parent = this.el.parentElement;
-      if ((parent === null || parent === void 0 ? void 0 : parent.tagName) === "GXG-TREE-ITEM") {
-        const treeItem = parent;
-        this.checkbox =
-          treeItem.checkbox !== undefined ? treeItem.checkbox : this.checkbox;
-        this.checked =
-          treeItem.checked !== undefined ? treeItem.checked : this.checked;
-        this.opened =
-          treeItem.opened !== undefined ? treeItem.opened : this.opened;
-        this.toggleCheckboxes =
-          treeItem.toggleCheckboxes !== undefined
-            ? treeItem.toggleCheckboxes
-            : this.toggleCheckboxes;
-      }
-    };
-    /**
-     * @description This functions is supposed to be called from any of the listeners that are attached to the tree-item events that are emitted when the state changes (toggleIconClicked, selectionChanged, checkboxToggled). When an item state is changed, this function emits the update item data, so that the host can update the tree model, if any, if desired.
-     */
-    this.emitTreeItemNewState = (itemData, emittedBy) => {
-      this.treeItemStateChanged.emit({ itemData, emittedBy: emittedBy });
-    };
-  }
-  // 6.COMPONENT LIFECYCLE METHODS //
-  componentWillLoad() {
-    this.initialConfig();
-    this.evaluateIsMasterTree();
-  }
-  // 7.LISTENERS //
-  checkboxToggledHandler(e) {
-    const itemData = e.detail;
-    if (this.masterTree) {
-      this.emitTreeItemNewState(itemData, "checkboxToggled");
-    }
-  }
-  doubleClickedHandler(e) {
-    const itemData = e.detail;
-    if (this.masterTree) {
-      this.emitTreeItemNewState(itemData, "doubleClicked");
-    }
-  }
-  selectionChangedHandler(e) {
-    //Unselect all items, except the one that triggered this event. This action should be done once, by the master tree.
-    const allChildren = this.el.querySelectorAll("gxg-tree-item");
-    if ((this.masterTree && this.multiSelection && !e.detail.ctrl) ||
-      (this.masterTree && !this.multiSelection)) {
-      Array.from(allChildren).forEach((item) => {
-        if (item !== e.detail.ref) {
-          item.selected = false;
-        }
-      });
-    }
-    const itemData = e.detail;
-    if (this.masterTree) {
-      this.emitTreeItemNewState(itemData, "selectionChanged");
-    }
-  }
-  toggleIconClickedHandler(e) {
-    const itemData = e.detail;
-    if (this.masterTree) {
-      this.emitTreeItemNewState(itemData, "toggleIconClicked");
-    }
-  }
-  // 8.PUBLIC METHODS API //
-  /**
-   * Returns an array of the selected tree-items, providing the id, checked status, selected status, and label.
-   */
-  async getCheckedItems(idsArray) {
-    const allTreeItems = Array.from(this.el.querySelectorAll("gxg-tree-item"));
-    const checkedTreeItems = [];
-    if (idsArray === null || idsArray === void 0 ? void 0 : idsArray.length) {
-      idsArray.forEach((id) => {
-        const found = allTreeItems.find((item) => id === item.id);
-        found &&
-          checkedTreeItems.push({
-            id: found.id,
-            label: found.label,
-            checked: found.checked,
-            selected: found.selected,
-          });
-      });
-    }
-    else {
-      allTreeItems.forEach((item) => {
-        item.checked &&
-          checkedTreeItems.push({
-            id: item.id,
-            label: item.label,
-            checked: item.checked,
-            selected: item.selected,
-          });
-      });
-    }
-    return checkedTreeItems;
-  }
-  /**
-   * Returns an array of the selected tree-items, providing the id, checked status, selected status, and label.
-   */
-  async getSelectedItems() {
-    const selectedItems = [];
-    const allItems = this.el.querySelectorAll("gxg-tree-item");
-    if (allItems === null || allItems === void 0 ? void 0 : allItems.length) {
-      Array.from(allItems).forEach((item) => {
-        if (item.selected) {
-          selectedItems.push({
-            id: item.id,
-            label: item.label,
-            checked: item.checked,
-            selected: item.selected,
-          });
-        }
-      });
-    }
-    return selectedItems;
-  }
-  /**
-   * @param ids: An array id the tree items to be toggled.
-   * @param open: A boolean indicating that the tree item should be opened or closed. (optional)
-   * @description This method is used to toggle a tree-item by the tree-item id/ids.
-   * @returns a boolean value indicating if the selected tree-item is open or not, after the method was called.
-   */
-  async toggleItems(ids, open) {
-    if (!(ids === null || ids === void 0 ? void 0 : ids.length)) {
-      return [];
-    }
-    const allTreeItems = Array.from(this.el.querySelectorAll("gxg-tree-item"));
-    const toggledTreeItems = [];
-    ids.forEach((id) => {
-      const found = allTreeItems.find((item) => id === item.id);
-      if (found && open === undefined) {
-        found.opened = !found.opened;
-      }
-      else if (found && open && !found.opened) {
-        found.opened = true;
-      }
-      else if (found && !open && found.opened) {
-        found.opened = false;
-      }
-      if (found) {
-        toggledTreeItems.push({
-          id: found.id,
-          opened: found.opened,
-        });
-      }
-    });
-    return toggledTreeItems;
-  }
-  // 10.RENDER() FUNCTION //
-  render() {
-    return (h(Host, null, h("div", { class: {
-        tree: true,
-      } }, h("ul", { ref: (el) => (this.ulTree = el) }, h("slot", null)))));
-  }
-  get el() { return getElement(this); }
-};
-GxgTree.style = gxgTreeCss;
-
-const gxgTreeItemCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}: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:var(--gxg-scrollbar-width, 6px)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background, --gray-02);border-radius:var(--gxg-scrollbar-track-border-radius, 10px)}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gxg-scrollbar-track-thumb-background, --gray-05);border-radius:var(--gxg-scrollbar-track-thumb-radius, 10px)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gxg-scrollbar-track-thumb-hover-background, --gray-04);cursor:pointer}:host{--text-color:var(--color-on-background);--font-family:\"Source Sans Pro\", sans-serif;--font-weight:normal;--font-size:12px;--guide-color:var(--gray-06);--item-hover-color:var(--gxg-background-color--hover);--item-active-color:var(--silverGray);color:var(--color-on-background);width:100%;display:block}:host li{list-style:none;font-family:var(--font-family);font-size:var(--font-size);font-weight:var(--font-weight);color:var(--text-color);overflow:hidden}:host li>::slotted(gxg-tree){display:none}:host li.tree-open>::slotted(gxg-tree){display:block}:host li.tree-closed .vertical-line{display:none}:host li .li-text{min-height:24px;cursor:pointer;display:flex;align-items:center;position:relative;padding-inline-end:var(--spacing-comp-01)}:host li .li-text:hover{background-color:var(--item-hover-color)}:host li .li-text:active{background-color:var(--gxg-background-color--selected)}:host li .li-text:focus{outline:var(--border-width-md) solid var(--gxg-border-color--focused);outline-offset:-2px}:host li .li-text--selected{background-color:var(--gxg-background-color--selected)}:host li .li-text>*{flex-shrink:0}:host li .vertical-line{position:absolute;width:1px;height:0;top:23px;left:15px;z-index:1;background-image:linear-gradient(var(--guide-color) 28%, rgba(255, 255, 255, 0) 0%);background-position:right;background-size:1px 4px;background-repeat:repeat-y}:host li .horizontal-line{position:absolute;height:1px;top:11px;z-index:1;background-image:linear-gradient(to right, var(--guide-color) 33%, rgba(255, 255, 255, 0) 0%);background-position:bottom;background-size:3px 1px;background-repeat:repeat-x}:host li .horizontal-line.display-none{display:none}:host li .closed-opened-icons{position:relative;display:flex;margin-left:-2px}:host li .toggle-icon{position:relative;z-index:2;transform:scale(0.75, 0.75);margin-inline-end:var(--spacing-comp-00);transition-property:opacity;transition-duration:0.5s;transition-timing-function:ease;background-color:var(--color-hover)}:host li .toggle-icon:hover{background-color:var(--color-background)}:host .checkbox{margin-inline-end:var(--spacing-comp-01)}:host .icon--left{margin:0 var(--spacing-comp-01) 0 var(--spacing-comp-00)}:host .right-icon{margin-inline-start:auto;position:relative;top:0;transition-property:top;transition-duration:0.5s;transition-timing-function:ease}:host .loading{opacity:1;display:inline;z-index:1;margin-inline-end:var(--spacing-comp-01);border-radius:50%;width:8px;height:8px;border:0.18rem solid var(--gray-04);border-top-color:var(--gray-01);animation:spin 1s infinite linear}:host .loading--double{border-style:double;border-width:0.5rem}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host([disabled]) li .text{color:var(--darkGray)}:host([disabled]) .toggle-icon{pointer-events:none}";
-
-const GxgTreeItem = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.checkboxToggled = createEvent(this, "checkboxToggled", 7);
-    this.doubleClicked = createEvent(this, "doubleClicked", 7);
-    this.lazyChanged = createEvent(this, "lazyChanged", 7);
-    this.selectionChanged = createEvent(this, "selectionChanged", 7);
-    this.toggleIconClicked = createEvent(this, "toggleIconClicked", 7);
-    this.lazy = false; //True if not leaf but no children.
-    this.parentTreeIsMasterTree = false;
-    this.numberOfParentTrees = 1;
-    this.firstItem = false;
-    this.lastItem = false;
-    this.leftPadding = "0px";
-    this.verticalLineStartPosition = "0px";
-    this.horizontalLineWidth = "24px";
-    this.horizontalLineStartPosition = "0px";
-    this.parts = {
-      item: "item",
-      checkbox: "checkbox",
-      toggleButton: "toggle-button",
-    };
-    // 3.STATE() VARIABLES //
-    this.horizontalLinePaddingLeft = 0;
-    this.lastTreeItem = false;
-    this.lastTreeItemOfParentTree = false;
-    this.numberOfVisibleDescendantItems = 0;
-    this.time = 0;
-    this.downloading = false;
-    // 4.PUBLIC PROPERTY API | WATCH'S //
-    /**
-     * Set this attribute if you want this item to display a checkbox. This attribute is affected by the parent tree-item checkbox attribute, unless it is set in this item.
-     */
-    this.checkbox = undefined;
-    /**
-     * Set this attribute if you want this item to be checked by default. This attribute is affected by the parent tree-item checked attribute, unless it is set in this item.
-     */
-    this.checked = undefined;
-    /**
-     * Set this attribute if you want this items child tree to be opened by default. This attribute is affected by the parent tree-item opened attribute, unless it is set in this item.
-     */
-    this.opened = undefined;
-    /**
-     * Set this attribute if you want all the children item's checkboxes to be toggled when this item checkbox is toggled. This attribute is affected by the parent tree-item toggleCheckboxes attribute, unless it is set in this item.
-     */
-    this.toggleCheckboxes = undefined;
-    /**
-     * The presence of this attribute makes this tree item disabled. This attribute is affected by the parent tree type attribute, unless it is set in this item.
-     */
-    this.disabled = undefined;
-    /**
-     * The presence of this attribute indicates that this tree-item is a leaf, meaning it has no children items. If is not a leaf, it will display a +/- icon to toggle/ontoggle the children tree
-     */
-    this.leaf = false;
-    /**
-     * The presence of this attribute sets the tree-item as selected
-     */
-    this.selected = false;
-    /**
-     * This property is for internal use, when using the treeModel.
-     */
-    this.numberOfChildren = 0;
-    /**
-     * This property is for internal use. It indicates that the item has children.
-     */
-    this.hasChildTree = false;
-    /**
-     * This property is for internal use. It indicates that the checkbox has an indeterminate state.
-     */
-    this.indeterminate = false;
-    // 9.LOCAL METHODS //
-    this.evaluateId = () => {
-      if (!this.id) {
-        this.id = this.el.getAttribute("id");
-      }
-    };
-    this.evaluateLazy = () => {
-      if (!this.leaf && this.numberOfChildren === 0) {
-        this.lazy = true;
-        this.opened = false;
-      }
-    };
-    this.observer = new MutationObserver((mutationsList) => {
-      for (const mutation of mutationsList) {
-        if (mutation.type === "childList") {
-          this.lazy = false;
-          this.opened = true;
-          this.reRender();
-        }
-      }
-    });
-    this.initiateMutationObserver = () => {
-      this.observer.observe(this.el, { childList: true, subtree: true });
-    };
-    /**
-     * @description Set some properties based on the parent tree configuration, unless this item has this properties already set.
-     */
-    this.cascadeConfig = () => {
-      const parentTree = this.el
-        .parentElement;
-      this.checkbox =
-        this.checkbox !== undefined ? this.checkbox : parentTree.checkbox;
-      this.checked =
-        this.checked !== undefined ? this.checked : parentTree.checked;
-      this.opened = this.opened !== undefined ? this.opened : parentTree.opened;
-      this.toggleCheckboxes =
-        this.toggleCheckboxes !== undefined
-          ? this.toggleCheckboxes
-          : parentTree.checkbox;
-    };
-    this.attachExportParts = () => {
-      const part = this.el.getAttribute("part");
-      const exportPartsResult = exportParts(part, this.parts);
-      exportPartsResult.length && (this.exportparts = exportPartsResult);
-    };
-    this.defineLineHeight = () => {
-      let offset = 11.5;
-      if (this.parentTreeIsMasterTree) {
-        offset = 0;
-        if (this.lastItem) {
-          offset = 11;
-        }
-      }
-      let total = 0;
-      if (!this.leaf && !this.lazy) {
-        const allItemsLength = this.el.querySelectorAll("gxg-tree-item").length;
-        const directGxgTree = this.el.querySelector(":scope > gxg-tree");
-        const directTreeItems = directGxgTree.querySelectorAll(":scope > gxg-tree-item");
-        if (!this.parentTreeIsMasterTree) {
-          const lastDirectTreeItem = directTreeItems[directTreeItems.length - 1];
-          const lastDirectItemItemsLength = lastDirectTreeItem.querySelectorAll("gxg-tree-item").length;
-          total = allItemsLength - lastDirectItemItemsLength;
-        }
-        else {
-          total = allItemsLength;
-        }
-      }
-      this.lineHeight = `${total * 24.2 - offset}px`;
-    };
-    /**
-     * @description returns the appropriate start padding and start position for the item, horizontal line, and vertical line.
-     */
-    this.defineStartPosition = () => {
-      let value = 0;
-      let horizontalLineStartPosition = 13;
-      if (this.numberOfParentTrees > 1) {
-        value = (this.numberOfParentTrees - 1) * 45;
-        if (this.numberOfParentTrees > 2) {
-          horizontalLineStartPosition = value - 36;
-        }
-      }
-      else {
-        value = 5;
-      }
-      this.verticalLineStartPosition = `${value + 7}px`;
-      this.leftPadding = `${value}px`;
-      this.horizontalLineStartPosition = `${horizontalLineStartPosition}px`;
-    };
-    this.liTextClickedHandler = (e) => {
-      const toggleWasClicked = e.target.classList.contains("toggle-icon");
-      const checkboxClicked = e.target.nodeName === "GXG-FORM-CHECKBOX";
-      if (toggleWasClicked || checkboxClicked)
-        return;
-      if (e.ctrlKey) {
-        this.selected = !this.selected;
-      }
-      else {
-        this.selected = true;
-      }
-      this.selectionChanged.emit(this.getItemData(e.ctrlKey));
-    };
-    this.liTextDoubleClicked = () => {
-      this.doubleClicked.emit(this.getItemData(false));
-      !this.leaf && this.toggleClickedHandler();
-    };
-    this.liTextKeyDownPressed = (e) => {
-      if (e.key === "ArrowDown" || e.key === "ArrowUp") {
-        e.preventDefault(); //prevents scrolling
-      }
-      //ENTER
-      if (e.key === "Enter") {
-        //Enter should check/uncheck the checkbox (if present)
-        this.checkboxClickedHandler();
-      }
-      //LEFT/RIGHT NAVIGATION
-      if (e.key === "ArrowRight" && !this.leaf) {
-        //Toggle the tree
-        if (!this.opened) {
-          this.opened = true;
-        }
-        else {
-          const childTree = this.el.querySelector("gxg-tree");
-          const childTreeFirstChildren = childTree.querySelector("gxg-tree-item");
-          const childTreeFirstChildrenLiText = childTreeFirstChildren.shadowRoot.querySelector(".li-text");
-          childTreeFirstChildrenLiText.focus();
-        }
-      }
-      if (e.key === "ArrowLeft") {
-        let hasParent = false;
-        const parentGxgTreeItem = this.el.parentElement.parentElement;
-        let parentGxgTreeItemLiText = null;
-        if (parentGxgTreeItem.tagName === "GXG-TREE-ITEM") {
-          hasParent = true;
-          parentGxgTreeItemLiText = parentGxgTreeItem.shadowRoot.querySelector(".li-text");
-        }
-        if (this.leaf) {
-          if (hasParent) {
-            parentGxgTreeItemLiText.focus();
-          }
-        }
-        else {
-          const li = this.el.shadowRoot.querySelector("li");
-          if (li.classList.contains("tree-open")) {
-            this.opened = false;
-          }
-          else {
-            if (hasParent) {
-              parentGxgTreeItemLiText.focus();
-            }
-          }
-        }
-      }
-      // UP/DOWN NAVIGATION
-      if (e.key === "ArrowUp" || (e.key === "Tab" && e.shiftKey)) {
-        e.preventDefault();
-        if (!this.firstItem) {
-          //Is not the first element of the parent
-          //Set focus on the prev item
-          let prevItem;
-          const prevElementSibling = this.el.previousElementSibling;
-          if (e.shiftKey && e.key !== "Tab") {
-            //if shift key was pressed, navigate to the previous sibling
-            if (prevElementSibling !== null) {
-              prevItem = prevElementSibling.shadowRoot.querySelector("li .li-text");
-            }
-          }
-          else {
-            if (prevElementSibling === null) {
-              const parentItem = this.el.parentElement;
-              const parentParentItem = parentItem.parentElement;
-              prevItem = parentParentItem.shadowRoot.querySelector("li .li-text");
-            }
-            else {
-              prevItem = prevElementSibling.shadowRoot.querySelector("li .li-text");
-              if (prevElementSibling !== null) {
-                //If the preceding tree-item has tree inside...
-                const prevElementSiblingHasChildTree = prevElementSibling
-                  .hasChildTree;
-                if (prevElementSiblingHasChildTree) {
-                  const prevElementSiblingHasOpenTree = prevElementSibling
-                    .opened;
-                  if (prevElementSiblingHasOpenTree) {
-                    //If preceding tree-item tree is opened, then the prev item is the last item of that tree
-                    const prevElemSiblingTreeItem = this.el
-                      .previousElementSibling;
-                    const prevElemSiblingTreeItemTree = prevElemSiblingTreeItem.querySelector("gxg-tree");
-                    //
-                    if (prevElemSiblingTreeItemTree.lastElementChild
-                      .hasChildTree) {
-                      if (prevElemSiblingTreeItemTree.lastElementChild.shadowRoot
-                        .querySelector("li")
-                        .classList.contains("tree-open")) {
-                        prevItem = prevElemSiblingTreeItemTree.lastElementChild
-                          .querySelector("gxg-tree")
-                          .lastElementChild.shadowRoot.querySelector("li .li-text");
-                      }
-                      else {
-                        prevItem = prevElemSiblingTreeItemTree.lastElementChild.shadowRoot.querySelector("li .li-text");
-                      }
-                    }
-                    else {
-                      prevItem = prevElemSiblingTreeItemTree.lastElementChild.shadowRoot.querySelector("li .li-text");
-                    }
-                    //
-                  }
-                  else {
-                    //The preciding item has a tree, but it is closed
-                    prevItem = this.el.previousElementSibling.shadowRoot.querySelector("li .li-text");
-                  }
-                }
-              }
-            }
-          }
-          if (prevItem !== null && prevItem !== undefined) {
-            prevItem.focus();
-          }
-        }
-      }
-      if (e.key === "ArrowDown" || (e.key === "Tab" && !e.shiftKey)) {
-        e.preventDefault();
-        if (!this.lastTreeItemOfParentTree) {
-          //Set focus on the next item
-          let nextItem;
-          if (e.shiftKey) {
-            //if shift key was pressed, navigate to the next sibling
-            if (this.el.nextElementSibling !== null) {
-              nextItem = this.el.nextElementSibling.shadowRoot.querySelector("li .li-text");
-            }
-          }
-          else {
-            if (this.lastTreeItem) {
-              if (this.hasChildTree && this.opened) {
-                nextItem = this.el.firstElementChild.firstElementChild.shadowRoot.querySelector(".li-text");
-              }
-              else {
-                const thisTree = this.el.parentElement;
-                const thisTreeParent = thisTree.parentElement;
-                const thisTreeParentNextTree = thisTreeParent.nextElementSibling;
-                if (thisTreeParentNextTree === null) {
-                  if (thisTreeParent.parentElement.parentElement
-                    .nextElementSibling !== null) {
-                    nextItem = thisTreeParent.parentElement.parentElement.nextElementSibling.shadowRoot.querySelector(".li-text");
-                  }
-                }
-                else {
-                  nextItem = thisTreeParentNextTree.shadowRoot.querySelector(".li-text");
-                }
-              }
-            }
-            else {
-              if (this.hasChildTree && this.opened) {
-                nextItem = this.el
-                  .querySelector("gxg-tree gxg-tree-item")
-                  .shadowRoot.querySelector("li .li-text");
-              }
-              else {
-                nextItem = this.el.nextElementSibling.shadowRoot.querySelector(".li-text");
-              }
-            }
-          }
-          if (nextItem !== null && nextItem !== undefined) {
-            nextItem.focus();
-          }
-        }
-        else {
-          //Last element of parent tree
-          if (!this.leaf && this.opened) {
-            const childTreeFirstTreeItem = this.el.firstElementChild.firstElementChild.shadowRoot.querySelector("li .li-text");
-            childTreeFirstTreeItem.focus();
-          }
-        }
-      }
-    };
-    this.returnToggleIconType = () => {
-      //Returns the type of icon : expand or collapse
-      if (!this.opened || this.lazy) {
-        return "gemini-tools/add";
-      }
-      else {
-        return "gemini-tools/minus";
-      }
-    };
-    /**
-     * When a checkbox is clicked, it state changes and so it's children, and parent items do.
-     * First evaluate the children, and then the parent items.
-     */
-    this.checkboxClickedHandler = () => {
-      if (this.checkbox) {
-        this.checked = !this.checked;
-        if (!this.leaf) {
-          this.toggleChildrenCheckboxes(this.checked);
-        }
-        const parentItems = this.getParentItems();
-        parentItems.forEach((parentItem) => {
-          parentItem.evaluateCheckboxStatus();
-        });
-      }
-    };
-    this.toggleChildrenCheckboxes = (checked) => {
-      this.indeterminate = false;
-      const allChildren = this.el.querySelectorAll("gxg-tree-item");
-      if (allChildren === null || allChildren === void 0 ? void 0 : allChildren.length) {
-        Array.from(allChildren).forEach((item) => {
-          item.indeterminate = false;
-          item.checked = checked;
-        });
-      }
-    };
-    this.getParentItems = () => {
-      var _a;
-      const parentItems = [];
-      let parentItem = this.el.parentElement.parentElement;
-      while ((parentItem === null || parentItem === void 0 ? void 0 : parentItem.nodeName) === "GXG-TREE-ITEM") {
-        parentItems.push(parentItem);
-        parentItem = (_a = parentItem.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement;
-      }
-      return parentItems;
-    };
-    this.getParentsNumber = () => {
-      var _a;
-      let count = 0;
-      let parentElement = this.el.parentElement;
-      while ((parentElement === null || parentElement === void 0 ? void 0 : parentElement.nodeName) === "GXG-TREE") {
-        count++;
-        parentElement = (_a = parentElement.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement;
-      }
-      return count;
-    };
-    this.getChildrenNumber = () => {
-      if (this.numberOfChildren === 0) {
-        //If this.numberOfChildren === 0 it might be because the whole tree was created with markup, and not by passing a model. In that case, count the children with querySelectorAll.
-        return this.el.querySelectorAll("gxg-tree-item").length;
-      }
-    };
-    this.toggleClickedHandler = () => {
-      if (this.lazy && !this.opened) {
-        this.downloading = true;
-        this.toggleIconClicked.emit(this.getItemData());
-      }
-      if (!this.lazy) {
-        this.opened = !this.opened;
-      }
-    };
-    this.getItemData = (ctrl = false) => {
-      return {
-        ref: this.el,
-        checkbox: this.checkbox,
-        checked: this.checked,
-        ctrl: ctrl,
-        description: this.description,
-        disabled: this.disabled,
-        icon: this.icon,
-        id: this.id,
-        indeterminate: this.indeterminate,
-        label: this.label,
-        lazy: this.lazy,
-        leaf: this.leaf,
-        opened: this.opened,
-        selected: this.selected,
-      };
-    };
-  }
-  checkedHandler(newValue, oldValue) {
-    if (oldValue !== undefined) {
-      this.checkboxToggled.emit(this.getItemData(false));
-    }
-  }
-  openedHandler(newValue, oldValue) {
-    if (oldValue !== undefined) {
-      this.toggleIconClicked.emit(this.getItemData(false));
-    }
-  }
-  // 6.COMPONENT LIFECYCLE METHODS //
-  componentWillLoad() {
-    //Count number of parent trees in order to set the appropriate padding-left
-    this.numberOfParentTrees = this.getParentsNumber();
-    this.numberOfChildren = this.getChildrenNumber();
-    //If is last item of tree
-    const nextItem = this.el.nextElementSibling;
-    if (nextItem === null) {
-      this.lastTreeItem = true;
-    }
-    if (this.numberOfParentTrees === 1) {
-      this.parentTreeIsMasterTree = true;
-      const prevItem = this.el.previousElementSibling;
-      if (prevItem === null) {
-        //If is first item of parent tree...
-        this.firstItem = true;
-      }
-    }
-    if (!this.el.nextElementSibling) {
-      this.lastItem = true;
-    }
-    this.evaluateId();
-    this.evaluateLazy();
-    this.defineLineHeight();
-    this.defineStartPosition();
-    this.cascadeConfig();
-    this.attachExportParts();
-    this.initiateMutationObserver();
-  }
-  // 7.LISTENERS //
-  // 8.PUBLIC METHODS API //
-  async reRender() {
-    this.defineLineHeight();
-  }
-  evaluateCheckboxStatus() {
-    const allChildren = this.el.querySelectorAll("gxg-tree-item");
-    let checked = 0;
-    if (allChildren === null || allChildren === void 0 ? void 0 : allChildren.length) {
-      Array.from(allChildren).forEach((item) => {
-        if (item.checked) {
-          checked++;
-        }
-      });
-      if (allChildren.length === checked) {
-        //all checked
-        this.checked = true;
-        this.indeterminate = false;
-      }
-      else if (checked === 0) {
-        //all unchecked
-        this.checked = false;
-        this.indeterminate = false;
-      }
-      else {
-        //indeterminate
-        this.indeterminate = true;
-      }
-    }
-  }
-  // 10.RENDER() FUNCTION //
-  render() {
-    return (h(Host, { class: { leaf: this.leaf, "not-leaf": !this.leaf }, exportParts: this.exportparts ? this.exportparts : null }, h("li", { class: {
-        "tree-open": this.opened,
-        "tree-closed": !this.opened,
-        disabled: this.disabled,
-      } }, h("div", { class: {
-        "li-text": true,
-        "li-text--not-leaf": !this.leaf,
-        "li-text--leaf": this.leaf,
-        "li-text--first-tree-item": this.firstItem,
-        "li-text--has-child-tree": this.hasChildTree,
-        "li-text--selected": this.selected,
-      }, style: { paddingLeft: this.leftPadding }, onClick: this.liTextClickedHandler.bind(this), onDblClick: this.liTextDoubleClicked.bind(this), onKeyDown: this.liTextKeyDownPressed.bind(this), tabIndex: -1, part: this.parts.item }, !this.leaf
-      ? [
-        h("span", { class: { "vertical-line": true }, style: {
-            height: this.lineHeight,
-            left: this.verticalLineStartPosition,
-          } }),
-        h("div", { class: { "closed-opened-icons": true } }, h("gxg-icon", { onClick: this.toggleClickedHandler.bind(this), type: this.returnToggleIconType(), color: "auto", class: "icon toggle-icon", part: this.parts.toggleButton })),
-      ]
-      : null, this.numberOfParentTrees > 1 ? (h("span", { class: {
-        "horizontal-line": true,
-      }, style: {
-        left: this.horizontalLineStartPosition,
-        width: this.horizontalLineWidth,
-      } })) : null, this.checkbox ? (h("gxg-form-checkbox", { checked: this.checked, class: { checkbox: true }, tabIndex: -1, indeterminate: this.indeterminate, disabled: this.disabled, onClick: this.checkboxClickedHandler, part: this.parts.checkbox })) : null, this.icon ? (h("gxg-icon", { type: this.icon, color: "auto", class: "icon icon--left", style: {
-        "--icon-size": "14px",
-      } })) : null, this.downloading && this.lazy ? (h("span", { class: "loading" })) : null, h("span", { class: "text" }, h("slot", null))), h("slot", { name: "tree" }), this.treeModel ? this.treeModel : null)));
-  }
-  static get assetsDirs() { return ["tree-item-assets"]; }
-  get el() { return getElement(this); }
-  static get watchers() { return {
-    "checked": ["checkedHandler"],
-    "opened": ["openedHandler"]
-  }; }
-};
-GxgTreeItem.style = gxgTreeItemCss;
-
-export { GxgTree as gxg_tree, GxgTreeItem as gxg_tree_item };