@genexus/genexus-ide-ui 2.1.4 → 3.0.1

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

@@ -0,0 +1 @@
+{"version":3,"names":["mapTypeCategoryDataToActionListModel","categories","map","category","id","type","additionalInformation","center","imgSrc","icon","undefined","caption","name","part","mapTypeDataToActionListModel","types","selectedCategoryId","selectedTypeId","imageSrc","selected","sortActionListDefault","subModel","newObjectCss","CSS_BUNDLES","GxIdeNewObject","_GxIdeNewObject_componentLocale","set","this","_GxIdeNewObject_shortcutsSrc","getAssetPath","_GxIdeNewObject_categoriesActionListEl","_GxIdeNewObject_chShortcutsEl","_GxIdeNewObject_descriptionEl","_GxIdeNewObject_descriptionModifiedByUser","_GxIdeNewObject_moduleFolderEl","_GxIdeNewObject_nameEl","_GxIdeNewObject_nameModifiedByUser","_GxIdeNewObject_cancelCallbackHandler","async","cancelCallback","_GxIdeNewObject_categoryOnSelectionChangedHandler","selectionEvent","selection","detail","length","selectedCategory","typeCategories","find","item","selectedType","selectedTypeMap","get","_GxIdeNewObject_createCallbackHandler","nameValidation","validateNameCallback","__classPrivateFieldGet","value","_GxIdeNewObject_validateNameHandler","call","data","typeId","_a","description","moduleId","_c","_b","result","createCallback","_GxIdeNewObject_descriptionValueHandler","suggestCallback","_GxIdeNewObject_resolveNameSuggestion","suggestedName","replace","_GxIdeNewObject_resolveDescriptionSuggestion","suggestedDescription","_GxIdeNewObject_updateSuggestions","suggestions","_GxIdeNewObject_init","defaultTypeFound","_GxIdeNewObject_setDefaultType","defaultTypeId","_GxIdeNewObject_onBlurNameHandler","_GxIdeNewObject_onInputDescriptionHandler","e","__classPrivateFieldSet","_GxIdeNewObject_onInputNameHandler","_GxIdeNewObject_onNameValueChangedHandler","_GxIdeNewObject_renderModuleFolder","hasModule","hasFolder","labelDescription","moduleFolder","moduleOnly","folderOnly","h","class","htmlFor","labelPosition","parent","defaultValue","defaultParent","selectEntityCallback","selectModuleCallback","ref","el","found","outerLoop","i","j","loopTypeId","_GxIdeNewObject_setSelectedCategoryOnActionList","updateItemProperties","_GxIdeNewObject_typeChangedHandler","nameValidationErrorMessage","Map","typeCategoriesChanged","newValue","typeCategoriesActionListModel","connectedCallback","componentWillLoad","Locale","getComponentStrings","_GxIdeNewObject_instances","_GxIdeNewObject_initializeSelectedTypeMap","componentDidLoad","suspendShortcuts","suspend","render","Host","model","src","categorySelectionTitle","sortItemsCallback","onSelectedItemsChange","typeSelectionTitleSuffix","typeSelectionTitle","objectName","autoFocus","input","placeholder","onChange","onInput","onBlur","actionElement","blockAlign","config","tooltipSettings","inlineAlign","delay","objectDescription","onClick","footer","btnCancel","disabled","btnCreate","forEach"],"sources":["src/components/new-object/helpers.tsx","src/common/chameleon-helpers.ts","src/components/new-object/new-object.scss?tag=gx-ide-new-object&encapsulation=shadow","src/components/new-object/new-object.tsx"],"sourcesContent":["import { ActionListModel } from \"@genexus/chameleon-controls-library\";\nimport { TypeCategoryData } from \"../..\";\nimport { TypeData } from \"./new-object\";\n\nexport type ChCheckboxArray = HTMLChCheckboxElement[] | null;\n\nexport const mapTypeCategoryDataToActionListModel = (\n  categories: TypeCategoryData[]\n): ActionListModel => {\n  return categories.map(category => {\n    return {\n      id: category.id,\n      type: \"actionable\",\n      additionalInformation: {\n        \"stretch-start\": {\n          center: [{ imgSrc: category.icon || undefined }]\n        }\n      },\n      caption: category.name,\n      part: `category-${category.id}`\n    };\n  });\n};\n\nexport const mapTypeDataToActionListModel = (\n  types: TypeData[],\n  selectedCategoryId: string,\n  selectedTypeId?: string\n): ActionListModel => {\n  return types.map(type => {\n    return {\n      id: `${type.id}`,\n      type: \"actionable\",\n      imageSrc: \"objects/design\",\n      selected: selectedTypeId === type.id,\n      additionalInformation: {\n        \"stretch-start\": {\n          center: [{ imgSrc: type.icon }]\n        }\n      },\n      caption: type.name,\n      part: `type-${selectedCategoryId}-${type.id}`\n    };\n  });\n};\n","import { ActionListModel } from \"@genexus/chameleon-controls-library/dist/types/components/action-list/types\";\n\n/**\n * Order the items in the same order as they come.\n */\nexport const sortActionListDefault = (subModel: ActionListModel) => {\n  return subModel;\n};\n","@import \"../../global/temporary-mercury-overrides/_button.scss\";\n\n:host {\n  display: grid;\n  block-size: 100%;\n}\n\n.main {\n  display: grid;\n  grid-template-rows: 1fr max-content max-content;\n}\n.categories-types-layout {\n  grid-template-columns: 1fr 1fr;\n}\n.api-description-layout {\n  padding-block: calc(\n    12px * 2\n  ); // WA until we define a class for internal spacing.\n  display: grid;\n  grid-template:\n    \"api-description-title api-description-title\"\n    \"api-name-label api-name-control\"\n    \"api-description-label api-description-control\"\n    \"api-module-label api-module-control\";\n  grid-template-columns: max-content 1fr;\n}\n.api-description-title {\n  grid-area: api-description-title;\n  padding-block-end: var(--spacing-padding-m);\n}\n.api-name-label {\n  grid-area: api-name-label;\n}\n.api-name-control {\n  grid-area: api-name-control;\n}\n.api-description-label {\n  grid-area: api-description-label;\n}\n.api-description-control {\n  grid-area: api-description-control;\n}\n.api-module-label {\n  grid-area: api-module-label;\n}\n.api-module-control {\n  grid-area: api-module-control;\n}\n","/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Element,\n  State,\n  Watch,\n  getAssetPath,\n  Method\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { MercuryBundles } from \"@genexus/mercury\";\nimport { config } from \"../../common/config\";\n/* CUSTOM IMPORTS */\nimport { Locale } from \"../../common/locale\";\nimport { EntityData } from \"../../common/types\";\nimport {\n  ActionListItemModelExtended,\n  ActionListModel\n} from \"@genexus/chameleon-controls-library\";\nimport {\n  mapTypeCategoryDataToActionListModel,\n  mapTypeDataToActionListModel\n} from \"./helpers\";\n\nimport { sortActionListDefault } from \"../../common/chameleon-helpers\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/button\",\n  \"components/edit\",\n  \"components/icon\",\n  \"components/tooltip\",\n  \"components/list-box\",\n  \"utils/form\",\n  \"utils/layout\",\n  \"utils/spacing\",\n  \"utils/typography\"\n];\n\n@Component({\n  tag: \"gx-ide-new-object\",\n  styleUrl: \"new-object.scss\",\n  shadow: { delegatesFocus: true },\n  assetsDirs: [\"gx-ide-assets/new-object\"]\n})\nexport class GxIdeNewObject {\n  /**\n   * The component hard-coded strings translations.\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #componentLocale: any;\n  #shortcutsSrc = getAssetPath(`./gx-ide-assets/new-object/shortcuts.json`);\n\n  @Element() el: HTMLGxIdeNewObjectElement;\n\n  /* References needed to collect data on \"Create\" button submit */\n  #categoriesActionListEl: HTMLChActionListRenderElement;\n  #chShortcutsEl: HTMLChShortcutsElement;\n  #descriptionEl!: HTMLChEditElement;\n  #descriptionModifiedByUser = false;\n  #moduleFolderEl!: HTMLGxIdeEntitySelectorElement;\n  #nameEl!: HTMLChEditElement;\n  #nameModifiedByUser = false;\n\n  /**\n   * Description of the new object\n   */\n  @State() description: string = undefined;\n\n  /**\n   * Name of the new object\n   */\n  @State() name: string = undefined;\n  @State() nameValidationErrorMessage: string;\n  @State() selectedCategory: TypeCategoryData | null;\n  @State() selectedType: TypeData | null;\n  // representations of TypeCategoryData[] as ComboBoxModel.\n  @State() typeCategoriesActionListModel: ActionListModel = [];\n  @State() typesActionListModel: ActionListModel = [];\n\n  @State() selectedTypeMap: Map<string, string> = new Map();\n\n  /**\n   * Allows you to define the type selected by default when instantiating the dialog.\n   * Represented by the type identifier.\n   */\n  @Prop() readonly defaultTypeId: string;\n\n  /**\n   * Default value for the Module/Folder field.\n   */\n  @Prop() readonly defaultParent: 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 wants to cancel object creation\n   */\n  @Prop() readonly cancelCallback: CancelCallback;\n\n  /**\n   * Callback invoked when user wants to confirm object creation\n   */\n  @Prop() readonly createCallback: CreateCallback;\n\n  /**\n   * Applies a shadow all around\n   */\n  @Prop() readonly shadow = false;\n\n  /**\n   * Array containing category list and its corresponding types\n   */\n  @Prop({ mutable: true }) typeCategories!: TypeCategoryData[];\n  @Watch(\"typeCategories\")\n  typeCategoriesChanged(newValue: TypeCategoryData[]) {\n    if (newValue?.length) {\n      this.typeCategoriesActionListModel = mapTypeCategoryDataToActionListModel(\n        this.typeCategories\n      );\n    }\n  }\n\n  /**\n   * Current value for Module/Folder\n   */\n  @Prop() readonly parent: EntityData;\n\n  /**\n   * Callback invoked when the action is executed on the Module/Folder filter\n   * (button '...'). It returns the information of the selected object (id and\n   * name) or 'undefined' if it was canceled.\n   */\n  @Prop() readonly selectModuleCallback: SelectModuleCallback;\n\n  /**\n   * Callback invoked when you must validate a name. Returns an error message or\n   * 'undefined' if the name is not valid.\n   */\n  @Prop() readonly validateNameCallback: ValidateNameCallback;\n\n  /**\n   * Callback to suggest name and description based on the given type.\n   * Returns the suggested data or undefined if not applicable.\n   */\n  @Prop() readonly suggestCallback?: SuggestCallback;\n\n  /**\n   * This event emits the 'cancel' event\n   */\n  @Event() cancel: EventEmitter<boolean>;\n\n  /**\n   * This event emm=its the data needed to create a new object\n   */\n  @Event() create: EventEmitter<NewObjectData>;\n\n  /**\n   * This event is triggered after a validation of the object name is made.\n   * Returns 'undefined' if it's valid, otherwise an error message.\n   */\n  @Event() validateName: EventEmitter<string | undefined>;\n\n  connectedCallback() {\n    // this.#validateInitialName();\n  }\n\n  async componentWillLoad() {\n    await this.#init();\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n    this.typeCategoriesChanged(this.typeCategories);\n    this.#initializeSelectedTypeMap();\n  }\n\n  componentDidLoad() {\n    this.#setSelectedCategoryOnActionList();\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\n  #cancelCallbackHandler = async (): Promise<void> => {\n    await this.cancelCallback();\n  };\n\n  #categoryOnSelectionChangedHandler = (\n    selectionEvent: CustomEvent<ActionListItemModelExtended[]>\n  ): void => {\n    const selection = selectionEvent.detail;\n    if (selection.length > 0) {\n      const selectedCategory = this.typeCategories.find(\n        category => category.id === selection[0].item.id\n      );\n      if (selectedCategory) {\n        this.selectedCategory = selectedCategory;\n        if (selectedCategory.types.length > 0) {\n          this.selectedType = selectedCategory.types.find(\n            type => type.id === this.selectedTypeMap.get(selectedCategory.id)\n          );\n        }\n      }\n    }\n  };\n\n  #createCallbackHandler = async (): Promise<void> => {\n    // validate name first\n    const nameValidation: string | undefined = await this.validateNameCallback(\n      this.#nameEl.value\n    );\n    if (!!nameValidation) {\n      // name is invalid\n      this.#validateNameHandler(nameValidation);\n      return;\n    }\n\n    const data: NewObjectData = {\n      typeId: this.selectedType?.id,\n      name: this.#nameEl.value,\n      description: !this.#descriptionModifiedByUser\n        ? undefined\n        : this.#descriptionEl.value,\n      moduleId: this.#moduleFolderEl?.value?.id\n    };\n    const result = await this.createCallback(data);\n    this.#validateNameHandler(result);\n  };\n\n  #descriptionValueHandler = () => {\n    if (this.#nameModifiedByUser || this.#descriptionModifiedByUser) {\n      return this.#descriptionEl.value;\n    } else {\n      // First try to get suggested description if callback exists\n      if (this.suggestCallback) {\n        return this.description ?? this.selectedType.name;\n      }\n      return this.selectedType.name;\n    }\n  };\n\n  /**\n   * Resolves the suggested name based on the context\n   * @param selectedType The currently selected type\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #resolveNameSuggestion = async (selectedType: TypeData, suggestedName?: string) => {\n    if (suggestedName) {\n        return suggestedName.replace(/\\s/g, \"\");\n    }\n    return selectedType.name.replace(/\\s/g, \"\");\n  };\n\n  /**\n   * Gets the suggested description based on the context\n   * @param selectedType The currently selected type\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #resolveDescriptionSuggestion = async (selectedType: TypeData, suggestedDescription?: string) => {\n    if (suggestedDescription) {\n        return suggestedDescription;\n    }\n    return selectedType.name;\n  };\n\n  /**\n   * Updates both name and description suggestions\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #updateSuggestions = async () => {\n    if (!this.selectedType) {\n      return;\n    }\n\n    if (this.#nameModifiedByUser && this.#descriptionModifiedByUser)\n      return;\n\n    const suggestions = await this.suggestCallback(this.selectedType.id);\n\n    if (!this.#nameModifiedByUser) {\n      this.name = await this.#resolveNameSuggestion(this.selectedType, suggestions.name);\n    }\n\n    if (!this.#descriptionModifiedByUser) {\n      this.description = await this.#resolveDescriptionSuggestion(\n        this.selectedType, \n        suggestions.description\n      );\n    }\n  };\n\n  /**\n   * This method defines the initial selected category and type, and it then\n   * initializes the name and description values.\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #init = async () => {\n    const defaultTypeFound = this.#setDefaultType(this.defaultTypeId);\n    if (!defaultTypeFound) {\n      this.selectedCategory = this.typeCategories[0];\n      this.selectedType = this.selectedCategory.types[0];\n    }\n\n    await this.#updateSuggestions();\n  };\n\n  /**\n   * Initializes the selectedTypeMap with the defaultTypeId if it exists, otherwise\n   * it initializes the selectedTypeMap with the first type of each category.\n   */\n  // eslint-disable-next-line @stencil-community/own-methods-must-be-private\n  #initializeSelectedTypeMap() {\n    this.typeCategories.forEach(category => {\n      if (this.defaultTypeId && category.id === this.selectedCategory.id) {\n        this.selectedTypeMap.set(category.id, this.selectedType.id);\n      } else {\n        this.selectedTypeMap.set(category.id, category.types[0].id);\n      }\n    });\n  }\n\n  #onBlurNameHandler = async () => {\n    if (this.#nameEl.value) {\n      const result: string | undefined = await this.validateNameCallback(\n        this.#nameEl.value\n      );\n      this.#validateNameHandler(result);\n    }\n  };\n\n  #onInputDescriptionHandler = (e: CustomEvent<string>) => {\n    this.description = e.detail;\n    this.#descriptionModifiedByUser = true;\n  };\n\n  #onInputNameHandler = async (e: CustomEvent<any> | InputEvent) => {\n    const name = e.detail;\n    if (!this.#descriptionModifiedByUser) {\n      // Description should be equal to name, unless the description was already\n      // modified by the user.\n      this.#descriptionEl.value = name;\n    }\n    this.#nameModifiedByUser = true;\n  };\n\n  #onNameValueChangedHandler = async (e: CustomEvent<string>) => {\n    const name = e.detail;\n    if (name) {\n      const result: string | undefined = await this.validateNameCallback(name);\n      this.#validateNameHandler(result);\n    }\n  };\n\n  #renderModuleFolder = () => {\n    if (this.selectedType.hasModule || this.selectedType.hasFolder) {\n      let labelDescription = this.#componentLocale.moduleFolder;\n      if (!this.selectedType.hasFolder) {\n        labelDescription = this.#componentLocale.moduleOnly;\n      } else if (!this.selectedType.hasModule) {\n        labelDescription = this.#componentLocale.folderOnly;\n      }\n      return [\n        <label\n          // Module/folder\n          class=\"label api-module-label\"\n          htmlFor=\"module\"\n        >\n          {labelDescription}\n        </label>,\n        <gx-ide-entity-selector\n          id=\"module\"\n          class=\"api-module-control\"\n          part=\"module\"\n          labelPosition=\"none\"\n          value={this.parent}\n          defaultValue={this.defaultParent}\n          selectEntityCallback={this.selectModuleCallback}\n          ref={(el: HTMLGxIdeEntitySelectorElement) =>\n            (this.#moduleFolderEl = el as HTMLGxIdeEntitySelectorElement)\n          }\n        ></gx-ide-entity-selector>\n      ];\n    }\n    return null;\n  };\n\n  #setDefaultType = (typeId: string | undefined): boolean => {\n    if (!typeId) {\n      return false;\n    }\n    let found = false;\n    outerLoop: for (let i = 0; i < this.typeCategories.length; i++) {\n      for (let j = 0; j < this.typeCategories[i].types.length; j++) {\n        const loopTypeId = this.typeCategories[i].types[j].id;\n        if (loopTypeId === typeId) {\n          this.selectedCategory = this.typeCategories[i];\n          this.selectedType = this.typeCategories[i].types[j];\n          found = true;\n          break outerLoop;\n        }\n      }\n    }\n    return found;\n  };\n\n  #setSelectedCategoryOnActionList = () => {\n    if (this.selectedCategory) {\n      // update model by setting the selected category\n      this.#categoriesActionListEl.updateItemProperties(\n        this.selectedCategory.id,\n        {\n          selected: true,\n          type: \"actionable\"\n        }\n      );\n    }\n  };\n\n  #typeChangedHandler = async (\n    selectionEvent: CustomEvent<ActionListItemModelExtended[]>\n  ) => {\n    const selection = selectionEvent.detail;\n    if (selection.length > 0) {\n      this.selectedType = this.selectedCategory.types.find(\n        type => type.id === selection[0].item.id\n      );\n      this.selectedTypeMap.set(this.selectedCategory.id, this.selectedType.id);\n\n      await this.#updateSuggestions();\n    }\n  };\n\n  /**\n   * If the parameter is undefined, it means the name is valid. Otherwise, if it\n   * receives a string, it indicates that the name is not valid. The string is the\n   * error message to display.\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #validateNameHandler = (result: string | undefined): void => {\n    this.nameValidationErrorMessage = result;\n  };\n\n  render() {\n    return (\n      <Host class=\"widget\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <ch-shortcuts\n          src={this.#shortcutsSrc}\n          ref={(el: HTMLChShortcutsElement) =>\n            (this.#chShortcutsEl = el as HTMLChShortcutsElement)\n          }\n        ></ch-shortcuts>\n\n        <section class=\"main\">\n          <section class=\"field-group categories-types-layout spacing-body-inline spacing-body-block-start\">\n            <div class=\"field field-block\">\n              <label class=\"label\">\n                {this.#componentLocale.categorySelectionTitle}\n              </label>\n              <ch-action-list-render\n                // #select a category\n                // TODO: The \"scrollable\" class is a WA since the action-list currently does not support scrollbar customization\n                class=\"list-box\"\n                selection=\"single\"\n                model={this.typeCategoriesActionListModel}\n                sortItemsCallback={sortActionListDefault}\n                onSelectedItemsChange={this.#categoryOnSelectionChangedHandler}\n                ref={(el: HTMLChActionListRenderElement) =>\n                  (this.#categoriesActionListEl =\n                    el as HTMLChActionListRenderElement)\n                }\n              ></ch-action-list-render>\n            </div>\n\n            <div class=\"field field-block\">\n              <label class=\"label\">\n                {this.selectedCategory.name\n                  ? `${this.selectedCategory.name} ${\n                      this.#componentLocale.typeSelectionTitleSuffix\n                    }`\n                  : this.#componentLocale.typeSelectionTitle}\n              </label>\n              <ch-action-list-render\n                // #data management types\n                // TODO: The \"scrollable\" class is a WA since the action-list currently does not support scrollbar customization\n                class=\"list-box\"\n                selection=\"single\"\n                sortItemsCallback={sortActionListDefault}\n                model={mapTypeDataToActionListModel(\n                  this.selectedCategory.types,\n                  this.selectedCategory.id,\n                  this.selectedType.id\n                )}\n                onSelectedItemsChange={this.#typeChangedHandler}\n              ></ch-action-list-render>\n            </div>\n          </section>\n\n          <section class=\"api-description-layout field-group-justified-start spacing-body-inline\">\n            <h2\n              // API Description\n              class=\"text-align-center api-description-title subtitle-regular-xs\t\"\n            >\n              {this.selectedType?.description}\n            </h2>\n\n            <label\n              // Name\n              class=\"label api-name-label\"\n              htmlFor=\"name\"\n            >\n              {this.#componentLocale.objectName}\n            </label>\n            <div>\n              <ch-edit\n                autoFocus\n                class={{\n                  \"input\": true,\n                  \"api-name-control\": true,\n                  \"input-error\": !!this.nameValidationErrorMessage\n                }}\n                placeholder=\"Name\"\n                value={this.name}\n                ref={(el: HTMLChEditElement) =>\n                  (this.#nameEl = el as HTMLChEditElement)\n                }\n                onChange={this.#onNameValueChangedHandler}\n                onInput={this.#onInputNameHandler as any}\n                onBlur={this.#onBlurNameHandler}\n                part=\"name\"\n              ></ch-edit>\n              {this.nameValidationErrorMessage && (\n                <ch-tooltip\n                  class=\"tooltip\"\n                  actionElement={this.#nameEl as unknown as HTMLButtonElement}\n                  blockAlign={config.tooltipSettings.blockAlign}\n                  inlineAlign={config.tooltipSettings.inlineAlign}\n                  delay={config.tooltipSettings.delay}\n                >\n                  {this.nameValidationErrorMessage}\n                </ch-tooltip>\n              )}\n            </div>\n\n            <label\n              // Description\n              class=\"label api-description-label\"\n              htmlFor=\"description\"\n            >\n              {this.#componentLocale.objectDescription}\n            </label>\n            <ch-edit\n              autoFocus\n              class=\"input api-description-control\"\n              placeholder=\"Description\"\n              value={this.#descriptionValueHandler()}\n              // TODO: toolTip={config.tooltip}\n              ref={(el: HTMLChEditElement) =>\n                (this.#descriptionEl = el as HTMLChEditElement)\n              }\n              onInput={this.#onInputDescriptionHandler as any}\n              part=\"description\"\n            ></ch-edit>\n\n            {this.#renderModuleFolder()}\n          </section>\n          <footer class=\"footer dialog-footer-with-border spacing-body-inline spacing-body-block-end \">\n            <div class=\"buttons-spacer\">\n              <button\n                // cancel\n                class=\"button-secondary\"\n                onClick={this.#cancelCallbackHandler}\n                part=\"button button-cancel\"\n              >\n                {this.#componentLocale.footer.btnCancel}\n              </button>\n\n              <button\n                // create\n                class=\"button-primary\"\n                onClick={this.#createCallbackHandler}\n                disabled={!!this.nameValidationErrorMessage}\n                part=\"button button-create\"\n              >\n                {this.#componentLocale.footer.btnCreate}\n              </button>\n            </div>\n          </footer>\n        </section>\n      </Host>\n    );\n  }\n}\n\nexport interface NewObjectData {\n  typeId: string;\n  name: string;\n  description: string | undefined;\n  moduleId: string;\n}\n\nexport type ValidateNameCallback = (\n  name: string\n) => Promise<string | undefined>;\n\nexport type SelectModuleCallback = () => Promise<EntityData | undefined>;\n\nexport type CreateCallback = (\n  data: NewObjectData\n) => Promise<string | undefined>;\n\nexport type CancelCallback = () => Promise<void>;\n\nexport type TypeCategoryData = {\n  id: string;\n  name: string;\n  icon: string;\n  types: TypeData[];\n};\n\nexport type TypeData = {\n  id: string;\n  name: string;\n  icon: string;\n  hasModule: boolean;\n  hasFolder: boolean;\n  description: string;\n};\n\nexport type SuggestData = {\n  name: string | undefined;\n  description: string | undefined;\n}\n\nexport type SuggestCallback = (typeId:string) => Promise<SuggestData | undefined>;"],"mappings":"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"}

package/dist/genexus-ide-ui/p-7452f3e9.entry.js

@@ -0,0 +1,105 @@
+import { r as i, c as t, h as e, H as n, a } from "./p-9b9ccd0c.js";
+
+const o = ":host{display:grid;block-size:100%}.opacity-0{opacity:0}.gxi-hidden{display:none !important}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.overflow-auto{overflow:auto}:host(.gx-ide-component){height:100% !important;display:flex !important;flex-direction:column !important}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--font-style-regular);font-size:var(--font-size-body-m);font-family:var(--font-family-body);height:100%;display:flex;flex-direction:column;flex-grow:1;box-sizing:border-box}.buttons-container{display:flex;gap:var(--spacing-gap-m)}.giu-static-pill-icon-and-text,.giu-static-pill{background-color:var(--elevation-background-color, var(--color-accent-surface-elevation-1));padding-inline:var(--spacing-padding-m);color:var(--color-text-neutral-default);font-size:var(--font-size-body-s);line-height:var(--line-height-relaxed);font-weight:var(--font-style-regular);border-radius:4px;min-block-size:25px;display:inline-grid;align-items:center;pointer-events:none;inline-size:max-content}.giu-static-pill-icon-and-text{display:inline-grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--spacing-gap-m)}.tab-full-width-buttons::part(tab-list block-start),.tab-full-width-buttons::part(tab-list block-end){grid-auto-columns:1fr}.tab-full-width-buttons::part(tab block-start){justify-content:center}.tree-view::part(item__header){--icon__system_warning_warning--disabled:var(\n    --icon__system_warning_warning--enabled\n  )}.tabular-grid{--focus-outline-width:1px}:host(.breadcrumb){display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-gap-xs);margin:0;padding-block:var(--spacing-padding-xs);padding-inline:0;list-style:none}.list{display:contents}.list-item{display:inline-flex;align-items:center;gap:var(--spacing-gap-xs);list-style:none}.separator{color:var(--color-text-neutral-subtle);padding-inline:var(--spacing-padding-xs);user-select:none;pointer-events:none;opacity:0.85}";
+
+var s = undefined && undefined.__classPrivateFieldGet || function(i, t, e, n) {
+  if (e === "a" && !n) throw new TypeError("Private accessor was defined without a getter");
+  if (typeof t === "function" ? i !== t || !n : !t.has(i)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+  return e === "m" ? n : e === "a" ? n.call(i) : n ? n.value : t.get(i);
+};
+
+var r, l;
+
+const d = [ "resets/box-sizing", "components/icon", "utils/link", "utils/typography", "utils/spacing" ];
+
+const c = {
+  link: {
+    url: undefined
+  }
+};
+
+const u = class {
+  constructor(e) {
+    i(this, e);
+    this.hyperlinkClick = t(this, "hyperlinkClick", 7);
+    this.buttonClick = t(this, "buttonClick", 7);
+    r.set(this, (i => {
+      var t, e, n, a, o;
+      if (!this.selectedLinkIndicator) return false;
+      const s = (t = this.selectedLink) !== null && t !== void 0 ? t : c;
+      const r = s.id !== undefined && i.id === s.id;
+      const l = ((e = s.link) === null || e === void 0 ? void 0 : e.url) !== undefined && ((n = s.link) === null || n === void 0 ? void 0 : n.url) !== "" && ((a = i.link) === null || a === void 0 ? void 0 : a.url) === ((o = s.link) === null || o === void 0 ? void 0 : o.url);
+      return r || l;
+    }));
+    l.set(this, (i => {
+      var t, e, n, a, o;
+      if (this.disabled) return;
+      const s = i.target;
+      const r = (t = s.closest) === null || t === void 0 ? void 0 : t.call(s, "gx-ide-breadcrumb-item");
+      if (!r) return;
+      const l = (e = r.getAttribute) === null || e === void 0 ? void 0 : e.call(r, "data-item-id");
+      const d = ((n = r.getAttribute) === null || n === void 0 ? void 0 : n.call(r, "data-has-link")) === "true";
+      if (!l || !this.model) return;
+      const c = this.model.find((i => i.id === l));
+      if (!c) return;
+      if (d) {
+        i.preventDefault();
+        (a = this.hyperlinkClick) === null || a === void 0 ? void 0 : a.emit(c);
+        return;
+      }
+      (o = this.buttonClick) === null || o === void 0 ? void 0 : o.emit(c);
+    }));
+    this.model = undefined;
+    this.accessibleName = undefined;
+    this.disabled = false;
+    this.separator = "›";
+    this.selectedLink = c;
+    this.selectedLinkIndicator = false;
+    this.getImagePathCallback = undefined;
+  }
+  render() {
+    var i, t;
+    const a = (i = this.model) !== null && i !== void 0 ? i : [];
+    const o = this.separator;
+    const c = (t = this.accessibleName) !== null && t !== void 0 ? t : undefined;
+    return e(n, {
+      class: "breadcrumb",
+      role: "navigation",
+      "aria-label": c
+    }, e("ch-theme", {
+      model: d
+    }), e("ol", {
+      class: "list",
+      onClick: s(this, l, "f")
+    }, a.map(((i, t) => e("li", {
+      key: i.id,
+      class: "list-item",
+      role: "presentation"
+    }, e("gx-ide-breadcrumb-item", {
+      itemId: i.id,
+      model: i,
+      caption: i.caption,
+      accessibleName: i.accessibleName,
+      disabled: this.disabled || i.disabled,
+      link: i.link,
+      selected: s(this, r, "f").call(this, i),
+      selectedLinkIndicator: this.selectedLinkIndicator,
+      startImgSrc: i.startImgSrc,
+      startImgType: i.startImgType,
+      getImagePathCallback: this.getImagePathCallback
+    }), t < a.length - 1 && e("span", {
+      class: "separator body-regular-s",
+      "aria-hidden": "true"
+    }, o))))));
+  }
+  get el() {
+    return a(this);
+  }
+};
+
+r = new WeakMap, l = new WeakMap;
+
+u.style = o;
+
+export { u as gx_ide_breadcrumb };
+//# sourceMappingURL=p-7452f3e9.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["breadcrumbCss","CSS_BUNDLES","DEFAULT_SELECTED_LINK","link","url","undefined","GxIdeBreadcrumb","_GxIdeBreadcrumb_isItemSelected","set","this","item","selectedLinkIndicator","sel","_a","selectedLink","matchById","id","matchByUrl","_b","_c","_d","_e","_GxIdeBreadcrumb_handleListClick","event","disabled","target","itemEl","closest","call","itemId","getAttribute","hasLink","model","find","i","preventDefault","hyperlinkClick","emit","buttonClick","render","items","separator","ariaLabel","accessibleName","h","Host","class","role","onClick","__classPrivateFieldGet","map","index","key","caption","selected","startImgSrc","startImgType","getImagePathCallback","length"],"sources":["src/components/breadcrumb/breadcrumb.scss?tag=gx-ide-breadcrumb&encapsulation=shadow","src/components/breadcrumb/breadcrumb.tsx"],"sourcesContent":["@import \"../../global/gx-ide-common\";\n\n:host(.breadcrumb) {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--spacing-gap-xs);\n  margin: 0;\n  padding-block: var(--spacing-padding-xs);\n  padding-inline: 0;\n  list-style: none;\n}\n\n.list {\n  display: contents;\n}\n\n.list-item {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--spacing-gap-xs);\n  list-style: none;\n}\n\n.separator {\n  color: var(--color-text-neutral-subtle);\n  padding-inline: var(--spacing-padding-xs);\n  user-select: none;\n  pointer-events: none;\n  opacity: 0.85;\n}\n","import {\n  Component,\n  Host,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  h\n} from \"@stencil/core\";\nimport { MercuryBundles } from \"@genexus/mercury\";\nimport type {\n  BreadcrumbModel,\n  BreadcrumbItemModel,\n  SelectedLink,\n  GetImagePathCallback\n} from \"./types\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/icon\",\n  \"utils/link\",\n  \"utils/typography\",\n  \"utils/spacing\"\n];\n\nconst DEFAULT_SELECTED_LINK: SelectedLink = { link: { url: undefined } };\n\n@Component({\n  tag: \"gx-ide-breadcrumb\",\n  styleUrl: \"breadcrumb.scss\",\n  shadow: true\n})\nexport class GxIdeBreadcrumb {\n  @Element() el: HTMLGxIdeBreadcrumbElement;\n\n  /**\n   * List of breadcrumb items to display.\n   */\n  @Prop() readonly model?: BreadcrumbModel;\n\n  /**\n   * aria-label for the navigation container (accessible-name attribute).\n   */\n  @Prop({ attribute: \"accessible-name\" }) readonly accessibleName?: string;\n\n  /**\n   * When true, disables all interaction with the breadcrumb.\n   */\n  @Prop({ reflect: true }) readonly disabled: boolean = false;\n\n  /**\n   * Text shown between items. Examples: \"›\" (recommended), \"/\", \">\", \"·\", \"•\".\n   * Default \"›\" (single right-pointing angle quotation mark, U+203A).\n   */\n  @Prop() readonly separator: string = \"›\";\n\n  /**\n   * Currently selected link (for highlighting the current page).\n   */\n  @Prop() readonly selectedLink: SelectedLink = DEFAULT_SELECTED_LINK;\n\n  /**\n   * When true, show visual indicator on the item matching selectedLink (selected-link-indicator attribute).\n   */\n  @Prop({ attribute: \"selected-link-indicator\" })\n  readonly selectedLinkIndicator: boolean = false;\n\n  /**\n   * Optional callback to resolve image path for each item.\n   */\n  @Prop() readonly getImagePathCallback?: GetImagePathCallback;\n\n  /**\n   * Fired when the user clicks an item that has a link.\n   */\n  @Event() readonly hyperlinkClick?: EventEmitter<BreadcrumbItemModel>;\n\n  /**\n   * Fired when the user clicks an item without a link (button).\n   */\n  @Event() readonly buttonClick?: EventEmitter<BreadcrumbItemModel>;\n\n  #isItemSelected = (item: BreadcrumbItemModel): boolean => {\n    if (!this.selectedLinkIndicator) return false;\n    const sel = this.selectedLink ?? DEFAULT_SELECTED_LINK;\n    const matchById = sel.id !== undefined && item.id === sel.id;\n    const matchByUrl =\n      sel.link?.url !== undefined &&\n      sel.link?.url !== \"\" &&\n      item.link?.url === sel.link?.url;\n    return matchById || matchByUrl;\n  };\n\n  #handleListClick = (event: MouseEvent) => {\n    if (this.disabled) return;\n    const target = event.target as HTMLElement;\n    const itemEl = target.closest?.(\"gx-ide-breadcrumb-item\") as\n      | HTMLElement\n      | undefined;\n    if (!itemEl) return;\n    const itemId = itemEl.getAttribute?.(\"data-item-id\");\n    const hasLink = itemEl.getAttribute?.(\"data-has-link\") === \"true\";\n    if (!itemId || !this.model) return;\n    const item = this.model.find(i => i.id === itemId);\n    if (!item) return;\n\n    if (hasLink) {\n      event.preventDefault();\n      this.hyperlinkClick?.emit(item);\n      return;\n    }\n\n    this.buttonClick?.emit(item);\n  };\n\n  render() {\n    const items = this.model ?? [];\n    const separator = this.separator;\n    const ariaLabel = this.accessibleName ?? undefined;\n\n    return (\n      <Host class=\"breadcrumb\" role=\"navigation\" aria-label={ariaLabel}>\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <ol class=\"list\" onClick={this.#handleListClick}>\n          {items.map((item, index) => (\n            <li key={item.id} class=\"list-item\" role=\"presentation\">\n              <gx-ide-breadcrumb-item\n                itemId={item.id}\n                model={item}\n                caption={item.caption}\n                accessibleName={item.accessibleName}\n                disabled={this.disabled || item.disabled}\n                link={item.link}\n                selected={this.#isItemSelected(item)}\n                selectedLinkIndicator={this.selectedLinkIndicator}\n                startImgSrc={item.startImgSrc}\n                startImgType={item.startImgType}\n                getImagePathCallback={this.getImagePathCallback}\n              />\n              {index < items.length - 1 && (\n                <span class=\"separator body-regular-s\" aria-hidden=\"true\">\n                  {separator}\n                </span>\n              )}\n            </li>\n          ))}\n        </ol>\n      </Host>\n    );\n  }\n}\n"],"mappings":";;AAAA,MAAMA,IAAgB;;;;;;;;;;ACiBtB,MAAMC,IAA8B,EAClC,qBACA,mBACA,cACA,oBACA;;AAGF,MAAMC,IAAsC;EAAEC,MAAM;IAAEC,KAAKC;;;;MAO9CC,IAAe;;;;;IAkD1BC,EAAAC,IAAAC,OAAmBC;;MACjB,KAAKD,KAAKE,uBAAuB,OAAO;MACxC,MAAMC,KAAMC,IAAAJ,KAAKK,kBAAY,QAAAD,WAAA,IAAAA,IAAIX;MACjC,MAAMa,IAAYH,EAAII,OAAOX,aAAaK,EAAKM,OAAOJ,EAAII;MAC1D,MAAMC,MACJC,IAAAN,EAAIT,UAAI,QAAAe,WAAA,aAAAA,EAAEd,SAAQC,eAClBc,IAAAP,EAAIT,UAAI,QAAAgB,WAAA,aAAAA,EAAEf,SAAQ,QAClBgB,IAAAV,EAAKP,UAAI,QAAAiB,WAAA,aAAAA,EAAEhB,WAAQiB,IAAAT,EAAIT,UAAI,QAAAkB,WAAA,aAAAA,EAAEjB;MAC/B,OAAOW,KAAaE;AAAU;IAGhCK,EAAAd,IAAAC,OAAoBc;;MAClB,IAAId,KAAKe,UAAU;MACnB,MAAMC,IAASF,EAAME;MACrB,MAAMC,KAASb,IAAAY,EAAOE,aAAO,QAAAd,WAAA,aAAAA,EAAAe,KAAAH,GAAG;MAGhC,KAAKC,GAAQ;MACb,MAAMG,KAASX,IAAAQ,EAAOI,kBAAY,QAAAZ,WAAA,aAAAA,EAAAU,KAAAF,GAAG;MACrC,MAAMK,MAAUZ,IAAAO,EAAOI,kBAAY,QAAAX,WAAA,aAAAA,EAAAS,KAAAF,GAAG,sBAAqB;MAC3D,KAAKG,MAAWpB,KAAKuB,OAAO;MAC5B,MAAMtB,IAAOD,KAAKuB,MAAMC,MAAKC,KAAKA,EAAElB,OAAOa;MAC3C,KAAKnB,GAAM;MAEX,IAAIqB,GAAS;QACXR,EAAMY;SACNf,IAAAX,KAAK2B,oBAAc,QAAAhB,WAAA,aAAAA,EAAEiB,KAAK3B;QAC1B;;OAGFW,IAAAZ,KAAK6B,iBAAW,QAAAjB,WAAA,aAAAA,EAAEgB,KAAK3B;AAAK;;;oBAhEwB;qBAMjB;wBAKSR;iCAMJ;;;EAkD1C,MAAAqC;;IACE,MAAMC,KAAQ3B,IAAAJ,KAAKuB,WAAK,QAAAnB,WAAA,IAAAA,IAAI;IAC5B,MAAM4B,IAAYhC,KAAKgC;IACvB,MAAMC,KAAYxB,IAAAT,KAAKkC,oBAAc,QAAAzB,WAAA,IAAAA,IAAIb;IAEzC,OACEuC,EAACC,GAAI;MAACC,OAAM;MAAaC,MAAK;MAAY,cAAaL;OACrDE,EAAA;MAAUZ,OAAO/B;QACjB2C,EAAA;MAAIE,OAAM;MAAOE,SAASC,EAAAxC,MAAIa,GAAA;OAC3BkB,EAAMU,KAAI,CAACxC,GAAMyC,MAChBP,EAAA;MAAIQ,KAAK1C,EAAKM;MAAI8B,OAAM;MAAYC,MAAK;OACvCH,EAAA;MACEf,QAAQnB,EAAKM;MACbgB,OAAOtB;MACP2C,SAAS3C,EAAK2C;MACdV,gBAAgBjC,EAAKiC;MACrBnB,UAAUf,KAAKe,YAAYd,EAAKc;MAChCrB,MAAMO,EAAKP;MACXmD,UAAUL,EAAAxC,MAAIF,GAAA,KAAgBqB,KAApBnB,MAAqBC;MAC/BC,uBAAuBF,KAAKE;MAC5B4C,aAAa7C,EAAK6C;MAClBC,cAAc9C,EAAK8C;MACnBC,sBAAsBhD,KAAKgD;QAE5BN,IAAQX,EAAMkB,SAAS,KACtBd,EAAA;MAAME,OAAM;MAA0B,eAAa;OAChDL"}

package/dist/genexus-ide-ui/p-be7a6b7f.entry.js

@@ -0,0 +1,145 @@
+import { r as i, h as t, H as e } from "./p-9b9ccd0c.js";
+
+const n = ":host{display:grid;block-size:100%}.opacity-0{opacity:0}.gxi-hidden{display:none !important}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.overflow-auto{overflow:auto}:host(.gx-ide-component){height:100% !important;display:flex !important;flex-direction:column !important}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--font-style-regular);font-size:var(--font-size-body-m);font-family:var(--font-family-body);height:100%;display:flex;flex-direction:column;flex-grow:1;box-sizing:border-box}.buttons-container{display:flex;gap:var(--spacing-gap-m)}.giu-static-pill-icon-and-text,.giu-static-pill{background-color:var(--elevation-background-color, var(--color-accent-surface-elevation-1));padding-inline:var(--spacing-padding-m);color:var(--color-text-neutral-default);font-size:var(--font-size-body-s);line-height:var(--line-height-relaxed);font-weight:var(--font-style-regular);border-radius:4px;min-block-size:25px;display:inline-grid;align-items:center;pointer-events:none;inline-size:max-content}.giu-static-pill-icon-and-text{display:inline-grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--spacing-gap-m)}.tab-full-width-buttons::part(tab-list block-start),.tab-full-width-buttons::part(tab-list block-end){grid-auto-columns:1fr}.tab-full-width-buttons::part(tab block-start){justify-content:center}.tree-view::part(item__header){--icon__system_warning_warning--disabled:var(\n    --icon__system_warning_warning--enabled\n  )}.tabular-grid{--focus-outline-width:1px}:host{display:inline-grid}.item-content{display:inline-flex;align-items:center;gap:var(--spacing-gap-xs)}.action{display:inline-flex;align-items:center;gap:var(--spacing-gap-xs);padding-block:var(--spacing-padding-xxs);padding-inline:var(--spacing-padding-xs);border:none;border-radius:4px;background:transparent;text-decoration:none;cursor:pointer;font:inherit;}.action:not(a){color:var(--color-text-interactive-default)}.action:hover:not(.disabled){background-color:var(--color-accent-surface-elevation-1-hover)}.action:not(a):hover:not(.disabled){color:var(--color-text-interactive-hover)}.action:focus-visible{outline:2px solid var(--color-border-focus-default);outline-offset:-2px}.action.disabled{color:var(--color-text-neutral-disabled);cursor:not-allowed}.action.selected{color:var(--color-text-primary-default)}.caption{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item__img{flex-shrink:0;background-size:contain;background-repeat:no-repeat;background-position:center}.item__img:not(.item__img-icon){inline-size:var(--icon-s);block-size:var(--icon-s)}.item__img--mask{background-color:currentColor;background-size:contain;background-repeat:no-repeat;background-position:center}";
+
+var a = undefined && undefined.__classPrivateFieldGet || function(i, t, e, n) {
+  if (e === "a" && !n) throw new TypeError("Private accessor was defined without a getter");
+  if (typeof t === "function" ? i !== t || !n : !t.has(i)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+  return e === "m" ? n : e === "a" ? n.call(i) : n ? n.value : t.get(i);
+};
+
+var o, r, s, l;
+
+const d = class {
+  constructor(e) {
+    i(this, e);
+    o.set(this, (() => {
+      var i, t;
+      if (this.getImagePathCallback) {
+        const i = this.getImagePathCallback(this.model);
+        if (i === null || i === void 0 ? void 0 : i.base) return i.base;
+      }
+      return (i = this.startImgSrc) !== null && i !== void 0 ? i : (t = this.model) === null || t === void 0 ? void 0 : t.startImgSrc;
+    }));
+    r.set(this, (() => {
+      var i, t, e;
+      return (e = (i = this.caption) !== null && i !== void 0 ? i : (t = this.model) === null || t === void 0 ? void 0 : t.caption) !== null && e !== void 0 ? e : "";
+    }));
+    s.set(this, (() => {
+      var i, t, e, n;
+      return (n = (e = (i = this.accessibleName) !== null && i !== void 0 ? i : (t = this.model) === null || t === void 0 ? void 0 : t.accessibleName) !== null && e !== void 0 ? e : a(this, r, "f").call(this)) !== null && n !== void 0 ? n : "";
+    }));
+    l.set(this, (() => {
+      var i, e;
+      const n = a(this, o, "f").call(this);
+      if (!n) return undefined;
+      const r = (i = this.startImgType) !== null && i !== void 0 ? i : (e = this.model) === null || e === void 0 ? void 0 : e.startImgType;
+      const s = n.trim().toLowerCase().startsWith("url(");
+      if (s && (r === "background" || r === "mask")) {
+        return t("span", {
+          class: {
+            item__img: true,
+            "item__img--background": r === "background",
+            "item__img--mask": r === "mask"
+          },
+          style: r === "background" ? {
+            backgroundImage: n
+          } : {
+            maskImage: n,
+            WebkitMaskImage: n
+          },
+          "aria-hidden": "true"
+        });
+      }
+      return t("ch-image", {
+        class: "item__img item__img-icon icon-m",
+        src: n,
+        "aria-hidden": "true"
+      });
+    }));
+    this.model = undefined;
+    this.caption = undefined;
+    this.accessibleName = undefined;
+    this.disabled = undefined;
+    this.link = undefined;
+    this.selected = false;
+    this.selectedLinkIndicator = false;
+    this.startImgSrc = undefined;
+    this.startImgType = undefined;
+    this.getImagePathCallback = undefined;
+    this.itemId = undefined;
+  }
+  render() {
+    var i, n, o, d, c;
+    const u = a(this, r, "f").call(this);
+    const p = a(this, s, "f").call(this);
+    const h = (o = (i = this.disabled) !== null && i !== void 0 ? i : (n = this.model) === null || n === void 0 ? void 0 : n.disabled) !== null && o !== void 0 ? o : false;
+    const g = ((d = this.link) === null || d === void 0 ? void 0 : d.url) !== undefined && ((c = this.link) === null || c === void 0 ? void 0 : c.url) !== "";
+    const f = a(this, l, "f").call(this);
+    const m = {
+      caption: true,
+      "body-regular-s": !this.selected || !this.selectedLinkIndicator,
+      "body-semi-bold-s": this.selected && this.selectedLinkIndicator
+    };
+    const v = t("span", {
+      class: "item-content"
+    }, f, u ? t("span", {
+      class: m,
+      part: "item-caption"
+    }, u) : null);
+    const b = {
+      action: true,
+      disabled: h,
+      selected: this.selected && this.selectedLinkIndicator,
+      "not-selected": !this.selected
+    };
+    if (g && !h) {
+      return t(e, {
+        role: "listitem",
+        "data-item-id": this.itemId,
+        "data-has-link": "true",
+        part: "item-action item-link"
+      }, t("a", {
+        class: Object.assign(Object.assign({}, b), {
+          "link-primary": true
+        }),
+        href: this.link.url,
+        "aria-current": this.selected ? "page" : undefined,
+        "aria-label": p || undefined,
+        part: "item-link"
+      }, v));
+    }
+    if (g && h) {
+      return t(e, {
+        role: "listitem",
+        "data-item-id": this.itemId,
+        "data-has-link": "true",
+        part: "item-action disabled"
+      }, t("span", {
+        class: b,
+        "aria-disabled": "true",
+        "aria-label": p || undefined,
+        part: "item-link disabled"
+      }, v));
+    }
+    return t(e, {
+      role: "listitem",
+      "data-item-id": this.itemId,
+      "data-has-link": "false",
+      part: "item-action item-button"
+    }, t("button", {
+      type: "button",
+      class: b,
+      disabled: h,
+      "aria-label": p || undefined,
+      part: "item-button"
+    }, v));
+  }
+};
+
+o = new WeakMap, r = new WeakMap, s = new WeakMap, l = new WeakMap;
+
+d.style = n;
+
+export { d as gx_ide_breadcrumb_item };
+//# sourceMappingURL=p-be7a6b7f.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["breadcrumbItemCss","GxIdeBreadcrumbItem","_GxIdeBreadcrumbItem_resolveImageSrc","set","this","getImagePathCallback","result","model","base","_a","startImgSrc","_b","_GxIdeBreadcrumbItem_getCaption","_c","caption","_GxIdeBreadcrumbItem_getAccessibleName","_d","accessibleName","__classPrivateFieldGet","call","_GxIdeBreadcrumbItem_renderStartImage","src","undefined","type","startImgType","isUrl","trim","toLowerCase","startsWith","h","class","item__img","style","backgroundImage","maskImage","WebkitMaskImage","render","ariaLabel","isDisabled","disabled","hasLink","link","url","_e","imgContent","captionClass","selected","selectedLinkIndicator","content","part","actionClass","action","Host","role","itemId","Object","assign","href"],"sources":["src/components/breadcrumb/breadcrumb-item/breadcrumb-item.scss?tag=gx-ide-breadcrumb-item&encapsulation=shadow","src/components/breadcrumb/breadcrumb-item/breadcrumb-item.tsx"],"sourcesContent":["@import \"../../../global/gx-ide-common\";\n\n:host {\n  display: inline-grid;\n}\n\n.item-content {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--spacing-gap-xs);\n}\n\n.action {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--spacing-gap-xs);\n  padding-block: var(--spacing-padding-xxs);\n  padding-inline: var(--spacing-padding-xs);\n  border: none;\n  border-radius: 4px;\n  background: transparent;\n  text-decoration: none;\n  cursor: pointer;\n  font: inherit;\n\n  /* Color for button only; links use Mercury .link-primary */\n  &:not(a) {\n    color: var(--color-text-interactive-default);\n  }\n\n  &:hover:not(.disabled) {\n    background-color: var(--color-accent-surface-elevation-1-hover);\n  }\n\n  &:not(a):hover:not(.disabled) {\n    color: var(--color-text-interactive-hover);\n  }\n\n  &:focus-visible {\n    outline: 2px solid var(--color-border-focus-default);\n    outline-offset: -2px;\n  }\n\n  &.disabled {\n    color: var(--color-text-neutral-disabled);\n    cursor: not-allowed;\n  }\n\n  &.selected {\n    color: var(--color-text-primary-default);\n  }\n}\n\n.caption {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.item__img {\n  flex-shrink: 0;\n  background-size: contain;\n  background-repeat: no-repeat;\n  background-position: center;\n\n  &:not(.item__img-icon) {\n    inline-size: var(--icon-s);\n    block-size: var(--icon-s);\n  }\n\n  &--mask {\n    background-color: currentColor;\n    background-size: contain;\n    background-repeat: no-repeat;\n    background-position: center;\n  }\n}\n","import { Component, Host, Prop, h } from \"@stencil/core\";\nimport type {\n  BreadcrumbItemModel,\n  ItemLink,\n  GetImagePathCallback\n} from \"../types\";\n\n@Component({\n  tag: \"gx-ide-breadcrumb-item\",\n  styleUrl: \"breadcrumb-item.scss\",\n  shadow: true\n})\nexport class GxIdeBreadcrumbItem {\n  /**\n   * Model of the item (used for image resolution and data).\n   */\n  @Prop() readonly model!: BreadcrumbItemModel;\n\n  /**\n   * Visible text. Falls back to model.caption when not set.\n   */\n  @Prop() readonly caption?: string;\n\n  /**\n   * aria-label for the item. Falls back to accessibleName or caption when not set.\n   */\n  @Prop() readonly accessibleName?: string;\n\n  /**\n   * Whether the item is disabled.\n   */\n  @Prop() readonly disabled?: boolean;\n\n  /**\n   * When set, the item renders as an anchor; otherwise as a button.\n   */\n  @Prop() readonly link?: ItemLink;\n\n  /**\n   * Whether this item is the current page (selected).\n   */\n  @Prop() readonly selected: boolean = false;\n\n  /**\n   * Whether to show visual indicator when selected is true.\n   */\n  @Prop() readonly selectedLinkIndicator: boolean = false;\n\n  /**\n   * Image source (URL or CSS url()).\n   */\n  @Prop() readonly startImgSrc?: string;\n\n  /**\n   * How to render the start image: \"background\" or \"mask\".\n   */\n  @Prop() readonly startImgType?: \"background\" | \"mask\";\n\n  /**\n   * Optional callback to resolve image path for this item.\n   */\n  @Prop() readonly getImagePathCallback?: GetImagePathCallback;\n\n  /**\n   * Item id used by the container for click delegation (data-item-id).\n   */\n  @Prop() readonly itemId!: string;\n\n  #resolveImageSrc = (): string | undefined => {\n    if (this.getImagePathCallback) {\n      const result = this.getImagePathCallback(this.model);\n      if (result?.base) return result.base;\n    }\n    return this.startImgSrc ?? this.model?.startImgSrc;\n  };\n\n  #getCaption = (): string => this.caption ?? this.model?.caption ?? \"\";\n\n  #getAccessibleName = (): string =>\n    this.accessibleName ??\n    this.model?.accessibleName ??\n    this.#getCaption() ??\n    \"\";\n\n  #renderStartImage = (): ReturnType<typeof h> | string | undefined => {\n    const src = this.#resolveImageSrc();\n    if (!src) return undefined;\n\n    const type = this.startImgType ?? this.model?.startImgType;\n    const isUrl = src.trim().toLowerCase().startsWith(\"url(\");\n\n    if (isUrl && (type === \"background\" || type === \"mask\")) {\n      return (\n        <span\n          class={{\n            \"item__img\": true,\n            \"item__img--background\": type === \"background\",\n            \"item__img--mask\": type === \"mask\"\n          }}\n          style={\n            type === \"background\"\n              ? { backgroundImage: src }\n              : { maskImage: src, WebkitMaskImage: src }\n          }\n          aria-hidden=\"true\"\n        />\n      );\n    }\n\n    return (\n      <ch-image\n        class=\"item__img item__img-icon icon-m\"\n        src={src}\n        aria-hidden=\"true\"\n      />\n    );\n  };\n\n  render() {\n    const caption = this.#getCaption();\n    const ariaLabel = this.#getAccessibleName();\n    const isDisabled = this.disabled ?? this.model?.disabled ?? false;\n    const hasLink = this.link?.url !== undefined && this.link?.url !== \"\";\n    const imgContent = this.#renderStartImage();\n\n    const captionClass = {\n      \"caption\": true,\n      \"body-regular-s\": !this.selected || !this.selectedLinkIndicator,\n      \"body-semi-bold-s\": this.selected && this.selectedLinkIndicator\n    };\n    const content = (\n      <span class=\"item-content\">\n        {imgContent}\n        {caption ? (\n          <span class={captionClass} part=\"item-caption\">\n            {caption}\n          </span>\n        ) : null}\n      </span>\n    );\n\n    const actionClass = {\n      \"action\": true,\n      \"disabled\": isDisabled,\n      \"selected\": this.selected && this.selectedLinkIndicator,\n      \"not-selected\": !this.selected\n    };\n\n    if (hasLink && !isDisabled) {\n      return (\n        <Host\n          role=\"listitem\"\n          data-item-id={this.itemId}\n          data-has-link=\"true\"\n          part=\"item-action item-link\"\n        >\n          <a\n            class={{ ...actionClass, \"link-primary\": true }}\n            href={this.link!.url}\n            aria-current={this.selected ? \"page\" : undefined}\n            aria-label={ariaLabel || undefined}\n            part=\"item-link\"\n          >\n            {content}\n          </a>\n        </Host>\n      );\n    }\n\n    if (hasLink && isDisabled) {\n      return (\n        <Host\n          role=\"listitem\"\n          data-item-id={this.itemId}\n          data-has-link=\"true\"\n          part=\"item-action disabled\"\n        >\n          <span\n            class={actionClass}\n            aria-disabled=\"true\"\n            aria-label={ariaLabel || undefined}\n            part=\"item-link disabled\"\n          >\n            {content}\n          </span>\n        </Host>\n      );\n    }\n\n    return (\n      <Host\n        role=\"listitem\"\n        data-item-id={this.itemId}\n        data-has-link=\"false\"\n        part=\"item-action item-button\"\n      >\n        <button\n          type=\"button\"\n          class={actionClass}\n          disabled={isDisabled}\n          aria-label={ariaLabel || undefined}\n          part=\"item-button\"\n        >\n          {content}\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/types/components/breadcrumb/breadcrumb-item/breadcrumb-item.d.ts

@@ -0,0 +1,49 @@
+import type { BreadcrumbItemModel, ItemLink, GetImagePathCallback } from "../types";
+export declare class GxIdeBreadcrumbItem {
+    #private;
+    /**
+     * Model of the item (used for image resolution and data).
+     */
+    readonly model: BreadcrumbItemModel;
+    /**
+     * Visible text. Falls back to model.caption when not set.
+     */
+    readonly caption?: string;
+    /**
+     * aria-label for the item. Falls back to accessibleName or caption when not set.
+     */
+    readonly accessibleName?: string;
+    /**
+     * Whether the item is disabled.
+     */
+    readonly disabled?: boolean;
+    /**
+     * When set, the item renders as an anchor; otherwise as a button.
+     */
+    readonly link?: ItemLink;
+    /**
+     * Whether this item is the current page (selected).
+     */
+    readonly selected: boolean;
+    /**
+     * Whether to show visual indicator when selected is true.
+     */
+    readonly selectedLinkIndicator: boolean;
+    /**
+     * Image source (URL or CSS url()).
+     */
+    readonly startImgSrc?: string;
+    /**
+     * How to render the start image: "background" or "mask".
+     */
+    readonly startImgType?: "background" | "mask";
+    /**
+     * Optional callback to resolve image path for this item.
+     */
+    readonly getImagePathCallback?: GetImagePathCallback;
+    /**
+     * Item id used by the container for click delegation (data-item-id).
+     */
+    readonly itemId: string;
+    render(): any;
+}

package/dist/types/components/breadcrumb/breadcrumb.d.ts

@@ -0,0 +1,44 @@
+import { EventEmitter } from "../../stencil-public-runtime";
+import type { BreadcrumbModel, BreadcrumbItemModel, SelectedLink, GetImagePathCallback } from "./types";
+export declare class GxIdeBreadcrumb {
+    #private;
+    el: HTMLGxIdeBreadcrumbElement;
+    /**
+     * List of breadcrumb items to display.
+     */
+    readonly model?: BreadcrumbModel;
+    /**
+     * aria-label for the navigation container (accessible-name attribute).
+     */
+    readonly accessibleName?: string;
+    /**
+     * When true, disables all interaction with the breadcrumb.
+     */
+    readonly disabled: boolean;
+    /**
+     * Text shown between items. Examples: "›" (recommended), "/", ">", "·", "•".
+     * Default "›" (single right-pointing angle quotation mark, U+203A).
+     */
+    readonly separator: string;
+    /**
+     * Currently selected link (for highlighting the current page).
+     */
+    readonly selectedLink: SelectedLink;
+    /**
+     * When true, show visual indicator on the item matching selectedLink (selected-link-indicator attribute).
+     */
+    readonly selectedLinkIndicator: boolean;
+    /**
+     * Optional callback to resolve image path for each item.
+     */
+    readonly getImagePathCallback?: GetImagePathCallback;
+    /**
+     * Fired when the user clicks an item that has a link.
+     */
+    readonly hyperlinkClick?: EventEmitter<BreadcrumbItemModel>;
+    /**
+     * Fired when the user clicks an item without a link (button).
+     */
+    readonly buttonClick?: EventEmitter<BreadcrumbItemModel>;
+    render(): any;
+}

package/dist/types/components/breadcrumb/types.d.ts

@@ -0,0 +1,48 @@
+/**
+ * Types for gx-ide-breadcrumb and gx-ide-breadcrumb-item.
+ * @see docs/spec.md
+ */
+/**
+ * Link data for a breadcrumb item that navigates to a URL.
+ */
+export interface ItemLink {
+    url: string | undefined;
+}
+/**
+ * How to render the optional start image (icon) of a breadcrumb item.
+ */
+export type StartImgType = "background" | "mask";
+/**
+ * Model for a single breadcrumb item.
+ */
+export interface BreadcrumbItemModel {
+    id: string;
+    caption?: string;
+    accessibleName?: string;
+    disabled?: boolean;
+    link?: ItemLink;
+    startImgSrc?: string;
+    startImgType?: StartImgType;
+}
+/**
+ * Model for the breadcrumb container: array of items.
+ */
+export type BreadcrumbModel = BreadcrumbItemModel[];
+/**
+ * Selected link descriptor for highlighting the current page in the breadcrumb.
+ */
+export interface SelectedLink {
+    id?: string;
+    link: ItemLink;
+}
+/**
+ * Optional callback to resolve image path for an item (e.g. multi-state icons).
+ * Returns an object with at least a base URL.
+ */
+export interface GxImageMultiState {
+    base: string;
+}
+/**
+ * Callback type for resolving item image path.
+ */
+export type GetImagePathCallback = (item: BreadcrumbItemModel) => GxImageMultiState | undefined;

package/dist/types/components/new-object/new-object.d.ts

@@ -64,15 +64,10 @@ export declare class GxIdeNewObject {
      */
     readonly validateNameCallback: ValidateNameCallback;
     /**
-     * Callback to suggest a name when creating an object from another object.
-     * Returns the suggested name or undefined if not applicable.
+     * Callback to suggest name and description based on the given type.
+     * Returns the suggested data or undefined if not applicable.
      */
-    readonly suggestNameCallback?: SuggestNameCallback;
-    /**
-     * Callback to suggest a description when creating an object from another object.
-     * Returns the suggested description or undefined if not applicable.
-     */
-    readonly suggestDescriptionCallback?: SuggestDescriptionCallback;
+    readonly suggestCallback?: SuggestCallback;
     /**
      * This event emits the 'cancel' event
      */
@@ -119,5 +114,8 @@ export type TypeData = {
     hasFolder: boolean;
     description: string;
 };
-export type SuggestNameCallback = () => Promise<string | undefined>;
-export type SuggestDescriptionCallback = () => Promise<string | undefined>;
+export type SuggestData = {
+    name: string | undefined;
+    description: string | undefined;
+};
+export type SuggestCallback = (typeId: string) => Promise<SuggestData | undefined>;