@genexus/genexus-ide-ui 1.0.45 → 1.0.47

package/dist/genexus-ide-ui/{p-64e09524.entry.js → p-64e05f19.entry.js}

@@ -1,16 +1,16 @@
 import { r as t, a as e, h as i, H as s, g as n } from "./p-49712340.js";
 
-import { c as a } from "./p-78b90603.js";
+import { c as a } from "./p-13738332.js";
 
 import { L as o } from "./p-311eedf3.js";
 
 import { r, m as h } from "./p-960c4988.js";
 
-import { g as d } from "./p-d1cb5507.js";
+import { g as l } from "./p-d1cb5507.js";
 
 import { v as c } from "./p-289c3290.js";
 
-import { r as l } from "./p-1252519a.js";
+import { r as d } from "./p-1252519a.js";
 
 const f = ':host{display:grid;block-size:100%;grid-template-rows:max-content 1fr max-content}.section{display:contents}.basic,.advanced{padding-block-start:var(--mer-spacing--md);block-size:100%;overflow:auto}.advanced{padding-block-end:var(--content-block-spacing)}.basic{display:grid;grid-template:"runtime-environment runtime-environment" max-content "back-end front-end" 1fr;grid-template-columns:1fr 1fr}.basic__runtime-environment{grid-area:runtime-environment;display:flex;flex-direction:column;align-items:center;gap:var(--mer-spacing--xs)}.basic__runtime-environment.one-runtime-only{align-items:center;flex-direction:row;justify-content:center}.control-header__back-end,.control-header__front-end{padding-block-start:var(--mer-spacing--md)}.basic__back-end{grid-area:back-end}.basic__front-end{grid-area:front-end}.basic__back-end,.basic__front-end{display:grid;grid-template-rows:max-content 1fr;grid-auto-rows:max-content;overflow:auto}.main__back-end{border-inline-end:var(--section-common-border)}.main__back-end,.main__front-end{grid-auto-rows:max-content;padding-block:var(--content-block-spacing);overflow:auto}.text-align-center{text-align:center}.tab::part(page){scrollbar-width:thin}';
 
@@ -27,7 +27,7 @@ var p = undefined && undefined.__classPrivateFieldSet || function(t, e, i, s, n)
   return s === "a" ? n.call(t, i) : n ? n.value = i : e.set(t, i), i;
 };
 
-var b, m, v, g, w, k, _, y, M, W, x, C, j, E, S, I, T, z, F, L, P, A, D, H, R, V, q, B, G, J;
+var b, m, v, g, w, k, _, y, x, M, W, C, j, E, S, I, T, z, F, L, P, A, D, H, R, V, q, B, G, J;
 
 const K = [ 
 // TODO: review if "utils/form--full" is required.
@@ -57,20 +57,20 @@ const X = class {
     k.set(this, void 0);
     _.set(this, void 0);
     y.set(this, e(`./gx-ide-assets/new-environment/shortcuts.json`));
-    M.set(this, []);
+    x.set(this, []);
     /**
          * The component hard-coded strings translations.
          */
     // eslint-disable-next-line @stencil-community/own-props-must-be-private
-        W.set(this, void 0);
+        M.set(this, void 0);
     // References needed to collect data con "createCallback" button submit*/
-        x.set(this, void 0);
+        W.set(this, void 0);
     C.set(this, void 0);
     j.set(this, void 0);
     E.set(this, void 0);
     S.set(this, (() => {
       /* the data store item id is used for the value (they are equal)*/
-      p(this, w, u(this, x, "f").value, "f");
+      p(this, w, u(this, W, "f").value, "f");
       u(this, q, "f").call(this);
     }));
     I.set(this, (t => {
@@ -95,7 +95,7 @@ const X = class {
     }));
     F.set(this, (() => {
       // populate #controlsValidation with the controls that could have errors.
-      const t = [ u(this, x, "f"), u(this, j, "f") ];
+      const t = [ u(this, W, "f"), u(this, j, "f") ];
       t.forEach((t => {
         if (t.id) {
           this.validatableControls.set(t.id, {
@@ -123,20 +123,20 @@ const X = class {
       }
     }, this.runtimes.length > 1 ? [ i("h2", {
       // Runtime Environment
-      class: "heading-5 text-align-center"
-    }, u(this, W, "f").runtime), i("ch-radio-group-render", {
+      class: "subtitle-regular-xs\t text-align-center"
+    }, u(this, M, "f").runtime), i("ch-radio-group-render", {
       class: "radio-group",
       onChange: u(this, D, "f"),
       model: this.runtimesRadioGroupModel,
       value: u(this, _, "f")
     }) ] : [ i("h2", {
-      class: "heading-5 text-align-center"
-    }, u(this, W, "f").runtime, ":"), i("p", null, this.runtimesRadioGroupModel[0].caption) ]), i("section", {
+      class: "subtitle-regular-xs\t text-align-center"
+    }, u(this, M, "f").runtime, ":"), i("p", null, this.runtimesRadioGroupModel[0].caption) ]), i("section", {
       class: "basic__back-end scrollable"
     }, i("h2", {
       // back end
-      class: "control-header control-header-with-border control-header__back-end heading-5 text-align-center spacing-body-inline"
-    }, u(this, W, "f").tabBasic.backEnd.backEndLabel), i("div", {
+      class: "control-header control-header-with-border control-header__back-end subtitle-regular-xs\t text-align-center spacing-body-inline"
+    }, u(this, M, "f").tabBasic.backEnd.backEndLabel), i("div", {
       class: "field-group main__back-end spacing-body-inline scrollable"
     }, i("div", {
       // #language
@@ -144,7 +144,7 @@ const X = class {
     }, i("label", {
       class: "label",
       htmlFor: "language"
-    }, u(this, W, "f").tabBasic.backEnd.language), i("ch-combo-box-render", {
+    }, u(this, M, "f").tabBasic.backEnd.language), i("ch-combo-box-render", {
       id: "language",
       class: "combo-box",
       part: "language",
@@ -159,23 +159,23 @@ const X = class {
     }, i("label", {
       class: "label",
       htmlFor: "data-store"
-    }, u(this, W, "f").tabBasic.backEnd.dataStores), i("ch-combo-box-render", {
+    }, u(this, M, "f").tabBasic.backEnd.dataStores), i("ch-combo-box-render", {
       id: "data-store",
       class: "combo-box",
       part: "data-store",
       value: u(this, w, "f"),
       model: this.dataStoresComboBoxModel,
       onInput: u(this, S, "f"),
-      ref: t => p(this, x, t, "f")
-    }), u(this, z, "f").call(this, u(this, x, "f"))))), i("section", {
+      ref: t => p(this, W, t, "f")
+    }), u(this, z, "f").call(this, u(this, W, "f"))))), i("section", {
       class: "basic__front-end scrollable"
     }, i("h2", {
       // front end
-      class: "control-header control-header-with-border control-header__front-end heading-5 text-align-center spacing-body-inline"
-    }, u(this, W, "f").tabBasic.frontEnd.frontEndLabel), i("div", {
+      class: "control-header control-header-with-border control-header__front-end subtitle-regular-xs\t text-align-center spacing-body-inline"
+    }, u(this, M, "f").tabBasic.frontEnd.frontEndLabel), i("div", {
       class: "field-group front-end__checkboxes spacing-body-inline main__front-end scrollable",
       role: "group",
-      "aria-labelledby": u(this, W, "f").tabBasic.frontEnd.generators
+      "aria-labelledby": u(this, M, "f").tabBasic.frontEnd.generators
     }, r(this.frontEnds, u(this, G, "f"), u(this, g, "f").get(u(this, k, "f"))))) ]));
     D.set(this, (async t => {
       p(this, _, t.detail, "f");
@@ -190,7 +190,7 @@ const X = class {
         name: u(this, C, "f").value,
         runtime: u(this, _, "f"),
         language: u(this, j, "f").value,
-        dataStores: u(this, x, "f").value,
+        dataStores: u(this, W, "f").value,
         frontEnds: i
       }).then((t => {
         this.validatableControls = c(t, this.validatableControls);
@@ -243,7 +243,7 @@ const X = class {
       } else {
         // update by removing
         const e = i.findIndex((e => e === t));
-        l(i, e);
+        d(i, e);
       }
     }));
     this.advancedTabIsVisible = false;
@@ -267,13 +267,13 @@ const X = class {
   dataStoresChanged(t) {
     if (t === null || t === void 0 ? void 0 : t.length) {
       this.dataStoresComboBoxModel = h(t);
-      p(this, w, d(t), "f");
+      p(this, w, l(t), "f");
     }
   }
   languagesChanged(t) {
     if (t === null || t === void 0 ? void 0 : t.length) {
       this.languageComboBoxModel = h(t);
-      p(this, k, d(t), "f");
+      p(this, k, l(t), "f");
       u(this, B, "f").call(this);
     }
   }
@@ -297,13 +297,13 @@ const X = class {
     }
   }
   async componentWillLoad() {
-    p(this, W, await o.getComponentStrings(this.el), "f");
-    p(this, M, [ {
+    p(this, M, await o.getComponentStrings(this.el), "f");
+    p(this, x, [ {
       id: Q,
-      name: u(this, W, "f").tabBasic.tabLabel
+      name: u(this, M, "f").tabBasic.tabLabel
     }, {
       id: U,
-      name: u(this, W, "f").tabAdvanced.tabLabel
+      name: u(this, M, "f").tabAdvanced.tabLabel
     } ], "f");
     u(this, T, "f").call(this);
   }
@@ -340,14 +340,14 @@ const X = class {
     }, i("label", {
       class: "label",
       htmlFor: "environment-name"
-    }, u(this, W, "f").name), i("ch-edit", {
+    }, u(this, M, "f").name), i("ch-edit", {
       // environment name
       autoFocus: true,
       id: "environment-name",
       class: "input",
       part: "environment-name",
       value: this.environmentName,
-      placeholder: u(this, W, "f").environmentNamePlaceholder,
+      placeholder: u(this, M, "f").environmentNamePlaceholder,
       // TODO: toolTip={config.tooltip}
       ref: t => p(this, C, t, "f"),
       onInput: u(this, I, "f")
@@ -358,7 +358,7 @@ const X = class {
         [N]: true
       },
       tabListPosition: "block-start",
-      model: u(this, M, "f"),
+      model: u(this, x, "f"),
       selectedId: Q,
       overflow: "auto",
       contain: "size",
@@ -387,7 +387,7 @@ const X = class {
     }, i("ch-checkbox", {
       // #set as current environment
       class: "checkbox",
-      caption: u(this, W, "f").footer.setAsCurrentEnvironment,
+      caption: u(this, M, "f").footer.setAsCurrentEnvironment,
       ref: t => p(this, E, t, "f"),
       checkedValue: "current-environment",
       value: this.setAsTarget ? "current-environment" : "",
@@ -399,12 +399,12 @@ const X = class {
       class: "button-secondary",
       onClick: this.cancelCallback,
       part: "button button-cancel"
-    }, u(this, W, "f").footer.btnCancel), i("button", {
+    }, u(this, M, "f").footer.btnCancel), i("button", {
       // #create
       class: "button-primary",
       onClick: u(this, H, "f"),
       part: "button button-create"
-    }, u(this, W, "f").footer.btnCreate)))));
+    }, u(this, M, "f").footer.btnCreate)))));
   }
   static get assetsDirs() {
     return [ "gx-ide-assets/new-environment" ];
@@ -422,8 +422,8 @@ const X = class {
 };
 
 b = new WeakMap, m = new WeakMap, v = new WeakMap, g = new WeakMap, w = new WeakMap, 
-k = new WeakMap, _ = new WeakMap, y = new WeakMap, M = new WeakMap, W = new WeakMap, 
-x = new WeakMap, C = new WeakMap, j = new WeakMap, E = new WeakMap, S = new WeakMap, 
+k = new WeakMap, _ = new WeakMap, y = new WeakMap, x = new WeakMap, M = new WeakMap, 
+W = new WeakMap, C = new WeakMap, j = new WeakMap, E = new WeakMap, S = new WeakMap, 
 I = new WeakMap, T = new WeakMap, z = new WeakMap, F = new WeakMap, L = new WeakMap, 
 P = new WeakMap, A = new WeakMap, D = new WeakMap, H = new WeakMap, R = new WeakMap, 
 V = new WeakMap, q = new WeakMap, B = new WeakMap, G = new WeakMap, J = new WeakMap;
@@ -431,4 +431,4 @@ V = new WeakMap, q = new WeakMap, B = new WeakMap, G = new WeakMap, J = new Weak
 X.style = f;
 
 export { X as gx_ide_new_environment };
-//# sourceMappingURL=p-64e09524.entry.js.map
+//# sourceMappingURL=p-64e05f19.entry.js.map

package/dist/genexus-ide-ui/p-64e05f19.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["newEnvironmentCss","CSS_BUNDLES","MAIN_SECTION_CLASSES","BASIC_SECTION_PARENT_CLASSES","BASIC_TAB_SELECTOR","ADVANCED_TAB_SELECTOR","GxIdeNewEnvironment","_GxIdeNewEnvironment_advancedTabHasBeenRendered","set","this","_GxIdeNewEnvironment_chShortcutsEl","_GxIdeNewEnvironment_envNameModifiedByUser","_GxIdeNewEnvironment_frontEndsCheckedMap","Map","_GxIdeNewEnvironment_selectedDataStoreId","_GxIdeNewEnvironment_selectedLanguageId","_GxIdeNewEnvironment_selectedRuntimeEnvironmentId","_GxIdeNewEnvironment_shortcutsSrc","getAssetPath","_GxIdeNewEnvironment_newEnvironmentSectionsModel","_GxIdeNewEnvironment_componentLocale","_GxIdeNewEnvironment_dataStoreEl","_GxIdeNewEnvironment_environmentNameEl","_GxIdeNewEnvironment_languageEl","_GxIdeNewEnvironment_setAsCurrentEnvironmentEl","_GxIdeNewEnvironment_dataStoreValueChangedHandler","__classPrivateFieldSet","__classPrivateFieldGet","value","_GxIdeNewEnvironment_updateEnvironmentName","call","_GxIdeNewEnvironment_envNameInputHandler","e","newEnvName","detail","trim","environmentName","_GxIdeNewEnvironment_evaluateSelectedRuntimeEnvironmentId","_a","runtimes","_GxIdeNewEnvironment_evaluateTooltipRender","controlReference","_b","validatableControls","get","id","hasError","_c","message","h","class","actionElement","blockAlign","config","tooltipSettings","inlineAlign","delay","_GxIdeNewEnvironment_initializeValidatableControlsBasicTab","forEach","validatableControl","reference","undefined","_GxIdeNewEnvironment_languageValueChangedHandler","async","event","_GxIdeNewEnvironment_updateDataSources","_GxIdeNewEnvironment_updateFrontEnds","_GxIdeNewEnvironment_renderAdvanced","name","_GxIdeNewEnvironment_renderBasic","length","runtime","onChange","_GxIdeNewEnvironment_runtimeEnvironmentChangedHandler","model","runtimesRadioGroupModel","caption","tabBasic","backEnd","backEndLabel","htmlFor","language","part","disabled","languages","languageComboBoxModel","onInput","ref","el","dataStores","dataStoresComboBoxModel","frontEnd","frontEndLabel","role","generators","renderChCheckboxItems","frontEnds","_GxIdeNewEnvironment_frontEndCheckboxInputHandler","_GxIdeNewEnvironment_createCallbackHandler","selectedFrontEndIds","createCallback","setAsCurrent","then","formSubmitResult","validateControls","_GxIdeNewEnvironment_tabSelectionChangedHandler","newSelectedId","advancedTabIsVisible","updatedDataSources","getDataSourcesCallback","getEnvironmentNameCallback","updatedFrontEnds","getFrontEndsCallback","checkedValue","target","checked","_GxIdeNewEnvironment_updateFrontEndsCheckedMap","checkboxId","currentState","push","checkboxIndex","findIndex","removeIndex","dataStoresChanged","newValue","mapOptionsToComboBoxItemModel","getSelectedItem","languagesChanged","runtimesChanged","connectedCallback","componentDidLoad","componentDidRender","componentWillLoad","Locale","getComponentStrings","tabLabel","tabAdvanced","suspendShortcuts","suspend","render","Host","src","header","isAdvanced","autoFocus","placeholder","environmentNamePlaceholder","tab","tabListPosition","selectedId","overflow","contain","onSelectedItemChange","slot","footer","setAsCurrentEnvironment","setAsTarget","onClick","cancelCallback","btnCancel","btnCreate"],"sources":["src/components/new-environment/new-environment.scss?tag=gx-ide-new-environment&encapsulation=shadow","src/components/new-environment/new-environment.tsx"],"sourcesContent":[":host {\n  display: grid;\n  block-size: 100%;\n  grid-template-rows: max-content 1fr max-content;\n}\n\n.section {\n  display: contents;\n}\n\n.basic,\n.advanced {\n  padding-block-start: var(--mer-spacing--md);\n  block-size: 100%;\n  overflow: auto;\n}\n.advanced {\n  padding-block-end: var(--content-block-spacing);\n}\n\n// basic\n.basic {\n  display: grid;\n  grid-template:\n    \"runtime-environment runtime-environment\" max-content\n    \"back-end front-end\" 1fr;\n  grid-template-columns: 1fr 1fr;\n}\n.basic__runtime-environment {\n  grid-area: runtime-environment;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--mer-spacing--xs);\n}\n.basic__runtime-environment.one-runtime-only {\n  align-items: center;\n  flex-direction: row;\n  justify-content: center;\n}\n.control-header__back-end,\n.control-header__front-end {\n  padding-block-start: var(--mer-spacing--md);\n}\n.basic__back-end {\n  grid-area: back-end;\n}\n.basic__front-end {\n  grid-area: front-end;\n}\n.basic__back-end,\n.basic__front-end {\n  display: grid;\n  grid-template-rows: max-content 1fr;\n  grid-auto-rows: max-content;\n  overflow: auto;\n}\n.main__back-end {\n  border-inline-end: var(--section-common-border);\n}\n.main__back-end,\n.main__front-end {\n  grid-auto-rows: max-content;\n  padding-block: var(--content-block-spacing);\n  overflow: auto;\n}\n\n// WA / TODO: Add a helper class in Mercury to justify text.\n.text-align-center {\n  text-align: center; // should be resolved on mercury\n}\n\n.tab::part(page) {\n  // WA / TODO: Remove this line when the ch-tab renders supports scrollbar\n  // custom styling\n  scrollbar-width: thin;\n}\n","/* STENCIL IMPORTS */\nimport {\n  Component,\n  Element,\n  getAssetPath,\n  Host,\n  Method,\n  Prop,\n  State,\n  h,\n  Watch\n} from \"@stencil/core\";\n\nimport { MercuryBundles } from \"@genexus/mercury\";\n\nimport { config } from \"../../common/config\";\nimport { Locale } from \"../../common/locale\";\nimport {\n  mapOptionsToComboBoxItemModel,\n  renderChCheckboxItems\n} from \"../../common/helpers\";\nimport { getSelectedItem } from \"../../common/common\";\nimport { FormSubmitResult, GxOption } from \"../../common/types\";\nimport {\n  ControlValidation,\n  validateControls\n} from \"../../common/form-validation\";\nimport {\n  ChRadioGroupRenderCustomEvent,\n  TabModel,\n  ComboBoxModel,\n  ChEditCustomEvent,\n  RadioGroupModel,\n  ChCheckboxCustomEvent\n} from \"@genexus/chameleon-controls-library\";\nimport { removeIndex } from \"../../common/array\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  // TODO: review if \"utils/form--full\" is required.\n  \"resets/box-sizing\",\n  \"components/tab\",\n  \"components/tooltip\",\n  \"utils/form--full\",\n  \"utils/layout\",\n  \"utils/typography\",\n  \"utils/spacing\",\n  \"chameleon/scrollbar\"\n];\n\nconst MAIN_SECTION_CLASSES: string = \"main\";\nconst BASIC_SECTION_PARENT_CLASSES: string = \"basic\";\nconst BASIC_TAB_SELECTOR: string = \"basic\";\nconst ADVANCED_TAB_SELECTOR: string = \"advanced\";\n\n@Component({\n  tag: \"gx-ide-new-environment\",\n  styleUrl: \"new-environment.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/new-environment\"]\n})\nexport class GxIdeNewEnvironment {\n  #advancedTabHasBeenRendered: boolean = false;\n  #chShortcutsEl!: HTMLChShortcutsElement;\n  #envNameModifiedByUser = false;\n  /**\n   * frontEndsState saves the id's of the front ends checkboxes that are checked\n   */\n  // TODO (Use a set instead of an array to improve performance)\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #frontEndsCheckedMap = new Map<string, string[]>();\n  #selectedDataStoreId: string;\n  #selectedLanguageId: string;\n  #selectedRuntimeEnvironmentId: string;\n  #shortcutsSrc = getAssetPath(\n    `./gx-ide-assets/new-environment/shortcuts.json`\n  );\n  #newEnvironmentSectionsModel: TabModel = [];\n\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: HTMLGxIdeNewEnvironmentElement;\n\n  // References needed to collect data con \"createCallback\" button submit*/\n  #dataStoreEl!: HTMLChComboBoxRenderElement;\n  #environmentNameEl!: HTMLChEditElement;\n  #languageEl!: HTMLChComboBoxRenderElement;\n  #setAsCurrentEnvironmentEl!: HTMLChCheckboxElement;\n\n  @State() advancedTabIsVisible: boolean = false;\n\n  /**\n   * Allows selecting multiple generators for the front end\n   * TODO: Check if this property can be deleted, since we can call getFrontEndsCallback.\n   */\n  @State() frontEnds: GxOption[];\n\n  @State() validatableControls = new Map<string, ControlValidation>();\n\n  // representations of GxOption[] as ComboBoxModel or RadioGroupModel.\n  @State() dataStoresComboBoxModel: ComboBoxModel = [];\n  @State() languageComboBoxModel: ComboBoxModel = [];\n  @State() runtimesRadioGroupModel: RadioGroupModel = [];\n\n  /**\n   * Callback invoked when user wants to cancel\n   */\n  @Prop() readonly cancelCallback: CancelCallback;\n\n  /**\n   * Callback invoked when user confirms the KB creation\n   */\n  @Prop() readonly createCallback!: CreateCallback;\n\n  /**\n   * Allows defining the DBMS to be used in the solution\n   */\n  @Prop({ mutable: true }) dataStores!: GxOption[];\n  @Watch(\"dataStores\")\n  dataStoresChanged(newValue: GxOption[]) {\n    if (newValue?.length) {\n      this.dataStoresComboBoxModel = mapOptionsToComboBoxItemModel(newValue);\n      this.#selectedDataStoreId = getSelectedItem(newValue);\n    }\n  }\n\n  /**\n   * Name of the new environment\n   */\n  @Prop({ mutable: true }) environmentName: string;\n\n  /**\n   * Callback invoked when user changes the language or the runtime\n   */\n  @Prop() readonly getDataSourcesCallback!: GetDataSourcesCallback;\n\n  /**\n   * Callback invoked when user changes the language or data source\n   */\n  @Prop() readonly getEnvironmentNameCallback!: GetEnvironmentNameCallback;\n\n  /**\n   * Callback invoked when user changes the language\n   */\n  @Prop() readonly getFrontEndsCallback!: GetFrontEndsCallback;\n\n  /**\n   * Define if the Advanced tab should be displayed\n   */\n  @Prop() readonly isAdvanced: boolean = false;\n\n  /**\n   * Possible values for 'Language' combo\n   */\n  @Prop() readonly languages!: GxOption[];\n  @Watch(\"languages\")\n  languagesChanged(newValue: GxOption[]) {\n    if (newValue?.length) {\n      this.languageComboBoxModel = mapOptionsToComboBoxItemModel(newValue);\n      this.#selectedLanguageId = getSelectedItem(newValue);\n      this.#updateFrontEnds();\n    }\n  }\n\n  /**\n   * Possible values for 'Runtime Environment' radio button\n   */\n  @Prop() readonly runtimes!: GxOption[];\n  @Watch(\"runtimes\")\n  runtimesChanged(newValue: GxOption[]) {\n    if (newValue?.length) {\n      this.runtimesRadioGroupModel = mapOptionsToComboBoxItemModel(\n        this.runtimes\n      );\n    }\n  }\n\n  /**\n   * Belongs to checkbox 'Set as current environment' @default true\n   *\n   */\n  @Prop() readonly setAsTarget?: boolean = true;\n\n  connectedCallback() {\n    this.dataStoresChanged(this.dataStores);\n    this.languagesChanged(this.languages);\n    this.runtimesChanged(this.runtimes);\n  }\n\n  componentDidLoad() {\n    this.#initializeValidatableControlsBasicTab();\n  }\n\n  componentDidRender() {\n    if (this.advancedTabIsVisible && !this.#advancedTabHasBeenRendered) {\n      // just call this once.\n      this.#advancedTabHasBeenRendered = true;\n    }\n  }\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n    this.#newEnvironmentSectionsModel = [\n      {\n        id: BASIC_TAB_SELECTOR,\n        name: this.#componentLocale.tabBasic.tabLabel\n      },\n      {\n        id: ADVANCED_TAB_SELECTOR,\n        name: this.#componentLocale.tabAdvanced.tabLabel\n      }\n    ];\n    this.#evaluateSelectedRuntimeEnvironmentId();\n  }\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  #dataStoreValueChangedHandler = () => {\n    /* the data store item id is used for the value (they are equal)*/\n    this.#selectedDataStoreId = this.#dataStoreEl.value;\n    this.#updateEnvironmentName();\n  };\n\n  #envNameInputHandler = (e: ChEditCustomEvent<string> | InputEvent) => {\n    const newEnvName = (e as ChEditCustomEvent<string>).detail.trim();\n    this.#envNameModifiedByUser = newEnvName !== this.environmentName;\n  };\n\n  #evaluateSelectedRuntimeEnvironmentId = () => {\n    this.#selectedRuntimeEnvironmentId = this.runtimes[0]?.value;\n  };\n\n  // TODO: We must avoid performing the get 3 times.\n  // It is used on new-environment as well.\n  #evaluateTooltipRender = (\n    controlReference: HTMLElement\n  ): HTMLChTooltipElement =>\n    this.validatableControls?.get(controlReference?.id)?.hasError &&\n    this.validatableControls.get(controlReference.id)?.message && (\n      <ch-tooltip\n        class=\"tooltip\"\n        actionElement={controlReference as unknown as HTMLButtonElement}\n        blockAlign={config.tooltipSettings.blockAlign}\n        inlineAlign={config.tooltipSettings.inlineAlign}\n        delay={config.tooltipSettings.delay}\n      >\n        {this.validatableControls.get(controlReference.id).message}\n      </ch-tooltip>\n    );\n\n  #initializeValidatableControlsBasicTab = () => {\n    // populate #controlsValidation with the controls that could have errors.\n    const validatableControls: HTMLElement[] = [\n      this.#dataStoreEl,\n      this.#languageEl\n    ];\n    validatableControls.forEach(validatableControl => {\n      if (validatableControl.id) {\n        this.validatableControls.set(validatableControl.id, {\n          reference: validatableControl,\n          hasError: false,\n          message: undefined\n        });\n      }\n    });\n  };\n\n  #languageValueChangedHandler = async (\n    event: CustomEvent<string> | InputEvent\n  ) => {\n    this.#selectedLanguageId = event.detail as string;\n    await this.#updateDataSources();\n    this.#updateFrontEnds();\n    this.#updateEnvironmentName();\n  };\n\n  #renderAdvanced = (): Element => {\n    return <slot name=\"property-grid\"></slot>;\n  };\n\n  #renderBasic = (): HTMLElement[] => {\n    return [\n      <div\n        class={{\n          \"basic__runtime-environment\": true,\n          \"control-header-with-border\": true,\n          \"one-runtime-only\": this.runtimes.length === 1\n        }}\n      >\n        {this.runtimes.length > 1\n          ? [\n              <h2\n                // Runtime Environment\n                class=\"subtitle-regular-xs\t text-align-center\"\n              >\n                {this.#componentLocale.runtime}\n              </h2>,\n              <ch-radio-group-render\n                class=\"radio-group\"\n                onChange={this.#runtimeEnvironmentChangedHandler}\n                model={this.runtimesRadioGroupModel}\n                value={this.#selectedRuntimeEnvironmentId}\n              ></ch-radio-group-render>\n            ]\n          : [\n              <h2 class=\"subtitle-regular-xs\t text-align-center\">\n                {this.#componentLocale.runtime}:\n              </h2>,\n              <p>{this.runtimesRadioGroupModel[0].caption}</p>\n            ]}\n      </div>,\n      <section class=\"basic__back-end scrollable\">\n        <h2\n          // back end\n          class=\"control-header control-header-with-border control-header__back-end subtitle-regular-xs\t text-align-center spacing-body-inline\"\n        >\n          {this.#componentLocale.tabBasic.backEnd.backEndLabel}\n        </h2>\n\n        <div class=\"field-group main__back-end spacing-body-inline scrollable\">\n          <div\n            // #language\n            class=\"field field-block\"\n          >\n            <label class=\"label\" htmlFor=\"language\">\n              {this.#componentLocale.tabBasic.backEnd.language}\n            </label>\n            <ch-combo-box-render\n              id=\"language\"\n              class=\"combo-box\"\n              part=\"language\"\n              value={this.#selectedLanguageId}\n              disabled={this.languages.length === 0}\n              model={this.languageComboBoxModel}\n              onInput={this.#languageValueChangedHandler}\n              ref={(el: HTMLChComboBoxRenderElement) =>\n                (this.#languageEl = el as HTMLChComboBoxRenderElement)\n              }\n              // TODO: toolTip={config.tooltip}\n            ></ch-combo-box-render>\n            {this.#evaluateTooltipRender(this.#languageEl)}\n          </div>\n\n          <div\n            // #data stores\n            class=\"field field-block\"\n          >\n            <label class=\"label\" htmlFor=\"data-store\">\n              {this.#componentLocale.tabBasic.backEnd.dataStores}\n            </label>\n            <ch-combo-box-render\n              id=\"data-store\"\n              class=\"combo-box\"\n              part=\"data-store\"\n              value={this.#selectedDataStoreId}\n              model={this.dataStoresComboBoxModel}\n              onInput={this.#dataStoreValueChangedHandler}\n              ref={(el: HTMLChComboBoxRenderElement) =>\n                (this.#dataStoreEl = el as HTMLChComboBoxRenderElement)\n              }\n              // TODO: toolTip={config.tooltip}\n            ></ch-combo-box-render>\n            {this.#evaluateTooltipRender(this.#dataStoreEl)}\n          </div>\n        </div>\n      </section>,\n\n      <section class=\"basic__front-end scrollable\">\n        <h2\n          // front end\n          class=\"control-header control-header-with-border control-header__front-end subtitle-regular-xs\t text-align-center spacing-body-inline\"\n        >\n          {this.#componentLocale.tabBasic.frontEnd.frontEndLabel}\n        </h2>\n        <div\n          class=\"field-group front-end__checkboxes spacing-body-inline main__front-end scrollable\"\n          role=\"group\"\n          aria-labelledby={this.#componentLocale.tabBasic.frontEnd.generators}\n        >\n          {renderChCheckboxItems(\n            this.frontEnds,\n            this.#frontEndCheckboxInputHandler,\n            this.#frontEndsCheckedMap.get(this.#selectedLanguageId)\n          )}\n        </div>\n      </section>\n    ];\n  };\n\n  #runtimeEnvironmentChangedHandler = async (\n    event: ChRadioGroupRenderCustomEvent<string>\n  ): Promise<void> => {\n    this.#selectedRuntimeEnvironmentId = event.detail;\n    await this.#updateDataSources();\n    this.#updateEnvironmentName();\n  };\n\n  #createCallbackHandler = async () => {\n    const selectedFrontEndIds =\n      this.#frontEndsCheckedMap.get(this.#selectedLanguageId) ?? [];\n\n    this.createCallback({\n      setAsCurrent: !!this.#setAsCurrentEnvironmentEl?.value,\n      name: this.#environmentNameEl.value,\n      runtime: this.#selectedRuntimeEnvironmentId,\n      language: this.#languageEl.value,\n      dataStores: this.#dataStoreEl.value,\n      frontEnds: selectedFrontEndIds\n    }).then((formSubmitResult: FormSubmitResult) => {\n      this.validatableControls = validateControls(\n        formSubmitResult,\n        this.validatableControls\n      );\n    });\n  };\n\n  #tabSelectionChangedHandler = (\n    event: CustomEvent<{\n      lastSelectedIndex: number;\n      newSelectedId: string;\n      newSelectedIndex: number;\n    }>\n  ): void => {\n    if (event.detail.newSelectedId === ADVANCED_TAB_SELECTOR) {\n      this.advancedTabIsVisible = true;\n      // Some logic for advanced tab is done on componentDidRender lifecycle,\n      // since the reference to the elements is needed.\n    }\n  };\n\n  #updateDataSources = async () => {\n    const updatedDataSources = await this.getDataSourcesCallback(\n      this.#selectedLanguageId,\n      this.#selectedRuntimeEnvironmentId\n    );\n    if (updatedDataSources?.length > 0) {\n      this.dataStores = updatedDataSources;\n    }\n  };\n\n  #updateEnvironmentName = async () => {\n    if (!this.#envNameModifiedByUser) {\n      this.environmentName = await this.getEnvironmentNameCallback(\n        this.#selectedLanguageId,\n        this.#selectedDataStoreId,\n        this.#selectedRuntimeEnvironmentId\n      );\n    }\n  };\n\n  #updateFrontEnds = async () => {\n    const updatedFrontEnds = await this.getFrontEndsCallback(\n      this.#selectedLanguageId\n    );\n    if (updatedFrontEnds?.length > 0) {\n      this.frontEnds = updatedFrontEnds;\n    }\n  };\n\n  #frontEndCheckboxInputHandler = (\n    event: ChCheckboxCustomEvent<string> | InputEvent\n  ) => {\n    const checkedValue = (event.target as HTMLChCheckboxElement).checkedValue;\n    const checked = event.detail === checkedValue;\n    this.#updateFrontEndsCheckedMap(checkedValue, checked);\n  };\n\n  /**\n   * This function updates frontEndsCheckedMap, that contains the checked\n   * checkboxes for each language front ends.\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #updateFrontEndsCheckedMap = (checkboxId: string, checked: boolean) => {\n    let currentState = this.#frontEndsCheckedMap.get(this.#selectedLanguageId);\n    if (!currentState) {\n      // first time\n      currentState = [];\n      this.#frontEndsCheckedMap.set(this.#selectedLanguageId, currentState);\n    }\n    if (checked) {\n      // update by adding\n      currentState.push(checkboxId);\n    } else {\n      // update by removing\n      const checkboxIndex = currentState.findIndex(id => id === checkboxId);\n      removeIndex(currentState, checkboxIndex);\n    }\n  };\n\n  render() {\n    return (\n      <Host class=\"widget scrollable\">\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\n        <section class=\"section\">\n          <header\n            class={{\n              \"header\": true,\n              \"spacing-body-inline\": true,\n              \"spacing-body-block-start\": true,\n              \"control-header\": this.isAdvanced,\n              \"control-header-with-border\": !this.isAdvanced\n            }}\n          >\n            <div\n              // #environment name\n              class=\"field field-inline\"\n            >\n              <label class=\"label\" htmlFor=\"environment-name\">\n                {this.#componentLocale.name}\n              </label>\n              <ch-edit\n                // environment name\n                autoFocus\n                id=\"environment-name\"\n                class=\"input\"\n                part=\"environment-name\"\n                value={this.environmentName}\n                placeholder={this.#componentLocale.environmentNamePlaceholder}\n                // TODO: toolTip={config.tooltip}\n                ref={(el: HTMLChEditElement) =>\n                  (this.#environmentNameEl = el as HTMLChEditElement)\n                }\n                onInput={this.#envNameInputHandler}\n              ></ch-edit>\n            </div>\n          </header>\n\n          {this.isAdvanced ? (\n            <ch-tab-render\n              // main section\n              class={{\n                tab: true,\n                [MAIN_SECTION_CLASSES]: true\n              }}\n              tabListPosition=\"block-start\"\n              model={this.#newEnvironmentSectionsModel}\n              selectedId={BASIC_TAB_SELECTOR}\n              overflow=\"auto\"\n              contain=\"size\"\n              onSelectedItemChange={\n                !this.advancedTabIsVisible && this.#tabSelectionChangedHandler\n              }\n            >\n              <div\n                slot={BASIC_TAB_SELECTOR}\n                class={BASIC_SECTION_PARENT_CLASSES}\n                part=\"tab-button-basic\"\n              >\n                {this.#renderBasic()}\n              </div>\n              {this.advancedTabIsVisible && (\n                <div\n                  slot={ADVANCED_TAB_SELECTOR}\n                  class=\"advanced spacing-body-inline\"\n                  part=\"tab-button-advanced\"\n                >\n                  {this.#renderAdvanced()}\n                </div>\n              )}\n            </ch-tab-render>\n          ) : (\n            <div\n              // main section\n              class={MAIN_SECTION_CLASSES}\n            >\n              <div class={BASIC_SECTION_PARENT_CLASSES}>\n                {this.#renderBasic()}\n              </div>\n            </div>\n          )}\n\n          <footer\n            class={{\n              \"control-footer\": this.isAdvanced,\n              \"control-footer-with-border\": !this.isAdvanced,\n              \"control-footer-space-between\": true,\n              \"spacing-body-block-end\": true,\n              \"spacing-body-inline\": true\n            }}\n          >\n            <ch-checkbox\n              // #set as current environment\n              class=\"checkbox\"\n              caption={this.#componentLocale.footer.setAsCurrentEnvironment}\n              ref={(el: HTMLChCheckboxElement) =>\n                (this.#setAsCurrentEnvironmentEl = el as HTMLChCheckboxElement)\n              }\n              checkedValue=\"current-environment\"\n              value={this.setAsTarget ? \"current-environment\" : \"\"}\n              part=\"set-as-current-environment\"\n            ></ch-checkbox>\n\n            <div class=\"buttons-spacer\">\n              <button\n                // #cancel\n                class=\"button-secondary\"\n                onClick={this.cancelCallback}\n                part=\"button button-cancel\"\n              >\n                {this.#componentLocale.footer.btnCancel}\n              </button>\n\n              <button\n                // #create\n                class=\"button-primary\"\n                onClick={this.#createCallbackHandler}\n                part=\"button button-create\"\n              >\n                {this.#componentLocale.footer.btnCreate}\n              </button>\n            </div>\n          </footer>\n        </section>\n      </Host>\n    );\n  }\n}\n\nexport type CancelCallback = () => Promise<void>;\n\nexport type CreateCallback = (\n  data: NewEnvironmentData\n) => Promise<FormSubmitResult>;\n\nexport type GetDataSourcesCallback = (\n  selectedLanguageId: string,\n  selectedRuntimeId: string\n) => Promise<GxOption[]>;\n\nexport type GetEnvironmentNameCallback = (\n  selectedLanguageId: string,\n  selectedDataSourceId: string,\n  selectedRuntimeId: string\n) => Promise<string | undefined>;\n\nexport type GetFrontEndsCallback = (\n  selectedLanguageId: string\n) => Promise<GxOption[]>;\n\nexport interface NewEnvironmentData {\n  setAsCurrent: boolean;\n  name: string;\n  runtime: string;\n  language: string;\n  dataStores: string;\n  frontEnds: string[];\n}\n"],"mappings":"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"}

package/dist/genexus-ide-ui/{p-5619120d.entry.js → p-64f2a9f4.entry.js}

@@ -1,8 +1,8 @@
 import { r as t, h as e, H as i, g as s } from "./p-49712340.js";
 
-import { g as a } from "./p-617e65ca.js";
+import { g as a } from "./p-1986d34d.js";
 
-import { c as r } from "./p-78b90603.js";
+import { c as r } from "./p-13738332.js";
 
 import { L as n } from "./p-311eedf3.js";
 
@@ -313,7 +313,7 @@ const T = class {
     }, o(this, _, "f").call(this), o(this, y, "f").call(this), e("footer", {
       class: "control-footer control-footer-with-border spacing-body-block-end spacing-body-inline control-footer-space-between"
     }, e("p", {
-      class: "text-body-regular-s matching-attributes"
+      class: "body-regular-s matching-attributes"
     }, `${n} ${r}`), e("button", {
       id: "button-select-all",
       class: "button-primary",
@@ -338,4 +338,4 @@ M = new WeakMap;
 T.style = l;
 
 export { T as gx_ide_ww_attributes };
-//# sourceMappingURL=p-5619120d.entry.js.map
+//# sourceMappingURL=p-64f2a9f4.entry.js.map

package/dist/genexus-ide-ui/{p-5619120d.entry.js.map → p-64f2a9f4.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["mapOptionsToComboBoxItemModel","options","map","option","value","id","caption","label","startImgSrc","_a","iconName","wwAttributesCss","CSS_BUNDLES","FILTER_ICON","getIconPath","category","name","colorType","GxIdeWWAttributes","_GxIdeWWAttributes__componentLocale","set","this","_GxIdeWWAttributes_chGridEl","_GxIdeWWAttributes_contextMenuCallbackHandler","ev","contextMenuCallback","selection","selectedAttributesIds","clientX","clientY","_GxIdeWWAttributes_deleteSelectionCallbackHandle","deleteSelectionCallback","_GxIdeWWAttributes_deselectAll","__classPrivateFieldGet","selectAllRows","_GxIdeWWAttributes_getAttributes","loading","filters","trim","type","object","loadCallback","then","items","attributes","length","call","_GxIdeWWAttributes_listenChanges","addEventListener","detail","rowsId","selectionChangeCallback","preventDefault","stopPropagation","_GxIdeWWAttributes_openSelectionCallbackHandle","openSelectionCallback","_GxIdeWWAttributes_entityCallbackHandler","async","result","objectActionCallback","iconSrc","Promise","resolve","_GxIdeWWAttributes_entityValueChangedHandler","event","_GxIdeWWAttributes_renderAttributesGrid","tabularGridEmpty","h","class","main","ref","el","__classPrivateFieldSet","part","settingable","size","config","tabularGrid","colSize","maxContent","tableHead","auto","description","_GxIdeWWAttributes_evaluateAttributesGridContent","loaderTitle","loader","title","show","attr","rowid","src","icon","stateIconSrc","stateTitle","emptyStateTitle","isAnimated","_GxIdeWWAttributes_renderFilter","htmlFor","filter","debounce","onInput","_GxIdeWWAttributes_nameInputHandler","disabled","types","model","_GxIdeWWAttributes_typeInputHandler","labelPosition","defaultValue","selectEntityCallback","onValueChanged","_GxIdeWWAttributes_selectAll","e","componentWillLoad","Locale","getComponentStrings","componentDidLoad","keyDownHandler","eventInfo","document","activeElement","key","reload","validate","isValid","render","btnDisabled","matchingAttributesLabel","matchingAttribute","matchingAttributes","attributesLength","_b","Host","onClick","footer","btnSelectAll"],"sources":["src/components/ww-attributes/helpers.tsx","src/components/ww-attributes/ww-attributes.scss?tag=gx-ide-ww-attributes&encapsulation=shadow","src/components/ww-attributes/ww-attributes.tsx"],"sourcesContent":["import { ComboBoxModel } from \"@genexus/chameleon-controls-library\";\nimport { GxOption } from \"../..\";\n\nexport const mapOptionsToComboBoxItemModel = (\n  options: GxOption[]\n): ComboBoxModel => {\n  return options.map(option => {\n    return {\n      value: option.id,\n      caption: option.label,\n      startImgSrc: option.iconName ?? \"\"\n    };\n  });\n};\n","@import \"../../../node_modules/@genexus/mercury/dist/mercury.scss\"; // for the tabular-grid-cell-layout mixin\n\n$nameInlineSize: 40px;\n$moreBtnInlineSize: 64px;\n\n:host {\n  display: grid;\n  block-size: 100%;\n  overflow: auto;\n  grid-template-rows: max-content 1fr max-content;\n}\n\n.section {\n  display: contents;\n}\n// Header\n.header {\n  grid-template:\n    \"name type\" max-content\n    \"object object\" max-content;\n  grid-template-columns: 1fr 1fr;\n}\n.name__field {\n  grid-area: name;\n}\n.name__label {\n  inline-size: $nameInlineSize;\n}\n.type__field {\n  grid-area: type;\n}\n.more__btn {\n  grid-area: more;\n  inline-size: $moreBtnInlineSize;\n}\n.object-selector__field {\n  grid-area: object;\n}\n\n// Main\n.main {\n  overflow: auto;\n}\n\nch-tabular-grid.tabular-grid--empty::part(main) {\n  // WA to avoid scrollbar flickering when displaying the empty-state message\n  overflow: hidden;\n}\nch-tabular-grid-rowset-empty {\n  position: relative; // makes this the bounder element for the loader\n}\n\n@include tabular-grid-cell-layout(\n  $tabular-grid-selector: \".tabular-grid-row\",\n  $tabular-grid-cell-node-type: \"text\",\n  $tabular-grid-cell-apply-ellipsis: true,\n  $tabular-grid-affected-columns-nth-list: (\n    2,\n    3,\n    4\n  )\n);\n\n// WA: remove this when Mercury removes margin from p elements\n.matching-attributes {\n  margin: 0;\n}\n","/* eslint-disable @stencil-community/own-props-must-be-private */\n// Stencil\nimport {\n  Component,\n  Element,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  h\n} from \"@stencil/core\";\n// Other Libraries\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n// Custom Imports\nimport { config } from \"../../common/config\";\nimport { Locale } from \"../../common/locale\";\nimport { ContextMenuInfo, EntityData, GxOption } from \"../../common/types\";\nimport { mapOptionsToComboBoxItemModel } from \"./helpers\";\nimport { ChEditCustomEvent } from \"@genexus/chameleon-controls-library\";\nimport HTMLChTabularGridRowsetElement from \"@genexus/chameleon-controls-library/dist/types/components/tabular-grid/rowset/tabular-grid-rowset\";\nimport { GxIdeEntitySelectorCustomEvent } from \"../../components\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/button\",\n  \"components/edit\",\n  \"components/combo-box\",\n  \"components/tabular-grid\",\n  \"components/icon\",\n  \"utils/form\",\n  \"utils/layout\",\n  \"utils/spacing\",\n  \"chameleon/scrollbar\"\n];\n\nconst FILTER_ICON = getIconPath({\n  category: \"window-tools\",\n  name: \"filter\",\n  colorType: \"on-elevation\"\n});\n\n@Component({\n  tag: \"gx-ide-ww-attributes\",\n  styleUrl: \"ww-attributes.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/ww-attributes\"]\n})\nexport class GxIdeWWAttributes {\n  /**\n   * Component hard-coded strings translations.\n   */\n  #_componentLocale: any;\n\n  @Element() el: HTMLGxIdeWwAttributesElement;\n\n  /* References needed to collect data */\n  #chGridEl!: HTMLChTabularGridElement;\n\n  /**\n   * Attributes rendered in the table\n   */\n  @State() attributes: AttributeData[];\n\n  /**\n   * Selected attributes in the table of attributes\n   */\n  @State() selectedAttributesIds: string[] = [];\n\n  /**\n   * Show or hide advanced filters\n   */\n  @State() filterMore = false;\n\n  /**\n   * The attribute filter name\n   */\n  @State() name: string = \"\";\n\n  /**\n   * True if loadCallback hasn't been resolved yet\n   */\n  @State() loading: boolean = true;\n\n  /**\n   * The attribute object value\n   */\n  @State() object: EntityData;\n\n  /**\n   * The attribute filter type value\n   */\n  @State() type: string;\n\n  /**\n   * Callback invoked when user right-clicks on the grid\n   */\n  @Prop() readonly contextMenuCallback!: ContextMenuCallback;\n\n  /**\n   * Callback invoked when user deletes an object\n   */\n  @Prop() readonly deleteSelectionCallback!: DeleteSelectionCallback;\n\n  /**\n   * Callback invoked when user filters the objects\n   */\n  @Prop() readonly loadCallback!: LoadCallback;\n\n  /**\n   * Callback invoked when user executes filter action\n   */\n  @Prop() readonly objectActionCallback!: ObjectActionCallback;\n\n  /**\n   * Objects rendered in the object selector\n   */\n  @Prop() readonly objects!: GxOption[];\n\n  /**\n   * Callback invoked when user opens the selection dialog\n   */\n  @Prop() readonly openSelectionCallback!: OpenSelectionCallback;\n\n  /**\n   * Callback invoked when user selects or deselects an object\n   */\n  @Prop() readonly selectionChangeCallback!: SelectionChangeCallback;\n\n  /**\n   * Types rendered in the filter type selector\n   */\n  @Prop() readonly types!: GxOption[];\n\n  async componentWillLoad() {\n    this.#_componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  componentDidLoad() {\n    this.#listenChanges();\n    this.type = this.types[0].id; // before #getAttributes\n    this.#getAttributes();\n  }\n\n  @Listen(\"keydown\", { passive: true })\n  keyDownHandler(eventInfo: KeyboardEvent) {\n    if (document.activeElement === this.el) {\n      switch (eventInfo.key) {\n        case \"Enter\":\n          this.#openSelectionCallbackHandle();\n          break;\n        case \"Delete\":\n          this.#deleteSelectionCallbackHandle();\n          break;\n      }\n    }\n  }\n\n  /**\n   * Reloads the view, refreshing the filters and attributes table.\n   */\n  @Method()\n  async reload(): Promise<void> {\n    this.name = \"\";\n    this.type = this.types[0].id;\n    this.object = null;\n    this.#getAttributes();\n  }\n\n  /**\n   * Validate necessary data input\n   */\n  @Method()\n  async validate(): Promise<boolean> {\n    const isValid = true;\n    return isValid;\n  }\n\n  #contextMenuCallbackHandler = (ev: MouseEvent): void => {\n    this.contextMenuCallback({\n      selection: this.selectedAttributesIds,\n      clientX: ev.clientX,\n      clientY: ev.clientY\n    });\n  };\n\n  #deleteSelectionCallbackHandle = (): void => {\n    this.deleteSelectionCallback(this.selectedAttributesIds);\n  };\n\n  #deselectAll = (): void => {\n    (this.#chGridEl as any).selectAllRows(false);\n  };\n\n  #getAttributes = (): void => {\n    this.loading = true;\n    const filters: AttributeFiltersData = {\n      name: this.name.trim(),\n      type: this.type,\n      object: this.object?.id\n    };\n    this.loadCallback(filters).then((items: AttributeData[]) => {\n      this.attributes = items;\n      if (this.selectedAttributesIds?.length > 0) {\n        this.selectedAttributesIds = [];\n        this.#deselectAll();\n      }\n      this.loading = false;\n    });\n  };\n\n  #listenChanges = (): void => {\n    // for grid selection\n    this.#chGridEl.addEventListener(\"selectionChanged\", (ev: any): void => {\n      this.selectedAttributesIds = ev.detail.rowsId;\n      this.selectionChangeCallback(this.selectedAttributesIds);\n    });\n    this.#chGridEl.addEventListener(\"contextmenu\", (ev: MouseEvent): void => {\n      ev.preventDefault();\n      ev.stopPropagation();\n      this.#contextMenuCallbackHandler(ev);\n    });\n\n    this.#chGridEl.addEventListener(\"rowDoubleClicked\", (): void => {\n      this.#openSelectionCallbackHandle();\n    });\n  };\n\n  #openSelectionCallbackHandle = (): void => {\n    this.openSelectionCallback(this.selectedAttributesIds);\n  };\n\n  #entityCallbackHandler = async (): Promise<null> => {\n    const result = await this.objectActionCallback();\n    this.object = {\n      id: result.id,\n      name: result.name,\n      iconSrc: result.iconSrc\n    };\n    return new Promise(resolve => {\n      resolve(null);\n    });\n  };\n\n  #entityValueChangedHandler = (\n    event: GxIdeEntitySelectorCustomEvent<EntityData>\n  ) => {\n    this.object = event.detail;\n    this.#getAttributes();\n  };\n\n  #renderAttributesGrid = (): Element => {\n    const tabularGridEmpty = this.attributes?.length === 0 || !this.attributes;\n    return (\n      <ch-tabular-grid\n        class={{\n          \"tabular-grid\": true,\n          \"tabular-grid--empty\": tabularGridEmpty,\n          \"main\": true\n        }}\n        ref={(el: HTMLChTabularGridElement) => (this.#chGridEl = el)}\n        row-selection-mode=\"multiple\"\n        part=\"ch-grid-attributes\"\n      >\n        <ch-tabular-grid-columnset class=\"tabular-grid-column-set\">\n          <ch-tabular-grid-column\n            column-name=\"\"\n            column-name-position=\"text\"\n            settingable={false}\n            size={config.tabularGrid.colSize.maxContent}\n            class=\"tabular-grid-column\"\n          ></ch-tabular-grid-column>\n          <ch-tabular-grid-column\n            column-name={this.#_componentLocale.tableHead.name}\n            column-name-position=\"text\"\n            size={config.tabularGrid.colSize.auto}\n            class=\"tabular-grid-column\"\n            settingable={false}\n          ></ch-tabular-grid-column>\n          <ch-tabular-grid-column\n            column-name={this.#_componentLocale.tableHead.type}\n            column-name-position=\"text\"\n            class=\"tabular-grid-column\"\n            size={config.tabularGrid.colSize.auto}\n            settingable={false}\n          ></ch-tabular-grid-column>\n          <ch-tabular-grid-column\n            column-name={this.#_componentLocale.tableHead.description}\n            column-name-position=\"text\"\n            size={config.tabularGrid.colSize.auto}\n            class=\"tabular-grid-column\"\n            settingable={false}\n          ></ch-tabular-grid-column>\n        </ch-tabular-grid-columnset>\n\n        {this.#evaluateAttributesGridContent()}\n      </ch-tabular-grid>\n    );\n  };\n\n  #evaluateAttributesGridContent = (): HTMLChTabularGridRowsetElement => {\n    if (this.loading) {\n      return (\n        <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n          <ch-tabular-grid-rowset-empty>\n            <gx-ide-loader\n              loaderTitle={this.#_componentLocale.loader.title}\n              description={this.#_componentLocale.loader.description}\n              show\n            ></gx-ide-loader>\n          </ch-tabular-grid-rowset-empty>\n        </ch-tabular-grid-rowset>\n      );\n    } else if (this.attributes.length) {\n      return (\n        <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n          {this.attributes.map((attr: AttributeData) => (\n            <ch-tabular-grid-row class=\"tabular-grid-row\" rowid={attr.id}>\n              <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                <ch-image class=\"icon-sm\" src={attr.icon}></ch-image>\n              </ch-tabular-grid-cell>\n              <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                {attr.name}\n              </ch-tabular-grid-cell>\n              <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                {attr.type}\n              </ch-tabular-grid-cell>\n              <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                {attr.description}\n              </ch-tabular-grid-cell>\n            </ch-tabular-grid-row>\n          ))}\n        </ch-tabular-grid-rowset>\n      );\n    } else {\n      // filter returned none\n      return (\n        <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n          <ch-tabular-grid-rowset-empty>\n            <gx-ide-empty-state\n              stateIconSrc={FILTER_ICON}\n              stateTitle={this.#_componentLocale.emptyStateTitle}\n              isAnimated={true}\n            ></gx-ide-empty-state>\n          </ch-tabular-grid-rowset-empty>\n        </ch-tabular-grid-rowset>\n      );\n    }\n  };\n\n  #renderFilter = (): Element => {\n    return (\n      <header class=\"header field-group control-header-with-border spacing-body\">\n        <div class=\"field field-inline name__field\">\n          <label class=\"label name__label\" htmlFor=\"name\">\n            {this.#_componentLocale.filter.name}\n          </label>\n          <ch-edit\n            // Name\n            id=\"name\"\n            class=\"input\"\n            value={this.name}\n            debounce={300}\n            onInput={this.#nameInputHandler}\n            part=\"filter-name\"\n          ></ch-edit>\n        </div>\n\n        <div class=\"field field-inline type__field\">\n          <label class=\"label\" htmlFor=\"type\">\n            {this.#_componentLocale.filter.type}\n          </label>\n          <ch-combo-box-render\n            // Type\n            id=\"type\"\n            class=\"combo-box\"\n            disabled={!this.types}\n            value={this.type}\n            model={mapOptionsToComboBoxItemModel(this.types ?? [])}\n            part=\"filter-type\"\n            onInput={this.#typeInputHandler}\n          ></ch-combo-box-render>\n        </div>\n\n        {/* <button\n          // TODO: Check with Design if it maes sense to have a button that toggles only one control.\n          // More\n          class=\"button-primary more__btn\"\n          onClick={this.#showMoreFilter}\n          part=\"button button--more-less\"\n        >\n          {this.filterMore\n            ? this.#_componentLocale.filter.btnLess\n            : this.#_componentLocale.filter.btnMore}\n        </button> */}\n\n        <div class=\"field field-inline object-selector__field\">\n          <label class=\"label\" htmlFor=\"object-selector\">\n            {this.#_componentLocale.filter.object}\n          </label>\n          <gx-ide-entity-selector\n            // Object\n            id=\"object-selector\"\n            value={this.object}\n            labelPosition=\"none\"\n            defaultValue={null}\n            selectEntityCallback={this.#entityCallbackHandler}\n            onValueChanged={this.#entityValueChangedHandler}\n            part=\"filter-module-folder\"\n          ></gx-ide-entity-selector>\n        </div>\n      </header>\n    );\n  };\n\n  #selectAll = (): void => {\n    (this.#chGridEl as any).selectAllRows();\n  };\n\n  #nameInputHandler = (e: ChEditCustomEvent<string> | InputEvent) => {\n    this.name = (e as ChEditCustomEvent<string>).detail.trim();\n    this.#getAttributes();\n  };\n\n  #typeInputHandler = (e: CustomEvent<string> | InputEvent) => {\n    this.type = e.detail as string;\n    this.#getAttributes();\n  };\n\n  render(): void {\n    const btnDisabled = !this.attributes || this.attributes.length === 0;\n    const matchingAttributesLabel =\n      this.attributes?.length === 1\n        ? this.#_componentLocale.matchingAttribute\n        : this.#_componentLocale.matchingAttributes;\n    const attributesLength = this.attributes?.length || 0;\n\n    return (\n      <Host class=\"widget\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <section class=\"section\">\n          {this.#renderFilter()}\n\n          {this.#renderAttributesGrid()}\n\n          <footer class=\"control-footer control-footer-with-border spacing-body-block-end spacing-body-inline control-footer-space-between\">\n            <p class=\"text-body-regular-s matching-attributes\">\n              {`${attributesLength} ${matchingAttributesLabel}`}\n            </p>\n\n            <button\n              id=\"button-select-all\"\n              class=\"button-primary\"\n              onClick={this.#selectAll}\n              disabled={btnDisabled}\n              part=\"button button--select-all\"\n            >\n              {this.#_componentLocale.footer.btnSelectAll}\n            </button>\n          </footer>\n        </section>\n      </Host>\n    );\n  }\n}\n\nexport type ContextMenuCallback = (\n  contextMenuInfo: ContextMenuInfo\n) => Promise<void>;\n\nexport type DeleteSelectionCallback = (ids: string[]) => Promise<void>;\n\nexport type LoadCallback = (\n  filters: AttributeFiltersData\n) => Promise<AttributeData[]>;\n\nexport type ObjectActionCallback = () => Promise<EntityData | undefined>;\n\nexport type OpenSelectionCallback = (ids: string[]) => Promise<void>;\n\nexport type SelectionChangeCallback = (ids: string[]) => Promise<void>;\n\nexport interface AttributeData {\n  id: string;\n  icon: string;\n  name: string;\n  type: string;\n  description: string;\n}\n\nexport interface AttributeFiltersData {\n  name?: string;\n  type?: string;\n  object?: string;\n}\n"],"mappings":"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"}
+{"version":3,"names":["mapOptionsToComboBoxItemModel","options","map","option","value","id","caption","label","startImgSrc","_a","iconName","wwAttributesCss","CSS_BUNDLES","FILTER_ICON","getIconPath","category","name","colorType","GxIdeWWAttributes","_GxIdeWWAttributes__componentLocale","set","this","_GxIdeWWAttributes_chGridEl","_GxIdeWWAttributes_contextMenuCallbackHandler","ev","contextMenuCallback","selection","selectedAttributesIds","clientX","clientY","_GxIdeWWAttributes_deleteSelectionCallbackHandle","deleteSelectionCallback","_GxIdeWWAttributes_deselectAll","__classPrivateFieldGet","selectAllRows","_GxIdeWWAttributes_getAttributes","loading","filters","trim","type","object","loadCallback","then","items","attributes","length","call","_GxIdeWWAttributes_listenChanges","addEventListener","detail","rowsId","selectionChangeCallback","preventDefault","stopPropagation","_GxIdeWWAttributes_openSelectionCallbackHandle","openSelectionCallback","_GxIdeWWAttributes_entityCallbackHandler","async","result","objectActionCallback","iconSrc","Promise","resolve","_GxIdeWWAttributes_entityValueChangedHandler","event","_GxIdeWWAttributes_renderAttributesGrid","tabularGridEmpty","h","class","main","ref","el","__classPrivateFieldSet","part","settingable","size","config","tabularGrid","colSize","maxContent","tableHead","auto","description","_GxIdeWWAttributes_evaluateAttributesGridContent","loaderTitle","loader","title","show","attr","rowid","src","icon","stateIconSrc","stateTitle","emptyStateTitle","isAnimated","_GxIdeWWAttributes_renderFilter","htmlFor","filter","debounce","onInput","_GxIdeWWAttributes_nameInputHandler","disabled","types","model","_GxIdeWWAttributes_typeInputHandler","labelPosition","defaultValue","selectEntityCallback","onValueChanged","_GxIdeWWAttributes_selectAll","e","componentWillLoad","Locale","getComponentStrings","componentDidLoad","keyDownHandler","eventInfo","document","activeElement","key","reload","validate","isValid","render","btnDisabled","matchingAttributesLabel","matchingAttribute","matchingAttributes","attributesLength","_b","Host","onClick","footer","btnSelectAll"],"sources":["src/components/ww-attributes/helpers.tsx","src/components/ww-attributes/ww-attributes.scss?tag=gx-ide-ww-attributes&encapsulation=shadow","src/components/ww-attributes/ww-attributes.tsx"],"sourcesContent":["import { ComboBoxModel } from \"@genexus/chameleon-controls-library\";\nimport { GxOption } from \"../..\";\n\nexport const mapOptionsToComboBoxItemModel = (\n  options: GxOption[]\n): ComboBoxModel => {\n  return options.map(option => {\n    return {\n      value: option.id,\n      caption: option.label,\n      startImgSrc: option.iconName ?? \"\"\n    };\n  });\n};\n","@import \"../../../node_modules/@genexus/mercury/dist/mercury.scss\"; // for the tabular-grid-cell-layout mixin\n\n$nameInlineSize: 40px;\n$moreBtnInlineSize: 64px;\n\n:host {\n  display: grid;\n  block-size: 100%;\n  overflow: auto;\n  grid-template-rows: max-content 1fr max-content;\n}\n\n.section {\n  display: contents;\n}\n// Header\n.header {\n  grid-template:\n    \"name type\" max-content\n    \"object object\" max-content;\n  grid-template-columns: 1fr 1fr;\n}\n.name__field {\n  grid-area: name;\n}\n.name__label {\n  inline-size: $nameInlineSize;\n}\n.type__field {\n  grid-area: type;\n}\n.more__btn {\n  grid-area: more;\n  inline-size: $moreBtnInlineSize;\n}\n.object-selector__field {\n  grid-area: object;\n}\n\n// Main\n.main {\n  overflow: auto;\n}\n\nch-tabular-grid.tabular-grid--empty::part(main) {\n  // WA to avoid scrollbar flickering when displaying the empty-state message\n  overflow: hidden;\n}\nch-tabular-grid-rowset-empty {\n  position: relative; // makes this the bounder element for the loader\n}\n\n@include tabular-grid-cell-layout(\n  $tabular-grid-selector: \".tabular-grid-row\",\n  $tabular-grid-cell-node-type: \"text\",\n  $tabular-grid-cell-apply-ellipsis: true,\n  $tabular-grid-affected-columns-nth-list: (\n    2,\n    3,\n    4\n  )\n);\n\n// WA: remove this when Mercury removes margin from p elements\n.matching-attributes {\n  margin: 0;\n}\n","/* eslint-disable @stencil-community/own-props-must-be-private */\n// Stencil\nimport {\n  Component,\n  Element,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  h\n} from \"@stencil/core\";\n// Other Libraries\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n// Custom Imports\nimport { config } from \"../../common/config\";\nimport { Locale } from \"../../common/locale\";\nimport { ContextMenuInfo, EntityData, GxOption } from \"../../common/types\";\nimport { mapOptionsToComboBoxItemModel } from \"./helpers\";\nimport { ChEditCustomEvent } from \"@genexus/chameleon-controls-library\";\nimport HTMLChTabularGridRowsetElement from \"@genexus/chameleon-controls-library/dist/types/components/tabular-grid/rowset/tabular-grid-rowset\";\nimport { GxIdeEntitySelectorCustomEvent } from \"../../components\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/button\",\n  \"components/edit\",\n  \"components/combo-box\",\n  \"components/tabular-grid\",\n  \"components/icon\",\n  \"utils/form\",\n  \"utils/layout\",\n  \"utils/spacing\",\n  \"chameleon/scrollbar\"\n];\n\nconst FILTER_ICON = getIconPath({\n  category: \"window-tools\",\n  name: \"filter\",\n  colorType: \"on-elevation\"\n});\n\n@Component({\n  tag: \"gx-ide-ww-attributes\",\n  styleUrl: \"ww-attributes.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/ww-attributes\"]\n})\nexport class GxIdeWWAttributes {\n  /**\n   * Component hard-coded strings translations.\n   */\n  #_componentLocale: any;\n\n  @Element() el: HTMLGxIdeWwAttributesElement;\n\n  /* References needed to collect data */\n  #chGridEl!: HTMLChTabularGridElement;\n\n  /**\n   * Attributes rendered in the table\n   */\n  @State() attributes: AttributeData[];\n\n  /**\n   * Selected attributes in the table of attributes\n   */\n  @State() selectedAttributesIds: string[] = [];\n\n  /**\n   * Show or hide advanced filters\n   */\n  @State() filterMore = false;\n\n  /**\n   * The attribute filter name\n   */\n  @State() name: string = \"\";\n\n  /**\n   * True if loadCallback hasn't been resolved yet\n   */\n  @State() loading: boolean = true;\n\n  /**\n   * The attribute object value\n   */\n  @State() object: EntityData;\n\n  /**\n   * The attribute filter type value\n   */\n  @State() type: string;\n\n  /**\n   * Callback invoked when user right-clicks on the grid\n   */\n  @Prop() readonly contextMenuCallback!: ContextMenuCallback;\n\n  /**\n   * Callback invoked when user deletes an object\n   */\n  @Prop() readonly deleteSelectionCallback!: DeleteSelectionCallback;\n\n  /**\n   * Callback invoked when user filters the objects\n   */\n  @Prop() readonly loadCallback!: LoadCallback;\n\n  /**\n   * Callback invoked when user executes filter action\n   */\n  @Prop() readonly objectActionCallback!: ObjectActionCallback;\n\n  /**\n   * Objects rendered in the object selector\n   */\n  @Prop() readonly objects!: GxOption[];\n\n  /**\n   * Callback invoked when user opens the selection dialog\n   */\n  @Prop() readonly openSelectionCallback!: OpenSelectionCallback;\n\n  /**\n   * Callback invoked when user selects or deselects an object\n   */\n  @Prop() readonly selectionChangeCallback!: SelectionChangeCallback;\n\n  /**\n   * Types rendered in the filter type selector\n   */\n  @Prop() readonly types!: GxOption[];\n\n  async componentWillLoad() {\n    this.#_componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  componentDidLoad() {\n    this.#listenChanges();\n    this.type = this.types[0].id; // before #getAttributes\n    this.#getAttributes();\n  }\n\n  @Listen(\"keydown\", { passive: true })\n  keyDownHandler(eventInfo: KeyboardEvent) {\n    if (document.activeElement === this.el) {\n      switch (eventInfo.key) {\n        case \"Enter\":\n          this.#openSelectionCallbackHandle();\n          break;\n        case \"Delete\":\n          this.#deleteSelectionCallbackHandle();\n          break;\n      }\n    }\n  }\n\n  /**\n   * Reloads the view, refreshing the filters and attributes table.\n   */\n  @Method()\n  async reload(): Promise<void> {\n    this.name = \"\";\n    this.type = this.types[0].id;\n    this.object = null;\n    this.#getAttributes();\n  }\n\n  /**\n   * Validate necessary data input\n   */\n  @Method()\n  async validate(): Promise<boolean> {\n    const isValid = true;\n    return isValid;\n  }\n\n  #contextMenuCallbackHandler = (ev: MouseEvent): void => {\n    this.contextMenuCallback({\n      selection: this.selectedAttributesIds,\n      clientX: ev.clientX,\n      clientY: ev.clientY\n    });\n  };\n\n  #deleteSelectionCallbackHandle = (): void => {\n    this.deleteSelectionCallback(this.selectedAttributesIds);\n  };\n\n  #deselectAll = (): void => {\n    (this.#chGridEl as any).selectAllRows(false);\n  };\n\n  #getAttributes = (): void => {\n    this.loading = true;\n    const filters: AttributeFiltersData = {\n      name: this.name.trim(),\n      type: this.type,\n      object: this.object?.id\n    };\n    this.loadCallback(filters).then((items: AttributeData[]) => {\n      this.attributes = items;\n      if (this.selectedAttributesIds?.length > 0) {\n        this.selectedAttributesIds = [];\n        this.#deselectAll();\n      }\n      this.loading = false;\n    });\n  };\n\n  #listenChanges = (): void => {\n    // for grid selection\n    this.#chGridEl.addEventListener(\"selectionChanged\", (ev: any): void => {\n      this.selectedAttributesIds = ev.detail.rowsId;\n      this.selectionChangeCallback(this.selectedAttributesIds);\n    });\n    this.#chGridEl.addEventListener(\"contextmenu\", (ev: MouseEvent): void => {\n      ev.preventDefault();\n      ev.stopPropagation();\n      this.#contextMenuCallbackHandler(ev);\n    });\n\n    this.#chGridEl.addEventListener(\"rowDoubleClicked\", (): void => {\n      this.#openSelectionCallbackHandle();\n    });\n  };\n\n  #openSelectionCallbackHandle = (): void => {\n    this.openSelectionCallback(this.selectedAttributesIds);\n  };\n\n  #entityCallbackHandler = async (): Promise<null> => {\n    const result = await this.objectActionCallback();\n    this.object = {\n      id: result.id,\n      name: result.name,\n      iconSrc: result.iconSrc\n    };\n    return new Promise(resolve => {\n      resolve(null);\n    });\n  };\n\n  #entityValueChangedHandler = (\n    event: GxIdeEntitySelectorCustomEvent<EntityData>\n  ) => {\n    this.object = event.detail;\n    this.#getAttributes();\n  };\n\n  #renderAttributesGrid = (): Element => {\n    const tabularGridEmpty = this.attributes?.length === 0 || !this.attributes;\n    return (\n      <ch-tabular-grid\n        class={{\n          \"tabular-grid\": true,\n          \"tabular-grid--empty\": tabularGridEmpty,\n          \"main\": true\n        }}\n        ref={(el: HTMLChTabularGridElement) => (this.#chGridEl = el)}\n        row-selection-mode=\"multiple\"\n        part=\"ch-grid-attributes\"\n      >\n        <ch-tabular-grid-columnset class=\"tabular-grid-column-set\">\n          <ch-tabular-grid-column\n            column-name=\"\"\n            column-name-position=\"text\"\n            settingable={false}\n            size={config.tabularGrid.colSize.maxContent}\n            class=\"tabular-grid-column\"\n          ></ch-tabular-grid-column>\n          <ch-tabular-grid-column\n            column-name={this.#_componentLocale.tableHead.name}\n            column-name-position=\"text\"\n            size={config.tabularGrid.colSize.auto}\n            class=\"tabular-grid-column\"\n            settingable={false}\n          ></ch-tabular-grid-column>\n          <ch-tabular-grid-column\n            column-name={this.#_componentLocale.tableHead.type}\n            column-name-position=\"text\"\n            class=\"tabular-grid-column\"\n            size={config.tabularGrid.colSize.auto}\n            settingable={false}\n          ></ch-tabular-grid-column>\n          <ch-tabular-grid-column\n            column-name={this.#_componentLocale.tableHead.description}\n            column-name-position=\"text\"\n            size={config.tabularGrid.colSize.auto}\n            class=\"tabular-grid-column\"\n            settingable={false}\n          ></ch-tabular-grid-column>\n        </ch-tabular-grid-columnset>\n\n        {this.#evaluateAttributesGridContent()}\n      </ch-tabular-grid>\n    );\n  };\n\n  #evaluateAttributesGridContent = (): HTMLChTabularGridRowsetElement => {\n    if (this.loading) {\n      return (\n        <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n          <ch-tabular-grid-rowset-empty>\n            <gx-ide-loader\n              loaderTitle={this.#_componentLocale.loader.title}\n              description={this.#_componentLocale.loader.description}\n              show\n            ></gx-ide-loader>\n          </ch-tabular-grid-rowset-empty>\n        </ch-tabular-grid-rowset>\n      );\n    } else if (this.attributes.length) {\n      return (\n        <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n          {this.attributes.map((attr: AttributeData) => (\n            <ch-tabular-grid-row class=\"tabular-grid-row\" rowid={attr.id}>\n              <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                <ch-image class=\"icon-sm\" src={attr.icon}></ch-image>\n              </ch-tabular-grid-cell>\n              <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                {attr.name}\n              </ch-tabular-grid-cell>\n              <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                {attr.type}\n              </ch-tabular-grid-cell>\n              <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                {attr.description}\n              </ch-tabular-grid-cell>\n            </ch-tabular-grid-row>\n          ))}\n        </ch-tabular-grid-rowset>\n      );\n    } else {\n      // filter returned none\n      return (\n        <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n          <ch-tabular-grid-rowset-empty>\n            <gx-ide-empty-state\n              stateIconSrc={FILTER_ICON}\n              stateTitle={this.#_componentLocale.emptyStateTitle}\n              isAnimated={true}\n            ></gx-ide-empty-state>\n          </ch-tabular-grid-rowset-empty>\n        </ch-tabular-grid-rowset>\n      );\n    }\n  };\n\n  #renderFilter = (): Element => {\n    return (\n      <header class=\"header field-group control-header-with-border spacing-body\">\n        <div class=\"field field-inline name__field\">\n          <label class=\"label name__label\" htmlFor=\"name\">\n            {this.#_componentLocale.filter.name}\n          </label>\n          <ch-edit\n            // Name\n            id=\"name\"\n            class=\"input\"\n            value={this.name}\n            debounce={300}\n            onInput={this.#nameInputHandler}\n            part=\"filter-name\"\n          ></ch-edit>\n        </div>\n\n        <div class=\"field field-inline type__field\">\n          <label class=\"label\" htmlFor=\"type\">\n            {this.#_componentLocale.filter.type}\n          </label>\n          <ch-combo-box-render\n            // Type\n            id=\"type\"\n            class=\"combo-box\"\n            disabled={!this.types}\n            value={this.type}\n            model={mapOptionsToComboBoxItemModel(this.types ?? [])}\n            part=\"filter-type\"\n            onInput={this.#typeInputHandler}\n          ></ch-combo-box-render>\n        </div>\n\n        {/* <button\n          // TODO: Check with Design if it maes sense to have a button that toggles only one control.\n          // More\n          class=\"button-primary more__btn\"\n          onClick={this.#showMoreFilter}\n          part=\"button button--more-less\"\n        >\n          {this.filterMore\n            ? this.#_componentLocale.filter.btnLess\n            : this.#_componentLocale.filter.btnMore}\n        </button> */}\n\n        <div class=\"field field-inline object-selector__field\">\n          <label class=\"label\" htmlFor=\"object-selector\">\n            {this.#_componentLocale.filter.object}\n          </label>\n          <gx-ide-entity-selector\n            // Object\n            id=\"object-selector\"\n            value={this.object}\n            labelPosition=\"none\"\n            defaultValue={null}\n            selectEntityCallback={this.#entityCallbackHandler}\n            onValueChanged={this.#entityValueChangedHandler}\n            part=\"filter-module-folder\"\n          ></gx-ide-entity-selector>\n        </div>\n      </header>\n    );\n  };\n\n  #selectAll = (): void => {\n    (this.#chGridEl as any).selectAllRows();\n  };\n\n  #nameInputHandler = (e: ChEditCustomEvent<string> | InputEvent) => {\n    this.name = (e as ChEditCustomEvent<string>).detail.trim();\n    this.#getAttributes();\n  };\n\n  #typeInputHandler = (e: CustomEvent<string> | InputEvent) => {\n    this.type = e.detail as string;\n    this.#getAttributes();\n  };\n\n  render(): void {\n    const btnDisabled = !this.attributes || this.attributes.length === 0;\n    const matchingAttributesLabel =\n      this.attributes?.length === 1\n        ? this.#_componentLocale.matchingAttribute\n        : this.#_componentLocale.matchingAttributes;\n    const attributesLength = this.attributes?.length || 0;\n\n    return (\n      <Host class=\"widget\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <section class=\"section\">\n          {this.#renderFilter()}\n\n          {this.#renderAttributesGrid()}\n\n          <footer class=\"control-footer control-footer-with-border spacing-body-block-end spacing-body-inline control-footer-space-between\">\n            <p class=\"body-regular-s matching-attributes\">\n              {`${attributesLength} ${matchingAttributesLabel}`}\n            </p>\n\n            <button\n              id=\"button-select-all\"\n              class=\"button-primary\"\n              onClick={this.#selectAll}\n              disabled={btnDisabled}\n              part=\"button button--select-all\"\n            >\n              {this.#_componentLocale.footer.btnSelectAll}\n            </button>\n          </footer>\n        </section>\n      </Host>\n    );\n  }\n}\n\nexport type ContextMenuCallback = (\n  contextMenuInfo: ContextMenuInfo\n) => Promise<void>;\n\nexport type DeleteSelectionCallback = (ids: string[]) => Promise<void>;\n\nexport type LoadCallback = (\n  filters: AttributeFiltersData\n) => Promise<AttributeData[]>;\n\nexport type ObjectActionCallback = () => Promise<EntityData | undefined>;\n\nexport type OpenSelectionCallback = (ids: string[]) => Promise<void>;\n\nexport type SelectionChangeCallback = (ids: string[]) => Promise<void>;\n\nexport interface AttributeData {\n  id: string;\n  icon: string;\n  name: string;\n  type: string;\n  description: string;\n}\n\nexport interface AttributeFiltersData {\n  name?: string;\n  type?: string;\n  object?: string;\n}\n"],"mappings":"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"}

package/dist/genexus-ide-ui/{p-10da0eee.entry.js → p-6d8b4f96.entry.js}

@@ -2,7 +2,7 @@ import { r as e, c as t, h as i, H as a, g as r } from "./p-49712340.js";
 
 import { L as s } from "./p-311eedf3.js";
 
-import { c as o } from "./p-78b90603.js";
+import { c as o } from "./p-13738332.js";
 
 import { a as l } from "./p-d1cb5507.js";
 
@@ -608,4 +608,4 @@ const b = class {
 b.style = h;
 
 export { b as gx_ide_ww_images };
-//# sourceMappingURL=p-10da0eee.entry.js.map
+//# sourceMappingURL=p-6d8b4f96.entry.js.map

package/dist/genexus-ide-ui/{p-8bb81d6f.entry.js → p-7153555f.entry.js}

@@ -34,7 +34,7 @@ var l = undefined && undefined.__classPrivateFieldGet || function(e, t, i, s) {
   return i === "m" ? s : i === "a" ? s.call(e) : s ? s.value : t.get(e);
 };
 
-var h, p, m, f, g, u, w, v;
+var h, p, m, u, f, g, w, v;
 
 const b = [ "resets/box-sizing", "components/tab", "components/tooltip", "components/tree-view", "utils/form--full", "utils/layout", "utils/typography", "utils/spacing", "chameleon/scrollbar" ];
 
@@ -55,15 +55,15 @@ const _ = class {
             const i = `${e && `(${e})`}${e && t ? ".*" : ""}${t && `(${t})`}`;
       this.navigationItemsRegExp = new RegExp(i, "i");
     }));
-    f.set(this, (e => {
+    u.set(this, (e => {
       var t;
       const i = (t = e.detail[0]) === null || t === void 0 ? void 0 : t.item.id;
       if (i) {
         this.itemSelectedCallback(i);
       }
     }));
-    g.set(this, (e => e.sort(((e, t) => e.caption.localeCompare(t.caption)))));
-    u.set(this, (e => {
+    f.set(this, (e => e.sort(((e, t) => e.caption.localeCompare(t.caption)))));
+    g.set(this, (e => {
       const t = e.detail;
       const i = [];
       const s = t.findIndex((e => e.itemId === "errors"));
@@ -190,9 +190,9 @@ const _ = class {
     }, i("div", {
       class: "header__description"
     }, i("h3", {
-      class: "heading-3"
+      class: "subtitle-regular-s"
     }, this.headerData.title), i("p", {
-      class: "text-body-regular-s header__description-p"
+      class: "body-regular-s header__description-p"
     }, this.headerData.description)), i("div", {
       class: "header__actions"
     }, i("div", {
@@ -231,8 +231,8 @@ const _ = class {
       filter: this.navigationItemsRegExp,
       filterType: "metadata",
       model: this.reportTreeItems,
-      onSelectedItemsChange: l(this, f, "f"),
-      sortItemsCallback: l(this, g, "f"),
+      onSelectedItemsChange: l(this, u, "f"),
+      sortItemsCallback: l(this, f, "f"),
       filterOptions: {
         autoExpand: true,
         hideMatchesAndShowNonMatches: false
@@ -247,7 +247,7 @@ const _ = class {
       successes: this.statusInfo.success.number,
       hideMessage: true,
       compact: true,
-      onSelectionChanged: l(this, u, "f")
+      onSelectionChanged: l(this, g, "f")
     }))));
   }
   static get assetsDirs() {
@@ -264,10 +264,10 @@ const _ = class {
   }
 };
 
-h = new WeakMap, p = new WeakMap, m = new WeakMap, f = new WeakMap, g = new WeakMap, 
-u = new WeakMap, w = new WeakMap, v = new WeakMap;
+h = new WeakMap, p = new WeakMap, m = new WeakMap, u = new WeakMap, f = new WeakMap, 
+g = new WeakMap, w = new WeakMap, v = new WeakMap;
 
 _.style = c;
 
 export { _ as gx_ide_navigation_report };
-//# sourceMappingURL=p-8bb81d6f.entry.js.map
+//# sourceMappingURL=p-7153555f.entry.js.map