@genexus/genexus-ide-ui 1.0.1 → 1.0.3

package/dist/esm/gx-ide-connect-gx-server.entry.js

@@ -1,9 +1,9 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-2f305780.js';
-import { c as config } from './config-a492e15e.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-27c691bc.js';
+import { c as config } from './config-6cfbb06f.js';
 import { L as Locale } from './locale-3c32f251.js';
-import { f as formSubmitValidation } from './form-validation-9367af5a.js';
+import { f as formSubmitValidation } from './helpers-05c62775.js';
 
-const connectGxServerCss = ":root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.gxi-hidden{display:none !important}.gxi-full-height{height:100%}.gxi-overflow-auto{overflow:auto}.gxi-display-flex{display:flex}.align-start{display:flex;align-items:start}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.overflow-auto{overflow:auto}.justify-start{display:flex;justify-content:start}.justify-center{display:flex;justify-content:center}.justify-end{display:flex;justify-content:end}.grid{display:grid;grid-row-gap:var(--gx-ide-grid-row-gap);grid-column-gap:var(--gx-ide-grid-column-gap);grid-template-rows:auto}ch-grid-cell{display:flex}ch-grid{overflow:auto;height:100%}ch-grid-column{z-index:99;border-bottom:1px solid var(--mer-color__neutral-gray--800)}ch-grid-column:first-child{padding-inline-start:var(--gx-ide-container__padding) !important}ch-grid-column:last-child{padding-inline-end:var(--gx-ide-container__padding) !important}ch-grid-cell{--mer-spacing--xs:var(--gx-ide-container__padding)}.layout{display:grid;gap:var(--mer-spacing--lg);box-sizing:border-box}.layout--two-cols{grid-template-columns:1fr 1fr}.layout--space-above{padding-block-start:var(--mer-spacing--lg)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){height:100% !important;display:flex !important;flex-direction:column !important}:host(:focus-within) gx-ide-top-bar::part(wrapper){background-color:var(--color-secondary-enabled)}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--mer-font__weight--regular);font-size:var(--mer-font__size--xs);font-family:var(--mer-font-family--primary);height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1;box-sizing:border-box}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-main::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-main::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-main::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-overflow::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.tree-view-primary{font-size:var(--mer-font__size--2xs)}p{margin:0;font-size:var(--mer-font__size--xxs)}:host{display:block}.user-details-container{display:flex;gap:var(--gx-ide-form-items-gap)}.wrapper{display:flex;flex-direction:column;gap:var(--mer-spacing--md)}";
+const connectGxServerCss = ":root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}:host{display:grid;block-size:100%}.card-regular{background-color:var(--mer-surface__elevation--01);border:var(--mer-border__width--sm) solid var(--mer-border-color__on-elevation--01);border-radius:var(--mer-border__radius--md);padding:var(--mer-spacing--md) var(--mer-spacing--md);display:grid}.card-small{background-color:var(--mer-surface__elevation--02);border-radius:var(--mer-border__radius--sm);padding:var(--mer-spacing--sm) var(--mer-spacing--sm)}.card-small--actionable:hover{background-color:var(--mer-color__neutral-gray--600)}.card-small--actionable:active{background-color:var(--mer-color__neutral-gray--650)}.card-small:focus-visible{outline:var(--focus__outline-width) var(--focus__outline-style) var(--focus__outline-color);outline-offset:var(--focus__outline-offset)}.empty-state{block-size:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--mer-spacing--sm);text-align:center}.empty-state__title,.empty-state__button,.empty-state__link{max-inline-size:300px}.opacity-0{opacity:0}.opacity-1{opacity:1}.display-contents{display:contents}.gxi-hidden{display:none !important}.gxi-full-height{height:100%}.gxi-overflow-auto{overflow:auto}.gxi-display-flex{display:flex}.align-start{display:flex;align-items:start}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.overflow-auto{overflow:auto}.justify-start{display:flex;justify-content:start}.justify-center{display:flex;justify-content:center}.justify-end{display:flex;justify-content:end}.grid{display:grid;grid-row-gap:var(--gx-ide-grid-row-gap);grid-column-gap:var(--gx-ide-grid-column-gap);grid-template-rows:auto}ch-grid-cell{display:flex}ch-grid{overflow:auto;height:100%}ch-grid-column{z-index:99;border-bottom:1px solid var(--mer-color__neutral-gray--800)}ch-grid-column:first-child{padding-inline-start:var(--gx-ide-container__padding) !important}ch-grid-column:last-child{padding-inline-end:var(--gx-ide-container__padding) !important}ch-grid-cell{--mer-spacing--xs:var(--gx-ide-container__padding)}.layout{display:grid;gap:var(--mer-spacing--lg);box-sizing:border-box}.layout--two-cols{grid-template-columns:1fr 1fr}.layout--space-above{padding-block-start:var(--mer-spacing--lg)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){height:100% !important;display:flex !important;flex-direction:column !important}:host(:focus-within) gx-ide-top-bar::part(wrapper){background-color:var(--color-secondary-enabled)}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--mer-font__weight--regular);font-size:var(--mer-font__size--xs);font-family:var(--mer-font-family--primary);height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1;box-sizing:border-box}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-main::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-main::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-main::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-overflow::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.tree-view-primary{font-size:var(--mer-font__size--2xs)}p{margin:0;font-size:var(--mer-font__size--xxs)}.buttons-container{display:flex;gap:var(--mer-spacing--xs)}:host{display:block}.user-details-container{display:flex;gap:var(--gx-ide-form-items-gap)}.wrapper{display:flex;flex-direction:column;gap:var(--mer-spacing--md)}";
 
 const GxIdeConnectGxServer = class {
     constructor(hostRef) {

package/dist/esm/gx-ide-connect-gx-server.entry.js.map

@@ -1 +1 @@
-{"file":"gx-ide-connect-gx-server.entry.js","mappings":"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","names":[],"sources":["src/components/connect-gx-server/connect-gx-server.scss?tag=gx-ide-connect-gx-server&encapsulation=shadow","src/components/connect-gx-server/connect-gx-server.tsx"],"sourcesContent":["@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n  display: block;\n}\n\n.user-details-container {\n  display: flex;\n  gap: var(--gx-ide-form-items-gap);\n}\n\n.wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mer-spacing--md);\n}\n","/* 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 { formSubmitValidation } from \"../../common/form-validation\";\nimport { ConnectionResultData } from \"../../common/types\";\n\n@Component({\n  tag: \"gx-ide-connect-gx-server\",\n  styleUrl: \"connect-gx-server.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/connect-gx-server\"]\n})\nexport class GxIdeConnectGxServer {\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: HTMLGxIdeConnectGxServerElement;\n\n  private serverURLEl!: HTMLGxgComboBoxElement;\n  private userNameEl!: HTMLGxgFormTextElement;\n  private passwordEl!: HTMLGxgFormTextElement;\n  private continueWithGeneXusAccountEl!: HTMLGxgFormCheckboxElement;\n\n  // 3.STATE() VARIABLES //\n\n  //\n  @State() displayLoginControls: boolean = 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   * Array of cataloged server URLs\n   */\n  @Prop() readonly serverUrls: string[];\n\n  /**\n   * 'true' if the user should be allowed to manually enter a server URL in serverUrls.\n   */\n  @Prop() readonly enableCustomServer: boolean = false;\n\n  /**\n   * Initial user values for the case in which the user returns to the login modal after a successful authentication.\n   */\n  @Prop() readonly defaultConnectionData?: GXServerConnectionDefault;\n\n  /**\n   *  If 'true', shows the enabled and checked 'Continue with GX Account' checkbox. If 'false', shows the checkbox unchecked and disabled, and displays the options to enter username and password directly. Even if 'true', allow the user to deselect the checkbox and enter username and password.\n   */\n  @Prop() readonly enableUserLogged: boolean = false;\n\n  /**\n   *  If 'true', shows the enabled and checked 'Continue with GX Account' checkbox. If 'false', shows the checkbox unchecked and disabled, and displays the options to enter username and password directly. Even if 'true', allow the user to deselect the checkbox and enter username and password.\n   */\n  @Prop() readonly connectCallback: (\n    data: GXServerConnectionData\n  ) => Promise<ConnectionResultData>;\n\n  /**\n   * Callback that allows canceling the server connection process.\n   */\n  @Prop() readonly cancelCallback: () => Promise<void>;\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    this.evaluateDisplayLoginControls();\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 renderServerUrls = (): HTMLGxgComboBoxItemElement[] => {\n    if (this.serverUrls?.length) {\n      return this.serverUrls.map(serverUrl => {\n        return <gxg-combo-box-item>{serverUrl}</gxg-combo-box-item>;\n      });\n    }\n    return [];\n  };\n\n  private continueWithGxServerHandler = (\n    event: CustomEvent<{ id: string; value: boolean; disabled?: boolean }>\n  ) => {\n    this.displayLoginControls = !event.detail.value;\n  };\n\n  private evaluateDisplayLoginControls = () => {\n    if (this.enableUserLogged) {\n      this.displayLoginControls = false;\n    } else {\n      this.displayLoginControls = true;\n    }\n  };\n\n  private connectHandler = () => {\n    if (this.connectCallback) {\n      this.connectCallback({\n        serverUrl: this.serverURLEl.value,\n        continueWithGeneXusAccount: this.continueWithGeneXusAccountEl.checked,\n        user: this.userNameEl.value,\n        password: this.passwordEl.value\n      }).then((formSubmitResult: ConnectionResultData) => {\n        console.log(formSubmitResult);\n        formSubmitValidation(formSubmitResult, this);\n      });\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            containerTitle={\n              this.displayTitle ? this._componentLocale.componentName : null\n            }\n            slimmerFooter={config.gxIdeContainer.slimmerFooter}\n          >\n            <div class=\"wrapper\">\n              {/* server url */}\n              <gxg-combo-box\n                label={this._componentLocale.main.serverUrl}\n                disableFilter={!this.enableCustomServer}\n                value={this.defaultConnectionData?.serverUrl}\n                ref={el => (this.serverURLEl = el as HTMLGxgComboBoxElement)}\n                toolTip={config.tooltip}\n              >\n                {this.renderServerUrls()}\n              </gxg-combo-box>\n\n              {/* continue with GeneXus account */}\n              <gxg-form-checkbox\n                label={this._componentLocale.main.continueWithGxAccount}\n                onChange={this.continueWithGxServerHandler}\n                checked={this.enableUserLogged}\n                disabled={!this.enableUserLogged}\n                ref={el =>\n                  (this.continueWithGeneXusAccountEl =\n                    el as HTMLGxgFormCheckboxElement)\n                }\n              ></gxg-form-checkbox>\n\n              {this.displayLoginControls ? (\n                <div class=\"user-details-container\">\n                  {/* username */}\n                  <gxg-form-text\n                    label={this._componentLocale.main.userName}\n                    labelPosition=\"above\"\n                    disabled={!this.displayLoginControls}\n                    value={this.defaultConnectionData?.user}\n                    ref={el => (this.userNameEl = el as HTMLGxgFormTextElement)}\n                    toolTip={config.tooltip}\n                  ></gxg-form-text>\n                  {/* password */}\n                  <gxg-form-text\n                    label={this._componentLocale.main.password}\n                    labelPosition=\"above\"\n                    disabled={!this.displayLoginControls}\n                    value={this.defaultConnectionData?.password}\n                    ref={el => (this.passwordEl = el as HTMLGxgFormTextElement)}\n                    password\n                    toolTip={config.tooltip}\n                  ></gxg-form-text>\n                </div>\n              ) : null}\n            </div>\n\n            {/* cancel and connect buttons */}\n            <gxg-button slot=\"footer-end\" type=\"outlined\">\n              {this._componentLocale.main.cancel}\n            </gxg-button>\n            <gxg-button slot=\"footer-end\" onClick={this.connectHandler}>\n              {this._componentLocale.main.connect}\n            </gxg-button>\n          </gx-ide-container>\n        </div>\n      </Host>\n    );\n  }\n}\n\nexport type GXServerConnectionDefault = {\n  serverUrl: string;\n  user: string;\n  password: string;\n};\n\nexport type GXServerConnectionData = GXServerConnectionDefault & {\n  continueWithGeneXusAccount: boolean;\n};\n"],"version":3}
+{"file":"gx-ide-connect-gx-server.entry.js","mappings":"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","names":[],"sources":["src/components/connect-gx-server/connect-gx-server.scss?tag=gx-ide-connect-gx-server&encapsulation=shadow","src/components/connect-gx-server/connect-gx-server.tsx"],"sourcesContent":["@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n  display: block;\n}\n\n.user-details-container {\n  display: flex;\n  gap: var(--gx-ide-form-items-gap);\n}\n\n.wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mer-spacing--md);\n}\n","/* 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 { formSubmitValidation } from \"../../common/helpers\";\nimport { ConnectionResultData } from \"../../common/types\";\n\n@Component({\n  tag: \"gx-ide-connect-gx-server\",\n  styleUrl: \"connect-gx-server.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/connect-gx-server\"]\n})\nexport class GxIdeConnectGxServer {\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: HTMLGxIdeConnectGxServerElement;\n\n  private serverURLEl!: HTMLGxgComboBoxElement;\n  private userNameEl!: HTMLGxgFormTextElement;\n  private passwordEl!: HTMLGxgFormTextElement;\n  private continueWithGeneXusAccountEl!: HTMLGxgFormCheckboxElement;\n\n  // 3.STATE() VARIABLES //\n\n  //\n  @State() displayLoginControls: boolean = 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   * Array of cataloged server URLs\n   */\n  @Prop() readonly serverUrls: string[];\n\n  /**\n   * 'true' if the user should be allowed to manually enter a server URL in serverUrls.\n   */\n  @Prop() readonly enableCustomServer: boolean = false;\n\n  /**\n   * Initial user values for the case in which the user returns to the login modal after a successful authentication.\n   */\n  @Prop() readonly defaultConnectionData?: GXServerConnectionDefault;\n\n  /**\n   *  If 'true', shows the enabled and checked 'Continue with GX Account' checkbox. If 'false', shows the checkbox unchecked and disabled, and displays the options to enter username and password directly. Even if 'true', allow the user to deselect the checkbox and enter username and password.\n   */\n  @Prop() readonly enableUserLogged: boolean = false;\n\n  /**\n   *  If 'true', shows the enabled and checked 'Continue with GX Account' checkbox. If 'false', shows the checkbox unchecked and disabled, and displays the options to enter username and password directly. Even if 'true', allow the user to deselect the checkbox and enter username and password.\n   */\n  @Prop() readonly connectCallback: (\n    data: GXServerConnectionData\n  ) => Promise<ConnectionResultData>;\n\n  /**\n   * Callback that allows canceling the server connection process.\n   */\n  @Prop() readonly cancelCallback: () => Promise<void>;\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    this.evaluateDisplayLoginControls();\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 renderServerUrls = (): HTMLGxgComboBoxItemElement[] => {\n    if (this.serverUrls?.length) {\n      return this.serverUrls.map(serverUrl => {\n        return <gxg-combo-box-item>{serverUrl}</gxg-combo-box-item>;\n      });\n    }\n    return [];\n  };\n\n  private continueWithGxServerHandler = (\n    event: CustomEvent<{ id: string; value: boolean; disabled?: boolean }>\n  ) => {\n    this.displayLoginControls = !event.detail.value;\n  };\n\n  private evaluateDisplayLoginControls = () => {\n    if (this.enableUserLogged) {\n      this.displayLoginControls = false;\n    } else {\n      this.displayLoginControls = true;\n    }\n  };\n\n  private connectHandler = () => {\n    if (this.connectCallback) {\n      this.connectCallback({\n        serverUrl: this.serverURLEl.value,\n        continueWithGeneXusAccount: this.continueWithGeneXusAccountEl.checked,\n        user: this.userNameEl.value,\n        password: this.passwordEl.value\n      }).then((formSubmitResult: ConnectionResultData) => {\n        console.log(formSubmitResult);\n        formSubmitValidation(formSubmitResult, this);\n      });\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            containerTitle={\n              this.displayTitle ? this._componentLocale.componentName : null\n            }\n            slimmerFooter={config.gxIdeContainer.slimmerFooter}\n          >\n            <div class=\"wrapper\">\n              {/* server url */}\n              <gxg-combo-box\n                label={this._componentLocale.main.serverUrl}\n                disableFilter={!this.enableCustomServer}\n                value={this.defaultConnectionData?.serverUrl}\n                ref={el => (this.serverURLEl = el as HTMLGxgComboBoxElement)}\n                toolTip={config.tooltip}\n              >\n                {this.renderServerUrls()}\n              </gxg-combo-box>\n\n              {/* continue with GeneXus account */}\n              <gxg-form-checkbox\n                label={this._componentLocale.main.continueWithGxAccount}\n                onChange={this.continueWithGxServerHandler}\n                checked={this.enableUserLogged}\n                disabled={!this.enableUserLogged}\n                ref={el =>\n                  (this.continueWithGeneXusAccountEl =\n                    el as HTMLGxgFormCheckboxElement)\n                }\n              ></gxg-form-checkbox>\n\n              {this.displayLoginControls ? (\n                <div class=\"user-details-container\">\n                  {/* username */}\n                  <gxg-form-text\n                    label={this._componentLocale.main.userName}\n                    labelPosition=\"above\"\n                    disabled={!this.displayLoginControls}\n                    value={this.defaultConnectionData?.user}\n                    ref={el => (this.userNameEl = el as HTMLGxgFormTextElement)}\n                    toolTip={config.tooltip}\n                  ></gxg-form-text>\n                  {/* password */}\n                  <gxg-form-text\n                    label={this._componentLocale.main.password}\n                    labelPosition=\"above\"\n                    disabled={!this.displayLoginControls}\n                    value={this.defaultConnectionData?.password}\n                    ref={el => (this.passwordEl = el as HTMLGxgFormTextElement)}\n                    password\n                    toolTip={config.tooltip}\n                  ></gxg-form-text>\n                </div>\n              ) : null}\n            </div>\n\n            {/* cancel and connect buttons */}\n            <gxg-button slot=\"footer-end\" type=\"outlined\">\n              {this._componentLocale.main.cancel}\n            </gxg-button>\n            <gxg-button slot=\"footer-end\" onClick={this.connectHandler}>\n              {this._componentLocale.main.connect}\n            </gxg-button>\n          </gx-ide-container>\n        </div>\n      </Host>\n    );\n  }\n}\n\nexport type GXServerConnectionDefault = {\n  serverUrl: string;\n  user: string;\n  password: string;\n};\n\nexport type GXServerConnectionData = GXServerConnectionDefault & {\n  continueWithGeneXusAccount: boolean;\n};\n"],"version":3}

package/dist/esm/gx-ide-container_2.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-2f305780.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-27c691bc.js';
 
 const containerCss = ":root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}:host{--gx-ide-container-elements-spacing:var(--mer-spacing--xs);display:block;height:100%;box-sizing:border-box}.container{display:grid;height:100%;grid-template-rows:auto 1fr auto;box-sizing:border-box}.heading,.content,.footer,.footer-above{padding:var(--gx-ide-container__padding)}.container--padding-s{--gx-ide-container__padding:var(--mer-spacing--xs)}.container--padding-m{--gx-ide-container__padding:var(--mer-spacing--sm)}.container--padding-l{--gx-ide-container__padding:var(--mer-spacing--md)}.container--display-border{border:1px solid var(--gx-ide-container-border-color)}.container--display-border-top{border-top:1px solid var(--gx-ide-container-border-color)}.container--display-border-end{border-inline-end:1px solid var(--gx-ide-container-border-color)}.container--display-border-bottom{border-bottom:1px solid var(--gx-ide-container-border-color)}.container--display-border-start{border-inline-start:1px solid var(--gx-ide-container-border-color)}.container--overflow-hidden-y{overflow-y:hidden}.heading{display:flex;flex-direction:column;gap:var(--gx-ide-container__padding);width:100%;box-sizing:border-box;border-bottom:1px solid var(--gx-ide-container-border-color)}.heading--no-border{border-bottom:0}.heading--no-padding{padding:0}.heading--no-padding-block-end{padding-block-end:0}.heading--no-gap{gap:0}.heading--inactive{color:var(--gxg-color--disabled)}.heading--padding-top{padding:var(--gx-ide-container__padding) 0 0 0}.heading--slimmer{padding-top:var(--mer-spacing--xs);padding-bottom:var(--mer-spacing--xs)}.heading--form-text-height .heading__title{min-height:var(--gxg-form-text-height);justify-content:center}.heading--flex-row{flex-direction:row;align-items:center;justify-content:center}.content{overflow-x:auto;display:flex;flex-direction:column;gap:var(--gx-ide-form-items-gap);box-sizing:border-box;}.content::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.content::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.content::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.content::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.content::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.content--no-padding{padding:0}.content--no-border-top{border-top:none}.content--flex{display:flex}.content--no-gap{gap:0}.content--align-items-start{align-items:start}.content--align-items-center{align-items:center}.content--align-items-end{align-items:end}.content--justify-content-start{justify-content:start}.content--justify-content-center{justify-content:center}.content--justify-content-end{justify-content:end}.content--border-end{border-inline-end:1px solid var(--gx-ide-container-border-color)}.container--only-content{grid-template-rows:1fr}.container--no-header:not(.container--only-content){grid-template-rows:1fr auto}.container--no-footer:not(.container--only-content){grid-template-rows:auto 1fr}.footer-above{border-top:1px solid var(--gx-ide-container-border-color)}.footer-above--no-border-top{border-top:0}.footer-above--slimmer{padding-top:var(--mer-spacing--xs);padding-bottom:var(--mer-spacing--xs)}.footer-above--no-padding{padding:0}.footer{display:flex;gap:var(--gx-ide-container-elements-spacing);flex-wrap:wrap;justify-content:space-between;align-items:center;border-top:1px solid var(--gx-ide-container-border-color)}.footer__start,.footer__end{display:flex;gap:var(--gx-ide-container-elements-spacing)}.footer--no-border{border-top:0}.footer--no-padding{padding:0}.footer--slimmer{padding-top:var(--mer-spacing--xs);padding-bottom:var(--mer-spacing--xs)}";
 

package/dist/esm/gx-ide-create-kb-from-server.entry.js

@@ -1,9 +1,9 @@
-import { r as registerInstance, c as createEvent, a as getAssetPath, h, H as Host, g as getElement } from './index-2f305780.js';
+import { r as registerInstance, c as createEvent, a as getAssetPath, h, H as Host, g as getElement } from './index-27c691bc.js';
 import { L as Locale } from './locale-3c32f251.js';
-import { r as renderFormItems } from './common-8826f536.js';
-import { f as formSubmitValidation } from './form-validation-9367af5a.js';
+import { r as renderFormItems } from './common-31ac2b05.js';
+import { f as formSubmitValidation } from './helpers-05c62775.js';
 
-const createKbFromServerCss = ":root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.gxi-hidden{display:none !important}.gxi-full-height{height:100%}.gxi-overflow-auto{overflow:auto}.gxi-display-flex{display:flex}.align-start{display:flex;align-items:start}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.overflow-auto{overflow:auto}.justify-start{display:flex;justify-content:start}.justify-center{display:flex;justify-content:center}.justify-end{display:flex;justify-content:end}.grid{display:grid;grid-row-gap:var(--gx-ide-grid-row-gap);grid-column-gap:var(--gx-ide-grid-column-gap);grid-template-rows:auto}ch-grid-cell{display:flex}ch-grid{overflow:auto;height:100%}ch-grid-column{z-index:99;border-bottom:1px solid var(--mer-color__neutral-gray--800)}ch-grid-column:first-child{padding-inline-start:var(--gx-ide-container__padding) !important}ch-grid-column:last-child{padding-inline-end:var(--gx-ide-container__padding) !important}ch-grid-cell{--mer-spacing--xs:var(--gx-ide-container__padding)}.layout{display:grid;gap:var(--mer-spacing--lg);box-sizing:border-box}.layout--two-cols{grid-template-columns:1fr 1fr}.layout--space-above{padding-block-start:var(--mer-spacing--lg)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){height:100% !important;display:flex !important;flex-direction:column !important}:host(:focus-within) gx-ide-top-bar::part(wrapper){background-color:var(--color-secondary-enabled)}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--mer-font__weight--regular);font-size:var(--mer-font__size--xs);font-family:var(--mer-font-family--primary);height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1;box-sizing:border-box}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-main::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-main::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-main::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-overflow::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.tree-view-primary{font-size:var(--mer-font__size--2xs)}p{margin:0;font-size:var(--mer-font__size--xxs)}:host{display:block;border:1px solid var(--gxg-border-color--regular);background-color:var(--mer-color__surface)}.grid-data{grid-template-columns:repeat(2, 1fr)}.grid-data-account{grid-template-columns:auto 1fr}.grid-data-account>:nth-child(1){grid-area:1/1/2/3}.grid-data-account>:nth-child(6){grid-area:4/2/5/3}.grid-data-kbs{display:flex;flex-direction:column;gap:var(--gx-ide-grid-row-gap)}.grid-data-kbs .search-kbs{width:100%;display:flex}.grid-data-kbs .box-kbs{height:150px}.grid-data-kbs-footer{display:flex}.flex{display:flex}.flex>:nth-child(2){flex:1}";
+const createKbFromServerCss = ":root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}:host{display:grid;block-size:100%}.card-regular{background-color:var(--mer-surface__elevation--01);border:var(--mer-border__width--sm) solid var(--mer-border-color__on-elevation--01);border-radius:var(--mer-border__radius--md);padding:var(--mer-spacing--md) var(--mer-spacing--md);display:grid}.card-small{background-color:var(--mer-surface__elevation--02);border-radius:var(--mer-border__radius--sm);padding:var(--mer-spacing--sm) var(--mer-spacing--sm)}.card-small--actionable:hover{background-color:var(--mer-color__neutral-gray--600)}.card-small--actionable:active{background-color:var(--mer-color__neutral-gray--650)}.card-small:focus-visible{outline:var(--focus__outline-width) var(--focus__outline-style) var(--focus__outline-color);outline-offset:var(--focus__outline-offset)}.empty-state{block-size:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--mer-spacing--sm);text-align:center}.empty-state__title,.empty-state__button,.empty-state__link{max-inline-size:300px}.opacity-0{opacity:0}.opacity-1{opacity:1}.display-contents{display:contents}.gxi-hidden{display:none !important}.gxi-full-height{height:100%}.gxi-overflow-auto{overflow:auto}.gxi-display-flex{display:flex}.align-start{display:flex;align-items:start}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.overflow-auto{overflow:auto}.justify-start{display:flex;justify-content:start}.justify-center{display:flex;justify-content:center}.justify-end{display:flex;justify-content:end}.grid{display:grid;grid-row-gap:var(--gx-ide-grid-row-gap);grid-column-gap:var(--gx-ide-grid-column-gap);grid-template-rows:auto}ch-grid-cell{display:flex}ch-grid{overflow:auto;height:100%}ch-grid-column{z-index:99;border-bottom:1px solid var(--mer-color__neutral-gray--800)}ch-grid-column:first-child{padding-inline-start:var(--gx-ide-container__padding) !important}ch-grid-column:last-child{padding-inline-end:var(--gx-ide-container__padding) !important}ch-grid-cell{--mer-spacing--xs:var(--gx-ide-container__padding)}.layout{display:grid;gap:var(--mer-spacing--lg);box-sizing:border-box}.layout--two-cols{grid-template-columns:1fr 1fr}.layout--space-above{padding-block-start:var(--mer-spacing--lg)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){height:100% !important;display:flex !important;flex-direction:column !important}:host(:focus-within) gx-ide-top-bar::part(wrapper){background-color:var(--color-secondary-enabled)}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--mer-font__weight--regular);font-size:var(--mer-font__size--xs);font-family:var(--mer-font-family--primary);height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1;box-sizing:border-box}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-main::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-main::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-main::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-overflow::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.tree-view-primary{font-size:var(--mer-font__size--2xs)}p{margin:0;font-size:var(--mer-font__size--xxs)}.buttons-container{display:flex;gap:var(--mer-spacing--xs)}:host{display:block;border:1px solid var(--gxg-border-color--regular);background-color:var(--mer-color__surface)}.grid-data{grid-template-columns:repeat(2, 1fr)}.grid-data-account{grid-template-columns:auto 1fr}.grid-data-account>:nth-child(1){grid-area:1/1/2/3}.grid-data-account>:nth-child(6){grid-area:4/2/5/3}.grid-data-kbs{display:flex;flex-direction:column;gap:var(--gx-ide-grid-row-gap)}.grid-data-kbs .search-kbs{width:100%;display:flex}.grid-data-kbs .box-kbs{height:150px}.grid-data-kbs-footer{display:flex}.flex{display:flex}.flex>:nth-child(2){flex:1}";
 
 const GxIdeCreateKbFromServer = class {
     constructor(hostRef) {

package/dist/esm/gx-ide-create-kb-from-server.entry.js.map

@@ -1 +1 @@
-{"file":"gx-ide-create-kb-from-server.entry.js","mappings":"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","names":[],"sources":["src/components/create-kb-from-server/create-kb-from-server.scss?tag=gx-ide-create-kb-from-server&encapsulation=shadow","src/components/create-kb-from-server/create-kb-from-server.tsx"],"sourcesContent":["@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n  display: block;\n  border: 1px solid var(--gxg-border-color--regular);\n  background-color: var(--mer-color__surface);\n}\n:host(.gxi-create-kb-from-server--shadow) {\n}\n\n.grid-data {\n  grid-template-columns: repeat(2, 1fr);\n}\n.grid-data-account {\n  grid-template-columns: auto 1fr;\n  > :nth-child(1) {\n    grid-area: 1 / 1 / 2 / 3;\n  }\n  > :nth-child(6) {\n    grid-area: 4 / 2 / 5 / 3;\n  }\n}\n.grid-data-kbs {\n  display: flex;\n  flex-direction: column;\n  gap: var(--gx-ide-grid-row-gap);\n  .search-kbs {\n    width: 100%;\n    display: flex;\n  }\n  .box-kbs {\n    height: 150px;\n  }\n}\n.grid-data-kbs-footer {\n  display: flex;\n}\n.flex {\n  display: flex;\n  > :nth-child(2) {\n    flex: 1;\n  }\n}\n","/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Element,\n  State,\n  getAssetPath,\n  Watch\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { SelectionChangedEvent } from \"@genexus/gemini/dist/types/components/list-box/list-box\";\n/* CUSTOM IMPORTS */\nimport { GxOption } from \"../../common/types\";\nimport { Locale } from \"../../common/locale\";\nimport { renderFormItems } from \"../../common/common\";\nimport {\n  FormSubmitResult,\n  GxServerAuthenticationType\n} from \"../../common/types\";\nimport { formSubmitValidation } from \"../../common/form-validation\";\n\n@Component({\n  tag: \"gx-ide-create-kb-from-server\",\n  styleUrl: \"create-kb-from-server.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/create-kb-from-server\"]\n})\nexport class GxIdeCreateKbFromServer {\n  [key: string]: any;\n\n  /*\nINDEX:\n1.OWN PROPERTIES\n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API | WATCH'S\n5.EVENTS (EMIT)\n6.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  private shortcutsSrc = getAssetPath(\n    `./gx-ide-assets/create-kb-from-server/shortcuts.json`\n  );\n\n  /* References needed to collect data with \"Connect\" and \"Create\" buttons submit*/\n  private authenticationTypeEl!: HTMLGxgComboBoxElement;\n  private serverUrlsEl!: HTMLGxgComboBoxElement;\n  private kbNameEl!: HTMLGxgFormTextElement;\n  private passwordEl!: HTMLGxgFormTextElement;\n  private userNameEl!: HTMLGxgFormTextElement;\n  private searchKBEl!: HTMLGxgFormTextElement;\n  private listBoxEl!: HTMLElement;\n  private kbIdSelected: string = null;\n  private authenticationTypes: GxOption[] = [];\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeCreateKbFromServerElement;\n\n  // 3.STATE() VARIABLES //\n\n  /**\n   * Disabled or not the part for select and create the KB\n   */\n  @State() selectionKbDisabled = true;\n\n  /**\n   * KBs that return from connect to the server\n   */\n\n  @State() kbs: KBData[] = [];\n  @Watch(\"kbs\")\n  watchPropHandler(newKbs: KBData[]) {\n    /* When the list of servers are updated, the first server is selected by default */\n    this.kbIdSelected = newKbs[0].id;\n    this.kbName = newKbs[0].name;\n  }\n\n  /**\n   * KBs search text\n   */\n  @State() kbSearchText = \"\";\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   * Callback that will be invoked when the user connect to the kb server (‘Connect’ button)\n   */\n  @Prop() readonly connectCallback: (\n    data: GXServerConnectionData\n  ) => Promise<ConnectionResultData>;\n\n  /**\n   * Callback that will be invoked when the user confirms KB creation (‘Create’ button)\n   */\n  @Prop() readonly createKBCallback: (\n    data: CreateKBData\n  ) => Promise<FormSubmitResult>;\n\n  /**\n   * If is true then the user can specify a server url that don't be in the combo box of server urls.\n   */\n  @Prop() readonly enableCustomServer: boolean = true;\n\n  /**\n   * The knowledge base default suggested name\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable\n  @Prop({ mutable: true }) kbName: string;\n\n  /**\n   * Password for the database connection.\n   */\n  @Prop() readonly password: string;\n\n  /**\n   * Array of URLs of cataloged servers to be displayed in the combo\n   */\n  @Prop() readonly serverUrls!: string[];\n\n  /**\n   * Username for the database connection.\n   */\n  @Prop() readonly userName: string;\n\n  // 5.EVENTS (EMIT) //\n\n  /**\n   * This event is emitted once just after the component is fully loaded and the first render() occurs\n   */\n  @Event() componentDidRenderFirstTime: EventEmitter<boolean>;\n\n  // 6.METHODS //\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n    this.setAuthenticationTypes();\n  }\n\n  componentDidLoad() {\n    (this.serverUrlsEl as HTMLElement).focus();\n    this.addEventListeners();\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 setAuthenticationTypes = () => {\n    this.authenticationTypes = [\n      {\n        id: \"genexus\",\n        value: \"genexus\",\n        label: this._componentLocale.authenticationTypes.genexusAccount\n      },\n      {\n        id: \"local\",\n        value: \"local\",\n        label: this._componentLocale.authenticationTypes.local\n      }\n    ];\n  };\n\n  private addEventListeners = () => {\n    this.serverUrlsEl.addEventListener(\"valueChanged\", () => {\n      this.reset();\n    });\n\n    this.searchKBEl.addEventListener(\n      \"valueChanged\",\n      (e: CustomEvent<string>) => {\n        this.kbNameEl.value = \"\";\n        this.kbIdSelected = null;\n        this.kbSearchText = e.detail;\n      }\n    );\n\n    this.listBoxEl.addEventListener(\n      \"selectionChanged\",\n      (ev: CustomEvent<SelectionChangedEvent>): void => {\n        const selectedItems = ev.detail.items;\n        let selectedItem;\n        if (selectedItems.length > 0) {\n          selectedItem = ev.detail.items[0];\n        }\n        if (selectedItem) {\n          this.kbIdSelected = selectedItem.value;\n          const kbSelected = this.kbs.find(kb => kb.id === this.kbIdSelected);\n          if (kbSelected) {\n            this.kbNameEl.value = kbSelected.name;\n          }\n        }\n      }\n    );\n  };\n\n  private reset() {\n    this.kbs = [];\n    this.kbIdSelected = null;\n    this.selectionKbDisabled = true;\n    this.searchKBEl.value = \"\";\n    this.kbSearchText = \"\";\n  }\n\n  private createKbHandler = (): void => {\n    if (this.createKBCallback) {\n      const createKBCallbackPromise = this.createKBCallback({\n        id: this.kbIdSelected,\n        name: this.kbNameEl.value\n      });\n      createKBCallbackPromise.then((formSubmitResult: FormSubmitResult) => {\n        formSubmitValidation(formSubmitResult, this);\n      });\n    }\n  };\n\n  private connectCallbackHandler = (): void => {\n    if (this.connectCallback) {\n      const connectCallbackPromise = this.connectCallback({\n        serverUrl: this.serverUrlsEl.value,\n        authenticationType: this.authenticationTypeEl.value,\n        user: this.userNameEl?.value,\n        password: this.passwordEl?.value\n      });\n      connectCallbackPromise.then(\n        (connectionResultData: ConnectionResultData) => {\n          formSubmitValidation(connectionResultData.formResult, this);\n          if (\n            connectionResultData.formResult.success &&\n            connectionResultData.kbs\n          ) {\n            this.kbs = connectionResultData.kbs;\n            this.selectionKbDisabled = false;\n          }\n        }\n      );\n    }\n  };\n\n  // 10.RENDER() FUNCTION //\n\n  // 11.RENDER() FUNCTION //\n\n  render(): void {\n    return (\n      <Host class=\"gx-ide-component\">\n        <div class=\"gx-ide-main-wrapper\">\n          <gx-ide-container\n            containerTitle={\n              this.displayTitle ? this._componentLocale.componentName : null\n            }\n          >\n            <div class=\"flex\">\n              {/* #kb name */}\n              <gxg-label labelPosition=\"start\" class=\"kb-label\">\n                {this._componentLocale.label.serverUrl}\n              </gxg-label>\n              <gxg-combo-box\n                disableFilter={!this.enableCustomServer}\n                ref={(el: HTMLGxgComboBoxElement) =>\n                  (this.serverUrlsEl = el as HTMLGxgComboBoxElement)\n                }\n                class=\"server-urls-combo-box\"\n                part=\"server-urls\"\n              >\n                {this.serverUrls\n                  ? renderFormItems(\n                      \"gxg-combo-box-item\",\n                      this.serverUrls.map(sUrl => ({\n                        id: sUrl,\n                        label: sUrl,\n                        value: sUrl\n                      })),\n                      \"server-urls\"\n                    )\n                  : null}\n              </gxg-combo-box>\n            </div>\n            <div class=\"grid grid-data\">\n              <div>\n                <div class=\"grid grid-data-account\">\n                  {/* #authentication type */}\n                  <gxg-combo-box\n                    tool-tip\n                    disableFilter\n                    value={this.authenticationTypes[0].id}\n                    ref={(el: HTMLGxgComboBoxElement) =>\n                      (this.authenticationTypeEl = el as HTMLGxgComboBoxElement)\n                    }\n                    class=\"authentication-type\"\n                    part=\"authentication-type\"\n                    onValueChanged={this.evaluateAuthenticationType}\n                  >\n                    {renderFormItems(\n                      \"gxg-combo-box-item\",\n                      this.authenticationTypes,\n                      \"authentication-type\"\n                    )}\n                  </gxg-combo-box>\n\n                  {/* #user name */}\n                  <gxg-label labelPosition=\"start\" class=\"kb-label\">\n                    {`${this._componentLocale.label.userName}:`}\n                  </gxg-label>\n                  <gxg-form-text\n                    ref={(el: HTMLGxgFormTextElement) =>\n                      (this.userNameEl = el as HTMLGxgFormTextElement)\n                    }\n                    tool-tip\n                    value={this.userName}\n                    class=\"user-name\"\n                    part=\"user-name\"\n                  ></gxg-form-text>\n\n                  {/* #password */}\n                  <gxg-label labelPosition=\"start\" class=\"kb-label\">\n                    {`${this._componentLocale.label.password}:`}\n                  </gxg-label>\n                  <gxg-form-text\n                    tool-tip\n                    password\n                    ref={(el: HTMLGxgFormTextElement) =>\n                      (this.passwordEl = el as HTMLGxgFormTextElement)\n                    }\n                    value={this.password}\n                    class=\"password\"\n                    part=\"password\"\n                  ></gxg-form-text>\n\n                  {/* #connect */}\n                  <div>\n                    <gxg-button\n                      id=\"button-connect\"\n                      type=\"primary-text-only\"\n                      onClick={this.connectCallbackHandler}\n                      part=\"button-connect\"\n                    >\n                      {this._componentLocale.buttons.connect}\n                    </gxg-button>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"grid\">\n                <div class=\"grid-data-kbs\">\n                  <div class=\"search-kbs\">\n                    <gxg-form-text\n                      ref={(el: HTMLGxgFormTextElement) =>\n                        (this.searchKBEl = el as HTMLGxgFormTextElement)\n                      }\n                      class=\"search-kb-input\"\n                      part=\"search-kb\"\n                      disabled={this.selectionKbDisabled}\n                      placeholder={this._componentLocale.label.searchKbs}\n                    ></gxg-form-text>\n                  </div>\n                  <div class=\"box-kbs\">\n                    <gxg-list-box\n                      singleSelection\n                      disabled={this.selectionKbDisabled}\n                      ref={(el: HTMLElement) => (this.listBoxEl = el)}\n                      part=\"kbs\"\n                    >\n                      {this.kbs\n                        .filter(kb =>\n                          kb.name\n                            .toLowerCase()\n                            .includes(this.kbSearchText.toLowerCase())\n                        )\n                        .map(kb => (\n                          <gxg-list-box-item value={kb.id} key={kb.id}>\n                            {kb.name}\n                          </gxg-list-box-item>\n                        ))}\n                    </gxg-list-box>\n                  </div>\n                </div>\n                <div class=\"grid grid-data-kbs-footer\">\n                  {/* #kbName */}\n                  <gxg-form-text\n                    ref={(el: HTMLGxgFormTextElement) =>\n                      (this.kbNameEl = el as HTMLGxgFormTextElement)\n                    }\n                    label={this._componentLocale.localKb}\n                    value={this.kbName}\n                    class=\"kb-name\"\n                    part=\"kb-name\"\n                    disabled={this.selectionKbDisabled}\n                  ></gxg-form-text>\n\n                  {/* #create button */}\n                  <div>\n                    <gxg-button\n                      id=\"button-create\"\n                      type=\"primary-text-only\"\n                      onClick={this.createKbHandler}\n                      part=\"button-create\"\n                      disabled={this.selectionKbDisabled}\n                    >\n                      {this._componentLocale.buttons.create}\n                    </gxg-button>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </gx-ide-container>\n        </div>\n        <gxg-shortcuts src={this.shortcutsSrc}></gxg-shortcuts>\n      </Host>\n    );\n  }\n}\n\nexport interface GXServerConnectionData {\n  serverUrl: string;\n  authenticationType: GxServerAuthenticationType;\n  user: string;\n  password: string;\n}\nexport type ConnectionResultData = {\n  formResult: FormSubmitResult;\n  kbs: KBData[];\n};\nexport interface KBData {\n  id: string;\n  name: string;\n}\nexport interface CreateKBData {\n  id: string;\n  name: string;\n}\n"],"version":3}
+{"file":"gx-ide-create-kb-from-server.entry.js","mappings":"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","names":[],"sources":["src/components/create-kb-from-server/create-kb-from-server.scss?tag=gx-ide-create-kb-from-server&encapsulation=shadow","src/components/create-kb-from-server/create-kb-from-server.tsx"],"sourcesContent":["@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n  display: block;\n  border: 1px solid var(--gxg-border-color--regular);\n  background-color: var(--mer-color__surface);\n}\n:host(.gxi-create-kb-from-server--shadow) {\n}\n\n.grid-data {\n  grid-template-columns: repeat(2, 1fr);\n}\n.grid-data-account {\n  grid-template-columns: auto 1fr;\n  > :nth-child(1) {\n    grid-area: 1 / 1 / 2 / 3;\n  }\n  > :nth-child(6) {\n    grid-area: 4 / 2 / 5 / 3;\n  }\n}\n.grid-data-kbs {\n  display: flex;\n  flex-direction: column;\n  gap: var(--gx-ide-grid-row-gap);\n  .search-kbs {\n    width: 100%;\n    display: flex;\n  }\n  .box-kbs {\n    height: 150px;\n  }\n}\n.grid-data-kbs-footer {\n  display: flex;\n}\n.flex {\n  display: flex;\n  > :nth-child(2) {\n    flex: 1;\n  }\n}\n","/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Element,\n  State,\n  getAssetPath,\n  Watch\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { SelectionChangedEvent } from \"@genexus/gemini/dist/types/components/list-box/list-box\";\n/* CUSTOM IMPORTS */\nimport { GxOption } from \"../../common/types\";\nimport { Locale } from \"../../common/locale\";\nimport { renderFormItems } from \"../../common/common\";\nimport {\n  FormSubmitResult,\n  GxServerAuthenticationType\n} from \"../../common/types\";\nimport { formSubmitValidation } from \"../../common/helpers\";\n\n@Component({\n  tag: \"gx-ide-create-kb-from-server\",\n  styleUrl: \"create-kb-from-server.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/create-kb-from-server\"]\n})\nexport class GxIdeCreateKbFromServer {\n  [key: string]: any;\n\n  /*\nINDEX:\n1.OWN PROPERTIES\n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API | WATCH'S\n5.EVENTS (EMIT)\n6.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  private shortcutsSrc = getAssetPath(\n    `./gx-ide-assets/create-kb-from-server/shortcuts.json`\n  );\n\n  /* References needed to collect data with \"Connect\" and \"Create\" buttons submit*/\n  private authenticationTypeEl!: HTMLGxgComboBoxElement;\n  private serverUrlsEl!: HTMLGxgComboBoxElement;\n  private kbNameEl!: HTMLGxgFormTextElement;\n  private passwordEl!: HTMLGxgFormTextElement;\n  private userNameEl!: HTMLGxgFormTextElement;\n  private searchKBEl!: HTMLGxgFormTextElement;\n  private listBoxEl!: HTMLElement;\n  private kbIdSelected: string = null;\n  private authenticationTypes: GxOption[] = [];\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeCreateKbFromServerElement;\n\n  // 3.STATE() VARIABLES //\n\n  /**\n   * Disabled or not the part for select and create the KB\n   */\n  @State() selectionKbDisabled = true;\n\n  /**\n   * KBs that return from connect to the server\n   */\n\n  @State() kbs: KBData[] = [];\n  @Watch(\"kbs\")\n  watchPropHandler(newKbs: KBData[]) {\n    /* When the list of servers are updated, the first server is selected by default */\n    this.kbIdSelected = newKbs[0].id;\n    this.kbName = newKbs[0].name;\n  }\n\n  /**\n   * KBs search text\n   */\n  @State() kbSearchText = \"\";\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   * Callback that will be invoked when the user connect to the kb server (‘Connect’ button)\n   */\n  @Prop() readonly connectCallback: (\n    data: GXServerConnectionData\n  ) => Promise<ConnectionResultData>;\n\n  /**\n   * Callback that will be invoked when the user confirms KB creation (‘Create’ button)\n   */\n  @Prop() readonly createKBCallback: (\n    data: CreateKBData\n  ) => Promise<FormSubmitResult>;\n\n  /**\n   * If is true then the user can specify a server url that don't be in the combo box of server urls.\n   */\n  @Prop() readonly enableCustomServer: boolean = true;\n\n  /**\n   * The knowledge base default suggested name\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable\n  @Prop({ mutable: true }) kbName: string;\n\n  /**\n   * Password for the database connection.\n   */\n  @Prop() readonly password: string;\n\n  /**\n   * Array of URLs of cataloged servers to be displayed in the combo\n   */\n  @Prop() readonly serverUrls!: string[];\n\n  /**\n   * Username for the database connection.\n   */\n  @Prop() readonly userName: string;\n\n  // 5.EVENTS (EMIT) //\n\n  /**\n   * This event is emitted once just after the component is fully loaded and the first render() occurs\n   */\n  @Event() componentDidRenderFirstTime: EventEmitter<boolean>;\n\n  // 6.METHODS //\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n    this.setAuthenticationTypes();\n  }\n\n  componentDidLoad() {\n    (this.serverUrlsEl as HTMLElement).focus();\n    this.addEventListeners();\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 setAuthenticationTypes = () => {\n    this.authenticationTypes = [\n      {\n        id: \"genexus\",\n        value: \"genexus\",\n        label: this._componentLocale.authenticationTypes.genexusAccount\n      },\n      {\n        id: \"local\",\n        value: \"local\",\n        label: this._componentLocale.authenticationTypes.local\n      }\n    ];\n  };\n\n  private addEventListeners = () => {\n    this.serverUrlsEl.addEventListener(\"valueChanged\", () => {\n      this.reset();\n    });\n\n    this.searchKBEl.addEventListener(\n      \"valueChanged\",\n      (e: CustomEvent<string>) => {\n        this.kbNameEl.value = \"\";\n        this.kbIdSelected = null;\n        this.kbSearchText = e.detail;\n      }\n    );\n\n    this.listBoxEl.addEventListener(\n      \"selectionChanged\",\n      (ev: CustomEvent<SelectionChangedEvent>): void => {\n        const selectedItems = ev.detail.items;\n        let selectedItem;\n        if (selectedItems.length > 0) {\n          selectedItem = ev.detail.items[0];\n        }\n        if (selectedItem) {\n          this.kbIdSelected = selectedItem.value;\n          const kbSelected = this.kbs.find(kb => kb.id === this.kbIdSelected);\n          if (kbSelected) {\n            this.kbNameEl.value = kbSelected.name;\n          }\n        }\n      }\n    );\n  };\n\n  private reset() {\n    this.kbs = [];\n    this.kbIdSelected = null;\n    this.selectionKbDisabled = true;\n    this.searchKBEl.value = \"\";\n    this.kbSearchText = \"\";\n  }\n\n  private createKbHandler = (): void => {\n    if (this.createKBCallback) {\n      const createKBCallbackPromise = this.createKBCallback({\n        id: this.kbIdSelected,\n        name: this.kbNameEl.value\n      });\n      createKBCallbackPromise.then((formSubmitResult: FormSubmitResult) => {\n        formSubmitValidation(formSubmitResult, this);\n      });\n    }\n  };\n\n  private connectCallbackHandler = (): void => {\n    if (this.connectCallback) {\n      const connectCallbackPromise = this.connectCallback({\n        serverUrl: this.serverUrlsEl.value,\n        authenticationType: this.authenticationTypeEl.value,\n        user: this.userNameEl?.value,\n        password: this.passwordEl?.value\n      });\n      connectCallbackPromise.then(\n        (connectionResultData: ConnectionResultData) => {\n          formSubmitValidation(connectionResultData.formResult, this);\n          if (\n            connectionResultData.formResult.success &&\n            connectionResultData.kbs\n          ) {\n            this.kbs = connectionResultData.kbs;\n            this.selectionKbDisabled = false;\n          }\n        }\n      );\n    }\n  };\n\n  // 10.RENDER() FUNCTION //\n\n  // 11.RENDER() FUNCTION //\n\n  render(): void {\n    return (\n      <Host class=\"gx-ide-component\">\n        <div class=\"gx-ide-main-wrapper\">\n          <gx-ide-container\n            containerTitle={\n              this.displayTitle ? this._componentLocale.componentName : null\n            }\n          >\n            <div class=\"flex\">\n              {/* #kb name */}\n              <gxg-label labelPosition=\"start\" class=\"kb-label\">\n                {this._componentLocale.label.serverUrl}\n              </gxg-label>\n              <gxg-combo-box\n                disableFilter={!this.enableCustomServer}\n                ref={(el: HTMLGxgComboBoxElement) =>\n                  (this.serverUrlsEl = el as HTMLGxgComboBoxElement)\n                }\n                class=\"server-urls-combo-box\"\n                part=\"server-urls\"\n              >\n                {this.serverUrls\n                  ? renderFormItems(\n                      \"gxg-combo-box-item\",\n                      this.serverUrls.map(sUrl => ({\n                        id: sUrl,\n                        label: sUrl,\n                        value: sUrl\n                      })),\n                      \"server-urls\"\n                    )\n                  : null}\n              </gxg-combo-box>\n            </div>\n            <div class=\"grid grid-data\">\n              <div>\n                <div class=\"grid grid-data-account\">\n                  {/* #authentication type */}\n                  <gxg-combo-box\n                    tool-tip\n                    disableFilter\n                    value={this.authenticationTypes[0].id}\n                    ref={(el: HTMLGxgComboBoxElement) =>\n                      (this.authenticationTypeEl = el as HTMLGxgComboBoxElement)\n                    }\n                    class=\"authentication-type\"\n                    part=\"authentication-type\"\n                    onValueChanged={this.evaluateAuthenticationType}\n                  >\n                    {renderFormItems(\n                      \"gxg-combo-box-item\",\n                      this.authenticationTypes,\n                      \"authentication-type\"\n                    )}\n                  </gxg-combo-box>\n\n                  {/* #user name */}\n                  <gxg-label labelPosition=\"start\" class=\"kb-label\">\n                    {`${this._componentLocale.label.userName}:`}\n                  </gxg-label>\n                  <gxg-form-text\n                    ref={(el: HTMLGxgFormTextElement) =>\n                      (this.userNameEl = el as HTMLGxgFormTextElement)\n                    }\n                    tool-tip\n                    value={this.userName}\n                    class=\"user-name\"\n                    part=\"user-name\"\n                  ></gxg-form-text>\n\n                  {/* #password */}\n                  <gxg-label labelPosition=\"start\" class=\"kb-label\">\n                    {`${this._componentLocale.label.password}:`}\n                  </gxg-label>\n                  <gxg-form-text\n                    tool-tip\n                    password\n                    ref={(el: HTMLGxgFormTextElement) =>\n                      (this.passwordEl = el as HTMLGxgFormTextElement)\n                    }\n                    value={this.password}\n                    class=\"password\"\n                    part=\"password\"\n                  ></gxg-form-text>\n\n                  {/* #connect */}\n                  <div>\n                    <gxg-button\n                      id=\"button-connect\"\n                      type=\"primary-text-only\"\n                      onClick={this.connectCallbackHandler}\n                      part=\"button-connect\"\n                    >\n                      {this._componentLocale.buttons.connect}\n                    </gxg-button>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"grid\">\n                <div class=\"grid-data-kbs\">\n                  <div class=\"search-kbs\">\n                    <gxg-form-text\n                      ref={(el: HTMLGxgFormTextElement) =>\n                        (this.searchKBEl = el as HTMLGxgFormTextElement)\n                      }\n                      class=\"search-kb-input\"\n                      part=\"search-kb\"\n                      disabled={this.selectionKbDisabled}\n                      placeholder={this._componentLocale.label.searchKbs}\n                    ></gxg-form-text>\n                  </div>\n                  <div class=\"box-kbs\">\n                    <gxg-list-box\n                      singleSelection\n                      disabled={this.selectionKbDisabled}\n                      ref={(el: HTMLElement) => (this.listBoxEl = el)}\n                      part=\"kbs\"\n                    >\n                      {this.kbs\n                        .filter(kb =>\n                          kb.name\n                            .toLowerCase()\n                            .includes(this.kbSearchText.toLowerCase())\n                        )\n                        .map(kb => (\n                          <gxg-list-box-item value={kb.id} key={kb.id}>\n                            {kb.name}\n                          </gxg-list-box-item>\n                        ))}\n                    </gxg-list-box>\n                  </div>\n                </div>\n                <div class=\"grid grid-data-kbs-footer\">\n                  {/* #kbName */}\n                  <gxg-form-text\n                    ref={(el: HTMLGxgFormTextElement) =>\n                      (this.kbNameEl = el as HTMLGxgFormTextElement)\n                    }\n                    label={this._componentLocale.localKb}\n                    value={this.kbName}\n                    class=\"kb-name\"\n                    part=\"kb-name\"\n                    disabled={this.selectionKbDisabled}\n                  ></gxg-form-text>\n\n                  {/* #create button */}\n                  <div>\n                    <gxg-button\n                      id=\"button-create\"\n                      type=\"primary-text-only\"\n                      onClick={this.createKbHandler}\n                      part=\"button-create\"\n                      disabled={this.selectionKbDisabled}\n                    >\n                      {this._componentLocale.buttons.create}\n                    </gxg-button>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </gx-ide-container>\n        </div>\n        <gxg-shortcuts src={this.shortcutsSrc}></gxg-shortcuts>\n      </Host>\n    );\n  }\n}\n\nexport interface GXServerConnectionData {\n  serverUrl: string;\n  authenticationType: GxServerAuthenticationType;\n  user: string;\n  password: string;\n}\nexport type ConnectionResultData = {\n  formResult: FormSubmitResult;\n  kbs: KBData[];\n};\nexport interface KBData {\n  id: string;\n  name: string;\n}\nexport interface CreateKBData {\n  id: string;\n  name: string;\n}\n"],"version":3}

package/dist/esm/gx-ide-dashboard-home.entry.js

@@ -1,9 +1,18 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-2f305780.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-27c691bc.js';
+import { g as getIconPath } from './assets-manager-120996e9.js';
 import { L as Locale } from './locale-3c32f251.js';
-import { f as formatDate } from './helpers-0a23ab69.js';
+import { a as formatDate } from './helpers-05c62775.js';
 
-const dashboardHomeCss = ":root {\n  --ui-animaton-speed: 0.2s;\n}\n\n/*ALIGNMENT*/\n/*Ellipsis*/\n/*****************************************************\nTYPOGRAPHY\n*****************************************************/\n/*Title 01 (Positive)*/\n.gxg-title-01 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-01-font-weight);\n  font-size: var(--ds-title-01-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n/*Title 01 (Negative)*/\n.gxg-title-01--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-01-font-weight);\n  font-size: var(--ds-title-01-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 02 (Positive)*/\n.gxg-title-02 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-02-font-weight);\n  font-size: var(--ds-title-02-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-02--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-02-font-weight);\n  font-size: var(--ds-title-02-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--color-on-primary);\n}\n\n/*Title 03*/\n.gxg-title-03 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-03-font-weight);\n  font-size: var(--ds-title-03-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-03--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-03-font-weight);\n  font-size: var(--ds-title-03-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 04*/\n.gxg-title-04 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-04-font-weight);\n  font-size: var(--ds-title-04-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-04--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-04-font-weight);\n  font-size: var(--ds-title-04-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 05*/\n.gxg-title-05 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-05-font-weight);\n  font-size: var(--ds-title-05-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-05--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-05-font-weight);\n  font-size: var(--ds-title-05-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Text*/\n.gxg-text {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-text--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n.gxg-text--gray {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--dimmed);\n}\n\n/*Quote*/\n.gxg-quote {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  font-style: italic;\n}\n\n.gxg-quote--negative {\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Link*/\n.gxg-link {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n}\n.gxg-link:hover {\n  color: var(--ds-base-font-color--link-hover);\n}\n.gxg-link:active {\n  color: var(--ds-base-font-color--link-active);\n}\n\n.gxg-link-gray {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n  color: var(--ds-base-font-color--dimmed);\n}\n.gxg-link-gray:hover {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n  color: var(--ds-base-font-color--dimmed);\n  filter: brightness(1.4);\n}\n\n/*Alerts*/\n.gxg-alert-error {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--error);\n  display: inline-block;\n}\n\n.gxg-alert-warning {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--warning);\n  display: inline-block;\n}\n\n.gxg-alert-success {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--success);\n  display: inline-block;\n}\n\n/*Tab*/\n.gxg-tab--disabled {\n  color: var(--color-primary-disabled);\n  pointer-events: none;\n}\n.gxg-tab--disabled[disabled] {\n  color: var(--color-primary-disabled);\n  pointer-events: none;\n}\n\n/*Label*/\n.gxg-label {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--gxg-label-font-weight);\n  font-size: var(--gxg-label-font-size);\n  color: var(--gxg-label-color);\n  text-align: center;\n  line-height: 1.455em;\n  display: flex;\n  align-items: center;\n}\n.gxg-label:hover {\n  color: var(--color-primary-hover);\n}\n.gxg-label:focus {\n  color: var(--color-primary-active);\n}\n.gxg-label:active {\n  color: var(--color-primary-active);\n}\n.gxg-label[disabled] {\n  color: var(--color-primary-disabled);\n}\n\n.gxg-label--negative {\n  color: var(--color-on-primary);\n}\n.gxg-label--negative[disabled] {\n  color: var(--color-on-disabled);\n}\n\n/*****************************************************\nGXG-BUTTON and GXG-BUTTON-GROUP COMMON STYLES\n*****************************************************/\n/*****************************************************\nFORM ELEMENTS\n*****************************************************/\n.gxg-scrollbar {\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.gxg-scrollbar::-webkit-scrollbar {\n  width: var(--gxg-scrollbar-width);\n  height: var(--gxg-scrollbar-width);\n}\n.gxg-scrollbar::-webkit-scrollbar-track {\n  background-color: var(--gxg-scrollbar-track-background);\n  border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb {\n  background-color: var(--gxg-scrollbar-track-thumb-background);\n  border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb:hover {\n  background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.gxg-scrollbar::-webkit-scrollbar-corner {\n  background: rgba(0, 0, 0, 0);\n}\n\n:root {\n  --ui-animaton-speed: 0.2s;\n}\n\n/*ALIGNMENT*/\n/*Ellipsis*/\n/*****************************************************\nTYPOGRAPHY\n*****************************************************/\n/*Title 01 (Positive)*/\n.gxg-title-01 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-01-font-weight);\n  font-size: var(--ds-title-01-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n/*Title 01 (Negative)*/\n.gxg-title-01--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-01-font-weight);\n  font-size: var(--ds-title-01-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 02 (Positive)*/\n.gxg-title-02 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-02-font-weight);\n  font-size: var(--ds-title-02-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-02--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-02-font-weight);\n  font-size: var(--ds-title-02-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--color-on-primary);\n}\n\n/*Title 03*/\n.gxg-title-03 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-03-font-weight);\n  font-size: var(--ds-title-03-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-03--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-03-font-weight);\n  font-size: var(--ds-title-03-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 04*/\n.gxg-title-04 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-04-font-weight);\n  font-size: var(--ds-title-04-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-04--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-04-font-weight);\n  font-size: var(--ds-title-04-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 05*/\n.gxg-title-05 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-05-font-weight);\n  font-size: var(--ds-title-05-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-05--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-05-font-weight);\n  font-size: var(--ds-title-05-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Text*/\n.gxg-text {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-text--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n.gxg-text--gray {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--dimmed);\n}\n\n/*Quote*/\n.gxg-quote {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  font-style: italic;\n}\n\n.gxg-quote--negative {\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Link*/\n.gxg-link {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n}\n.gxg-link:hover {\n  color: var(--ds-base-font-color--link-hover);\n}\n.gxg-link:active {\n  color: var(--ds-base-font-color--link-active);\n}\n\n.gxg-link-gray {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n  color: var(--ds-base-font-color--dimmed);\n}\n.gxg-link-gray:hover {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n  color: var(--ds-base-font-color--dimmed);\n  filter: brightness(1.4);\n}\n\n/*Alerts*/\n.gxg-alert-error {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--error);\n  display: inline-block;\n}\n\n.gxg-alert-warning {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--warning);\n  display: inline-block;\n}\n\n.gxg-alert-success {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--success);\n  display: inline-block;\n}\n\n/*Tab*/\n.gxg-tab--disabled {\n  color: var(--color-primary-disabled);\n  pointer-events: none;\n}\n.gxg-tab--disabled[disabled] {\n  color: var(--color-primary-disabled);\n  pointer-events: none;\n}\n\n/*Label*/\n.gxg-label {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--gxg-label-font-weight);\n  font-size: var(--gxg-label-font-size);\n  color: var(--gxg-label-color);\n  text-align: center;\n  line-height: 1.455em;\n  display: flex;\n  align-items: center;\n}\n.gxg-label:hover {\n  color: var(--color-primary-hover);\n}\n.gxg-label:focus {\n  color: var(--color-primary-active);\n}\n.gxg-label:active {\n  color: var(--color-primary-active);\n}\n.gxg-label[disabled] {\n  color: var(--color-primary-disabled);\n}\n\n.gxg-label--negative {\n  color: var(--color-on-primary);\n}\n.gxg-label--negative[disabled] {\n  color: var(--color-on-disabled);\n}\n\n/*****************************************************\nGXG-BUTTON and GXG-BUTTON-GROUP COMMON STYLES\n*****************************************************/\n/*****************************************************\nFORM ELEMENTS\n*****************************************************/\n.gxg-scrollbar {\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.gxg-scrollbar::-webkit-scrollbar {\n  width: var(--gxg-scrollbar-width);\n  height: var(--gxg-scrollbar-width);\n}\n.gxg-scrollbar::-webkit-scrollbar-track {\n  background-color: var(--gxg-scrollbar-track-background);\n  border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb {\n  background-color: var(--gxg-scrollbar-track-thumb-background);\n  border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb:hover {\n  background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.gxg-scrollbar::-webkit-scrollbar-corner {\n  background: rgba(0, 0, 0, 0);\n}\n\n/*Gx Ide*/\n/*@container queries*/\n/* hiChar styles\nFound on /common/helpers.tsx hiChar function is used to add a span/class to every character that matches a search value. It is used to help the user see why the filter results are filtered. The span/class on the characters are useless without proper styling.\n*/\n/* Helper Classes */\n.gxi-hidden {\n  display: none !important;\n}\n\n.gxi-full-height {\n  height: 100%;\n}\n\n.gxi-overflow-auto {\n  overflow: auto;\n}\n\n.gxi-display-flex {\n  display: flex;\n}\n\n.align-start {\n  display: flex;\n  align-items: start;\n}\n\n.align-center {\n  display: flex;\n  align-items: center;\n}\n\n.align-end {\n  display: flex;\n  align-items: end;\n}\n\n.overflow-auto {\n  overflow: auto;\n}\n\n.justify-start {\n  display: flex;\n  justify-content: start;\n}\n\n.justify-center {\n  display: flex;\n  justify-content: center;\n}\n\n.justify-end {\n  display: flex;\n  justify-content: end;\n}\n\n/* Grids */\n.grid {\n  display: grid;\n  grid-row-gap: var(--gx-ide-grid-row-gap);\n  grid-column-gap: var(--gx-ide-grid-column-gap);\n  grid-template-rows: auto;\n}\n\nch-grid-cell {\n  display: flex;\n}\n\nch-grid {\n  overflow: auto;\n  height: 100%;\n}\n\nch-grid-column {\n  /*to be removed when this works inside a component with shadow: true*/\n  z-index: 99;\n  border-bottom: 1px solid var(--mer-color__neutral-gray--800);\n}\n\nch-grid-column:first-child {\n  padding-inline-start: var(--gx-ide-container__padding) !important;\n}\n\nch-grid-column:last-child {\n  padding-inline-end: var(--gx-ide-container__padding) !important;\n}\n\nch-grid-cell {\n  --mer-spacing--xs: var(--gx-ide-container__padding);\n}\n\n/*--- Layout ---*/\n.layout {\n  display: grid;\n  gap: var(--mer-spacing--lg);\n  box-sizing: border-box;\n}\n.layout--two-cols {\n  grid-template-columns: 1fr 1fr;\n}\n.layout--space-above {\n  padding-block-start: var(--mer-spacing--lg);\n}\n\n/*Gxg Tabs*/\ngxg-tabs {\n  box-shadow: none;\n}\n\n/*All components Host should have this class set. !important is set on every rule, since this styles could be overridden by the host user, since they are applied on the host component*/\n:host(.gx-ide-component) {\n  height: 100% !important;\n  display: flex !important;\n  flex-direction: column !important;\n}\n\n/*stylize the top bar*/\n:host(:focus-within) gx-ide-top-bar::part(wrapper) {\n  background-color: var(--color-secondary-enabled);\n}\n\n/* Main wrapper (should be the first element inside the host. Everything should be inside .gx-ide-main-wrapper) */\n.gx-ide-main-wrapper {\n  color: var(--gx-ide-component-text-color);\n  font-weight: var(--mer-font__weight--regular);\n  font-size: var(--mer-font__size--xs);\n  font-family: var(--mer-font-family--primary);\n  height: 100%;\n  background-color: var(--gx-ide-component-background-color);\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  box-sizing: border-box;\n}\n\n/*This is the main element. This is the one that take the remaining vertical space*/\n.gx-ide-main {\n  flex-grow: 1;\n  overflow-y: auto;\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.gx-ide-main::-webkit-scrollbar {\n  width: var(--gxg-scrollbar-width);\n  height: var(--gxg-scrollbar-width);\n}\n.gx-ide-main::-webkit-scrollbar-track {\n  background-color: var(--gxg-scrollbar-track-background);\n  border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.gx-ide-main::-webkit-scrollbar-thumb {\n  background-color: var(--gxg-scrollbar-track-thumb-background);\n  border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.gx-ide-main::-webkit-scrollbar-thumb:hover {\n  background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.gx-ide-main::-webkit-scrollbar-corner {\n  background: rgba(0, 0, 0, 0);\n}\n\n.gx-ide-overflow {\n  overflow-y: auto;\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.gx-ide-overflow::-webkit-scrollbar {\n  width: var(--gxg-scrollbar-width);\n  height: var(--gxg-scrollbar-width);\n}\n.gx-ide-overflow::-webkit-scrollbar-track {\n  background-color: var(--gxg-scrollbar-track-background);\n  border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.gx-ide-overflow::-webkit-scrollbar-thumb {\n  background-color: var(--gxg-scrollbar-track-thumb-background);\n  border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.gx-ide-overflow::-webkit-scrollbar-thumb:hover {\n  background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.gx-ide-overflow::-webkit-scrollbar-corner {\n  background: rgba(0, 0, 0, 0);\n}\n\n.tree-view-primary {\n  font-size: var(--mer-font__size--2xs);\n}\n\np {\n  margin: 0;\n  font-size: var(--mer-font__size--xxs);\n}\n\n/*Gx Ide*/\n/*@container queries*/\n/* hiChar styles\nFound on /common/helpers.tsx hiChar function is used to add a span/class to every character that matches a search value. It is used to help the user see why the filter results are filtered. The span/class on the characters are useless without proper styling.\n*/\n:host {\n  display: block;\n  height: 100%;\n  overflow: auto;\n  margin: var(--mer-spacing--lg);\n}\n\n:host,\n.gx-ide-main-wrapper,\n.grid--basic,\n.project,\n.recent-objects {\n  height: 100%;\n  overflow: auto;\n}\n\n.gx-ide-main-wrapper {\n  container-name: dashboard-main-wrapper;\n  container-type: inline-size;\n}\n\n.kb {\n  grid-area: kb;\n  align-self: center;\n}\n.kb .version-pill {\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.kb .kb-detail {\n  display: flex;\n  flex-direction: column;\n  align-items: start;\n  flex-wrap: wrap;\n  margin-block-start: var(--mer-spacing--md);\n  gap: var(--mer-spacing--md);\n}\n.kb .kb-detail .display-inline {\n  display: -webkit-box;\n  -webkit-line-clamp: 1;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  font-style: italic;\n  opacity: 0.5;\n}\n\n.environment {\n  grid-area: environment;\n}\n.environment__environments {\n  padding-block-end: var(--gx-ide-grid-column-gap);\n  display: flex;\n  flex-direction: row;\n  gap: var(--gx-ide-grid-column-gap);\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n  overflow-x: auto;\n}\n.environment__environments::-webkit-scrollbar {\n  width: var(--gxg-scrollbar-width);\n  height: var(--gxg-scrollbar-width);\n}\n.environment__environments::-webkit-scrollbar-track {\n  background-color: var(--gxg-scrollbar-track-background);\n  border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.environment__environments::-webkit-scrollbar-thumb {\n  background-color: var(--gxg-scrollbar-track-thumb-background);\n  border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.environment__environments::-webkit-scrollbar-thumb:hover {\n  background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.environment__environments::-webkit-scrollbar-corner {\n  background: rgba(0, 0, 0, 0);\n}\n.environment__environments .environment-card {\n  min-width: 180px;\n  flex-grow: 1;\n}\n.environment__environments .environment-container {\n  display: flex;\n  flex-direction: column;\n  gap: var(--gx-ide-cards-vertical-spacing);\n}\n.environment__environments .environment-item {\n  display: flex;\n  align-items: center;\n  gap: var(--mer-spacing--2xs);\n}\n\n.environment-title {\n  margin-block-end: var(--mer-spacing--xs);\n  display: block;\n}\n\n.project {\n  grid-area: project;\n}\n.project .project-buttons {\n  margin-block-start: var(--mer-spacing--md);\n  gap: var(--mer-spacing--md);\n}\n.project .project-description > *:first-child {\n  margin-block-start: 0;\n}\n.project .project-description > *:last-child {\n  margin-block-end: 0;\n}\n\n.recent-objects {\n  grid-area: recent-objects;\n}\n.recent-objects__container {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  gap: var(--gx-ide-cards-vertical-spacing);\n}\n.recent-objects__object {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--gx-ide-cards-horizontal-spacing);\n}\n.recent-objects__object .obj-name {\n  color: var(--gray-06);\n}\n.recent-objects__object .col {\n  display: flex;\n  gap: var(--gx-ide-cards-horizontal-spacing);\n}\n.recent-objects__empty-state {\n  height: 100%;\n}\n\n.grid--basic {\n  flex-grow: 1;\n  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));\n  gap: var(--mer-spacing--xl);\n  grid-template-areas: \"kb environment\" \"project recent-objects\";\n  grid-template-rows: auto 1fr;\n}\n\n@container (width < 768px) {\n  .grid--basic {\n    grid-template-rows: auto auto auto;\n    grid-template-areas: \"kb environment\" \"project project\" \"recent-objects recent-objects\";\n  }\n}\ngxg-title-editable {\n  width: 100%;\n}\n\ngx-ide-card {\n  height: 100%;\n}\n\ngxg-ide-loader::part(loader-wrapper) {\n  border: var(--mer-elevation__border-01);\n  border-radius: var(--gxg-card-section_border-radius);\n}";
+const dashboardHomeCss = ":root {\n  --ui-animaton-speed: 0.2s;\n}\n\n/*ALIGNMENT*/\n/*Ellipsis*/\n/*****************************************************\nTYPOGRAPHY\n*****************************************************/\n/*Title 01 (Positive)*/\n.gxg-title-01 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-01-font-weight);\n  font-size: var(--ds-title-01-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n/*Title 01 (Negative)*/\n.gxg-title-01--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-01-font-weight);\n  font-size: var(--ds-title-01-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 02 (Positive)*/\n.gxg-title-02 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-02-font-weight);\n  font-size: var(--ds-title-02-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-02--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-02-font-weight);\n  font-size: var(--ds-title-02-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--color-on-primary);\n}\n\n/*Title 03*/\n.gxg-title-03 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-03-font-weight);\n  font-size: var(--ds-title-03-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-03--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-03-font-weight);\n  font-size: var(--ds-title-03-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 04*/\n.gxg-title-04 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-04-font-weight);\n  font-size: var(--ds-title-04-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-04--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-04-font-weight);\n  font-size: var(--ds-title-04-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 05*/\n.gxg-title-05 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-05-font-weight);\n  font-size: var(--ds-title-05-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-05--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-05-font-weight);\n  font-size: var(--ds-title-05-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Text*/\n.gxg-text {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-text--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n.gxg-text--gray {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--dimmed);\n}\n\n/*Quote*/\n.gxg-quote {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  font-style: italic;\n}\n\n.gxg-quote--negative {\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Link*/\n.gxg-link {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n}\n.gxg-link:hover {\n  color: var(--ds-base-font-color--link-hover);\n}\n.gxg-link:active {\n  color: var(--ds-base-font-color--link-active);\n}\n\n.gxg-link-gray {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n  color: var(--ds-base-font-color--dimmed);\n}\n.gxg-link-gray:hover {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n  color: var(--ds-base-font-color--dimmed);\n  filter: brightness(1.4);\n}\n\n/*Alerts*/\n.gxg-alert-error {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--error);\n  display: inline-block;\n}\n\n.gxg-alert-warning {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--warning);\n  display: inline-block;\n}\n\n.gxg-alert-success {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--success);\n  display: inline-block;\n}\n\n/*Tab*/\n.gxg-tab--disabled {\n  color: var(--color-primary-disabled);\n  pointer-events: none;\n}\n.gxg-tab--disabled[disabled] {\n  color: var(--color-primary-disabled);\n  pointer-events: none;\n}\n\n/*Label*/\n.gxg-label {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--gxg-label-font-weight);\n  font-size: var(--gxg-label-font-size);\n  color: var(--gxg-label-color);\n  text-align: center;\n  line-height: 1.455em;\n  display: flex;\n  align-items: center;\n}\n.gxg-label:hover {\n  color: var(--color-primary-hover);\n}\n.gxg-label:focus {\n  color: var(--color-primary-active);\n}\n.gxg-label:active {\n  color: var(--color-primary-active);\n}\n.gxg-label[disabled] {\n  color: var(--color-primary-disabled);\n}\n\n.gxg-label--negative {\n  color: var(--color-on-primary);\n}\n.gxg-label--negative[disabled] {\n  color: var(--color-on-disabled);\n}\n\n/*****************************************************\nGXG-BUTTON and GXG-BUTTON-GROUP COMMON STYLES\n*****************************************************/\n/*****************************************************\nFORM ELEMENTS\n*****************************************************/\n.gxg-scrollbar {\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.gxg-scrollbar::-webkit-scrollbar {\n  width: var(--gxg-scrollbar-width);\n  height: var(--gxg-scrollbar-width);\n}\n.gxg-scrollbar::-webkit-scrollbar-track {\n  background-color: var(--gxg-scrollbar-track-background);\n  border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb {\n  background-color: var(--gxg-scrollbar-track-thumb-background);\n  border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb:hover {\n  background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.gxg-scrollbar::-webkit-scrollbar-corner {\n  background: rgba(0, 0, 0, 0);\n}\n\n:root {\n  --ui-animaton-speed: 0.2s;\n}\n\n/*ALIGNMENT*/\n/*Ellipsis*/\n/*****************************************************\nTYPOGRAPHY\n*****************************************************/\n/*Title 01 (Positive)*/\n.gxg-title-01 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-01-font-weight);\n  font-size: var(--ds-title-01-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n/*Title 01 (Negative)*/\n.gxg-title-01--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-01-font-weight);\n  font-size: var(--ds-title-01-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 02 (Positive)*/\n.gxg-title-02 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-02-font-weight);\n  font-size: var(--ds-title-02-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-02--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-02-font-weight);\n  font-size: var(--ds-title-02-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--color-on-primary);\n}\n\n/*Title 03*/\n.gxg-title-03 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-03-font-weight);\n  font-size: var(--ds-title-03-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-03--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-03-font-weight);\n  font-size: var(--ds-title-03-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 04*/\n.gxg-title-04 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-04-font-weight);\n  font-size: var(--ds-title-04-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-04--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-04-font-weight);\n  font-size: var(--ds-title-04-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 05*/\n.gxg-title-05 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-05-font-weight);\n  font-size: var(--ds-title-05-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-05--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-05-font-weight);\n  font-size: var(--ds-title-05-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Text*/\n.gxg-text {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-text--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n.gxg-text--gray {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--dimmed);\n}\n\n/*Quote*/\n.gxg-quote {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  font-style: italic;\n}\n\n.gxg-quote--negative {\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Link*/\n.gxg-link {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n}\n.gxg-link:hover {\n  color: var(--ds-base-font-color--link-hover);\n}\n.gxg-link:active {\n  color: var(--ds-base-font-color--link-active);\n}\n\n.gxg-link-gray {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n  color: var(--ds-base-font-color--dimmed);\n}\n.gxg-link-gray:hover {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n  color: var(--ds-base-font-color--dimmed);\n  filter: brightness(1.4);\n}\n\n/*Alerts*/\n.gxg-alert-error {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--error);\n  display: inline-block;\n}\n\n.gxg-alert-warning {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--warning);\n  display: inline-block;\n}\n\n.gxg-alert-success {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--success);\n  display: inline-block;\n}\n\n/*Tab*/\n.gxg-tab--disabled {\n  color: var(--color-primary-disabled);\n  pointer-events: none;\n}\n.gxg-tab--disabled[disabled] {\n  color: var(--color-primary-disabled);\n  pointer-events: none;\n}\n\n/*Label*/\n.gxg-label {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--gxg-label-font-weight);\n  font-size: var(--gxg-label-font-size);\n  color: var(--gxg-label-color);\n  text-align: center;\n  line-height: 1.455em;\n  display: flex;\n  align-items: center;\n}\n.gxg-label:hover {\n  color: var(--color-primary-hover);\n}\n.gxg-label:focus {\n  color: var(--color-primary-active);\n}\n.gxg-label:active {\n  color: var(--color-primary-active);\n}\n.gxg-label[disabled] {\n  color: var(--color-primary-disabled);\n}\n\n.gxg-label--negative {\n  color: var(--color-on-primary);\n}\n.gxg-label--negative[disabled] {\n  color: var(--color-on-disabled);\n}\n\n/*****************************************************\nGXG-BUTTON and GXG-BUTTON-GROUP COMMON STYLES\n*****************************************************/\n/*****************************************************\nFORM ELEMENTS\n*****************************************************/\n.gxg-scrollbar {\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.gxg-scrollbar::-webkit-scrollbar {\n  width: var(--gxg-scrollbar-width);\n  height: var(--gxg-scrollbar-width);\n}\n.gxg-scrollbar::-webkit-scrollbar-track {\n  background-color: var(--gxg-scrollbar-track-background);\n  border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb {\n  background-color: var(--gxg-scrollbar-track-thumb-background);\n  border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb:hover {\n  background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.gxg-scrollbar::-webkit-scrollbar-corner {\n  background: rgba(0, 0, 0, 0);\n}\n\n/*Gx Ide*/\n/*@container queries*/\n/* hiChar styles\nFound on /common/helpers.tsx hiChar function is used to add a span/class to every character that matches a search value. It is used to help the user see why the filter results are filtered. The span/class on the characters are useless without proper styling.\n*/\n/* - - - - - - - - - - - - - - - - -\nNew classes for Chameleon + Mercury\n- - - - - - - - - - - - - - - - - */\n:host {\n  display: grid;\n  block-size: 100%;\n}\n\n.card-regular {\n  background-color: var(--mer-surface__elevation--01);\n  border: var(--mer-border__width--sm) solid var(--mer-border-color__on-elevation--01);\n  border-radius: var(--mer-border__radius--md);\n  padding: var(--mer-spacing--md) var(--mer-spacing--md);\n  display: grid;\n}\n\n.card-small {\n  background-color: var(--mer-surface__elevation--02);\n  border-radius: var(--mer-border__radius--sm);\n  padding: var(--mer-spacing--sm) var(--mer-spacing--sm);\n}\n.card-small--actionable:hover {\n  background-color: var(--mer-color__neutral-gray--600);\n}\n.card-small--actionable:active {\n  background-color: var(--mer-color__neutral-gray--650);\n}\n.card-small:focus-visible {\n  outline: var(--focus__outline-width) var(--focus__outline-style) var(--focus__outline-color);\n  outline-offset: var(--focus__outline-offset);\n}\n\n.empty-state {\n  block-size: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-direction: column;\n  gap: var(--mer-spacing--sm);\n  text-align: center;\n}\n.empty-state__title, .empty-state__button, .empty-state__link {\n  max-inline-size: 300px;\n}\n\n.opacity-0 {\n  opacity: 0;\n}\n\n.opacity-1 {\n  opacity: 1;\n}\n\n.display-contents {\n  display: contents;\n}\n\n/* - - - - - - - - - - - - - - - - - - - \nOld classes (Gemini) to be removed soon\n- - - - - - - - - - - - - - - - - - - */\n/* Helper Classes */\n.gxi-hidden {\n  display: none !important;\n}\n\n.gxi-full-height {\n  height: 100%;\n}\n\n.gxi-overflow-auto {\n  overflow: auto;\n}\n\n.gxi-display-flex {\n  display: flex;\n}\n\n.align-start {\n  display: flex;\n  align-items: start;\n}\n\n.align-center {\n  display: flex;\n  align-items: center;\n}\n\n.align-end {\n  display: flex;\n  align-items: end;\n}\n\n.overflow-auto {\n  overflow: auto;\n}\n\n.justify-start {\n  display: flex;\n  justify-content: start;\n}\n\n.justify-center {\n  display: flex;\n  justify-content: center;\n}\n\n.justify-end {\n  display: flex;\n  justify-content: end;\n}\n\n/* Grids */\n.grid {\n  display: grid;\n  grid-row-gap: var(--gx-ide-grid-row-gap);\n  grid-column-gap: var(--gx-ide-grid-column-gap);\n  grid-template-rows: auto;\n}\n\nch-grid-cell {\n  display: flex;\n}\n\nch-grid {\n  overflow: auto;\n  height: 100%;\n}\n\nch-grid-column {\n  /*to be removed when this works inside a component with shadow: true*/\n  z-index: 99;\n  border-bottom: 1px solid var(--mer-color__neutral-gray--800);\n}\n\nch-grid-column:first-child {\n  padding-inline-start: var(--gx-ide-container__padding) !important;\n}\n\nch-grid-column:last-child {\n  padding-inline-end: var(--gx-ide-container__padding) !important;\n}\n\nch-grid-cell {\n  --mer-spacing--xs: var(--gx-ide-container__padding);\n}\n\n/*--- Layout ---*/\n.layout {\n  display: grid;\n  gap: var(--mer-spacing--lg);\n  box-sizing: border-box;\n}\n.layout--two-cols {\n  grid-template-columns: 1fr 1fr;\n}\n.layout--space-above {\n  padding-block-start: var(--mer-spacing--lg);\n}\n\n/*Gxg Tabs*/\ngxg-tabs {\n  box-shadow: none;\n}\n\n/*All components Host should have this class set. !important is set on every rule, since this styles could be overridden by the host user, since they are applied on the host component*/\n:host(.gx-ide-component) {\n  height: 100% !important;\n  display: flex !important;\n  flex-direction: column !important;\n}\n\n/*stylize the top bar*/\n:host(:focus-within) gx-ide-top-bar::part(wrapper) {\n  background-color: var(--color-secondary-enabled);\n}\n\n/* Main wrapper (should be the first element inside the host. Everything should be inside .gx-ide-main-wrapper) */\n.gx-ide-main-wrapper {\n  color: var(--gx-ide-component-text-color);\n  font-weight: var(--mer-font__weight--regular);\n  font-size: var(--mer-font__size--xs);\n  font-family: var(--mer-font-family--primary);\n  height: 100%;\n  background-color: var(--gx-ide-component-background-color);\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  box-sizing: border-box;\n}\n\n/*This is the main element. This is the one that take the remaining vertical space*/\n.gx-ide-main {\n  flex-grow: 1;\n  overflow-y: auto;\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.gx-ide-main::-webkit-scrollbar {\n  width: var(--gxg-scrollbar-width);\n  height: var(--gxg-scrollbar-width);\n}\n.gx-ide-main::-webkit-scrollbar-track {\n  background-color: var(--gxg-scrollbar-track-background);\n  border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.gx-ide-main::-webkit-scrollbar-thumb {\n  background-color: var(--gxg-scrollbar-track-thumb-background);\n  border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.gx-ide-main::-webkit-scrollbar-thumb:hover {\n  background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.gx-ide-main::-webkit-scrollbar-corner {\n  background: rgba(0, 0, 0, 0);\n}\n\n.gx-ide-overflow {\n  overflow-y: auto;\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.gx-ide-overflow::-webkit-scrollbar {\n  width: var(--gxg-scrollbar-width);\n  height: var(--gxg-scrollbar-width);\n}\n.gx-ide-overflow::-webkit-scrollbar-track {\n  background-color: var(--gxg-scrollbar-track-background);\n  border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.gx-ide-overflow::-webkit-scrollbar-thumb {\n  background-color: var(--gxg-scrollbar-track-thumb-background);\n  border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.gx-ide-overflow::-webkit-scrollbar-thumb:hover {\n  background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.gx-ide-overflow::-webkit-scrollbar-corner {\n  background: rgba(0, 0, 0, 0);\n}\n\n.tree-view-primary {\n  font-size: var(--mer-font__size--2xs);\n}\n\np {\n  margin: 0;\n  font-size: var(--mer-font__size--xxs);\n}\n\n/* - - - - - - - - - - - - - - - - - -\nNew : For Mercury\n- - - - - - - - - - - - - - - - - - */\n.buttons-container {\n  display: flex;\n  gap: var(--mer-spacing--xs);\n}\n\n/*Gx Ide*/\n/*@container queries*/\n/* hiChar styles\nFound on /common/helpers.tsx hiChar function is used to add a span/class to every character that matches a search value. It is used to help the user see why the filter results are filtered. The span/class on the characters are useless without proper styling.\n*/\n:host {\n  display: block;\n  height: 100%;\n  overflow: auto;\n  margin: var(--mer-spacing--lg);\n}\n\n:host,\n.gx-ide-main-wrapper,\n.grid--basic,\n.project,\n.recent-objects {\n  height: 100%;\n  overflow: auto;\n}\n\n.gx-ide-main-wrapper {\n  container-name: dashboard-main-wrapper;\n  container-type: inline-size;\n}\n\n.kb {\n  grid-area: kb;\n  align-self: center;\n}\n.kb .version-pill {\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.kb .kb-detail {\n  display: flex;\n  flex-direction: column;\n  align-items: start;\n  flex-wrap: wrap;\n  margin-block-start: var(--mer-spacing--md);\n  gap: var(--mer-spacing--md);\n}\n.kb .kb-detail .display-inline {\n  display: -webkit-box;\n  -webkit-line-clamp: 1;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  font-style: italic;\n  opacity: 0.5;\n}\n\n.environment {\n  grid-area: environment;\n}\n.environment__environments {\n  padding-block-end: var(--gx-ide-grid-column-gap);\n  display: flex;\n  flex-direction: row;\n  gap: var(--gx-ide-grid-column-gap);\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n  overflow-x: auto;\n}\n.environment__environments::-webkit-scrollbar {\n  width: var(--gxg-scrollbar-width);\n  height: var(--gxg-scrollbar-width);\n}\n.environment__environments::-webkit-scrollbar-track {\n  background-color: var(--gxg-scrollbar-track-background);\n  border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.environment__environments::-webkit-scrollbar-thumb {\n  background-color: var(--gxg-scrollbar-track-thumb-background);\n  border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.environment__environments::-webkit-scrollbar-thumb:hover {\n  background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.environment__environments::-webkit-scrollbar-corner {\n  background: rgba(0, 0, 0, 0);\n}\n.environment__environments .environment-card {\n  min-width: 180px;\n  flex-grow: 1;\n}\n.environment__environments .environment-container {\n  display: flex;\n  flex-direction: column;\n  gap: var(--gx-ide-cards-vertical-spacing);\n}\n.environment__environments .environment-item {\n  display: flex;\n  align-items: center;\n  gap: var(--mer-spacing--2xs);\n}\n\n.environment-title {\n  margin-block-end: var(--mer-spacing--xs);\n  display: block;\n}\n\n.project {\n  grid-area: project;\n}\n.project .project-buttons {\n  margin-block-start: var(--mer-spacing--md);\n  gap: var(--mer-spacing--md);\n}\n.project .project-description > *:first-child {\n  margin-block-start: 0;\n}\n.project .project-description > *:last-child {\n  margin-block-end: 0;\n}\n\n.recent-objects {\n  grid-area: recent-objects;\n}\n.recent-objects__container {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  gap: var(--gx-ide-cards-vertical-spacing);\n}\n.recent-objects__object {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--gx-ide-cards-horizontal-spacing);\n}\n.recent-objects__object .obj-name {\n  color: var(--gray-06);\n}\n.recent-objects__object .col {\n  display: flex;\n  gap: var(--gx-ide-cards-horizontal-spacing);\n}\n.recent-objects__empty-state {\n  height: 100%;\n}\n\n.grid--basic {\n  flex-grow: 1;\n  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));\n  gap: var(--mer-spacing--xl);\n  grid-template-areas: \"kb environment\" \"project recent-objects\";\n  grid-template-rows: auto 1fr;\n}\n\n@container (width < 768px) {\n  .grid--basic {\n    grid-template-rows: auto auto auto;\n    grid-template-areas: \"kb environment\" \"project project\" \"recent-objects recent-objects\";\n  }\n}\ngxg-title-editable {\n  width: 100%;\n}\n\ngx-ide-card {\n  height: 100%;\n}\n\ngxg-ide-loader::part(loader-wrapper) {\n  border: var(--mer-elevation__border-01);\n  border-radius: var(--gxg-card-section_border-radius);\n}";
 
+var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f)
+        throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+        throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _GxIdeDashboardHome_folderIcon;
 const mapStatusToIcons = {
     "new": "gx-server/new",
     "modified": "patterns-default-associated/modified",
@@ -23,9 +32,14 @@ const GxIdeDashboardHome = class {
         registerInstance(this, hostRef);
         this.componentDidRenderFirstTime = createEvent(this, "componentDidRenderFirstTime", 7);
         this.renderedFirstTime = false;
-        // 7.LISTENERS //
-        // 8.PUBLIC METHODS API //
-        // 9.LOCAL METHODS //
+        _GxIdeDashboardHome_folderIcon.set(this, getIconPath({
+            category: "system",
+            name: "folder",
+            colorType: "on-elevation"
+        }));
+        // 7.Listeners
+        // 8.Public Methods API
+        // 9.Local Methods
         this.evaluateLoader = () => {
             if (this.recentObjects === undefined) {
                 this.loaderEl.container = this.recentObjectsContainerEl;
@@ -77,7 +91,7 @@ const GxIdeDashboardHome = class {
                 el.validationMessage = "";
             }
         };
-        // 10.RENDER() FUNCTIONS //
+        // 10.Render Function
         this.renderProjectContent = () => {
             return this.projectDescription ? (h("div", { class: "project-description", innerHTML: this.projectDescription }, this.enableEditDescription ? (h("gxg-button", { type: "secondary-text-icon", icon: "gemini-tools/edit", onClick: this.handleDescriptionChange }, this._componentLocale.edit)) : null)) : null;
         };
@@ -100,7 +114,7 @@ const GxIdeDashboardHome = class {
             this.loaderEl.show = false;
         }
     }
-    // 6.COMPONENT LIFECYCLE METHODS //
+    // 6.Component Lifecycle Events
     async componentWillLoad() {
         this._componentLocale = await Locale.getComponentStrings(this.el);
     }
@@ -138,7 +152,7 @@ const GxIdeDashboardHome = class {
                 "--mer-text__on-surface": "var(--gray-05);"
             } }), this.environment.backEnd.name))), h("gxg-card", { cardType: "mini", class: "environment-card", cardTitle: this._componentLocale.environment.dataStore }, h("div", { class: "environment-container" }, h("div", { class: "environment-item" }, h("gxg-icon", { type: this.environment.dataStore.icon, color: "onbackground", style: {
                 "--mer-text__on-surface": "var(--gray-05);"
-            } }), this.environment.dataStore.name))))), h("gxg-card", { editableTitle: false, cardTitle: this._componentLocale.project.title, class: "project" }, this.renderProjectContent()), h("gxg-card", { editableTitle: false, cardTitle: this._componentLocale.recentObjects.title, class: "recent-objects", cardType: "section", noPaddingTop: true, ref: el => (this.recentObjectsContainerEl = el) }, h("div", { class: "recent-objects__container" }, ((_c = this.recentObjects) === null || _c === void 0 ? void 0 : _c.length) === 0 ? (h("gx-ide-empty-state", { class: "recent-objects__empty-state", stateIcon: "mercury/folder", stateTitle: this._componentLocale.recentObjects.emptyState.title, stateDescription: this._componentLocale.recentObjects.emptyState.description })) : ((_d = this.recentObjects) === null || _d === void 0 ? void 0 : _d.map((obj) => {
+            } }), this.environment.dataStore.name))))), h("gxg-card", { editableTitle: false, cardTitle: this._componentLocale.project.title, class: "project" }, this.renderProjectContent()), h("gxg-card", { editableTitle: false, cardTitle: this._componentLocale.recentObjects.title, class: "recent-objects", cardType: "section", noPaddingTop: true, ref: el => (this.recentObjectsContainerEl = el) }, h("div", { class: "recent-objects__container" }, ((_c = this.recentObjects) === null || _c === void 0 ? void 0 : _c.length) === 0 ? (h("gx-ide-empty-state", { class: "recent-objects__empty-state", stateIconSrc: __classPrivateFieldGet(this, _GxIdeDashboardHome_folderIcon, "f"), stateTitle: this._componentLocale.recentObjects.emptyState.title, stateDescription: this._componentLocale.recentObjects.emptyState.description })) : ((_d = this.recentObjects) === null || _d === void 0 ? void 0 : _d.map((obj) => {
             const statusLocale = mapStatusToLocale[obj.status];
             const statusDescription = this._componentLocale.recentObjects.status[statusLocale];
             return (h("gxg-card", { background: "gray-01", padding: "m", cardType: "article", class: "recent-objects__card", actionable: true, onClick: () => this.openObject(obj.id) }, h("div", { class: "recent-objects__object" }, h("div", { class: "col col-left" }, h("gxg-icon", { type: obj.typeIcon, color: "auto" }), h("gxg-text", { type: "text-regular", class: "obj-name" }, obj.name)), h("div", { class: "col col-right" }, h("gxg-text", { italic: true }, statusDescription, obj.status === "modified"
@@ -153,6 +167,7 @@ const GxIdeDashboardHome = class {
         "recentObjects": ["recentObjectsHandler"]
     }; }
 };
+_GxIdeDashboardHome_folderIcon = new WeakMap();
 GxIdeDashboardHome.style = dashboardHomeCss;
 
 export { GxIdeDashboardHome as gx_ide_dashboard_home };