@gravitee/ui-particles-angular 5.10.0 → 5.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (24) hide show
  1. package/esm2020/lib/gio-form-headers/gio-form-headers.component.mjs +11 -4
  2. package/esm2020/lib/gio-form-json-schema/gio-form-json-schema.component.mjs +10 -33
  3. package/esm2020/lib/gio-form-json-schema/gio-form-json-schema.module.mjs +43 -3
  4. package/esm2020/lib/gio-form-json-schema/gio-formly-json-schema.service.mjs +64 -0
  5. package/esm2020/lib/gio-form-json-schema/model/GioJsonSchema.mjs +16 -1
  6. package/esm2020/lib/gio-form-json-schema/type-component/array-type.component.mjs +57 -25
  7. package/esm2020/lib/gio-form-json-schema/type-component/headers-type.component.mjs +93 -0
  8. package/esm2020/lib/gio-form-json-schema/type-component/multischema-type.component.mjs +6 -5
  9. package/esm2020/lib/gio-form-json-schema/type-component/object-type.component.mjs +11 -7
  10. package/esm2020/lib/gio-form-json-schema/type-component/toggle-type.component.mjs +59 -0
  11. package/fesm2015/gravitee-ui-particles-angular.mjs +455 -206
  12. package/fesm2015/gravitee-ui-particles-angular.mjs.map +1 -1
  13. package/fesm2020/gravitee-ui-particles-angular.mjs +456 -192
  14. package/fesm2020/gravitee-ui-particles-angular.mjs.map +1 -1
  15. package/lib/gio-form-headers/gio-form-headers.component.d.ts +4 -2
  16. package/lib/gio-form-json-schema/gio-form-json-schema.component.d.ts +3 -5
  17. package/lib/gio-form-json-schema/gio-form-json-schema.module.d.ts +14 -8
  18. package/lib/gio-form-json-schema/gio-formly-json-schema.service.d.ts +15 -0
  19. package/lib/gio-form-json-schema/model/GioJsonSchema.d.ts +19 -11
  20. package/lib/gio-form-json-schema/type-component/array-type.component.d.ts +1 -0
  21. package/lib/gio-form-json-schema/type-component/headers-type.component.d.ts +19 -0
  22. package/lib/gio-form-json-schema/type-component/toggle-type.component.d.ts +8 -0
  23. package/package.json +1 -1
  24. package/src/scss/mat-override/mat-table.scss +3 -3
@@ -47,7 +47,8 @@ import * as i1$3 from '@ngx-formly/core/json-schema';
47
47
  import * as i1$4 from '@ngx-formly/core';
48
48
  import { FieldType, FieldArrayType, FieldWrapper, FormlyModule } from '@ngx-formly/core';
49
49
  import { FormlyMaterialModule } from '@ngx-formly/material';
50
- import { MatSlideToggle } from '@angular/material/slide-toggle';
50
+ import * as i3$2 from '@angular/material/slide-toggle';
51
+ import { MatSlideToggle, MatSlideToggleModule } from '@angular/material/slide-toggle';
51
52
 
52
53
  /*
53
54
  * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
@@ -1062,6 +1063,11 @@ class GioFormHeadersComponent {
1062
1063
  }
1063
1064
  // From ControlValueAccessor interface
1064
1065
  registerOnChange(fn) {
1066
+ const adaptOutputFn = this.adaptOutputFn;
1067
+ if (adaptOutputFn) {
1068
+ this._onChange = (headers) => fn(adaptOutputFn(headers));
1069
+ return;
1070
+ }
1065
1071
  this._onChange = fn;
1066
1072
  }
1067
1073
  // From ControlValueAccessor interface
@@ -1149,7 +1155,7 @@ class GioFormHeadersComponent {
1149
1155
  }
1150
1156
  }
1151
1157
  GioFormHeadersComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormHeadersComponent, deps: [{ token: i2$2.FocusMonitor }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
1152
- GioFormHeadersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioFormHeadersComponent, selector: "gio-form-headers", host: { properties: { "class.disabled": "this.disabled" } }, providers: [
1158
+ GioFormHeadersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioFormHeadersComponent, selector: "gio-form-headers", inputs: { adaptOutputFn: "adaptOutputFn" }, host: { properties: { "class.disabled": "this.disabled" } }, providers: [
1153
1159
  {
1154
1160
  provide: NG_VALUE_ACCESSOR,
1155
1161
  useExisting: forwardRef(() => GioFormHeadersComponent),
@@ -1165,7 +1171,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
1165
1171
  multi: true,
1166
1172
  },
1167
1173
  ], 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"] }]
1168
- }], ctorParameters: function () { return [{ type: i2$2.FocusMonitor }, { type: i0.ElementRef }]; }, propDecorators: { disabled: [{
1174
+ }], ctorParameters: function () { return [{ type: i2$2.FocusMonitor }, { type: i0.ElementRef }]; }, propDecorators: { adaptOutputFn: [{
1175
+ type: Input
1176
+ }], disabled: [{
1169
1177
  type: HostBinding,
1170
1178
  args: ['class.disabled']
1171
1179
  }] } });
@@ -2779,9 +2787,69 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
2779
2787
  * See the License for the specific language governing permissions and
2780
2788
  * limitations under the License.
2781
2789
  */
2782
- class GioFormJsonSchemaComponent {
2783
- constructor(formlyJsonschema, elRef, fm, ngControl) {
2790
+ class GioFormlyJsonSchemaService {
2791
+ constructor(formlyJsonschema, builder) {
2784
2792
  this.formlyJsonschema = formlyJsonschema;
2793
+ this.builder = builder;
2794
+ }
2795
+ toFormlyFieldConfig(jsonSchema) {
2796
+ return this.formlyJsonschema.toFieldConfig(jsonSchema, {
2797
+ map: (mappedField, mapSource) => {
2798
+ mappedField = this.uiTypeMap(mappedField, mapSource);
2799
+ mappedField = this.bannerMap(mappedField, mapSource);
2800
+ mappedField = this.toggleMap(mappedField, mapSource);
2801
+ return mappedField;
2802
+ },
2803
+ });
2804
+ }
2805
+ uiTypeMap(mappedField, mapSource) {
2806
+ mappedField.type = mapSource.gioConfig?.uiType ?? mappedField.type;
2807
+ return mappedField;
2808
+ }
2809
+ bannerMap(mappedField, mapSource) {
2810
+ mappedField.props = {
2811
+ ...mappedField.props,
2812
+ ...(mapSource.gioConfig?.banner ? getBannerProperties(mapSource.gioConfig.banner) : {}),
2813
+ };
2814
+ return mappedField;
2815
+ }
2816
+ toggleMap(mappedField, mapSource) {
2817
+ if (mapSource.type === 'boolean') {
2818
+ mappedField.type = 'toggle';
2819
+ }
2820
+ return mappedField;
2821
+ }
2822
+ }
2823
+ GioFormlyJsonSchemaService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormlyJsonSchemaService, deps: [{ token: i1$3.FormlyJsonschema }, { token: i1$4.FormlyFormBuilder }], target: i0.ɵɵFactoryTarget.Injectable });
2824
+ GioFormlyJsonSchemaService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormlyJsonSchemaService });
2825
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormlyJsonSchemaService, decorators: [{
2826
+ type: Injectable
2827
+ }], ctorParameters: function () { return [{ type: i1$3.FormlyJsonschema }, { type: i1$4.FormlyFormBuilder }]; } });
2828
+ const getBannerProperties = (banner) => {
2829
+ return {
2830
+ bannerText: banner.text,
2831
+ bannerTitle: 'title' in banner ? banner.title : undefined,
2832
+ };
2833
+ };
2834
+
2835
+ /*
2836
+ * Copyright (C) 2023 The Gravitee team (http://gravitee.io)
2837
+ *
2838
+ * Licensed under the Apache License, Version 2.0 (the "License");
2839
+ * you may not use this file except in compliance with the License.
2840
+ * You may obtain a copy of the License at
2841
+ *
2842
+ * http://www.apache.org/licenses/LICENSE-2.0
2843
+ *
2844
+ * Unless required by applicable law or agreed to in writing, software
2845
+ * distributed under the License is distributed on an "AS IS" BASIS,
2846
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
2847
+ * See the License for the specific language governing permissions and
2848
+ * limitations under the License.
2849
+ */
2850
+ class GioFormJsonSchemaComponent {
2851
+ constructor(gioFormlyJsonSchema, elRef, fm, ngControl) {
2852
+ this.gioFormlyJsonSchema = gioFormlyJsonSchema;
2785
2853
  this.elRef = elRef;
2786
2854
  this.fm = fm;
2787
2855
  this.ngControl = ngControl;
@@ -2808,7 +2876,7 @@ class GioFormJsonSchemaComponent {
2808
2876
  }
2809
2877
  set jsonSchema(jsonSchema) {
2810
2878
  if (isObject(jsonSchema)) {
2811
- this.fields = [this.toFormlyFieldConfig(jsonSchema)];
2879
+ this.fields = [this.gioFormlyJsonSchema.toFormlyFieldConfig(jsonSchema)];
2812
2880
  }
2813
2881
  }
2814
2882
  ngOnInit() {
@@ -2849,36 +2917,13 @@ class GioFormJsonSchemaComponent {
2849
2917
  setDisabledState(_isDisabled) {
2850
2918
  throw new Error('Method not implemented.');
2851
2919
  }
2852
- toFormlyFieldConfig(jsonSchema) {
2853
- return this.formlyJsonschema.toFieldConfig(jsonSchema, {
2854
- map: (mappedField, mapSource) => {
2855
- // Casting fields into our specific type
2856
- const gioMapSource = mapSource;
2857
- mappedField.props = {
2858
- ...mappedField.props,
2859
- ...(gioMapSource.gioConfig?.banner ? this.getBannerProperties(gioMapSource.gioConfig.banner) : {}),
2860
- };
2861
- return mappedField;
2862
- },
2863
- });
2864
- }
2865
- getBannerProperties(banner) {
2866
- return {
2867
- bannerText: banner.text,
2868
- bannerTitle: 'title' in banner ? banner.title : undefined,
2869
- };
2870
- }
2871
2920
  }
2872
- GioFormJsonSchemaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormJsonSchemaComponent, deps: [{ token: i1$3.FormlyJsonschema }, { token: i0.ElementRef }, { token: i2$2.FocusMonitor }, { token: i7.NgControl, host: true, optional: true }], target: i0.ɵɵFactoryTarget.Component });
2873
- GioFormJsonSchemaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioFormJsonSchemaComponent, selector: "gio-form-json-schema", inputs: { jsonSchema: "jsonSchema", options: "options" }, ngImport: i0, template: `<formly-form *ngIf="formGroup" [fields]="fields" [options]="options" [form]="formGroup" [model]="model"></formly-form>`, isInline: true, components: [{ type: i1$4.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2921
+ GioFormJsonSchemaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormJsonSchemaComponent, deps: [{ token: GioFormlyJsonSchemaService }, { token: i0.ElementRef }, { token: i2$2.FocusMonitor }, { token: i7.NgControl, host: true, optional: true }], target: i0.ɵɵFactoryTarget.Component });
2922
+ GioFormJsonSchemaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioFormJsonSchemaComponent, selector: "gio-form-json-schema", inputs: { jsonSchema: "jsonSchema", options: "options" }, ngImport: i0, template: `<formly-form *ngIf="formGroup" [fields]="fields" [options]="options" [form]="formGroup" [model]="model"></formly-form>`, isInline: true, styles: ["::ng-deep gio-form-json-schema .mat-form-field.mat-form-field-appearance-outline:not(::ng-deep :has(mat-hint),::ng-deep :has(mat-error)){padding-bottom:0}::ng-deep gio-form-json-schema .mat-form-field.mat-form-field-appearance-outline:not(::ng-deep :has(mat-hint),::ng-deep :has(mat-error)) .mat-form-field-wrapper{padding-bottom:0}::ng-deep gio-form-json-schema .mat-form-field.mat-form-field-appearance-fill:not(::ng-deep :has(mat-hint),::ng-deep :has(mat-error)){padding-bottom:0}::ng-deep gio-form-json-schema .mat-form-field.mat-form-field-appearance-fill:not(::ng-deep :has(mat-hint),::ng-deep :has(mat-error)) .mat-form-field-wrapper{margin-bottom:-1.34375em}\n"], components: [{ type: i1$4.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
2874
2923
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormJsonSchemaComponent, decorators: [{
2875
2924
  type: Component,
2876
- args: [{
2877
- selector: 'gio-form-json-schema',
2878
- template: `<formly-form *ngIf="formGroup" [fields]="fields" [options]="options" [form]="formGroup" [model]="model"></formly-form>`,
2879
- changeDetection: ChangeDetectionStrategy.OnPush,
2880
- }]
2881
- }], ctorParameters: function () { return [{ type: i1$3.FormlyJsonschema }, { type: i0.ElementRef }, { type: i2$2.FocusMonitor }, { type: i7.NgControl, decorators: [{
2925
+ args: [{ selector: 'gio-form-json-schema', template: `<formly-form *ngIf="formGroup" [fields]="fields" [options]="options" [form]="formGroup" [model]="model"></formly-form>`, styles: ["::ng-deep gio-form-json-schema .mat-form-field.mat-form-field-appearance-outline:not(::ng-deep :has(mat-hint),::ng-deep :has(mat-error)){padding-bottom:0}::ng-deep gio-form-json-schema .mat-form-field.mat-form-field-appearance-outline:not(::ng-deep :has(mat-hint),::ng-deep :has(mat-error)) .mat-form-field-wrapper{padding-bottom:0}::ng-deep gio-form-json-schema .mat-form-field.mat-form-field-appearance-fill:not(::ng-deep :has(mat-hint),::ng-deep :has(mat-error)){padding-bottom:0}::ng-deep gio-form-json-schema .mat-form-field.mat-form-field-appearance-fill:not(::ng-deep :has(mat-hint),::ng-deep :has(mat-error)) .mat-form-field-wrapper{margin-bottom:-1.34375em}\n"] }]
2926
+ }], ctorParameters: function () { return [{ type: GioFormlyJsonSchemaService }, { type: i0.ElementRef }, { type: i2$2.FocusMonitor }, { type: i7.NgControl, decorators: [{
2882
2927
  type: Host
2883
2928
  }, {
2884
2929
  type: Optional
@@ -2888,6 +2933,146 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
2888
2933
  type: Input
2889
2934
  }] } });
2890
2935
 
2936
+ /*
2937
+ * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
2938
+ *
2939
+ * Licensed under the Apache License, Version 2.0 (the "License");
2940
+ * you may not use this file except in compliance with the License.
2941
+ * You may obtain a copy of the License at
2942
+ *
2943
+ * http://www.apache.org/licenses/LICENSE-2.0
2944
+ *
2945
+ * Unless required by applicable law or agreed to in writing, software
2946
+ * distributed under the License is distributed on an "AS IS" BASIS,
2947
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
2948
+ * See the License for the specific language governing permissions and
2949
+ * limitations under the License.
2950
+ */
2951
+ class GioFormLabelComponent {
2952
+ }
2953
+ GioFormLabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2954
+ GioFormLabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioFormLabelComponent, selector: "gio-form-label", ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
2955
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormLabelComponent, decorators: [{
2956
+ type: Component,
2957
+ args: [{
2958
+ selector: 'gio-form-label',
2959
+ template: `<ng-content></ng-content>`,
2960
+ }]
2961
+ }] });
2962
+ class GioFormPrefixDirective {
2963
+ }
2964
+ GioFormPrefixDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormPrefixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2965
+ GioFormPrefixDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: GioFormPrefixDirective, selector: "[gioFormPrefix]", ngImport: i0 });
2966
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormPrefixDirective, decorators: [{
2967
+ type: Directive,
2968
+ args: [{
2969
+ selector: '[gioFormPrefix]',
2970
+ }]
2971
+ }] });
2972
+ class GioFormSlideToggleDirective {
2973
+ }
2974
+ GioFormSlideToggleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2975
+ GioFormSlideToggleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: GioFormSlideToggleDirective, selector: "[gioFormSlideToggle]", ngImport: i0 });
2976
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleDirective, decorators: [{
2977
+ type: Directive,
2978
+ args: [{
2979
+ selector: '[gioFormSlideToggle]',
2980
+ }]
2981
+ }] });
2982
+
2983
+ /*
2984
+ * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
2985
+ *
2986
+ * Licensed under the Apache License, Version 2.0 (the "License");
2987
+ * you may not use this file except in compliance with the License.
2988
+ * You may obtain a copy of the License at
2989
+ *
2990
+ * http://www.apache.org/licenses/LICENSE-2.0
2991
+ *
2992
+ * Unless required by applicable law or agreed to in writing, software
2993
+ * distributed under the License is distributed on an "AS IS" BASIS,
2994
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
2995
+ * See the License for the specific language governing permissions and
2996
+ * limitations under the License.
2997
+ */
2998
+ class GioFormSlideToggleComponent {
2999
+ constructor() {
3000
+ this.unsubscribe$ = new Subject();
3001
+ this.appearance = 'outline';
3002
+ this.innerMatSlideToggle = null;
3003
+ this.innerFormControlName = null;
3004
+ this.disabled = false;
3005
+ }
3006
+ ngAfterContentInit() {
3007
+ let isDisabled$ = undefined;
3008
+ // Check if disabled is delegated to inner FormControlName
3009
+ if (this.innerFormControlName) {
3010
+ isDisabled$ = this.innerFormControlName.statusChanges?.pipe(map(() => !!this.innerFormControlName?.disabled), startWith(!!this.innerFormControlName.disabled));
3011
+ }
3012
+ // If not, check state of inner MatSlideToggle
3013
+ else if (this.innerMatSlideToggle) {
3014
+ isDisabled$ = this.innerMatSlideToggle.change.pipe(map(event => event.source.disabled), startWith(this.innerMatSlideToggle.disabled));
3015
+ }
3016
+ if (isDisabled$) {
3017
+ isDisabled$.pipe(takeUntil(this.unsubscribe$)).subscribe(disabled => {
3018
+ this.disabled = disabled;
3019
+ });
3020
+ }
3021
+ }
3022
+ ngOnDestroy() {
3023
+ this.unsubscribe$.next();
3024
+ this.unsubscribe$.complete();
3025
+ }
3026
+ }
3027
+ GioFormSlideToggleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3028
+ GioFormSlideToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioFormSlideToggleComponent, selector: "gio-form-slide-toggle", inputs: { appearance: "appearance" }, queries: [{ propertyName: "innerMatSlideToggle", first: true, predicate: MatSlideToggle, descendants: true }, { propertyName: "innerFormControlName", first: true, predicate: NgControl, 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<div\n class=\"form-slide-toggle\"\n [class.appearance-standard]=\"appearance === 'standard'\"\n [class.appearance-fill]=\"appearance === 'fill'\"\n [class.appearance-outline]=\"appearance === 'outline'\"\n>\n <div class=\"form-slide-toggle__icon\">\n <ng-content select=\"[gioFormPrefix]\"></ng-content>\n </div>\n <div class=\"form-slide-toggle__field\">\n <div class=\"form-slide-toggle__field__mat-slide-toggle\">\n <ng-content select=\"[gioFormSlideToggle]\"></ng-content>\n </div>\n <div class=\"form-slide-toggle__field__text\" [class.disabled]=\"disabled\">\n <span class=\"form-slide-toggle__field__text__label-1\">\n <ng-content select=\"gio-form-label\"></ng-content>\n </span>\n <span class=\"form-slide-toggle__field__text__label-2\">\n <ng-content></ng-content>\n </span>\n </div>\n </div>\n</div>\n", styles: [":host{display:inline-block;padding:4px 0}::ng-deep gio-form-slide-toggle div.form-slide-toggle__icon .mat-icon{font-size:150%;line-height:1.125}.form-slide-toggle{display:flex;min-height:60px;align-items:center}.form-slide-toggle.appearance-fill,.form-slide-toggle.appearance-outline{padding:0 .75em}.form-slide-toggle__icon{padding-right:8px}.form-slide-toggle__icon:empty{display:none}.form-slide-toggle__field{display:flex;min-width:180px;flex:1 1 auto;flex-direction:row;align-items:center;justify-content:flex-start}.form-slide-toggle__field__text{display:flex;flex:1 1 100%;flex-direction:column;padding-left:14px}.form-slide-toggle__field__text__label-1{font:600 14px/20px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px}.form-slide-toggle__field__text__label-2{font:400 14px/20px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px}.form-slide-toggle__field__text.disabled{color:#00000061}\n"] });
3029
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleComponent, decorators: [{
3030
+ type: Component,
3031
+ args: [{ selector: 'gio-form-slide-toggle', 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<div\n class=\"form-slide-toggle\"\n [class.appearance-standard]=\"appearance === 'standard'\"\n [class.appearance-fill]=\"appearance === 'fill'\"\n [class.appearance-outline]=\"appearance === 'outline'\"\n>\n <div class=\"form-slide-toggle__icon\">\n <ng-content select=\"[gioFormPrefix]\"></ng-content>\n </div>\n <div class=\"form-slide-toggle__field\">\n <div class=\"form-slide-toggle__field__mat-slide-toggle\">\n <ng-content select=\"[gioFormSlideToggle]\"></ng-content>\n </div>\n <div class=\"form-slide-toggle__field__text\" [class.disabled]=\"disabled\">\n <span class=\"form-slide-toggle__field__text__label-1\">\n <ng-content select=\"gio-form-label\"></ng-content>\n </span>\n <span class=\"form-slide-toggle__field__text__label-2\">\n <ng-content></ng-content>\n </span>\n </div>\n </div>\n</div>\n", styles: [":host{display:inline-block;padding:4px 0}::ng-deep gio-form-slide-toggle div.form-slide-toggle__icon .mat-icon{font-size:150%;line-height:1.125}.form-slide-toggle{display:flex;min-height:60px;align-items:center}.form-slide-toggle.appearance-fill,.form-slide-toggle.appearance-outline{padding:0 .75em}.form-slide-toggle__icon{padding-right:8px}.form-slide-toggle__icon:empty{display:none}.form-slide-toggle__field{display:flex;min-width:180px;flex:1 1 auto;flex-direction:row;align-items:center;justify-content:flex-start}.form-slide-toggle__field__text{display:flex;flex:1 1 100%;flex-direction:column;padding-left:14px}.form-slide-toggle__field__text__label-1{font:600 14px/20px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px}.form-slide-toggle__field__text__label-2{font:400 14px/20px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px}.form-slide-toggle__field__text.disabled{color:#00000061}\n"] }]
3032
+ }], propDecorators: { appearance: [{
3033
+ type: Input
3034
+ }], innerMatSlideToggle: [{
3035
+ type: ContentChild,
3036
+ args: [MatSlideToggle, {
3037
+ static: false,
3038
+ }]
3039
+ }], innerFormControlName: [{
3040
+ type: ContentChild,
3041
+ args: [NgControl, {
3042
+ static: false,
3043
+ }]
3044
+ }] } });
3045
+
3046
+ /*
3047
+ * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
3048
+ *
3049
+ * Licensed under the Apache License, Version 2.0 (the "License");
3050
+ * you may not use this file except in compliance with the License.
3051
+ * You may obtain a copy of the License at
3052
+ *
3053
+ * http://www.apache.org/licenses/LICENSE-2.0
3054
+ *
3055
+ * Unless required by applicable law or agreed to in writing, software
3056
+ * distributed under the License is distributed on an "AS IS" BASIS,
3057
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
3058
+ * See the License for the specific language governing permissions and
3059
+ * limitations under the License.
3060
+ */
3061
+ class GioFormSlideToggleModule {
3062
+ }
3063
+ GioFormSlideToggleModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3064
+ GioFormSlideToggleModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleModule, declarations: [GioFormSlideToggleComponent, GioFormLabelComponent, GioFormPrefixDirective], imports: [CommonModule], exports: [GioFormSlideToggleComponent, GioFormLabelComponent, GioFormPrefixDirective] });
3065
+ GioFormSlideToggleModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleModule, imports: [[CommonModule]] });
3066
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleModule, decorators: [{
3067
+ type: NgModule,
3068
+ args: [{
3069
+ imports: [CommonModule],
3070
+ declarations: [GioFormSlideToggleComponent, GioFormLabelComponent, GioFormPrefixDirective],
3071
+ exports: [GioFormSlideToggleComponent, GioFormLabelComponent, GioFormPrefixDirective],
3072
+ entryComponents: [GioFormSlideToggleComponent],
3073
+ }]
3074
+ }] });
3075
+
2891
3076
  /*
2892
3077
  * Copyright (C) 2023 The Gravitee team (http://gravitee.io)
2893
3078
  *
@@ -2943,24 +3128,28 @@ GioFjsObjectTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
2943
3128
  <div class="wrapper">
2944
3129
  <div class="wrapper__title" *ngIf="to.label">{{ to.label }}</div>
2945
3130
  <p *ngIf="to.description">{{ to.description }}</p>
2946
- <div class="alert alert-danger" role="alert" *ngIf="showError && formControl.errors">
3131
+ <div class="wrapper__error" *ngIf="showError && formControl.errors">
2947
3132
  <formly-validation-message [field]="field"></formly-validation-message>
2948
3133
  </div>
2949
- <formly-field *ngFor="let f of field.fieldGroup" [field]="f"></formly-field>
3134
+ <div class="wrapper__fields">
3135
+ <formly-field *ngFor="let f of field.fieldGroup" class="wrapper__fields__field" [field]="f"></formly-field>
3136
+ </div>
2950
3137
  </div>
2951
- `, isInline: true, styles: [".wrapper{display:flex;flex-direction:column;padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper__title{font:600 16px/24px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px;margin-bottom:16px}.wrapper:empty{display:none}.wrapper formly-field+formly-field{margin-top:8px}\n"], components: [{ 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"] }] });
3138
+ `, isInline: true, styles: [".wrapper{display:flex;flex-direction:column}.wrapper__title{font:600 18px/24px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px;margin-bottom:16px}.wrapper:empty{display:none}.wrapper__error{font:400 12px/16px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;color:#ec4899}.wrapper__fields{padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper__fields:empty{display:none}.wrapper__fields__field:empty{display:none}.wrapper__fields__field+.wrapper__fields__field:not(:empty){display:block;margin-top:8px}\n"], components: [{ 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"] }] });
2952
3139
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFjsObjectTypeComponent, decorators: [{
2953
3140
  type: Component,
2954
3141
  args: [{ selector: 'gio-fjs-object-type', template: `
2955
3142
  <div class="wrapper">
2956
3143
  <div class="wrapper__title" *ngIf="to.label">{{ to.label }}</div>
2957
3144
  <p *ngIf="to.description">{{ to.description }}</p>
2958
- <div class="alert alert-danger" role="alert" *ngIf="showError && formControl.errors">
3145
+ <div class="wrapper__error" *ngIf="showError && formControl.errors">
2959
3146
  <formly-validation-message [field]="field"></formly-validation-message>
2960
3147
  </div>
2961
- <formly-field *ngFor="let f of field.fieldGroup" [field]="f"></formly-field>
3148
+ <div class="wrapper__fields">
3149
+ <formly-field *ngFor="let f of field.fieldGroup" class="wrapper__fields__field" [field]="f"></formly-field>
3150
+ </div>
2962
3151
  </div>
2963
- `, styles: [".wrapper{display:flex;flex-direction:column;padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper__title{font:600 16px/24px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px;margin-bottom:16px}.wrapper:empty{display:none}.wrapper formly-field+formly-field{margin-top:8px}\n"] }]
3152
+ `, styles: [".wrapper{display:flex;flex-direction:column}.wrapper__title{font:600 18px/24px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px;margin-bottom:16px}.wrapper:empty{display:none}.wrapper__error{font:400 12px/16px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;color:#ec4899}.wrapper__fields{padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper__fields:empty{display:none}.wrapper__fields__field:empty{display:none}.wrapper__fields__field+.wrapper__fields__field:not(:empty){display:block;margin-top:8px}\n"] }]
2964
3153
  }] });
2965
3154
 
2966
3155
  /*
@@ -2979,52 +3168,82 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
2979
3168
  * limitations under the License.
2980
3169
  */
2981
3170
  class GioFjsArrayTypeComponent extends FieldArrayType {
3171
+ constructor() {
3172
+ super(...arguments);
3173
+ this.collapse = false;
3174
+ }
2982
3175
  }
2983
3176
  GioFjsArrayTypeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFjsArrayTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2984
3177
  GioFjsArrayTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioFjsArrayTypeComponent, selector: "gio-fjs-array-type", usesInheritance: true, ngImport: i0, template: `
2985
3178
  <div class="wrapper">
2986
- <div class="wrapper__title" *ngIf="to.label">{{ to.label }}</div>
2987
- <p *ngIf="to.description">{{ to.description }}</p>
3179
+ <div class="wrapper__header">
3180
+ <div class="wrapper__header__text">
3181
+ <div class="wrapper__header__text__title" *ngIf="to.label">{{ to.label }}</div>
3182
+ <p *ngIf="to.description">{{ to.description }}</p>
3183
+ </div>
3184
+ <div class="wrapper__header__collapse">
3185
+ <button type="button" mat-icon-button aria-label="Collapse" (click)="collapse = !collapse">
3186
+ <mat-icon [class.collapse-open]="collapse" [class.collapse-close]="!collapse" svgIcon="gio:nav-arrow-down"></mat-icon>
3187
+ </button>
3188
+ </div>
3189
+ </div>
2988
3190
 
2989
- <div class="alert alert-danger" role="alert" *ngIf="showError && formControl.errors">
3191
+ <div class="wrapper__error" *ngIf="showError && formControl.errors">
2990
3192
  <formly-validation-message [field]="field"></formly-validation-message>
2991
3193
  </div>
2992
3194
 
2993
- <div *ngFor="let field of field.fieldGroup; let i = index" class="row">
2994
- <formly-field [field]="field"></formly-field>
2995
- <div>
2996
- <button class="btn btn-danger" type="button" (click)="remove(i)">-</button>
3195
+ <div *ngIf="!collapse" class="wrapper__rows" [class.collapse-open]="collapse" [class.collapse-close]="!collapse">
3196
+ <div *ngFor="let field of field.fieldGroup; let i = index" class="wrapper__rows__row">
3197
+ <formly-field class="wrapper__rows__row__field" [field]="field"></formly-field>
3198
+ <div class="wrapper__rows__row__remove">
3199
+ <button type="button" mat-icon-button aria-label="Remove" (click)="remove(i)">
3200
+ <mat-icon svgIcon="gio:cancel"></mat-icon>
3201
+ </button>
3202
+ </div>
2997
3203
  </div>
2998
- </div>
2999
3204
 
3000
- <div>
3001
- <button class="btn btn-primary" type="button" (click)="add()">+</button>
3205
+ <div>
3206
+ <button type="button" mat-stroked-button aria-label="Add" (click)="add()"><mat-icon svgIcon="gio:plus"></mat-icon> Add</button>
3207
+ </div>
3002
3208
  </div>
3003
3209
  </div>
3004
- `, isInline: true, styles: [".wrapper{padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper__title{font:600 16px/24px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px;margin-bottom:16px}.wrapper:empty{display:none}.wrapper formly-field+formly-field{display:block;margin-top:8px}\n"], components: [{ 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"] }] });
3210
+ `, 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"] }] });
3005
3211
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFjsArrayTypeComponent, decorators: [{
3006
3212
  type: Component,
3007
3213
  args: [{ selector: 'gio-fjs-array-type', template: `
3008
3214
  <div class="wrapper">
3009
- <div class="wrapper__title" *ngIf="to.label">{{ to.label }}</div>
3010
- <p *ngIf="to.description">{{ to.description }}</p>
3215
+ <div class="wrapper__header">
3216
+ <div class="wrapper__header__text">
3217
+ <div class="wrapper__header__text__title" *ngIf="to.label">{{ to.label }}</div>
3218
+ <p *ngIf="to.description">{{ to.description }}</p>
3219
+ </div>
3220
+ <div class="wrapper__header__collapse">
3221
+ <button type="button" mat-icon-button aria-label="Collapse" (click)="collapse = !collapse">
3222
+ <mat-icon [class.collapse-open]="collapse" [class.collapse-close]="!collapse" svgIcon="gio:nav-arrow-down"></mat-icon>
3223
+ </button>
3224
+ </div>
3225
+ </div>
3011
3226
 
3012
- <div class="alert alert-danger" role="alert" *ngIf="showError && formControl.errors">
3227
+ <div class="wrapper__error" *ngIf="showError && formControl.errors">
3013
3228
  <formly-validation-message [field]="field"></formly-validation-message>
3014
3229
  </div>
3015
3230
 
3016
- <div *ngFor="let field of field.fieldGroup; let i = index" class="row">
3017
- <formly-field [field]="field"></formly-field>
3018
- <div>
3019
- <button class="btn btn-danger" type="button" (click)="remove(i)">-</button>
3231
+ <div *ngIf="!collapse" class="wrapper__rows" [class.collapse-open]="collapse" [class.collapse-close]="!collapse">
3232
+ <div *ngFor="let field of field.fieldGroup; let i = index" class="wrapper__rows__row">
3233
+ <formly-field class="wrapper__rows__row__field" [field]="field"></formly-field>
3234
+ <div class="wrapper__rows__row__remove">
3235
+ <button type="button" mat-icon-button aria-label="Remove" (click)="remove(i)">
3236
+ <mat-icon svgIcon="gio:cancel"></mat-icon>
3237
+ </button>
3238
+ </div>
3020
3239
  </div>
3021
- </div>
3022
3240
 
3023
- <div>
3024
- <button class="btn btn-primary" type="button" (click)="add()">+</button>
3241
+ <div>
3242
+ <button type="button" mat-stroked-button aria-label="Add" (click)="add()"><mat-icon svgIcon="gio:plus"></mat-icon> Add</button>
3243
+ </div>
3025
3244
  </div>
3026
3245
  </div>
3027
- `, styles: [".wrapper{padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper__title{font:600 16px/24px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px;margin-bottom:16px}.wrapper:empty{display:none}.wrapper formly-field+formly-field{display:block;margin-top:8px}\n"] }]
3246
+ `, 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"] }]
3028
3247
  }] });
3029
3248
 
3030
3249
  function minItemsValidationMessage(error, field) {
@@ -3113,6 +3332,7 @@ function bannerExtension(field) {
3113
3332
  class GioFjsMultiSchemaTypeComponent extends FieldType {
3114
3333
  ngOnInit() {
3115
3334
  set(this.field, 'fieldGroup[0].props.appearance', 'fill');
3335
+ set(this.field, 'fieldGroup[0].props.label', 'Select option');
3116
3336
  }
3117
3337
  }
3118
3338
  GioFjsMultiSchemaTypeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFjsMultiSchemaTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
@@ -3120,24 +3340,159 @@ GioFjsMultiSchemaTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
3120
3340
  <div class="wrapper">
3121
3341
  <div class="wrapper__title" *ngIf="props.label">{{ props.label }}</div>
3122
3342
  <p *ngIf="props.description">{{ props.description }}</p>
3123
- <div role="alert" *ngIf="showError && formControl.errors">
3343
+ <div class="wrapper__error" *ngIf="showError && formControl.errors">
3124
3344
  <formly-validation-message [field]="field"></formly-validation-message>
3125
3345
  </div>
3126
3346
  <formly-field *ngFor="let f of field.fieldGroup" [field]="f"></formly-field>
3127
3347
  </div>
3128
- `, isInline: true, styles: ["::ng-deep gio-fjs-multi-schema-type div.wrapper formly-field:first-child mat-form-field{padding-bottom:0}.wrapper{padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper__title{font-size:16px;font-weight:500;letter-spacing:.4px;line-height:24px;margin-bottom:4px}.wrapper:empty{display:none}\n"], components: [{ 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"] }] });
3348
+ `, isInline: true, styles: [".wrapper{padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper__title{font-size:16px;font-weight:500;line-height:24px;font:600 14px/20px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px;margin-bottom:4px}.wrapper:empty{display:none}.wrapper__error{font:400 12px/16px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;color:#ec4899}\n"], components: [{ 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"] }] });
3129
3349
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFjsMultiSchemaTypeComponent, decorators: [{
3130
3350
  type: Component,
3131
3351
  args: [{ selector: 'gio-fjs-multi-schema-type', template: `
3132
3352
  <div class="wrapper">
3133
3353
  <div class="wrapper__title" *ngIf="props.label">{{ props.label }}</div>
3134
3354
  <p *ngIf="props.description">{{ props.description }}</p>
3135
- <div role="alert" *ngIf="showError && formControl.errors">
3355
+ <div class="wrapper__error" *ngIf="showError && formControl.errors">
3136
3356
  <formly-validation-message [field]="field"></formly-validation-message>
3137
3357
  </div>
3138
3358
  <formly-field *ngFor="let f of field.fieldGroup" [field]="f"></formly-field>
3139
3359
  </div>
3140
- `, styles: ["::ng-deep gio-fjs-multi-schema-type div.wrapper formly-field:first-child mat-form-field{padding-bottom:0}.wrapper{padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper__title{font-size:16px;font-weight:500;letter-spacing:.4px;line-height:24px;margin-bottom:4px}.wrapper:empty{display:none}\n"] }]
3360
+ `, styles: [".wrapper{padding:8px;border:1px solid #d3d5dc;border-radius:8px}.wrapper__title{font-size:16px;font-weight:500;line-height:24px;font:600 14px/20px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px;margin-bottom:4px}.wrapper:empty{display:none}.wrapper__error{font:400 12px/16px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:normal;color:#ec4899}\n"] }]
3361
+ }] });
3362
+
3363
+ /*
3364
+ * Copyright (C) 2023 The Gravitee team (http://gravitee.io)
3365
+ *
3366
+ * Licensed under the Apache License, Version 2.0 (the "License");
3367
+ * you may not use this file except in compliance with the License.
3368
+ * You may obtain a copy of the License at
3369
+ *
3370
+ * http://www.apache.org/licenses/LICENSE-2.0
3371
+ *
3372
+ * Unless required by applicable law or agreed to in writing, software
3373
+ * distributed under the License is distributed on an "AS IS" BASIS,
3374
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
3375
+ * See the License for the specific language governing permissions and
3376
+ * limitations under the License.
3377
+ */
3378
+ class GioFjsToggleTypeComponent extends FieldType {
3379
+ }
3380
+ GioFjsToggleTypeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFjsToggleTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
3381
+ GioFjsToggleTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioFjsToggleTypeComponent, selector: "gio-fjs-toggle-type", usesInheritance: true, ngImport: i0, template: `
3382
+ <gio-form-slide-toggle>
3383
+ <gio-form-label>{{ props.label }}</gio-form-label>
3384
+ {{ props.description }}
3385
+ <mat-slide-toggle
3386
+ gioFormSlideToggle
3387
+ [id]="id"
3388
+ [formControl]="formControl"
3389
+ [formlyAttributes]="field"
3390
+ [tabIndex]="props.tabindex"
3391
+ ></mat-slide-toggle>
3392
+ </gio-form-slide-toggle>
3393
+ `, 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: 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"] }] });
3394
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFjsToggleTypeComponent, decorators: [{
3395
+ type: Component,
3396
+ args: [{
3397
+ selector: 'gio-fjs-toggle-type',
3398
+ template: `
3399
+ <gio-form-slide-toggle>
3400
+ <gio-form-label>{{ props.label }}</gio-form-label>
3401
+ {{ props.description }}
3402
+ <mat-slide-toggle
3403
+ gioFormSlideToggle
3404
+ [id]="id"
3405
+ [formControl]="formControl"
3406
+ [formlyAttributes]="field"
3407
+ [tabIndex]="props.tabindex"
3408
+ ></mat-slide-toggle>
3409
+ </gio-form-slide-toggle>
3410
+ `,
3411
+ }]
3412
+ }] });
3413
+
3414
+ /*
3415
+ * Copyright (C) 2023 The Gravitee team (http://gravitee.io)
3416
+ *
3417
+ * Licensed under the Apache License, Version 2.0 (the "License");
3418
+ * you may not use this file except in compliance with the License.
3419
+ * You may obtain a copy of the License at
3420
+ *
3421
+ * http://www.apache.org/licenses/LICENSE-2.0
3422
+ *
3423
+ * Unless required by applicable law or agreed to in writing, software
3424
+ * distributed under the License is distributed on an "AS IS" BASIS,
3425
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
3426
+ * See the License for the specific language governing permissions and
3427
+ * limitations under the License.
3428
+ */
3429
+ class GioFjsHeadersTypeComponent extends FieldType {
3430
+ constructor() {
3431
+ super(...arguments);
3432
+ this.defaultOptions = {
3433
+ props: {
3434
+ outputConfig: {
3435
+ keyName: 'name',
3436
+ valueName: 'value',
3437
+ },
3438
+ },
3439
+ };
3440
+ this.collapse = false;
3441
+ }
3442
+ get map() {
3443
+ return (headers) => [...(headers ?? [])].map(header => {
3444
+ return {
3445
+ [this.props.outputConfig.keyName]: header.key,
3446
+ [this.props.outputConfig.valueName]: header.value,
3447
+ };
3448
+ });
3449
+ }
3450
+ }
3451
+ GioFjsHeadersTypeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFjsHeadersTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
3452
+ GioFjsHeadersTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioFjsHeadersTypeComponent, selector: "gio-fjs-headers-type", usesInheritance: true, ngImport: i0, template: `
3453
+ <div class="wrapper">
3454
+ <div class="wrapper__header">
3455
+ <div class="wrapper__header__text">
3456
+ <div class="wrapper__header__text__title" *ngIf="to.label">{{ to.label }}</div>
3457
+ <p *ngIf="to.description">{{ to.description }}</p>
3458
+ </div>
3459
+ <div class="wrapper__header__collapse">
3460
+ <button type="button" mat-icon-button aria-label="Collapse" (click)="collapse = !collapse">
3461
+ <mat-icon [class.collapse-open]="collapse" [class.collapse-close]="!collapse" svgIcon="gio:nav-arrow-down"></mat-icon>
3462
+ </button>
3463
+ </div>
3464
+ </div>
3465
+ <div class="wrapper__error" *ngIf="showError && formControl.errors">
3466
+ <formly-validation-message [field]="field"></formly-validation-message>
3467
+ </div>
3468
+ <div *ngIf="!collapse" class="wrapper__rows" [class.collapse-open]="collapse" [class.collapse-close]="!collapse">
3469
+ <gio-form-headers [adaptOutputFn]="map" [formControl]="formControl"></gio-form-headers>
3470
+ </div>
3471
+ </div>
3472
+ `, isInline: true, styles: [".wrapper{display:flex;flex-direction:column;padding:8px;border:1px solid #d3d5dc;border-radius:8px}.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}\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: GioFormHeadersComponent, selector: "gio-form-headers", inputs: ["adaptOutputFn"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
3473
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFjsHeadersTypeComponent, decorators: [{
3474
+ type: Component,
3475
+ args: [{ selector: 'gio-fjs-headers-type', template: `
3476
+ <div class="wrapper">
3477
+ <div class="wrapper__header">
3478
+ <div class="wrapper__header__text">
3479
+ <div class="wrapper__header__text__title" *ngIf="to.label">{{ to.label }}</div>
3480
+ <p *ngIf="to.description">{{ to.description }}</p>
3481
+ </div>
3482
+ <div class="wrapper__header__collapse">
3483
+ <button type="button" mat-icon-button aria-label="Collapse" (click)="collapse = !collapse">
3484
+ <mat-icon [class.collapse-open]="collapse" [class.collapse-close]="!collapse" svgIcon="gio:nav-arrow-down"></mat-icon>
3485
+ </button>
3486
+ </div>
3487
+ </div>
3488
+ <div class="wrapper__error" *ngIf="showError && formControl.errors">
3489
+ <formly-validation-message [field]="field"></formly-validation-message>
3490
+ </div>
3491
+ <div *ngIf="!collapse" class="wrapper__rows" [class.collapse-open]="collapse" [class.collapse-close]="!collapse">
3492
+ <gio-form-headers [adaptOutputFn]="map" [formControl]="formControl"></gio-form-headers>
3493
+ </div>
3494
+ </div>
3495
+ `, styles: [".wrapper{display:flex;flex-direction:column;padding:8px;border:1px solid #d3d5dc;border-radius:8px}.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}\n"] }]
3141
3496
  }] });
3142
3497
 
3143
3498
  /*
@@ -3163,11 +3518,17 @@ GioFormJsonSchemaModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0",
3163
3518
  GioFjsObjectTypeComponent,
3164
3519
  GioFjsMultiSchemaTypeComponent,
3165
3520
  GioFjsArrayTypeComponent,
3521
+ GioFjsToggleTypeComponent,
3522
+ GioFjsHeadersTypeComponent,
3166
3523
  GioFormFieldWrapperComponent], imports: [CommonModule,
3167
3524
  A11yModule,
3168
3525
  ReactiveFormsModule, i1$4.FormlyModule, FormlyMaterialModule,
3169
- GioIconsModule], exports: [GioFormJsonSchemaComponent, FormlyModule] });
3170
- GioFormJsonSchemaModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormJsonSchemaModule, imports: [[
3526
+ GioIconsModule,
3527
+ GioFormSlideToggleModule,
3528
+ GioFormHeadersModule,
3529
+ MatSlideToggleModule,
3530
+ MatButtonModule], exports: [GioFormJsonSchemaComponent, FormlyModule] });
3531
+ GioFormJsonSchemaModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormJsonSchemaModule, providers: [GioFormlyJsonSchemaService], imports: [[
3171
3532
  CommonModule,
3172
3533
  A11yModule,
3173
3534
  ReactiveFormsModule,
@@ -3193,6 +3554,14 @@ GioFormJsonSchemaModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0",
3193
3554
  { name: 'array', component: GioFjsArrayTypeComponent },
3194
3555
  { name: 'object', component: GioFjsObjectTypeComponent },
3195
3556
  { name: 'multischema', component: GioFjsMultiSchemaTypeComponent },
3557
+ {
3558
+ name: 'toggle',
3559
+ component: GioFjsToggleTypeComponent,
3560
+ },
3561
+ {
3562
+ name: 'gio-headers-array',
3563
+ component: GioFjsHeadersTypeComponent,
3564
+ },
3196
3565
  ],
3197
3566
  extensions: [{ name: 'banner', extension: { onPopulate: bannerExtension } }],
3198
3567
  extras: {
@@ -3201,6 +3570,10 @@ GioFormJsonSchemaModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0",
3201
3570
  }),
3202
3571
  FormlyMaterialModule,
3203
3572
  GioIconsModule,
3573
+ GioFormSlideToggleModule,
3574
+ GioFormHeadersModule,
3575
+ MatSlideToggleModule,
3576
+ MatButtonModule,
3204
3577
  ], FormlyModule] });
3205
3578
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormJsonSchemaModule, decorators: [{
3206
3579
  type: NgModule,
@@ -3211,6 +3584,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
3211
3584
  GioFjsObjectTypeComponent,
3212
3585
  GioFjsMultiSchemaTypeComponent,
3213
3586
  GioFjsArrayTypeComponent,
3587
+ GioFjsToggleTypeComponent,
3588
+ GioFjsHeadersTypeComponent,
3214
3589
  GioFormFieldWrapperComponent,
3215
3590
  ],
3216
3591
  imports: [
@@ -3239,6 +3614,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
3239
3614
  { name: 'array', component: GioFjsArrayTypeComponent },
3240
3615
  { name: 'object', component: GioFjsObjectTypeComponent },
3241
3616
  { name: 'multischema', component: GioFjsMultiSchemaTypeComponent },
3617
+ {
3618
+ name: 'toggle',
3619
+ component: GioFjsToggleTypeComponent,
3620
+ },
3621
+ {
3622
+ name: 'gio-headers-array',
3623
+ component: GioFjsHeadersTypeComponent,
3624
+ },
3242
3625
  ],
3243
3626
  extensions: [{ name: 'banner', extension: { onPopulate: bannerExtension } }],
3244
3627
  extras: {
@@ -3247,123 +3630,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
3247
3630
  }),
3248
3631
  FormlyMaterialModule,
3249
3632
  GioIconsModule,
3633
+ GioFormSlideToggleModule,
3634
+ GioFormHeadersModule,
3635
+ MatSlideToggleModule,
3636
+ MatButtonModule,
3250
3637
  ],
3251
3638
  exports: [GioFormJsonSchemaComponent, FormlyModule],
3639
+ providers: [GioFormlyJsonSchemaService],
3252
3640
  }]
3253
3641
  }] });
3254
3642
 
3255
3643
  /*
3256
- * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
3257
- *
3258
- * Licensed under the Apache License, Version 2.0 (the "License");
3259
- * you may not use this file except in compliance with the License.
3260
- * You may obtain a copy of the License at
3261
- *
3262
- * http://www.apache.org/licenses/LICENSE-2.0
3263
- *
3264
- * Unless required by applicable law or agreed to in writing, software
3265
- * distributed under the License is distributed on an "AS IS" BASIS,
3266
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
3267
- * See the License for the specific language governing permissions and
3268
- * limitations under the License.
3269
- */
3270
- class GioFormSlideToggleComponent {
3271
- constructor() {
3272
- this.unsubscribe$ = new Subject();
3273
- this.appearance = 'outline';
3274
- this.innerMatSlideToggle = null;
3275
- this.innerFormControlName = null;
3276
- this.disabled = false;
3277
- }
3278
- ngAfterContentInit() {
3279
- let isDisabled$ = undefined;
3280
- // Check if disabled is delegated to inner FormControlName
3281
- if (this.innerFormControlName) {
3282
- isDisabled$ = this.innerFormControlName.statusChanges?.pipe(map(() => !!this.innerFormControlName?.disabled), startWith(!!this.innerFormControlName.disabled));
3283
- }
3284
- // If not, check state of inner MatSlideToggle
3285
- else if (this.innerMatSlideToggle) {
3286
- isDisabled$ = this.innerMatSlideToggle.change.pipe(map(event => event.source.disabled), startWith(this.innerMatSlideToggle.disabled));
3287
- }
3288
- if (isDisabled$) {
3289
- isDisabled$.pipe(takeUntil(this.unsubscribe$)).subscribe(disabled => {
3290
- this.disabled = disabled;
3291
- });
3292
- }
3293
- }
3294
- ngOnDestroy() {
3295
- this.unsubscribe$.next();
3296
- this.unsubscribe$.complete();
3297
- }
3298
- }
3299
- GioFormSlideToggleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3300
- GioFormSlideToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioFormSlideToggleComponent, selector: "gio-form-slide-toggle", inputs: { appearance: "appearance" }, queries: [{ propertyName: "innerMatSlideToggle", first: true, predicate: MatSlideToggle, descendants: true }, { propertyName: "innerFormControlName", first: true, predicate: NgControl, 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<div\n class=\"form-slide-toggle\"\n [class.appearance-standard]=\"appearance === 'standard'\"\n [class.appearance-fill]=\"appearance === 'fill'\"\n [class.appearance-outline]=\"appearance === 'outline'\"\n>\n <div class=\"form-slide-toggle__icon\">\n <ng-content select=\"[gioFormPrefix]\"></ng-content>\n </div>\n <div class=\"form-slide-toggle__field\">\n <div class=\"form-slide-toggle__field__mat-slide-toggle\">\n <ng-content select=\"[gioFormSlideToggle]\"></ng-content>\n </div>\n <div class=\"form-slide-toggle__field__text\" [class.disabled]=\"disabled\">\n <span class=\"form-slide-toggle__field__text__label-1\">\n <ng-content select=\"gio-form-label\"></ng-content>\n </span>\n <span class=\"form-slide-toggle__field__text__label-2\">\n <ng-content></ng-content>\n </span>\n </div>\n </div>\n</div>\n", styles: [":host{display:inline-block;padding:4px 0}::ng-deep gio-form-slide-toggle div.form-slide-toggle__icon .mat-icon{font-size:150%;line-height:1.125}.form-slide-toggle{display:flex;min-height:60px;align-items:center}.form-slide-toggle.appearance-fill,.form-slide-toggle.appearance-outline{padding:0 .75em}.form-slide-toggle__icon{padding-right:8px}.form-slide-toggle__icon:empty{display:none}.form-slide-toggle__field{display:flex;min-width:180px;flex:1 1 auto;flex-direction:row;align-items:center;justify-content:flex-start}.form-slide-toggle__field__text{display:flex;flex:1 1 100%;flex-direction:column;padding-left:14px}.form-slide-toggle__field__text__label-1{font:600 14px/20px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px}.form-slide-toggle__field__text__label-2{font:400 14px/20px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px}.form-slide-toggle__field__text.disabled{color:#00000061}\n"] });
3301
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleComponent, decorators: [{
3302
- type: Component,
3303
- args: [{ selector: 'gio-form-slide-toggle', 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<div\n class=\"form-slide-toggle\"\n [class.appearance-standard]=\"appearance === 'standard'\"\n [class.appearance-fill]=\"appearance === 'fill'\"\n [class.appearance-outline]=\"appearance === 'outline'\"\n>\n <div class=\"form-slide-toggle__icon\">\n <ng-content select=\"[gioFormPrefix]\"></ng-content>\n </div>\n <div class=\"form-slide-toggle__field\">\n <div class=\"form-slide-toggle__field__mat-slide-toggle\">\n <ng-content select=\"[gioFormSlideToggle]\"></ng-content>\n </div>\n <div class=\"form-slide-toggle__field__text\" [class.disabled]=\"disabled\">\n <span class=\"form-slide-toggle__field__text__label-1\">\n <ng-content select=\"gio-form-label\"></ng-content>\n </span>\n <span class=\"form-slide-toggle__field__text__label-2\">\n <ng-content></ng-content>\n </span>\n </div>\n </div>\n</div>\n", styles: [":host{display:inline-block;padding:4px 0}::ng-deep gio-form-slide-toggle div.form-slide-toggle__icon .mat-icon{font-size:150%;line-height:1.125}.form-slide-toggle{display:flex;min-height:60px;align-items:center}.form-slide-toggle.appearance-fill,.form-slide-toggle.appearance-outline{padding:0 .75em}.form-slide-toggle__icon{padding-right:8px}.form-slide-toggle__icon:empty{display:none}.form-slide-toggle__field{display:flex;min-width:180px;flex:1 1 auto;flex-direction:row;align-items:center;justify-content:flex-start}.form-slide-toggle__field__text{display:flex;flex:1 1 100%;flex-direction:column;padding-left:14px}.form-slide-toggle__field__text__label-1{font:600 14px/20px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px}.form-slide-toggle__field__text__label-2{font:400 14px/20px Golos UI,Roboto,Helvetica Neue,sans-serif;letter-spacing:.4px}.form-slide-toggle__field__text.disabled{color:#00000061}\n"] }]
3304
- }], propDecorators: { appearance: [{
3305
- type: Input
3306
- }], innerMatSlideToggle: [{
3307
- type: ContentChild,
3308
- args: [MatSlideToggle, {
3309
- static: false,
3310
- }]
3311
- }], innerFormControlName: [{
3312
- type: ContentChild,
3313
- args: [NgControl, {
3314
- static: false,
3315
- }]
3316
- }] } });
3317
-
3318
- /*
3319
- * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
3320
- *
3321
- * Licensed under the Apache License, Version 2.0 (the "License");
3322
- * you may not use this file except in compliance with the License.
3323
- * You may obtain a copy of the License at
3324
- *
3325
- * http://www.apache.org/licenses/LICENSE-2.0
3326
- *
3327
- * Unless required by applicable law or agreed to in writing, software
3328
- * distributed under the License is distributed on an "AS IS" BASIS,
3329
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
3330
- * See the License for the specific language governing permissions and
3331
- * limitations under the License.
3332
- */
3333
- class GioFormLabelComponent {
3334
- }
3335
- GioFormLabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3336
- GioFormLabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GioFormLabelComponent, selector: "gio-form-label", ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
3337
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormLabelComponent, decorators: [{
3338
- type: Component,
3339
- args: [{
3340
- selector: 'gio-form-label',
3341
- template: `<ng-content></ng-content>`,
3342
- }]
3343
- }] });
3344
- class GioFormPrefixDirective {
3345
- }
3346
- GioFormPrefixDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormPrefixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
3347
- GioFormPrefixDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: GioFormPrefixDirective, selector: "[gioFormPrefix]", ngImport: i0 });
3348
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormPrefixDirective, decorators: [{
3349
- type: Directive,
3350
- args: [{
3351
- selector: '[gioFormPrefix]',
3352
- }]
3353
- }] });
3354
- class GioFormSlideToggleDirective {
3355
- }
3356
- GioFormSlideToggleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
3357
- GioFormSlideToggleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: GioFormSlideToggleDirective, selector: "[gioFormSlideToggle]", ngImport: i0 });
3358
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleDirective, decorators: [{
3359
- type: Directive,
3360
- args: [{
3361
- selector: '[gioFormSlideToggle]',
3362
- }]
3363
- }] });
3364
-
3365
- /*
3366
- * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
3644
+ * Copyright (C) 2023 The Gravitee team (http://gravitee.io)
3367
3645
  *
3368
3646
  * Licensed under the Apache License, Version 2.0 (the "License");
3369
3647
  * you may not use this file except in compliance with the License.
@@ -3377,20 +3655,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
3377
3655
  * See the License for the specific language governing permissions and
3378
3656
  * limitations under the License.
3379
3657
  */
3380
- class GioFormSlideToggleModule {
3381
- }
3382
- GioFormSlideToggleModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3383
- GioFormSlideToggleModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleModule, declarations: [GioFormSlideToggleComponent, GioFormLabelComponent, GioFormPrefixDirective], imports: [CommonModule], exports: [GioFormSlideToggleComponent, GioFormLabelComponent, GioFormPrefixDirective] });
3384
- GioFormSlideToggleModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleModule, imports: [[CommonModule]] });
3385
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GioFormSlideToggleModule, decorators: [{
3386
- type: NgModule,
3387
- args: [{
3388
- imports: [CommonModule],
3389
- declarations: [GioFormSlideToggleComponent, GioFormLabelComponent, GioFormPrefixDirective],
3390
- exports: [GioFormSlideToggleComponent, GioFormLabelComponent, GioFormPrefixDirective],
3391
- entryComponents: [GioFormSlideToggleComponent],
3392
- }]
3393
- }] });
3394
3658
 
3395
3659
  /*
3396
3660
  * Copyright (C) 2021 The Gravitee team (http://gravitee.io)