@genexus/genexus-ide-ui 1.1.61 → 1.1.63

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

@@ -0,0 +1 @@
+{"version":3,"names":["mapModuleServerDataToComboBoxModel","servers","map","server","value","id","caption","name","mapModuleVersionDataToComboBoxModel","moduleVersions","moduleVersion","renderModuleDataProperties","options","length","items","forEach","option","isArray","Array","item","h","class","subItem","push","inline","manageModuleReferencesCss","CSS_BUNDLES","SHOW_MORE_ICON","getIconPath","category","colorType","RESET_ICON","MODULE_ICON","FILTER_ICON","MVS","GxManageModuleReferences","_GxManageModuleReferences_componentLocale","set","this","_GxManageModuleReferences_moduleVersionsMap","Map","_GxManageModuleReferences_modulesMap","_GxManageModuleReferences_modulesJustFetched","_GxManageModuleReferences_searchModulesFilterValue","_GxManageModuleReferences_modulesGrid","_GxManageModuleReferences_progressBarEl","_GxManageModuleReferences_segmentedControlModel","_GxManageModuleReferences_clearAll","__classPrivateFieldGet","clear","_GxManageModuleReferences_filterModules","filteredModules","selectedModuleType","modulesAll","filter","module","currentVersion","versions","find","version","action","moduleSelectedVersion","get","currentSelectedVersion","moduleSelectedVersionName","toLowerCase","moduleSelectedVersionDescription","description","includes","_GxManageModuleReferences_getActionFromCurrentModuleVersion","selectedModuleId","_GxManageModuleReferences_handleFilterChangeHandler","event","searchValue","detail","trim","__classPrivateFieldSet","call","_GxManageModuleReferences_handleModuleChange","rowsId","selectedModuleVersionsInfoArray","comboBoxVersionsModel","selectedModuleVersions","versionInfo","_GxManageModuleReferences_moduleActionHandler","async","reset","executeActionCallbackInProgress","actionInProgress","moduleSelectedVersionId","actionSuccessful","executeActionCallback","selectedServerId","_GxManageModuleReferences_onProgress","_GxManageModuleReferences_serverSelectedCallbackHandler","_GxManageModuleReferences_moduleTypeButtonClicked","_GxManageModuleReferences_moduleVersionsValueChangedHandler","versionId","currentModuleMapValue","toString","reRenderCounter","message","progress","state","data","selectedModuleAction","Object","assign","progressValue","progressState","_GxManageModuleReferences_progressBarCloseHandler","_GxManageModuleReferences_reloadServer","_GxManageModuleReferences_renderEmptyStateModules","isAnimated","stateIconSrc","stateTitle","modules","noModulesFilter","_GxManageModuleReferences_renderInstalledVersion","currentInstalledVersion","cssClass","modulesInformation","moduleProperties","installed","notInstalled","_GxManageModuleReferences_renderModuleVersions","currentSelectedModule","selectedVersionValue","moduleSelectedVersionAction","htmlFor","availableVersions","onInput","disabled","loadingServer","model","onClick","moduleData","_GxManageModuleReferences_renderModulesGrid","rowSelectionMode","part","onSelectionChanged","ref","el","settingable","size","config","tabularGrid","colSize","common","moduleIsInstalled","rowid","key","src","hiChar","_GxManageModuleReferences_renderVersionName","selectedModule","_GxManageModuleReferences_renderVersionWarningMessage","moduleVersionWarningMessage","warningMessage","reload","serverSelectedCallback","resolvedObjects","_GxManageModuleReferences_serverValueChangedHandler","undefined","serverId","_GxManageModuleReferences_showModuleMenu","e","serverContextMenuCallback","buttonBoundingClientRect","target","getBoundingClientRect","selection","clientX","x","clientY","y","modulesAllChanged","newModules","currentSelectedVersionValue","moduleVersionsComboBoxModel","moduleVersionCombinedId","properties","serversChanged","newServers","serversComboBoxModel","selectedServerValue","componentWillLoad","Locale","getComponentStrings","buttonsContainer","browse","updates","componentDidLoad","componentDidRender","selectRow","progressBarClosedHandler","render","Host","selectServer","showServerCommands","showServerMenu","title","reloadModules","searchModules","selectedId","onSelectedItemChange","loaderTitle","loading","show","emptyState","stateDescription","slot","stateType","progressBar","defaultCaption","active","closeType","autoCloseProgressBar","closedCallback"],"sources":["src/components/modules/manage-module-references/helpers.tsx","src/components/modules/manage-module-references/manage-module-references.scss?tag=gx-ide-manage-module-references&encapsulation=shadow","src/components/modules/manage-module-references/manage-module-references.tsx"],"sourcesContent":["import { h } from \"@stencil/core\";\nimport { ComboBoxModel } from \"@genexus/chameleon-controls-library/dist/types/components/combo-box/types\";\nimport {\n  ModulePropertyData,\n  ModuleServerData,\n  ModuleVersionData\n} from \"../types\";\n\nexport const mapModuleServerDataToComboBoxModel = (\n  servers: ModuleServerData[]\n): ComboBoxModel =>\n  servers.map(server => ({\n    value: server.id,\n    caption: server.name\n  }));\n\nexport const mapModuleVersionDataToComboBoxModel = (\n  moduleVersions: ModuleVersionData[]\n): ComboBoxModel =>\n  moduleVersions.map(moduleVersion => ({\n    value: moduleVersion.id,\n    caption: moduleVersion.name\n  }));\n\nexport const renderModuleDataProperties = (\n  options: Array<ModulePropertyData>\n): ModulePropertyData[] => {\n  if (options.length) {\n    const items: ModulePropertyData[] = [];\n\n    options.forEach(option => {\n      const isArray = Array.isArray(option.value);\n\n      if (isArray && option.value.length) {\n        const item = (\n          <div class=\"md-property__list-container\">\n            <p class=\"md-property__key subtitle-semi-bold-xs\">\n              {option.name} :\n            </p>\n            <ul class=\"md-property__list\">\n              {(option.value as string[]).map(subItem => {\n                return (\n                  <li class=\"md-property__list-item body-regular-s\">\n                    {subItem}\n                  </li>\n                );\n              })}\n            </ul>\n          </div>\n        );\n        items.push(item);\n      } else if (!isArray) {\n        const item = (\n          <div\n            class={\n              option.inline\n                ? \"md-property md-property--inline\"\n                : \"md-property md-property--block\"\n            }\n          >\n            <p class=\"md-property__key subtitle-semi-bold-xs\">\n              {option.name} :\n            </p>\n            <p class=\"md-property__value body-regular-s\">{option.value}</p>\n          </div>\n        );\n        items.push(item);\n      }\n    });\n    return items;\n  }\n  return null;\n};\n","@import \"../../../global/gx-ide-mixins.scss\";\n@include hiChar();\n$insideInlinePadding: var(--mer-spacing--sm);\n\n:host {\n  display: grid;\n  block-size: 100%;\n  overflow: auto;\n  grid-template-areas:\n    \"modules-container module-info\"\n    \"footer footer\";\n  grid-template-columns: 1fr 1fr;\n  grid-template-rows: 1fr max-content;\n}\n\n.main {\n  display: contents;\n}\n\n// - - - - - - - - - - - - - - - - -\n// left section (modules list)\n// - - - - - - - - - - - - - - - - -\n\n.modules__container {\n  padding-inline-end: $insideInlinePadding;\n  grid-area: modules-container;\n  grid-template-rows: max-content 1fr;\n  overflow: auto;\n  // border-inline-end: var(--section-common-border);\n}\n.combo-box-servers {\n  flex-shrink: 0;\n  flex-grow: 1;\n}\n\n// main\n$searchModulesGap: var(--mer-spacing--xs);\n.modules__main {\n  display: grid;\n  grid-template-rows: max-content 1fr;\n  overflow: auto;\n}\n.modules__main-header {\n  display: grid;\n  gap: $searchModulesGap;\n}\n// buttons\n.browse-modules button {\n  flex-grow: 1;\n}\n\n// Mercury DS designed ch-segmented-control-render to use inline-grid by default\n// grid\n.module-icon {\n  // WA: align icon with title\n  margin-block-start: var(--mer-spacing--xs);\n  transform: scale(1) translateX(var(--mer-spacing--2xs));\n}\n.module-grid-item-info {\n  grid-template-columns: max-content 1fr;\n}\n\n// grid\n.grid-or-loader-container {\n  display: grid;\n  position: relative;\n  overflow: hidden;\n  margin-block-start: var(--mer-spacing--sm);\n}\n.tabular-grid {\n  overflow: hidden;\n}\n.tabular-grid-column-set {\n  display: none;\n}\n.tabular-grid-cell-icon {\n  pointer-events: none;\n}\ngx-ide-empty-state {\n  // WA to block align center\n  position: absolute;\n}\n\n// - - - - - - - - - - - - - - - - -\n// right section (module information)\n// - - - - - - - - - - - - - - - - -\n\n.module-info {\n  padding-inline-start: $insideInlinePadding;\n  grid-area: module-info;\n  position: relative;\n}\n.modules-container,\n.module-info {\n  overflow: auto;\n}\n\n.module-info {\n  display: grid;\n  grid-template-rows: max-content 1fr;\n  overflow: auto;\n}\n.module-info__action-container {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: var(--mer-spacing--xs);\n  &:before {\n    content: \"\";\n    inline-size: var(--mer-spacing--xs);\n    block-size: var(--mer-spacing--xs);\n    border-radius: 50%;\n    display: block;\n    background-color: var(--mer-icon__primary--disabled);\n  }\n  &--installed {\n    color: var(--mer-text__success);\n  }\n  &--installed:before {\n    background-color: var(--mer-text__success);\n  }\n  &--uninstallable:before {\n    background-color: var(--mer-icon__warning);\n  }\n}\n\n// header\n.module-info__header {\n  display: grid;\n  gap: var(--mer-spacing--xs);\n}\n.module-info__title {\n  display: grid;\n  grid-template-columns: max-content 1fr;\n  align-items: center;\n  gap: var(--mer-spacing--md);\n}\n.module-info__icon {\n  transform: scale(1) translateX(var(--mer-spacing--2xs));\n}\n.module-info__alert-message {\n  // TODO: this warning message styles should be defined by a Mercury class.\n  padding: var(--mer-spacing--xs) var(--mer-spacing--sm);\n  border-radius: var(--mer-border__radius--sm);\n  background-color: var(--mer-color__tinted-yellow--5);\n  color: var(--mer-text__bright);\n  border: var(--mer-border__width--sm) solid var(--mer-border-color__warning);\n  text-align: center;\n  line-height: var(--mer-line-height--spaced);\n}\n\n// properties\n$propertiesCommonBorder: var(--mer-border__width--sm) solid\n  var(--elevation-border-color, var(--mer-border-color__on-surface));\n\n.module-info__properties {\n  display: grid;\n  overflow: auto;\n  grid-auto-rows: max-content;\n\n  &-inner-wrapper {\n  }\n}\n.md-property,\n.md-property__list-container {\n  padding-block: var(--mer-spacing--xs);\n  display: grid;\n  gap: var(--mer-spacing--2xs);\n  border-block-end: $propertiesCommonBorder;\n  &:last-child {\n    border-block-end: 0;\n  }\n}\n.md-property__list {\n  margin: 0;\n  list-style-type: none;\n  display: inline-flex;\n  padding: 0;\n  gap: var(--mer-spacing--2xs);\n  flex-wrap: wrap;\n}\n.md-property__list-item {\n  background-color: var(--mer-surface__elevation--02);\n  padding: var(--mer-spacing--3xs) var(--mer-spacing--xs);\n  border-radius: var(--mer-border__radius--sm);\n  text-transform: lowercase;\n}\n.md-property--inline {\n  grid-template-columns: max-content 1fr;\n  align-items: start;\n  gap: var(--mer-spacing--xs);\n}\n\n.available-versions {\n  .versions {\n    flex: 1;\n  }\n  .button-status {\n    min-inline-size: var(--mer-spacing--3xl);\n    inline-size: max-content;\n    box-sizing: border-box;\n  }\n}\n\n// - - - - - - - - - - - - - - - - -\n// footer\n// - - - - - - - - - - - - - - - - -\n\n.footer {\n  grid-area: footer;\n}\n\n// - - - - - - - - - - - - - - - - -\n// General\n// - - - - - - - - - - - - - - - - -\n\n// WA: Improve line spacing for module descriptions\np.body-regular-s,\nli.body-regular-s {\n  line-height: var(--mer-line-height--regular);\n}\n","// Stencil\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  State,\n  Watch,\n  Listen\n} from \"@stencil/core\";\n// Other Libraries\nimport {\n  ComboBoxModel,\n  TabularGridSelectionChangedEvent,\n  SegmentedControlModel\n} from \"@genexus/chameleon-controls-library\";\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n// Custom Imports\nimport { TopStateBarType } from \"../../../components\";\nimport {\n  ModuleServerData,\n  ModuleData,\n  ModuleActionType,\n  ModuleFilterType,\n  ModuleVersionData\n} from \"../types\";\nimport {\n  mapModuleServerDataToComboBoxModel,\n  mapModuleVersionDataToComboBoxModel,\n  renderModuleDataProperties\n} from \"./helpers\";\nimport { config } from \"../../../common/config\";\nimport { Locale } from \"../../../common/locale\";\nimport { ContextMenuInfo } from \"../../../common/types\";\nimport { hiChar } from \"../../../common/helpers\";\nimport { ComboBoxItemValue } from \"@genexus/gemini\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"utils/form\",\n  \"utils/layout\",\n  \"utils/typography\",\n  \"components/button\",\n  \"components/icon\",\n  \"components/combo-box\",\n  \"components/edit\",\n  \"components/tabular-grid\",\n  \"components/segmented-control\",\n  \"chameleon/scrollbar\",\n  \"utils/spacing\"\n];\n\n// icons\nconst SHOW_MORE_ICON = getIconPath({\n  category: \"gemini-tools\",\n  name: \"show-more-horizontal\",\n  colorType: \"primary\"\n});\nconst RESET_ICON = getIconPath({\n  category: \"gemini-tools\",\n  name: \"reset\",\n  colorType: \"primary\"\n});\nconst MODULE_ICON = getIconPath({\n  category: \"objects\",\n  name: \"module\"\n});\nconst FILTER_ICON = getIconPath({\n  category: \"system\",\n  name: \"filters\",\n  colorType: \"on-elevation\"\n});\nconst MVS = \"__\"; // The separator between module-id, and module-version-id\n\n@Component({\n  tag: \"gx-ide-manage-module-references\",\n  styleUrl: \"manage-module-references.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/manage-module-references\"]\n})\nexport class GxManageModuleReferences {\n  #componentLocale: any;\n\n  /**\n   * #moduleVersionsMap maps a module version (identified as module-id + version-id), with the ModuleVersionData\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #moduleVersionsMap: ModulesVersionsMap = new Map();\n\n  /**\n   * maps a module-id, with the module current installed version, and the list of versions as a ComboBoxModel representation.\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #modulesMap: ModulesMap = new Map();\n\n  // #modulesJustFetched is used to select the current module on componentDidRender\n  #modulesJustFetched: boolean = false;\n  #searchModulesFilterValue: string;\n  #modulesGrid: HTMLChTabularGridElement;\n\n  @Element() el: HTMLGxIdeManageModuleReferencesElement;\n  #progressBarEl: HTMLGxIdeProgressBarElement;\n\n  @State() actionInProgress = false;\n  @State() executeActionCallbackInProgress = false;\n  @State() filteredModules: ModuleData[] = [];\n  @State() loadingServer = false;\n\n  @State() modulesAll: ModuleData[] = [];\n  @Watch(\"modulesAll\")\n  modulesAllChanged(newModules: ModuleData[]) {\n    let currentSelectedVersion: string;\n    if (this.selectedModuleId) {\n      // If this.selectedModuleId has a value, serverSelectedCallback was called\n      // but the server is the same. This occurs when a user action (e.g., install\n      // or restore) requires modules to update. The selected module and version\n      // remain unchanged. We must save the current version before #clearAll().\n      currentSelectedVersion = this.#modulesMap.get(\n        this.selectedModuleId\n      ).currentSelectedVersion;\n    }\n\n    this.#clearAll();\n    newModules.forEach(module => {\n      let currentSelectedVersionValue = module.versions[0].id;\n      if (currentSelectedVersion && this.selectedModuleId === module.id) {\n        currentSelectedVersionValue = currentSelectedVersion;\n        currentSelectedVersion === undefined; // found. prevent the if in the following iteration.\n      }\n\n      // fulfill #modulesMap\n      const moduleVersionsComboBoxModel = mapModuleVersionDataToComboBoxModel(\n        module.versions\n      );\n      this.#modulesMap.set(module.id, {\n        moduleData: module,\n        currentInstalledVersion: module.currentVersion,\n        currentSelectedVersion: currentSelectedVersionValue,\n        comboBoxVersionsModel: moduleVersionsComboBoxModel\n      });\n\n      // fulfill #moduleVersionsMap.\n      module.versions.forEach(version => {\n        const moduleVersionCombinedId = `${module.id}${MVS}${version.id}`;\n        this.#moduleVersionsMap.set(moduleVersionCombinedId, {\n          id: version.id,\n          action: version.action,\n          description: version.description,\n          properties: version.properties,\n          name: version.name,\n          warningMessage: version.warningMessage\n        });\n      });\n    });\n\n    this.#modulesJustFetched = true;\n    this.#filterModules();\n  }\n\n  @State() progressState: TopStateBarType = \"in-progress\";\n  @State() progressValue: number = 0;\n  @State() reRenderCounter: number = 0;\n  @State() selectedModuleAction: ActionInfo = {\n    message: \"\",\n    progress: 0,\n    state: \"in-progress\"\n  };\n  @State() selectedModuleId: string;\n  @State() selectedModuleType: ModuleFilterType = \"browse\";\n  @State() selectedServerId: string;\n  @State() selectedServerValue: string;\n  // serversComboBoxModel is a model representation of the servers ModuleServerData[]\n  @State() serversComboBoxModel: ComboBoxModel = [];\n  @State() selectedModuleVersions: ComboBoxModel = [];\n  #segmentedControlModel: SegmentedControlModel = [];\n\n  /**\n   * If true, the progress bar will close automatically once the progress has reached 100%.\n   */\n  @Prop() readonly autoCloseProgressBar: boolean = false;\n\n  /**\n   * Callback invoked when the user wants to execute the action corresponding to a selected module. When the action begins to be executed, the component must be able to show the progress of the action. For this, the onProgress parameter is available, which is in turn a callback used by the host to notify the progress by text message and percentage.\n   */\n  @Prop() readonly executeActionCallback!: ExecuteActionCallback;\n\n  /**\n   * Callback invoked when an element is right clicked on servers list\n   */\n  @Prop() readonly serverContextMenuCallback: ServerContextMenuCallback;\n\n  /**\n   * Callback invoked when a server is selected. Returns the set of modules available on that server.\n   */\n  @Prop() readonly serverSelectedCallback: ServerSelectedCallback;\n\n  /**\n   * List of module servers currently cataloged\n   */\n  @Prop() readonly servers: ModuleServerData[] = [];\n  @Watch(\"servers\")\n  serversChanged(newServers: ModuleServerData[]) {\n    if (newServers.length) {\n      this.serversComboBoxModel =\n        mapModuleServerDataToComboBoxModel(newServers);\n      this.selectedServerValue = this.serversComboBoxModel[0].value;\n    }\n  }\n\n  /**\n   * Allows you to hide the button (...) that executes serverContextMenuCallback\n   */\n  @Prop() readonly showServerCommands: boolean = false;\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n    this.serversChanged(this.servers); // map ModuleServerData to ComboBoxModel\n\n    this.#segmentedControlModel = [\n      {\n        id: \"browse\",\n        caption: this.#componentLocale.modules.buttonsContainer.browse\n      },\n      {\n        id: \"installed\",\n        caption: this.#componentLocale.modules.buttonsContainer.installed\n      },\n      {\n        id: \"updates\",\n        caption: this.#componentLocale.modules.buttonsContainer.updates\n      }\n    ];\n  }\n\n  async componentDidLoad() {\n    await this.#serverSelectedCallbackHandler(this.servers[0].id, false);\n  }\n\n  componentDidRender() {\n    if (this.#modulesJustFetched && this.selectedModuleId) {\n      // set selected module as selected on the grid after server reload.\n      this.#modulesGrid.selectRow(this.selectedModuleId, true);\n      this.#modulesJustFetched = false;\n    }\n  }\n\n  @Listen(\"progressBarClosed\")\n  progressBarClosedHandler() {\n    // set it to false, to fire a re-render the next time the progress-bar is active.\n    this.actionInProgress = false;\n  }\n\n  #clearAll = () => {\n    this.#modulesMap.clear();\n    this.#moduleVersionsMap.clear();\n  };\n\n  #filterModules = () => {\n    let filteredModules;\n    // 1. Filter by type first\n    // browse\n    if (this.selectedModuleType === \"browse\") {\n      filteredModules = this.modulesAll;\n    }\n    // installed\n    else if (this.selectedModuleType === \"installed\") {\n      filteredModules = this.modulesAll.filter((module: ModuleData) => {\n        // if the module has a currentVersion (not undefined) it means it is installed\n        return module.currentVersion;\n      });\n    } else if (this.selectedModuleType === \"updates\") {\n      filteredModules = this.modulesAll.filter((module: ModuleData) => {\n        return module.versions.find(version => version.action === \"update\");\n      });\n    }\n\n    // 2. Then filter by user input\n    if (this.#searchModulesFilterValue) {\n      filteredModules = filteredModules.filter(module => {\n        const moduleSelectedVersion = this.#moduleVersionsMap.get(\n          `${module.id}${MVS}${\n            this.#modulesMap.get(module.id).currentSelectedVersion\n          }`\n        );\n        const moduleSelectedVersionName =\n          moduleSelectedVersion.name.toLowerCase();\n        const moduleSelectedVersionDescription =\n          moduleSelectedVersion.description.toLowerCase();\n\n        return (\n          moduleSelectedVersionName?.includes(this.#searchModulesFilterValue) ||\n          moduleSelectedVersionDescription?.includes(\n            this.#searchModulesFilterValue\n          )\n        );\n      });\n    }\n\n    this.filteredModules = filteredModules;\n  };\n\n  #getActionFromCurrentModuleVersion = (): ModuleActionType => {\n    const action = this.#moduleVersionsMap.get(\n      `${this.selectedModuleId}${MVS}${\n        this.#modulesMap.get(this.selectedModuleId).currentSelectedVersion\n      }`\n    ).action;\n    return action || \"install\";\n  };\n\n  #handleFilterChangeHandler = (event: CustomEvent<string> | InputEvent) => {\n    const searchValue = (event.detail as string).trim().toLowerCase();\n    this.#searchModulesFilterValue = searchValue;\n    this.#filterModules();\n  };\n\n  #handleModuleChange = (\n    event: CustomEvent<TabularGridSelectionChangedEvent>\n  ) => {\n    this.selectedModuleId = event.detail.rowsId[0];\n\n    // update selected versions comboBox model\n    const selectedModuleVersionsInfoArray = this.#modulesMap.get(\n      this.selectedModuleId\n    ).comboBoxVersionsModel;\n\n    this.selectedModuleVersions = selectedModuleVersionsInfoArray.map(\n      versionInfo => {\n        return {\n          caption: versionInfo.value,\n          value: versionInfo.value\n        } as ComboBoxItemValue;\n      }\n    );\n  };\n\n  /**\n   * Perform an action relative to a module using callbackExecuteAction callback and receive the state of that action with onProgress callback\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #moduleActionHandler = (module: ModuleData) => async () => {\n    await this.#progressBarEl.reset(); // sets the progress bar to 0\n    this.executeActionCallbackInProgress = true;\n    this.actionInProgress = true;\n\n    const moduleSelectedVersionId = this.#modulesMap.get(\n      this.selectedModuleId\n    ).currentSelectedVersion;\n\n    const actionSuccessful = await this.executeActionCallback(\n      this.selectedServerId,\n      module.id,\n      moduleSelectedVersionId,\n      this.#getActionFromCurrentModuleVersion(),\n      this.#onProgress\n    );\n    this.executeActionCallbackInProgress = false;\n    if (actionSuccessful) {\n      this.#serverSelectedCallbackHandler(this.selectedServerId, false);\n    }\n  };\n\n  #moduleTypeButtonClicked = (event: CustomEvent<string>): void => {\n    this.selectedModuleType = event.detail as ModuleFilterType;\n    this.#filterModules();\n  };\n\n  #moduleVersionsValueChangedHandler = (\n    event: CustomEvent<string> | InputEvent\n  ) => {\n    const versionId = event.detail;\n    const currentModuleMapValue = this.#modulesMap.get(this.selectedModuleId);\n    currentModuleMapValue.currentSelectedVersion = versionId.toString();\n    this.#modulesMap.set(this.selectedModuleId, currentModuleMapValue);\n    this.reRenderCounter++;\n  };\n\n  /**\n   * Callback invoked to get the progress when module is performing an action\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #onProgress = (\n    message: string,\n    progress: number,\n    state: TopStateBarType\n  ): void => {\n    const data = { message, progress, state };\n    this.selectedModuleAction = { ...data };\n    this.progressValue = this.selectedModuleAction.progress;\n    this.progressState = this.selectedModuleAction.state;\n  };\n\n  #progressBarCloseHandler = () => {};\n\n  #reloadServer = () => {\n    this.#serverSelectedCallbackHandler(this.selectedServerId, true);\n  };\n\n  #renderEmptyStateModules = (): HTMLGxIdeEmptyStateElement => {\n    return (\n      <gx-ide-empty-state\n        isAnimated={true}\n        stateIconSrc={FILTER_ICON}\n        stateTitle={this.#componentLocale.modules.noModulesFilter}\n      ></gx-ide-empty-state>\n    );\n  };\n\n  #renderInstalledVersion = () => {\n    const currentInstalledVersion = this.#modulesMap.get(\n      this.selectedModuleId\n    ).currentInstalledVersion;\n    let caption;\n    let cssClass = \"module-info__action-container\";\n    if (currentInstalledVersion) {\n      caption = `${\n        this.#componentLocale.modulesInformation.moduleProperties.installed\n      }: ${currentInstalledVersion}`;\n      cssClass += ` module-info__action-container--installed`;\n    } else {\n      caption =\n        this.#componentLocale.modulesInformation.moduleProperties.notInstalled;\n    }\n    return (\n      <div class={cssClass}>\n        <p class=\"body-regular-m\">{caption}</p>\n      </div>\n    );\n  };\n\n  #renderModuleVersions = () => {\n    const currentSelectedModule = this.#modulesMap.get(this.selectedModuleId);\n    const selectedVersionValue = currentSelectedModule.currentSelectedVersion;\n    const moduleSelectedVersion = this.#moduleVersionsMap.get(\n      `${this.selectedModuleId}${MVS}${\n        this.#modulesMap.get(this.selectedModuleId).currentSelectedVersion\n      }`\n    );\n    const moduleSelectedVersionAction = moduleSelectedVersion.action;\n\n    return (\n      <div class=\"field field-block available-versions\">\n        <label class=\"label\" htmlFor=\"available-versions\">\n          {this.#componentLocale.availableVersions}\n        </label>\n        <div class=\"buttons-spacer combo-and-button\">\n          <ch-combo-box-render\n            id=\"available-versions\"\n            class=\"combo-box versions\"\n            value={selectedVersionValue}\n            onInput={this.#moduleVersionsValueChangedHandler}\n            disabled={this.loadingServer}\n            model={this.selectedModuleVersions}\n          ></ch-combo-box-render>\n          <button\n            class=\"button-primary button-status\"\n            disabled={\n              this.executeActionCallbackInProgress ||\n              moduleSelectedVersionAction === \"incompatible\" ||\n              moduleSelectedVersionAction === \"not-installable\"\n            }\n            onClick={this.#moduleActionHandler(\n              currentSelectedModule.moduleData\n            )}\n          >\n            {this.#getActionFromCurrentModuleVersion()}\n          </button>\n        </div>\n      </div>\n    );\n  };\n\n  #renderModulesGrid = (): Element => {\n    return (\n      <ch-tabular-grid\n        // TODO: Evaluate if the tabular-grid is the right tool for this job.\n        rowSelectionMode=\"single\"\n        part=\"ch-grid-pending-commits\"\n        class=\"tabular-grid scrollable\"\n        onSelectionChanged={this.#handleModuleChange}\n        ref={el => (this.#modulesGrid = el as HTMLChTabularGridElement)}\n      >\n        <ch-tabular-grid-columnset class=\"tabular-grid-column-set\">\n          <ch-tabular-grid-column\n            class=\"tabular-grid-column\"\n            settingable={false}\n            size={config.tabularGrid.colSize.common}\n          ></ch-tabular-grid-column>\n        </ch-tabular-grid-columnset>\n\n        {this.filteredModules.length ? (\n          <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n            {this.filteredModules.map((module: ModuleData) => {\n              const moduleIsInstalled = module.currentVersion;\n\n              const moduleSelectedVersion = this.#moduleVersionsMap.get(\n                `${module.id}${MVS}${\n                  this.#modulesMap.get(module.id).currentSelectedVersion\n                }`\n              );\n\n              const moduleSelectedVersionName = moduleSelectedVersion.name;\n              const moduleSelectedVersionDescription =\n                moduleSelectedVersion.description;\n\n              return (\n                <ch-tabular-grid-row\n                  // TODO: Replace tabular grid with other control, since it does not makes sense to use a grid with only one column.\n                  class=\"tabular-grid-row\"\n                  rowid={module.id}\n                  key={module.id}\n                >\n                  <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                    <div class=\"module-grid-item-info field-group\">\n                      <ch-image\n                        class=\"icon-md module-icon\"\n                        src={MODULE_ICON}\n                        disabled={!moduleIsInstalled}\n                      ></ch-image>\n                      <div class=\"field field-block\">\n                        <h6 class=\"subtitle-semi-bold-xs\">\n                          {hiChar(\n                            moduleSelectedVersionName,\n                            this.#searchModulesFilterValue\n                          )}\n                        </h6>\n\n                        <p class=\"body-regular-s\">\n                          {hiChar(\n                            moduleSelectedVersionDescription,\n                            this.#searchModulesFilterValue\n                          )}\n                        </p>\n                      </div>\n                    </div>\n                  </ch-tabular-grid-cell>\n                </ch-tabular-grid-row>\n              );\n            })}\n          </ch-tabular-grid-rowset>\n        ) : (\n          <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n            <ch-tabular-grid-rowset-empty>\n              {this.#renderEmptyStateModules()}\n            </ch-tabular-grid-rowset-empty>\n          </ch-tabular-grid-rowset>\n        )}\n      </ch-tabular-grid>\n    );\n  };\n\n  /* module details/information renders*/\n  #renderVersionName = (): HTMLElement => {\n    const moduleSelectedVersion = this.#moduleVersionsMap.get(\n      `${this.selectedModuleId}${MVS}${\n        this.#modulesMap.get(this.selectedModuleId).currentSelectedVersion\n      }`\n    );\n\n    const selectedModule = this.#modulesMap.get(this.selectedModuleId);\n    const moduleIsInstalled = selectedModule.currentInstalledVersion;\n\n    return (\n      <div class=\"module-info__title\">\n        <ch-image\n          class=\"icon-md module-info__icon\"\n          src={MODULE_ICON}\n          disabled={!moduleIsInstalled}\n        ></ch-image>\n        <h6 class=\"subtitle-semi-bold-xs\">{moduleSelectedVersion.name}</h6>\n      </div>\n    );\n  };\n\n  #renderVersionWarningMessage = () => {\n    const moduleVersionWarningMessage = this.#moduleVersionsMap.get(\n      `${this.selectedModuleId}${MVS}${\n        this.#modulesMap.get(this.selectedModuleId).currentSelectedVersion\n      }`\n    ).warningMessage;\n\n    if (moduleVersionWarningMessage) {\n      return (\n        <p class=\"module-info__alert-message\">{moduleVersionWarningMessage}</p>\n      );\n    }\n  };\n\n  #serverSelectedCallbackHandler = async (id: any, reload: boolean) => {\n    if (this.serverSelectedCallback) {\n      this.selectedServerId = id;\n      this.loadingServer = true;\n      const resolvedObjects = await this.serverSelectedCallback(id, reload);\n      this.modulesAll = [...resolvedObjects];\n      this.loadingServer = false;\n    }\n  };\n\n  #serverValueChangedHandler = (event: CustomEvent<string> | InputEvent) => {\n    this.selectedModuleId = undefined; // clear selected module\n    this.#searchModulesFilterValue = \"\"; // clear filter\n    this.selectedModuleType = \"browse\"; // set \"browse\" as the default selected type\n    const serverId = event.detail;\n    this.#serverSelectedCallbackHandler(serverId, false);\n  };\n\n  #showModuleMenu = async (e: MouseEvent) => {\n    if (this.serverContextMenuCallback) {\n      const buttonBoundingClientRect = (\n        e.target as HTMLElement\n      ).getBoundingClientRect();\n      await this.serverContextMenuCallback({\n        selection: [this.selectedServerId],\n        clientX: buttonBoundingClientRect.x,\n        clientY: buttonBoundingClientRect.y\n      });\n    }\n  };\n\n  render(): void {\n    return (\n      <Host class=\"widget\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <section class=\"main\">\n          <div class=\"modules__container field-group\">\n            <header class=\"modules__header field-group\">\n              <div class=\"field field-block\">\n                <label class=\"label\" htmlFor=\"servers-list\">\n                  {this.#componentLocale.modules.selectServer}\n                </label>\n                <div class=\"modules__header-controls buttons-spacer\">\n                  <ch-combo-box-render\n                    // select server\n                    id=\"servers-list\"\n                    class=\"combo-box combo-box-servers\"\n                    model={this.serversComboBoxModel}\n                    value={this.selectedServerValue}\n                    disabled={this.loadingServer}\n                    onInput={this.#serverValueChangedHandler}\n                  ></ch-combo-box-render>\n\n                  <div\n                  // action buttons\n                  >\n                    {this.showServerCommands && (\n                      <button\n                        // server context menu button\n                        class=\"button-tertiary button-icon-only\"\n                        onClick={this.#showModuleMenu}\n                        aria-label={this.#componentLocale.showServerMenu}\n                        title={this.#componentLocale.showServerMenu}\n                      >\n                        <ch-image\n                          src={SHOW_MORE_ICON}\n                          class=\"icon-md\"\n                        ></ch-image>\n                      </button>\n                    )}\n\n                    <button\n                      // reload server selected button\n                      class=\"button-tertiary button-icon-only\"\n                      onClick={this.#reloadServer}\n                      aria-label={this.#componentLocale.reloadModules}\n                      title={this.#componentLocale.reloadModules}\n                    >\n                      <ch-image src={RESET_ICON} class=\"icon-md\"></ch-image>\n                    </button>\n                  </div>\n                </div>\n              </div>\n            </header>\n\n            <div\n              // Modules main\n              class=\"modules__main\"\n            >\n              <div class=\"modules__main-header\">\n                <div\n                  // search modules\n                  class=\"field field-block\"\n                >\n                  <label class=\"label\" htmlFor=\"search-modules\">\n                    {this.#componentLocale.modules.searchModules}\n                  </label>\n                  <ch-edit\n                    class=\"input\"\n                    value={this.#searchModulesFilterValue}\n                    onInput={this.#handleFilterChangeHandler}\n                    disabled={this.loadingServer}\n                  ></ch-edit>\n                </div>\n\n                <div class=\"browse-modules\">\n                  <ch-segmented-control-render\n                    class=\"segmented-control-filled\"\n                    model={this.#segmentedControlModel}\n                    selectedId={this.selectedModuleType}\n                    onSelectedItemChange={this.#moduleTypeButtonClicked}\n                  ></ch-segmented-control-render>\n                </div>\n              </div>\n\n              <div class=\"grid-or-loader-container\">\n                {this.loadingServer ? (\n                  <gx-ide-loader\n                    loaderTitle={this.#componentLocale.servers.loading}\n                    show={true}\n                  ></gx-ide-loader>\n                ) : (\n                  this.#renderModulesGrid()\n                )}\n              </div>\n            </div>\n          </div>\n\n          <div class=\"module-info field-group\">\n            {this.selectedModuleId ? (\n              [\n                <header class=\"module-info__header\">\n                  {this.#renderVersionName()}\n                  {this.#renderInstalledVersion()}\n                  {this.#renderModuleVersions()}\n                  {this.#renderVersionWarningMessage()}\n                </header>,\n                <div class=\"module-info__properties scrollable\">\n                  <div class=\"module-info__properties-inner-wrapper\">\n                    {renderModuleDataProperties(\n                      this.#moduleVersionsMap.get(\n                        `${this.selectedModuleId}__${\n                          this.#modulesMap.get(this.selectedModuleId)\n                            .currentSelectedVersion\n                        }`\n                      ).properties\n                    )}\n                  </div>\n                </div>\n              ]\n            ) : (\n              <gx-ide-empty-state\n                class=\"recent-objects__empty-state\"\n                stateIconSrc={MODULE_ICON}\n                stateTitle={\n                  this.#componentLocale.modulesInformation.emptyState.title\n                }\n                stateDescription={\n                  this.#componentLocale.modulesInformation.emptyState\n                    .description\n                }\n              ></gx-ide-empty-state>\n            )}\n          </div>\n\n          <footer class=\"footer\">\n            <gx-ide-progress-bar\n              class=\"border-block-start\"\n              slot=\"footer-above\"\n              part=\"progress-bar\"\n              stateType={this.progressState}\n              caption={\n                this.selectedModuleAction.message ||\n                this.#componentLocale.progressBar.defaultCaption\n              }\n              progress={this.progressValue}\n              active={this.actionInProgress}\n              closeType={this.autoCloseProgressBar ? \"auto-close\" : \"button\"}\n              closedCallback={this.#progressBarCloseHandler}\n              ref={el =>\n                (this.#progressBarEl = el as HTMLGxIdeProgressBarElement)\n              }\n            ></gx-ide-progress-bar>\n          </footer>\n        </section>\n      </Host>\n    );\n  }\n}\n\nexport type ExecuteActionCallback = (\n  serverId: string,\n  moduleId: string,\n  moduleVersionId: string,\n  action: ModuleActionType,\n  onProgress: (\n    message: string,\n    progress: number,\n    state: TopStateBarType\n  ) => void\n) => Promise<boolean>;\n\nexport type ServerSelectedCallback = (\n  id: string,\n  reload: boolean\n) => Promise<ModuleData[]>;\n\nexport type ServerContextMenuCallback = (\n  contextMenuInfo: ContextMenuInfo\n) => Promise<void>;\nexport interface ActionInfo {\n  message: string;\n  progress: number;\n  state: TopStateBarType;\n}\n\nexport type ModuleVersionsMap = Map<string, { value: string; caption: string }>;\nexport type ModulesMap = Map<string, ModuleMapValue>;\nexport type ModuleMapValue = {\n  moduleData: ModuleData;\n  currentInstalledVersion: string;\n  currentSelectedVersion: string;\n  comboBoxVersionsModel: ComboBoxModel;\n};\nexport type ModulesVersionsMap = Map<string, ModuleVersionData>;\n"],"mappings":"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"}

package/dist/genexus-ide-ui/p-3a22af5d.entry.js

@@ -0,0 +1,249 @@
+import { r as e, c as t, g as s, h as i, H as a, a as r } from "./p-9b9ccd0c.js";
+
+import { L as o } from "./p-311eedf3.js";
+
+import { g as n } from "./p-d42e842b.js";
+
+import "./p-d4ecd3bb.js";
+
+import "lit";
+
+import "lit/directives/when.js";
+
+import "lit/directives/if-defined.js";
+
+const mapTypesToComboboxItemModel = e => {
+  const t = [];
+  e.forEach((e => {
+    const s = {
+      value: e.type,
+      caption: e.type
+    };
+    t.push(s);
+  }));
+  return t;
+};
+
+const l = ":host{display:grid;grid-template-rows:1fr 1fr max-content;block-size:100%;overflow:auto}.user-password{display:grid;grid-template-columns:max-content 1fr;gap:var(--spacing-comp-03)}.auth-column-1{display:grid;gap:var(--spacing-comp-03);grid-template-rows:repeat(2, 1fr)}.auth-column-1 .label{margin-block-start:var(--field-inline-label__margin-block-start)}.auth-column-2{display:grid;gap:var(--spacing-comp-03);grid-template-rows:repeat(2, 1fr)}.source-input{display:grid;grid-template-columns:1fr max-content}.module-servers-grid-local{display:grid;gap:var(--spacing-comp-03);grid-template-rows:max-content max-content}.module-servers-grid-server{display:grid;gap:var(--spacing-comp-03);grid-template-rows:1fr max-content max-content}.server-options{display:grid;gap:var(--spacing-comp-03);grid-template-columns:max-content 1fr}.server-options__col1{display:grid;gap:var(--spacing-comp-03);grid-template-rows:repeat(3, 1fr)}.server-options__col1 .label{margin-block-start:var(--field-inline-label__margin-block-start)}.server-options__col2{display:grid;gap:var(--spacing-comp-03);grid-template-rows:repeat(3, 1fr)}";
+
+var c = undefined && undefined.__classPrivateFieldGet || function(e, t, s, i) {
+  if (s === "a" && !i) throw new TypeError("Private accessor was defined without a getter");
+  if (typeof t === "function" ? e !== t || !i : !t.has(e)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+  return s === "m" ? i : s === "a" ? i.call(e) : i ? i.value : t.get(e);
+};
+
+var d = undefined && undefined.__classPrivateFieldSet || function(e, t, s, i, a) {
+  if (i === "m") throw new TypeError("Private method is not writable");
+  if (i === "a" && !a) throw new TypeError("Private accessor was defined without a setter");
+  if (typeof t === "function" ? e !== t || !a : !t.has(e)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+  return i === "a" ? a.call(e, s) : a ? a.value = s : t.set(e, s), s;
+};
+
+var p, h, f, u, m, g, v, w, b, y, k, _, W, M, x, j;
+
+const T = [ "resets/box-sizing", "utils/form--full", "utils/layout", "utils/typography", "utils/spacing", "chameleon/scrollbar" ];
+
+const C = n({
+  category: "gemini-tools",
+  name: "show-more-horizontal",
+  colorType: "on-surface"
+});
+
+const F = class {
+  constructor(a) {
+    e(this, a);
+    this.componentDidRenderFirstTime = t(this, "componentDidRenderFirstTime", 7);
+    p.set(this, void 0);
+    h.set(this, false);
+    f.set(this, []);
+    u.set(this, s(`./gx-ide-assets/edit-module-server/shortcuts.json`));
+    m.set(this, void 0);
+    g.set(this, void 0);
+    v.set(this, void 0);
+    w.set(this, void 0);
+    b.set(this, void 0);
+    y.set(this, void 0);
+    k.set(this, (async () => {
+      await this.cancelCallback();
+    }));
+    _.set(this, (async () => {
+      if (this.confirmCallback) {
+        const e = this.types.find((({type: e}) => e === this.selectedType));
+        let t = {};
+        if (e.type === "remote") {
+          t = {
+            id: e.id,
+            name: c(this, g, "f").value,
+            type: c(this, w, "f").value,
+            authenticated: e.authenticated,
+            source: c(this, b, "f").value,
+            user: c(this, y, "f").value,
+            password: c(this, v, "f").value
+          };
+        } else {
+          t = {
+            id: e.id,
+            name: c(this, g, "f").value,
+            type: c(this, w, "f").value,
+            authenticated: e.authenticated,
+            source: c(this, b, "f").value
+          };
+        }
+        await this.confirmCallback(t);
+      }
+    }));
+    W.set(this, (e => {
+      this.selectedType = e.detail;
+    }));
+    M.set(this, (() => i("footer", {
+      class: "control-footer control-footer-with-border spacing-body-block-end spacing-body-inline"
+    }, i("div", {
+      class: "buttons-spacer"
+    }, i("button", {
+      class: "button-secondary",
+      id: "button-cancel",
+      onClick: c(this, k, "f"),
+      part: "button-cancel"
+    }, c(this, p, "f").footer.btnCancel), i("button", {
+      class: "button-primary",
+      id: "button-create",
+      onClick: c(this, _, "f"),
+      part: "button-create"
+    }, c(this, p, "f").footer.btnConfirm)))));
+    x.set(this, (() => i("div", {
+      class: "spacing-body user-password"
+    }, i("div", {
+      class: "auth-column-1"
+    }, i("label", {
+      class: "label",
+      htmlFor: "user"
+    }, c(this, p, "f").user), i("label", {
+      class: "label",
+      htmlFor: "password"
+    }, c(this, p, "f").password)), i("div", {
+      class: "auth-column-2"
+    }, i("ch-edit", {
+      id: "user",
+      part: "user",
+      class: "input",
+      placeholder: c(this, p, "f").user,
+      ref: e => d(this, y, e, "f")
+    }), i("ch-edit", {
+      id: "password",
+      part: "password",
+      class: "input",
+      placeholder: c(this, p, "f").password,
+      ref: e => d(this, v, e, "f")
+    })))));
+    j.set(this, (async () => {
+      if (this.selectSourceCallback) {
+        const e = await this.selectSourceCallback();
+        if (e) {
+          c(this, b, "f").value = e;
+        }
+      }
+    }));
+    this.selectedType = "local";
+    this.cancelCallback = undefined;
+    this.confirmCallback = undefined;
+    this.name = undefined;
+    this.selectSourceCallback = undefined;
+    this.source = undefined;
+    this.type = undefined;
+    this.types = undefined;
+  }
+  async componentWillLoad() {
+    d(this, p, await o.getComponentStrings(this.el), "f");
+    d(this, f, mapTypesToComboboxItemModel(this.types), "f");
+  }
+  componentDidRender() {
+    if (!c(this, h, "f")) {
+      this.componentDidRenderFirstTime.emit(c(this, p, "f").componentName);
+      d(this, h, true, "f");
+    }
+  }
+  /**
+     * Suspends or reactivates the shortcuts
+     */  async suspendShortcuts(e) {
+    if (e) {
+      c(this, m, "f").suspend = true;
+    } else {
+      c(this, m, "f").suspend = false;
+    }
+  }
+  render() {
+    return i(a, {
+      class: "widget"
+    }, i("ch-theme", {
+      model: T
+    }), i("ch-shortcuts", {
+      src: c(this, u, "f"),
+      ref: e => d(this, m, e, "f")
+    }), i("div", {
+      class: this.selectedType === "local" ? "module-servers-grid-local" : "module-servers-grid-server"
+    }, i("div", {
+      class: "server-options spacing-body"
+    }, i("div", {
+      class: "server-options__col1"
+    }, i("label", {
+      class: "label",
+      htmlFor: "server-type"
+    }, c(this, p, "f").type), i("label", {
+      class: "label",
+      htmlFor: "name"
+    }, c(this, p, "f").name), i("label", {
+      class: "label",
+      htmlFor: "source"
+    }, c(this, p, "f").source)), i("div", {
+      class: "server-options__col2"
+    }, i("ch-combo-box-render", {
+      accessibleName: "server types",
+      id: "server-type",
+      part: "server-type",
+      class: "combo-box",
+      model: c(this, f, "f"),
+      value: this.types[0].type,
+      onChange: c(this, W, "f"),
+      ref: e => d(this, w, e, "f")
+    }), i("ch-edit", {
+      placeholder: c(this, p, "f").name,
+      ref: e => d(this, g, e, "f"),
+      value: this.name,
+      part: "name",
+      class: "input",
+      id: "name"
+    }), i("div", {
+      class: "source-input"
+    }, i("ch-edit", {
+      placeholder: c(this, p, "f").source,
+      ref: e => d(this, b, e, "f"),
+      value: this.source,
+      class: "input",
+      part: "source",
+      id: "source"
+    }), this.selectedType === "local" && i("button", {
+      class: "button-tertiary button-icon-only",
+      "aria-label": "caption",
+      onClick: c(this, j, "f")
+    }, i("ch-image", {
+      class: "icon-sm",
+      src: C
+    }))))), this.selectedType === "remote" && c(this, x, "f").call(this), c(this, M, "f").call(this)));
+  }
+  static get assetsDirs() {
+    return [ "gx-ide-assets/edit-module-server" ];
+  }
+  get el() {
+    return r(this);
+  }
+};
+
+p = new WeakMap, h = new WeakMap, f = new WeakMap, u = new WeakMap, m = new WeakMap, 
+g = new WeakMap, v = new WeakMap, w = new WeakMap, b = new WeakMap, y = new WeakMap, 
+k = new WeakMap, _ = new WeakMap, W = new WeakMap, M = new WeakMap, x = new WeakMap, 
+j = new WeakMap;
+
+F.style = l;
+
+export { F as gx_ide_edit_module_server };
+//# sourceMappingURL=p-3a22af5d.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["mapTypesToComboboxItemModel","types","typesComboBoxItemModel","forEach","type","typeObject","value","caption","push","editModuleServerCss","CSS_BUNDLES","MORE_ICON","getIconPath","category","name","colorType","GxIdeEditModuleServer","_GxIdeEditModuleServer__componentLocale","set","this","_GxIdeEditModuleServer_renderedFirstTime","_GxIdeEditModuleServer_serverTypesModel","_GxIdeEditModuleServer_shortcutsSrc","getAssetPath","_GxIdeEditModuleServer_chShortcutsEl","_GxIdeEditModuleServer_nameEl","_GxIdeEditModuleServer_passwordEl","_GxIdeEditModuleServer_serverTypeEl","_GxIdeEditModuleServer_sourceEl","_GxIdeEditModuleServer_userEl","_GxIdeEditModuleServer_cancelCallbackHandler","async","cancelCallback","_GxIdeEditModuleServer_confirmCallbackHandler","confirmCallback","selectedTypeId","find","selectedType","data","id","__classPrivateFieldGet","authenticated","source","user","password","_GxIdeEditModuleServer_handleServerTypeChange","e","detail","_GxIdeEditModuleServer_renderFooter","h","class","onClick","part","footer","btnCancel","btnConfirm","_GxIdeEditModuleServer_renderServerOptions","htmlFor","placeholder","ref","el","__classPrivateFieldSet","_GxIdeEditModuleServer_selectSourceCallbackHandle","selectSourceCallback","path","componentWillLoad","Locale","getComponentStrings","componentDidRender","componentDidRenderFirstTime","emit","componentName","suspendShortcuts","suspend","render","Host","model","src","accessibleName","onChange","call"],"sources":["src/components/modules/edit-module-server/helpers.tsx","src/components/modules/edit-module-server/edit-module-server.scss?tag=gx-ide-edit-module-server&encapsulation=shadow","src/components/modules/edit-module-server/edit-module-server.tsx"],"sourcesContent":["import { ComboBoxItemModel } from \"@genexus/chameleon-controls-library/dist/types/components/combo-box/types\";\nimport { ModuleServerType } from \"../types\";\n\nexport const mapTypesToComboboxItemModel = (\n  types: ModuleServerType[]\n): ComboBoxItemModel[] => {\n  const typesComboBoxItemModel: ComboBoxItemModel[] = [];\n  types.forEach(type => {\n    const typeObject: ComboBoxItemModel = {\n      value: type.type,\n      caption: type.type\n    };\n    typesComboBoxItemModel.push(typeObject);\n  });\n  return typesComboBoxItemModel;\n};\n",":host {\n  display: grid;\n  grid-template-rows: 1fr 1fr max-content;\n  block-size: 100%;\n  overflow: auto;\n}\n\n.user-password {\n  display: grid;\n  grid-template-columns: max-content 1fr;\n  gap: var(--spacing-comp-03);\n}\n.auth-column-1 {\n  display: grid;\n  gap: var(--spacing-comp-03);\n  grid-template-rows: repeat(2, 1fr);\n  .label {\n    margin-block-start: var(--field-inline-label__margin-block-start);\n  }\n}\n.auth-column-2 {\n  display: grid;\n  gap: var(--spacing-comp-03);\n  grid-template-rows: repeat(2, 1fr);\n}\n\n.source-input {\n  display: grid;\n  grid-template-columns: 1fr max-content;\n}\n\n.module-servers-grid-local {\n  display: grid;\n  gap: var(--spacing-comp-03);\n  grid-template-rows: max-content max-content;\n}\n.module-servers-grid-server {\n  display: grid;\n  gap: var(--spacing-comp-03);\n  grid-template-rows: 1fr max-content max-content;\n}\n\n.server-options {\n  display: grid;\n  gap: var(--spacing-comp-03);\n  grid-template-columns: max-content 1fr;\n\n  &__col1 {\n    display: grid;\n    gap: var(--spacing-comp-03);\n    grid-template-rows: repeat(3, 1fr);\n    .label {\n      margin-block-start: var(--field-inline-label__margin-block-start);\n    }\n  }\n  &__col2 {\n    display: grid;\n    gap: var(--spacing-comp-03);\n    grid-template-rows: repeat(3, 1fr);\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Event,\n  State,\n  EventEmitter,\n  getAssetPath,\n  Method\n} from \"@stencil/core\";\n\nimport { Locale } from \"../../../common/locale\";\nimport {\n  ModuleServerType,\n  ModuleServerFullData,\n  EditServerModuleResult\n} from \"../types\";\nimport { getIconPath, MercuryBundles } from \"@genexus/mercury\";\nimport { ComboBoxItemModel } from \"@genexus/chameleon-controls-library/dist/types/components/combo-box/types\";\nimport { mapTypesToComboboxItemModel } from \"./helpers\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"utils/form--full\",\n  \"utils/layout\",\n  \"utils/typography\",\n  \"utils/spacing\",\n  \"chameleon/scrollbar\"\n];\n\nconst MORE_ICON = getIconPath({\n  category: \"gemini-tools\",\n  name: \"show-more-horizontal\",\n  colorType: \"on-surface\"\n});\n\n@Component({\n  tag: \"gx-ide-edit-module-server\",\n  styleUrl: \"edit-module-server.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/edit-module-server\"]\n})\nexport class GxIdeEditModuleServer {\n  #_componentLocale: any;\n  #renderedFirstTime = false;\n  #serverTypesModel: ComboBoxItemModel[] = [];\n  #shortcutsSrc = getAssetPath(\n    `./gx-ide-assets/edit-module-server/shortcuts.json`\n  );\n\n  @Element() el: HTMLGxIdeEditModuleServerElement;\n  #chShortcutsEl: HTMLChShortcutsElement;\n  #nameEl: HTMLChEditElement;\n  #passwordEl: HTMLChEditElement;\n  #serverTypeEl: HTMLChComboBoxRenderElement;\n  #sourceEl: HTMLChEditElement;\n  #userEl: HTMLChEditElement;\n\n  @State() selectedType: \"local\" | \"remote\" = \"local\";\n\n  /**\n   * Cancel callback\n   */\n  @Prop() readonly cancelCallback: CancelCallback;\n\n  /**\n   * Confirm callback\n   */\n  @Prop() readonly confirmCallback: ConfirmCallback;\n\n  /**\n   * The name of the server\n   */\n  @Prop() readonly name: string;\n\n  /**\n   * Callback invoked when wants to select a local folder that have modules inside\n   */\n  @Prop() readonly selectSourceCallback: SelectSourceCallback;\n\n  /**\n   * Disk path or server url\n   */\n  @Prop() readonly source: string;\n\n  /**\n   * Id of the currently selected server type\n   */\n  @Prop() readonly type: string;\n\n  /**\n   * The type of the server\n   */\n  @Prop() readonly types: ModuleServerType[];\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  async componentWillLoad() {\n    this.#_componentLocale = await Locale.getComponentStrings(this.el);\n    this.#serverTypesModel = mapTypesToComboboxItemModel(this.types);\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  /**\n   * Suspends or reactivates the shortcuts\n   */\n  @Method()\n  async suspendShortcuts(suspendShortcuts: boolean) {\n    if (suspendShortcuts) {\n      this.#chShortcutsEl.suspend = true;\n    } else {\n      this.#chShortcutsEl.suspend = false;\n    }\n  }\n\n  #cancelCallbackHandler = async () => {\n    await this.cancelCallback();\n  };\n\n  #confirmCallbackHandler = async () => {\n    if (this.confirmCallback) {\n      const selectedTypeId = this.types.find(\n        ({ type }) => type === this.selectedType\n      );\n      let data = {} as ModuleServerFullData;\n      if (selectedTypeId.type === \"remote\") {\n        data = {\n          id: selectedTypeId.id,\n          name: this.#nameEl.value,\n          type: this.#serverTypeEl.value as \"remote\" | \"local\",\n          authenticated: selectedTypeId.authenticated,\n          source: this.#sourceEl.value,\n          user: this.#userEl.value,\n          password: this.#passwordEl.value\n        };\n      } else {\n        data = {\n          id: selectedTypeId.id,\n          name: this.#nameEl.value,\n          type: this.#serverTypeEl.value as \"remote\" | \"local\",\n          authenticated: selectedTypeId.authenticated,\n          source: this.#sourceEl.value\n        };\n      }\n      const result = await this.confirmCallback(data);\n      if (result.success) {\n        // display success message\n      } else {\n        // display error message\n      }\n    }\n  };\n\n  #handleServerTypeChange = (e: CustomEvent<string>) => {\n    this.selectedType = e.detail as \"local\" | \"remote\";\n  };\n\n  #renderFooter = () => {\n    return (\n      <footer class=\"control-footer control-footer-with-border spacing-body-block-end spacing-body-inline\">\n        <div class=\"buttons-spacer\">\n          <button\n            class=\"button-secondary\"\n            id=\"button-cancel\"\n            onClick={this.#cancelCallbackHandler}\n            part=\"button-cancel\"\n          >\n            {this.#_componentLocale.footer.btnCancel}\n          </button>\n          <button\n            class=\"button-primary\"\n            id=\"button-create\"\n            onClick={this.#confirmCallbackHandler}\n            part=\"button-create\"\n          >\n            {this.#_componentLocale.footer.btnConfirm}\n          </button>\n        </div>\n      </footer>\n    );\n  };\n\n  #renderServerOptions = (): Element[] => {\n    return (\n      <div class=\"spacing-body user-password\">\n        <div class=\"auth-column-1\">\n          <label class=\"label\" htmlFor=\"user\">\n            {this.#_componentLocale.user}\n          </label>\n          <label class=\"label\" htmlFor=\"password\">\n            {this.#_componentLocale.password}\n          </label>\n        </div>\n        <div class=\"auth-column-2\">\n          <ch-edit\n            id=\"user\"\n            part=\"user\"\n            class=\"input\"\n            placeholder={this.#_componentLocale.user}\n            ref={(el: HTMLChEditElement) =>\n              (this.#userEl = el as HTMLChEditElement)\n            }\n          ></ch-edit>\n          <ch-edit\n            id=\"password\"\n            part=\"password\"\n            class=\"input\"\n            placeholder={this.#_componentLocale.password}\n            ref={(el: HTMLChEditElement) =>\n              (this.#passwordEl = el as HTMLChEditElement)\n            }\n          ></ch-edit>\n        </div>\n      </div>\n    );\n  };\n\n  #selectSourceCallbackHandle = async () => {\n    if (this.selectSourceCallback) {\n      const path = await this.selectSourceCallback();\n\n      if (path) {\n        this.#sourceEl.value = path;\n      }\n    }\n  };\n\n  render() {\n    return (\n      <Host class=\"widget\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <ch-shortcuts\n          src={this.#shortcutsSrc}\n          ref={(el: HTMLChShortcutsElement) =>\n            (this.#chShortcutsEl = el as HTMLChShortcutsElement)\n          }\n        ></ch-shortcuts>\n        <div\n          class={\n            this.selectedType === \"local\"\n              ? \"module-servers-grid-local\"\n              : \"module-servers-grid-server\"\n          }\n        >\n          <div class=\"server-options spacing-body\">\n            <div class=\"server-options__col1\">\n              <label class=\"label\" htmlFor=\"server-type\">\n                {this.#_componentLocale.type}\n              </label>\n              <label class=\"label\" htmlFor=\"name\">\n                {this.#_componentLocale.name}\n              </label>\n              <label class=\"label\" htmlFor=\"source\">\n                {this.#_componentLocale.source}\n              </label>\n            </div>\n            <div class=\"server-options__col2\">\n              <ch-combo-box-render\n                accessibleName=\"server types\"\n                id=\"server-type\"\n                part=\"server-type\"\n                class=\"combo-box\"\n                model={this.#serverTypesModel}\n                value={this.types[0].type as \"local\" | \"remote\"}\n                onChange={this.#handleServerTypeChange}\n                ref={(el: HTMLChComboBoxRenderElement) =>\n                  (this.#serverTypeEl = el as HTMLChComboBoxRenderElement)\n                }\n              ></ch-combo-box-render>\n              <ch-edit\n                placeholder={this.#_componentLocale.name}\n                ref={(el: HTMLChEditElement) =>\n                  (this.#nameEl = el as HTMLChEditElement)\n                }\n                value={this.name}\n                part=\"name\"\n                class=\"input\"\n                id=\"name\"\n              ></ch-edit>\n              <div class=\"source-input\">\n                <ch-edit\n                  placeholder={this.#_componentLocale.source}\n                  ref={(el: HTMLChEditElement) =>\n                    (this.#sourceEl = el as HTMLChEditElement)\n                  }\n                  value={this.source}\n                  class=\"input\"\n                  part=\"source\"\n                  id=\"source\"\n                ></ch-edit>\n\n                {this.selectedType === \"local\" && (\n                  <button\n                    class=\"button-tertiary button-icon-only\"\n                    aria-label=\"caption\"\n                    onClick={this.#selectSourceCallbackHandle}\n                  >\n                    <ch-image class=\"icon-sm\" src={MORE_ICON}></ch-image>\n                  </button>\n                )}\n              </div>\n            </div>\n          </div>\n\n          {this.selectedType === \"remote\" && this.#renderServerOptions()}\n\n          {this.#renderFooter()}\n        </div>\n      </Host>\n    );\n  }\n}\nexport type ConfirmCallback = (\n  data: ModuleServerFullData\n) => Promise<EditServerModuleResult>;\nexport type CancelCallback = () => Promise<void>;\nexport type SelectSourceCallback = () => Promise<string | undefined>;\n"],"mappings":"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"}

package/dist/genexus-ide-ui/p-45d9dcbc.entry.js

@@ -0,0 +1,166 @@
+import { r, c as t, h as e, H as s, a } from "./p-9b9ccd0c.js";
+
+import { g as o } from "./p-d42e842b.js";
+
+import "./p-d4ecd3bb.js";
+
+import "lit";
+
+import "lit/directives/when.js";
+
+import "lit/directives/if-defined.js";
+
+const i = ':host{--top-bar-progress:0%;display:grid;grid-template-rows:0fr;transition:var(--mer-timing--fast) grid-template-rows;overflow:hidden;--ds-icon-size-box--small:var(--mer-font__size--2xs);--ds-icon-size--small:100%}:host>*{overflow:hidden}:host(.disable-transition){--progress-bar-transition-speed:0 !important}:host(.visible){grid-template-rows:1fr}.top-state-bar{position:relative;display:flex;flex-direction:column;gap:var(--mer-spacing--sm);border-radius:var(--mer-border__width--lg);list-style:var(--mer-font__size--2xs);display:flex;}.top-state-bar>*{position:relative;z-index:1}.top-state-bar__outer-wrapper{position:relative;flex:1;display:flex;flex-direction:column;gap:var(--mer-spacing--sm);padding:var(--mer-spacing--sm) var(--mer-spacing--sm)}.top-state-bar__outer-wrapper::after,.top-state-bar__outer-wrapper::before{border-radius:var(--mer-border__width--lg)}.top-state-bar__outer-wrapper::before{content:"";width:100%;height:100%;left:0;top:0;position:absolute;background-color:var(--mer-border-color__dim);z-index:0}.top-state-bar__outer-wrapper::after{content:"";left:var(--mer-border__width--sm);top:var(--mer-border__width--sm);width:calc(100% - var(--mer-border__width--sm) * 2);height:calc(100% - var(--mer-border__width--sm) * 2);position:absolute;background-color:var(--mer-surface);z-index:1}.top-state-bar__inner-wrapper{flex:1;display:flex;flex-direction:row;justify-content:space-between;gap:var(--mer-spacing--xs);position:relative;z-index:2}.top-state-bar__caption{color:var(--mer-text__on-surface);font-size:var(--mer-font__size--2xs);line-height:var(--mer-font__size--2xs);font-weight:var(--mer-font__weight--regular);display:flex;align-items:center;font-style:italic}.top-state-bar__progress-wrapper{height:var(--mer-spacing--2xs);background-color:var(--mer-surface__elevation--01);position:relative;z-index:2}.top-state-bar__close{cursor:pointer;transition:var(--mer-timing--fast) background-color}.top-state-bar__inner-wrapper,.top-state-bar__progress-wrapper,.top-state-bar__close{opacity:0;transition:150ms opacity}.top-state-bar--accent .progress-bar{background-color:var(--mer-accent__primary)}.top-state-bar--success .progress-bar{background-color:var(--mer-color__message-green--100)}.top-state-bar--warning .progress-bar{background-color:var(--mer-color__message-yellow--100)}.top-state-bar--error .progress-bar{background-color:var(--mer-color__message-red--100)}.top-state-bar--in-progress .top-state-bar__outer-wrapper:before{height:0;width:120%;padding-top:60%;padding-bottom:60%;background:linear-gradient(90deg, rgba(91, 167, 255, 0.4) 0%, rgba(63, 168, 155, 0.4) 100%);top:50%;left:50%;transform:translate(-50%, -50%);-webkit-animation:inProgressBackgroundColor 1s linear infinite;animation:inProgressBackgroundColor 1s linear infinite}.top-state-bar--in-progress .progress-bar{position:relative;overflow:hidden;z-index:1}.top-state-bar--in-progress .progress-bar:after{content:"";position:absolute;z-index:0;width:300%;height:100%;left:0;background:linear-gradient(90deg, #93f5eb 0%, #1aa3ff 33%, #93f5eb 66%, #1aa3ff 100%);animation-name:inProgressBar;animation-duration:2s;animation-iteration-count:infinite}.top-state-bar--visible .top-state-bar__inner-wrapper,.top-state-bar--visible .top-state-bar__progress-wrapper,.top-state-bar--visible .top-state-bar__close{opacity:1}.top-state-bar--visible .top-state-bar__close:hover{opacity:0.75}.top-state-bar--visible .top-state-bar__close:active{opacity:0.5}:host(.with-close-button) .top-state-bar__outer-wrapper{padding-top:var(--mer-spacing--2xs);gap:var(--mer-spacing--2xs)}@-webkit-keyframes inProgressBackgroundColor{0%{transform:translate(-50%, -50%) rotate(0)}100%{transform:translate(-50%, -50%) rotate(1turn)}}@-webkit-keyframes inProgressBar{0%{left:0%}100%{left:-200%}}@-moz-keyframes inProgressBar{0%{left:0%}100%{left:200%}}@keyframes inProgressBar{0%{left:0%}100%{left:-200%}}.progress-bar{display:block;transition:all var(--progress-bar-transition-speed);width:var(--top-bar-progress);border-radius:calc(var(--mer-spacing--2xs) / 2);height:100%}:host(.no-border) .top-state-bar__outer-wrapper:before,:host(.border-block-start) .top-state-bar__outer-wrapper:before,:host(.border-block-end) .top-state-bar__outer-wrapper:before{display:none}:host(.border-block-start) .top-state-bar__outer-wrapper{border-block-start:var(--mer-border__width--sm) solid var(--mer-border-color__on-elevation--01)}:host(.border-block-end) .top-state-bar__outer-wrapper{border-block-start:var(--mer-border__width--sm) solid var(--mer-border-color__on-elevation--01)}';
+
+const n = [ "resets/box-sizing", "utils/form", "utils/layout", "utils/typography", "components/button", "components/icon", "components/combo-box", "components/edit", "components/tabular-grid" ];
+
+const p = o({
+  category: "system",
+  name: "close",
+  colorType: "primary"
+});
+
+const l = 200;
+
+const b = class {
+  constructor(s) {
+    r(this, s);
+    this.progressBarClosed = t(this, "progressBarClosed", 7);
+    this.evaluateInitialProgress = () => {
+      if (this.progress === undefined && (this.stateType === "error" || this.stateType === "warning" || this.stateType === "success")) {
+        this.progress = 100;
+      } else if (this.progress === undefined && this.stateType === "in-progress") {
+        this.progress = 0;
+      }
+      this.el.style.setProperty("--top-bar-progress", `${this.progress}%`);
+    };
+    this.closeClickHandler = () => {
+      this.active = false;
+      this.closedCallback();
+    };
+    this.renderClose = () => this.closeType === "button" && e("button", {
+      class: "button-tertiary button-icon-only",
+      "aria-label": "close",
+      onClick: this.closeClickHandler,
+      role: "button",
+      tabIndex: this.visible ? 0 : -1
+    }, e("ch-image", {
+      src: p,
+      class: "icon-md"
+    }));
+    this.topStateBarVisible = false;
+    this.disableTransition = false;
+    this.visible = false;
+    this.caption = undefined;
+    this.minimal = false;
+    this.active = false;
+    this.stateType = "in-progress";
+    this.progress = undefined;
+    this.closeType = "button";
+    this.closedCallback = () => {};
+  }
+  watchActiveHandler(r) {
+    if (r) {
+      this.visible = true;
+      setTimeout((() => {
+        this.topStateBarVisible = true;
+      }), 300);
+    } else {
+      this.topStateBarVisible = false;
+      setTimeout((() => {
+        this.visible = false;
+        this.el.style.setProperty("--top-bar-progress", `0%`);
+        this.progressBarClosed.emit();
+      }), 300);
+    }
+  }
+  watchProgressHandler(r) {
+    if (r >= 0 && r <= 100) {
+      this.el.style.setProperty("--top-bar-progress", `${r}%`);
+    }
+    if (r === 100 && this.closeType === "auto-close") {
+      setTimeout((() => {
+        this.active = false;
+      }), 200);
+    }
+  }
+  componentWillLoad() {
+    this.evaluateInitialProgress();
+    if (this.active) {
+      this.visible = true;
+      this.topStateBarVisible = true;
+    }
+  }
+  /**
+     * Sets the progress bar to zero instantly (no transition) and changes the type
+     * to 'accent'. Useful when reusing the progress bar for a new process.
+     */  async reset() {
+    // Resetting involves setting the progress to zero. In this case it is preferable
+    // to disable the transition.
+    this.disableTransition = true;
+    this.progress = 0;
+    this.stateType = "accent";
+    setTimeout((() => {
+      this.disableTransition = false;
+ // enable transition for the nex process.
+        }), l);
+  }
+  render() {
+    return e(s, {
+      class: {
+        visible: this.visible,
+        "with-close-button": this.closeType === "button",
+        "disable-transition": this.disableTransition
+      },
+      "aria-hidden": !this.active,
+      style: {
+        "--progress-bar-transition-speed": `${l}ms`
+      }
+    }, e("ch-theme", {
+      model: n
+    }), e("div", {
+      role: "status",
+      "aria-labelledby": "label",
+      "aria-hidden": !this.active,
+      class: {
+        "top-state-bar": true,
+        [`top-state-bar--${this.stateType}`]: true,
+        "top-state-bar--visible": this.topStateBarVisible
+      }
+    }, e("div", {
+      class: "top-state-bar__outer-wrapper"
+    }, !this.minimal ? e("div", {
+      class: "top-state-bar__inner-wrapper"
+    }, e("label", {
+      id: "label",
+      class: {
+        "top-state-bar__caption": true
+      },
+      part: "label"
+    }, this.caption), this.renderClose()) : null, e("div", {
+      class: {
+        "top-state-bar__progress-wrapper": true
+      },
+      part: "progress-wrapper"
+    }, e("span", {
+      class: "progress-bar"
+    })))));
+  }
+  static get assetsDirs() {
+    return [ "gx-ide-assets/progress-bar" ];
+  }
+  get el() {
+    return a(this);
+  }
+  static get watchers() {
+    return {
+      active: [ "watchActiveHandler" ],
+      progress: [ "watchProgressHandler" ]
+    };
+  }
+};
+
+b.style = i;
+
+export { b as gx_ide_progress_bar };
+//# sourceMappingURL=p-45d9dcbc.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["progressBarCss","CSS_BUNDLES","CLOSE_ICON","getIconPath","category","name","colorType","PROGRESS_TRANSITION_SPEED","GxIdeProgressBar","this","evaluateInitialProgress","progress","undefined","stateType","el","style","setProperty","closeClickHandler","active","closedCallback","renderClose","closeType","h","class","onClick","role","tabIndex","visible","src","watchActiveHandler","setTimeout","topStateBarVisible","progressBarClosed","emit","watchProgressHandler","componentWillLoad","reset","disableTransition","render","Host","model","minimal","id","part","caption"],"sources":["src/components/_helpers/progress-bar/progress-bar.scss?tag=gx-ide-progress-bar&encapsulation=shadow","src/components/_helpers/progress-bar/progress-bar.tsx"],"sourcesContent":["// --progress-bar-transition-speed is defined on the Host in the .tsx\n$border: var(--mer-border__width--sm) solid\n  var(--mer-border-color__on-elevation--01);\n\n:host {\n  --top-bar-progress: 0%;\n  display: grid;\n  grid-template-rows: 0fr;\n  transition: var(--mer-timing--fast) grid-template-rows;\n  overflow: hidden;\n\n  //icon\n  --ds-icon-size-box--small: var(--mer-font__size--2xs);\n  --ds-icon-size--small: 100%;\n\n  > * {\n    overflow: hidden;\n  }\n}\n:host(.disable-transition) {\n  --progress-bar-transition-speed: 0 !important;\n}\n:host(.visible) {\n  grid-template-rows: 1fr;\n}\n.top-state-bar {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  gap: var(--mer-spacing--sm);\n\n  > * {\n    position: relative;\n    z-index: 1;\n  }\n  border-radius: var(--mer-border__width--lg);\n  list-style: var(--mer-font__size--2xs);\n  display: flex;\n\n  &__outer-wrapper {\n    &::after,\n    &::before {\n      border-radius: var(--mer-border__width--lg);\n    }\n    &::before {\n      content: \"\";\n      width: 100%;\n      height: 100%;\n      left: 0;\n      top: 0;\n      position: absolute;\n      background-color: var(--mer-border-color__dim);\n      z-index: 0;\n    }\n    &::after {\n      content: \"\";\n      left: var(--mer-border__width--sm);\n      top: var(--mer-border__width--sm);\n      width: calc(100% - var(--mer-border__width--sm) * 2);\n      height: calc(100% - var(--mer-border__width--sm) * 2);\n      position: absolute;\n      background-color: var(--mer-surface);\n      z-index: 1;\n    }\n\n    position: relative;\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    gap: var(--mer-spacing--sm);\n    padding: var(--mer-spacing--sm) var(--mer-spacing--sm);\n  }\n  &__inner-wrapper {\n    flex: 1;\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n    gap: var(--mer-spacing--xs);\n    position: relative;\n    z-index: 2;\n  }\n  &__caption {\n    color: var(--mer-text__on-surface);\n    font-size: var(--mer-font__size--2xs);\n    line-height: var(--mer-font__size--2xs);\n    font-weight: var(--mer-font__weight--regular);\n    display: flex;\n    align-items: center;\n    font-style: italic;\n  }\n  &__progress-wrapper {\n    height: var(--mer-spacing--2xs);\n    background-color: var(--mer-surface__elevation--01);\n    position: relative;\n    z-index: 2;\n  }\n  &__close {\n    cursor: pointer;\n    transition: var(--mer-timing--fast) background-color;\n  }\n  &__inner-wrapper,\n  &__progress-wrapper,\n  &__close {\n    opacity: 0;\n    transition: 150ms opacity;\n  }\n\n  /*states*/\n  &--accent {\n    .progress-bar {\n      background-color: var(--mer-accent__primary);\n    }\n  }\n  &--success {\n    .progress-bar {\n      background-color: var(--mer-color__message-green--100);\n    }\n  }\n  &--warning {\n    .progress-bar {\n      background-color: var(--mer-color__message-yellow--100);\n    }\n  }\n  &--error {\n    .progress-bar {\n      background-color: var(--mer-color__message-red--100);\n    }\n  }\n  &--in-progress {\n    .top-state-bar__outer-wrapper:before {\n      height: 0;\n      width: 120%;\n      padding-top: 60%;\n      padding-bottom: 60%;\n      background: linear-gradient(\n        90deg,\n        rgba(91, 167, 255, 0.4) 0%,\n        rgba(63, 168, 155, 0.4) 100%\n      );\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n      -webkit-animation: inProgressBackgroundColor 1s linear infinite;\n      animation: inProgressBackgroundColor 1s linear infinite;\n    }\n    .progress-bar {\n      position: relative;\n      overflow: hidden;\n      z-index: 1;\n      &:after {\n        content: \"\";\n        position: absolute;\n        z-index: 0;\n        width: 300%;\n        height: 100%;\n        left: 0;\n        background: linear-gradient(\n          90deg,\n          rgba(147, 245, 235, 1) 0%,\n          rgba(26, 163, 255, 1) 33%,\n          rgba(147, 245, 235, 1) 66%,\n          rgba(26, 163, 255, 1) 100%\n        );\n        animation-name: inProgressBar;\n        animation-duration: 2s;\n        animation-iteration-count: infinite;\n      }\n    }\n  }\n  &--visible {\n    .top-state-bar__inner-wrapper,\n    .top-state-bar__progress-wrapper,\n    .top-state-bar__close {\n      opacity: 1;\n    }\n    .top-state-bar__close {\n      &:hover {\n        opacity: 0.75;\n      }\n      &:active {\n        opacity: 0.5;\n      }\n    }\n  }\n}\n\n// With Close Button (some spacing needs to be adjusted)\n:host(.with-close-button) {\n  .top-state-bar {\n    &__outer-wrapper {\n      padding-top: var(--mer-spacing--2xs);\n      gap: var(--mer-spacing--2xs);\n    }\n  }\n}\n\n/*in progress animation*/\n@-webkit-keyframes inProgressBackgroundColor {\n  0% {\n    transform: translate(-50%, -50%) rotate(0);\n  }\n  100% {\n    transform: translate(-50%, -50%) rotate(1turn);\n  }\n}\n@-webkit-keyframes inProgressBar {\n  0% {\n    left: 0%;\n  }\n  100% {\n    left: -200%;\n  }\n}\n@-moz-keyframes inProgressBar {\n  0% {\n    left: 0%;\n  }\n  100% {\n    left: 200%;\n  }\n}\n@keyframes inProgressBar {\n  0% {\n    left: 0%;\n  }\n  100% {\n    left: -200%;\n  }\n}\n\n.progress-bar {\n  display: block;\n  transition: all var(--progress-bar-transition-speed);\n  width: var(--top-bar-progress);\n  border-radius: calc(var(--mer-spacing--2xs) / 2);\n  height: 100%;\n}\n\n:host(.no-border),\n:host(.border-block-start),\n:host(.border-block-end) {\n  .top-state-bar__outer-wrapper {\n    &:before {\n      display: none;\n    }\n  }\n}\n:host(.border-block-start) {\n  .top-state-bar__outer-wrapper {\n    border-block-start: $border;\n  }\n}\n:host(.border-block-end) {\n  .top-state-bar__outer-wrapper {\n    border-block-start: $border;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Watch,\n  Element,\n  Event,\n  EventEmitter,\n  Method\n} from \"@stencil/core\";\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"utils/form\",\n  \"utils/layout\",\n  \"utils/typography\",\n  \"components/button\",\n  \"components/icon\",\n  \"components/combo-box\",\n  \"components/edit\",\n  \"components/tabular-grid\"\n];\n\nconst CLOSE_ICON = getIconPath({\n  category: \"system\",\n  name: \"close\",\n  colorType: \"primary\"\n});\nconst PROGRESS_TRANSITION_SPEED = 200;\n\n@Component({\n  tag: \"gx-ide-progress-bar\",\n  styleUrl: \"progress-bar.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/progress-bar\"]\n})\nexport class GxIdeProgressBar {\n  @Element() el: HTMLGxIdeProgressBarElement;\n\n  /**\n   * If true it will display the caption\n   */\n  @State() topStateBarVisible: boolean = false;\n\n  /**\n   * If true the progress will be updated instantly, without transition. This is required when the host user is calling the \"reset\" method.\n   */\n  @State() disableTransition: boolean = false;\n\n  /**\n   * If true it will display bar\n   */\n  @State() visible: boolean = false;\n\n  /**\n   * The top-bar title\n   */\n  @Prop() readonly caption: string;\n\n  /**\n   * It will only display the bar (no title, no close button)\n   */\n  @Prop({ reflect: true }) readonly minimal: boolean = false;\n\n  /**\n   * The top-bar active state. If false it will be hidden\n   */\n  @Prop({ mutable: true }) active: boolean = false;\n  @Watch(\"active\")\n  watchActiveHandler(active: boolean) {\n    if (active) {\n      this.visible = true;\n      setTimeout(() => {\n        this.topStateBarVisible = true;\n      }, 300);\n    } else {\n      this.topStateBarVisible = false;\n      setTimeout(() => {\n        this.visible = false;\n        this.el.style.setProperty(\"--top-bar-progress\", `0%`);\n        this.progressBarClosed.emit();\n      }, 300);\n    }\n  }\n\n  /**\n   * The top-bar state\n   */\n  @Prop({ mutable: true }) stateType: TopStateBarType = \"in-progress\";\n\n  /**\n   * The progress bar progress\n   */\n  @Prop({ mutable: true }) progress: number = undefined;\n  @Watch(\"progress\")\n  watchProgressHandler(progress: number) {\n    if (progress >= 0 && progress <= 100) {\n      this.el.style.setProperty(\"--top-bar-progress\", `${progress}%`);\n    }\n    if (progress === 100 && this.closeType === \"auto-close\") {\n      setTimeout(() => {\n        this.active = false;\n      }, 200);\n    }\n  }\n\n  /**\n   * How to display the close button\n   */\n  @Prop() readonly closeType: \"auto-close\" | \"button\" = \"button\";\n\n  /**\n   * A callback that gets called when the top-state-bar is closed\n   */\n  @Prop() readonly closedCallback: () => void = () => {};\n\n  /**\n   * Emitted every time the progress bar is closed.\n   */\n  @Event() progressBarClosed: EventEmitter;\n\n  componentWillLoad() {\n    this.evaluateInitialProgress();\n    if (this.active) {\n      this.visible = true;\n      this.topStateBarVisible = true;\n    }\n  }\n\n  /**\n   * Sets the progress bar to zero instantly (no transition) and changes the type\n   * to 'accent'. Useful when reusing the progress bar for a new process.\n   */\n  @Method()\n  async reset() {\n    // Resetting involves setting the progress to zero. In this case it is preferable\n    // to disable the transition.\n    this.disableTransition = true;\n    this.progress = 0;\n    this.stateType = \"accent\";\n    setTimeout(() => {\n      this.disableTransition = false; // enable transition for the nex process.\n    }, PROGRESS_TRANSITION_SPEED);\n  }\n\n  private evaluateInitialProgress = () => {\n    if (\n      this.progress === undefined &&\n      (this.stateType === \"error\" ||\n        this.stateType === \"warning\" ||\n        this.stateType === \"success\")\n    ) {\n      this.progress = 100;\n    } else if (\n      this.progress === undefined &&\n      this.stateType === \"in-progress\"\n    ) {\n      this.progress = 0;\n    }\n    this.el.style.setProperty(\"--top-bar-progress\", `${this.progress}%`);\n  };\n\n  private closeClickHandler = () => {\n    this.active = false;\n    this.closedCallback();\n  };\n\n  private renderClose = () => {\n    return (\n      this.closeType === \"button\" && (\n        <button\n          class=\"button-tertiary button-icon-only\"\n          aria-label=\"close\"\n          onClick={this.closeClickHandler}\n          role=\"button\"\n          tabIndex={this.visible ? 0 : -1}\n        >\n          <ch-image src={CLOSE_ICON} class=\"icon-md\"></ch-image>\n        </button>\n      )\n    );\n  };\n\n  render() {\n    return (\n      <Host\n        class={{\n          \"visible\": this.visible,\n          \"with-close-button\": this.closeType === \"button\",\n          \"disable-transition\": this.disableTransition\n        }}\n        aria-hidden={!this.active}\n        style={{\n          \"--progress-bar-transition-speed\": `${PROGRESS_TRANSITION_SPEED}ms`\n        }}\n      >\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <div\n          role=\"status\"\n          aria-labelledby=\"label\"\n          aria-hidden={!this.active}\n          class={{\n            \"top-state-bar\": true,\n            [`top-state-bar--${this.stateType}`]: true,\n            \"top-state-bar--visible\": this.topStateBarVisible\n          }}\n        >\n          <div class=\"top-state-bar__outer-wrapper\">\n            {!this.minimal ? (\n              <div class=\"top-state-bar__inner-wrapper\">\n                <label\n                  id=\"label\"\n                  class={{\n                    \"top-state-bar__caption\": true\n                  }}\n                  part=\"label\"\n                >\n                  {this.caption}\n                </label>\n\n                {this.renderClose()}\n              </div>\n            ) : null}\n            <div\n              class={{\n                \"top-state-bar__progress-wrapper\": true\n              }}\n              part=\"progress-wrapper\"\n            >\n              <span class=\"progress-bar\"></span>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n\nexport type TopStateBarType =\n  | \"accent\"\n  | \"success\"\n  | \"warning\"\n  | \"error\"\n  | \"in-progress\";\n"],"mappings":";;;;;;;;;;;;AAAA,MAAMA,IAAiB;;ACcvB,MAAMC,IAA8B,EAClC,qBACA,cACA,gBACA,oBACA,qBACA,mBACA,wBACA,mBACA;;AAGF,MAAMC,IAAaC,EAAY;EAC7BC,UAAU;EACVC,MAAM;EACNC,WAAW;;;AAEb,MAAMC,IAA4B;;MAQrBC,IAAgB;;;;IA6GnBC,KAAAC,0BAA0B;MAChC,IACED,KAAKE,aAAaC,cACjBH,KAAKI,cAAc,WAClBJ,KAAKI,cAAc,aACnBJ,KAAKI,cAAc,YACrB;QACAJ,KAAKE,WAAW;aACX,IACLF,KAAKE,aAAaC,aAClBH,KAAKI,cAAc,eACnB;QACAJ,KAAKE,WAAW;;MAElBF,KAAKK,GAAGC,MAAMC,YAAY,sBAAsB,GAAGP,KAAKE;AAAY;IAG9DF,KAAAQ,oBAAoB;MAC1BR,KAAKS,SAAS;MACdT,KAAKU;AAAgB;IAGfV,KAAAW,cAAc,MAElBX,KAAKY,cAAc,YACjBC,EAAA;MACEC,OAAM;MAAkC,cAC7B;MACXC,SAASf,KAAKQ;MACdQ,MAAK;MACLC,UAAUjB,KAAKkB,UAAU,KAAK;OAE9BL,EAAA;MAAUM,KAAK1B;MAAYqB,OAAM;;8BAvIF;6BAKD;mBAKV;;mBAUyB;kBAKV;qBAqBW;oBAKVX;qBAgBU;0BAKR;;EA7C9C,kBAAAiB,CAAmBX;IACjB,IAAIA,GAAQ;MACVT,KAAKkB,UAAU;MACfG,YAAW;QACTrB,KAAKsB,qBAAqB;AAAI,UAC7B;WACE;MACLtB,KAAKsB,qBAAqB;MAC1BD,YAAW;QACTrB,KAAKkB,UAAU;QACflB,KAAKK,GAAGC,MAAMC,YAAY,sBAAsB;QAChDP,KAAKuB,kBAAkBC;AAAM,UAC5B;;;EAcP,oBAAAC,CAAqBvB;IACnB,IAAIA,KAAY,KAAKA,KAAY,KAAK;MACpCF,KAAKK,GAAGC,MAAMC,YAAY,sBAAsB,GAAGL;;IAErD,IAAIA,MAAa,OAAOF,KAAKY,cAAc,cAAc;MACvDS,YAAW;QACTrB,KAAKS,SAAS;AAAK,UAClB;;;EAmBP,iBAAAiB;IACE1B,KAAKC;IACL,IAAID,KAAKS,QAAQ;MACfT,KAAKkB,UAAU;MACflB,KAAKsB,qBAAqB;;;;;;SAS9B,WAAMK;;;IAGJ3B,KAAK4B,oBAAoB;IACzB5B,KAAKE,WAAW;IAChBF,KAAKI,YAAY;IACjBiB,YAAW;MACTrB,KAAK4B,oBAAoB;+EAAK;YAC7B9B;;EAyCL,MAAA+B;IACE,OACEhB,EAACiB,GAAI;MACHhB,OAAO;QACLI,SAAWlB,KAAKkB;QAChB,qBAAqBlB,KAAKY,cAAc;QACxC,sBAAsBZ,KAAK4B;;MAC5B,gBACa5B,KAAKS;MACnBH,OAAO;QACL,mCAAmC,GAAGR;;OAGxCe,EAAA;MAAUkB,OAAOvC;QACjBqB,EAAA;MACEG,MAAK;MAAQ,mBACG;MAAO,gBACThB,KAAKS;MACnBK,OAAO;QACL,iBAAiB;QACjB,CAAC,kBAAkBd,KAAKI,cAAc;QACtC,0BAA0BJ,KAAKsB;;OAGjCT,EAAA;MAAKC,OAAM;QACPd,KAAKgC,UACLnB,EAAA;MAAKC,OAAM;OACTD,EAAA;MACEoB,IAAG;MACHnB,OAAO;QACL,0BAA0B;;MAE5BoB,MAAK;OAEJlC,KAAKmC,UAGPnC,KAAKW,iBAEN,MACJE,EAAA;MACEC,OAAO;QACL,mCAAmC;;MAErCoB,MAAK;OAELrB,EAAA;MAAMC,OAAM"}