@genexus/genexus-ide-ui 1.1.4 → 1.1.5

package/dist/genexus-ide-ui/{p-c747afac.entry.js → p-50eaa96d.entry.js}

@@ -1,23 +1,18 @@
 import { r as t, h as e, H as i, a as s } from "./p-25a9f1d7.js";
 
-import { g as a } from "./p-6e4208d8.js";
+import { g as a } from "./p-ede7bd20.js";
 
-import "./p-5ac47c69.js";
+import { c as n } from "./p-13738332.js";
 
-import { c as r } from "./p-13738332.js";
+import { L as r } from "./p-857866f8.js";
 
-import { L as l } from "./p-311eedf3.js";
+const mapOptionsToComboBoxItemModel = t => t.map((t => ({
+  value: t.id,
+  caption: t.label,
+  startImgSrc: t.iconName ?? ""
+})));
 
-const mapOptionsToComboBoxItemModel = t => t.map((t => {
-  var e;
-  return {
-    value: t.id,
-    caption: t.label,
-    startImgSrc: (e = t.iconName) !== null && e !== void 0 ? e : ""
-  };
-}));
-
-const n = ':host{display:grid;block-size:100%;overflow:auto;grid-template-rows:max-content 1fr max-content}.section{display:contents}.header{grid-template:"name type" max-content "object object" max-content;grid-template-columns:1fr 1fr}.name__field{grid-area:name}.name__label{inline-size:40px}.type__field{grid-area:type}.more__btn{grid-area:more;inline-size:64px}.object-selector__field{grid-area:object}.main{overflow:auto}ch-tabular-grid.tabular-grid--empty::part(main){overflow:hidden}ch-tabular-grid-rowset-empty{position:relative}.tabular-grid-row ch-tabular-grid-cell:is(:nth-child(2),:nth-child(3),:nth-child(4)){padding-block:var(--grid-cell__padding-block);padding-inline:var(--grid-cell__padding-inline);align-items:start;justify-content:start;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.matching-attributes{margin:0}';
+const l = ':host{display:grid;block-size:100%;overflow:auto;grid-template-rows:max-content 1fr max-content}.section{display:contents}.header{grid-template:"name type" max-content "object object" max-content;grid-template-columns:1fr 1fr}.name__field{grid-area:name}.name__label{inline-size:40px}.type__field{grid-area:type}.more__btn{grid-area:more;inline-size:64px}.object-selector__field{grid-area:object}.main{overflow:auto}ch-tabular-grid.tabular-grid--empty::part(main){overflow:hidden}ch-tabular-grid-rowset-empty{position:relative}.tabular-grid-row ch-tabular-grid-cell:is(:nth-child(2),:nth-child(3),:nth-child(4)){padding-block:var(--grid-cell__padding-block);padding-inline:var(--grid-cell__padding-inline);align-items:start;justify-content:start;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-inline-size:0}.matching-attributes{margin:0}';
 
 var o = undefined && undefined.__classPrivateFieldGet || function(t, e, i, s) {
   if (i === "a" && !s) throw new TypeError("Private accessor was defined without a getter");
@@ -32,9 +27,9 @@ var c = undefined && undefined.__classPrivateFieldSet || function(t, e, i, s, a)
   return s === "a" ? a.call(t, i) : a ? a.value = i : e.set(t, i), i;
 };
 
-var d, h, u, f, m, b, p, g, w, v, y, k, _, x, W, j;
+var h, d, u, f, m, b, p, g, w, y, k, v, _, x, W, M;
 
-const M = [ "resets/box-sizing", "components/button", "components/edit", "components/combo-box", "components/tabular-grid", "components/icon", "utils/form", "utils/layout", "utils/spacing", "chameleon/scrollbar" ];
+const j = [ "resets/box-sizing", "components/button", "components/edit", "components/combo-box", "components/tabular-grid", "components/icon", "utils/form", "utils/layout", "utils/spacing", "chameleon/scrollbar" ];
 
 const z = a({
   category: "window-tools",
@@ -47,8 +42,8 @@ const T = class {
     t(this, i);
     /**
          * Component hard-coded strings translations.
-         */    d.set(this, void 0);
-    /* References needed to collect data */    h.set(this, void 0);
+         */    h.set(this, void 0);
+    /* References needed to collect data */    d.set(this, void 0);
     u.set(this, (t => {
       this.contextMenuCallback({
         selection: this.selectedAttributesIds,
@@ -60,20 +55,18 @@ const T = class {
       this.deleteSelectionCallback(this.selectedAttributesIds);
     }));
     m.set(this, (() => {
-      o(this, h, "f").selectAllRows(false);
+      o(this, d, "f").selectAllRows(false);
     }));
     b.set(this, (() => {
-      var t;
       this.loading = true;
-      const e = {
+      const t = {
         name: this.name.trim(),
         type: this.type,
-        object: (t = this.object) === null || t === void 0 ? void 0 : t.id
+        object: this.object?.id
       };
-      this.loadCallback(e).then((t => {
-        var e;
+      this.loadCallback(t).then((t => {
         this.attributes = t;
-        if (((e = this.selectedAttributesIds) === null || e === void 0 ? void 0 : e.length) > 0) {
+        if (this.selectedAttributesIds?.length > 0) {
           this.selectedAttributesIds = [];
           o(this, m, "f").call(this);
         }
@@ -82,16 +75,16 @@ const T = class {
     }));
     p.set(this, (() => {
       // for grid selection
-      o(this, h, "f").addEventListener("selectionChanged", (t => {
+      o(this, d, "f").addEventListener("selectionChanged", (t => {
         this.selectedAttributesIds = t.detail.rowsId;
         this.selectionChangeCallback(this.selectedAttributesIds);
       }));
-      o(this, h, "f").addEventListener("contextmenu", (t => {
+      o(this, d, "f").addEventListener("contextmenu", (t => {
         t.preventDefault();
         t.stopPropagation();
         o(this, u, "f").call(this, t);
       }));
-      o(this, h, "f").addEventListener("rowDoubleClicked", (() => {
+      o(this, d, "f").addEventListener("rowDoubleClicked", (() => {
         o(this, g, "f").call(this);
       }));
     }));
@@ -109,20 +102,19 @@ const T = class {
         t(null);
       }));
     }));
-    v.set(this, (t => {
+    y.set(this, (t => {
       this.object = t.detail;
       o(this, b, "f").call(this);
     }));
-    y.set(this, (() => {
-      var t;
-      const i = ((t = this.attributes) === null || t === void 0 ? void 0 : t.length) === 0 || !this.attributes;
+    k.set(this, (() => {
+      const t = this.attributes?.length === 0 || !this.attributes;
       return e("ch-tabular-grid", {
         class: {
           "tabular-grid": true,
-          "tabular-grid--empty": i,
+          "tabular-grid--empty": t,
           main: true
         },
-        ref: t => c(this, h, t, "f"),
+        ref: t => c(this, d, t, "f"),
         "row-selection-mode": "multiple",
         part: "ch-grid-attributes"
       }, e("ch-tabular-grid-columnset", {
@@ -131,35 +123,35 @@ const T = class {
         "column-name": "",
         "column-name-position": "text",
         settingable: false,
-        size: r.tabularGrid.colSize.maxContent,
+        size: n.tabularGrid.colSize.maxContent,
         class: "tabular-grid-column"
       }), e("ch-tabular-grid-column", {
-        "column-name": o(this, d, "f").tableHead.name,
+        "column-name": o(this, h, "f").tableHead.name,
         "column-name-position": "text",
-        size: r.tabularGrid.colSize.auto,
+        size: n.tabularGrid.colSize.auto,
         class: "tabular-grid-column",
         settingable: false
       }), e("ch-tabular-grid-column", {
-        "column-name": o(this, d, "f").tableHead.type,
+        "column-name": o(this, h, "f").tableHead.type,
         "column-name-position": "text",
         class: "tabular-grid-column",
-        size: r.tabularGrid.colSize.auto,
+        size: n.tabularGrid.colSize.auto,
         settingable: false
       }), e("ch-tabular-grid-column", {
-        "column-name": o(this, d, "f").tableHead.description,
+        "column-name": o(this, h, "f").tableHead.description,
         "column-name-position": "text",
-        size: r.tabularGrid.colSize.auto,
+        size: n.tabularGrid.colSize.auto,
         class: "tabular-grid-column",
         settingable: false
-      })), o(this, k, "f").call(this));
+      })), o(this, v, "f").call(this));
     }));
-    k.set(this, (() => {
+    v.set(this, (() => {
       if (this.loading) {
         return e("ch-tabular-grid-rowset", {
           class: "tabular-grid-rowset"
         }, e("ch-tabular-grid-rowset-empty", null, e("gx-ide-loader", {
-          loaderTitle: o(this, d, "f").loader.title,
-          description: o(this, d, "f").loader.description,
+          loaderTitle: o(this, h, "f").loader.title,
+          description: o(this, h, "f").loader.description,
           show: true
         })));
       } else if (this.attributes.length) {
@@ -186,66 +178,63 @@ const T = class {
           class: "tabular-grid-rowset"
         }, e("ch-tabular-grid-rowset-empty", null, e("gx-ide-empty-state", {
           stateIconSrc: z,
-          stateTitle: o(this, d, "f").emptyStateTitle,
+          stateTitle: o(this, h, "f").emptyStateTitle,
           isAnimated: true
         })));
       }
     }));
-    _.set(this, (() => {
-      var t;
-      return e("header", {
-        class: "header field-group control-header-with-border spacing-body"
-      }, e("div", {
-        class: "field field-inline name__field"
-      }, e("label", {
-        class: "label name__label",
-        htmlFor: "name"
-      }, o(this, d, "f").filter.name), e("ch-edit", {
-        // Name
-        id: "name",
-        class: "input",
-        value: this.name,
-        debounce: 300,
-        onInput: o(this, W, "f"),
-        part: "filter-name"
-      })), e("div", {
-        class: "field field-inline type__field"
-      }, e("label", {
-        class: "label",
-        htmlFor: "type"
-      }, o(this, d, "f").filter.type), e("ch-combo-box-render", {
-        // Type
-        id: "type",
-        class: "combo-box",
-        disabled: !this.types,
-        value: this.type,
-        model: mapOptionsToComboBoxItemModel((t = this.types) !== null && t !== void 0 ? t : []),
-        part: "filter-type",
-        onInput: o(this, j, "f")
-      })), e("div", {
-        class: "field field-inline object-selector__field"
-      }, e("label", {
-        class: "label",
-        htmlFor: "object-selector"
-      }, o(this, d, "f").filter.object), e("gx-ide-entity-selector", {
-        // Object
-        id: "object-selector",
-        value: this.object,
-        labelPosition: "none",
-        defaultValue: null,
-        selectEntityCallback: o(this, w, "f"),
-        onValueChanged: o(this, v, "f"),
-        part: "filter-module-folder"
-      })));
-    }));
+    _.set(this, (() => e("header", {
+      class: "header field-group control-header-with-border spacing-body"
+    }, e("div", {
+      class: "field field-inline name__field"
+    }, e("label", {
+      class: "label name__label",
+      htmlFor: "name"
+    }, o(this, h, "f").filter.name), e("ch-edit", {
+      // Name
+      id: "name",
+      class: "input",
+      value: this.name,
+      debounce: 300,
+      onInput: o(this, W, "f"),
+      part: "filter-name"
+    })), e("div", {
+      class: "field field-inline type__field"
+    }, e("label", {
+      class: "label",
+      htmlFor: "type"
+    }, o(this, h, "f").filter.type), e("ch-combo-box-render", {
+      // Type
+      id: "type",
+      class: "combo-box",
+      disabled: !this.types,
+      value: this.type,
+      model: mapOptionsToComboBoxItemModel(this.types ?? []),
+      part: "filter-type",
+      onInput: o(this, M, "f")
+    })), e("div", {
+      class: "field field-inline object-selector__field"
+    }, e("label", {
+      class: "label",
+      htmlFor: "object-selector"
+    }, o(this, h, "f").filter.object), e("gx-ide-entity-selector", {
+      // Object
+      id: "object-selector",
+      value: this.object,
+      labelPosition: "none",
+      defaultValue: null,
+      selectEntityCallback: o(this, w, "f"),
+      onValueChanged: o(this, y, "f"),
+      part: "filter-module-folder"
+    })))));
     x.set(this, (() => {
-      o(this, h, "f").selectAllRows();
+      o(this, d, "f").selectAllRows();
     }));
     W.set(this, (t => {
       this.name = t.detail.trim();
       o(this, b, "f").call(this);
     }));
-    j.set(this, (t => {
+    M.set(this, (t => {
       this.type = t.detail;
       o(this, b, "f").call(this);
     }));
@@ -266,7 +255,7 @@ const T = class {
     this.types = undefined;
   }
   async componentWillLoad() {
-    c(this, d, await l.getComponentStrings(this.el), "f");
+    c(this, h, await r.getComponentStrings(this.el), "f");
   }
   componentDidLoad() {
     o(this, p, "f").call(this);
@@ -302,27 +291,26 @@ const T = class {
     return t;
   }
   render() {
-    var t, s;
-    const a = !this.attributes || this.attributes.length === 0;
-    const r = ((t = this.attributes) === null || t === void 0 ? void 0 : t.length) === 1 ? o(this, d, "f").matchingAttribute : o(this, d, "f").matchingAttributes;
-    const l = ((s = this.attributes) === null || s === void 0 ? void 0 : s.length) || 0;
+    const t = !this.attributes || this.attributes.length === 0;
+    const s = this.attributes?.length === 1 ? o(this, h, "f").matchingAttribute : o(this, h, "f").matchingAttributes;
+    const a = this.attributes?.length || 0;
     return e(i, {
       class: "widget"
     }, e("ch-theme", {
-      model: M
+      model: j
     }), e("section", {
       class: "section"
-    }, o(this, _, "f").call(this), o(this, y, "f").call(this), e("footer", {
+    }, o(this, _, "f").call(this), o(this, k, "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: "body-regular-s matching-attributes"
-    }, `${l} ${r}`), e("button", {
+    }, `${a} ${s}`), e("button", {
       id: "button-select-all",
       class: "button-primary",
       onClick: o(this, x, "f"),
-      disabled: a,
+      disabled: t,
       part: "button button--select-all"
-    }, o(this, d, "f").footer.btnSelectAll))));
+    }, o(this, h, "f").footer.btnSelectAll))));
   }
   static get assetsDirs() {
     return [ "gx-ide-assets/ww-attributes" ];
@@ -332,12 +320,12 @@ const T = class {
   }
 };
 
-d = new WeakMap, h = new WeakMap, u = new WeakMap, f = new WeakMap, m = new WeakMap, 
-b = new WeakMap, p = new WeakMap, g = new WeakMap, w = new WeakMap, v = new WeakMap, 
-y = new WeakMap, k = new WeakMap, _ = new WeakMap, x = new WeakMap, W = new WeakMap, 
-j = new WeakMap;
+h = new WeakMap, d = new WeakMap, u = new WeakMap, f = new WeakMap, m = new WeakMap, 
+b = new WeakMap, p = new WeakMap, g = new WeakMap, w = new WeakMap, y = new WeakMap, 
+k = new WeakMap, v = new WeakMap, _ = new WeakMap, x = new WeakMap, W = new WeakMap, 
+M = new WeakMap;
 
-T.style = n;
+T.style = l;
 
 export { T as gx_ide_ww_attributes };
-//# sourceMappingURL=p-c747afac.entry.js.map
+//# sourceMappingURL=p-50eaa96d.entry.js.map

package/dist/genexus-ide-ui/p-50eaa96d.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["mapOptionsToComboBoxItemModel","options","map","option","value","id","caption","label","startImgSrc","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","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/assets/scss/helpers.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-51601b85.js

@@ -0,0 +1,145 @@
+import { h as e } from "./p-25a9f1d7.js";
+
+const t = [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ];
+
+const daysFromToday = e => {
+  const t = new Date;
+  // To calculate the time difference of two dates
+    const n = t.getTime() - e.getTime();
+  // To calculate the no. of days between two dates
+    const s = n / (1e3 * 3600 * 24);
+  return Math.floor(s);
+};
+
+// - - - - - - - - - - - -
+// Date Functions
+// - - - - - - - - - - - -
+const isToday = e => {
+  const t = new Date;
+  if (t.toDateString() === e.toDateString()) {
+    return true;
+  }
+  return false;
+};
+
+const isYesterday = e => {
+  const t = new Date;
+  t.setDate(t.getDate() - 1);
+  if (t.toDateString() === e.toDateString()) {
+    return true;
+  }
+  return false;
+};
+
+const formatDate = (e, n = "date-time") => {
+  let s;
+  // validate date
+  // undefined or null
+    if (e === undefined || e === null) {
+    return "";
+  }
+  // If the date object is invalid it will return 'NaN' on getTime() and NaN is never equal to itself
+    const r = e.getTime() === e.getTime();
+  if (!r) {
+    return "Invalid date";
+  }
+  let o = "en-US";
+  const c = document.getElementsByTagName("html")[0].getAttribute("lang")?.valueOf();
+  if (c === "es") {
+    o = "es-ES";
+  }
+  s = e.toLocaleDateString(o);
+  const a = e.getFullYear();
+  const i = String(e.getMonth() + 1).padStart(2, "0");
+  const u = String(e.getDate()).padStart(2, "0");
+  const l = String(e.getHours()).padStart(2, "0");
+  const d = String(e.getMinutes()).padStart(2, "0");
+  const $ = `${l}:${d}`;
+  if (n === "date-time") {
+    s += ` / ${e.toLocaleTimeString()}`;
+  } else if (n === "date-time-short") {
+    // No seconds
+    if (o === "es-ES") {
+      s = `${a}-${i}-${u} ${$}`;
+    } else {
+      s = `${i}/${u}/${a} ${$}`;
+    }
+  } else {
+    const n = daysFromToday(e);
+    const r = new Date;
+    const c = r.getFullYear();
+    if (isToday(e)) {
+      return `Today ${$}`;
+    } else if (isYesterday(e)) {
+      return `Yesterday ${$}`;
+    } else if (n <= 7) {
+      // If one week or less, just show the day of the week, and the time
+      const n = t[e.getDay()];
+      return `${n} ${$}`;
+    } else if (c === a) {
+      // If current year, show day number and month name. Example: November 17th
+      if (o === "es-ES") {
+        s = `${u} de ${e.toLocaleString("es-ES", {
+          month: "long"
+        })} ${$}`;
+      } else {
+        s = `${e.toLocaleString("en-US", {
+          month: "long"
+        })} ${u} ${$}`;
+      }
+    } else {
+      // Display date as usual
+      s = formatDate(e, "date-time-short");
+    }
+  }
+  return s;
+};
+
+const escapeRegExp = e => e.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+
+/**
+ * @description this function highlights the character(s) that match(es) the filter value.
+ * hiChar comes from (hi)light (Char)acters
+ * @param text the string to find the filter value on
+ * @param filterValue the filter value
+ * @returns a span element
+ */ const hiChar = function(t, n) {
+  if (t && n) {
+    const s = escapeRegExp(n);
+    const r = new RegExp(s, "gi");
+    return e("span", {
+      innerHTML: t.replace(r, '<span class="hiChar">$&</span>')
+    });
+  } else {
+    return t;
+  }
+};
+
+const closeOnOutsideClickHandler = (e, t) => {
+  if (!e.composedPath().includes(t)) {
+    return true;
+  }
+};
+
+const mapOptionsToComboBoxItemModel = e => e.map((e => ({
+  value: e.id,
+  caption: e.label
+})));
+
+const renderChCheckboxItems = (t, n, s) => t?.map((t => {
+  const r = s?.find((e => t.value === e || t.id === e));
+  return e("ch-checkbox", {
+    name: t.name,
+    class: "checkbox",
+    checkedValue: t.value || t.id,
+    caption: t.label,
+    disabled: t.disabled,
+    value: r,
+    onInput: n,
+    startImgSrc: t.iconName,
+    key: t.value || t.id
+  });
+}));
+
+export { closeOnOutsideClickHandler as c, formatDate as f, hiChar as h, mapOptionsToComboBoxItemModel as m, renderChCheckboxItems as r };
+//# sourceMappingURL=p-51601b85.js.map

package/dist/genexus-ide-ui/p-51601b85.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["daysOfWeek","daysFromToday","date","today","Date","timeDifference","getTime","daysDifference","Math","floor","isToday","toDateString","isYesterday","yesterday","setDate","getDate","formatDate","type","formattedDate","undefined","dateIsValid","locale","lang","document","getElementsByTagName","getAttribute","valueOf","toLocaleDateString","year","getFullYear","month","String","getMonth","padStart","day","hours","getHours","minutes","getMinutes","time","toLocaleTimeString","daysPassedFromToday","currentYear","getDay","toLocaleString","escapeRegExp","str","replace","hiChar","text","filterValue","escapedFilterValue","re","RegExp","h","innerHTML","closeOnOutsideClickHandler","eventInfo","ref","composedPath","includes","mapOptionsToComboBoxItemModel","options","map","option","value","id","caption","label","renderChCheckboxItems","frontEndCheckboxInputHandler","checkedIds","find","name","class","checkedValue","disabled","onInput","startImgSrc","iconName","key"],"sources":["src/common/helpers.tsx"],"sourcesContent":["import { h } from \"@stencil/core\";\n\nimport {\n  ChCheckboxCustomEvent,\n  ComboBoxModel,\n  TreeViewItemModel\n} from \"@genexus/chameleon-controls-library\";\nexport type ChCheckboxArray = HTMLChCheckboxElement[] | null;\n\nimport { GxOption } from \"./types\";\n\nconst daysOfWeek = [\n  \"Sunday\",\n  \"Monday\",\n  \"Tuesday\",\n  \"Wednesday\",\n  \"Thursday\",\n  \"Friday\",\n  \"Saturday\"\n];\n\n/**\n * @param element an HTMLElement\n * @returns an alphabetically ordered array of all the parts and exportparts the element contains.\n */\nexport const getElementSelectorParts = (element: HTMLElement) => {\n  const queries: string[] = [];\n  const elementParts = element.shadowRoot?.querySelectorAll(`[part]`);\n  const elementExportParts =\n    element.shadowRoot?.querySelectorAll(`[exportparts]`);\n\n  elementParts?.forEach(el => {\n    queries.push(\n      `${element.tagName.toLowerCase()}::part(${el.getAttribute(\"part\")})`\n    );\n  });\n  elementExportParts?.forEach(el => {\n    queries.push(\n      ...[\n        ...el.getAttribute(\"exportparts\").matchAll(/(?:[\\w-]+:)?([\\w-]+)/g)\n      ].map(item => `${element.tagName.toLowerCase()}::part(${item[1]})`)\n    );\n  });\n\n  return queries.sort();\n};\n\n/**\n * @param selector a part selector\n * @returns A reference to the element the part belongs to.\n */\nexport const querySelectorPart = (selector: string) => {\n  const querySelectorDeep = (\n    element: HTMLElement,\n    parts: string\n  ): HTMLElement => {\n    const shadow = element.shadowRoot;\n    const partList = parts.split(\" \");\n\n    const partElement: HTMLElement = shadow.querySelector(\n      partList.map(partName => `[part~=\"${partName}\"]`).join(\"\")\n    );\n    if (partElement) {\n      return partElement;\n    }\n\n    const exportPartElement: HTMLElement = shadow.querySelector(\n      partList.map(partName => `[exportparts*=\"${partName}\"]`).join(\"\")\n    );\n    if (exportPartElement) {\n      const exportPartList: string[] = [];\n      const exportparts = exportPartElement.getAttribute(\"exportparts\");\n\n      partList.forEach(partItem => {\n        const exportPartName = exportparts.match(\n          `(?:([\\\\w-]+):)?(${partItem})`\n        )[1];\n        if (exportPartName) {\n          exportPartList.push(exportPartName);\n        }\n      });\n\n      if (partList.length === exportPartList.length) {\n        return querySelectorDeep(exportPartElement, exportPartList.join(\" \"));\n      }\n    }\n\n    return null;\n  };\n\n  const selectorItems = selector.match(\"(.*)::part\\\\(([^)]+)\\\\)\");\n  const entity = selectorItems[1];\n  const partName = selectorItems[2];\n\n  return querySelectorDeep(document.querySelector(entity), partName);\n};\n\nconst daysFromToday = (date: Date): number => {\n  const today = new Date();\n  // To calculate the time difference of two dates\n  const timeDifference = today.getTime() - date.getTime();\n  // To calculate the no. of days between two dates\n  const daysDifference = timeDifference / (1000 * 3600 * 24);\n  return Math.floor(daysDifference);\n};\n\n// - - - - - - - - - - - -\n// Date Functions\n// - - - - - - - - - - - -\n\nconst isToday = (date: Date): boolean => {\n  const today = new Date();\n  if (today.toDateString() === date.toDateString()) {\n    return true;\n  }\n  return false;\n};\n\nconst isYesterday = (date: Date): boolean => {\n  const yesterday = new Date();\n  yesterday.setDate(yesterday.getDate() - 1);\n  if (yesterday.toDateString() === date.toDateString()) {\n    return true;\n  }\n  return false;\n};\n\nexport const formatDate = (\n  date: Date,\n  type: FormatDateType = \"date-time\"\n): string => {\n  let formattedDate;\n  // validate date\n  // undefined or null\n  if (date === undefined || date === null) {\n    return \"\";\n  }\n  // If the date object is invalid it will return 'NaN' on getTime() and NaN is never equal to itself\n  const dateIsValid = date.getTime() === date.getTime();\n  if (!dateIsValid) {\n    return \"Invalid date\";\n  }\n  let locale = \"en-US\";\n  const lang = document\n    .getElementsByTagName(\"html\")[0]\n    .getAttribute(\"lang\")\n    ?.valueOf();\n  if (lang === \"es\") {\n    locale = \"es-ES\";\n  }\n  formattedDate = date.toLocaleDateString(locale);\n  const year = date.getFullYear();\n  const month = String(date.getMonth() + 1).padStart(2, \"0\");\n  const day = String(date.getDate()).padStart(2, \"0\");\n  const hours = String(date.getHours()).padStart(2, \"0\");\n  const minutes = String(date.getMinutes()).padStart(2, \"0\");\n  const time = `${hours}:${minutes}`;\n  if (type === \"date-time\") {\n    formattedDate += ` / ${date.toLocaleTimeString()}`;\n  } else if (type === \"date-time-short\") {\n    // No seconds\n    if (locale === \"es-ES\") {\n      formattedDate = `${year}-${month}-${day} ${time}`;\n    } else {\n      formattedDate = `${month}/${day}/${year} ${time}`;\n    }\n  } else if (\"pretty\") {\n    const daysPassedFromToday = daysFromToday(date);\n    const today = new Date();\n    const currentYear = today.getFullYear();\n    if (isToday(date)) {\n      return `Today ${time}`;\n    } else if (isYesterday(date)) {\n      return `Yesterday ${time}`;\n    } else if (daysPassedFromToday <= 7) {\n      // If one week or less, just show the day of the week, and the time\n      const day = daysOfWeek[date.getDay()];\n      return `${day} ${time}`;\n    } else if (currentYear === year) {\n      // If current year, show day number and month name. Example: November 17th\n      if (locale === \"es-ES\") {\n        formattedDate = `${day} de ${date.toLocaleString(\"es-ES\", {\n          month: \"long\"\n        })} ${time}`;\n      } else {\n        formattedDate = `${date.toLocaleString(\"en-US\", {\n          month: \"long\"\n        })} ${day} ${time}`;\n      }\n    } else {\n      // Display date as usual\n      formattedDate = formatDate(date, \"date-time-short\");\n    }\n  }\n  return formattedDate;\n};\n\nexport type FormatDateType =\n  | \"date\"\n  | \"date-time\"\n  | \"date-time-short\"\n  | \"pretty\";\n\n// - - - - - - - - - - - -\n// /End of Date Functions\n// - - - - - - - - - - - -\n\n/* Count the total tree nodes (by default it does not count the first level nodes)*/\nexport const countTreeItems = (\n  treeModel: TreeViewItemModel[],\n  children = false\n): number => {\n  let totalNodes = 0;\n  treeModel.forEach(node => {\n    children && totalNodes++;\n    if (node.items) {\n      totalNodes += countTreeItems(node.items, true);\n    }\n  });\n  return totalNodes;\n};\n\n/**\n * @description it evaluates the initial selected combo item\n * @param options an array of GxOption\n * @returns the initial combo value, which in this case is the id\n */\nexport const setInitialComboValue = (options: GxOption[]): string => {\n  const selected = options.find(option => option.selected);\n  if (selected) {\n    return selected.value || selected.id;\n  } else {\n    return options[0].value || options[0].id;\n  }\n};\n\nexport const escapeRegExp = (str: string) => {\n  return str.replace(/[.*+?^${}()|[\\]\\\\]/g, \"\\\\$&\");\n};\n\n/**\n * @description this function highlights the character(s) that match(es) the filter value.\n * hiChar comes from (hi)light (Char)acters\n * @param text the string to find the filter value on\n * @param filterValue the filter value\n * @returns a span element\n */\nexport const hiChar = function (text: string, filterValue: string) {\n  if (text && filterValue) {\n    const escapedFilterValue = escapeRegExp(filterValue);\n    const re = new RegExp(escapedFilterValue, \"gi\");\n    return (\n      <span\n        innerHTML={text.replace(re, '<span class=\"hiChar\">$&</span>')}\n      ></span>\n    );\n  } else {\n    return text;\n  }\n};\n\nexport const closeOnOutsideClickHandler = (\n  eventInfo: PointerEvent,\n  ref: HTMLElement\n): true | void => {\n  if (!eventInfo.composedPath().includes(ref)) {\n    return true;\n  }\n};\n\nexport const mapOptionsToComboBoxItemModel = (\n  options: GxOption[]\n): ComboBoxModel =>\n  options.map(option => ({\n    value: option.id,\n    caption: option.label\n    // startImgSrc: option.iconName\n  }));\n\nexport const renderChCheckboxItems = (\n  options: GxOption[] | undefined,\n  frontEndCheckboxInputHandler: (\n    event: ChCheckboxCustomEvent<string> | InputEvent\n  ) => void,\n  checkedIds: string[]\n): HTMLChCheckboxElement[] => {\n  return options?.map(option => {\n    const value = checkedIds?.find(\n      id => option.value === id || option.id === id\n    );\n    return (\n      <ch-checkbox\n        name={option.name}\n        class=\"checkbox\"\n        checkedValue={option.value || option.id}\n        caption={option.label}\n        disabled={option.disabled}\n        value={value}\n        onInput={frontEndCheckboxInputHandler}\n        startImgSrc={option.iconName}\n        key={option.value || option.id}\n      ></ch-checkbox>\n    );\n  });\n};\n"],"mappings":";;AAWA,MAAMA,IAAa,EACjB,UACA,UACA,WACA,aACA,YACA,UACA;;AA+EF,MAAMC,gBAAiBC;EACrB,MAAMC,IAAQ,IAAIC;;IAElB,MAAMC,IAAiBF,EAAMG,YAAYJ,EAAKI;;IAE9C,MAAMC,IAAiBF,KAAkB,MAAO,OAAO;EACvD,OAAOG,KAAKC,MAAMF;AAAe;;;;0BAOnC;MAAMG,UAAWR;EACf,MAAMC,IAAQ,IAAIC;EAClB,IAAID,EAAMQ,mBAAmBT,EAAKS,gBAAgB;IAChD,OAAO;;EAET,OAAO;AAAK;;AAGd,MAAMC,cAAeV;EACnB,MAAMW,IAAY,IAAIT;EACtBS,EAAUC,QAAQD,EAAUE,YAAY;EACxC,IAAIF,EAAUF,mBAAmBT,EAAKS,gBAAgB;IACpD,OAAO;;EAET,OAAO;AAAK;;MAGDK,aAAa,CACxBd,GACAe,IAAuB;EAEvB,IAAIC;;;IAGJ,IAAIhB,MAASiB,aAAajB,MAAS,MAAM;IACvC,OAAO;;;IAGT,MAAMkB,IAAclB,EAAKI,cAAcJ,EAAKI;EAC5C,KAAKc,GAAa;IAChB,OAAO;;EAET,IAAIC,IAAS;EACb,MAAMC,IAAOC,SACVC,qBAAqB,QAAQ,GAC7BC,aAAa,SACZC;EACJ,IAAIJ,MAAS,MAAM;IACjBD,IAAS;;EAEXH,IAAgBhB,EAAKyB,mBAAmBN;EACxC,MAAMO,IAAO1B,EAAK2B;EAClB,MAAMC,IAAQC,OAAO7B,EAAK8B,aAAa,GAAGC,SAAS,GAAG;EACtD,MAAMC,IAAMH,OAAO7B,EAAKa,WAAWkB,SAAS,GAAG;EAC/C,MAAME,IAAQJ,OAAO7B,EAAKkC,YAAYH,SAAS,GAAG;EAClD,MAAMI,IAAUN,OAAO7B,EAAKoC,cAAcL,SAAS,GAAG;EACtD,MAAMM,IAAO,GAAGJ,KAASE;EACzB,IAAIpB,MAAS,aAAa;IACxBC,KAAiB,MAAMhB,EAAKsC;SACvB,IAAIvB,MAAS,mBAAmB;;IAErC,IAAII,MAAW,SAAS;MACtBH,IAAgB,GAAGU,KAAQE,KAASI,KAAOK;WACtC;MACLrB,IAAgB,GAAGY,KAASI,KAAON,KAAQW;;SAE1B;IACnB,MAAME,IAAsBxC,cAAcC;IAC1C,MAAMC,IAAQ,IAAIC;IAClB,MAAMsC,IAAcvC,EAAM0B;IAC1B,IAAInB,QAAQR,IAAO;MACjB,OAAO,SAASqC;WACX,IAAI3B,YAAYV,IAAO;MAC5B,OAAO,aAAaqC;WACf,IAAIE,KAAuB,GAAG;;MAEnC,MAAMP,IAAMlC,EAAWE,EAAKyC;MAC5B,OAAO,GAAGT,KAAOK;WACZ,IAAIG,MAAgBd,GAAM;;MAE/B,IAAIP,MAAW,SAAS;QACtBH,IAAgB,GAAGgB,QAAUhC,EAAK0C,eAAe,SAAS;UACxDd,OAAO;cACHS;aACD;QACLrB,IAAgB,GAAGhB,EAAK0C,eAAe,SAAS;UAC9Cd,OAAO;cACHI,KAAOK;;WAEV;;MAELrB,IAAgBF,WAAWd,GAAM;;;EAGrC,OAAOgB;AAAa;;AA0Cf,MAAM2B,eAAgBC,KACpBA,EAAIC,QAAQ,uBAAuB;;;;;;;;UAU/BC,SAAS,SAAUC,GAAcC;EAC5C,IAAID,KAAQC,GAAa;IACvB,MAAMC,IAAqBN,aAAaK;IACxC,MAAME,IAAK,IAAIC,OAAOF,GAAoB;IAC1C,OACEG,EAAA;MACEC,WAAWN,EAAKF,QAAQK,GAAI;;SAG3B;IACL,OAAOH;;AAEX;;MAEaO,6BAA6B,CACxCC,GACAC;EAEA,KAAKD,EAAUE,eAAeC,SAASF,IAAM;IAC3C,OAAO;;;;MAIEG,gCACXC,KAEAA,EAAQC,KAAIC,MAAM;EAChBC,OAAOD,EAAOE;EACdC,SAASH,EAAOI;;;MAIPC,wBAAwB,CACnCP,GACAQ,GAGAC,MAEOT,GAASC,KAAIC;EAClB,MAAMC,IAAQM,GAAYC,MACxBN,KAAMF,EAAOC,UAAUC,KAAMF,EAAOE,OAAOA;EAE7C,OACEZ,EAAA;IACEmB,MAAMT,EAAOS;IACbC,OAAM;IACNC,cAAcX,EAAOC,SAASD,EAAOE;IACrCC,SAASH,EAAOI;IAChBQ,UAAUZ,EAAOY;IACjBX,OAAOA;IACPY,SAASP;IACTQ,aAAad,EAAOe;IACpBC,KAAKhB,EAAOC,SAASD,EAAOE;;AACf"}

package/dist/genexus-ide-ui/{p-289c3290.js → p-549b8f0c.js}

@@ -6,34 +6,35 @@ const o = {
   "ch-edit": "input-error"
 };
 
-const toggleErrorClass = (c, e) => {
-  const r = e.tagName.toLowerCase();
-  const t = o[r];
+const toggleErrorClass = (c, r) => {
+  const e = r.tagName.toLowerCase();
+  const s = o[e];
   if (c) {
-    e.classList.add(t);
+    r.classList.add(s);
   } else {
-    e.classList.remove(t);
+    r.classList.remove(s);
   }
 };
 
 const validateControls = (o, c) => {
-  const e = new Map(c);
+  const r = new Map(c);
   o.fieldErrors.forEach((o => {
     const c = o.key;
-    const r = o.hasError;
-    const t = e.get(c);
-    if (t === null || t === void 0 ? void 0 : t.reference) {
+    const e = o.hasError;
+    const s = r.get(c);
+    if (s?.reference) {
       // toggle class to add or remove error style
-      toggleErrorClass(r, t.reference);
-      e.set(c, Object.assign(Object.assign({}, t), {
-        hasError: r,
+      toggleErrorClass(e, s.reference);
+      r.set(c, {
+        ...s,
+        hasError: e,
         message: o.message
-      }));
+      });
     }
   }));
   // return validatableControls updated.
-    return e;
+    return r;
 };
 
 export { validateControls as v };
-//# sourceMappingURL=p-289c3290.js.map
+//# sourceMappingURL=p-549b8f0c.js.map