@genexus/genexus-ide-ui 0.0.91 → 0.0.92

package/dist/genexus-ide-ui/p-7b60fc65.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["KB_OBJECT","KB_CATEGORY","convertImportItemToTreeItem","importCatIcon","importItems","importTreeItems","forEach","importItem","push","id","caption","name","leftImgSrc","expanded","leaf","class","metadata","convertImportCategoryToTreeView","importCategoryData","treeData","importCat","importCategoryTreeItem","items","length","icon","createImportResultDataMessages","importItemId","messagesArray","messages","message","i","updateImportStatusTree","importItemResultFullData","importTreeActualState","objectCategoryIndex","findIndex","objectCategoryItem","categoryId","importTreeItem","categoryName","categoryIcon","status","importItemIndex","_a","createImportResultFullData","importItemResultData","importCategoryFullData","Object","assign","undefined","importCategoryDataFor","categoryNode","j","addImportItemResultDataItem","updatedImportStatusTree","kbManagerImportCss","GxIdeKbManagerImport","this","renderedFirstTime","objectsInFileTotalNodes","selectedObjectsInFileIds","evaluateImportStatusMessage","someStatusVisible","statusInfo","error","display","warning","success","evaluateObjects","noObjects","objectsTreeState","evaluateImport","noImport","importTreeState","selectFileAndLoadHandler","fileInputEl","openFile","loadFileHandler","async","loadCallback","selectedFile","importCategoryTreeData","fileSelectedHandler","fileEvent","detail","importObjectsHandler","importCallback","clearStatusHandler","importingIsInProcess","objectsButtonsGroup","activeButtonId","checkedObjectsIds","then","objectsTreeCheckedItemsChangedHandler","event","toggleObjectsCheckboxEl","checked","indeterminate","allItemsWithCheckbox","values","firstItemCheckedValue","item","allItemsHaveTheSameCheckedValue","every","treeItem","checkedItems","filter","node","checkedObjects","objectChecked","objectsTreeSelectedItemsChangedHandler","map","objectsTreeContextMenuHandler","objectContextMenuCallback","selection","clientX","contextmenuEvent","screenX","clientY","screenY","cancelImportHandler","cancelCallback","optionsHandler","optionsCallback","number","toggleSelectionClickHandler","e","target","objectsTreeEl","updateAllItemsProperties","statusButtonsSelectionChangedHandler","activeStates","errorIndex","state","itemId","warningIndex","successIndex","evaluateCheckAllValue","allAreChecked","conditionToUncheck","fileClearedHandler","loaderCancelCallbackHandler","watchObjectsTreeStateHandler","newState","countTreeItems","watchImportTreeStateHandler","importStatusMessage","_componentLocale","main","importStatus","noImportedFiles","importedButHidden","watchImportingIsInProcessHandler","isImporting","loader","loaderEl","show","watchSelectedFileHandler","file","size","componentWillLoad","Locale","getComponentStrings","el","componentDidLoadEvent","emit","componentDidLoad","focus","componentDidRender","componentDidRenderFirstTime","componentName","addResultItem","render","h","Host","noContentPadding","noFooterPadding","containerTitle","displayTitle","slot","type","label","header","fileNameLabel","placeholder","fileNamePlaceholder","part","acceptFile","clearButton","iconPosition","onFileSelected","onClearButtonClicked","ref","onClick","disabled","selectFileButton","objectsInFile","title","noBorderFooter","slimmerFooter","inactiveTitle","footerSubtleShadow","titleType","treeModel","dragDisabled","dropDisabled","toggleCheckboxes","checkbox","onCheckedItemsChange","onSelectedItemsChange","onItemContextmenu","textAlign","config","gxgMessage","common","padding","maxWidth","selectUnselect","importButton","cancelButton","optionsButton","errors","warnings","successes","hideMessage","compact","noBorderTop","noBorderBottom","noBorderStart","minimal","statusMinimal","onSelectionChanged","description","cancelLabel","container","loaderTitle"],"sources":["src/components/kb-manager-import/helpers.ts","src/components/kb-manager-import/kb-manager-import.scss?tag=gx-ide-kb-manager-import&encapsulation=shadow","src/components/kb-manager-import/kb-manager-import.tsx"],"sourcesContent":["/* Tree View */\nimport { TreeViewItemModel } from \"@genexus/chameleon-controls-library/dist/types/components/tree-view/tree-view/types\";\n\n/* Kb Manager Import Types*/\nimport { ImportItemData } from \"./kb-manager-import\";\nimport { ImportCategoryData, ImportItemResultData } from \"../../common/types\";\n/* objects in file metadata*/\nexport const KB_OBJECT = \"object\";\nexport const KB_CATEGORY = \"category\";\n\nconst convertImportItemToTreeItem = (\n  importCatIcon: string,\n  importItems: ImportItemData[]\n) => {\n  const importTreeItems: TreeViewItemModel[] = [];\n  importItems.forEach(importItem => {\n    importTreeItems.push({\n      id: importItem.id,\n      caption: importItem.name,\n      leftImgSrc: importCatIcon,\n      expanded: true,\n      leaf: true,\n      class: \"object tree-view-item\",\n      metadata: KB_OBJECT\n    });\n  });\n  return importTreeItems;\n};\n\n/**\n * @description This function converts ReferenceData[] data to TreeItemData[]\n */\nexport const convertImportCategoryToTreeView = (\n  importCategoryData: ImportCategoryData[]\n): TreeViewItemModel[] => {\n  const treeData: TreeViewItemModel[] = [];\n  if (!importCategoryData) {\n    return treeData;\n  }\n  importCategoryData.forEach(importCat => {\n    const importCategoryTreeItem: TreeViewItemModel = {\n      id: importCat.id,\n      // caption: importCat.name,\n      caption: `${importCat.name} (${importCat.items.length})`,\n      leftImgSrc: importCat.icon,\n      expanded: true,\n      leaf: false,\n      class: \"category tree-view-item\",\n      metadata: KB_CATEGORY,\n      items: convertImportItemToTreeItem(importCat.icon, importCat.items)\n    };\n    treeData.push(importCategoryTreeItem);\n  });\n  return treeData;\n};\n\nconst createImportResultDataMessages = (\n  importItemId: string,\n  messagesArray: string[]\n): TreeViewItemModel[] => {\n  const messages: TreeViewItemModel[] = [];\n  messagesArray.forEach((message, i) => {\n    messages.push({\n      id: `${importItemId}-message-${i}}]`,\n      caption: message,\n      leftImgSrc: \"gx-test/test-results\",\n      leaf: true\n    });\n  });\n  return messages;\n};\n\nconst updateImportStatusTree = (\n  importItemResultFullData: ImportItemResultFullData,\n  importTreeActualState: TreeViewItemModel[]\n): TreeViewItemModel[] => {\n  const objectCategoryIndex = importTreeActualState.findIndex(\n    objectCategoryItem => {\n      return objectCategoryItem.id === importItemResultFullData.categoryId;\n    }\n  );\n  if (objectCategoryIndex === -1) {\n    // object category node does not exists. We have to create it, and insert the import result tree node inside.\n    const importTreeItem: TreeViewItemModel = {\n      id: importItemResultFullData.categoryId,\n      // the count is (1), because this is the first item for this category\n      caption: `${importItemResultFullData.categoryName} (1)`,\n      leftImgSrc: importItemResultFullData.categoryIcon,\n      class: `tree-view-item`,\n      expanded: true,\n      items: [\n        {\n          id: importItemResultFullData.id,\n          caption: importItemResultFullData.name,\n          items: createImportResultDataMessages(\n            importItemResultFullData.id,\n            importItemResultFullData.messages\n          ),\n          class: `tree-view-item tree-view-item--${importItemResultFullData.status}`,\n          expanded: true,\n          leaf: importItemResultFullData.messages.length === 0\n        }\n      ]\n    };\n    importTreeActualState.push(importTreeItem);\n  } else {\n    // Object category node already exists. Just create the import result node, and insert into the parent category node (if it doesn't exists already).\n\n    // first search for the importItemResult node...\n    const importItemIndex = importTreeActualState[\n      objectCategoryIndex\n    ].items?.findIndex(importItem => {\n      return importItem.id === importItemResultFullData.id;\n    });\n\n    if (importItemIndex === -1) {\n      // ImportItem does not exists already\n      const importTreeItem: TreeViewItemModel = {\n        id: importItemResultFullData.id,\n        caption: importItemResultFullData.name,\n        expanded: true,\n        items: createImportResultDataMessages(\n          importItemResultFullData.id,\n          importItemResultFullData.messages\n        ),\n        class: `tree-view-item tree-view-item--${importItemResultFullData.status}`\n      };\n      // Insert the import node into the category node\n      importTreeActualState[objectCategoryIndex].items.push(importTreeItem);\n      // Then, update the category node caption (the name is the same, but the (count) should be the actual items.length, because we have just added a new child import node. )\n      importTreeActualState[\n        objectCategoryIndex\n      ].caption = `${importItemResultFullData.categoryName} (${importTreeActualState[objectCategoryIndex].items.length})`;\n    }\n  }\n  return importTreeActualState;\n};\n\n/**\n * This function takes an ImportItemResultData item, and updates it to a ImportCategoryFullData, which has the same information, plus the category parent needed information, that will be used for creating the \"virtual\" parent category node on the \"Import Status\" section.\n */\nconst createImportResultFullData = (\n  importItemResultData: ImportItemResultData,\n  importCategoryData: ImportCategoryData[]\n): ImportItemResultFullData => {\n  const importCategoryFullData: ImportItemResultFullData = {\n    categoryId: undefined,\n    categoryName: undefined,\n    categoryIcon: undefined,\n    ...importItemResultData\n  };\n  importCategoryDataFor: for (let i = 0; i < importCategoryData.length; i++) {\n    const categoryNode = importCategoryData[i];\n    for (let j = 0; j < categoryNode.items.length; j++) {\n      if (categoryNode.items[j].id === importItemResultData.id) {\n        importCategoryFullData.categoryId = categoryNode.id;\n        importCategoryFullData.categoryName = categoryNode.name;\n        importCategoryFullData.categoryIcon = categoryNode.icon;\n        break importCategoryDataFor;\n      }\n    }\n  }\n  return importCategoryFullData;\n};\n\n/**\n * @description This function adds an ImportItemResultData item to the \"importTreeState\", and returns the updated tree with the new item added.\n */\nexport const addImportItemResultDataItem = (\n  importItemResultData: ImportItemResultData,\n  importCategoryData: ImportCategoryData[],\n  importTreeActualState: TreeViewItemModel[]\n): TreeViewItemModel[] => {\n  let updatedImportStatusTree: TreeViewItemModel[] = [...importTreeActualState];\n  // first, update importItemResultData with the category data. It will be needed later.\n  const importItemResultFullData: ImportItemResultFullData =\n    createImportResultFullData(importItemResultData, importCategoryData);\n  updatedImportStatusTree = updateImportStatusTree(\n    importItemResultFullData,\n    updatedImportStatusTree\n  );\n  return updatedImportStatusTree;\n};\n\ntype ImportItemResultFullData = ImportItemResultData & {\n  categoryId: string;\n  categoryName: string;\n  categoryIcon: string;\n};\n","@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n  display: block;\n}\n/*Header*/\n.header {\n  display: flex;\n  flex-direction: row;\n  gap: var(--gx-ide-grid-column-gap);\n\n  .select-file {\n    flex: 1;\n  }\n}\n/*Main*/\n.main {\n  //min-height: 250px;\n  height: 100%;\n  display: flex;\n  //grid-template-columns: 1fr 1fr;\n  > * {\n    flex: 1;\n  }\n  .left-grid-item {\n    border-right: 1px solid var(--gx-ide-container-border-color);\n  }\n\n  @include gx-ide-message(\"short\");\n\n  .tree-container {\n    &--empty {\n      align-items: center;\n      justify-content: center;\n    }\n\n    &--import-status {\n      .tree-view-item {\n        &--success {\n          @include tree-item-status(\"success\");\n        }\n        &--warning {\n          @include tree-item-status(\"warning\");\n        }\n        &--error {\n          @include tree-item-status(\"error\");\n        }\n      }\n    }\n    /*import status display/hide status (warning, error, success)*/\n    &--no-warnings {\n      .tree-view-item--warning {\n        display: none;\n      }\n    }\n    &--no-errors {\n      .tree-view-item--error {\n        display: none;\n      }\n    }\n    &--no-successes {\n      .tree-view-item--success {\n        display: none;\n      }\n    }\n  }\n}\n.ghost-element {\n  display: block;\n  width: 0;\n  height: 24px; /*this is the taller element on the \"objects in file container footer (which is the button group, at the time of writing)\"*/\n}\n","/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  Element,\n  State,\n  EventEmitter,\n  Watch,\n  Method\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport {\n  TreeViewItemModel,\n  TreeViewItemContextMenu\n} from \"@genexus/chameleon-controls-library/dist/types/components/tree-view/tree-view/types\";\nimport { TreeViewItemModelExtended } from \"@genexus/chameleon-controls-library/dist/types/components/renders/tree-view/types\";\n\nimport {\n  TextAlign,\n  TextPadding,\n  TextType\n} from \"@genexus/gemini/dist/types/components/text/text\";\n/* CUSTOM IMPORTS */\nimport { Locale } from \"../../common/locale\";\nimport { config } from \"../../common/config\";\nimport {\n  ImportCategoryData,\n  ImportItemResultData,\n  ContextMenuInfo\n} from \"../../common/types\";\nimport {\n  convertImportCategoryToTreeView,\n  addImportItemResultDataItem\n} from \"./helpers\";\n// import { CheckboxInfo } from \"@genexus/gemini/dist/types/components/form-checkbox/form-checkbox\";\nimport { countTreeItems } from \"../../common/helpers\";\nimport { CheckedItemsInfo } from \"../_helpers/list-selector/list-selector\";\n\nimport { KB_OBJECT } from \"./helpers\";\n\n@Component({\n  tag: \"gx-ide-kb-manager-import\",\n  styleUrl: \"kb-manager-import.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/kb-manager-import\"]\n})\nexport class GxIdeKbManagerImport {\n  /*\nINDEX:\n1.OWN PROPERTIES\n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API | WATCH'S\n5.EVENTS (EMIT)\n6.COMPONENT LIFECYCLE EVENTS\n7.LISTENERS\n8.PUBLIC METHODS API\n9.LOCAL METHODS\n10.RENDER() FUNCTION\n*/\n\n  // 1.OWN PROPERTIES //\n\n  /**\n   * The component hard-coded strings translations.\n   */\n  private _componentLocale: any;\n  private renderedFirstTime = false;\n  /* ImportCategoryBasicData Holds the original name of category data, and its id. Used to create parent nodes on the imported tree*/\n  private importCategoryData: ImportCategoryData[] = [];\n  private objectsInFileTotalNodes = 0;\n  private selectedObjectsInFileIds: string[] = [];\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeKbManagerImportElement;\n\n  private objectsTreeEl!: HTMLGxgTreeViewElement;\n  private fileInputEl!: HTMLGxgFormTextElement;\n  private objectsButtonsGroup!: HTMLGxgButtonGroupElement;\n  private toggleObjectsCheckboxEl: HTMLGxgFormCheckboxElement;\n  private loaderEl!: HTMLGxgIdeLoaderElement;\n\n  // 3.STATE() VARIABLES //\n\n  @State() checkedObjectsIds: string[] = [];\n  @State() noObjects: boolean;\n  @State() showHiddenImportsMessage = false;\n  @State() statusInfo: StatusInfo = {\n    error: {\n      display: true,\n      number: 0\n    },\n    warning: {\n      display: true,\n      number: 0\n    },\n    success: {\n      display: true,\n      number: 0\n    }\n  };\n  @State() objectsTreeState: TreeViewItemModel[] = [];\n  @Watch(\"objectsTreeState\")\n  watchObjectsTreeStateHandler(newState: TreeViewItemModel[]) {\n    this.noObjects = !!(newState.length === 0 || !newState);\n    this.objectsInFileTotalNodes = countTreeItems(newState);\n  }\n\n  // import status\n  @State() importStatusMessage: string;\n  @State() someStatusVisible: boolean;\n  @State() noImport: boolean;\n  @State() importTreeState: TreeViewItemModel[] = [];\n  @Watch(\"importTreeState\")\n  watchImportTreeStateHandler() {\n    this.evaluateImport();\n    if (this.noImport) {\n      this.importStatusMessage =\n        this._componentLocale.main.importStatus.noImportedFiles;\n    } else {\n      this.importStatusMessage =\n        this._componentLocale.main.importStatus.importedButHidden;\n    }\n  }\n\n  @State() importingIsInProcess = false;\n  @Watch(\"importingIsInProcess\")\n  watchImportingIsInProcessHandler(isImporting: boolean) {\n    if (isImporting && this.loader) {\n      this.loaderEl.show = true;\n    } else if (!isImporting && this.loader) {\n      this.loaderEl.show = false;\n    }\n  }\n\n  // 4.PUBLIC PROPERTY API //\n\n  /**\n   * If true it displays the component title on the header\n   */\n  @Prop() readonly displayTitle = false;\n\n  /**\n   * If true, it will display a loader when needed.\n   */\n  @Prop() readonly loader = true;\n\n  /**\n   * The name of the imported xml or xps file\n   */\n  @Prop({ mutable: true }) selectedFile: File;\n  @Watch(\"selectedFile\")\n  watchSelectedFileHandler(file: File) {\n    if (file && file.name && file.size > 0) {\n      this.loadFileHandler();\n    }\n  }\n\n  /**\n   * Callback invoked when the user wants to access the export options.\n   */\n  @Prop() readonly optionsCallback: OptionsCallback;\n\n  /**\n   *Callback invoked when the user wants to initiate the import process.\n   */\n  @Prop() readonly importCallback: ImportCallback;\n\n  /**\n   *Callback invoked when the user wants to load the xpz information\n   */\n  @Prop() readonly loadCallback: LoadCallback;\n\n  /**\n   * Callback invoked when the user wants to cancel the export process.\n   * @returns It returns a boolean indicating whether the process could be canceled or not.\n   */\n  @Prop() readonly cancelCallback: CancelCallback;\n\n  /**\n   * It displays the status buttons (errors, warning, succeeded) with the minimal ui (no captions)\n   */\n  @Prop() readonly statusMinimal = false;\n\n  /**\n   * It displays the status buttons (errors, warning, succeeded) with the minimal ui (no captions)\n   */\n  @Prop() readonly objectContextMenuCallback: ObjectContextMenuCallback;\n\n  // 5.EVENTS (EMIT) //\n\n  /**\n   * This event is emitted once just after the component is fully loaded and the first render() occurs\n   */\n  @Event() componentDidRenderFirstTime: EventEmitter<boolean>;\n\n  /**\n   * This event is emitted once just after the component is fully loaded and the first render() occurs.\n   */\n  @Event() componentDidLoadEvent: EventEmitter<boolean>;\n\n  // 6.COMPONENT LIFECYCLE EVENTS //\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n    this.componentDidLoadEvent.emit(true);\n    this.evaluateObjects();\n    this.evaluateImport();\n    this.importStatusMessage =\n      this._componentLocale.main.importStatus.noImportedFiles;\n    this.evaluateImportStatusMessage();\n  }\n\n  componentDidLoad() {\n    this.fileInputEl.focus();\n  }\n\n  componentDidRender() {\n    if (!this.renderedFirstTime) {\n      this.componentDidRenderFirstTime.emit(\n        this._componentLocale.componentName\n      );\n      this.renderedFirstTime = true;\n    }\n  }\n\n  // 7.LISTENERS //\n\n  // 8.PUBLIC METHODS API //\n\n  /**\n   * Add the result of importing an item\n   */\n  @Method()\n  async addResultItem(item: ImportItemResultData) {\n    this.importTreeState = addImportItemResultDataItem(\n      item,\n      this.importCategoryData,\n      this.importTreeState\n    );\n    this.statusInfo[item.status].number++;\n  }\n\n  // 9.LOCAL METHODS //\n\n  private evaluateImportStatusMessage = () => {\n    this.someStatusVisible =\n      this.statusInfo.error.display ||\n      this.statusInfo.warning.display ||\n      this.statusInfo.success.display;\n  };\n\n  private evaluateObjects = () => {\n    this.noObjects = !!(\n      this.objectsTreeState?.length === 0 || !this.objectsTreeState\n    );\n  };\n\n  private evaluateImport = () => {\n    this.noImport = !!(\n      this.importTreeState?.length === 0 || !this.importTreeState\n    );\n  };\n\n  private selectFileAndLoadHandler = () => {\n    this.fileInputEl.openFile();\n  };\n\n  private loadFileHandler = async () => {\n    if (this.loadCallback && this.selectedFile) {\n      this.importCategoryData = await this.loadCallback(this.selectedFile);\n      const importCategoryTreeData = convertImportCategoryToTreeView(\n        this.importCategoryData\n      );\n      this.objectsTreeState = importCategoryTreeData;\n      if (this.importCategoryData.length > 0) {\n        // clear input\n        this.selectedFile = null;\n      }\n    }\n  };\n\n  private fileSelectedHandler = (fileEvent: CustomEvent<FileList>) => {\n    this.selectedFile = fileEvent.detail[0];\n  };\n\n  private importObjectsHandler = async () => {\n    if (this.importCallback) {\n      /* first clear imported objects (this clears errors/warnings/success counts as well)*/\n      this.clearStatusHandler();\n      /* then do the import*/\n      this.importingIsInProcess = true;\n      this.objectsButtonsGroup.activeButtonId = \"cancel-import-btn\";\n      this.importCallback(this.checkedObjectsIds).then(() => {\n        this.importingIsInProcess = false;\n      });\n    }\n  };\n\n  private objectsTreeCheckedItemsChangedHandler = (\n    event: CustomEvent<Map<string, TreeViewItemModelExtended>>\n  ) => {\n    /* 1. Begin of evaluate 'select/unselect checkbox' state*/\n    if (event.detail == null) {\n      this.toggleObjectsCheckboxEl.checked = false;\n      this.toggleObjectsCheckboxEl.indeterminate = false;\n      return;\n    }\n\n    const allItemsWithCheckbox = [...event.detail.values()];\n\n    if (allItemsWithCheckbox.length === 0) {\n      this.toggleObjectsCheckboxEl.checked = false;\n      this.toggleObjectsCheckboxEl.indeterminate = false;\n      return;\n    }\n\n    const firstItemCheckedValue = allItemsWithCheckbox[0].item.checked;\n\n    const allItemsHaveTheSameCheckedValue = allItemsWithCheckbox.every(\n      treeItem => treeItem.item.checked === firstItemCheckedValue\n    );\n\n    this.toggleObjectsCheckboxEl.checked = firstItemCheckedValue;\n    this.toggleObjectsCheckboxEl.indeterminate =\n      !allItemsHaveTheSameCheckedValue;\n    /* /End of evaluate 'select/unselect checkbox' state*/\n\n    /* 2. Begin of checked items evaluation*/\n    const checkedItems = allItemsWithCheckbox.filter(node => node.item.checked);\n    // objects checked\n    const checkedObjects = checkedItems.filter(\n      node => node.item.metadata === KB_OBJECT\n    );\n\n    const checkedObjectsIds: string[] = [];\n    if (checkedObjects.length > 0) {\n      checkedObjects.forEach(objectChecked => {\n        checkedObjectsIds.push(objectChecked.item.id);\n      });\n    }\n    /* /End of checked items evaluation*/\n\n    /* 3. Begin of caption update*/\n    /* TO DO (when we can differentiate the caption from the number of children)*/\n    // const categoryItems = allItemsWithCheckbox.filter(\n    //   node => node.item.metadata === KB_CATEGORY\n    // );\n    // categoryItems.forEach(category => {\n    //   const itemInfo = category.item;\n    //   // Update the amount of checked values\n    //   if (itemInfo.leaf !== true) {\n    //     const totalItems = itemInfo.items.length;\n\n    //     const totalItemsChecked = itemInfo.items.filter(\n    //       itemUIModel => itemUIModel.checked\n    //     ).length;\n\n    //     const newItemCaption =\n    //       totalItems !== totalItemsChecked\n    //         ? `${itemInfo.caption} (${totalItemsChecked}/${totalItems})`\n    //         : `${itemInfo.caption} (${totalItems})`;\n\n    //     // Only update the item caption if needed\n    //     if (newItemCaption !== itemInfo.caption) {\n    //       this.objectsTreeEl.updateItemsProperties([itemInfo.id], {\n    //         id: itemInfo.id,\n    //         caption: newItemCaption\n    //       });\n    //     }\n    //   }\n    // });\n\n    /* /End of caption update*/\n    this.checkedObjectsIds = checkedObjectsIds;\n  };\n\n  private objectsTreeSelectedItemsChangedHandler = (\n    event: CustomEvent<TreeViewItemModelExtended[]>\n  ) => {\n    this.selectedObjectsInFileIds = event.detail.map(item => item.item.id);\n  };\n\n  private objectsTreeContextMenuHandler = (\n    event: CustomEvent<TreeViewItemContextMenu>\n  ) => {\n    if (this.objectContextMenuCallback && event.detail.metadata === KB_OBJECT) {\n      this.objectContextMenuCallback(\"imported\", {\n        selection: this.selectedObjectsInFileIds,\n        clientX: event.detail.contextmenuEvent.screenX,\n        clientY: event.detail.contextmenuEvent.screenY\n      });\n    }\n  };\n\n  private cancelImportHandler = () => {\n    if (this.cancelCallback) {\n      this.cancelCallback();\n      // returns boolean\n    }\n  };\n\n  private optionsHandler = () => {\n    if (this.optionsCallback) {\n      this.optionsCallback();\n      // returns boolean\n    }\n  };\n\n  private clearStatusHandler = () => {\n    this.importTreeState = [];\n    this.statusInfo.error.number = 0;\n    this.statusInfo.warning.number = 0;\n    this.statusInfo.success.number = 0;\n  };\n\n  private toggleSelectionClickHandler = (e: MouseEvent) => {\n    const checked = (e.target as HTMLGxgFormCheckboxElement).checked;\n    this.toggleObjectsCheckboxEl.indeterminate = false;\n    this.objectsTreeEl.updateAllItemsProperties({ checked: checked });\n  };\n\n  private statusButtonsSelectionChangedHandler = (\n    e: CustomEvent<CheckedItemsInfo>\n  ) => {\n    const activeStates = e.detail;\n    const errorIndex = activeStates.findIndex(\n      state => state.itemId === \"error\"\n    );\n    const warningIndex = activeStates.findIndex(\n      state => state.itemId === \"warning\"\n    );\n    const successIndex = activeStates.findIndex(\n      state => state.itemId === \"success\"\n    );\n    this.statusInfo = {\n      error: {\n        display: errorIndex !== -1,\n        number: this.statusInfo.error.number\n      },\n      warning: {\n        display: warningIndex !== -1,\n        number: this.statusInfo.warning.number\n      },\n      success: {\n        display: successIndex !== -1,\n        number: this.statusInfo.success.number\n      }\n    };\n    this.evaluateImportStatusMessage();\n  };\n\n  private evaluateCheckAllValue = (): boolean => {\n    let checked = true;\n    const allAreChecked =\n      this.objectsInFileTotalNodes === this.checkedObjectsIds.length;\n    const conditionToUncheck =\n      this.objectsTreeState.length === 0 || !allAreChecked;\n    if (conditionToUncheck) {\n      checked = false;\n    }\n    return checked;\n  };\n\n  private fileClearedHandler = () => {\n    this.selectedFile = null;\n  };\n\n  private loaderCancelCallbackHandler = () => {\n    if (this.cancelCallback) {\n      this.cancelCallback();\n    }\n  };\n\n  //  10.RENDER() FUNCTION //\n\n  render(): void {\n    return (\n      <Host class=\"gx-ide-component\">\n        <div class=\"gx-ide-main-wrapper\">\n          <gx-ide-container\n            noContentPadding\n            noFooterPadding\n            containerTitle={\n              this.displayTitle ? this._componentLocale.componentName : null\n            }\n          >\n            {/* header */}\n            <header class=\"header\" slot=\"header\">\n              {/* select a file */}\n              <gxg-form-text\n                type=\"file\"\n                class=\"select-file\"\n                label={this._componentLocale.header.fileNameLabel}\n                placeholder={this._componentLocale.header.fileNamePlaceholder}\n                part=\"file-name\"\n                acceptFile=\".xpz, .xml\"\n                clearButton\n                iconPosition=\"start\"\n                onFileSelected={this.fileSelectedHandler}\n                onClearButtonClicked={this.fileClearedHandler}\n                ref={(el: HTMLGxgFormTextElement) =>\n                  (this.fileInputEl = el as HTMLGxgFormTextElement)\n                }\n              ></gxg-form-text>\n              {/* select file button / load button*/}\n              <gxg-button\n                type=\"primary-text-icon\"\n                icon=\"gemini-tools/file\"\n                part=\"select-file-load-button\"\n                onClick={this.selectFileAndLoadHandler}\n                disabled={this.importingIsInProcess}\n              >\n                {this._componentLocale.header.selectFileButton}\n              </gxg-button>\n            </header>\n            {/* main */}\n            <main class=\"main\">\n              {/* objects in file*/}\n              <gx-ide-container\n                containerTitle={this._componentLocale.main.objectsInFile.title}\n                noContentPadding\n                noBorderFooter\n                class=\"left-grid-item\"\n                slimmerFooter\n                inactiveTitle={this.noObjects}\n                footerSubtleShadow={!this.noObjects}\n                titleType=\"secondary\"\n              >\n                <div\n                  class={{\n                    \"tree-container\": true,\n                    \"tree-container--objects-in-file\": true,\n                    \"tree-container--empty\": this.noObjects\n                  }}\n                >\n                  {!this.noObjects ? (\n                    <gxg-tree-view\n                      treeModel={this.objectsTreeState}\n                      dragDisabled={true}\n                      dropDisabled={true}\n                      toggleCheckboxes={true}\n                      checkbox={true}\n                      checked={true}\n                      onCheckedItemsChange={\n                        this.objectsTreeCheckedItemsChangedHandler\n                      }\n                      onSelectedItemsChange={\n                        this.objectsTreeSelectedItemsChangedHandler\n                      }\n                      onItemContextmenu={this.objectsTreeContextMenuHandler}\n                      ref={el =>\n                        (this.objectsTreeEl = el as HTMLGxgTreeViewElement)\n                      }\n                    ></gxg-tree-view>\n                  ) : (\n                    <div class=\"gx-ide-message\">\n                      <gxg-text\n                        textAlign={\n                          config.gxgMessage.common.textAlign as TextAlign\n                        }\n                        padding={\n                          config.gxgMessage.common.textAlign as TextPadding\n                        }\n                        type={config.gxgMessage.common.type as TextType}\n                        maxWidth={config.gxgMessage.common.maxWidth}\n                        part=\"objects-in-file-empty-status-message\"\n                      >\n                        There are no Objects. <br />\n                        <gxg-text\n                          type=\"text-link-no-line\"\n                          onClick={this.selectFileAndLoadHandler}\n                        >\n                          Begin by selecting a file.\n                        </gxg-text>\n                      </gxg-text>\n                    </div>\n                  )}\n                </div>\n                {/* select all / unselect all checkbox*/}\n                <gxg-form-checkbox\n                  label={\n                    this._componentLocale.main.objectsInFile.selectUnselect\n                  }\n                  part=\"select-all-checkbox\"\n                  slot=\"footer-start\"\n                  disabled={\n                    this.importingIsInProcess ||\n                    this.objectsTreeState.length === 0\n                  }\n                  checked={this.evaluateCheckAllValue()}\n                  onClick={this.toggleSelectionClickHandler}\n                  ref={(el: HTMLGxgFormCheckboxElement) =>\n                    (this.toggleObjectsCheckboxEl =\n                      el as HTMLGxgFormCheckboxElement)\n                  }\n                ></gxg-form-checkbox>\n                {/* import button / cancel button*/}\n                <gxg-button-group\n                  slot=\"footer-end\"\n                  ref={(el: HTMLGxgButtonGroupElement) =>\n                    (this.objectsButtonsGroup = el as HTMLGxgButtonGroupElement)\n                  }\n                >\n                  {/* import objects button*/}\n                  <button\n                    id=\"import-btn\"\n                    part=\"import-button\"\n                    disabled={\n                      this.objectsTreeState?.length === 0 ||\n                      this.importingIsInProcess\n                    }\n                    onClick={this.importObjectsHandler}\n                  >\n                    {this._componentLocale.main.objectsInFile.importButton}\n                  </button>\n                  {/* cancel-import button*/}\n                  <button\n                    id=\"cancel-import-btn\"\n                    part=\"cancel-import-button\"\n                    disabled={!this.importingIsInProcess}\n                    onClick={this.cancelImportHandler}\n                  >\n                    {this._componentLocale.main.objectsInFile.cancelButton}\n                  </button>\n                </gxg-button-group>\n                {/* settings/options button*/}\n                <gxg-button\n                  type=\"secondary-icon-only\"\n                  icon=\"gemini-tools/settings\"\n                  slot=\"footer-end\"\n                  part=\"select-kb-btn\"\n                  onClick={this.optionsHandler}\n                >\n                  {this._componentLocale.header.optionsButton}\n                </gxg-button>\n              </gx-ide-container>\n\n              {/* import status */}\n              <gx-ide-container\n                containerTitle={this._componentLocale.main.importStatus.title}\n                noContentPadding\n                noBorderFooter\n                slimmerFooter\n                inactiveTitle={this.noImport}\n                footerSubtleShadow={!this.noImport}\n                titleType=\"secondary\"\n              >\n                <div\n                  class={{\n                    \"tree-container\": true,\n                    \"tree-container--import-status\": true,\n                    \"tree-container--empty\":\n                      this.noImport || !this.someStatusVisible,\n                    \"tree-container--no-warnings\":\n                      !this.statusInfo.warning.display,\n                    \"tree-container--no-errors\": !this.statusInfo.error.display,\n                    \"tree-container--no-succeeded\":\n                      !this.statusInfo.success.display\n                  }}\n                >\n                  {!this.noImport && this.someStatusVisible ? (\n                    <gxg-tree-view\n                      treeModel={this.importTreeState}\n                      toggleCheckboxes={true}\n                    ></gxg-tree-view>\n                  ) : (\n                    <gxg-text\n                      textAlign={\n                        config.gxgMessage.common.textAlign as TextAlign\n                      }\n                      padding={\n                        config.gxgMessage.common.textAlign as TextPadding\n                      }\n                      type={config.gxgMessage.common.type as TextType}\n                      maxWidth={config.gxgMessage.common.maxWidth}\n                      part=\"objects-in-file-empty-status-message\"\n                      class=\"gx-ide-message\"\n                    >\n                      {this.importStatusMessage}\n                    </gxg-text>\n                  )}\n                </div>\n                {/* clear status button */}\n                <gxg-text\n                  type=\"button-like\"\n                  slot=\"footer-end\"\n                  part=\"select-kb-btn\"\n                  onClick={this.clearStatusHandler}\n                  disabled={this.noImport || this.importingIsInProcess}\n                >\n                  {this._componentLocale.main.importStatus.clearButton}\n                </gxg-text>\n                {/* ghost element (used to force the container footer heights the same as the \"objects in file\" container tree)*/}\n                <span class=\"ghost-element\" slot=\"footer-start\"></span>\n              </gx-ide-container>\n            </main>\n            {/* footer */}\n            <footer slot=\"footer-start\">\n              <gx-ide-status-buttons\n                errors={this.statusInfo.error.number}\n                warnings={this.statusInfo.warning.number}\n                successes={this.statusInfo.success.number}\n                hideMessage\n                compact\n                noBorderTop\n                noBorderBottom\n                noBorderStart\n                minimal={this.statusMinimal}\n                onSelectionChanged={this.statusButtonsSelectionChangedHandler}\n              ></gx-ide-status-buttons>\n            </footer>\n          </gx-ide-container>\n          <gxg-ide-loader description=\"Importing objects...\"></gxg-ide-loader>\n        </div>\n        {/* loader*/}\n        {this.loader ? (\n          <gxg-ide-loader\n            cancelLabel={this._componentLocale.loader.cancelLabel}\n            container={this.el}\n            loaderTitle={this._componentLocale.loader.title}\n            ref={el => (this.loaderEl = el as HTMLGxgIdeLoaderElement)}\n            cancelCallback={this.loaderCancelCallbackHandler}\n          ></gxg-ide-loader>\n        ) : null}\n      </Host>\n    );\n  }\n}\n\nexport type LoadCallback = (file: File) => Promise<ImportCategoryData[]>;\n\nexport type ImportCallback = (itemIds: string[]) => Promise<boolean>;\n\nexport type CancelCallback = () => Promise<boolean>;\n\nexport type OptionsCallback = () => Promise<void>;\nexport interface SelectedObject {\n  itemId: string;\n  subItemsIds: string[];\n}\n\nexport type ImportItemData = {\n  id: string;\n  name: string;\n};\n\ntype StatusInfo = {\n  error: {\n    display: boolean;\n    number: number;\n  };\n  warning: {\n    display: boolean;\n    number: number;\n  };\n  success: {\n    display: boolean;\n    number: number;\n  };\n};\n\nexport type ObjectContextMenuCallback = (\n  tree: ObjectsSourceType,\n  contextMenuInfo: ContextMenuInfo\n) => Promise<void>;\n\nexport type ObjectsSourceType = \"in-file\" | \"imported\";\n"],"mappings":"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"}

package/dist/genexus-ide-ui/{p-2bb01f01.entry.js → p-b3b8277e.entry.js}

@@ -1,10 +1,12 @@
-import { r as e, c as t, h as i, H as s } from "./p-1e275d2c.js";
+import { r as e, c as t, h as s, H as i, g as o } from "./p-1e275d2c.js";
 
-const o = ":host{display:block;border:1px solid var(--gx-ide-container-border-color);--status-buttons-label-color:var(--gray-06)}gx-ide-list-selector::part(list){display:flex;flex-direction:row}gx-ide-list-selector-item{border-block-start:none !important;flex:1;text-align:center;}gx-ide-list-selector-item.not-zero{font-weight:var(--font-weight-semibold)}gx-ide-list-selector-item:not(:last-child){border-inline-end:1px solid var(--gx-ide-container-border-color)}gx-ide-list-selector-item .label__wrapper{display:inline-flex;width:auto;min-height:0}gx-ide-list-selector-item .label__description{color:var(--status-buttons-label-color)}gx-ide-list-selector-item .active-indicator{display:inline-block;width:var(--spacing-comp-02);height:var(--spacing-comp-02);border:1px solid var(--gray-07);border-radius:calc(var(--spacing-comp-02) / 2)}gx-ide-list-selector-item input:checked+.label{--status-buttons-label-color:var(--color-on-background);background-color:inherit}gx-ide-list-selector-item input:checked+.label .active-indicator{background-color:var(--color-primary-enabled);border-color:var(--color-primary-active)}gx-ide-list-selector-item:hover input:checked+.label{background-color:var(--gxg-background-color--hover) !important}:host([compact]) gx-ide-list-selector-item{font-size:var(--font-size-md)}:host([compact]) .label__wrapper{gap:var(--spacing-comp-01);padding:var(--spacing-comp-00) var(--spacing-comp-02) var(--spacing-comp-00) var(--spacing-comp-01)}:host([compact]) .label__universal-slot{margin-inline-end:var(--spacing-comp-00)}:host([no-border]){border:none}:host([no-border-top]){border-top:none}:host([no-border-end]){border-inline-end:none}:host([no-border-bottom]){border-bottom:none}:host([no-border-start]){border-inline-start:none}:host([no-inner-borders]) gx-ide-list-selector-item{border-inline-end:none}";
+import { L as r } from "./p-74d59062.js";
 
-const r = class {
-  constructor(i) {
-    e(this, i);
+const l = ":host{display:block;border:1px solid var(--gx-ide-container-border-color);--status-buttons-label-color:var(--gray-06)}gx-ide-list-selector::part(list){display:flex;flex-direction:row}gx-ide-list-selector-item{border-block-start:none !important;flex:1;text-align:center;}gx-ide-list-selector-item.not-zero{font-weight:var(--font-weight-semibold)}gx-ide-list-selector-item:not(:last-child){border-inline-end:1px solid var(--gx-ide-container-border-color)}gx-ide-list-selector-item .label__wrapper{display:inline-flex;width:auto;min-height:0}gx-ide-list-selector-item .label__description{color:var(--status-buttons-label-color)}gx-ide-list-selector-item .active-indicator{display:inline-block;width:var(--spacing-comp-02);height:var(--spacing-comp-02);border:1px solid var(--gray-07);border-radius:calc(var(--spacing-comp-02) / 2)}gx-ide-list-selector-item input:checked+.label{--status-buttons-label-color:var(--color-on-background);background-color:inherit}gx-ide-list-selector-item input:checked+.label .active-indicator{background-color:var(--color-primary-enabled);border-color:var(--color-primary-active)}gx-ide-list-selector-item:hover input:checked+.label{background-color:var(--gxg-background-color--hover) !important}:host([compact]) gx-ide-list-selector-item{font-size:var(--font-size-md)}:host([compact]) .label__wrapper{gap:var(--spacing-comp-01);padding:var(--spacing-comp-00) var(--spacing-comp-02) var(--spacing-comp-00) var(--spacing-comp-01)}:host([compact]) .label__universal-slot{margin-inline-end:var(--spacing-comp-00)}:host([no-border]){border:none}:host([no-border-top]){border-top:none}:host([no-border-end]){border-inline-end:none}:host([no-border-bottom]){border-bottom:none}:host([no-border-start]){border-inline-start:none}:host([no-inner-borders]) gx-ide-list-selector-item{border-inline-end:none}";
+
+const a = class {
+  constructor(s) {
+    e(this, s);
     this.selectionChanged = t(this, "selectionChanged", 7);
     // 7.LISTENERS //
     // 8.PUBLIC METHODS API //
@@ -15,25 +17,12 @@ const r = class {
       }
     };
     this.evaluateLabel = e => {
-      let t = "";
-      if (!this.minimal && e !== "success") {
-        t = e;
-      } else if (!this.minimal && e === "success") {
-        t = "succeeded";
-      }
-      let i;
-      if (e === "error") {
-        i = this.errors;
-      } else if (e === "warning") {
-        i = this.warnings;
-      } else if (e === "success") {
-        i = this.succeeded;
-      }
+      const t = this[e];
       if (this.minimal) {
-        return i === 0 ? "none" : `${i}`;
+        return `${t}`;
       } else {
-        const s = e === "success" ? "" : "s";
-        return i === 1 ? `1 ${t}` : `${i} ${t}${s}`;
+        const s = t === 1;
+        return s ? `${t} ${this._componentLocale[e]["singular"]}` : `${t} ${this._componentLocale[e]["plural"]}`;
       }
     };
     this.selectionChangedHandler = e => {
@@ -42,8 +31,13 @@ const r = class {
     };
     this.active = false;
     this.errors = 0;
+    this.hideError = false;
     this.warnings = 0;
-    this.succeeded = 0;
+    this.hideWarning = false;
+    this.successes = 0;
+    this.hideSuccess = false;
+    this.messages = 0;
+    this.hideMessage = false;
     this.minimal = false;
     this.compact = false;
     this.noBorder = false;
@@ -55,21 +49,22 @@ const r = class {
     this.iconsSize = "regular";
   }
   // 6.COMPONENT LIFECYCLE METHODS //
-  componentWillLoad() {
+  async componentWillLoad() {
+    this._componentLocale = await r.getComponentStrings(this.el);
     this.evaluateIconsSize();
   }
   // 10.RENDER() FUNCTION //
   render() {
-    return i(s, null, i("gx-ide-list-selector", {
+    return s(i, null, s("gx-ide-list-selector", {
       type: "multi-selection",
       listName: "status-buttons",
       noListBorder: true,
       ellipsis: true,
       iconsSize: this.iconsSize,
       onSelectionChanged: this.selectionChangedHandler
-    }, i("gx-ide-list-selector-item", {
-      itemId: "error",
-      itemValue: this.evaluateLabel("error"),
+    }, !this.hideError ? s("gx-ide-list-selector-item", {
+      itemId: "errors",
+      itemValue: this.evaluateLabel("errors"),
       icon: "gx-test/result-exception",
       iconColor: this.errors === 0 ? "disabled" : "auto",
       class: {
@@ -77,14 +72,14 @@ const r = class {
         "not-zero": this.errors !== 0
       },
       itemChecked: true
-    }, i("span", {
+    }, s("span", {
       slot: "universal",
       class: {
         "active-indicator": true
       }
-    })), i("gx-ide-list-selector-item", {
-      itemId: "warning",
-      itemValue: this.evaluateLabel("warning"),
+    })) : null, !this.hideWarning ? s("gx-ide-list-selector-item", {
+      itemId: "warnings",
+      itemValue: this.evaluateLabel("warnings"),
       icon: "gx-test/result-warning",
       iconColor: this.warnings === 0 ? "disabled" : "auto",
       class: {
@@ -92,31 +87,52 @@ const r = class {
         "not-zero": this.warnings !== 0
       },
       itemChecked: true
-    }, i("span", {
+    }, s("span", {
       slot: "universal",
       class: {
         "active-indicator": true
       }
-    })), i("gx-ide-list-selector-item", {
-      itemId: "success",
-      itemValue: this.evaluateLabel("success"),
+    })) : null, !this.hideSuccess ? s("gx-ide-list-selector-item", {
+      itemId: "successes",
+      itemValue: this.evaluateLabel("successes"),
       icon: "gx-test/result-ok",
-      iconColor: this.succeeded === 0 ? "disabled" : "auto",
+      iconColor: this.successes === 0 ? "disabled" : "auto",
       class: {
         success: true,
-        "not-zero": this.succeeded !== 0
+        "not-zero": this.successes !== 0
       },
       itemChecked: true
-    }, i("span", {
+    }, s("span", {
       slot: "universal",
       class: {
         "active-indicator": true
       }
-    }))));
+    })) : null, !this.hideMessage ? s("gx-ide-list-selector-item", {
+      itemId: "messages",
+      itemValue: this.evaluateLabel("messages"),
+      icon: "gx-test/screenshot-viewer",
+      iconColor: this.successes === 0 ? "disabled" : "auto",
+      class: {
+        success: true,
+        "not-zero": this.successes !== 0
+      },
+      itemChecked: true
+    }, s("span", {
+      slot: "universal",
+      class: {
+        "active-indicator": true
+      }
+    })) : null));
+  }
+  static get assetsDirs() {
+    return [ "gx-ide-assets/status-buttons" ];
+  }
+  get el() {
+    return o(this);
   }
 };
 
-r.style = o;
+a.style = l;
 
-export { r as gx_ide_status_buttons };
-//# sourceMappingURL=p-2bb01f01.entry.js.map
+export { a as gx_ide_status_buttons };
+//# sourceMappingURL=p-b3b8277e.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["gxIdeStatusButtonsCss","GxIdeStatusButtons","this","evaluateIconsSize","compact","iconsSize","evaluateLabel","type","amount","minimal","singular","_componentLocale","selectionChangedHandler","e","stopPropagation","selectionChanged","emit","detail","componentWillLoad","Locale","getComponentStrings","el","render","h","Host","listName","noListBorder","ellipsis","onSelectionChanged","hideError","itemId","itemValue","icon","iconColor","errors","class","error","itemChecked","slot","hideWarning","warnings","warning","hideSuccess","successes","success","hideMessage"],"sources":["src/components/_helpers/status-buttons/gx-ide-status-buttons.scss?tag=gx-ide-status-buttons&encapsulation=shadow","src/components/_helpers/status-buttons/gx-ide-status-buttons.tsx"],"sourcesContent":[":host {\n  display: block;\n  border: 1px solid var(--gx-ide-container-border-color);\n  --status-buttons-label-color: var(--gray-06);\n}\n/*list-selector*/\ngx-ide-list-selector::part(list) {\n  display: flex;\n  flex-direction: row;\n}\n/*list-selector-items*/\ngx-ide-list-selector-item {\n  border-block-start: none !important; //reset\n\n  &.not-zero {\n    font-weight: var(--font-weight-semibold);\n  }\n\n  &:not(:last-child) {\n    border-inline-end: 1px solid var(--gx-ide-container-border-color);\n  }\n  flex: 1;\n  text-align: center;\n\n  .label {\n    &__wrapper {\n      display: inline-flex;\n      width: auto;\n      min-height: 0;\n    }\n    &__description {\n      color: var(--status-buttons-label-color);\n    }\n  }\n\n  /*active indicator*/\n  .active-indicator {\n    display: inline-block;\n    width: var(--spacing-comp-02);\n    height: var(--spacing-comp-02);\n    border: 1px solid var(--gray-07);\n    border-radius: calc(var(--spacing-comp-02) / 2);\n  }\n  input:checked {\n    + .label {\n      --status-buttons-label-color: var(--color-on-background);\n      background-color: inherit;\n\n      .active-indicator {\n        background-color: var(--color-primary-enabled);\n        border-color: var(--color-primary-active);\n      }\n    }\n  }\n\n  /*hover*/\n  &:hover {\n    input:checked + .label {\n      background-color: var(--gxg-background-color--hover) !important;\n    }\n  }\n}\n\n/*--------------------\nCompact size\n--------------------*/\n:host([compact]) {\n  gx-ide-list-selector-item {\n    font-size: var(--font-size-md);\n  }\n  .label__wrapper {\n    gap: var(--spacing-comp-01);\n    padding: var(--spacing-comp-00) var(--spacing-comp-02)\n      var(--spacing-comp-00) var(--spacing-comp-01);\n  }\n  .label__universal-slot {\n    margin-inline-end: var(--spacing-comp-00);\n  }\n}\n\n/*--------------------\nAll about borders\n--------------------*/\n:host([no-border]) {\n  border: none;\n}\n:host([no-border-top]) {\n  border-top: none;\n}\n:host([no-border-end]) {\n  border-inline-end: none;\n}\n:host([no-border-bottom]) {\n  border-bottom: none;\n}\n:host([no-border-start]) {\n  border-inline-start: none;\n}\n:host([no-inner-borders]) {\n  gx-ide-list-selector-item {\n    border-inline-end: none;\n  }\n}\n","/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  State,\n  Event,\n  EventEmitter\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { Size } from \"@genexus/gemini/dist/types/components/icon/icon\";\n/* CUSTOM IMPORTS */\nimport { CheckedItemsInfo } from \"../list-selector/list-selector\";\nimport { Locale } from \"../../../common/locale\";\n@Component({\n  tag: \"gx-ide-status-buttons\",\n  styleUrl: \"gx-ide-status-buttons.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/status-buttons\"]\n})\nexport class GxIdeStatusButtons {\n  /*\nINDEX:\n1.OWN PROPERTIES \n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API | WATCH'S\n5.EVENTS (EMIT)\n6.COMPONENT LIFECYCLE METHODS\n7.LISTENERS\n8.PUBLIC METHODS API\n9.LOCAL METHODS\n10.RENDER() FUNCTION\n*/\n\n  // 1.OWN PROPERTIES | WATCH'S //\n\n  /**\n   * The component hard-coded strings translations.\n   */\n  private _componentLocale: any;\n\n  /**\n   * Whether or not the buttons are active\n   */\n  @Prop() readonly active: boolean = false;\n\n  /**\n   * The errors amount\n   */\n  @Prop() readonly errors: number = 0;\n\n  /**\n   * Hide the errors button\n   */\n  @Prop() readonly hideError: boolean = false;\n\n  /**\n   * The warnings amount\n   */\n  @Prop() readonly warnings: number = 0;\n\n  /**\n   * Hide the warnings button\n   */\n  @Prop() readonly hideWarning: boolean = false;\n\n  /**\n   * The successes amount\n   */\n  @Prop() readonly successes: number = 0;\n\n  /**\n   * Hide the successes button\n   */\n  @Prop() readonly hideSuccess: boolean = false;\n\n  /**\n   * The messages amount\n   */\n  @Prop() readonly messages: number = 0;\n\n  /**\n   * Hide the messages button\n   */\n  @Prop() readonly hideMessage: boolean = false;\n\n  /**\n   * Display only the number\n   */\n  @Prop() readonly minimal: boolean = false;\n\n  /**\n   * If present will make the component look smaller.\n   */\n  @Prop({ reflect: true }) readonly compact: boolean = false;\n\n  /**\n   * No border all around\n   */\n  @Prop({ reflect: true }) readonly noBorder: boolean = false;\n\n  /**\n   * No inner borders\n   */\n  @Prop({ reflect: true }) readonly noInnerBorders: boolean = false;\n\n  /**\n   * No border on the top\n   */\n  @Prop({ reflect: true }) readonly noBorderTop: boolean = false;\n\n  /**\n   * No border on the end\n   */\n  @Prop({ reflect: true }) readonly noBorderEnd: boolean = false;\n\n  /**\n   * No border on the bottom\n   */\n  @Prop({ reflect: true }) readonly noBorderBottom: boolean = false;\n\n  /**\n   * No border on the start\n   */\n  @Prop({ reflect: true }) readonly noBorderStart: boolean = false;\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeStatusButtonsElement;\n\n  // 3.STATE() VARIABLES //\n\n  @State() iconsSize: Size = \"regular\";\n\n  // 4.PUBLIC PROPERTY API | WATCH'S //\n\n  // 5.EVENTS (EMIT) //\n\n  /**\n   * Emits the actual selection\n   */\n  @Event() selectionChanged: EventEmitter<CheckedItemsInfo>;\n\n  // 6.COMPONENT LIFECYCLE METHODS //\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n    this.evaluateIconsSize();\n  }\n\n  // 7.LISTENERS //\n\n  // 8.PUBLIC METHODS API //\n\n  // 9.LOCAL METHODS //\n\n  private evaluateIconsSize = () => {\n    if (this.compact) {\n      this.iconsSize = \"small\";\n    }\n  };\n\n  private evaluateLabel = (\n    type: \"errors\" | \"warnings\" | \"successes\" | \"messages\"\n  ): string => {\n    const amount = this[type];\n    if (this.minimal) {\n      return `${amount}`;\n    } else {\n      const singular: boolean = amount === 1;\n      return singular\n        ? `${amount} ${this._componentLocale[type][\"singular\"]}`\n        : `${amount} ${this._componentLocale[type][\"plural\"]}`;\n    }\n  };\n\n  private selectionChangedHandler = (e: CustomEvent<CheckedItemsInfo>) => {\n    e.stopPropagation();\n    this.selectionChanged.emit(e.detail);\n  };\n\n  // 10.RENDER() FUNCTION //\n\n  render() {\n    return (\n      <Host>\n        <gx-ide-list-selector\n          type=\"multi-selection\"\n          listName=\"status-buttons\"\n          noListBorder\n          ellipsis\n          iconsSize={this.iconsSize}\n          onSelectionChanged={this.selectionChangedHandler}\n        >\n          {!this.hideError ? (\n            <gx-ide-list-selector-item\n              itemId=\"errors\"\n              itemValue={this.evaluateLabel(\"errors\")}\n              icon=\"gx-test/result-exception\"\n              iconColor={this.errors === 0 ? \"disabled\" : \"auto\"}\n              class={{ \"error\": true, \"not-zero\": this.errors !== 0 }}\n              itemChecked\n            >\n              <span\n                slot=\"universal\"\n                class={{\n                  \"active-indicator\": true\n                }}\n              ></span>\n            </gx-ide-list-selector-item>\n          ) : null}\n          {!this.hideWarning ? (\n            <gx-ide-list-selector-item\n              itemId=\"warnings\"\n              itemValue={this.evaluateLabel(\"warnings\")}\n              icon=\"gx-test/result-warning\"\n              iconColor={this.warnings === 0 ? \"disabled\" : \"auto\"}\n              class={{ \"warning\": true, \"not-zero\": this.warnings !== 0 }}\n              itemChecked\n            >\n              <span\n                slot=\"universal\"\n                class={{\n                  \"active-indicator\": true\n                }}\n              ></span>\n            </gx-ide-list-selector-item>\n          ) : null}\n          {!this.hideSuccess ? (\n            <gx-ide-list-selector-item\n              itemId=\"successes\"\n              itemValue={this.evaluateLabel(\"successes\")}\n              icon=\"gx-test/result-ok\"\n              iconColor={this.successes === 0 ? \"disabled\" : \"auto\"}\n              class={{ \"success\": true, \"not-zero\": this.successes !== 0 }}\n              itemChecked\n            >\n              <span\n                slot=\"universal\"\n                class={{\n                  \"active-indicator\": true\n                }}\n              ></span>\n            </gx-ide-list-selector-item>\n          ) : null}\n          {!this.hideMessage ? (\n            <gx-ide-list-selector-item\n              itemId=\"messages\"\n              itemValue={this.evaluateLabel(\"messages\")}\n              icon=\"gx-test/screenshot-viewer\"\n              iconColor={this.successes === 0 ? \"disabled\" : \"auto\"}\n              class={{ \"success\": true, \"not-zero\": this.successes !== 0 }}\n              itemChecked\n            >\n              <span\n                slot=\"universal\"\n                class={{\n                  \"active-indicator\": true\n                }}\n              ></span>\n            </gx-ide-list-selector-item>\n          ) : null}\n        </gx-ide-list-selector>\n      </Host>\n    );\n  }\n}\n"],"mappings":";;;;AAAA,MAAMA,IAAwB;;MCsBjBC,IAAkB;;;;;;;QAyIrBC,KAAAC,oBAAoB;MAC1B,IAAID,KAAKE,SAAS;QAChBF,KAAKG,YAAY;;;IAIbH,KAAAI,gBACNC;MAEA,MAAMC,IAASN,KAAKK;MACpB,IAAIL,KAAKO,SAAS;QAChB,OAAO,GAAGD;aACL;QACL,MAAME,IAAoBF,MAAW;QACrC,OAAOE,IACH,GAAGF,KAAUN,KAAKS,iBAAiBJ,GAAM,gBACzC,GAAGC,KAAUN,KAAKS,iBAAiBJ,GAAM;;;IAIzCL,KAAAU,0BAA2BC;MACjCA,EAAEC;MACFZ,KAAKa,iBAAiBC,KAAKH,EAAEI;AAAO;kBAtIH;kBAKD;qBAKI;oBAKF;uBAKI;qBAKH;uBAKG;oBAKJ;uBAKI;mBAKJ;mBAKiB;oBAKC;0BAKM;uBAKH;uBAKA;0BAKG;yBAKD;qBAQhC;;;EAa3B,uBAAMC;IACJhB,KAAKS,yBAAyBQ,EAAOC,oBAAoBlB,KAAKmB;IAC9DnB,KAAKC;;;EAoCP,MAAAmB;IACE,OACEC,EAACC,GAAI,MACHD,EAAA;MACEhB,MAAK;MACLkB,UAAS;MACTC,cAAY;MACZC,UAAQ;MACRtB,WAAWH,KAAKG;MAChBuB,oBAAoB1B,KAAKU;QAEvBV,KAAK2B,YACLN,EAAA;MACEO,QAAO;MACPC,WAAW7B,KAAKI,cAAc;MAC9B0B,MAAK;MACLC,WAAW/B,KAAKgC,WAAW,IAAI,aAAa;MAC5CC,OAAO;QAAEC,OAAS;QAAM,YAAYlC,KAAKgC,WAAW;;MACpDG,aAAW;OAEXd,EAAA;MACEe,MAAK;MACLH,OAAO;QACL,oBAAoB;;UAIxB,OACFjC,KAAKqC,cACLhB,EAAA;MACEO,QAAO;MACPC,WAAW7B,KAAKI,cAAc;MAC9B0B,MAAK;MACLC,WAAW/B,KAAKsC,aAAa,IAAI,aAAa;MAC9CL,OAAO;QAAEM,SAAW;QAAM,YAAYvC,KAAKsC,aAAa;;MACxDH,aAAW;OAEXd,EAAA;MACEe,MAAK;MACLH,OAAO;QACL,oBAAoB;;UAIxB,OACFjC,KAAKwC,cACLnB,EAAA;MACEO,QAAO;MACPC,WAAW7B,KAAKI,cAAc;MAC9B0B,MAAK;MACLC,WAAW/B,KAAKyC,cAAc,IAAI,aAAa;MAC/CR,OAAO;QAAES,SAAW;QAAM,YAAY1C,KAAKyC,cAAc;;MACzDN,aAAW;OAEXd,EAAA;MACEe,MAAK;MACLH,OAAO;QACL,oBAAoB;;UAIxB,OACFjC,KAAK2C,cACLtB,EAAA;MACEO,QAAO;MACPC,WAAW7B,KAAKI,cAAc;MAC9B0B,MAAK;MACLC,WAAW/B,KAAKyC,cAAc,IAAI,aAAa;MAC/CR,OAAO;QAAES,SAAW;QAAM,YAAY1C,KAAKyC,cAAc;;MACzDN,aAAW;OAEXd,EAAA;MACEe,MAAK;MACLH,OAAO;QACL,oBAAoB;;UAIxB"}

package/dist/types/components/_helpers/status-buttons/gx-ide-status-buttons.d.ts

@@ -3,21 +3,45 @@ import { Size } from "@genexus/gemini/dist/types/components/icon/icon";
 import { CheckedItemsInfo } from "../list-selector/list-selector";
 export declare class GxIdeStatusButtons {
     /**
-     * Whether or not the buttons begin active or not
+     * The component hard-coded strings translations.
+     */
+    private _componentLocale;
+    /**
+     * Whether or not the buttons are active
      */
     readonly active: boolean;
     /**
      * The errors amount
      */
     readonly errors: number;
+    /**
+     * Hide the errors button
+     */
+    readonly hideError: boolean;
     /**
      * The warnings amount
      */
     readonly warnings: number;
     /**
-     * The succeded amount
+     * Hide the warnings button
+     */
+    readonly hideWarning: boolean;
+    /**
+     * The successes amount
+     */
+    readonly successes: number;
+    /**
+     * Hide the successes button
+     */
+    readonly hideSuccess: boolean;
+    /**
+     * The messages amount
+     */
+    readonly messages: number;
+    /**
+     * Hide the messages button
      */
-    readonly succeeded: number;
+    readonly hideMessage: boolean;
     /**
      * Display only the number
      */
@@ -50,12 +74,13 @@ export declare class GxIdeStatusButtons {
      * No border on the start
      */
     readonly noBorderStart: boolean;
+    el: HTMLGxIdeStatusButtonsElement;
     iconsSize: Size;
     /**
      * Emits the actual selection
      */
     selectionChanged: EventEmitter<CheckedItemsInfo>;
-    componentWillLoad(): void;
+    componentWillLoad(): Promise<void>;
     private evaluateIconsSize;
     private evaluateLabel;
     private selectionChangedHandler;

package/dist/types/components.d.ts

@@ -1024,7 +1024,7 @@ export namespace Components {
     }
     interface GxIdeStatusButtons {
         /**
-          * Whether or not the buttons begin active or not
+          * Whether or not the buttons are active
          */
         "active": boolean;
         /**
@@ -1035,6 +1035,26 @@ export namespace Components {
           * The errors amount
          */
         "errors": number;
+        /**
+          * Hide the errors button
+         */
+        "hideError": boolean;
+        /**
+          * Hide the messages button
+         */
+        "hideMessage": boolean;
+        /**
+          * Hide the successes button
+         */
+        "hideSuccess": boolean;
+        /**
+          * Hide the warnings button
+         */
+        "hideWarning": boolean;
+        /**
+          * The messages amount
+         */
+        "messages": number;
         /**
           * Display only the number
          */
@@ -1064,9 +1084,9 @@ export namespace Components {
          */
         "noInnerBorders": boolean;
         /**
-          * The succeded amount
+          * The successes amount
          */
-        "succeeded": number;
+        "successes": number;
         /**
           * The warnings amount
          */
@@ -3050,7 +3070,7 @@ declare namespace LocalJSX {
     }
     interface GxIdeStatusButtons {
         /**
-          * Whether or not the buttons begin active or not
+          * Whether or not the buttons are active
          */
         "active"?: boolean;
         /**
@@ -3061,6 +3081,26 @@ declare namespace LocalJSX {
           * The errors amount
          */
         "errors"?: number;
+        /**
+          * Hide the errors button
+         */
+        "hideError"?: boolean;
+        /**
+          * Hide the messages button
+         */
+        "hideMessage"?: boolean;
+        /**
+          * Hide the successes button
+         */
+        "hideSuccess"?: boolean;
+        /**
+          * Hide the warnings button
+         */
+        "hideWarning"?: boolean;
+        /**
+          * The messages amount
+         */
+        "messages"?: number;
         /**
           * Display only the number
          */
@@ -3094,9 +3134,9 @@ declare namespace LocalJSX {
          */
         "onSelectionChanged"?: (event: GxIdeStatusButtonsCustomEvent<CheckedItemsInfo1>) => void;
         /**
-          * The succeded amount
+          * The successes amount
          */
-        "succeeded"?: number;
+        "successes"?: number;
         /**
           * The warnings amount
          */

package/package.json

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

package/dist/genexus-ide-ui/p-2bb01f01.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["gxIdeStatusButtonsCss","GxIdeStatusButtons","this","evaluateIconsSize","compact","iconsSize","evaluateLabel","type","label","minimal","refType","errors","warnings","succeeded","suffix","selectionChangedHandler","e","stopPropagation","selectionChanged","emit","detail","componentWillLoad","render","h","Host","listName","noListBorder","ellipsis","onSelectionChanged","itemId","itemValue","icon","iconColor","class","error","itemChecked","slot","warning","success"],"sources":["src/components/_helpers/status-buttons/gx-ide-status-buttons.scss?tag=gx-ide-status-buttons&encapsulation=shadow","src/components/_helpers/status-buttons/gx-ide-status-buttons.tsx"],"sourcesContent":[":host {\n  display: block;\n  border: 1px solid var(--gx-ide-container-border-color);\n  --status-buttons-label-color: var(--gray-06);\n}\n/*list-selector*/\ngx-ide-list-selector::part(list) {\n  display: flex;\n  flex-direction: row;\n}\n/*list-selector-items*/\ngx-ide-list-selector-item {\n  border-block-start: none !important; //reset\n\n  &.not-zero {\n    font-weight: var(--font-weight-semibold);\n  }\n\n  &:not(:last-child) {\n    border-inline-end: 1px solid var(--gx-ide-container-border-color);\n  }\n  flex: 1;\n  text-align: center;\n\n  .label {\n    &__wrapper {\n      display: inline-flex;\n      width: auto;\n      min-height: 0;\n    }\n    &__description {\n      color: var(--status-buttons-label-color);\n    }\n  }\n\n  /*active indicator*/\n  .active-indicator {\n    display: inline-block;\n    width: var(--spacing-comp-02);\n    height: var(--spacing-comp-02);\n    border: 1px solid var(--gray-07);\n    border-radius: calc(var(--spacing-comp-02) / 2);\n  }\n  input:checked {\n    + .label {\n      --status-buttons-label-color: var(--color-on-background);\n      background-color: inherit;\n\n      .active-indicator {\n        background-color: var(--color-primary-enabled);\n        border-color: var(--color-primary-active);\n      }\n    }\n  }\n\n  /*hover*/\n  &:hover {\n    input:checked + .label {\n      background-color: var(--gxg-background-color--hover) !important;\n    }\n  }\n}\n\n/*--------------------\nCompact size\n--------------------*/\n:host([compact]) {\n  gx-ide-list-selector-item {\n    font-size: var(--font-size-md);\n  }\n  .label__wrapper {\n    gap: var(--spacing-comp-01);\n    padding: var(--spacing-comp-00) var(--spacing-comp-02)\n      var(--spacing-comp-00) var(--spacing-comp-01);\n  }\n  .label__universal-slot {\n    margin-inline-end: var(--spacing-comp-00);\n  }\n}\n\n/*--------------------\nAll about borders\n--------------------*/\n:host([no-border]) {\n  border: none;\n}\n:host([no-border-top]) {\n  border-top: none;\n}\n:host([no-border-end]) {\n  border-inline-end: none;\n}\n:host([no-border-bottom]) {\n  border-bottom: none;\n}\n:host([no-border-start]) {\n  border-inline-start: none;\n}\n:host([no-inner-borders]) {\n  gx-ide-list-selector-item {\n    border-inline-end: none;\n  }\n}\n","/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Event,\n  EventEmitter\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { Size } from \"@genexus/gemini/dist/types/components/icon/icon\";\n/* CUSTOM IMPORTS */\nimport { CheckedItemsInfo } from \"../list-selector/list-selector\";\n@Component({\n  tag: \"gx-ide-status-buttons\",\n  styleUrl: \"gx-ide-status-buttons.scss\",\n  shadow: true\n})\nexport class GxIdeStatusButtons {\n  /*\nINDEX:\n1.OWN PROPERTIES \n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API | WATCH'S\n5.EVENTS (EMIT)\n6.COMPONENT LIFECYCLE METHODS\n7.LISTENERS\n8.PUBLIC METHODS API\n9.LOCAL METHODS\n10.RENDER() FUNCTION\n*/\n\n  // 1.OWN PROPERTIES | WATCH'S //\n\n  /**\n   * Whether or not the buttons begin active or not\n   */\n  @Prop() readonly active: boolean = false;\n\n  /**\n   * The errors amount\n   */\n  @Prop() readonly errors: number = 0;\n\n  /**\n   * The warnings amount\n   */\n  @Prop() readonly warnings: number = 0;\n\n  /**\n   * The succeded amount\n   */\n  @Prop() readonly succeeded: number = 0;\n\n  /**\n   * Display only the number\n   */\n  @Prop() readonly minimal: boolean = false;\n\n  /**\n   * If present will make the component look smaller.\n   */\n  @Prop({ reflect: true }) readonly compact: boolean = false;\n\n  /**\n   * No border all around\n   */\n  @Prop({ reflect: true }) readonly noBorder: boolean = false;\n\n  /**\n   * No inner borders\n   */\n  @Prop({ reflect: true }) readonly noInnerBorders: boolean = false;\n\n  /**\n   * No border on the top\n   */\n  @Prop({ reflect: true }) readonly noBorderTop: boolean = false;\n\n  /**\n   * No border on the end\n   */\n  @Prop({ reflect: true }) readonly noBorderEnd: boolean = false;\n\n  /**\n   * No border on the bottom\n   */\n  @Prop({ reflect: true }) readonly noBorderBottom: boolean = false;\n\n  /**\n   * No border on the start\n   */\n  @Prop({ reflect: true }) readonly noBorderStart: boolean = false;\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  // 3.STATE() VARIABLES //\n\n  @State() iconsSize: Size = \"regular\";\n\n  // 4.PUBLIC PROPERTY API | WATCH'S //\n\n  // 5.EVENTS (EMIT) //\n\n  /**\n   * Emits the actual selection\n   */\n  @Event() selectionChanged: EventEmitter<CheckedItemsInfo>;\n\n  // 6.COMPONENT LIFECYCLE METHODS //\n\n  componentWillLoad() {\n    this.evaluateIconsSize();\n  }\n\n  // 7.LISTENERS //\n\n  // 8.PUBLIC METHODS API //\n\n  // 9.LOCAL METHODS //\n\n  private evaluateIconsSize = () => {\n    if (this.compact) {\n      this.iconsSize = \"small\";\n    }\n  };\n\n  private evaluateLabel = (type: \"error\" | \"warning\" | \"success\"): string => {\n    let label = \"\";\n    if (!this.minimal && type !== \"success\") {\n      label = type;\n    } else if (!this.minimal && type === \"success\") {\n      label = \"succeeded\";\n    }\n    let refType: number;\n    if (type === \"error\") {\n      refType = this.errors;\n    } else if (type === \"warning\") {\n      refType = this.warnings;\n    } else if (type === \"success\") {\n      refType = this.succeeded;\n    }\n    if (this.minimal) {\n      return refType === 0 ? \"none\" : `${refType}`;\n    } else {\n      const suffix = type === \"success\" ? \"\" : \"s\";\n      return refType === 1 ? `1 ${label}` : `${refType} ${label}${suffix}`;\n    }\n  };\n\n  private selectionChangedHandler = (e: CustomEvent<CheckedItemsInfo>) => {\n    e.stopPropagation();\n    this.selectionChanged.emit(e.detail);\n  };\n\n  // 10.RENDER() FUNCTION //\n\n  render() {\n    return (\n      <Host>\n        <gx-ide-list-selector\n          type=\"multi-selection\"\n          listName=\"status-buttons\"\n          noListBorder\n          ellipsis\n          iconsSize={this.iconsSize}\n          onSelectionChanged={this.selectionChangedHandler}\n        >\n          <gx-ide-list-selector-item\n            itemId=\"error\"\n            itemValue={this.evaluateLabel(\"error\")}\n            icon=\"gx-test/result-exception\"\n            iconColor={this.errors === 0 ? \"disabled\" : \"auto\"}\n            class={{ \"error\": true, \"not-zero\": this.errors !== 0 }}\n            itemChecked\n          >\n            <span\n              slot=\"universal\"\n              class={{\n                \"active-indicator\": true\n              }}\n            ></span>\n          </gx-ide-list-selector-item>\n          <gx-ide-list-selector-item\n            itemId=\"warning\"\n            itemValue={this.evaluateLabel(\"warning\")}\n            icon=\"gx-test/result-warning\"\n            iconColor={this.warnings === 0 ? \"disabled\" : \"auto\"}\n            class={{ \"warning\": true, \"not-zero\": this.warnings !== 0 }}\n            itemChecked\n          >\n            <span\n              slot=\"universal\"\n              class={{\n                \"active-indicator\": true\n              }}\n            ></span>\n          </gx-ide-list-selector-item>\n          <gx-ide-list-selector-item\n            itemId=\"success\"\n            itemValue={this.evaluateLabel(\"success\")}\n            icon=\"gx-test/result-ok\"\n            iconColor={this.succeeded === 0 ? \"disabled\" : \"auto\"}\n            class={{ \"success\": true, \"not-zero\": this.succeeded !== 0 }}\n            itemChecked\n          >\n            <span\n              slot=\"universal\"\n              class={{\n                \"active-indicator\": true\n              }}\n            ></span>\n          </gx-ide-list-selector-item>\n        </gx-ide-list-selector>\n      </Host>\n    );\n  }\n}\n"],"mappings":";;AAAA,MAAMA,IAAwB;;MCmBjBC,IAAkB;;;;;;;QAwGrBC,KAAAC,oBAAoB;MAC1B,IAAID,KAAKE,SAAS;QAChBF,KAAKG,YAAY;;;IAIbH,KAAAI,gBAAiBC;MACvB,IAAIC,IAAQ;MACZ,KAAKN,KAAKO,WAAWF,MAAS,WAAW;QACvCC,IAAQD;aACH,KAAKL,KAAKO,WAAWF,MAAS,WAAW;QAC9CC,IAAQ;;MAEV,IAAIE;MACJ,IAAIH,MAAS,SAAS;QACpBG,IAAUR,KAAKS;aACV,IAAIJ,MAAS,WAAW;QAC7BG,IAAUR,KAAKU;aACV,IAAIL,MAAS,WAAW;QAC7BG,IAAUR,KAAKW;;MAEjB,IAAIX,KAAKO,SAAS;QAChB,OAAOC,MAAY,IAAI,SAAS,GAAGA;aAC9B;QACL,MAAMI,IAASP,MAAS,YAAY,KAAK;QACzC,OAAOG,MAAY,IAAI,KAAKF,MAAU,GAAGE,KAAWF,IAAQM;;;IAIxDZ,KAAAa,0BAA2BC;MACjCA,EAAEC;MACFf,KAAKgB,iBAAiBC,KAAKH,EAAEI;AAAO;kBAnHH;kBAKD;oBAKE;qBAKC;mBAKD;mBAKiB;oBAKC;0BAKM;uBAKH;uBAKA;0BAKG;yBAKD;qBAMhC;;;EAa3B,iBAAAC;IACEnB,KAAKC;;;EA6CP,MAAAmB;IACE,OACEC,EAACC,GAAI,MACHD,EAAA;MACEhB,MAAK;MACLkB,UAAS;MACTC,cAAY;MACZC,UAAQ;MACRtB,WAAWH,KAAKG;MAChBuB,oBAAoB1B,KAAKa;OAEzBQ,EAAA;MACEM,QAAO;MACPC,WAAW5B,KAAKI,cAAc;MAC9ByB,MAAK;MACLC,WAAW9B,KAAKS,WAAW,IAAI,aAAa;MAC5CsB,OAAO;QAAEC,OAAS;QAAM,YAAYhC,KAAKS,WAAW;;MACpDwB,aAAW;OAEXZ,EAAA;MACEa,MAAK;MACLH,OAAO;QACL,oBAAoB;;SAI1BV,EAAA;MACEM,QAAO;MACPC,WAAW5B,KAAKI,cAAc;MAC9ByB,MAAK;MACLC,WAAW9B,KAAKU,aAAa,IAAI,aAAa;MAC9CqB,OAAO;QAAEI,SAAW;QAAM,YAAYnC,KAAKU,aAAa;;MACxDuB,aAAW;OAEXZ,EAAA;MACEa,MAAK;MACLH,OAAO;QACL,oBAAoB;;SAI1BV,EAAA;MACEM,QAAO;MACPC,WAAW5B,KAAKI,cAAc;MAC9ByB,MAAK;MACLC,WAAW9B,KAAKW,cAAc,IAAI,aAAa;MAC/CoB,OAAO;QAAEK,SAAW;QAAM,YAAYpC,KAAKW,cAAc;;MACzDsB,aAAW;OAEXZ,EAAA;MACEa,MAAK;MACLH,OAAO;QACL,oBAAoB"}