@genexus/genexus-ide-ui 0.0.61 → 0.0.62

package/dist/node_modules/@genexus/gemini/dist/collection/components/title-editable/title-editable.css

@@ -0,0 +1,74 @@
+:host {
+  display: block;
+}
+:host .wrapper {
+  font-family: var(--font-family-primary);
+  color: var(--color-on-background);
+  position: relative;
+  max-width: 100%;
+}
+:host input {
+  font-family: inherit;
+  font-size: inherit;
+  font-weight: inherit;
+  text-transform: inherit;
+  color: inherit;
+  background-color: transparent;
+  border: none;
+  padding: 0;
+  box-sizing: border-box;
+  flex-grow: 1;
+  cursor: auto;
+}
+:host input:focus {
+  outline: none;
+}
+
+/*wrapper*/
+.wrapper {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-comp-02);
+}
+
+/*editing*/
+:host(:not([editing])) input {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+/*click-to-edit*/
+:host([click-to-edit]:not[disable-edition]) .wrapper,
+:host([click-to-edit]:not[disable-edition]) input {
+  cursor: pointer;
+}
+
+/*disable-edition*/
+/*title types*/
+:host([title-type=h1]) .wrapper {
+  font-size: 24px;
+  font-weight: var(--font-weight-bold);
+  text-transform: capitalize;
+}
+
+:host([title-type=h2]) .wrapper {
+  font-size: 16px;
+  font-weight: var(--font-weight-bold);
+}
+
+/*fluid*/
+:host([fluid]) .wrapper {
+  display: inline-flex;
+}
+
+/*ghost div: it helps measuring the text width, to make the input as wide as needed (fluid)*/
+.ghost {
+  font-family: inherit;
+  font-size: inherit;
+  position: fixed;
+  visibility: hidden;
+  height: auto;
+  width: auto;
+  white-space: nowrap;
+}

package/dist/node_modules/@genexus/gemini/dist/collection/components/tree-item/gxg-tree-item.css

@@ -787,7 +787,7 @@ FORM ELEMENTS
   transition-property: opacity;
   transition-duration: 0.5s;
   transition-timing-function: ease;
-  background-color: var(--color-hover);
+  background-color: var(--gxg-background-color--hover);
 }
 :host li .toggle-icon:hover {
   background-color: var(--color-background);

package/dist/node_modules/@genexus/gemini/dist/collection/components/tree-view/tree-view.css

@@ -346,11 +346,10 @@ gxg-tree-view {
   color: var(--color-on-background);
   display: contents;
 }
-gxg-tree-view ch-tree-x .ch-tree-x-container {
-  padding: var(--spacing-comp-01);
-}
 
-/*custom styles for the property */
+/*---------------------------
+.tree-view
+---------------------------*/
 .tree-view {
   /* Track */
   /* Handle */
@@ -372,113 +371,87 @@ gxg-tree-view ch-tree-x .ch-tree-x-container {
   cursor: pointer;
 }
 
-gxg-tree-view[position-relative] ch-tree-x .ch-tree-x-container {
-  position: relative;
-  width: 100%;
-}
-
-/*padding (added by Gemini)*/
-gxg-tree-view[no-padding] ch-tree-x .ch-tree-x-container {
-  padding: 0;
-}
-
 /*---------------------------
-ch-tree-x-list-item
+.tree-view-item
 ---------------------------*/
-.tree-view-item::part(dashed-line) {
-  border-color: var(--gray-02);
-}
-
-ch-tree-x-list-item {
+.tree-view-item {
+  /*-- Css Variables ---*/
   --checkbox-size: var(--gxg-checkbox-size);
   --expandable-button-width: var(--spacing-comp-04);
+  /*-- Parts ---*/
+  /*-- Parts for checkbox ---*/
   /*checked*/
   /*indeterminate*/
+  /*-- Dynamic Icons ---*/
+  /*-- Other ---*/
 }
-ch-tree-x-list-item.tree-view-item--folder::part(action)::before, ch-tree-x-list-item.tree-view-item--module::part(action)::before {
-  grid-area: left-img;
-  content: "";
-  width: 14px;
-  height: 14px;
-  margin-inline-end: 4px;
-  background-repeat: no-repeat;
-}
-ch-tree-x-list-item.tree-view-item--folder::part(action)::before {
-  background-image: url("/build/icon-assets/objects/folder.svg");
-}
-ch-tree-x-list-item.tree-view-item--folder::part(action expanded)::before {
-  background-image: url("/build/icon-assets/objects/folder-open.svg");
-}
-ch-tree-x-list-item.tree-view-item--module::part(action)::before {
-  background-image: url("/build/icon-assets/objects/module.svg");
-}
-ch-tree-x-list-item.tree-view-item--module::part(action expanded)::before {
-  background-image: url("/build/icon-assets/objects/module-open.svg");
-}
-ch-tree-x-list-item .tree-view-item--pending-commit::part(action)::before {
-  content: "";
-  position: relative;
-  z-index: 1;
-  grid-area: left-img;
-  width: 5px;
-  height: 5px;
-  align-self: end;
-  margin-block-end: 3px;
-  margin-inline-start: 1px;
-  background-color: #2c3b92;
-  border-radius: 50%;
-}
-ch-tree-x-list-item::part(header):first-child {
-  margin-inline-start: var(--spacing-comp-01);
+.tree-view-item::part(dashed-line) {
+  border-color: var(--gray-02);
 }
-ch-tree-x-list-item::part(header) {
+.tree-view-item::part(header) {
   padding-inline-end: calc(var(--spacing-comp-02) * 0.65);
   height: var(--spacing-comp-05);
   display: flex;
   gap: 5px;
 }
-ch-tree-x-list-item::part(header):before {
+.tree-view-item::part(header):first-child {
+  margin-inline-start: var(--spacing-comp-01);
+}
+.tree-view-item::part(header):before {
   content: "";
   display: block;
 }
-ch-tree-x-list-item::part(header):hover {
+.tree-view-item::part(header):hover {
   background-color: var(--gxg-background-color--hover);
   color: var(--gxg-color--hover);
 }
-ch-tree-x-list-item::part(header):focus {
+.tree-view-item::part(header):focus {
   outline: var(--border-width-md) solid var(--gxg-border-color--focused);
   outline-offset: -2px;
 }
-ch-tree-x-list-item[selected]::part(header) {
+.tree-view-item[selected]::part(header) {
   background-color: var(--gxg-background-color--selected);
 }
-ch-tree-x-list-item[selected]::part(header):hover {
+.tree-view-item[selected]::part(header):hover {
   background-color: var(--gxg-background-color--selected-hover);
 }
-ch-tree-x-list-item.ch-tree-x-list-item--editing::part(header) {
-  border: 2px solid transparent;
-}
-ch-tree-x-list-item::part(expandable-button) {
-  background-color: var(--color-hover);
+.tree-view-item::part(expandable-button) {
+  background-color: var(--gray-00);
   margin-inline-end: 0;
 }
-ch-tree-x-list-item::part(expandable-button)::before {
+.tree-view-item::part(expandable-button)::before {
   background-color: var(--gray-04);
   -webkit-mask-position: center;
   -webkit-mask-repeat: no-repeat;
 }
-ch-tree-x-list-item::part(expandable-button):hover {
+.tree-view-item::part(expandable-button):hover {
   background-color: var(--color-background);
 }
-ch-tree-x-list-item::part(expandable-button):focus {
+.tree-view-item::part(expandable-button):focus {
   outline: var(--border-width-md) solid var(--gxg-border-color--focused);
   outline-offset: 0;
 }
-ch-tree-x-list-item::part(checkbox__container) {
+.tree-view-item::part(action) {
+  text-transform: capitalize;
+  display: flex;
+  gap: var(--spacing-comp-01);
+}
+.tree-view-item::part(left-img) {
+  width: var(--spacing-comp-04);
+  height: var(--spacing-comp-04);
+  margin-inline-end: 0;
+}
+.tree-view-item::part(downloading) {
+  width: var(--spacing-comp-03);
+  height: var(--spacing-comp-03);
+  border: var(--border-width-md) solid var(--color-primary-enabled);
+  border-inline-start-color: transparent;
+}
+.tree-view-item::part(checkbox__container) {
   border-color: var(--gray-04);
   background-color: var(--color-background);
 }
-ch-tree-x-list-item::part(checkbox__container):after {
+.tree-view-item::part(checkbox__container):after {
   content: "";
   position: absolute;
   display: block;
@@ -486,18 +459,18 @@ ch-tree-x-list-item::part(checkbox__container):after {
   border-color: transparent;
   z-index: 0;
 }
-ch-tree-x-list-item::part(checkbox__container):focus-within {
+.tree-view-item::part(checkbox__container):focus-within {
   box-shadow: none;
   outline: var(--border-width-md) solid var(--gxg-border-color--focused);
   outline-offset: -2px;
 }
-ch-tree-x-list-item::part(checkbox) {
+.tree-view-item::part(checkbox) {
   margin-inline-end: 0;
 }
-ch-tree-x-list-item::part(checkbox__option) {
+.tree-view-item::part(checkbox__option) {
   display: none;
 }
-ch-tree-x-list-item::part(checkbox__container checkbox__checked):after {
+.tree-view-item::part(checkbox__container checkbox__checked):after {
   left: 5.5px;
   top: 3px;
   width: 4px;
@@ -511,7 +484,7 @@ ch-tree-x-list-item::part(checkbox__container checkbox__checked):after {
   transition-duration: var(--ui-animaton-speed);
   transition-timing-function: ease;
 }
-ch-tree-x-list-item::part(checkbox__container checkbox__indeterminate):after {
+.tree-view-item::part(checkbox__container checkbox__indeterminate):after {
   left: 50%;
   top: 50%;
   width: 8px;
@@ -522,28 +495,50 @@ ch-tree-x-list-item::part(checkbox__container checkbox__indeterminate):after {
   -ms-transform: rotate(0) translateY(-50%) translateX(-50%);
   transform: rotate(0) translateY(-50%) translateX(-50%);
 }
-ch-tree-x-list-item::part(checkbox__input) {
+.tree-view-item::part(checkbox__input) {
   position: relative;
   z-index: 1;
 }
-ch-tree-x-list-item::part(action) {
-  text-transform: capitalize;
-  display: flex;
-  gap: var(--spacing-comp-01);
+.tree-view-item--folder::part(action)::before, .tree-view-item--module::part(action)::before {
+  grid-area: left-img;
+  content: "";
+  width: 14px;
+  height: 14px;
+  margin-inline-end: 4px;
+  background-repeat: no-repeat;
 }
-ch-tree-x-list-item::part(left-img) {
-  width: var(--spacing-comp-04);
-  height: var(--spacing-comp-04);
-  margin-inline-end: 0;
+.tree-view-item--folder::part(action)::before {
+  background-image: url("/build/icon-assets/objects/folder.svg");
 }
-ch-tree-x-list-item::part(downloading) {
-  width: var(--spacing-comp-03);
-  height: var(--spacing-comp-03);
-  border: var(--border-width-md) solid var(--color-primary-enabled);
-  border-inline-start-color: transparent;
+.tree-view-item--folder::part(action expanded)::before {
+  background-image: url("/build/icon-assets/objects/folder-open.svg");
+}
+.tree-view-item--module::part(action)::before {
+  background-image: url("/build/icon-assets/objects/module.svg");
+}
+.tree-view-item--module::part(action expanded)::before {
+  background-image: url("/build/icon-assets/objects/module-open.svg");
+}
+.tree-view-item--pending-commit::part(action)::before {
+  content: "";
+  position: relative;
+  z-index: 1;
+  grid-area: left-img;
+  width: 5px;
+  height: 5px;
+  align-self: end;
+  margin-block-end: 3px;
+  margin-inline-start: 1px;
+  background-color: var(--color-primary-enabled);
+  border-radius: 50%;
 }
 
-.ch-tree-x-drag-info {
+/*-- Other Selectors (these depend on the tag class name)---*/
+.ch-tree-x-list-item--editing::part(header) {
+  border: 2px solid transparent;
+}
+/*--- Revisar ---*/
+.ch-tree-x-list-item .ch-tree-x-drag-info {
   padding-inline: 6px;
   padding-block: 2px;
   background-color: #cfdee6;

package/dist/types/common/config.d.ts

@@ -6,6 +6,10 @@ export declare const config: {
       textAlign: string;
       padding: string;
       maxWidth: string;
+      minHeight: string;
     };
   };
+  gxIdeContainer: {
+    slimmerFooter: boolean;
+  };
 };

package/dist/types/common/grid.d.ts

@@ -1,5 +1,6 @@
 export declare const gridCommon: {
   colSize: {
+    minContent: string;
     auto: string;
     common: string;
     commonDouble: string;

package/dist/types/common/render-list-item.d.ts

@@ -0,0 +1,2 @@
+import { ItemData } from "../components/_helpers/list-selector/list-selector-item/list-selector-item";
+export declare const renderListItems: (itemsData: ItemData[]) => HTMLGxIdeListSelectorItemElement[];

package/dist/types/components/{container → _helpers/container}/container.d.ts

@@ -1,4 +1,5 @@
 import { TitleAlignment } from "@genexus/gemini/dist/types/common/types";
+import { TitleType } from "../title/title";
 export declare class GxIdeContainer {
   /**
    * By setting the title to inactive, the color will be gray instead of black.
@@ -8,6 +9,10 @@ export declare class GxIdeContainer {
    * The title of the container
    */
   readonly containerTitle: string;
+  /**
+   * The title of the container
+   */
+  readonly titleType: TitleType;
   /**
    * Displays a border all around the container
    */
@@ -44,6 +49,10 @@ export declare class GxIdeContainer {
    * Removes the padding from the heading
    */
   readonly noHeadingPadding: boolean;
+  /**
+   * Adds padding to the top of the heading
+   */
+  readonly headingPaddingTop: boolean;
   /**
    * The heading justification
    */
@@ -72,6 +81,22 @@ export declare class GxIdeContainer {
    * Justify content
    */
   readonly justifyContent: JustifyContent;
+  /**
+   * Display border end on the content
+   */
+  readonly contentBorderEnd: boolean;
+  /**
+   * Makes the above footer vertical padding slimmer
+   */
+  readonly slimmerAboveFooter: boolean;
+  /**
+   * Removes the above padding from the footer
+   */
+  readonly noAboveFooterPadding: boolean;
+  /**
+   * Removes the above border top
+   */
+  readonly noBorderAboveFooter: boolean;
   /**
    * Makes the footer vertical padding slimmer
    */
@@ -105,10 +130,18 @@ export declare class GxIdeContainer {
    * A boolean variable indicating if the component has or not any content for the 'footer' slot
    */
   hasFooterSlot: boolean;
+  /**
+   * A boolean variable indicating if the component has or not any content for the 'footer' slot
+   */
+  hasAboveFooterSlot: boolean;
   /**
    * A boolean variable indicating that the container only has the heading section
    */
   hasOnlyHeading: boolean;
+  /**
+   * A boolean variable indicating that the container only has the content section
+   */
+  hasOnlyContent: boolean;
   /**
    * A boolean variable indicating that the container only has the footer section
    */
@@ -118,6 +151,7 @@ export declare class GxIdeContainer {
   private evaluateSections;
   private headingClasses;
   private contentClasses;
+  private aboveFooter;
   private footer;
   render(): any;
 }

package/dist/types/components/{entity-selector → _helpers/entity-selector}/entity-selector.d.ts

@@ -1,6 +1,6 @@
-import { EventEmitter } from "../../stencil-public-runtime";
+import { EventEmitter } from "../../../stencil-public-runtime";
 import { LabelPosition } from "../directory-selector/directory-selector";
-import { EntityData } from "../../common/types";
+import { EntityData } from "../../../common/types";
 export declare class GxIdeEntitySelector {
   /**
    *  This property provides the user a way to define custom aria-label descriptions.
@@ -21,7 +21,7 @@ export declare class GxIdeEntitySelector {
   /**
    * Centers the label
    */
-  readonly centerLabel = false;
+  readonly centerLabel: boolean;
   /**
    * The label width
    */

package/dist/types/components/{list-selector → _helpers/list-selector}/list-selector-item/list-selector-item.d.ts

@@ -1,4 +1,4 @@
-import { EventEmitter } from "../../../stencil-public-runtime";
+import { EventEmitter } from "../../../../stencil-public-runtime";
 import { Color, Size } from "@genexus/gemini/dist/types/components/icon/icon";
 export declare class GxIdeListSelectorItem {
   private parentIsListSelector;
@@ -7,6 +7,7 @@ export declare class GxIdeListSelectorItem {
   private name;
   private type;
   private hasUniversalSlot;
+  private index;
   el: HTMLGxIdeListSelectorItemElement;
   /**
    * The item id
@@ -44,6 +45,10 @@ export declare class GxIdeListSelectorItem {
    * Disables the item border
    */
   noBorder: boolean;
+  /**
+   * Displays the universal slot at the end, instead of at the benign
+   */
+  readonly universalSlotEnd = false;
   componentWillLoad(): void;
   /**
    * Emits the item data
@@ -75,6 +80,7 @@ export declare class GxIdeListSelectorItem {
    * Gets the listName required value, that is needed for the list selection to properly work
    */
   private assignName;
+  private evaluateOrderedList;
   private evaluateIconColor;
   private evaluateIconSize;
   private onChangeHandler;
@@ -83,4 +89,5 @@ export declare class GxIdeListSelectorItem {
 export type ItemData = {
   itemId: string;
   itemValue: string;
+  itemIcon?: string;
 };

package/dist/types/components/{list-selector → _helpers/list-selector}/list-selector.d.ts

@@ -1,4 +1,4 @@
-import { EventEmitter } from "../../stencil-public-runtime";
+import { EventEmitter } from "../../../stencil-public-runtime";
 import { Color, Size } from "@genexus/gemini/dist/types/components/icon/icon";
 import { ItemData } from "./list-selector-item/list-selector-item";
 export declare class GxIdeListSelector {
@@ -10,11 +10,11 @@ export declare class GxIdeListSelector {
   /**
    * It determines if the list is ordered, or unordered
    */
-  readonly ordered = false;
+  readonly ordered: boolean;
   /**
    * Makes the list readonly
    */
-  readonly readonly = false;
+  readonly readonly: boolean;
   /**
    * It determines the type of list: single-selection or multi-selection
    */

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

@@ -1,4 +1,4 @@
-import { EventEmitter } from "../../stencil-public-runtime";
+import { EventEmitter } from "../../../stencil-public-runtime";
 import { Size } from "@genexus/gemini/dist/types/components/icon/icon";
 import { CheckedItemsInfo } from "../list-selector/list-selector";
 export declare class GxIdeStatusButtons {

package/dist/types/components/_helpers/switcher/switch-panel/switch-panel.d.ts

@@ -0,0 +1,3 @@
+export declare class GxIdeSwitchPanel {
+  render(): any;
+}

package/dist/types/components/_helpers/switcher/switcher.d.ts

@@ -0,0 +1,3 @@
+export declare class GxIdeSwitcher {
+  render(): any;
+}

package/dist/types/components/_helpers/title/title.d.ts

@@ -0,0 +1,34 @@
+export declare class GxIdeTitle {
+  /**
+   * Description: This helper component has been created for using as a title for the dialogs sections.
+   */
+  private geminiType;
+  /**
+   * The title caption (the title)
+   */
+  readonly titleCaption: string;
+  /**
+   * The title caption (the title)
+   */
+  readonly type: TitleType;
+  /**
+   * The title alignment
+   */
+  readonly alignment: TitleAlignment;
+  /**
+   * Disables the padding
+   */
+  readonly padding: boolean;
+  /**
+   * Disables the padding on the bottom
+   */
+  readonly noPaddingBottom: boolean;
+  /**
+   * Displays a border on the bottom
+   */
+  readonly border: boolean;
+  componentWillLoad(): void;
+  render(): any;
+}
+export type TitleType = "primary" | "secondary";
+export type TitleAlignment = "start" | "center";

package/dist/types/components/{_template → _starting-template}/template.d.ts

@@ -4,6 +4,7 @@ export declare class GxIdeTemplate {
    * The component hard-coded strings translations.
    */
   private _componentLocale;
+  private renderedFirstTime;
   el: HTMLGxIdeTemplateElement;
   /**
    * The main title
@@ -12,7 +13,7 @@ export declare class GxIdeTemplate {
   /**
    * @description Gets fired when the component has rendered for the first time.
    */
-  componentDidRenderEvent: EventEmitter<string>;
+  componentDidRenderFirstTime: EventEmitter<string>;
   componentWillLoad(): Promise<void>;
   componentDidRender(): void;
   render(): any;

package/dist/types/components/_test/test.d.ts

@@ -1,6 +1,8 @@
+import { EventEmitter } from "../../stencil-public-runtime";
 import { GxgTreeItemData } from "@genexus/gemini/dist/types/components/tree-item/gxg-tree-item";
 export declare class GxIdeTest {
   private tree;
+  private renderedFirstTime;
   /**
    * The model for a gxg-tree
    */
@@ -25,6 +27,11 @@ export declare class GxIdeTest {
    * A callback that returns a Promise with the new tree model
    */
   readonly lazyLoadTreeItemsCallback: (treeItemId: string) => Promise<GxgTreeItemData[]>;
+  /**
+   * @description Gets fired when the component has rendered for the first time.
+   */
+  componentDidRenderFirstTime: EventEmitter<string>;
+  componentDidRender(): void;
   loadLazyChildrenHandler(e: CustomEvent<string>): void;
   treeItemStateChanged(event: CustomEvent<GxgTreeItemData>): void;
   private closeTreeNodeHandler;

package/dist/types/components/{application-declaration → bpm-application-declaration}/bpm-app-declaration.d.ts

@@ -5,6 +5,7 @@ export declare class GxIdeBpmAppDeclaration {
    * The component hard-coded strings translations.
    */
   private _componentLocale;
+  private renderedFirstTime;
   /**
    * The state of the actual application. Used to add a new 'Relevant data' option on 'selectMappingCallback', and update the application with the new option
    */
@@ -47,7 +48,7 @@ export declare class GxIdeBpmAppDeclaration {
   /**
    * @description Gets fired when the component has rendered for the first time.
    */
-  componentDidRenderEvent: EventEmitter<string>;
+  componentDidRenderFirstTime: EventEmitter<string>;
   componentWillLoad(): Promise<void>;
   componentDidLoad(): Promise<void>;
   componentDidRender(): void;

package/dist/types/components/create-kb-from-server/create-kb-from-server.d.ts

@@ -6,6 +6,7 @@ export declare class GxIdeCreateKbFromServer {
    * The component hard-coded strings translations.
    */
   private _componentLocale;
+  private renderedFirstTime;
   private authenticationTypeEl;
   private serverUrlsEl;
   private kbNameEl;
@@ -59,9 +60,10 @@ export declare class GxIdeCreateKbFromServer {
   /**
    * This event is emitted once just after the component is fully loaded and the first render() occurs
    */
-  componentDidLoadEvent: EventEmitter<boolean>;
+  componentDidRenderFirstTime: EventEmitter<boolean>;
   componentWillLoad(): Promise<void>;
   componentDidLoad(): void;
+  componentDidRender(): void;
   private setAuthenticationTypes;
   private addEventListeners;
   private reset;

package/dist/types/components/kb-manager-export/kb-manager-export.d.ts

@@ -10,6 +10,7 @@ export declare class GxIdeKbManagerExport {
   private _componentLocale;
   private checkedObjectsIds;
   private checkedPropertiesIds;
+  private renderedFirstTime;
   el: HTMLGxIdeKbManagerExportElement;
   private fileNameEl;
   private exportAllCheckboxEl;
@@ -70,7 +71,12 @@ export declare class GxIdeKbManagerExport {
    * This event is emitted once just after the component is fully loaded and the first render() occurs.
    */
   componentDidLoadEvent: EventEmitter<boolean>;
+  /**
+   * This event is emitted once just after the component is fully loaded and the first render() occurs
+   */
+  componentDidRenderFirstTime: EventEmitter<boolean>;
   componentWillLoad(): Promise<void>;
+  componentDidRender(): void;
   private evaluateObjects;
   private optionsCallbackHandler;
   private addKBPropertiesCallbackHandler;