@genexus/genexus-ide-ui 1.0.47 → 1.0.49

package/dist/genexus-ide-ui/{p-1feae6ef.entry.js → p-c4c48a1e.entry.js}

@@ -1,6 +1,8 @@
 import { r as n, c as e, h as t, H as r, g as a } from "./p-49712340.js";
 
-import { g as o } from "./p-1986d34d.js";
+import { g as o } from "./p-6e4208d8.js";
+
+import "./p-ad5caf61.js";
 
 import { L as i } from "./p-311eedf3.js";
 
@@ -300,4 +302,4 @@ d = new WeakMap;
 b.style = l;
 
 export { b as gx_ide_dashboard_home };
-//# sourceMappingURL=p-1feae6ef.entry.js.map
+//# sourceMappingURL=p-c4c48a1e.entry.js.map

package/dist/genexus-ide-ui/{p-1feae6ef.entry.js.map → p-c4c48a1e.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["dashboardHomeCss","mapStatusToIcons","new","modified","conflicted","unmodified","mapStatusToLocale","GxIdeDashboardHome","this","renderedFirstTime","_GxIdeDashboardHome_folderIcon","set","getIconPath","category","name","colorType","evaluateLoader","recentObjects","undefined","loaderEl","container","recentObjectsContainerEl","show","handleKbNameChange","async","updatedTitle","updatedKbName","detail","renameKBCallback","response","then","result","success","kb","editValidation","kbNameEl","handleEnvNameChange","renameEnvironmentCallback","envNameEl","value","environment","handleDescriptionChange","editDescriptionCallback","openObject","id","openObjectCallback","el","validationStatus","validationMessage","errorMessage","renderProjectContent","projectDescription","h","class","innerHTML","enableEditDescription","type","icon","onClick","_componentLocale","edit","recentObjectsHandler","newRecentObjects","componentWillLoad","Locale","getComponentStrings","componentDidLoad","componentDidRender","componentDidRenderFirstTime","emit","componentName","renderFrontEndTitle","frontEnd","length","frontEndLang","frontEndLangs","renderKbDates","created","lastBuild","padding","formatDate","render","Host","enableEditKBName","fluid","onValueChanged","focusType","debounce","ref","version","currentVersion","enableEditEnvironmentName","cardType","cardTitle","_b","_a","map","obj","color","style","backEnd","dataStore","editableTitle","project","title","noPaddingTop","_c","stateIconSrc","__classPrivateFieldGet","stateTitle","emptyState","stateDescription","description","_d","statusLocale","status","statusDescription","background","actionable","typeIcon","italic","modificationDate","loaderTitle","loader"],"sources":["src/components/dashboard-home/dashboard-home.scss?tag=gx-ide-dashboard-home&encapsulation=shadow","src/components/dashboard-home/dashboard-home.tsx"],"sourcesContent":["@import \"../../../node_modules/@genexus/gemini/dist/gemini/globals/mixins.scss\";\n@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n  display: block;\n  height: 100%;\n  overflow: auto;\n  margin: var(--mer-spacing--lg);\n}\n\n// Manage height and overflow\n:host,\n.gx-ide-main-wrapper,\n.grid--basic,\n.project,\n.recent-objects {\n  height: 100%;\n  overflow: auto;\n}\n\n.gx-ide-main-wrapper {\n  container-name: dashboard-main-wrapper;\n  container-type: inline-size;\n}\n\n.kb {\n  grid-area: kb;\n  align-self: center;\n  .version-pill {\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n  .kb-detail {\n    display: flex;\n    flex-direction: column;\n    align-items: start;\n    flex-wrap: wrap;\n    margin-block-start: var(--mer-spacing--md);\n    gap: var(--mer-spacing--md);\n    .display-inline {\n      @include line-clamp;\n      font-style: italic;\n      opacity: 0.5;\n    }\n  }\n}\n\n.environment {\n  grid-area: environment;\n  &__environments {\n    padding-block-end: var(--gx-ide-grid-column-gap);\n    display: flex;\n    flex-direction: row;\n    gap: var(--gx-ide-grid-column-gap);\n    @include gxg-scrollbar;\n    overflow-x: auto;\n    .environment-card {\n      min-width: 180px;\n      flex-grow: 1;\n    }\n    .environment-container {\n      display: flex;\n      flex-direction: column;\n      gap: var(--gx-ide-cards-vertical-spacing);\n    }\n    .environment-item {\n      display: flex;\n      align-items: center;\n      gap: var(--mer-spacing--2xs);\n    }\n  }\n}\n.environment-title {\n  margin-block-end: var(--mer-spacing--xs);\n  display: block;\n}\n\n.project {\n  grid-area: project;\n  .project-buttons {\n    margin-block-start: var(--mer-spacing--md);\n    gap: var(--mer-spacing--md);\n  }\n  .project-description {\n    > *:first-child {\n      margin-block-start: 0;\n    }\n    > *:last-child {\n      margin-block-end: 0;\n    }\n  }\n}\n\n.recent-objects {\n  grid-area: recent-objects;\n  &__container {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    gap: var(--gx-ide-cards-vertical-spacing);\n  }\n  &__object {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--gx-ide-cards-horizontal-spacing);\n    .obj-name {\n      color: var(--gray-06);\n    }\n    .col {\n      display: flex;\n      gap: var(--gx-ide-cards-horizontal-spacing);\n    }\n  }\n  &__empty-state {\n    height: 100%;\n  }\n}\n\n.grid--basic {\n  flex-grow: 1;\n  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));\n  gap: var(--mer-spacing--xl);\n  grid-template-areas:\n    \"kb environment\"\n    \"project recent-objects\";\n  grid-template-rows: auto 1fr;\n}\n@container (width < 768px) {\n  .grid--basic {\n    grid-template-rows: auto auto auto;\n    grid-template-areas:\n      \"kb environment\"\n      \"project project\"\n      \"recent-objects recent-objects\";\n  }\n}\n\ngxg-title-editable {\n  width: 100%;\n}\n\ngx-ide-card {\n  height: 100%;\n}\n\ngxg-ide-loader::part(loader-wrapper) {\n  border: var(--mer-elevation__border-01);\n  border-radius: var(--gxg-card-section_border-radius);\n}\n","/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Element,\n  Event,\n  EventEmitter,\n  Watch\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { getIconPath } from \"@genexus/mercury\";\n/* CUSTOM IMPORTS */\nimport { Locale } from \"../../common/locale\";\nimport { formatDate } from \"../../common/helpers\";\n\nconst mapStatusToIcons: {\n  [key in RecentObjectStatus]: StatusIcons;\n} = {\n  \"new\": \"gx-server/new\",\n  \"modified\": \"patterns-default-associated/modified\",\n  \"conflicted\": \"patterns-default-associated/synchronized\",\n  \"unmodified\": null,\n  \"not-connected\": null\n};\n\nconst mapStatusToLocale: {\n  [key in RecentObjectStatus]: string;\n} = {\n  \"new\": \"new\",\n  \"modified\": \"modified\",\n  \"conflicted\": \"conflicted\",\n  \"unmodified\": \"unmodified\",\n  \"not-connected\": \"notConnected\"\n};\n\n@Component({\n  tag: \"gx-ide-dashboard-home\",\n  styleUrl: \"dashboard-home.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/dashboard-home\"]\n})\nexport class GxIdeDashboardHome {\n  // 1.Own Properties\n\n  /**\n   * The component hard-coded strings translations.\n   */\n  private _componentLocale: any;\n  private renderedFirstTime = false;\n\n  #folderIcon = getIconPath({\n    category: \"system\",\n    name: \"folder\",\n    colorType: \"on-elevation\"\n  });\n\n  // 2.Reference To Elements\n\n  @Element() el: HTMLGxIdeDashboardHomeElement;\n  private loaderEl!: HTMLGxgIdeLoaderElement;\n  private kbNameEl!: HTMLGxgTitleEditableElement;\n  private envNameEl!: HTMLGxgTitleEditableElement;\n  private recentObjectsContainerEl!: HTMLGxgCardElement;\n  /* private projectDescriptionEl!: HTMLGxgFormTextareaElement;*/\n\n  // 3.State\n\n  /**\n   * The editing state for the environment name.\n   */\n  @State() editingEnvName = false;\n\n  /**\n   * The editing state for the project details.\n   */\n  @State() editingProjectDescription = false;\n\n  // 4.Public Property API\n\n  /**\n   * The KB basic properties.\n   */\n  @Prop() readonly kb: KBData;\n\n  /**\n   * This allows the kb to be editable by the user.\n   */\n  @Prop() readonly enableEditKBName: boolean = false;\n\n  /**\n   * Information of the current environment.\n   */\n  @Prop() readonly environment: EnvironmentData;\n\n  /**\n   * This allows the environment name to be editable by the user.\n   */\n  @Prop() readonly enableEditEnvironmentName: boolean = false;\n\n  /**\n   * Project Detail description.\n   */\n  @Prop() readonly projectDescription: string;\n\n  /**\n   * This allows the project description to be modified by the user.\n   */\n  @Prop() readonly enableEditDescription: boolean = false;\n\n  /**\n   * Recently edited objects.\n   */\n  @Prop() readonly recentObjects: recentObjectData[];\n  @Watch(\"recentObjects\")\n  recentObjectsHandler(newRecentObjects: recentObjectData[]) {\n    if (newRecentObjects) {\n      this.loaderEl.show = false;\n    }\n  }\n\n  /**\n   * Callback invoked when user tries to rename the KB.\n   * Receives the new name as a parameter\n   * and returns a promise with the result of the operation.\n   */\n  @Prop() readonly renameKBCallback: (name: string) => Promise<EditResult>;\n\n  /**\n   * Callback invoked when user tries to rename the KB environment.\n   * Receives the new name as a parameter\n   * and returns a promise with the result of the operation.\n   */\n  @Prop() readonly renameEnvironmentCallback: (\n    name: string\n  ) => Promise<EditResult>;\n\n  /**\n   * Callback invoked when user tries to edit the Project Description.\n   * The edition is resolved by the host.\n   */\n  @Prop() readonly editDescriptionCallback: () => Promise<void>;\n\n  /**\n   * Callback invoked when user tries to open one of the listed Recent Objects\n   * Receives the internal ID of the object\n   */\n  @Prop() readonly openObjectCallback: (id: string) => Promise<void>;\n\n  // 5.Events\n\n  /**\n   * @description Gets fired when the component has rendered for the first time.\n   */\n  @Event() componentDidRenderFirstTime: EventEmitter<string>;\n\n  // 6.Component Lifecycle Events\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  componentDidLoad() {\n    this.evaluateLoader();\n  }\n\n  componentDidRender() {\n    if (!this.renderedFirstTime) {\n      this.componentDidRenderFirstTime.emit(\n        this._componentLocale.componentName\n      );\n      this.renderedFirstTime = true;\n    }\n  }\n\n  // 7.Listeners\n\n  // 8.Public Methods API\n\n  // 9.Local Methods\n\n  private evaluateLoader = () => {\n    if (this.recentObjects === undefined) {\n      this.loaderEl.container = this.recentObjectsContainerEl;\n      this.loaderEl.show = true;\n    }\n  };\n\n  // Kb Name\n\n  private handleKbNameChange = async (updatedTitle: CustomEvent<string>) => {\n    const updatedKbName = updatedTitle.detail;\n    if (this.renameKBCallback) {\n      const response = this.renameKBCallback(updatedKbName);\n      response.then((result: EditResult) => {\n        if (result.success) {\n          this.kb.name = updatedKbName;\n        }\n        this.editValidation(result, this.kbNameEl);\n      });\n    }\n  };\n\n  // Environment Name\n  private handleEnvNameChange = async () => {\n    if (this.renameEnvironmentCallback) {\n      const response = this.renameEnvironmentCallback(this.envNameEl.value);\n      response.then((result: EditResult) => {\n        if (result.success) {\n          this.environment.name = this.envNameEl.value;\n        }\n        this.editValidation(result, this.envNameEl);\n      });\n    }\n  };\n\n  private handleDescriptionChange = async () => {\n    if (this.editDescriptionCallback) {\n      await this.editDescriptionCallback();\n    }\n  };\n\n  // Recent Objects\n\n  private openObject = (id: string) => {\n    this.openObjectCallback(id);\n  };\n\n  // Validation\n\n  private editValidation = (\n    result: EditResult,\n    el: HTMLGxgTitleEditableElement\n  ) => {\n    if (!result.success) {\n      el.validationStatus = \"error\";\n      el.validationMessage = result.errorMessage;\n    } else {\n      el.validationStatus = \"indeterminate\";\n      el.validationMessage = \"\";\n    }\n  };\n\n  // 10.Render Function\n\n  private renderProjectContent = (): Element => {\n    return this.projectDescription ? (\n      <div class=\"project-description\" innerHTML={this.projectDescription}>\n        {this.enableEditDescription ? (\n          <gxg-button\n            type=\"secondary-text-icon\"\n            icon=\"gemini-tools/edit\"\n            onClick={this.handleDescriptionChange}\n          >\n            {this._componentLocale.edit}\n          </gxg-button>\n        ) : null}\n      </div>\n    ) : null;\n  };\n\n  private renderFrontEndTitle() {\n    return this.environment.frontEnd.length <= 1\n      ? this._componentLocale.environment.frontEndLang\n      : this._componentLocale.environment.frontEndLangs;\n  }\n\n  private renderKbDates() {\n    return this.kb.created || this.kb.lastBuild ? (\n      <gxg-text class=\"display-inline\" type=\"text-gray\" padding=\"s\">\n        {\n          /* created*/\n          this.kb.created\n            ? `${this._componentLocale.created}: ${formatDate(\n                this.kb.created,\n                \"date-time-short\"\n              )}`\n            : null\n        }\n        {this.kb.created && this.kb.lastBuild ? \" - \" : null}\n        {\n          /* last build date */\n          this.kb.lastBuild\n            ? `${this._componentLocale.lastBuild}: ${formatDate(\n                this.kb.lastBuild,\n                \"date-time-short\"\n              )}`\n            : null\n        }\n      </gxg-text>\n    ) : null;\n  }\n\n  // 11.RENDER() MAIN FUNCTION //\n\n  render() {\n    return (\n      <Host>\n        <div class=\"gx-ide-main-wrapper\">\n          <div class=\"grid grid--basic\">\n            <div class=\"kb gxi-overflow-auto\">\n              <gxg-title-editable\n                value={this.kb.name}\n                disable-edition={!this.enableEditKBName}\n                click-to-edit={true}\n                fluid\n                onValueChanged={this.handleKbNameChange}\n                focusType=\"text\"\n                debounce\n                ref={el => (this.kbNameEl = el as HTMLGxgTitleEditableElement)}\n              ></gxg-title-editable>\n              <div class=\"align-center kb-detail\">\n                <gxg-pill id=\"pill\" type=\"static\" icon=\"objects/procedure\">\n                  {this._componentLocale.version}: {this.kb.currentVersion}\n                </gxg-pill>\n\n                {this.renderKbDates()}\n              </div>\n            </div>\n\n            <div class=\"environment\">\n              <gxg-title-editable\n                class=\"environment-title\"\n                value={this.environment.name}\n                disable-edition={!this.enableEditEnvironmentName}\n                click-to-edit={true}\n                title-type=\"h3\"\n                ref={el => (this.envNameEl = el as HTMLGxgTitleEditableElement)}\n                onValueChanged={this.handleEnvNameChange}\n                focusType=\"text\"\n                debounce\n              ></gxg-title-editable>\n              <div class=\"environment__environments\">\n                <gxg-card\n                  cardType=\"mini\"\n                  class=\"environment-card\"\n                  cardTitle={this.renderFrontEndTitle()}\n                >\n                  <div class=\"environment-container\">\n                    {this.environment?.frontEnd?.map(\n                      (obj: EnvironmentItemData) => (\n                        <div class=\"environment-item\">\n                          <gxg-icon\n                            type={obj.icon}\n                            color=\"onbackground\"\n                            style={{\n                              \"--mer-text__on-surface\": \"var(--gray-05);\"\n                            }}\n                          ></gxg-icon>\n                          {obj.name}\n                        </div>\n                      )\n                    )}\n                  </div>\n                </gxg-card>\n                <gxg-card\n                  cardType=\"mini\"\n                  class=\"environment-card\"\n                  cardTitle={this._componentLocale.environment.backEnd}\n                >\n                  <div class=\"environment-container\">\n                    <div class=\"environment-item\">\n                      <gxg-icon\n                        type={this.environment.backEnd.icon}\n                        color=\"onbackground\"\n                        style={{\n                          \"--mer-text__on-surface\": \"var(--gray-05);\"\n                        }}\n                      ></gxg-icon>\n                      {this.environment.backEnd.name}\n                    </div>\n                  </div>\n                </gxg-card>\n\n                <gxg-card\n                  cardType=\"mini\"\n                  class=\"environment-card\"\n                  cardTitle={this._componentLocale.environment.dataStore}\n                >\n                  <div class=\"environment-container\">\n                    <div class=\"environment-item\">\n                      <gxg-icon\n                        type={this.environment.dataStore.icon}\n                        color=\"onbackground\"\n                        style={{\n                          \"--mer-text__on-surface\": \"var(--gray-05);\"\n                        }}\n                      ></gxg-icon>\n                      {this.environment.dataStore.name}\n                    </div>\n                  </div>\n                </gxg-card>\n              </div>\n            </div>\n\n            <gxg-card\n              editableTitle={false}\n              cardTitle={this._componentLocale.project.title}\n              class=\"project\"\n            >\n              {/* <gxg-tabs height=\"auto\" minWidth=\"100%\">\n                <gxg-tab-bar slot=\"tab-bar-container\" displayBorder>\n                  <gxg-tab-button\n                    slot=\"tab-bar\"\n                    tab-label={this._componentLocale.project.tabs.description}\n                    tab=\"description\"\n                    is-selected\n                  ></gxg-tab-button>\n                  <gxg-tab-button\n                    slot=\"tab-bar\"\n                    tab-label={this._componentLocale.project.tabs.lookFeel}\n                    tab=\"lookFeel\"\n                  ></gxg-tab-button>\n                  <gxg-tab-button\n                    slot=\"tab-bar\"\n                    tab-label={this._componentLocale.project.tabs.architecture}\n                    tab=\"architecture\"\n                  ></gxg-tab-button>\n                </gxg-tab-bar>\n                <gxg-tab noPadding tab=\"description\" flexContainer>\n                  {this.renderProjectContent()}\n                </gxg-tab>\n                <gxg-tab noPadding tab=\"lookFeel\" flexContainer></gxg-tab>\n                <gxg-tab noPadding tab=\"architecture\" flexContainer></gxg-tab>\n              </gxg-tabs> */}\n              {this.renderProjectContent()}\n            </gxg-card>\n\n            <gxg-card\n              editableTitle={false}\n              cardTitle={this._componentLocale.recentObjects.title}\n              class=\"recent-objects\"\n              cardType=\"section\"\n              noPaddingTop\n              ref={el =>\n                (this.recentObjectsContainerEl = el as HTMLGxgCardElement)\n              }\n            >\n              <div class=\"recent-objects__container\">\n                {this.recentObjects?.length === 0 ? (\n                  <gx-ide-empty-state\n                    class=\"recent-objects__empty-state\"\n                    stateIconSrc={this.#folderIcon}\n                    stateTitle={\n                      this._componentLocale.recentObjects.emptyState.title\n                    }\n                    stateDescription={\n                      this._componentLocale.recentObjects.emptyState.description\n                    }\n                  ></gx-ide-empty-state>\n                ) : (\n                  this.recentObjects?.map((obj: recentObjectData) => {\n                    const statusLocale = mapStatusToLocale[obj.status];\n                    const statusDescription =\n                      this._componentLocale.recentObjects.status[statusLocale];\n                    return (\n                      <gxg-card\n                        background=\"gray-01\"\n                        padding=\"m\"\n                        cardType=\"article\"\n                        class=\"recent-objects__card\"\n                        actionable\n                        onClick={() => this.openObject(obj.id)}\n                      >\n                        <div class=\"recent-objects__object\">\n                          <div class=\"col col-left\">\n                            <gxg-icon\n                              type={obj.typeIcon}\n                              color=\"auto\"\n                            ></gxg-icon>\n                            <gxg-text type=\"text-regular\" class=\"obj-name\">\n                              {obj.name}\n                            </gxg-text>\n                          </div>\n                          <div class=\"col col-right\">\n                            <gxg-text italic>\n                              {statusDescription}\n                              {obj.status === \"modified\"\n                                ? formatDate(obj.modificationDate, \"date\")\n                                : null}\n                            </gxg-text>\n                            {obj.status !== \"unmodified\" &&\n                            obj.status !== \"not-connected\" ? (\n                              <gxg-icon\n                                type={mapStatusToIcons[obj.status]}\n                                color=\"auto\"\n                              ></gxg-icon>\n                            ) : null}\n                          </div>\n                        </div>\n                      </gxg-card>\n                    );\n                  })\n                )}\n              </div>\n            </gxg-card>\n          </div>\n        </div>\n        <gxg-ide-loader\n          loaderTitle={this._componentLocale.loader.title}\n          description={this._componentLocale.loader.description}\n          ref={el => (this.loaderEl = el as HTMLGxgIdeLoaderElement)}\n        ></gxg-ide-loader>\n      </Host>\n    );\n  }\n}\n\nexport type KBData = {\n  name: string;\n  currentVersion: string;\n  created: Date;\n  lastBuild?: Date;\n};\n\nexport type EnvironmentData = {\n  name: string;\n  frontEnd: EnvironmentItemData[];\n  backEnd: EnvironmentItemData;\n  dataStore: EnvironmentItemData;\n};\n\nexport type EnvironmentItemData = {\n  icon: string;\n  name: string;\n};\n\nexport type recentObjectData = {\n  id: string;\n  typeIcon: string;\n  name: string;\n  modificationDate: Date;\n  status: RecentObjectStatus;\n};\n\nexport type RecentObjectStatus =\n  | \"new\"\n  | \"modified\"\n  | \"conflicted\"\n  | \"unmodified\"\n  | \"not-connected\";\n\nexport type StatusIcons =\n  // toDo: Add proper icons!!\n  | \"gx-server/new\"\n  | \"patterns-default-associated/modified\"\n  | \"patterns-default-associated/synchronized\"\n  | \"gx-server/delete\";\n\nexport type EditResult = {\n  success: boolean;\n  errorMessage: string;\n};\n"],"mappings":"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"}
+{"version":3,"names":["dashboardHomeCss","mapStatusToIcons","new","modified","conflicted","unmodified","mapStatusToLocale","GxIdeDashboardHome","this","renderedFirstTime","_GxIdeDashboardHome_folderIcon","set","getIconPath","category","name","colorType","evaluateLoader","recentObjects","undefined","loaderEl","container","recentObjectsContainerEl","show","handleKbNameChange","async","updatedTitle","updatedKbName","detail","renameKBCallback","response","then","result","success","kb","editValidation","kbNameEl","handleEnvNameChange","renameEnvironmentCallback","envNameEl","value","environment","handleDescriptionChange","editDescriptionCallback","openObject","id","openObjectCallback","el","validationStatus","validationMessage","errorMessage","renderProjectContent","projectDescription","h","class","innerHTML","enableEditDescription","type","icon","onClick","_componentLocale","edit","recentObjectsHandler","newRecentObjects","componentWillLoad","Locale","getComponentStrings","componentDidLoad","componentDidRender","componentDidRenderFirstTime","emit","componentName","renderFrontEndTitle","frontEnd","length","frontEndLang","frontEndLangs","renderKbDates","created","lastBuild","padding","formatDate","render","Host","enableEditKBName","fluid","onValueChanged","focusType","debounce","ref","version","currentVersion","enableEditEnvironmentName","cardType","cardTitle","_b","_a","map","obj","color","style","backEnd","dataStore","editableTitle","project","title","noPaddingTop","_c","stateIconSrc","__classPrivateFieldGet","stateTitle","emptyState","stateDescription","description","_d","statusLocale","status","statusDescription","background","actionable","typeIcon","italic","modificationDate","loaderTitle","loader"],"sources":["src/components/dashboard-home/dashboard-home.scss?tag=gx-ide-dashboard-home&encapsulation=shadow","src/components/dashboard-home/dashboard-home.tsx"],"sourcesContent":["@import \"../../../node_modules/@genexus/gemini/dist/gemini/globals/mixins.scss\";\n@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n  display: block;\n  height: 100%;\n  overflow: auto;\n  margin: var(--mer-spacing--lg);\n}\n\n// Manage height and overflow\n:host,\n.gx-ide-main-wrapper,\n.grid--basic,\n.project,\n.recent-objects {\n  height: 100%;\n  overflow: auto;\n}\n\n.gx-ide-main-wrapper {\n  container-name: dashboard-main-wrapper;\n  container-type: inline-size;\n}\n\n.kb {\n  grid-area: kb;\n  align-self: center;\n  .version-pill {\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n  .kb-detail {\n    display: flex;\n    flex-direction: column;\n    align-items: start;\n    flex-wrap: wrap;\n    margin-block-start: var(--mer-spacing--md);\n    gap: var(--mer-spacing--md);\n    .display-inline {\n      @include line-clamp;\n      font-style: italic;\n      opacity: 0.5;\n    }\n  }\n}\n\n.environment {\n  grid-area: environment;\n  &__environments {\n    padding-block-end: var(--gx-ide-grid-column-gap);\n    display: flex;\n    flex-direction: row;\n    gap: var(--gx-ide-grid-column-gap);\n    @include gxg-scrollbar;\n    overflow-x: auto;\n    .environment-card {\n      min-width: 180px;\n      flex-grow: 1;\n    }\n    .environment-container {\n      display: flex;\n      flex-direction: column;\n      gap: var(--gx-ide-cards-vertical-spacing);\n    }\n    .environment-item {\n      display: flex;\n      align-items: center;\n      gap: var(--mer-spacing--2xs);\n    }\n  }\n}\n.environment-title {\n  margin-block-end: var(--mer-spacing--xs);\n  display: block;\n}\n\n.project {\n  grid-area: project;\n  .project-buttons {\n    margin-block-start: var(--mer-spacing--md);\n    gap: var(--mer-spacing--md);\n  }\n  .project-description {\n    > *:first-child {\n      margin-block-start: 0;\n    }\n    > *:last-child {\n      margin-block-end: 0;\n    }\n  }\n}\n\n.recent-objects {\n  grid-area: recent-objects;\n  &__container {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    gap: var(--gx-ide-cards-vertical-spacing);\n  }\n  &__object {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--gx-ide-cards-horizontal-spacing);\n    .obj-name {\n      color: var(--gray-06);\n    }\n    .col {\n      display: flex;\n      gap: var(--gx-ide-cards-horizontal-spacing);\n    }\n  }\n  &__empty-state {\n    height: 100%;\n  }\n}\n\n.grid--basic {\n  flex-grow: 1;\n  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));\n  gap: var(--mer-spacing--xl);\n  grid-template-areas:\n    \"kb environment\"\n    \"project recent-objects\";\n  grid-template-rows: auto 1fr;\n}\n@container (width < 768px) {\n  .grid--basic {\n    grid-template-rows: auto auto auto;\n    grid-template-areas:\n      \"kb environment\"\n      \"project project\"\n      \"recent-objects recent-objects\";\n  }\n}\n\ngxg-title-editable {\n  width: 100%;\n}\n\ngx-ide-card {\n  height: 100%;\n}\n\ngxg-ide-loader::part(loader-wrapper) {\n  border: var(--mer-elevation__border-01);\n  border-radius: var(--gxg-card-section_border-radius);\n}\n","/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Element,\n  Event,\n  EventEmitter,\n  Watch\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { getIconPath } from \"@genexus/mercury\";\n/* CUSTOM IMPORTS */\nimport { Locale } from \"../../common/locale\";\nimport { formatDate } from \"../../common/helpers\";\n\nconst mapStatusToIcons: {\n  [key in RecentObjectStatus]: StatusIcons;\n} = {\n  \"new\": \"gx-server/new\",\n  \"modified\": \"patterns-default-associated/modified\",\n  \"conflicted\": \"patterns-default-associated/synchronized\",\n  \"unmodified\": null,\n  \"not-connected\": null\n};\n\nconst mapStatusToLocale: {\n  [key in RecentObjectStatus]: string;\n} = {\n  \"new\": \"new\",\n  \"modified\": \"modified\",\n  \"conflicted\": \"conflicted\",\n  \"unmodified\": \"unmodified\",\n  \"not-connected\": \"notConnected\"\n};\n\n@Component({\n  tag: \"gx-ide-dashboard-home\",\n  styleUrl: \"dashboard-home.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/dashboard-home\"]\n})\nexport class GxIdeDashboardHome {\n  // 1.Own Properties\n\n  /**\n   * The component hard-coded strings translations.\n   */\n  private _componentLocale: any;\n  private renderedFirstTime = false;\n\n  #folderIcon = getIconPath({\n    category: \"system\",\n    name: \"folder\",\n    colorType: \"on-elevation\"\n  });\n\n  // 2.Reference To Elements\n\n  @Element() el: HTMLGxIdeDashboardHomeElement;\n  private loaderEl!: HTMLGxgIdeLoaderElement;\n  private kbNameEl!: HTMLGxgTitleEditableElement;\n  private envNameEl!: HTMLGxgTitleEditableElement;\n  private recentObjectsContainerEl!: HTMLGxgCardElement;\n  /* private projectDescriptionEl!: HTMLGxgFormTextareaElement;*/\n\n  // 3.State\n\n  /**\n   * The editing state for the environment name.\n   */\n  @State() editingEnvName = false;\n\n  /**\n   * The editing state for the project details.\n   */\n  @State() editingProjectDescription = false;\n\n  // 4.Public Property API\n\n  /**\n   * The KB basic properties.\n   */\n  @Prop() readonly kb: KBData;\n\n  /**\n   * This allows the kb to be editable by the user.\n   */\n  @Prop() readonly enableEditKBName: boolean = false;\n\n  /**\n   * Information of the current environment.\n   */\n  @Prop() readonly environment: EnvironmentData;\n\n  /**\n   * This allows the environment name to be editable by the user.\n   */\n  @Prop() readonly enableEditEnvironmentName: boolean = false;\n\n  /**\n   * Project Detail description.\n   */\n  @Prop() readonly projectDescription: string;\n\n  /**\n   * This allows the project description to be modified by the user.\n   */\n  @Prop() readonly enableEditDescription: boolean = false;\n\n  /**\n   * Recently edited objects.\n   */\n  @Prop() readonly recentObjects: recentObjectData[];\n  @Watch(\"recentObjects\")\n  recentObjectsHandler(newRecentObjects: recentObjectData[]) {\n    if (newRecentObjects) {\n      this.loaderEl.show = false;\n    }\n  }\n\n  /**\n   * Callback invoked when user tries to rename the KB.\n   * Receives the new name as a parameter\n   * and returns a promise with the result of the operation.\n   */\n  @Prop() readonly renameKBCallback: (name: string) => Promise<EditResult>;\n\n  /**\n   * Callback invoked when user tries to rename the KB environment.\n   * Receives the new name as a parameter\n   * and returns a promise with the result of the operation.\n   */\n  @Prop() readonly renameEnvironmentCallback: (\n    name: string\n  ) => Promise<EditResult>;\n\n  /**\n   * Callback invoked when user tries to edit the Project Description.\n   * The edition is resolved by the host.\n   */\n  @Prop() readonly editDescriptionCallback: () => Promise<void>;\n\n  /**\n   * Callback invoked when user tries to open one of the listed Recent Objects\n   * Receives the internal ID of the object\n   */\n  @Prop() readonly openObjectCallback: (id: string) => Promise<void>;\n\n  // 5.Events\n\n  /**\n   * @description Gets fired when the component has rendered for the first time.\n   */\n  @Event() componentDidRenderFirstTime: EventEmitter<string>;\n\n  // 6.Component Lifecycle Events\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  componentDidLoad() {\n    this.evaluateLoader();\n  }\n\n  componentDidRender() {\n    if (!this.renderedFirstTime) {\n      this.componentDidRenderFirstTime.emit(\n        this._componentLocale.componentName\n      );\n      this.renderedFirstTime = true;\n    }\n  }\n\n  // 7.Listeners\n\n  // 8.Public Methods API\n\n  // 9.Local Methods\n\n  private evaluateLoader = () => {\n    if (this.recentObjects === undefined) {\n      this.loaderEl.container = this.recentObjectsContainerEl;\n      this.loaderEl.show = true;\n    }\n  };\n\n  // Kb Name\n\n  private handleKbNameChange = async (updatedTitle: CustomEvent<string>) => {\n    const updatedKbName = updatedTitle.detail;\n    if (this.renameKBCallback) {\n      const response = this.renameKBCallback(updatedKbName);\n      response.then((result: EditResult) => {\n        if (result.success) {\n          this.kb.name = updatedKbName;\n        }\n        this.editValidation(result, this.kbNameEl);\n      });\n    }\n  };\n\n  // Environment Name\n  private handleEnvNameChange = async () => {\n    if (this.renameEnvironmentCallback) {\n      const response = this.renameEnvironmentCallback(this.envNameEl.value);\n      response.then((result: EditResult) => {\n        if (result.success) {\n          this.environment.name = this.envNameEl.value;\n        }\n        this.editValidation(result, this.envNameEl);\n      });\n    }\n  };\n\n  private handleDescriptionChange = async () => {\n    if (this.editDescriptionCallback) {\n      await this.editDescriptionCallback();\n    }\n  };\n\n  // Recent Objects\n\n  private openObject = (id: string) => {\n    this.openObjectCallback(id);\n  };\n\n  // Validation\n\n  private editValidation = (\n    result: EditResult,\n    el: HTMLGxgTitleEditableElement\n  ) => {\n    if (!result.success) {\n      el.validationStatus = \"error\";\n      el.validationMessage = result.errorMessage;\n    } else {\n      el.validationStatus = \"indeterminate\";\n      el.validationMessage = \"\";\n    }\n  };\n\n  // 10.Render Function\n\n  private renderProjectContent = (): Element => {\n    return this.projectDescription ? (\n      <div class=\"project-description\" innerHTML={this.projectDescription}>\n        {this.enableEditDescription ? (\n          <gxg-button\n            type=\"secondary-text-icon\"\n            icon=\"gemini-tools/edit\"\n            onClick={this.handleDescriptionChange}\n          >\n            {this._componentLocale.edit}\n          </gxg-button>\n        ) : null}\n      </div>\n    ) : null;\n  };\n\n  private renderFrontEndTitle() {\n    return this.environment.frontEnd.length <= 1\n      ? this._componentLocale.environment.frontEndLang\n      : this._componentLocale.environment.frontEndLangs;\n  }\n\n  private renderKbDates() {\n    return this.kb.created || this.kb.lastBuild ? (\n      <gxg-text class=\"display-inline\" type=\"text-gray\" padding=\"s\">\n        {\n          /* created*/\n          this.kb.created\n            ? `${this._componentLocale.created}: ${formatDate(\n                this.kb.created,\n                \"date-time-short\"\n              )}`\n            : null\n        }\n        {this.kb.created && this.kb.lastBuild ? \" - \" : null}\n        {\n          /* last build date */\n          this.kb.lastBuild\n            ? `${this._componentLocale.lastBuild}: ${formatDate(\n                this.kb.lastBuild,\n                \"date-time-short\"\n              )}`\n            : null\n        }\n      </gxg-text>\n    ) : null;\n  }\n\n  // 11.RENDER() MAIN FUNCTION //\n\n  render() {\n    return (\n      <Host>\n        <div class=\"gx-ide-main-wrapper\">\n          <div class=\"grid grid--basic\">\n            <div class=\"kb gxi-overflow-auto\">\n              <gxg-title-editable\n                value={this.kb.name}\n                disable-edition={!this.enableEditKBName}\n                click-to-edit={true}\n                fluid\n                onValueChanged={this.handleKbNameChange}\n                focusType=\"text\"\n                debounce\n                ref={el => (this.kbNameEl = el as HTMLGxgTitleEditableElement)}\n              ></gxg-title-editable>\n              <div class=\"align-center kb-detail\">\n                <gxg-pill id=\"pill\" type=\"static\" icon=\"objects/procedure\">\n                  {this._componentLocale.version}: {this.kb.currentVersion}\n                </gxg-pill>\n\n                {this.renderKbDates()}\n              </div>\n            </div>\n\n            <div class=\"environment\">\n              <gxg-title-editable\n                class=\"environment-title\"\n                value={this.environment.name}\n                disable-edition={!this.enableEditEnvironmentName}\n                click-to-edit={true}\n                title-type=\"h3\"\n                ref={el => (this.envNameEl = el as HTMLGxgTitleEditableElement)}\n                onValueChanged={this.handleEnvNameChange}\n                focusType=\"text\"\n                debounce\n              ></gxg-title-editable>\n              <div class=\"environment__environments\">\n                <gxg-card\n                  cardType=\"mini\"\n                  class=\"environment-card\"\n                  cardTitle={this.renderFrontEndTitle()}\n                >\n                  <div class=\"environment-container\">\n                    {this.environment?.frontEnd?.map(\n                      (obj: EnvironmentItemData) => (\n                        <div class=\"environment-item\">\n                          <gxg-icon\n                            type={obj.icon}\n                            color=\"onbackground\"\n                            style={{\n                              \"--mer-text__on-surface\": \"var(--gray-05);\"\n                            }}\n                          ></gxg-icon>\n                          {obj.name}\n                        </div>\n                      )\n                    )}\n                  </div>\n                </gxg-card>\n                <gxg-card\n                  cardType=\"mini\"\n                  class=\"environment-card\"\n                  cardTitle={this._componentLocale.environment.backEnd}\n                >\n                  <div class=\"environment-container\">\n                    <div class=\"environment-item\">\n                      <gxg-icon\n                        type={this.environment.backEnd.icon}\n                        color=\"onbackground\"\n                        style={{\n                          \"--mer-text__on-surface\": \"var(--gray-05);\"\n                        }}\n                      ></gxg-icon>\n                      {this.environment.backEnd.name}\n                    </div>\n                  </div>\n                </gxg-card>\n\n                <gxg-card\n                  cardType=\"mini\"\n                  class=\"environment-card\"\n                  cardTitle={this._componentLocale.environment.dataStore}\n                >\n                  <div class=\"environment-container\">\n                    <div class=\"environment-item\">\n                      <gxg-icon\n                        type={this.environment.dataStore.icon}\n                        color=\"onbackground\"\n                        style={{\n                          \"--mer-text__on-surface\": \"var(--gray-05);\"\n                        }}\n                      ></gxg-icon>\n                      {this.environment.dataStore.name}\n                    </div>\n                  </div>\n                </gxg-card>\n              </div>\n            </div>\n\n            <gxg-card\n              editableTitle={false}\n              cardTitle={this._componentLocale.project.title}\n              class=\"project\"\n            >\n              {/* <gxg-tabs height=\"auto\" minWidth=\"100%\">\n                <gxg-tab-bar slot=\"tab-bar-container\" displayBorder>\n                  <gxg-tab-button\n                    slot=\"tab-bar\"\n                    tab-label={this._componentLocale.project.tabs.description}\n                    tab=\"description\"\n                    is-selected\n                  ></gxg-tab-button>\n                  <gxg-tab-button\n                    slot=\"tab-bar\"\n                    tab-label={this._componentLocale.project.tabs.lookFeel}\n                    tab=\"lookFeel\"\n                  ></gxg-tab-button>\n                  <gxg-tab-button\n                    slot=\"tab-bar\"\n                    tab-label={this._componentLocale.project.tabs.architecture}\n                    tab=\"architecture\"\n                  ></gxg-tab-button>\n                </gxg-tab-bar>\n                <gxg-tab noPadding tab=\"description\" flexContainer>\n                  {this.renderProjectContent()}\n                </gxg-tab>\n                <gxg-tab noPadding tab=\"lookFeel\" flexContainer></gxg-tab>\n                <gxg-tab noPadding tab=\"architecture\" flexContainer></gxg-tab>\n              </gxg-tabs> */}\n              {this.renderProjectContent()}\n            </gxg-card>\n\n            <gxg-card\n              editableTitle={false}\n              cardTitle={this._componentLocale.recentObjects.title}\n              class=\"recent-objects\"\n              cardType=\"section\"\n              noPaddingTop\n              ref={el =>\n                (this.recentObjectsContainerEl = el as HTMLGxgCardElement)\n              }\n            >\n              <div class=\"recent-objects__container\">\n                {this.recentObjects?.length === 0 ? (\n                  <gx-ide-empty-state\n                    class=\"recent-objects__empty-state\"\n                    stateIconSrc={this.#folderIcon}\n                    stateTitle={\n                      this._componentLocale.recentObjects.emptyState.title\n                    }\n                    stateDescription={\n                      this._componentLocale.recentObjects.emptyState.description\n                    }\n                  ></gx-ide-empty-state>\n                ) : (\n                  this.recentObjects?.map((obj: recentObjectData) => {\n                    const statusLocale = mapStatusToLocale[obj.status];\n                    const statusDescription =\n                      this._componentLocale.recentObjects.status[statusLocale];\n                    return (\n                      <gxg-card\n                        background=\"gray-01\"\n                        padding=\"m\"\n                        cardType=\"article\"\n                        class=\"recent-objects__card\"\n                        actionable\n                        onClick={() => this.openObject(obj.id)}\n                      >\n                        <div class=\"recent-objects__object\">\n                          <div class=\"col col-left\">\n                            <gxg-icon\n                              type={obj.typeIcon}\n                              color=\"auto\"\n                            ></gxg-icon>\n                            <gxg-text type=\"text-regular\" class=\"obj-name\">\n                              {obj.name}\n                            </gxg-text>\n                          </div>\n                          <div class=\"col col-right\">\n                            <gxg-text italic>\n                              {statusDescription}\n                              {obj.status === \"modified\"\n                                ? formatDate(obj.modificationDate, \"date\")\n                                : null}\n                            </gxg-text>\n                            {obj.status !== \"unmodified\" &&\n                            obj.status !== \"not-connected\" ? (\n                              <gxg-icon\n                                type={mapStatusToIcons[obj.status]}\n                                color=\"auto\"\n                              ></gxg-icon>\n                            ) : null}\n                          </div>\n                        </div>\n                      </gxg-card>\n                    );\n                  })\n                )}\n              </div>\n            </gxg-card>\n          </div>\n        </div>\n        <gxg-ide-loader\n          loaderTitle={this._componentLocale.loader.title}\n          description={this._componentLocale.loader.description}\n          ref={el => (this.loaderEl = el as HTMLGxgIdeLoaderElement)}\n        ></gxg-ide-loader>\n      </Host>\n    );\n  }\n}\n\nexport type KBData = {\n  name: string;\n  currentVersion: string;\n  created: Date;\n  lastBuild?: Date;\n};\n\nexport type EnvironmentData = {\n  name: string;\n  frontEnd: EnvironmentItemData[];\n  backEnd: EnvironmentItemData;\n  dataStore: EnvironmentItemData;\n};\n\nexport type EnvironmentItemData = {\n  icon: string;\n  name: string;\n};\n\nexport type recentObjectData = {\n  id: string;\n  typeIcon: string;\n  name: string;\n  modificationDate: Date;\n  status: RecentObjectStatus;\n};\n\nexport type RecentObjectStatus =\n  | \"new\"\n  | \"modified\"\n  | \"conflicted\"\n  | \"unmodified\"\n  | \"not-connected\";\n\nexport type StatusIcons =\n  // toDo: Add proper icons!!\n  | \"gx-server/new\"\n  | \"patterns-default-associated/modified\"\n  | \"patterns-default-associated/synchronized\"\n  | \"gx-server/delete\";\n\nexport type EditResult = {\n  success: boolean;\n  errorMessage: string;\n};\n"],"mappings":"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"}

package/dist/genexus-ide-ui/{p-e4bbec21.entry.js → p-cfef5956.entry.js}

@@ -4,7 +4,9 @@ import { L as n } from "./p-311eedf3.js";
 
 import { c as r } from "./p-13738332.js";
 
-import { g as o } from "./p-1986d34d.js";
+import { g as o } from "./p-6e4208d8.js";
+
+import "./p-ad5caf61.js";
 
 const l = "@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host{display:grid;grid-template-rows:max-content 1fr max-content;overflow:auto;block-size:100%}.section{display:contents}.header__field-group{display:grid;grid-template-columns:1fr 1fr}.tabular-grid{contain:size}.data ch-tabular-grid-cell:is(:nth-child(2),:nth-child(3),:nth-child(4)){padding-block:var(--grid-cell__padding-block);padding-inline:var(--grid-cell__padding-inline);align-items:start;justify-content:start;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}ch-tabular-grid.empty-result::part(main){overflow:hidden}ch-tabular-grid-rowset-empty{position:relative}";
 
@@ -327,4 +329,4 @@ C = new WeakMap, _ = new WeakMap, E = new WeakMap, T = new WeakMap, z = new Weak
 S.style = l;
 
 export { S as gx_ide_data_selector };
-//# sourceMappingURL=p-e4bbec21.entry.js.map
+//# sourceMappingURL=p-cfef5956.entry.js.map

package/dist/genexus-ide-ui/{p-e4bbec21.entry.js.map → p-cfef5956.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["dataSelectorCss","CSS_BUNDLES","FILTER_ICON","getIconPath","category","name","colorType","GxIdeDataSelector","_GxIdeDataSelector_firstGridObjectId","set","this","_GxIdeDataSelector_loadItemsCallbackJustCalled","_GxIdeDataSelector_componentLocale","_GxIdeDataSelector_animateEmptyState","_GxIdeDataSelector_shortcutsSrc","getAssetPath","_GxIdeDataSelector_filterPatternEl","_GxIdeDataSelector_filterObjectEl","_GxIdeDataSelector_chShortcutsEl","_GxIdeDataSelector_chTabularGridObjectsEl","_GxIdeDataSelector_evaluateFirstRowSelection","__classPrivateFieldGet","selectRow","__classPrivateFieldSet","_GxIdeDataSelector_chGridKeyDownHandler","e","key","_GxIdeDataSelector_confirmCallbackHandler","call","stopPropagation","confirmCallback","selectedObjectsIds","_GxIdeDataSelector_editCallbackHandler","async","result","editCallback","_GxIdeDataSelector_refreshUIWithNewConfiguration","_GxIdeDataSelector_hostKeyPressHandler","_GxIdeDataSelector_objectsSelectionChangedHandler","event","detail","rowsId","_GxIdeDataSelector_newVariableCallbackHandler","response","newVariableCallback","objects","filters","pattern","_a","value","object","_c","_b","id","loading","loadItemsCallback","then","items","length","_GxIdeDataSelector_sortObjectsByName","_GxIdeDataSelector_renderFilter","h","class","htmlFor","filter","autoFocus","part","debounce","config","inputDebounce","onInput","ref","el","defaultModule","defaultValue","selectEntityCallback","selectObjectCallback","onValueChanged","_GxIdeDataSelector_renderObjects","gridIsEmpty","displayLoader","loader","data","rowSelectionMode","selectionType","onKeyDown","onSelectionChanged","undefined","settingable","size","tabularGrid","colSize","maxContent","tableHead","common","dataType","description","map","obj","rowid","onDblClick","src","type","loaderTitle","title","show","isAnimated","stateIconSrc","stateTitle","emptyState","sort","a","b","nameA","toLowerCase","nameB","componentWillLoad","Locale","getComponentStrings","connectedCallback","componentDidLoad","focus","componentDidRender","suspendShortcuts","suspend","validate","isValid","render","newVariableButtonEnabled","editButtonEnabled","okButtonEnabled","Host","onKeyPress","model","disabled","onClick","footer","btnNew","btnEdit","cancelCallback","btnCancel","btnConfirm"],"sources":["src/components/data-selector/data-selector.scss?tag=gx-ide-data-selector&encapsulation=shadow","src/components/data-selector/data-selector.tsx"],"sourcesContent":["@import \"../../../node_modules/@genexus/mercury/dist/mercury.scss\"; // for the tabular-grid-cell-layout mixin\n\n:host {\n  display: grid;\n  grid-template-rows: max-content 1fr max-content;\n  overflow: auto;\n  block-size: 100%;\n}\n\n.section {\n  display: contents;\n}\n\n.header__field-group {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n}\n\n.tabular-grid {\n  contain: size;\n}\n@include tabular-grid-cell-layout(\n  $tabular-grid-selector: \".data\",\n  $tabular-grid-cell-node-type: \"text\",\n  $tabular-grid-cell-apply-ellipsis: true,\n  $tabular-grid-affected-columns-nth-list: (\n    2,\n    3,\n    4\n  )\n);\n\nch-tabular-grid.empty-result::part(main) {\n  // WA to avoid scrollbar flickering when displaying the empty-state message\n  overflow: hidden;\n}\nch-tabular-grid-rowset-empty {\n  // to make the loader be positioned relative to 'ch-tabular-grid-rowset-empty'\n  position: relative;\n}\n","/* eslint-disable @stencil-community/own-props-must-be-private */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  State,\n  Method,\n  getAssetPath\n} from \"@stencil/core\";\n\nimport { Locale } from \"../../common/locale\";\n\nimport { config } from \"../../common/config\";\nimport { EntityData } from \"../../common/types\";\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\nimport { TabularGridSelectionChangedEvent } from \"@genexus/chameleon-controls-library\";\n\n// Best performance bundle\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/button\",\n  \"components/edit\",\n  \"components/tabular-grid\",\n  \"components/icon\",\n  \"utils/form\",\n  \"utils/layout\",\n  \"utils/spacing\",\n  \"chameleon/scrollbar\"\n];\n\nconst FILTER_ICON = getIconPath({\n  category: \"window-tools\",\n  name: \"filter\",\n  colorType: \"on-elevation\"\n});\n\n@Component({\n  tag: \"gx-ide-data-selector\",\n  styleUrl: \"data-selector.scss\",\n  shadow: { delegatesFocus: true },\n  assetsDirs: [\"gx-ide-assets/data-selector\"]\n})\nexport class GxIdeDataSelector {\n  #firstGridObjectId: string; // used to select the first item after \"loadItemsCallback\"\n  #loadItemsCallbackJustCalled: boolean = false; // used to select the first item after \"loadItemsCallback\"\n\n  #componentLocale: any;\n  #animateEmptyState: boolean = false;\n  #shortcutsSrc = getAssetPath(`./gx-ide-assets/data-selector/shortcuts.json`);\n  /* References needed to collect data */\n  #filterPatternEl!: HTMLChEditElement;\n  #filterObjectEl!: HTMLGxIdeEntitySelectorElement;\n  #chShortcutsEl: HTMLChShortcutsElement;\n  #chTabularGridObjectsEl: HTMLChTabularGridElement;\n\n  @Element() el: HTMLGxIdeDataSelectorElement;\n\n  /**\n   * True if loadItemsCallback has been called and has not been resolved yet.\n   */\n  @State() loading: boolean = true;\n\n  /**\n   * The objects rendered in the table\n   */\n  @State() objects: ItemData[] = [];\n\n  /**\n   * The selected objects in the table of objects\n   */\n  @State() selectedObjectsIds: string[] = [];\n\n  /**\n   * Callback invoked when the user wishes to cancel the selection of objects.\n   */\n  @Prop() readonly cancelCallback!: CancelCallback;\n\n  /**\n   * Callback invoked when the user presses the 'OK' button\n   */\n  @Prop() readonly confirmCallback!: ConfirmCallback;\n\n  /**\n   * The default value for the module/folder filter\n   */\n  @Prop() readonly defaultModule: EntityData;\n\n  /**\n   * If true it displays the component title on the header\n   */\n  @Prop() readonly displayTitle = false;\n\n  /**\n   * Callback invoked when user presses the edit button. Receives the first\n   * selected element id as a parameter.\n   */\n  @Prop() readonly editCallback!: EditCallback;\n\n  /**\n   * Callback invoked when the component needs to reload the list of attributes.\n   */\n  @Prop() readonly loadItemsCallback!: LoadItemsCallback;\n\n  /**\n   * If true, it will display a loader when needed.\n   */\n  @Prop() readonly loader = false;\n\n  /**\n   * Callback invoked when the user presses the 'New' button.\n   */\n  @Prop() readonly newVariableCallback!: NewVariableCallback;\n\n  /**\n   * Callback invoked when the action is executed in the Object filter. It returns\n   * the information of the selected object (id and name) or 'undefined' if it was\n   * canceled.\n   */\n  @Prop() readonly selectObjectCallback: SelectObjectCallback;\n\n  /**\n   * Single if multiple object selection is not allowed. Default is multiple\n   */\n  @Prop() readonly selectionType: \"single\" | \"multiple\" = \"multiple\";\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  connectedCallback() {\n    this.#refreshUIWithNewConfiguration();\n  }\n\n  componentDidLoad() {\n    this.#filterPatternEl.focus();\n  }\n\n  componentDidRender() {\n    this.#evaluateFirstRowSelection();\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  /**\n   * Validate necessary data input\n   */\n  @Method()\n  async validate(): Promise<boolean> {\n    const isValid = true;\n    return isValid;\n  }\n\n  /**\n   * After items have been loaded and rendered, the first row should be selected.\n   */\n  #evaluateFirstRowSelection = () => {\n    if (this.#loadItemsCallbackJustCalled) {\n      this.#chTabularGridObjectsEl.selectRow(this.#firstGridObjectId);\n    }\n    this.#loadItemsCallbackJustCalled = false;\n  };\n\n  #chGridKeyDownHandler = (e: KeyboardEvent) => {\n    if (e.key === \"Enter\") {\n      this.#confirmCallbackHandler(e);\n    }\n  };\n\n  #confirmCallbackHandler = (e: MouseEvent | KeyboardEvent): void => {\n    e.stopPropagation();\n    this.confirmCallback(this.selectedObjectsIds);\n  };\n\n  #editCallbackHandler = async (e: MouseEvent): Promise<void> => {\n    e.stopPropagation();\n    if (this.selectedObjectsIds[0]) {\n      const result = await this.editCallback(this.selectedObjectsIds[0]);\n      if (result) {\n        this.#refreshUIWithNewConfiguration();\n      }\n    }\n  };\n\n  #hostKeyPressHandler = (e: KeyboardEvent) => {\n    // TODO : revise why this is necessary\n    // just prevent keypress propagation\n    if (e.key === \"Enter\") {\n      e.stopPropagation();\n    }\n  };\n\n  #objectsSelectionChangedHandler = (\n    event: CustomEvent<TabularGridSelectionChangedEvent>\n  ) => {\n    this.selectedObjectsIds = event.detail.rowsId;\n  };\n\n  #newVariableCallbackHandler = async () => {\n    const response = await this.newVariableCallback();\n    if (response) {\n      this.#refreshUIWithNewConfiguration();\n    }\n  };\n  #refreshUIWithNewConfiguration = (): void => {\n    this.objects = [];\n    const filters: FiltersData = {\n      pattern: this.#filterPatternEl?.value,\n      object: this.#filterObjectEl?.value?.id\n    };\n    this.loading = true;\n    this.loadItemsCallback(filters).then((items: ItemData[]) => {\n      if (items.length) {\n        this.objects = this.#sortObjectsByName(items);\n        this.#firstGridObjectId = this.objects[0].id;\n        this.#loadItemsCallbackJustCalled = true;\n      }\n      this.selectedObjectsIds = [];\n      this.loading = false;\n    });\n  };\n\n  #renderFilter = (): Element[] => {\n    return [\n      <div class=\"header__field-group field-group\">\n        <div class=\"field field-block pattern-field\">\n          <label class=\"label\" htmlFor=\"filter-pattern\">\n            {this.#componentLocale.filter.pattern}\n          </label>\n          <ch-edit\n            autoFocus\n            id=\"filter-pattern\"\n            name=\"filter-pattern\"\n            class=\"input pattern-input\"\n            part=\"filter-pattern\"\n            debounce={config.inputDebounce}\n            onInput={this.#refreshUIWithNewConfiguration}\n            ref={(el: HTMLChEditElement) =>\n              (this.#filterPatternEl = el as HTMLChEditElement)\n            }\n          ></ch-edit>\n        </div>\n        <gx-ide-entity-selector\n          id=\"object-selector\"\n          value={this.defaultModule}\n          defaultValue={this.defaultModule}\n          selectEntityCallback={this.selectObjectCallback}\n          ref={(el: HTMLGxIdeEntitySelectorElement) =>\n            (this.#filterObjectEl = el as HTMLGxIdeEntitySelectorElement)\n          }\n          class=\"entity\"\n          onValueChanged={this.#refreshUIWithNewConfiguration}\n        ></gx-ide-entity-selector>\n      </div>\n    ];\n  };\n\n  #renderObjects = (): Element => {\n    const gridIsEmpty = !this.objects.length;\n    const displayLoader = this.loader && this.loading;\n    if (!gridIsEmpty || displayLoader) {\n      this.#animateEmptyState = true; // improve performance if is first render\n    }\n    return (\n      <ch-tabular-grid\n        class={{\n          \"tabular-grid\": true,\n          \"empty-result\": this.objects.length === 0,\n          \"data\": true\n        }}\n        rowSelectionMode={this.selectionType}\n        onKeyDown={this.#chGridKeyDownHandler}\n        part=\"ch-grid-objects\"\n        onSelectionChanged={\n          this.objects.length ? this.#objectsSelectionChangedHandler : undefined\n        }\n        ref={(el: HTMLChTabularGridElement) =>\n          (this.#chTabularGridObjectsEl = el as HTMLChTabularGridElement)\n        }\n      >\n        <ch-tabular-grid-columnset class=\"tabular-grid-column-set\">\n          <ch-tabular-grid-column\n            column-name-position=\"text\"\n            settingable={false}\n            size={config.tabularGrid.colSize.maxContent}\n            class=\"tabular-grid-column\"\n          ></ch-tabular-grid-column>\n          <ch-tabular-grid-column\n            column-name={this.#componentLocale.tableHead.name}\n            column-name-position=\"text\"\n            settingable={false}\n            size={config.tabularGrid.colSize.common}\n            class=\"tabular-grid-column\"\n          ></ch-tabular-grid-column>\n          <ch-tabular-grid-column\n            column-name={this.#componentLocale.tableHead.dataType}\n            column-name-position=\"text\"\n            settingable={false}\n            size={config.tabularGrid.colSize.common}\n            class=\"tabular-grid-column\"\n          ></ch-tabular-grid-column>\n          <ch-tabular-grid-column\n            column-name={this.#componentLocale.tableHead.description}\n            column-name-position=\"text\"\n            settingable={false}\n            size={config.tabularGrid.colSize.common}\n            class=\"tabular-grid-column\"\n          ></ch-tabular-grid-column>\n        </ch-tabular-grid-columnset>\n\n        {!gridIsEmpty ? (\n          <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n            {this.objects.map((obj: ItemData) => (\n              <ch-tabular-grid-row\n                rowid={obj.id}\n                onDblClick={this.#confirmCallbackHandler}\n                class=\"tabular-grid-row\"\n              >\n                <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                  <ch-image\n                    src={\n                      obj.type === \"attribute\"\n                        ? \"objects/attribute\"\n                        : \"objects-parts/variables\"\n                    }\n                    class=\"icon-md\"\n                  ></ch-image>\n                </ch-tabular-grid-cell>\n                <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                  {obj.name}\n                </ch-tabular-grid-cell>\n                <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                  {obj.dataType}\n                </ch-tabular-grid-cell>\n                <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                  {obj.description}\n                </ch-tabular-grid-cell>\n              </ch-tabular-grid-row>\n            ))}\n          </ch-tabular-grid-rowset>\n        ) : (\n          <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n            <ch-tabular-grid-rowset-empty>\n              {displayLoader ? (\n                <gx-ide-loader\n                  loaderTitle={this.#componentLocale.loader.title}\n                  show\n                ></gx-ide-loader>\n              ) : (\n                <gx-ide-empty-state\n                  isAnimated={this.#animateEmptyState}\n                  stateIconSrc={FILTER_ICON}\n                  stateTitle={this.#componentLocale.emptyState.title}\n                ></gx-ide-empty-state>\n              )}\n            </ch-tabular-grid-rowset-empty>\n          </ch-tabular-grid-rowset>\n        )}\n      </ch-tabular-grid>\n    );\n  };\n\n  #sortObjectsByName = (objects: ItemData[]): ItemData[] =>\n    // TODO (make this a common helper function\n    // and use it in other dialog grids that\n    // require filter by name).\n    objects.sort((a, b) => {\n      const nameA = a.name.toLowerCase(),\n        nameB = b.name.toLowerCase();\n      if (nameA < nameB) {\n        return -1;\n      }\n      if (nameA > nameB) {\n        return 1;\n      }\n      return 0;\n    });\n\n  render() {\n    const newVariableButtonEnabled = !this.loading;\n    const editButtonEnabled = !this.loading && this.selectedObjectsIds.length;\n    const okButtonEnabled = !this.loading;\n\n    return (\n      <Host onKeyPress={this.#hostKeyPressHandler} 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\n        <section class=\"section\">\n          <header class=\"header control-header-with-border spacing-body-block-start spacing-body-inline\">\n            {this.#renderFilter()}\n          </header>\n          {this.#renderObjects()}\n          <footer class=\"footer control-footer-with-border control-footer-space-between spacing-body-inline spacing-body-block-end\">\n            <div class=\"buttons-spacer\">\n              <button\n                // New Variable Button\n                class=\"button-secondary\"\n                disabled={!newVariableButtonEnabled}\n                part=\"button button-new\"\n                type=\"button\"\n                onClick={this.#newVariableCallbackHandler}\n              >\n                {this.#componentLocale.footer.btnNew}\n              </button>\n              <button\n                // Edit Button\n                class=\"button-secondary\"\n                disabled={!editButtonEnabled}\n                part=\"button button-edit\"\n                type=\"button\"\n                onClick={editButtonEnabled && this.#editCallbackHandler}\n              >\n                {this.#componentLocale.footer.btnEdit}\n              </button>\n            </div>\n\n            <div class=\"buttons-spacer\">\n              <button\n                // Cancel Button\n                class=\"button-secondary\"\n                part=\"button button-cancel\"\n                type=\"button\"\n                onClick={this.cancelCallback}\n              >\n                {this.#componentLocale.footer.btnCancel}\n              </button>\n              <button\n                // Confirm Button\n                class=\"button-primary\"\n                part=\"button button-ok\"\n                disabled={!okButtonEnabled}\n                type=\"button\"\n                onClick={okButtonEnabled && this.#confirmCallbackHandler}\n              >\n                {this.#componentLocale.footer.btnConfirm}\n              </button>\n            </div>\n          </footer>\n        </section>\n      </Host>\n    );\n  }\n}\n\nexport type NewVariableCallback = () => Promise<boolean>;\n\nexport type CancelCallback = () => Promise<void>;\n\nexport type SelectObjectCallback = () => Promise<EntityData | undefined>;\n\nexport type EditCallback = (id: string) => Promise<boolean>;\n\nexport type ConfirmCallback = (ids: string[]) => Promise<void>;\n\nexport type LoadItemsCallback = (filters: FiltersData) => Promise<ItemData[]>;\n\nexport type FiltersData = {\n  pattern?: string;\n  object?: string;\n};\n\nexport type ItemData = {\n  type: ItemType;\n  id: string;\n  name: string;\n  dataType: string;\n  description: string;\n};\n\nexport type ItemType = \"variable\" | \"attribute\";\n"],"mappings":"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"}
+{"version":3,"names":["dataSelectorCss","CSS_BUNDLES","FILTER_ICON","getIconPath","category","name","colorType","GxIdeDataSelector","_GxIdeDataSelector_firstGridObjectId","set","this","_GxIdeDataSelector_loadItemsCallbackJustCalled","_GxIdeDataSelector_componentLocale","_GxIdeDataSelector_animateEmptyState","_GxIdeDataSelector_shortcutsSrc","getAssetPath","_GxIdeDataSelector_filterPatternEl","_GxIdeDataSelector_filterObjectEl","_GxIdeDataSelector_chShortcutsEl","_GxIdeDataSelector_chTabularGridObjectsEl","_GxIdeDataSelector_evaluateFirstRowSelection","__classPrivateFieldGet","selectRow","__classPrivateFieldSet","_GxIdeDataSelector_chGridKeyDownHandler","e","key","_GxIdeDataSelector_confirmCallbackHandler","call","stopPropagation","confirmCallback","selectedObjectsIds","_GxIdeDataSelector_editCallbackHandler","async","result","editCallback","_GxIdeDataSelector_refreshUIWithNewConfiguration","_GxIdeDataSelector_hostKeyPressHandler","_GxIdeDataSelector_objectsSelectionChangedHandler","event","detail","rowsId","_GxIdeDataSelector_newVariableCallbackHandler","response","newVariableCallback","objects","filters","pattern","_a","value","object","_c","_b","id","loading","loadItemsCallback","then","items","length","_GxIdeDataSelector_sortObjectsByName","_GxIdeDataSelector_renderFilter","h","class","htmlFor","filter","autoFocus","part","debounce","config","inputDebounce","onInput","ref","el","defaultModule","defaultValue","selectEntityCallback","selectObjectCallback","onValueChanged","_GxIdeDataSelector_renderObjects","gridIsEmpty","displayLoader","loader","data","rowSelectionMode","selectionType","onKeyDown","onSelectionChanged","undefined","settingable","size","tabularGrid","colSize","maxContent","tableHead","common","dataType","description","map","obj","rowid","onDblClick","src","type","loaderTitle","title","show","isAnimated","stateIconSrc","stateTitle","emptyState","sort","a","b","nameA","toLowerCase","nameB","componentWillLoad","Locale","getComponentStrings","connectedCallback","componentDidLoad","focus","componentDidRender","suspendShortcuts","suspend","validate","isValid","render","newVariableButtonEnabled","editButtonEnabled","okButtonEnabled","Host","onKeyPress","model","disabled","onClick","footer","btnNew","btnEdit","cancelCallback","btnCancel","btnConfirm"],"sources":["src/components/data-selector/data-selector.scss?tag=gx-ide-data-selector&encapsulation=shadow","src/components/data-selector/data-selector.tsx"],"sourcesContent":["@import \"../../../node_modules/@genexus/mercury/dist/mercury.scss\"; // for the tabular-grid-cell-layout mixin\n\n:host {\n  display: grid;\n  grid-template-rows: max-content 1fr max-content;\n  overflow: auto;\n  block-size: 100%;\n}\n\n.section {\n  display: contents;\n}\n\n.header__field-group {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n}\n\n.tabular-grid {\n  contain: size;\n}\n@include tabular-grid-cell-layout(\n  $tabular-grid-selector: \".data\",\n  $tabular-grid-cell-node-type: \"text\",\n  $tabular-grid-cell-apply-ellipsis: true,\n  $tabular-grid-affected-columns-nth-list: (\n    2,\n    3,\n    4\n  )\n);\n\nch-tabular-grid.empty-result::part(main) {\n  // WA to avoid scrollbar flickering when displaying the empty-state message\n  overflow: hidden;\n}\nch-tabular-grid-rowset-empty {\n  // to make the loader be positioned relative to 'ch-tabular-grid-rowset-empty'\n  position: relative;\n}\n","/* eslint-disable @stencil-community/own-props-must-be-private */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  State,\n  Method,\n  getAssetPath\n} from \"@stencil/core\";\n\nimport { Locale } from \"../../common/locale\";\n\nimport { config } from \"../../common/config\";\nimport { EntityData } from \"../../common/types\";\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\nimport { TabularGridSelectionChangedEvent } from \"@genexus/chameleon-controls-library\";\n\n// Best performance bundle\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/button\",\n  \"components/edit\",\n  \"components/tabular-grid\",\n  \"components/icon\",\n  \"utils/form\",\n  \"utils/layout\",\n  \"utils/spacing\",\n  \"chameleon/scrollbar\"\n];\n\nconst FILTER_ICON = getIconPath({\n  category: \"window-tools\",\n  name: \"filter\",\n  colorType: \"on-elevation\"\n});\n\n@Component({\n  tag: \"gx-ide-data-selector\",\n  styleUrl: \"data-selector.scss\",\n  shadow: { delegatesFocus: true },\n  assetsDirs: [\"gx-ide-assets/data-selector\"]\n})\nexport class GxIdeDataSelector {\n  #firstGridObjectId: string; // used to select the first item after \"loadItemsCallback\"\n  #loadItemsCallbackJustCalled: boolean = false; // used to select the first item after \"loadItemsCallback\"\n\n  #componentLocale: any;\n  #animateEmptyState: boolean = false;\n  #shortcutsSrc = getAssetPath(`./gx-ide-assets/data-selector/shortcuts.json`);\n  /* References needed to collect data */\n  #filterPatternEl!: HTMLChEditElement;\n  #filterObjectEl!: HTMLGxIdeEntitySelectorElement;\n  #chShortcutsEl: HTMLChShortcutsElement;\n  #chTabularGridObjectsEl: HTMLChTabularGridElement;\n\n  @Element() el: HTMLGxIdeDataSelectorElement;\n\n  /**\n   * True if loadItemsCallback has been called and has not been resolved yet.\n   */\n  @State() loading: boolean = true;\n\n  /**\n   * The objects rendered in the table\n   */\n  @State() objects: ItemData[] = [];\n\n  /**\n   * The selected objects in the table of objects\n   */\n  @State() selectedObjectsIds: string[] = [];\n\n  /**\n   * Callback invoked when the user wishes to cancel the selection of objects.\n   */\n  @Prop() readonly cancelCallback!: CancelCallback;\n\n  /**\n   * Callback invoked when the user presses the 'OK' button\n   */\n  @Prop() readonly confirmCallback!: ConfirmCallback;\n\n  /**\n   * The default value for the module/folder filter\n   */\n  @Prop() readonly defaultModule: EntityData;\n\n  /**\n   * If true it displays the component title on the header\n   */\n  @Prop() readonly displayTitle = false;\n\n  /**\n   * Callback invoked when user presses the edit button. Receives the first\n   * selected element id as a parameter.\n   */\n  @Prop() readonly editCallback!: EditCallback;\n\n  /**\n   * Callback invoked when the component needs to reload the list of attributes.\n   */\n  @Prop() readonly loadItemsCallback!: LoadItemsCallback;\n\n  /**\n   * If true, it will display a loader when needed.\n   */\n  @Prop() readonly loader = false;\n\n  /**\n   * Callback invoked when the user presses the 'New' button.\n   */\n  @Prop() readonly newVariableCallback!: NewVariableCallback;\n\n  /**\n   * Callback invoked when the action is executed in the Object filter. It returns\n   * the information of the selected object (id and name) or 'undefined' if it was\n   * canceled.\n   */\n  @Prop() readonly selectObjectCallback: SelectObjectCallback;\n\n  /**\n   * Single if multiple object selection is not allowed. Default is multiple\n   */\n  @Prop() readonly selectionType: \"single\" | \"multiple\" = \"multiple\";\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  connectedCallback() {\n    this.#refreshUIWithNewConfiguration();\n  }\n\n  componentDidLoad() {\n    this.#filterPatternEl.focus();\n  }\n\n  componentDidRender() {\n    this.#evaluateFirstRowSelection();\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  /**\n   * Validate necessary data input\n   */\n  @Method()\n  async validate(): Promise<boolean> {\n    const isValid = true;\n    return isValid;\n  }\n\n  /**\n   * After items have been loaded and rendered, the first row should be selected.\n   */\n  #evaluateFirstRowSelection = () => {\n    if (this.#loadItemsCallbackJustCalled) {\n      this.#chTabularGridObjectsEl.selectRow(this.#firstGridObjectId);\n    }\n    this.#loadItemsCallbackJustCalled = false;\n  };\n\n  #chGridKeyDownHandler = (e: KeyboardEvent) => {\n    if (e.key === \"Enter\") {\n      this.#confirmCallbackHandler(e);\n    }\n  };\n\n  #confirmCallbackHandler = (e: MouseEvent | KeyboardEvent): void => {\n    e.stopPropagation();\n    this.confirmCallback(this.selectedObjectsIds);\n  };\n\n  #editCallbackHandler = async (e: MouseEvent): Promise<void> => {\n    e.stopPropagation();\n    if (this.selectedObjectsIds[0]) {\n      const result = await this.editCallback(this.selectedObjectsIds[0]);\n      if (result) {\n        this.#refreshUIWithNewConfiguration();\n      }\n    }\n  };\n\n  #hostKeyPressHandler = (e: KeyboardEvent) => {\n    // TODO : revise why this is necessary\n    // just prevent keypress propagation\n    if (e.key === \"Enter\") {\n      e.stopPropagation();\n    }\n  };\n\n  #objectsSelectionChangedHandler = (\n    event: CustomEvent<TabularGridSelectionChangedEvent>\n  ) => {\n    this.selectedObjectsIds = event.detail.rowsId;\n  };\n\n  #newVariableCallbackHandler = async () => {\n    const response = await this.newVariableCallback();\n    if (response) {\n      this.#refreshUIWithNewConfiguration();\n    }\n  };\n  #refreshUIWithNewConfiguration = (): void => {\n    this.objects = [];\n    const filters: FiltersData = {\n      pattern: this.#filterPatternEl?.value,\n      object: this.#filterObjectEl?.value?.id\n    };\n    this.loading = true;\n    this.loadItemsCallback(filters).then((items: ItemData[]) => {\n      if (items.length) {\n        this.objects = this.#sortObjectsByName(items);\n        this.#firstGridObjectId = this.objects[0].id;\n        this.#loadItemsCallbackJustCalled = true;\n      }\n      this.selectedObjectsIds = [];\n      this.loading = false;\n    });\n  };\n\n  #renderFilter = (): Element[] => {\n    return [\n      <div class=\"header__field-group field-group\">\n        <div class=\"field field-block pattern-field\">\n          <label class=\"label\" htmlFor=\"filter-pattern\">\n            {this.#componentLocale.filter.pattern}\n          </label>\n          <ch-edit\n            autoFocus\n            id=\"filter-pattern\"\n            name=\"filter-pattern\"\n            class=\"input pattern-input\"\n            part=\"filter-pattern\"\n            debounce={config.inputDebounce}\n            onInput={this.#refreshUIWithNewConfiguration}\n            ref={(el: HTMLChEditElement) =>\n              (this.#filterPatternEl = el as HTMLChEditElement)\n            }\n          ></ch-edit>\n        </div>\n        <gx-ide-entity-selector\n          id=\"object-selector\"\n          value={this.defaultModule}\n          defaultValue={this.defaultModule}\n          selectEntityCallback={this.selectObjectCallback}\n          ref={(el: HTMLGxIdeEntitySelectorElement) =>\n            (this.#filterObjectEl = el as HTMLGxIdeEntitySelectorElement)\n          }\n          class=\"entity\"\n          onValueChanged={this.#refreshUIWithNewConfiguration}\n        ></gx-ide-entity-selector>\n      </div>\n    ];\n  };\n\n  #renderObjects = (): Element => {\n    const gridIsEmpty = !this.objects.length;\n    const displayLoader = this.loader && this.loading;\n    if (!gridIsEmpty || displayLoader) {\n      this.#animateEmptyState = true; // improve performance if is first render\n    }\n    return (\n      <ch-tabular-grid\n        class={{\n          \"tabular-grid\": true,\n          \"empty-result\": this.objects.length === 0,\n          \"data\": true\n        }}\n        rowSelectionMode={this.selectionType}\n        onKeyDown={this.#chGridKeyDownHandler}\n        part=\"ch-grid-objects\"\n        onSelectionChanged={\n          this.objects.length ? this.#objectsSelectionChangedHandler : undefined\n        }\n        ref={(el: HTMLChTabularGridElement) =>\n          (this.#chTabularGridObjectsEl = el as HTMLChTabularGridElement)\n        }\n      >\n        <ch-tabular-grid-columnset class=\"tabular-grid-column-set\">\n          <ch-tabular-grid-column\n            column-name-position=\"text\"\n            settingable={false}\n            size={config.tabularGrid.colSize.maxContent}\n            class=\"tabular-grid-column\"\n          ></ch-tabular-grid-column>\n          <ch-tabular-grid-column\n            column-name={this.#componentLocale.tableHead.name}\n            column-name-position=\"text\"\n            settingable={false}\n            size={config.tabularGrid.colSize.common}\n            class=\"tabular-grid-column\"\n          ></ch-tabular-grid-column>\n          <ch-tabular-grid-column\n            column-name={this.#componentLocale.tableHead.dataType}\n            column-name-position=\"text\"\n            settingable={false}\n            size={config.tabularGrid.colSize.common}\n            class=\"tabular-grid-column\"\n          ></ch-tabular-grid-column>\n          <ch-tabular-grid-column\n            column-name={this.#componentLocale.tableHead.description}\n            column-name-position=\"text\"\n            settingable={false}\n            size={config.tabularGrid.colSize.common}\n            class=\"tabular-grid-column\"\n          ></ch-tabular-grid-column>\n        </ch-tabular-grid-columnset>\n\n        {!gridIsEmpty ? (\n          <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n            {this.objects.map((obj: ItemData) => (\n              <ch-tabular-grid-row\n                rowid={obj.id}\n                onDblClick={this.#confirmCallbackHandler}\n                class=\"tabular-grid-row\"\n              >\n                <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                  <ch-image\n                    src={\n                      obj.type === \"attribute\"\n                        ? \"objects/attribute\"\n                        : \"objects-parts/variables\"\n                    }\n                    class=\"icon-md\"\n                  ></ch-image>\n                </ch-tabular-grid-cell>\n                <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                  {obj.name}\n                </ch-tabular-grid-cell>\n                <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                  {obj.dataType}\n                </ch-tabular-grid-cell>\n                <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n                  {obj.description}\n                </ch-tabular-grid-cell>\n              </ch-tabular-grid-row>\n            ))}\n          </ch-tabular-grid-rowset>\n        ) : (\n          <ch-tabular-grid-rowset class=\"tabular-grid-rowset\">\n            <ch-tabular-grid-rowset-empty>\n              {displayLoader ? (\n                <gx-ide-loader\n                  loaderTitle={this.#componentLocale.loader.title}\n                  show\n                ></gx-ide-loader>\n              ) : (\n                <gx-ide-empty-state\n                  isAnimated={this.#animateEmptyState}\n                  stateIconSrc={FILTER_ICON}\n                  stateTitle={this.#componentLocale.emptyState.title}\n                ></gx-ide-empty-state>\n              )}\n            </ch-tabular-grid-rowset-empty>\n          </ch-tabular-grid-rowset>\n        )}\n      </ch-tabular-grid>\n    );\n  };\n\n  #sortObjectsByName = (objects: ItemData[]): ItemData[] =>\n    // TODO (make this a common helper function\n    // and use it in other dialog grids that\n    // require filter by name).\n    objects.sort((a, b) => {\n      const nameA = a.name.toLowerCase(),\n        nameB = b.name.toLowerCase();\n      if (nameA < nameB) {\n        return -1;\n      }\n      if (nameA > nameB) {\n        return 1;\n      }\n      return 0;\n    });\n\n  render() {\n    const newVariableButtonEnabled = !this.loading;\n    const editButtonEnabled = !this.loading && this.selectedObjectsIds.length;\n    const okButtonEnabled = !this.loading;\n\n    return (\n      <Host onKeyPress={this.#hostKeyPressHandler} 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\n        <section class=\"section\">\n          <header class=\"header control-header-with-border spacing-body-block-start spacing-body-inline\">\n            {this.#renderFilter()}\n          </header>\n          {this.#renderObjects()}\n          <footer class=\"footer control-footer-with-border control-footer-space-between spacing-body-inline spacing-body-block-end\">\n            <div class=\"buttons-spacer\">\n              <button\n                // New Variable Button\n                class=\"button-secondary\"\n                disabled={!newVariableButtonEnabled}\n                part=\"button button-new\"\n                type=\"button\"\n                onClick={this.#newVariableCallbackHandler}\n              >\n                {this.#componentLocale.footer.btnNew}\n              </button>\n              <button\n                // Edit Button\n                class=\"button-secondary\"\n                disabled={!editButtonEnabled}\n                part=\"button button-edit\"\n                type=\"button\"\n                onClick={editButtonEnabled && this.#editCallbackHandler}\n              >\n                {this.#componentLocale.footer.btnEdit}\n              </button>\n            </div>\n\n            <div class=\"buttons-spacer\">\n              <button\n                // Cancel Button\n                class=\"button-secondary\"\n                part=\"button button-cancel\"\n                type=\"button\"\n                onClick={this.cancelCallback}\n              >\n                {this.#componentLocale.footer.btnCancel}\n              </button>\n              <button\n                // Confirm Button\n                class=\"button-primary\"\n                part=\"button button-ok\"\n                disabled={!okButtonEnabled}\n                type=\"button\"\n                onClick={okButtonEnabled && this.#confirmCallbackHandler}\n              >\n                {this.#componentLocale.footer.btnConfirm}\n              </button>\n            </div>\n          </footer>\n        </section>\n      </Host>\n    );\n  }\n}\n\nexport type NewVariableCallback = () => Promise<boolean>;\n\nexport type CancelCallback = () => Promise<void>;\n\nexport type SelectObjectCallback = () => Promise<EntityData | undefined>;\n\nexport type EditCallback = (id: string) => Promise<boolean>;\n\nexport type ConfirmCallback = (ids: string[]) => Promise<void>;\n\nexport type LoadItemsCallback = (filters: FiltersData) => Promise<ItemData[]>;\n\nexport type FiltersData = {\n  pattern?: string;\n  object?: string;\n};\n\nexport type ItemData = {\n  type: ItemType;\n  id: string;\n  name: string;\n  dataType: string;\n  description: string;\n};\n\nexport type ItemType = \"variable\" | \"attribute\";\n"],"mappings":"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"}

package/dist/genexus-ide-ui/{p-92c51f3e.entry.js → p-e14affde.entry.js}

@@ -1,6 +1,8 @@
 import { r as t, c as e, h as i, H as o, g as s } from "./p-49712340.js";
 
-import { g as r } from "./p-1986d34d.js";
+import { g as r } from "./p-6e4208d8.js";
+
+import "./p-ad5caf61.js";
 
 import { L as n } from "./p-311eedf3.js";
 
@@ -165,4 +167,4 @@ b = new WeakMap;
 _.style = a;
 
 export { _ as gx_ide_entity_selector };
-//# sourceMappingURL=p-92c51f3e.entry.js.map
+//# sourceMappingURL=p-e14affde.entry.js.map

package/dist/genexus-ide-ui/{p-92c51f3e.entry.js.map → p-e14affde.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["entitySelectorCss","CSS_BUNDLES","SELECT_DEFAULT_ICON","getIconPath","category","name","colorType","CLEAR_ICON","GxIdeEntitySelector","_GxIdeEntitySelector_componentLocale","set","this","_GxIdeEntitySelector_btnClearClickHandler","value","defaultValue","iconSrc","_a","_GxIdeEntitySelector_btnSelectClickHandler","selectEntityCallback","then","result","_GxIdeEntitySelector_buttonFocusHandler","e","type","buttonHasFocus","_GxIdeEntitySelector_renderControl","h","part","class","accessibleName","labelPosition","__classPrivateFieldGet","entitySelectorInputAccessibleName","disabled","entitySelectorNameAttribute","startImgSrc","readonly","_b","id","clearButtonLabel","title","onClick","onFocus","undefined","onBlur","src","selectButtonLabel","_GxIdeEntitySelector_updateIconSrc","valueChangedHandler","valueChanged","emit","call","componentWillLoad","__classPrivateFieldSet","Locale","getComponentStrings","el","connectedCallback","render","Host","model","field","htmlFor","labelCaption"],"sources":["src/components/_helpers/entity-selector/entity-selector.scss?tag=gx-ide-entity-selector&encapsulation=shadow","src/components/_helpers/entity-selector/entity-selector.tsx"],"sourcesContent":["/*wrapper*/\n.wrapper {\n  display: grid;\n  grid-template-columns: 1fr max-content max-content;\n  gap: var(--mer-spacing--xs);\n  border-radius: var(--control__border-radius);\n  border: var(--control__border-width) var(--control__border-style)\n    var(--control__border-color);\n  padding: var(--control__padding-block) var(--control__padding-inline);\n\n  &:hover {\n    --control__border-color: var(--control__border-color--hover);\n  }\n  &:focus {\n  }\n}\n/*input*/\n.input {\n  --control__padding-block: 0;\n  --control__padding-inline: 0;\n  // Remove control border. We want to simulate a input that includes two buttons at the end.\n  --control__border-width: 0;\n  --focus__outline-width: 0;\n}\n:host(:focus-within) {\n  .wrapper {\n    --control__border-color: var(--focus__outline-color);\n  }\n}\n:host(.entity-selector--button-has-focus) {\n  .wrapper {\n    outline: none;\n  }\n}\n\n:host([disabled]) {\n  pointer-events: none;\n  .wrapper {\n    background-color: var(--control__background-color--disabled);\n    border-color: var(--control__border-color--disabled);\n  }\n}\n/*custom button icon*/\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  State,\n  Event,\n  EventEmitter,\n  Watch\n} from \"@stencil/core\";\n\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n\nimport { Locale } from \"../../../common/locale\";\nimport { LabelPosition } from \"../../../common/types\";\nimport { EntityData } from \"../../../common/types\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/edit\",\n  \"components/button\",\n  \"components/icon\",\n  \"utils/form\"\n];\nconst SELECT_DEFAULT_ICON = getIconPath({\n  category: \"gemini-tools\",\n  name: \"show-more-horizontal\",\n  colorType: \"primary\"\n});\nconst CLEAR_ICON = getIconPath({\n  category: \"gemini-tools\",\n  name: \"reset\",\n  colorType: \"primary\"\n});\n\n@Component({\n  tag: \"gx-ide-entity-selector\",\n  styleUrl: \"entity-selector.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/entity-selector\"]\n})\nexport class GxIdeEntitySelector {\n  #componentLocale: any;\n\n  @Element() el: HTMLGxIdeEntitySelectorElement;\n\n  /**\n   * Adds/removes a CSS class on the host. It removes focus-within styles when\n   * focus is on a button.\n   */\n  @State() buttonHasFocus = false;\n\n  @State() iconSrc: string = null;\n\n  /**\n   * Default value for the component. Used when the 'X' button is pressed.\n   */\n  @Prop() readonly defaultValue?: EntityData | null | undefined;\n\n  /**\n   * This attribute lets you specify if the element is disabled.\n   */\n  @Prop({ reflect: true }) readonly disabled: boolean = false;\n\n  /**\n   * The label caption. Only visible if \"labelPosition\" is not \"none\".\n   * I no \"labelCaption\" is provided, a generic caption \"Select Entity\" will be provided\n   */\n  @Prop() readonly labelCaption?: string;\n\n  /**\n   * The label position\n   */\n  @Prop({ reflect: true }) readonly labelPosition?: LabelPosition =\n    \"block-start\";\n\n  /**\n   * This property specifies the `name` of the control when used in a form.\n   */\n  @Prop({ reflect: true }) readonly name?: string;\n\n  /**\n   * Callback invoked when the action button is pressed. Returns the new value.\n   */\n  @Prop() readonly selectEntityCallback!: () => Promise<EntityData> | null;\n\n  /**\n   * Value currently assigned.\n   */\n  @Prop({ mutable: true }) value: EntityData | null | undefined;\n  @Watch(\"value\")\n  valueChangedHandler() {\n    this.valueChanged.emit(this.value);\n    this.#updateIconSrc();\n  }\n\n  /**\n   * Emits the input value every time it changes\n   */\n  @Event() valueChanged: EventEmitter<EntityData>;\n\n  // 6.Component Lifecycle Events\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  connectedCallback() {\n    this.#updateIconSrc();\n  }\n\n  #btnClearClickHandler = () => {\n    this.value = this.defaultValue;\n    this.iconSrc = this.defaultValue?.iconSrc;\n  };\n\n  #btnSelectClickHandler = () => {\n    this.selectEntityCallback().then(result => {\n      if (result) {\n        this.value = result;\n      }\n    });\n  };\n\n  #buttonFocusHandler = (e: FocusEvent) => {\n    if (e.type === \"focus\") {\n      this.buttonHasFocus = true;\n    } else if (e.type === \"blur\") {\n      this.buttonHasFocus = false;\n    }\n  };\n\n  #renderControl = (): HTMLDivElement => {\n    return (\n      <div part=\"wrapper\" class=\"wrapper\">\n        <ch-edit\n          accessibleName={\n            this.labelPosition === \"none\" &&\n            this.#componentLocale.entitySelectorInputAccessibleName\n          }\n          class=\"input\"\n          disabled={this.disabled}\n          name={this.name || this.#componentLocale.entitySelectorNameAttribute}\n          startImgSrc={this.iconSrc}\n          readonly\n          value={this.value?.name || this.defaultValue?.name}\n          id=\"entity-input\"\n        ></ch-edit>\n\n        <button\n          part=\"button-clear\"\n          class=\"icon-button\"\n          aria-label={this.#componentLocale.clearButtonLabel}\n          title={this.#componentLocale.clearButtonLabel}\n          type=\"button\"\n          disabled={this.disabled}\n          onClick={this.#btnClearClickHandler}\n          onFocus={this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n          onBlur={!this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n        >\n          <ch-image\n            class=\"icon-md\"\n            src={CLEAR_ICON}\n            disabled={this.disabled}\n          ></ch-image>\n        </button>\n\n        <button\n          class=\"icon-button\"\n          aria-label={this.#componentLocale.selectButtonLabel}\n          title={this.#componentLocale.selectButtonLabel}\n          type=\"button\"\n          disabled={!this.selectEntityCallback || this.disabled}\n          onClick={this.#btnSelectClickHandler}\n          onBlur={!this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n          onFocus={this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n        >\n          <ch-image\n            class=\"icon-md\"\n            src={SELECT_DEFAULT_ICON}\n            disabled={this.disabled}\n          ></ch-image>\n        </button>\n      </div>\n    );\n  };\n\n  #updateIconSrc = () => {\n    if (this.value && this.value.iconSrc) {\n      this.iconSrc = this.value.iconSrc;\n    }\n  };\n\n  render() {\n    return (\n      <Host\n        class={{\n          \"entity-selector--button-has-focus\": this.buttonHasFocus\n        }}\n      >\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        {this.labelPosition !== \"none\" ? (\n          <div\n            class={{\n              \"field\": true,\n              \"field-block\": this.labelPosition === \"block-start\",\n              \"field-inline\": this.labelPosition === \"inline-start\"\n            }}\n          >\n            <label class=\"label\" htmlFor=\"entity-input\">\n              {this.labelCaption ||\n                this.#componentLocale.entitySelectorInputAccessibleName}\n            </label>\n            {this.#renderControl()}\n          </div>\n        ) : (\n          this.#renderControl()\n        )}\n      </Host>\n    );\n  }\n}\n\nexport type EntitySelectorLabels = {\n  buttonClearLabel: string;\n  buttonSelectLabel: string;\n};\n"],"mappings":"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"}
+{"version":3,"names":["entitySelectorCss","CSS_BUNDLES","SELECT_DEFAULT_ICON","getIconPath","category","name","colorType","CLEAR_ICON","GxIdeEntitySelector","_GxIdeEntitySelector_componentLocale","set","this","_GxIdeEntitySelector_btnClearClickHandler","value","defaultValue","iconSrc","_a","_GxIdeEntitySelector_btnSelectClickHandler","selectEntityCallback","then","result","_GxIdeEntitySelector_buttonFocusHandler","e","type","buttonHasFocus","_GxIdeEntitySelector_renderControl","h","part","class","accessibleName","labelPosition","__classPrivateFieldGet","entitySelectorInputAccessibleName","disabled","entitySelectorNameAttribute","startImgSrc","readonly","_b","id","clearButtonLabel","title","onClick","onFocus","undefined","onBlur","src","selectButtonLabel","_GxIdeEntitySelector_updateIconSrc","valueChangedHandler","valueChanged","emit","call","componentWillLoad","__classPrivateFieldSet","Locale","getComponentStrings","el","connectedCallback","render","Host","model","field","htmlFor","labelCaption"],"sources":["src/components/_helpers/entity-selector/entity-selector.scss?tag=gx-ide-entity-selector&encapsulation=shadow","src/components/_helpers/entity-selector/entity-selector.tsx"],"sourcesContent":["/*wrapper*/\n.wrapper {\n  display: grid;\n  grid-template-columns: 1fr max-content max-content;\n  gap: var(--mer-spacing--xs);\n  border-radius: var(--control__border-radius);\n  border: var(--control__border-width) var(--control__border-style)\n    var(--control__border-color);\n  padding: var(--control__padding-block) var(--control__padding-inline);\n\n  &:hover {\n    --control__border-color: var(--control__border-color--hover);\n  }\n  &:focus {\n  }\n}\n/*input*/\n.input {\n  --control__padding-block: 0;\n  --control__padding-inline: 0;\n  // Remove control border. We want to simulate a input that includes two buttons at the end.\n  --control__border-width: 0;\n  --focus__outline-width: 0;\n}\n:host(:focus-within) {\n  .wrapper {\n    --control__border-color: var(--focus__outline-color);\n  }\n}\n:host(.entity-selector--button-has-focus) {\n  .wrapper {\n    outline: none;\n  }\n}\n\n:host([disabled]) {\n  pointer-events: none;\n  .wrapper {\n    background-color: var(--control__background-color--disabled);\n    border-color: var(--control__border-color--disabled);\n  }\n}\n/*custom button icon*/\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  State,\n  Event,\n  EventEmitter,\n  Watch\n} from \"@stencil/core\";\n\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n\nimport { Locale } from \"../../../common/locale\";\nimport { LabelPosition } from \"../../../common/types\";\nimport { EntityData } from \"../../../common/types\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/edit\",\n  \"components/button\",\n  \"components/icon\",\n  \"utils/form\"\n];\nconst SELECT_DEFAULT_ICON = getIconPath({\n  category: \"gemini-tools\",\n  name: \"show-more-horizontal\",\n  colorType: \"primary\"\n});\nconst CLEAR_ICON = getIconPath({\n  category: \"gemini-tools\",\n  name: \"reset\",\n  colorType: \"primary\"\n});\n\n@Component({\n  tag: \"gx-ide-entity-selector\",\n  styleUrl: \"entity-selector.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/entity-selector\"]\n})\nexport class GxIdeEntitySelector {\n  #componentLocale: any;\n\n  @Element() el: HTMLGxIdeEntitySelectorElement;\n\n  /**\n   * Adds/removes a CSS class on the host. It removes focus-within styles when\n   * focus is on a button.\n   */\n  @State() buttonHasFocus = false;\n\n  @State() iconSrc: string = null;\n\n  /**\n   * Default value for the component. Used when the 'X' button is pressed.\n   */\n  @Prop() readonly defaultValue?: EntityData | null | undefined;\n\n  /**\n   * This attribute lets you specify if the element is disabled.\n   */\n  @Prop({ reflect: true }) readonly disabled: boolean = false;\n\n  /**\n   * The label caption. Only visible if \"labelPosition\" is not \"none\".\n   * I no \"labelCaption\" is provided, a generic caption \"Select Entity\" will be provided\n   */\n  @Prop() readonly labelCaption?: string;\n\n  /**\n   * The label position\n   */\n  @Prop({ reflect: true }) readonly labelPosition?: LabelPosition =\n    \"block-start\";\n\n  /**\n   * This property specifies the `name` of the control when used in a form.\n   */\n  @Prop({ reflect: true }) readonly name?: string;\n\n  /**\n   * Callback invoked when the action button is pressed. Returns the new value.\n   */\n  @Prop() readonly selectEntityCallback!: () => Promise<EntityData> | null;\n\n  /**\n   * Value currently assigned.\n   */\n  @Prop({ mutable: true }) value: EntityData | null | undefined;\n  @Watch(\"value\")\n  valueChangedHandler() {\n    this.valueChanged.emit(this.value);\n    this.#updateIconSrc();\n  }\n\n  /**\n   * Emits the input value every time it changes\n   */\n  @Event() valueChanged: EventEmitter<EntityData>;\n\n  // 6.Component Lifecycle Events\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  connectedCallback() {\n    this.#updateIconSrc();\n  }\n\n  #btnClearClickHandler = () => {\n    this.value = this.defaultValue;\n    this.iconSrc = this.defaultValue?.iconSrc;\n  };\n\n  #btnSelectClickHandler = () => {\n    this.selectEntityCallback().then(result => {\n      if (result) {\n        this.value = result;\n      }\n    });\n  };\n\n  #buttonFocusHandler = (e: FocusEvent) => {\n    if (e.type === \"focus\") {\n      this.buttonHasFocus = true;\n    } else if (e.type === \"blur\") {\n      this.buttonHasFocus = false;\n    }\n  };\n\n  #renderControl = (): HTMLDivElement => {\n    return (\n      <div part=\"wrapper\" class=\"wrapper\">\n        <ch-edit\n          accessibleName={\n            this.labelPosition === \"none\" &&\n            this.#componentLocale.entitySelectorInputAccessibleName\n          }\n          class=\"input\"\n          disabled={this.disabled}\n          name={this.name || this.#componentLocale.entitySelectorNameAttribute}\n          startImgSrc={this.iconSrc}\n          readonly\n          value={this.value?.name || this.defaultValue?.name}\n          id=\"entity-input\"\n        ></ch-edit>\n\n        <button\n          part=\"button-clear\"\n          class=\"icon-button\"\n          aria-label={this.#componentLocale.clearButtonLabel}\n          title={this.#componentLocale.clearButtonLabel}\n          type=\"button\"\n          disabled={this.disabled}\n          onClick={this.#btnClearClickHandler}\n          onFocus={this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n          onBlur={!this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n        >\n          <ch-image\n            class=\"icon-md\"\n            src={CLEAR_ICON}\n            disabled={this.disabled}\n          ></ch-image>\n        </button>\n\n        <button\n          class=\"icon-button\"\n          aria-label={this.#componentLocale.selectButtonLabel}\n          title={this.#componentLocale.selectButtonLabel}\n          type=\"button\"\n          disabled={!this.selectEntityCallback || this.disabled}\n          onClick={this.#btnSelectClickHandler}\n          onBlur={!this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n          onFocus={this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n        >\n          <ch-image\n            class=\"icon-md\"\n            src={SELECT_DEFAULT_ICON}\n            disabled={this.disabled}\n          ></ch-image>\n        </button>\n      </div>\n    );\n  };\n\n  #updateIconSrc = () => {\n    if (this.value && this.value.iconSrc) {\n      this.iconSrc = this.value.iconSrc;\n    }\n  };\n\n  render() {\n    return (\n      <Host\n        class={{\n          \"entity-selector--button-has-focus\": this.buttonHasFocus\n        }}\n      >\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        {this.labelPosition !== \"none\" ? (\n          <div\n            class={{\n              \"field\": true,\n              \"field-block\": this.labelPosition === \"block-start\",\n              \"field-inline\": this.labelPosition === \"inline-start\"\n            }}\n          >\n            <label class=\"label\" htmlFor=\"entity-input\">\n              {this.labelCaption ||\n                this.#componentLocale.entitySelectorInputAccessibleName}\n            </label>\n            {this.#renderControl()}\n          </div>\n        ) : (\n          this.#renderControl()\n        )}\n      </Host>\n    );\n  }\n}\n\nexport type EntitySelectorLabels = {\n  buttonClearLabel: string;\n  buttonSelectLabel: string;\n};\n"],"mappings":"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"}

package/dist/genexus-ide-ui/{p-0c60c76f.entry.js → p-f7d2a39a.entry.js}

@@ -1,6 +1,8 @@
 import { r as e, h as s, g as r } from "./p-49712340.js";
 
-import { g as a } from "./p-1986d34d.js";
+import { g as a } from "./p-6e4208d8.js";
+
+import "./p-ad5caf61.js";
 
 import { L as i } from "./p-311eedf3.js";
 
@@ -14,9 +16,9 @@ var n = undefined && undefined.__classPrivateFieldGet || function(e, s, r, a) {
   return r === "m" ? a : r === "a" ? a.call(e) : a ? a.value : s.get(e);
 };
 
-var l;
+var p;
 
-const p = a({
+const l = a({
   category: "bpm",
   name: "tasks",
   colorType: "neutral"
@@ -33,7 +35,7 @@ const d = class {
         this.showCopiedMessage = false;
       }), 1500);
     };
-    l.set(this, (e => {
+    p.set(this, (e => {
       e.preventDefault();
       e.stopPropagation();
     }));
@@ -44,10 +46,10 @@ const d = class {
       class: "button-tertiary button-icon-only",
       "aria-label": "copy",
       onClick: this.copyMessage,
-      onMouseDown: n(this, l, "f")
+      onMouseDown: n(this, p, "f")
     }, s("ch-image", {
       class: "icon-md",
-      src: p
+      src: l
     })) : null;
     this.visible = false;
     this.showCopiedMessage = false;
@@ -114,7 +116,7 @@ const d = class {
       class: "copied"
     }, s("ch-image", {
       class: "icon-md",
-      src: p
+      src: l
     }), this.translations["copied"]) : null, o(this.message, this.filterValue)), this.messageType === "assistant-in-progress" ? s("div", {
       class: "animation-wrapper"
     }, s("div", {
@@ -129,9 +131,9 @@ const d = class {
   }
 };
 
-l = new WeakMap;
+p = new WeakMap;
 
 d.style = t;
 
 export { d as gx_ide_ai_message };
-//# sourceMappingURL=p-0c60c76f.entry.js.map
+//# sourceMappingURL=p-f7d2a39a.entry.js.map

package/dist/genexus-ide-ui/{p-0c60c76f.entry.js.map → p-f7d2a39a.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["aiMessageCss","COPY_ICON","getIconPath","category","name","colorType","GxIdeAiMessage","this","copyable","copyMessage","navigator","clipboard","writeText","message","showCopiedMessage","setTimeout","_GxIdeAiMessage_buttonMouseDownHandler","set","e","preventDefault","stopPropagation","evaluateMessageIsCopyable","messageType","evaluateCopyIcon","h","class","onClick","onMouseDown","__classPrivateFieldGet","src","componentWillLoad","_componentLocale","Locale","getComponentStrings","el","componentDidRender","visible","messagesList","parentElement","scrollTo","render","hidden","you","message__header","message__role","assistant","message__caption","translations","hiChar","filterValue"],"sources":["src/components/ai-assistant/ai-message.scss?tag=gx-ide-ai-message","src/components/ai-assistant/ai-message.tsx"],"sourcesContent":["@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n  font-family: var(--mer-font-family--primary);\n}\n/*--- Messages ---*/\n.message {\n  color: var(--mer-color__neutral-gray--100);\n  display: grid;\n  grid-template-rows: 0fr;\n  transition: grid-template-rows 100ms;\n  transition: grid-template-rows 100ms, -ms-grid-rows 100ms;\n  &__outer-wrapper {\n    overflow: hidden;\n  }\n  &__inner-wrapper {\n    padding: var(--mer-spacing--sm) var(--mer-spacing--sm);\n    border-radius: var(--mer-border__radius--sm);\n    border-inline-start: var(--mer-border__width--md) solid transparent;\n    background-color: var(--mer-color__neutral-gray--1200);\n    margin-block-start: var(--mer-spacing--xs);\n    position: relative;\n  }\n  &__header {\n    display: flex;\n    gap: var(--mer-spacing--xs);\n    justify-content: space-between;\n\n    .icon-md {\n      opacity: 0;\n    }\n\n    &--in-progress {\n      display: contents;\n    }\n  }\n  &__role {\n    &:before {\n      content: \"\";\n      display: grid;\n      place-self: center flex-end;\n      inline-size: 4px;\n      block-size: 4px;\n      border-radius: 50%;\n      background-color: currentcolor;\n    }\n\n    font-weight: var(--mer-font__weight--semi-bold);\n    margin-block-end: var(--mer-spacing--xs);\n    display: inline-grid;\n    grid-template-columns: max-content 1fr;\n    gap: 8px;\n\n    &-description {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      display: inline-block;\n      padding-block-start: 2px;\n    }\n    &--user {\n      color: var(--mer-color__primary--300);\n    }\n    &--assistant {\n    }\n    &--hidden {\n      display: none;\n    }\n  }\n  &__caption {\n    font-size: var(--mer-font__size--xs);\n    line-height: var(--mer-line-height--regular);\n  }\n  &--visible {\n    grid-template-rows: 1fr;\n  }\n  &--copying {\n    pointer-events: none;\n    span:not(.copied),\n    .message__caption {\n      color: transparent;\n      -webkit-user-select: none; /* Safari */\n      -ms-user-select: none; /* IE 10 and IE 11 */\n      user-select: none; /* Standard syntax */\n    }\n  }\n  /*--- Types of messages ---*/\n  &--user {\n    .message__inner-wrapper {\n      background-color: rgba(91, 167, 255, 0.08);\n      border-color: var(--mer-border-color__primary);\n    }\n  }\n  &--assistant-action {\n    .message__inner-wrapper {\n      background-color: rgba(63, 168, 155, 0.05);\n      border-color: var(--mer-border-color__success);\n    }\n  }\n  &--assistant-chat {\n    .message__inner-wrapper {\n      background-color: var(--mer-surface__elevation--01);\n    }\n  }\n  &--assistant-in-progress {\n    color: var(--mer-color__neutral-gray--500);\n    .message__inner-wrapper {\n      font-style: italic;\n      display: grid;\n      grid-template-columns: 1fr auto;\n      gap: var(--mer-spacing--xs);\n\n      .message__caption {\n        flex: 1;\n      }\n      .animation-wrapper {\n        flex: none;\n      }\n    }\n  }\n  &--assistant-error {\n    .message__inner-wrapper {\n      background-color: rgba(251, 124, 132, 0.05);\n      border-color: var(--mer-border-color__error);\n    }\n  }\n  &--copyable {\n    &:hover {\n      filter: brightness(1.2);\n      .icon-md {\n        opacity: 1;\n      }\n    }\n  }\n  &:last-child {\n    margin-block-end: 0;\n  }\n}\n:host(:first-child) {\n  .message {\n    &__inner-wrapper {\n      margin-block-end: 0;\n    }\n  }\n}\n\n/*--- Dot Pulse Sweet Animation ---*/\n.animation-wrapper {\n  width: 45px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n$color: var(--mer-color__neutral-gray--400);\n.dot-pulse {\n  position: relative;\n  left: -9999px;\n  width: 5px;\n  height: 5px;\n  border-radius: 2.5px;\n  background-color: $color;\n  color: $color;\n  box-shadow: 9999px 0 0 -5px;\n  animation: dot-pulse 1.5s infinite linear;\n  animation-delay: 0.25s;\n  &::before,\n  &::after {\n    content: \"\";\n    display: inline-block;\n    position: absolute;\n    top: 0;\n    width: 5px;\n    height: 5px;\n    border-radius: 2.5px;\n    background-color: $color;\n    color: $color;\n  }\n  &::before {\n    box-shadow: 9984px 0 0 -5px;\n    animation: dot-pulse-before 1.5s infinite linear;\n    animation-delay: 0s;\n  }\n  &::after {\n    box-shadow: 10014px 0 0 -5px;\n    animation: dot-pulse-after 1.5s infinite linear;\n    animation-delay: 0.5s;\n  }\n}\n@keyframes dot-pulse-before {\n  0% {\n    box-shadow: 9984px 0 0 -5px;\n  }\n  30% {\n    box-shadow: 9984px 0 0 2px;\n  }\n  60%,\n  100% {\n    box-shadow: 9984px 0 0 -5px;\n  }\n}\n@keyframes dot-pulse {\n  0% {\n    box-shadow: 9999px 0 0 -5px;\n  }\n  30% {\n    box-shadow: 9999px 0 0 2px;\n  }\n  60%,\n  100% {\n    box-shadow: 9999px 0 0 -5px;\n  }\n}\n@keyframes dot-pulse-after {\n  0% {\n    box-shadow: 10014px 0 0 -5px;\n  }\n  30% {\n    box-shadow: 10014px 0 0 2px;\n  }\n  60%,\n  100% {\n    box-shadow: 10014px 0 0 -5px;\n  }\n}\n\n/*--- Copy Message ---*/\n.copied {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  top: 0;\n  left: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mer-color__neutral-gray--300);\n  display: flex;\n  gap: var(--mer-spacing--xs);\n  opacity: 0;\n  animation: fadeIn var(--mer-timing--regular) ease-out forwards;\n}\n\n@keyframes fadeIn {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n@include hiChar;\n","import { Component, h, Prop, Element, State } from \"@stencil/core\";\n\nimport { getIconPath } from \"@genexus/mercury\";\n\nimport { Locale } from \"../../common/locale\";\nimport { MessageType } from \"./ai-assistant\";\nimport { hiChar } from \"../../common/helpers\";\n\nconst COPY_ICON = getIconPath({\n  category: \"bpm\",\n  name: \"tasks\",\n  colorType: \"neutral\"\n});\n\n@Component({\n  tag: \"gx-ide-ai-message\",\n  styleUrl: \"ai-message.scss\",\n  shadow: false,\n  assetsDirs: [\"gx-ide-assets/ai-message\"]\n})\nexport class GxIdeAiMessage {\n  /* The message allows to be copied*/\n  private _componentLocale: any;\n  private copyable = false;\n\n  @Element() el: HTMLGxIdeAiMessageElement;\n\n  /**\n   * This wil display the message if true\n   */\n  @State() visible = false;\n\n  /**\n   * This wil show the user a text, indicating that the message has been copied\n   */\n  @State() showCopiedMessage = false;\n\n  /**\n   * A reference to the gx-ide-ai-assistant host element\n   */\n  @Prop() readonly aiAssistantHostRef: HTMLGxIdeAiAssistantElement;\n\n  /**\n   * The actual message\n   */\n  @Prop() readonly message: string;\n\n  /**\n   * The message type\n   */\n  @Prop() readonly messageType: MessageType;\n\n  /**\n   * The filter value\n   */\n  @Prop() readonly filterValue: string;\n\n  /**\n   * It hides the message (used for the filter)\n   */\n  @Prop() readonly hidden: boolean;\n\n  /**\n   * An object with the needed string translations.\n   */\n  @Prop() readonly translations: Translations;\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n    this.evaluateMessageIsCopyable();\n  }\n\n  componentDidRender() {\n    setTimeout(() => {\n      /* Without the timeout it appears instantly (no apparent transition)*/\n      this.visible = true;\n      const messagesList = this.el.parentElement;\n      messagesList.scrollTo(0, 0);\n    }, 0);\n  }\n\n  private copyMessage = () => {\n    navigator.clipboard.writeText(this.message);\n    this.showCopiedMessage = true;\n    setTimeout(() => {\n      this.showCopiedMessage = false;\n    }, 1500);\n  };\n\n  #buttonMouseDownHandler = (e: MouseEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n  };\n\n  private evaluateMessageIsCopyable = () => {\n    this.copyable = this.messageType !== \"assistant-in-progress\";\n  };\n\n  private evaluateCopyIcon = () => {\n    return this.copyable ? (\n      <button\n        class=\"button-tertiary button-icon-only\"\n        aria-label=\"copy\"\n        onClick={this.copyMessage}\n        onMouseDown={this.#buttonMouseDownHandler}\n      >\n        <ch-image class=\"icon-md\" src={COPY_ICON}></ch-image>\n      </button>\n    ) : null;\n  };\n\n  render() {\n    return (\n      <li\n        class={{\n          \"message\": true,\n          \"message--visible\": this.visible && !this.hidden,\n          [`message--${[this.messageType]}`]: true,\n          \"message--assistant\": this.messageType !== \"user\",\n          \"message--copyable\": this.copyable,\n          \"message--copying\": this.showCopiedMessage\n        }}\n      >\n        <div class=\"message__outer-wrapper\">\n          <div\n            class={{\n              \"message__inner-wrapper\": true\n            }}\n          >\n            {this.messageType === \"user\" ? (\n              <div class=\"message__header\">\n                <span class=\"message__role message__role--user\">\n                  <span class=\"message__role-description\">\n                    {this._componentLocale.you}\n                  </span>\n                </span>\n                {this.evaluateCopyIcon()}\n              </div>\n            ) : (\n              <div\n                class={{\n                  \"message__header\": true,\n                  \"message__header--in-progress\":\n                    this.messageType === \"assistant-in-progress\"\n                }}\n              >\n                <span\n                  class={{\n                    \"message__role\":\n                      this.messageType !== \"assistant-in-progress\",\n                    \"message__role--hidden\":\n                      this.messageType === \"assistant-in-progress\",\n                    \"message__role--assistant\": true\n                  }}\n                >\n                  <span class=\"message__role-description\">\n                    {this._componentLocale.assistant}\n                  </span>\n                </span>\n                {this.evaluateCopyIcon()}\n              </div>\n            )}\n            <div\n              class={{\n                \"message__caption\": true,\n                \"message__caption--in-progress\":\n                  this.messageType === \"assistant-in-progress\"\n              }}\n            >\n              {this.showCopiedMessage ? (\n                <span class=\"copied\">\n                  <ch-image class=\"icon-md\" src={COPY_ICON}></ch-image>\n                  {this.translations[\"copied\"]}\n                </span>\n              ) : null}\n              {hiChar(this.message, this.filterValue)}\n            </div>\n            {this.messageType === \"assistant-in-progress\" ? (\n              <div class=\"animation-wrapper\">\n                <div class=\"dot-pulse\"></div>\n              </div>\n            ) : null}\n          </div>\n        </div>\n      </li>\n    );\n  }\n}\n\nexport type Translations = {\n  [key: string]: string;\n};\n"],"mappings":";;;;;;;;AAAA,MAAMA,IAAe;;;;;;;;;;ACQrB,MAAMC,IAAYC,EAAY;EAC5BC,UAAU;EACVC,MAAM;EACNC,WAAW;;;MASAC,IAAc;;;IAGjBC,KAAAC,WAAW;IA0DXD,KAAAE,cAAc;MACpBC,UAAUC,UAAUC,UAAUL,KAAKM;MACnCN,KAAKO,oBAAoB;MACzBC,YAAW;QACTR,KAAKO,oBAAoB;AAAK,UAC7B;AAAK;IAGVE,EAAAC,IAAAV,OAA2BW;MACzBA,EAAEC;MACFD,EAAEE;AAAiB;IAGbb,KAAAc,4BAA4B;MAClCd,KAAKC,WAAWD,KAAKe,gBAAgB;AAAuB;IAGtDf,KAAAgB,mBAAmB,MAClBhB,KAAKC,WACVgB,EAAA;MACEC,OAAM;MAAkC,cAC7B;MACXC,SAASnB,KAAKE;MACdkB,aAAaC,EAAArB,MAAIS,GAAA;OAEjBQ,EAAA;MAAUC,OAAM;MAAUI,KAAK5B;UAE/B;mBA9Ea;6BAKU;;;;;;;;EAgC7B,uBAAM6B;IACJvB,KAAKwB,yBAAyBC,EAAOC,oBAAoB1B,KAAK2B;IAC9D3B,KAAKc;;EAGP,kBAAAc;IACEpB,YAAW;;MAETR,KAAK6B,UAAU;MACf,MAAMC,IAAe9B,KAAK2B,GAAGI;MAC7BD,EAAaE,SAAS,GAAG;AAAE,QAC1B;;EAiCL,MAAAC;IACE,OACEhB,EAAA;MACEC,OAAO;QACLZ,SAAW;QACX,oBAAoBN,KAAK6B,YAAY7B,KAAKkC;QAC1C,CAAC,YAAY,EAAClC,KAAKe,kBAAiB;QACpC,sBAAsBf,KAAKe,gBAAgB;QAC3C,qBAAqBf,KAAKC;QAC1B,oBAAoBD,KAAKO;;OAG3BU,EAAA;MAAKC,OAAM;OACTD,EAAA;MACEC,OAAO;QACL,0BAA0B;;OAG3BlB,KAAKe,gBAAgB,SACpBE,EAAA;MAAKC,OAAM;OACTD,EAAA;MAAMC,OAAM;OACVD,EAAA;MAAMC,OAAM;OACTlB,KAAKwB,iBAAiBW,OAG1BnC,KAAKgB,sBAGRC,EAAA;MACEC,OAAO;QACLkB,iBAAmB;QACnB,gCACEpC,KAAKe,gBAAgB;;OAGzBE,EAAA;MACEC,OAAO;QACLmB,eACErC,KAAKe,gBAAgB;QACvB,yBACEf,KAAKe,gBAAgB;QACvB,4BAA4B;;OAG9BE,EAAA;MAAMC,OAAM;OACTlB,KAAKwB,iBAAiBc,aAG1BtC,KAAKgB,qBAGVC,EAAA;MACEC,OAAO;QACLqB,kBAAoB;QACpB,iCACEvC,KAAKe,gBAAgB;;OAGxBf,KAAKO,oBACJU,EAAA;MAAMC,OAAM;OACVD,EAAA;MAAUC,OAAM;MAAUI,KAAK5B;QAC9BM,KAAKwC,aAAa,aAEnB,MACHC,EAAOzC,KAAKM,SAASN,KAAK0C,eAE5B1C,KAAKe,gBAAgB,0BACpBE,EAAA;MAAKC,OAAM;OACTD,EAAA;MAAKC,OAAM;UAEX"}
+{"version":3,"names":["aiMessageCss","COPY_ICON","getIconPath","category","name","colorType","GxIdeAiMessage","this","copyable","copyMessage","navigator","clipboard","writeText","message","showCopiedMessage","setTimeout","_GxIdeAiMessage_buttonMouseDownHandler","set","e","preventDefault","stopPropagation","evaluateMessageIsCopyable","messageType","evaluateCopyIcon","h","class","onClick","onMouseDown","__classPrivateFieldGet","src","componentWillLoad","_componentLocale","Locale","getComponentStrings","el","componentDidRender","visible","messagesList","parentElement","scrollTo","render","hidden","you","message__header","message__role","assistant","message__caption","translations","hiChar","filterValue"],"sources":["src/components/ai-assistant/ai-message.scss?tag=gx-ide-ai-message","src/components/ai-assistant/ai-message.tsx"],"sourcesContent":["@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n  font-family: var(--mer-font-family--primary);\n}\n/*--- Messages ---*/\n.message {\n  color: var(--mer-color__neutral-gray--100);\n  display: grid;\n  grid-template-rows: 0fr;\n  transition: grid-template-rows 100ms;\n  transition: grid-template-rows 100ms, -ms-grid-rows 100ms;\n  &__outer-wrapper {\n    overflow: hidden;\n  }\n  &__inner-wrapper {\n    padding: var(--mer-spacing--sm) var(--mer-spacing--sm);\n    border-radius: var(--mer-border__radius--sm);\n    border-inline-start: var(--mer-border__width--md) solid transparent;\n    background-color: var(--mer-color__neutral-gray--1200);\n    margin-block-start: var(--mer-spacing--xs);\n    position: relative;\n  }\n  &__header {\n    display: flex;\n    gap: var(--mer-spacing--xs);\n    justify-content: space-between;\n\n    .icon-md {\n      opacity: 0;\n    }\n\n    &--in-progress {\n      display: contents;\n    }\n  }\n  &__role {\n    &:before {\n      content: \"\";\n      display: grid;\n      place-self: center flex-end;\n      inline-size: 4px;\n      block-size: 4px;\n      border-radius: 50%;\n      background-color: currentcolor;\n    }\n\n    font-weight: var(--mer-font__weight--semi-bold);\n    margin-block-end: var(--mer-spacing--xs);\n    display: inline-grid;\n    grid-template-columns: max-content 1fr;\n    gap: 8px;\n\n    &-description {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      display: inline-block;\n      padding-block-start: 2px;\n    }\n    &--user {\n      color: var(--mer-color__primary--300);\n    }\n    &--assistant {\n    }\n    &--hidden {\n      display: none;\n    }\n  }\n  &__caption {\n    font-size: var(--mer-font__size--xs);\n    line-height: var(--mer-line-height--regular);\n  }\n  &--visible {\n    grid-template-rows: 1fr;\n  }\n  &--copying {\n    pointer-events: none;\n    span:not(.copied),\n    .message__caption {\n      color: transparent;\n      -webkit-user-select: none; /* Safari */\n      -ms-user-select: none; /* IE 10 and IE 11 */\n      user-select: none; /* Standard syntax */\n    }\n  }\n  /*--- Types of messages ---*/\n  &--user {\n    .message__inner-wrapper {\n      background-color: rgba(91, 167, 255, 0.08);\n      border-color: var(--mer-border-color__primary);\n    }\n  }\n  &--assistant-action {\n    .message__inner-wrapper {\n      background-color: rgba(63, 168, 155, 0.05);\n      border-color: var(--mer-border-color__success);\n    }\n  }\n  &--assistant-chat {\n    .message__inner-wrapper {\n      background-color: var(--mer-surface__elevation--01);\n    }\n  }\n  &--assistant-in-progress {\n    color: var(--mer-color__neutral-gray--500);\n    .message__inner-wrapper {\n      font-style: italic;\n      display: grid;\n      grid-template-columns: 1fr auto;\n      gap: var(--mer-spacing--xs);\n\n      .message__caption {\n        flex: 1;\n      }\n      .animation-wrapper {\n        flex: none;\n      }\n    }\n  }\n  &--assistant-error {\n    .message__inner-wrapper {\n      background-color: rgba(251, 124, 132, 0.05);\n      border-color: var(--mer-border-color__error);\n    }\n  }\n  &--copyable {\n    &:hover {\n      filter: brightness(1.2);\n      .icon-md {\n        opacity: 1;\n      }\n    }\n  }\n  &:last-child {\n    margin-block-end: 0;\n  }\n}\n:host(:first-child) {\n  .message {\n    &__inner-wrapper {\n      margin-block-end: 0;\n    }\n  }\n}\n\n/*--- Dot Pulse Sweet Animation ---*/\n.animation-wrapper {\n  width: 45px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n$color: var(--mer-color__neutral-gray--400);\n.dot-pulse {\n  position: relative;\n  left: -9999px;\n  width: 5px;\n  height: 5px;\n  border-radius: 2.5px;\n  background-color: $color;\n  color: $color;\n  box-shadow: 9999px 0 0 -5px;\n  animation: dot-pulse 1.5s infinite linear;\n  animation-delay: 0.25s;\n  &::before,\n  &::after {\n    content: \"\";\n    display: inline-block;\n    position: absolute;\n    top: 0;\n    width: 5px;\n    height: 5px;\n    border-radius: 2.5px;\n    background-color: $color;\n    color: $color;\n  }\n  &::before {\n    box-shadow: 9984px 0 0 -5px;\n    animation: dot-pulse-before 1.5s infinite linear;\n    animation-delay: 0s;\n  }\n  &::after {\n    box-shadow: 10014px 0 0 -5px;\n    animation: dot-pulse-after 1.5s infinite linear;\n    animation-delay: 0.5s;\n  }\n}\n@keyframes dot-pulse-before {\n  0% {\n    box-shadow: 9984px 0 0 -5px;\n  }\n  30% {\n    box-shadow: 9984px 0 0 2px;\n  }\n  60%,\n  100% {\n    box-shadow: 9984px 0 0 -5px;\n  }\n}\n@keyframes dot-pulse {\n  0% {\n    box-shadow: 9999px 0 0 -5px;\n  }\n  30% {\n    box-shadow: 9999px 0 0 2px;\n  }\n  60%,\n  100% {\n    box-shadow: 9999px 0 0 -5px;\n  }\n}\n@keyframes dot-pulse-after {\n  0% {\n    box-shadow: 10014px 0 0 -5px;\n  }\n  30% {\n    box-shadow: 10014px 0 0 2px;\n  }\n  60%,\n  100% {\n    box-shadow: 10014px 0 0 -5px;\n  }\n}\n\n/*--- Copy Message ---*/\n.copied {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  top: 0;\n  left: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mer-color__neutral-gray--300);\n  display: flex;\n  gap: var(--mer-spacing--xs);\n  opacity: 0;\n  animation: fadeIn var(--mer-timing--regular) ease-out forwards;\n}\n\n@keyframes fadeIn {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n@include hiChar;\n","import { Component, h, Prop, Element, State } from \"@stencil/core\";\n\nimport { getIconPath } from \"@genexus/mercury\";\n\nimport { Locale } from \"../../common/locale\";\nimport { MessageType } from \"./ai-assistant\";\nimport { hiChar } from \"../../common/helpers\";\n\nconst COPY_ICON = getIconPath({\n  category: \"bpm\",\n  name: \"tasks\",\n  colorType: \"neutral\"\n});\n\n@Component({\n  tag: \"gx-ide-ai-message\",\n  styleUrl: \"ai-message.scss\",\n  shadow: false,\n  assetsDirs: [\"gx-ide-assets/ai-message\"]\n})\nexport class GxIdeAiMessage {\n  /* The message allows to be copied*/\n  private _componentLocale: any;\n  private copyable = false;\n\n  @Element() el: HTMLGxIdeAiMessageElement;\n\n  /**\n   * This wil display the message if true\n   */\n  @State() visible = false;\n\n  /**\n   * This wil show the user a text, indicating that the message has been copied\n   */\n  @State() showCopiedMessage = false;\n\n  /**\n   * A reference to the gx-ide-ai-assistant host element\n   */\n  @Prop() readonly aiAssistantHostRef: HTMLGxIdeAiAssistantElement;\n\n  /**\n   * The actual message\n   */\n  @Prop() readonly message: string;\n\n  /**\n   * The message type\n   */\n  @Prop() readonly messageType: MessageType;\n\n  /**\n   * The filter value\n   */\n  @Prop() readonly filterValue: string;\n\n  /**\n   * It hides the message (used for the filter)\n   */\n  @Prop() readonly hidden: boolean;\n\n  /**\n   * An object with the needed string translations.\n   */\n  @Prop() readonly translations: Translations;\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n    this.evaluateMessageIsCopyable();\n  }\n\n  componentDidRender() {\n    setTimeout(() => {\n      /* Without the timeout it appears instantly (no apparent transition)*/\n      this.visible = true;\n      const messagesList = this.el.parentElement;\n      messagesList.scrollTo(0, 0);\n    }, 0);\n  }\n\n  private copyMessage = () => {\n    navigator.clipboard.writeText(this.message);\n    this.showCopiedMessage = true;\n    setTimeout(() => {\n      this.showCopiedMessage = false;\n    }, 1500);\n  };\n\n  #buttonMouseDownHandler = (e: MouseEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n  };\n\n  private evaluateMessageIsCopyable = () => {\n    this.copyable = this.messageType !== \"assistant-in-progress\";\n  };\n\n  private evaluateCopyIcon = () => {\n    return this.copyable ? (\n      <button\n        class=\"button-tertiary button-icon-only\"\n        aria-label=\"copy\"\n        onClick={this.copyMessage}\n        onMouseDown={this.#buttonMouseDownHandler}\n      >\n        <ch-image class=\"icon-md\" src={COPY_ICON}></ch-image>\n      </button>\n    ) : null;\n  };\n\n  render() {\n    return (\n      <li\n        class={{\n          \"message\": true,\n          \"message--visible\": this.visible && !this.hidden,\n          [`message--${[this.messageType]}`]: true,\n          \"message--assistant\": this.messageType !== \"user\",\n          \"message--copyable\": this.copyable,\n          \"message--copying\": this.showCopiedMessage\n        }}\n      >\n        <div class=\"message__outer-wrapper\">\n          <div\n            class={{\n              \"message__inner-wrapper\": true\n            }}\n          >\n            {this.messageType === \"user\" ? (\n              <div class=\"message__header\">\n                <span class=\"message__role message__role--user\">\n                  <span class=\"message__role-description\">\n                    {this._componentLocale.you}\n                  </span>\n                </span>\n                {this.evaluateCopyIcon()}\n              </div>\n            ) : (\n              <div\n                class={{\n                  \"message__header\": true,\n                  \"message__header--in-progress\":\n                    this.messageType === \"assistant-in-progress\"\n                }}\n              >\n                <span\n                  class={{\n                    \"message__role\":\n                      this.messageType !== \"assistant-in-progress\",\n                    \"message__role--hidden\":\n                      this.messageType === \"assistant-in-progress\",\n                    \"message__role--assistant\": true\n                  }}\n                >\n                  <span class=\"message__role-description\">\n                    {this._componentLocale.assistant}\n                  </span>\n                </span>\n                {this.evaluateCopyIcon()}\n              </div>\n            )}\n            <div\n              class={{\n                \"message__caption\": true,\n                \"message__caption--in-progress\":\n                  this.messageType === \"assistant-in-progress\"\n              }}\n            >\n              {this.showCopiedMessage ? (\n                <span class=\"copied\">\n                  <ch-image class=\"icon-md\" src={COPY_ICON}></ch-image>\n                  {this.translations[\"copied\"]}\n                </span>\n              ) : null}\n              {hiChar(this.message, this.filterValue)}\n            </div>\n            {this.messageType === \"assistant-in-progress\" ? (\n              <div class=\"animation-wrapper\">\n                <div class=\"dot-pulse\"></div>\n              </div>\n            ) : null}\n          </div>\n        </div>\n      </li>\n    );\n  }\n}\n\nexport type Translations = {\n  [key: string]: string;\n};\n"],"mappings":";;;;;;;;;;AAAA,MAAMA,IAAe;;;;;;;;;;ACQrB,MAAMC,IAAYC,EAAY;EAC5BC,UAAU;EACVC,MAAM;EACNC,WAAW;;;MASAC,IAAc;;;IAGjBC,KAAAC,WAAW;IA0DXD,KAAAE,cAAc;MACpBC,UAAUC,UAAUC,UAAUL,KAAKM;MACnCN,KAAKO,oBAAoB;MACzBC,YAAW;QACTR,KAAKO,oBAAoB;AAAK,UAC7B;AAAK;IAGVE,EAAAC,IAAAV,OAA2BW;MACzBA,EAAEC;MACFD,EAAEE;AAAiB;IAGbb,KAAAc,4BAA4B;MAClCd,KAAKC,WAAWD,KAAKe,gBAAgB;AAAuB;IAGtDf,KAAAgB,mBAAmB,MAClBhB,KAAKC,WACVgB,EAAA;MACEC,OAAM;MAAkC,cAC7B;MACXC,SAASnB,KAAKE;MACdkB,aAAaC,EAAArB,MAAIS,GAAA;OAEjBQ,EAAA;MAAUC,OAAM;MAAUI,KAAK5B;UAE/B;mBA9Ea;6BAKU;;;;;;;;EAgC7B,uBAAM6B;IACJvB,KAAKwB,yBAAyBC,EAAOC,oBAAoB1B,KAAK2B;IAC9D3B,KAAKc;;EAGP,kBAAAc;IACEpB,YAAW;;MAETR,KAAK6B,UAAU;MACf,MAAMC,IAAe9B,KAAK2B,GAAGI;MAC7BD,EAAaE,SAAS,GAAG;AAAE,QAC1B;;EAiCL,MAAAC;IACE,OACEhB,EAAA;MACEC,OAAO;QACLZ,SAAW;QACX,oBAAoBN,KAAK6B,YAAY7B,KAAKkC;QAC1C,CAAC,YAAY,EAAClC,KAAKe,kBAAiB;QACpC,sBAAsBf,KAAKe,gBAAgB;QAC3C,qBAAqBf,KAAKC;QAC1B,oBAAoBD,KAAKO;;OAG3BU,EAAA;MAAKC,OAAM;OACTD,EAAA;MACEC,OAAO;QACL,0BAA0B;;OAG3BlB,KAAKe,gBAAgB,SACpBE,EAAA;MAAKC,OAAM;OACTD,EAAA;MAAMC,OAAM;OACVD,EAAA;MAAMC,OAAM;OACTlB,KAAKwB,iBAAiBW,OAG1BnC,KAAKgB,sBAGRC,EAAA;MACEC,OAAO;QACLkB,iBAAmB;QACnB,gCACEpC,KAAKe,gBAAgB;;OAGzBE,EAAA;MACEC,OAAO;QACLmB,eACErC,KAAKe,gBAAgB;QACvB,yBACEf,KAAKe,gBAAgB;QACvB,4BAA4B;;OAG9BE,EAAA;MAAMC,OAAM;OACTlB,KAAKwB,iBAAiBc,aAG1BtC,KAAKgB,qBAGVC,EAAA;MACEC,OAAO;QACLqB,kBAAoB;QACpB,iCACEvC,KAAKe,gBAAgB;;OAGxBf,KAAKO,oBACJU,EAAA;MAAMC,OAAM;OACVD,EAAA;MAAUC,OAAM;MAAUI,KAAK5B;QAC9BM,KAAKwC,aAAa,aAEnB,MACHC,EAAOzC,KAAKM,SAASN,KAAK0C,eAE5B1C,KAAKe,gBAAgB,0BACpBE,EAAA;MAAKC,OAAM;OACTD,EAAA;MAAKC,OAAM;UAEX"}

package/dist/types/components/_helpers/chat-container/chat-container.d.ts

@@ -0,0 +1,19 @@
+export declare class GxIdeChatContainer {
+    /**
+     * The chat title
+     */
+    readonly chatTitle?: string;
+    /**
+     * If true a button for copying the conversation will be render on the header.s
+     */
+    readonly copyConversationCallback: () => void;
+    /**
+     * Coneration Copied
+     */
+    displayConversationCopiedMessage: boolean;
+    /**
+     * It will display a feedback message that the conversation has been copied
+     */
+    showCopyConversationMessage(): Promise<void>;
+    render(): any;
+}

package/dist/types/components/_helpers/chat-container/code-render.d.ts

@@ -0,0 +1,4 @@
+import { MarkdownViewerCodeRender, ChatMessageByRole } from "@genexus/chameleon-controls-library";
+import { MarkdownViewerCodeRenderOptions } from "@genexus/chameleon-controls-library/dist/types/components/markdown-viewer/parsers/types";
+export declare const mercuryCodeRender: (copyButtonAccessibleName: string) => (options: MarkdownViewerCodeRenderOptions) => MarkdownViewerCodeRender;
+export declare const mercuryChatMessageRender: (theme: string) => (messageModel: ChatMessageByRole<"assistant" | "error" | "user">) => any[];