@alfresco/adf-process-services-cloud 8.4.0-20263963188 → 8.4.0-20291166521

package/fesm2022/adf-process-services-cloud.mjs

@@ -6745,6 +6745,11 @@ class FormCloudComponent extends FormBaseComponent {
          * If not provided, the default text will be used.
          */
         this.customCompleteButtonText = '';
+        /**
+         * Toggle to enable parent visibility check for validation.
+         * When enabled, fields inside hidden groups/sections will skip validation.
+         */
+        this.enableParentVisibilityCheck = false;
         /** Emitted when the form is submitted with the `Save` or custom outcomes. */
         this.formSaved = new EventEmitter();
         /** Emitted when the form is submitted with the `Complete` outcome. */
@@ -6829,6 +6834,11 @@ class FormCloudComponent extends FormBaseComponent {
             this.onFormLoaded(this.form);
             return;
         }
+        const enableParentVisibilityCheckChange = changes['enableParentVisibilityCheck'];
+        if (enableParentVisibilityCheckChange && this.form) {
+            this.setCheckParentVisibilityForValidationOnFields();
+            this.form.validateForm();
+        }
     }
     ngOnInit() {
         DisplayModeService.displayMode$
@@ -6895,8 +6905,9 @@ class FormCloudComponent extends FormBaseComponent {
                 this.data = data[1];
                 const parsedForm = this.parseForm(this.formCloudRepresentationJSON);
                 this.visibilityService.refreshVisibility(parsedForm, this.data);
-                parsedForm.validateForm();
                 this.form = parsedForm;
+                this.setCheckParentVisibilityForValidationOnFields();
+                parsedForm.validateForm();
                 this.form.nodeId = '-my-';
                 this.onFormLoaded(this.form);
                 resolve(this.form);
@@ -6920,8 +6931,9 @@ class FormCloudComponent extends FormBaseComponent {
                 this.formCloudRepresentationJSON.processVariables = this.data || [];
                 const parsedForm = this.parseForm(form);
                 this.visibilityService.refreshVisibility(parsedForm);
-                parsedForm?.validateForm();
                 this.form = parsedForm;
+                this.setCheckParentVisibilityForValidationOnFields();
+                parsedForm?.validateForm();
                 this.form.nodeId = '-my-';
                 this.onFormLoaded(this.form);
             },
@@ -7009,10 +7021,26 @@ class FormCloudComponent extends FormBaseComponent {
     refreshFormData() {
         this.form = this.parseForm(this.formCloudRepresentationJSON);
         if (this.form) {
+            this.setCheckParentVisibilityForValidationOnFields();
             this.onFormLoaded(this.form);
             this.onFormDataRefreshed(this.form);
         }
     }
+    /**
+     * Sets the parent visibility check flag on all form fields.
+     * When enabled, fields inside hidden groups/sections will skip validation.
+     * When disabled, resets flags to false to revert to default behavior.
+     */
+    setCheckParentVisibilityForValidationOnFields() {
+        if (!this.form) {
+            return;
+        }
+        this.form.enableParentVisibilityCheck = this.enableParentVisibilityCheck;
+        const allFields = this.form.getFormFields();
+        allFields.forEach((field) => {
+            field.checkParentVisibilityForValidation = this.enableParentVisibilityCheck;
+        });
+    }
     onFormLoaded(form) {
         if (form) {
             this.displayModeConfigurations = this.displayModeService.getDisplayModeConfigurations(this.displayModeConfigurations);
@@ -7059,7 +7087,7 @@ class FormCloudComponent extends FormBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: FormCloudComponent, deps: [{ token: FORM_CLOUD_FIELD_VALIDATORS_TOKEN, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: FormCloudComponent, isStandalone: true, selector: "adf-cloud-form", inputs: { appName: "appName", appVersion: "appVersion", formId: "formId", processInstanceId: "processInstanceId", taskId: "taskId", data: "data", displayModeConfigurations: "displayModeConfigurations", showCompleteButton: "showCompleteButton", customSaveButtonText: "customSaveButtonText", customCompleteButtonText: "customCompleteButtonText" }, outputs: { formSaved: "formSaved", formCompleted: "formCompleted", formLoaded: "formLoaded", formDataRefreshed: "formDataRefreshed", formContentClicked: "formContentClicked", displayModeOn: "displayModeOn", displayModeOff: "displayModeOff" }, host: { listeners: { "keydown": "onKeyDown($event)" } }, providers: [FormCloudSpinnerService], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!hasForm()\">\n    <ng-content select=\"[empty-form]\" />\n</div>\n\n<div\n    *ngIf=\"hasForm()\"\n    class=\"adf-cloud-form-container adf-cloud-form-{{ displayConfiguration?.options?.fullscreen ? 'fullscreen' : 'inline' }}-container\"\n    [style]=\"formStyle\"\n>\n    <div\n        class=\"adf-cloud-form-content\"\n        [class.adf-cloud-form-content-standalone-fullscreen]=\"displayMode === 'standalone' && displayConfiguration?.options?.fullscreen\"\n        [class.adf-cloud-form-content-toolbar]=\"!!displayConfiguration?.options?.displayToolbar\"\n        [cdkTrapFocus]=\"displayConfiguration?.options?.trapFocus\"\n        cdkTrapFocusAutoCapture>\n        <adf-toolbar class=\"adf-cloud-form-toolbar\" *ngIf=\"displayConfiguration?.options?.displayToolbar\">\n            <div class=\"adf-cloud-form__form-title\">\n                <span class=\"adf-cloud-form__display-name\" [title]=\"form.taskName\">\n                    {{ form.taskName }}\n                    <ng-container *ngIf=\"!form.taskName\">\n                        {{ 'FORM.FORM_RENDERER.NAMELESS_TASK' | translate }}\n                    </ng-container>\n                </span>\n            </div>\n\n            <adf-toolbar-divider *ngIf=\"displayConfiguration?.options?.displayCloseButton\" />\n            <button\n                *ngIf=\"displayConfiguration?.options?.displayCloseButton\"\n                class=\"adf-cloud-form-close-button\"\n                data-automation-id=\"adf-toolbar-right-back\"\n                [attr.aria-label]=\"'ADF_VIEWER.ACTIONS.CLOSE' | translate\"\n                [attr.data-automation-id]=\"'adf-cloud-form-close-button'\"\n                [title]=\"'ADF_VIEWER.ACTIONS.CLOSE' | translate\"\n                mat-icon-button\n                title=\"{{ 'ADF_VIEWER.ACTIONS.CLOSE' | translate }}\"\n                (click)=\"switchToDisplayMode()\"\n            >\n                <mat-icon>close</mat-icon>\n            </button>\n        </adf-toolbar>\n\n        <mat-card\n            appearance=\"outlined\"\n            class=\"adf-cloud-form-content-card\"\n            [class.adf-cloud-form-content-card-fullscreen]=\"displayMode === 'fullScreen'\"\n            [class.adf-cloud-form-content-card-fullscreen-toolbar]=\"displayMode === 'fullScreen' && displayConfiguration?.options?.displayToolbar\"\n        >\n            <div class=\"adf-cloud-form-content-card-container\">\n                <mat-card-header *ngIf=\"showTitle || showRefreshButton || showValidationIcon\">\n                    <mat-card-title>\n                        <h4>\n                            <div *ngIf=\"showValidationIcon\" class=\"adf-form-validation-button\">\n                                <i id=\"adf-valid-form-icon\" class=\"material-icons\" *ngIf=\"form.isValid; else no_valid_form\">check_circle</i>\n                                <ng-template #no_valid_form>\n                                    <i id=\"adf-invalid-form-icon\" class=\"material-icons adf-invalid-color\">error</i>\n                                </ng-template>\n                            </div>\n                            <div\n                                *ngIf=\"!displayConfiguration?.options?.fullscreen && findDisplayConfiguration('fullScreen')\"\n                                class=\"adf-cloud-form-fullscreen-button\"\n                            >\n                                <button\n                                    mat-icon-button\n                                    (click)=\"switchToDisplayMode('fullScreen')\"\n                                    [attr.data-automation-id]=\"'adf-cloud-form-fullscreen-button'\"\n                                >\n                                    <mat-icon>fullscreen</mat-icon>\n                                </button>\n                            </div>\n                            <div *ngIf=\"showRefreshButton\" class=\"adf-cloud-form-reload-button\" [title]=\"'ADF_VIEWER.ACTIONS.FULLSCREEN' | translate\">\n                                <button mat-icon-button (click)=\"onRefreshClicked()\" [attr.aria-label]=\"'ADF_VIEWER.ACTIONS.FULLSCREEN' | translate\">\n                                    <mat-icon>refresh</mat-icon>\n                                </button>\n                            </div>\n                            <span *ngIf=\"isTitleEnabled()\" class=\"adf-cloud-form-title\" [title]=\"form.taskName\"\n                                >{{ form.taskName }}\n                                <ng-container *ngIf=\"!form.taskName\">\n                                    {{ 'FORM.FORM_RENDERER.NAMELESS_TASK' | translate }}\n                                </ng-container>\n                            </span>\n                        </h4>\n                    </mat-card-title>\n                </mat-card-header>\n                <mat-card-content class=\"adf-form-container-card-content\">\n                    <adf-form-renderer [formDefinition]=\"form\" [readOnly]=\"readOnly\" />\n                </mat-card-content>\n                    <mat-card-actions *ngIf=\"form.hasOutcomes()\" class=\"adf-cloud-form-content-card-actions\" align=\"end\">\n                        <ng-content select=\"adf-cloud-form-custom-outcomes\" />\n                        <ng-container *ngFor=\"let outcome of form.outcomes\">\n                            <button\n                                *ngIf=\"outcome.isVisible\"\n                                [id]=\"'adf-form-' + outcome.name | formatSpace\"\n                                [color]=\"getColorForOutcome(outcome.name)\"\n                                mat-button\n                                [disabled]=\"!isOutcomeButtonEnabled(outcome)\"\n                                [class.adf-form-hide-button]=\"!isOutcomeButtonVisible(outcome, form.readOnly)\"\n                                class=\"adf-cloud-form-custom-outcome-button\"\n                                (click)=\"onOutcomeClicked(outcome)\"\n                            >\n                                {{ getCustomOutcomeButtonText(outcome) || (outcome.name | translate | uppercase) }}\n                            </button>\n                        </ng-container>\n                    </mat-card-actions>\n            </div>\n        </mat-card>\n    </div>\n</div>\n", styles: [".adf-full-screen,.adf-cloud-form-inline-container,.adf-cloud-form-container .adf-cloud-form-content{width:100%;height:100%;background-color:var(--adf-theme-background-card-color)}.adf-cloud-form-content-standalone-fullscreen{background-color:transparent;border-radius:14px}.adf-cloud-form-content-toolbar{padding-top:0}.adf-cloud-form-container{border-radius:14px}.adf-cloud-form-container .adf-cloud-form-content{flex:1;flex-direction:column;display:flex;position:relative}.adf-cloud-form-fullscreen-container{position:fixed;top:0;left:0;z-index:100000;background-color:var(--adf-theme-mat-grey-color-a400);display:block;height:100%;width:100vw;overflow-y:auto;border-radius:0 0 14px}.adf-cloud-form-fullscreen-container .adf-cloud-form-content{width:calc(100% - 80px);max-width:1366px;height:auto;margin:40px auto;border-radius:14px}.adf-cloud-form-inline-container .adf-cloud-form-content{border-radius:14px}.adf-cloud-form-toolbar ::ng-deep .mat-toolbar{background-color:var(--adf-theme-background-card-color-087);border-radius:14px 14px 0 0}.adf-cloud-form-fullscreen-button{position:absolute;right:70px;top:30px}.adf-cloud-form__display-name{font-size:var(--theme-subheading-2-font-size);opacity:.87;line-height:1.5;letter-spacing:-.4px;font-weight:400;font-style:normal;font-stretch:normal;max-width:400px;text-overflow:ellipsis;overflow:hidden;display:inline-block;vertical-align:middle;color:var(--adf-theme-foreground-text-color)}.adf-cloud-form__form-title{text-align:center;flex:1 1 auto}.adf-cloud-form-content-card{padding-bottom:2rem;overflow-y:auto;position:static;height:70%;border-radius:14px}.adf-cloud-form-content-card-fullscreen{padding-top:0;height:100%;width:100%;position:relative}.adf-cloud-form-content-card-fullscreen-toolbar{border-radius:0 0 14px 14px}.adf-cloud-form-content-card-fullscreen-container{display:flex;flex-direction:column;height:100%}.adf-cloud-form-content-card-fullscreen-container .mat-mdc-card-content{height:100%;overflow:hidden auto}.adf-cloud-form-content-card-container .adf-form-container-card-content{padding-left:1%;padding-right:1%}.adf-cloud-form-sidebars{display:flex;flex:1 1 auto}.adf-cloud-form-sidebars adf-viewer-render{order:1;flex:1 1 auto;display:flex}.adf-cloud-form .adf-label{white-space:normal}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$2.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FormatSpacePipe, name: "formatSpace" }, { 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: "ngmodule", type: MatCardModule }, { kind: "component", type: i4$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$1.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i4$1.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i4$1.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i4$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "component", type: FormRendererComponent, selector: "adf-form-renderer", inputs: ["formDefinition", "readOnly"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ToolbarDividerComponent, selector: "adf-toolbar-divider" }, { kind: "component", type: ToolbarComponent, selector: "adf-toolbar", inputs: ["title", "color"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i5$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: FormCloudComponent, isStandalone: true, selector: "adf-cloud-form", inputs: { appName: "appName", appVersion: "appVersion", formId: "formId", processInstanceId: "processInstanceId", taskId: "taskId", data: "data", displayModeConfigurations: "displayModeConfigurations", showCompleteButton: "showCompleteButton", customSaveButtonText: "customSaveButtonText", customCompleteButtonText: "customCompleteButtonText", enableParentVisibilityCheck: "enableParentVisibilityCheck" }, outputs: { formSaved: "formSaved", formCompleted: "formCompleted", formLoaded: "formLoaded", formDataRefreshed: "formDataRefreshed", formContentClicked: "formContentClicked", displayModeOn: "displayModeOn", displayModeOff: "displayModeOff" }, host: { listeners: { "keydown": "onKeyDown($event)" } }, providers: [FormCloudSpinnerService], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!hasForm()\">\n    <ng-content select=\"[empty-form]\" />\n</div>\n\n<div\n    *ngIf=\"hasForm()\"\n    class=\"adf-cloud-form-container adf-cloud-form-{{ displayConfiguration?.options?.fullscreen ? 'fullscreen' : 'inline' }}-container\"\n    [style]=\"formStyle\"\n>\n    <div\n        class=\"adf-cloud-form-content\"\n        [class.adf-cloud-form-content-standalone-fullscreen]=\"displayMode === 'standalone' && displayConfiguration?.options?.fullscreen\"\n        [class.adf-cloud-form-content-toolbar]=\"!!displayConfiguration?.options?.displayToolbar\"\n        [cdkTrapFocus]=\"displayConfiguration?.options?.trapFocus\"\n        cdkTrapFocusAutoCapture>\n        <adf-toolbar class=\"adf-cloud-form-toolbar\" *ngIf=\"displayConfiguration?.options?.displayToolbar\">\n            <div class=\"adf-cloud-form__form-title\">\n                <span class=\"adf-cloud-form__display-name\" [title]=\"form.taskName\">\n                    {{ form.taskName }}\n                    <ng-container *ngIf=\"!form.taskName\">\n                        {{ 'FORM.FORM_RENDERER.NAMELESS_TASK' | translate }}\n                    </ng-container>\n                </span>\n            </div>\n\n            <adf-toolbar-divider *ngIf=\"displayConfiguration?.options?.displayCloseButton\" />\n            <button\n                *ngIf=\"displayConfiguration?.options?.displayCloseButton\"\n                class=\"adf-cloud-form-close-button\"\n                data-automation-id=\"adf-toolbar-right-back\"\n                [attr.aria-label]=\"'ADF_VIEWER.ACTIONS.CLOSE' | translate\"\n                [attr.data-automation-id]=\"'adf-cloud-form-close-button'\"\n                [title]=\"'ADF_VIEWER.ACTIONS.CLOSE' | translate\"\n                mat-icon-button\n                title=\"{{ 'ADF_VIEWER.ACTIONS.CLOSE' | translate }}\"\n                (click)=\"switchToDisplayMode()\"\n            >\n                <mat-icon>close</mat-icon>\n            </button>\n        </adf-toolbar>\n\n        <mat-card\n            appearance=\"outlined\"\n            class=\"adf-cloud-form-content-card\"\n            [class.adf-cloud-form-content-card-fullscreen]=\"displayMode === 'fullScreen'\"\n            [class.adf-cloud-form-content-card-fullscreen-toolbar]=\"displayMode === 'fullScreen' && displayConfiguration?.options?.displayToolbar\"\n        >\n            <div class=\"adf-cloud-form-content-card-container\">\n                <mat-card-header *ngIf=\"showTitle || showRefreshButton || showValidationIcon\">\n                    <mat-card-title>\n                        <h4>\n                            <div *ngIf=\"showValidationIcon\" class=\"adf-form-validation-button\">\n                                <i id=\"adf-valid-form-icon\" class=\"material-icons\" *ngIf=\"form.isValid; else no_valid_form\">check_circle</i>\n                                <ng-template #no_valid_form>\n                                    <i id=\"adf-invalid-form-icon\" class=\"material-icons adf-invalid-color\">error</i>\n                                </ng-template>\n                            </div>\n                            <div\n                                *ngIf=\"!displayConfiguration?.options?.fullscreen && findDisplayConfiguration('fullScreen')\"\n                                class=\"adf-cloud-form-fullscreen-button\"\n                            >\n                                <button\n                                    mat-icon-button\n                                    (click)=\"switchToDisplayMode('fullScreen')\"\n                                    [attr.data-automation-id]=\"'adf-cloud-form-fullscreen-button'\"\n                                >\n                                    <mat-icon>fullscreen</mat-icon>\n                                </button>\n                            </div>\n                            <div *ngIf=\"showRefreshButton\" class=\"adf-cloud-form-reload-button\" [title]=\"'ADF_VIEWER.ACTIONS.FULLSCREEN' | translate\">\n                                <button mat-icon-button (click)=\"onRefreshClicked()\" [attr.aria-label]=\"'ADF_VIEWER.ACTIONS.FULLSCREEN' | translate\">\n                                    <mat-icon>refresh</mat-icon>\n                                </button>\n                            </div>\n                            <span *ngIf=\"isTitleEnabled()\" class=\"adf-cloud-form-title\" [title]=\"form.taskName\"\n                                >{{ form.taskName }}\n                                <ng-container *ngIf=\"!form.taskName\">\n                                    {{ 'FORM.FORM_RENDERER.NAMELESS_TASK' | translate }}\n                                </ng-container>\n                            </span>\n                        </h4>\n                    </mat-card-title>\n                </mat-card-header>\n                <mat-card-content class=\"adf-form-container-card-content\">\n                    <adf-form-renderer [formDefinition]=\"form\" [readOnly]=\"readOnly\" />\n                </mat-card-content>\n                    <mat-card-actions *ngIf=\"form.hasOutcomes()\" class=\"adf-cloud-form-content-card-actions\" align=\"end\">\n                        <ng-content select=\"adf-cloud-form-custom-outcomes\" />\n                        <ng-container *ngFor=\"let outcome of form.outcomes\">\n                            <button\n                                *ngIf=\"outcome.isVisible\"\n                                [id]=\"'adf-form-' + outcome.name | formatSpace\"\n                                [color]=\"getColorForOutcome(outcome.name)\"\n                                mat-button\n                                [disabled]=\"!isOutcomeButtonEnabled(outcome)\"\n                                [class.adf-form-hide-button]=\"!isOutcomeButtonVisible(outcome, form.readOnly)\"\n                                class=\"adf-cloud-form-custom-outcome-button\"\n                                (click)=\"onOutcomeClicked(outcome)\"\n                            >\n                                {{ getCustomOutcomeButtonText(outcome) || (outcome.name | translate | uppercase) }}\n                            </button>\n                        </ng-container>\n                    </mat-card-actions>\n            </div>\n        </mat-card>\n    </div>\n</div>\n", styles: [".adf-full-screen,.adf-cloud-form-inline-container,.adf-cloud-form-container .adf-cloud-form-content{width:100%;height:100%;background-color:var(--adf-theme-background-card-color)}.adf-cloud-form-content-standalone-fullscreen{background-color:transparent;border-radius:14px}.adf-cloud-form-content-toolbar{padding-top:0}.adf-cloud-form-container{border-radius:14px}.adf-cloud-form-container .adf-cloud-form-content{flex:1;flex-direction:column;display:flex;position:relative}.adf-cloud-form-fullscreen-container{position:fixed;top:0;left:0;z-index:100000;background-color:var(--adf-theme-mat-grey-color-a400);display:block;height:100%;width:100vw;overflow-y:auto;border-radius:0 0 14px}.adf-cloud-form-fullscreen-container .adf-cloud-form-content{width:calc(100% - 80px);max-width:1366px;height:auto;margin:40px auto;border-radius:14px}.adf-cloud-form-inline-container .adf-cloud-form-content{border-radius:14px}.adf-cloud-form-toolbar ::ng-deep .mat-toolbar{background-color:var(--adf-theme-background-card-color-087);border-radius:14px 14px 0 0}.adf-cloud-form-fullscreen-button{position:absolute;right:70px;top:30px}.adf-cloud-form__display-name{font-size:var(--theme-subheading-2-font-size);opacity:.87;line-height:1.5;letter-spacing:-.4px;font-weight:400;font-style:normal;font-stretch:normal;max-width:400px;text-overflow:ellipsis;overflow:hidden;display:inline-block;vertical-align:middle;color:var(--adf-theme-foreground-text-color)}.adf-cloud-form__form-title{text-align:center;flex:1 1 auto}.adf-cloud-form-content-card{padding-bottom:2rem;overflow-y:auto;position:static;height:70%;border-radius:14px}.adf-cloud-form-content-card-fullscreen{padding-top:0;height:100%;width:100%;position:relative}.adf-cloud-form-content-card-fullscreen-toolbar{border-radius:0 0 14px 14px}.adf-cloud-form-content-card-fullscreen-container{display:flex;flex-direction:column;height:100%}.adf-cloud-form-content-card-fullscreen-container .mat-mdc-card-content{height:100%;overflow:hidden auto}.adf-cloud-form-content-card-container .adf-form-container-card-content{padding-left:1%;padding-right:1%}.adf-cloud-form-sidebars{display:flex;flex:1 1 auto}.adf-cloud-form-sidebars adf-viewer-render{order:1;flex:1 1 auto;display:flex}.adf-cloud-form .adf-label{white-space:normal}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$2.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FormatSpacePipe, name: "formatSpace" }, { 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: "ngmodule", type: MatCardModule }, { kind: "component", type: i4$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$1.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i4$1.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i4$1.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i4$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "component", type: FormRendererComponent, selector: "adf-form-renderer", inputs: ["formDefinition", "readOnly"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ToolbarDividerComponent, selector: "adf-toolbar-divider" }, { kind: "component", type: ToolbarComponent, selector: "adf-toolbar", inputs: ["title", "color"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i5$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: FormCloudComponent, decorators: [{
             type: Component,
@@ -7100,6 +7128,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                 type: Input
             }], customCompleteButtonText: [{
                 type: Input
+            }], enableParentVisibilityCheck: [{
+                type: Input
             }], formSaved: [{
                 type: Output
             }], formCompleted: [{
@@ -8875,6 +8905,11 @@ class TaskFormCloudComponent {
         this.customSaveButtonText = '';
         /** Toggle readonly state of the task. */
         this.readOnly = false;
+        /**
+         * Toggle to enable parent visibility check for validation.
+         * When enabled, fields inside hidden groups/sections will skip validation.
+         */
+        this.enableParentVisibilityCheck = false;
         /** Emitted when the form is loaded or reloaded. */
         this.formLoaded = new EventEmitter();
         /** Emitted when the form is saved. */
@@ -8969,11 +9004,11 @@ class TaskFormCloudComponent {
         this.formLoaded.emit(form);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TaskFormCloudComponent, deps: [{ token: TaskCloudService }, { token: i1$1.FormRenderingService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: TaskFormCloudComponent, isStandalone: true, selector: "adf-cloud-task-form", inputs: { appName: "appName", candidateUsers: "candidateUsers", candidateGroups: "candidateGroups", taskId: "taskId", showTitle: "showTitle", showRefreshButton: "showRefreshButton", showValidationIcon: "showValidationIcon", showCancelButton: "showCancelButton", showCompleteButton: "showCompleteButton", showSaveButton: "showSaveButton", customCancelButtonText: "customCancelButtonText", customCompleteButtonText: "customCompleteButtonText", customSaveButtonText: "customSaveButtonText", readOnly: "readOnly", displayModeConfigurations: "displayModeConfigurations", taskDetails: "taskDetails" }, outputs: { formLoaded: "formLoaded", formSaved: "formSaved", formCompleted: "formCompleted", taskCompleted: "taskCompleted", taskClaimed: "taskClaimed", taskUnclaimed: "taskUnclaimed", cancelClick: "cancelClick", error: "error", formContentClicked: "formContentClicked", executeOutcome: "executeOutcome", displayModeOn: "displayModeOn", displayModeOff: "displayModeOff" }, viewQueries: [{ propertyName: "adfCloudForm", first: true, predicate: ["adfCloudForm"], descendants: true }], ngImport: i0, template: "<div class=\"adf-task-form-cloud-container\">\n    <adf-cloud-form\n        #adfCloudForm\n        [appName]=\"appName\"\n        [appVersion]=\"taskDetails.appVersion\"\n        [taskId]=\"taskId\"\n        [showTitle]=\"showTitle\"\n        [processInstanceId]=\"taskDetails.processInstanceId\"\n        [readOnly]=\"isReadOnly()\"\n        [showRefreshButton]=\"showRefreshButton\"\n        [showValidationIcon]=\"showValidationIcon\"\n        [showCompleteButton]=\"showCompleteButton && canCompleteTask()\"\n        [showSaveButton]=\"showSaveButton && canCompleteTask()\"\n        [customSaveButtonText]=\"customSaveButtonText\"\n        [customCompleteButtonText]=\"customCompleteButtonText\"\n        [displayModeConfigurations]=\"displayModeConfigurations\"\n        (formLoaded)=\"onFormLoaded($event)\"\n        (formSaved)=\"onFormSaved($event)\"\n        (formCompleted)=\"onFormCompleted($event)\"\n        (formError)=\"onError($event)\"\n        (error)=\"onError($event)\"\n        (formContentClicked)=\"onFormContentClicked($event)\"\n        (executeOutcome)=\"onFormExecuteOutcome($event)\"\n        (displayModeOn)=\"onDisplayModeOn($event)\"\n        (displayModeOff)=\"onDisplayModeOff($event)\"\n    >\n        <adf-cloud-form-custom-outcomes>\n            <adf-cloud-user-task-cloud-buttons\n                [appName]=\"appName\"\n                [canClaimTask]=\"canClaimTask()\"\n                [canUnclaimTask]=\"canUnclaimTask()\"\n                [showCancelButton]=\"showCancelButton\"\n                [customCancelButtonText]=\"customCancelButtonText\"\n                [taskId]=\"taskId\"\n                (cancelClick)=\"onCancelClick()\"\n                (claimTask)=\"onClaimTask()\"\n                (unclaimTask)=\"onUnclaimTask()\"\n                (error)=\"onError($event)\"\n            />\n        </adf-cloud-form-custom-outcomes>\n    </adf-cloud-form>\n</div>\n", styles: [".adf-task-form-cloud-container{height:100%}.adf-task-form-cloud-container .adf-task-form-container{overflow:hidden}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button){padding-bottom:25px;padding-right:25px}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button) .adf-task-form-actions-button{height:36px;border-radius:5px}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button) .mat-mdc-button{height:36px;border-radius:5px;width:auto;padding:0 16px;margin:0 8px;white-space:nowrap}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button) .mdc-button__label{min-width:58px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: UserTaskCloudButtonsComponent, selector: "adf-cloud-user-task-cloud-buttons", inputs: ["appName", "canClaimTask", "canUnclaimTask", "taskId", "showCancelButton", "customCancelButtonText"], outputs: ["error", "cancelClick", "claimTask", "unclaimTask"] }, { kind: "component", type: FormCustomOutcomesComponent, selector: "adf-cloud-form-custom-outcomes" }, { 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"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: TaskFormCloudComponent, isStandalone: true, selector: "adf-cloud-task-form", inputs: { appName: "appName", candidateUsers: "candidateUsers", candidateGroups: "candidateGroups", taskId: "taskId", showTitle: "showTitle", showRefreshButton: "showRefreshButton", showValidationIcon: "showValidationIcon", showCancelButton: "showCancelButton", showCompleteButton: "showCompleteButton", showSaveButton: "showSaveButton", customCancelButtonText: "customCancelButtonText", customCompleteButtonText: "customCompleteButtonText", customSaveButtonText: "customSaveButtonText", readOnly: "readOnly", displayModeConfigurations: "displayModeConfigurations", enableParentVisibilityCheck: "enableParentVisibilityCheck", taskDetails: "taskDetails" }, outputs: { formLoaded: "formLoaded", formSaved: "formSaved", formCompleted: "formCompleted", taskCompleted: "taskCompleted", taskClaimed: "taskClaimed", taskUnclaimed: "taskUnclaimed", cancelClick: "cancelClick", error: "error", formContentClicked: "formContentClicked", executeOutcome: "executeOutcome", displayModeOn: "displayModeOn", displayModeOff: "displayModeOff" }, viewQueries: [{ propertyName: "adfCloudForm", first: true, predicate: ["adfCloudForm"], descendants: true }], ngImport: i0, template: "<div class=\"adf-task-form-cloud-container\">\n    <adf-cloud-form\n        #adfCloudForm\n        [appName]=\"appName\"\n        [appVersion]=\"taskDetails.appVersion\"\n        [taskId]=\"taskId\"\n        [showTitle]=\"showTitle\"\n        [processInstanceId]=\"taskDetails.processInstanceId\"\n        [readOnly]=\"isReadOnly()\"\n        [showRefreshButton]=\"showRefreshButton\"\n        [showValidationIcon]=\"showValidationIcon\"\n        [showCompleteButton]=\"showCompleteButton && canCompleteTask()\"\n        [showSaveButton]=\"showSaveButton && canCompleteTask()\"\n        [customSaveButtonText]=\"customSaveButtonText\"\n        [customCompleteButtonText]=\"customCompleteButtonText\"\n        [displayModeConfigurations]=\"displayModeConfigurations\"\n        [enableParentVisibilityCheck]=\"enableParentVisibilityCheck\"\n        (formLoaded)=\"onFormLoaded($event)\"\n        (formSaved)=\"onFormSaved($event)\"\n        (formCompleted)=\"onFormCompleted($event)\"\n        (formError)=\"onError($event)\"\n        (error)=\"onError($event)\"\n        (formContentClicked)=\"onFormContentClicked($event)\"\n        (executeOutcome)=\"onFormExecuteOutcome($event)\"\n        (displayModeOn)=\"onDisplayModeOn($event)\"\n        (displayModeOff)=\"onDisplayModeOff($event)\"\n    >\n        <adf-cloud-form-custom-outcomes>\n            <adf-cloud-user-task-cloud-buttons\n                [appName]=\"appName\"\n                [canClaimTask]=\"canClaimTask()\"\n                [canUnclaimTask]=\"canUnclaimTask()\"\n                [showCancelButton]=\"showCancelButton\"\n                [customCancelButtonText]=\"customCancelButtonText\"\n                [taskId]=\"taskId\"\n                (cancelClick)=\"onCancelClick()\"\n                (claimTask)=\"onClaimTask()\"\n                (unclaimTask)=\"onUnclaimTask()\"\n                (error)=\"onError($event)\"\n            />\n        </adf-cloud-form-custom-outcomes>\n    </adf-cloud-form>\n</div>\n", styles: [".adf-task-form-cloud-container{height:100%}.adf-task-form-cloud-container .adf-task-form-container{overflow:hidden}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button){padding-bottom:25px;padding-right:25px}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button) .adf-task-form-actions-button{height:36px;border-radius:5px}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button) .mat-mdc-button{height:36px;border-radius:5px;width:auto;padding:0 16px;margin:0 8px;white-space:nowrap}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button) .mdc-button__label{min-width:58px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: UserTaskCloudButtonsComponent, selector: "adf-cloud-user-task-cloud-buttons", inputs: ["appName", "canClaimTask", "canUnclaimTask", "taskId", "showCancelButton", "customCancelButtonText"], outputs: ["error", "cancelClick", "claimTask", "unclaimTask"] }, { kind: "component", type: FormCustomOutcomesComponent, selector: "adf-cloud-form-custom-outcomes" }, { kind: "component", type: FormCloudComponent, selector: "adf-cloud-form", inputs: ["appName", "appVersion", "formId", "processInstanceId", "taskId", "data", "displayModeConfigurations", "showCompleteButton", "customSaveButtonText", "customCompleteButtonText", "enableParentVisibilityCheck"], outputs: ["formSaved", "formCompleted", "formLoaded", "formDataRefreshed", "formContentClicked", "displayModeOn", "displayModeOff"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TaskFormCloudComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'adf-cloud-task-form', imports: [CommonModule, UserTaskCloudButtonsComponent, FormCustomOutcomesComponent, FormCloudComponent], encapsulation: ViewEncapsulation.None, template: "<div class=\"adf-task-form-cloud-container\">\n    <adf-cloud-form\n        #adfCloudForm\n        [appName]=\"appName\"\n        [appVersion]=\"taskDetails.appVersion\"\n        [taskId]=\"taskId\"\n        [showTitle]=\"showTitle\"\n        [processInstanceId]=\"taskDetails.processInstanceId\"\n        [readOnly]=\"isReadOnly()\"\n        [showRefreshButton]=\"showRefreshButton\"\n        [showValidationIcon]=\"showValidationIcon\"\n        [showCompleteButton]=\"showCompleteButton && canCompleteTask()\"\n        [showSaveButton]=\"showSaveButton && canCompleteTask()\"\n        [customSaveButtonText]=\"customSaveButtonText\"\n        [customCompleteButtonText]=\"customCompleteButtonText\"\n        [displayModeConfigurations]=\"displayModeConfigurations\"\n        (formLoaded)=\"onFormLoaded($event)\"\n        (formSaved)=\"onFormSaved($event)\"\n        (formCompleted)=\"onFormCompleted($event)\"\n        (formError)=\"onError($event)\"\n        (error)=\"onError($event)\"\n        (formContentClicked)=\"onFormContentClicked($event)\"\n        (executeOutcome)=\"onFormExecuteOutcome($event)\"\n        (displayModeOn)=\"onDisplayModeOn($event)\"\n        (displayModeOff)=\"onDisplayModeOff($event)\"\n    >\n        <adf-cloud-form-custom-outcomes>\n            <adf-cloud-user-task-cloud-buttons\n                [appName]=\"appName\"\n                [canClaimTask]=\"canClaimTask()\"\n                [canUnclaimTask]=\"canUnclaimTask()\"\n                [showCancelButton]=\"showCancelButton\"\n                [customCancelButtonText]=\"customCancelButtonText\"\n                [taskId]=\"taskId\"\n                (cancelClick)=\"onCancelClick()\"\n                (claimTask)=\"onClaimTask()\"\n                (unclaimTask)=\"onUnclaimTask()\"\n                (error)=\"onError($event)\"\n            />\n        </adf-cloud-form-custom-outcomes>\n    </adf-cloud-form>\n</div>\n", styles: [".adf-task-form-cloud-container{height:100%}.adf-task-form-cloud-container .adf-task-form-container{overflow:hidden}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button){padding-bottom:25px;padding-right:25px}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button) .adf-task-form-actions-button{height:36px;border-radius:5px}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button) .mat-mdc-button{height:36px;border-radius:5px;width:auto;padding:0 16px;margin:0 8px;white-space:nowrap}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button) .mdc-button__label{min-width:58px}\n"] }]
+            args: [{ selector: 'adf-cloud-task-form', imports: [CommonModule, UserTaskCloudButtonsComponent, FormCustomOutcomesComponent, FormCloudComponent], encapsulation: ViewEncapsulation.None, template: "<div class=\"adf-task-form-cloud-container\">\n    <adf-cloud-form\n        #adfCloudForm\n        [appName]=\"appName\"\n        [appVersion]=\"taskDetails.appVersion\"\n        [taskId]=\"taskId\"\n        [showTitle]=\"showTitle\"\n        [processInstanceId]=\"taskDetails.processInstanceId\"\n        [readOnly]=\"isReadOnly()\"\n        [showRefreshButton]=\"showRefreshButton\"\n        [showValidationIcon]=\"showValidationIcon\"\n        [showCompleteButton]=\"showCompleteButton && canCompleteTask()\"\n        [showSaveButton]=\"showSaveButton && canCompleteTask()\"\n        [customSaveButtonText]=\"customSaveButtonText\"\n        [customCompleteButtonText]=\"customCompleteButtonText\"\n        [displayModeConfigurations]=\"displayModeConfigurations\"\n        [enableParentVisibilityCheck]=\"enableParentVisibilityCheck\"\n        (formLoaded)=\"onFormLoaded($event)\"\n        (formSaved)=\"onFormSaved($event)\"\n        (formCompleted)=\"onFormCompleted($event)\"\n        (formError)=\"onError($event)\"\n        (error)=\"onError($event)\"\n        (formContentClicked)=\"onFormContentClicked($event)\"\n        (executeOutcome)=\"onFormExecuteOutcome($event)\"\n        (displayModeOn)=\"onDisplayModeOn($event)\"\n        (displayModeOff)=\"onDisplayModeOff($event)\"\n    >\n        <adf-cloud-form-custom-outcomes>\n            <adf-cloud-user-task-cloud-buttons\n                [appName]=\"appName\"\n                [canClaimTask]=\"canClaimTask()\"\n                [canUnclaimTask]=\"canUnclaimTask()\"\n                [showCancelButton]=\"showCancelButton\"\n                [customCancelButtonText]=\"customCancelButtonText\"\n                [taskId]=\"taskId\"\n                (cancelClick)=\"onCancelClick()\"\n                (claimTask)=\"onClaimTask()\"\n                (unclaimTask)=\"onUnclaimTask()\"\n                (error)=\"onError($event)\"\n            />\n        </adf-cloud-form-custom-outcomes>\n    </adf-cloud-form>\n</div>\n", styles: [".adf-task-form-cloud-container{height:100%}.adf-task-form-cloud-container .adf-task-form-container{overflow:hidden}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button){padding-bottom:25px;padding-right:25px}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button) .adf-task-form-actions-button{height:36px;border-radius:5px}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button) .mat-mdc-button{height:36px;border-radius:5px;width:auto;padding:0 16px;margin:0 8px;white-space:nowrap}.adf-task-form-cloud-container .adf-task-form-container .adf-task-form-actions:has(button) .mdc-button__label{min-width:58px}\n"] }]
         }], ctorParameters: () => [{ type: TaskCloudService }, { type: i1$1.FormRenderingService }], propDecorators: { appName: [{
                 type: Input
             }], candidateUsers: [{
@@ -9004,6 +9039,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                 type: Input
             }], displayModeConfigurations: [{
                 type: Input
+            }], enableParentVisibilityCheck: [{
+                type: Input
             }], taskDetails: [{
                 type: Input
             }], formLoaded: [{
@@ -9509,6 +9546,11 @@ class UserTaskCloudComponent {
     constructor() {
         /** App id to fetch corresponding form and values. */
         this.appName = '';
+        /**
+         * Toggle to enable parent visibility check for validation.
+         * When enabled, fields inside hidden groups/sections will skip validation.
+         */
+        this.enableParentVisibilityCheck = false;
         /** Toggle readonly state of the task. */
         this.readOnly = false;
         /** Toggle rendering of the `Cancel` button. */
@@ -9690,7 +9732,7 @@ class UserTaskCloudComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: UserTaskCloudComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: UserTaskCloudComponent, isStandalone: true, selector: "adf-cloud-user-task", inputs: { appName: "appName", displayModeConfigurations: "displayModeConfigurations", readOnly: "readOnly", showCancelButton: "showCancelButton", showCompleteButton: "showCompleteButton", showSaveButton: "showSaveButton", customCancelButtonText: "customCancelButtonText", customCompleteButtonText: "customCompleteButtonText", customSaveButtonText: "customSaveButtonText", showNextTaskCheckbox: "showNextTaskCheckbox", isNextTaskCheckboxChecked: "isNextTaskCheckboxChecked", showTitle: "showTitle", showValidationIcon: "showValidationIcon", taskId: "taskId" }, outputs: { cancelClick: "cancelClick", error: "error", nextTaskCheckboxCheckedChanged: "nextTaskCheckboxCheckedChanged", executeOutcome: "executeOutcome", formContentClicked: "formContentClicked", formLoaded: "formLoaded", formSaved: "formSaved", onTaskLoaded: "onTaskLoaded", taskClaimed: "taskClaimed", taskUnclaimed: "taskUnclaimed", taskCompleted: "taskCompleted" }, viewQueries: [{ propertyName: "adfCloudTaskForm", first: true, predicate: ["adfCloudTaskForm"], descendants: true }, { propertyName: "adfCloudTaskScreen", first: true, predicate: ["adfCloudTaskScreen"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"adf-user-task-cloud-container\">\n    <div *ngIf=\"!loading; else loadingTemplate\">\n        <ng-container [ngSwitch]=\"taskType\">\n            <ng-container *ngSwitchCase=\"taskTypeEnum.Form\">\n                <adf-cloud-task-form\n                    #adfCloudTaskForm\n                    [appName]=\"appName\"\n                    [candidateUsers]=\"candidateUsers\"\n                    [candidateGroups]=\"candidateGroups\"\n                    [displayModeConfigurations]=\"displayModeConfigurations\"\n                    [showValidationIcon]=\"showValidationIcon\"\n                    [showTitle]=\"showTitle\"\n                    [taskId]=\"taskId\"\n                    [taskDetails]=\"taskDetails\"\n                    [showCancelButton]=\"showCancelButton\"\n                    [showSaveButton]=\"showSaveButton && canCompleteTask()\"\n                    [showCompleteButton]=\"showCompleteButton && canCompleteTask()\"\n                    [customCancelButtonText]=\"customCancelButtonText\"\n                    [customSaveButtonText]=\"customSaveButtonText\"\n                    [customCompleteButtonText]=\"customCompleteButtonText\"\n                    (cancelClick)=\"onCancelForm()\"\n                    (executeOutcome)=\"onExecuteOutcome($event)\"\n                    (error)=\"onError($event)\"\n                    (formLoaded)=\"onFormLoaded($event)\"\n                    (formSaved)=\"onFormSaved()\"\n                    (formContentClicked)=\"onFormContentClicked($event)\"\n                    (taskCompleted)=\"onCompleteTaskForm()\"\n                    (taskClaimed)=\"onClaimTask()\"\n                    (taskUnclaimed)=\"onTaskUnclaimed()\"\n                />\n            </ng-container>\n\n            <ng-container *ngSwitchCase=\"taskTypeEnum.Screen\">\n                <adf-cloud-task-screen\n                    #adfCloudTaskScreen\n                    [appName]=\"appName\"\n                    [canClaimTask]=\"canClaimTask()\"\n                    [canUnclaimTask]=\"canUnclaimTask()\"\n                    [processInstanceId]=\"taskDetails.processInstanceId\"\n                    [rootProcessInstanceId]=\"taskDetails.rootProcessInstanceId\"\n                    [screenId]=\"screenId\"\n                    [showCancelButton]=\"showCancelButton\"\n                    [taskName]=\"taskDetails.name\"\n                    [taskId]=\"taskId\"\n                    [showNextTaskCheckbox]=\"showNextTaskCheckbox && canCompleteTask()\"\n                    [isNextTaskCheckboxChecked]=\"isNextTaskCheckboxChecked\"\n                    (cancelTask)=\"onCancelClick()\"\n                    (claimTask)=\"onClaimTask()\"\n                    (error)=\"onError($event)\"\n                    (taskCompleted)=\"onCompleteTask($event, taskType)\"\n                    (taskSaved)=\"onFormSaved()\"\n                    (unclaimTask)=\"onUnclaimTask()\"\n                    (nextTaskCheckboxCheckedChanged)=\"onNextTaskCheckboxCheckedChanged($event)\"\n                />\n            </ng-container>\n\n            <ng-container *ngSwitchCase=\"taskTypeEnum.None\">\n                <mat-card appearance=\"outlined\" class=\"adf-task-form-container\">\n                    <mat-card-header *ngIf=\"showTitle\">\n                        <mat-card-title>\n                            <h4>\n                                <span class=\"adf-form-title\">\n                                    {{ taskDetails?.name || 'FORM.FORM_RENDERER.NAMELESS_TASK' | translate }}\n                                </span>\n                            </h4>\n                        </mat-card-title>\n                    </mat-card-header>\n                    <mat-card-content>\n                        <adf-empty-content\n                            [icon]=\"'description'\"\n                            [title]=\"'ADF_CLOUD_TASK_FORM.EMPTY_FORM.TITLE'\"\n                            [subtitle]=\"'ADF_CLOUD_TASK_FORM.EMPTY_FORM.SUBTITLE'\"\n                        />\n                    </mat-card-content>\n                    <mat-card-actions class=\"adf-task-form-actions\" align=\"end\">\n                        <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n                        <button\n                            *ngIf=\"canCompleteTask()\"\n                            mat-button\n                            adf-cloud-complete-task\n                            [appName]=\"appName\"\n                            [taskId]=\"taskId\"\n                            (success)=\"onCompleteTask(false, taskType)\"\n                            (error)=\"onError($event)\"\n                            color=\"primary\"\n                            id=\"adf-form-complete\"\n                        >\n                            {{ customCompleteButtonText || ('ADF_CLOUD_TASK_FORM.EMPTY_FORM.BUTTONS.COMPLETE' | translate) }}\n                        </button>\n                    </mat-card-actions>\n                </mat-card>\n            </ng-container>\n        </ng-container>\n    </div>\n</div>\n\n<ng-template #loadingTemplate>\n    <mat-spinner class=\"adf-user-task-cloud-spinner\" />\n</ng-template>\n\n<ng-template #taskFormCloudButtons>\n    <adf-cloud-user-task-cloud-buttons\n        [appName]=\"appName\"\n        [canClaimTask]=\"canClaimTask()\"\n        [canUnclaimTask]=\"canUnclaimTask()\"\n        [showCancelButton]=\"showCancelButton\"\n        [customCancelButtonText]=\"customCancelButtonText\"\n        [taskId]=\"taskId\"\n        (cancelClick)=\"onCancelClick()\"\n        (claimTask)=\"onClaimTask()\"\n        (unclaimTask)=\"onUnclaimTask()\"\n        (error)=\"onError($event)\"\n    />\n</ng-template>\n", styles: [".adf-user-task-cloud-container{height:100%}.adf-user-task-cloud-container>div{height:100%}.adf-user-task-cloud-spinner{top:50%;left:50%;transform:translate(-50%,-50%)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: UserTaskCloudButtonsComponent, selector: "adf-cloud-user-task-cloud-buttons", inputs: ["appName", "canClaimTask", "canUnclaimTask", "taskId", "showCancelButton", "customCancelButtonText"], outputs: ["error", "cancelClick", "claimTask", "unclaimTask"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { 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: "ngmodule", type: MatCardModule }, { kind: "component", type: i4$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$1.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i4$1.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i4$1.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i4$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "component", type: EmptyContentComponent, selector: "adf-empty-content", inputs: ["icon", "title", "subtitle"] }, { kind: "component", type: TaskScreenCloudComponent, selector: "adf-cloud-task-screen", inputs: ["taskId", "appName", "canClaimTask", "canUnclaimTask", "showCancelButton", "processInstanceId", "taskName", "readOnly", "rootProcessInstanceId", "isNextTaskCheckboxChecked", "showNextTaskCheckbox"], outputs: ["taskSaved", "taskCompleted", "error", "cancelTask", "claimTask", "unclaimTask", "nextTaskCheckboxCheckedChanged"] }, { kind: "component", type: TaskFormCloudComponent, selector: "adf-cloud-task-form", inputs: ["appName", "candidateUsers", "candidateGroups", "taskId", "showTitle", "showRefreshButton", "showValidationIcon", "showCancelButton", "showCompleteButton", "showSaveButton", "customCancelButtonText", "customCompleteButtonText", "customSaveButtonText", "readOnly", "displayModeConfigurations", "taskDetails"], outputs: ["formLoaded", "formSaved", "formCompleted", "taskCompleted", "taskClaimed", "taskUnclaimed", "cancelClick", "error", "formContentClicked", "executeOutcome", "displayModeOn", "displayModeOff"] }, { kind: "directive", type: CompleteTaskDirective, selector: "[adf-cloud-complete-task]", inputs: ["taskId", "appName"], outputs: ["success", "error"] }, { kind: "ngmodule", type: MatCheckboxModule }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: UserTaskCloudComponent, isStandalone: true, selector: "adf-cloud-user-task", inputs: { appName: "appName", displayModeConfigurations: "displayModeConfigurations", enableParentVisibilityCheck: "enableParentVisibilityCheck", readOnly: "readOnly", showCancelButton: "showCancelButton", showCompleteButton: "showCompleteButton", showSaveButton: "showSaveButton", customCancelButtonText: "customCancelButtonText", customCompleteButtonText: "customCompleteButtonText", customSaveButtonText: "customSaveButtonText", showNextTaskCheckbox: "showNextTaskCheckbox", isNextTaskCheckboxChecked: "isNextTaskCheckboxChecked", showTitle: "showTitle", showValidationIcon: "showValidationIcon", taskId: "taskId" }, outputs: { cancelClick: "cancelClick", error: "error", nextTaskCheckboxCheckedChanged: "nextTaskCheckboxCheckedChanged", executeOutcome: "executeOutcome", formContentClicked: "formContentClicked", formLoaded: "formLoaded", formSaved: "formSaved", onTaskLoaded: "onTaskLoaded", taskClaimed: "taskClaimed", taskUnclaimed: "taskUnclaimed", taskCompleted: "taskCompleted" }, viewQueries: [{ propertyName: "adfCloudTaskForm", first: true, predicate: ["adfCloudTaskForm"], descendants: true }, { propertyName: "adfCloudTaskScreen", first: true, predicate: ["adfCloudTaskScreen"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"adf-user-task-cloud-container\">\n    <div *ngIf=\"!loading; else loadingTemplate\">\n        <ng-container [ngSwitch]=\"taskType\">\n            <ng-container *ngSwitchCase=\"taskTypeEnum.Form\">\n                <adf-cloud-task-form\n                    #adfCloudTaskForm\n                    [appName]=\"appName\"\n                    [candidateUsers]=\"candidateUsers\"\n                    [candidateGroups]=\"candidateGroups\"\n                    [displayModeConfigurations]=\"displayModeConfigurations\"\n                    [enableParentVisibilityCheck]=\"enableParentVisibilityCheck\"\n                    [showValidationIcon]=\"showValidationIcon\"\n                    [showTitle]=\"showTitle\"\n                    [taskId]=\"taskId\"\n                    [taskDetails]=\"taskDetails\"\n                    [showCancelButton]=\"showCancelButton\"\n                    [showSaveButton]=\"showSaveButton && canCompleteTask()\"\n                    [showCompleteButton]=\"showCompleteButton && canCompleteTask()\"\n                    [customCancelButtonText]=\"customCancelButtonText\"\n                    [customSaveButtonText]=\"customSaveButtonText\"\n                    [customCompleteButtonText]=\"customCompleteButtonText\"\n                    (cancelClick)=\"onCancelForm()\"\n                    (executeOutcome)=\"onExecuteOutcome($event)\"\n                    (error)=\"onError($event)\"\n                    (formLoaded)=\"onFormLoaded($event)\"\n                    (formSaved)=\"onFormSaved()\"\n                    (formContentClicked)=\"onFormContentClicked($event)\"\n                    (taskCompleted)=\"onCompleteTaskForm()\"\n                    (taskClaimed)=\"onClaimTask()\"\n                    (taskUnclaimed)=\"onTaskUnclaimed()\"\n                />\n            </ng-container>\n\n            <ng-container *ngSwitchCase=\"taskTypeEnum.Screen\">\n                <adf-cloud-task-screen\n                    #adfCloudTaskScreen\n                    [appName]=\"appName\"\n                    [canClaimTask]=\"canClaimTask()\"\n                    [canUnclaimTask]=\"canUnclaimTask()\"\n                    [processInstanceId]=\"taskDetails.processInstanceId\"\n                    [rootProcessInstanceId]=\"taskDetails.rootProcessInstanceId\"\n                    [screenId]=\"screenId\"\n                    [showCancelButton]=\"showCancelButton\"\n                    [taskName]=\"taskDetails.name\"\n                    [taskId]=\"taskId\"\n                    [showNextTaskCheckbox]=\"showNextTaskCheckbox && canCompleteTask()\"\n                    [isNextTaskCheckboxChecked]=\"isNextTaskCheckboxChecked\"\n                    (cancelTask)=\"onCancelClick()\"\n                    (claimTask)=\"onClaimTask()\"\n                    (error)=\"onError($event)\"\n                    (taskCompleted)=\"onCompleteTask($event, taskType)\"\n                    (taskSaved)=\"onFormSaved()\"\n                    (unclaimTask)=\"onUnclaimTask()\"\n                    (nextTaskCheckboxCheckedChanged)=\"onNextTaskCheckboxCheckedChanged($event)\"\n                />\n            </ng-container>\n\n            <ng-container *ngSwitchCase=\"taskTypeEnum.None\">\n                <mat-card appearance=\"outlined\" class=\"adf-task-form-container\">\n                    <mat-card-header *ngIf=\"showTitle\">\n                        <mat-card-title>\n                            <h4>\n                                <span class=\"adf-form-title\">\n                                    {{ taskDetails?.name || 'FORM.FORM_RENDERER.NAMELESS_TASK' | translate }}\n                                </span>\n                            </h4>\n                        </mat-card-title>\n                    </mat-card-header>\n                    <mat-card-content>\n                        <adf-empty-content\n                            [icon]=\"'description'\"\n                            [title]=\"'ADF_CLOUD_TASK_FORM.EMPTY_FORM.TITLE'\"\n                            [subtitle]=\"'ADF_CLOUD_TASK_FORM.EMPTY_FORM.SUBTITLE'\"\n                        />\n                    </mat-card-content>\n                    <mat-card-actions class=\"adf-task-form-actions\" align=\"end\">\n                        <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n                        <button\n                            *ngIf=\"canCompleteTask()\"\n                            mat-button\n                            adf-cloud-complete-task\n                            [appName]=\"appName\"\n                            [taskId]=\"taskId\"\n                            (success)=\"onCompleteTask(false, taskType)\"\n                            (error)=\"onError($event)\"\n                            color=\"primary\"\n                            id=\"adf-form-complete\"\n                        >\n                            {{ customCompleteButtonText || ('ADF_CLOUD_TASK_FORM.EMPTY_FORM.BUTTONS.COMPLETE' | translate) }}\n                        </button>\n                    </mat-card-actions>\n                </mat-card>\n            </ng-container>\n        </ng-container>\n    </div>\n</div>\n\n<ng-template #loadingTemplate>\n    <mat-spinner class=\"adf-user-task-cloud-spinner\" />\n</ng-template>\n\n<ng-template #taskFormCloudButtons>\n    <adf-cloud-user-task-cloud-buttons\n        [appName]=\"appName\"\n        [canClaimTask]=\"canClaimTask()\"\n        [canUnclaimTask]=\"canUnclaimTask()\"\n        [showCancelButton]=\"showCancelButton\"\n        [customCancelButtonText]=\"customCancelButtonText\"\n        [taskId]=\"taskId\"\n        (cancelClick)=\"onCancelClick()\"\n        (claimTask)=\"onClaimTask()\"\n        (unclaimTask)=\"onUnclaimTask()\"\n        (error)=\"onError($event)\"\n    />\n</ng-template>\n", styles: [".adf-user-task-cloud-container{height:100%}.adf-user-task-cloud-container>div{height:100%}.adf-user-task-cloud-spinner{top:50%;left:50%;transform:translate(-50%,-50%)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: UserTaskCloudButtonsComponent, selector: "adf-cloud-user-task-cloud-buttons", inputs: ["appName", "canClaimTask", "canUnclaimTask", "taskId", "showCancelButton", "customCancelButtonText"], outputs: ["error", "cancelClick", "claimTask", "unclaimTask"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { 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: "ngmodule", type: MatCardModule }, { kind: "component", type: i4$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$1.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i4$1.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i4$1.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i4$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "component", type: EmptyContentComponent, selector: "adf-empty-content", inputs: ["icon", "title", "subtitle"] }, { kind: "component", type: TaskScreenCloudComponent, selector: "adf-cloud-task-screen", inputs: ["taskId", "appName", "canClaimTask", "canUnclaimTask", "showCancelButton", "processInstanceId", "taskName", "readOnly", "rootProcessInstanceId", "isNextTaskCheckboxChecked", "showNextTaskCheckbox"], outputs: ["taskSaved", "taskCompleted", "error", "cancelTask", "claimTask", "unclaimTask", "nextTaskCheckboxCheckedChanged"] }, { kind: "component", type: TaskFormCloudComponent, selector: "adf-cloud-task-form", inputs: ["appName", "candidateUsers", "candidateGroups", "taskId", "showTitle", "showRefreshButton", "showValidationIcon", "showCancelButton", "showCompleteButton", "showSaveButton", "customCancelButtonText", "customCompleteButtonText", "customSaveButtonText", "readOnly", "displayModeConfigurations", "enableParentVisibilityCheck", "taskDetails"], outputs: ["formLoaded", "formSaved", "formCompleted", "taskCompleted", "taskClaimed", "taskUnclaimed", "cancelClick", "error", "formContentClicked", "executeOutcome", "displayModeOn", "displayModeOff"] }, { kind: "directive", type: CompleteTaskDirective, selector: "[adf-cloud-complete-task]", inputs: ["taskId", "appName"], outputs: ["success", "error"] }, { kind: "ngmodule", type: MatCheckboxModule }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: UserTaskCloudComponent, decorators: [{
             type: Component,
@@ -9706,7 +9748,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                         TaskFormCloudComponent,
                         CompleteTaskDirective,
                         MatCheckboxModule
-                    ], template: "<div class=\"adf-user-task-cloud-container\">\n    <div *ngIf=\"!loading; else loadingTemplate\">\n        <ng-container [ngSwitch]=\"taskType\">\n            <ng-container *ngSwitchCase=\"taskTypeEnum.Form\">\n                <adf-cloud-task-form\n                    #adfCloudTaskForm\n                    [appName]=\"appName\"\n                    [candidateUsers]=\"candidateUsers\"\n                    [candidateGroups]=\"candidateGroups\"\n                    [displayModeConfigurations]=\"displayModeConfigurations\"\n                    [showValidationIcon]=\"showValidationIcon\"\n                    [showTitle]=\"showTitle\"\n                    [taskId]=\"taskId\"\n                    [taskDetails]=\"taskDetails\"\n                    [showCancelButton]=\"showCancelButton\"\n                    [showSaveButton]=\"showSaveButton && canCompleteTask()\"\n                    [showCompleteButton]=\"showCompleteButton && canCompleteTask()\"\n                    [customCancelButtonText]=\"customCancelButtonText\"\n                    [customSaveButtonText]=\"customSaveButtonText\"\n                    [customCompleteButtonText]=\"customCompleteButtonText\"\n                    (cancelClick)=\"onCancelForm()\"\n                    (executeOutcome)=\"onExecuteOutcome($event)\"\n                    (error)=\"onError($event)\"\n                    (formLoaded)=\"onFormLoaded($event)\"\n                    (formSaved)=\"onFormSaved()\"\n                    (formContentClicked)=\"onFormContentClicked($event)\"\n                    (taskCompleted)=\"onCompleteTaskForm()\"\n                    (taskClaimed)=\"onClaimTask()\"\n                    (taskUnclaimed)=\"onTaskUnclaimed()\"\n                />\n            </ng-container>\n\n            <ng-container *ngSwitchCase=\"taskTypeEnum.Screen\">\n                <adf-cloud-task-screen\n                    #adfCloudTaskScreen\n                    [appName]=\"appName\"\n                    [canClaimTask]=\"canClaimTask()\"\n                    [canUnclaimTask]=\"canUnclaimTask()\"\n                    [processInstanceId]=\"taskDetails.processInstanceId\"\n                    [rootProcessInstanceId]=\"taskDetails.rootProcessInstanceId\"\n                    [screenId]=\"screenId\"\n                    [showCancelButton]=\"showCancelButton\"\n                    [taskName]=\"taskDetails.name\"\n                    [taskId]=\"taskId\"\n                    [showNextTaskCheckbox]=\"showNextTaskCheckbox && canCompleteTask()\"\n                    [isNextTaskCheckboxChecked]=\"isNextTaskCheckboxChecked\"\n                    (cancelTask)=\"onCancelClick()\"\n                    (claimTask)=\"onClaimTask()\"\n                    (error)=\"onError($event)\"\n                    (taskCompleted)=\"onCompleteTask($event, taskType)\"\n                    (taskSaved)=\"onFormSaved()\"\n                    (unclaimTask)=\"onUnclaimTask()\"\n                    (nextTaskCheckboxCheckedChanged)=\"onNextTaskCheckboxCheckedChanged($event)\"\n                />\n            </ng-container>\n\n            <ng-container *ngSwitchCase=\"taskTypeEnum.None\">\n                <mat-card appearance=\"outlined\" class=\"adf-task-form-container\">\n                    <mat-card-header *ngIf=\"showTitle\">\n                        <mat-card-title>\n                            <h4>\n                                <span class=\"adf-form-title\">\n                                    {{ taskDetails?.name || 'FORM.FORM_RENDERER.NAMELESS_TASK' | translate }}\n                                </span>\n                            </h4>\n                        </mat-card-title>\n                    </mat-card-header>\n                    <mat-card-content>\n                        <adf-empty-content\n                            [icon]=\"'description'\"\n                            [title]=\"'ADF_CLOUD_TASK_FORM.EMPTY_FORM.TITLE'\"\n                            [subtitle]=\"'ADF_CLOUD_TASK_FORM.EMPTY_FORM.SUBTITLE'\"\n                        />\n                    </mat-card-content>\n                    <mat-card-actions class=\"adf-task-form-actions\" align=\"end\">\n                        <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n                        <button\n                            *ngIf=\"canCompleteTask()\"\n                            mat-button\n                            adf-cloud-complete-task\n                            [appName]=\"appName\"\n                            [taskId]=\"taskId\"\n                            (success)=\"onCompleteTask(false, taskType)\"\n                            (error)=\"onError($event)\"\n                            color=\"primary\"\n                            id=\"adf-form-complete\"\n                        >\n                            {{ customCompleteButtonText || ('ADF_CLOUD_TASK_FORM.EMPTY_FORM.BUTTONS.COMPLETE' | translate) }}\n                        </button>\n                    </mat-card-actions>\n                </mat-card>\n            </ng-container>\n        </ng-container>\n    </div>\n</div>\n\n<ng-template #loadingTemplate>\n    <mat-spinner class=\"adf-user-task-cloud-spinner\" />\n</ng-template>\n\n<ng-template #taskFormCloudButtons>\n    <adf-cloud-user-task-cloud-buttons\n        [appName]=\"appName\"\n        [canClaimTask]=\"canClaimTask()\"\n        [canUnclaimTask]=\"canUnclaimTask()\"\n        [showCancelButton]=\"showCancelButton\"\n        [customCancelButtonText]=\"customCancelButtonText\"\n        [taskId]=\"taskId\"\n        (cancelClick)=\"onCancelClick()\"\n        (claimTask)=\"onClaimTask()\"\n        (unclaimTask)=\"onUnclaimTask()\"\n        (error)=\"onError($event)\"\n    />\n</ng-template>\n", styles: [".adf-user-task-cloud-container{height:100%}.adf-user-task-cloud-container>div{height:100%}.adf-user-task-cloud-spinner{top:50%;left:50%;transform:translate(-50%,-50%)}\n"] }]
+                    ], template: "<div class=\"adf-user-task-cloud-container\">\n    <div *ngIf=\"!loading; else loadingTemplate\">\n        <ng-container [ngSwitch]=\"taskType\">\n            <ng-container *ngSwitchCase=\"taskTypeEnum.Form\">\n                <adf-cloud-task-form\n                    #adfCloudTaskForm\n                    [appName]=\"appName\"\n                    [candidateUsers]=\"candidateUsers\"\n                    [candidateGroups]=\"candidateGroups\"\n                    [displayModeConfigurations]=\"displayModeConfigurations\"\n                    [enableParentVisibilityCheck]=\"enableParentVisibilityCheck\"\n                    [showValidationIcon]=\"showValidationIcon\"\n                    [showTitle]=\"showTitle\"\n                    [taskId]=\"taskId\"\n                    [taskDetails]=\"taskDetails\"\n                    [showCancelButton]=\"showCancelButton\"\n                    [showSaveButton]=\"showSaveButton && canCompleteTask()\"\n                    [showCompleteButton]=\"showCompleteButton && canCompleteTask()\"\n                    [customCancelButtonText]=\"customCancelButtonText\"\n                    [customSaveButtonText]=\"customSaveButtonText\"\n                    [customCompleteButtonText]=\"customCompleteButtonText\"\n                    (cancelClick)=\"onCancelForm()\"\n                    (executeOutcome)=\"onExecuteOutcome($event)\"\n                    (error)=\"onError($event)\"\n                    (formLoaded)=\"onFormLoaded($event)\"\n                    (formSaved)=\"onFormSaved()\"\n                    (formContentClicked)=\"onFormContentClicked($event)\"\n                    (taskCompleted)=\"onCompleteTaskForm()\"\n                    (taskClaimed)=\"onClaimTask()\"\n                    (taskUnclaimed)=\"onTaskUnclaimed()\"\n                />\n            </ng-container>\n\n            <ng-container *ngSwitchCase=\"taskTypeEnum.Screen\">\n                <adf-cloud-task-screen\n                    #adfCloudTaskScreen\n                    [appName]=\"appName\"\n                    [canClaimTask]=\"canClaimTask()\"\n                    [canUnclaimTask]=\"canUnclaimTask()\"\n                    [processInstanceId]=\"taskDetails.processInstanceId\"\n                    [rootProcessInstanceId]=\"taskDetails.rootProcessInstanceId\"\n                    [screenId]=\"screenId\"\n                    [showCancelButton]=\"showCancelButton\"\n                    [taskName]=\"taskDetails.name\"\n                    [taskId]=\"taskId\"\n                    [showNextTaskCheckbox]=\"showNextTaskCheckbox && canCompleteTask()\"\n                    [isNextTaskCheckboxChecked]=\"isNextTaskCheckboxChecked\"\n                    (cancelTask)=\"onCancelClick()\"\n                    (claimTask)=\"onClaimTask()\"\n                    (error)=\"onError($event)\"\n                    (taskCompleted)=\"onCompleteTask($event, taskType)\"\n                    (taskSaved)=\"onFormSaved()\"\n                    (unclaimTask)=\"onUnclaimTask()\"\n                    (nextTaskCheckboxCheckedChanged)=\"onNextTaskCheckboxCheckedChanged($event)\"\n                />\n            </ng-container>\n\n            <ng-container *ngSwitchCase=\"taskTypeEnum.None\">\n                <mat-card appearance=\"outlined\" class=\"adf-task-form-container\">\n                    <mat-card-header *ngIf=\"showTitle\">\n                        <mat-card-title>\n                            <h4>\n                                <span class=\"adf-form-title\">\n                                    {{ taskDetails?.name || 'FORM.FORM_RENDERER.NAMELESS_TASK' | translate }}\n                                </span>\n                            </h4>\n                        </mat-card-title>\n                    </mat-card-header>\n                    <mat-card-content>\n                        <adf-empty-content\n                            [icon]=\"'description'\"\n                            [title]=\"'ADF_CLOUD_TASK_FORM.EMPTY_FORM.TITLE'\"\n                            [subtitle]=\"'ADF_CLOUD_TASK_FORM.EMPTY_FORM.SUBTITLE'\"\n                        />\n                    </mat-card-content>\n                    <mat-card-actions class=\"adf-task-form-actions\" align=\"end\">\n                        <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n                        <button\n                            *ngIf=\"canCompleteTask()\"\n                            mat-button\n                            adf-cloud-complete-task\n                            [appName]=\"appName\"\n                            [taskId]=\"taskId\"\n                            (success)=\"onCompleteTask(false, taskType)\"\n                            (error)=\"onError($event)\"\n                            color=\"primary\"\n                            id=\"adf-form-complete\"\n                        >\n                            {{ customCompleteButtonText || ('ADF_CLOUD_TASK_FORM.EMPTY_FORM.BUTTONS.COMPLETE' | translate) }}\n                        </button>\n                    </mat-card-actions>\n                </mat-card>\n            </ng-container>\n        </ng-container>\n    </div>\n</div>\n\n<ng-template #loadingTemplate>\n    <mat-spinner class=\"adf-user-task-cloud-spinner\" />\n</ng-template>\n\n<ng-template #taskFormCloudButtons>\n    <adf-cloud-user-task-cloud-buttons\n        [appName]=\"appName\"\n        [canClaimTask]=\"canClaimTask()\"\n        [canUnclaimTask]=\"canUnclaimTask()\"\n        [showCancelButton]=\"showCancelButton\"\n        [customCancelButtonText]=\"customCancelButtonText\"\n        [taskId]=\"taskId\"\n        (cancelClick)=\"onCancelClick()\"\n        (claimTask)=\"onClaimTask()\"\n        (unclaimTask)=\"onUnclaimTask()\"\n        (error)=\"onError($event)\"\n    />\n</ng-template>\n", styles: [".adf-user-task-cloud-container{height:100%}.adf-user-task-cloud-container>div{height:100%}.adf-user-task-cloud-spinner{top:50%;left:50%;transform:translate(-50%,-50%)}\n"] }]
         }], propDecorators: { adfCloudTaskForm: [{
                 type: ViewChild,
                 args: ['adfCloudTaskForm']
@@ -9717,6 +9759,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                 type: Input
             }], displayModeConfigurations: [{
                 type: Input
+            }], enableParentVisibilityCheck: [{
+                type: Input
             }], readOnly: [{
                 type: Input
             }], showCancelButton: [{
@@ -13287,6 +13331,11 @@ class StartProcessCloudComponent {
         this.showTitle = true;
         /** Show/hide cancel button. */
         this.showCancelButton = true;
+        /**
+         * Toggle to enable parent visibility check for validation.
+         * When enabled, fields inside hidden groups/sections will skip validation.
+         */
+        this.enableParentVisibilityCheck = false;
         /** Emitted when the process is successfully started. */
         this.success = new EventEmitter();
         /** Emitted when the starting process is cancelled */
@@ -13619,7 +13668,7 @@ class StartProcessCloudComponent {
         return processName;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: StartProcessCloudComponent, deps: [{ token: i1$1.TranslationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", 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 (processDefinitionLoaded && !isFormCloudLoading) {\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 if (hasScreen) {\n                        <adf-cloud-start-process-screen-cloud\n                            [screenId]=\"processDefinitionCurrent.formKey\"\n                            (screenStartProcessPayloadChange)=\"onScreenStartProcessPayloadChange($event)\"\n                            (disableStartProcessButton)=\"onDisableStartProcessButtonForScreen($event)\"\n                        >\n                            <adf-cloud-form-custom-outcomes>\n                                <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n                            </adf-cloud-form-custom-outcomes>\n                        </adf-cloud-start-process-screen-cloud>\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: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i4$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$1.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i4$1.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i4$1.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$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.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.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.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$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.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" }, { kind: "component", type: StartProcessScreenCloudComponent, selector: "adf-cloud-start-process-screen-cloud", inputs: ["processDefinitionId"], outputs: ["screenStartProcessPayloadChange", "disableStartProcessButton"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", 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", enableParentVisibilityCheck: "enableParentVisibilityCheck" }, 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 (processDefinitionLoaded && !isFormCloudLoading) {\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                            [enableParentVisibilityCheck]=\"enableParentVisibilityCheck\"\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 if (hasScreen) {\n                        <adf-cloud-start-process-screen-cloud\n                            [screenId]=\"processDefinitionCurrent.formKey\"\n                            (screenStartProcessPayloadChange)=\"onScreenStartProcessPayloadChange($event)\"\n                            (disableStartProcessButton)=\"onDisableStartProcessButtonForScreen($event)\"\n                        >\n                            <adf-cloud-form-custom-outcomes>\n                                <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n                            </adf-cloud-form-custom-outcomes>\n                        </adf-cloud-start-process-screen-cloud>\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: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i4$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$1.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i4$1.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i4$1.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$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.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.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.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$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.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", "enableParentVisibilityCheck"], outputs: ["formSaved", "formCompleted", "formLoaded", "formDataRefreshed", "formContentClicked", "displayModeOn", "displayModeOff"] }, { kind: "component", type: FormCustomOutcomesComponent, selector: "adf-cloud-form-custom-outcomes" }, { kind: "component", type: StartProcessScreenCloudComponent, selector: "adf-cloud-start-process-screen-cloud", inputs: ["processDefinitionId"], outputs: ["screenStartProcessPayloadChange", "disableStartProcessButton"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: StartProcessCloudComponent, decorators: [{
             type: Component,
@@ -13638,7 +13687,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                         FormCloudComponent,
                         FormCustomOutcomesComponent,
                         StartProcessScreenCloudComponent
-                    ], providers: [LocalizedDatePipe], encapsulation: ViewEncapsulation.None, template: "@if (processDefinitionLoaded && !isFormCloudLoading) {\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 if (hasScreen) {\n                        <adf-cloud-start-process-screen-cloud\n                            [screenId]=\"processDefinitionCurrent.formKey\"\n                            (screenStartProcessPayloadChange)=\"onScreenStartProcessPayloadChange($event)\"\n                            (disableStartProcessButton)=\"onDisableStartProcessButtonForScreen($event)\"\n                        >\n                            <adf-cloud-form-custom-outcomes>\n                                <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n                            </adf-cloud-form-custom-outcomes>\n                        </adf-cloud-start-process-screen-cloud>\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"] }]
+                    ], providers: [LocalizedDatePipe], encapsulation: ViewEncapsulation.None, template: "@if (processDefinitionLoaded && !isFormCloudLoading) {\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                            [enableParentVisibilityCheck]=\"enableParentVisibilityCheck\"\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 if (hasScreen) {\n                        <adf-cloud-start-process-screen-cloud\n                            [screenId]=\"processDefinitionCurrent.formKey\"\n                            (screenStartProcessPayloadChange)=\"onScreenStartProcessPayloadChange($event)\"\n                            (disableStartProcessButton)=\"onDisableStartProcessButtonForScreen($event)\"\n                        >\n                            <adf-cloud-form-custom-outcomes>\n                                <ng-template [ngTemplateOutlet]=\"taskFormCloudButtons\" />\n                            </adf-cloud-form-custom-outcomes>\n                        </adf-cloud-start-process-screen-cloud>\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"] }]
         }], ctorParameters: () => [{ type: i1$1.TranslationService }], propDecorators: { inputAutocomplete: [{
                 type: ViewChild,
                 args: [MatAutocompleteTrigger]
@@ -13662,6 +13711,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                 type: Input
             }], displayModeConfigurations: [{
                 type: Input
+            }], enableParentVisibilityCheck: [{
+                type: Input
             }], success: [{
                 type: Output
             }], cancel: [{