@gravitee/ui-particles-angular 7.17.0 → 7.17.1-policy-studio-step-8-63d2287

package/fesm2020/gravitee-ui-particles-angular.mjs

@@ -1,24 +1,27 @@
-import { trigger, transition, style, animate } from '@angular/animations';
+import * as i2$1 from '@angular/common';
+import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, HostBinding, Input, Output, HostListener, NgModule, Optional, Self, ViewChild, Directive, Inject, forwardRef, ChangeDetectionStrategy, Injectable, ViewEncapsulation, ContentChildren, Host, ContentChild, InjectionToken } from '@angular/core';
-import { timer, Subject, fromEvent, of, BehaviorSubject, ReplaySubject, merge } from 'rxjs';
+import { Injectable, SecurityContext, APP_ID, Component, Inject, Input, NgModule, EventEmitter, HostBinding, Output, HostListener, Optional, Self, ViewChild, Directive, forwardRef, ChangeDetectionStrategy, ViewEncapsulation, ContentChildren, Host, ContentChild, InjectionToken } from '@angular/core';
+import * as i4 from '@angular/common/http';
+import { HttpClientModule } from '@angular/common/http';
+import { shareReplay, switchMap, catchError, takeUntil, startWith, map, distinctUntilChanged, tap, debounce, delay, filter, take, debounceTime } from 'rxjs/operators';
+import { Observable, of, ReplaySubject, Subject, forkJoin, timer, fromEvent, BehaviorSubject, merge } from 'rxjs';
+import * as i3 from '@angular/platform-browser';
+import { trigger, transition, style, animate } from '@angular/animations';
 import * as i1 from '@angular/material/card';
 import { MatCardModule } from '@angular/material/card';
 import * as i2 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
-import * as i2$1 from '@angular/common';
-import { CommonModule } from '@angular/common';
 import { ComponentHarness, HarnessPredicate, parallel, TestKey } from '@angular/cdk/testing';
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
-import * as i3$1 from '@angular/material/form-field';
+import * as i3$2 from '@angular/material/form-field';
 import { MatFormFieldControl, MatFormFieldModule, MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field';
 import { isEmpty, toLower, dropRight, isNil, isArray, remove, isObject, cloneDeep, uniqueId, set } from 'lodash';
-import { startWith, map, distinctUntilChanged, tap, debounce, takeUntil, delay, filter, switchMap, take, debounceTime } from 'rxjs/operators';
 import * as i7 from '@angular/forms';
 import { FormsModule, FormArray, FormGroup, FormControl, NG_VALUE_ACCESSOR, ReactiveFormsModule, NgControl } from '@angular/forms';
 import * as i2$2 from '@angular/cdk/a11y';
 import { A11yModule } from '@angular/cdk/a11y';
-import * as i3 from '@angular/material/chips';
+import * as i3$1 from '@angular/material/chips';
 import { MatChipsModule } from '@angular/material/chips';
 import * as i1$1 from '@angular/material/icon';
 import { MatIconModule } from '@angular/material/icon';
@@ -28,12 +31,10 @@ import * as i6 from '@angular/material/core';
 import { MatOptionModule, MatRippleModule } from '@angular/material/core';
 import * as i6$1 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
-import * as i2$4 from '@angular/material/select';
+import * as i2$3 from '@angular/material/select';
 import { MatSelectModule } from '@angular/material/select';
 import { MatAutocompleteHarness } from '@angular/material/autocomplete/testing';
 import { MatChipListHarness } from '@angular/material/chips/testing';
-import { HttpClientModule } from '@angular/common/http';
-import * as i2$3 from '@angular/platform-browser';
 import * as i1$2 from '@angular/material/dialog';
 import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
 import { MatButtonHarness } from '@angular/material/button/testing';
@@ -47,10 +48,258 @@ import * as i1$3 from '@ngx-formly/core/json-schema';
 import * as i1$4 from '@ngx-formly/core';
 import { FieldType, FieldArrayType, FieldWrapper, FormlyModule } from '@ngx-formly/core';
 import { FieldType as FieldType$1, FormlyMaterialModule } from '@ngx-formly/material';
-import * as i3$2 from '@angular/material/slide-toggle';
+import * as i3$3 from '@angular/material/slide-toggle';
 import { MatSlideToggle, MatSlideToggleModule } from '@angular/material/slide-toggle';
 import { TestBed } from '@angular/core/testing';
 
+/*
+ * Copyright (C) 2023 The Gravitee team (http://gravitee.io)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *         http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+class GioAsciidoctorService {
+    load() {
+        return this.loadAsciidoctor().pipe(
+        // If already loaded, we don't want to load it again
+        shareReplay(1));
+    }
+    loadAsciidoctor() {
+        return new Observable(observer => {
+            const onGotAsciidoctor = () => {
+                observer.next(window.Asciidoctor());
+                observer.complete();
+            };
+            if (!window.Asciidoctor) {
+                const loaderScript = document.createElement('script');
+                loaderScript.type = 'text/javascript';
+                loaderScript.src = 'assets/asciidoctor/asciidoctor.js';
+                loaderScript.addEventListener('load', onGotAsciidoctor);
+                loaderScript.addEventListener('error', err => observer.error(err));
+                document.body.appendChild(loaderScript);
+            }
+            else {
+                onGotAsciidoctor();
+            }
+        });
+    }
+}
+GioAsciidoctorService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioAsciidoctorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+GioAsciidoctorService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioAsciidoctorService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioAsciidoctorService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+/*
+ * Copyright (C) 2023 The Gravitee team (http://gravitee.io)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *         http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+class GioPrismJsService {
+    loadPrismJs() {
+        // First load PrismJs
+        return this.loadPrimeJsCore().pipe(
+        // Then load PrismJs components
+        switchMap(() => this.loadPrismJsComponent('json')), 
+        // If already loaded, we don't want to load it again
+        shareReplay(1), 
+        // Ignore error
+        catchError(() => of(undefined)));
+    }
+    loadPrimeJsCore() {
+        return new Observable(observer => {
+            const onGotPrismJs = () => {
+                observer.next();
+                observer.complete();
+            };
+            if (!window.Prism) {
+                const loaderPrismjs = document.createElement('script');
+                loaderPrismjs.type = 'text/javascript';
+                loaderPrismjs.src = 'assets/prismjs/prism.js';
+                loaderPrismjs.addEventListener('load', onGotPrismJs);
+                loaderPrismjs.addEventListener('error', err => observer.error(err));
+                document.body.appendChild(loaderPrismjs);
+            }
+            else {
+                onGotPrismJs();
+            }
+        });
+    }
+    loadPrismJsComponent(name) {
+        return new Observable(observer => {
+            const onGotPrismJsComponent = () => {
+                observer.next();
+                observer.complete();
+            };
+            if (!window.Prism.languages[name]) {
+                const loaderPrismjsJson = document.createElement('script');
+                loaderPrismjsJson.type = 'text/javascript';
+                loaderPrismjsJson.src = `assets/prismjs/components/prism-${name}.js`;
+                loaderPrismjsJson.addEventListener('load', onGotPrismJsComponent);
+                loaderPrismjsJson.addEventListener('error', err => observer.error(err));
+                document.body.appendChild(loaderPrismjsJson);
+            }
+            else {
+                onGotPrismJsComponent();
+            }
+        });
+    }
+}
+GioPrismJsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioPrismJsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+GioPrismJsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioPrismJsService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioPrismJsService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+/*
+ * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *         http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+class GioAsciidoctorComponent {
+    constructor(gioAsciidoctorService, gioPrismJsService, sanitizer, elementRef, httpClient, appId) {
+        this.gioAsciidoctorService = gioAsciidoctorService;
+        this.gioPrismJsService = gioPrismJsService;
+        this.sanitizer = sanitizer;
+        this.elementRef = elementRef;
+        this.httpClient = httpClient;
+        this.appId = appId;
+        this.options = {
+            header_footer: false,
+            attributes: {
+                showtitle: true,
+            },
+            safe: 'secure',
+        };
+        this.asciidoctor$ = new ReplaySubject(1);
+        this.unsubscribe$ = new Subject();
+        this._uniqueId = this.constructor['ɵcmp'].id;
+        // Asynchronously load asciidoctor.js and prism.js
+        forkJoin([this.gioAsciidoctorService.load(), this.gioPrismJsService.loadPrismJs()])
+            .pipe(takeUntil(this.unsubscribe$))
+            .subscribe(([asciidoctor]) => {
+            this.asciidoctor$.next(asciidoctor);
+        });
+    }
+    ngOnChanges(changes) {
+        if (changes.content && this.content) {
+            this.render(this.content);
+        }
+        if (changes.src && this.src) {
+            this.httpClient
+                .get(this.src, { responseType: 'text' })
+                .pipe(takeUntil(this.unsubscribe$))
+                .subscribe(content => {
+                this.render(content);
+            });
+        }
+    }
+    ngOnDestroy() {
+        this.unsubscribe$.next();
+        this.unsubscribe$.complete();
+    }
+    render(content) {
+        if (!content) {
+            return;
+        }
+        // When asciidoctor is not loaded yet, wait for it
+        this.asciidoctor$.pipe(takeUntil(this.unsubscribe$)).subscribe(asciidoctor => {
+            const html = asciidoctor.convert(content, this.options);
+            this.elementRef.nativeElement.innerHTML = this.sanitizer.sanitize(SecurityContext.HTML, html);
+            // Highlight all code blocks with PrismJs
+            const highlights = this.elementRef.nativeElement.querySelectorAll('pre.highlight');
+            for (const element of highlights) {
+                element.setAttribute('class', 'prismjs highlight');
+                if (window.Prism) {
+                    window.Prism.highlightAllUnder(element);
+                }
+            }
+            // Manually add Angular encapsulation attribute to all elements at the end
+            const descandants = this.elementRef.nativeElement.querySelectorAll('*');
+            for (const element of descandants) {
+                element.setAttribute(`_ngcontent-${this.appId}-${this._uniqueId}`, '');
+            }
+        });
+    }
+}
+GioAsciidoctorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioAsciidoctorComponent, deps: [{ token: GioAsciidoctorService }, { token: GioPrismJsService }, { token: i3.DomSanitizer }, { token: i0.ElementRef }, { token: i4.HttpClient }, { token: APP_ID }], target: i0.ɵɵFactoryTarget.Component });
+GioAsciidoctorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioAsciidoctorComponent, selector: "gio-asciidoctor", inputs: { content: "content", src: "src" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true, styles: ["@import\"@asciidoctor/core/dist/css/asciidoctor.css\";@import\"prismjs/themes/prism-okaidia.css\";h1,h2,h3,h4,h5,h6,.title,#toctitle,.sidebarblock>.content>.title,.listingblock>.title{color:#100c27;font-family:Golos UI,Roboto,Helvetica Neue,sans-serif}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioAsciidoctorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'gio-asciidoctor', template: '', styles: ["@import\"@asciidoctor/core/dist/css/asciidoctor.css\";@import\"prismjs/themes/prism-okaidia.css\";h1,h2,h3,h4,h5,h6,.title,#toctitle,.sidebarblock>.content>.title,.listingblock>.title{color:#100c27;font-family:Golos UI,Roboto,Helvetica Neue,sans-serif}\n"] }]
+        }], ctorParameters: function () { return [{ type: GioAsciidoctorService }, { type: GioPrismJsService }, { type: i3.DomSanitizer }, { type: i0.ElementRef }, { type: i4.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [APP_ID]
+                }] }]; }, propDecorators: { content: [{
+                type: Input
+            }], src: [{
+                type: Input
+            }] } });
+
+/*
+ * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *         http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+class GioAsciidoctorModule {
+}
+GioAsciidoctorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioAsciidoctorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+GioAsciidoctorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioAsciidoctorModule, declarations: [GioAsciidoctorComponent], imports: [CommonModule, HttpClientModule], exports: [GioAsciidoctorComponent] });
+GioAsciidoctorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioAsciidoctorModule, imports: [[CommonModule, HttpClientModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioAsciidoctorModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, HttpClientModule],
+                    declarations: [GioAsciidoctorComponent],
+                    exports: [GioAsciidoctorComponent],
+                }]
+        }] });
+
 /*
  * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
  *
@@ -449,7 +698,7 @@ GioFormTagsInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             provide: MatFormFieldControl,
             useExisting: GioFormTagsInputComponent,
         },
-    ], viewQueries: [{ propertyName: "tagInput", first: true, predicate: ["tagInput"], descendants: true }], ngImport: i0, template: "<!--\n\n    Copyright (C) 2015 The Gravitee team (http://gravitee.io)\n\n    Licensed under the Apache License, Version 2.0 (the \"License\");\n    you may not use this file except in compliance with the License.\n    You may obtain a copy of the License at\n\n            http://www.apache.org/licenses/LICENSE-2.0\n\n    Unless required by applicable law or agreed to in writing, software\n    distributed under the License is distributed on an \"AS IS\" BASIS,\n    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n    See the License for the specific language governing permissions and\n    limitations under the License.\n\n-->\n<mat-chip-list #tagChipList [attr.aria-label]=\"ariaLabel\" multiple [disabled]=\"disabled\">\n  <mat-chip *ngFor=\"let tag of value\" [selectable]=\"false\" [removable]=\"!disabled\" (removed)=\"removeChipToFormControl(tag)\">\n    {{ tag }}\n    <mat-icon matChipRemove>cancel</mat-icon>\n  </mat-chip>\n  <input\n    *ngIf=\"!disabled\"\n    #tagInput\n    [matAutocompleteDisabled]=\"!_autocompleteOptions\"\n    [matAutocomplete]=\"auto\"\n    [placeholder]=\"placeholder\"\n    [matChipInputFor]=\"tagChipList\"\n    [matChipInputAddOnBlur]=\"addOnBlur\"\n    (matChipInputTokenEnd)=\"onMatChipTokenEnd()\"\n  />\n  <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onAutocompleteSelect($event)\">\n    <mat-option *ngFor=\"let value of autocompleteFilteredOptions$ | async\" [value]=\"value\">\n      {{ value }}\n    </mat-option>\n  </mat-autocomplete>\n</mat-chip-list>\n", styles: [""], components: [{ type: i3.MatChipList, selector: "mat-chip-list", inputs: ["errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i5.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i6.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i3.MatChipRemove, selector: "[matChipRemove]" }, { type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i3.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }], pipes: { "async": i2$1.AsyncPipe } });
+    ], viewQueries: [{ propertyName: "tagInput", first: true, predicate: ["tagInput"], descendants: true }], ngImport: i0, template: "<!--\n\n    Copyright (C) 2015 The Gravitee team (http://gravitee.io)\n\n    Licensed under the Apache License, Version 2.0 (the \"License\");\n    you may not use this file except in compliance with the License.\n    You may obtain a copy of the License at\n\n            http://www.apache.org/licenses/LICENSE-2.0\n\n    Unless required by applicable law or agreed to in writing, software\n    distributed under the License is distributed on an \"AS IS\" BASIS,\n    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n    See the License for the specific language governing permissions and\n    limitations under the License.\n\n-->\n<mat-chip-list #tagChipList [attr.aria-label]=\"ariaLabel\" multiple [disabled]=\"disabled\">\n  <mat-chip *ngFor=\"let tag of value\" [selectable]=\"false\" [removable]=\"!disabled\" (removed)=\"removeChipToFormControl(tag)\">\n    {{ tag }}\n    <mat-icon matChipRemove>cancel</mat-icon>\n  </mat-chip>\n  <input\n    *ngIf=\"!disabled\"\n    #tagInput\n    [matAutocompleteDisabled]=\"!_autocompleteOptions\"\n    [matAutocomplete]=\"auto\"\n    [placeholder]=\"placeholder\"\n    [matChipInputFor]=\"tagChipList\"\n    [matChipInputAddOnBlur]=\"addOnBlur\"\n    (matChipInputTokenEnd)=\"onMatChipTokenEnd()\"\n  />\n  <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onAutocompleteSelect($event)\">\n    <mat-option *ngFor=\"let value of autocompleteFilteredOptions$ | async\" [value]=\"value\">\n      {{ value }}\n    </mat-option>\n  </mat-autocomplete>\n</mat-chip-list>\n", styles: [""], components: [{ type: i3$1.MatChipList, selector: "mat-chip-list", inputs: ["errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i5.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i6.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$1.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i3$1.MatChipRemove, selector: "[matChipRemove]" }, { type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i3$1.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }], pipes: { "async": i2$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormTagsInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'gio-form-tags-input', providers: [
@@ -701,7 +950,7 @@ class GioIconsModule {
         matIconRegistry.addSvgIconSetInNamespace('gio', sanitizer.bypassSecurityTrustResourceUrl('assets/gio-icons.svg'));
     }
 }
-GioIconsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioIconsModule, deps: [{ token: i1$1.MatIconRegistry }, { token: i2$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.NgModule });
+GioIconsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioIconsModule, deps: [{ token: i1$1.MatIconRegistry }, { token: i3.DomSanitizer }], target: i0.ɵɵFactoryTarget.NgModule });
 GioIconsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioIconsModule, imports: [CommonModule, HttpClientModule, MatIconModule], exports: [MatIconModule] });
 GioIconsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioIconsModule, imports: [[CommonModule, HttpClientModule, MatIconModule], MatIconModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioIconsModule, decorators: [{
@@ -710,7 +959,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                     imports: [CommonModule, HttpClientModule, MatIconModule],
                     exports: [MatIconModule],
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.MatIconRegistry }, { type: i2$3.DomSanitizer }]; } });
+        }], ctorParameters: function () { return [{ type: i1$1.MatIconRegistry }, { type: i3.DomSanitizer }]; } });
 
 /*
  * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
@@ -896,7 +1145,7 @@ class GioConfirmAndValidateDialogComponent {
     }
 }
 GioConfirmAndValidateDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioConfirmAndValidateDialogComponent, deps: [{ token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-GioConfirmAndValidateDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioConfirmAndValidateDialogComponent, selector: "gio-confirm-and-validate-dialog", ngImport: i0, template: "<!--\n\n    Copyright (C) 2015 The Gravitee team (http://gravitee.io)\n\n    Licensed under the Apache License, Version 2.0 (the \"License\");\n    you may not use this file except in compliance with the License.\n    You may obtain a copy of the License at\n\n            http://www.apache.org/licenses/LICENSE-2.0\n\n    Unless required by applicable law or agreed to in writing, software\n    distributed under the License is distributed on an \"AS IS\" BASIS,\n    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n    See the License for the specific language governing permissions and\n    limitations under the License.\n\n-->\n<h2 mat-dialog-title class=\"confirm-dialog__title\">{{ title }}</h2>\n\n<mat-dialog-content class=\"confirm-dialog__body\">\n  <gio-banner-warning *ngIf=\"warning\"><span [innerHTML]=\"warning\"></span></gio-banner-warning>\n  <p class=\"confirm-dialog__body__content\" *ngIf=\"content\" [innerHTML]=\"content\"></p>\n  <p class=\"confirm-dialog__body__validate-message\" [innerHTML]=\"validationMessage\"></p>\n  <mat-form-field class=\"confirm-dialog__body__validate-input\" appearance=\"outline\" floatLabel=\"always\">\n    <mat-label>Confirm</mat-label>\n    <input\n      matInput\n      cdkFocusInitial\n      type=\"text\"\n      [placeholder]=\"validationValue\"\n      [ngModel]=\"confirmValue\"\n      (ngModelChange)=\"onConfirmChange($event)\"\n      required\n      data-testid=\"confirm-input-dialog\"\n    />\n  </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\" class=\"confirm-dialog__actions\">\n  <button\n    class=\"confirm-dialog__confirm-button\"\n    [disabled]=\"!isValid\"\n    color=\"warn\"\n    mat-raised-button\n    [mat-dialog-close]=\"true\"\n    data-testid=\"confirm-dialog\"\n  >\n    {{ confirmButton }}\n  </button>\n  <button class=\"confirm-dialog__cancel-button\" mat-flat-button [mat-dialog-close]=\"false\">\n    {{ cancelButton }}\n  </button>\n</mat-dialog-actions>\n", styles: [".confirm-dialog__title{white-space:pre-wrap}.confirm-dialog__body__content{color:#606274;white-space:pre-wrap}.confirm-dialog__body__validate-message{margin-bottom:8px;white-space:pre-wrap}.confirm-dialog__body__validate-input{overflow:hidden;width:100%;height:62px;padding-top:4px}.confirm-dialog__actions{display:flex;flex-direction:row-reverse;justify-content:flex-start}\n"], components: [{ type: GioBannerWarningComponent, selector: "gio-banner-warning" }, { type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.MatLabel, selector: "mat-label" }, { type: i6$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i7.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1$2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
+GioConfirmAndValidateDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioConfirmAndValidateDialogComponent, selector: "gio-confirm-and-validate-dialog", ngImport: i0, template: "<!--\n\n    Copyright (C) 2015 The Gravitee team (http://gravitee.io)\n\n    Licensed under the Apache License, Version 2.0 (the \"License\");\n    you may not use this file except in compliance with the License.\n    You may obtain a copy of the License at\n\n            http://www.apache.org/licenses/LICENSE-2.0\n\n    Unless required by applicable law or agreed to in writing, software\n    distributed under the License is distributed on an \"AS IS\" BASIS,\n    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n    See the License for the specific language governing permissions and\n    limitations under the License.\n\n-->\n<h2 mat-dialog-title class=\"confirm-dialog__title\">{{ title }}</h2>\n\n<mat-dialog-content class=\"confirm-dialog__body\">\n  <gio-banner-warning *ngIf=\"warning\"><span [innerHTML]=\"warning\"></span></gio-banner-warning>\n  <p class=\"confirm-dialog__body__content\" *ngIf=\"content\" [innerHTML]=\"content\"></p>\n  <p class=\"confirm-dialog__body__validate-message\" [innerHTML]=\"validationMessage\"></p>\n  <mat-form-field class=\"confirm-dialog__body__validate-input\" appearance=\"outline\" floatLabel=\"always\">\n    <mat-label>Confirm</mat-label>\n    <input\n      matInput\n      cdkFocusInitial\n      type=\"text\"\n      [placeholder]=\"validationValue\"\n      [ngModel]=\"confirmValue\"\n      (ngModelChange)=\"onConfirmChange($event)\"\n      required\n      data-testid=\"confirm-input-dialog\"\n    />\n  </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\" class=\"confirm-dialog__actions\">\n  <button\n    class=\"confirm-dialog__confirm-button\"\n    [disabled]=\"!isValid\"\n    color=\"warn\"\n    mat-raised-button\n    [mat-dialog-close]=\"true\"\n    data-testid=\"confirm-dialog\"\n  >\n    {{ confirmButton }}\n  </button>\n  <button class=\"confirm-dialog__cancel-button\" mat-flat-button [mat-dialog-close]=\"false\">\n    {{ cancelButton }}\n  </button>\n</mat-dialog-actions>\n", styles: [".confirm-dialog__title{white-space:pre-wrap}.confirm-dialog__body__content{color:#606274;white-space:pre-wrap}.confirm-dialog__body__validate-message{margin-bottom:8px;white-space:pre-wrap}.confirm-dialog__body__validate-input{overflow:hidden;width:100%;height:62px;padding-top:4px}.confirm-dialog__actions{display:flex;flex-direction:row-reverse;justify-content:flex-start}\n"], components: [{ type: GioBannerWarningComponent, selector: "gio-banner-warning" }, { type: i3$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.MatLabel, selector: "mat-label" }, { type: i6$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i7.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1$2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioConfirmAndValidateDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'gio-confirm-and-validate-dialog', template: "<!--\n\n    Copyright (C) 2015 The Gravitee team (http://gravitee.io)\n\n    Licensed under the Apache License, Version 2.0 (the \"License\");\n    you may not use this file except in compliance with the License.\n    You may obtain a copy of the License at\n\n            http://www.apache.org/licenses/LICENSE-2.0\n\n    Unless required by applicable law or agreed to in writing, software\n    distributed under the License is distributed on an \"AS IS\" BASIS,\n    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n    See the License for the specific language governing permissions and\n    limitations under the License.\n\n-->\n<h2 mat-dialog-title class=\"confirm-dialog__title\">{{ title }}</h2>\n\n<mat-dialog-content class=\"confirm-dialog__body\">\n  <gio-banner-warning *ngIf=\"warning\"><span [innerHTML]=\"warning\"></span></gio-banner-warning>\n  <p class=\"confirm-dialog__body__content\" *ngIf=\"content\" [innerHTML]=\"content\"></p>\n  <p class=\"confirm-dialog__body__validate-message\" [innerHTML]=\"validationMessage\"></p>\n  <mat-form-field class=\"confirm-dialog__body__validate-input\" appearance=\"outline\" floatLabel=\"always\">\n    <mat-label>Confirm</mat-label>\n    <input\n      matInput\n      cdkFocusInitial\n      type=\"text\"\n      [placeholder]=\"validationValue\"\n      [ngModel]=\"confirmValue\"\n      (ngModelChange)=\"onConfirmChange($event)\"\n      required\n      data-testid=\"confirm-input-dialog\"\n    />\n  </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\" class=\"confirm-dialog__actions\">\n  <button\n    class=\"confirm-dialog__confirm-button\"\n    [disabled]=\"!isValid\"\n    color=\"warn\"\n    mat-raised-button\n    [mat-dialog-close]=\"true\"\n    data-testid=\"confirm-dialog\"\n  >\n    {{ confirmButton }}\n  </button>\n  <button class=\"confirm-dialog__cancel-button\" mat-flat-button [mat-dialog-close]=\"false\">\n    {{ cancelButton }}\n  </button>\n</mat-dialog-actions>\n", styles: [".confirm-dialog__title{white-space:pre-wrap}.confirm-dialog__body__content{color:#606274;white-space:pre-wrap}.confirm-dialog__body__validate-message{margin-bottom:8px;white-space:pre-wrap}.confirm-dialog__body__validate-input{overflow:hidden;width:100%;height:62px;padding-top:4px}.confirm-dialog__actions{display:flex;flex-direction:row-reverse;justify-content:flex-start}\n"] }]
@@ -1174,7 +1423,7 @@ GioFormHeadersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
             useExisting: forwardRef(() => GioFormHeadersComponent),
             multi: true,
         },
-    ], ngImport: i0, template: "<!--\n\n    Copyright (C) 2015 The Gravitee team (http://gravitee.io)\n\n    Licensed under the Apache License, Version 2.0 (the \"License\");\n    you may not use this file except in compliance with the License.\n    You may obtain a copy of the License at\n\n            http://www.apache.org/licenses/LICENSE-2.0\n\n    Unless required by applicable law or agreed to in writing, software\n    distributed under the License is distributed on an \"AS IS\" BASIS,\n    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n    See the License for the specific language governing permissions and\n    limitations under the License.\n\n-->\n<table class=\"gio-form-headers__table gio-table-light\" [formGroup]=\"mainForm\">\n  <thead>\n    <tr>\n      <th>KEY</th>\n      <th>VALUE</th>\n    </tr>\n  </thead>\n  <tbody formArrayName=\"headers\">\n    <tr\n      *ngFor=\"let control of headersFormArray.controls; index as headerIndex\"\n      class=\"gio-form-headers__table__header-row\"\n      [formGroupName]=\"headerIndex\"\n    >\n      <td class=\"gio-form-headers__table__header-row__td-key\">\n        <mat-form-field class=\"gio-form-headers__table__header-row__td-key__field\" [floatLabel]=\"'never'\" appearance=\"standard\">\n          <textarea\n            formControlName=\"key\"\n            matInput\n            placeholder=\"Name...\"\n            cdkTextareaAutosize\n            cdkAutosizeMinRows=\"1\"\n            [matAutocomplete]=\"headerNamesAutocomplete\"\n          ></textarea>\n        </mat-form-field>\n        <mat-autocomplete #headerNamesAutocomplete=\"matAutocomplete\">\n          <mat-option *ngFor=\"let headerName of getFilteredHeaderNames(headerIndex, control.value) | async\" [value]=\"headerName\">{{\n            headerName\n          }}</mat-option>\n        </mat-autocomplete>\n      </td>\n      <td class=\"gio-form-headers__table__header-row__td-value\">\n        <mat-form-field class=\"gio-form-headers__table__header-row__td-value__field\" [floatLabel]=\"'never'\" appearance=\"standard\">\n          <textarea formControlName=\"value\" matInput placeholder=\"Value...\" cdkTextareaAutosize cdkAutosizeMinRows=\"1\"></textarea>\n        </mat-form-field>\n        <button\n          class=\"gio-form-headers__table__header-row__td-value__button\"\n          *ngIf=\"headersFormArray.controls.length - 1 !== headerIndex\"\n          mat-icon-button\n          aria-label=\"Delete\"\n          (click)=\"onDeleteHeader(headerIndex)\"\n        >\n          <mat-icon svgIcon=\"gio:cancel\"></mat-icon>\n        </button>\n      </td>\n    </tr>\n  </tbody>\n</table>\n", styles: [":host{display:block;overflow:hidden}.gio-form-headers__table{width:100%}.gio-form-headers__table__header-row__td-key,.gio-form-headers__table__header-row__td-value{position:relative;width:50%}.gio-form-headers__table__header-row__td-key__field,.gio-form-headers__table__header-row__td-value__field{display:flex;overflow:hidden;width:100%;max-height:32px;flex-direction:column;justify-content:center;padding-bottom:0}.gio-form-headers__table__header-row__td-key__field *,.gio-form-headers__table__header-row__td-value__field *{top:0;overflow:hidden;max-height:32px}.gio-form-headers__table__header-row__td-key__field:focus-within,.gio-form-headers__table__header-row__td-value__field:focus-within{z-index:100;height:auto;background-color:#fff}.gio-form-headers__table__header-row__td-key__field:focus-within *,.gio-form-headers__table__header-row__td-value__field:focus-within *{max-height:none}.gio-form-headers__table__header-row__td-key__button,.gio-form-headers__table__header-row__td-value__button{position:absolute;top:3px;right:3px;display:none}.gio-form-headers__table__header-row__td-remove{width:32px;height:32px;padding:0}.gio-form-headers__table__header-row:hover .gio-form-headers__table__header-row__td-value__button{z-index:110;display:block;background-color:#fff;opacity:.9}::ng-deep gio-form-headers .gio-form-headers__table__header-row .mat-form-field-infix{width:inherit}\n"], components: [{ type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i5.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i6.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i7.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i7.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i7.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i10.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i5.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i2$1.AsyncPipe } });
+    ], ngImport: i0, template: "<!--\n\n    Copyright (C) 2015 The Gravitee team (http://gravitee.io)\n\n    Licensed under the Apache License, Version 2.0 (the \"License\");\n    you may not use this file except in compliance with the License.\n    You may obtain a copy of the License at\n\n            http://www.apache.org/licenses/LICENSE-2.0\n\n    Unless required by applicable law or agreed to in writing, software\n    distributed under the License is distributed on an \"AS IS\" BASIS,\n    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n    See the License for the specific language governing permissions and\n    limitations under the License.\n\n-->\n<table class=\"gio-form-headers__table gio-table-light\" [formGroup]=\"mainForm\">\n  <thead>\n    <tr>\n      <th>KEY</th>\n      <th>VALUE</th>\n    </tr>\n  </thead>\n  <tbody formArrayName=\"headers\">\n    <tr\n      *ngFor=\"let control of headersFormArray.controls; index as headerIndex\"\n      class=\"gio-form-headers__table__header-row\"\n      [formGroupName]=\"headerIndex\"\n    >\n      <td class=\"gio-form-headers__table__header-row__td-key\">\n        <mat-form-field class=\"gio-form-headers__table__header-row__td-key__field\" [floatLabel]=\"'never'\" appearance=\"standard\">\n          <textarea\n            formControlName=\"key\"\n            matInput\n            placeholder=\"Name...\"\n            cdkTextareaAutosize\n            cdkAutosizeMinRows=\"1\"\n            [matAutocomplete]=\"headerNamesAutocomplete\"\n          ></textarea>\n        </mat-form-field>\n        <mat-autocomplete #headerNamesAutocomplete=\"matAutocomplete\">\n          <mat-option *ngFor=\"let headerName of getFilteredHeaderNames(headerIndex, control.value) | async\" [value]=\"headerName\">{{\n            headerName\n          }}</mat-option>\n        </mat-autocomplete>\n      </td>\n      <td class=\"gio-form-headers__table__header-row__td-value\">\n        <mat-form-field class=\"gio-form-headers__table__header-row__td-value__field\" [floatLabel]=\"'never'\" appearance=\"standard\">\n          <textarea formControlName=\"value\" matInput placeholder=\"Value...\" cdkTextareaAutosize cdkAutosizeMinRows=\"1\"></textarea>\n        </mat-form-field>\n        <button\n          class=\"gio-form-headers__table__header-row__td-value__button\"\n          *ngIf=\"headersFormArray.controls.length - 1 !== headerIndex\"\n          mat-icon-button\n          aria-label=\"Delete\"\n          (click)=\"onDeleteHeader(headerIndex)\"\n        >\n          <mat-icon svgIcon=\"gio:cancel\"></mat-icon>\n        </button>\n      </td>\n    </tr>\n  </tbody>\n</table>\n", styles: [":host{display:block;overflow:hidden}.gio-form-headers__table{width:100%}.gio-form-headers__table__header-row__td-key,.gio-form-headers__table__header-row__td-value{position:relative;width:50%}.gio-form-headers__table__header-row__td-key__field,.gio-form-headers__table__header-row__td-value__field{display:flex;overflow:hidden;width:100%;max-height:32px;flex-direction:column;justify-content:center;padding-bottom:0}.gio-form-headers__table__header-row__td-key__field *,.gio-form-headers__table__header-row__td-value__field *{top:0;overflow:hidden;max-height:32px}.gio-form-headers__table__header-row__td-key__field:focus-within,.gio-form-headers__table__header-row__td-value__field:focus-within{z-index:100;height:auto;background-color:#fff}.gio-form-headers__table__header-row__td-key__field:focus-within *,.gio-form-headers__table__header-row__td-value__field:focus-within *{max-height:none}.gio-form-headers__table__header-row__td-key__button,.gio-form-headers__table__header-row__td-value__button{position:absolute;top:3px;right:3px;display:none}.gio-form-headers__table__header-row__td-remove{width:32px;height:32px;padding:0}.gio-form-headers__table__header-row:hover .gio-form-headers__table__header-row__td-value__button{z-index:110;display:block;background-color:#fff;opacity:.9}::ng-deep gio-form-headers .gio-form-headers__table__header-row .mat-form-field-infix{width:inherit}\n"], components: [{ type: i3$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i5.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i6.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i7.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i7.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i7.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i10.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i5.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i2$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormHeadersComponent, decorators: [{
             type: Component,
             args: [{ selector: 'gio-form-headers', providers: [
@@ -1956,7 +2205,7 @@ class GioMenuSelectorComponent {
     }
 }
 GioMenuSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioMenuSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-GioMenuSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioMenuSelectorComponent, selector: "gio-menu-selector", inputs: { selectorTitle: "selectorTitle", selectorItems: "selectorItems", selectedItemValue: "selectedItemValue", tabIndex: "tabIndex" }, outputs: { selectChange: "selectChange" }, ngImport: i0, template: "<!--\n\n    Copyright (C) 2022 The Gravitee team (http://gravitee.io)\n\n    Licensed under the Apache License, Version 2.0 (the \"License\");\n    you may not use this file except in compliance with the License.\n    You may obtain a copy of the License at\n\n            http://www.apache.org/licenses/LICENSE-2.0\n\n    Unless required by applicable law or agreed to in writing, software\n    distributed under the License is distributed on an \"AS IS\" BASIS,\n    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n    See the License for the specific language governing permissions and\n    limitations under the License.\n\n-->\n<div class=\"gio-menu-selector\">\n  <mat-form-field class=\"gio-menu-selector__mat-form-field\" appearance=\"legacy\">\n    <mat-label>{{ selectorTitle }}</mat-label>\n    <mat-select [tabIndex]=\"tabIndex\" [value]=\"selectedItemValue\" (selectionChange)=\"onSelectionChange($event)\" [disabled]=\"isDisabled()\">\n      <mat-option *ngFor=\"let item of selectorItems\" [value]=\"item.value\">\n        {{ item.displayValue }}\n      </mat-option>\n    </mat-select>\n  </mat-form-field>\n</div>\n", styles: [".gio-menu-selector{width:192px;padding:10px 14px 0;border-style:solid;border-color:#606274;border-radius:4px;margin-bottom:8px;color:#f7f8fd}.gio-menu-selector__mat-form-field{padding-bottom:0}::ng-deep gio-menu-selector .gio-menu-selector>*{display:block}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-value{color:#fff}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-placeholder{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-disabled .mat-select-value{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-arrow{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-panel{background:#424242}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-panel:not([class*=mat-elevation-z]){box-shadow:0 2px 4px -1px #0003,0 4px 5px #00000024,0 1px 10px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple){background:rgba(255,255,255,.12)}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused.mat-primary .mat-select-arrow{color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused.mat-accent .mat-select-arrow{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused.mat-warn .mat-select-arrow{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field .mat-select.mat-select-invalid .mat-select-arrow{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field .mat-select.mat-select-disabled .mat-select-arrow{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-label{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-hint{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-label{color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-label.mat-accent{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-label.mat-warn{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-focused .mat-form-field-required-marker{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-ripple{background-color:#fff}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-ripple{background-color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-ripple.mat-accent{background-color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-ripple.mat-warn{background-color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid) .mat-form-field-infix:after{color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid).mat-accent .mat-form-field-infix:after{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid).mat-warn .mat-form-field-infix:after{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-label{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-label.mat-accent,::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-label .mat-form-field-required-marker{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-ripple,::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-ripple.mat-accent{background-color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-error{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-legacy .mat-form-field-label{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-legacy .mat-hint{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-legacy .mat-form-field-underline{background-color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-legacy.mat-form-field-disabled .mat-form-field-underline{background-image:linear-gradient(to right,rgba(255,255,255,.7) 0%,rgba(255,255,255,.7) 33%,transparent 0%);background-size:4px 100%;background-repeat:repeat-x}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-standard .mat-form-field-underline{background-color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-standard.mat-form-field-disabled .mat-form-field-underline{background-image:linear-gradient(to right,rgba(255,255,255,.7) 0%,rgba(255,255,255,.7) 33%,transparent 0%);background-size:4px 100%;background-repeat:repeat-x}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill .mat-form-field-flex{background-color:#ffffff1a}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-flex{background-color:#ffffff0d}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill .mat-form-field-underline:before{background-color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-label{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-underline:before{background-color:transparent}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline .mat-form-field-outline{color:#ffffff4d}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline .mat-form-field-outline-thick{color:#fff}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-focused .mat-form-field-outline-thick{color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-focused.mat-accent .mat-form-field-outline-thick{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-focused.mat-warn .mat-form-field-outline-thick{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-form-field-invalid.mat-form-field-invalid .mat-form-field-outline-thick{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-label{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-outline{color:#ffffff26}::ng-deep gio-menu-selector .gio-menu-selector .mat-app-background,::ng-deep gio-menu-selector .gio-menu-selector.mat-app-background{background-color:#303030;color:#fff}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z0{box-shadow:0 0 #0003,0 0 #00000024,0 0 #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z1{box-shadow:0 2px 1px -1px #0003,0 1px 1px #00000024,0 1px 3px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z2{box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z3{box-shadow:0 3px 3px -2px #0003,0 3px 4px #00000024,0 1px 8px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z4{box-shadow:0 2px 4px -1px #0003,0 4px 5px #00000024,0 1px 10px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z5{box-shadow:0 3px 5px -1px #0003,0 5px 8px #00000024,0 1px 14px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z6{box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z7{box-shadow:0 4px 5px -2px #0003,0 7px 10px 1px #00000024,0 2px 16px 1px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z8{box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z9{box-shadow:0 5px 6px -3px #0003,0 9px 12px 1px #00000024,0 3px 16px 2px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z10{box-shadow:0 6px 6px -3px #0003,0 10px 14px 1px #00000024,0 4px 18px 3px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z11{box-shadow:0 6px 7px -4px #0003,0 11px 15px 1px #00000024,0 4px 20px 3px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z12{box-shadow:0 7px 8px -4px #0003,0 12px 17px 2px #00000024,0 5px 22px 4px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z13{box-shadow:0 7px 8px -4px #0003,0 13px 19px 2px #00000024,0 5px 24px 4px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z14{box-shadow:0 7px 9px -4px #0003,0 14px 21px 2px #00000024,0 5px 26px 4px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z15{box-shadow:0 8px 9px -5px #0003,0 15px 22px 2px #00000024,0 6px 28px 5px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z16{box-shadow:0 8px 10px -5px #0003,0 16px 24px 2px #00000024,0 6px 30px 5px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z17{box-shadow:0 8px 11px -5px #0003,0 17px 26px 2px #00000024,0 6px 32px 5px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z18{box-shadow:0 9px 11px -5px #0003,0 18px 28px 2px #00000024,0 7px 34px 6px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z19{box-shadow:0 9px 12px -6px #0003,0 19px 29px 2px #00000024,0 7px 36px 6px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z20{box-shadow:0 10px 13px -6px #0003,0 20px 31px 3px #00000024,0 8px 38px 7px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z21{box-shadow:0 10px 13px -6px #0003,0 21px 33px 3px #00000024,0 8px 40px 7px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z22{box-shadow:0 10px 14px -6px #0003,0 22px 35px 3px #00000024,0 8px 42px 7px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z23{box-shadow:0 11px 14px -7px #0003,0 23px 36px 3px #00000024,0 9px 44px 8px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z24{box-shadow:0 11px 15px -7px #0003,0 24px 38px 3px #00000024,0 9px 46px 8px #0000001f}.mat-theme-loaded-marker{display:none}::ng-deep .mat-form-field-appearance-legacy .mat-form-field-wrapper{padding-bottom:6px}::ng-deep .mat-form-field-underline{display:none}\n"], components: [{ type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2$4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i6.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i3$1.MatLabel, selector: "mat-label" }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+GioMenuSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioMenuSelectorComponent, selector: "gio-menu-selector", inputs: { selectorTitle: "selectorTitle", selectorItems: "selectorItems", selectedItemValue: "selectedItemValue", tabIndex: "tabIndex" }, outputs: { selectChange: "selectChange" }, ngImport: i0, template: "<!--\n\n    Copyright (C) 2022 The Gravitee team (http://gravitee.io)\n\n    Licensed under the Apache License, Version 2.0 (the \"License\");\n    you may not use this file except in compliance with the License.\n    You may obtain a copy of the License at\n\n            http://www.apache.org/licenses/LICENSE-2.0\n\n    Unless required by applicable law or agreed to in writing, software\n    distributed under the License is distributed on an \"AS IS\" BASIS,\n    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n    See the License for the specific language governing permissions and\n    limitations under the License.\n\n-->\n<div class=\"gio-menu-selector\">\n  <mat-form-field class=\"gio-menu-selector__mat-form-field\" appearance=\"legacy\">\n    <mat-label>{{ selectorTitle }}</mat-label>\n    <mat-select [tabIndex]=\"tabIndex\" [value]=\"selectedItemValue\" (selectionChange)=\"onSelectionChange($event)\" [disabled]=\"isDisabled()\">\n      <mat-option *ngFor=\"let item of selectorItems\" [value]=\"item.value\">\n        {{ item.displayValue }}\n      </mat-option>\n    </mat-select>\n  </mat-form-field>\n</div>\n", styles: [".gio-menu-selector{width:192px;padding:10px 14px 0;border-style:solid;border-color:#606274;border-radius:4px;margin-bottom:8px;color:#f7f8fd}.gio-menu-selector__mat-form-field{padding-bottom:0}::ng-deep gio-menu-selector .gio-menu-selector>*{display:block}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-value{color:#fff}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-placeholder{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-disabled .mat-select-value{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-arrow{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-panel{background:#424242}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-panel:not([class*=mat-elevation-z]){box-shadow:0 2px 4px -1px #0003,0 4px 5px #00000024,0 1px 10px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple){background:rgba(255,255,255,.12)}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused.mat-primary .mat-select-arrow{color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused.mat-accent .mat-select-arrow{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused.mat-warn .mat-select-arrow{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field .mat-select.mat-select-invalid .mat-select-arrow{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field .mat-select.mat-select-disabled .mat-select-arrow{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-label{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-hint{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-label{color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-label.mat-accent{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-label.mat-warn{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-focused .mat-form-field-required-marker{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-ripple{background-color:#fff}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-ripple{background-color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-ripple.mat-accent{background-color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-ripple.mat-warn{background-color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid) .mat-form-field-infix:after{color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid).mat-accent .mat-form-field-infix:after{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid).mat-warn .mat-form-field-infix:after{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-label{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-label.mat-accent,::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-label .mat-form-field-required-marker{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-ripple,::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-ripple.mat-accent{background-color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-error{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-legacy .mat-form-field-label{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-legacy .mat-hint{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-legacy .mat-form-field-underline{background-color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-legacy.mat-form-field-disabled .mat-form-field-underline{background-image:linear-gradient(to right,rgba(255,255,255,.7) 0%,rgba(255,255,255,.7) 33%,transparent 0%);background-size:4px 100%;background-repeat:repeat-x}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-standard .mat-form-field-underline{background-color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-standard.mat-form-field-disabled .mat-form-field-underline{background-image:linear-gradient(to right,rgba(255,255,255,.7) 0%,rgba(255,255,255,.7) 33%,transparent 0%);background-size:4px 100%;background-repeat:repeat-x}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill .mat-form-field-flex{background-color:#ffffff1a}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-flex{background-color:#ffffff0d}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill .mat-form-field-underline:before{background-color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-label{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-underline:before{background-color:transparent}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline .mat-form-field-outline{color:#ffffff4d}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline .mat-form-field-outline-thick{color:#fff}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-focused .mat-form-field-outline-thick{color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-focused.mat-accent .mat-form-field-outline-thick{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-focused.mat-warn .mat-form-field-outline-thick{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-form-field-invalid.mat-form-field-invalid .mat-form-field-outline-thick{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-label{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-outline{color:#ffffff26}::ng-deep gio-menu-selector .gio-menu-selector .mat-app-background,::ng-deep gio-menu-selector .gio-menu-selector.mat-app-background{background-color:#303030;color:#fff}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z0{box-shadow:0 0 #0003,0 0 #00000024,0 0 #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z1{box-shadow:0 2px 1px -1px #0003,0 1px 1px #00000024,0 1px 3px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z2{box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z3{box-shadow:0 3px 3px -2px #0003,0 3px 4px #00000024,0 1px 8px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z4{box-shadow:0 2px 4px -1px #0003,0 4px 5px #00000024,0 1px 10px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z5{box-shadow:0 3px 5px -1px #0003,0 5px 8px #00000024,0 1px 14px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z6{box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z7{box-shadow:0 4px 5px -2px #0003,0 7px 10px 1px #00000024,0 2px 16px 1px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z8{box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z9{box-shadow:0 5px 6px -3px #0003,0 9px 12px 1px #00000024,0 3px 16px 2px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z10{box-shadow:0 6px 6px -3px #0003,0 10px 14px 1px #00000024,0 4px 18px 3px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z11{box-shadow:0 6px 7px -4px #0003,0 11px 15px 1px #00000024,0 4px 20px 3px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z12{box-shadow:0 7px 8px -4px #0003,0 12px 17px 2px #00000024,0 5px 22px 4px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z13{box-shadow:0 7px 8px -4px #0003,0 13px 19px 2px #00000024,0 5px 24px 4px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z14{box-shadow:0 7px 9px -4px #0003,0 14px 21px 2px #00000024,0 5px 26px 4px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z15{box-shadow:0 8px 9px -5px #0003,0 15px 22px 2px #00000024,0 6px 28px 5px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z16{box-shadow:0 8px 10px -5px #0003,0 16px 24px 2px #00000024,0 6px 30px 5px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z17{box-shadow:0 8px 11px -5px #0003,0 17px 26px 2px #00000024,0 6px 32px 5px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z18{box-shadow:0 9px 11px -5px #0003,0 18px 28px 2px #00000024,0 7px 34px 6px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z19{box-shadow:0 9px 12px -6px #0003,0 19px 29px 2px #00000024,0 7px 36px 6px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z20{box-shadow:0 10px 13px -6px #0003,0 20px 31px 3px #00000024,0 8px 38px 7px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z21{box-shadow:0 10px 13px -6px #0003,0 21px 33px 3px #00000024,0 8px 40px 7px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z22{box-shadow:0 10px 14px -6px #0003,0 22px 35px 3px #00000024,0 8px 42px 7px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z23{box-shadow:0 11px 14px -7px #0003,0 23px 36px 3px #00000024,0 9px 44px 8px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z24{box-shadow:0 11px 15px -7px #0003,0 24px 38px 3px #00000024,0 9px 46px 8px #0000001f}.mat-theme-loaded-marker{display:none}::ng-deep .mat-form-field-appearance-legacy .mat-form-field-wrapper{padding-bottom:6px}::ng-deep .mat-form-field-underline{display:none}\n"], components: [{ type: i3$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2$3.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i6.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i3$2.MatLabel, selector: "mat-label" }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioMenuSelectorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'gio-menu-selector', template: "<!--\n\n    Copyright (C) 2022 The Gravitee team (http://gravitee.io)\n\n    Licensed under the Apache License, Version 2.0 (the \"License\");\n    you may not use this file except in compliance with the License.\n    You may obtain a copy of the License at\n\n            http://www.apache.org/licenses/LICENSE-2.0\n\n    Unless required by applicable law or agreed to in writing, software\n    distributed under the License is distributed on an \"AS IS\" BASIS,\n    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n    See the License for the specific language governing permissions and\n    limitations under the License.\n\n-->\n<div class=\"gio-menu-selector\">\n  <mat-form-field class=\"gio-menu-selector__mat-form-field\" appearance=\"legacy\">\n    <mat-label>{{ selectorTitle }}</mat-label>\n    <mat-select [tabIndex]=\"tabIndex\" [value]=\"selectedItemValue\" (selectionChange)=\"onSelectionChange($event)\" [disabled]=\"isDisabled()\">\n      <mat-option *ngFor=\"let item of selectorItems\" [value]=\"item.value\">\n        {{ item.displayValue }}\n      </mat-option>\n    </mat-select>\n  </mat-form-field>\n</div>\n", styles: [".gio-menu-selector{width:192px;padding:10px 14px 0;border-style:solid;border-color:#606274;border-radius:4px;margin-bottom:8px;color:#f7f8fd}.gio-menu-selector__mat-form-field{padding-bottom:0}::ng-deep gio-menu-selector .gio-menu-selector>*{display:block}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-value{color:#fff}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-placeholder{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-disabled .mat-select-value{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-arrow{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-panel{background:#424242}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-panel:not([class*=mat-elevation-z]){box-shadow:0 2px 4px -1px #0003,0 4px 5px #00000024,0 1px 10px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple){background:rgba(255,255,255,.12)}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused.mat-primary .mat-select-arrow{color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused.mat-accent .mat-select-arrow{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused.mat-warn .mat-select-arrow{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field .mat-select.mat-select-invalid .mat-select-arrow{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field .mat-select.mat-select-disabled .mat-select-arrow{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-label{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-hint{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-label{color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-label.mat-accent{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-label.mat-warn{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-focused .mat-form-field-required-marker{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-ripple{background-color:#fff}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-ripple{background-color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-ripple.mat-accent{background-color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-focused .mat-form-field-ripple.mat-warn{background-color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid) .mat-form-field-infix:after{color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid).mat-accent .mat-form-field-infix:after{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid).mat-warn .mat-form-field-infix:after{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-label{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-label.mat-accent,::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-label .mat-form-field-required-marker{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-ripple,::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field.mat-form-field-invalid .mat-form-field-ripple.mat-accent{background-color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-error{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-legacy .mat-form-field-label{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-legacy .mat-hint{color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-legacy .mat-form-field-underline{background-color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-legacy.mat-form-field-disabled .mat-form-field-underline{background-image:linear-gradient(to right,rgba(255,255,255,.7) 0%,rgba(255,255,255,.7) 33%,transparent 0%);background-size:4px 100%;background-repeat:repeat-x}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-standard .mat-form-field-underline{background-color:#ffffffb3}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-standard.mat-form-field-disabled .mat-form-field-underline{background-image:linear-gradient(to right,rgba(255,255,255,.7) 0%,rgba(255,255,255,.7) 33%,transparent 0%);background-size:4px 100%;background-repeat:repeat-x}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill .mat-form-field-flex{background-color:#ffffff1a}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-flex{background-color:#ffffff0d}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill .mat-form-field-underline:before{background-color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-label{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-underline:before{background-color:transparent}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline .mat-form-field-outline{color:#ffffff4d}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline .mat-form-field-outline-thick{color:#fff}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-focused .mat-form-field-outline-thick{color:#099}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-focused.mat-accent .mat-form-field-outline-thick{color:#876fec}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-focused.mat-warn .mat-form-field-outline-thick{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-form-field-invalid.mat-form-field-invalid .mat-form-field-outline-thick{color:#ec4899}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-label{color:#ffffff80}::ng-deep gio-menu-selector .gio-menu-selector .mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-outline{color:#ffffff26}::ng-deep gio-menu-selector .gio-menu-selector .mat-app-background,::ng-deep gio-menu-selector .gio-menu-selector.mat-app-background{background-color:#303030;color:#fff}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z0{box-shadow:0 0 #0003,0 0 #00000024,0 0 #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z1{box-shadow:0 2px 1px -1px #0003,0 1px 1px #00000024,0 1px 3px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z2{box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z3{box-shadow:0 3px 3px -2px #0003,0 3px 4px #00000024,0 1px 8px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z4{box-shadow:0 2px 4px -1px #0003,0 4px 5px #00000024,0 1px 10px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z5{box-shadow:0 3px 5px -1px #0003,0 5px 8px #00000024,0 1px 14px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z6{box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z7{box-shadow:0 4px 5px -2px #0003,0 7px 10px 1px #00000024,0 2px 16px 1px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z8{box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z9{box-shadow:0 5px 6px -3px #0003,0 9px 12px 1px #00000024,0 3px 16px 2px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z10{box-shadow:0 6px 6px -3px #0003,0 10px 14px 1px #00000024,0 4px 18px 3px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z11{box-shadow:0 6px 7px -4px #0003,0 11px 15px 1px #00000024,0 4px 20px 3px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z12{box-shadow:0 7px 8px -4px #0003,0 12px 17px 2px #00000024,0 5px 22px 4px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z13{box-shadow:0 7px 8px -4px #0003,0 13px 19px 2px #00000024,0 5px 24px 4px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z14{box-shadow:0 7px 9px -4px #0003,0 14px 21px 2px #00000024,0 5px 26px 4px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z15{box-shadow:0 8px 9px -5px #0003,0 15px 22px 2px #00000024,0 6px 28px 5px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z16{box-shadow:0 8px 10px -5px #0003,0 16px 24px 2px #00000024,0 6px 30px 5px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z17{box-shadow:0 8px 11px -5px #0003,0 17px 26px 2px #00000024,0 6px 32px 5px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z18{box-shadow:0 9px 11px -5px #0003,0 18px 28px 2px #00000024,0 7px 34px 6px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z19{box-shadow:0 9px 12px -6px #0003,0 19px 29px 2px #00000024,0 7px 36px 6px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z20{box-shadow:0 10px 13px -6px #0003,0 20px 31px 3px #00000024,0 8px 38px 7px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z21{box-shadow:0 10px 13px -6px #0003,0 21px 33px 3px #00000024,0 8px 40px 7px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z22{box-shadow:0 10px 14px -6px #0003,0 22px 35px 3px #00000024,0 8px 42px 7px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z23{box-shadow:0 11px 14px -7px #0003,0 23px 36px 3px #00000024,0 9px 44px 8px #0000001f}::ng-deep gio-menu-selector .gio-menu-selector .mat-elevation-z24{box-shadow:0 11px 15px -7px #0003,0 24px 38px 3px #00000024,0 9px 46px 8px #0000001f}.mat-theme-loaded-marker{display:none}::ng-deep .mat-form-field-appearance-legacy .mat-form-field-wrapper{padding-bottom:6px}::ng-deep .mat-form-field-underline{display:none}\n"] }]
@@ -2979,8 +3228,27 @@ class GioFormJsonSchemaComponent {
             return this.isValid$.pipe(takeUntil(this.unsubscribe$), take(1), map(isValid => (isValid ? null : { invalid: true })));
         });
         this.ngControl?.control?.updateValueAndValidity({ emitEvent: false });
+        // When the parent form is touched, mark all the sub formGroup as touched if not already touched
+        const parentControl = this.ngControl?.control?.parent;
+        parentControl?.statusChanges
+            ?.pipe(takeUntil(this.unsubscribe$), map(() => parentControl?.touched), filter(touched => touched === true), distinctUntilChanged())
+            .subscribe(() => {
+            if (this.isDisabled) {
+                return;
+            }
+            this.formGroup.markAllAsTouched();
+            this.stateChanges$.next();
+        });
+        // Group all valueChanges events emit by formly in a single one
+        merge(this.formGroup.statusChanges, this.formGroup.valueChanges)
+            .pipe(takeUntil(this.unsubscribe$), debounceTime(100))
+            .subscribe(() => {
+            this.stateChanges$.next();
+        });
+    }
+    ngAfterViewInit() {
         // Subscribe to state changes to manage touches, status and value
-        this.stateChanges$.pipe(takeUntil(this.unsubscribe$), debounceTime(100)).subscribe(() => {
+        this.stateChanges$.pipe(takeUntil(this.unsubscribe$)).subscribe(() => {
             const { status, value, touched } = this.formGroup;
             if (this.isDisabled) {
                 return;
@@ -3003,25 +3271,6 @@ class GioFormJsonSchemaComponent {
             this.ngControl?.control?.updateValueAndValidity({ emitEvent: false });
             this.changeDetectorRef.detectChanges();
         });
-        // When the parent form is touched, mark all the sub formGroup as touched if not already touched
-        const parentControl = this.ngControl?.control?.parent;
-        parentControl?.statusChanges
-            ?.pipe(takeUntil(this.unsubscribe$), map(() => parentControl?.touched), filter(touched => touched === true), distinctUntilChanged())
-            .subscribe(() => {
-            if (this.isDisabled) {
-                return;
-            }
-            this.formGroup.markAllAsTouched();
-            this.stateChanges$.next();
-        });
-        // Group all valueChanges events emit by formly in a single one
-        merge(this.formGroup.statusChanges, this.formGroup.valueChanges)
-            .pipe(takeUntil(this.unsubscribe$))
-            .subscribe(() => {
-            this.stateChanges$.next();
-        });
-    }
-    ngAfterViewInit() {
         this.stateChanges$.next();
     }
     ngOnDestroy() {
@@ -4031,7 +4280,7 @@ GioFjsToggleTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
         [tabIndex]="props.tabindex"
       ></mat-slide-toggle>
     </gio-form-slide-toggle>
-  `, isInline: true, components: [{ type: GioFormSlideToggleComponent, selector: "gio-form-slide-toggle", inputs: ["appearance"] }, { type: GioFormLabelComponent, selector: "gio-form-label" }, { type: i3$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }], directives: [{ type: GioFormSlideToggleDirective, selector: "[gioFormSlideToggle]" }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i1$4.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }] });
+  `, isInline: true, components: [{ type: GioFormSlideToggleComponent, selector: "gio-form-slide-toggle", inputs: ["appearance"] }, { type: GioFormLabelComponent, selector: "gio-form-label" }, { type: i3$3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }], directives: [{ type: GioFormSlideToggleDirective, selector: "[gioFormSlideToggle]" }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i1$4.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFjsToggleTypeComponent, decorators: [{
             type: Component,
             args: [{
@@ -4752,5 +5001,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { GIO_FORM_FOCUS_INVALID_IGNORE_SELECTOR, GioAvatarComponent, GioAvatarModule, GioBannerActionDirective, GioBannerBodyDirective, GioBannerComponent, GioBannerErrorComponent, GioBannerInfoComponent, GioBannerModule, GioBannerSuccessComponent, GioBannerWarningComponent, GioBaseFormFocusInvalidDirective, GioBreadcrumbComponent, GioBreadcrumbItemDirective, GioBreadcrumbModule, GioButtonFocusInvalidButtonDirective, GioConfirmAndValidateDialogComponent, GioConfirmAndValidateDialogHarness, GioConfirmAndValidateDialogModule, GioConfirmDialogComponent, GioConfirmDialogHarness, GioConfirmDialogModule, GioFormFilePickerAddButtonComponent, GioFormFilePickerComponent, GioFormFilePickerEmptyComponent, GioFormFilePickerInputHarness, GioFormFilePickerLabelComponent, GioFormFilePickerModule, GioFormFocusInvalidFormDirective, GioFormFocusInvalidIgnoreDirective, GioFormFocusInvalidModule, GioFormHeadersComponent, GioFormHeadersHarness, GioFormHeadersModule, GioFormJsonSchemaComponent, GioFormJsonSchemaModule, GioFormLabelComponent, GioFormPrefixDirective, GioFormSlideToggleComponent, GioFormSlideToggleDirective, GioFormSlideToggleModule, GioFormTagsInputComponent, GioFormTagsInputHarness, GioFormTagsInputModule, GioIconsModule, GioLoaderComponent, GioLoaderModule, GioMatConfigModule, GioMenuComponent, GioMenuFooterComponent, GioMenuHeaderComponent, GioMenuItemComponent, GioMenuListComponent, GioMenuModule, GioMenuSelectorComponent, GioMenuSelectorHarness, GioMenuService, GioMonacoEditorComponent, GioMonacoEditorFormFieldDirective, GioMonacoEditorHarness, GioMonacoEditorModule, GioSaveBarComponent, GioSaveBarHarness, GioSaveBarModule, GioSubmenuComponent, GioSubmenuGroupComponent, GioSubmenuItemComponent, GioSubmenuModule, GioSubmenuTitleDirective, GioTopBarComponent, GioTopBarContentComponent, GioTopBarLinkComponent, GioTopBarLinkModule, GioTopBarMenuComponent, GioTopBarMenuModule, GioTopBarModule, NewFile };
+export { GIO_FORM_FOCUS_INVALID_IGNORE_SELECTOR, GioAsciidoctorComponent, GioAsciidoctorModule, GioAsciidoctorService, GioAvatarComponent, GioAvatarModule, GioBannerActionDirective, GioBannerBodyDirective, GioBannerComponent, GioBannerErrorComponent, GioBannerInfoComponent, GioBannerModule, GioBannerSuccessComponent, GioBannerWarningComponent, GioBaseFormFocusInvalidDirective, GioBreadcrumbComponent, GioBreadcrumbItemDirective, GioBreadcrumbModule, GioButtonFocusInvalidButtonDirective, GioConfirmAndValidateDialogComponent, GioConfirmAndValidateDialogHarness, GioConfirmAndValidateDialogModule, GioConfirmDialogComponent, GioConfirmDialogHarness, GioConfirmDialogModule, GioFormFilePickerAddButtonComponent, GioFormFilePickerComponent, GioFormFilePickerEmptyComponent, GioFormFilePickerInputHarness, GioFormFilePickerLabelComponent, GioFormFilePickerModule, GioFormFocusInvalidFormDirective, GioFormFocusInvalidIgnoreDirective, GioFormFocusInvalidModule, GioFormHeadersComponent, GioFormHeadersHarness, GioFormHeadersModule, GioFormJsonSchemaComponent, GioFormJsonSchemaModule, GioFormLabelComponent, GioFormPrefixDirective, GioFormSlideToggleComponent, GioFormSlideToggleDirective, GioFormSlideToggleModule, GioFormTagsInputComponent, GioFormTagsInputHarness, GioFormTagsInputModule, GioIconsModule, GioLoaderComponent, GioLoaderModule, GioMatConfigModule, GioMenuComponent, GioMenuFooterComponent, GioMenuHeaderComponent, GioMenuItemComponent, GioMenuListComponent, GioMenuModule, GioMenuSelectorComponent, GioMenuSelectorHarness, GioMenuService, GioMonacoEditorComponent, GioMonacoEditorFormFieldDirective, GioMonacoEditorHarness, GioMonacoEditorModule, GioPrismJsService, GioSaveBarComponent, GioSaveBarHarness, GioSaveBarModule, GioSubmenuComponent, GioSubmenuGroupComponent, GioSubmenuItemComponent, GioSubmenuModule, GioSubmenuTitleDirective, GioTopBarComponent, GioTopBarContentComponent, GioTopBarLinkComponent, GioTopBarLinkModule, GioTopBarMenuComponent, GioTopBarMenuModule, GioTopBarModule, NewFile };
 //# sourceMappingURL=gravitee-ui-particles-angular.mjs.map