@genexus/genexus-ide-ui 0.0.57 → 0.0.58

package/dist/genexus-ide-ui/p-f62d9b6d.entry.js

@@ -0,0 +1 @@
+import{r as e,c as t,h as i,H as r,g as o}from"./p-976c3a09.js";import{L as a}from"./p-26957490.js";import{r as s}from"./p-90416fc8.js";const n=e=>{var t;return{caption:e.description,id:e.id,items:(null!==(t=e.items)&&void 0!==t?t:[]).map(n),lazy:e.hasChildren&&(null==e.items||0===e.items.length),leaf:!1===e.hasChildren,leftImgSrc:e.icon}},d=e=>{const t=[];return e?(e.forEach((e=>{t.push(n(e))})),t):t},l=class{constructor(i){e(this,i),this.componentDidRenderEvent=t(this,"componentDidRenderEvent",7),this.referencesMessagesMaxWidth="200px",this.selectorCategoryData=[],this.attachTreeEvents=()=>{},this.selectObjectSelectionChanged=e=>{this.selectedObject=this.selectorCategoryData[e.detail.indexes.listIndex].items[e.detail.indexes.itemIndex]},this.selectObjectValueChangedHandler=async e=>{this.selectorSourceCallback(e.detail).then((e=>{this.selectorCategoryData=e,this.objectsSuggestions=(e=>{const t={suggestItems:null,suggestLists:[]};return e.length&&e.forEach((e=>{const i={label:e.name,items:[]};e.items.forEach((e=>{i.items.push({value:e.id,description:e.description,icon:e.icon})})),t.suggestLists.push(i)})),t})(e)})).catch((()=>{}))},this.openObjectCallbackHandler=async()=>{this.openObjectCallback(this.selectedObject.id)},this.openSelectorDialogCallbackHandler=async()=>{this.openSelectorDialogCallback().then((e=>{this.selectedObject=e})).catch((()=>{}))},this.evaluateInitialReferenceData=()=>{this.selectedObject&&this.selectedObjectHandler(this.selectedObject)},this.loadReferencesHandler=async(e,t=!1)=>{this.loadReferencesCallback&&this.loadReferencesCallback(e,t).then((e=>{t?this.referencesToTreeData=d(e):this.referencedByTreeData=d(e)}))},this.hideBarButtonClickedHandler=()=>{this.barHidden=!this.barHidden},this.referencesLazyLoadCallbackHandler=e=>async t=>{if(this.loadReferencesCallback){const i="references-to"===e,r=await this.loadReferencesCallback(t,i),o=d(r);return new Promise((e=>{e(o)}))}return new Promise((e=>{e([])}))},this.referenceSelectedHandler=e=>{if(this.selectReferenceCallback){const t=[];e.detail.forEach((e=>{t.push(e.id)})),this.selectReferenceCallback(t[0])}},this.referencedByTreeData=void 0,this.referencesToTreeData=void 0,this.barHidden=!1,this.objectsSuggestions=void 0,this.referencedBy=void 0,this.referencesTo=void 0,this.selectedObject=void 0,this.selectorSourceCallback=void 0,this.loadReferencesCallback=void 0,this.openObjectCallback=void 0,this.openSelectorDialogCallback=void 0,this.selectReferenceCallback=void 0}selectedObjectHandler(e){e.id&&(this.loadReferencesHandler(e.id,!1),this.loadReferencesHandler(e.id,!0))}async componentWillLoad(){this._componentLocale=await a.getComponentStrings(this.el),this.evaluateInitialReferenceData()}componentDidLoad(){this.attachTreeEvents()}componentDidRender(){this.componentDidRenderEvent.emit(this._componentLocale.componentName)}render(){var e,t,o,a,n,d,l,g;return i(r,{class:"gx-ide-component"},i("div",{class:"gx-ide-main-wrapper"},i("gx-ide-container",{displayBorderBottom:!0},i("header",{class:"header"},i("div",{class:"header__top grid"},i("gxg-button",{icon:"navigation/arrow-down",type:"secondary-icon-only",class:"hide-bar-button",onClick:this.hideBarButtonClickedHandler,part:"toggle-bar-button"}),i("gxg-label",{labelPosition:"start",class:"suggest-label",part:"select-object-label"},this._componentLocale.header.selectObject),i("gxg-suggest",null,i("ch-suggest",{value:this.selectedObject.name,onValueChanged:this.selectObjectValueChangedHandler,onSelectionChanged:this.selectObjectSelectionChanged,part:"object-selector-suggest",exportparts:"dropdown:select-object-dropdown"},s(this.objectsSuggestions))),i("gxg-button",{type:"secondary-icon-only",icon:"gemini-tools/show-more-horizontal",onClick:this.openSelectorDialogCallbackHandler,class:"selector-dialog-button",part:"open-selector-dialog-button"})),i("div",{class:{header__bottom:!0,"header__bottom--hidden":this.barHidden}},i("div",{class:"outer-wrapper"},i("div",{class:"inner-wrapper"},i("div",{class:"inner-wrapper__left"},i("gxg-icon",{type:this.selectedObject.icon,color:"auto"}),i("gxg-text",{padding:"s",type:"text-link",part:"open-object-text-link",onClick:this.openObjectCallbackHandler},`${this.selectedObject.name} : ${this.selectedObject.description}`)),i("div",{class:"inner-wrapper__right gxi-hidden"},i("gxg-form-checkbox",{id:"references-by-type",label:"Group references by type",required:!0,"display-validation-styles":!0,part:"references-type-checkbox"}))))))),i("main",{class:"main grid gxi-full-height gxi-overflow-auto"},i("gx-ide-container",{containerTitle:this._componentLocale.main.isReferencedBy,fullHeight:!0,class:"gxi-overflow-auto",part:"referenced-by-container"},i("div",{class:{"reference-container":!0,"reference-container--no-references":!(null===(e=this.referencedByTreeData)||void 0===e?void 0:e.length)}},i("gxg-tree-view",{class:{"gxi-hidden":!(null===(t=this.referencedByTreeData)||void 0===t?void 0:t.length)},part:"referenced-by-tree",treeModel:this.referencedByTreeData,lazyLoadTreeItemsCallback:this.referencesLazyLoadCallbackHandler("referenced-by"),onSelectedItemsChange:this.referenceSelectedHandler,dragDisabled:!0,dropDisabled:!0}),!(null===(o=this.referencedByTreeData)||void 0===o?void 0:o.length)&&i("gxg-text",{textAlign:"center",padding:"m",type:"text-regular",maxWidth:this.referencesMessagesMaxWidth,part:"referenced-by-text"},0===(null===(a=this.referencedByTreeData)||void 0===a?void 0:a.length)?this._componentLocale.main.isReferencedByEmpty:this._componentLocale.main.isReferencedByError))),i("gx-ide-container",{containerTitle:this._componentLocale.main.hasReferencesTo,fullHeight:!0,class:"gxi-overflow-auto",part:"references-to-container"},i("div",{class:{"reference-container":!0,"reference-container--no-references":!(null===(n=this.referencesToTreeData)||void 0===n?void 0:n.length)}},i("gxg-tree-view",{class:{"gxi-hidden":!(null===(d=this.referencesToTreeData)||void 0===d?void 0:d.length)},part:"referenced-to-tree",treeModel:this.referencesToTreeData,lazyLoadTreeItemsCallback:this.referencesLazyLoadCallbackHandler("references-to"),onSelectedItemsChange:this.referenceSelectedHandler}),!(null===(l=this.referencesToTreeData)||void 0===l?void 0:l.length)&&i("gxg-text",{textAlign:"center",padding:"m",type:"text-regular",maxWidth:this.referencesMessagesMaxWidth,part:"references-to-text"},0===(null===(g=this.referencesToTreeData)||void 0===g?void 0:g.length)?this._componentLocale.main.hasReferencesEmpty:this._componentLocale.main.hasReferencesToError))))))}static get assetsDirs(){return["gx-ide-assets/references"]}get el(){return o(this)}static get watchers(){return{selectedObject:["selectedObjectHandler"]}}};l.style='.gxi-hidden{display:none !important}.gxi-full-height{height:100%}.gxi-overflow-auto{overflow:auto}.gxi-display-flex{display:flex}.align-start{display:flex;align-items:start}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.grid{display:grid;grid-row-gap:var(--gx-ide-grid-row-gap);grid-column-gap:var(--gx-ide-grid-column-gap);grid-template-rows:auto}ch-grid-cell{display:flex}ch-grid{overflow:auto;height:100%}ch-grid-column{z-index:99;border-bottom:1px solid var(--gray-01)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){box-shadow:var(--box-shadow-01) !important;height:100% !important;display:flex !important;flex-direction:column !important}:host(:focus-within) gx-ide-top-bar::part(wrapper){background-color:var(--color-secondary-enabled)}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--font-weight-regular);font-size:var(--font-size-lg);line-height:1.6em;height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:6px;height:6px}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-main .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:6px;height:6px}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-overflow .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}:host{display:block}.header{}.header__top{grid-template-columns:min-content auto 1fr min-content;grid-template-rows:1fr;grid-template-areas:"hide-bar-button suggest-label gxg-suggest selector-dialog-button"}.header__top .hide-bar-button{grid-area:hide-bar-button}.header__top .suggest-label{grid-area:suggest-label}.header__top gxg-suggest{grid-area:gxg-suggest}.header__top .selector-dialog-button{grid-area:selector-dialog-button}.header__bottom{display:grid;grid-template-rows:1fr;transition:var(--gx-ide-timing-super-fast-ms) grid-template-rows}.header__bottom--hidden{grid-template-rows:0fr}.header__bottom .outer-wrapper{overflow:hidden}.header__bottom .inner-wrapper{padding-top:var(--gx-ide-grid-row-gap);display:flex;flex-direction:row;align-items:center;justify-content:space-between}.header__bottom .inner-wrapper__left{display:flex;align-items:center;gap:var(--gx-ide-grid-row-gap)}.header-hidden .first-row{grid-template-columns:auto 1fr auto}.header-hidden .first-row>:nth-child(3){align-self:end}.header-hidden .second-row{display:none}.main{grid-template-columns:1fr 1fr;grid-template-rows:1fr;grid-template-areas:"is-referenced has-references";height:100%;gap:0}.main .reference-container{min-height:300px}.main .reference-container--no-references{display:flex;align-items:center;justify-content:center}.main>*:first-child{border-right:1px solid var(--gx-ide-container-border-color)}.main .is-referenced{grid-area:is-referenced}.main .has-references{grid-area:has-references}';export{l as gx_ide_references}

package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/test/test-suggest/test-suggest.css

@@ -0,0 +1,114 @@
+:host {
+  display: block;
+}
+/*general*/
+:root {
+  --highlight-color: rgb(163, 25, 161);
+}
+/*ch-suggest*/
+ch-suggest {
+  display: block;
+}
+ch-suggest::part(title) {
+  display: block;
+  font-weight: bold;
+}
+ch-suggest::part(label) {
+  font-weight: 500;
+}
+ch-suggest[label-position="start"]::part(label) {
+  margin-inline-end: 8px;
+  display: flex;
+  align-items: center;
+}
+ch-suggest[label-position="above"]::part(label) {
+  margin-block-end: 4px;
+}
+ch-suggest::part(close-button) {
+  display: block;
+  width: 16px;
+  height: 16px;
+}
+ch-suggest::part(close-button)::after {
+  content: "✖";
+  line-height: 8px;
+  height: 100%;
+  display: block;
+  border: 1px solid black;
+  cursor: pointer;
+  text-align: center;
+  line-height: 16px;
+}
+ch-suggest::part(header) {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-block-end: 8px;
+}
+ch-suggest::part(ch-window-close) {
+  width: 10px;
+  height: 10px;
+}
+ch-suggest::part(input) {
+  padding: 4px 8px;
+  border: 1px solid black;
+}
+ch-suggest::part(input):focus {
+  outline: 2px solid var(--highlight-color);
+  border-color: var(--highlight-color);
+}
+/*ch-suggest-list*/
+ch-suggest-list {
+  background-color: rgba(234, 234, 234, 0.224);
+  border: 1px solid rgba(128, 128, 128, 0.275);
+  border-radius: 4px;
+  padding: 8px;
+  margin-block-end: 4px;
+}
+ch-suggest-list::part(title) {
+  font-size: 14px;
+  font-weight: bold;
+  text-transform: uppercase;
+  margin: 4px 0 8px 0;
+}
+/*ch-suggest-list-item*/
+ch-suggest-list-item::part(button) {
+  padding: 4px 8px;
+  cursor: pointer;
+  gap: 4px;
+}
+ch-suggest-list-item ch-icon {
+  --icon-size: 16px;
+  margin-inline-end: 2px;
+}
+ch-suggest-list-item:hover {
+  background-color: var(--ch-color--violet-100);
+}
+ch-suggest-list-item:focus,
+ch-suggest-list-item[selected]:focus {
+  outline: 2px solid var(--highlight-color);
+}
+ch-suggest-list-item[selected] {
+  background-color: rgba(241, 184, 243, 0.42);
+  outline: none;
+}
+ch-suggest-list-item::part(button):focus {
+  outline: 2px solid var(--highlight-color);
+  border-color: var(--highlight-color);
+}
+/*content-wrapper*/
+ch-suggest-list-item::part(content-wrapper) {
+  display: flex;
+  gap: 8px;
+}
+/*ch-window*/
+ch-suggest::part(dropdown) {
+  margin-block-start: 4px;
+  border: 1px solid black;
+  background-color: white;
+  padding: 8px;
+}
+/*focus*/
+:focus {
+  outline-style: none !important;
+}

package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/tooltip/tooltip.css

@@ -0,0 +1,120 @@
+*,
+::after,
+::before {
+  box-sizing: border-box;
+}
+
+ch-tooltip {
+  --ch-tooltip-separation: 12px;
+  --ch-tooltip-separation-x: var(--ch-tooltip-separation);
+  --ch-tooltip-separation-y: var(--ch-tooltip-separation);
+  --ch-tooltip-arrow-size: 10px;
+  --ch-tooltip-based: calc( 1px - var(--ch-tooltip-arrow-size));
+  --ch-tooltip-centered: calc( 50% - var(--ch-tooltip-arrow-size) / 2);
+  --ch-tooltip-75: calc( 75% - var(--ch-tooltip-arrow-size) / 2);
+  --ch-tooltip-25: calc( 25% - var(--ch-tooltip-arrow-size) / 2);
+  display: flex;
+  position: relative;
+  width: 100%;
+  height: 100%;
+}
+
+ch-tooltip:not([hidden]) {
+  display: contents;
+}
+
+ch-window[y-align=outside-start] {
+  --ch-window-separation: var(--ch-tooltip-separation-y);
+  --ch-window-separation-y: calc(var(--ch-tooltip-separation-y) * -1);
+}
+
+ch-window[y-align=outside-end] {
+  --ch-window-separation: var(--ch-tooltip-separation-y);
+  --ch-window-separation-y: var(--ch-tooltip-separation-y);
+}
+
+ch-window[x-align=outside-start] + :not(ch-window[y-align=outside-start], ch-window[y-align=outside-end]) {
+  --ch-window-separation: var(--ch-tooltip-separation-x);
+  --ch-window-separation-x: calc(var(--ch-tooltip-separation-x) * -1);
+}
+
+ch-window[x-align=outside-end] + :not(ch-window[y-align=outside-start], ch-window[y-align=outside-end]) {
+  --ch-window-separation: var(--ch-tooltip-separation-x);
+  --ch-window-separation-x: var(--ch-tooltip-separation-x);
+}
+
+ch-window[y-align=outside-start] .tooltip-content::after,
+ch-window[y-align=outside-start][x-align=outside-start] .tooltip-content::after,
+ch-window[y-align=outside-start][x-align=outside-end] .tooltip-content::after {
+  clip-path: polygon(0 0, 50% 100%, 100% 0);
+  inset-block-end: var(--ch-tooltip-based);
+}
+ch-window[y-align=outside-start][x-align=outside-start] .tooltip-content::after,
+ch-window[y-align=outside-start][x-align=outside-start][x-align=outside-start] .tooltip-content::after,
+ch-window[y-align=outside-start][x-align=outside-end][x-align=outside-start] .tooltip-content::after {
+  inset-inline-end: 0;
+}
+ch-window[y-align=outside-start][x-align=outside-end] .tooltip-content::after,
+ch-window[y-align=outside-start][x-align=outside-start][x-align=outside-end] .tooltip-content::after,
+ch-window[y-align=outside-start][x-align=outside-end][x-align=outside-end] .tooltip-content::after {
+  inset-inline-start: 0;
+}
+
+ch-window[y-align=outside-end] .tooltip-content::after,
+ch-window[y-align=outside-end][x-align=outside-end] .tooltip-content::after,
+ch-window[y-align=outside-end][x-align=outside-start] .tooltip-content::after {
+  clip-path: polygon(50% 0, 100% 100%, 0 100%);
+  inset-block-start: var(--ch-tooltip-based);
+}
+ch-window[y-align=outside-end][x-align=outside-start] .tooltip-content::after,
+ch-window[y-align=outside-end][x-align=outside-end][x-align=outside-start] .tooltip-content::after,
+ch-window[y-align=outside-end][x-align=outside-start][x-align=outside-start] .tooltip-content::after {
+  inset-inline-end: 0;
+}
+ch-window[y-align=outside-end][x-align=outside-end] .tooltip-content::after,
+ch-window[y-align=outside-end][x-align=outside-end][x-align=outside-end] .tooltip-content::after,
+ch-window[y-align=outside-end][x-align=outside-start][x-align=outside-end] .tooltip-content::after {
+  inset-inline-start: 0;
+}
+
+ch-window[x-align=outside-start] .tooltip-content::after {
+  clip-path: polygon(100% 50%, 0 0, 0 100%);
+  inset-inline-end: var(--ch-tooltip-based);
+}
+
+ch-window[x-align=outside-end] .tooltip-content::after {
+  clip-path: polygon(100% 0, 0 50%, 100% 100%);
+  inset-inline-start: var(--ch-tooltip-based);
+}
+
+ch-window[x-align=center] .tooltip-content::after {
+  inset-inline-start: var(--ch-tooltip-centered);
+}
+
+ch-window[x-align=inside-start] .tooltip-content::after {
+  inset-inline-start: var(--ch-tooltip-75);
+}
+
+ch-window[x-align=inside-end] .tooltip-content::after {
+  inset-inline-start: var(--ch-tooltip-25);
+}
+
+ch-window[y-align=inside-start] .tooltip-content::after {
+  inset-block-start: var(--ch-tooltip-75);
+}
+
+ch-window[y-align=center] .tooltip-content::after {
+  inset-block-start: var(--ch-tooltip-centered);
+}
+
+ch-window[y-align=inside-end] .tooltip-content::after {
+  inset-block-start: var(--ch-tooltip-25);
+}
+
+.tooltip-content::after {
+  content: " ";
+  position: absolute;
+  background-color: inherit;
+  width: var(--ch-tooltip-arrow-size);
+  height: var(--ch-tooltip-arrow-size);
+}

package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/{tree-x → tree-view/tree-x}/tree-x.css

@@ -11,8 +11,7 @@ ch-tree-x > .ch-tree-x-container {
 ch-tree-x.ch-tree-x-dragging-item ch-tree-x-list-item {
   pointer-events: var(--ch-tree-x-pointer-events, all);
 }
-ch-tree-x.ch-tree-x-dragging-item .ch-tree-x-list-item--deny-drop,
-ch-tree-x.ch-tree-x-dragging-item ch-tree-x-list {
+ch-tree-x.ch-tree-x-dragging-item .ch-tree-x-list-item--deny-drop {
   pointer-events: none;
 }
 ch-tree-x.ch-tree-x--dragging-selected-items ch-tree-x-list-item[selected] {
@@ -21,7 +20,7 @@ ch-tree-x.ch-tree-x--dragging-selected-items ch-tree-x-list-item[selected] {
 ch-tree-x.ch-tree-x-waiting-drop-processing {
   cursor: wait;
 }
-ch-tree-x.ch-tree-x-waiting-drop-processing > ch-tree-x-list {
+ch-tree-x.ch-tree-x-waiting-drop-processing > .ch-tree-x-container {
   pointer-events: none;
 }
 

package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/{tree-x-list-item → tree-view/tree-x-list-item}/tree-x-list-item.css

@@ -247,16 +247,13 @@
   --parent-negative-checkbox-offset: 0px;
   --parent-checkbox-offset: 0px;
   display: grid;
-  grid-template-rows: 0fr;
+  grid-auto-rows: min-content;
+  position: relative;
   content-visibility: auto;
   contain-intrinsic-size: auto 100px;
 }
 
-.expanded {
-  grid-template-rows: 1fr;
-}
-
-:not(.expanded) ::slotted([slot=tree]) {
+.expandable--collapsed {
   display: none;
   overflow: hidden;
   content-visibility: hidden;

package/dist/node_modules/@genexus/gemini/dist/collection/components/tooltip/tooltip.css

@@ -799,6 +799,13 @@ FORM ELEMENTS
   display: flex;
 }
 
+:host([fixed]) {
+  border: 1px solid black;
+}
+:host([fixed]) .tooltip:hover .tooltiptext {
+  visibility: hidden;
+  opacity: 0;
+}
 :host([fixed]) .tooltip .tooltiptext {
   position: fixed;
   height: 0;
@@ -820,4 +827,8 @@ FORM ELEMENTS
 }
 :host([fixed]) .tooltip .tooltiptext:after {
   display: none;
+}
+:host([fixed]) .tooltip--visible .tooltiptext {
+  visibility: visible !important;
+  opacity: 1 !important;
 }

package/dist/node_modules/@genexus/gemini/dist/collection/components/tree-view/tree-view.css

@@ -341,20 +341,37 @@ FORM ELEMENTS
 gxg-tree-view
 ---------------------------*/
 gxg-tree-view {
-  display: grid;
-  grid-template-columns: 1fr;
-  grid-template-rows: 1fr;
-  height: 100%;
   font-family: var(--font-family-primary);
   font-size: var(--font-size-lg);
   font-weight: var(--font-weight-regular);
   color: var(--color-on-background);
+  display: contents;
 }
 
-.tree-buttons {
-  display: grid;
-  grid-auto-rows: max-content;
-  row-gap: 8px;
+ch-tree-x {
+  /* Track */
+  /* Handle */
+  /* Handle on hover */
+}
+ch-tree-x::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+ch-tree-x::-webkit-scrollbar-track {
+  background-color: var(--gray-02);
+  border-radius: 10px;
+}
+ch-tree-x::-webkit-scrollbar-thumb {
+  background: var(--gray-05);
+  border-radius: 10px;
+}
+ch-tree-x::-webkit-scrollbar-thumb:hover {
+  background: var(--gray-04);
+  cursor: pointer;
+}
+ch-tree-x > div.ch-tree-x-container {
+  position: relative;
+  width: 100%;
 }
 
 /*---------------------------
@@ -363,6 +380,39 @@ ch-tree-x-list-item
 ch-tree-x-list-item {
   --expandable-button-width: var(--spacing-comp-04);
 }
+ch-tree-x-list-item.tree-view-item--folder::part(action)::before, ch-tree-x-list-item.tree-view-item--module::part(action)::before {
+  grid-area: left-img;
+  content: "";
+  width: 14px;
+  height: 14px;
+  margin-inline-end: 4px;
+  background-repeat: no-repeat;
+}
+ch-tree-x-list-item.tree-view-item--folder::part(action)::before {
+  background-image: url("/build/icon-assets/objects/folder.svg");
+}
+ch-tree-x-list-item.tree-view-item--folder::part(action expanded)::before {
+  background-image: url("/build/icon-assets/objects/folder-open.svg");
+}
+ch-tree-x-list-item.tree-view-item--module::part(action)::before {
+  background-image: url("/build/icon-assets/objects/module.svg");
+}
+ch-tree-x-list-item.tree-view-item--module::part(action expanded)::before {
+  background-image: url("/build/icon-assets/objects/module-open.svg");
+}
+ch-tree-x-list-item .tree-view-item--pending-commit::part(action)::before {
+  content: "";
+  position: relative;
+  z-index: 1;
+  grid-area: left-img;
+  width: 5px;
+  height: 5px;
+  align-self: end;
+  margin-block-end: 3px;
+  margin-inline-start: 1px;
+  background-color: #2c3b92;
+  border-radius: 50%;
+}
 ch-tree-x-list-item::part(header) {
   padding-inline-end: calc(var(--spacing-comp-02) * 0.65);
   border: 1px solid transparent;
@@ -376,10 +426,6 @@ ch-tree-x-list-item::part(header):focus {
 }
 ch-tree-x-list-item[selected]::part(header) {
   background-color: var(--gxg-background-color--selected);
-  outline-style: solid;
-  outline-color: var(--gxg-border-color--focused);
-  outline-width: var(--border-width-md);
-  outline-offset: -2px;
 }
 ch-tree-x-list-item[selected]::part(header):hover {
   background-color: var(--gxg-background-color--selected-hover);

package/dist/types/common/helpers.d.ts

@@ -10,3 +10,4 @@ export declare const getElementSelectorParts: (element: HTMLElement) => string[]
 export declare const querySelectorPart: (selector: string) => HTMLElement;
 export declare const formatDate: (date: Date, type?: FormatDateType) => string;
 export type FormatDateType = "date" | "date-time";
+export declare const resolveGxgIconPath: (gxgIconName: string) => string;

package/dist/types/components/references/helpers.d.ts

@@ -1,5 +1,5 @@
 import { SuggestData } from "@genexus/chameleon-controls-library/dist/types/components/suggest/ch-suggest";
-import { GxgTreeItemData } from "@genexus/gemini/dist/types/components/tree-item/gxg-tree-item";
+import { TreeXItemModel } from "@genexus/chameleon-controls-library/dist/types/components/tree-view/tree-x/types";
 import { SelectorCategoryData } from "./references";
 import { ReferenceData } from "./references";
 /**
@@ -7,6 +7,6 @@ import { ReferenceData } from "./references";
  */
 export declare const convertObjectDataToSuggestData: (selectorCategoriesData: SelectorCategoryData[]) => SuggestData;
 /**
- * @description This function converts ReferenceData[] data to GxgTreeItemData[]
+ * @description This function converts ReferenceData[] data to TreeItemData[]
  */
-export declare const convertReferenceDataToTreeData: (referencedBy: ReferenceData[] | undefined) => GxgTreeItemData[];
+export declare const convertReferenceDataToTreeViewData: (referenceData: ReferenceData[] | undefined) => TreeXItemModel[];

package/dist/types/components/references/references.d.ts

@@ -1,5 +1,6 @@
 import { EventEmitter } from "../../stencil-public-runtime";
 import { GxgTreeItemData } from "@genexus/gemini/dist/types/components/tree-item/gxg-tree-item";
+import { TreeXItemModel } from "@genexus/chameleon-controls-library/dist/types/components/tree-view/tree-x/types";
 import { SuggestData } from "@genexus/chameleon-controls-library/dist/types/components/suggest/ch-suggest";
 export declare class GxIdeReferences {
   /**
@@ -15,9 +16,8 @@ export declare class GxIdeReferences {
    */
   private selectorCategoryData;
   el: HTMLGxIdeReferencesElement;
-  private selectObjectSuggestEl;
-  referencedByTreeData: GxgTreeItemData[];
-  referencesToTreeData: GxgTreeItemData[];
+  referencedByTreeData: TreeXItemModel[];
+  referencesToTreeData: TreeXItemModel[];
   /**
    * Displays or hides the header-bottom section
    */
@@ -66,10 +66,11 @@ export declare class GxIdeReferences {
   componentWillLoad(): Promise<void>;
   componentDidLoad(): void;
   componentDidRender(): void;
+  private attachTreeEvents;
   /**
    * It attaches on the ch-suggest, the "itemSelected" event triggered by the ch-suggest-list-item. This helps set the new 'selectedObject'.
    */
-  private attachSelectObjectListener;
+  private selectObjectSelectionChanged;
   /**
    * This handler gets fired every time the value of the 'Select Object' ch-suggest changes.
    */
@@ -91,21 +92,8 @@ export declare class GxIdeReferences {
    * It hides/show the bar (The header bottom section).
    */
   private hideBarButtonClickedHandler;
-  /**
-   * Simple helper function to get 'this.referencedByTreeData' or 'this.referencesToTreeData'
-   */
-  private getRef;
-  /**
-   * Simple helper function to update 'this.referencedByTreeData' or 'this.referencesToTreeData'
-   */
-  private updateRef;
-  /**
-   * Handles changes on any of the references (by or to). Used to:
-   * 1) Keep the models updated.
-   * 2) call the openObjectCallback.
-   * 3) call the loadReferencesCallback if a lazy node was toggled.
-   */
-  private referencesPanelStateChangedHandler;
+  private referencesLazyLoadCallbackHandler;
+  private referenceSelectedHandler;
   render(): any;
 }
 export type SelectorCategoryData = {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genexus/genexus-ide-ui",
   "license": "Apache-2.0",
-  "version": "0.0.57",
+  "version": "0.0.58",
   "description": "GeneXus IDE UI components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -36,10 +36,10 @@
     "@types/react": "^18.2.8"
   },
   "peerDependencies": {
-    "@genexus/gemini": "*0.1.489"
+    "@genexus/gemini": "*0.1.494"
   },
   "devDependencies": {
-    "@genexus/gemini": "*0.1.489",
+    "@genexus/gemini": "*0.1.494",
     "@stencil-community/eslint-plugin": "^0.5.0",
     "@stencil/core": "^2.17.0",
     "@stencil/sass": "^2.0.1",

package/dist/cjs/update-tree-model-8b154db1.js

@@ -1,53 +0,0 @@
-'use strict';
-
-const index = require('./index-5a32426a.js');
-
-/* eslint-disable @typescript-eslint/no-use-before-define */
-const renderTreeItems = (treeItemsModel, firstCall = true) => {
-  if (treeItemsModel === null || treeItemsModel === void 0 ? void 0 : treeItemsModel.length) {
-    if (firstCall) {
-      return treeItemsModel.map((item) => {
-        return renderTreeItem(item);
-      });
-    }
-    else {
-      return (index.h("gxg-tree", { slot: "tree" }, treeItemsModel.map((item) => {
-        return renderTreeItem(item);
-      })));
-    }
-  }
-  return [];
-};
-const renderTreeItem = (item) => {
-  var _a;
-  const childrenLength = item.items ? item.items.length : 0;
-  const isLeaf = !!(childrenLength === 0 || item.leaf);
-  const lazy = !!item.lazy;
-  return (index.h("gxg-tree-item", { checkbox: item.checkbox, checked: item.checked, description: item.description, disabled: item.disabled, icon: item.icon, indeterminate: item.indeterminate, id: item.id, key: `tree-item-${item.id}`, label: item.label, leaf: isLeaf && !lazy, numberOfChildren: childrenLength, opened: item.opened, selected: item.selected }, [item.label, ((_a = item.items) === null || _a === void 0 ? void 0 : _a.length) && renderTreeItems(item.items, false)]));
-};
-
-const updateNodeById = (actualModel, nodeUpdatedState, updatedNodeId) => {
-  return actualModel.map(nodeActualState => {
-    if (nodeActualState.id === updatedNodeId) {
-      return Object.assign(Object.assign({}, nodeActualState), nodeUpdatedState);
-    }
-    else if (nodeActualState.items) {
-      return Object.assign(Object.assign({}, nodeActualState), { items: updateNodeById(nodeActualState.items, nodeUpdatedState, updatedNodeId) });
-    }
-    else {
-      return nodeActualState;
-    }
-  });
-};
-const updateTreeModel = (actualModel, updatedNodeModel, updatedNodeId) => {
-  if (actualModel.length && updatedNodeModel && updatedNodeId) {
-    return updateNodeById(actualModel, updatedNodeModel, updatedNodeId);
-  }
-  else {
-    /* If no newItemModel was passed, at least return the actualModel, to avoid having an updated empty tree */
-    return actualModel;
-  }
-};
-
-exports.renderTreeItems = renderTreeItems;
-exports.updateTreeModel = updateTreeModel;

package/dist/components/ch-tree-x-list.js

@@ -1,6 +0,0 @@
-import { C as ChTreeListX, d as defineCustomElement$1 } from './tree-x-list.js';
-
-const ChTreeXList = ChTreeListX;
-const defineCustomElement = defineCustomElement$1;
-
-export { ChTreeXList, defineCustomElement };

package/dist/components/tree-x-list.js

@@ -1,31 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-
-const treeXListCss = ":host{display:grid;grid-auto-rows:min-content;position:relative;width:100%}";
-
-const ChTreeListX = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-  }
-  render() {
-    return (h(Host, { role: "group" }, h("slot", null)));
-  }
-  get el() { return this; }
-  static get style() { return treeXListCss; }
-}, [1, "ch-tree-x-list"]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["ch-tree-x-list"];
-  components.forEach(tagName => { switch (tagName) {
-    case "ch-tree-x-list":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, ChTreeListX);
-      }
-      break;
-  } });
-}
-
-export { ChTreeListX as C, defineCustomElement as d };

package/dist/components/update-tree-model.js

@@ -1,50 +0,0 @@
-import { h } from '@stencil/core/internal/client';
-
-/* eslint-disable @typescript-eslint/no-use-before-define */
-const renderTreeItems = (treeItemsModel, firstCall = true) => {
-  if (treeItemsModel === null || treeItemsModel === void 0 ? void 0 : treeItemsModel.length) {
-    if (firstCall) {
-      return treeItemsModel.map((item) => {
-        return renderTreeItem(item);
-      });
-    }
-    else {
-      return (h("gxg-tree", { slot: "tree" }, treeItemsModel.map((item) => {
-        return renderTreeItem(item);
-      })));
-    }
-  }
-  return [];
-};
-const renderTreeItem = (item) => {
-  var _a;
-  const childrenLength = item.items ? item.items.length : 0;
-  const isLeaf = !!(childrenLength === 0 || item.leaf);
-  const lazy = !!item.lazy;
-  return (h("gxg-tree-item", { checkbox: item.checkbox, checked: item.checked, description: item.description, disabled: item.disabled, icon: item.icon, indeterminate: item.indeterminate, id: item.id, key: `tree-item-${item.id}`, label: item.label, leaf: isLeaf && !lazy, numberOfChildren: childrenLength, opened: item.opened, selected: item.selected }, [item.label, ((_a = item.items) === null || _a === void 0 ? void 0 : _a.length) && renderTreeItems(item.items, false)]));
-};
-
-const updateNodeById = (actualModel, nodeUpdatedState, updatedNodeId) => {
-  return actualModel.map(nodeActualState => {
-    if (nodeActualState.id === updatedNodeId) {
-      return Object.assign(Object.assign({}, nodeActualState), nodeUpdatedState);
-    }
-    else if (nodeActualState.items) {
-      return Object.assign(Object.assign({}, nodeActualState), { items: updateNodeById(nodeActualState.items, nodeUpdatedState, updatedNodeId) });
-    }
-    else {
-      return nodeActualState;
-    }
-  });
-};
-const updateTreeModel = (actualModel, updatedNodeModel, updatedNodeId) => {
-  if (actualModel.length && updatedNodeModel && updatedNodeId) {
-    return updateNodeById(actualModel, updatedNodeModel, updatedNodeId);
-  }
-  else {
-    /* If no newItemModel was passed, at least return the actualModel, to avoid having an updated empty tree */
-    return actualModel;
-  }
-};
-
-export { renderTreeItems as r, updateTreeModel as u };