Skip to content

Commit

Permalink
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
chore: bump to angular 14
Browse files Browse the repository at this point in the history
BREAKING CHANGE: Upgrade to Angular 14
ThibaudAV committed Jan 26, 2024
1 parent 2695eec commit 5377374
Showing 34 changed files with 2,869 additions and 2,733 deletions.
42 changes: 21 additions & 21 deletions ui-particles-angular/package.json
Original file line number Diff line number Diff line change
@@ -19,24 +19,24 @@
"watch": "ng build --watch --configuration development"
},
"dependencies": {
"@angular/animations": "13.3.12",
"@angular/cdk": "13.3.9",
"@angular/common": "13.3.12",
"@angular/compiler": "13.3.12",
"@angular/core": "13.3.12",
"@angular/forms": "13.3.12",
"@angular/material": "13.3.9",
"@angular/platform-browser": "13.3.12",
"@angular/platform-browser-dynamic": "13.3.12",
"@angular/router": "13.3.12",
"@angular/animations": "14.3.0",
"@angular/cdk": "14.2.7",
"@angular/common": "14.3.0",
"@angular/compiler": "14.3.0",
"@angular/core": "14.3.0",
"@angular/forms": "14.3.0",
"@angular/material": "14.2.7",
"@angular/platform-browser": "14.3.0",
"@angular/platform-browser-dynamic": "14.3.0",
"@angular/router": "14.3.0",
"@asciidoctor/core": "^2.2.5",
"@fontsource/fira-mono": "4.5.10",
"@fontsource/golos-ui": "^4.5.3",
"@fontsource/material-icons": "4.5.4",
"@gravitee/ui-components": "^3.38.4",
"@highcharts/map-collection": "^1.1.4",
"@ngx-formly/core": "6.1.8",
"@ngx-formly/material": "6.1.8",
"@ngx-formly/core": "6.2.2",
"@ngx-formly/material": "6.2.2",
"ajv": "^8.12.0",
"asciidoctor": "^2.2.6",
"asciidoctor-highlight.js": "^0.4.0",
@@ -54,15 +54,15 @@
"zone.js": "0.11.4"
},
"devDependencies": {
"@angular-builders/jest": "13.0.4",
"@angular-devkit/build-angular": "13.3.10",
"@angular-eslint/builder": "13.5.0",
"@angular-eslint/eslint-plugin": "13.5.0",
"@angular-eslint/eslint-plugin-template": "13.5.0",
"@angular-eslint/schematics": "13.5.0",
"@angular-eslint/template-parser": "13.5.0",
"@angular/cli": "13.3.10",
"@angular/compiler-cli": "13.3.12",
"@angular-builders/jest": "14.1.0",
"@angular-devkit/build-angular": "14.2.13",
"@angular-eslint/builder": "14.3.0",
"@angular-eslint/eslint-plugin": "14.3.0",
"@angular-eslint/eslint-plugin-template": "14.3.0",
"@angular-eslint/schematics": "14.3.0",
"@angular-eslint/template-parser": "14.3.0",
"@angular/cli": "14.2.13",
"@angular/compiler-cli": "14.3.0",
"@semantic-release/changelog": "6.0.2",
"@semantic-release/exec": "6.0.3",
"@semantic-release/git": "10.0.1",
4 changes: 2 additions & 2 deletions ui-particles-angular/projects/ui-analytics/package.json
Original file line number Diff line number Diff line change
@@ -11,8 +11,8 @@
"tslib": "^2.3.0"
},
"peerDependencies": {
"@angular/common": "^13.3.0",
"@angular/core": "^13.3.0"
"@angular/common": "^14.0.0",
"@angular/core": "^14.0.0"
},
"publishConfig": {
"access": "public"
18 changes: 9 additions & 9 deletions ui-particles-angular/projects/ui-particles-angular/package.json
Original file line number Diff line number Diff line change
@@ -15,15 +15,15 @@
"tslib": "2.3.1"
},
"peerDependencies": {
"@angular/animations": "^13.3.0",
"@angular/cdk": "^13.3.0",
"@angular/common": "^13.3.0",
"@angular/core": "^13.3.0",
"@angular/forms": "^13.3.0",
"@angular/material": "^13.3.0",
"@ngx-formly/core": "^6.1.8",
"@ngx-formly/material": "^6.1.8",
"asciidoctor": "^2.2.6",
"@angular/animations": "^14.0.0",
"@angular/cdk": "^14.0.0",
"@angular/common": "^14.0.0",
"@angular/core": "^14.0.0",
"@angular/forms": "^14.0.0",
"@angular/material": "^14.0.0",
"@ngx-formly/core": "^6.2.2",
"@ngx-formly/material": "^6.2.2",
"asciidoctor": "^2.2.6 || ^3.0.0",
"ngx-file-helpers": "^7.0.0",
"prismjs": "^1.29.0"
},
Original file line number Diff line number Diff line change
@@ -19,8 +19,8 @@ import { Component, ElementRef, HostBinding, NgZone, OnDestroy, OnInit, forwardR
import {
AbstractControl,
ControlValueAccessor,
FormControl,
FormGroup,
UntypedFormControl,
UntypedFormGroup,
NG_VALIDATORS,
NG_VALUE_ACCESSOR,
ValidationErrors,
@@ -59,7 +59,7 @@ export class GioFormCronComponent implements ControlValueAccessor, OnInit, OnDes
public hours = [...range(0, 24)];
public daysOfMonth = [...range(1, 32)];
public daysOfWeek = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'];
public internalFormGroup?: FormGroup;
public internalFormGroup?: UntypedFormGroup;
public value?: string;
public expressionDescription?: string;
@HostBinding('class.disabled')
@@ -95,18 +95,18 @@ export class GioFormCronComponent implements ControlValueAccessor, OnInit, OnDes
this.resizeObserver.observe(this.elRef.nativeElement);
}

this.internalFormGroup = new FormGroup({
mode: new FormControl(),
secondInterval: new FormControl(),
minuteInterval: new FormControl(),
hourInterval: new FormControl(),
dayInterval: new FormControl(),
dayOfWeek: new FormControl(),
dayOfMonth: new FormControl(),

hours: new FormControl(),
minutes: new FormControl(),
customExpression: new FormControl(),
this.internalFormGroup = new UntypedFormGroup({
mode: new UntypedFormControl(),
secondInterval: new UntypedFormControl(),
minuteInterval: new UntypedFormControl(),
hourInterval: new UntypedFormControl(),
dayInterval: new UntypedFormControl(),
dayOfWeek: new UntypedFormControl(),
dayOfMonth: new UntypedFormControl(),

hours: new UntypedFormControl(),
minutes: new UntypedFormControl(),
customExpression: new UntypedFormControl(),
});

this.isDisabled ? this.internalFormGroup.disable({ emitEvent: false }) : this.internalFormGroup.enable({ emitEvent: false });
Original file line number Diff line number Diff line change
@@ -17,7 +17,7 @@ import { HarnessLoader } from '@angular/cdk/testing';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
import { Component } from '@angular/core';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { FormControl, ReactiveFormsModule } from '@angular/forms';
import { UntypedFormControl, ReactiveFormsModule } from '@angular/forms';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';

import { GioFormCronHarness } from './gio-form-cron.harness';
@@ -28,7 +28,7 @@ describe('GioFormCronModule', () => {
template: ` <gio-form-cron [formControl]="testControl"></gio-form-cron> `,
})
class TestComponent {
public testControl = new FormControl(null);
public testControl = new UntypedFormControl(null);
}

let component: TestComponent;
Original file line number Diff line number Diff line change
@@ -18,13 +18,13 @@ import { Story } from '@storybook/angular/dist/ts3.9/client/preview/types-7-0';
import { action } from '@storybook/addon-actions';
import { MatFormFieldModule } from '@angular/material/form-field';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FormControl, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
import { UntypedFormControl, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';

import { GioFormCronComponent } from './gio-form-cron.component';
import { GioFormCronModule } from './gio-form-cron.module';

const DefaultRender: Meta['render'] = p => {
const control = new FormControl({ value: p.initialValue ?? '', disabled: p.disabled }, p.required ? Validators.required : null);
const control = new UntypedFormControl({ value: p.initialValue ?? '', disabled: p.disabled }, p.required ? Validators.required : null);

control.valueChanges.subscribe(v => {
console.info('Value changed', v);
Original file line number Diff line number Diff line change
@@ -17,7 +17,7 @@ import { HarnessLoader } from '@angular/cdk/testing';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
import { Component } from '@angular/core';
import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
import { UntypedFormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
import { MatIconTestingModule } from '@angular/material/icon/testing';

import { GioFormFilePickerInputHarness } from './gio-form-file-picker.component.harness';
@@ -47,7 +47,7 @@ export class TestFilePickerInputComponent {
public multiple = false;
public accept = '*';
public ngModelChange: () => void = () => {}; // eslint-disable-line @typescript-eslint/no-empty-function
public myForm = new FormBuilder().group({
public myForm = new UntypedFormBuilder().group({
file: [],
fileRequired: [undefined, Validators.required],
});
Original file line number Diff line number Diff line change
@@ -14,7 +14,7 @@
* limitations under the License.
*/
// tslint:disable: no-duplicate-string
import { FormBuilder, FormControl, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
import { UntypedFormBuilder, UntypedFormControl, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
import { action } from '@storybook/addon-actions';
import { Meta, moduleMetadata, Story } from '@storybook/angular';

@@ -96,7 +96,7 @@ export const WithAccept: Story = () => ({
WithAccept.storyName = 'accept only images';

export const WithFormGroup: Story = () => {
const formGroup = new FormBuilder().group({
const formGroup = new UntypedFormBuilder().group({
files: [],
});
formGroup.valueChanges.subscribe(value => {
@@ -130,7 +130,7 @@ export const WithInitValues: Story = () => ({
><gio-form-file-picker-label>Images</gio-form-file-picker-label></gio-form-file-picker>
`,
props: {
formControl: new FormControl(),
formControl: new UntypedFormControl(),
ngModel: [
...[
'https://upload.wikimedia.org/wikipedia/en/thumb/9/99/Gundam.jpg/250px-Gundam.jpg',
@@ -156,7 +156,7 @@ export const DisabledWithInitValues: Story = () => ({
`,
props: {
disabled: true,
formControl: new FormControl(),
formControl: new UntypedFormControl(),
ngModel: [
...[
'https://upload.wikimedia.org/wikipedia/en/thumb/9/99/Gundam.jpg/250px-Gundam.jpg',
@@ -171,7 +171,7 @@ export const DisabledWithInitValues: Story = () => ({
DisabledWithInitValues.storyName = 'disabled with init values';

export const WithFormValidator: Story = () => {
const formGroup = new FormBuilder().group({
const formGroup = new UntypedFormBuilder().group({
files: [undefined, Validators.required],
});
formGroup.valueChanges.subscribe(value => {
@@ -201,7 +201,7 @@ export const WithFormValidator: Story = () => {
WithFormValidator.storyName = 'with form validator';

export const WithFormDisabled: Story = () => {
const formGroup = new FormBuilder().group({
const formGroup = new UntypedFormBuilder().group({
files: [],
});
formGroup.controls.files.disable();
@@ -226,7 +226,7 @@ export const WithFormDisabled: Story = () => {
WithFormDisabled.storyName = 'with form disabled';

export const WithFormReset: Story = () => {
const formGroup = new FormBuilder().group({
const formGroup = new UntypedFormBuilder().group({
files: [],
});

Original file line number Diff line number Diff line change
@@ -16,7 +16,7 @@
import { Meta, moduleMetadata } from '@storybook/angular';
import { Story } from '@storybook/angular/dist/ts3.9/client/preview/types-7-0';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
import { UntypedFormControl, UntypedFormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { MatSelectModule } from '@angular/material/select';
@@ -52,13 +52,13 @@ export default {

export const Demo: Story = {
render: () => {
const form = new FormGroup({
anInput: new FormControl(null, Validators.required),
cron: new FormControl(null, Validators.required),
aSelect: new FormControl(null, Validators.required),
aTextarea: new FormControl(null, Validators.required),
aTagsInput: new FormControl(null, Validators.required),
aColorInput: new FormControl(null, Validators.required),
const form = new UntypedFormGroup({
anInput: new UntypedFormControl(null, Validators.required),
cron: new UntypedFormControl(null, Validators.required),
aSelect: new UntypedFormControl(null, Validators.required),
aTextarea: new UntypedFormControl(null, Validators.required),
aTagsInput: new UntypedFormControl(null, Validators.required),
aColorInput: new UntypedFormControl(null, Validators.required),
});

return {
Original file line number Diff line number Diff line change
@@ -19,9 +19,9 @@ import { Component, ElementRef, forwardRef, HostBinding, Input, OnInit } from '@
import {
AbstractControl,
ControlValueAccessor,
FormArray,
FormControl,
FormGroup,
UntypedFormArray,
UntypedFormControl,
UntypedFormGroup,
NG_VALIDATORS,
NG_VALUE_ACCESSOR,
ValidationErrors,
@@ -137,11 +137,11 @@ export class GioFormHeadersComponent implements OnInit, ControlValueAccessor, Va
valueName: 'value',
};

public mainForm: FormGroup;
public headersFormArray = new FormArray([
new FormGroup({
key: new FormControl('', Validators.pattern('^\\S*$')),
value: new FormControl(''),
public mainForm: UntypedFormGroup;
public headersFormArray = new UntypedFormArray([
new UntypedFormGroup({
key: new UntypedFormControl('', Validators.pattern('^\\S*$')),
value: new UntypedFormControl(''),
}),
]);

@@ -157,7 +157,7 @@ export class GioFormHeadersComponent implements OnInit, ControlValueAccessor, Va
private filteredHeaderNames: Observable<string[]>[] = [];

constructor(private readonly fm: FocusMonitor, private readonly elRef: ElementRef) {
this.mainForm = new FormGroup({
this.mainForm = new UntypedFormGroup({
headers: this.headersFormArray,
});
}
@@ -242,9 +242,9 @@ export class GioFormHeadersComponent implements OnInit, ControlValueAccessor, Va
// Populate headers array from headers
this.headers.forEach(({ key, value }, headerIndex) => {
this.headersFormArray.push(
new FormGroup({
new UntypedFormGroup({
key: this.initKeyFormControl(key, headerIndex),
value: new FormControl({ value, disabled: this.disabled }),
value: new UntypedFormControl({ value, disabled: this.disabled }),
}),
{
emitEvent: false,
@@ -276,7 +276,7 @@ export class GioFormHeadersComponent implements OnInit, ControlValueAccessor, Va
}

private initKeyFormControl(key: string, headerIndex: number) {
const control = new FormControl({ value: key, disabled: this.disabled }, Validators.pattern('^\\S*$'));
const control = new UntypedFormControl({ value: key, disabled: this.disabled }, Validators.pattern('^\\S*$'));
const filteredKeys = control.valueChanges.pipe(
startWith(''),
map(value => this._filter(value)),
@@ -296,9 +296,9 @@ export class GioFormHeadersComponent implements OnInit, ControlValueAccessor, Va
}

this.headersFormArray.push(
new FormGroup({
new UntypedFormGroup({
key: this.initKeyFormControl('', this.headersFormArray.length),
value: new FormControl(''),
value: new UntypedFormControl(''),
}),
{ emitEvent: false },
);
Original file line number Diff line number Diff line change
@@ -17,7 +17,7 @@ import { HarnessLoader } from '@angular/cdk/testing';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
import { Component } from '@angular/core';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { FormControl, ReactiveFormsModule } from '@angular/forms';
import { UntypedFormControl, ReactiveFormsModule } from '@angular/forms';
import { MatIconTestingModule } from '@angular/material/icon/testing';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';

@@ -28,7 +28,7 @@ import { GioFormHeadersModule } from './gio-form-headers.module';
template: `<gio-form-headers [formControl]="headersControl" [headerFieldMapper]="mapper"></gio-form-headers> `,
})
class TestComponent {
public headersControl = new FormControl([]);
public headersControl = new UntypedFormControl([]);
public mapper = {
keyName: 'key',
valueName: 'value',
Original file line number Diff line number Diff line change
@@ -17,7 +17,7 @@ import { Meta, moduleMetadata } from '@storybook/angular';
import { action } from '@storybook/addon-actions';
import { Story } from '@storybook/angular/dist/ts3.9/client/preview/types-7-0';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
import { UntypedFormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';

import { GioFormHeadersComponent } from './gio-form-headers.component';
import { GioFormHeadersModule } from './gio-form-headers.module';
@@ -63,7 +63,7 @@ export const Filled: Story = {

export const ReactiveForm: Story = {
render: args => {
const headersControl = new FormControl({
const headersControl = new UntypedFormControl({
value: args.headers,
disabled: args.disabled,
});
@@ -100,7 +100,7 @@ export const ReactiveForm: Story = {

export const ReactiveFormDisabled: Story = {
render: args => {
const headersControl = new FormControl({
const headersControl = new UntypedFormControl({
value: args.headers,
disabled: args.disabled,
});
Original file line number Diff line number Diff line change
@@ -29,7 +29,7 @@ import {
Output,
SimpleChanges,
} from '@angular/core';
import { ControlValueAccessor, FormGroup, NgControl } from '@angular/forms';
import { ControlValueAccessor, UntypedFormGroup, NgControl } from '@angular/forms';
import { FormlyFieldConfig, FormlyFormOptions } from '@ngx-formly/core';
import { cloneDeep, isEmpty, isObject } from 'lodash';
import { debounceTime, delay, distinctUntilChanged, filter, map, startWith, take, takeUntil, tap } from 'rxjs/operators';
@@ -64,7 +64,7 @@ export class GioFormJsonSchemaComponent implements ControlValueAccessor, OnChang
}
}

public formGroup: FormGroup = new FormGroup({});
public formGroup: UntypedFormGroup = new UntypedFormGroup({});

@Input()
public options: FormlyFormOptions = {};
Original file line number Diff line number Diff line change
@@ -14,11 +14,12 @@
* limitations under the License.
*/
import { ChangeDetectorRef, Component, Input, OnChanges, OnDestroy } from '@angular/core';
import { FormControl, FormGroup } from '@angular/forms';
import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
import { FormlyFormOptions } from '@ngx-formly/core';
import { combineLatest, Subject } from 'rxjs';
import { debounceTime, startWith, takeUntil, tap } from 'rxjs/operators';
import Ajv from 'ajv';
import { CommonModule } from '@angular/common';

import GioJsonSchema from './model/GioJsonSchema.json';
import { FormlyJSONSchema7 } from './model/FormlyJSONSchema7';
@@ -28,6 +29,7 @@ const ajv = new Ajv({ strict: false, logger: false });
selector: 'gio-demo',
templateUrl: './gio-form-json-schema.stories.component.html',
styleUrls: ['./gio-form-json-schema.stories.component.scss'],
imports: [CommonModule],
})
export class DemoComponent implements OnChanges, OnDestroy {
private unsubscribe$: Subject<void> = new Subject<void>();
@@ -47,14 +49,14 @@ export class DemoComponent implements OnChanges, OnDestroy {
@Input()
public withToggle = false;

public form?: FormGroup;
public form?: UntypedFormGroup;
public options: FormlyFormOptions = {};
public formValue: unknown;
public formValueError?: string;
public formValueErrorNumber?: number;

public inputValueControl?: FormControl;
public jsonSchemaControl?: FormControl;
public inputValueControl?: UntypedFormControl;
public jsonSchemaControl?: UntypedFormControl;

public monacoEditorJsonSchemaLanguage = {
language: 'json',
@@ -76,8 +78,8 @@ export class DemoComponent implements OnChanges, OnDestroy {
constructor(private changeDetectorRef: ChangeDetectorRef) {}

public ngOnChanges(): void {
this.jsonSchemaControl = new FormControl(JSON.stringify(this.jsonSchema, null, 2));
this.inputValueControl = new FormControl(JSON.stringify(this.initialValue, null, 2));
this.jsonSchemaControl = new UntypedFormControl(JSON.stringify(this.jsonSchema, null, 2));
this.inputValueControl = new UntypedFormControl(JSON.stringify(this.initialValue, null, 2));

combineLatest([
this.jsonSchemaControl.valueChanges.pipe(startWith(this.jsonSchemaControl.value)),
@@ -112,8 +114,8 @@ export class DemoComponent implements OnChanges, OnDestroy {
}

private resetUiPreview() {
this.form = new FormGroup({
schemaValue: new FormControl({
this.form = new UntypedFormGroup({
schemaValue: new UntypedFormControl({
value: this.initialValue,
disabled: this.disabled ?? false,
}),
Original file line number Diff line number Diff line change
@@ -23,6 +23,5 @@ import { GioFormSlideToggleComponent } from './gio-form-slide-toggle.component';
imports: [CommonModule],
declarations: [GioFormSlideToggleComponent, GioFormLabelComponent, GioFormPrefixDirective, GioFormSlideToggleDirective],
exports: [GioFormSlideToggleComponent, GioFormLabelComponent, GioFormPrefixDirective, GioFormSlideToggleDirective],
entryComponents: [GioFormSlideToggleComponent],
})
export class GioFormSlideToggleModule {}
Original file line number Diff line number Diff line change
@@ -275,15 +275,15 @@ describe('GioFormTagsInputModule - Dynamic input', () => {

it('should display value if tag not found', async () => {
const formTagsInputHarness = await loader.getHarness(GioFormTagsInputHarness);
fixture.detectChanges();
expect(await formTagsInputHarness.getTags()).toEqual([]);

const matAutocomplete = await formTagsInputHarness.getMatAutocompleteHarness();

await matAutocomplete?.enterText('The A3');
const options = await matAutocomplete?.getOptions();
if (options?.length !== 0) {
throw new Error('Should be equal to 0');
}
// Not open because no options
expect(await matAutocomplete?.isOpen()).toBe(false);

// Click somewhere else in the component to close the autocomplete without selecting an option
await matAutocomplete?.blur();

@@ -300,10 +300,8 @@ describe('GioFormTagsInputModule - Dynamic input', () => {

const matAutocomplete = await formTagsInputHarness.getMatAutocompleteHarness();
await matAutocomplete?.enterText('The A3');
const options = await matAutocomplete?.getOptions();
if (options?.length !== 0) {
throw new Error('Should be equal to 0');
}
// Not open because no options
expect(await matAutocomplete?.isOpen()).toBe(false);
// Click somewhere else in the component to close the autocomplete without selecting an option
await matAutocomplete?.blur();

Original file line number Diff line number Diff line change
@@ -18,7 +18,7 @@ import { Story } from '@storybook/angular/dist/ts3.9/client/preview/types-7-0';
import { action } from '@storybook/addon-actions';
import { MatFormFieldModule } from '@angular/material/form-field';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
import { UntypedFormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
import { range } from 'lodash';
import { of } from 'rxjs';
import { delay } from 'rxjs/operators';
@@ -128,7 +128,7 @@ export const Disabled: Story = {

export const FormControlEmpty: Story = {
render: ({ tags, placeholder, required, disabled, tagValidationHook }) => {
const tagsControl = new FormControl({ value: tags, disabled });
const tagsControl = new UntypedFormControl({ value: tags, disabled });

tagsControl.valueChanges.subscribe(value => {
action('Tags')(value);
@@ -187,7 +187,7 @@ export const WithTagValidationHook: Story = {

export const WithAutocomplete: Story = {
render: ({ tags, placeholder, required, disabled }) => {
const tagsControl = new FormControl({ value: tags, disabled });
const tagsControl = new UntypedFormControl({ value: tags, disabled });

tagsControl.valueChanges.subscribe(value => {
action('Tags')(value);
@@ -225,7 +225,7 @@ export const WithAutocomplete: Story = {
const httpMethods = ['GET', 'POST', 'PUT', 'DELETE', 'PATCH', 'HEAD', 'OPTIONS', 'TRACE', 'CONNECT'];
export const WithAutocompleteOnly: Story = {
render: ({ tags, placeholder, required, disabled, tagValidationHook, autocompleteOptions }) => {
const tagsControl = new FormControl({ value: tags, disabled });
const tagsControl = new UntypedFormControl({ value: tags, disabled });

tagsControl.valueChanges.subscribe(value => {
action('Tags')(value);
@@ -279,7 +279,7 @@ const applications = range(10).map(i => ({

export const WithAsyncAutocompleteOnly: Story = {
render: ({ tags, placeholder, required, disabled, autocompleteOptions, displayValueWith, useAutocompleteOptionValueOnly }) => {
const tagsControl = new FormControl({ value: tags, disabled });
const tagsControl = new UntypedFormControl({ value: tags, disabled });

tagsControl.valueChanges.subscribe(value => {
action('Tags')(value);
Original file line number Diff line number Diff line change
@@ -27,6 +27,5 @@ import { GioLicenseDialogComponent } from './gio-license-dialog.component';
imports: [CommonModule, MatDialogModule, GioIconsModule, MatButtonModule, GioSafePipeModule],
declarations: [GioLicenseDialogComponent],
exports: [GioLicenseDialogComponent],
entryComponents: [GioLicenseDialogComponent],
})
export class GioLicenseDialogModule {}
Original file line number Diff line number Diff line change
@@ -17,7 +17,7 @@ import { Meta, moduleMetadata } from '@storybook/angular';
import { Story } from '@storybook/angular/dist/ts3.9/client/preview/types-7-0';
import { action } from '@storybook/addon-actions';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
import { UntypedFormControl, UntypedFormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
import { MatFormFieldModule } from '@angular/material/form-field';

import GioJsonSchema from '../gio-form-json-schema/model/GioJsonSchema.json';
@@ -54,7 +54,7 @@ export default {
},
},
render: ({ value, disabled, languageConfig, disableMiniMap }) => {
const control = new FormControl({ value, disabled });
const control = new UntypedFormControl({ value, disabled });
control.valueChanges.subscribe(value => {
action('valueChanges')(value);
});
@@ -118,7 +118,7 @@ export const WithValue: Story = {

export const InsideMatFormField: Story = {
render: ({ value, disabled, languageConfig }) => {
const control = new FormControl({ value, disabled }, Validators.required);
const control = new UntypedFormControl({ value, disabled }, Validators.required);
control.valueChanges.subscribe(value => {
action('valueChanges')(value);
});
@@ -150,14 +150,14 @@ export const InsideMatFormField: Story = {

export const formControlName: Story = {
render: ({ value, disabled, languageConfig }) => {
const control = new FormControl({ value, disabled }, Validators.required);
const control = new UntypedFormControl({ value, disabled }, Validators.required);
control.valueChanges.subscribe(value => {
action('valueChanges')(value);
});
control.statusChanges.subscribe(status => {
action('statusChanges')(status);
});
const from = new FormGroup({ control });
const from = new UntypedFormGroup({ control });

return {
template: `
Original file line number Diff line number Diff line change
@@ -15,7 +15,7 @@
*/
import { animate, style, transition, trigger } from '@angular/animations';
import { Component, EventEmitter, HostBinding, HostListener, Input, Output } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { UntypedFormGroup } from '@angular/forms';
import { timer } from 'rxjs';

@Component({
@@ -57,7 +57,7 @@ export class GioSaveBarComponent {
public creationMode = false;

@Input()
public form?: FormGroup;
public form?: UntypedFormGroup;

private hasSubmitLock = true;

Original file line number Diff line number Diff line change
@@ -17,7 +17,7 @@ import { Meta, moduleMetadata } from '@storybook/angular';
import { Story } from '@storybook/angular/types-7-0';
import { action } from '@storybook/addon-actions';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FormControl, FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms';
import { UntypedFormControl, UntypedFormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';

import { GioSaveBarComponent } from './gio-save-bar.component';
@@ -81,8 +81,8 @@ export const ReactiveForm: Story = {
name: 'Update Mode / Reactive Form',

render: () => {
const form = new FormGroup({
anInput: new FormControl('Edit me to display the save bar'),
const form = new UntypedFormGroup({
anInput: new UntypedFormControl('Edit me to display the save bar'),
});

const formInitialValues = form.getRawValue();
Original file line number Diff line number Diff line change
@@ -20,7 +20,7 @@ import { MatCardModule } from '@angular/material/card';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { MatIconModule } from '@angular/material/icon';
import { FormControl, ReactiveFormsModule, Validators } from '@angular/forms';
import { UntypedFormControl, ReactiveFormsModule, Validators } from '@angular/forms';

export default {
title: 'Material Override / MatFormField',
@@ -61,7 +61,7 @@ export const MatHintAndErrorFontSize: Story = {
</mat-card>
`,
props: {
emailFormControl: new FormControl('', [Validators.required, Validators.email]),
emailFormControl: new UntypedFormControl('', [Validators.required, Validators.email]),
},
}),
};
@@ -101,7 +101,7 @@ export const PaddingBottomMatFormField: Story = {
</mat-card>
`,
props: {
emailFormControl: new FormControl('', [Validators.required, Validators.email]),
emailFormControl: new UntypedFormControl('', [Validators.required, Validators.email]),
},
}),
};
@@ -125,7 +125,7 @@ export const DisabledMatFormFieldShouldHaveNotAllowedCursor: Story = {
</mat-card>
`,
props: {
emailFormControl: new FormControl('', [Validators.required, Validators.email]),
emailFormControl: new UntypedFormControl('', [Validators.required, Validators.email]),
},
}),
};
Original file line number Diff line number Diff line change
@@ -18,7 +18,7 @@ import { MatIconModule } from '@angular/material/icon';
import { Story } from '@storybook/angular/types-7-0';
import { Meta, moduleMetadata } from '@storybook/angular';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FormControl, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
import { UntypedFormControl, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatNativeDateModule } from '@angular/material/core';
import { action } from '@storybook/addon-actions';
@@ -157,7 +157,7 @@ export const MatInput: Story = {
`,
],
props: {
errorFormControl: new FormControl('', [Validators.required]),
errorFormControl: new UntypedFormControl('', [Validators.required]),
fruits: ['Lemon', 'Lime', 'Apple'],
onTagsChange: (e: Tags[]) => action('Tags')(e),
},
Original file line number Diff line number Diff line change
@@ -16,7 +16,7 @@
import { Meta, moduleMetadata } from '@storybook/angular';
import { Story } from '@storybook/angular/types-7-0';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FormControl, FormsModule } from '@angular/forms';
import { UntypedFormControl, FormsModule } from '@angular/forms';
import { MatTableModule } from '@angular/material/table';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
@@ -188,7 +188,7 @@ export const MatTableWithMatFormField: Story = {
dataSource: ELEMENT_DATA,
errorStateMatcher: {
// Invalid form immediately if invalid
isErrorState(control: FormControl | null): boolean {
isErrorState(control: UntypedFormControl | null): boolean {
return !!(control && control.invalid);
},
},
Original file line number Diff line number Diff line change
@@ -27,45 +27,66 @@ $palettes: (
);

/* stylelint-disable selector-pseudo-class-no-unknown */
:export {
:root {
@each $paletteName, $palette in $palettes {
@each $colorName in $colorNames {
@if map.has-key($palette, $colorName) {
#{$paletteName}__#{$colorName}: mat.get-color-from-palette($palette, $colorName);
#{$paletteName}__#{$colorName}-contrast: mat.get-color-from-palette($palette, #{$colorName}-contrast);
$color: mat.get-color-from-palette($palette, $colorName);
$color-contrast: mat.get-color-from-palette($palette, #{$colorName}-contrast);

--gp--#{$paletteName}__#{$colorName}: #{$color};
--gp--#{$paletteName}__#{$colorName}-contrast: #{$color-contrast};
}
}
}

// Special palettes

@each $colorName in (patch, post, put, get, delete, option, trace, head) {
method__#{$colorName}: mat.get-color-from-palette(gio.$mat-method-palette, $colorName);
method__#{$colorName}-contrast: mat.get-color-from-palette(gio.$mat-method-palette, #{$colorName}-contrast);
$color: mat.get-color-from-palette(gio.$mat-method-palette, $colorName);
$color-contrast: mat.get-color-from-palette(gio.$mat-method-palette, #{$colorName}-contrast);

--gp--method__#{$colorName}: #{$color};
--gp--method__#{$colorName}-contrast: #{$color-contrast};
}

@each $colorName in (white, black, disabled) {
basic__#{$colorName}: mat.get-color-from-palette(gio.$mat-basic-palette, $colorName);
basic__#{$colorName}-contrast: mat.get-color-from-palette(gio.$mat-basic-palette, #{$colorName}-contrast);
$color: mat.get-color-from-palette(gio.$mat-basic-palette, $colorName);
$color-contrast: mat.get-color-from-palette(gio.$mat-basic-palette, #{$colorName}-contrast);

--gp--basic__#{$colorName}: #{$color};
--gp--basic__#{$colorName}-contrast: #{$color-contrast};
}

@each $colorName in (lighter80, lighter70, lighter60, lighter50, lighter40, lighter30, lighter20, lighter10, default) {
space__#{$colorName}: mat.get-color-from-palette(gio.$mat-space-palette, $colorName);
space__#{$colorName}-contrast: mat.get-color-from-palette(gio.$mat-space-palette, #{$colorName}-contrast);
$color: mat.get-color-from-palette(gio.$mat-space-palette, $colorName);
$color-contrast: mat.get-color-from-palette(gio.$mat-space-palette, #{$colorName}-contrast);

--gp--space__#{$colorName}: #{$color};
--gp--space__#{$colorName}-contrast: #{$color-contrast};
}

@each $colorName in (darker80, darker70, darker60, darker50, darker40, darker30, darker20, darker10, default) {
dove__#{$colorName}: mat.get-color-from-palette(gio.$mat-dove-palette, $colorName);
dove__#{$colorName}-contrast: mat.get-color-from-palette(gio.$mat-dove-palette, #{$colorName}-contrast);
$color: mat.get-color-from-palette(gio.$mat-dove-palette, $colorName);
$color-contrast: mat.get-color-from-palette(gio.$mat-dove-palette, #{$colorName}-contrast);

--gp--dove__#{$colorName}: #{$color};
--gp--dove__#{$colorName}-contrast: #{$color-contrast};
}

@each $colorName in (lighter80, lighter60, lighter40, lighter20, default) {
cyan__#{$colorName}: mat.get-color-from-palette(gio.$mat-cyan-palette, $colorName);
cyan__#{$colorName}-contrast: mat.get-color-from-palette(gio.$mat-cyan-palette, #{$colorName}-contrast);
$color: mat.get-color-from-palette(gio.$mat-cyan-palette, $colorName);
$color-contrast: mat.get-color-from-palette(gio.$mat-cyan-palette, #{$colorName}-contrast);

--gp--cyan__#{$colorName}: #{$color};
--gp--cyan__#{$colorName}-contrast: #{$color-contrast};
}

@each $colorName in (lighter80, lighter60, lighter40, lighter20, default) {
blue__#{$colorName}: mat.get-color-from-palette(gio.$mat-blue-palette, $colorName);
blue__#{$colorName}-contrast: mat.get-color-from-palette(gio.$mat-blue-palette, #{$colorName}-contrast);
$color: mat.get-color-from-palette(gio.$mat-blue-palette, $colorName);
$color-contrast: mat.get-color-from-palette(gio.$mat-blue-palette, #{$colorName}-contrast);

--gp--blue__#{$colorName}: #{$color};
--gp--blue__#{$colorName}-contrast: #{$color-contrast};
}
}

This file was deleted.

Original file line number Diff line number Diff line change
@@ -13,56 +13,66 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { Component } from '@angular/core';

import gioMaterialColorString from './gio-palettes.stories.scss';

/**
* Hack to get the color string from the gio-palettes.stories.scss file
*/
const gioMaterialColor: { key: string; value: string }[] = gioMaterialColorString
.split(':export ')[1]
.replace(/\{|\}/g, '')
.split(';')
.map(color => color.split(':'))
.filter(color => !!color[1])
.reduce((acc, [key, value]) => {
acc.push({
key: `${key}`.trim(),
value: `${value}`.trim(),
});

return acc;
}, [] as { key: string; value: string }[]);
import { Component, ViewEncapsulation } from '@angular/core';

@Component({
selector: 'gio-color',
templateUrl: './showcase-color.component.html',
styleUrls: ['./showcase-color.component.scss'],
styleUrls: ['./showcase-color.component.scss', './gio-palettes.stories.scss'],
encapsulation: ViewEncapsulation.None,
})
export class ShowcaseColorComponent {
public colorPalettes = gioMaterialColor.reduce((prev, { key, value }) => {
const [paletteName, fullColorName] = key.split('__');
const colorName = fullColorName.split('-contrast')[0];
public colorPalettes: { name: string; colors: { name: string; color?: string; contrast?: string }[] }[] = [];

constructor() {
this.colorPalettes = [].slice
.call(document.styleSheets)
// eslint-disable-next-line @typescript-eslint/no-explicit-any
.map((styleSheet: any) => [].slice.call(styleSheet.cssRules))
.flat()
// eslint-disable-next-line @typescript-eslint/no-explicit-any
.filter((cssRule: any) => cssRule.selectorText === ':root')
// eslint-disable-next-line @typescript-eslint/no-explicit-any
.map((cssRule: any) => cssRule.cssText.split('{')[1].split('}')[0].trim().split(';'))
.flat()
.filter(text => text !== '')
.map(text => text.split(':'))
.map(parts => parts[0].trim() + ': ' + parts[1].trim())
.filter(text => text.startsWith('--gp'))
.reduce((acc, variable) => {
const [key, value] = variable.split(':');

acc.push({
key: `${key.replace('--gp--', '')}`.trim(),
value: `${value}`.trim(),
});

return acc;
}, [] as { key: string; value: string }[])

.reduce((prev, { key, value }) => {
const [paletteName, fullColorName] = key.split('__');
const colorName = fullColorName.split('-contrast')[0];

let palette = prev.find(p => p.name === paletteName);
if (!palette) {
palette = { name: paletteName, colors: [] };
prev.push(palette);
}
let palette = prev.find(p => p.name === paletteName);
if (!palette) {
palette = { name: paletteName, colors: [] };
prev.push(palette);
}

let color = palette.colors.find(p => p.name === colorName);
if (!color) {
color = { name: colorName };
palette.colors.push(color);
}
let color = palette.colors.find(p => p.name === colorName);
if (!color) {
color = { name: colorName };
palette.colors.push(color);
}

if (fullColorName.endsWith('-contrast')) {
color.contrast = value;
} else {
color.color = value;
}
if (fullColorName.endsWith('-contrast')) {
color.contrast = value;
} else {
color.color = value;
}

return prev;
}, [] as { name: string; colors: { name: string; color?: string; contrast?: string }[] }[]);
return prev;
}, [] as { name: string; colors: { name: string; color?: string; contrast?: string }[] }[]);
}
}
Original file line number Diff line number Diff line change
@@ -11,15 +11,15 @@
"tslib": "^2.3.0"
},
"peerDependencies": {
"@angular/animations": "^13.3.0",
"@angular/cdk": "^13.3.0",
"@angular/common": "^13.3.0",
"@angular/core": "^13.3.0",
"@angular/forms": "^13.3.0",
"@angular/material": "^13.3.0",
"@angular/animations": "^14.0.0",
"@angular/cdk": "^14.0.0",
"@angular/common": "^14.0.0",
"@angular/core": "^14.0.0",
"@angular/forms": "^14.0.0",
"@angular/material": "^14.0.0",
"@gravitee/ui-particles-angular": "*",
"lodash": "^4.17.21",
"rxjs": "^6.6.0"
"rxjs": "^6.6.0 || ~7.5.0"
},
"publishConfig": {
"access": "public"
Original file line number Diff line number Diff line change
@@ -15,7 +15,7 @@
*/
import { Component, Inject } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { FormControl, FormGroup } from '@angular/forms';
import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
import { cloneDeep } from 'lodash';

import { FlowExecution } from '../../models';
@@ -30,7 +30,7 @@ export type GioPolicyStudioFlowExecutionFormDialogData = {
styleUrls: ['./gio-ps-flow-execution-form-dialog.component.scss'],
})
export class GioPolicyStudioFlowExecutionFormDialogComponent {
public flowExecutionFormGroup?: FormGroup;
public flowExecutionFormGroup?: UntypedFormGroup;

public existingFlowExecution?: FlowExecution;

@@ -40,9 +40,9 @@ export class GioPolicyStudioFlowExecutionFormDialogComponent {
) {
this.existingFlowExecution = cloneDeep(flowDialogData?.flowExecution);

this.flowExecutionFormGroup = new FormGroup({
mode: new FormControl(flowDialogData?.flowExecution?.mode ?? 'DEFAULT'),
matchRequired: new FormControl(flowDialogData?.flowExecution?.matchRequired ?? false),
this.flowExecutionFormGroup = new UntypedFormGroup({
mode: new UntypedFormControl(flowDialogData?.flowExecution?.mode ?? 'DEFAULT'),
matchRequired: new UntypedFormControl(flowDialogData?.flowExecution?.matchRequired ?? false),
});
}

Original file line number Diff line number Diff line change
@@ -15,7 +15,7 @@
*/
import { Component, Inject } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { FormControl, FormGroup } from '@angular/forms';
import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
import { cloneDeep, uniqueId } from 'lodash';

import { FlowVM } from '../../../gio-policy-studio.model';
@@ -34,7 +34,7 @@ export type GioPolicyStudioFlowMessageFormDialogData = {
})
export class GioPolicyStudioFlowMessageFormDialogComponent {
public entrypoints: ConnectorInfo[] = [];
public flowFormGroup?: FormGroup;
public flowFormGroup?: UntypedFormGroup;

public existingFlow?: FlowVM;
public mode: 'create' | 'edit' = 'create';
@@ -51,13 +51,13 @@ export class GioPolicyStudioFlowMessageFormDialogComponent {
const channelSelector = flowDialogData?.flow?.selectors?.find(s => s.type === 'CHANNEL') as ChannelSelector;
const conditionSelector = flowDialogData?.flow?.selectors?.find(s => s.type === 'CONDITION') as ConditionSelector;

this.flowFormGroup = new FormGroup({
name: new FormControl(flowDialogData?.flow?.name ?? ''),
channelOperator: new FormControl(channelSelector?.channelOperator ?? 'EQUALS'),
channel: new FormControl(channelSelector?.channel ?? ''),
operations: new FormControl(channelSelector?.operations ?? []),
entrypoints: new FormControl(channelSelector?.entrypoints ?? []),
condition: new FormControl(conditionSelector?.condition ?? ''),
this.flowFormGroup = new UntypedFormGroup({
name: new UntypedFormControl(flowDialogData?.flow?.name ?? ''),
channelOperator: new UntypedFormControl(channelSelector?.channelOperator ?? 'EQUALS'),
channel: new UntypedFormControl(channelSelector?.channel ?? ''),
operations: new UntypedFormControl(channelSelector?.operations ?? []),
entrypoints: new UntypedFormControl(channelSelector?.entrypoints ?? []),
condition: new UntypedFormControl(conditionSelector?.condition ?? ''),
});
}

Original file line number Diff line number Diff line change
@@ -15,7 +15,7 @@
*/
import { Component, Inject } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { FormControl, FormGroup } from '@angular/forms';
import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
import { cloneDeep, uniqueId } from 'lodash';

import { FlowVM } from '../../../gio-policy-studio.model';
@@ -36,7 +36,7 @@ const METHODS_AUTOCOMPLETE: HttpMethodVM[] = ['ALL', ...HttpMethods];
styleUrls: ['./gio-ps-flow-proxy-form-dialog.component.scss'],
})
export class GioPolicyStudioFlowProxyFormDialogComponent {
public flowFormGroup?: FormGroup;
public flowFormGroup?: UntypedFormGroup;

public existingFlow?: FlowVM;
public mode: 'create' | 'edit' = 'create';
@@ -52,12 +52,12 @@ export class GioPolicyStudioFlowProxyFormDialogComponent {
const httpSelector = flowDialogData?.flow?.selectors?.find(s => s.type === 'HTTP') as HttpSelector;
const conditionSelector = flowDialogData?.flow?.selectors?.find(s => s.type === 'CONDITION') as ConditionSelector;

this.flowFormGroup = new FormGroup({
name: new FormControl(flowDialogData?.flow?.name ?? ''),
pathOperator: new FormControl(httpSelector?.pathOperator ?? 'EQUALS'),
path: new FormControl(sanitizePathFormValue(httpSelector?.path)),
methods: new FormControl(sanitizeMethodFormValue(httpSelector?.methods)),
condition: new FormControl(conditionSelector?.condition ?? ''),
this.flowFormGroup = new UntypedFormGroup({
name: new UntypedFormControl(flowDialogData?.flow?.name ?? ''),
pathOperator: new UntypedFormControl(httpSelector?.pathOperator ?? 'EQUALS'),
path: new UntypedFormControl(sanitizePathFormValue(httpSelector?.path)),
methods: new UntypedFormControl(sanitizeMethodFormValue(httpSelector?.methods)),
condition: new UntypedFormControl(conditionSelector?.condition ?? ''),
});
}

Original file line number Diff line number Diff line change
@@ -16,7 +16,7 @@
import { Component, Inject, OnDestroy } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { toLower, uniq } from 'lodash';
import { FormControl, FormGroup } from '@angular/forms';
import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
import { startWith, takeUntil } from 'rxjs/operators';
import { Subject } from 'rxjs';

@@ -60,11 +60,11 @@ export class GioPolicyStudioPoliciesCatalogDialogComponent implements OnDestroy

public isValid = false;

public selectedCategoriesControl?: FormControl;
public selectedCategoriesControl?: UntypedFormControl;

public filtersForm = new FormGroup({
categories: new FormControl([]),
search: new FormControl(''),
public filtersForm = new UntypedFormGroup({
categories: new UntypedFormControl([]),
search: new UntypedFormControl(''),
});

private allPolicies: PolicyVM[] = [];
Original file line number Diff line number Diff line change
@@ -14,7 +14,7 @@
* limitations under the License.
*/
import { Component, EventEmitter, Input, OnChanges, OnDestroy, OnInit, Output, SimpleChanges } from '@angular/core';
import { FormControl, FormGroup } from '@angular/forms';
import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
import { map, takeUntil } from 'rxjs/operators';
import { Observable, Subject } from 'rxjs';
import { GioFormJsonSchemaComponent, GioJsonSchema } from '@gravitee/ui-particles-angular';
@@ -44,7 +44,7 @@ export class GioPolicyStudioStepFormComponent implements OnChanges, OnInit, OnDe
public policySchema$?: Observable<GioJsonSchema | null | undefined>;
public policyDocumentation$?: Observable<string>;

public stepForm?: FormGroup;
public stepForm?: UntypedFormGroup;

private unsubscribe$ = new Subject<void>();
constructor(private readonly policyStudioService: GioPolicyStudioService) {}
@@ -76,10 +76,10 @@ export class GioPolicyStudioStepFormComponent implements OnChanges, OnInit, OnDe
}

private initStepForm(): void {
this.stepForm = new FormGroup({
description: new FormControl(this.step?.description),
condition: new FormControl(this.step?.condition),
configuration: new FormControl(this.step?.configuration ?? {}),
this.stepForm = new UntypedFormGroup({
description: new UntypedFormControl(this.step?.description),
condition: new UntypedFormControl(this.step?.condition),
configuration: new UntypedFormControl(this.step?.configuration ?? {}),
});

this.stepForm.valueChanges.pipe(takeUntil(this.unsubscribe$)).subscribe(() => {
5,102 changes: 2,613 additions & 2,489 deletions yarn.lock

Large diffs are not rendered by default.

0 comments on commit 5377374

Please sign in to comment.