@genexus/genexus-ide-ui 0.0.139 → 0.0.140

package/dist/genexus-ide-ui/{p-82291acd.entry.js → p-03b2a741.entry.js}

@@ -23,7 +23,7 @@ const filesToListItemsData = t => {
   return e;
 };
 
-const n = ":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-container{display:flex;height:100%;width:100%;box-sizing:border-box}p{margin:0;font-size:var(--mer-font__size--xxs)}.control-wrapper{display:flex;gap:var(--mer-spacing--xs);align-items:center}.control-wrapper--vertical{flex-direction:column;align-items:start}.controls-wrapper{display:flex;gap:var(--mer-spacing--xs)}.controls-wrapper--vertical{flex-direction:column;align-items:start}.input-text{box-sizing:border-box;background-color:transparent;border:var(--mer-border__width--sm) solid var(--mer-border-color__dim);border-radius:var(--mer-border__width--lg);height:26px;color:var(--mer-text__bright);font-size:var(--mer-font__size--xxs)}.input-text--full-width{align-self:stretch}:host{display:block}.hidden-input{display:none}";
+const n = ":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-container{display:flex;height:100%;width:100%;box-sizing:border-box}p{margin:0;font-size:var(--mer-font__size--xxs)}.control-wrapper{display:flex;gap:var(--mer-spacing--xs);align-items:center}.control-wrapper--vertical{flex-direction:column;align-items:start}.controls-wrapper{display:flex;gap:var(--mer-spacing--xs)}.controls-wrapper--vertical{flex-direction:column;align-items:start}.input-text{box-sizing:border-box;background-color:transparent;border:var(--mer-border__width--sm) solid var(--mer-border-color__dim);border-radius:var(--mer-border__width--lg);height:26px;color:var(--mer-text__bright);font-size:var(--mer-font__size--xxs)}.input-text--full-width{align-self:stretch}:host{display:block}.main{display:grid;grid-template-rows:1fr auto;height:100%;gap:var(--gx-ide-form-items-gap)}.path-list{width:100%;height:100%}gx-ide-list-selector::part(list){height:100%}.hidden-input{display:none}.checkbox-container{display:flex;gap:0.5rem}.footer{display:flex;flex-direction:column;gap:var(--gx-ide-form-items-gap)}";
 
 const g = class {
   constructor(r) {
@@ -42,26 +42,28 @@ const g = class {
     this.loadFileHandle = async () => {
       this.fileInput.click();
     };
-    this.handleFileInputChange = async t => {
+    this.handleFileInputChange = t => {
       const e = t.target;
       if (e.files && e.files.length > 0) {
         const t = Array.from(e.files);
         const r = t.filter((t => !this.files.some((e => e.name === t.name))));
         this.files = [ ...this.files, ...r ];
       }
-      if (this.addCallback) {
-        await this.addCallback(this.files);
-      }
       this.fileInput.value = null;
     };
+    this.confirmCallbackHandle = async () => {
+      if (this.confirmCallback && this.files.length > 0) {
+        const t = {
+          automaticBackup: this.automaticBackupEl.checked,
+          files: this.files
+        };
+        await this.confirmCallback(t);
+      }
+    };
     this.removeFiles = t => {
-      const e = this.files.filter((e => t.includes(e.name)));
       this.files = this.files.filter((e => !t.includes(e.name)));
-      if (this.removeCallback) {
-        this.removeCallback(e);
-        this.selectedFiles = [];
-        this.fileInput.value = null;
-      }
+      this.selectedFiles = [];
+      this.fileInput.value = null;
     };
     this.handleRemoveButtonClick = () => {
       this.removeFiles(this.selectedFiles);
@@ -70,8 +72,8 @@ const g = class {
     this.selectedFiles = [];
     this.displayTitle = false;
     this.allowedExtensions = undefined;
-    this.addCallback = undefined;
-    this.removeCallback = undefined;
+    this.confirmCallback = undefined;
+    this.cancelCallback = undefined;
   }
   // 6.COMPONENT LIFECYCLE METHODS //
   async componentWillLoad() {
@@ -93,17 +95,33 @@ const g = class {
     }, r("gx-ide-container", {
       containerTitle: this.displayTitle ? this._componentLocale.componentName : null,
       slimmerFooter: i.gxIdeContainer.slimmerFooter
+    }, r("div", {
+      class: "main"
+    }, r("div", {
+      class: "controls-wrapper controls-wrapper--vertical"
     }, r("label", {
       htmlFor: "path-list"
     }, this._componentLocale.main.listLabel), r("gx-ide-list-selector", {
       id: "path-list",
       type: "multi-selection",
       listName: "path-list",
-      noListBorder: true,
       ordered: true,
       onSelectionChanged: this.fileSelectionChangedHandler,
       class: "path-list"
-    }, l(filesToListItemsData(this.files))), r("div", {
+    }, l(filesToListItemsData(this.files)))), r("div", {
+      class: "footer"
+    }, r("div", {
+      class: "checkbox-container"
+    }, r("ch-checkbox", {
+      id: "automatic-backup",
+      accessibleName: this._componentLocale.main.automaticBackupLabel,
+      checkedValue: "true",
+      unCheckedValue: "false",
+      value: "checked",
+      ref: t => this.automaticBackupEl = t
+    }), r("label", {
+      htmlFor: "automatic-backup"
+    }, this._componentLocale.main.automaticBackupLabel)), r("div", {
       class: "controls-wrapper"
     }, r("input", {
       type: "file",
@@ -118,10 +136,16 @@ const g = class {
     }, this._componentLocale.main.addFilesButton), r("button", {
       onClick: this.handleRemoveButtonClick,
       disabled: this.selectedFiles.length === 0
-    }, this._componentLocale.main.removeFilesButton, " (", this.selectedFiles.length, ")")))));
+    }, this._componentLocale.main.removeFilesButton, " (", this.selectedFiles.length, ")")))), r("button", {
+      slot: "footer-end",
+      onClick: this.confirmCallbackHandle
+    }, this._componentLocale.footer.confirmButton), r("button", {
+      slot: "footer-end",
+      onClick: this.cancelCallback
+    }, this._componentLocale.footer.cancelButton))));
   }
   static get assetsDirs() {
-    return [ "gx-ide-assets/bpm-files-selector" ];
+    return [ "gx-ide-assets/bpm-import-files" ];
   }
   get el() {
     return a(this);
@@ -130,5 +154,5 @@ const g = class {
 
 g.style = n;
 
-export { g as gx_ide_bpm_files_selector };
-//# sourceMappingURL=p-82291acd.entry.js.map
+export { g as gx_ide_bpm_import_files };
+//# sourceMappingURL=p-03b2a741.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["filesToListItemsData","files","itemsData","forEach","file","itemId","name","itemValue","itemIcon","undefined","itemChecked","push","importFilesCss","GxIdeTemplate","this","renderedFirstTime","fileSelectionChangedHandler","selectedItem","selectionChanged","emit","selectedFiles","Array","isArray","detail","map","item","loadFileHandle","async","fileInput","click","handleFileInputChange","event","target","length","newFiles","from","uniqueFiles","filter","newFile","some","existingFile","value","confirmCallbackHandle","confirmCallback","data","automaticBackup","automaticBackupEl","checked","removeFiles","filesToRemove","includes","handleRemoveButtonClick","componentWillLoad","_componentLocale","Locale","getComponentStrings","el","componentDidRender","componentDidRenderFirstTime","componentName","render","h","Host","class","containerTitle","displayTitle","slimmerFooter","config","gxIdeContainer","htmlFor","main","listLabel","id","type","listName","ordered","onSelectionChanged","renderListItems","accessibleName","automaticBackupLabel","checkedValue","unCheckedValue","ref","accept","_a","allowedExtensions","join","onChange","multiple","onClick","addFilesButton","disabled","removeFilesButton","slot","footer","confirmButton","cancelCallback","cancelButton"],"sources":["src/components/bpm/import-files/helpers.ts","src/components/bpm/import-files/import-files.scss?tag=gx-ide-bpm-import-files&encapsulation=shadow","src/components/bpm/import-files/import-files.tsx"],"sourcesContent":["import { ItemData } from \"../../_helpers/list-selector/list-selector-item/list-selector-item\";\n\nexport const filesToListItemsData = (files: string[] | File[]): ItemData[] => {\n  const itemsData: ItemData[] = [];\n  files.forEach(file => {\n    const itemId = typeof file === \"string\" ? file : file.name;\n    const itemValue = typeof file === \"string\" ? file : file.name;\n    const itemIcon: string = undefined;\n    const itemChecked: boolean = false;\n    itemsData.push({\n      itemId: itemId,\n      itemValue: itemValue,\n      itemIcon: itemIcon,\n      itemChecked: itemChecked\n    });\n  });\n  return itemsData;\n};\n","@import \"../../../global/gx-ide-common.scss\";\n@import \"../../../global/gx-ide-mixins.scss\";\n@import \"../../../global/temporary-tokens-chameleon.scss\";\n\n:host {\n  display: block;\n}\n\n.main {\n  display: grid;\n  grid-template-rows: 1fr auto;\n  height: 100%;\n  gap: var(--gx-ide-form-items-gap);\n}\n.path-list {\n  width: 100%;\n  height: 100%;\n}\ngx-ide-list-selector::part(list) {\n  height: 100%;\n}\n.hidden-input {\n  display: none;\n}\n.checkbox-container {\n  display: flex;\n  gap: 0.5rem;\n}\n.footer {\n  display: flex;\n  flex-direction: column;\n  gap: var(--gx-ide-form-items-gap);\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 */\nimport { CheckedItemsInfo } from \"../../_helpers/list-selector/list-selector\";\n/* CUSTOM IMPORTS */\nimport { config } from \"../../../common/config\";\nimport { Locale } from \"../../../common/locale\";\nimport { renderListItems } from \"../../../common/render-list-item\";\nimport { filesToListItemsData } from \"./helpers\";\n\n@Component({\n  tag: \"gx-ide-bpm-import-files\",\n  styleUrl: \"import-files.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/bpm-import-files\"]\n})\nexport class GxIdeTemplate {\n  // 1.OWN PROPERTIES //\n\n  /**\n   * The component hard-coded strings translations.\n   */\n  private _componentLocale: any;\n\n  private renderedFirstTime = false;\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeBpmImportFilesElement;\n\n  private fileInput: HTMLInputElement;\n  private automaticBackupEl: HTMLChCheckboxElement;\n\n  // 3.STATE() VARIABLES //\n  /**\n   * Contains the list of files\n   */\n  @State() files: File[] = [];\n\n  /**\n   * Contains the list of selected files\n   */\n  @State() selectedFiles: string[] = [];\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   * Allowed extensions when 'Add files' button is pressed\n   */\n  @Prop() readonly allowedExtensions: string[];\n\n  /**\n   * Callback invoked when user press 'OK' button\n   */\n  @Prop() readonly confirmCallback: (data: ImportData) => Promise<boolean>;\n\n  /**\n   * Callback invoked when user press 'Cancel' button.\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  /**\n   * @description Gets fired when something changes on items section.\n   */\n  @Event() selectionChanged: EventEmitter<void>;\n\n  // 6.COMPONENT LIFECYCLE METHODS //\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  componentDidRender() {\n    if (!this.renderedFirstTime) {\n      this.componentDidRenderFirstTime.emit(\n        this._componentLocale.componentName\n      );\n      this.renderedFirstTime = true;\n    }\n  }\n\n  // 7.LISTENERS //\n\n  // 8.PUBLIC METHODS API //\n\n  // 9.LOCAL METHODS //\n\n  private fileSelectionChangedHandler = (\n    selectedItem: CustomEvent<CheckedItemsInfo>\n  ) => {\n    this.selectionChanged.emit();\n\n    const selectedFiles = Array.isArray(selectedItem.detail)\n      ? selectedItem.detail\n      : [selectedItem.detail];\n\n    this.selectedFiles = selectedFiles.map(item => item.itemValue);\n  };\n\n  private loadFileHandle = async () => {\n    this.fileInput.click();\n  };\n\n  private handleFileInputChange = (event: Event) => {\n    const fileInput = event.target as HTMLInputElement;\n\n    if (fileInput.files && fileInput.files.length > 0) {\n      const newFiles: File[] = Array.from(fileInput.files);\n      const uniqueFiles = newFiles.filter(\n        newFile =>\n          !this.files.some(existingFile => existingFile.name === newFile.name)\n      );\n      this.files = [...this.files, ...uniqueFiles];\n    }\n\n    this.fileInput.value = null;\n  };\n\n  private confirmCallbackHandle = async () => {\n    if (this.confirmCallback && this.files.length > 0) {\n      const data: ImportData = {\n        automaticBackup: this.automaticBackupEl.checked,\n        files: this.files\n      };\n\n      await this.confirmCallback(data);\n    }\n  };\n\n  private removeFiles = (filesToRemove: string[]) => {\n    this.files = this.files.filter(file => !filesToRemove.includes(file.name));\n\n    this.selectedFiles = [];\n    this.fileInput.value = null;\n  };\n\n  private handleRemoveButtonClick = () => {\n    this.removeFiles(this.selectedFiles);\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=\"main\">\n              {/* path list*/}\n              <div class=\"controls-wrapper controls-wrapper--vertical\">\n                <label htmlFor=\"path-list\">\n                  {this._componentLocale.main.listLabel}\n                </label>\n                <gx-ide-list-selector\n                  id=\"path-list\"\n                  type=\"multi-selection\"\n                  listName=\"path-list\"\n                  ordered\n                  onSelectionChanged={this.fileSelectionChangedHandler}\n                  class=\"path-list\"\n                >\n                  {renderListItems(filesToListItemsData(this.files))}\n                </gx-ide-list-selector>\n              </div>\n\n              <div class=\"footer\">\n                <div class=\"checkbox-container\">\n                  <ch-checkbox\n                    id=\"automatic-backup\"\n                    accessibleName={\n                      this._componentLocale.main.automaticBackupLabel\n                    }\n                    checkedValue=\"true\"\n                    unCheckedValue=\"false\"\n                    value=\"checked\"\n                    ref={el =>\n                      (this.automaticBackupEl = el as HTMLChCheckboxElement)\n                    }\n                  ></ch-checkbox>\n                  <label htmlFor=\"automatic-backup\">\n                    {this._componentLocale.main.automaticBackupLabel}\n                  </label>\n                </div>\n                <div class=\"controls-wrapper\">\n                  <input\n                    type=\"file\"\n                    id=\"input_file\"\n                    accept={this.allowedExtensions?.join(\", \")}\n                    ref={el => (this.fileInput = el as HTMLInputElement)}\n                    onChange={this.handleFileInputChange}\n                    class=\"hidden-input\"\n                    multiple\n                  />\n                  <button onClick={this.loadFileHandle}>\n                    {this._componentLocale.main.addFilesButton}\n                  </button>\n                  <button\n                    onClick={this.handleRemoveButtonClick}\n                    disabled={this.selectedFiles.length === 0}\n                  >\n                    {this._componentLocale.main.removeFilesButton} (\n                    {this.selectedFiles.length})\n                  </button>\n                </div>\n              </div>\n            </div>\n\n            <button slot=\"footer-end\" onClick={this.confirmCallbackHandle}>\n              {this._componentLocale.footer.confirmButton}\n            </button>\n            <button slot=\"footer-end\" onClick={this.cancelCallback}>\n              {this._componentLocale.footer.cancelButton}\n            </button>\n          </gx-ide-container>\n        </div>\n      </Host>\n    );\n  }\n}\n\nexport type ImportData = {\n  files: File[];\n  automaticBackup: boolean;\n};\n"],"mappings":"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"}

package/dist/types/components/bpm/{files-selector/files-selector.d.ts → import-files/import-files.d.ts}

@@ -5,8 +5,9 @@ export declare class GxIdeTemplate {
      */
     private _componentLocale;
     private renderedFirstTime;
-    el: HTMLGxIdeBpmFilesSelectorElement;
+    el: HTMLGxIdeBpmImportFilesElement;
     private fileInput;
+    private automaticBackupEl;
     /**
      * Contains the list of files
      */
@@ -24,13 +25,13 @@ export declare class GxIdeTemplate {
      */
     readonly allowedExtensions: string[];
     /**
-     * Callback invoked when user press 'Add files' button. Returns a list with selected files.
+     * Callback invoked when user press 'OK' button
      */
-    readonly addCallback: (files: File[]) => Promise<void>;
+    readonly confirmCallback: (data: ImportData) => Promise<boolean>;
     /**
-     * Callback invoked when remove button is pressed.
+     * Callback invoked when user press 'Cancel' button.
      */
-    readonly removeCallback: (files: File[] | string[]) => Promise<void>;
+    readonly cancelCallback: () => Promise<void>;
     /**
      * @description Gets fired when the component has rendered for the first time.
      */
@@ -44,7 +45,12 @@ export declare class GxIdeTemplate {
     private fileSelectionChangedHandler;
     private loadFileHandle;
     private handleFileInputChange;
+    private confirmCallbackHandle;
     private removeFiles;
     private handleRemoveButtonClick;
     render(): any;
 }
+export type ImportData = {
+    files: File[];
+    automaticBackup: boolean;
+};

package/dist/types/components.d.ts

@@ -10,6 +10,7 @@ import { MessageType } from "./components/ai-assistant/ai-assistant";
 import { Translations } from "./components/ai-assistant/ai-message";
 import { ApplicationDeclarationData, CancelCallback, ConfirmCallback, GetDataMappingCallback, SelectApplicationCallback, SelectMappingCallback, SuggestApplicationsCallback } from "./components/bpm/application-declaration/bpm-app-declaration";
 import { CancelCallback as CancelCallback1, ConfirmCallback as ConfirmCallback1 } from "./components/bpm/assign-roles/assign-roles";
+import { ImportData } from "./components/bpm/import-files/import-files";
 import { TimerDuration } from "./components/bpm/timer-duration/timer-duration";
 import { GXServerConnectionData, GXServerConnectionDefault } from "./components/connect-gx-server/connect-gx-server";
 import { ConnectionResultData, EntityData, GxOption, ImportItemResultData, ObjectType as ObjectType2 } from "./common/types";
@@ -56,6 +57,7 @@ export { MessageType } from "./components/ai-assistant/ai-assistant";
 export { Translations } from "./components/ai-assistant/ai-message";
 export { ApplicationDeclarationData, CancelCallback, ConfirmCallback, GetDataMappingCallback, SelectApplicationCallback, SelectMappingCallback, SuggestApplicationsCallback } from "./components/bpm/application-declaration/bpm-app-declaration";
 export { CancelCallback as CancelCallback1, ConfirmCallback as ConfirmCallback1 } from "./components/bpm/assign-roles/assign-roles";
+export { ImportData } from "./components/bpm/import-files/import-files";
 export { TimerDuration } from "./components/bpm/timer-duration/timer-duration";
 export { GXServerConnectionData, GXServerConnectionDefault } from "./components/connect-gx-server/connect-gx-server";
 export { ConnectionResultData, EntityData, GxOption, ImportItemResultData, ObjectType as ObjectType2 } from "./common/types";
@@ -214,23 +216,23 @@ export namespace Components {
          */
         "roles": string[];
     }
-    interface GxIdeBpmFilesSelector {
-        /**
-          * Callback invoked when user press 'Add files' button. Returns a list with selected files.
-         */
-        "addCallback": (files: File[]) => Promise<void>;
+    interface GxIdeBpmImportFiles {
         /**
           * Allowed extensions when 'Add files' button is pressed
          */
         "allowedExtensions": string[];
         /**
-          * If true it displays the component title on the header
+          * Callback invoked when user press 'Cancel' button.
          */
-        "displayTitle": false;
+        "cancelCallback": () => Promise<void>;
         /**
-          * Callback invoked when remove button is pressed.
+          * Callback invoked when user press 'OK' button
          */
-        "removeCallback": (files: File[] | string[]) => Promise<void>;
+        "confirmCallback": (data: ImportData) => Promise<boolean>;
+        /**
+          * If true it displays the component title on the header
+         */
+        "displayTitle": false;
     }
     interface GxIdeBpmImportGxpm {
         /**
@@ -1788,9 +1790,9 @@ export interface GxIdeBpmAssignRolesCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLGxIdeBpmAssignRolesElement;
 }
-export interface GxIdeBpmFilesSelectorCustomEvent<T> extends CustomEvent<T> {
+export interface GxIdeBpmImportFilesCustomEvent<T> extends CustomEvent<T> {
     detail: T;
-    target: HTMLGxIdeBpmFilesSelectorElement;
+    target: HTMLGxIdeBpmImportFilesElement;
 }
 export interface GxIdeBpmImportGxpmCustomEvent<T> extends CustomEvent<T> {
     detail: T;
@@ -1982,23 +1984,23 @@ declare global {
         prototype: HTMLGxIdeBpmAssignRolesElement;
         new (): HTMLGxIdeBpmAssignRolesElement;
     };
-    interface HTMLGxIdeBpmFilesSelectorElementEventMap {
+    interface HTMLGxIdeBpmImportFilesElementEventMap {
         "componentDidRenderFirstTime": string;
         "selectionChanged": void;
     }
-    interface HTMLGxIdeBpmFilesSelectorElement extends Components.GxIdeBpmFilesSelector, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLGxIdeBpmFilesSelectorElementEventMap>(type: K, listener: (this: HTMLGxIdeBpmFilesSelectorElement, ev: GxIdeBpmFilesSelectorCustomEvent<HTMLGxIdeBpmFilesSelectorElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+    interface HTMLGxIdeBpmImportFilesElement extends Components.GxIdeBpmImportFiles, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLGxIdeBpmImportFilesElementEventMap>(type: K, listener: (this: HTMLGxIdeBpmImportFilesElement, ev: GxIdeBpmImportFilesCustomEvent<HTMLGxIdeBpmImportFilesElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLGxIdeBpmFilesSelectorElementEventMap>(type: K, listener: (this: HTMLGxIdeBpmFilesSelectorElement, ev: GxIdeBpmFilesSelectorCustomEvent<HTMLGxIdeBpmFilesSelectorElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLGxIdeBpmImportFilesElementEventMap>(type: K, listener: (this: HTMLGxIdeBpmImportFilesElement, ev: GxIdeBpmImportFilesCustomEvent<HTMLGxIdeBpmImportFilesElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
         removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
         removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
         removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
     }
-    var HTMLGxIdeBpmFilesSelectorElement: {
-        prototype: HTMLGxIdeBpmFilesSelectorElement;
-        new (): HTMLGxIdeBpmFilesSelectorElement;
+    var HTMLGxIdeBpmImportFilesElement: {
+        prototype: HTMLGxIdeBpmImportFilesElement;
+        new (): HTMLGxIdeBpmImportFilesElement;
     };
     interface HTMLGxIdeBpmImportGxpmElementEventMap {
         "componentDidRenderFirstTime": string;
@@ -2634,7 +2636,7 @@ declare global {
         "gx-ide-ai-message": HTMLGxIdeAiMessageElement;
         "gx-ide-bpm-app-declaration": HTMLGxIdeBpmAppDeclarationElement;
         "gx-ide-bpm-assign-roles": HTMLGxIdeBpmAssignRolesElement;
-        "gx-ide-bpm-files-selector": HTMLGxIdeBpmFilesSelectorElement;
+        "gx-ide-bpm-import-files": HTMLGxIdeBpmImportFilesElement;
         "gx-ide-bpm-import-gxpm": HTMLGxIdeBpmImportGxpmElement;
         "gx-ide-bpm-timer-duration": HTMLGxIdeBpmTimerDurationElement;
         "gx-ide-card": HTMLGxIdeCardElement;
@@ -2800,15 +2802,19 @@ declare namespace LocalJSX {
          */
         "roles"?: string[];
     }
-    interface GxIdeBpmFilesSelector {
-        /**
-          * Callback invoked when user press 'Add files' button. Returns a list with selected files.
-         */
-        "addCallback"?: (files: File[]) => Promise<void>;
+    interface GxIdeBpmImportFiles {
         /**
           * Allowed extensions when 'Add files' button is pressed
          */
         "allowedExtensions"?: string[];
+        /**
+          * Callback invoked when user press 'Cancel' button.
+         */
+        "cancelCallback"?: () => Promise<void>;
+        /**
+          * Callback invoked when user press 'OK' button
+         */
+        "confirmCallback"?: (data: ImportData) => Promise<boolean>;
         /**
           * If true it displays the component title on the header
          */
@@ -2816,15 +2822,11 @@ declare namespace LocalJSX {
         /**
           * @description Gets fired when the component has rendered for the first time.
          */
-        "onComponentDidRenderFirstTime"?: (event: GxIdeBpmFilesSelectorCustomEvent<string>) => void;
+        "onComponentDidRenderFirstTime"?: (event: GxIdeBpmImportFilesCustomEvent<string>) => void;
         /**
           * @description Gets fired when something changes on items section.
          */
-        "onSelectionChanged"?: (event: GxIdeBpmFilesSelectorCustomEvent<void>) => void;
-        /**
-          * Callback invoked when remove button is pressed.
-         */
-        "removeCallback"?: (files: File[] | string[]) => Promise<void>;
+        "onSelectionChanged"?: (event: GxIdeBpmImportFilesCustomEvent<void>) => void;
     }
     interface GxIdeBpmImportGxpm {
         /**
@@ -4498,7 +4500,7 @@ declare namespace LocalJSX {
         "gx-ide-ai-message": GxIdeAiMessage;
         "gx-ide-bpm-app-declaration": GxIdeBpmAppDeclaration;
         "gx-ide-bpm-assign-roles": GxIdeBpmAssignRoles;
-        "gx-ide-bpm-files-selector": GxIdeBpmFilesSelector;
+        "gx-ide-bpm-import-files": GxIdeBpmImportFiles;
         "gx-ide-bpm-import-gxpm": GxIdeBpmImportGxpm;
         "gx-ide-bpm-timer-duration": GxIdeBpmTimerDuration;
         "gx-ide-card": GxIdeCard;
@@ -4551,7 +4553,7 @@ declare module "@stencil/core" {
             "gx-ide-ai-message": LocalJSX.GxIdeAiMessage & JSXBase.HTMLAttributes<HTMLGxIdeAiMessageElement>;
             "gx-ide-bpm-app-declaration": LocalJSX.GxIdeBpmAppDeclaration & JSXBase.HTMLAttributes<HTMLGxIdeBpmAppDeclarationElement>;
             "gx-ide-bpm-assign-roles": LocalJSX.GxIdeBpmAssignRoles & JSXBase.HTMLAttributes<HTMLGxIdeBpmAssignRolesElement>;
-            "gx-ide-bpm-files-selector": LocalJSX.GxIdeBpmFilesSelector & JSXBase.HTMLAttributes<HTMLGxIdeBpmFilesSelectorElement>;
+            "gx-ide-bpm-import-files": LocalJSX.GxIdeBpmImportFiles & JSXBase.HTMLAttributes<HTMLGxIdeBpmImportFilesElement>;
             "gx-ide-bpm-import-gxpm": LocalJSX.GxIdeBpmImportGxpm & JSXBase.HTMLAttributes<HTMLGxIdeBpmImportGxpmElement>;
             "gx-ide-bpm-timer-duration": LocalJSX.GxIdeBpmTimerDuration & JSXBase.HTMLAttributes<HTMLGxIdeBpmTimerDurationElement>;
             "gx-ide-card": LocalJSX.GxIdeCard & JSXBase.HTMLAttributes<HTMLGxIdeCardElement>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genexus/genexus-ide-ui",
   "license": "Apache-2.0",
-  "version": "0.0.139",
+  "version": "0.0.140",
   "description": "GeneXus IDE UI components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",

package/dist/cjs/gx-ide-bpm-files-selector.cjs.entry.js

@@ -1,101 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-5ab4492a.js');
-const config = require('./config-8246d533.js');
-const locale = require('./locale-bf43b87c.js');
-const renderListItem = require('./render-list-item-c7e24eb8.js');
-
-const filesToListItemsData = (files) => {
-    const itemsData = [];
-    files.forEach(file => {
-        const itemId = typeof file === "string" ? file : file.name;
-        const itemValue = typeof file === "string" ? file : file.name;
-        const itemIcon = undefined;
-        const itemChecked = false;
-        itemsData.push({
-            itemId: itemId,
-            itemValue: itemValue,
-            itemIcon: itemIcon,
-            itemChecked: itemChecked
-        });
-    });
-    return itemsData;
-};
-
-const filesSelectorCss = ":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-container{display:flex;height:100%;width:100%;box-sizing:border-box}p{margin:0;font-size:var(--mer-font__size--xxs)}.control-wrapper{display:flex;gap:var(--mer-spacing--xs);align-items:center}.control-wrapper--vertical{flex-direction:column;align-items:start}.controls-wrapper{display:flex;gap:var(--mer-spacing--xs)}.controls-wrapper--vertical{flex-direction:column;align-items:start}.input-text{box-sizing:border-box;background-color:transparent;border:var(--mer-border__width--sm) solid var(--mer-border-color__dim);border-radius:var(--mer-border__width--lg);height:26px;color:var(--mer-text__bright);font-size:var(--mer-font__size--xxs)}.input-text--full-width{align-self:stretch}:host{display:block}.hidden-input{display:none}";
-
-const GxIdeTemplate = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.componentDidRenderFirstTime = index.createEvent(this, "componentDidRenderFirstTime", 7);
-        this.selectionChanged = index.createEvent(this, "selectionChanged", 7);
-        this.renderedFirstTime = false;
-        // 7.LISTENERS //
-        // 8.PUBLIC METHODS API //
-        // 9.LOCAL METHODS //
-        this.fileSelectionChangedHandler = (selectedItem) => {
-            this.selectionChanged.emit();
-            const selectedFiles = Array.isArray(selectedItem.detail)
-                ? selectedItem.detail
-                : [selectedItem.detail];
-            this.selectedFiles = selectedFiles.map(item => item.itemValue);
-        };
-        this.loadFileHandle = async () => {
-            this.fileInput.click();
-        };
-        this.handleFileInputChange = async (event) => {
-            const fileInput = event.target;
-            if (fileInput.files && fileInput.files.length > 0) {
-                const newFiles = Array.from(fileInput.files);
-                const uniqueFiles = newFiles.filter(newFile => !this.files.some(existingFile => existingFile.name === newFile.name));
-                this.files = [...this.files, ...uniqueFiles];
-            }
-            if (this.addCallback) {
-                await this.addCallback(this.files);
-            }
-            this.fileInput.value = null;
-        };
-        this.removeFiles = (filesToRemove) => {
-            const removedFiles = this.files.filter(file => filesToRemove.includes(file.name));
-            this.files = this.files.filter(file => !filesToRemove.includes(file.name));
-            if (this.removeCallback) {
-                this.removeCallback(removedFiles);
-                this.selectedFiles = [];
-                this.fileInput.value = null;
-            }
-        };
-        this.handleRemoveButtonClick = () => {
-            this.removeFiles(this.selectedFiles);
-        };
-        this.files = [];
-        this.selectedFiles = [];
-        this.displayTitle = false;
-        this.allowedExtensions = undefined;
-        this.addCallback = undefined;
-        this.removeCallback = undefined;
-    }
-    // 6.COMPONENT LIFECYCLE METHODS //
-    async componentWillLoad() {
-        this._componentLocale = await locale.Locale.getComponentStrings(this.el);
-    }
-    componentDidRender() {
-        if (!this.renderedFirstTime) {
-            this.componentDidRenderFirstTime.emit(this._componentLocale.componentName);
-            this.renderedFirstTime = true;
-        }
-    }
-    // 10.RENDER() FUNCTION //
-    render() {
-        var _a;
-        return (index.h(index.Host, { class: "gx-ide-component" }, index.h("div", { class: "gx-ide-main-wrapper" }, index.h("gx-ide-container", { containerTitle: this.displayTitle ? this._componentLocale.componentName : null, slimmerFooter: config.config.gxIdeContainer.slimmerFooter }, index.h("label", { htmlFor: "path-list" }, this._componentLocale.main.listLabel), index.h("gx-ide-list-selector", { id: "path-list", type: "multi-selection", listName: "path-list", noListBorder: true, ordered: true, onSelectionChanged: this.fileSelectionChangedHandler, class: "path-list" }, renderListItem.renderListItems(filesToListItemsData(this.files))), index.h("div", { class: "controls-wrapper" }, index.h("input", { type: "file", id: "input_file", accept: (_a = this.allowedExtensions) === null || _a === void 0 ? void 0 : _a.join(", "), ref: el => (this.fileInput = el), onChange: this.handleFileInputChange, class: "hidden-input", multiple: true }), index.h("button", { onClick: this.loadFileHandle }, this._componentLocale.main.addFilesButton), index.h("button", { onClick: this.handleRemoveButtonClick, disabled: this.selectedFiles.length === 0 }, this._componentLocale.main.removeFilesButton, " (", this.selectedFiles.length, ")"))))));
-    }
-    static get assetsDirs() { return ["gx-ide-assets/bpm-files-selector"]; }
-    get el() { return index.getElement(this); }
-};
-GxIdeTemplate.style = filesSelectorCss;
-
-exports.gx_ide_bpm_files_selector = GxIdeTemplate;
-
-//# sourceMappingURL=gx-ide-bpm-files-selector.cjs.entry.js.map

package/dist/cjs/gx-ide-bpm-files-selector.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"gx-ide-bpm-files-selector.entry.cjs.js","mappings":"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","names":["Locale","h","Host","config","renderListItems"],"sources":["src/components/bpm/files-selector/helpers.ts","src/components/bpm/files-selector/files-selector.scss?tag=gx-ide-bpm-files-selector&encapsulation=shadow","src/components/bpm/files-selector/files-selector.tsx"],"sourcesContent":["import { ItemData } from \"../../_helpers/list-selector/list-selector-item/list-selector-item\";\n\nexport const filesToListItemsData = (files: string[] | File[]): ItemData[] => {\n  const itemsData: ItemData[] = [];\n  files.forEach(file => {\n    const itemId = typeof file === \"string\" ? file : file.name;\n    const itemValue = typeof file === \"string\" ? file : file.name;\n    const itemIcon: string = undefined;\n    const itemChecked: boolean = false;\n    itemsData.push({\n      itemId: itemId,\n      itemValue: itemValue,\n      itemIcon: itemIcon,\n      itemChecked: itemChecked\n    });\n  });\n  return itemsData;\n};\n","@import \"../../../global/gx-ide-common.scss\";\n@import \"../../../global/gx-ide-mixins.scss\";\n@import \"../../../global/temporary-tokens-chameleon.scss\";\n\n:host {\n  display: block;\n}\n.hidden-input {\n  display: none;\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 */\nimport { CheckedItemsInfo } from \"../../_helpers/list-selector/list-selector\";\n/* CUSTOM IMPORTS */\nimport { config } from \"../../../common/config\";\nimport { Locale } from \"../../../common/locale\";\nimport { renderListItems } from \"../../../common/render-list-item\";\nimport { filesToListItemsData } from \"./helpers\";\n\n@Component({\n  tag: \"gx-ide-bpm-files-selector\",\n  styleUrl: \"files-selector.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/bpm-files-selector\"]\n})\nexport class GxIdeTemplate {\n  // 1.OWN PROPERTIES //\n\n  /**\n   * The component hard-coded strings translations.\n   */\n  private _componentLocale: any;\n\n  private renderedFirstTime = false;\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeBpmFilesSelectorElement;\n\n  private fileInput: HTMLInputElement;\n\n  // 3.STATE() VARIABLES //\n  /**\n   * Contains the list of files\n   */\n  @State() files: File[] = [];\n\n  /**\n   * Contains the list of selected files\n   */\n  @State() selectedFiles: string[] = [];\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   * Allowed extensions when 'Add files' button is pressed\n   */\n  @Prop() readonly allowedExtensions: string[];\n\n  /**\n   * Callback invoked when user press 'Add files' button. Returns a list with selected files.\n   */\n  @Prop() readonly addCallback: (files: File[]) => Promise<void>;\n\n  /**\n   * Callback invoked when remove button is pressed.\n   */\n  @Prop() readonly removeCallback: (files: File[] | string[]) => 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  /**\n   * @description Gets fired when something changes on items section.\n   */\n  @Event() selectionChanged: EventEmitter<void>;\n\n  // 6.COMPONENT LIFECYCLE METHODS //\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  componentDidRender() {\n    if (!this.renderedFirstTime) {\n      this.componentDidRenderFirstTime.emit(\n        this._componentLocale.componentName\n      );\n      this.renderedFirstTime = true;\n    }\n  }\n\n  // 7.LISTENERS //\n\n  // 8.PUBLIC METHODS API //\n\n  // 9.LOCAL METHODS //\n\n  private fileSelectionChangedHandler = (\n    selectedItem: CustomEvent<CheckedItemsInfo>\n  ) => {\n    this.selectionChanged.emit();\n\n    const selectedFiles = Array.isArray(selectedItem.detail)\n      ? selectedItem.detail\n      : [selectedItem.detail];\n\n    this.selectedFiles = selectedFiles.map(item => item.itemValue);\n  };\n\n  private loadFileHandle = async () => {\n    this.fileInput.click();\n  };\n\n  private handleFileInputChange = async (event: Event) => {\n    const fileInput = event.target as HTMLInputElement;\n\n    if (fileInput.files && fileInput.files.length > 0) {\n      const newFiles: File[] = Array.from(fileInput.files);\n      const uniqueFiles = newFiles.filter(\n        newFile =>\n          !this.files.some(existingFile => existingFile.name === newFile.name)\n      );\n      this.files = [...this.files, ...uniqueFiles];\n    }\n    if (this.addCallback) {\n      await this.addCallback(this.files);\n    }\n\n    this.fileInput.value = null;\n  };\n\n  private removeFiles = (filesToRemove: string[]) => {\n    const removedFiles = this.files.filter(file =>\n      filesToRemove.includes(file.name)\n    );\n\n    this.files = this.files.filter(file => !filesToRemove.includes(file.name));\n\n    if (this.removeCallback) {\n      this.removeCallback(removedFiles);\n      this.selectedFiles = [];\n      this.fileInput.value = null;\n    }\n  };\n\n  private handleRemoveButtonClick = () => {\n    this.removeFiles(this.selectedFiles);\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            {/* path list*/}\n            <label htmlFor=\"path-list\">\n              {this._componentLocale.main.listLabel}\n            </label>\n            <gx-ide-list-selector\n              id=\"path-list\"\n              type=\"multi-selection\"\n              listName=\"path-list\"\n              noListBorder\n              ordered\n              onSelectionChanged={this.fileSelectionChangedHandler}\n              class=\"path-list\"\n            >\n              {renderListItems(filesToListItemsData(this.files))}\n            </gx-ide-list-selector>\n\n            <div class=\"controls-wrapper\">\n              <input\n                type=\"file\"\n                id=\"input_file\"\n                accept={this.allowedExtensions?.join(\", \")}\n                ref={el => (this.fileInput = el as HTMLInputElement)}\n                onChange={this.handleFileInputChange}\n                class=\"hidden-input\"\n                multiple\n              />\n              <button onClick={this.loadFileHandle}>\n                {this._componentLocale.main.addFilesButton}\n              </button>\n              <button\n                onClick={this.handleRemoveButtonClick}\n                disabled={this.selectedFiles.length === 0}\n              >\n                {this._componentLocale.main.removeFilesButton} (\n                {this.selectedFiles.length})\n              </button>\n            </div>\n          </gx-ide-container>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/collection/components/bpm/files-selector/files-selector.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"files-selector.js","sourceRoot":"","sources":["../../../../src/components/bpm/files-selector/files-selector.tsx"],"names":[],"mappings":"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","sourcesContent":["/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  State\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { CheckedItemsInfo } from \"../../_helpers/list-selector/list-selector\";\n/* CUSTOM IMPORTS */\nimport { config } from \"../../../common/config\";\nimport { Locale } from \"../../../common/locale\";\nimport { renderListItems } from \"../../../common/render-list-item\";\nimport { filesToListItemsData } from \"./helpers\";\n\n@Component({\n  tag: \"gx-ide-bpm-files-selector\",\n  styleUrl: \"files-selector.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/bpm-files-selector\"]\n})\nexport class GxIdeTemplate {\n  // 1.OWN PROPERTIES //\n\n  /**\n   * The component hard-coded strings translations.\n   */\n  private _componentLocale: any;\n\n  private renderedFirstTime = false;\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeBpmFilesSelectorElement;\n\n  private fileInput: HTMLInputElement;\n\n  // 3.STATE() VARIABLES //\n  /**\n   * Contains the list of files\n   */\n  @State() files: File[] = [];\n\n  /**\n   * Contains the list of selected files\n   */\n  @State() selectedFiles: string[] = [];\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   * Allowed extensions when 'Add files' button is pressed\n   */\n  @Prop() readonly allowedExtensions: string[];\n\n  /**\n   * Callback invoked when user press 'Add files' button. Returns a list with selected files.\n   */\n  @Prop() readonly addCallback: (files: File[]) => Promise<void>;\n\n  /**\n   * Callback invoked when remove button is pressed.\n   */\n  @Prop() readonly removeCallback: (files: File[] | string[]) => 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  /**\n   * @description Gets fired when something changes on items section.\n   */\n  @Event() selectionChanged: EventEmitter<void>;\n\n  // 6.COMPONENT LIFECYCLE METHODS //\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  componentDidRender() {\n    if (!this.renderedFirstTime) {\n      this.componentDidRenderFirstTime.emit(\n        this._componentLocale.componentName\n      );\n      this.renderedFirstTime = true;\n    }\n  }\n\n  // 7.LISTENERS //\n\n  // 8.PUBLIC METHODS API //\n\n  // 9.LOCAL METHODS //\n\n  private fileSelectionChangedHandler = (\n    selectedItem: CustomEvent<CheckedItemsInfo>\n  ) => {\n    this.selectionChanged.emit();\n\n    const selectedFiles = Array.isArray(selectedItem.detail)\n      ? selectedItem.detail\n      : [selectedItem.detail];\n\n    this.selectedFiles = selectedFiles.map(item => item.itemValue);\n  };\n\n  private loadFileHandle = async () => {\n    this.fileInput.click();\n  };\n\n  private handleFileInputChange = async (event: Event) => {\n    const fileInput = event.target as HTMLInputElement;\n\n    if (fileInput.files && fileInput.files.length > 0) {\n      const newFiles: File[] = Array.from(fileInput.files);\n      const uniqueFiles = newFiles.filter(\n        newFile =>\n          !this.files.some(existingFile => existingFile.name === newFile.name)\n      );\n      this.files = [...this.files, ...uniqueFiles];\n    }\n    if (this.addCallback) {\n      await this.addCallback(this.files);\n    }\n\n    this.fileInput.value = null;\n  };\n\n  private removeFiles = (filesToRemove: string[]) => {\n    const removedFiles = this.files.filter(file =>\n      filesToRemove.includes(file.name)\n    );\n\n    this.files = this.files.filter(file => !filesToRemove.includes(file.name));\n\n    if (this.removeCallback) {\n      this.removeCallback(removedFiles);\n      this.selectedFiles = [];\n      this.fileInput.value = null;\n    }\n  };\n\n  private handleRemoveButtonClick = () => {\n    this.removeFiles(this.selectedFiles);\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            {/* path list*/}\n            <label htmlFor=\"path-list\">\n              {this._componentLocale.main.listLabel}\n            </label>\n            <gx-ide-list-selector\n              id=\"path-list\"\n              type=\"multi-selection\"\n              listName=\"path-list\"\n              noListBorder\n              ordered\n              onSelectionChanged={this.fileSelectionChangedHandler}\n              class=\"path-list\"\n            >\n              {renderListItems(filesToListItemsData(this.files))}\n            </gx-ide-list-selector>\n\n            <div class=\"controls-wrapper\">\n              <input\n                type=\"file\"\n                id=\"input_file\"\n                accept={this.allowedExtensions?.join(\", \")}\n                ref={el => (this.fileInput = el as HTMLInputElement)}\n                onChange={this.handleFileInputChange}\n                class=\"hidden-input\"\n                multiple\n              />\n              <button onClick={this.loadFileHandle}>\n                {this._componentLocale.main.addFilesButton}\n              </button>\n              <button\n                onClick={this.handleRemoveButtonClick}\n                disabled={this.selectedFiles.length === 0}\n              >\n                {this._componentLocale.main.removeFilesButton} (\n                {this.selectedFiles.length})\n              </button>\n            </div>\n          </gx-ide-container>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/bpm/files-selector/gx-ide-assets/bpm-files-selector/langs/bpm-files-selector.lang.en.json

@@ -1,14 +0,0 @@
-{
-  "componentName": "BPM Files Selector",
-  "header": {},
-  "main": {
-    "listLabel": "Path List",
-    "addFilesButton": "Add Files",
-    "removeFilesButton": "Remove"
-  },
-  "footer": {},
-  "loader": {
-    "title": "Loading...",
-    "cancelLabel": "Cancel"
-  }
-}

package/dist/collection/components/bpm/files-selector/helpers.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../../src/components/bpm/files-selector/helpers.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,KAAwB,EAAc,EAAE;IAC3E,MAAM,SAAS,GAAe,EAAE,CAAC;IACjC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;QACnB,MAAM,MAAM,GAAG,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;QAC3D,MAAM,SAAS,GAAG,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;QAC9D,MAAM,QAAQ,GAAW,SAAS,CAAC;QACnC,MAAM,WAAW,GAAY,KAAK,CAAC;QACnC,SAAS,CAAC,IAAI,CAAC;YACb,MAAM,EAAE,MAAM;YACd,SAAS,EAAE,SAAS;YACpB,QAAQ,EAAE,QAAQ;YAClB,WAAW,EAAE,WAAW;SACzB,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IACH,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC","sourcesContent":["import { ItemData } from \"../../_helpers/list-selector/list-selector-item/list-selector-item\";\n\nexport const filesToListItemsData = (files: string[] | File[]): ItemData[] => {\n  const itemsData: ItemData[] = [];\n  files.forEach(file => {\n    const itemId = typeof file === \"string\" ? file : file.name;\n    const itemValue = typeof file === \"string\" ? file : file.name;\n    const itemIcon: string = undefined;\n    const itemChecked: boolean = false;\n    itemsData.push({\n      itemId: itemId,\n      itemValue: itemValue,\n      itemIcon: itemIcon,\n      itemChecked: itemChecked\n    });\n  });\n  return itemsData;\n};\n"]}