npm - @genexus/genexus-ide-ui - Versions diffs - 1.1.5 → 1.1.6 - Mend

@genexus/genexus-ide-ui 1.1.5 → 1.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (643) hide show

package/dist/genexus-ide-ui/p-036d005d.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["updateCss","CSS_BUNDLES","GxIdeTeamDevUpdate","this","loadDataCalledFirstTime","renderedFirstTime","onRowContextMenuHandler","grid","async","ev","objectsContextMenuCallback","preventDefault","stopPropagation","selection","chGridPendingForUpdateEl","getSelectedRows","chGridIgnoredObjectsEl","chGridResultsEl","clientX","detail","clientY","markAllPendingToUpdateRows","markAllRows","gridOnSelectionChangedCallbackHandler","selectCallback","rowsId","genexusServerUrlHandler","_a","updateFrom","serverUrl","window","open","renderOptions","h","class","part","containerTitle","_componentLocale","options","titleType","contentBorderEnd","noContentPadding","type","listName","readonly","noListBorder","icon","itemId","itemValue","undefined","onClick","knowledgeBase","kbName","version","versionName","lastFullUpdate","formatDate","scope","labelPosition","center","noMargin","objects","bold","objectScopeText","value","scopeData","toLocaleLowerCase","objectsScope","changeBtn","revision","revisionScopeText","latest","revisionScope","label","kbProperties","renderFilter","centerLabel","filter","pattern","ref","el","filterPatternEl","onInput","loadData","disabled","types","filterTypeEl","onValueChanged","id","renderComboItems","renderData","displayBorderTop","slot","displayBorder","tabs","pendingForUpdate","tab","key","isSelected","ignoredObjects","results","gxgTabButtonResultsEl","noPadding","renderPendingForUpdate","renderIgnoredObjects","renderResults","onRowContextMenu","onSelectionChanged","settingable","sortable","richRowSelector","richRowSelectorMode","size","config","tabularGrid","colSize","maxContent","columnName","tableHead","name","description","commonDouble","modifiedOn","status","action","updateData","map","obj","rowid","src","typeIcon","renderIconState","state","notes","updateResultData","renderIconResult","result","messages","msg","msgType","text","color","filters","showFilter","isLoading","loadCallback","update","updateCallback","pendingForUpdateMarked","getMarkedRows","then","tabButtonClick","objectsScopeCallback","objectData","revisionScopeCallback","revisionData","pendingForUpdatesRowMarkingChangedHandler","e","removeEventListener","addedRowsIds","addedRowsId","removedRowsId","pendingItemCheckedResult","pendingItemsCheckedCallback","itemsChecked","itemsUnchecked","revertPendingCommitsCheckboxes","togglePendingCommitsCheckboxes","addEventListener","itemsToToggle","itemsToCheck","itemsToUncheck","rowId","markRow","componentWillLoad","Locale","getComponentStrings","componentDidLoadEvent","emit","componentDidLoad","focus","componentDidRender","componentDidRenderFirstTime","componentName","reload","render","Host","model","slimmerFooter","gxIdeContainer","displayTitle","footer","btnUpdate"],"sources":["src/components/team-dev/update/update.scss?tag=gx-ide-team-dev-update&encapsulation=shadow","src/components/team-dev/update/update.tsx"],"sourcesContent":["@import \"../../../global/gx-ide-common.scss\";\n@import \"../../../global/gx-ide-mixins.scss\";\n@import \"../../../../node_modules/@genexus/mercury/dist/assets/scss/helpers.scss\";\n\n:host {\n display: block;\n}\n\n/*--- Options Wrapper ---*/\n.options-wrapper {\n display: grid;\n grid-template-columns: 2fr 1fr;\n grid-column-gap: 0;\n grid-row-gap: 0;\n border-bottom: 1px solid var(--gx-ide-container-border-color);\n\n .genexus-server {\n cursor: pointer;\n &:hover {\n background-color: var(--ds-item-background-color--hover);\n }\n }\n .scope {\n font-family: inherit;\n display: flex;\n flex-direction: column;\n gap: var(--mer-spacing--2xs);\n .row {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--mer-spacing--xs);\n .value {\n font-style: italic;\n }\n }\n }\n}\n\n/*--- Filter ---*/\n.filter-row {\n padding: 0 var(--gx-ide-container__padding) 0 var(--gx-ide-container__padding);\n display: flex;\n flex-direction: row;\n gap: var(--gx-ide-grid-row-gap);\n .combo {\n flex: 1;\n }\n}\n\n/* Data Grid*/\n.data-grid {\n grid-template-columns: repeat(3, 1fr);\n // max-height: 300px;\n // overflow-y: auto;\n > :nth-child(1) {\n grid-area: 1 / 1 / 2 / 2;\n }\n > :nth-child(2) {\n grid-area: 1 / 2 / 2 / 4;\n }\n}\n.data-panel-grid {\n grid-template-columns: repeat(2, 1fr);\n}\n.data-preview {\n img {\n max-width: 100%;\n }\n}\n.data-max-height {\n max-height: 300px;\n overflow-y: auto;\n}\n\n/* Footer Actions */\n.actions {\n justify-content: flex-end;\n}\n\n.no-border {\n border: 0;\n}\n\n.bold {\n font-weight: bold;\n}\n\n/*--- Results ---*/\nch-grid-rowset-empty {\n padding: var(--mer-spacing--2xs) var(--mer-spacing--xs);\n}\n\ngxg-tab::part(container) {\n line-height: unset;\n}\n.tabular-grid {\n block-size: 100%;\n}\n\ngx-ide-container::part(content) {\n overflow: hidden;\n}\n\n// apply ellipsis on description column\n@include tabular-grid-cell-layout(\n $tabular-grid-selector: \".tabular-grid-pending-update\",\n $tabular-grid-cell-node-type: \"text\",\n $tabular-grid-cell-apply-ellipsis: true,\n $tabular-grid-affected-columns-nth-list: (\n 6\n )\n);\n@include tabular-grid-cell-layout(\n $tabular-grid-selector: \".tabular-grid-results\",\n $tabular-grid-cell-node-type: \"text\",\n $tabular-grid-cell-apply-ellipsis: true,\n $tabular-grid-affected-columns-nth-list: (\n 6\n )\n);\n","/* STENCIL IMPORTS */\nimport {\n Component,\n Host,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n State,\n Method\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { Color as GxgIconColor } from \"@genexus/gemini/dist/types/components/icon/icon\";\nimport {\n TabularGridMarkingChangedEvent,\n TabularGridRowContextMenuEvent,\n TabularGridSelectionChangedEvent\n} from \"@genexus/chameleon-controls-library\";\nimport { MercuryBundles } from \"@genexus/mercury\";\n/* CUSTOM IMPORTS */\nimport { Locale } from \"../../../common/locale\";\nimport { config } from \"../../../common/config\";\n\nimport {\n ObjectState,\n ObjectType,\n ContextMenuInfo,\n ItemsCheckedState,\n ItemsCheckedResult,\n ResultState\n} from \"../../../common/types\";\nimport { renderComboItems } from \"../../../common/render-combo-items\";\nimport { formatDate } from \"../../../common/helpers\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n \"resets/box-sizing\",\n // \"utils/form\",\n // \"utils/layout\",\n // \"utils/typography\",\n // \"components/button\",\n // \"components/checkbox\",\n // \"components/edit\",\n \"components/tabular-grid\"\n];\n\n@Component({\n tag: \"gx-ide-team-dev-update\",\n styleUrl: \"update.scss\",\n shadow: true,\n assetsDirs: [\"gx-ide-assets/team-dev-update\"]\n})\nexport class GxIdeTeamDevUpdate {\n // 1.OWN PROPERTIES //\n\n /**\n * The component hard-coded strings translations.\n */\n private _componentLocale: any;\n private loadDataCalledFirstTime = false; // pending for update grid checkboxes, should be checked, after loadData has loaded objects for the first time.\n private renderedFirstTime = false;\n\n // 2. REFERENCE TO ELEMENTS //\n\n @Element() el: HTMLGxIdeTeamDevUpdateElement;\n\n /* References needed to collect data */\n // private optionKbPropertiesEl!: HTMLGxgFormCheckboxElement;\n private filterPatternEl!: HTMLGxgFormTextElement;\n private filterTypeEl!: HTMLGxgComboBoxElement;\n private chGridPendingForUpdateEl!: HTMLChGridElement;\n private chGridIgnoredObjectsEl!: HTMLChGridElement;\n private chGridResultsEl!: HTMLChGridElement;\n private gxgTabButtonResultsEl!: HTMLGxgTabButtonElement;\n\n // 3.STATE() VARIABLES //\n\n /**\n * If the design data is loading or not, for disabled actions\n */\n @State() isLoading = false;\n\n /**\n * For show or hide advanced filters\n */\n @State() objectScopeText = \"all\";\n\n /**\n * The tab that is currently open\n */\n @State() openTab: \"pending\" | \"ignored\" | \"results\" = \"pending\";\n\n /**\n * For show or hide advanced filters\n */\n @State() revisionScopeText: string = undefined;\n\n /**\n * For show or hide advanced filters\n */\n @State() showFilter = false;\n\n /**\n * The data loaded for populate the grids\n */\n @State() updateData: UpdateData = {\n pendingForUpdate: [],\n ignoredObjects: []\n };\n\n /**\n * The data receive after user update\n */\n @State() updateResultData: UpdateResultData[] = [];\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 * This is a function provided by the developer that init the process of import a design.\n */\n @Prop() readonly confirmCallback!: ConfirmCallback;\n\n /**\n * This is a function provided by the developer that return the information of an Image System type of data.\n */\n @Prop() readonly gridContextMenuCallback!: GridContextMenuCallback;\n\n /**\n * This is a function provided by the developer that return the list of types of data loaded from file or url.\n */\n @Prop() readonly loadCallback!: LoadCallback;\n\n /**\n * This is a function provided by the developer to call when the user makes a partial selection from button Change of Scope group.\n */\n @Prop() readonly objectsScopeCallback!: () => Promise<\"all\" | \"partial\">;\n\n /**\n * This is a function provided by the developer to call when the user clicked in server url of Update From group.\n */\n @Prop() readonly openServerCallback!: () => Promise<void>;\n\n /**\n * This is a function provided by the developer that return the information of a Font type of data.\n */\n @Prop() readonly pendingItemsCheckedCallback!: PendingItemsCheckedCallback;\n\n /**\n * This is a function provided by the developer to call when the user wants to select the revision to work on.\n */\n @Prop() readonly revisionScopeCallback!: () => Promise<string | undefined>;\n\n /**\n * Callback that should be invoked when the user activates the context menu on any of the grids. It receives the internal IDs of the selected elements and in which grid the event occurred. It should prevent the default browser context menu from appearing\n */\n @Prop() readonly objectsContextMenuCallback!: ObjectsContextMenuCallback;\n\n /**\n * Callback that should be invoked when the user selects rows from the grids\n */\n @Prop() readonly selectCallback: UpdateSelectCallback;\n\n /**\n * Possibly values for the filter type\n */\n @Prop() readonly types: ObjectType[];\n\n /**\n * This is a function provided by the developer that return the information of a Design System type of data.\n */\n @Prop() readonly updateCallback!: UpdateCallback;\n\n /**\n * Information to show in the container of group 'Update From'\n */\n @Prop() readonly updateFrom: UpdateFromData;\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() componentDidLoadEvent: EventEmitter<boolean>;\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.COMPONENT LIFECYCLE EVENTS //\n\n async componentWillLoad() {\n this._componentLocale = await Locale.getComponentStrings(this.el);\n this.componentDidLoadEvent.emit(true);\n }\n\n async componentDidLoad() {\n await this.loadData();\n this.filterPatternEl.focus();\n }\n\n async componentDidRender() {\n if (!this.renderedFirstTime) {\n this.componentDidRenderFirstTime.emit(\n this._componentLocale.componentName\n );\n this.renderedFirstTime = true;\n }\n\n if (this.loadDataCalledFirstTime) {\n // call this method only once\n await this.markAllPendingToUpdateRows();\n // attach \"rowMarkingChanged\" after rows have been checked for the first time.\n this.chGridPendingForUpdateEl.addEventListener(\n \"rowMarkingChanged\",\n this.pendingForUpdatesRowMarkingChangedHandler\n );\n this.loadDataCalledFirstTime = false;\n }\n }\n // 7.LISTENERS //\n\n // 8.PUBLIC METHODS API //\n\n /**\n * The method used by the host to instruct the component to force a data reload in the grids.\n */\n @Method()\n async reload() {\n this.loadData();\n }\n\n // 9.LOCAL METHODS //\n\n private onRowContextMenuHandler =\n (grid: UpdateSourceType) =>\n async (ev: CustomEvent<TabularGridRowContextMenuEvent>) => {\n if (this.objectsContextMenuCallback) {\n ev.preventDefault();\n ev.stopPropagation();\n let selection: string[] = [];\n if (grid === \"pending\") {\n selection = await this.chGridPendingForUpdateEl.getSelectedRows();\n } else if (grid === \"ignored\") {\n selection = await this.chGridIgnoredObjectsEl.getSelectedRows();\n } else if (grid === \"results\") {\n selection = await this.chGridResultsEl.getSelectedRows();\n }\n await this.objectsContextMenuCallback(grid, {\n selection: selection,\n clientX: ev.detail.clientX,\n clientY: ev.detail.clientY\n });\n }\n };\n\n private markAllPendingToUpdateRows = () => {\n this.chGridPendingForUpdateEl.markAllRows();\n };\n\n private gridOnSelectionChangedCallbackHandler =\n (grid: UpdateSourceType) =>\n async (ev: CustomEvent<TabularGridSelectionChangedEvent>) => {\n if (this.selectCallback) {\n await this.selectCallback(grid, ev.detail.rowsId);\n }\n };\n\n private genexusServerUrlHandler = () => {\n if (this.updateFrom?.serverUrl) {\n window.open(this.updateFrom.serverUrl);\n }\n };\n\n private renderOptions = (): Element => {\n return (\n <div class=\"options-wrapper\">\n {/* genexus server*/}\n <gx-ide-container\n part=\"options-update-from\"\n containerTitle={this._componentLocale.options.updateFrom}\n titleType=\"secondary\"\n contentBorderEnd\n noContentPadding\n >\n <gx-ide-list-selector\n type=\"single-selection\"\n listName=\"commit-recent-messages\"\n readonly\n noListBorder\n >\n {/* genexus server*/}\n <gx-ide-list-selector-item\n icon=\"window-tools/genexus-cloud\"\n itemId=\"genexus-server\"\n itemValue={undefined}\n class=\"genexus-server\"\n onClick={this.genexusServerUrlHandler}\n >\n {`${this._componentLocale.options.updateFrom}:`}\n <gxg-text type=\"text-link\">\n {this.updateFrom ? this.updateFrom.serverUrl : \"\"}\n </gxg-text>\n </gx-ide-list-selector-item>\n\n {/* knowledge base*/}\n <gx-ide-list-selector-item\n icon=\"general/knowledge-base\"\n itemId=\"knowledge-base\"\n itemValue={`${this._componentLocale.options.knowledgeBase}: ${\n this.updateFrom ? this.updateFrom.kbName : \"\"\n }`}\n ></gx-ide-list-selector-item>\n\n {/* version */}\n <gx-ide-list-selector-item\n icon=\"general/version\"\n itemId=\"version\"\n itemValue={`${this._componentLocale.options.version}: ${\n this.updateFrom ? this.updateFrom.versionName : \"\"\n }`}\n ></gx-ide-list-selector-item>\n\n {/* last full update */}\n <gx-ide-list-selector-item\n icon=\"window-tools/last-changes-view\"\n itemId=\"last-full-update\"\n itemValue={`${\n this._componentLocale.options.lastFullUpdate\n }:${formatDate(this.updateFrom.lastFullUpdate)}`}\n ></gx-ide-list-selector-item>\n </gx-ide-list-selector>\n </gx-ide-container>\n\n {/* scope*/}\n <gx-ide-container\n part=\"options-scope\"\n containerTitle={this._componentLocale.options.scope}\n titleType=\"secondary\"\n >\n <div class=\"scope\">\n {/* Objects*/}\n <div class=\"row\">\n <gxg-label labelPosition=\"start\" center noMargin>\n {this._componentLocale.options.objects}:\n </gxg-label>\n <span\n class={{\n bold: this.objectScopeText === \"partial\",\n value: true\n }}\n >\n {\n this._componentLocale.options.scopeData.objects[\n this.objectScopeText.toLocaleLowerCase()\n ]\n }\n </span>\n <gxg-text\n type=\"text-link\"\n onClick={this.objectsScope}\n part=\"gxg-button gxg-button--scope-objects-change\"\n >\n {this._componentLocale.options.changeBtn}\n </gxg-text>\n </div>\n\n {/* Revision */}\n <div class=\"row\">\n <gxg-label labelPosition=\"start\" center noMargin>\n {this._componentLocale.options.revision}:\n </gxg-label>\n <span\n class={{\n bold: this.revisionScopeText !== undefined,\n value: true\n }}\n >\n {this.revisionScopeText === undefined\n ? this._componentLocale.options.scopeData.revision.latest\n : this.revisionScopeText}\n </span>\n <gxg-text\n type=\"text-link\"\n onClick={this.revisionScope}\n part=\"gxg-button gxg-button--scope-revision-change\"\n >\n {this._componentLocale.options.changeBtn}\n </gxg-text>\n </div>\n\n {/* Kb Properties */}\n <div class=\"row\">\n <gxg-form-checkbox\n label={this._componentLocale.options.kbProperties}\n class=\"align-center\"\n part=\"option-kb-properties\"\n ></gxg-form-checkbox>\n </div>\n </div>\n </gx-ide-container>\n </div>\n );\n };\n\n private renderFilter = (): Element => {\n return (\n <div\n class={{\n \"filter-row\": true\n }}\n >\n {/* pattern*/}\n <gxg-form-text\n label-position=\"start\"\n centerLabel\n label={this._componentLocale.filter.pattern}\n ref={(el: HTMLGxgFormTextElement) =>\n (this.filterPatternEl = el as HTMLGxgFormTextElement)\n }\n part=\"filter-pattern\"\n onInput={this.loadData}\n class=\"combo\"\n ></gxg-form-text>\n\n {/* type */}\n <gxg-combo-box\n label-position=\"start\"\n centerLabel\n disable-filter\n label={this._componentLocale.filter.type}\n disabled={!this.types}\n ref={(el: HTMLGxgComboBoxElement) =>\n (this.filterTypeEl = el as HTMLGxgComboBoxElement)\n }\n onValueChanged={this.loadData}\n part=\"filter-type\"\n value={this.types[0].id}\n class=\"combo\"\n >\n {renderComboItems(this.types)}\n </gxg-combo-box>\n\n {/* load data */}\n <gxg-button\n type=\"secondary-icon-only\"\n icon=\"gemini-tools/reset\"\n onClick={this.loadData}\n part=\"gxg-button gxg-button--reload\"\n class=\"button\"\n ></gxg-button>\n </div>\n );\n };\n\n private renderData = (): Element => {\n return (\n <gx-ide-container\n part=\"data-container\"\n noContentPadding\n class=\"gxi-overflow-auto\"\n displayBorderTop\n >\n <gxg-tabs id=\"dataTabs\" part=\"data-tabs\">\n <gxg-tab-bar slot=\"tab-bar-container\" displayBorder>\n <gxg-tab-button\n slot=\"tab-bar\"\n tab-label={this._componentLocale.tabs.pendingForUpdate}\n tab=\"pendingForUpdate\"\n key=\"pendingForUpdate\"\n isSelected={true}\n ></gxg-tab-button>\n <gxg-tab-button\n slot=\"tab-bar\"\n tab-label={this._componentLocale.tabs.ignoredObjects}\n tab=\"ignoredObjects\"\n key=\"ignoredObjects\"\n ></gxg-tab-button>\n <gxg-tab-button\n slot=\"tab-bar\"\n tab-label={this._componentLocale.tabs.results}\n tab=\"results\"\n key=\"results\"\n ref={(el: HTMLGxgTabButtonElement) =>\n (this.gxgTabButtonResultsEl = el)\n }\n ></gxg-tab-button>\n </gxg-tab-bar>\n <gxg-tab\n tab=\"pendingForUpdate\"\n key=\"pendingForUpdate\"\n noPadding\n isSelected={true}\n >\n {this.renderPendingForUpdate()}\n </gxg-tab>\n <gxg-tab tab=\"ignoredObjects\" key=\"ignoredObjects\" noPadding>\n {this.renderIgnoredObjects()}\n </gxg-tab>\n <gxg-tab tab=\"results\" key=\"results\" noPadding>\n {this.renderResults()}\n </gxg-tab>\n </gxg-tabs>\n </gx-ide-container>\n );\n };\n\n private renderPendingForUpdate = (): HTMLChTabularGridElement => {\n return (\n <ch-tabular-grid\n class=\"tabular-grid tabular-grid-pending-update\"\n row-selection-mode=\"multiple\"\n ref={(el: HTMLChTabularGridElement) =>\n (this.chGridPendingForUpdateEl = el)\n }\n part=\"ch-tabular-grid-pending-for-updates\"\n onRowContextMenu={this.onRowContextMenuHandler(\"pending\")}\n onSelectionChanged={this.gridOnSelectionChangedCallbackHandler(\n \"pending\"\n )}\n >\n <ch-tabular-grid-columnset class=\"tabular-grid-column-set\">\n <ch-tabular-grid-column\n settingable={false}\n sortable={false}\n column-type=\"rich\"\n richRowSelector\n richRowSelectorMode=\"mark\"\n size={config.tabularGrid.colSize.maxContent}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n settingable={false}\n sortable={false}\n size={config.tabularGrid.colSize.maxContent}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n settingable={false}\n sortable={false}\n size={config.tabularGrid.colSize.maxContent}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n columnName={this._componentLocale.tableHead.name}\n settingable={false}\n size={config.tabularGrid.colSize.maxContent}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n columnName={this._componentLocale.tableHead.type}\n settingable={false}\n size={config.tabularGrid.colSize.maxContent}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n columnName={this._componentLocale.tableHead.description}\n settingable={false}\n size={config.tabularGrid.colSize.commonDouble}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n columnName={this._componentLocale.tableHead.modifiedOn}\n settingable={false}\n size={config.tabularGrid.colSize.maxContent}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n columnName={this._componentLocale.tableHead.status}\n settingable={false}\n size={config.tabularGrid.colSize.maxContent}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n columnName={this._componentLocale.tableHead.action}\n settingable={false}\n size={config.tabularGrid.colSize.maxContent}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n </ch-tabular-grid-columnset>\n {this.updateData.pendingForUpdate.map((obj: ModifiedObject) => (\n <ch-tabular-grid-row rowid={obj.id} class=\"tabular-grid-row\">\n <ch-tabular-grid-cell\n cell-type=\"rich\"\n row-selector\n class=\"tabular-grid-cell\"\n ></ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n <ch-image src={obj.typeIcon} class=\"icon-md\"></ch-image>\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {this.renderIconState(obj.state)}\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {obj.name}\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {obj.type}\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {obj.description}\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {`${formatDate(obj.modifiedOn)}`}\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {obj.status}\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {obj.action}\n </ch-tabular-grid-cell>\n </ch-tabular-grid-row>\n ))}\n </ch-tabular-grid>\n );\n };\n\n private renderIgnoredObjects = (): HTMLChTabularGridElement => {\n return (\n <ch-tabular-grid\n class=\"tabular-grid\"\n row-selection-mode=\"multiple\"\n ref={(el: HTMLChTabularGridElement) =>\n (this.chGridIgnoredObjectsEl = el)\n }\n part=\"ch-grid-ignored-objects\"\n onRowContextMenu={this.onRowContextMenuHandler(\"ignored\")}\n onSelectionChanged={this.gridOnSelectionChangedCallbackHandler(\n \"ignored\"\n )}\n >\n <ch-tabular-grid-columnset class=\"tabular-grid-column-set\">\n <ch-tabular-grid-column\n settingable={false}\n sortable={false}\n size=\"min-content\"\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n columnName={this._componentLocale.tableHead.name}\n settingable={false}\n size=\"1fr\"\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n columnName={this._componentLocale.tableHead.type}\n settingable={false}\n size=\"1fr\"\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n </ch-tabular-grid-columnset>\n {this.updateData.ignoredObjects.map((obj: ModifiedObject) => (\n <ch-tabular-grid-row rowid={obj.id} class=\"tabular-grid-row\">\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n <ch-image src={obj.typeIcon} class=\"icon-md\"></ch-image>\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {obj.name}\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {obj.type}\n </ch-tabular-grid-cell>\n </ch-tabular-grid-row>\n ))}\n </ch-tabular-grid>\n );\n };\n\n private renderResults = (): HTMLChTabularGridElement => {\n return (\n <ch-tabular-grid\n class=\"tabular-grid tabular-grid-results\"\n row-selection-mode=\"multiple\"\n ref={(el: HTMLChTabularGridElement) => (this.chGridResultsEl = el)}\n part=\"ch-tabular-grid-results\"\n onRowContextMenu={this.onRowContextMenuHandler(\"results\")}\n onSelectionChanged={this.gridOnSelectionChangedCallbackHandler(\n \"results\"\n )}\n >\n <ch-tabular-grid-columnset class=\"tabular-grid-column-set\">\n <ch-tabular-grid-column\n settingable={false}\n sortable={false}\n column-type=\"tree\"\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n settingable={false}\n sortable={false}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n settingable={false}\n sortable={false}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n columnName={this._componentLocale.tableHead.name}\n settingable={false}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n columnName={this._componentLocale.tableHead.type}\n settingable={false}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n columnName={this._componentLocale.tableHead.description}\n settingable={false}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n <ch-tabular-grid-column\n columnName={this._componentLocale.tableHead.notes}\n settingable={false}\n class=\"tabular-grid-column\"\n ></ch-tabular-grid-column>\n </ch-tabular-grid-columnset>\n {this.updateResultData.map((obj: UpdateResultData) => (\n <ch-tabular-grid-row rowid={obj.id} class=\"tabular-grid-row\">\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {this.renderIconResult(obj.result)}\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n <ch-image src={obj.typeIcon} class=\"icon-md\"></ch-image>\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {this.renderIconState(obj.state)}\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {obj.name}\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {obj.type}\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {obj.description}\n </ch-tabular-grid-cell>\n <ch-tabular-grid-cell class=\"tabular-grid-cell\">\n {obj.notes}\n </ch-tabular-grid-cell>\n <ch-tabular-grid-rowset>\n {obj.messages.map(msg => {\n let msgType;\n switch (msg.type) {\n case \"info\":\n msgType = \"text-alert-info\";\n break;\n case \"success\":\n msgType = \"text-alert-success\";\n break;\n case \"warning\":\n msgType = \"text-alert-warning\";\n break;\n case \"error\":\n msgType = \"text-alert-error\";\n break;\n }\n return (\n <ch-tabular-grid-rowset-empty>\n <gxg-text type={msgType as any}>{msg.text}</gxg-text>\n </ch-tabular-grid-rowset-empty>\n );\n })}\n </ch-tabular-grid-rowset>\n </ch-tabular-grid-row>\n ))}\n </ch-tabular-grid>\n );\n };\n\n private renderIconState = (state: ObjectState): Element => {\n let type: string;\n\n switch (state) {\n case \"modified\":\n type = \"gx-server/changes-commit-pending\";\n break;\n case \"inserted\":\n type = \"gx-server/new\";\n break;\n case \"deleted\":\n type = \"gx-server/delete\";\n break;\n case \"conflicted\":\n type = \"gx-server/conflict\";\n break;\n }\n return <ch-image class=\"icon-md\" src={type}></ch-image>;\n };\n\n private renderIconResult = (result: ResultState): Element => {\n let type: string;\n let color: GxgIconColor;\n switch (result) {\n case \"info\":\n type = \"gemini-tools/notice\";\n color = \"primary-active\";\n break;\n case \"success\":\n type = \"gemini-tools/success\";\n color = \"success\";\n break;\n case \"warning\":\n type = \"gemini-tools/warning\";\n color = \"warning\";\n break;\n case \"error\":\n type = \"gemini-tools/error\";\n color = \"error\";\n break;\n }\n return <gxg-icon type={type} color={color}></gxg-icon>;\n };\n\n private loadData = async (): Promise<void> => {\n const filters: FiltersData = {\n pattern: this.showFilter ? this.filterPatternEl.value : null,\n type: this.showFilter ? this.filterTypeEl.value : null\n };\n // this.updateData = null;\n this.isLoading = true;\n this.updateData = await this.loadCallback(filters);\n this.isLoading = false;\n if (!this.loadDataCalledFirstTime) {\n /* this allows checking the pending commits checkboxes on first load*/\n this.loadDataCalledFirstTime = true;\n }\n };\n\n private update = async (): Promise<void> => {\n if (this.updateCallback) {\n const pendingForUpdateMarked =\n await this.chGridPendingForUpdateEl.getMarkedRows();\n this.updateCallback(pendingForUpdateMarked).then(\n (updateResultData: UpdateResultData[]) => {\n this.updateResultData = updateResultData;\n this.gxgTabButtonResultsEl.tabButtonClick();\n }\n );\n }\n };\n\n private objectsScope = (): void => {\n if (this.objectsScopeCallback) {\n this.objectsScopeCallback().then(objectData => {\n if (objectData) {\n this.objectScopeText = objectData;\n }\n });\n }\n };\n\n private revisionScope = (): void => {\n if (this.revisionScopeCallback) {\n this.revisionScopeCallback().then(revisionData => {\n this.revisionScopeText = revisionData;\n });\n }\n };\n\n private pendingForUpdatesRowMarkingChangedHandler = async (\n e: CustomEvent<TabularGridMarkingChangedEvent>\n ): Promise<void> => {\n // remove \"rowMarkingChanged\" until checkboxes have been added/removed on togglePendingCommitsCheckboxes, to prevent loops.\n this.chGridPendingForUpdateEl.removeEventListener(\n \"rowMarkingChanged\",\n this.pendingForUpdatesRowMarkingChangedHandler\n );\n if (this.chGridPendingForUpdateEl) {\n const addedRowsIds = e.detail.addedRowsId;\n const removedRowsId = e.detail.removedRowsId;\n const pendingItemCheckedResult = await this.pendingItemsCheckedCallback({\n itemsChecked: addedRowsIds,\n itemsUnchecked: removedRowsId\n });\n if (pendingItemCheckedResult === undefined) {\n // undo check/uncheck\n await this.revertPendingCommitsCheckboxes(addedRowsIds, removedRowsId);\n } else {\n await this.togglePendingCommitsCheckboxes(pendingItemCheckedResult);\n }\n this.chGridPendingForUpdateEl.addEventListener(\n \"rowMarkingChanged\",\n this.pendingForUpdatesRowMarkingChangedHandler\n );\n }\n this.chGridPendingForUpdateEl.addEventListener(\n \"rowMarkingChanged\",\n this.pendingForUpdatesRowMarkingChangedHandler\n );\n };\n\n private togglePendingCommitsCheckboxes = async (\n itemsToToggle: ItemsCheckedResult\n ) => {\n if (this.chGridPendingForUpdateEl) {\n const itemsToCheck: string[] = itemsToToggle.itemsToCheck;\n const itemsToUncheck: string[] = itemsToToggle.itemsToUncheck;\n // check\n for (const rowId of itemsToCheck) {\n await this.chGridPendingForUpdateEl.markRow(rowId, true);\n }\n // uncheck\n for (const rowId of itemsToUncheck) {\n await this.chGridPendingForUpdateEl.markRow(rowId, false);\n }\n }\n };\n\n private revertPendingCommitsCheckboxes = async (\n addedRowsIds: string[],\n removedRowsId: string[]\n ) => {\n if (this.chGridPendingForUpdateEl) {\n for (const rowId of addedRowsIds) {\n await this.chGridPendingForUpdateEl.markRow(rowId, false);\n }\n for (const rowId of removedRowsId) {\n await this.chGridPendingForUpdateEl.markRow(rowId, true);\n }\n }\n };\n\n // 10.RENDER() FUNCTION //\n\n render(): void {\n return (\n <Host class=\"gx-ide-component\">\n <ch-theme model={CSS_BUNDLES}></ch-theme>\n <div class=\"gx-ide-main-wrapper\">\n <gx-ide-container\n displayBorderTop\n noContentPadding\n slimmerFooter={config.gxIdeContainer.slimmerFooter}\n containerTitle={\n this.displayTitle ? this._componentLocale.componentName : null\n }\n >\n {this.renderOptions()}\n {this.renderFilter()}\n {this.renderData()}\n\n <gxg-button\n id=\"button-update\"\n type=\"primary-text-only\"\n onClick={this.update}\n part=\"gxg-button gxg-button--update\"\n disabled={this.isLoading}\n slot=\"footer-end\"\n >\n {this._componentLocale.footer.btnUpdate}\n </gxg-button>\n </gx-ide-container>\n </div>\n </Host>\n );\n }\n}\n\nexport type LoadCallback = (filters: FiltersData) => Promise<UpdateData>;\n\nexport type UpdateCallback = (\n selection: string[]\n) => Promise<UpdateResultData[]>;\n\nexport type PendingItemsCheckedCallback = (\n pendingItemsCheckedState: ItemsCheckedState\n) => Promise<ItemsCheckedResult | undefined>;\n\nexport type UpdateSelectCallback = (\n grid: UpdateSourceType,\n selectionIds: string[]\n) => Promise<void>;\n\nexport type UpdateSourceType = \"pending\" | \"ignored\" | \"results\";\n\nexport type GridContextMenuCallback = (\n selection: string[],\n grid: \"update\" | \"ignored\" | \"results\"\n) => Promise<void>;\n\nexport type ObjectsContextMenuCallback = (\n source: UpdateSourceType,\n contextMenuInfo: ContextMenuInfo\n) => Promise<void>;\n\nexport type ConfirmCallback = (data: any) => Promise<boolean>;\n\nexport interface UpdateFromData {\n serverUrl: string;\n kbName: string;\n versionName: string;\n lastFullUpdate: Date;\n}\nexport interface FiltersData {\n pattern: string;\n type: string;\n}\nexport interface UpdateData {\n pendingForUpdate: ModifiedObject[];\n ignoredObjects: ModifiedObject[];\n}\nexport interface ModifiedObject {\n id: string;\n typeIcon: string;\n state?: ObjectState;\n name: string;\n type: string;\n description?: string;\n modifiedOn?: Date;\n status?: string;\n action?: string;\n}\nexport interface UpdateResultData {\n id: string;\n result: ResultState;\n typeIcon: string;\n state: ObjectState;\n name: string;\n type: string;\n description: string;\n notes: string;\n messages: MessageData[];\n}\n\nexport interface MessageData {\n type: \"info\" | \"success\" | \"warning\" | \"error\";\n text: string;\n}\n"],"mappings":"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"}

package/dist/genexus-ide-ui/{p-f5a48b33.entry.js → p-04205aa4.entry.js} RENAMED Viewed

@@ -2,7 +2,7 @@ import { g as e, r as i, h as t, H as s, a } from "./p-25a9f1d7.js";
 import { g as r } from "./p-ede7bd20.js";
-import { L as o } from "./p-857866f8.js";
+import { L as o } from "./p-311eedf3.js";
 const n = ':host{--slide-header-block-padding:34px;--slide-footer-block:var(--mer-spacing--md) var(--mer-spacing--4xl);--slide-footer-block-last-slide:var(--mer-spacing--md) 42px;--slide-footer-navigation-hide-transition:var(--mer-timing--fast);display:grid;block-size:100%;inline-size:100%;overflow:auto;padding:var(--mer-spacing--lg);box-sizing:border-box;padding:var(--mer-spacing--xl)}.main{display:grid;place-self:center;inline-size:100%;max-inline-size:1100px;background-color:var(--mer-surface__elevation--01);border-radius:17px;overflow:hidden;border:var(--mer-border__width--sm) solid var(--mer-surface__elevation--01);inset-block-start:0;transition:opacity var(--slide-fade-duration);opacity:0;pointer-events:none}.main--border-glow{animation:borderColorCycle 2s infinite}.main--visible{pointer-events:visible;opacity:1}.slide{display:grid;block-size:100%;grid-template-areas:"header header" "slide-wrapper slide-wrapper" "footer footer";grid-template-rows:max-content 1fr max-content}.slide__header{padding-inline:18px;padding-block:24px 27px;display:flex;flex-direction:row-reverse;grid-area:header}.slide__container{display:contents}.slide__wrapper{display:grid;column-gap:var(--mer-spacing--3xl);grid-template-areas:"header header" "illustration copy" "footer footer";grid-template-rows:max-content 1fr max-content;grid-template-columns:1fr 1fr;grid-area:slide-wrapper;transition:var(--slide-fade-duration) opacity;transition:opacity 200ms;padding-inline:48px;opacity:1;z-index:1}.slide__wrapper:not(.active){opacity:0;z-index:0;pointer-events:none}.slide__illustration{position:relative;overflow:hidden;display:grid;grid-area:illustration;place-items:center;inline-size:100%}.slide__illustration-img{object-fit:contain;block-size:100%;inline-size:100%}.slide__copy{grid-area:copy;place-self:center;justify-self:flex-start}.slide__copy-container{display:grid;gap:var(--mer-spacing--md);max-inline-size:524px}.slide__copy-header{display:grid;gap:var(--mer-spacing--md)}.slide__copy-title{font-size:var(--mer-font__size--xl);color:var(--mer-text__on-surface);letter-spacing:0.02em;font-weight:var(--mer-font__weight--semi-bold)}.slide__copy-description{display:grid;gap:var(--mer-spacing--md);font-size:var(--mer-font__size--sm);font-weight:var(--mer-font__weight--light);line-height:var(--mer-line-height--spaced)}.slide__list{display:grid;gap:var(--mer-spacing--md);list-style:none;padding:0;margin:0}.slide__list-item-title{font-weight:var(--mer-font__weight--medium)}.slide__word{transition:var(--mer-timing--regular) opacity;opacity:0}.slide__word--visible{opacity:1}.slide__footer{grid-area:footer;display:grid;padding-block:var(--slide-footer-block);opacity:1}.slide__footer-last-slide{opacity:0;transition:calc(var(--mer-timing--fast) + 200ms) opacity;pointer-events:none;animation:footerPaddingBlockLastSlide var(--mer-timing--regular) ease-out forwards calc(var(--mer-timing--fast) + 200ms)}.slide__footer-wrapper{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--mer-spacing--md);align-items:center;justify-content:center;transition:var(--mer-timing--regular) opacity;opacity:1}.slide__footer-wrapper-hidden{opacity:0}.slide__dots{display:grid;gap:var(--mer-spacing--2xs);list-style:none;padding:0;margin:0;grid-auto-flow:column;grid-auto-columns:max-content;justify-content:center}.slide__dots-inactive{pointer-events:none}.slide__dot{display:grid;padding:var(--mer-spacing--xs);cursor:pointer}.slide__dot::before{content:"";place-self:center;inline-size:var(--mer-spacing--sm);block-size:var(--mer-spacing--sm);border-radius:calc(var(--mer-spacing--sm) / 2);background-color:var(--mer-color__neutral-gray--500)}.slide__dot:hover::before{background-color:var(--mer-icon__on-primary--hover)}.slide__dot.active{cursor:auto}.slide__dot.active::before{background-color:var(--mer-accent__primary);cursor:auto}.slide__dot-inactive{pointer-events:none}.close-icon{transition:all var(--mer-timing--fast)}.close-icon:hover{filter:brightness(1.5)}.start-button{justify-self:start;margin-block-start:25px}@keyframes ellipseFadeInOut{0%{opacity:0.3}100%{opacity:0.7}}@keyframes ellipseRotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes polygonRotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes borderColorCycle{0%{border-color:var(--mer-surface__elevation--01)}50%{border-color:var(--mer-color__primary--400)}100%{border-color:var(--mer-surface__elevation--01)}}@keyframes footerPaddingBlockLastSlide{0%{padding-block:var(--slide-footer-block)}100%{padding-block:var(--slide-footer-block-last-slide)}}.fade-out{animation:fadeOut 0.5s forwards 0.3s}';
@@ -146,7 +146,8 @@ const I = class {
     }));
     z.set(this, (() => {
       d(this, h, this.slides.map(((e, i) => {
-        const s = i === this.slides.length - 1;
+        var s, a;
+        const r = i === this.slides.length - 1;
         return t("section", {
           class: "slide__wrapper",
           ref: e => l(this, f, "f")[i] = e
@@ -171,13 +172,13 @@ const I = class {
           class: "slide__copy-title"
         }, e.title)), t("div", {
           class: "slide__copy-description"
-        }, e.description?.map((i => t("p", null, e.descriptionAsChunks ? l(this, M, "f").call(this, i) : i))), e.listItems?.length && t("ul", {
+        }, (s = e.description) === null || s === void 0 ? void 0 : s.map((i => t("p", null, e.descriptionAsChunks ? l(this, M, "f").call(this, i) : i))), ((a = e.listItems) === null || a === void 0 ? void 0 : a.length) && t("ul", {
           class: "slide__list"
         }, e.listItems.map((e => t("li", {
           class: "slide__list-item"
         }, t("strong", {
           class: "slide__list-item-title"
-        }, e.title), " ", e.description))))), s && t("button", {
+        }, e.title), " ", e.description))))), r && t("button", {
           class: "button-primary start-button",
           onClick: l(this, g, "f")
         }, l(this, c, "f").startButtonCaption))));
@@ -305,4 +306,4 @@ M = new WeakMap, W = new WeakMap;
 I.style = n;
 export { I as gx_ide_welcome_page };
-//# sourceMappingURL=p-f5a48b33.entry.js.map
+//# sourceMappingURL=p-04205aa4.entry.js.map

package/dist/genexus-ide-ui/p-04205aa4.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["welcomePageCss","ACTIVE_SLIDE_SELECTOR","ARROW_LEFT_KEY","ARROW_RIGHT_KEY","ESCAPE_KEY","SLIDE_FADE_DURATION","SLIDE_WORD_SELECTOR","SLIDE_WORD_SELECTOR_TIMEOUT","SLIDE_WORD_SELECTOR_VISIBLE","ICON_NEXT","getAssetPath","CLOSE_ICON","getIconPath","category","name","colorType","CSS_BUNDLES","GxIdeWelcomePage","_GxIdeWelcomePage_componentLocale","set","this","_GxIdeWelcomePage_slidesDescriptionAsChunksAlreadyDisplayed","Map","_GxIdeWelcomePage_slidesElements","_GxIdeWelcomePage_slidesElementsRef","_GxIdeWelcomePage_slideTimeOutId","_GxIdeWelcomePage_closeSlider","sliderVisible","setTimeout","el","remove","closeCallback","document","removeEventListener","__classPrivateFieldGet","_GxIdeWelcomePage_keyboardEventHandler","_GxIdeWelcomePage_initiateSlidesTransition","_GxIdeWelcomePage_slideTimeOut","call","addEventListener","_GxIdeWelcomePage_displayWords","wordsNodeList","forEach","word","index","classList","add","_GxIdeWelcomePage_dotClickedHandler","event","userHasChangedSlide","itemClicked","currentTarget","parseInt","getAttribute","_GxIdeWelcomePage_updateActiveSlide","goToPrevSlide","key","slideTransitioning","lastSlideReached","activeSlideIndex","goToNextSlide","closeSlider","_GxIdeWelcomePage_nextSlideHandler","_GxIdeWelcomePage_prevSlideHandler","newIndex","clearTimeout","autoChangeSlide","transitionType","itemsWordsCount","slides","listItems","itemsWords","map","item","title","description","length","mergedItemsWords","join","split","mergedDescription","words","timeBeforeNextSlide","_GxIdeWelcomePage_secondsToRead","__classPrivateFieldSet","wordsCount","wordsPerMinute","minutes","milliseconds","_GxIdeWelcomePage_renderSlides","slide","isLastSlide","h","class","ref","role","copyright","illustrationAriaLabel","src","illustration","url","alt","_a","paragraph","descriptionAsChunks","_GxIdeWelcomePage_splitWords","_b","onClick","startButtonCaption","newSlideIndex","activeSlide","nextSlideReference","displayDescriptionAsChunks","descriptionAsChunksDisplayedAlready","get","slideTimeOut","querySelectorAll","componentWillLoad","Locale","getComponentStrings","componentDidLoad","render","Host","model","main","style","slide__footer","_","slide__dot"],"sources":["src/components/welcome-page/welcome-page.scss?tag=gx-ide-welcome-page&encapsulation=shadow","src/components/welcome-page/welcome-page.tsx"],"sourcesContent":[":host {\n --slide-header-block-padding: 34px;\n --slide-footer-block: var(--mer-spacing--md) var(--mer-spacing--4xl);\n --slide-footer-block-last-slide: var(--mer-spacing--md) 42px;\n --slide-footer-navigation-hide-transition: var(--mer-timing--fast);\n display: grid;\n block-size: 100%;\n inline-size: 100%;\n overflow: auto;\n padding: var(--mer-spacing--lg);\n box-sizing: border-box;\n padding: var(--mer-spacing--xl);\n}\n\n.main {\n display: grid;\n place-self: center;\n inline-size: 100%;\n max-inline-size: 1100px;\n background-color: var(--mer-surface__elevation--01);\n border-radius: 17px;\n overflow: hidden;\n border: var(--mer-border__width--sm) solid var(--mer-surface__elevation--01);\n inset-block-start: 0;\n transition: opacity var(--slide-fade-duration);\n opacity: 0;\n pointer-events: none;\n\n &--border-glow {\n animation: borderColorCycle 2s infinite;\n }\n &--visible {\n pointer-events: visible;\n opacity: 1;\n }\n}\n\n// - - - - - - - - - - - - -\n// Slide\n// - - - - - - - - - - - - -\n\n.slide {\n display: grid;\n block-size: 100%;\n grid-template-areas:\n \"header header\"\n \"slide-wrapper slide-wrapper\"\n \"footer footer\";\n grid-template-rows: max-content 1fr max-content;\n\n // - - - - - Header\n\n &__header {\n padding-inline: 18px;\n padding-block: 24px 27px;\n display: flex;\n flex-direction: row-reverse;\n grid-area: header;\n }\n\n // - - - - - Container\n\n &__container {\n display: contents;\n }\n\n &__wrapper {\n display: grid;\n column-gap: var(--mer-spacing--3xl);\n grid-template-areas:\n \"header header\"\n \"illustration copy\"\n \"footer footer\";\n grid-template-rows: max-content 1fr max-content;\n // grid-template-columns: 411px 1fr;\n grid-template-columns: 1fr 1fr;\n grid-area: slide-wrapper;\n transition: var(--slide-fade-duration) opacity;\n transition: opacity 200ms;\n padding-inline: 48px;\n opacity: 1;\n z-index: 1;\n }\n &__wrapper:not(.active) {\n opacity: 0;\n z-index: 0;\n pointer-events: none;\n }\n\n &__illustration {\n position: relative;\n overflow: hidden;\n display: grid;\n grid-area: illustration;\n place-items: center;\n inline-size: 100%;\n\n &-img {\n object-fit: contain;\n block-size: 100%;\n inline-size: 100%;\n }\n }\n\n &__copy {\n grid-area: copy;\n place-self: center;\n justify-self: flex-start;\n }\n\n &__copy-container {\n display: grid;\n gap: var(--mer-spacing--md);\n max-inline-size: 524px;\n }\n\n &__copy-header {\n display: grid;\n gap: var(--mer-spacing--md);\n }\n\n &__copy-title {\n font-size: var(--mer-font__size--xl);\n color: var(--mer-text__on-surface);\n letter-spacing: 0.02em;\n font-weight: var(--mer-font__weight--semi-bold);\n }\n\n &__copy-description {\n display: grid;\n gap: var(--mer-spacing--md);\n font-size: var(--mer-font__size--sm);\n font-weight: var(--mer-font__weight--light);\n line-height: var(--mer-line-height--spaced);\n }\n\n &__list {\n display: grid;\n gap: var(--mer-spacing--md);\n list-style: none;\n padding: 0;\n margin: 0;\n\n &-item {\n &-title {\n font-weight: var(--mer-font__weight--medium);\n }\n }\n }\n\n // words (if 'showTextInChunks' is true)\n &__word {\n transition: var(--mer-timing--regular) opacity;\n opacity: 0;\n\n &--visible {\n opacity: 1;\n }\n }\n\n // - - - - - Footer\n\n &__footer {\n $hideDotsDuration: calc(var(--mer-timing--fast) + 200ms);\n grid-area: footer;\n display: grid;\n padding-block: var(--slide-footer-block);\n opacity: 1;\n\n &-last-slide {\n opacity: 0;\n transition: $hideDotsDuration opacity;\n pointer-events: none;\n animation: footerPaddingBlockLastSlide var(--mer-timing--regular) ease-out\n forwards $hideDotsDuration;\n }\n }\n\n &__footer-wrapper {\n display: grid;\n grid-auto-flow: column;\n grid-auto-columns: max-content;\n gap: var(--mer-spacing--md);\n align-items: center;\n justify-content: center;\n transition: var(--mer-timing--regular) opacity;\n opacity: 1;\n\n &-hidden {\n opacity: 0;\n }\n }\n &__dots {\n display: grid;\n gap: var(--mer-spacing--2xs);\n list-style: none;\n padding: 0;\n margin: 0;\n grid-auto-flow: column;\n grid-auto-columns: max-content;\n justify-content: center;\n\n &-inactive {\n pointer-events: none;\n }\n }\n &__dot {\n display: grid;\n padding: var(--mer-spacing--xs);\n cursor: pointer;\n\n &::before {\n content: \"\";\n place-self: center;\n inline-size: var(--mer-spacing--sm);\n block-size: var(--mer-spacing--sm);\n border-radius: calc(var(--mer-spacing--sm) / 2);\n background-color: var(--mer-color__neutral-gray--500);\n }\n &:hover::before {\n background-color: var(--mer-icon__on-primary--hover);\n }\n\n &.active {\n cursor: auto;\n &::before {\n background-color: var(--mer-accent__primary);\n cursor: auto;\n }\n }\n\n &-inactive {\n pointer-events: none;\n }\n }\n}\n\n.close-icon {\n transition: all var(--mer-timing--fast);\n &:hover {\n filter: brightness(1.5);\n }\n}\n\n.start-button {\n justify-self: start;\n margin-block-start: 25px;\n}\n\n// - - - - - - - - - - - - - -\n// Animations\n// - - - - - - - - - - - - - -\n\n@keyframes ellipseFadeInOut {\n 0% {\n opacity: 0.3;\n }\n 100% {\n opacity: 0.7;\n }\n}\n@keyframes ellipseRotate {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n@keyframes polygonRotate {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n@keyframes borderColorCycle {\n 0% {\n border-color: var(--mer-surface__elevation--01);\n }\n 50% {\n border-color: var(--mer-color__primary--400);\n }\n 100% {\n border-color: var(--mer-surface__elevation--01);\n }\n}\n\n@keyframes footerPaddingBlockLastSlide {\n 0% {\n padding-block: var(--slide-footer-block);\n }\n 100% {\n padding-block: var(--slide-footer-block-last-slide);\n }\n}\n\n.fade-out {\n animation: fadeOut 0.5s forwards 0.3s;\n}\n","// Stencil\nimport {\n Component,\n Host,\n h,\n Prop,\n Element,\n State,\n getAssetPath\n} from \"@stencil/core\";\n// Other Libraries\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n\n// Custom Imports\nimport { Locale } from \"../../common/locale\";\n\nconst ACTIVE_SLIDE_SELECTOR = \"active\";\nconst ARROW_LEFT_KEY = \"ArrowLeft\";\nconst ARROW_RIGHT_KEY = \"ArrowRight\";\nconst ESCAPE_KEY = \"Escape\";\nconst SLIDE_FADE_DURATION = 300;\nconst SLIDE_WORD_SELECTOR = \".slide__word\";\nconst SLIDE_WORD_SELECTOR_TIMEOUT = 70;\nconst SLIDE_WORD_SELECTOR_VISIBLE = \"slide__word--visible\";\n\n// icons\nconst ICON_NEXT = getAssetPath(\n `./gx-ide-assets/welcome-page/images/icon-next.svg`\n);\nconst CLOSE_ICON = getIconPath({\n category: \"system\",\n name: \"close\",\n colorType: \"on-elevation\"\n});\n\nconst CSS_BUNDLES: MercuryBundles = [\n \"resets/box-sizing\",\n \"utils/typography\",\n \"components/icon\",\n \"components/button\"\n];\n\n@Component({\n tag: \"gx-ide-welcome-page\",\n styleUrl: \"welcome-page.scss\",\n shadow: true,\n assetsDirs: [\"gx-ide-assets/welcome-page\"]\n})\nexport class GxIdeWelcomePage {\n /**\n * The component hard-coded strings translations.\n */\n // eslint-disable-next-line @stencil-community/own-props-must-be-private\n #componentLocale: any;\n\n #slidesDescriptionAsChunksAlreadyDisplayed: Map<number, boolean> = new Map();\n #slidesElements: HTMLElement[] = [];\n #slidesElementsRef: HTMLElement[] = [];\n // #slidesDescriptionAsChunksAlreadyDisplayed is used to know if the description of a slide\n // that is set to be displayed as chunks, has already been displayed. Used to not display\n // as chunks after the first time.\n #slideTimeOutId: NodeJS.Timeout;\n\n @Element() el: HTMLGxIdeWelcomePageElement;\n\n /**\n * The current active slide index from 'slides' Prop. It does not considers the very first slide \"Copyright\".\n */\n @State() activeSlideIndex: number = 0;\n\n /**\n * When true the slider will be visible. Used to display and hide the slide with a smooth transition.\n */\n @State() displaySlider: boolean = false;\n\n /**\n * True if the very first slide is visible (The copyright slide)\n */\n @State() copyrightsVisible: boolean = true;\n\n /**\n * True if the user has reached the last slide. Used to hide/disable the navigation.\n */\n @State() lastSlideReached: boolean = false;\n\n /**\n * When true the slider will be visible. Used to display and hide the slider with a smooth transition.\n */\n @State() sliderVisible: boolean = false;\n\n /**\n * True if a slide is transitioning, false otherwise. Used to disable the navigation arrows while transitioning.\n */\n @State() slideTransitioning: boolean = false;\n\n /**\n * True if the user has changed slides by clicking on the navigation dots, or by using the keyboard arrows. This is used to know evaluate the slide transition setTimeOut. If the user has navigated, automatic slide transition should be turned off.\n */\n @State() userHasChangedSlide: boolean = false;\n\n /**\n * The transition type between the slides. \"static\" requires the user to navigate by clicking the navigation dots. \"auto\" will transition automatically after a calculated amount of time.\n */\n @Prop() readonly transitionType: TransitionType = \"auto\";\n\n /**\n * The estimated amount of words per minute that the user requires to read a slide. This value is used to return the time each slide is freezed before transitioning to the next one. Only evaluated when transitionType is set to \"auto\".\n */\n @Prop() readonly wordsPerMinute: number = 250;\n\n /**\n * Callback invoked when the user closes the slider by pressing the close button.\n */\n @Prop() readonly closeCallback!: CloseCallback;\n\n /**\n * An array of slides, with the information that each slide requires. This slides appear after the first slide (Copyrights) that is defined inside the component.\n */\n @Prop() readonly slides: SlideInfo[] = [];\n\n async componentWillLoad() {\n this.#componentLocale = await Locale.getComponentStrings(this.el);\n this.#renderSlides();\n }\n\n componentDidLoad() {\n this.#slidesElementsRef[this.activeSlideIndex].classList.add(\n ACTIVE_SLIDE_SELECTOR\n );\n this.sliderVisible = true;\n this.#initiateSlidesTransition();\n }\n\n #closeSlider = () => {\n this.sliderVisible = false;\n setTimeout(() => {\n // wait until the slide disappears, then remove.\n this.el.remove();\n this.closeCallback();\n document.removeEventListener(\"keydown\", this.#keyboardEventHandler);\n }, SLIDE_FADE_DURATION);\n };\n\n #initiateSlidesTransition = () => {\n this.#slideTimeOut();\n // listen to keydown events to navigate the slides with the arrows\n document.addEventListener(\"keydown\", this.#keyboardEventHandler);\n };\n\n #displayWords = (wordsNodeList: NodeListOf<HTMLElement>) => {\n wordsNodeList.forEach((word, index) => {\n setTimeout(() => {\n word.classList.add(SLIDE_WORD_SELECTOR_VISIBLE);\n }, index * SLIDE_WORD_SELECTOR_TIMEOUT);\n });\n };\n\n #dotClickedHandler = (event: MouseEvent) => {\n this.userHasChangedSlide = true;\n const itemClicked = event.currentTarget as HTMLElement;\n const index = parseInt(itemClicked.getAttribute(\"data-index\"), 10);\n this.#updateActiveSlide(index);\n };\n\n #keyboardEventHandler = (event: KeyboardEvent) => {\n this.userHasChangedSlide = true;\n const goToPrevSlide =\n event.key === ARROW_LEFT_KEY &&\n !this.slideTransitioning &&\n !this.lastSlideReached &&\n this.activeSlideIndex !== 0;\n\n const goToNextSlide =\n event.key === ARROW_RIGHT_KEY &&\n !this.slideTransitioning &&\n !this.lastSlideReached;\n\n const closeSlider =\n event.key === ESCAPE_KEY ||\n (event.key === ARROW_RIGHT_KEY &&\n !this.slideTransitioning &&\n this.lastSlideReached);\n\n if (goToNextSlide) {\n this.#nextSlideHandler();\n } else if (goToPrevSlide) {\n this.#prevSlideHandler();\n } else if (closeSlider) {\n this.#closeSlider();\n }\n };\n\n #nextSlideHandler = () => {\n const newIndex = this.activeSlideIndex + 1;\n this.#updateActiveSlide(newIndex);\n };\n\n #prevSlideHandler = () => {\n const newIndex = this.activeSlideIndex - 1;\n this.#updateActiveSlide(newIndex);\n };\n\n #slideTimeOut = () => {\n // Clear any existing timeout\n if (this.#slideTimeOutId) {\n clearTimeout(this.#slideTimeOutId);\n }\n\n const autoChangeSlide =\n this.transitionType === \"auto\" &&\n !this.lastSlideReached &&\n !this.userHasChangedSlide;\n\n if (!autoChangeSlide) {\n return;\n }\n\n let itemsWordsCount = 0;\n if (this.slides[this.activeSlideIndex].listItems) {\n const itemsWords = this.slides[this.activeSlideIndex].listItems.map(\n item => {\n return item.title + item.description;\n }\n );\n if (itemsWords.length) {\n const mergedItemsWords = itemsWords.join(\"\");\n itemsWordsCount = mergedItemsWords.split(\" \").length;\n }\n }\n\n const mergedDescription =\n this.slides[this.activeSlideIndex].description.join(\"\");\n const words = mergedDescription.split(\" \").length;\n const timeBeforeNextSlide: number = this.#secondsToRead(\n words + itemsWordsCount\n );\n\n // Set a fresh timeout\n if (timeBeforeNextSlide) {\n this.#slideTimeOutId = setTimeout(() => {\n this.#nextSlideHandler();\n }, timeBeforeNextSlide);\n }\n };\n\n #secondsToRead = (\n wordsCount: number,\n wordsPerMinute = this.wordsPerMinute\n ): number => {\n const minutes = wordsCount / wordsPerMinute;\n const milliseconds = minutes * 60000; // Convert minutes to milliseconds\n return milliseconds;\n };\n\n #renderSlides = () => {\n this.#slidesElements = this.slides.map((slide, index) => {\n const isLastSlide = index === this.slides.length - 1;\n return (\n <section\n class=\"slide__wrapper\"\n ref={(el: HTMLElement) =>\n (this.#slidesElementsRef[index] = el as HTMLElement)\n }\n >\n <div\n class=\"slide__illustration\"\n role=\"img\"\n aria-label={this.#componentLocale.copyright.illustrationAriaLabel}\n >\n <img\n class=\"slide__illustration-img\"\n src={slide.illustration.url}\n alt={slide.illustration.alt}\n />\n </div>\n <section class=\"slide__copy\">\n <div class=\"slide__copy-container\">\n <header class=\"slide__copy-header\">\n <img src={ICON_NEXT} alt=\"GeneXus Next isologotype\" />\n <h2 class=\"slide__copy-title\">{slide.title}</h2>\n </header>\n <div class=\"slide__copy-description\">\n {slide.description?.map(paragraph => {\n return (\n <p>\n {slide.descriptionAsChunks\n ? this.#splitWords(paragraph)\n : paragraph}\n </p>\n );\n })}\n {slide.listItems?.length && (\n <ul class=\"slide__list\">\n {slide.listItems.map(item => {\n return (\n <li class=\"slide__list-item\">\n <strong class=\"slide__list-item-title\">\n {item.title}\n </strong>{\" \"}\n {item.description}\n </li>\n );\n })}\n </ul>\n )}\n </div>\n {isLastSlide && (\n <button\n class=\"button-primary start-button\"\n onClick={this.#closeSlider}\n >\n {this.#componentLocale.startButtonCaption}\n </button>\n )}\n </div>\n </section>\n </section>\n );\n });\n };\n\n #splitWords = (paragraph: string): HTMLSpanElement[] => {\n return paragraph.split(\" \").map(word => {\n // keep the space after {word} !\n return <span class=\"slide__word\">{word} </span>;\n });\n };\n\n #updateActiveSlide = (newSlideIndex: number) => {\n this.slideTransitioning = true;\n\n // unset current active slide\n const activeSlide = this.#slidesElementsRef[this.activeSlideIndex];\n activeSlide.classList.remove(ACTIVE_SLIDE_SELECTOR);\n\n const nextSlideReference = this.#slidesElementsRef[newSlideIndex];\n const displayDescriptionAsChunks =\n this.slides[newSlideIndex].descriptionAsChunks;\n const descriptionAsChunksDisplayedAlready =\n this.#slidesDescriptionAsChunksAlreadyDisplayed.get(newSlideIndex);\n let wordsCount;\n let wordsNodeList: NodeListOf<HTMLElement>;\n let slideTimeOut = 0;\n if (displayDescriptionAsChunks) {\n wordsNodeList = nextSlideReference.querySelectorAll(SLIDE_WORD_SELECTOR);\n wordsCount = wordsNodeList.length;\n slideTimeOut = wordsCount * SLIDE_WORD_SELECTOR_TIMEOUT;\n }\n\n this.lastSlideReached = newSlideIndex === this.slides.length - 1;\n\n // set new slide as active after fade out\n setTimeout(() => {\n nextSlideReference.classList.add(ACTIVE_SLIDE_SELECTOR);\n\n if (displayDescriptionAsChunks && !descriptionAsChunksDisplayedAlready) {\n this.#slidesDescriptionAsChunksAlreadyDisplayed.set(\n newSlideIndex,\n true\n );\n this.#displayWords(wordsNodeList);\n setTimeout(() => {\n this.slideTransitioning = false;\n }, slideTimeOut);\n } else {\n this.slideTransitioning = false;\n }\n }, SLIDE_FADE_DURATION);\n\n // update active slide index\n this.activeSlideIndex = newSlideIndex;\n this.#slideTimeOut(); // this has to be after this.#updateActiveSlide.\n };\n\n render() {\n return (\n <Host>\n <ch-theme model={CSS_BUNDLES}></ch-theme>\n <div\n class={{\n \"main\": true,\n \"main--visible\": this.sliderVisible,\n \"main--border-glow\": this.lastSlideReached\n }}\n style={{ \"--slide-fade-duration\": `${SLIDE_FADE_DURATION}ms` }}\n >\n <section class=\"slide\">\n <header class=\"slide__header\">\n <button\n class=\"button-tertiary button-icon-only close-icon\"\n aria-label=\"close presentation\"\n onClick={this.#closeSlider}\n >\n <ch-image class=\"icon-md\" src={CLOSE_ICON}></ch-image>\n </button>\n </header>\n <div class=\"slide__container\">{this.#slidesElements}</div>\n <footer\n // slide common footer\n class={{\n slide__footer: true\n }}\n >\n <div\n class={{\n \"slide__footer-wrapper\": true\n }}\n >\n <ul class=\"slide__dots\" aria-label=\"Slide indicators\">\n {this.slides.map((_, index) => {\n return (\n <li\n class={{\n \"slide__dot\": true,\n \"slide__dot-inactive\": this.slideTransitioning,\n [ACTIVE_SLIDE_SELECTOR]:\n index === this.activeSlideIndex\n }}\n data-index={index}\n onClick={\n !this.slideTransitioning && this.#dotClickedHandler\n }\n ></li>\n );\n })}\n </ul>\n </div>\n </footer>\n </section>\n </div>\n </Host>\n );\n }\n}\n\nexport type SlideInfo = {\n illustration: {\n url: string;\n alt: string;\n };\n title: string;\n description?: string[];\n descriptionAsChunks?: boolean;\n listItems?: Array<{\n title: string;\n description: string;\n }>;\n};\n\nexport type CloseCallback = () => Promise<void>;\nexport type TransitionType = \"static\" | \"auto\";\n"],"mappings":"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"}

package/dist/genexus-ide-ui/{p-f6ceb01a.entry.js → p-04c6bd23.entry.js} RENAMED Viewed

@@ -1,67 +1,67 @@
-import { r as t, c as e, h as r, H as a, a as o } from "./p-25a9f1d7.js";
+import { r as e, c as t, h as r, H as a, a as o } from "./p-25a9f1d7.js";
 import { c as i } from "./p-13738332.js";
-import { L as s } from "./p-857866f8.js";
+import { L as s } from "./p-311eedf3.js";
 import { r as l } from "./p-8c0b4d9f.js";
-const filesToListItemsData = t => {
-  const e = [];
-  t.forEach((t => {
-    const r = typeof t === "string" ? t : t.name;
-    const a = typeof t === "string" ? t : t.name;
+const filesToListItemsData = e => {
+  const t = [];
+  e.forEach((e => {
+    const r = typeof e === "string" ? e : e.name;
+    const a = typeof e === "string" ? e : e.name;
     const o = undefined;
     const i = false;
-    e.push({
+    t.push({
       itemId: r,
       itemValue: a,
       itemIcon: o,
       itemChecked: i
     });
   }));
-  return e;
+  return t;
 };
 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)}: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}.pill-tag{padding:1px 4px;border-radius:2px;min-inline-size:40px;text-align:center;margin-inline-end:10px;font-size:11px}.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)}.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 c = class {
   constructor(r) {
-    t(this, r);
-    this.componentDidRenderFirstTime = e(this, "componentDidRenderFirstTime", 7);
-    this.selectionChanged = e(this, "selectionChanged", 7);
+    e(this, r);
+    this.componentDidRenderFirstTime = t(this, "componentDidRenderFirstTime", 7);
+    this.selectionChanged = t(this, "selectionChanged", 7);
     this.renderedFirstTime = false;
     // 7.LISTENERS //
     // 8.PUBLIC METHODS API //
     // 9.LOCAL METHODS //
-        this.fileSelectionChangedHandler = t => {
+        this.fileSelectionChangedHandler = e => {
       this.selectionChanged.emit();
-      const e = Array.isArray(t.detail) ? t.detail : [ t.detail ];
-      this.selectedFiles = e.map((t => t.itemValue));
+      const t = Array.isArray(e.detail) ? e.detail : [ e.detail ];
+      this.selectedFiles = t.map((e => e.itemValue));
     };
     this.loadFileHandle = async () => {
       this.fileInput.click();
     };
-    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.handleFileInputChange = e => {
+      const t = e.target;
+      if (t.files && t.files.length > 0) {
+        const e = Array.from(t.files);
+        const r = e.filter((e => !this.files.some((t => t.name === e.name))));
         this.files = [ ...this.files, ...r ];
       }
       this.fileInput.value = null;
     };
     this.confirmCallbackHandle = async () => {
       if (this.confirmCallback && this.files.length > 0) {
-        const t = {
+        const e = {
           automaticBackup: this.automaticBackupEl.value === "true",
           files: this.files
         };
-        await this.confirmCallback(t);
+        await this.confirmCallback(e);
       }
     };
-    this.removeFiles = t => {
-      this.files = this.files.filter((e => !t.includes(e.name)));
+    this.removeFiles = e => {
+      this.files = this.files.filter((t => !e.includes(t.name)));
       this.selectedFiles = [];
       this.fileInput.value = null;
     };
@@ -87,6 +87,7 @@ const c = class {
   }
   // 10.RENDER() FUNCTION //
   render() {
+    var e;
     return r(a, {
       class: "gx-ide-component"
     }, r("div", {
@@ -117,7 +118,7 @@ const c = class {
       checkedValue: "true",
       unCheckedValue: "false",
       value: "checked",
-      ref: t => this.automaticBackupEl = t
+      ref: e => this.automaticBackupEl = e
     }), r("label", {
       htmlFor: "automatic-backup"
     }, this._componentLocale.main.automaticBackupLabel)), r("div", {
@@ -125,8 +126,8 @@ const c = class {
     }, r("input", {
       type: "file",
       id: "input_file",
-      accept: this.allowedExtensions?.join(", "),
-      ref: t => this.fileInput = t,
+      accept: (e = this.allowedExtensions) === null || e === void 0 ? void 0 : e.join(", "),
+      ref: e => this.fileInput = e,
       onChange: this.handleFileInputChange,
       class: "hidden-input",
       multiple: true
@@ -154,4 +155,4 @@ const c = class {
 c.style = n;
 export { c as gx_ide_bpm_import_files };
-//# sourceMappingURL=p-f6ceb01a.entry.js.map
+//# sourceMappingURL=p-04c6bd23.entry.js.map

package/dist/genexus-ide-ui/p-04c6bd23.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["filesToListItemsData","files","itemsData","forEach","file","itemId","name","itemValue","itemIcon","undefined","itemChecked","push","bpmImportFilesCss","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","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/bpm-import-files.scss?tag=gx-ide-bpm-import-files&encapsulation=shadow","src/components/bpm/import-files/bpm-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: \"bpm-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.value === \"true\",\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":";;;;;;;;AAEO,MAAMA,uBAAwBC;EACnC,MAAMC,IAAwB;EAC9BD,EAAME,SAAQC;IACZ,MAAMC,WAAgBD,MAAS,WAAWA,IAAOA,EAAKE;IACtD,MAAMC,WAAmBH,MAAS,WAAWA,IAAOA,EAAKE;IACzD,MAAME,IAAmBC;IACzB,MAAMC,IAAuB;IAC7BR,EAAUS,KAAK;MACbN,QAAQA;MACRE,WAAWA;MACXC,UAAUA;MACVE,aAAaA;;AACb;EAEJ,OAAOR;AAAS;;AChBlB,MAAMU,IAAoB;;MCyBbC,IAAa;;;;;IAQhBC,KAAAC,oBAAoB;;;;QA2EpBD,KAAAE,8BACNC;MAEAH,KAAKI,iBAAiBC;MAEtB,MAAMC,IAAgBC,MAAMC,QAAQL,EAAaM,UAC7CN,EAAaM,SACb,EAACN,EAAaM;MAElBT,KAAKM,gBAAgBA,EAAcI,KAAIC,KAAQA,EAAKlB;AAAU;IAGxDO,KAAAY,iBAAiBC;MACvBb,KAAKc,UAAUC;AAAO;IAGhBf,KAAAgB,wBAAyBC;MAC/B,MAAMH,IAAYG,EAAMC;MAExB,IAAIJ,EAAU3B,SAAS2B,EAAU3B,MAAMgC,SAAS,GAAG;QACjD,MAAMC,IAAmBb,MAAMc,KAAKP,EAAU3B;QAC9C,MAAMmC,IAAcF,EAASG,QAC3BC,MACGxB,KAAKb,MAAMsC,MAAKC,KAAgBA,EAAalC,SAASgC,EAAQhC;QAEnEQ,KAAKb,QAAQ,KAAIa,KAAKb,UAAUmC;;MAGlCtB,KAAKc,UAAUa,QAAQ;AAAI;IAGrB3B,KAAA4B,wBAAwBf;MAC9B,IAAIb,KAAK6B,mBAAmB7B,KAAKb,MAAMgC,SAAS,GAAG;QACjD,MAAMW,IAAmB;UACvBC,iBAAiB/B,KAAKgC,kBAAkBL,UAAU;UAClDxC,OAAOa,KAAKb;;cAGRa,KAAK6B,gBAAgBC;;;IAIvB9B,KAAAiC,cAAeC;MACrBlC,KAAKb,QAAQa,KAAKb,MAAMoC,QAAOjC,MAAS4C,EAAcC,SAAS7C,EAAKE;MAEpEQ,KAAKM,gBAAgB;MACrBN,KAAKc,UAAUa,QAAQ;AAAI;IAGrB3B,KAAAoC,0BAA0B;MAChCpC,KAAKiC,YAAYjC,KAAKM;AAAc;iBAhHb;yBAKU;wBAOH;;;;;;EA+BhC,uBAAM+B;IACJrC,KAAKsC,yBAAyBC,EAAOC,oBAAoBxC,KAAKyC;;EAGhE,kBAAAC;IACE,KAAK1C,KAAKC,mBAAmB;MAC3BD,KAAK2C,4BAA4BtC,KAC/BL,KAAKsC,iBAAiBM;MAExB5C,KAAKC,oBAAoB;;;;EAiE7B,MAAA4C;;IACE,OACEC,EAACC,GAAI;MAACC,OAAM;OACVF,EAAA;MAAKE,OAAM;OACTF,EAAA;MACEG,gBACEjD,KAAKkD,eAAelD,KAAKsC,iBAAiBM,gBAAgB;MAE5DO,eAAeC,EAAOC,eAAeF;OAErCL,EAAA;MAAKE,OAAM;OAETF,EAAA;MAAKE,OAAM;OACTF,EAAA;MAAOQ,SAAQ;OACZtD,KAAKsC,iBAAiBiB,KAAKC,YAE9BV,EAAA;MACEW,IAAG;MACHC,MAAK;MACLC,UAAS;MACTC,SAAO;MACPC,oBAAoB7D,KAAKE;MACzB8C,OAAM;OAELc,EAAgB5E,qBAAqBc,KAAKb,WAI/C2D,EAAA;MAAKE,OAAM;OACTF,EAAA;MAAKE,OAAM;OACTF,EAAA;MACEW,IAAG;MACHM,gBACE/D,KAAKsC,iBAAiBiB,KAAKS;MAE7BC,cAAa;MACbC,gBAAe;MACfvC,OAAM;MACNwC,KAAK1B,KACFzC,KAAKgC,oBAAoBS;QAG9BK,EAAA;MAAOQ,SAAQ;OACZtD,KAAKsC,iBAAiBiB,KAAKS,wBAGhClB,EAAA;MAAKE,OAAM;OACTF,EAAA;MACEY,MAAK;MACLD,IAAG;MACHW,SAAQC,IAAArE,KAAKsE,uBAAiB,QAAAD,WAAA,aAAAA,EAAEE,KAAK;MACrCJ,KAAK1B,KAAOzC,KAAKc,YAAY2B;MAC7B+B,UAAUxE,KAAKgB;MACfgC,OAAM;MACNyB,UAAQ;QAEV3B,EAAA;MAAQ4B,SAAS1E,KAAKY;OACnBZ,KAAKsC,iBAAiBiB,KAAKoB,iBAE9B7B,EAAA;MACE4B,SAAS1E,KAAKoC;MACdwC,UAAU5E,KAAKM,cAAca,WAAW;OAEvCnB,KAAKsC,iBAAiBiB,KAAKsB,mBAAiB,MAC5C7E,KAAKM,cAAca,QAAM,SAMlC2B,EAAA;MAAQgC,MAAK;MAAaJ,SAAS1E,KAAK4B;OACrC5B,KAAKsC,iBAAiByC,OAAOC,gBAEhClC,EAAA;MAAQgC,MAAK;MAAaJ,SAAS1E,KAAKiF;OACrCjF,KAAKsC,iBAAiByC,OAAOG"}

package/dist/genexus-ide-ui/{p-f52bcdac.entry.js → p-0550fd5f.entry.js} RENAMED Viewed

@@ -1,6 +1,6 @@
 import { r as e, g as t, h as i, H as n, a as s } from "./p-25a9f1d7.js";
-import { L as o } from "./p-857866f8.js";
+import { L as o } from "./p-311eedf3.js";
 const r = ":host{--spacing-body-block-start:var(--mer-spacing--lg);--spacing-body-block-end:var(--mer-spacing--lg);--spacing-body-inline-start:var(--mer-spacing--md);--spacing-body-inline-end:var(--mer-spacing--md);display:grid;block-size:100%;overflow:auto;grid-template-rows:1fr max-content;background-color:var(--elevation-background-color, var(--mer-surface));color:var(--mer-text__on-elevation);text-align:center}.section{display:contents}.main{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px}.version__container{display:flex;justify-content:center;flex-direction:column;gap:var(--mer-spacing--xs)}.logo__container{display:flex;flex-direction:column;gap:var(--mer-spacing--sm);align-items:center;margin:unset}.logo__img{inline-size:28px;block-size:28px}.link-underlined{text-decoration:underline;color:var(--mer-text__on-elevation)}.link-underlined:hover{color:var(--mer-text__highlighted)}.link-underlined:active{color:var(--mer-text__elevation)}.links-container{display:flex;gap:var(--mer-spacing--xs)}.copyrights{color:var(--mer-text__complementary)}";
@@ -93,4 +93,4 @@ l = new WeakMap, d = new WeakMap;
 h.style = r;
 export { h as gx_ide_about };
-//# sourceMappingURL=p-f52bcdac.entry.js.map
+//# sourceMappingURL=p-0550fd5f.entry.js.map

package/dist/genexus-ide-ui/{p-e1d75f00.entry.js → p-05b04291.entry.js} RENAMED Viewed

@@ -134,7 +134,7 @@ const n = class {
          * Checks if this item parentElement is a gx-ide-list-selector, and assigns a reference
          */    this.evaluateParentIsListSelector = () => {
       const e = this.el.parentElement;
-      this.parentIsListSelector = e?.nodeName === "GX-IDE-LIST-SELECTOR";
+      this.parentIsListSelector = (e === null || e === void 0 ? void 0 : e.nodeName) === "GX-IDE-LIST-SELECTOR";
       this.parentIsListSelector && (this.parentList = e);
     };
     /**
@@ -262,4 +262,4 @@ const n = class {
 n.style = l;
 export { s as gx_ide_list_selector, n as gx_ide_list_selector_item };
-//# sourceMappingURL=p-e1d75f00.entry.js.map
+//# sourceMappingURL=p-05b04291.entry.js.map

package/dist/genexus-ide-ui/{p-e1d75f00.entry.js.map → p-05b04291.entry.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["listSelectorCss","GxIdeListSelector","this","evaluateChecked","allListItems","Array","from","el","querySelectorAll","checkedItems","filter","item","itemChecked","required","length","type","forEach","i","evaluateInitialValue","getChecked","value","itemValue","values","checked","push","allItems","clearPrevSelected","currentSelected","itemId","componentWillLoad","itemSelectionChangedHandler","event","stopPropagation","selectedItem","detail","checkedItemsInfo","newValue","itemIcon","icon","undefined","selectionChanged","emit","render","h","Host","exportparts","ordered","class","part","listSelectorItemCss","GxIdeListSelectorItem","hasUniversalSlot","index","evaluateParentIsListSelector","parentList","parentElement","parentIsListSelector","nodeName","evaluateType","evaluateSelectable","readonly","evaluateEllipsis","ellipsis","evaluateBorder","noBorder","noItemsBorder","evaluateUniversalSlot","querySelector","assignName","listName","name","evaluateOrderedList","children","indexOf","onChangeHandler","e","target","itemSelectionChanged","role","id","onChange","disabled","htmlFor","src"],"sources":["src/components/_helpers/list-selector/list-selector.scss?tag=gx-ide-list-selector&encapsulation=shadow","src/components/_helpers/list-selector/list-selector.tsx","src/components/_helpers/list-selector/list-selector-item/list-selector-item.scss?tag=gx-ide-list-selector-item","src/components/_helpers/list-selector/list-selector-item/list-selector-item.tsx"],"sourcesContent":["@import \"../../../global/reset.scss\";\n@import \"../../../global/gx-ide-mixins.scss\";\n@import \"../../../global/gx-ide-common.scss\";\n@include box-sizing;\n\n:host {\n display: flex;\n flex-direction: column;\n max-height: 100%;\n font-size: var(--item__font-size);\n}\n.list {\n @include reset-defaults;\n @include reset-list;\n @include base-component-styles;\n @include gxg-scrollbar;\n display: grid;\n background-color: var(--mer-color__surface);\n max-height: 100%;\n overflow-y: auto;\n gap: var(--mer-spacing--2xs);\n border-style: var(--items-container__border-style);\n border-width: var(--items-container__border-width);\n border-radius: var(--items-container__border-radius);\n background-color: var(--items-container__bg-color);\n border-color: var(--items-container__border-color);\n gap: var(--items-container__gap);\n padding-block: var(--items-container__padding-block);\n padding-inline: var(--items-container__padding-inline);\n}\n/no border/\n:host([no-list-border]) {\n .list {\n border: none;\n }\n}\n","// Stencil\nimport {\n Component,\n Host,\n h,\n Prop,\n Listen,\n // Watch,\n Element,\n Event,\n EventEmitter\n} from \"@stencil/core\";\n\n// Custom Imports\nimport { ItemData } from \"./list-selector-item/list-selector-item\";\n\n@Component({\n tag: \"gx-ide-list-selector\",\n styleUrl: \"list-selector.scss\",\n shadow: true\n})\nexport class GxIdeListSelector {\n @Element() el: HTMLGxIdeListSelectorElement;\n\n /*\n It determines if the list is ordered, or unordered\n /\n @Prop() readonly ordered: boolean = false;\n\n /\n Makes the list readonly\n /\n @Prop() readonly readonly: boolean = false;\n\n /\n It determines the type of list: single-selection or multi-selection\n /\n @Prop() readonly type: \"single-selection\" \| \"multi-selection\" =\n \"single-selection\";\n\n /\n Makes the list required\n /\n @Prop() readonly required: boolean = false;\n\n /\n The presence of this property will force all the items to not-wrap, and have ellipsis\n /\n @Prop() readonly ellipsis: boolean = false;\n\n /\n The value of the initial (or initials) checked list-item/s\n /\n @Prop({ mutable: true }) value: string \| string[];\n\n // @Watch(\"value\")\n // valueHandler(newValue: string) {\n // const foundItem = this.getItemByValue(newValue);\n // if (foundItem) {\n // const input = foundItem.querySelector(\"input\");\n // input.checked = true;\n // }\n // }\n\n /\n The name of this list. This is a required attribute for the list to work.\n /\n @Prop() readonly listName!: string;\n\n /\n Disables the items border\n /\n @Prop() readonly noItemsBorder: boolean = false;\n\n /\n Disables the list border\n /\n @Prop({ reflect: true }) readonly noListBorder: boolean = false;\n\n /\n Emits the actual selection\n /\n @Event() selectionChanged: EventEmitter<CheckedItemsInfo>;\n\n componentWillLoad() {\n this.evaluateChecked();\n this.evaluateInitialValue();\n }\n\n @Listen(\"itemSelectionChanged\", { capture: true })\n itemSelectionChangedHandler(event: CustomEvent<ItemData>) {\n event.stopPropagation();\n const selectedItem = event.detail;\n if (this.type === \"single-selection\") {\n this.clearPrevSelected(selectedItem);\n }\n const checkedItemsInfo: CheckedItemsInfo = [];\n const checkedItems: HTMLGxIdeListSelectorItemElement[] = this.getChecked();\n const newValue: string \| string[] = [];\n checkedItems.forEach(item => {\n const value = item.itemValue;\n newValue.push(value);\n checkedItemsInfo.push({\n itemId: item.itemId,\n itemValue: value,\n itemIcon: item.icon,\n itemChecked: true\n });\n });\n / update this.value/\n if (this.type === \"single-selection\" && newValue.length > 0) {\n this.value = newValue[0] \|\| undefined;\n } else {\n / multi-selection/\n this.value = newValue;\n }\n / emit selectionChanged/\n this.selectionChanged.emit(checkedItemsInfo);\n }\n\n /\n It evaluates the checked items, and checks or unchecks if needed\n /\n private evaluateChecked = () => {\n const allListItems = Array.from(\n this.el.querySelectorAll(\"gx-ide-list-selector-item\")\n );\n const checkedItems = allListItems.filter(item => item.itemChecked);\n /\n INDEX\n * 1.required and no one checked\n * 2.single-selection, and more than one checked\n /\n\n / 1.required and no one checked/\n if (this.required && checkedItems.length === 0) {\n allListItems[0].itemChecked = true;\n } else if (this.type === \"single-selection\" && checkedItems.length > 1) {\n / 2.single-selection, and more than one checked/\n checkedItems.forEach((item, i) => {\n if (i !== 0) {\n item.itemChecked = false;\n }\n });\n }\n };\n\n /\n It evaluates the initial value/s\n /\n private evaluateInitialValue = () => {\n const checkedItems = this.getChecked();\n if (this.type === \"single-selection\" && checkedItems.length > 0) {\n this.value = checkedItems[0].itemValue;\n } else if (this.type === \"multi-selection\" && checkedItems.length > 0) {\n const values: string[] = [];\n checkedItems.forEach(checked => {\n values.push(checked.itemValue);\n });\n this.value = values;\n }\n };\n\n private getChecked = (): HTMLGxIdeListSelectorItemElement[] => {\n const checkedItems: HTMLGxIdeListSelectorItemElement[] = [];\n const allItems = this.el.querySelectorAll(\"gx-ide-list-selector-item\");\n allItems.forEach(item => {\n if (item.itemChecked) {\n checkedItems.push(item);\n }\n });\n return checkedItems;\n };\n\n private clearPrevSelected = (currentSelected: ItemData) => {\n const allItems = this.el.querySelectorAll(\"gx-ide-list-selector-item\");\n allItems.forEach(item => {\n if (item.itemChecked && item.itemId !== currentSelected.itemId) {\n item.itemChecked = false;\n }\n });\n };\n\n render() {\n return (\n <Host exportparts=\"input:input\">\n {this.ordered ? (\n <ol class=\"list\" part=\"list\">\n <slot></slot>\n </ol>\n ) : (\n <ul class=\"list\" part=\"list\">\n <slot></slot>\n </ul>\n )}\n </Host>\n );\n }\n}\n\nexport type CheckedItemsInfo = ItemData[];\n","@import \"../../../../global/gx-ide-mixins.scss\";\n@import \"../../../../../node_modules/@genexus/mercury/dist/assets/scss/helpers.scss\";\n\n@include box-sizing;\n\ngx-ide-list-selector-item {\n display: block;\n max-width: 100%;\n display: flex;\n font-size: inherit;\n font-weight: var(--item__font-weight);\n\n &:hover {\n .label {\n background-color: var(--item__bg-color--hover);\n cursor: pointer;\n }\n input:checked + .label {\n border-color: var(--item__border-color--selected-hover);\n }\n }\n}\n\n/readonly/\ngx-ide-list-selector-item[readonly]:not([readonly=\"false\"]) {\n .label {\n pointer-events: none;\n background-color: transparent;\n }\n}\n/ellipsis/\ngx-ide-list-selector-item[ellipsis]:not([ellipsis=\"false\"]) {\n .label {\n &__description {\n @include ellipsis;\n }\n }\n}\n\ngx-ide-list-selector-item input {\n width: 0;\n height: 0;\n opacity: 0;\n margin: 0;\n\n &:focus + .label {\n @include focus-outline();\n }\n &:checked + .label {\n background-color: var(--item__bg-color--selected);\n color: var(--item__color--selected);\n border-color: var(--item__border-color--selected);\n }\n}\n\n/label-wrapper/\ngx-ide-list-selector-item .label {\n width: 100%;\n border: 1px solid transparent;\n border-radius: var(--item__border-radius);\n}\n\n/label/\ngx-ide-list-selector-item .label {\n &__index {\n }\n &__wrapper {\n display: flex;\n min-height: 28px; /this prevents height difference between items that have icons and items that do not/\n align-items: center;\n gap: var(--mer-spacing--xs);\n padding: var(--mer-spacing--2xs) var(--mer-spacing--xs);\n width: 100%;\n }\n &__description {\n flex: 1;\n display: flex;\n align-items: center;\n gap: var(--mer-spacing--xs);\n }\n}\n\n/no border/\ngx-ide-list-selector-item[no-border] {\n border-block-start: none;\n}\n\n/universal slot/\ngx-ide-list-selector-item .label__universal-slot {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n","// Stencil\nimport {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Element\n} from \"@stencil/core\";\n\n@Component({\n tag: \"gx-ide-list-selector-item\",\n styleUrl: \"list-selector-item.scss\",\n shadow: false\n})\nexport class GxIdeListSelectorItem {\n // 1.OWN PROPERTIES \| WATCH'S //\n\n private parentIsListSelector: boolean;\n private parentList: HTMLGxIdeListSelectorElement;\n private checked: boolean;\n private name: string;\n private type: string;\n private hasUniversalSlot = false;\n private index: string = undefined;\n\n // 2. REFERENCE TO ELEMENTS //\n\n @Element() el: HTMLGxIdeListSelectorItemElement;\n\n // 3.STATE() VARIABLES //\n\n // 4.PUBLIC PROPERTY API \| WATCH'S //\n\n /\n The item id\n /\n @Prop({ reflect: true }) readonly itemId!: string;\n\n /\n The item value, that acts as a label as well\n /\n @Prop() readonly itemValue!: string;\n\n /\n This will set the input as checked\n /\n @Prop({ mutable: true }) itemChecked = false;\n\n /\n It allows to select the item by clicking on it. It will emit the item-id\n /\n @Prop({ mutable: true, reflect: true }) readonly: boolean;\n\n /\n The presence of this property will force the item text to not-wrap, and have ellipsis\n /\n @Prop({ mutable: true, reflect: true }) ellipsis: boolean;\n\n /\n The gemini icon name\n /\n @Prop() readonly icon: string;\n\n /\n Disables the item border\n /\n @Prop({ mutable: true, reflect: true }) noBorder = false;\n\n /\n Displays the universal slot at the end, instead of at the benign\n /\n @Prop({ reflect: true }) readonly universalSlotEnd = false;\n\n // 5.EVENTS (EMIT) //\n\n componentWillLoad() {\n this.evaluateParentIsListSelector();\n this.evaluateType();\n this.evaluateSelectable();\n this.evaluateEllipsis();\n this.evaluateChecked();\n this.evaluateBorder();\n this.evaluateUniversalSlot();\n this.assignName();\n this.evaluateOrderedList();\n }\n\n /\n Emits the item data\n /\n @Event() itemSelectionChanged: EventEmitter<ItemData>;\n\n // 6.COMPONENT LIFECYCLE METHODS //\n\n // 7.LISTENERS //\n\n // 8.PUBLIC METHODS API //\n\n // 9.LOCAL METHODS //\n\n /\n Checks if this item parentElement is a gx-ide-list-selector, and assigns a reference\n /\n private evaluateParentIsListSelector = () => {\n const parentList = this.el.parentElement as HTMLGxIdeListSelectorElement;\n this.parentIsListSelector = parentList?.nodeName === \"GX-IDE-LIST-SELECTOR\";\n this.parentIsListSelector && (this.parentList = parentList);\n };\n\n /\n Determines the type of item, based on the parent list-selector 'type' property value\n /\n private evaluateType = () => {\n const parentList: HTMLGxIdeListSelectorElement = this.el\n .parentElement as HTMLGxIdeListSelectorElement;\n this.type = parentList.type === \"single-selection\" ? \"radio\" : \"checkbox\";\n };\n\n /\n Evaluates if is selectable, considering the parent list-selector 'selectable' property value, only if it is undefined on this item\n /\n private evaluateSelectable = () => {\n if (this.readonly === undefined && this.parentIsListSelector) {\n this.readonly = this.parentList.readonly;\n }\n };\n\n /\n Evaluates if text should truncate with ellipsis, considering the parent list-selector 'ellipsis' property value, only if it is undefined on this item\n /\n private evaluateEllipsis = () => {\n if (this.ellipsis === undefined && this.parentIsListSelector) {\n this.ellipsis = this.parentList.ellipsis;\n }\n };\n\n /\n Evaluates if this item should be initially checked, only if the parent list-selector listValue equals this item value.\n /\n private evaluateChecked = () => {\n if (\n this.checked === undefined &&\n this.parentIsListSelector &&\n this.parentList.value !== undefined &&\n this.parentList.value === this.itemValue\n ) {\n this.checked = true;\n }\n };\n\n private evaluateBorder = () => {\n if (this.parentIsListSelector) {\n this.noBorder = this.parentList.noItemsBorder;\n }\n };\n\n private evaluateUniversalSlot = () => {\n this.hasUniversalSlot = !!this.el.querySelector(\"[slot=universal]\");\n };\n\n /\n Gets the listName required value, that is needed for the list selection to properly work\n */\n private assignName = () => {\n this.parentIsListSelector &&\n this.parentList.listName &&\n (this.name = this.parentList.listName);\n };\n\n private evaluateOrderedList = () => {\n if (this.parentIsListSelector && this.parentList.ordered) {\n let index: number \| string =\n Array.from(this.parentList.children).indexOf(this.el) + 1;\n if (index < 10) {\n // This will make descriptions to be nicely aligned, between one digit, and two digit indexes items.\n index = `0${index}`;\n } else {\n index = `${index}`;\n }\n this.index = index;\n }\n };\n\n private onChangeHandler = (e: Event) => {\n this.itemChecked = (e.target as HTMLInputElement).checked;\n this.itemSelectionChanged.emit({\n itemId: this.itemId,\n itemValue: this.itemValue,\n itemIcon: this.icon,\n itemChecked: this.itemChecked\n });\n };\n\n // 10.RENDER() FUNCTION //\n\n render() {\n return (\n <Host role=\"listitem\">\n <input\n type={this.type}\n id={this.itemId}\n name={this.name}\n value={this.itemValue}\n checked={this.itemChecked}\n onChange={this.onChangeHandler}\n disabled={this.readonly}\n part=\"input\"\n />\n <label class=\"label\" htmlFor={this.itemId} part=\"label\">\n <div class=\"label__wrapper\">\n {this.index ? (\n <span class=\"label__index\">{this.index}. </span>\n ) : null}\n {this.hasUniversalSlot ? (\n <span class=\"label__universal-slot\" part=\"universal-slot\">\n <slot name=\"universal\"></slot>\n </span>\n ) : null}\n {this.icon ? (\n <ch-image class=\"icon-md\" src={this.icon} part=\"icon\"></ch-image>\n ) : null}\n <span class=\"label__description\" part=\"description\">\n {this.itemValue ? this.itemValue : <slot></slot>}\n </span>\n </div>\n </label>\n </Host>\n );\n }\n}\n\nexport type ItemData = {\n itemId: string;\n itemValue: string;\n itemIcon?: string;\n itemChecked: boolean;\n};\n"],"mappings":"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"}
1	+ {"version":3,"names":["listSelectorCss","GxIdeListSelector","this","evaluateChecked","allListItems","Array","from","el","querySelectorAll","checkedItems","filter","item","itemChecked","required","length","type","forEach","i","evaluateInitialValue","getChecked","value","itemValue","values","checked","push","allItems","clearPrevSelected","currentSelected","itemId","componentWillLoad","itemSelectionChangedHandler","event","stopPropagation","selectedItem","detail","checkedItemsInfo","newValue","itemIcon","icon","undefined","selectionChanged","emit","render","h","Host","exportparts","ordered","class","part","listSelectorItemCss","GxIdeListSelectorItem","hasUniversalSlot","index","evaluateParentIsListSelector","parentList","parentElement","parentIsListSelector","nodeName","evaluateType","evaluateSelectable","readonly","evaluateEllipsis","ellipsis","evaluateBorder","noBorder","noItemsBorder","evaluateUniversalSlot","querySelector","assignName","listName","name","evaluateOrderedList","children","indexOf","onChangeHandler","e","target","itemSelectionChanged","role","id","onChange","disabled","htmlFor","src"],"sources":["src/components/_helpers/list-selector/list-selector.scss?tag=gx-ide-list-selector&encapsulation=shadow","src/components/_helpers/list-selector/list-selector.tsx","src/components/_helpers/list-selector/list-selector-item/list-selector-item.scss?tag=gx-ide-list-selector-item","src/components/_helpers/list-selector/list-selector-item/list-selector-item.tsx"],"sourcesContent":["@import \"../../../global/reset.scss\";\n@import \"../../../global/gx-ide-mixins.scss\";\n@import \"../../../global/gx-ide-common.scss\";\n@include box-sizing;\n\n:host {\n display: flex;\n flex-direction: column;\n max-height: 100%;\n font-size: var(--item__font-size);\n}\n.list {\n @include reset-defaults;\n @include reset-list;\n @include base-component-styles;\n @include gxg-scrollbar;\n display: grid;\n background-color: var(--mer-color__surface);\n max-height: 100%;\n overflow-y: auto;\n gap: var(--mer-spacing--2xs);\n border-style: var(--items-container__border-style);\n border-width: var(--items-container__border-width);\n border-radius: var(--items-container__border-radius);\n background-color: var(--items-container__bg-color);\n border-color: var(--items-container__border-color);\n gap: var(--items-container__gap);\n padding-block: var(--items-container__padding-block);\n padding-inline: var(--items-container__padding-inline);\n}\n/no border/\n:host([no-list-border]) {\n .list {\n border: none;\n }\n}\n","// Stencil\nimport {\n Component,\n Host,\n h,\n Prop,\n Listen,\n // Watch,\n Element,\n Event,\n EventEmitter\n} from \"@stencil/core\";\n\n// Custom Imports\nimport { ItemData } from \"./list-selector-item/list-selector-item\";\n\n@Component({\n tag: \"gx-ide-list-selector\",\n styleUrl: \"list-selector.scss\",\n shadow: true\n})\nexport class GxIdeListSelector {\n @Element() el: HTMLGxIdeListSelectorElement;\n\n /*\n It determines if the list is ordered, or unordered\n /\n @Prop() readonly ordered: boolean = false;\n\n /\n Makes the list readonly\n /\n @Prop() readonly readonly: boolean = false;\n\n /\n It determines the type of list: single-selection or multi-selection\n /\n @Prop() readonly type: \"single-selection\" \| \"multi-selection\" =\n \"single-selection\";\n\n /\n Makes the list required\n /\n @Prop() readonly required: boolean = false;\n\n /\n The presence of this property will force all the items to not-wrap, and have ellipsis\n /\n @Prop() readonly ellipsis: boolean = false;\n\n /\n The value of the initial (or initials) checked list-item/s\n /\n @Prop({ mutable: true }) value: string \| string[];\n\n // @Watch(\"value\")\n // valueHandler(newValue: string) {\n // const foundItem = this.getItemByValue(newValue);\n // if (foundItem) {\n // const input = foundItem.querySelector(\"input\");\n // input.checked = true;\n // }\n // }\n\n /\n The name of this list. This is a required attribute for the list to work.\n /\n @Prop() readonly listName!: string;\n\n /\n Disables the items border\n /\n @Prop() readonly noItemsBorder: boolean = false;\n\n /\n Disables the list border\n /\n @Prop({ reflect: true }) readonly noListBorder: boolean = false;\n\n /\n Emits the actual selection\n /\n @Event() selectionChanged: EventEmitter<CheckedItemsInfo>;\n\n componentWillLoad() {\n this.evaluateChecked();\n this.evaluateInitialValue();\n }\n\n @Listen(\"itemSelectionChanged\", { capture: true })\n itemSelectionChangedHandler(event: CustomEvent<ItemData>) {\n event.stopPropagation();\n const selectedItem = event.detail;\n if (this.type === \"single-selection\") {\n this.clearPrevSelected(selectedItem);\n }\n const checkedItemsInfo: CheckedItemsInfo = [];\n const checkedItems: HTMLGxIdeListSelectorItemElement[] = this.getChecked();\n const newValue: string \| string[] = [];\n checkedItems.forEach(item => {\n const value = item.itemValue;\n newValue.push(value);\n checkedItemsInfo.push({\n itemId: item.itemId,\n itemValue: value,\n itemIcon: item.icon,\n itemChecked: true\n });\n });\n / update this.value/\n if (this.type === \"single-selection\" && newValue.length > 0) {\n this.value = newValue[0] \|\| undefined;\n } else {\n / multi-selection/\n this.value = newValue;\n }\n / emit selectionChanged/\n this.selectionChanged.emit(checkedItemsInfo);\n }\n\n /\n It evaluates the checked items, and checks or unchecks if needed\n /\n private evaluateChecked = () => {\n const allListItems = Array.from(\n this.el.querySelectorAll(\"gx-ide-list-selector-item\")\n );\n const checkedItems = allListItems.filter(item => item.itemChecked);\n /\n INDEX\n * 1.required and no one checked\n * 2.single-selection, and more than one checked\n /\n\n / 1.required and no one checked/\n if (this.required && checkedItems.length === 0) {\n allListItems[0].itemChecked = true;\n } else if (this.type === \"single-selection\" && checkedItems.length > 1) {\n / 2.single-selection, and more than one checked/\n checkedItems.forEach((item, i) => {\n if (i !== 0) {\n item.itemChecked = false;\n }\n });\n }\n };\n\n /\n It evaluates the initial value/s\n /\n private evaluateInitialValue = () => {\n const checkedItems = this.getChecked();\n if (this.type === \"single-selection\" && checkedItems.length > 0) {\n this.value = checkedItems[0].itemValue;\n } else if (this.type === \"multi-selection\" && checkedItems.length > 0) {\n const values: string[] = [];\n checkedItems.forEach(checked => {\n values.push(checked.itemValue);\n });\n this.value = values;\n }\n };\n\n private getChecked = (): HTMLGxIdeListSelectorItemElement[] => {\n const checkedItems: HTMLGxIdeListSelectorItemElement[] = [];\n const allItems = this.el.querySelectorAll(\"gx-ide-list-selector-item\");\n allItems.forEach(item => {\n if (item.itemChecked) {\n checkedItems.push(item);\n }\n });\n return checkedItems;\n };\n\n private clearPrevSelected = (currentSelected: ItemData) => {\n const allItems = this.el.querySelectorAll(\"gx-ide-list-selector-item\");\n allItems.forEach(item => {\n if (item.itemChecked && item.itemId !== currentSelected.itemId) {\n item.itemChecked = false;\n }\n });\n };\n\n render() {\n return (\n <Host exportparts=\"input:input\">\n {this.ordered ? (\n <ol class=\"list\" part=\"list\">\n <slot></slot>\n </ol>\n ) : (\n <ul class=\"list\" part=\"list\">\n <slot></slot>\n </ul>\n )}\n </Host>\n );\n }\n}\n\nexport type CheckedItemsInfo = ItemData[];\n","@import \"../../../../global/gx-ide-mixins.scss\";\n@import \"../../../../../node_modules/@genexus/mercury/dist/assets/scss/helpers.scss\";\n\n@include box-sizing;\n\ngx-ide-list-selector-item {\n display: block;\n max-width: 100%;\n display: flex;\n font-size: inherit;\n font-weight: var(--item__font-weight);\n\n &:hover {\n .label {\n background-color: var(--item__bg-color--hover);\n cursor: pointer;\n }\n input:checked + .label {\n border-color: var(--item__border-color--selected-hover);\n }\n }\n}\n\n/readonly/\ngx-ide-list-selector-item[readonly]:not([readonly=\"false\"]) {\n .label {\n pointer-events: none;\n background-color: transparent;\n }\n}\n/ellipsis/\ngx-ide-list-selector-item[ellipsis]:not([ellipsis=\"false\"]) {\n .label {\n &__description {\n @include ellipsis;\n }\n }\n}\n\ngx-ide-list-selector-item input {\n width: 0;\n height: 0;\n opacity: 0;\n margin: 0;\n\n &:focus + .label {\n @include focus-outline();\n }\n &:checked + .label {\n background-color: var(--item__bg-color--selected);\n color: var(--item__color--selected);\n border-color: var(--item__border-color--selected);\n }\n}\n\n/label-wrapper/\ngx-ide-list-selector-item .label {\n width: 100%;\n border: 1px solid transparent;\n border-radius: var(--item__border-radius);\n}\n\n/label/\ngx-ide-list-selector-item .label {\n &__index {\n }\n &__wrapper {\n display: flex;\n min-height: 28px; /this prevents height difference between items that have icons and items that do not/\n align-items: center;\n gap: var(--mer-spacing--xs);\n padding: var(--mer-spacing--2xs) var(--mer-spacing--xs);\n width: 100%;\n }\n &__description {\n flex: 1;\n display: flex;\n align-items: center;\n gap: var(--mer-spacing--xs);\n }\n}\n\n/no border/\ngx-ide-list-selector-item[no-border] {\n border-block-start: none;\n}\n\n/universal slot/\ngx-ide-list-selector-item .label__universal-slot {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n","// Stencil\nimport {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Element\n} from \"@stencil/core\";\n\n@Component({\n tag: \"gx-ide-list-selector-item\",\n styleUrl: \"list-selector-item.scss\",\n shadow: false\n})\nexport class GxIdeListSelectorItem {\n // 1.OWN PROPERTIES \| WATCH'S //\n\n private parentIsListSelector: boolean;\n private parentList: HTMLGxIdeListSelectorElement;\n private checked: boolean;\n private name: string;\n private type: string;\n private hasUniversalSlot = false;\n private index: string = undefined;\n\n // 2. REFERENCE TO ELEMENTS //\n\n @Element() el: HTMLGxIdeListSelectorItemElement;\n\n // 3.STATE() VARIABLES //\n\n // 4.PUBLIC PROPERTY API \| WATCH'S //\n\n /\n The item id\n /\n @Prop({ reflect: true }) readonly itemId!: string;\n\n /\n The item value, that acts as a label as well\n /\n @Prop() readonly itemValue!: string;\n\n /\n This will set the input as checked\n /\n @Prop({ mutable: true }) itemChecked = false;\n\n /\n It allows to select the item by clicking on it. It will emit the item-id\n /\n @Prop({ mutable: true, reflect: true }) readonly: boolean;\n\n /\n The presence of this property will force the item text to not-wrap, and have ellipsis\n /\n @Prop({ mutable: true, reflect: true }) ellipsis: boolean;\n\n /\n The gemini icon name\n /\n @Prop() readonly icon: string;\n\n /\n Disables the item border\n /\n @Prop({ mutable: true, reflect: true }) noBorder = false;\n\n /\n Displays the universal slot at the end, instead of at the benign\n /\n @Prop({ reflect: true }) readonly universalSlotEnd = false;\n\n // 5.EVENTS (EMIT) //\n\n componentWillLoad() {\n this.evaluateParentIsListSelector();\n this.evaluateType();\n this.evaluateSelectable();\n this.evaluateEllipsis();\n this.evaluateChecked();\n this.evaluateBorder();\n this.evaluateUniversalSlot();\n this.assignName();\n this.evaluateOrderedList();\n }\n\n /\n Emits the item data\n /\n @Event() itemSelectionChanged: EventEmitter<ItemData>;\n\n // 6.COMPONENT LIFECYCLE METHODS //\n\n // 7.LISTENERS //\n\n // 8.PUBLIC METHODS API //\n\n // 9.LOCAL METHODS //\n\n /\n Checks if this item parentElement is a gx-ide-list-selector, and assigns a reference\n /\n private evaluateParentIsListSelector = () => {\n const parentList = this.el.parentElement as HTMLGxIdeListSelectorElement;\n this.parentIsListSelector = parentList?.nodeName === \"GX-IDE-LIST-SELECTOR\";\n this.parentIsListSelector && (this.parentList = parentList);\n };\n\n /\n Determines the type of item, based on the parent list-selector 'type' property value\n /\n private evaluateType = () => {\n const parentList: HTMLGxIdeListSelectorElement = this.el\n .parentElement as HTMLGxIdeListSelectorElement;\n this.type = parentList.type === \"single-selection\" ? \"radio\" : \"checkbox\";\n };\n\n /\n Evaluates if is selectable, considering the parent list-selector 'selectable' property value, only if it is undefined on this item\n /\n private evaluateSelectable = () => {\n if (this.readonly === undefined && this.parentIsListSelector) {\n this.readonly = this.parentList.readonly;\n }\n };\n\n /\n Evaluates if text should truncate with ellipsis, considering the parent list-selector 'ellipsis' property value, only if it is undefined on this item\n /\n private evaluateEllipsis = () => {\n if (this.ellipsis === undefined && this.parentIsListSelector) {\n this.ellipsis = this.parentList.ellipsis;\n }\n };\n\n /\n Evaluates if this item should be initially checked, only if the parent list-selector listValue equals this item value.\n /\n private evaluateChecked = () => {\n if (\n this.checked === undefined &&\n this.parentIsListSelector &&\n this.parentList.value !== undefined &&\n this.parentList.value === this.itemValue\n ) {\n this.checked = true;\n }\n };\n\n private evaluateBorder = () => {\n if (this.parentIsListSelector) {\n this.noBorder = this.parentList.noItemsBorder;\n }\n };\n\n private evaluateUniversalSlot = () => {\n this.hasUniversalSlot = !!this.el.querySelector(\"[slot=universal]\");\n };\n\n /\n Gets the listName required value, that is needed for the list selection to properly work\n */\n private assignName = () => {\n this.parentIsListSelector &&\n this.parentList.listName &&\n (this.name = this.parentList.listName);\n };\n\n private evaluateOrderedList = () => {\n if (this.parentIsListSelector && this.parentList.ordered) {\n let index: number \| string =\n Array.from(this.parentList.children).indexOf(this.el) + 1;\n if (index < 10) {\n // This will make descriptions to be nicely aligned, between one digit, and two digit indexes items.\n index = `0${index}`;\n } else {\n index = `${index}`;\n }\n this.index = index;\n }\n };\n\n private onChangeHandler = (e: Event) => {\n this.itemChecked = (e.target as HTMLInputElement).checked;\n this.itemSelectionChanged.emit({\n itemId: this.itemId,\n itemValue: this.itemValue,\n itemIcon: this.icon,\n itemChecked: this.itemChecked\n });\n };\n\n // 10.RENDER() FUNCTION //\n\n render() {\n return (\n <Host role=\"listitem\">\n <input\n type={this.type}\n id={this.itemId}\n name={this.name}\n value={this.itemValue}\n checked={this.itemChecked}\n onChange={this.onChangeHandler}\n disabled={this.readonly}\n part=\"input\"\n />\n <label class=\"label\" htmlFor={this.itemId} part=\"label\">\n <div class=\"label__wrapper\">\n {this.index ? (\n <span class=\"label__index\">{this.index}. </span>\n ) : null}\n {this.hasUniversalSlot ? (\n <span class=\"label__universal-slot\" part=\"universal-slot\">\n <slot name=\"universal\"></slot>\n </span>\n ) : null}\n {this.icon ? (\n <ch-image class=\"icon-md\" src={this.icon} part=\"icon\"></ch-image>\n ) : null}\n <span class=\"label__description\" part=\"description\">\n {this.itemValue ? this.itemValue : <slot></slot>}\n </span>\n </div>\n </label>\n </Host>\n );\n }\n}\n\nexport type ItemData = {\n itemId: string;\n itemValue: string;\n itemIcon?: string;\n itemChecked: boolean;\n};\n"],"mappings":"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"}