@genexus/genexus-ide-ui 1.1.48 → 1.1.50

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

@@ -1 +0,0 @@
-{"version":3,"names":["serverSelectorCss","CSS_BUNDLES","INFO_ICON","getIconPath","category","name","colorType","LOCK_ICON","LANGUAGE_ICON","GxIdeServerSelector","_GxIdeServerSelector_chSearchIcon","set","this","_GxIdeServerSelector_versionsSelect","value","caption","_GxIdeServerSelector__componentLocale","_GxIdeServerSelector_chGridRecentlyUsedServersEl","_GxIdeServerSelector_chGridConnectedServersEl","_GxIdeServerSelector_previousSelectedRowId","_GxIdeServerSelector_selectedRowId","_GxIdeServerSelector_serverUrlEL","_GxIdeServerSelector_cancelHandler","cancelCallback","_GxIdeServerSelector_confirmHandler","async","selectedConnectionType","selectServerCallback","uri","selectedServerUri","selectedServerName","isValidUrl","__classPrivateFieldGet","_GxIdeServerSelector_validateUrl","call","serverUrlInputValue","serverNameInputValue","_GxIdeServerSelector_filterValueChangedHandler","event","filterValue","detail","toLowerCase","filteredConnectedServersData","connectedServersData","filter","item","serverName","includes","_GxIdeServerSelector_inputHandler","field","enableConfirmButton","_GxIdeServerSelector_enableConfirmButton","url","serverUrl","URL","protocolValid","protocol","startsWith","ex","length","_GxIdeServerSelector_selectConnectedServersHandler","_GxIdeServerSelector_handleServerSelection","_GxIdeServerSelector_selectRecentlyUsedServersHandler","recentlyUsedServersData","serversData","otherGridEl","isFirstSelection","__classPrivateFieldSet","rowId","undefined","selectedServer","find","server","id","userName","gxServerUsername","selectRow","_GxIdeServerSelector_connectionTypeChangedHandler","_GxIdeServerSelector_sortTabularGridColumnCallback","e","sortTabularGridColumn","_GxIdeServerSelector_renderTabularGridColumnSet","hideColumnName","h","class","columnId","columnName","settingable","columnNameHidden","size","config","tabularGrid","colSize","maxContent","resizable","sortable","onColumnSortChanged","auto","_GxIdeServerSelector_renderTooltip","text","actionElement","blockAlign","inlineAlign","tooltipSettings","delay","_GxIdeServerSelector_renderTabularGridCommonCells","_GxIdeServerSelector_renderIcon","accessLevel","isConnected","_GxIdeServerSelector_renderRecentlyUsedServersGrid","rowSelectionMode","ref","el","allowColumnReorder","onRowClicked","map","rowid","stateIconSrc","stateTitle","emptyConnectedServers","isAnimated","_GxIdeServerSelector_renderConnectedServersGrid","icon","src","_GxIdeServerSelector_renderFooter","isSelectionMode","onClick","footer","cancel","disabled","confirm","Map","componentWillLoad","Locale","getComponentStrings","_a","_b","render","connectionTypeClass","recentlyUsedEmptyClass","Host","model","header","title","onChange","startImgSrc","onInput","placeholder","placeholders","searchServers","accessibleName","type","htmlFor","recentlyUsed","allServers","labels","input","maxLength","errors","serverUrlInvalid"],"sources":["src/components/team-dev/server-selector/server-selector.scss?tag=gx-ide-server-selector&encapsulation=shadow","src/components/team-dev/server-selector/server-selector.tsx"],"sourcesContent":["@import \"../../../../node_modules/@genexus/mercury/dist/assets/scss/helpers.scss\";\n\n:host {\n  display: grid;\n  block-size: 100%;\n  grid-template-rows: max-content max-content 1fr max-content;\n  row-gap: var(--mer-spacing--md);\n  overflow: auto;\n}\n\n:host(.new-connection) {\n  grid-template-rows: max-content 1fr;\n}\n\n:host(.recently-used-empty) {\n  grid-template-rows: max-content 1fr;\n}\n\n.section {\n  display: contents;\n}\n\n// General\n\n.tabular-grid {\n  border-radius: var(--mer-border__radius--sm);\n  overflow: hidden;\n  overflow: auto;\n  border-inline: 1px solid var(--grid-cell__border-color);\n}\n\n.tabular-grid-rowset-empty {\n  border-block-end: 1px solid var(--grid-cell__border-color);\n  overflow: hidden;\n}\n\n@include tabular-grid-cell-layout(\n  $tabular-grid-selector: \".tabular-grid\",\n  $tabular-grid-cell-apply-ellipsis: true,\n  $tabular-grid-affected-columns-nth-list: (\n    2,\n    3,\n    4\n  )\n);\n\n.text-neutral-gray-400,\n.tabular-grid-cell.text-neutral-gray-400 {\n  // WA: colors for text should be defined in Mercury\n  color: var(--mer-color__neutral-gray--400);\n}\n// Header\n\n.search-server {\n  inline-size: 50%;\n}\n\n// Recently Used\n\n.tabular-grid-recently-used .tabular-grid-column::part(bar) {\n  --grid-cell__padding-block: 0;\n  --grid-cell__padding-inline: 0;\n}\n\n.tabular-grid.tabular-grid-recently-used {\n  border-block-end: 1px solid var(--grid-cell__border-color);\n  max-block-size: 100px;\n}\n\n// All Servers\n\n.tabular-grid-all-servers {\n  overflow: auto;\n}\n\n.field-block-all-servers {\n  overflow: auto;\n}\n\n.tabular-grid-all-servers {\n  border-block: 1px solid var(--grid-cell__border-color);\n}\n\n.tabular-grid-all-servers .tabular-grid-column:first-child::part(bar) {\n  --grid-common__gap: 0;\n}\n\n// WA: .tabular-grid-wrapper and .border-patch is a WA. See details on Asana task:\n// https://app.asana.com/1/10206720691358/project/1207081021030105/task/1211391456974726?focus=true\n.tabular-grid-wrapper {\n  position: relative;\n  overflow: auto;\n}\n.border-patch {\n  --tabular-grid-border-radius: 4px;\n  position: absolute;\n  top: 0;\n  inline-size: calc(100% - var(--tabular-grid-border-radius) * 2);\n  inset-inline-start: var(--tabular-grid-border-radius);\n  block-size: 2px;\n  background-color: var(--items-container__bg-color);\n  z-index: 9999;\n  border-block-start: 1px solid var(--mer-border-color__on-surface);\n}\n","// Stencil\nimport { Component, Element, h, Host, Prop, State } from \"@stencil/core\";\n\n// Other Libraries\nimport { getIconPath, MercuryBundles } from \"@genexus/mercury\";\n\n// Custom Imports\nimport {\n  ChEditCustomEvent,\n  TabularGridColumnSortChangedEvent,\n  TabularGridRowClickedEvent\n} from \"@genexus/chameleon-controls-library\";\nimport { RadioGroupItemModel } from \"@genexus/chameleon-controls-library/dist/types/components/radio-group/types\";\nimport { JSX } from \"@stencil/core/internal\";\nimport { config } from \"../../../common/config\";\nimport {\n  ControlValidation\n  // validateControls\n} from \"../../../common/form-validation\";\nimport { Locale } from \"../../../common/locale\";\nimport { FormSubmitResult } from \"../../../common/types\";\n\nimport sortTabularGridColumn from \"../../../common/chameleon/tabular-grid-column-sort\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"utils/form--full\",\n  \"utils/layout\",\n  \"utils/typography\",\n  \"utils/spacing\",\n  \"components/tooltip\",\n  \"chameleon/scrollbar\",\n  \"components/tabular-grid\"\n];\n\nconst INFO_ICON = getIconPath({\n  category: \"system\",\n  name: \"information\",\n  colorType: \"on-surface\"\n});\n\nconst LOCK_ICON = getIconPath({\n  category: \"system\",\n  name: \"lock\",\n  colorType: \"on-surface\"\n});\n\nconst LANGUAGE_ICON = getIconPath({\n  category: \"system\",\n  name: \"language\",\n  colorType: \"on-surface\"\n});\n\n@Component({\n  tag: \"gx-ide-server-selector\",\n  styleUrl: \"server-selector.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/server-selector\"]\n})\nexport class GxIdeServerSelector {\n  #chSearchIcon = getIconPath({\n    category: \"system\",\n    name: \"search\",\n    colorType: \"on-surface\"\n  });\n\n  #versionsSelect: RadioGroupItemModel[] = [\n    { value: \"select\", caption: \"Select a server from the list below\" },\n    { value: \"new\", caption: \"Enter a server URL manually\" }\n  ];\n\n  [key: string]: any;\n\n  #_componentLocale: any;\n\n  #chGridRecentlyUsedServersEl: HTMLChTabularGridElement;\n  #chGridConnectedServersEl: HTMLChTabularGridElement;\n  #previousSelectedRowId: string | undefined;\n  #selectedRowId: string | undefined;\n  #serverUrlEL: HTMLChEditElement;\n\n  @Element() el: HTMLGxIdeServerSelectorElement;\n\n  /**\n   * State to enable/disable confirm button.\n   */\n  @State() enableConfirmButton: boolean = false;\n\n  /**\n   * State to track if this is the first selection made by the user.\n   */\n  @State() isFirstSelection: boolean = true;\n\n  /**\n   * State to track if the server URL is valid.\n   */\n  @State() isValidUrl: boolean = true;\n\n  /**\n   * The current server URL input value.\n   */\n  @State() serverUrlInputValue: string = \"\";\n\n  /**\n   * The current server URL input value.\n   */\n  @State() serverNameInputValue: string = \"\";\n\n  /**\n   * The selected server URI.\n   */\n  @State() selectedServerUri: string | undefined;\n\n  /**\n   * The selected server name.\n   */\n  @State() selectedServerName: string | undefined = \"None\";\n\n  /**\n   * The user name of the selected server.\n   */\n  @State() userName: string;\n\n  /**\n   * State to store the filter input value to filter the list-box\n   */\n  @State() filterValue: string = \"\";\n\n  /**\n   * Servers filtered\n   */\n  @State() filteredConnectedServersData: ConnectedGXServerData[] = [];\n\n  @State() validatableControls = new Map<string, ControlValidation>();\n\n  /**\n   * The selected connection type\n   */\n  @State() selectedConnectionType: ConnectionOption = \"select\";\n\n  /**\n   * The list of connected GX servers.\n   */\n  @Prop({ mutable: true }) connectedServersData: ConnectedGXServerData[] = [];\n\n  /**\n   * The list of recently used servers.\n   */\n  @Prop() readonly recentlyUsedServersData: ConnectedGXServerData[] = [];\n\n  /**\n   * Callback that is invoked when the dialog is closed\n   */\n  @Prop() readonly cancelCallback!: () => Promise<void>;\n\n  /**\n   * Callback that must be invoked when the 'Confirm' button is pressed and the Select Server option is checked.\n   */\n  @Prop() readonly selectServerCallback!: (\n    authenticationSessionOrigin: AuthenticationSessionOrigin\n  ) => Promise<void>;\n\n  async componentWillLoad() {\n    this.#_componentLocale = await Locale.getComponentStrings(this.el);\n    this.selectedServerUri = this.connectedServersData[0]?.serverUrl;\n    this.userName = this.connectedServersData[0]?.gxServerUsername;\n\n    this.filteredConnectedServersData = this.connectedServersData;\n  }\n\n  #cancelHandler = (): void => {\n    this.cancelCallback();\n  };\n\n  #confirmHandler = async (): Promise<void | ServerType> => {\n    if (this.selectedConnectionType === \"select\") {\n      await this.selectServerCallback({\n        uri: this.selectedServerUri,\n        name: this.selectedServerName\n      });\n    } else if (this.selectedConnectionType === \"new\") {\n      this.isValidUrl = this.#validateUrl(this.serverUrlInputValue);\n      if (this.isValidUrl) {\n        await this.selectServerCallback({\n          uri: this.serverUrlInputValue,\n          name: this.serverNameInputValue\n        });\n      }\n    }\n  };\n\n  #filterValueChangedHandler = (\n    event: ChEditCustomEvent<string> | InputEvent\n  ) => {\n    this.filterValue = (event.detail as string).toLowerCase();\n    this.filteredConnectedServersData = this.connectedServersData.filter(item =>\n      item.serverName.toLowerCase().includes(this.filterValue)\n    );\n  };\n\n  #inputHandler = (\n    event: ChEditCustomEvent<string> | InputEvent,\n    field: \"serverUrlInputValue\" | \"serverNameInputValue\"\n  ) => {\n    this.enableConfirmButton = false;\n    this[field] = event.detail as string;\n    this.#enableConfirmButton();\n  };\n\n  #validateUrl = (url: string): boolean => {\n    try {\n      const serverUrl = new URL(url);\n      const protocolValid =\n        (serverUrl.protocol === \"http:\" || serverUrl.protocol === \"https:\") &&\n        url.startsWith(`${serverUrl.protocol}//`);\n      return protocolValid;\n    } catch (ex) {\n      return false;\n    }\n  };\n\n  #enableConfirmButton = () => {\n    if (\n      this.serverUrlInputValue &&\n      this.serverUrlInputValue.length > 0 &&\n      this.serverNameInputValue &&\n      this.serverNameInputValue.length > 0\n    ) {\n      this.enableConfirmButton = true;\n    } else {\n      this.enableConfirmButton = false;\n    }\n  };\n\n  #selectConnectedServersHandler = (\n    event: CustomEvent<TabularGridRowClickedEvent>\n  ) =>\n    this.#handleServerSelection(\n      event,\n      this.connectedServersData,\n      this.#chGridRecentlyUsedServersEl\n    );\n\n  #selectRecentlyUsedServersHandler = (\n    event: CustomEvent<TabularGridRowClickedEvent>\n  ) =>\n    this.#handleServerSelection(\n      event,\n      this.recentlyUsedServersData,\n      this.#chGridConnectedServersEl\n    );\n\n  #handleServerSelection = async (\n    event: CustomEvent<TabularGridRowClickedEvent>,\n    serversData: ConnectedGXServerData[],\n    otherGridEl: HTMLChTabularGridElement\n  ): Promise<void> => {\n    if (!this.isFirstSelection) {\n      this.#previousSelectedRowId = this.#selectedRowId;\n    }\n    this.#selectedRowId = event.detail.rowId;\n    if (this.#selectedRowId === undefined) {\n      this.enableConfirmButton = false;\n      this.selectedServerUri = undefined;\n      this.selectedServerName = undefined;\n      return;\n    } else {\n      const selectedServer = serversData.find(\n        server => server.id === this.#selectedRowId\n      );\n      this.enableConfirmButton = true;\n      this.selectedServerName = selectedServer?.serverName;\n      this.selectedServerUri = selectedServer?.serverUrl;\n      this.userName = selectedServer?.gxServerUsername || \"\";\n      this.isFirstSelection = false;\n      await otherGridEl?.selectRow(this.#previousSelectedRowId, false);\n    }\n  };\n\n  #connectionTypeChangedHandler = (event: CustomEvent<string>) => {\n    this.selectedConnectionType = event.detail as ConnectionOption;\n    if (this.selectedConnectionType === \"new\") {\n      this.enableConfirmButton = false;\n      this.serverUrlInputValue = \"\";\n    }\n    this.selectedServerName = \"None\";\n  };\n\n  #sortTabularGridColumnCallback = (\n    e: CustomEvent<TabularGridColumnSortChangedEvent>\n  ) => {\n    this.filteredConnectedServersData = [\n      ...sortTabularGridColumn(\n        e,\n        this.filteredConnectedServersData,\n        \"string\",\n        undefined\n      )\n    ];\n  };\n\n  #renderTabularGridColumnSet = (\n    hideColumnName: boolean = false\n  ): HTMLChTabularGridColumnsetElement => {\n    return (\n      <ch-tabular-grid-columnset class=\"tabular-grid-column-set\">\n        <ch-tabular-grid-column\n          columnId=\"icon\"\n          class=\"tabular-grid-column tabular-grid-column-icon\"\n          columnName=\"Icon\"\n          settingable={false}\n          columnNameHidden={true}\n          size={config.tabularGrid.colSize.maxContent}\n          resizable={false}\n          sortable={false}\n        ></ch-tabular-grid-column>\n        <ch-tabular-grid-column\n          columnId=\"serverName\"\n          class=\"tabular-grid-column\"\n          columnName=\"Server Name\"\n          settingable={false}\n          columnNameHidden={hideColumnName}\n          size={config.tabularGrid.colSize.serverName}\n          resizable={false}\n          sortable={!hideColumnName}\n          onColumnSortChanged={this.#sortTabularGridColumnCallback}\n        ></ch-tabular-grid-column>\n        <ch-tabular-grid-column\n          columnId=\"serverUrl\"\n          class=\"tabular-grid-column\"\n          columnName=\"Server Url\"\n          settingable={false}\n          columnNameHidden={hideColumnName}\n          size={config.tabularGrid.colSize.auto}\n          resizable={false}\n          sortable={!hideColumnName}\n          onColumnSortChanged={this.#sortTabularGridColumnCallback}\n        ></ch-tabular-grid-column>\n        <ch-tabular-grid-column\n          columnId=\"userName\"\n          class=\"tabular-grid-column\"\n          columnName=\"Username\"\n          settingable={false}\n          columnNameHidden={hideColumnName}\n          size={config.tabularGrid.colSize.userName}\n          resizable={false}\n          sortable={!hideColumnName}\n          onColumnSortChanged={this.#sortTabularGridColumnCallback}\n        ></ch-tabular-grid-column>\n        <ch-tabular-grid-column\n          columnId=\"status\"\n          class=\"tabular-grid-column\"\n          columnName=\"Status\"\n          settingable={false}\n          columnNameHidden={hideColumnName}\n          size={config.tabularGrid.colSize.maxContent}\n          resizable={false}\n          sortable={false}\n        ></ch-tabular-grid-column>\n      </ch-tabular-grid-columnset>\n    );\n  };\n\n  #renderTooltip = (text: string): JSX.Element | null => {\n    return text !== \"\" ? (\n      <ch-tooltip\n        class=\"tooltip\"\n        actionElement={null}\n        blockAlign=\"outside-end\"\n        inlineAlign={config.tooltipSettings.inlineAlign}\n        delay={config.tooltipSettings.delay}\n      >\n        {text}\n      </ch-tooltip>\n    ) : null;\n  };\n\n  #renderTabularGridCommonCells = (server: ConnectedGXServerData) => {\n    return [\n      <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n        {this.#renderIcon(server.accessLevel)}\n      </ch-tabular-grid-cell>,\n      <ch-tabular-grid-cell class=\"tabular-grid-cell tabular-grid-cell-server-name\">\n        {server.serverName}\n      </ch-tabular-grid-cell>,\n      <ch-tabular-grid-cell class=\"tabular-grid-cell tabular-grid-cell-server-url\">\n        {server.serverUrl}\n        {this.#renderTooltip(server.serverUrl)}\n      </ch-tabular-grid-cell>,\n      <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n        {server.gxServerUsername}\n      </ch-tabular-grid-cell>,\n      <ch-tabular-grid-cell class=\"tabular-grid-cell text-neutral-gray-400 body-italic-s\">\n        {server.isConnected && \"Connected\"}\n      </ch-tabular-grid-cell>\n    ];\n  };\n\n  #renderRecentlyUsedServersGrid = (hideColumnName: boolean): Element => {\n    return (\n      <ch-tabular-grid\n        class={\"tabular-grid-recently-used tabular-grid\"}\n        rowSelectionMode=\"single\"\n        ref={(el: HTMLChTabularGridElement) =>\n          (this.#chGridRecentlyUsedServersEl = el)\n        }\n        allowColumnReorder={false}\n        onRowClicked={this.#selectRecentlyUsedServersHandler}\n        id=\"recently-used-servers\"\n      >\n        {this.#renderTabularGridColumnSet(hideColumnName)}\n        {this.recentlyUsedServersData.length > 0 ? (\n          <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n            {this.recentlyUsedServersData.map(\n              (server: ConnectedGXServerData) => (\n                <ch-tabular-grid-row rowid={server.id} class=\"tabular-grid-row\">\n                  {this.#renderTabularGridCommonCells(server)}\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              <gx-ide-empty-state\n                stateIconSrc={INFO_ICON}\n                stateTitle={this.#_componentLocale.emptyConnectedServers}\n                isAnimated={true}\n              ></gx-ide-empty-state>\n            </ch-tabular-grid-rowset-empty>\n          </ch-tabular-grid-rowset>\n        )}\n      </ch-tabular-grid>\n    );\n  };\n\n  #renderConnectedServersGrid = (): Element => {\n    return (\n      <div class=\"tabular-grid-wrapper\">\n        <div class=\"border-patch\"></div>\n        <ch-tabular-grid\n          class={\"tabular-grid tabular-grid-all-servers\"}\n          rowSelectionMode=\"single\"\n          ref={(el: HTMLChTabularGridElement) =>\n            (this.#chGridConnectedServersEl = el)\n          }\n          allowColumnReorder={false}\n          onRowClicked={this.#selectConnectedServersHandler}\n          id=\"all-servers\"\n        >\n          {this.#renderTabularGridColumnSet()}\n          {this.filteredConnectedServersData.length > 0 ? (\n            <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n              {this.filteredConnectedServersData.map(\n                (server: ConnectedGXServerData) => (\n                  <ch-tabular-grid-row\n                    rowid={server.id}\n                    class=\"tabular-grid-row\"\n                  >\n                    {this.#renderTabularGridCommonCells(server)}\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 class=\"tabular-grid-rowset-empty\">\n                <gx-ide-empty-state\n                  stateIconSrc={INFO_ICON}\n                  stateTitle={this.#_componentLocale.emptyConnectedServers}\n                  isAnimated={true}\n                ></gx-ide-empty-state>\n              </ch-tabular-grid-rowset-empty>\n            </ch-tabular-grid-rowset>\n          )}\n        </ch-tabular-grid>\n      </div>\n    );\n  };\n\n  #renderIcon = (accessLevel: string): JSX.Element => {\n    const icon = accessLevel === \"private\" ? LOCK_ICON : LANGUAGE_ICON;\n    return <ch-image class=\"icon-md\" src={icon}></ch-image>;\n  };\n\n  #renderFooter = () => {\n    const isSelectionMode = this.selectedConnectionType === \"select\";\n    return (\n      <footer\n        class={{\n          \"control-footer-with-border\": true,\n          \"control-footer-space-between\":\n            this.selectedConnectionType === \"select\",\n          \"space-between\": isSelectionMode,\n          \"spacing-body-inline\": true,\n          \"spacing-body-block\": true\n        }}\n      >\n        {isSelectionMode && (\n          <p class=\"body-italic-m\">Selected: {this.selectedServerName}</p>\n        )}\n        <div class=\"buttons-spacer\">\n          <button\n            // cancel button\n            class=\"button-secondary\"\n            onClick={this.#cancelHandler}\n          >\n            {this.#_componentLocale.footer.cancel}\n          </button>\n\n          <button\n            // confirm button\n            class=\"button-primary\"\n            onClick={this.enableConfirmButton && this.#confirmHandler}\n            disabled={!this.enableConfirmButton}\n          >\n            {this.#_componentLocale.footer.confirm}\n          </button>\n        </div>\n      </footer>\n    );\n  };\n\n  render(): void {\n    const connectionTypeClass =\n      this.selectedConnectionType === \"new\" && \"new-connection\";\n    const recentlyUsedEmptyClass =\n      this.recentlyUsedServersData.length === 0 && \"recently-used-empty\";\n    return (\n      <Host\n        class={`widget elevation-1 ${connectionTypeClass} ${recentlyUsedEmptyClass}`}\n      >\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <main class=\"section\">\n          <header class=\"header spacing-body-block-start spacing-body-inline\">\n            <div class=\"field-group\">\n              <label class=\"body-regular-m text-neutral-gray-400\">\n                {this.#_componentLocale.header.title}\n              </label>\n              <ch-radio-group-render\n                class=\"radio-group\"\n                model={this.#versionsSelect}\n                onChange={this.#connectionTypeChangedHandler}\n                value={this.#versionsSelect[0].value}\n              ></ch-radio-group-render>\n\n              {this.selectedConnectionType === \"select\" && (\n                <ch-edit\n                  class=\"input search-server\"\n                  id=\"server-name-search\"\n                  startImgSrc={this.#chSearchIcon}\n                  onInput={this.#filterValueChangedHandler}\n                  placeholder={\n                    this.#_componentLocale.placeholders.searchServers\n                  }\n                  accessibleName=\"search server\"\n                  type=\"search\"\n                ></ch-edit>\n              )}\n            </div>\n          </header>\n          {this.selectedConnectionType === \"select\" && [\n            this.recentlyUsedServersData.length > 0 && (\n              <div class=\"field field-block spacing-body-inline\">\n                <label class=\"label\" htmlFor=\"recently-used-servers\">\n                  {this.#_componentLocale.recentlyUsed.title}\n                </label>\n                {this.#renderRecentlyUsedServersGrid(true)}\n              </div>\n            ),\n            <div class=\"field field-block field-block-all-servers spacing-body-inline\">\n              <label class=\"label\" htmlFor=\"all-servers\">\n                {this.#_componentLocale.allServers.title}\n              </label>\n              {this.#renderConnectedServersGrid()}\n            </div>\n          ]}\n\n          {this.selectedConnectionType === \"new\" && (\n            <section class=\"spacing-body-inline\">\n              <div class=\"layout layout--cols-2\">\n                <div class=\"field field-block layout__panel\">\n                  <label class=\"label\" htmlFor=\"server-url\">\n                    {this.#_componentLocale.labels.serverUrl}\n                  </label>\n                  <ch-edit\n                    // server url\n                    class={{ \"input\": true, \"input-error\": !this.isValidUrl }}\n                    id=\"server-url\"\n                    value={this.serverUrlInputValue}\n                    onInput={event =>\n                      this.#inputHandler(event, \"serverUrlInputValue\")\n                    }\n                    placeholder={this.#_componentLocale.placeholders.serverUrl}\n                    ref={el => (this.#serverUrlEL = el as HTMLChEditElement)}\n                  ></ch-edit>\n                </div>\n                <div class=\"field field-block layout__panel\">\n                  <label class=\"label\" htmlFor=\"server-name\">\n                    {this.#_componentLocale.labels.serverName}\n                  </label>\n                  <ch-edit\n                    // server friendly name\n                    class=\"input\"\n                    id=\"server-name\"\n                    value={this.serverNameInputValue}\n                    onInput={event =>\n                      this.#inputHandler(event, \"serverNameInputValue\")\n                    }\n                    placeholder={this.#_componentLocale.placeholders.serverName}\n                    maxLength={18}\n                  ></ch-edit>\n                </div>\n                {!this.isValidUrl && (\n                  <ch-tooltip\n                    class=\"tooltip\"\n                    actionElement={\n                      this.#serverUrlEL as unknown as HTMLButtonElement\n                    }\n                    blockAlign=\"outside-end\"\n                    inlineAlign={config.tooltipSettings.inlineAlign}\n                    delay={config.tooltipSettings.delay}\n                  >\n                    {this.#_componentLocale.errors.serverUrlInvalid}\n                  </ch-tooltip>\n                )}\n              </div>\n            </section>\n          )}\n\n          {this.#renderFooter()}\n        </main>\n      </Host>\n    );\n  }\n}\n\nexport type ConnectionResultData = {\n  formResult: FormSubmitResult;\n};\n\nexport type ConnectionOption = \"select\" | \"new\";\n\nexport type ServerType = \"legacy\" | \"next\";\n\nexport type ServerAccessLevel = \"public\" | \"private\";\n\nexport type AuthenticationSessionOrigin = {\n  uri: string;\n  name: string;\n};\n\nexport type ConnectedGXServerData = {\n  id: string;\n  serverUrl: string;\n  accessLevel: ServerAccessLevel;\n  masterSessionUsername: string;\n  serverName?: string;\n  gxServerUsername: string;\n  isConnected: boolean;\n};\n\nexport type NewServerConnectionData = {\n  serverUrl: string;\n  serverName: string;\n};\n"],"mappings":"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"}

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

@@ -1 +0,0 @@
-{"version":3,"names":["namePickerCss","CSS_BUNDLES","GxIdeNamePicker","_GxIdeNamePicker_componentLocale","set","this","_GxIdeNamePicker_inputValueEl","_GxIdeNamePicker_handleInputValueChange","event","inputValue","detail","_GxIdeNamePicker_cancelClickHandler","async","cancelCallback","_GxIdeNamePicker_confirmClickHandler","formSubmitResult","createCallback","validatableControls","validateControls","_GxIdeNamePicker_initializeValidatableControls","__classPrivateFieldGet","forEach","validatableControl","id","reference","hasError","message","undefined","_GxIdeNamePicker_evaluateTooltipRender","controlReference","_b","_a","get","_c","h","class","actionElement","blockAlign","config","tooltipSettings","inlineAlign","delay","Map","defaultInputValueChanged","newDefaultInputValue","componentWillLoad","__classPrivateFieldSet","Locale","getComponentStrings","el","defaultInputValue","componentDidLoad","call","render","confirmButtonDisabled","length","Host","model","htmlFor","labels","name","type","placeholder","placeHolders","value","onInput","ref","onClick","buttons","cancel","disabled","confirm"],"sources":["src/components/name-picker/name-picker.scss?tag=gx-ide-name-picker&encapsulation=shadow","src/components/name-picker/name-picker.tsx"],"sourcesContent":[":host {\n  display: grid;\n  block-size: 100%;\n  grid-template-rows: 1fr max-content;\n}\n\n.field-group {\n  grid-auto-rows: max-content;\n}\n\n.main {\n  overflow: auto;\n}\n\n.section {\n  display: contents;\n}\n\n.tooltip {\n  position: absolute;\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from \"@stencil/core\";\n\nimport { MercuryBundles } from \"@genexus/mercury\";\nimport { config } from \"../../common/config\";\nimport {\n  ControlValidation,\n  validateControls\n} from \"../../common/form-validation\";\nimport { Locale } from \"../../common/locale\";\nimport { FormSubmitResult } from \"../../components\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"utils/form\",\n  \"utils/spacing\",\n  \"utils/layout\",\n  \"chameleon/scrollbar\",\n  \"components/button\",\n  \"components/edit\",\n  \"components/tooltip\"\n];\n\n@Component({\n  tag: \"gx-ide-name-picker\",\n  styleUrl: \"name-picker.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/name-picker\"]\n})\nexport class GxIdeNamePicker {\n  /**\n   * The component hard-coded strings translations.\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #componentLocale: any;\n\n  #inputValueEl!: HTMLChEditElement;\n\n  @Element() el: HTMLGxIdeNamePickerElement;\n\n  /**\n   * The input name\n   */\n  @State() inputValue: string;\n\n  @State() validatableControls = new Map<string, ControlValidation>();\n\n  /**\n   * Callback that must be invoked when the 'Cancel' button is pressed.\n   */\n  @Prop() readonly cancelCallback: () => Promise<void>;\n\n  /**\n   * Callback that must be invoked when the 'Create' button is pressed.\n   */\n  @Prop() readonly createCallback: (\n    inputValue: string\n  ) => Promise<FormSubmitResult>;\n\n  /**\n   * This property is used to set the initial values of the input field when the component is loaded.\n   */\n  @Prop() readonly defaultInputValue: string;\n  @Watch(\"defaultInputValue\")\n  defaultInputValueChanged(newDefaultInputValue: string) {\n    this.inputValue = newDefaultInputValue;\n  }\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n    this.defaultInputValueChanged(this.defaultInputValue);\n  }\n\n  componentDidLoad() {\n    this.#initializeValidatableControls();\n  }\n\n  #handleInputValueChange = (event: CustomEvent<string> | InputEvent) => {\n    this.inputValue = event.detail as string;\n  };\n\n  #cancelClickHandler = async () => {\n    this.cancelCallback();\n  };\n\n  #confirmClickHandler = async () => {\n    const formSubmitResult = await this.createCallback(this.inputValue);\n    this.validatableControls = validateControls(\n      formSubmitResult,\n      this.validatableControls\n    );\n  };\n\n  #initializeValidatableControls = () => {\n    // populate validatableControls with the controls that could have errors.\n    const validatableControls: HTMLElement[] = [this.#inputValueEl];\n    validatableControls.forEach(validatableControl => {\n      if (validatableControl.id) {\n        this.validatableControls.set(validatableControl.id, {\n          reference: validatableControl,\n          hasError: false,\n          message: undefined\n        });\n      }\n    });\n  };\n\n  // TODO: evaluate if this should be a global helper function.\n  // It is used on other dialogs as well.\n  #evaluateTooltipRender = (\n    controlReference: HTMLElement\n  ): HTMLChTooltipElement =>\n    this.validatableControls?.get(controlReference?.id)?.hasError &&\n    this.validatableControls.get(controlReference.id)?.message && (\n      <ch-tooltip\n        class=\"tooltip\"\n        actionElement={controlReference as unknown as HTMLButtonElement}\n        blockAlign={config.tooltipSettings.blockAlign}\n        inlineAlign={config.tooltipSettings.inlineAlign}\n        delay={config.tooltipSettings.delay}\n      >\n        {this.validatableControls.get(controlReference.id).message}\n      </ch-tooltip>\n    );\n\n  render() {\n    const confirmButtonDisabled =\n      !this.inputValue || this.inputValue.length === 0;\n\n    return (\n      <Host class=\"widget\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <section class=\"section\">\n          <div class=\"main scrollable field-group spacing-body\">\n            <div class=\"field field-block\">\n              <label class=\"label\" htmlFor=\"input-name\">\n                {this.#componentLocale.labels.name}\n              </label>\n              <ch-edit\n                type=\"text\"\n                id=\"input-name\"\n                class=\"input\"\n                placeholder={this.#componentLocale.placeHolders.name}\n                value={this.inputValue}\n                onInput={this.#handleInputValueChange}\n                ref={(el: HTMLChEditElement) =>\n                  (this.#inputValueEl = el as HTMLChEditElement)\n                }\n              ></ch-edit>\n              {this.#evaluateTooltipRender(this.#inputValueEl)}\n            </div>\n          </div>\n\n          <footer class=\"control-footer-with-border spacing-body\">\n            <div class=\"buttons-spacer\">\n              <button\n                class=\"button-secondary\"\n                onClick={this.#cancelClickHandler}\n              >\n                {this.#componentLocale.buttons.cancel}\n              </button>\n\n              <button\n                class=\"button-primary\"\n                onClick={this.#confirmClickHandler}\n                disabled={confirmButtonDisabled}\n              >\n                {this.#componentLocale.buttons.confirm}\n              </button>\n            </div>\n          </footer>\n        </section>\n      </Host>\n    );\n  }\n}\n"],"mappings":";;;;;;;;AAAA,MAAMA,IAAgB;;;;;;;;;;;;;;;;;ACWtB,MAAMC,IAA8B,EAClC,qBACA,cACA,iBACA,gBACA,uBACA,qBACA,mBACA;;MASWC,IAAe;;;;;;;QAK1BC,EAAAC,IAAAC,WAAA;IAEAC,EAAAF,IAAAC,WAAA;IAyCAE,EAAAH,IAAAC,OAA2BG;MACzBH,KAAKI,aAAaD,EAAME;AAAgB;IAG1CC,EAAAP,IAAAC,OAAsBO;MACpBP,KAAKQ;AAAgB;IAGvBC,EAAAV,IAAAC,OAAuBO;MACrB,MAAMG,UAAyBV,KAAKW,eAAeX,KAAKI;MACxDJ,KAAKY,sBAAsBC,EACzBH,GACAV,KAAKY;AACN;IAGHE,EAAAf,IAAAC,OAAiC;;MAE/B,MAAMY,IAAqC,EAACG,EAAAf,MAAIC,GAAA;MAChDW,EAAoBI,SAAQC;QAC1B,IAAIA,EAAmBC,IAAI;UACzBlB,KAAKY,oBAAoBb,IAAIkB,EAAmBC,IAAI;YAClDC,WAAWF;YACXG,UAAU;YACVC,SAASC;;;;AAGb;;;QAKJC,EAAAxB,IAAAC,OACEwB;;MAEA,SAAAC,KAAAC,IAAA1B,KAAKY,yBAAmB,QAAAc,WAAA,aAAAA,EAAEC,IAAIH,MAAgB,QAAhBA,WAAgB,aAAhBA,EAAkBN,SAAG,QAAAO,WAAA,aAAAA,EAAEL,eACrDQ,IAAA5B,KAAKY,oBAAoBe,IAAIH,EAAiBN,SAAG,QAAAU,WAAA,aAAAA,EAAEP,YACjDQ,EAAA;QACEC,OAAM;QACNC,eAAeP;QACfQ,YAAYC,EAAOC,gBAAgBF;QACnCG,aAAaF,EAAOC,gBAAgBC;QACpCC,OAAOH,EAAOC,gBAAgBE;SAE7BpC,KAAKY,oBAAoBe,IAAIH,EAAiBN,IAAIG;AAEtD;;+BA9E4B,IAAIgB;;;;;EAmBnC,wBAAAC,CAAyBC;IACvBvC,KAAKI,aAAamC;;EAGpB,uBAAMC;IACJC,EAAAzC,MAAIF,SAA0B4C,EAAOC,oBAAoB3C,KAAK4C,KAAG;IACjE5C,KAAKsC,yBAAyBtC,KAAK6C;;EAGrC,gBAAAC;IACE/B,EAAAf,MAAIc,GAAA,KAA+BiC,KAAnC/C;;EAmDF,MAAAgD;IACE,MAAMC,KACHjD,KAAKI,cAAcJ,KAAKI,WAAW8C,WAAW;IAEjD,OACErB,EAACsB,GAAI;MAACrB,OAAM;OACVD,EAAA;MAAUuB,OAAOxD;QACjBiC,EAAA;MAASC,OAAM;OACbD,EAAA;MAAKC,OAAM;OACTD,EAAA;MAAKC,OAAM;OACTD,EAAA;MAAOC,OAAM;MAAQuB,SAAQ;OAC1BtC,EAAAf,MAAIF,GAAA,KAAkBwD,OAAOC,OAEhC1B,EAAA;MACE2B,MAAK;MACLtC,IAAG;MACHY,OAAM;MACN2B,aAAa1C,EAAAf,MAAIF,GAAA,KAAkB4D,aAAaH;MAChDI,OAAO3D,KAAKI;MACZwD,SAAS7C,EAAAf,MAAIE,GAAA;MACb2D,KAAMjB,KACHH,EAAAzC,MAAIC,GAAiB2C,GAAuB;QAGhD7B,EAAAf,MAAIuB,GAAA,KAAuBwB,KAA3B/C,MAA4Be,EAAAf,MAAIC,GAAA,SAIrC4B,EAAA;MAAQC,OAAM;OACZD,EAAA;MAAKC,OAAM;OACTD,EAAA;MACEC,OAAM;MACNgC,SAAS/C,EAAAf,MAAIM,GAAA;OAEZS,EAAAf,MAAIF,GAAA,KAAkBiE,QAAQC,SAGjCnC,EAAA;MACEC,OAAM;MACNgC,SAAS/C,EAAAf,MAAIS,GAAA;MACbwD,UAAUhB;OAETlC,EAAAf,MAAIF,GAAA,KAAkBiE,QAAQG"}