@genexus/genexus-ide-ui 1.0.20 → 1.0.21

package/dist/types/components/ww-images/ww-images.d.ts

@@ -1,179 +1,194 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { ComboBoxModel } from "@genexus/chameleon-controls-library";
-import { ContextMenuInfo, EntityData, GxOption } from "../../common/types";
+import { GxOption } from "../../common/types";
+import { EntityData, ContextMenuInfo } from "../../common/types";
 export declare class GxIdeWWImages {
-    #private;
-    el: HTMLGxIdeWwImagesElement;
-    categoriesComboBoxModel: ComboBoxModel;
-    densitiesComboBoxModel: ComboBoxModel;
-    languagesComboBoxModel: ComboBoxModel;
-    layersComboBoxModel: ComboBoxModel;
-    stylesComboBoxModel: ComboBoxModel;
-    /**
-     * If true the filter sidebar will be expanded, otherwise collapsed.
-     */
-    filterSidebarExpanded: boolean;
     /**
-     * The current value of the "After" combo box options.
+     * The component hard-coded strings translations.
      */
-    afterCurrentValue: string;
-    /**
-     * The options for the "After" combo-box
+    private _componentLocale;
+    private renderedFirstTime;
+    private filterInitialData;
+    el: HTMLGxIdeWwImagesElement;
+    private filterEl;
+    private filterNameEl;
+    private filterSearchContentsEl;
+    private filterCategoryEl;
+    private filterModuleEl;
+    private filterModifiedEl;
+    private filterAllDescendantsEl;
+    private filterAfterTypeEl;
+    private filterUserEl;
+    private filterModifiedDateEl;
+    private filterStyleEl;
+    private filterLanguageEl;
+    private filterDensityEl;
+    private filterLayerEl;
+    private chGridEl;
+    filtersHidden: boolean;
+    filtersHiddenHandler(hidden: boolean): void;
+    /**
+     * The after types render in the after selector
+     */
+    filterAfterType: string;
+    /**
+     * For show or hide the filters relative to modifiers
      */
-    filterAfterOptions: ComboBoxModel;
+    filterModified: boolean;
     /**
-     * Images filter input value
+     * The images rendered in the table
      */
-    filterImagesInputValue: string;
+    images: ImageData[];
     /**
-     * Shows or hides filters related to modifiers
+     * The images rendered in the table, after the filter
      */
-    filterModified: boolean;
+    filteredImages: ImageData[];
     /**
-     * Images rendered in the table after filtering
+     * The items of the image that is selected
      */
-    filteredImages: ImageData[];
+    imagesSelectedItems: ImageItemData[];
     /**
-     * Images rendered in the table
+     * The selected images in the table of images
      */
-    images: ImageData[];
+    selectedObjectsIds: string[];
     /**
-     * Items of the selected image
+     * The images filter input text value
      */
-    imagesSelectedItems: ImageItemData[];
+    filterImagesInputValue: string;
     /**
-     * Selected images in the images table
+     * If true it displays the component title on the header
      */
-    selectedObjectsIds: string[];
+    readonly displayTitle = false;
     /**
-     * If true, the "Toggle Filter" button will display activated, and the sidebar of filters
-     * will toggle on mouse enter or leave.
+     * Displays a secondary filter, used to filter over the filtered images
      */
-    toggleFilterButtonActive: boolean;
-    toggleFilterButtonActiveChanged(active: boolean): void;
+    readonly secondaryFilter = false;
     /**
-     * Categories rendered in the filter selector
+     * The categories render in the filter category selector
      */
     readonly categories: GxOption[];
-    categoriesChanged(newCategories: GxOption[]): void;
     /**
-     * Function to expand data when right-click
+     * The densities render in the filter density selector
      */
-    readonly contextMenuCallback: ContextMenuCallback;
+    readonly densities: GxOption[];
     /**
-     * Default value for the 'categories' filter
+     * The default value for the 'categories' filter
      */
     readonly defaultCategory: string;
     /**
-     * Default value for the module/folder filter
+     * The default value for the module/folder filter
      */
     readonly defaultModule: EntityData;
     /**
-     * Function to delete the selected images.
+     * The default value for the type filter
      */
-    readonly deleteSelectionCallback: DeleteSelectionCallback;
+    readonly defaultType: string;
     /**
-     * Densities rendered in the filter selector
+     * The modules/folders render in the module/folder selector
      */
-    readonly densities: GxOption[];
-    densitiesChanged(newDensities: GxOption[]): void;
+    readonly filterModules: GxOption[];
     /**
-     * Languages rendered in the filter selector
+     * The languages render in the filter language selector
      */
     readonly languages: GxOption[];
-    languagesChanged(newLanguages: GxOption[]): void;
     /**
-     * Layers rendered in the filter selector
+     * The layers render in the filter layer selector
      */
     readonly layers: GxOption[];
-    layersChanged(newLayers: GxOption[]): void;
     /**
-     * Function that returns a list of images for the table
+     * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
+     */
+    readonly contextMenuCallback: ContextMenuCallback;
+    /**
+     * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
+     */
+    readonly deleteSelectionCallback: DeleteSelectionCallback;
+    /**
+     * This is a function provided by the developer that return a list of images to populate the table of images.
      */
     readonly loadCallback: LoadCallback;
     /**
-     * Function that returns a list of items for the selected image
+     * This is a function provided by the developer that return a list of items of the image selected.
      */
     readonly loadImageItemsCallback: LoadImageItemsCallback;
     /**
-     * Callback invoked when user press New button.
+     * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
      */
     readonly newObjectCallback: NewObjectCallback;
     /**
-     * Function to expand data for double-clicked or entered images
+     * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
      */
     readonly openSelectionCallback: OpenSelectionCallback;
     /**
-     * Callback invoked when an action is executed on the Module/Folder filter.
+     * Callback invoked when the action is executed on the Module/Folder filter (button '...'). It returns the information of the selected object (id and name) or 'undefined' if it was canceled.
      */
     readonly selectModuleCallback: SelectModuleCallback;
     /**
-     * Callback invoked when an item is selected
+     * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
      */
     readonly selectionObjectChangedCallback: SelectionObjectCallback;
-    /**
-     * Displays a secondary filter, used to filter over the filtered images
-     */
-    readonly secondaryFilter = false;
     /**
      * Applies a shadow all around
      */
     readonly shadow = false;
     /**
-     * Styles rendered in the filter style selector
+     * The styles render in the filter style selector
      */
     readonly styles: GxOption[];
-    stylesChanged(newStyles: GxOption[]): void;
     /**
-     * Types rendered in the filter type selector
+     * The types render in the filter type selector
      */
     readonly types: GxOption[];
-    connectedCallback(): Promise<void>;
     /**
-     * Emitted once after the component fully loads and renders for the first time.
+     * This event is emitted once just after the component is fully loaded and the first render() occurs.
      */
     componentDidLoadEvent: EventEmitter<boolean>;
     /**
      * @description Gets fired when the component has rendered for the first time.
      */
     componentDidRenderFirstTime: EventEmitter<string>;
+    componentWillLoad(): Promise<void>;
     componentDidLoad(): void;
     componentDidRender(): void;
-    componentWillLoad(): Promise<void>;
     keyDownHandler(eventInfo: KeyboardEvent): void;
     /**
-     * Reloads the view, refreshing the filters and the images table.
+     * Validate necessary data input
+     */
+    validate(): Promise<boolean>;
+    /**
+     * This method reload the view, refreshing the filters and the table of images.
      */
     reload(): Promise<void>;
+    private attachDetectClickOutsideFilter;
+    private removeDetectClickOutsideFilter;
+    private detectClickOutsideFilter;
+    /**
+     * @description This is needed for resetting the filter. When the user resets the filter, all the filter controls values have to be restored to the value they had on componentDidLoad.
+     */
+    private saveInitialFilterData;
+    private renderFilter;
+    private renderImagesData;
+    private renderImages;
+    private getImages;
+    private newObjectCallbackHandler;
+    private openSelectionCallBackHandler;
+    private deleteSelectionCallbackHandler;
+    private resetFilterHandler;
+    private toggleFiltersHandler;
+    private selectAll;
+    private deselectAll;
+    private listenChanges;
+    private filterInputHandler;
+    private filterImagesInformationHandler;
     render(): void;
 }
-export type ContextMenuCallback = (contextMenuInfo: ContextMenuInfo) => Promise<void>;
+export type SelectionObjectCallback = (ids: string[]) => Promise<void>;
+export type OpenSelectionCallback = (ids: string[]) => Promise<void>;
 export type DeleteSelectionCallback = (ids: string[]) => Promise<void>;
-export type FilerInitialData = {
-    name: string;
-    module: EntityData;
-    searchContents: string;
-    category: string;
-    allDescendants: string;
-    modifiedAfter: string;
-    modifiedDateTime: string;
-    modifiedUser: string;
-    style: string;
-    language: string;
-    density: string;
-    layer: string;
-};
-export type ImageData = {
-    id: string;
-    icon: string;
-    name: string;
-    description: string;
-    parent: string;
-    module: string;
-    modifiedDate?: Date;
-    lastUser?: string;
-    importDate?: Date;
-};
+export type SelectModuleCallback = () => Promise<EntityData | undefined>;
+export type ContextMenuCallback = (contextMenuInfo: ContextMenuInfo) => Promise<void>;
+export type NewObjectCallback = () => Promise<void>;
+export type LoadCallback = (filters: ImageFiltersData) => Promise<ImageData[]>;
+export type LoadImageItemsCallback = (id: string) => Promise<ImageItemData[]>;
 export type ImageFiltersData = {
     name?: string;
     searchContents?: string;
@@ -188,14 +203,19 @@ export type ImageFiltersData = {
     density?: string;
     layer?: string;
 };
+export type ImageData = {
+    id: string;
+    icon: string;
+    name: string;
+    description: string;
+    parent: string;
+    module: string;
+    modifiedDate?: Date;
+    lastUser?: string;
+    importDate?: Date;
+};
 export type ImageItemData = {
     id: string;
     name: string;
     url: string;
 };
-export type LoadCallback = (filters: ImageFiltersData) => Promise<ImageData[]>;
-export type LoadImageItemsCallback = (id: string) => Promise<ImageItemData[]>;
-export type NewObjectCallback = () => Promise<void>;
-export type OpenSelectionCallback = (ids: string[]) => Promise<void>;
-export type SelectModuleCallback = () => Promise<EntityData | undefined>;
-export type SelectionObjectCallback = (ids: string[]) => Promise<void>;

package/dist/types/components.d.ts

@@ -1766,55 +1766,67 @@ export namespace Components {
     }
     interface GxIdeWwImages {
         /**
-          * Categories rendered in the filter selector
+          * The categories render in the filter category selector
          */
         "categories": GxOption[];
         /**
-          * Function to expand data when right-click
+          * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
          */
         "contextMenuCallback": ContextMenuCallback;
         /**
-          * Default value for the 'categories' filter
+          * The default value for the 'categories' filter
          */
         "defaultCategory": string;
         /**
-          * Default value for the module/folder filter
+          * The default value for the module/folder filter
          */
         "defaultModule": EntityData;
         /**
-          * Function to delete the selected images.
+          * The default value for the type filter
+         */
+        "defaultType": string;
+        /**
+          * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
          */
         "deleteSelectionCallback": DeleteSelectionCallback;
         /**
-          * Densities rendered in the filter selector
+          * The densities render in the filter density selector
          */
         "densities": GxOption[];
         /**
-          * Languages rendered in the filter selector
+          * If true it displays the component title on the header
+         */
+        "displayTitle": false;
+        /**
+          * The modules/folders render in the module/folder selector
+         */
+        "filterModules": GxOption[];
+        /**
+          * The languages render in the filter language selector
          */
         "languages": GxOption[];
         /**
-          * Layers rendered in the filter selector
+          * The layers render in the filter layer selector
          */
         "layers": GxOption[];
         /**
-          * Function that returns a list of images for the table
+          * This is a function provided by the developer that return a list of images to populate the table of images.
          */
         "loadCallback": LoadCallback5;
         /**
-          * Function that returns a list of items for the selected image
+          * This is a function provided by the developer that return a list of items of the image selected.
          */
         "loadImageItemsCallback": LoadImageItemsCallback;
         /**
-          * Callback invoked when user press New button.
+          * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
          */
         "newObjectCallback": NewObjectCallback1;
         /**
-          * Function to expand data for double-clicked or entered images
+          * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
          */
         "openSelectionCallback": OpenSelectionCallback1;
         /**
-          * Reloads the view, refreshing the filters and the images table.
+          * This method reload the view, refreshing the filters and the table of images.
          */
         "reload": () => Promise<void>;
         /**
@@ -1822,11 +1834,11 @@ export namespace Components {
          */
         "secondaryFilter": false;
         /**
-          * Callback invoked when an action is executed on the Module/Folder filter.
+          * Callback invoked when the action is executed on the Module/Folder filter (button '...'). It returns the information of the selected object (id and name) or 'undefined' if it was canceled.
          */
         "selectModuleCallback": SelectModuleCallback3;
         /**
-          * Callback invoked when an item is selected
+          * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
          */
         "selectionObjectChangedCallback": SelectionObjectCallback;
         /**
@@ -1834,13 +1846,17 @@ export namespace Components {
          */
         "shadow": false;
         /**
-          * Styles rendered in the filter style selector
+          * The styles render in the filter style selector
          */
         "styles": GxOption[];
         /**
-          * Types rendered in the filter type selector
+          * The types render in the filter type selector
          */
         "types": GxOption[];
+        /**
+          * Validate necessary data input
+         */
+        "validate": () => Promise<boolean>;
     }
 }
 export interface GxIdeAiAssistantCustomEvent<T> extends CustomEvent<T> {
@@ -4514,51 +4530,63 @@ declare namespace LocalJSX {
     }
     interface GxIdeWwImages {
         /**
-          * Categories rendered in the filter selector
+          * The categories render in the filter category selector
          */
         "categories": GxOption[];
         /**
-          * Function to expand data when right-click
+          * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
          */
         "contextMenuCallback": ContextMenuCallback;
         /**
-          * Default value for the 'categories' filter
+          * The default value for the 'categories' filter
          */
         "defaultCategory"?: string;
         /**
-          * Default value for the module/folder filter
+          * The default value for the module/folder filter
          */
         "defaultModule"?: EntityData;
         /**
-          * Function to delete the selected images.
+          * The default value for the type filter
+         */
+        "defaultType"?: string;
+        /**
+          * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
          */
         "deleteSelectionCallback": DeleteSelectionCallback;
         /**
-          * Densities rendered in the filter selector
+          * The densities render in the filter density selector
          */
         "densities": GxOption[];
         /**
-          * Languages rendered in the filter selector
+          * If true it displays the component title on the header
+         */
+        "displayTitle"?: false;
+        /**
+          * The modules/folders render in the module/folder selector
+         */
+        "filterModules": GxOption[];
+        /**
+          * The languages render in the filter language selector
          */
         "languages": GxOption[];
         /**
-          * Layers rendered in the filter selector
+          * The layers render in the filter layer selector
          */
         "layers": GxOption[];
         /**
-          * Function that returns a list of images for the table
+          * This is a function provided by the developer that return a list of images to populate the table of images.
          */
         "loadCallback": LoadCallback5;
         /**
-          * Function that returns a list of items for the selected image
+          * This is a function provided by the developer that return a list of items of the image selected.
          */
         "loadImageItemsCallback": LoadImageItemsCallback;
         /**
-          * Callback invoked when user press New button.
+          * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
          */
         "newObjectCallback": NewObjectCallback1;
         /**
-          * Emitted once after the component fully loads and renders for the first time.
+          * This event is emitted once just after the component is fully loaded and the first render() occurs.
          */
         "onComponentDidLoadEvent"?: (event: GxIdeWwImagesCustomEvent<boolean>) => void;
         /**
@@ -4566,7 +4594,7 @@ declare namespace LocalJSX {
          */
         "onComponentDidRenderFirstTime"?: (event: GxIdeWwImagesCustomEvent<string>) => void;
         /**
-          * Function to expand data for double-clicked or entered images
+          * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
          */
         "openSelectionCallback": OpenSelectionCallback1;
         /**
@@ -4574,11 +4602,11 @@ declare namespace LocalJSX {
          */
         "secondaryFilter"?: false;
         /**
-          * Callback invoked when an action is executed on the Module/Folder filter.
+          * Callback invoked when the action is executed on the Module/Folder filter (button '...'). It returns the information of the selected object (id and name) or 'undefined' if it was canceled.
          */
         "selectModuleCallback": SelectModuleCallback3;
         /**
-          * Callback invoked when an item is selected
+          * This is a function provided by the developer for expanded the data of images that is double-clicked or entered.
          */
         "selectionObjectChangedCallback": SelectionObjectCallback;
         /**
@@ -4586,11 +4614,11 @@ declare namespace LocalJSX {
          */
         "shadow"?: false;
         /**
-          * Styles rendered in the filter style selector
+          * The styles render in the filter style selector
          */
         "styles": GxOption[];
         /**
-          * Types rendered in the filter type selector
+          * The types render in the filter type selector
          */
         "types": GxOption[];
     }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genexus/genexus-ide-ui",
   "license": "Apache-2.0",
-  "version": "1.0.20",
+  "version": "1.0.21",
   "description": "GeneXus IDE UI components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",

package/dist/collection/components/ww-images/helpers.js

@@ -1,11 +0,0 @@
-export const mapOptionsToComboBoxItemModel = (options) => {
-    return options.map(option => {
-        var _a;
-        return {
-            value: option.id,
-            caption: option.label,
-            startImgSrc: (_a = option.iconName) !== null && _a !== void 0 ? _a : ""
-        };
-    });
-};
-//# sourceMappingURL=helpers.js.map

package/dist/collection/components/ww-images/helpers.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../src/components/ww-images/helpers.tsx"],"names":[],"mappings":"AAGA,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAC3C,OAAmB,EACJ,EAAE;IACjB,OAAO,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;;QAC1B,OAAO;YACL,KAAK,EAAE,MAAM,CAAC,EAAE;YAChB,OAAO,EAAE,MAAM,CAAC,KAAK;YACrB,WAAW,EAAE,MAAA,MAAM,CAAC,QAAQ,mCAAI,EAAE;SACnC,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC,CAAC","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"]}

package/dist/esm/helpers-9ee6ddce.js.map

@@ -1 +0,0 @@
-{"file":"helpers-9ee6ddce.js","mappings":"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","names":[],"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"],"version":3}

package/dist/genexus-ide-ui/p-066028bc.js.map

@@ -1 +0,0 @@
-{"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","_a","document","getElementsByTagName","getAttribute","valueOf","toLocaleDateString","year","getFullYear","month","String","getMonth","padStart","day","hours","getHours","minutes","getMinutes","time","toLocaleTimeString","daysPassedFromToday","currentYear","getDay","toLocaleString","countTreeItems","treeModel","children","totalNodes","forEach","node","items","escapeRegExp","str","replace","hiChar","text","filterValue","escapedFilterValue","re","RegExp","h","innerHTML","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,KAAOC,IAAAC,SACVC,qBAAqB,QAAQ,GAC7BC,aAAa,aAAO,QAAAH,WAAA,aAAAA,EACnBI;EACJ,IAAIL,MAAS,MAAM;IACjBD,IAAS;;EAEXH,IAAgBhB,EAAK0B,mBAAmBP;EACxC,MAAMQ,IAAO3B,EAAK4B;EAClB,MAAMC,IAAQC,OAAO9B,EAAK+B,aAAa,GAAGC,SAAS,GAAG;EACtD,MAAMC,IAAMH,OAAO9B,EAAKa,WAAWmB,SAAS,GAAG;EAC/C,MAAME,IAAQJ,OAAO9B,EAAKmC,YAAYH,SAAS,GAAG;EAClD,MAAMI,IAAUN,OAAO9B,EAAKqC,cAAcL,SAAS,GAAG;EACtD,MAAMM,IAAO,GAAGJ,KAASE;EACzB,IAAIrB,MAAS,aAAa;IACxBC,KAAiB,MAAMhB,EAAKuC;SACvB,IAAIxB,MAAS,mBAAmB;;IAErC,IAAII,MAAW,SAAS;MACtBH,IAAgB,GAAGW,KAAQE,KAASI,KAAOK;WACtC;MACLtB,IAAgB,GAAGa,KAASI,KAAON,KAAQW;;SAE1B;IACnB,MAAME,IAAsBzC,cAAcC;IAC1C,MAAMC,IAAQ,IAAIC;IAClB,MAAMuC,IAAcxC,EAAM2B;IAC1B,IAAIpB,QAAQR,IAAO;MACjB,OAAO,SAASsC;WACX,IAAI5B,YAAYV,IAAO;MAC5B,OAAO,aAAasC;WACf,IAAIE,KAAuB,GAAG;;MAEnC,MAAMP,IAAMnC,EAAWE,EAAK0C;MAC5B,OAAO,GAAGT,KAAOK;WACZ,IAAIG,MAAgBd,GAAM;;MAE/B,IAAIR,MAAW,SAAS;QACtBH,IAAgB,GAAGiB,QAAUjC,EAAK2C,eAAe,SAAS;UACxDd,OAAO;cACHS;aACD;QACLtB,IAAgB,GAAGhB,EAAK2C,eAAe,SAAS;UAC9Cd,OAAO;cACHI,KAAOK;;WAEV;;MAELtB,IAAgBF,WAAWd,GAAM;;;EAGrC,OAAOgB;AAAa;;;;;2FAcT4B,iBAAiB,CAC5BC,GACAC,IAAW;EAEX,IAAIC,IAAa;EACjBF,EAAUG,SAAQC;IAChBH,KAAYC;IACZ,IAAIE,EAAKC,OAAO;MACdH,KAAcH,eAAeK,EAAKC,OAAO;;;EAG7C,OAAOH;AAAU;;AAiBZ,MAAMI,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;;MAWaO,gCACXC,KAEAA,EAAQC,KAAIC,MAAM;EAChBC,OAAOD,EAAOE;EACdC,SAASH,EAAOI;;;MAIPC,wBAAwB,CACnCP,GACAQ,GAGAC,MAEOT,MAAO,QAAPA,WAAO,aAAPA,EAASC,KAAIC;EAClB,MAAMC,IAAQM,MAAU,QAAVA,WAAU,aAAVA,EAAYC,MACxBN,KAAMF,EAAOC,UAAUC,KAAMF,EAAOE,OAAOA;EAE7C,OACEP,EAAA;IACEc,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"}