@gravitee/ui-particles-angular 5.11.0 → 5.12.0-monaco-editor-762fa6b

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

@@ -1,7 +1,7 @@
 import { trigger, transition, style, animate } from '@angular/animations';
 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 } from '@angular/core';
-import { timer, Subject, fromEvent, of, BehaviorSubject } from 'rxjs';
+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 } from 'rxjs';
 import * as i1 from '@angular/material/card';
 import { MatCardModule } from '@angular/material/card';
 import * as i2 from '@angular/material/button';
@@ -12,7 +12,7 @@ import { ComponentHarness, HarnessPredicate, parallel, TestKey } from '@angular/
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import * as i3$1 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, set } from 'lodash';
+import { isEmpty, toLower, dropRight, isNil, isArray, remove, isObject, cloneDeep, set, uniqueId } from 'lodash';
 import { startWith, map, distinctUntilChanged, tap, debounce, takeUntil, delay, filter, switchMap } from 'rxjs/operators';
 import * as i7 from '@angular/forms';
 import { FormsModule, FormArray, FormGroup, FormControl, NG_VALUE_ACCESSOR, ReactiveFormsModule, NgControl } from '@angular/forms';
@@ -49,6 +49,7 @@ import { FieldType, FieldArrayType, FieldWrapper, FormlyModule } from '@ngx-form
 import { FormlyMaterialModule } from '@ngx-formly/material';
 import * as i3$2 from '@angular/material/slide-toggle';
 import { MatSlideToggle, MatSlideToggleModule } from '@angular/material/slide-toggle';
+import { TestBed } from '@angular/core/testing';
 
 /*
  * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
@@ -2880,6 +2881,11 @@ class GioFormJsonSchemaComponent {
         }
     }
     ngOnInit() {
+        // When the parent form is touched, mark all the sub formGroup as touched
+        const parentControl = this.ngControl?.control?.parent;
+        parentControl?.statusChanges
+            ?.pipe(takeUntil(this.unsubscribe$), map(() => parentControl?.touched), filter(touched => touched === true), tap(() => this.formGroup.markAllAsTouched()))
+            .subscribe();
         this.formGroup.statusChanges.pipe(takeUntil(this.unsubscribe$)).subscribe(status => {
             if (status === 'VALID') {
                 this.ngControl?.control?.setErrors(null);
@@ -3128,7 +3134,7 @@ GioFjsObjectTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
     <div class="wrapper">
       <div class="wrapper__title" *ngIf="to.label">{{ to.label }}</div>
       <p *ngIf="to.description">{{ to.description }}</p>
-      <div class="wrapper__error" *ngIf="showError && formControl.errors">
+      <div class="wrapper__error gio-ng-invalid" *ngIf="showError && formControl.errors">
         <formly-validation-message [field]="field"></formly-validation-message>
       </div>
       <div class="wrapper__fields">
@@ -3142,7 +3148,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
     <div class="wrapper">
       <div class="wrapper__title" *ngIf="to.label">{{ to.label }}</div>
       <p *ngIf="to.description">{{ to.description }}</p>
-      <div class="wrapper__error" *ngIf="showError && formControl.errors">
+      <div class="wrapper__error gio-ng-invalid" *ngIf="showError && formControl.errors">
         <formly-validation-message [field]="field"></formly-validation-message>
       </div>
       <div class="wrapper__fields">
@@ -3175,7 +3181,7 @@ class GioFjsArrayTypeComponent extends FieldArrayType {
 }
 GioFjsArrayTypeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFjsArrayTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
 GioFjsArrayTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioFjsArrayTypeComponent, selector: "gio-fjs-array-type", usesInheritance: true, ngImport: i0, template: `
-    <div class="wrapper">
+    <div class="wrapper" [class.error]="formControl.touched && formControl.invalid">
       <div class="wrapper__header">
         <div class="wrapper__header__text">
           <div class="wrapper__header__text__title" *ngIf="to.label">{{ to.label }}</div>
@@ -3188,11 +3194,11 @@ GioFjsArrayTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0
         </div>
       </div>
 
-      <div class="wrapper__error" *ngIf="showError && formControl.errors">
+      <div class="wrapper__error gio-ng-invalid" *ngIf="showError && formControl.errors">
         <formly-validation-message [field]="field"></formly-validation-message>
       </div>
 
-      <div *ngIf="!collapse" class="wrapper__rows" [class.collapse-open]="collapse" [class.collapse-close]="!collapse">
+      <div [hidden]="collapse" class="wrapper__rows" [class.collapse-open]="collapse" [class.collapse-close]="!collapse">
         <div *ngFor="let field of field.fieldGroup; let i = index" class="wrapper__rows__row">
           <formly-field class="wrapper__rows__row__field" [field]="field"></formly-field>
           <div class="wrapper__rows__row__remove">
@@ -3207,11 +3213,11 @@ GioFjsArrayTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0
         </div>
       </div>
     </div>
-  `, isInline: true, styles: [".wrapper{padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper:empty{display:none}.wrapper__header{display:flex}.wrapper__header__text{flex:1 1 auto}.wrapper__header__text__title{font:600 16px/24px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px;margin-bottom:8px}.wrapper__header__collapse{flex:0 0 auto}.wrapper__header__collapse .collapse-open{transform:rotate(180deg);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.wrapper__header__collapse .collapse-close{transform:rotate(0);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.wrapper__error{font:400 12px/16px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;color:#ec4899}.wrapper__rows__row{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.wrapper__rows__row+.wrapper__rows__row{padding-top:3px;border-top:1px solid #d3d5dc;margin-top:4px}.wrapper__rows__row__field{flex:1 1 auto}.wrapper__rows__row__remove{flex:0 0 auto}\n"], components: [{ 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"] }, { type: i1$4.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { type: i1$4.FormlyField, selector: "formly-field", inputs: ["field"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+  `, isInline: true, styles: [".wrapper{padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper.error{border-color:#ec4899}.wrapper:empty{display:none}.wrapper__header{display:flex}.wrapper__header__text{flex:1 1 auto}.wrapper__header__text__title{font:600 16px/24px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px;margin-bottom:8px}.wrapper__header__collapse{flex:0 0 auto}.wrapper__header__collapse .collapse-open{transform:rotate(180deg);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.wrapper__header__collapse .collapse-close{transform:rotate(0);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.wrapper__error{font:400 12px/16px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;color:#ec4899}.wrapper__rows__row{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.wrapper__rows__row+.wrapper__rows__row{padding-top:3px;border-top:1px solid #d3d5dc;margin-top:4px}.wrapper__rows__row__field{flex:1 1 auto}.wrapper__rows__row__remove{flex:0 0 auto}\n"], components: [{ 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"] }, { type: i1$4.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { type: i1$4.FormlyField, selector: "formly-field", inputs: ["field"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFjsArrayTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'gio-fjs-array-type', template: `
-    <div class="wrapper">
+    <div class="wrapper" [class.error]="formControl.touched && formControl.invalid">
       <div class="wrapper__header">
         <div class="wrapper__header__text">
           <div class="wrapper__header__text__title" *ngIf="to.label">{{ to.label }}</div>
@@ -3224,11 +3230,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         </div>
       </div>
 
-      <div class="wrapper__error" *ngIf="showError && formControl.errors">
+      <div class="wrapper__error gio-ng-invalid" *ngIf="showError && formControl.errors">
         <formly-validation-message [field]="field"></formly-validation-message>
       </div>
 
-      <div *ngIf="!collapse" class="wrapper__rows" [class.collapse-open]="collapse" [class.collapse-close]="!collapse">
+      <div [hidden]="collapse" class="wrapper__rows" [class.collapse-open]="collapse" [class.collapse-close]="!collapse">
         <div *ngFor="let field of field.fieldGroup; let i = index" class="wrapper__rows__row">
           <formly-field class="wrapper__rows__row__field" [field]="field"></formly-field>
           <div class="wrapper__rows__row__remove">
@@ -3243,7 +3249,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         </div>
       </div>
     </div>
-  `, styles: [".wrapper{padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper:empty{display:none}.wrapper__header{display:flex}.wrapper__header__text{flex:1 1 auto}.wrapper__header__text__title{font:600 16px/24px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px;margin-bottom:8px}.wrapper__header__collapse{flex:0 0 auto}.wrapper__header__collapse .collapse-open{transform:rotate(180deg);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.wrapper__header__collapse .collapse-close{transform:rotate(0);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.wrapper__error{font:400 12px/16px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;color:#ec4899}.wrapper__rows__row{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.wrapper__rows__row+.wrapper__rows__row{padding-top:3px;border-top:1px solid #d3d5dc;margin-top:4px}.wrapper__rows__row__field{flex:1 1 auto}.wrapper__rows__row__remove{flex:0 0 auto}\n"] }]
+  `, styles: [".wrapper{padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper.error{border-color:#ec4899}.wrapper:empty{display:none}.wrapper__header{display:flex}.wrapper__header__text{flex:1 1 auto}.wrapper__header__text__title{font:600 16px/24px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px;margin-bottom:8px}.wrapper__header__collapse{flex:0 0 auto}.wrapper__header__collapse .collapse-open{transform:rotate(180deg);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.wrapper__header__collapse .collapse-close{transform:rotate(0);transition:transform 225ms cubic-bezier(.4,0,.2,1)}.wrapper__error{font:400 12px/16px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;color:#ec4899}.wrapper__rows__row{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.wrapper__rows__row+.wrapper__rows__row{padding-top:3px;border-top:1px solid #d3d5dc;margin-top:4px}.wrapper__rows__row__field{flex:1 1 auto}.wrapper__rows__row__remove{flex:0 0 auto}\n"] }]
         }] });
 
 function minItemsValidationMessage(error, field) {
@@ -3340,7 +3346,7 @@ GioFjsMultiSchemaTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
     <div class="wrapper">
       <div class="wrapper__title" *ngIf="props.label">{{ props.label }}</div>
       <p *ngIf="props.description">{{ props.description }}</p>
-      <div class="wrapper__error" *ngIf="showError && formControl.errors">
+      <div class="wrapper__error gio-ng-invalid" *ngIf="showError && formControl.errors">
         <formly-validation-message [field]="field"></formly-validation-message>
       </div>
       <formly-field *ngFor="let f of field.fieldGroup" [field]="f"></formly-field>
@@ -3352,7 +3358,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
     <div class="wrapper">
       <div class="wrapper__title" *ngIf="props.label">{{ props.label }}</div>
       <p *ngIf="props.description">{{ props.description }}</p>
-      <div class="wrapper__error" *ngIf="showError && formControl.errors">
+      <div class="wrapper__error gio-ng-invalid" *ngIf="showError && formControl.errors">
         <formly-validation-message [field]="field"></formly-validation-message>
       </div>
       <formly-field *ngFor="let f of field.fieldGroup" [field]="f"></formly-field>
@@ -3656,6 +3662,561 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
  * limitations under the License.
  */
 
+/*
+ * 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 GioFormFocusInvalidDirective {
+    constructor(renderer, formGroupDirective) {
+        this.renderer = renderer;
+        this.formGroupDirective = formGroupDirective;
+    }
+    onFormSubmit() {
+        const selector = '.ng-invalid[formControlName],input.ng-invalid,mat-select.ng-invalid,textarea.ng-invalid,.gio-ng-invalid';
+        try {
+            let invalidControl = this.renderer.selectRootElement(selector, true);
+            // If the form is a GioFormJsonSchema, we need to focus the first invalid control inside
+            if (invalidControl.tagName === 'GIO-FORM-JSON-SCHEMA') {
+                invalidControl = invalidControl.querySelector(selector);
+            }
+            if (invalidControl) {
+                // Mark all controls as touched to display errors
+                if (this.formGroupDirective) {
+                    this.formGroupDirective.control.markAllAsTouched();
+                    this.formGroupDirective.control.updateValueAndValidity();
+                }
+                invalidControl.scrollIntoView({ behavior: 'smooth', block: 'center' });
+                invalidControl.focus({ preventScroll: true });
+            }
+        }
+        catch (error) {
+            // Best effort. If the focus doesn't work it's not very important
+            // 🧪 Useful to avoid som error in tests
+        }
+    }
+}
+GioFormFocusInvalidDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormFocusInvalidDirective, deps: [{ token: i0.Renderer2 }, { token: i7.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+GioFormFocusInvalidDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: GioFormFocusInvalidDirective, selector: "form[gioFormFocusInvalid]", host: { listeners: { "submit": "onFormSubmit()" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormFocusInvalidDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'form[gioFormFocusInvalid]',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i7.FormGroupDirective, decorators: [{
+                    type: Optional
+                }] }]; }, propDecorators: { onFormSubmit: [{
+                type: HostListener,
+                args: ['submit']
+            }] } });
+
+/*
+ * 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 GioFormFocusInvalidModule {
+}
+GioFormFocusInvalidModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormFocusInvalidModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+GioFormFocusInvalidModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormFocusInvalidModule, declarations: [GioFormFocusInvalidDirective], exports: [GioFormFocusInvalidDirective] });
+GioFormFocusInvalidModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormFocusInvalidModule });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormFocusInvalidModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [GioFormFocusInvalidDirective],
+                    exports: [GioFormFocusInvalidDirective],
+                }]
+        }] });
+
+/*
+ * 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.
+ */
+const GIO_MONACO_EDITOR_CONFIG = new InjectionToken('gio-monaco-editor-config');
+
+/*
+ * 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 GioMonacoEditorService {
+    constructor() {
+        this.loaded$ = new ReplaySubject(1);
+        this.loaded = false;
+    }
+    loadEditor() {
+        if (this.loaded) {
+            // Already loaded, do nothing.
+            return Promise.resolve();
+        }
+        this.loaded = true;
+        return new Promise(resolve => {
+            // Monaco is already loaded
+            if (typeof window.monaco === 'object') {
+                resolve();
+                return;
+            }
+            const onGotAmdLoader = () => {
+                // Load Monaco
+                window.require.config({ paths: { vs: 'assets/monaco-editor/min/vs' } });
+                window.require(['vs/editor/editor.main'], () => {
+                    resolve();
+                });
+            };
+            // Load AMD loader if necessary
+            if (!window.require) {
+                const loaderScript = document.createElement('script');
+                loaderScript.type = 'text/javascript';
+                loaderScript.src = 'assets/monaco-editor/min/vs/loader.js';
+                loaderScript.addEventListener('load', onGotAmdLoader);
+                document.body.appendChild(loaderScript);
+            }
+            else {
+                onGotAmdLoader();
+            }
+        }).then(() => {
+            this.loaded$.next({ monaco: window.monaco });
+        });
+    }
+}
+GioMonacoEditorService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioMonacoEditorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+GioMonacoEditorService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioMonacoEditorService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioMonacoEditorService, 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 GioLanguageJsonService {
+    constructor(codeEditorService) {
+        this.unsubscribe$ = new Subject();
+        codeEditorService.loaded$.pipe(takeUntil(this.unsubscribe$)).subscribe(event => {
+            this.setup(event.monaco);
+        });
+    }
+    ngOnDestroy() {
+        this.unsubscribe$.next();
+        this.unsubscribe$.complete();
+    }
+    setup(monaco) {
+        if (!monaco) {
+            throw new Error('Monaco is not loaded');
+        }
+        this.monaco = monaco;
+        const defaults = monaco.languages.json.jsonDefaults;
+        defaults.setDiagnosticsOptions({
+            validate: true,
+            allowComments: true,
+        });
+    }
+    addSchemas(id, definitions = []) {
+        if (!this.monaco) {
+            throw new Error('Monaco is not loaded');
+        }
+        const defaults = this.monaco.languages.json.jsonDefaults;
+        const options = defaults.diagnosticsOptions;
+        let schemas = definitions.map(({ uri, schema }) => ({
+            uri,
+            schema,
+            fileMatch: [id || '*.json'],
+        }));
+        if (options && options.schemas && options.schemas.length > 0) {
+            schemas = [...options.schemas, ...schemas];
+        }
+        defaults.setDiagnosticsOptions({
+            ...options,
+            schemas: schemas,
+        });
+    }
+}
+GioLanguageJsonService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioLanguageJsonService, deps: [{ token: GioMonacoEditorService }], target: i0.ɵɵFactoryTarget.Injectable });
+GioLanguageJsonService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioLanguageJsonService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioLanguageJsonService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: function () { return [{ type: GioMonacoEditorService }]; } });
+
+/*
+ * 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 GioMonacoEditorComponent {
+    constructor(config, monacoEditorService, languageJsonService, hostElement, changeDetectorRef, ngZone) {
+        this.config = config;
+        this.monacoEditorService = monacoEditorService;
+        this.languageJsonService = languageJsonService;
+        this.hostElement = hostElement;
+        this.changeDetectorRef = changeDetectorRef;
+        this.ngZone = ngZone;
+        this.options = {};
+        this.id = uniqueId('gio-monaco-editor-');
+        this.loading = true;
+        this.defaultOptions = {
+            contextmenu: false,
+            minimap: {
+                enabled: true,
+            },
+            automaticLayout: true,
+            scrollBeyondLastLine: false,
+        };
+        this.value = '';
+        this.readOnly = false;
+        this._onChange = () => ({});
+        this._onTouched = () => ({});
+        this.unsubscribe$ = new Subject();
+        this.monacoEditorService.loadEditor();
+    }
+    ngAfterViewInit() {
+        // Wait until monaco editor is available
+        this.monacoEditorService.loaded$.pipe(takeUntil(this.unsubscribe$)).subscribe(({ monaco }) => {
+            this.setupEditor(monaco);
+            this.loading = false;
+            this.changeDetectorRef.detectChanges();
+        });
+    }
+    ngOnDestroy() {
+        if (this.standaloneCodeEditor) {
+            this.standaloneCodeEditor.dispose();
+            this.standaloneCodeEditor = undefined;
+        }
+        if (this.textModel) {
+            this.textModel.dispose();
+            this.textModel = undefined;
+        }
+        this.unsubscribe$.next();
+        this.unsubscribe$.complete();
+    }
+    // From ControlValueAccessor interface
+    writeValue(_value) {
+        if (_value) {
+            this.value = _value;
+        }
+        if (this.textModel) {
+            this.textModel.setValue(this.value);
+        }
+    }
+    // From ControlValueAccessor interface
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    // From ControlValueAccessor interface
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    // From ControlValueAccessor interface
+    setDisabledState(isDisabled) {
+        this.readOnly = isDisabled;
+    }
+    setupEditor(monaco) {
+        if (!this.hostElement) {
+            throw new Error('No editor ref found.');
+        }
+        const domElement = this.hostElement.nativeElement;
+        const settings = {
+            value: this.value,
+            language: this.languageConfig?.language ?? 'text',
+            uri: `code-${uniqueId()}`,
+        };
+        this.ngZone.runOutsideAngular(() => {
+            this.textModel = monaco.editor.createModel(settings.value, settings.language, monaco.Uri.parse(settings.uri));
+        });
+        const options = Object.assign({}, this.defaultOptions, this.options, {
+            readOnly: this.readOnly,
+            theme: this.config.theme ?? 'vs',
+            model: this.textModel,
+        });
+        this.standaloneCodeEditor = monaco.editor.create(domElement, {
+            ...options,
+        });
+        this.textModel?.onDidChangeContent(() => {
+            const newValue = this.textModel?.getValue();
+            this.ngZone.run(() => {
+                newValue && this._onChange(newValue);
+                this._onTouched();
+            });
+        });
+        this.standaloneCodeEditor?.onDidBlurEditorWidget(() => {
+            this.ngZone.run(() => {
+                this._onTouched();
+            });
+        });
+        this.setupLanguage(settings.uri, this.languageConfig);
+    }
+    setupLanguage(uri, languageConfig) {
+        if (!languageConfig) {
+            return;
+        }
+        const { language } = languageConfig;
+        if (language) {
+            const lang = language.toLowerCase();
+            switch (lang) {
+                case 'json':
+                    if (languageConfig.schemas) {
+                        this.languageJsonService.addSchemas(uri, languageConfig.schemas);
+                    }
+                    break;
+                default:
+                    break;
+            }
+        }
+    }
+}
+GioMonacoEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioMonacoEditorComponent, deps: [{ token: GIO_MONACO_EDITOR_CONFIG }, { token: GioMonacoEditorService }, { token: GioLanguageJsonService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+GioMonacoEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioMonacoEditorComponent, selector: "gio-monaco-editor", inputs: { languageConfig: "languageConfig", options: "options" }, providers: [
+        {
+            provide: NG_VALUE_ACCESSOR,
+            useExisting: forwardRef(() => GioMonacoEditorComponent),
+            multi: true,
+        },
+    ], ngImport: i0, template: ` <div *ngIf="loading">Loading...</div>`, isInline: true, styles: [":host{display:block;height:100%;min-height:150px}\n"], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioMonacoEditorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'gio-monaco-editor', template: ` <div *ngIf="loading">Loading...</div>`, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => GioMonacoEditorComponent),
+                            multi: true,
+                        },
+                    ], styles: [":host{display:block;height:100%;min-height:150px}\n"] }]
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [GIO_MONACO_EDITOR_CONFIG]
+                }] }, { type: GioMonacoEditorService }, { type: GioLanguageJsonService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }]; }, propDecorators: { languageConfig: [{
+                type: Input
+            }], options: [{
+                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 GioMonacoEditorModule {
+    static forRoot(config) {
+        return {
+            ngModule: GioMonacoEditorModule,
+            providers: [
+                {
+                    provide: GIO_MONACO_EDITOR_CONFIG,
+                    useValue: config,
+                },
+            ],
+        };
+    }
+}
+GioMonacoEditorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioMonacoEditorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+GioMonacoEditorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioMonacoEditorModule, declarations: [GioMonacoEditorComponent], imports: [CommonModule, HttpClientModule, ReactiveFormsModule], exports: [GioMonacoEditorComponent] });
+GioMonacoEditorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioMonacoEditorModule, providers: [
+        {
+            provide: GIO_MONACO_EDITOR_CONFIG,
+            useValue: {},
+        },
+    ], imports: [[CommonModule, HttpClientModule, ReactiveFormsModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioMonacoEditorModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, HttpClientModule, ReactiveFormsModule],
+                    declarations: [GioMonacoEditorComponent],
+                    exports: [GioMonacoEditorComponent],
+                    providers: [
+                        {
+                            provide: GIO_MONACO_EDITOR_CONFIG,
+                            useValue: {},
+                        },
+                    ],
+                }]
+        }] });
+
+/*
+ * 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.
+ */
+/**
+ * This component is used to test the GioMonacoEditorComponent.
+ * This component simulates monaco editor with a simple input.
+ */
+class GioMonacoEditorTestingComponent extends GioMonacoEditorComponent {
+    get getValue() {
+        return this.value;
+    }
+    changeValue(value) {
+        this._onTouched();
+        this._onChange(value);
+    }
+}
+GioMonacoEditorTestingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioMonacoEditorTestingComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+GioMonacoEditorTestingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioMonacoEditorTestingComponent, selector: "gio-monaco-editor", providers: [
+        {
+            provide: NG_VALUE_ACCESSOR,
+            useExisting: forwardRef(() => GioMonacoEditorTestingComponent),
+            multi: true,
+        },
+    ], usesInheritance: true, ngImport: i0, template: '<input type="text" [value]="getValue" (input)="changeValue($any($event).target?.value)" />', isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioMonacoEditorTestingComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'gio-monaco-editor',
+                    template: '<input type="text" [value]="getValue" (input)="changeValue($any($event).target?.value)" />',
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => GioMonacoEditorTestingComponent),
+                            multi: true,
+                        },
+                    ],
+                }]
+        }] });
+
+/*
+ * 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.
+ */
+// Hack to replace the default gio-monaco-editor component with fake one for testing purpose.
+try {
+    TestBed.overrideModule(GioMonacoEditorModule, {
+        remove: {
+            declarations: [GioMonacoEditorComponent],
+            exports: [GioMonacoEditorComponent],
+        },
+        add: {
+            declarations: [GioMonacoEditorTestingComponent],
+            exports: [GioMonacoEditorTestingComponent],
+        },
+    });
+}
+catch (e) {
+    // Do nothing
+}
+class GioMonacoEditorHarness extends ComponentHarness {
+    constructor() {
+        super(...arguments);
+        this.getInputEl = this.locatorFor('input');
+    }
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for a `GioMonacoEditorHarness` that meets
+     * certain criteria.
+     *
+     * @param options Options for filtering which input instances are considered a match.
+     * @return a `HarnessPredicate` configured with the given options.
+     */
+    static with(options = {}) {
+        return new HarnessPredicate(GioMonacoEditorHarness, options);
+    }
+    async setValue(value) {
+        const inputEl = await this.getInputEl();
+        await inputEl.clear();
+        await inputEl.sendKeys(value);
+    }
+    async getValue() {
+        const inputEl = await this.getInputEl();
+        return inputEl.getProperty('value');
+    }
+}
+GioMonacoEditorHarness.hostSelector = 'gio-monaco-editor';
+
 /*
  * Copyright (C) 2021 The Gravitee team (http://gravitee.io)
  *
@@ -3692,5 +4253,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { GioAvatarComponent, GioAvatarModule, GioBannerActionDirective, GioBannerBodyDirective, GioBannerComponent, GioBannerErrorComponent, GioBannerInfoComponent, GioBannerModule, GioBannerSuccessComponent, GioBannerWarningComponent, GioBreadcrumbComponent, GioBreadcrumbItemDirective, GioBreadcrumbModule, GioConfirmAndValidateDialogComponent, GioConfirmAndValidateDialogHarness, GioConfirmAndValidateDialogModule, GioConfirmDialogComponent, GioConfirmDialogHarness, GioConfirmDialogModule, GioFormFilePickerAddButtonComponent, GioFormFilePickerComponent, GioFormFilePickerEmptyComponent, GioFormFilePickerInputHarness, GioFormFilePickerLabelComponent, GioFormFilePickerModule, GioFormHeadersComponent, GioFormHeadersHarness, GioFormHeadersModule, GioFormJsonSchemaComponent, GioFormJsonSchemaModule, GioFormLabelComponent, GioFormPrefixDirective, GioFormSlideToggleComponent, GioFormSlideToggleDirective, GioFormSlideToggleModule, GioFormTagsInputComponent, GioFormTagsInputHarness, GioFormTagsInputModule, GioIconsModule, GioMatConfigModule, GioMenuComponent, GioMenuFooterComponent, GioMenuHeaderComponent, GioMenuItemComponent, GioMenuListComponent, GioMenuModule, GioMenuSelectorComponent, GioMenuSelectorHarness, GioMenuService, GioSaveBarComponent, GioSaveBarHarness, GioSaveBarModule, GioSubmenuComponent, GioSubmenuGroupComponent, GioSubmenuItemComponent, GioSubmenuModule, GioSubmenuTitleDirective, GioTopBarComponent, GioTopBarContentComponent, GioTopBarLinkComponent, GioTopBarLinkModule, GioTopBarMenuComponent, GioTopBarMenuModule, GioTopBarModule, NewFile };
+export { GioAvatarComponent, GioAvatarModule, GioBannerActionDirective, GioBannerBodyDirective, GioBannerComponent, GioBannerErrorComponent, GioBannerInfoComponent, GioBannerModule, GioBannerSuccessComponent, GioBannerWarningComponent, GioBreadcrumbComponent, GioBreadcrumbItemDirective, GioBreadcrumbModule, GioConfirmAndValidateDialogComponent, GioConfirmAndValidateDialogHarness, GioConfirmAndValidateDialogModule, GioConfirmDialogComponent, GioConfirmDialogHarness, GioConfirmDialogModule, GioFormFilePickerAddButtonComponent, GioFormFilePickerComponent, GioFormFilePickerEmptyComponent, GioFormFilePickerInputHarness, GioFormFilePickerLabelComponent, GioFormFilePickerModule, GioFormFocusInvalidDirective, GioFormFocusInvalidModule, GioFormHeadersComponent, GioFormHeadersHarness, GioFormHeadersModule, GioFormJsonSchemaComponent, GioFormJsonSchemaModule, GioFormLabelComponent, GioFormPrefixDirective, GioFormSlideToggleComponent, GioFormSlideToggleDirective, GioFormSlideToggleModule, GioFormTagsInputComponent, GioFormTagsInputHarness, GioFormTagsInputModule, GioIconsModule, GioMatConfigModule, GioMenuComponent, GioMenuFooterComponent, GioMenuHeaderComponent, GioMenuItemComponent, GioMenuListComponent, GioMenuModule, GioMenuSelectorComponent, GioMenuSelectorHarness, GioMenuService, GioMonacoEditorComponent, GioMonacoEditorHarness, GioMonacoEditorModule, GioSaveBarComponent, GioSaveBarHarness, GioSaveBarModule, GioSubmenuComponent, GioSubmenuGroupComponent, GioSubmenuItemComponent, GioSubmenuModule, GioSubmenuTitleDirective, GioTopBarComponent, GioTopBarContentComponent, GioTopBarLinkComponent, GioTopBarLinkModule, GioTopBarMenuComponent, GioTopBarMenuModule, GioTopBarModule, NewFile };
 //# sourceMappingURL=gravitee-ui-particles-angular.mjs.map