@alfresco/adf-process-services-cloud 8.4.0-18001505377 → 8.4.0-18005413718

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.
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { EventEmitter, Output, Input, ViewEncapsulation, Component, Injectable, ContentChild, inject, DestroyRef, Directive, InjectionToken, Inject, NgModule, ViewChild, Optional, ChangeDetectorRef, HostListener, ViewContainerRef, ChangeDetectionStrategy, signal, computed, SecurityContext } from '@angular/core';
2
+ import { EventEmitter, Output, Input, ViewEncapsulation, Component, Injectable, ContentChild, inject, DestroyRef, Directive, InjectionToken, Inject, NgModule, ViewChild, Optional, ChangeDetectorRef, HostListener, ViewContainerRef, ChangeDetectionStrategy, SecurityContext } from '@angular/core';
3
3
  import * as i1$1 from '@alfresco/adf-core';
4
4
  import { EmptyContentComponent, CustomEmptyContentTemplateDirective, AppConfigService, JwtHelperService, TranslationService, DataTableSchema, UserPreferenceValues, ObjectDataTableAdapter, ColumnsSelectorComponent, MainMenuDataTableTemplateDirective, NoContentTemplateDirective, LoadingContentTemplateDirective, DataTableComponent, AdfDateFnsAdapter, MOMENT_DATE_FORMATS, IconComponent, UserPreferencesService, DateFnsUtils, ADF_DATE_FORMATS, FullNamePipe, InitialUsernamePipe, FormModel, FormService, FormBaseComponent, WidgetVisibilityService, UploadWidgetContentLinkModel, FormEvent, FormOutcomeModel, ConfirmDialogComponent, FormOutcomeEvent, FormatSpacePipe, FormRendererComponent, ToolbarDividerComponent, ToolbarComponent, WidgetComponent, ThumbnailService, NotificationService, ErrorWidgetComponent, LocalizedDatePipe, UploadDirective, ContentLinkModel, ErrorMessageModel, DEFAULT_DATE_FORMAT, FormFieldEvent, FormFieldTypes, SelectFilterInputComponent, DynamicComponentMapper, CardViewTextItemModel, CardViewSelectItemModel, CardViewDatetimeItemModel, CardViewDateItemModel, CardViewArrayItemModel, CardViewComponent, CustomLoadingContentTemplateDirective, isOutcomeButtonVisible, InplaceFormInputComponent, BaseViewerWidgetComponent, ObjectDataColumn, ObjectDataRow, FormBaseModule, FormRenderingService, provideTranslations } from '@alfresco/adf-core';
5
5
  import * as i2 from '@angular/common';
@@ -13339,7 +13339,7 @@ class StartProcessCloudComponent {
13339
13339
  }
13340
13340
  }
13341
13341
  get disableStartButton() {
13342
- return !this.appName || !this.processDefinition.valid || this.isProcessStarting || this.isFormCloudLoading();
13342
+ return !this.appName || !this.processDefinition.valid || this.isProcessStarting || this.processDefinitionLoaded === false;
13343
13343
  }
13344
13344
  get isProcessDefinitionsEmpty() {
13345
13345
  return !this.processDefinitionList.length;
@@ -13391,9 +13391,8 @@ class StartProcessCloudComponent {
13391
13391
  this.staticMappings = [];
13392
13392
  this.isProcessStarting = false;
13393
13393
  this.isFormCloudLoaded = false;
13394
- this.isFormCloudLoading = signal(true);
13395
- this.processDefinitionLoaded = signal(false);
13396
- this.showStartProcess = computed(() => this.processDefinitionLoaded() && !this.isFormCloudLoading());
13394
+ this.isFormCloudLoading = true;
13395
+ this.processDefinitionLoaded = false;
13397
13396
  this.processForm = new FormGroup({
13398
13397
  processInstanceName: new FormControl('', [
13399
13398
  Validators.required,
@@ -13454,48 +13453,54 @@ class StartProcessCloudComponent {
13454
13453
  }
13455
13454
  selectProcessDefinitionByProcessDefinitionName(processDefinitionName) {
13456
13455
  this.filteredProcesses = this.getProcessDefinitionListByNameOrKey(processDefinitionName);
13457
- this.isFormCloudLoading.set(this.isProcessFormValid && this.filteredProcesses && this.filteredProcesses.length === 1);
13456
+ this.isFormCloudLoading = this.isProcessFormValid && this.filteredProcesses && this.filteredProcesses.length === 1;
13458
13457
  if (this.isFormCloudLoading) {
13459
13458
  this.setProcessDefinitionOnForm(this.filteredProcesses[0].name);
13460
13459
  }
13461
13460
  }
13462
- setProcessDefinitionOnForm(selectedProcessDefinitionName) {
13463
- this.isFormCloudLoading.set(true);
13464
- const processDefinitionCurrent = this.filteredProcesses.find((process) => process.name === selectedProcessDefinitionName || process.key === selectedProcessDefinitionName);
13465
- forkJoin([
13461
+ fetchStaticVariablesAndConstants(selectedProcessDefinitionName) {
13462
+ const processDefinitionCurrent = this.selectProcessDefinition(selectedProcessDefinitionName);
13463
+ return forkJoin([
13466
13464
  this.startProcessCloudService
13467
13465
  .getStartEventFormStaticValuesMapping(this.appName, processDefinitionCurrent.id)
13468
13466
  .pipe(catchError(() => of([]))),
13469
13467
  this.startProcessCloudService
13470
13468
  .getStartEventConstants(this.appName, processDefinitionCurrent.id)
13471
13469
  .pipe(catchError(() => of([])))
13472
- ]).subscribe({
13473
- next: ([staticMappings, constants]) => {
13474
- this.staticMappings = staticMappings;
13475
- this.resolvedValues = this.staticMappings.concat(this.values || []);
13476
- this.processDefinitionCurrent = processDefinitionCurrent;
13477
- const displayStart = constants?.find((constant) => constant.name === 'startEnabled');
13478
- const startLabel = constants?.find((constant) => constant.name === 'startLabel');
13479
- const displayCancel = constants?.find((constant) => constant.name === 'cancelEnabled');
13480
- const cancelLabel = constants?.find((constant) => constant.name === 'cancelLabel');
13481
- if (displayStart) {
13482
- this.displayStartSubject.next(displayStart?.value);
13483
- }
13484
- if (startLabel) {
13485
- this.startProcessButtonLabel =
13486
- startLabel?.value?.trim()?.length > 0 ? startLabel.value.trim() : this.defaultStartProcessButtonLabel;
13487
- }
13488
- if (displayCancel) {
13489
- this.showCancelButton = displayCancel?.value === 'true' && this.showCancelButton;
13490
- }
13491
- if (cancelLabel) {
13492
- this.cancelButtonLabel = cancelLabel?.value?.trim()?.length > 0 ? cancelLabel.value.trim() : this.defaultCancelProcessButtonLabel;
13493
- }
13494
- this.isFormCloudLoading.set(false);
13495
- }
13470
+ ]);
13471
+ }
13472
+ onFetchStaticVariablesAndConstants([staticMappings, constants]) {
13473
+ this.staticMappings = staticMappings;
13474
+ this.resolvedValues = this.staticMappings.concat(this.values || []);
13475
+ const displayStart = constants?.find((constant) => constant.name === 'startEnabled');
13476
+ const startLabel = constants?.find((constant) => constant.name === 'startLabel');
13477
+ const displayCancel = constants?.find((constant) => constant.name === 'cancelEnabled');
13478
+ const cancelLabel = constants?.find((constant) => constant.name === 'cancelLabel');
13479
+ if (displayStart) {
13480
+ this.displayStartSubject.next(displayStart?.value);
13481
+ }
13482
+ if (startLabel) {
13483
+ this.startProcessButtonLabel = startLabel?.value?.trim()?.length > 0 ? startLabel.value.trim() : this.defaultStartProcessButtonLabel;
13484
+ }
13485
+ if (displayCancel) {
13486
+ this.showCancelButton = displayCancel?.value === 'true' && this.showCancelButton;
13487
+ }
13488
+ if (cancelLabel) {
13489
+ this.cancelButtonLabel = cancelLabel?.value?.trim()?.length > 0 ? cancelLabel.value.trim() : this.defaultCancelProcessButtonLabel;
13490
+ }
13491
+ this.isFormCloudLoading = false;
13492
+ }
13493
+ setProcessDefinitionOnForm(selectedProcessDefinitionName) {
13494
+ // this.isFormCloudLoading = true;
13495
+ this.fetchStaticVariablesAndConstants(selectedProcessDefinitionName).subscribe({
13496
+ next: ([staticMappings, constants]) => this.onFetchStaticVariablesAndConstants([staticMappings, constants])
13496
13497
  });
13497
- this.isFormCloudLoaded = false;
13498
- this.processPayloadCloud.processDefinitionKey = processDefinitionCurrent.key;
13498
+ // this.isFormCloudLoaded = false;
13499
+ this.processPayloadCloud.processDefinitionKey = this.processDefinitionCurrent.key;
13500
+ }
13501
+ selectProcessDefinition(keyOrName) {
13502
+ this.processDefinitionCurrent = this.filteredProcesses.find((process) => process.name === keyOrName || process.key === keyOrName);
13503
+ return this.processDefinitionCurrent;
13499
13504
  }
13500
13505
  getProcessDefinitionListByNameOrKey(processDefinitionName) {
13501
13506
  return this.processDefinitionList.filter((processDefinitionCloud) => !processDefinitionName || this.getProcessDefinition(processDefinitionCloud, processDefinitionName));
@@ -13520,34 +13525,62 @@ class StartProcessCloudComponent {
13520
13525
  }
13521
13526
  loadProcessDefinitions() {
13522
13527
  this.resetErrorMessage();
13528
+ debugger;
13523
13529
  this.startProcessCloudService
13524
13530
  .getProcessDefinitions(this.appName)
13525
- .pipe(takeUntilDestroyed(this.destroyRef))
13526
- .subscribe({
13527
- next: (processDefinitionRepresentations) => {
13528
- this.processDefinitionList = processDefinitionRepresentations;
13529
- if (processDefinitionRepresentations.length === 1) {
13530
- this.selectDefaultProcessDefinition();
13531
- }
13532
- else if (this.processDefinitionName) {
13533
- this.processDefinition.setValue(this.processDefinitionName);
13534
- const processDefinition = this.processDefinitionList.find((process) => process.name === this.processDefinitionName);
13535
- if (processDefinition) {
13536
- this.filteredProcesses = this.getProcessDefinitionListByNameOrKey(processDefinition.name);
13537
- this.setProcessDefinitionOnForm(processDefinition.name);
13538
- this.processDefinitionSelectionChanged(processDefinition);
13539
- }
13531
+ .pipe(takeUntilDestroyed(this.destroyRef), switchMap((processDefinitionRepresentations) => {
13532
+ this.processDefinitionList = processDefinitionRepresentations;
13533
+ if (processDefinitionRepresentations.length === 1) {
13534
+ this.selectDefaultProcessDefinition();
13535
+ return of();
13536
+ }
13537
+ if (this.processDefinitionName) {
13538
+ this.processDefinition.setValue(this.processDefinitionName);
13539
+ const processDefinition = this.processDefinitionList.find((process) => process.name === this.processDefinitionName);
13540
+ if (processDefinition) {
13541
+ this.filteredProcesses = this.getProcessDefinitionListByNameOrKey(processDefinition.name);
13542
+ this.processDefinitionSelectionChanged(processDefinition);
13543
+ return this.fetchStaticVariablesAndConstants(processDefinition.name);
13540
13544
  }
13541
- else {
13542
- this.isFormCloudLoading.set(false);
13545
+ }
13546
+ return of();
13547
+ }))
13548
+ .subscribe({
13549
+ next: ([staticMappings, constants]) => {
13550
+ if (staticMappings && constants) {
13551
+ this.onFetchStaticVariablesAndConstants([staticMappings, constants]);
13543
13552
  }
13544
- this.processDefinitionLoaded.set(true);
13553
+ this.isFormCloudLoading = false;
13554
+ this.processDefinitionLoaded = true;
13545
13555
  },
13546
13556
  error: () => {
13547
13557
  this.errorMessageId = 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.LOAD_PROCESS_DEFS';
13548
- this.isFormCloudLoading.set(false);
13558
+ this.isFormCloudLoading = false;
13549
13559
  }
13550
13560
  });
13561
+ // .subscribe({
13562
+ // next: (processDefinitionRepresentations: ProcessDefinitionCloud[]) => {
13563
+ // this.processDefinitionList = processDefinitionRepresentations;
13564
+ // if (processDefinitionRepresentations.length === 1) {
13565
+ // this.selectDefaultProcessDefinition();
13566
+ // } else if (this.processDefinitionName) {
13567
+ // this.processDefinition.setValue(this.processDefinitionName);
13568
+ // const processDefinition = this.processDefinitionList.find((process) => process.name === this.processDefinitionName);
13569
+ // if (processDefinition) {
13570
+ // this.filteredProcesses = this.getProcessDefinitionListByNameOrKey(processDefinition.name);
13571
+ // this.processDefinitionSelectionChanged(processDefinition);
13572
+ // this.setProcessDefinitionOnForm(processDefinition.name);
13573
+ // }
13574
+ // } else {
13575
+ // this.isFormCloudLoading = false;
13576
+ // }
13577
+ // this.processDefinitionLoaded = true;
13578
+ // },
13579
+ // error: () => {
13580
+ // this.errorMessageId = 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.LOAD_PROCESS_DEFS';
13581
+ // this.isFormCloudLoading = false;
13582
+ // }
13583
+ // });
13551
13584
  }
13552
13585
  isValidName(name) {
13553
13586
  return !!name;
@@ -13691,7 +13724,7 @@ class StartProcessCloudComponent {
13691
13724
  return processName;
13692
13725
  }
13693
13726
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: StartProcessCloudComponent, deps: [{ token: i1$1.TranslationService }], target: i0.ɵɵFactoryTarget.Component }); }
13694
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.6", type: StartProcessCloudComponent, isStandalone: true, selector: "adf-cloud-start-process", inputs: { appName: "appName", maxNameLength: "maxNameLength", name: "name", processDefinitionName: "processDefinitionName", variables: "variables", values: "values", showSelectProcessDropdown: "showSelectProcessDropdown", showTitle: "showTitle", showCancelButton: "showCancelButton", displayModeConfigurations: "displayModeConfigurations" }, outputs: { success: "success", cancel: "cancel", error: "error", formContentClicked: "formContentClicked", processDefinitionSelection: "processDefinitionSelection", customOutcomeSelected: "customOutcomeSelected" }, host: { listeners: { "keydown": "onKeyDown($event)" } }, providers: [LocalizedDatePipe], viewQueries: [{ propertyName: "inputAutocomplete", first: true, predicate: MatAutocompleteTrigger, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (showStartProcess()) {\n <mat-card appearance=\"outlined\" class=\"adf-start-process\">\n <mat-card-content>\n @if (showTitle) {\n <mat-card-title class=\"adf-title\">\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.TITLE' | translate }}\n </mat-card-title>\n }\n\n @if (errorMessageId) {\n <mat-card-subtitle class=\"adf-error-message\" id=\"error-message\">\n {{ errorMessageId | translate }}\n </mat-card-subtitle>\n }\n\n @if (!isProcessDefinitionsEmpty) {\n <div>\n <form [formGroup]=\"processForm\" class=\"adf-select-process-form\">\n @if (showSelectProcessDropdown) {\n <mat-form-field\n class=\"adf-process-input-container\"\n floatLabel=\"always\"\n data-automation-id=\"adf-select-cloud-process-dropdown\"\n >\n <mat-label class=\"adf-start-process-input-label\">{{\n 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.TYPE' | translate\n }}</mat-label>\n <input matInput formControlName=\"processDefinition\" [matAutocomplete]=\"auto\" id=\"processDefinitionName\" />\n\n <div class=\"adf-process-input-autocomplete\">\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n id=\"processDefinitionOptions\"\n [displayWith]=\"displayProcessNameOnDropdown\"\n (optionSelected)=\"setProcessDefinitionOnForm($event.option.value)\"\n >\n <mat-option\n *ngFor=\"let processDef of filteredProcesses\"\n [value]=\"getProcessDefinitionValue(processDef)\"\n (click)=\"processDefinitionSelectionChanged(processDef)\"\n >\n {{ getProcessDefinitionValue(processDef) }}\n </mat-option>\n </mat-autocomplete>\n\n <button\n id=\"adf-select-process-dropdown\"\n title=\"{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.SELECT_PROCESS_DROPDOWN' | translate }}\"\n mat-icon-button\n (click)=\"displayDropdown($event)\"\n >\n <mat-icon>arrow_drop_down</mat-icon>\n </button>\n </div>\n @if (processDefinition.hasError('required')) {\n <mat-error class=\"adf-error-pb\">\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.PROCESS_DEFINITION_REQUIRED' | translate }}\n </mat-error>\n }\n </mat-form-field>\n }\n\n <adf-inplace-form-input [control]=\"processInstanceName\">\n <ng-container label>\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.NAME' | translate }}\n </ng-container>\n\n <ng-container error>\n @if (processInstanceName.hasError('required')) {\n <span>\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.PROCESS_NAME_REQUIRED' | translate }}\n </span>\n }\n @if (processInstanceName.hasError('maxlength')) {\n <span id=\"adf-start-process-maxlength-error\">\n {{\n 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.MAXIMUM_LENGTH'\n | translate: { characters: maxNameLength }\n }}\n </span>\n }\n @if (processInstanceName.hasError('pattern')) {\n <span>\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.SPACE_VALIDATOR' | translate }}\n </span>\n }\n </ng-container>\n </adf-inplace-form-input>\n </form>\n\n @if (hasForm) {\n <adf-cloud-form\n #startForm\n [appName]=\"appName\"\n [appVersion]=\"processDefinitionCurrent.appVersion\"\n [data]=\"resolvedValues\"\n [formId]=\"processDefinitionCurrent.formKey\"\n [displayModeConfigurations]=\"displayModeConfigurations\"\n [showSaveButton]=\"showSaveButton\"\n [showCompleteButton]=\"showCompleteButton\"\n [showRefreshButton]=\"false\"\n [showValidationIcon]=\"false\"\n [showTitle]=\"false\"\n (formContentClicked)=\"onFormContentClicked($event)\"\n (formLoaded)=\"onFormLoaded($event)\"\n (executeOutcome)=\"onCustomOutcomeClicked($event)\"\n >\n <adf-cloud-form-custom-outcomes>\n <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n </adf-cloud-form-custom-outcomes>\n </adf-cloud-form>\n } @else {\n <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n }\n </div>\n } @else {\n @if (processDefinitionLoaded) {\n <mat-card-content>\n <mat-card-subtitle class=\"error-message\" id=\"no-process-message\">\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.NO_PROCESS_DEFINITIONS' | translate | uppercase }}\n </mat-card-subtitle>\n </mat-card-content>\n }\n }\n </mat-card-content>\n </mat-card>\n} @else {\n <div class=\"adf-loading-container\">\n <mat-progress-spinner class=\"adf-loading\" color=\"primary\" mode=\"indeterminate\" />\n </div>\n}\n\n<ng-template #taskFormCloudButtons>\n <div class=\"adf-start-process-cloud-actions\">\n @if (showCancelButton) {\n <button mat-button (click)=\"cancelStartProcess()\" id=\"cancel_process\">\n {{ cancelButtonLabel }}\n </button>\n }\n @if (showStartProcessButton$ | async) {\n <button\n color=\"primary\"\n mat-raised-button\n [disabled]=\"disableStartButton || !isProcessFormValid\"\n (click)=\"startProcess()\"\n data-automation-id=\"btn-start\"\n id=\"button-start\"\n class=\"adf-btn-start\"\n >\n {{ startProcessButtonLabel }}\n </button>\n }\n </div>\n</ng-template>\n", styles: [".adf-start-process .adf-start-process-input-label{color:var(--adf-theme-mat-grey-color-a200-dark)}.adf-start-process-cloud-actions{display:flex;justify-content:flex-end}.adf-select-process-form{display:flex;flex-direction:column}.adf-title{padding-bottom:1.25em}.adf-error-message{padding-left:.5em}.adf-process-input-container{margin:0 7px}.adf-process-input-autocomplete{display:flex}.adf-process-input-autocomplete button{position:absolute;right:-14px;top:0}.adf-form-container .adf-form-container-card:has(.adf-form-container-card-content){box-shadow:none;padding:0}.adf-start-form-actions{text-align:right}.adf-loading{margin:auto}.adf-loading-container{min-height:300px;display:flex;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i4.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i4.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i4.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4$2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i4$2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: InplaceFormInputComponent, selector: "adf-inplace-form-input", inputs: ["control"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: i7.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i7$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i7$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormCloudComponent, selector: "adf-cloud-form", inputs: ["appName", "appVersion", "formId", "processInstanceId", "taskId", "data", "displayModeConfigurations", "showCompleteButton", "customSaveButtonText", "customCompleteButtonText"], outputs: ["formSaved", "formCompleted", "formLoaded", "formDataRefreshed", "formContentClicked", "displayModeOn", "displayModeOff"] }, { kind: "component", type: FormCustomOutcomesComponent, selector: "adf-cloud-form-custom-outcomes" }], encapsulation: i0.ViewEncapsulation.None }); }
13727
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.6", type: StartProcessCloudComponent, isStandalone: true, selector: "adf-cloud-start-process", inputs: { appName: "appName", maxNameLength: "maxNameLength", name: "name", processDefinitionName: "processDefinitionName", variables: "variables", values: "values", showSelectProcessDropdown: "showSelectProcessDropdown", showTitle: "showTitle", showCancelButton: "showCancelButton", displayModeConfigurations: "displayModeConfigurations" }, outputs: { success: "success", cancel: "cancel", error: "error", formContentClicked: "formContentClicked", processDefinitionSelection: "processDefinitionSelection", customOutcomeSelected: "customOutcomeSelected" }, host: { listeners: { "keydown": "onKeyDown($event)" } }, providers: [LocalizedDatePipe], viewQueries: [{ propertyName: "inputAutocomplete", first: true, predicate: MatAutocompleteTrigger, descendants: true }], usesOnChanges: true, ngImport: i0, template: "{{processDefinitionLoaded}}\n@if (processDefinitionLoaded) {\n <mat-card appearance=\"outlined\" class=\"adf-start-process\">\n <mat-card-content>\n @if (showTitle) {\n <mat-card-title class=\"adf-title\">\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.TITLE' | translate }}\n </mat-card-title>\n }\n\n @if (errorMessageId) {\n <mat-card-subtitle class=\"adf-error-message\" id=\"error-message\">\n {{ errorMessageId | translate }}\n </mat-card-subtitle>\n }\n\n @if (!isProcessDefinitionsEmpty) {\n <div>\n <form [formGroup]=\"processForm\" class=\"adf-select-process-form\">\n @if (showSelectProcessDropdown) {\n <mat-form-field\n class=\"adf-process-input-container\"\n floatLabel=\"always\"\n data-automation-id=\"adf-select-cloud-process-dropdown\"\n >\n <mat-label class=\"adf-start-process-input-label\">{{\n 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.TYPE' | translate\n }}</mat-label>\n <input matInput formControlName=\"processDefinition\" [matAutocomplete]=\"auto\" id=\"processDefinitionName\" />\n\n <div class=\"adf-process-input-autocomplete\">\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n id=\"processDefinitionOptions\"\n [displayWith]=\"displayProcessNameOnDropdown\"\n (optionSelected)=\"setProcessDefinitionOnForm($event.option.value)\"\n >\n <mat-option\n *ngFor=\"let processDef of filteredProcesses\"\n [value]=\"getProcessDefinitionValue(processDef)\"\n (click)=\"processDefinitionSelectionChanged(processDef)\"\n >\n {{ getProcessDefinitionValue(processDef) }}\n </mat-option>\n </mat-autocomplete>\n\n <button\n id=\"adf-select-process-dropdown\"\n title=\"{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.SELECT_PROCESS_DROPDOWN' | translate }}\"\n mat-icon-button\n (click)=\"displayDropdown($event)\"\n >\n <mat-icon>arrow_drop_down</mat-icon>\n </button>\n </div>\n @if (processDefinition.hasError('required')) {\n <mat-error class=\"adf-error-pb\">\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.PROCESS_DEFINITION_REQUIRED' | translate }}\n </mat-error>\n }\n </mat-form-field>\n }\n\n <adf-inplace-form-input [control]=\"processInstanceName\">\n <ng-container label>\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.NAME' | translate }}\n </ng-container>\n\n <ng-container error>\n @if (processInstanceName.hasError('required')) {\n <span>\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.PROCESS_NAME_REQUIRED' | translate }}\n </span>\n }\n @if (processInstanceName.hasError('maxlength')) {\n <span id=\"adf-start-process-maxlength-error\">\n {{\n 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.MAXIMUM_LENGTH'\n | translate: { characters: maxNameLength }\n }}\n </span>\n }\n @if (processInstanceName.hasError('pattern')) {\n <span>\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.SPACE_VALIDATOR' | translate }}\n </span>\n }\n </ng-container>\n </adf-inplace-form-input>\n </form>\n\n @if (hasForm) {\n <adf-cloud-form\n #startForm\n [appName]=\"appName\"\n [appVersion]=\"processDefinitionCurrent.appVersion\"\n [data]=\"resolvedValues\"\n [formId]=\"processDefinitionCurrent.formKey\"\n [displayModeConfigurations]=\"displayModeConfigurations\"\n [showSaveButton]=\"showSaveButton\"\n [showCompleteButton]=\"showCompleteButton\"\n [showRefreshButton]=\"false\"\n [showValidationIcon]=\"false\"\n [showTitle]=\"false\"\n (formContentClicked)=\"onFormContentClicked($event)\"\n (formLoaded)=\"onFormLoaded($event)\"\n (executeOutcome)=\"onCustomOutcomeClicked($event)\"\n >\n <adf-cloud-form-custom-outcomes>\n <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n </adf-cloud-form-custom-outcomes>\n </adf-cloud-form>\n } @else {\n <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n }\n </div>\n } @else {\n @if (processDefinitionLoaded) {\n <mat-card-content>\n <mat-card-subtitle class=\"error-message\" id=\"no-process-message\">\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.NO_PROCESS_DEFINITIONS' | translate | uppercase }}\n </mat-card-subtitle>\n </mat-card-content>\n }\n }\n </mat-card-content>\n </mat-card>\n} @else {\n <div class=\"adf-loading-container\">\n <mat-progress-spinner class=\"adf-loading\" color=\"primary\" mode=\"indeterminate\" />\n </div>\n}\n\n<ng-template #taskFormCloudButtons>\n <div class=\"adf-start-process-cloud-actions\">\n @if (showCancelButton) {\n <button mat-button (click)=\"cancelStartProcess()\" id=\"cancel_process\">\n {{ cancelButtonLabel }}\n </button>\n }\n @if (showStartProcessButton$ | async) {\n <button\n color=\"primary\"\n mat-raised-button\n [disabled]=\"disableStartButton || !isProcessFormValid\"\n (click)=\"startProcess()\"\n data-automation-id=\"btn-start\"\n id=\"button-start\"\n class=\"adf-btn-start\"\n >\n {{ startProcessButtonLabel }}\n </button>\n }\n </div>\n</ng-template>\n", styles: [".adf-start-process .adf-start-process-input-label{color:var(--adf-theme-mat-grey-color-a200-dark)}.adf-start-process-cloud-actions{display:flex;justify-content:flex-end}.adf-select-process-form{display:flex;flex-direction:column}.adf-title{padding-bottom:1.25em}.adf-error-message{padding-left:.5em}.adf-process-input-container{margin:0 7px}.adf-process-input-autocomplete{display:flex}.adf-process-input-autocomplete button{position:absolute;right:-14px;top:0}.adf-form-container .adf-form-container-card:has(.adf-form-container-card-content){box-shadow:none;padding:0}.adf-start-form-actions{text-align:right}.adf-loading{margin:auto}.adf-loading-container{min-height:300px;display:flex;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i4.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i4.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i4.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4$2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i4$2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: InplaceFormInputComponent, selector: "adf-inplace-form-input", inputs: ["control"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: i7.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i7$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i7$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormCloudComponent, selector: "adf-cloud-form", inputs: ["appName", "appVersion", "formId", "processInstanceId", "taskId", "data", "displayModeConfigurations", "showCompleteButton", "customSaveButtonText", "customCompleteButtonText"], outputs: ["formSaved", "formCompleted", "formLoaded", "formDataRefreshed", "formContentClicked", "displayModeOn", "displayModeOff"] }, { kind: "component", type: FormCustomOutcomesComponent, selector: "adf-cloud-form-custom-outcomes" }], encapsulation: i0.ViewEncapsulation.None }); }
13695
13728
  }
13696
13729
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: StartProcessCloudComponent, decorators: [{
13697
13730
  type: Component,
@@ -13709,7 +13742,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
13709
13742
  ReactiveFormsModule,
13710
13743
  FormCloudComponent,
13711
13744
  FormCustomOutcomesComponent
13712
- ], providers: [LocalizedDatePipe], encapsulation: ViewEncapsulation.None, template: "@if (showStartProcess()) {\n <mat-card appearance=\"outlined\" class=\"adf-start-process\">\n <mat-card-content>\n @if (showTitle) {\n <mat-card-title class=\"adf-title\">\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.TITLE' | translate }}\n </mat-card-title>\n }\n\n @if (errorMessageId) {\n <mat-card-subtitle class=\"adf-error-message\" id=\"error-message\">\n {{ errorMessageId | translate }}\n </mat-card-subtitle>\n }\n\n @if (!isProcessDefinitionsEmpty) {\n <div>\n <form [formGroup]=\"processForm\" class=\"adf-select-process-form\">\n @if (showSelectProcessDropdown) {\n <mat-form-field\n class=\"adf-process-input-container\"\n floatLabel=\"always\"\n data-automation-id=\"adf-select-cloud-process-dropdown\"\n >\n <mat-label class=\"adf-start-process-input-label\">{{\n 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.TYPE' | translate\n }}</mat-label>\n <input matInput formControlName=\"processDefinition\" [matAutocomplete]=\"auto\" id=\"processDefinitionName\" />\n\n <div class=\"adf-process-input-autocomplete\">\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n id=\"processDefinitionOptions\"\n [displayWith]=\"displayProcessNameOnDropdown\"\n (optionSelected)=\"setProcessDefinitionOnForm($event.option.value)\"\n >\n <mat-option\n *ngFor=\"let processDef of filteredProcesses\"\n [value]=\"getProcessDefinitionValue(processDef)\"\n (click)=\"processDefinitionSelectionChanged(processDef)\"\n >\n {{ getProcessDefinitionValue(processDef) }}\n </mat-option>\n </mat-autocomplete>\n\n <button\n id=\"adf-select-process-dropdown\"\n title=\"{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.SELECT_PROCESS_DROPDOWN' | translate }}\"\n mat-icon-button\n (click)=\"displayDropdown($event)\"\n >\n <mat-icon>arrow_drop_down</mat-icon>\n </button>\n </div>\n @if (processDefinition.hasError('required')) {\n <mat-error class=\"adf-error-pb\">\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.PROCESS_DEFINITION_REQUIRED' | translate }}\n </mat-error>\n }\n </mat-form-field>\n }\n\n <adf-inplace-form-input [control]=\"processInstanceName\">\n <ng-container label>\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.NAME' | translate }}\n </ng-container>\n\n <ng-container error>\n @if (processInstanceName.hasError('required')) {\n <span>\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.PROCESS_NAME_REQUIRED' | translate }}\n </span>\n }\n @if (processInstanceName.hasError('maxlength')) {\n <span id=\"adf-start-process-maxlength-error\">\n {{\n 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.MAXIMUM_LENGTH'\n | translate: { characters: maxNameLength }\n }}\n </span>\n }\n @if (processInstanceName.hasError('pattern')) {\n <span>\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.SPACE_VALIDATOR' | translate }}\n </span>\n }\n </ng-container>\n </adf-inplace-form-input>\n </form>\n\n @if (hasForm) {\n <adf-cloud-form\n #startForm\n [appName]=\"appName\"\n [appVersion]=\"processDefinitionCurrent.appVersion\"\n [data]=\"resolvedValues\"\n [formId]=\"processDefinitionCurrent.formKey\"\n [displayModeConfigurations]=\"displayModeConfigurations\"\n [showSaveButton]=\"showSaveButton\"\n [showCompleteButton]=\"showCompleteButton\"\n [showRefreshButton]=\"false\"\n [showValidationIcon]=\"false\"\n [showTitle]=\"false\"\n (formContentClicked)=\"onFormContentClicked($event)\"\n (formLoaded)=\"onFormLoaded($event)\"\n (executeOutcome)=\"onCustomOutcomeClicked($event)\"\n >\n <adf-cloud-form-custom-outcomes>\n <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n </adf-cloud-form-custom-outcomes>\n </adf-cloud-form>\n } @else {\n <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n }\n </div>\n } @else {\n @if (processDefinitionLoaded) {\n <mat-card-content>\n <mat-card-subtitle class=\"error-message\" id=\"no-process-message\">\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.NO_PROCESS_DEFINITIONS' | translate | uppercase }}\n </mat-card-subtitle>\n </mat-card-content>\n }\n }\n </mat-card-content>\n </mat-card>\n} @else {\n <div class=\"adf-loading-container\">\n <mat-progress-spinner class=\"adf-loading\" color=\"primary\" mode=\"indeterminate\" />\n </div>\n}\n\n<ng-template #taskFormCloudButtons>\n <div class=\"adf-start-process-cloud-actions\">\n @if (showCancelButton) {\n <button mat-button (click)=\"cancelStartProcess()\" id=\"cancel_process\">\n {{ cancelButtonLabel }}\n </button>\n }\n @if (showStartProcessButton$ | async) {\n <button\n color=\"primary\"\n mat-raised-button\n [disabled]=\"disableStartButton || !isProcessFormValid\"\n (click)=\"startProcess()\"\n data-automation-id=\"btn-start\"\n id=\"button-start\"\n class=\"adf-btn-start\"\n >\n {{ startProcessButtonLabel }}\n </button>\n }\n </div>\n</ng-template>\n", styles: [".adf-start-process .adf-start-process-input-label{color:var(--adf-theme-mat-grey-color-a200-dark)}.adf-start-process-cloud-actions{display:flex;justify-content:flex-end}.adf-select-process-form{display:flex;flex-direction:column}.adf-title{padding-bottom:1.25em}.adf-error-message{padding-left:.5em}.adf-process-input-container{margin:0 7px}.adf-process-input-autocomplete{display:flex}.adf-process-input-autocomplete button{position:absolute;right:-14px;top:0}.adf-form-container .adf-form-container-card:has(.adf-form-container-card-content){box-shadow:none;padding:0}.adf-start-form-actions{text-align:right}.adf-loading{margin:auto}.adf-loading-container{min-height:300px;display:flex;height:100%}\n"] }]
13745
+ ], providers: [LocalizedDatePipe], encapsulation: ViewEncapsulation.None, template: "{{processDefinitionLoaded}}\n@if (processDefinitionLoaded) {\n <mat-card appearance=\"outlined\" class=\"adf-start-process\">\n <mat-card-content>\n @if (showTitle) {\n <mat-card-title class=\"adf-title\">\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.TITLE' | translate }}\n </mat-card-title>\n }\n\n @if (errorMessageId) {\n <mat-card-subtitle class=\"adf-error-message\" id=\"error-message\">\n {{ errorMessageId | translate }}\n </mat-card-subtitle>\n }\n\n @if (!isProcessDefinitionsEmpty) {\n <div>\n <form [formGroup]=\"processForm\" class=\"adf-select-process-form\">\n @if (showSelectProcessDropdown) {\n <mat-form-field\n class=\"adf-process-input-container\"\n floatLabel=\"always\"\n data-automation-id=\"adf-select-cloud-process-dropdown\"\n >\n <mat-label class=\"adf-start-process-input-label\">{{\n 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.TYPE' | translate\n }}</mat-label>\n <input matInput formControlName=\"processDefinition\" [matAutocomplete]=\"auto\" id=\"processDefinitionName\" />\n\n <div class=\"adf-process-input-autocomplete\">\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n id=\"processDefinitionOptions\"\n [displayWith]=\"displayProcessNameOnDropdown\"\n (optionSelected)=\"setProcessDefinitionOnForm($event.option.value)\"\n >\n <mat-option\n *ngFor=\"let processDef of filteredProcesses\"\n [value]=\"getProcessDefinitionValue(processDef)\"\n (click)=\"processDefinitionSelectionChanged(processDef)\"\n >\n {{ getProcessDefinitionValue(processDef) }}\n </mat-option>\n </mat-autocomplete>\n\n <button\n id=\"adf-select-process-dropdown\"\n title=\"{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.SELECT_PROCESS_DROPDOWN' | translate }}\"\n mat-icon-button\n (click)=\"displayDropdown($event)\"\n >\n <mat-icon>arrow_drop_down</mat-icon>\n </button>\n </div>\n @if (processDefinition.hasError('required')) {\n <mat-error class=\"adf-error-pb\">\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.PROCESS_DEFINITION_REQUIRED' | translate }}\n </mat-error>\n }\n </mat-form-field>\n }\n\n <adf-inplace-form-input [control]=\"processInstanceName\">\n <ng-container label>\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.NAME' | translate }}\n </ng-container>\n\n <ng-container error>\n @if (processInstanceName.hasError('required')) {\n <span>\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.PROCESS_NAME_REQUIRED' | translate }}\n </span>\n }\n @if (processInstanceName.hasError('maxlength')) {\n <span id=\"adf-start-process-maxlength-error\">\n {{\n 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.MAXIMUM_LENGTH'\n | translate: { characters: maxNameLength }\n }}\n </span>\n }\n @if (processInstanceName.hasError('pattern')) {\n <span>\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.SPACE_VALIDATOR' | translate }}\n </span>\n }\n </ng-container>\n </adf-inplace-form-input>\n </form>\n\n @if (hasForm) {\n <adf-cloud-form\n #startForm\n [appName]=\"appName\"\n [appVersion]=\"processDefinitionCurrent.appVersion\"\n [data]=\"resolvedValues\"\n [formId]=\"processDefinitionCurrent.formKey\"\n [displayModeConfigurations]=\"displayModeConfigurations\"\n [showSaveButton]=\"showSaveButton\"\n [showCompleteButton]=\"showCompleteButton\"\n [showRefreshButton]=\"false\"\n [showValidationIcon]=\"false\"\n [showTitle]=\"false\"\n (formContentClicked)=\"onFormContentClicked($event)\"\n (formLoaded)=\"onFormLoaded($event)\"\n (executeOutcome)=\"onCustomOutcomeClicked($event)\"\n >\n <adf-cloud-form-custom-outcomes>\n <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n </adf-cloud-form-custom-outcomes>\n </adf-cloud-form>\n } @else {\n <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n }\n </div>\n } @else {\n @if (processDefinitionLoaded) {\n <mat-card-content>\n <mat-card-subtitle class=\"error-message\" id=\"no-process-message\">\n {{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.NO_PROCESS_DEFINITIONS' | translate | uppercase }}\n </mat-card-subtitle>\n </mat-card-content>\n }\n }\n </mat-card-content>\n </mat-card>\n} @else {\n <div class=\"adf-loading-container\">\n <mat-progress-spinner class=\"adf-loading\" color=\"primary\" mode=\"indeterminate\" />\n </div>\n}\n\n<ng-template #taskFormCloudButtons>\n <div class=\"adf-start-process-cloud-actions\">\n @if (showCancelButton) {\n <button mat-button (click)=\"cancelStartProcess()\" id=\"cancel_process\">\n {{ cancelButtonLabel }}\n </button>\n }\n @if (showStartProcessButton$ | async) {\n <button\n color=\"primary\"\n mat-raised-button\n [disabled]=\"disableStartButton || !isProcessFormValid\"\n (click)=\"startProcess()\"\n data-automation-id=\"btn-start\"\n id=\"button-start\"\n class=\"adf-btn-start\"\n >\n {{ startProcessButtonLabel }}\n </button>\n }\n </div>\n</ng-template>\n", styles: [".adf-start-process .adf-start-process-input-label{color:var(--adf-theme-mat-grey-color-a200-dark)}.adf-start-process-cloud-actions{display:flex;justify-content:flex-end}.adf-select-process-form{display:flex;flex-direction:column}.adf-title{padding-bottom:1.25em}.adf-error-message{padding-left:.5em}.adf-process-input-container{margin:0 7px}.adf-process-input-autocomplete{display:flex}.adf-process-input-autocomplete button{position:absolute;right:-14px;top:0}.adf-form-container .adf-form-container-card:has(.adf-form-container-card-content){box-shadow:none;padding:0}.adf-start-form-actions{text-align:right}.adf-loading{margin:auto}.adf-loading-container{min-height:300px;display:flex;height:100%}\n"] }]
13713
13746
  }], ctorParameters: () => [{ type: i1$1.TranslationService }], propDecorators: { inputAutocomplete: [{
13714
13747
  type: ViewChild,
13715
13748
  args: [MatAutocompleteTrigger]