@genexus/genexus-ide-ui 0.0.93 → 0.0.94

package/dist/esm/gxg-tree-item.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, g as getElement, h, H as Host } from './index-2d51259e.js';
+import { r as registerInstance, c as createEvent, g as getElement, h, H as Host } from './index-692bb924.js';
 import { e as exportParts } from './export-parts-639c8817.js';
 
 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{cursor:initial}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width, 6px);height: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-color:var(--gxg-scrollbar-track-thumb-background, --gray-05);border-radius:var(--gxg-scrollbar-track-thumb-radius, 10px);border:var(--gxg-scrollbar-track-thumb-border);background-clip:padding-box}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background, --gray-04)}: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(--gxg-background-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}";
@@ -17,7 +17,7 @@ const GxgTreeItem = class {
         this.parts = {
             item: "item",
             checkbox: "checkbox",
-            toggleButton: "toggle-button",
+            toggleButton: "toggle-button"
         };
         // 9.LOCAL METHODS //
         this.evaluateId = () => {
@@ -31,7 +31,7 @@ const GxgTreeItem = class {
                 this.opened = false;
             }
         };
-        this.observer = new MutationObserver((mutationsList) => {
+        this.observer = new MutationObserver(mutationsList => {
             for (const mutation of mutationsList) {
                 if (mutation.type === "childList") {
                     this.lazy = false;
@@ -182,7 +182,8 @@ const GxgTreeItem = class {
                     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");
+                            prevItem =
+                                prevElementSibling.shadowRoot.querySelector("li .li-text");
                         }
                     }
                     else {
@@ -192,22 +193,19 @@ const GxgTreeItem = class {
                             prevItem = parentParentItem.shadowRoot.querySelector("li .li-text");
                         }
                         else {
-                            prevItem = prevElementSibling.shadowRoot.querySelector("li .li-text");
+                            prevItem =
+                                prevElementSibling.shadowRoot.querySelector("li .li-text");
                             if (prevElementSibling !== null) {
                                 //If the preceding tree-item has tree inside...
-                                const prevElementSiblingHasChildTree = prevElementSibling
-                                    .hasChildTree;
+                                const prevElementSiblingHasChildTree = prevElementSibling.hasChildTree;
                                 if (prevElementSiblingHasChildTree) {
-                                    const prevElementSiblingHasOpenTree = prevElementSibling
-                                        .opened;
+                                    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 prevElemSiblingTreeItem = this.el.previousElementSibling;
                                         const prevElemSiblingTreeItemTree = prevElemSiblingTreeItem.querySelector("gxg-tree");
                                         //
-                                        if (prevElemSiblingTreeItemTree.lastElementChild
-                                            .hasChildTree) {
+                                        if (prevElemSiblingTreeItemTree.lastElementChild.hasChildTree) {
                                             if (prevElemSiblingTreeItemTree.lastElementChild.shadowRoot
                                                 .querySelector("li")
                                                 .classList.contains("tree-open")) {
@@ -216,17 +214,20 @@ const GxgTreeItem = class {
                                                     .lastElementChild.shadowRoot.querySelector("li .li-text");
                                             }
                                             else {
-                                                prevItem = prevElemSiblingTreeItemTree.lastElementChild.shadowRoot.querySelector("li .li-text");
+                                                prevItem =
+                                                    prevElemSiblingTreeItemTree.lastElementChild.shadowRoot.querySelector("li .li-text");
                                             }
                                         }
                                         else {
-                                            prevItem = prevElemSiblingTreeItemTree.lastElementChild.shadowRoot.querySelector("li .li-text");
+                                            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");
+                                        prevItem =
+                                            this.el.previousElementSibling.shadowRoot.querySelector("li .li-text");
                                     }
                                 }
                             }
@@ -245,13 +246,15 @@ const GxgTreeItem = class {
                     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");
+                            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");
+                                nextItem =
+                                    this.el.firstElementChild.firstElementChild.shadowRoot.querySelector(".li-text");
                             }
                             else {
                                 const thisTree = this.el.parentElement;
@@ -260,7 +263,8 @@ const GxgTreeItem = class {
                                 if (thisTreeParentNextTree === null) {
                                     if (thisTreeParent.parentElement.parentElement
                                         .nextElementSibling !== null) {
-                                        nextItem = thisTreeParent.parentElement.parentElement.nextElementSibling.shadowRoot.querySelector(".li-text");
+                                        nextItem =
+                                            thisTreeParent.parentElement.parentElement.nextElementSibling.shadowRoot.querySelector(".li-text");
                                     }
                                 }
                                 else {
@@ -275,7 +279,8 @@ const GxgTreeItem = class {
                                     .shadowRoot.querySelector("li .li-text");
                             }
                             else {
-                                nextItem = this.el.nextElementSibling.shadowRoot.querySelector(".li-text");
+                                nextItem =
+                                    this.el.nextElementSibling.shadowRoot.querySelector(".li-text");
                             }
                         }
                     }
@@ -312,7 +317,7 @@ const GxgTreeItem = class {
                     this.toggleChildrenCheckboxes(this.checked);
                 }
                 const parentItems = this.getParentItems();
-                parentItems.forEach((parentItem) => {
+                parentItems.forEach(parentItem => {
                     parentItem.evaluateCheckboxStatus();
                 });
             }
@@ -321,7 +326,7 @@ const GxgTreeItem = class {
             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) => {
+                Array.from(allChildren).forEach(item => {
                     item.indeterminate = false;
                     item.checked = checked;
                 });
@@ -377,7 +382,7 @@ const GxgTreeItem = class {
                 lazy: this.lazy,
                 leaf: this.leaf,
                 opened: this.opened,
-                selected: this.selected,
+                selected: this.selected
             };
         };
         registerInstance(this, hostRef);
@@ -410,12 +415,12 @@ const GxgTreeItem = class {
         this.indeterminate = false;
     }
     get el() { return getElement(this); }
-    checkedHandler(newValue, oldValue) {
+    checkedHandler(_, oldValue) {
         if (oldValue !== undefined) {
             this.checkboxToggled.emit(this.getItemData(false));
         }
     }
-    openedHandler(newValue, oldValue) {
+    openedHandler(_, oldValue) {
         if (oldValue !== undefined) {
             this.toggleIconClicked.emit(this.getItemData(false));
         }
@@ -458,7 +463,7 @@ const GxgTreeItem = class {
         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) => {
+            Array.from(allChildren).forEach(item => {
                 if (item.checked) {
                     checked++;
                 }
@@ -484,29 +489,29 @@ const GxgTreeItem = class {
         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,
+                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,
+                "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,
+                        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 })),
+                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,
+                "horizontal-line": true
             }, style: {
                 left: this.horizontalLineStartPosition,
-                width: this.horizontalLineWidth,
+                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",
+                "--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"]; }