@genexus/genexus-ide-ui 1.1.4 → 1.1.5

package/dist/{esm/form-validation-cd0215c6.js.map → genexus-ide-ui/p-549b8f0c.js.map}

@@ -1 +1 @@
-{"file":"form-validation-cd0215c6.js","mappings":"AAGA;AAqBA;AACA,MAAM,kCAAkC,GAAG;IACzC,aAAa,EAAE,gBAAgB;IAC/B,qBAAqB,EAAE,iBAAiB;IACxC,SAAS,EAAE,aAAa;CAChB,CAAC;AAEX,MAAM,gBAAgB,GAAG,CAAC,QAAiB,EAAE,OAAoB;IAC/D,MAAM,cAAc,GAAG,OAAO,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;IACrD,MAAM,UAAU,GACd,kCAAkC,CAChC,cAAiE,CAClE,CAAC;IACJ,IAAI,QAAQ,EAAE;QACZ,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;KACnC;SAAM;QACL,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;KACtC;AACH,CAAC,CAAC;MAEW,gBAAgB,GAAG,CAC9B,gBAAkC,EAClC,mBAAmD;IAEnD,MAAM,0BAA0B,GAAG,IAAI,GAAG,CAAC,mBAAmB,CAAC,CAAC;IAChE,gBAAgB,CAAC,WAAW,CAAC,OAAO,CAAC,WAAW;QAC9C,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,CAAC;QACjC,MAAM,aAAa,GAAG,WAAW,CAAC,QAAQ,CAAC;QAC3C,MAAM,gBAAgB,GAAG,0BAA0B,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;QAClE,IAAI,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,SAAS,EAAE;;YAE/B,gBAAgB,CAAC,aAAa,EAAE,gBAAgB,CAAC,SAAS,CAAC,CAAC;YAC5D,0BAA0B,CAAC,GAAG,CAAC,QAAQ,kCAClC,gBAAgB,KACnB,QAAQ,EAAE,aAAa,EACvB,OAAO,EAAE,WAAW,CAAC,OAAO,IAC5B,CAAC;SACJ;KACF,CAAC,CAAC;;IAEH,OAAO,0BAA0B,CAAC;AACpC;;;;","names":[],"sources":["src/common/form-validation.ts"],"sourcesContent":["import { FormSubmitResult, ConnectionResultData } from \"../common/types\";\nimport { FormComponent } from \"@genexus/gemini/dist/types/common/interfaces\";\n\n// formSubmitValidation will be deprecated. use \"validateControls\" instead.\nexport const formSubmitValidation = (\n  result: FormSubmitResult | ConnectionResultData,\n  ref: any\n) => {\n  result.fieldErrors?.forEach(element => {\n    const key = element.key;\n    const message = element.message;\n    const hasError = element.hasError;\n\n    const reference: FormComponent = ref[`${key}El`];\n    if (reference && hasError && message.trim()) {\n      reference.validationStatus = \"error\";\n      reference.validationMessage = message;\n    } else if (reference && !hasError) {\n      reference.validationStatus = \"indeterminate\";\n      reference.validationMessage = null;\n    }\n  });\n};\n\n// TODO: Improve the way we mark components with error. We must not use error classes.\nconst formElementsErrorClassesDictionary = {\n  \"ch-checkbox\": \"checkbox-error\",\n  \"ch-combo-box-render\": \"combo-box-error\",\n  \"ch-edit\": \"input-error\"\n} as const;\n\nconst toggleErrorClass = (hasError: boolean, element: HTMLElement) => {\n  const elementTagName = element.tagName.toLowerCase();\n  const errorClass =\n    formElementsErrorClassesDictionary[\n      elementTagName as keyof typeof formElementsErrorClassesDictionary\n    ];\n  if (hasError) {\n    element.classList.add(errorClass);\n  } else {\n    element.classList.remove(errorClass);\n  }\n};\n\nexport const validateControls = (\n  formSubmitResult: FormSubmitResult,\n  validatableControls: Map<string, ControlValidation>\n): Map<string, ControlValidation> => {\n  const validatableControlsUpdated = new Map(validatableControls);\n  formSubmitResult.fieldErrors.forEach(fieldResult => {\n    const fieldKey = fieldResult.key;\n    const fieldHasError = fieldResult.hasError;\n    const controlMapRecord = validatableControlsUpdated.get(fieldKey);\n    if (controlMapRecord?.reference) {\n      // toggle class to add or remove error style\n      toggleErrorClass(fieldHasError, controlMapRecord.reference);\n      validatableControlsUpdated.set(fieldKey, {\n        ...controlMapRecord,\n        hasError: fieldHasError,\n        message: fieldResult.message\n      });\n    }\n  });\n  // return validatableControls updated.\n  return validatableControlsUpdated;\n};\n\nexport type ControlValidation = {\n  reference: HTMLElement;\n  hasError: boolean;\n  message: string;\n};\n"],"version":3}
+{"version":3,"names":["formElementsErrorClassesDictionary","toggleErrorClass","hasError","element","elementTagName","tagName","toLowerCase","errorClass","classList","add","remove","validateControls","formSubmitResult","validatableControls","validatableControlsUpdated","Map","fieldErrors","forEach","fieldResult","fieldKey","key","fieldHasError","controlMapRecord","get","reference","set","message"],"sources":["src/common/form-validation.ts"],"sourcesContent":["import { FormSubmitResult, ConnectionResultData } from \"../common/types\";\nimport { FormComponent } from \"@genexus/gemini/dist/types/common/interfaces\";\n\n// formSubmitValidation will be deprecated. use \"validateControls\" instead.\nexport const formSubmitValidation = (\n  result: FormSubmitResult | ConnectionResultData,\n  ref: any\n) => {\n  result.fieldErrors?.forEach(element => {\n    const key = element.key;\n    const message = element.message;\n    const hasError = element.hasError;\n\n    const reference: FormComponent = ref[`${key}El`];\n    if (reference && hasError && message.trim()) {\n      reference.validationStatus = \"error\";\n      reference.validationMessage = message;\n    } else if (reference && !hasError) {\n      reference.validationStatus = \"indeterminate\";\n      reference.validationMessage = null;\n    }\n  });\n};\n\n// TODO: Improve the way we mark components with error. We must not use error classes.\nconst formElementsErrorClassesDictionary = {\n  \"ch-checkbox\": \"checkbox-error\",\n  \"ch-combo-box-render\": \"combo-box-error\",\n  \"ch-edit\": \"input-error\"\n} as const;\n\nconst toggleErrorClass = (hasError: boolean, element: HTMLElement) => {\n  const elementTagName = element.tagName.toLowerCase();\n  const errorClass =\n    formElementsErrorClassesDictionary[\n      elementTagName as keyof typeof formElementsErrorClassesDictionary\n    ];\n  if (hasError) {\n    element.classList.add(errorClass);\n  } else {\n    element.classList.remove(errorClass);\n  }\n};\n\nexport const validateControls = (\n  formSubmitResult: FormSubmitResult,\n  validatableControls: Map<string, ControlValidation>\n): Map<string, ControlValidation> => {\n  const validatableControlsUpdated = new Map(validatableControls);\n  formSubmitResult.fieldErrors.forEach(fieldResult => {\n    const fieldKey = fieldResult.key;\n    const fieldHasError = fieldResult.hasError;\n    const controlMapRecord = validatableControlsUpdated.get(fieldKey);\n    if (controlMapRecord?.reference) {\n      // toggle class to add or remove error style\n      toggleErrorClass(fieldHasError, controlMapRecord.reference);\n      validatableControlsUpdated.set(fieldKey, {\n        ...controlMapRecord,\n        hasError: fieldHasError,\n        message: fieldResult.message\n      });\n    }\n  });\n  // return validatableControls updated.\n  return validatableControlsUpdated;\n};\n\nexport type ControlValidation = {\n  reference: HTMLElement;\n  hasError: boolean;\n  message: string;\n};\n"],"mappings":";;AAyBA,MAAMA,IAAqC;EACzC,eAAe;EACf,uBAAuB;EACvB,WAAW;;;AAGb,MAAMC,mBAAmB,CAACC,GAAmBC;EAC3C,MAAMC,IAAiBD,EAAQE,QAAQC;EACvC,MAAMC,IACJP,EACEI;EAEJ,IAAIF,GAAU;IACZC,EAAQK,UAAUC,IAAIF;SACjB;IACLJ,EAAQK,UAAUE,OAAOH;;;;MAIhBI,mBAAmB,CAC9BC,GACAC;EAEA,MAAMC,IAA6B,IAAIC,IAAIF;EAC3CD,EAAiBI,YAAYC,SAAQC;IACnC,MAAMC,IAAWD,EAAYE;IAC7B,MAAMC,IAAgBH,EAAYhB;IAClC,MAAMoB,IAAmBR,EAA2BS,IAAIJ;IACxD,IAAIG,GAAkBE,WAAW;;MAE/BvB,iBAAiBoB,GAAeC,EAAiBE;MACjDV,EAA2BW,IAAIN,GAAU;WACpCG;QACHpB,UAAUmB;QACVK,SAASR,EAAYQ;;;;;IAK3B,OAAOZ;AAA0B"}

package/dist/genexus-ide-ui/{p-007173ef.entry.js → p-5a42428d.entry.js}

@@ -1,12 +1,10 @@
 import { g as e, r as t, h as s, H as i, a as r } from "./p-25a9f1d7.js";
 
-import { g as o } from "./p-6e4208d8.js";
+import { g as o } from "./p-ede7bd20.js";
 
-import "./p-5ac47c69.js";
+import { L as a } from "./p-857866f8.js";
 
-import { L as a } from "./p-311eedf3.js";
-
-import { A as n } from "./p-9a609b51.js";
+import { A as n } from "./p-48f5911b.js";
 
 const l = ":host{--wrapper-copacity:0;--wrapper-min-inline-size:700px;--wrapper-max-inline-size:1040px;--wrapper-block-size:640px;transition:var(--mer-timing--regular) opacity;display:flex;align-items:center;justify-content:center;inline-size:100%;block-size:100%;padding:16px;overflow:auto}.wrapper{flex:1;display:grid;grid-template-columns:1fr var(--wrapper-block-size);block-size:var(--wrapper-block-size);max-inline-size:var(--wrapper-max-inline-size);background-color:var(--mer-surface__elevation--01);border-radius:var(--mer-spacing--sm);overflow:auto;transform:translateY(6px)}.side-inline-start{background-size:cover}.side-inline-end{position:relative;display:grid;grid-template-rows:max-content 1fr max-content;padding:64px 80px;transition:1000ms grid-template-rows;overflow:auto}.close-button{position:absolute;inset-inline-end:0;inset-block-start:0}.header{display:grid;gap:var(--mer-spacing--md);margin-block-end:92px}.header__logo__close-button{display:flex;justify-content:space-between}.title{color:var(--mer-text__on-surface);font-size:var(--mer-font__size--xl);font-weight:var(--mer-font__weight--semi-bold);letter-spacing:0.02em}.header__description{color:var(--mer-text__complementary);line-height:1.45 !important}.main{display:flex;flex-direction:column;gap:var(--mer-spacing--sm);overflow:auto}.log__container{--logVisibleLines:6;--logFontSize:12px;--logLineHeight:1.2;--logGap:4px;--logContainerBlockSize:calc(\n    var(--logFontSize) * var(--logLineHeight) * var(--logVisibleLines) +\n      calc(var(--logGap) * (var(--logVisibleLines) - 1))\n  );block-size:var(--logContainerBlockSize);font-family:monospace;color:var(--mer-text__complementary);display:flex;flex-direction:column-reverse;gap:var(--logGap);overflow:hidden}.log__container:hover{overflow:auto}.log__message{opacity:0;transition:var(--mer-timing--regular) opacity;animation:fadeInLogMessage 0.45s ease-out forwards}.log__message--error{color:var(--mer-text__error)}.footer{display:grid;grid-auto-rows:max-content;gap:var(--mer-spacing--sm);margin-block-start:var(--mer-spacing--lg)}.error-message{font-family:monospace;font-size:13px;line-height:1.5;color:var(--mer-text__error);margin-block-start:auto;display:-webkit-box;-webkit-line-clamp:2;overflow:hidden}.status--processing{display:flex;flex-direction:row;align-items:baseline;gap:4px}@keyframes fadeInLogMessage{from{opacity:0}to{opacity:1}}";
 
@@ -58,14 +56,13 @@ const u = class {
     c(this, d, await a.getComponentStrings(this.el), "f");
   }
   render() {
-    var e, t;
-    const r = this.showOpenLogLink && this.openLogCallback;
-    const o = this.showQuitButton && this.quitCallback && this.messages.length > 0;
-    const a = !(this.showQuitButton && this.quitCallback) && ((e = this.messages) === null || e === void 0 ? void 0 : e.length) > 0;
-    const l = this.showDockerMissingError || !a;
-    let c = p(this, d, "f").warnings.installationFailed;
-    if (r) {
-      c = `${c} ${p(this, d, "f").warnings.checkTheLog}`;
+    const e = this.showOpenLogLink && this.openLogCallback;
+    const t = this.showQuitButton && this.quitCallback && this.messages.length > 0;
+    const r = !(this.showQuitButton && this.quitCallback) && this.messages?.length > 0;
+    const o = this.showDockerMissingError || !r;
+    let a = p(this, d, "f").warnings.installationFailed;
+    if (e) {
+      a = `${a} ${p(this, d, "f").warnings.checkTheLog}`;
     }
     return s(i, null, s("ch-theme", {
       model: f
@@ -95,7 +92,7 @@ const u = class {
       class: "body-italic-m header__description"
     }, p(this, d, "f").copyright)), s("main", {
       class: "main"
-    }, a && s("p", {
+    }, r && s("p", {
       class: {
         "body-regular-m": true,
         "status--processing": true
@@ -105,16 +102,16 @@ const u = class {
       role: "status",
       "aria-live": "polite",
       "aria-busy": this.ariaBusy
-    }, (t = this.messages) === null || t === void 0 ? void 0 : t.reverse().map(((e, t) => s("p", {
+    }, this.messages?.reverse().map(((e, t) => s("p", {
       class: {
         "tiny-regular-l": true,
         log__message: true,
         "log__message--error": e.type === "error"
       },
       key: this.messages.length - t
-    }, e.text)))), l && s("p", {
+    }, e.text)))), o && s("p", {
       class: "error-message status--error"
-    }, o && s("span", null, c), o && this.showDockerMissingError && s("span", null, " - "), this.showDockerMissingError && s("span", null, p(this, d, "f").warnings.dockerMissing))), s("footer", {
+    }, t && s("span", null, a), t && this.showDockerMissingError && s("span", null, " - "), this.showDockerMissingError && s("span", null, p(this, d, "f").warnings.dockerMissing))), s("footer", {
       class: "footer"
     }, s("div", {
       class: "buttons-spacer"
@@ -122,7 +119,7 @@ const u = class {
       key: "download-docker",
       class: "button-secondary button-icon-and-text download-docker-button",
       onClick: this.downloadDockerCallback
-    }, p(this, d, "f").downloadDocker), r && s("button", {
+    }, p(this, d, "f").downloadDocker), e && s("button", {
       key: "open-log",
       class: "button-tertiary button-icon-and-text",
       onClick: this.openLogCallback
@@ -147,4 +144,4 @@ d = new WeakMap;
 u.style = l;
 
 export { u as gx_ide_splash };
-//# sourceMappingURL=p-007173ef.entry.js.map
+//# sourceMappingURL=p-5a42428d.entry.js.map

package/dist/genexus-ide-ui/p-5a42428d.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["splashCss","COPYRIGHTS_ILLUSTRATION","getAssetPath","LOGO_NEXT","CSS_BUNDLES","OPEN_LOG_ICON","getIconPath","category","name","colorType","GxIdeUiSplash","_GxIdeUiSplash_componentLocale","set","this","componentWillLoad","__classPrivateFieldSet","Locale","getComponentStrings","el","render","renderOpenLogLink","showOpenLogLink","openLogCallback","renderInstallationErrorMessage","showQuitButton","quitCallback","messages","length","renderInitializingMessage","renderErrorMessage","showDockerMissingError","installationErrorMessage","__classPrivateFieldGet","warnings","installationFailed","checkTheLog","h","Host","model","class","scrollable","wrapper","style","backgroundImage","role","src","alt","illustrationAlternativeText","title","allRightsReserved","copyright","initializingServices","ANIMATION_DOTS","ariaBusy","reverse","map","message","i","log__message","type","key","text","dockerMissing","onClick","downloadDockerCallback","downloadDocker","openLog","quitGenexus"],"sources":["src/components/splash/splash.scss?tag=gx-ide-splash&encapsulation=shadow","src/components/splash/splash.tsx"],"sourcesContent":["@import \"../../global/components/splash-and-welcome-page\";\n\n:host {\n  --wrapper-copacity: 0;\n  --wrapper-min-inline-size: 700px;\n  --wrapper-max-inline-size: 1040px;\n  --wrapper-block-size: 640px;\n  transition: var(--mer-timing--regular) opacity;\n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  inline-size: 100%;\n  block-size: 100%;\n  padding: 16px;\n\n  overflow: auto;\n}\n\n.wrapper {\n  flex: 1;\n  display: grid;\n  grid-template-columns: 1fr var(--wrapper-block-size);\n  block-size: var(--wrapper-block-size);\n  // min-inline-size: var(--wrapper-min-inline-size);\n  max-inline-size: var(--wrapper-max-inline-size);\n\n  background-color: var(--mer-surface__elevation--01);\n  border-radius: var(--mer-spacing--sm);\n\n  overflow: auto;\n  transform: translateY(6px);\n}\n\n// Side inline-start (the illustration)\n.side-inline-start {\n  background-size: cover;\n}\n\n// Side inline-end (the content)\n.side-inline-end {\n  position: relative;\n  display: grid;\n  grid-template-rows: max-content 1fr max-content;\n  padding: 64px 80px;\n\n  transition: 1000ms grid-template-rows;\n  overflow: auto;\n}\n\n.close-button {\n  position: absolute;\n  inset-inline-end: 0;\n  inset-block-start: 0;\n}\n\n// header\n.header {\n  display: grid;\n  gap: var(--mer-spacing--md);\n  margin-block-end: 92px;\n}\n.header__logo__close-button {\n  display: flex;\n  justify-content: space-between;\n}\n.title {\n  color: var(--mer-text__on-surface);\n  font-size: var(--mer-font__size--xl);\n  font-weight: var(--mer-font__weight--semi-bold);\n  letter-spacing: 0.02em;\n}\n.header__description {\n  color: var(--mer-text__complementary);\n  line-height: 1.45 !important;\n  // TODO: Discuss with Design Team about line-height.\n  // Mercury line-heights looks tight to me.\n}\n\n.main {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mer-spacing--sm);\n  // margin-block-start: auto;\n\n  overflow: auto;\n}\n.log__container {\n  --logVisibleLines: 6;\n  --logFontSize: 12px; // 12px is the font size of .tiny-regular-l\n  --logLineHeight: 1.2; // 1.2 is the line-height of .tiny-regular-l\n  --logGap: 4px;\n  --logContainerBlockSize: calc(\n    var(--logFontSize) * var(--logLineHeight) * var(--logVisibleLines) +\n      calc(var(--logGap) * (var(--logVisibleLines) - 1))\n  );\n  block-size: var(--logContainerBlockSize);\n  // TODO: Add/include on Mercury a monospaced font, and then use it here.\n  font-family: monospace;\n  color: var(--mer-text__complementary);\n  display: flex;\n  flex-direction: column-reverse;\n  gap: var(--logGap);\n  overflow: hidden;\n  // margin-block-start: auto;\n\n  &:hover {\n    overflow: auto;\n  }\n}\n.log__message {\n  opacity: 0;\n  transition: var(--mer-timing--regular) opacity;\n  animation: fadeInLogMessage 0.45s ease-out forwards;\n\n  &--error {\n    color: var(--mer-text__error);\n  }\n}\n\n// footer\n.footer {\n  display: grid;\n  grid-auto-rows: max-content;\n  gap: var(--mer-spacing--sm);\n  margin-block-start: var(--mer-spacing--lg);\n}\n.error-message {\n  font-family: monospace;\n  font-size: 13px;\n  line-height: 1.5;\n  color: var(--mer-text__error);\n  margin-block-start: auto;\n  // TODO: Use clamp from a helper mixin\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  overflow: hidden;\n}\n\n// helpers\n.status--processing {\n  display: flex;\n  flex-direction: row;\n  align-items: baseline;\n  gap: 4px;\n}\n\n@keyframes fadeInLogMessage {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n","// Stencil\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  State,\n  getAssetPath\n} from \"@stencil/core\";\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n\nimport { Locale } from \"../../common/locale\";\nimport { ANIMATION_DOTS } from \"../../common/common\";\n\nconst COPYRIGHTS_ILLUSTRATION = getAssetPath(\n  `./gx-ide-assets/splash/images/copyrights-illustration.svg`\n);\nconst LOGO_NEXT = getAssetPath(\n  `./gx-ide-assets/welcome-page/images/icon-next.svg`\n);\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"utils/typography\",\n  \"components/button\",\n  \"chameleon/scrollbar\"\n];\n\nconst OPEN_LOG_ICON = getIconPath({\n  category: \"system\",\n  name: \"launch\",\n  colorType: \"primary\"\n});\n\n@Component({\n  tag: \"gx-ide-splash\",\n  styleUrl: \"splash.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/splash\"]\n})\nexport class GxIdeUiSplash {\n  /**\n   * The component hard-coded strings translations.\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #componentLocale: any;\n\n  @Element() el: HTMLGxIdeSplashElement;\n\n  /**\n   * Set this to true if installation is in process\n   */\n  @State() ariaBusy: boolean = true;\n\n  /**\n   * Callback invoked when the user clicks the 'Download Docker' button.\n   */\n  @Prop() readonly downloadDockerCallback: () => void;\n\n  /**\n   * Callback invoked when the user clicks the quit button.\n   */\n  @Prop() readonly quitCallback: () => void;\n\n  /**\n   * Array of messages to display in the text box.\n   * This property updates whenever a message is added,\n   * and the scroll should position itself at the bottom to keep the last message visible.\n   */\n  @Prop() readonly messages: MessageType[] = [];\n\n  /**\n   * Callback invoked when the user clicks the 'Open log' link.\n   */\n  @Prop() readonly openLogCallback: () => void;\n\n  /**\n   * Set to `true` to display the quit button.\n   */\n  @Prop() readonly showQuitButton: boolean = false;\n\n  /**\n   * Set to `true` to display the 'Open log' link.\n   */\n  @Prop() readonly showOpenLogLink: boolean = false;\n\n  /**\n   * Set to `true` to display \"Docker is not installed\" error message and to display \"Download Docker\" button.\n   */\n  @Prop() readonly showDockerMissingError: boolean = false;\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  render() {\n    const renderOpenLogLink = this.showOpenLogLink && this.openLogCallback;\n    const renderInstallationErrorMessage =\n      this.showQuitButton && this.quitCallback && this.messages.length > 0;\n    const renderInitializingMessage =\n      !(this.showQuitButton && this.quitCallback) && this.messages?.length > 0;\n    const renderErrorMessage =\n      this.showDockerMissingError || !renderInitializingMessage;\n\n    let installationErrorMessage =\n      this.#componentLocale.warnings.installationFailed;\n    if (renderOpenLogLink) {\n      installationErrorMessage = `${installationErrorMessage} ${\n        this.#componentLocale.warnings.checkTheLog\n      }`;\n    }\n\n    return (\n      <Host>\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <div\n          class={{\n            scrollable: true,\n            wrapper: true\n          }}\n        >\n          <div\n            class=\"side-inline-start\"\n            style={{ backgroundImage: `url(${COPYRIGHTS_ILLUSTRATION})` }}\n            role=\"img\"\n          ></div>\n\n          <section class=\"side-inline-end scrollable\">\n            <header class=\"header\">\n              <img\n                src={LOGO_NEXT}\n                alt={this.#componentLocale.illustrationAlternativeText}\n              />\n              <h2 class=\"title\">{this.#componentLocale.title}</h2>\n              <p class=\"body-italic-m header__description\">\n                {this.#componentLocale.allRightsReserved}\n              </p>\n              <p class=\"body-italic-m header__description\">\n                {this.#componentLocale.copyright}\n              </p>\n            </header>\n\n            <main class=\"main\">\n              {renderInitializingMessage && (\n                <p\n                  class={{\n                    \"body-regular-m\": true,\n                    \"status--processing\": true\n                  }}\n                >\n                  {this.#componentLocale.initializingServices}\n                  {ANIMATION_DOTS(\"tiny\", \"on-surface\")}\n                </p>\n              )}\n\n              <code\n                class=\"log__container scrollable\"\n                role=\"status\"\n                aria-live=\"polite\"\n                aria-busy={this.ariaBusy}\n              >\n                {this.messages?.reverse().map((message, i) => {\n                  return (\n                    <p\n                      class={{\n                        \"tiny-regular-l\": true,\n                        \"log__message\": true,\n                        \"log__message--error\": message.type === \"error\"\n                      }}\n                      key={this.messages.length - i}\n                    >\n                      {message.text}\n                    </p>\n                  );\n                })}\n              </code>\n\n              {renderErrorMessage && (\n                <p class=\"error-message status--error\">\n                  {renderInstallationErrorMessage && (\n                    <span>{installationErrorMessage}</span>\n                  )}\n\n                  {renderInstallationErrorMessage &&\n                    this.showDockerMissingError && <span> - </span>}\n\n                  {this.showDockerMissingError && (\n                    <span>{this.#componentLocale.warnings.dockerMissing}</span>\n                  )}\n                </p>\n              )}\n            </main>\n\n            <footer class=\"footer\">\n              <div class=\"buttons-spacer\">\n                {this.showDockerMissingError && (\n                  <button\n                    key=\"download-docker\"\n                    class=\"button-secondary button-icon-and-text download-docker-button\"\n                    onClick={this.downloadDockerCallback}\n                  >\n                    {this.#componentLocale.downloadDocker}\n                  </button>\n                )}\n\n                {renderOpenLogLink && (\n                  <button\n                    key=\"open-log\"\n                    class=\"button-tertiary button-icon-and-text\"\n                    onClick={this.openLogCallback}\n                  >\n                    <ch-image class=\"icon-md\" src={OPEN_LOG_ICON}></ch-image>\n                    {this.#componentLocale.openLog}\n                  </button>\n                )}\n\n                {this.quitCallback && this.showQuitButton && (\n                  <button class=\"button-secondary\" onClick={this.quitCallback}>\n                    {this.#componentLocale.quitGenexus}\n                  </button>\n                )}\n              </div>\n            </footer>\n          </section>\n        </div>\n      </Host>\n    );\n  }\n}\n\nexport type MessageType = {\n  type: \"info\" | \"error\";\n  text: string;\n};\n"],"mappings":"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"}

package/dist/genexus-ide-ui/{p-ded7444c.entry.js → p-5da3e999.entry.js}

@@ -1,6 +1,6 @@
 import { r as t, g as e, h as s, H as i, a as o } from "./p-25a9f1d7.js";
 
-import { L as a } from "./p-311eedf3.js";
+import { L as a } from "./p-857866f8.js";
 
 const mapTypesToComboBoxItemModel = t => {
   const e = [];
@@ -29,17 +29,17 @@ var c = undefined && undefined.__classPrivateFieldSet || function(t, e, s, i, o)
   return i === "a" ? o.call(t, s) : o ? o.value = s : e.set(t, s), s;
 };
 
-var h, l, d, f, p, u, b, m, w;
+var h, l, f, d, p, u, b, m, w;
 
 const y = [ "resets/box-sizing", "components/tooltip", "utils/form--full", "utils/layout", "utils/typography", "utils/spacing", "chameleon/scrollbar" ];
 
-const v = class {
+const g = class {
   constructor(i) {
     t(this, i);
     h.set(this, void 0);
     l.set(this, e(`./gx-ide-assets/bpm-sync-gam-roles/shortcuts.json`));
-    d.set(this, []);
-    f.set(this, void 0);
+    f.set(this, []);
+    d.set(this, void 0);
     p.set(this, void 0);
     u.set(this, void 0);
     b.set(this, (() => {
@@ -48,13 +48,12 @@ const v = class {
       }
     }));
     m.set(this, (async () => {
-      var t;
       if (this.saveCallback) {
-        const e = {
-          automaticBackup: !!((t = r(this, f, "f")) === null || t === void 0 ? void 0 : t.value),
+        const t = {
+          automaticBackup: !!r(this, d, "f")?.value,
           syncType: r(this, u, "f").value
         };
-        await this.saveCallback(e);
+        await this.saveCallback(t);
       }
     }));
     w.set(this, (() => s("footer", {
@@ -77,7 +76,7 @@ const v = class {
   }
   async componentWillLoad() {
     c(this, h, await a.getComponentStrings(this.el), "f");
-    c(this, d, mapTypesToComboBoxItemModel(r(this, h, "f").main.synchronizationTypeOptions), "f");
+    c(this, f, mapTypesToComboBoxItemModel(r(this, h, "f").main.synchronizationTypeOptions), "f");
   }
   /**
      * Suspends or reactivates the shortcuts
@@ -109,14 +108,14 @@ const v = class {
       accessibleName: "Synchronization types",
       class: "combo-box",
       id: "synch-type",
-      value: r(this, d, "f")[0].caption,
-      model: r(this, d, "f"),
+      value: r(this, f, "f")[0].caption,
+      model: r(this, f, "f"),
       ref: t => c(this, u, t, "f")
     })), s("ch-checkbox", {
       class: "checkbox",
       caption: r(this, h, "f").main.checkBoxLabel,
       checkedValue: "true",
-      ref: t => c(this, f, t, "f")
+      ref: t => c(this, d, t, "f")
     }))), r(this, w, "f").call(this));
   }
   static get assetsDirs() {
@@ -127,10 +126,10 @@ const v = class {
   }
 };
 
-h = new WeakMap, l = new WeakMap, d = new WeakMap, f = new WeakMap, p = new WeakMap, 
+h = new WeakMap, l = new WeakMap, f = new WeakMap, d = new WeakMap, p = new WeakMap, 
 u = new WeakMap, b = new WeakMap, m = new WeakMap, w = new WeakMap;
 
-v.style = n;
+g.style = n;
 
-export { v as gx_ide_bpm_sync_gam_roles };
-//# sourceMappingURL=p-ded7444c.entry.js.map
+export { g as gx_ide_bpm_sync_gam_roles };
+//# sourceMappingURL=p-5da3e999.entry.js.map

package/dist/genexus-ide-ui/p-5da3e999.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["mapTypesToComboBoxItemModel","synchronizationTypes","syncTypes","forEach","synchronizationType","newSynchType","value","caption","push","bpmSyncGamRolesCss","CSS_BUNDLES","GxIdeBpmSyncGamRoles","_GxIdeBpmSyncGamRoles__componentLocale","set","this","_GxIdeBpmSyncGamRoles_shortcutsSrc","getAssetPath","_GxIdeBpmSyncGamRoles_synchronizationTypes","_GxIdeBpmSyncGamRoles_automaticBackupCheckBoxEl","_GxIdeBpmSyncGamRoles_chShortcutsEl","_GxIdeBpmSyncGamRoles_synchTypeComboBoxEl","_GxIdeBpmSyncGamRoles_cancelButtonHandler","cancelCallback","_GxIdeBpmSyncGamRoles_okButtonHandler","async","saveCallback","syncData","automaticBackup","__classPrivateFieldGet","syncType","_GxIdeBpmSyncGamRoles_renderFooter","h","class","id","onClick","part","footer","cancelButtonText","okButtonText","componentWillLoad","__classPrivateFieldSet","Locale","getComponentStrings","el","main","synchronizationTypeOptions","suspendShortcuts","suspend","render","Host","model","src","ref","htmlFor","synchronizationTypeLabel","accessibleName","checkBoxLabel","checkedValue","call"],"sources":["src/components/bpm/sync-gam-roles/helpers.tsx","src/components/bpm/sync-gam-roles/bpm-sync-gam-roles.scss?tag=gx-ide-bpm-sync-gam-roles&encapsulation=shadow","src/components/bpm/sync-gam-roles/bpm-sync-gam-roles.tsx"],"sourcesContent":["import { ComboBoxItemModel } from \"@genexus/chameleon-controls-library/dist/types/components/combo-box/types\";\n\nexport const mapTypesToComboBoxItemModel = (\n  synchronizationTypes: any[]\n): ComboBoxItemModel[] => {\n  const syncTypes: ComboBoxItemModel[] = [];\n\n  synchronizationTypes.forEach(synchronizationType => {\n    const newSynchType: ComboBoxItemModel = {\n      value: synchronizationType.value,\n      caption: synchronizationType.caption\n    };\n    syncTypes.push(newSynchType);\n  });\n  return syncTypes;\n};\n",":host {\n  display: grid;\n  block-size: 100%;\n  overflow: hidden;\n  grid-template-rows: 1fr max-content;\n}\n","import {\n  Component,\n  Host,\n  h,\n  Element,\n  getAssetPath,\n  Method,\n  Prop\n} from \"@stencil/core\";\nimport { Locale } from \"../../../common/locale\";\nimport { MercuryBundles } from \"@genexus/mercury\";\nimport { ComboBoxItemModel } from \"@genexus/chameleon-controls-library/dist/types/components/combo-box/types\";\nimport { mapTypesToComboBoxItemModel } from \"./helpers\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/tooltip\",\n  \"utils/form--full\",\n  \"utils/layout\",\n  \"utils/typography\",\n  \"utils/spacing\",\n  \"chameleon/scrollbar\"\n];\n\n@Component({\n  tag: \"gx-ide-bpm-sync-gam-roles\",\n  styleUrl: \"bpm-sync-gam-roles.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/bpm-sync-gam-roles\"]\n})\nexport class GxIdeBpmSyncGamRoles {\n  #_componentLocale: any;\n  #shortcutsSrc = getAssetPath(\n    `./gx-ide-assets/bpm-sync-gam-roles/shortcuts.json`\n  );\n  #synchronizationTypes: ComboBoxItemModel[] = [];\n\n  @Element() el: HTMLGxIdeBpmSyncGamRolesElement;\n  #automaticBackupCheckBoxEl: HTMLChCheckboxElement;\n  #chShortcutsEl: HTMLChShortcutsElement;\n  #synchTypeComboBoxEl: HTMLChComboBoxRenderElement;\n\n  async componentWillLoad() {\n    this.#_componentLocale = await Locale.getComponentStrings(this.el);\n    this.#synchronizationTypes = mapTypesToComboBoxItemModel(\n      this.#_componentLocale.main.synchronizationTypeOptions\n    );\n  }\n\n  /**\n   * Callback invoked when the user press the 'Cancel' button\n   */\n  @Prop() readonly cancelCallback: () => Promise<void>;\n\n  /**\n   * Callback invoked when the user press the 'Ok' button\n   */\n  @Prop() readonly saveCallback: (syncData: SyncData) => Promise<boolean>;\n\n  /**\n   * Suspends or reactivates the shortcuts\n   */\n  @Method()\n  async suspendShortcuts(suspendShortcuts: boolean) {\n    if (suspendShortcuts) {\n      this.#chShortcutsEl.suspend = true;\n    } else {\n      this.#chShortcutsEl.suspend = false;\n    }\n  }\n\n  #cancelButtonHandler = () => {\n    if (this.cancelCallback) {\n      this.cancelCallback();\n    }\n  };\n  #okButtonHandler = async () => {\n    if (this.saveCallback) {\n      const syncData: SyncData = {\n        automaticBackup: !!this.#automaticBackupCheckBoxEl?.value,\n        syncType: this.#synchTypeComboBoxEl.value as SyncType\n      };\n\n      await this.saveCallback(syncData);\n    }\n  };\n\n  #renderFooter = () => {\n    return (\n      <footer class=\"control-footer control-footer-with-border spacing-body-block-end spacing-body-inline\">\n        <div class=\"buttons-spacer\">\n          <button\n            class=\"button-secondary\"\n            id=\"button-cancel\"\n            onClick={this.#cancelButtonHandler}\n            part=\"button-cancel\"\n          >\n            {this.#_componentLocale.footer.cancelButtonText}\n          </button>\n          <button\n            class=\"button-primary\"\n            id=\"button-create\"\n            onClick={this.#okButtonHandler}\n            part=\"button-ok\"\n          >\n            {this.#_componentLocale.footer.okButtonText}\n          </button>\n        </div>\n      </footer>\n    );\n  };\n\n  render() {\n    return (\n      <Host class=\"widget\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <ch-shortcuts\n          src={this.#shortcutsSrc}\n          ref={(el: HTMLChShortcutsElement) =>\n            (this.#chShortcutsEl = el as HTMLChShortcutsElement)\n          }\n        ></ch-shortcuts>\n        <section class=\"section spacing-body\">\n          <div class=\"main field-group\">\n            <div class=\"field field-block\">\n              <label class=\"label\" htmlFor=\"synch-type\">\n                {this.#_componentLocale.main.synchronizationTypeLabel}\n              </label>\n              <ch-combo-box-render\n                accessibleName=\"Synchronization types\"\n                class=\"combo-box\"\n                id=\"synch-type\"\n                value={this.#synchronizationTypes[0].caption}\n                model={this.#synchronizationTypes}\n                ref={(el: HTMLChComboBoxRenderElement) =>\n                  (this.#synchTypeComboBoxEl =\n                    el as HTMLChComboBoxRenderElement)\n                }\n              ></ch-combo-box-render>\n            </div>\n\n            <ch-checkbox\n              class=\"checkbox\"\n              caption={this.#_componentLocale.main.checkBoxLabel}\n              checkedValue=\"true\"\n              ref={(el: HTMLChCheckboxElement) =>\n                (this.#automaticBackupCheckBoxEl = el as HTMLChCheckboxElement)\n              }\n            ></ch-checkbox>\n          </div>\n        </section>\n        {this.#renderFooter()}\n      </Host>\n    );\n  }\n}\n\nexport type SyncType = \"From GAM\" | \"To GAM\" | \"Both\";\n\nexport type SyncData = {\n  syncType: SyncType;\n  automaticBackup: boolean;\n};\n"],"mappings":";;;;AAEO,MAAMA,8BACXC;EAEA,MAAMC,IAAiC;EAEvCD,EAAqBE,SAAQC;IAC3B,MAAMC,IAAkC;MACtCC,OAAOF,EAAoBE;MAC3BC,SAASH,EAAoBG;;IAE/BL,EAAUM,KAAKH;AAAa;EAE9B,OAAOH;AAAS;;ACdlB,MAAMO,IAAqB;;;;;;;;;;;;;;;;;ACc3B,MAAMC,IAA8B,EAClC,qBACA,sBACA,oBACA,gBACA,oBACA,iBACA;;MASWC,IAAoB;;;IAC/BC,EAAAC,IAAAC,WAAA;IACAC,EAAAF,IAAAC,MAAgBE,EACd;IAEFC,EAAAJ,IAAAC,MAA6C;IAG7CI,EAAAL,IAAAC,WAAA;IACAK,EAAAN,IAAAC,WAAA;IACAM,EAAAP,IAAAC,WAAA;IA+BAO,EAAAR,IAAAC,OAAuB;MACrB,IAAIA,KAAKQ,gBAAgB;QACvBR,KAAKQ;;;IAGTC,EAAAV,IAAAC,OAAmBU;MACjB,IAAIV,KAAKW,cAAc;QACrB,MAAMC,IAAqB;UACzBC,mBAAmBC,EAAAd,MAAII,GAAA,MAA6BZ;UACpDuB,UAAUD,EAAAd,MAAIM,GAAA,KAAsBd;;cAGhCQ,KAAKW,aAAaC;;;IAI5BI,EAAAjB,IAAAC,OAAgB,MAEZiB,EAAA;MAAQC,OAAM;OACZD,EAAA;MAAKC,OAAM;OACTD,EAAA;MACEC,OAAM;MACNC,IAAG;MACHC,SAASN,EAAAd,MAAIO,GAAA;MACbc,MAAK;OAEJP,EAAAd,MAAIF,GAAA,KAAmBwB,OAAOC,mBAEjCN,EAAA;MACEC,OAAM;MACNC,IAAG;MACHC,SAASN,EAAAd,MAAIS,GAAA;MACbY,MAAK;OAEJP,EAAAd,MAAIF,GAAA,KAAmBwB,OAAOE;;;;EA/DzC,uBAAMC;IACJC,EAAA1B,MAAIF,SAA2B6B,EAAOC,oBAAoB5B,KAAK6B,KAAG;IAClEH,EAAA1B,MAAIG,GAAyBjB,4BAC3B4B,EAAAd,MAAIF,GAAA,KAAmBgC,KAAKC,6BAC7B;;;;SAiBH,sBAAMC,CAAiBA;IACrB,IAAIA,GAAkB;MACpBlB,EAAAd,MAAIK,GAAA,KAAgB4B,UAAU;WACzB;MACLnB,EAAAd,MAAIK,GAAA,KAAgB4B,UAAU;;;EA6ClC,MAAAC;IACE,OACEjB,EAACkB,GAAI;MAACjB,OAAM;OACVD,EAAA;MAAUmB,OAAOxC;QACjBqB,EAAA;MACEoB,KAAKvB,EAAAd,MAAIC,GAAA;MACTqC,KAAMT,KACHH,EAAA1B,MAAIK,GAAkBwB,GAA4B;QAGvDZ,EAAA;MAASC,OAAM;OACbD,EAAA;MAAKC,OAAM;OACTD,EAAA;MAAKC,OAAM;OACTD,EAAA;MAAOC,OAAM;MAAQqB,SAAQ;OAC1BzB,EAAAd,MAAIF,GAAA,KAAmBgC,KAAKU,2BAE/BvB,EAAA;MACEwB,gBAAe;MACfvB,OAAM;MACNC,IAAG;MACH3B,OAAOsB,EAAAd,MAAIG,GAAA,KAAuB,GAAGV;MACrC2C,OAAOtB,EAAAd,MAAIG,GAAA;MACXmC,KAAMT,KACHH,EAAA1B,MAAIM,GACHuB,GAAiC;SAKzCZ,EAAA;MACEC,OAAM;MACNzB,SAASqB,EAAAd,MAAIF,GAAA,KAAmBgC,KAAKY;MACrCC,cAAa;MACbL,KAAMT,KACHH,EAAA1B,MAAII,GAA8ByB,GAA2B;UAKrEf,EAAAd,MAAIgB,GAAA,KAAc4B,KAAlB5C"}

package/dist/genexus-ide-ui/{p-1072bf33.entry.js → p-5e05f830.entry.js}

@@ -1,28 +1,24 @@
 import { r as e, g as t, h as r, H as a, a as o } from "./p-25a9f1d7.js";
 
-import { g as i } from "./p-6e4208d8.js";
+import { g as i } from "./p-ede7bd20.js";
 
-import "./p-5ac47c69.js";
-
-import { L as s } from "./p-311eedf3.js";
+import { L as s } from "./p-857866f8.js";
 
 /**
  * @description This function converts SelectorCategoryData[] SuggestData
- */ const convertToTreeItem = e => {
-  var t;
-  return {
-    caption: e.name,
-    id: e.id,
-    items: ((t = e.items) !== null && t !== void 0 ? t : []).map(convertToTreeItem),
-    lazy: e.hasChildren && (e.items == null || e.items.length === 0),
-    leaf: e.hasChildren === false,
-    startImgSrc: e.icon
-  };
-};
-
+ */ const convertToTreeItem = e => ({
+  caption: e.name,
+  id: e.id,
+  items: (e.items ?? []).map(convertToTreeItem),
+  lazy: e.hasChildren && (e.items == null || e.items.length === 0),
+  leaf: e.hasChildren === false,
+  startImgSrc: e.icon
+})
 /**
  * @description This function converts ReferenceData[] data to TreeItemData[]
- */ const convertReferenceDataToTreeViewData = e => {
+ */;
+
+const convertReferenceDataToTreeViewData = e => {
   const t = [];
   if (!e) {
     return t;
@@ -63,7 +59,7 @@ var c = undefined && undefined.__classPrivateFieldSet || function(e, t, r, a, o)
   return a === "a" ? o.call(e, r) : o ? o.value = r : t.set(e, r), r;
 };
 
-var d, g, f, b, h, v, m, p, u, y, x, w, k, _;
+var d, g, f, b, h, m, v, p, u, y, x, w, k, _;
 
 const z = [ "resets/box-sizing", "components/button", "components/pills", "components/combo-box", "components/icon", "components/checkbox", "components/tree-view", "utils/spacing", "utils/layout", "utils/form", "utils/typography" ];
 
@@ -106,12 +102,12 @@ const C = class {
     }));
     /**
          * Hides or shows the bar (the bottom section of the header).
-         */    v.set(this, (() => {
+         */    m.set(this, (() => {
       this.barHidden = !this.barHidden;
     }));
     /**
          * Invokes 'loadReferencesCallback' for 'Is Referenced By' and 'Has References To' panels.
-         */    m.set(this, (async (e, t = false) => {
+         */    v.set(this, (async (e, t = false) => {
       if (this.loadReferencesCallback) {
         this.loadReferencesCallback(e, t).then((e => {
           if (t) {
@@ -123,9 +119,8 @@ const C = class {
       }
     }));
     p.set(this, (() => {
-      var e;
       // Returns an empty Promise
-            this.openObjectCallback((e = this.selectedObject) === null || e === void 0 ? void 0 : e.id);
+      this.openObjectCallback(this.selectedObject?.id);
     }));
     /**
          * Fired when user clicks the ch-suggest button (...)
@@ -177,7 +172,7 @@ const C = class {
         this.selectorSourceCallback(t).then((e => {
           // update map
           l(this, d, "f").clear();
-          e === null || e === void 0 ? void 0 : e.forEach((e => {
+          e?.forEach((e => {
             e.items.forEach((e => {
               l(this, d, "f").set(e.description, {
                 id: e.id,
@@ -204,10 +199,10 @@ const C = class {
     this.selectedObject = undefined;
   }
   selectedObjectChanged(e) {
-    if (e === null || e === void 0 ? void 0 : e.id) {
+    if (e?.id) {
       /* update "is referenced by*/
-      l(this, m, "f").call(this, e.id, false);
-      /* update "has references to*/      l(this, m, "f").call(this, e.id, true);
+      l(this, v, "f").call(this, e.id, false);
+      /* update "has references to*/      l(this, v, "f").call(this, e.id, true);
     }
   }
   componentDidLoad() {
@@ -218,7 +213,6 @@ const C = class {
     l(this, h, "f").call(this);
   }
   render() {
-    var e, t, o, i, s, n, d, h, m;
     return r(a, {
       class: "widget"
     }, r("ch-theme", {
@@ -234,7 +228,7 @@ const C = class {
       class: "button-tertiary button-icon-only",
       "aria-label": l(this, f, "f").header.toggleBar,
       part: "toggle-bar-button",
-      onClick: l(this, v, "f")
+      onClick: l(this, m, "f")
     }, r("ch-image", {
       class: "icon-md",
       src: M,
@@ -253,7 +247,7 @@ const C = class {
       suggest: true,
       onInput: l(this, _, "f"),
       onChange: l(this, k, "f"),
-      value: (e = this.selectedObject) === null || e === void 0 ? void 0 : e.name,
+      value: this.selectedObject?.name,
       part: "object-selector-suggest",
       suggestOptions: W,
       ref: e => c(this, b, e, "f")
@@ -287,7 +281,7 @@ const C = class {
       onClick: l(this, p, "f"),
       part: "open-object-text-link",
       "aria-label": l(this, f, "f").main.selectedObjectLink
-    }, `${(t = this.selectedObject) === null || t === void 0 ? void 0 : t.name} : ${(o = this.selectedObject) === null || o === void 0 ? void 0 : o.description}`)))))), r("div", {
+    }, `${this.selectedObject?.name} : ${this.selectedObject?.description}`)))))), r("div", {
       class: "main"
     }, r("section", {
       class: "section__referenced-by"
@@ -298,7 +292,7 @@ const C = class {
       class: "main__referenced-by spacing-body-block-start spacing-body-block-end"
     }, r("ch-tree-view-render", {
       class: {
-        "gxi-hidden": !((i = this.referencedByTreeData) === null || i === void 0 ? void 0 : i.length),
+        "gxi-hidden": !this.referencedByTreeData?.length,
         "tree-view": true
       },
       part: "referenced-by-tree",
@@ -310,8 +304,8 @@ const C = class {
       dropDisabled: true,
       onItemOpenReference: l(this, x, "f"),
       showLines: "last"
-    }), !((s = this.referencedByTreeData) === null || s === void 0 ? void 0 : s.length) && r("gx-ide-empty-state", {
-      stateTitle: ((n = this.referencedByTreeData) === null || n === void 0 ? void 0 : n.length) === 0 ? l(this, f, "f").main.isReferencedByEmpty : l(this, f, "f").main.isReferencedByError
+    }), !this.referencedByTreeData?.length && r("gx-ide-empty-state", {
+      stateTitle: this.referencedByTreeData?.length === 0 ? l(this, f, "f").main.isReferencedByEmpty : l(this, f, "f").main.isReferencedByError
     }))), r("section", {
       class: "section__references-to"
     }, r("h2", {
@@ -321,7 +315,7 @@ const C = class {
       class: "main__references-to spacing-body-block-start spacing-body-block-end"
     }, r("ch-tree-view-render", {
       class: {
-        "gxi-hidden": !((d = this.referencesToTreeData) === null || d === void 0 ? void 0 : d.length),
+        "gxi-hidden": !this.referencesToTreeData?.length,
         "tree-view": true
       },
       part: "referenced-to-tree",
@@ -333,8 +327,8 @@ const C = class {
       dropDisabled: true,
       onItemOpenReference: l(this, x, "f"),
       showLines: "last"
-    }), !((h = this.referencesToTreeData) === null || h === void 0 ? void 0 : h.length) && r("gx-ide-empty-state", {
-      stateTitle: ((m = this.referencesToTreeData) === null || m === void 0 ? void 0 : m.length) === 0 ? l(this, f, "f").main.hasReferencesEmpty : l(this, f, "f").main.hasReferencesToError
+    }), !this.referencesToTreeData?.length && r("gx-ide-empty-state", {
+      stateTitle: this.referencesToTreeData?.length === 0 ? l(this, f, "f").main.hasReferencesEmpty : l(this, f, "f").main.hasReferencesToError
     }))))), r("ch-shortcuts", {
       src: l(this, g, "f")
     }));
@@ -353,10 +347,10 @@ const C = class {
 };
 
 d = new WeakMap, g = new WeakMap, f = new WeakMap, b = new WeakMap, h = new WeakMap, 
-v = new WeakMap, m = new WeakMap, p = new WeakMap, u = new WeakMap, y = new WeakMap, 
+m = new WeakMap, v = new WeakMap, p = new WeakMap, u = new WeakMap, y = new WeakMap, 
 x = new WeakMap, w = new WeakMap, k = new WeakMap, _ = new WeakMap;
 
 C.style = n;
 
 export { C as gx_ide_references };
-//# sourceMappingURL=p-1072bf33.entry.js.map
+//# sourceMappingURL=p-5e05f830.entry.js.map

package/dist/genexus-ide-ui/p-5e05f830.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["convertToTreeItem","item","caption","name","id","items","map","lazy","hasChildren","length","leaf","startImgSrc","icon","convertReferenceDataToTreeViewData","referenceData","treeData","forEach","push","mapSelectorCategoryDataToComboBoxModel","categoryData","category","mappedGroup","value","expandable","expanded","description","referencesCss","CSS_BUNDLES","GEMINI_TOOLS_SHOW_MORE_HORIZONTAL","getIconPath","colorType","NAVIGATION_ARROW_DOWN_SKY_BLUE","SUGGEST_OPTIONS","alreadyProcessed","autoExpand","hideMatchesAndShowNonMatches","highlightMatchedItems","matchCase","regularExpression","strict","renderActiveItemIconOnExpand","GxIdeReferences","_GxIdeReferences_objectDataMap","set","this","Map","_GxIdeReferences_shortcutsSrc","getAssetPath","_GxIdeReferences__componentLocale","_GxIdeReferences_selectObjectSuggestEl","_GxIdeReferences_evaluateInitialReferenceData","selectedObject","selectedObjectChanged","_GxIdeReferences_hideBarButtonClickedHandler","barHidden","_GxIdeReferences_loadReferencesHandler","async","to","loadReferencesCallback","then","result","referencesToTreeData","referencedByTreeData","_GxIdeReferences_openObjectCallbackHandler","openObjectCallback","_GxIdeReferences_openSelectorDialogCallbackHandler","objectDataResult","openSelectorDialogCallback","_GxIdeReferences_referenceSelectedHandler","event","selectReferenceCallback","selectedItems","detail","_GxIdeReferences_referencesItemOpenReferenceCallback","itemOpened","itemId","_GxIdeReferences_referencesLazyLoadCallbackHandler","ref","treeItemId","referencesLazyChildren","treeLazyChildren","Promise","resolve","_GxIdeReferences_selectObjectChangedHandler","newSelectedValue","objectData","__classPrivateFieldGet","get","_GxIdeReferences_selectObjectInputHandler","typedValue","selectorSourceCallback","selectorCategoryDataArray","clear","selectorCategoryData","typeName","objectsSuggestions","newSelectedObject","call","componentDidLoad","focus","componentWillLoad","__classPrivateFieldSet","Locale","getComponentStrings","el","render","h","Host","class","model","type","header","toggleBar","part","onClick","src","containerRef","htmlFor","selectObject","accessibleName","suggest","onInput","onChange","suggestOptions","openSelectorButton","header__bottom","main","selectedObjectLink","isReferencedBy","referencedByTreeAccessible","lazyLoadTreeItemsCallback","onSelectedItemsChange","dragDisabled","dropDisabled","onItemOpenReference","showLines","stateTitle","isReferencedByEmpty","isReferencedByError","hasReferencesTo","referencesToTreeAccessible","hasReferencesEmpty","hasReferencesToError"],"sources":["src/components/references/helpers.ts","src/components/references/references.scss?tag=gx-ide-references&encapsulation=shadow","src/components/references/references.tsx"],"sourcesContent":["/* Tree View */\nimport {\n  ComboBoxModel,\n  TreeViewItemModel\n} from \"@genexus/chameleon-controls-library\";\n\n/* References Types*/\nimport { ObjectData, SelectorCategoryData } from \"./references\";\nimport { ReferenceData } from \"./references\";\nimport { ComboBoxItemModel } from \"@genexus/chameleon-controls-library/dist/types/components/combo-box/types\";\n\n/**\n * @description This function converts SelectorCategoryData[] SuggestData\n */\n\nconst convertToTreeItem = (item: ReferenceData): TreeViewItemModel => ({\n  caption: item.name,\n  id: item.id,\n  items: (item.items ?? []).map(convertToTreeItem),\n  lazy: item.hasChildren && (item.items == null || item.items.length === 0),\n  leaf: item.hasChildren === false,\n  startImgSrc: item.icon\n});\n\n/**\n * @description This function converts ReferenceData[] data to TreeItemData[]\n */\nexport const convertReferenceDataToTreeViewData = (\n  referenceData: ReferenceData[] | undefined\n): TreeViewItemModel[] => {\n  const treeData: TreeViewItemModel[] = [];\n  if (!referenceData) {\n    return treeData;\n  }\n\n  referenceData.forEach(item => {\n    treeData.push(convertToTreeItem(item));\n  });\n  return treeData;\n};\n\nexport const mapObjectDataToComboBoxItemModel = (\n  options: ObjectData[]\n): ComboBoxModel => {\n  return options.map(option => {\n    return {\n      value: option.id,\n      caption: option.name,\n      startImgSrc: option.icon ?? \"\"\n    };\n  });\n};\n\nexport const mapSelectorCategoryDataToComboBoxModel = (\n  categoryData: SelectorCategoryData[]\n): ComboBoxModel => {\n  return categoryData.map((category: SelectorCategoryData) => {\n    const mappedGroup: ComboBoxItemModel = {\n      value: category.name,\n      caption: category.name,\n      expandable: true,\n      expanded: true,\n      items: category.items.map((item: ObjectData) => ({\n        value: item.id,\n        caption: item.description,\n        startImgSrc: item.icon\n      }))\n    };\n\n    return mappedGroup;\n  });\n};\n","@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n  display: grid;\n  block-size: 100%;\n  grid-template-rows: max-content 1fr;\n}\n.section {\n  display: contents;\n}\n\n.header {\n  /*Top*/\n  &__top {\n    grid-template-columns: max-content 1fr max-content;\n  }\n  /*Bottom*/\n  &__bottom {\n    display: grid;\n    grid-template-rows: 1fr;\n    transition: var(--mer-timing--fast) grid-template-rows;\n    &--hidden {\n      grid-template-rows: 0fr;\n    }\n\n    .outer-wrapper {\n      overflow: hidden;\n    }\n\n    .inner-wrapper {\n      padding-top: var(--content-block-spacing);\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      justify-content: space-between;\n\n      &__left {\n        display: flex;\n        align-items: center;\n        gap: var(--gx-ide-grid-row-gap);\n      }\n    }\n  }\n}\n\n.main {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n}\n.section__referenced-by,\n.section__references-to {\n  display: grid;\n  grid-template-rows: max-content 1fr;\n}\n.control-header__referenced-by,\n.control-header__references-to {\n  padding-block-start: var(--mer-spacing--md);\n}\n.main__referenced-by,\n.main__references-to {\n  grid-auto-rows: max-content;\n  overflow: auto;\n}\n.main__referenced-by {\n  border-inline-end: var(--section-common-border);\n}\n\n.text-align-center {\n  text-align: center;\n}\n","/* eslint-disable @stencil-community/own-props-must-be-private */\n/* STENCIL IMPORTS */\nimport {\n  Component,\n  Element,\n  getAssetPath,\n  Host,\n  h,\n  Prop,\n  State,\n  Watch\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { getIconPath, MercuryBundles } from \"@genexus/mercury\";\nimport {\n  ChComboBoxRenderCustomEvent,\n  ComboBoxModel,\n  TreeViewItemModel,\n  TreeViewItemModelExtended\n} from \"@genexus/chameleon-controls-library\";\n/* CUSTOM IMPORTS */\nimport { Locale } from \"../../common/locale\";\nimport {\n  convertReferenceDataToTreeViewData,\n  mapSelectorCategoryDataToComboBoxModel\n} from \"./helpers\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/button\",\n  \"components/pills\",\n  \"components/combo-box\",\n  \"components/icon\",\n  \"components/checkbox\",\n  \"components/tree-view\",\n  \"utils/spacing\",\n  \"utils/layout\",\n  \"utils/form\",\n  \"utils/typography\"\n];\n\nconst GEMINI_TOOLS_SHOW_MORE_HORIZONTAL = getIconPath({\n  category: \"gemini-tools\",\n  name: \"show-more-horizontal\",\n  colorType: \"primary\"\n});\nconst NAVIGATION_ARROW_DOWN_SKY_BLUE = getIconPath({\n  category: \"navigation\",\n  name: \"arrow-down-skyblue\",\n  colorType: \"primary\"\n});\n\nconst SUGGEST_OPTIONS = {\n  alreadyProcessed: true,\n  autoExpand: false,\n  hideMatchesAndShowNonMatches: false,\n  highlightMatchedItems: false,\n  matchCase: false,\n  regularExpression: false,\n  strict: false,\n  renderActiveItemIconOnExpand: true\n};\n\n@Component({\n  tag: \"gx-ide-references\",\n  styleUrl: \"references.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/references\"]\n})\nexport class GxIdeReferences {\n  #objectDataMap: objectDataMap = new Map();\n  #shortcutsSrc = getAssetPath(`./gx-ide-assets/references/shortcuts.json`);\n  #_componentLocale: any;\n\n  @Element() el: HTMLGxIdeReferencesElement;\n  #selectObjectSuggestEl!: HTMLChComboBoxRenderElement;\n\n  /**\n   * Displays or hides the header-bottom section\n   */\n  @State() barHidden = false;\n\n  /**\n   * Objects suggestions that will appear on the suggest\n   */\n  @State() objectsSuggestions: ComboBoxModel;\n\n  @State() referencedByTreeData: TreeViewItemModel[];\n\n  @State() referencesToTreeData: TreeViewItemModel[];\n\n  /**\n   * Callback invoked when a node is expanded in any references panels\n   */\n  @Prop() readonly loadReferencesCallback?: LoadReferencesCallback;\n\n  /**\n   * Callback invoked when user wants to open an object\n   */\n  @Prop() readonly openObjectCallback?: OpenObjectCallback;\n\n  /**\n   * Callback invoked when user wants to show object selection dialog\n   */\n  @Prop() readonly openSelectorDialogCallback?: OpenSelectorDialogCallback;\n\n  /**\n   * Callback invoked when any item from the references panels is selected\n   */\n  @Prop() readonly selectReferenceCallback?: SelectReferenceCallback;\n\n  /**\n   * Callback invoked when user writes on object selector input\n   */\n  @Prop() readonly selectorSourceCallback?: SelectorSourceCallback;\n\n  /**\n   * Currently selected object\n   */\n  @Prop({ mutable: true }) selectedObject?: ObjectData;\n\n  @Watch(\"selectedObject\")\n  selectedObjectChanged(newSelectedObject: ObjectData) {\n    if (newSelectedObject?.id) {\n      /* update \"is referenced by*/\n      this.#loadReferencesHandler(newSelectedObject.id, false);\n      /* update \"has references to*/\n      this.#loadReferencesHandler(newSelectedObject.id, true);\n    }\n  }\n\n  componentDidLoad() {\n    this.#selectObjectSuggestEl.focus();\n  }\n\n  async componentWillLoad() {\n    this.#_componentLocale = await Locale.getComponentStrings(this.el);\n    this.#evaluateInitialReferenceData();\n  }\n\n  /**\n   * Evaluates whether to call loadReferencesCallback based on the presence of a selected object.\n   */\n  #evaluateInitialReferenceData = () => {\n    if (this.selectedObject) {\n      this.selectedObjectChanged(this.selectedObject);\n    }\n  };\n\n  /**\n   * Hides or shows the bar (the bottom section of the header).\n   */\n  #hideBarButtonClickedHandler = () => {\n    this.barHidden = !this.barHidden;\n  };\n\n  /**\n   * Invokes 'loadReferencesCallback' for 'Is Referenced By' and 'Has References To' panels.\n   */\n  #loadReferencesHandler = async (id: string, to = false) => {\n    if (this.loadReferencesCallback) {\n      this.loadReferencesCallback(id, to).then(result => {\n        if (to) {\n          this.referencesToTreeData =\n            convertReferenceDataToTreeViewData(result);\n        } else {\n          this.referencedByTreeData =\n            convertReferenceDataToTreeViewData(result);\n        }\n      });\n    }\n  };\n\n  #openObjectCallbackHandler = () => {\n    // Returns an empty Promise\n    this.openObjectCallback(this.selectedObject?.id);\n  };\n\n  /**\n   * Fired when user clicks the ch-suggest button (...)\n   */\n  #openSelectorDialogCallbackHandler = async () => {\n    const objectDataResult = await this.openSelectorDialogCallback();\n    if (objectDataResult) {\n      this.selectedObject = objectDataResult;\n    }\n  };\n\n  #referenceSelectedHandler = (\n    event: CustomEvent<TreeViewItemModelExtended[]>\n  ) => {\n    if (this.selectReferenceCallback) {\n      const selectedItems: string[] = event.detail.map(item => item.item.id);\n      this.selectReferenceCallback(selectedItems[0]);\n      // returns void\n    }\n  };\n\n  #referencesItemOpenReferenceCallback = (\n    itemOpened: CustomEvent<{ id: string; leaf: boolean; metadata: string }>\n  ) => {\n    const itemId = itemOpened.detail.id;\n    if (this.openObjectCallback) {\n      this.openObjectCallback(itemId);\n      // returns void\n    }\n  };\n\n  #referencesLazyLoadCallbackHandler =\n    (ref: \"references-to\" | \"referenced-by\") =>\n    async (treeItemId: string): Promise<TreeViewItemModel[]> => {\n      if (this.loadReferencesCallback) {\n        const to = ref === \"references-to\";\n        const referencesLazyChildren = await this.loadReferencesCallback(\n          treeItemId,\n          to\n        );\n        const treeLazyChildren = convertReferenceDataToTreeViewData(\n          referencesLazyChildren\n        );\n        return new Promise(resolve => {\n          resolve(treeLazyChildren);\n        });\n      }\n      return new Promise(resolve => {\n        resolve([]);\n      });\n    };\n\n  #selectObjectChangedHandler = (\n    event: ChComboBoxRenderCustomEvent<string> | InputEvent\n  ) => {\n    const newSelectedValue = event.detail as string;\n\n    const objectData = this.#objectDataMap.get(newSelectedValue);\n    if (objectData) {\n      this.selectedObject = objectData;\n    }\n  };\n\n  #selectObjectInputHandler = (\n    event: ChComboBoxRenderCustomEvent<string> | InputEvent\n  ) => {\n    // WA to know if the event was from searching on the input or an item selection.\n    // const partValue = (e.target as HTMLElement).getAttribute(\"part\");\n    const typedValue = event.detail as string;\n    if (this.selectorSourceCallback) {\n      this.selectorSourceCallback(typedValue).then(\n        selectorCategoryDataArray => {\n          // update map\n          this.#objectDataMap.clear();\n          selectorCategoryDataArray?.forEach(selectorCategoryData => {\n            selectorCategoryData.items.forEach(objectData => {\n              this.#objectDataMap.set(objectData.description, {\n                id: objectData.id,\n                typeName: objectData.typeName,\n                icon: objectData.icon,\n                name: objectData.name,\n                description: objectData.description\n              });\n            });\n          });\n\n          this.objectsSuggestions = mapSelectorCategoryDataToComboBoxModel(\n            selectorCategoryDataArray\n          );\n        }\n      );\n    }\n  };\n\n  render() {\n    return (\n      <Host class=\"widget\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n\n        <section class=\"section\">\n          <header class=\"header control-header-with-border spacing-body-inline spacing-body-block-start\">\n            <div class=\"header__top field-group\">\n              <button\n                type=\"button\"\n                class=\"button-tertiary button-icon-only\"\n                aria-label={this.#_componentLocale.header.toggleBar}\n                part=\"toggle-bar-button\"\n                onClick={this.#hideBarButtonClickedHandler}\n              >\n                <ch-image\n                  class=\"icon-md\"\n                  src={NAVIGATION_ARROW_DOWN_SKY_BLUE}\n                  containerRef={this.el}\n                ></ch-image>\n              </button>\n\n              <div class=\"field field-inline\">\n                <label\n                  // select object\n                  class=\"label\"\n                  part=\"select-object-label\"\n                  htmlFor=\"object-selector-suggest\"\n                >\n                  {this.#_componentLocale.header.selectObject}\n                </label>\n                <ch-combo-box-render\n                  accessibleName={this.#_componentLocale.header.selectObject}\n                  class=\"combo-box\"\n                  model={this.objectsSuggestions}\n                  suggest\n                  onInput={this.#selectObjectInputHandler}\n                  onChange={this.#selectObjectChangedHandler}\n                  value={this.selectedObject?.name}\n                  part=\"object-selector-suggest\"\n                  suggestOptions={SUGGEST_OPTIONS}\n                  ref={el =>\n                    (this.#selectObjectSuggestEl =\n                      el as HTMLChComboBoxRenderElement)\n                  }\n                ></ch-combo-box-render>\n              </div>\n\n              <button\n                type=\"button\"\n                class=\"button-tertiary button-icon-only\"\n                aria-label={this.#_componentLocale.header.openSelectorButton}\n                onClick={this.#openSelectorDialogCallbackHandler}\n                part=\"open-selector-dialog-button\"\n              >\n                <ch-image\n                  class=\"icon-md\"\n                  src={GEMINI_TOOLS_SHOW_MORE_HORIZONTAL}\n                  containerRef={this.el}\n                ></ch-image>\n              </button>\n            </div>\n\n            <div\n              class={{\n                \"header__bottom\": true,\n                \"header__bottom--hidden\": this.barHidden\n              }}\n            >\n              <div class=\"outer-wrapper\">\n                <div class=\"inner-wrapper\">\n                  <div class=\"inner-wrapper__left\">\n                    <ch-image\n                      class=\"icon-md\"\n                      src={this.selectedObject.icon}\n                      containerRef={this.el}\n                    ></ch-image>\n                    <a\n                      class=\"text-link\"\n                      onClick={this.#openObjectCallbackHandler}\n                      part=\"open-object-text-link\"\n                      aria-label={\n                        this.#_componentLocale.main.selectedObjectLink\n                      }\n                    >\n                      {`${this.selectedObject?.name} : ${this.selectedObject?.description}`}\n                    </a>\n                  </div>\n                  {/* <div class=\"inner-wrapper__right\">\n                    TODO: Add this feature \"Group References by Type\".\n                    <ch-checkbox\n                      class=\"checkbox\"\n                      id=\"references-by-type\"\n                      part=\"references-type-checkbox\"\n                      checkedValue=\"referencesByType\"\n                      caption=\"Group references by type\"\n                    ></ch-checkbox>\n                  </div> */}\n                </div>\n              </div>\n            </div>\n          </header>\n          <div class=\"main\">\n            <section class=\"section__referenced-by\">\n              <h2 class=\"control-header control-header-with-border control-header__referenced-by heading-5 text-align-center spacing-body-inline\">\n                {this.#_componentLocale.main.isReferencedBy}\n              </h2>\n\n              <div\n                // is referenced by\n                class=\"main__referenced-by spacing-body-block-start spacing-body-block-end\"\n              >\n                <ch-tree-view-render\n                  class={{\n                    \"gxi-hidden\": !this.referencedByTreeData?.length,\n                    \"tree-view\": true\n                  }}\n                  part=\"referenced-by-tree\"\n                  model={this.referencedByTreeData}\n                  aria-label={\n                    this.#_componentLocale.main.referencedByTreeAccessible\n                  }\n                  lazyLoadTreeItemsCallback={this.#referencesLazyLoadCallbackHandler(\n                    \"referenced-by\"\n                  )}\n                  onSelectedItemsChange={this.#referenceSelectedHandler}\n                  dragDisabled={true}\n                  dropDisabled={true}\n                  onItemOpenReference={\n                    this.#referencesItemOpenReferenceCallback\n                  }\n                  showLines=\"last\"\n                ></ch-tree-view-render>\n                {!this.referencedByTreeData?.length && (\n                  <gx-ide-empty-state\n                    stateTitle={\n                      this.referencedByTreeData?.length === 0\n                        ? this.#_componentLocale.main.isReferencedByEmpty\n                        : this.#_componentLocale.main.isReferencedByError\n                    }\n                  ></gx-ide-empty-state>\n                )}\n              </div>\n            </section>\n\n            <section class=\"section__references-to\">\n              <h2 class=\"control-header control-header-with-border control-header__references-to heading-5 text-align-center spacing-body-inline\">\n                {this.#_componentLocale.main.hasReferencesTo}\n              </h2>\n\n              <div\n                // has references to\n                class=\"main__references-to spacing-body-block-start spacing-body-block-end\"\n              >\n                <ch-tree-view-render\n                  class={{\n                    \"gxi-hidden\": !this.referencesToTreeData?.length,\n                    \"tree-view\": true\n                  }}\n                  part=\"referenced-to-tree\"\n                  model={this.referencesToTreeData}\n                  aria-label={\n                    this.#_componentLocale.main.referencesToTreeAccessible\n                  }\n                  lazyLoadTreeItemsCallback={this.#referencesLazyLoadCallbackHandler(\n                    \"references-to\"\n                  )}\n                  onSelectedItemsChange={this.#referenceSelectedHandler}\n                  dragDisabled={true}\n                  dropDisabled={true}\n                  onItemOpenReference={\n                    this.#referencesItemOpenReferenceCallback\n                  }\n                  showLines=\"last\"\n                ></ch-tree-view-render>\n                {!this.referencesToTreeData?.length && (\n                  <gx-ide-empty-state\n                    stateTitle={\n                      this.referencesToTreeData?.length === 0\n                        ? this.#_componentLocale.main.hasReferencesEmpty\n                        : this.#_componentLocale.main.hasReferencesToError\n                    }\n                  ></gx-ide-empty-state>\n                )}\n              </div>\n            </section>\n          </div>\n        </section>\n\n        <ch-shortcuts src={this.#shortcutsSrc}></ch-shortcuts>\n      </Host>\n    );\n  }\n}\n\nexport type LoadReferencesCallback = (\n  id: string,\n  to: boolean\n) => Promise<ReferenceData[]>;\n\nexport type ObjectData = {\n  id: string;\n  typeName: string;\n  icon: string;\n  name: string;\n  description?: string;\n};\n\nexport type OpenObjectCallback = (id: string) => Promise<void>;\n\nexport type OpenSelectorDialogCallback = () => Promise<ObjectData | undefined>;\n\nexport type ReferenceData = ObjectData & {\n  hasChildren: boolean;\n  items?: ReferenceData[];\n};\n\nexport type SelectReferenceCallback = (id: string) => Promise<void>;\n\nexport type SelectorCategoryData = {\n  name: string;\n  items: ObjectData[];\n};\n\nexport type SelectorSourceCallback = (\n  prefix: string\n) => Promise<SelectorCategoryData[]>;\n\nexport type objectDataMap = Map<string, ObjectData>;\n"],"mappings":"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"}