@genexus/genexus-ide-ui 0.0.112 → 0.0.114

package/dist/collection/components/_helpers/container/container.js.map

@@ -1 +1 @@
-{"version":3,"file":"container.js","sourceRoot":"","sources":["../../../../src/components/_helpers/container/container.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, Element, State } from \"@stencil/core\";\nimport { TitleAlignment } from \"@genexus/gemini/dist/types/common/types\";\nimport { TitleType } from \"../title/title\";\n@Component({\n  tag: \"gx-ide-container\",\n  styleUrl: \"container.scss\",\n  shadow: true\n})\nexport class GxIdeContainer {\n  // 1.OWN PROPERTIES //\n\n  /* GENERAL */\n\n  /**\n   * By setting the title to inactive, the color will be gray instead of black.\n   */\n  @Prop() readonly inactiveTitle: boolean = false;\n\n  /**\n   * The title of the container\n   */\n  @Prop() readonly containerTitle: string;\n\n  /**\n   * The title of the container\n   */\n  @Prop() readonly titleType: TitleType = \"primary\";\n\n  /**\n   * Displays a border all around the container\n   */\n  @Prop() readonly displayBorder: boolean = false;\n\n  /**\n   * Displays a border on the top\n   */\n  @Prop() readonly displayBorderTop: boolean = false;\n\n  /**\n   * Displays a border at the end\n   */\n  @Prop() readonly displayBorderEnd: boolean = false;\n\n  /**\n   * Displays a border at on the bottom\n   */\n  @Prop() readonly displayBorderBottom: boolean = false;\n\n  /**\n   * Displays a border at the start\n   */\n  @Prop() readonly displayBorderStart: boolean = false;\n\n  /**\n   * The container general padding (applies to .heading, .content, and .footer)\n   */\n  @Prop() readonly sectionsPadding: SectionsPadding = \"m\";\n\n  /* HEADING*/\n\n  /**\n   * Title alignment\n   */\n  @Prop() readonly titleAlignment: TitleAlignment = \"center\";\n\n  /**\n   * Removes the border bottom from the heading\n   */\n  @Prop() readonly noHeadingBorder: boolean = false;\n\n  /**\n   * Removes the heading gap\n   */\n  @Prop() readonly noHeadingGap: boolean = false;\n\n  /**\n   * Removes the padding from the heading\n   */\n  @Prop() readonly noHeadingPadding: boolean = false;\n\n  /**\n   * Removes the padding block end from the heading\n   */\n  @Prop() readonly noHeadingPaddingBlockEnd: boolean = false;\n\n  /**\n   * Adds padding to the top of the heading\n   */\n  @Prop() readonly headingPaddingTop: boolean = false;\n\n  /**\n   * The heading justification\n   */\n  @Prop() readonly headingJustify: HeadingJustify = \"center\";\n\n  /**\n   * It forces the .heading__title min-height to be as tall as the gxg-form-text height. This is useful when you are displaying two gx-ide-container's on the same row, both of them display a title, and one of them displays a gxg-form-text in the header (usually used to filter content). Without this property set to true, the .heading without a gxg-from-text would be shorter. At the time of writing, this is used on ww-images.\n   */\n  @Prop() readonly titleHeightAsInput: boolean = false;\n\n  /**\n   * Makes the header (.heading) display flex:row, instad of the default flex:column.\n   */\n  @Prop() readonly flexRow: boolean = false;\n\n  /* CONTENT */\n\n  /**\n   * Makes the content a flex container\n   */\n  @Prop() readonly flexContent: boolean = false;\n\n  /**\n   * Removes the border-top from the content\n   */\n  @Prop() readonly noContentBorderTop: boolean = false;\n\n  /**\n   * Removes the padding from the content\n   */\n  @Prop() readonly noContentPadding: boolean = false;\n\n  /**\n   * Removes the gap from the content\n   */\n  @Prop() readonly noContentGap: boolean = false;\n\n  /**\n   * Align items\n   */\n  @Prop() readonly alignItems: AlignItems = undefined;\n\n  /**\n   * Justify content\n   */\n  @Prop() readonly justifyContent: JustifyContent = undefined;\n\n  /**\n   * Display border end on the content\n   */\n  @Prop() readonly contentBorderEnd: boolean = false;\n\n  /* FOOTER ABOVE */\n\n  /**\n   * Makes the above footer vertical padding slimmer\n   */\n  @Prop() readonly slimmerAboveFooter: boolean = false;\n\n  /**\n   * Removes the above padding from the footer\n   */\n  @Prop() readonly noAboveFooterPadding: boolean = false;\n\n  /**\n   * Removes the above border top\n   */\n  @Prop() readonly noBorderAboveFooter: boolean = false;\n\n  /* FOOTER > START and FOOTER > END*/\n\n  /**\n   * Makes the footer vertical padding slimmer\n   */\n  @Prop() readonly slimmerFooter: boolean = false;\n\n  /**\n   * Removes the padding from the footer\n   */\n  @Prop() readonly noFooterPadding: boolean = false;\n\n  /**\n   * The footer justification\n   */\n  @Prop() readonly footerJustify: FooterJustify = \"end\";\n\n  /**\n   * Removes the border top from the footer\n   */\n  @Prop() readonly noBorderFooter: boolean = false;\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeContainerElement;\n\n  // 3.STATE() VARIABLES //\n\n  /**\n   * A boolean variable indicating if the component has or not any content for the 'header' slot\n   */\n  @State() hasHeaderSlot = false;\n\n  /**\n   * A boolean variable indicating if the component has or not any content slotted content (regular slotted content, without 'slot' attribute)\n   */\n  @State() hasSlottedContent = false;\n\n  /**\n   * A boolean variable indicating if the component has or not any content for the 'footer' slot\n   */\n  @State() hasFooterSlot = false;\n\n  /**\n   * A boolean variable indicating if the component has or not any content for the 'footer' slot\n   */\n  @State() hasAboveFooterSlot = false;\n\n  /**\n   * A boolean variable indicating that the container only has the heading section\n   */\n  @State() hasOnlyHeading = false;\n\n  /**\n   * A boolean variable indicating that the container only has the content section\n   */\n  @State() hasOnlyContent = false;\n\n  /**\n   * A boolean variable indicating that the container only has the footer section\n   */\n  @State() hasOnlyFooter = false;\n\n  // 4.PUBLIC PROPERTY API //\n\n  // 5.EVENTS (EMIT) //\n\n  // 6.COMPONENT LIFECYCLE EVENTS //\n\n  componentWillLoad() {\n    this.evaluateSlots();\n  }\n\n  // 7.LISTENERS //\n\n  // 8.PUBLIC METHODS API //\n\n  // 9.LOCAL METHODS //\n\n  private evaluateSlots() {\n    // header\n    const headerSlot = this.el.querySelectorAll(':scope > [slot=\"header\"]');\n    if (headerSlot.length) {\n      this.hasHeaderSlot = true;\n    }\n    // content\n    const slottedContent = this.el.querySelectorAll(\":scope >  :not([slot])\");\n    if (slottedContent.length) {\n      this.hasSlottedContent = true;\n    }\n    // footer\n    const footerAboveSlot = this.el.querySelectorAll(\n      ':scope >  [slot=\"footer-above\"]'\n    );\n    const footerStartSlot = this.el.querySelectorAll(\n      ':scope >  [slot=\"footer-start\"]'\n    );\n    const footerEndSlot = this.el.querySelectorAll(\n      ':scope >  [slot=\"footer-end\"]'\n    );\n    if (footerStartSlot.length || footerEndSlot.length) {\n      this.hasFooterSlot = true;\n    }\n    if (footerAboveSlot.length) {\n      this.hasAboveFooterSlot = true;\n    }\n  }\n\n  private evaluateSections() {\n    // has only heading\n    if (\n      !this.hasSlottedContent &&\n      !this.hasFooterSlot &&\n      !this.hasAboveFooterSlot\n    ) {\n      this.hasOnlyHeading = true;\n    }\n    // has only content\n    if (\n      this.hasSlottedContent &&\n      !this.containerTitle &&\n      !this.hasHeaderSlot &&\n      !this.hasAboveFooterSlot &&\n      !this.hasFooterSlot\n    ) {\n      this.hasOnlyContent = true;\n    }\n    // has only footer\n    if (\n      !this.hasSlottedContent &&\n      !this.containerTitle &&\n      !this.hasAboveFooterSlot\n    ) {\n      this.hasOnlyFooter = true;\n    }\n  }\n\n  private headingClasses = (): string | { [className: string]: boolean } => {\n    return {\n      \"heading\": true,\n      \"heading--inactive\": this.inactiveTitle,\n      \"heading--slimmer\": this.titleType === \"secondary\",\n      \"heading--no-border\": this.noHeadingBorder || this.hasOnlyHeading,\n      [`heading--justify-${this.headingJustify}`]: true,\n      \"heading--no-padding\": this.noHeadingPadding,\n      \"heading--no-padding-block-end\": this.noHeadingPaddingBlockEnd,\n      \"heading--no-gap\": this.noHeadingGap,\n      \"heading--padding-top\":\n        this.headingPaddingTop && this.containerTitle?.length > 0,\n      \"heading--form-text-height\": this.titleHeightAsInput,\n      \"heading--flex-row\": this.flexRow\n    };\n  };\n\n  private contentClasses = (): string | { [className: string]: boolean } => {\n    return {\n      \"content\": true,\n      \"content--flex\": this.flexContent,\n      \"content--no-padding\": this.noContentPadding,\n      \"content--no-gap\": this.noContentGap,\n      \"content--no-border-top\": this.noContentBorderTop,\n      \"content--border-end\": this.contentBorderEnd,\n      [`content--align-items-${this.alignItems}`]:\n        this.alignItems !== undefined,\n      [`content--justify-content-${this.justifyContent}`]:\n        this.justifyContent !== undefined\n    };\n  };\n\n  private aboveFooter = (): JSX.Element | null => {\n    return this.hasAboveFooterSlot ? (\n      <footer\n        class={{\n          \"footer-above\": true,\n          \"footer-above--no-border-top\": this.noBorderAboveFooter,\n          \"footer-above--no-padding\": this.noAboveFooterPadding,\n          \"footer-above--slimmer\": this.slimmerFooter\n        }}\n      >\n        <slot name=\"footer-above\"></slot>\n      </footer>\n    ) : null;\n  };\n\n  private footer = (): JSX.Element | null => {\n    return this.hasFooterSlot ? (\n      <footer\n        class={{\n          \"footer\": true,\n          \"footer--no-border\":\n            this.hasOnlyFooter ||\n            !this.hasSlottedContent ||\n            this.noBorderFooter,\n          [`footer--justify-${this.footerJustify}`]: true,\n          [`footer--justify-${this.footerJustify}`]: true,\n          \"footer--no-padding\": this.noFooterPadding,\n          \"footer--slimmer\": this.slimmerFooter\n        }}\n      >\n        <div class=\"footer__start\">\n          <slot name=\"footer-start\"></slot>\n        </div>\n        <div class=\"footer__end\">\n          <slot name=\"footer-end\"></slot>\n        </div>\n      </footer>\n    ) : null;\n  };\n\n  // 10.RENDER() FUNCTION //\n\n  render() {\n    this.evaluateSections();\n    const result = [\n      this.containerTitle || this.hasHeaderSlot ? (\n        <header class={this.headingClasses()}>\n          {this.containerTitle ? (\n            <gx-ide-title\n              class=\"heading__title\"\n              type={this.titleType}\n              alignment={this.titleAlignment as any}\n            >\n              {this.containerTitle}\n            </gx-ide-title>\n          ) : null}\n          {this.hasHeaderSlot ? (\n            <div class=\"heading__inner-wrapper\">\n              <slot name=\"header\"></slot>\n            </div>\n          ) : null}\n        </header>\n      ) : null,\n      this.hasSlottedContent ? (\n        <div class={this.contentClasses()} part=\"content\">\n          <slot></slot>\n        </div>\n      ) : null,\n      this.aboveFooter(),\n      this.footer()\n    ];\n\n    return (\n      <Host>\n        <div\n          class={{\n            \"container\": true,\n            [`container--padding-${this.sectionsPadding}`]: true,\n            \"container--display-border\": this.displayBorder,\n            \"container--display-border-top\": this.displayBorderTop,\n            \"container--display-border-end\": this.displayBorderEnd,\n            \"container--display-border-bottom\": this.displayBorderBottom,\n            \"container--display-border-start\": this.displayBorderStart,\n            \"container--only-content\": this.hasOnlyContent,\n            \"container--no-header\": !this.hasHeaderSlot && !this.containerTitle,\n            \"container--no-footer\": !this.hasFooterSlot\n          }}\n        >\n          {result}\n        </div>\n      </Host>\n    );\n  }\n}\n\nexport type HeadingJustify = \"start\" | \"center\" | \"end\";\nexport type FooterJustify = \"start\" | \"center\" | \"end\";\nexport type SectionsPadding = \"s\" | \"m\" | \"l\";\nexport type AlignItems = \"start\" | \"center\" | \"end\";\nexport type JustifyContent = \"start\" | \"center\" | \"end\";\n"]}
+{"version":3,"file":"container.js","sourceRoot":"","sources":["../../../../src/components/_helpers/container/container.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, Element, State } from \"@stencil/core\";\nimport { TitleAlignment } from \"@genexus/gemini/dist/types/common/types\";\nimport { TitleType } from \"../title/title\";\n@Component({\n  tag: \"gx-ide-container\",\n  styleUrl: \"container.scss\",\n  shadow: true\n})\nexport class GxIdeContainer {\n  // 1.OWN PROPERTIES //\n\n  /* GENERAL */\n\n  /**\n   * By setting the title to inactive, the color will be gray instead of black.\n   */\n  @Prop() readonly inactiveTitle: boolean = false;\n\n  /**\n   * The title of the container\n   */\n  @Prop() readonly containerTitle: string;\n\n  /**\n   * The title of the container\n   */\n  @Prop() readonly titleType: TitleType = \"primary\";\n\n  /**\n   * Displays a border all around the container\n   */\n  @Prop() readonly displayBorder: boolean = false;\n\n  /**\n   * Displays a border on the top\n   */\n  @Prop() readonly displayBorderTop: boolean = false;\n\n  /**\n   * Displays a border at the end\n   */\n  @Prop() readonly displayBorderEnd: boolean = false;\n\n  /**\n   * Displays a border at on the bottom\n   */\n  @Prop() readonly displayBorderBottom: boolean = false;\n\n  /**\n   * Displays a border at the start\n   */\n  @Prop() readonly displayBorderStart: boolean = false;\n\n  /**\n   * The container general padding (applies to .heading, .content, and .footer)\n   */\n  @Prop() readonly sectionsPadding: SectionsPadding = \"m\";\n\n  /* HEADING*/\n\n  /**\n   * Title alignment\n   */\n  @Prop() readonly titleAlignment: TitleAlignment = \"center\";\n\n  /**\n   * Removes the border bottom from the heading\n   */\n  @Prop() readonly noHeadingBorder: boolean = false;\n\n  /**\n   * Removes the heading gap\n   */\n  @Prop() readonly noHeadingGap: boolean = false;\n\n  /**\n   * Removes the padding from the heading\n   */\n  @Prop() readonly noHeadingPadding: boolean = false;\n\n  /**\n   * Removes the padding block end from the heading\n   */\n  @Prop() readonly noHeadingPaddingBlockEnd: boolean = false;\n\n  /**\n   * Adds padding to the top of the heading\n   */\n  @Prop() readonly headingPaddingTop: boolean = false;\n\n  /**\n   * The heading justification\n   */\n  @Prop() readonly headingJustify: HeadingJustify = \"center\";\n\n  /**\n   * It forces the .heading__title min-height to be as tall as the gxg-form-text height. This is useful when you are displaying two gx-ide-container's on the same row, both of them display a title, and one of them displays a gxg-form-text in the header (usually used to filter content). Without this property set to true, the .heading without a gxg-from-text would be shorter. At the time of writing, this is used on ww-images.\n   */\n  @Prop() readonly titleHeightAsInput: boolean = false;\n\n  /**\n   * Makes the header (.heading) display flex:row, instad of the default flex:column.\n   */\n  @Prop() readonly flexRow: boolean = false;\n\n  /* CONTENT */\n\n  /**\n   * Makes the content a flex container\n   */\n  @Prop() readonly flexContent: boolean = false;\n\n  /**\n   * Removes the border-top from the content\n   */\n  @Prop() readonly noContentBorderTop: boolean = false;\n\n  /**\n   * Removes the padding from the content\n   */\n  @Prop() readonly noContentPadding: boolean = false;\n\n  /**\n   * Removes the gap from the content\n   */\n  @Prop() readonly noContentGap: boolean = false;\n\n  /**\n   * Align items\n   */\n  @Prop() readonly alignItems: AlignItems = undefined;\n\n  /**\n   * Justify content\n   */\n  @Prop() readonly justifyContent: JustifyContent = undefined;\n\n  /**\n   * Display border end on the content\n   */\n  @Prop() readonly contentBorderEnd: boolean = false;\n\n  /* FOOTER ABOVE */\n\n  /**\n   * Makes the above footer vertical padding slimmer\n   */\n  @Prop() readonly slimmerAboveFooter: boolean = false;\n\n  /**\n   * Removes the above padding from the footer\n   */\n  @Prop() readonly noAboveFooterPadding: boolean = false;\n\n  /**\n   * Removes the above border top\n   */\n  @Prop() readonly noBorderAboveFooter: boolean = false;\n\n  /* FOOTER > START and FOOTER > END*/\n\n  /**\n   * Makes the footer vertical padding slimmer\n   */\n  @Prop() readonly slimmerFooter: boolean = false;\n\n  /**\n   * Removes the padding from the footer\n   */\n  @Prop() readonly noFooterPadding: boolean = false;\n\n  /**\n   * The footer justification\n   */\n  @Prop() readonly footerJustify: FooterJustify = \"end\";\n\n  /**\n   * Removes the border top from the footer\n   */\n  @Prop() readonly noBorderFooter: boolean = false;\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeContainerElement;\n\n  // 3.STATE() VARIABLES //\n\n  /**\n   * A boolean variable indicating if the component has or not any content for the 'header' slot\n   */\n  @State() hasHeaderSlot = false;\n\n  /**\n   * A boolean variable indicating if the component has or not any content slotted content (regular slotted content, without 'slot' attribute)\n   */\n  @State() hasSlottedContent = false;\n\n  /**\n   * A boolean variable indicating if the component has or not any content for the 'footer' slot\n   */\n  @State() hasFooterSlot = false;\n\n  /**\n   * A boolean variable indicating if the component has or not any content for the 'footer' slot\n   */\n  @State() hasAboveFooterSlot = false;\n\n  /**\n   * A boolean variable indicating that the container only has the heading section\n   */\n  @State() hasOnlyHeading = false;\n\n  /**\n   * A boolean variable indicating that the container only has the content section\n   */\n  @State() hasOnlyContent = false;\n\n  /**\n   * A boolean variable indicating that the container only has the footer section\n   */\n  @State() hasOnlyFooter = false;\n\n  // 4.PUBLIC PROPERTY API //\n\n  // 5.EVENTS (EMIT) //\n\n  // 6.COMPONENT LIFECYCLE EVENTS //\n\n  componentWillLoad() {\n    this.evaluateSlots();\n  }\n\n  // 7.LISTENERS //\n\n  // 8.PUBLIC METHODS API //\n\n  // 9.LOCAL METHODS //\n\n  private evaluateSlots() {\n    // header\n    const headerSlot = this.el.querySelectorAll(':scope > [slot=\"header\"]');\n    if (headerSlot.length) {\n      this.hasHeaderSlot = true;\n    }\n    // content\n    const slottedContent = this.el.querySelectorAll(\":scope >  :not([slot])\");\n    if (slottedContent.length) {\n      this.hasSlottedContent = true;\n    }\n    // footer\n    const footerAboveSlot = this.el.querySelectorAll(\n      ':scope >  [slot=\"footer-above\"]'\n    );\n    const footerStartSlot = this.el.querySelectorAll(\n      ':scope >  [slot=\"footer-start\"]'\n    );\n    const footerEndSlot = this.el.querySelectorAll(\n      ':scope >  [slot=\"footer-end\"]'\n    );\n    if (footerStartSlot.length || footerEndSlot.length) {\n      this.hasFooterSlot = true;\n    }\n    if (footerAboveSlot.length) {\n      this.hasAboveFooterSlot = true;\n    }\n  }\n\n  private evaluateSections() {\n    // has only heading\n    if (\n      !this.hasSlottedContent &&\n      !this.hasFooterSlot &&\n      !this.hasAboveFooterSlot\n    ) {\n      this.hasOnlyHeading = true;\n    }\n    // has only content\n    if (\n      this.hasSlottedContent &&\n      !this.containerTitle &&\n      !this.hasHeaderSlot &&\n      !this.hasAboveFooterSlot &&\n      !this.hasFooterSlot\n    ) {\n      this.hasOnlyContent = true;\n    }\n    // has only footer\n    if (\n      !this.hasSlottedContent &&\n      !this.containerTitle &&\n      !this.hasAboveFooterSlot\n    ) {\n      this.hasOnlyFooter = true;\n    }\n  }\n\n  private headingClasses = (): string | { [className: string]: boolean } => {\n    return {\n      \"heading\": true,\n      \"heading--inactive\": this.inactiveTitle,\n      \"heading--slimmer\": this.titleType === \"secondary\",\n      \"heading--no-border\": this.noHeadingBorder || this.hasOnlyHeading,\n      [`heading--justify-${this.headingJustify}`]: true,\n      \"heading--no-padding\": this.noHeadingPadding,\n      \"heading--no-padding-block-end\": this.noHeadingPaddingBlockEnd,\n      \"heading--no-gap\": this.noHeadingGap,\n      \"heading--padding-top\":\n        this.headingPaddingTop && this.containerTitle?.length > 0,\n      \"heading--form-text-height\": this.titleHeightAsInput,\n      \"heading--flex-row\": this.flexRow\n    };\n  };\n\n  private contentClasses = (): string | { [className: string]: boolean } => {\n    return {\n      \"content\": true,\n      \"content--flex\": this.flexContent,\n      \"content--no-padding\": this.noContentPadding,\n      \"content--no-gap\": this.noContentGap,\n      \"content--no-border-top\": this.noContentBorderTop,\n      \"content--border-end\": this.contentBorderEnd,\n      [`content--align-items-${this.alignItems}`]:\n        this.alignItems !== undefined,\n      [`content--justify-content-${this.justifyContent}`]:\n        this.justifyContent !== undefined\n    };\n  };\n\n  private aboveFooter = (): JSX.Element | null => {\n    return this.hasAboveFooterSlot ? (\n      <footer\n        class={{\n          \"footer-above\": true,\n          \"footer-above--no-border-top\": this.noBorderAboveFooter,\n          \"footer-above--no-padding\": this.noAboveFooterPadding,\n          \"footer-above--slimmer\": this.slimmerFooter\n        }}\n      >\n        <slot name=\"footer-above\"></slot>\n      </footer>\n    ) : null;\n  };\n\n  private footer = (): JSX.Element | null => {\n    return this.hasFooterSlot ? (\n      <footer\n        class={{\n          \"footer\": true,\n          \"footer--no-border\":\n            this.hasOnlyFooter ||\n            !this.hasSlottedContent ||\n            this.noBorderFooter,\n          [`footer--justify-${this.footerJustify}`]: true,\n          [`footer--justify-${this.footerJustify}`]: true,\n          \"footer--no-padding\": this.noFooterPadding,\n          \"footer--slimmer\": this.slimmerFooter\n        }}\n      >\n        <div class=\"footer__start\">\n          <slot name=\"footer-start\"></slot>\n        </div>\n        <div class=\"footer__end\">\n          <slot name=\"footer-end\"></slot>\n        </div>\n      </footer>\n    ) : null;\n  };\n\n  // 10.RENDER() FUNCTION //\n\n  render() {\n    this.evaluateSections();\n    const result = [\n      this.containerTitle || this.hasHeaderSlot ? (\n        <header class={this.headingClasses()}>\n          {this.containerTitle ? (\n            <gx-ide-title\n              class=\"heading__title\"\n              type={this.titleType}\n              alignment={this.titleAlignment as any}\n            >\n              {this.containerTitle}\n            </gx-ide-title>\n          ) : null}\n          {this.hasHeaderSlot ? (\n            <div class=\"heading__inner-wrapper\">\n              <slot name=\"header\"></slot>\n            </div>\n          ) : null}\n        </header>\n      ) : null,\n      this.hasSlottedContent ? (\n        <div class={this.contentClasses()} part=\"content\">\n          <slot></slot>\n        </div>\n      ) : null,\n      this.aboveFooter(),\n      this.footer()\n    ];\n\n    return (\n      <Host>\n        <div\n          class={{\n            \"container\": true,\n            [`container--padding-${this.sectionsPadding}`]: true,\n            \"container--display-border\": this.displayBorder,\n            \"container--display-border-top\": this.displayBorderTop,\n            \"container--display-border-end\": this.displayBorderEnd,\n            \"container--display-border-bottom\": this.displayBorderBottom,\n            \"container--display-border-start\": this.displayBorderStart,\n            \"container--only-content\": this.hasOnlyContent,\n            \"container--no-header\": !this.hasHeaderSlot && !this.containerTitle,\n            \"container--no-footer\":\n              !this.hasFooterSlot && !this.hasAboveFooterSlot\n          }}\n        >\n          {result}\n        </div>\n      </Host>\n    );\n  }\n}\n\nexport type HeadingJustify = \"start\" | \"center\" | \"end\";\nexport type FooterJustify = \"start\" | \"center\" | \"end\";\nexport type SectionsPadding = \"s\" | \"m\" | \"l\";\nexport type AlignItems = \"start\" | \"center\" | \"end\";\nexport type JustifyContent = \"start\" | \"center\" | \"end\";\n"]}

package/dist/collection/components/_helpers/list-selector/list-selector-item/list-selector-item.js

@@ -126,7 +126,7 @@ export class GxIdeListSelectorItem {
     }
     // 10.RENDER() FUNCTION //
     render() {
-        return (h(Host, { role: "listitem" }, h("input", { type: this.type, id: this.itemId, name: this.name, value: this.itemValue, checked: this.itemChecked, onChange: this.onChangeHandler, disabled: this.readonly, part: "input" }), h("label", { class: "label", htmlFor: this.itemId, part: "label" }, h("div", { class: "label__wrapper" }, this.index ? (h("span", { class: "label__index" }, this.index, ". ")) : null, this.icon ? (h("gxg-icon", { class: "label__icon", type: this.icon, size: this.iconSize, color: this.iconColor, part: "icon" })) : null, this.hasUniversalSlot ? (h("span", { class: "label__universal-slot", part: "universal-slot" }, h("slot", { name: "universal" }))) : null, h("span", { class: "label__description", part: "description" }, this.itemValue ? this.itemValue : h("slot", null))))));
+        return (h(Host, { role: "listitem" }, h("input", { type: this.type, id: this.itemId, name: this.name, value: this.itemValue, checked: this.itemChecked, onChange: this.onChangeHandler, disabled: this.readonly, part: "input" }), h("label", { class: "label", htmlFor: this.itemId, part: "label" }, h("div", { class: "label__wrapper" }, this.index ? (h("span", { class: "label__index" }, this.index, ". ")) : null, this.icon ? (h("gxg-icon", { class: "label__icon", type: this.icon, size: "small", color: this.iconColor, part: "icon" })) : null, this.hasUniversalSlot ? (h("span", { class: "label__universal-slot", part: "universal-slot" }, h("slot", { name: "universal" }))) : null, h("span", { class: "label__description", part: "description" }, this.itemValue ? this.itemValue : h("slot", null))))));
     }
     static get is() { return "gx-ide-list-selector-item"; }
     static get originalStyleUrls() {

package/dist/collection/components/_helpers/list-selector/list-selector-item/list-selector-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"list-selector-item.js","sourceRoot":"","sources":["../../../../../src/components/_helpers/list-selector/list-selector-item/list-selector-item.tsx"],"names":[],"mappings":"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","sourcesContent":["/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Element\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { Color, Size } from \"@genexus/gemini/dist/types/components/icon/icon\";\n/* CUSTOM IMPORTS */\n@Component({\n  tag: \"gx-ide-list-selector-item\",\n  styleUrl: \"list-selector-item.scss\",\n  shadow: false\n})\nexport class GxIdeListSelectorItem {\n  /*\nINDEX:\n1.OWN PROPERTIES \n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API | WATCH'S\n5.EVENTS (EMIT)\n6.COMPONENT LIFECYCLE METHODS\n7.LISTENERS\n8.PUBLIC METHODS API\n9.LOCAL METHODS\n10.RENDER() FUNCTION\n*/\n\n  // 1.OWN PROPERTIES | WATCH'S //\n\n  private parentIsListSelector: boolean;\n  private parentList: HTMLGxIdeListSelectorElement;\n  private checked: boolean;\n  private name: string;\n  private type: string;\n  private hasUniversalSlot = false;\n  private index: string = undefined;\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeListSelectorItemElement;\n\n  // 3.STATE() VARIABLES //\n\n  // 4.PUBLIC PROPERTY API | WATCH'S //\n\n  /**\n   * The item id\n   */\n  @Prop({ reflect: true }) readonly itemId!: string;\n\n  /**\n   * The item value, that acts as a label as well\n   */\n  @Prop() readonly itemValue!: string;\n\n  /**\n   * This will set the input as checked\n   */\n  @Prop({ mutable: true }) itemChecked = false;\n\n  /**\n   * It allows to select the item by clicking on it. It will emit the item-id\n   */\n  @Prop({ mutable: true, reflect: true }) readonly: boolean;\n\n  /**\n   * The presence of this property will force the item text to not-wrap, and have ellipsis\n   */\n  @Prop({ mutable: true, reflect: true }) ellipsis: boolean;\n\n  /**\n   * The gemini icon name\n   */\n  @Prop() readonly icon: string;\n\n  /**\n   * The gemini icon color. If no one provided, it will inherit the value from the list-selector\n   */\n  @Prop({ mutable: true }) iconColor: Color;\n\n  /**\n   * The gemini icon size. Inherited from the parent.\n   */\n  @Prop({ mutable: true }) iconSize: Size;\n\n  /**\n   * Disables the item border\n   */\n  @Prop({ mutable: true, reflect: true }) noBorder = false;\n\n  /**\n   * Displays the universal slot at the end, instead of at the benign\n   */\n  @Prop({ reflect: true }) readonly universalSlotEnd = false;\n\n  // 5.EVENTS (EMIT) //\n\n  componentWillLoad() {\n    this.evaluateParentIsListSelector();\n    this.evaluateType();\n    this.evaluateSelectable();\n    this.evaluateEllipsis();\n    this.evaluateChecked();\n    this.evaluateIconColor();\n    this.evaluateIconSize();\n    this.evaluateBorder();\n    this.evaluateUniversalSlot();\n    this.assignName();\n    this.evaluateOrderedList();\n  }\n\n  /**\n   * Emits the item data\n   */\n  @Event() itemSelectionChanged: EventEmitter<ItemData>;\n\n  // 6.COMPONENT LIFECYCLE METHODS //\n\n  // 7.LISTENERS //\n\n  // 8.PUBLIC METHODS API //\n\n  // 9.LOCAL METHODS //\n\n  /**\n   * Checks if this item parentElement is a gx-ide-list-selector, and assigns a reference\n   */\n  private evaluateParentIsListSelector = () => {\n    const parentList = this.el.parentElement as HTMLGxIdeListSelectorElement;\n    this.parentIsListSelector = parentList?.nodeName === \"GX-IDE-LIST-SELECTOR\";\n    this.parentIsListSelector && (this.parentList = parentList);\n  };\n\n  /**\n   * Determines the type of item, based on the parent list-selector 'type' property value\n   */\n  private evaluateType = () => {\n    const parentList: HTMLGxIdeListSelectorElement = this.el\n      .parentElement as HTMLGxIdeListSelectorElement;\n    this.type = parentList.type === \"single-selection\" ? \"radio\" : \"checkbox\";\n  };\n\n  /**\n   * Evaluates if is selectable, considering the parent list-selector 'selectable' property value, only if it is undefined on this item\n   */\n  private evaluateSelectable = () => {\n    if (this.readonly === undefined && this.parentIsListSelector) {\n      this.readonly = this.parentList.readonly;\n    }\n  };\n\n  /**\n   * Evaluates if text should truncate with ellipsis, considering the parent list-selector 'ellipsis' property value, only if it is undefined on this item\n   */\n  private evaluateEllipsis = () => {\n    if (this.ellipsis === undefined && this.parentIsListSelector) {\n      this.ellipsis = this.parentList.ellipsis;\n    }\n  };\n\n  /**\n   * Evaluates if this item should be initially checked, only if the parent list-selector listValue equals this item value.\n   */\n  private evaluateChecked = () => {\n    if (\n      this.checked === undefined &&\n      this.parentIsListSelector &&\n      this.parentList.value !== undefined &&\n      this.parentList.value === this.itemValue\n    ) {\n      this.checked = true;\n    }\n  };\n\n  private evaluateBorder = () => {\n    if (this.parentIsListSelector) {\n      this.noBorder = this.parentList.noItemsBorder;\n    }\n  };\n\n  private evaluateUniversalSlot = () => {\n    this.hasUniversalSlot = !!this.el.querySelector(\"[slot=universal]\");\n  };\n\n  /**\n   * Gets the listName required value, that is needed for the list selection to properly work\n   */\n  private assignName = () => {\n    this.parentIsListSelector &&\n      this.parentList.listName &&\n      (this.name = this.parentList.listName);\n  };\n\n  private evaluateOrderedList = () => {\n    if (this.parentIsListSelector && this.parentList.ordered) {\n      let index: number | string =\n        Array.from(this.parentList.children).indexOf(this.el) + 1;\n      if (index < 10) {\n        // This will make descriptions to be nicely aligned, between one digit, and two digit indexes items.\n        index = `0${index}`;\n      } else {\n        index = `${index}`;\n      }\n      this.index = index;\n    }\n  };\n\n  private evaluateIconColor = () => {\n    this.parentIsListSelector &&\n      this.parentList.iconsColor &&\n      this.iconColor === undefined &&\n      (this.iconColor = this.parentList.iconsColor);\n  };\n\n  private evaluateIconSize = () => {\n    this.parentIsListSelector &&\n      this.parentList.iconsSize &&\n      (this.iconSize = this.parentList.iconsSize);\n  };\n\n  private onChangeHandler = (e: Event) => {\n    this.itemChecked = (e.target as HTMLInputElement).checked;\n    this.itemSelectionChanged.emit({\n      itemId: this.itemId,\n      itemValue: this.itemValue\n    });\n  };\n\n  // 10.RENDER() FUNCTION //\n\n  render() {\n    return (\n      <Host role=\"listitem\">\n        <input\n          type={this.type}\n          id={this.itemId}\n          name={this.name}\n          value={this.itemValue}\n          checked={this.itemChecked}\n          onChange={this.onChangeHandler}\n          disabled={this.readonly}\n          part=\"input\"\n        />\n        <label class=\"label\" htmlFor={this.itemId} part=\"label\">\n          <div class=\"label__wrapper\">\n            {this.index ? (\n              <span class=\"label__index\">{this.index}. </span>\n            ) : null}\n            {this.icon ? (\n              <gxg-icon\n                class=\"label__icon\"\n                type={this.icon}\n                size={this.iconSize}\n                color={this.iconColor}\n                part=\"icon\"\n              ></gxg-icon>\n            ) : null}\n            {this.hasUniversalSlot ? (\n              <span class=\"label__universal-slot\" part=\"universal-slot\">\n                <slot name=\"universal\"></slot>\n              </span>\n            ) : null}\n            <span class=\"label__description\" part=\"description\">\n              {this.itemValue ? this.itemValue : <slot></slot>}\n            </span>\n          </div>\n        </label>\n      </Host>\n    );\n  }\n}\n\nexport type ItemData = {\n  itemId: string;\n  itemValue: string;\n  itemIcon?: string;\n};\n"]}
+{"version":3,"file":"list-selector-item.js","sourceRoot":"","sources":["../../../../../src/components/_helpers/list-selector/list-selector-item/list-selector-item.tsx"],"names":[],"mappings":"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","sourcesContent":["/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Element\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { Color, Size } from \"@genexus/gemini/dist/types/components/icon/icon\";\n/* CUSTOM IMPORTS */\n@Component({\n  tag: \"gx-ide-list-selector-item\",\n  styleUrl: \"list-selector-item.scss\",\n  shadow: false\n})\nexport class GxIdeListSelectorItem {\n  /*\nINDEX:\n1.OWN PROPERTIES \n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API | WATCH'S\n5.EVENTS (EMIT)\n6.COMPONENT LIFECYCLE METHODS\n7.LISTENERS\n8.PUBLIC METHODS API\n9.LOCAL METHODS\n10.RENDER() FUNCTION\n*/\n\n  // 1.OWN PROPERTIES | WATCH'S //\n\n  private parentIsListSelector: boolean;\n  private parentList: HTMLGxIdeListSelectorElement;\n  private checked: boolean;\n  private name: string;\n  private type: string;\n  private hasUniversalSlot = false;\n  private index: string = undefined;\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeListSelectorItemElement;\n\n  // 3.STATE() VARIABLES //\n\n  // 4.PUBLIC PROPERTY API | WATCH'S //\n\n  /**\n   * The item id\n   */\n  @Prop({ reflect: true }) readonly itemId!: string;\n\n  /**\n   * The item value, that acts as a label as well\n   */\n  @Prop() readonly itemValue!: string;\n\n  /**\n   * This will set the input as checked\n   */\n  @Prop({ mutable: true }) itemChecked = false;\n\n  /**\n   * It allows to select the item by clicking on it. It will emit the item-id\n   */\n  @Prop({ mutable: true, reflect: true }) readonly: boolean;\n\n  /**\n   * The presence of this property will force the item text to not-wrap, and have ellipsis\n   */\n  @Prop({ mutable: true, reflect: true }) ellipsis: boolean;\n\n  /**\n   * The gemini icon name\n   */\n  @Prop() readonly icon: string;\n\n  /**\n   * The gemini icon color. If no one provided, it will inherit the value from the list-selector\n   */\n  @Prop({ mutable: true }) iconColor: Color;\n\n  /**\n   * The gemini icon size. Inherited from the parent.\n   */\n  @Prop({ mutable: true }) iconSize: Size;\n\n  /**\n   * Disables the item border\n   */\n  @Prop({ mutable: true, reflect: true }) noBorder = false;\n\n  /**\n   * Displays the universal slot at the end, instead of at the benign\n   */\n  @Prop({ reflect: true }) readonly universalSlotEnd = false;\n\n  // 5.EVENTS (EMIT) //\n\n  componentWillLoad() {\n    this.evaluateParentIsListSelector();\n    this.evaluateType();\n    this.evaluateSelectable();\n    this.evaluateEllipsis();\n    this.evaluateChecked();\n    this.evaluateIconColor();\n    this.evaluateIconSize();\n    this.evaluateBorder();\n    this.evaluateUniversalSlot();\n    this.assignName();\n    this.evaluateOrderedList();\n  }\n\n  /**\n   * Emits the item data\n   */\n  @Event() itemSelectionChanged: EventEmitter<ItemData>;\n\n  // 6.COMPONENT LIFECYCLE METHODS //\n\n  // 7.LISTENERS //\n\n  // 8.PUBLIC METHODS API //\n\n  // 9.LOCAL METHODS //\n\n  /**\n   * Checks if this item parentElement is a gx-ide-list-selector, and assigns a reference\n   */\n  private evaluateParentIsListSelector = () => {\n    const parentList = this.el.parentElement as HTMLGxIdeListSelectorElement;\n    this.parentIsListSelector = parentList?.nodeName === \"GX-IDE-LIST-SELECTOR\";\n    this.parentIsListSelector && (this.parentList = parentList);\n  };\n\n  /**\n   * Determines the type of item, based on the parent list-selector 'type' property value\n   */\n  private evaluateType = () => {\n    const parentList: HTMLGxIdeListSelectorElement = this.el\n      .parentElement as HTMLGxIdeListSelectorElement;\n    this.type = parentList.type === \"single-selection\" ? \"radio\" : \"checkbox\";\n  };\n\n  /**\n   * Evaluates if is selectable, considering the parent list-selector 'selectable' property value, only if it is undefined on this item\n   */\n  private evaluateSelectable = () => {\n    if (this.readonly === undefined && this.parentIsListSelector) {\n      this.readonly = this.parentList.readonly;\n    }\n  };\n\n  /**\n   * Evaluates if text should truncate with ellipsis, considering the parent list-selector 'ellipsis' property value, only if it is undefined on this item\n   */\n  private evaluateEllipsis = () => {\n    if (this.ellipsis === undefined && this.parentIsListSelector) {\n      this.ellipsis = this.parentList.ellipsis;\n    }\n  };\n\n  /**\n   * Evaluates if this item should be initially checked, only if the parent list-selector listValue equals this item value.\n   */\n  private evaluateChecked = () => {\n    if (\n      this.checked === undefined &&\n      this.parentIsListSelector &&\n      this.parentList.value !== undefined &&\n      this.parentList.value === this.itemValue\n    ) {\n      this.checked = true;\n    }\n  };\n\n  private evaluateBorder = () => {\n    if (this.parentIsListSelector) {\n      this.noBorder = this.parentList.noItemsBorder;\n    }\n  };\n\n  private evaluateUniversalSlot = () => {\n    this.hasUniversalSlot = !!this.el.querySelector(\"[slot=universal]\");\n  };\n\n  /**\n   * Gets the listName required value, that is needed for the list selection to properly work\n   */\n  private assignName = () => {\n    this.parentIsListSelector &&\n      this.parentList.listName &&\n      (this.name = this.parentList.listName);\n  };\n\n  private evaluateOrderedList = () => {\n    if (this.parentIsListSelector && this.parentList.ordered) {\n      let index: number | string =\n        Array.from(this.parentList.children).indexOf(this.el) + 1;\n      if (index < 10) {\n        // This will make descriptions to be nicely aligned, between one digit, and two digit indexes items.\n        index = `0${index}`;\n      } else {\n        index = `${index}`;\n      }\n      this.index = index;\n    }\n  };\n\n  private evaluateIconColor = () => {\n    this.parentIsListSelector &&\n      this.parentList.iconsColor &&\n      this.iconColor === undefined &&\n      (this.iconColor = this.parentList.iconsColor);\n  };\n\n  private evaluateIconSize = () => {\n    this.parentIsListSelector &&\n      this.parentList.iconsSize &&\n      (this.iconSize = this.parentList.iconsSize);\n  };\n\n  private onChangeHandler = (e: Event) => {\n    this.itemChecked = (e.target as HTMLInputElement).checked;\n    this.itemSelectionChanged.emit({\n      itemId: this.itemId,\n      itemValue: this.itemValue\n    });\n  };\n\n  // 10.RENDER() FUNCTION //\n\n  render() {\n    return (\n      <Host role=\"listitem\">\n        <input\n          type={this.type}\n          id={this.itemId}\n          name={this.name}\n          value={this.itemValue}\n          checked={this.itemChecked}\n          onChange={this.onChangeHandler}\n          disabled={this.readonly}\n          part=\"input\"\n        />\n        <label class=\"label\" htmlFor={this.itemId} part=\"label\">\n          <div class=\"label__wrapper\">\n            {this.index ? (\n              <span class=\"label__index\">{this.index}. </span>\n            ) : null}\n            {this.icon ? (\n              <gxg-icon\n                class=\"label__icon\"\n                type={this.icon}\n                size=\"small\"\n                color={this.iconColor}\n                part=\"icon\"\n              ></gxg-icon>\n            ) : null}\n            {this.hasUniversalSlot ? (\n              <span class=\"label__universal-slot\" part=\"universal-slot\">\n                <slot name=\"universal\"></slot>\n              </span>\n            ) : null}\n            <span class=\"label__description\" part=\"description\">\n              {this.itemValue ? this.itemValue : <slot></slot>}\n            </span>\n          </div>\n        </label>\n      </Host>\n    );\n  }\n}\n\nexport type ItemData = {\n  itemId: string;\n  itemValue: string;\n  itemIcon?: string;\n};\n"]}

package/dist/collection/components/_helpers/list-selector/list-selector.css

@@ -513,6 +513,10 @@ gxg-tabs {
   box-sizing: border-box;
 }
 
+p {
+  margin: 0;
+}
+
 *,
 ::after,
 ::before {

package/dist/collection/components/_helpers/status-buttons/gx-ide-status-buttons.css

@@ -419,7 +419,6 @@ Compact size
   font-size: var(--mer-font__size--xxs);
 }
 :host([compact]) .label__wrapper {
-  gap: var(--mer-spacing--xxs);
   padding: var(--mer-spacing--xxxs) var(--mer-spacing--xs) var(--mer-spacing--xxxs) var(--mer-spacing--xxs);
 }
 :host([compact]) .label__wrapper:before {

package/dist/collection/components/_starting-template/template.css

@@ -508,6 +508,10 @@ gxg-tabs {
   box-sizing: border-box;
 }
 
+p {
+  margin: 0;
+}
+
 /*Gx Ide*/
 /*@container queries*/
 /* hiChar styles

package/dist/collection/components/ai-assistant/ai-assistant.css

@@ -508,6 +508,10 @@ gxg-tabs {
   box-sizing: border-box;
 }
 
+p {
+  margin: 0;
+}
+
 /*Gx Ide*/
 /*@container queries*/
 /* hiChar styles

package/dist/collection/components/bpm-application-declaration/bpm-app-declaration.css

@@ -508,6 +508,10 @@ gxg-tabs {
   box-sizing: border-box;
 }
 
+p {
+  margin: 0;
+}
+
 /*Gx Ide*/
 /*@container queries*/
 /* hiChar styles

package/dist/collection/components/create-kb-from-server/create-kb-from-server.css

@@ -508,6 +508,10 @@ gxg-tabs {
   box-sizing: border-box;
 }
 
+p {
+  margin: 0;
+}
+
 /*Gx Ide*/
 /*@container queries*/
 /* hiChar styles

package/dist/collection/components/dashboard-home/dashboard-home.css

@@ -823,6 +823,10 @@ gxg-tabs {
   box-sizing: border-box;
 }
 
+p {
+  margin: 0;
+}
+
 /*Gx Ide*/
 /*@container queries*/
 /* hiChar styles

package/dist/collection/components/data-selector/data-selector.css

@@ -508,6 +508,10 @@ gxg-tabs {
   box-sizing: border-box;
 }
 
+p {
+  margin: 0;
+}
+
 /*Gx Ide*/
 /*@container queries*/
 /* hiChar styles

package/dist/collection/components/gam-installation-settings/gam-installation-settings.css

@@ -508,6 +508,10 @@ gxg-tabs {
   box-sizing: border-box;
 }
 
+p {
+  margin: 0;
+}
+
 /*Gx Ide*/
 /*@container queries*/
 /* hiChar styles
@@ -520,9 +524,7 @@ Found on /common/helpers.tsx hiChar function is used to add a span/class to ever
 /*Header*/
 .header {
   border-top: 1px solid var(--gx-ide-container-border-color);
-  display: grid;
   padding: var(--gx-ide-container__padding) var(--gx-ide-container__padding);
-  gap: var(--gx-ide-grid-row-gap);
 }
 
 /*Main*/
@@ -534,6 +536,37 @@ Found on /common/helpers.tsx hiChar function is used to add a span/class to ever
 .filters {
   display: grid;
   gap: var(--gx-ide-grid-column-gap);
-  border-block-start: 1px solid var(--gx-ide-container-border-color);
   padding: var(--gx-ide-container__padding);
+}
+.filters__wrapper {
+  display: flex;
+  gap: var(--gx-ide-container__padding);
+}
+.filters__wrapper > * {
+  flex: 1;
+}
+.filters__front-end-objects {
+  display: flex;
+  gap: var(--gx-ide-grid-column-gap);
+}
+
+.footer-above {
+  display: flex;
+  gap: var(--gx-ide-container__padding);
+}
+.footer-above > * {
+  flex: 1;
+  font-size: var(--mer-font__size--xxs);
+  padding: var(--mer-spacing--xs);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  line-height: 1.5em;
+}
+.footer-above > *:first-child {
+  border-inline-end: var(--mer-border__width--sm) solid var(--gx-ide-container-border-color);
+}
+.footer-above__right {
+  display: flex;
+  flex-direction: column;
 }

package/dist/collection/components/gam-installation-settings/gam-installation-settings.js

@@ -4,24 +4,6 @@ import { Host, h } from "@stencil/core";
 /* CUSTOM IMPORTS */
 import { config } from "../../common/config";
 import { Locale } from "../../common/locale";
-import { renderComboItems } from "../../common/render-combo-items";
-const COMBO_BOX_DATA = [
-    {
-        id: "install-automatically",
-        name: "Install Updates Automatically",
-        value: "automatic"
-    },
-    {
-        id: "prompt-update",
-        name: "Prompt me to Update",
-        value: "prompt"
-    },
-    {
-        id: "never-update",
-        name: "Never Update",
-        value: "never"
-    }
-];
 export class GxIdeGamInstallationSettings {
     constructor() {
         this.renderedFirstTime = false;
@@ -57,16 +39,23 @@ export class GxIdeGamInstallationSettings {
         };
         /* Renders*/
         this.renderHeader = () => {
-            return (h("header", { class: "header", slot: "header" }, h("gxg-text", { type: "text-regular" }, this.configurationType === "installation"
-                ? this._componentLocale.header.headerTextInstallation.firstSentence
-                : this._componentLocale.header.headerTextUpdate.firstSentence), h("gxg-text", { type: "text-regular" }, this.configurationType === "installation"
-                ? this._componentLocale.header.headerTextInstallation.secondSentence
-                : this._componentLocale.header.headerTextUpdate.secondSentence), h("gxg-text", { type: "text-regular" }, this.configurationType === "installation"
-                ? this._componentLocale.header.headerTextInstallation.thirdSentence
-                : this._componentLocale.header.headerTextUpdate.thirdSentence)));
+            return (h("header", { class: "header", slot: "header" }, this.configurationType === "installation"
+                ? [
+                    h("gxg-text", { type: "text-regular" }, this._componentLocale.header.headerTextInstallation
+                        .firstSentence),
+                    h("gxg-text", { type: "text-regular" }, this._componentLocale.header.headerTextInstallation
+                        .secondSentence),
+                    h("gxg-text", { type: "text-regular" }, this._componentLocale.header.headerTextInstallation
+                        .thirdSentence)
+                ]
+                : [
+                    h("gxg-text", { type: "text-regular" }, this._componentLocale.header.headerTextUpdate.firstSentence),
+                    h("gxg-text", { type: "text-regular" }, this._componentLocale.header.headerTextUpdate.secondSentence)
+                ]));
         };
         this.renderFilters = () => {
-            return (h("div", { class: "filters" }, h("gxg-title", { type: "title-05" }, this._componentLocale.filters.filtersHeading), h("gxg-form-checkbox", { label: this._componentLocale.filters.webPanelsCheckbox, part: "web-panels-checkbox", slot: "footer-start", ref: (el) => (this.webPanelsCheckboxEl = el) }), h("gxg-form-checkbox", { label: this._componentLocale.filters.panelsCheckbox, part: "panels-checkbox", slot: "footer-start", ref: (el) => (this.panelsCheckboxEl = el) }), h("gxg-combo-box", { label: this._componentLocale.filters.futureUpgradesComboLabel, disableFilter: true, value: COMBO_BOX_DATA[0].value, part: "future-upgrades-combo", ref: (el) => (this.futureUpgradesComboEl = el) }, renderComboItems(COMBO_BOX_DATA !== null && COMBO_BOX_DATA !== void 0 ? COMBO_BOX_DATA : []))));
+            return (h("div", { class: "filters" }, h("gxg-title", { type: "title-05" }, this._componentLocale.filters.filtersHeading), h("div", { class: "filters__wrapper" }, h("div", { class: "filters__wrapper-left" }, h("gxg-label", { labelPosition: "above", center: false }, "Front End Objects"), h("div", { class: "filters__front-end-objects" }, h("gxg-form-checkbox", { label: this._componentLocale.filters.webPanelsCheckbox, part: "web-panels-checkbox", slot: "footer-start", ref: (el) => (this.webPanelsCheckboxEl = el) }), h("gxg-form-checkbox", { label: this._componentLocale.filters.panelsCheckbox, part: "panels-checkbox", slot: "footer-start", ref: (el) => (this.panelsCheckboxEl = el) }))), h("div", { class: "filters__wrapper-right" }, h("gxg-combo-box", { label: this._componentLocale.filters.futureUpgradesComboLabel, disableFilter: true, part: "future-upgrades-combo", ref: (el) => (this.futureUpgradesComboEl = el) }, h("gxg-combo-box-item", { value: "automatic" }, this._componentLocale.manageFutureUpgrades
+                .installAutomatically), h("gxg-combo-box-item", { value: "prompt" }, this._componentLocale.manageFutureUpgrades.promptMe), h("gxg-combo-box-item", { value: "never" }, this._componentLocale.manageFutureUpgrades.neverUpdate))))));
         };
         this.fileName = "";
         this.selectedFile = undefined;
@@ -89,7 +78,7 @@ export class GxIdeGamInstallationSettings {
     }
     // 10.RENDER() FUNCTION //
     render() {
-        return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", { noHeadingPadding: true, headingPaddingTop: true, noContentPadding: true, noContentGap: true, containerTitle: this.displayTitle ? this._componentLocale.componentName : null, slimmerFooter: config.gxIdeContainer.slimmerFooter }, this.renderHeader(), this.renderFilters(), h("gxg-text", { type: "text-regular", slot: "footer-above" }, this._componentLocale.footer.footerSaveCancelText), h("gxg-text", { type: "text-regular", slot: "footer-above" }, this._componentLocale.footer.footerRepairText), h("gxg-button", { type: "outlined", slot: "footer-start", onClick: this.repairCallbackHandler }, this._componentLocale.footer.repairButton), h("gxg-button", { type: "outlined", slot: "footer-end", onClick: this.cancelCallbackHandler }, this._componentLocale.footer.cancelButton), h("gxg-button", { slot: "footer-end", onClick: this.saveCallbackHandler }, this._componentLocale.footer.confirmButton)))));
+        return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", { noHeadingPadding: true, headingPaddingTop: true, noContentPadding: true, noContentGap: true, noAboveFooterPadding: true, containerTitle: this.displayTitle ? this._componentLocale.componentName : null, slimmerFooter: config.gxIdeContainer.slimmerFooter }, this.renderHeader(), this.renderFilters(), h("div", { class: "footer-above", slot: "footer-above" }, h("div", { class: "footer-above__left" }, h("p", null, this._componentLocale.footer.footerRepairText)), h("div", { class: "footer-above__right" }, h("p", null, this._componentLocale.footer.footerSaveText), h("p", null, this._componentLocale.footer.footerCancelText))), h("gxg-button", { type: "outlined", slot: "footer-start", onClick: this.repairCallbackHandler }, this._componentLocale.footer.repairButton), h("gxg-button", { type: "outlined", slot: "footer-end", onClick: this.cancelCallbackHandler }, this._componentLocale.footer.cancelButton), h("gxg-button", { slot: "footer-end", onClick: this.saveCallbackHandler }, this._componentLocale.footer.confirmButton)))));
     }
     static get is() { return "gx-ide-gam-installation-settings"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gam-installation-settings/gam-installation-settings.js.map

@@ -1 +1 @@
-{"version":3,"file":"gam-installation-settings.js","sourceRoot":"","sources":["../../../src/components/gam-installation-settings/gam-installation-settings.tsx"],"names":[],"mappings":"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","sourcesContent":["/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  State\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\n/* CUSTOM IMPORTS */\nimport { config } from \"../../common/config\";\nimport { Locale } from \"../../common/locale\";\nimport { renderComboItems } from \"../../common/render-combo-items\";\nimport { GxOption } from \"../../common/types\";\n\nconst COMBO_BOX_DATA: GxOption[] = [\n  {\n    id: \"install-automatically\",\n    name: \"Install Updates Automatically\",\n    value: \"automatic\"\n  },\n  {\n    id: \"prompt-update\",\n    name: \"Prompt me to Update\",\n    value: \"prompt\"\n  },\n  {\n    id: \"never-update\",\n    name: \"Never Update\",\n    value: \"never\"\n  }\n];\n\n@Component({\n  tag: \"gx-ide-gam-installation-settings\",\n  styleUrl: \"gam-installation-settings.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/gam-installation-settings\"]\n})\nexport class GxIdeGamInstallationSettings {\n  /*\nINDEX:\n1.OWN PROPERTIES \n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API | WATCH'S\n5.EVENTS (EMIT)\n6.COMPONENT LIFECYCLE METHODS\n7.LISTENERS\n8.PUBLIC METHODS API\n9.LOCAL METHODS\n10.RENDER() FUNCTION\n*/\n\n  // 1.OWN PROPERTIES //\n\n  /**\n   * The component hard-coded strings translations.\n   */\n  private _componentLocale: any;\n  private renderedFirstTime = false;\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeGamInstallationSettingsElement;\n\n  private webPanelsCheckboxEl!: HTMLGxgFormCheckboxElement;\n  private panelsCheckboxEl!: HTMLGxgFormCheckboxElement;\n  private futureUpgradesComboEl!: HTMLGxgComboBoxElement;\n\n  // 3.STATE() VARIABLES //\n\n  /**\n   * Current value for Used in objects\n   */\n\n  @State() fileName: string = \"\";\n  @State() selectedFile: File;\n  @State() importingIsInProcess = false;\n\n  // 4.PUBLIC PROPERTY API | WATCH'S //\n\n  /**\n   * If true it displays the component title on the header\n   */\n  @Prop() readonly displayTitle = false;\n\n  /**\n   * Specifies the configuration type to be used\n   */\n  @Prop() readonly configurationType: \"installation\" | \"update\" =\n    \"installation\";\n\n  /**\n   * Callback invoked when the user press repair button\n   */\n  @Prop() readonly repairCallback: RepairCallback;\n\n  /**\n   * Callback invoked when the user wants to start the exportation process\n   */\n  @Prop() readonly saveCallback: SaveCallback;\n\n  /**\n   * Callback invoked when the user wants to cancel the exportation process\n   */\n  @Prop() readonly cancelCallback: CancelCallback;\n\n  // 5.EVENTS (EMIT) //\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 METHODS //\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\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 repairCallbackHandler = async () => {\n    if (this.saveCallback) {\n      const data: GamConfigData = {\n        importWebPanels: this.webPanelsCheckboxEl.checked,\n        importPanels: this.panelsCheckboxEl.checked,\n        futureUpgrades: this.futureUpgradesComboEl.value\n          ? this.futureUpgradesComboEl.value\n          : null\n      };\n      await this.repairCallback(data);\n    }\n  };\n\n  private saveCallbackHandler = async () => {\n    if (this.saveCallback) {\n      const data: GamConfigData = {\n        importWebPanels: this.webPanelsCheckboxEl.checked,\n        importPanels: this.panelsCheckboxEl.checked,\n        futureUpgrades: this.futureUpgradesComboEl.value\n          ? this.futureUpgradesComboEl.value\n          : null\n      };\n      await this.saveCallback(data);\n    }\n  };\n  private cancelCallbackHandler = () => {\n    this.cancelCallback();\n  };\n\n  /* Renders*/\n  private renderHeader = () => {\n    return (\n      <header class=\"header\" slot=\"header\">\n        {/* header text */}\n        <gxg-text type=\"text-regular\">\n          {this.configurationType === \"installation\"\n            ? this._componentLocale.header.headerTextInstallation.firstSentence\n            : this._componentLocale.header.headerTextUpdate.firstSentence}\n        </gxg-text>\n        <gxg-text type=\"text-regular\">\n          {this.configurationType === \"installation\"\n            ? this._componentLocale.header.headerTextInstallation.secondSentence\n            : this._componentLocale.header.headerTextUpdate.secondSentence}\n        </gxg-text>\n        <gxg-text type=\"text-regular\">\n          {this.configurationType === \"installation\"\n            ? this._componentLocale.header.headerTextInstallation.thirdSentence\n            : this._componentLocale.header.headerTextUpdate.thirdSentence}\n        </gxg-text>\n      </header>\n    );\n  };\n\n  private renderFilters = () => {\n    return (\n      <div class=\"filters\">\n        <gxg-title type=\"title-05\">\n          {this._componentLocale.filters.filtersHeading}\n        </gxg-title>\n\n        <gxg-form-checkbox\n          label={this._componentLocale.filters.webPanelsCheckbox}\n          part=\"web-panels-checkbox\"\n          slot=\"footer-start\"\n          ref={(el: HTMLGxgFormCheckboxElement) =>\n            (this.webPanelsCheckboxEl = el as HTMLGxgFormCheckboxElement)\n          }\n        ></gxg-form-checkbox>\n        <gxg-form-checkbox\n          label={this._componentLocale.filters.panelsCheckbox}\n          part=\"panels-checkbox\"\n          slot=\"footer-start\"\n          ref={(el: HTMLGxgFormCheckboxElement) =>\n            (this.panelsCheckboxEl = el as HTMLGxgFormCheckboxElement)\n          }\n        ></gxg-form-checkbox>\n\n        <gxg-combo-box\n          label={this._componentLocale.filters.futureUpgradesComboLabel}\n          disableFilter\n          value={COMBO_BOX_DATA[0].value}\n          part=\"future-upgrades-combo\"\n          ref={(el: HTMLGxgComboBoxElement) =>\n            (this.futureUpgradesComboEl = el as HTMLGxgComboBoxElement)\n          }\n        >\n          {renderComboItems(COMBO_BOX_DATA ?? [])}\n        </gxg-combo-box>\n      </div>\n    );\n  };\n\n  // 10.RENDER() FUNCTION //\n\n  render() {\n    return (\n      <Host class=\"gx-ide-component\">\n        <div class=\"gx-ide-main-wrapper\">\n          <gx-ide-container\n            noHeadingPadding\n            headingPaddingTop\n            noContentPadding\n            noContentGap\n            containerTitle={\n              this.displayTitle ? this._componentLocale.componentName : null\n            }\n            slimmerFooter={config.gxIdeContainer.slimmerFooter}\n          >\n            {this.renderHeader()}\n            {this.renderFilters()}\n            <gxg-text type=\"text-regular\" slot=\"footer-above\">\n              {this._componentLocale.footer.footerSaveCancelText}\n            </gxg-text>\n            <gxg-text type=\"text-regular\" slot=\"footer-above\">\n              {this._componentLocale.footer.footerRepairText}\n            </gxg-text>\n\n            <gxg-button\n              type=\"outlined\"\n              slot=\"footer-start\"\n              onClick={this.repairCallbackHandler}\n            >\n              {this._componentLocale.footer.repairButton}\n            </gxg-button>\n\n            <gxg-button\n              type=\"outlined\"\n              slot=\"footer-end\"\n              onClick={this.cancelCallbackHandler}\n            >\n              {this._componentLocale.footer.cancelButton}\n            </gxg-button>\n            <gxg-button slot=\"footer-end\" onClick={this.saveCallbackHandler}>\n              {this._componentLocale.footer.confirmButton}\n            </gxg-button>\n          </gx-ide-container>\n        </div>\n      </Host>\n    );\n  }\n}\n\nexport type GamConfigData = {\n  importWebPanels: boolean;\n  importPanels: boolean;\n  futureUpgrades: \"never\" | \"prompt\" | \"automatic\";\n};\n\nexport type SaveCallback = (data: GamConfigData) => Promise<void>;\nexport type CancelCallback = () => Promise<void>;\nexport type RepairCallback = (config: GamConfigData) => Promise<void>;\n"]}
+{"version":3,"file":"gam-installation-settings.js","sourceRoot":"","sources":["../../../src/components/gam-installation-settings/gam-installation-settings.tsx"],"names":[],"mappings":"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","sourcesContent":["/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  State\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\n/* CUSTOM IMPORTS */\nimport { config } from \"../../common/config\";\nimport { Locale } from \"../../common/locale\";\n\n@Component({\n  tag: \"gx-ide-gam-installation-settings\",\n  styleUrl: \"gam-installation-settings.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/gam-installation-settings\"]\n})\nexport class GxIdeGamInstallationSettings {\n  // 1.OWN PROPERTIES //\n\n  /**\n   * The component hard-coded strings translations.\n   */\n  private _componentLocale: any;\n  private renderedFirstTime = false;\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeGamInstallationSettingsElement;\n\n  private webPanelsCheckboxEl!: HTMLGxgFormCheckboxElement;\n  private panelsCheckboxEl!: HTMLGxgFormCheckboxElement;\n  private futureUpgradesComboEl!: HTMLGxgComboBoxElement;\n\n  // 3.STATE() VARIABLES //\n\n  /**\n   * Current value for Used in objects\n   */\n\n  @State() fileName: string = \"\";\n  @State() selectedFile: File;\n  @State() importingIsInProcess = false;\n\n  // 4.PUBLIC PROPERTY API | WATCH'S //\n\n  /**\n   * If true it displays the component title on the header\n   */\n  @Prop() readonly displayTitle = false;\n\n  /**\n   * Specifies the configuration type to be used\n   */\n  @Prop() readonly configurationType: \"installation\" | \"update\" =\n    \"installation\";\n\n  /**\n   * Callback invoked when the user press repair button\n   */\n  @Prop() readonly repairCallback: RepairCallback;\n\n  /**\n   * Callback invoked when the user wants to start the exportation process\n   */\n  @Prop() readonly saveCallback: SaveCallback;\n\n  /**\n   * Callback invoked when the user wants to cancel the exportation process\n   */\n  @Prop() readonly cancelCallback: CancelCallback;\n\n  // 5.EVENTS (EMIT) //\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 METHODS //\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\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 repairCallbackHandler = async () => {\n    if (this.saveCallback) {\n      const data: GamConfigData = {\n        importWebPanels: this.webPanelsCheckboxEl.checked,\n        importPanels: this.panelsCheckboxEl.checked,\n        futureUpgrades: this.futureUpgradesComboEl.value\n          ? this.futureUpgradesComboEl.value\n          : null\n      };\n      await this.repairCallback(data);\n    }\n  };\n\n  private saveCallbackHandler = async () => {\n    if (this.saveCallback) {\n      const data: GamConfigData = {\n        importWebPanels: this.webPanelsCheckboxEl.checked,\n        importPanels: this.panelsCheckboxEl.checked,\n        futureUpgrades: this.futureUpgradesComboEl.value\n          ? this.futureUpgradesComboEl.value\n          : null\n      };\n      await this.saveCallback(data);\n    }\n  };\n  private cancelCallbackHandler = () => {\n    this.cancelCallback();\n  };\n\n  /* Renders*/\n  private renderHeader = () => {\n    return (\n      <header class=\"header\" slot=\"header\">\n        {this.configurationType === \"installation\"\n          ? [\n              <gxg-text type=\"text-regular\">\n                {\n                  this._componentLocale.header.headerTextInstallation\n                    .firstSentence\n                }\n              </gxg-text>,\n              <gxg-text type=\"text-regular\">\n                {\n                  this._componentLocale.header.headerTextInstallation\n                    .secondSentence\n                }\n              </gxg-text>,\n              <gxg-text type=\"text-regular\">\n                {\n                  this._componentLocale.header.headerTextInstallation\n                    .thirdSentence\n                }\n              </gxg-text>\n            ]\n          : [\n              <gxg-text type=\"text-regular\">\n                {this._componentLocale.header.headerTextUpdate.firstSentence}\n              </gxg-text>,\n              <gxg-text type=\"text-regular\">\n                {this._componentLocale.header.headerTextUpdate.secondSentence}\n              </gxg-text>\n            ]}\n        {/* header text */}\n      </header>\n    );\n  };\n\n  private renderFilters = () => {\n    return (\n      <div class=\"filters\">\n        <gxg-title type=\"title-05\">\n          {this._componentLocale.filters.filtersHeading}\n        </gxg-title>\n\n        <div class=\"filters__wrapper\">\n          <div class=\"filters__wrapper-left\">\n            <gxg-label labelPosition=\"above\" center={false}>\n              Front End Objects\n            </gxg-label>\n            <div class=\"filters__front-end-objects\">\n              <gxg-form-checkbox\n                label={this._componentLocale.filters.webPanelsCheckbox}\n                part=\"web-panels-checkbox\"\n                slot=\"footer-start\"\n                ref={(el: HTMLGxgFormCheckboxElement) =>\n                  (this.webPanelsCheckboxEl = el as HTMLGxgFormCheckboxElement)\n                }\n              ></gxg-form-checkbox>\n              <gxg-form-checkbox\n                label={this._componentLocale.filters.panelsCheckbox}\n                part=\"panels-checkbox\"\n                slot=\"footer-start\"\n                ref={(el: HTMLGxgFormCheckboxElement) =>\n                  (this.panelsCheckboxEl = el as HTMLGxgFormCheckboxElement)\n                }\n              ></gxg-form-checkbox>\n            </div>\n          </div>\n          <div class=\"filters__wrapper-right\">\n            <gxg-combo-box\n              label={this._componentLocale.filters.futureUpgradesComboLabel}\n              disableFilter\n              part=\"future-upgrades-combo\"\n              ref={(el: HTMLGxgComboBoxElement) =>\n                (this.futureUpgradesComboEl = el as HTMLGxgComboBoxElement)\n              }\n            >\n              <gxg-combo-box-item value=\"automatic\">\n                {\n                  this._componentLocale.manageFutureUpgrades\n                    .installAutomatically\n                }\n              </gxg-combo-box-item>\n              <gxg-combo-box-item value=\"prompt\">\n                {this._componentLocale.manageFutureUpgrades.promptMe}\n              </gxg-combo-box-item>\n              <gxg-combo-box-item value=\"never\">\n                {this._componentLocale.manageFutureUpgrades.neverUpdate}\n              </gxg-combo-box-item>\n            </gxg-combo-box>\n          </div>\n        </div>\n      </div>\n    );\n  };\n\n  // 10.RENDER() FUNCTION //\n\n  render() {\n    return (\n      <Host class=\"gx-ide-component\">\n        <div class=\"gx-ide-main-wrapper\">\n          <gx-ide-container\n            noHeadingPadding\n            headingPaddingTop\n            noContentPadding\n            noContentGap\n            noAboveFooterPadding\n            containerTitle={\n              this.displayTitle ? this._componentLocale.componentName : null\n            }\n            slimmerFooter={config.gxIdeContainer.slimmerFooter}\n          >\n            {this.renderHeader()}\n            {this.renderFilters()}\n            <div class=\"footer-above\" slot=\"footer-above\">\n              <div class=\"footer-above__left\">\n                <p>{this._componentLocale.footer.footerRepairText}</p>\n              </div>\n              <div class=\"footer-above__right\">\n                <p>{this._componentLocale.footer.footerSaveText}</p>\n                <p>{this._componentLocale.footer.footerCancelText}</p>\n              </div>\n            </div>\n\n            <gxg-button\n              type=\"outlined\"\n              slot=\"footer-start\"\n              onClick={this.repairCallbackHandler}\n            >\n              {this._componentLocale.footer.repairButton}\n            </gxg-button>\n\n            <gxg-button\n              type=\"outlined\"\n              slot=\"footer-end\"\n              onClick={this.cancelCallbackHandler}\n            >\n              {this._componentLocale.footer.cancelButton}\n            </gxg-button>\n            <gxg-button slot=\"footer-end\" onClick={this.saveCallbackHandler}>\n              {this._componentLocale.footer.confirmButton}\n            </gxg-button>\n          </gx-ide-container>\n        </div>\n      </Host>\n    );\n  }\n}\n\nexport type GamConfigData = {\n  importWebPanels: boolean;\n  importPanels: boolean;\n  futureUpgrades: \"never\" | \"prompt\" | \"automatic\";\n};\n\nexport type SaveCallback = (data: GamConfigData) => Promise<void>;\nexport type CancelCallback = () => Promise<void>;\nexport type RepairCallback = (config: GamConfigData) => Promise<void>;\n"]}

package/dist/collection/components/gam-installation-settings/gx-ide-assets/gam-installation-settings/langs/gam-installation-settings.lang.en.json

@@ -14,6 +14,11 @@
     "translationFileLabel": "Translation File:",
     "importButtonText": "Select File"
   },
+  "manageFutureUpgrades": {
+    "installAutomatically": "Install updates automatically",
+    "promptMe": "Prompt me to update",
+    "neverUpdate": "Never update"
+  },
   "filters": {
     "filtersHeading": "Security Objects : Login, Not Authorized, Change Password, Register, etc",
     "webPanelsCheckbox": "Web Panels",
@@ -21,7 +26,8 @@
     "futureUpgradesComboLabel": "Select How to manage the future upgrades:"
   },
   "footer": {
-    "footerSaveCancelText": "Select Save to Apply your Changes or Cancel to Ignore Them",
+    "footerSaveText": "Select Save to Apply your Changes",
+    "footerCancelText": "Select Cancel to Ignore Them",
     "footerRepairText": "Use Repair to import GAM components again",
     "repairButton": "Repair",
     "confirmButton": "Save",

package/dist/collection/components/import-from-design/import-from-design.css

@@ -508,6 +508,10 @@ gxg-tabs {
   box-sizing: border-box;
 }
 
+p {
+  margin: 0;
+}
+
 /*Gx Ide*/
 /*@container queries*/
 /* hiChar styles

package/dist/collection/components/kb-manager-export/kb-manager-export.css

@@ -508,6 +508,10 @@ gxg-tabs {
   box-sizing: border-box;
 }
 
+p {
+  margin: 0;
+}
+
 /*Gx Ide*/
 /*@container queries*/
 /* hiChar styles

package/dist/collection/components/kb-manager-import/kb-manager-import.css

@@ -508,6 +508,10 @@ gxg-tabs {
   box-sizing: border-box;
 }
 
+p {
+  margin: 0;
+}
+
 /*Gx Ide*/
 /*@container queries*/
 /* hiChar styles

package/dist/collection/components/modules/edit-module-server/edit-module-server.css

@@ -508,6 +508,10 @@ gxg-tabs {
   box-sizing: border-box;
 }
 
+p {
+  margin: 0;
+}
+
 /*Gx Ide*/
 /*@container queries*/
 /* hiChar styles

package/dist/collection/components/modules/edit-module-server/edit-module-server.js

@@ -68,6 +68,7 @@ export class GxIdeEditModuleServer {
         this.types = undefined;
         this.name = undefined;
         this.source = undefined;
+        this.type = undefined;
         this.confirmCallback = undefined;
         this.selectSourceCallback = undefined;
         this.cancelCallback = undefined;
@@ -86,7 +87,7 @@ export class GxIdeEditModuleServer {
         var _a;
         return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper gx-ide-overflow" }, h("gx-ide-container", { slimmerFooter: true }, h("div", { class: this.selectedType === "local"
                 ? "grid module-servers-grid-local"
-                : "grid module-servers-grid-server" }, h("div", { class: "module-servers-grid-column-1" }, h("gxg-label", null, " ", this._componentLocale.type), h("gxg-label", null, " ", this._componentLocale.name), h("gxg-label", null, " ", this._componentLocale.source)), h("div", { class: "module-servers-grid-column-2" }, h("gxg-combo-box", { value: this.selectedType, ref: (el) => (this.serverTypeEl = el) }, (_a = this.types) === null || _a === void 0 ? void 0 : _a.map(type => (h("gxg-combo-box-item", { value: type.type, onItemSelected: item => (this.selectedType = item.detail.value) }, type.type)))), h("gxg-form-text", { placeholder: this._componentLocale.name, ref: (el) => (this.nameEl = el), part: "name" }), h("gxg-form-text", { placeholder: this._componentLocale.source, ref: (el) => (this.sourceEl = el), part: "source" })), this.selectedType === "local" && (h("gxg-button", { onClick: this.selectSourceCallbackHandle }, "...")), this.selectedType === "remote" && this.renderServerOptions()), h("gxg-button", { slot: "footer-end", type: "outlined", onClick: this.cancelCallbackHandler }, this._componentLocale.footer.btnCancel), h("gxg-button", { slot: "footer-end", type: "primary-text-only", onClick: this.confirmCallbackHandler }, this._componentLocale.footer.btnConfirm)))));
+                : "grid module-servers-grid-server" }, h("div", { class: "module-servers-grid-column-1" }, h("gxg-label", null, " ", this._componentLocale.type), h("gxg-label", null, " ", this._componentLocale.name), h("gxg-label", null, " ", this._componentLocale.source)), h("div", { class: "module-servers-grid-column-2" }, h("gxg-combo-box", { value: this.type, ref: (el) => (this.serverTypeEl = el) }, (_a = this.types) === null || _a === void 0 ? void 0 : _a.map(type => (h("gxg-combo-box-item", { value: type.id, onItemSelected: item => (this.selectedType = item.detail.value) }, type.type)))), h("gxg-form-text", { placeholder: this._componentLocale.name, ref: (el) => (this.nameEl = el), value: this.name, part: "name" }), h("gxg-form-text", { placeholder: this._componentLocale.source, ref: (el) => (this.sourceEl = el), value: this.source, part: "source" })), this.selectedType === "local" && (h("gxg-button", { onClick: this.selectSourceCallbackHandle }, "...")), this.selectedType === "remote" && this.renderServerOptions()), h("gxg-button", { slot: "footer-end", type: "outlined", onClick: this.cancelCallbackHandler }, this._componentLocale.footer.btnCancel), h("gxg-button", { slot: "footer-end", type: "primary-text-only", onClick: this.confirmCallbackHandler }, this._componentLocale.footer.btnConfirm)))));
     }
     static get is() { return "gx-ide-edit-module-server"; }
     static get encapsulation() { return "shadow"; }
@@ -158,6 +159,23 @@ export class GxIdeEditModuleServer {
                 "attribute": "source",
                 "reflect": false
             },
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Id of the currently selected server type"
+                },
+                "attribute": "type",
+                "reflect": false
+            },
             "confirmCallback": {
                 "type": "unknown",
                 "mutable": false,