@3kles/kles-material-dynamicforms 16.1.1 → 16.1.2

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.
@@ -19,7 +19,7 @@ let KlesFormArrayComponent = class KlesFormArrayComponent extends KlesFieldAbstr
19
19
  }
20
20
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: KlesFormArrayComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
21
21
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: KlesFormArrayComponent, selector: "kles-array", usesInheritance: true, ngImport: i0, template: `
22
- <div [formGroup]="group">
22
+ <div [formGroup]="group" class="container" [ngClass]="{'container-column': field.direction ==='column'}">
23
23
  <ng-container [formArrayName]="field.name">
24
24
  <div class="group-container" *ngFor="let subGroup of formArray.controls let index = index;"
25
25
  [ngClass]="field.direction === 'column' ? 'column': 'row'">
@@ -31,7 +31,7 @@ let KlesFormArrayComponent = class KlesFormArrayComponent extends KlesFieldAbstr
31
31
  </div>
32
32
  </ng-container>
33
33
  </div>
34
- `, isInline: true, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".group-container{display:flex;flex-direction:inherit}\n", ".row{gap:10px;flex-direction:row}\n", ".column{flex-direction:column;gap:0px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: i3.KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "siblingFields"] }] }); }
34
+ `, isInline: true, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".container{display:flex;flex-direction:inherit}\n", ".container-column{gap:10px}\n", ".group-container{display:flex;flex-direction:inherit}\n", ".row{gap:10px;flex-direction:row;align-items:baseline}\n", ".column{flex-direction:column;gap:0px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: i3.KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "siblingFields"] }] }); }
35
35
  };
36
36
  KlesFormArrayComponent = __decorate([
37
37
  FieldMapper({ type: EnumType.array, factory: (field) => (new KlesFormArray(field).create()) })
@@ -40,7 +40,7 @@ export { KlesFormArrayComponent };
40
40
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: KlesFormArrayComponent, decorators: [{
41
41
  type: Component,
42
42
  args: [{ selector: 'kles-array', template: `
43
- <div [formGroup]="group">
43
+ <div [formGroup]="group" class="container" [ngClass]="{'container-column': field.direction ==='column'}">
44
44
  <ng-container [formArrayName]="field.name">
45
45
  <div class="group-container" *ngFor="let subGroup of formArray.controls let index = index;"
46
46
  [ngClass]="field.direction === 'column' ? 'column': 'row'">
@@ -52,6 +52,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
52
52
  </div>
53
53
  </ng-container>
54
54
  </div>
55
- `, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".group-container{display:flex;flex-direction:inherit}\n", ".row{gap:10px;flex-direction:row}\n", ".column{flex-direction:column;gap:0px}\n"] }]
55
+ `, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".container{display:flex;flex-direction:inherit}\n", ".container-column{gap:10px}\n", ".group-container{display:flex;flex-direction:inherit}\n", ".row{gap:10px;flex-direction:row;align-items:baseline}\n", ".column{flex-direction:column;gap:0px}\n"] }]
56
56
  }] });
57
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXJyYXkuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2xlcy1tYXRlcmlhbC1keW5hbWljZm9ybXMvc3JjL2xpYi9maWVsZHMvYXJyYXkuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFxQixNQUFNLGVBQWUsQ0FBQztBQUU3RCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDMUQsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLG1DQUFtQyxDQUFDO0FBQ2hFLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUM5QyxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxrQkFBa0IsQ0FBQzs7Ozs7QUEwQjlDLElBQU0sc0JBQXNCLEdBQTVCLE1BQU0sc0JBQXVCLFNBQVEsaUJBQWlCO0lBTXpELFFBQVE7UUFDSixxRUFBcUU7UUFDckUsS0FBSyxDQUFDLFFBQVEsRUFBRSxDQUFDO1FBQ2pCLElBQUksQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQXFCLENBQUM7SUFDOUUsQ0FBQztJQUVELFdBQVc7UUFDUCxLQUFLLENBQUMsV0FBVyxFQUFFLENBQUM7SUFDeEIsQ0FBQzs4R0FkUSxzQkFBc0I7a0dBQXRCLHNCQUFzQix5RUFyQnJCOzs7Ozs7Ozs7Ozs7O0NBYWI7O0FBUVksc0JBQXNCO0lBeEJsQyxXQUFXLENBQUMsRUFBRSxJQUFJLEVBQUUsUUFBUSxDQUFDLEtBQUssRUFBRSxPQUFPLEVBQUUsQ0FBQyxLQUFLLEVBQUUsRUFBRSxDQUFDLENBQUMsSUFBSSxhQUFhLENBQUMsS0FBSyxDQUFDLENBQUMsTUFBTSxFQUFFLENBQUMsRUFBRSxDQUFDO0dBd0JsRixzQkFBc0IsQ0FlbEM7U0FmWSxzQkFBc0I7MkZBQXRCLHNCQUFzQjtrQkF2QmxDLFNBQVM7K0JBQ0ksWUFBWSxZQUNaOzs7Ozs7Ozs7Ozs7O0NBYWIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uRGVzdHJveSwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBVbnR5cGVkRm9ybUFycmF5IH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgS2xlc0Zvcm1BcnJheSB9IGZyb20gJy4uL2NvbnRyb2xzL2FycmF5LmNvbnRyb2wnO1xuaW1wb3J0IHsgRmllbGRNYXBwZXIgfSBmcm9tICcuLi9kZWNvcmF0b3JzL2NvbXBvbmVudC5kZWNvcmF0b3InO1xuaW1wb3J0IHsgRW51bVR5cGUgfSBmcm9tICcuLi9lbnVtcy90eXBlLmVudW0nO1xuaW1wb3J0IHsgS2xlc0ZpZWxkQWJzdHJhY3QgfSBmcm9tICcuL2ZpZWxkLmFic3RyYWN0JztcblxuQEZpZWxkTWFwcGVyKHsgdHlwZTogRW51bVR5cGUuYXJyYXksIGZhY3Rvcnk6IChmaWVsZCkgPT4gKG5ldyBLbGVzRm9ybUFycmF5KGZpZWxkKS5jcmVhdGUoKSkgfSlcbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAna2xlcy1hcnJheScsXG4gICAgdGVtcGxhdGU6IGBcbiAgICA8ZGl2IFtmb3JtR3JvdXBdPVwiZ3JvdXBcIj5cbiAgICAgICAgPG5nLWNvbnRhaW5lciBbZm9ybUFycmF5TmFtZV09XCJmaWVsZC5uYW1lXCI+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwiZ3JvdXAtY29udGFpbmVyXCIgKm5nRm9yPVwibGV0IHN1Ykdyb3VwIG9mIGZvcm1BcnJheS5jb250cm9scyBsZXQgaW5kZXggPSBpbmRleDtcIlxuICAgICAgICAgICAgW25nQ2xhc3NdPVwiZmllbGQuZGlyZWN0aW9uID09PSAnY29sdW1uJyA/ICdjb2x1bW4nOiAncm93J1wiPlxuICAgICAgICAgICAgICAgIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IHN1YmZpZWxkIG9mIGZpZWxkLmNvbGxlY3Rpb25zO1wiPlxuICAgICAgICAgICAgICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwic3ViZmllbGQudmlzaWJsZSAhPT0gZmFsc2VcIlxuICAgICAgICAgICAgICAgICAgICAgICAga2xlc0R5bmFtaWNGaWVsZCBbZmllbGRdPVwic3ViZmllbGRcIiBbZ3JvdXBdPVwic3ViR3JvdXBcIiBbc2libGluZ0ZpZWxkc109XCJmaWVsZC5jb2xsZWN0aW9uc1wiPlxuICAgICAgICAgICAgICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICA8L2Rpdj5cbmAsXG4gICAgc3R5bGVzOiBbJ21hdC1mb3JtLWZpZWxkIHt3aWR0aDogY2FsYygxMDAlKX0nLFxuICAgICAgICAnOmhvc3QgeyBkaXNwbGF5OmZsZXg7IGZsZXgtZGlyZWN0aW9uOiBpbmhlcml0fScsXG4gICAgICAgICcuZ3JvdXAtY29udGFpbmVyIHtkaXNwbGF5OmZsZXg7IGZsZXgtZGlyZWN0aW9uOiBpbmhlcml0fScsXG4gICAgICAgICcucm93IHsgZ2FwOiAxMHB4OyBmbGV4LWRpcmVjdGlvbjogcm93IH0nLFxuICAgICAgICAnLmNvbHVtbiB7IGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47IGdhcDogMHB4fSdcbiAgICBdXG59KVxuZXhwb3J0IGNsYXNzIEtsZXNGb3JtQXJyYXlDb21wb25lbnQgZXh0ZW5kcyBLbGVzRmllbGRBYnN0cmFjdCBpbXBsZW1lbnRzIE9uSW5pdCwgT25EZXN0cm95IHtcblxuICAgIC8vIHN1Ykdyb3VwOiBGb3JtR3JvdXBcblxuICAgIGZvcm1BcnJheTogVW50eXBlZEZvcm1BcnJheTtcblxuICAgIG5nT25Jbml0KCkge1xuICAgICAgICAvLyB0aGlzLnN1Ykdyb3VwID0gdGhpcy5ncm91cC5jb250cm9sc1t0aGlzLmZpZWxkLm5hbWVdIGFzIEZvcm1Hcm91cDtcbiAgICAgICAgc3VwZXIubmdPbkluaXQoKTtcbiAgICAgICAgdGhpcy5mb3JtQXJyYXkgPSB0aGlzLmdyb3VwLmNvbnRyb2xzW3RoaXMuZmllbGQubmFtZV0gYXMgVW50eXBlZEZvcm1BcnJheTtcbiAgICB9XG5cbiAgICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICAgICAgc3VwZXIubmdPbkRlc3Ryb3koKTtcbiAgICB9XG59XG4iXX0=
57
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXJyYXkuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2xlcy1tYXRlcmlhbC1keW5hbWljZm9ybXMvc3JjL2xpYi9maWVsZHMvYXJyYXkuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFxQixNQUFNLGVBQWUsQ0FBQztBQUU3RCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDMUQsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLG1DQUFtQyxDQUFDO0FBQ2hFLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUM5QyxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxrQkFBa0IsQ0FBQzs7Ozs7QUE0QjlDLElBQU0sc0JBQXNCLEdBQTVCLE1BQU0sc0JBQXVCLFNBQVEsaUJBQWlCO0lBTXpELFFBQVE7UUFDSixxRUFBcUU7UUFDckUsS0FBSyxDQUFDLFFBQVEsRUFBRSxDQUFDO1FBQ2pCLElBQUksQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQXFCLENBQUM7SUFDOUUsQ0FBQztJQUVELFdBQVc7UUFDUCxLQUFLLENBQUMsV0FBVyxFQUFFLENBQUM7SUFDeEIsQ0FBQzs4R0FkUSxzQkFBc0I7a0dBQXRCLHNCQUFzQix5RUF2QnJCOzs7Ozs7Ozs7Ozs7O0NBYWI7O0FBVVksc0JBQXNCO0lBMUJsQyxXQUFXLENBQUMsRUFBRSxJQUFJLEVBQUUsUUFBUSxDQUFDLEtBQUssRUFBRSxPQUFPLEVBQUUsQ0FBQyxLQUFLLEVBQUUsRUFBRSxDQUFDLENBQUMsSUFBSSxhQUFhLENBQUMsS0FBSyxDQUFDLENBQUMsTUFBTSxFQUFFLENBQUMsRUFBRSxDQUFDO0dBMEJsRixzQkFBc0IsQ0FlbEM7U0FmWSxzQkFBc0I7MkZBQXRCLHNCQUFzQjtrQkF6QmxDLFNBQVM7K0JBQ0ksWUFBWSxZQUNaOzs7Ozs7Ozs7Ozs7O0NBYWIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uRGVzdHJveSwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBVbnR5cGVkRm9ybUFycmF5IH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgS2xlc0Zvcm1BcnJheSB9IGZyb20gJy4uL2NvbnRyb2xzL2FycmF5LmNvbnRyb2wnO1xuaW1wb3J0IHsgRmllbGRNYXBwZXIgfSBmcm9tICcuLi9kZWNvcmF0b3JzL2NvbXBvbmVudC5kZWNvcmF0b3InO1xuaW1wb3J0IHsgRW51bVR5cGUgfSBmcm9tICcuLi9lbnVtcy90eXBlLmVudW0nO1xuaW1wb3J0IHsgS2xlc0ZpZWxkQWJzdHJhY3QgfSBmcm9tICcuL2ZpZWxkLmFic3RyYWN0JztcblxuQEZpZWxkTWFwcGVyKHsgdHlwZTogRW51bVR5cGUuYXJyYXksIGZhY3Rvcnk6IChmaWVsZCkgPT4gKG5ldyBLbGVzRm9ybUFycmF5KGZpZWxkKS5jcmVhdGUoKSkgfSlcbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAna2xlcy1hcnJheScsXG4gICAgdGVtcGxhdGU6IGBcbiAgICA8ZGl2IFtmb3JtR3JvdXBdPVwiZ3JvdXBcIiBjbGFzcz1cImNvbnRhaW5lclwiIFtuZ0NsYXNzXT1cInsnY29udGFpbmVyLWNvbHVtbic6IGZpZWxkLmRpcmVjdGlvbiA9PT0nY29sdW1uJ31cIj5cbiAgICAgICAgPG5nLWNvbnRhaW5lciBbZm9ybUFycmF5TmFtZV09XCJmaWVsZC5uYW1lXCI+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwiZ3JvdXAtY29udGFpbmVyXCIgKm5nRm9yPVwibGV0IHN1Ykdyb3VwIG9mIGZvcm1BcnJheS5jb250cm9scyBsZXQgaW5kZXggPSBpbmRleDtcIlxuICAgICAgICAgICAgW25nQ2xhc3NdPVwiZmllbGQuZGlyZWN0aW9uID09PSAnY29sdW1uJyA/ICdjb2x1bW4nOiAncm93J1wiPlxuICAgICAgICAgICAgICAgIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IHN1YmZpZWxkIG9mIGZpZWxkLmNvbGxlY3Rpb25zO1wiPlxuICAgICAgICAgICAgICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwic3ViZmllbGQudmlzaWJsZSAhPT0gZmFsc2VcIlxuICAgICAgICAgICAgICAgICAgICAgICAga2xlc0R5bmFtaWNGaWVsZCBbZmllbGRdPVwic3ViZmllbGRcIiBbZ3JvdXBdPVwic3ViR3JvdXBcIiBbc2libGluZ0ZpZWxkc109XCJmaWVsZC5jb2xsZWN0aW9uc1wiPlxuICAgICAgICAgICAgICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICA8L2Rpdj5cbmAsXG4gICAgc3R5bGVzOiBbJ21hdC1mb3JtLWZpZWxkIHt3aWR0aDogY2FsYygxMDAlKX0nLFxuICAgICAgICAnOmhvc3QgeyBkaXNwbGF5OmZsZXg7IGZsZXgtZGlyZWN0aW9uOiBpbmhlcml0fScsXG4gICAgICAgICcuY29udGFpbmVyIHsgZGlzcGxheTogZmxleDsgZmxleC1kaXJlY3Rpb246IGluaGVyaXR9JyxcbiAgICAgICAgJy5jb250YWluZXItY29sdW1uIHtnYXA6IDEwcHh9JyxcbiAgICAgICAgJy5ncm91cC1jb250YWluZXIge2Rpc3BsYXk6ZmxleDsgZmxleC1kaXJlY3Rpb246IGluaGVyaXR9JyxcbiAgICAgICAgJy5yb3cgeyBnYXA6IDEwcHg7IGZsZXgtZGlyZWN0aW9uOiByb3c7IGFsaWduLWl0ZW1zOiBiYXNlbGluZSB9JyxcbiAgICAgICAgJy5jb2x1bW4geyBmbGV4LWRpcmVjdGlvbjogY29sdW1uOyBnYXA6IDBweH0nXG4gICAgXVxufSlcbmV4cG9ydCBjbGFzcyBLbGVzRm9ybUFycmF5Q29tcG9uZW50IGV4dGVuZHMgS2xlc0ZpZWxkQWJzdHJhY3QgaW1wbGVtZW50cyBPbkluaXQsIE9uRGVzdHJveSB7XG5cbiAgICAvLyBzdWJHcm91cDogRm9ybUdyb3VwXG5cbiAgICBmb3JtQXJyYXk6IFVudHlwZWRGb3JtQXJyYXk7XG5cbiAgICBuZ09uSW5pdCgpIHtcbiAgICAgICAgLy8gdGhpcy5zdWJHcm91cCA9IHRoaXMuZ3JvdXAuY29udHJvbHNbdGhpcy5maWVsZC5uYW1lXSBhcyBGb3JtR3JvdXA7XG4gICAgICAgIHN1cGVyLm5nT25Jbml0KCk7XG4gICAgICAgIHRoaXMuZm9ybUFycmF5ID0gdGhpcy5ncm91cC5jb250cm9sc1t0aGlzLmZpZWxkLm5hbWVdIGFzIFVudHlwZWRGb3JtQXJyYXk7XG4gICAgfVxuXG4gICAgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgICAgIHN1cGVyLm5nT25EZXN0cm95KCk7XG4gICAgfVxufVxuIl19
@@ -19,14 +19,16 @@ let KlesFormGroupComponent = class KlesFormGroupComponent extends KlesFieldAbstr
19
19
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: KlesFormGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
20
20
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: KlesFormGroupComponent, selector: "kles-group", usesInheritance: true, ngImport: i0, template: `
21
21
  <div [formGroup]="group" class="group-container">
22
- <div [formGroupName]="field.name" class="group-container" [style.flex-direction]="field.direction || 'inherit'" [ngClass]="field.ngClass">
22
+ <div [formGroupName]="field.name" class="group-container"
23
+ [ngClass]="{'row': field.direction ==='row'}"
24
+ [style.flex-direction]="field.direction || 'inherit'" [ngClass]="field.direction ==='row' ? (field.ngClass+' '+ 'row'): field.ngClass">
23
25
  <ng-container *ngFor="let subfield of field.collections;">
24
26
  <ng-container *ngIf="subfield.visible !== false" klesDynamicField [field]="subfield" [group]="subGroup" [siblingFields]="field.collections">
25
27
  </ng-container>
26
28
  </ng-container>
27
29
  </div>
28
30
  </div>
29
- `, isInline: true, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".group-container{display:flex;flex-direction:inherit;width:inherit}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3.KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "siblingFields"] }] }); }
31
+ `, isInline: true, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".row{align-items:baseline}\n", ".group-container{display:flex;flex-direction:inherit;width:inherit}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3.KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "siblingFields"] }] }); }
30
32
  };
31
33
  KlesFormGroupComponent = __decorate([
32
34
  FieldMapper({ type: EnumType.group, factory: (field) => (new KlesFormGroup(field).create()) })
@@ -36,13 +38,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
36
38
  type: Component,
37
39
  args: [{ selector: 'kles-group', template: `
38
40
  <div [formGroup]="group" class="group-container">
39
- <div [formGroupName]="field.name" class="group-container" [style.flex-direction]="field.direction || 'inherit'" [ngClass]="field.ngClass">
41
+ <div [formGroupName]="field.name" class="group-container"
42
+ [ngClass]="{'row': field.direction ==='row'}"
43
+ [style.flex-direction]="field.direction || 'inherit'" [ngClass]="field.direction ==='row' ? (field.ngClass+' '+ 'row'): field.ngClass">
40
44
  <ng-container *ngFor="let subfield of field.collections;">
41
45
  <ng-container *ngIf="subfield.visible !== false" klesDynamicField [field]="subfield" [group]="subGroup" [siblingFields]="field.collections">
42
46
  </ng-container>
43
47
  </ng-container>
44
48
  </div>
45
49
  </div>
46
- `, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".group-container{display:flex;flex-direction:inherit;width:inherit}\n"] }]
50
+ `, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".row{align-items:baseline}\n", ".group-container{display:flex;flex-direction:inherit;width:inherit}\n"] }]
47
51
  }] });
48
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JvdXAuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2xlcy1tYXRlcmlhbC1keW5hbWljZm9ybXMvc3JjL2xpYi9maWVsZHMvZ3JvdXAuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFxQixNQUFNLGVBQWUsQ0FBQztBQUU3RCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDMUQsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLG1DQUFtQyxDQUFDO0FBQ2hFLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUM5QyxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxrQkFBa0IsQ0FBQzs7Ozs7QUFzQjlDLElBQU0sc0JBQXNCLEdBQTVCLE1BQU0sc0JBQXVCLFNBQVEsaUJBQWlCO0lBSXpELFFBQVE7UUFDSixJQUFJLENBQUMsUUFBUSxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFxQixDQUFDO1FBQ3pFLEtBQUssQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUNyQixDQUFDO0lBRUQsV0FBVztRQUNQLEtBQUssQ0FBQyxXQUFXLEVBQUUsQ0FBQztJQUN4QixDQUFDOzhHQVhRLHNCQUFzQjtrR0FBdEIsc0JBQXNCLHlFQWpCckI7Ozs7Ozs7OztDQVNiOztBQVFZLHNCQUFzQjtJQXBCbEMsV0FBVyxDQUFDLEVBQUUsSUFBSSxFQUFFLFFBQVEsQ0FBQyxLQUFLLEVBQUUsT0FBTyxFQUFFLENBQUMsS0FBSyxFQUFFLEVBQUUsQ0FBQyxDQUFDLElBQUksYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDLE1BQU0sRUFBRSxDQUFDLEVBQUUsQ0FBQztHQW9CbEYsc0JBQXNCLENBWWxDO1NBWlksc0JBQXNCOzJGQUF0QixzQkFBc0I7a0JBbkJsQyxTQUFTOytCQUNJLFlBQVksWUFDWjs7Ozs7Ozs7O0NBU2IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uRGVzdHJveSwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBVbnR5cGVkRm9ybUdyb3VwIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgS2xlc0Zvcm1Hcm91cCB9IGZyb20gJy4uL2NvbnRyb2xzL2dyb3VwLmNvbnRyb2wnO1xuaW1wb3J0IHsgRmllbGRNYXBwZXIgfSBmcm9tICcuLi9kZWNvcmF0b3JzL2NvbXBvbmVudC5kZWNvcmF0b3InO1xuaW1wb3J0IHsgRW51bVR5cGUgfSBmcm9tICcuLi9lbnVtcy90eXBlLmVudW0nO1xuaW1wb3J0IHsgS2xlc0ZpZWxkQWJzdHJhY3QgfSBmcm9tICcuL2ZpZWxkLmFic3RyYWN0JztcblxuQEZpZWxkTWFwcGVyKHsgdHlwZTogRW51bVR5cGUuZ3JvdXAsIGZhY3Rvcnk6IChmaWVsZCkgPT4gKG5ldyBLbGVzRm9ybUdyb3VwKGZpZWxkKS5jcmVhdGUoKSkgfSlcbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAna2xlcy1ncm91cCcsXG4gICAgdGVtcGxhdGU6IGBcbiAgICA8ZGl2IFtmb3JtR3JvdXBdPVwiZ3JvdXBcIiBjbGFzcz1cImdyb3VwLWNvbnRhaW5lclwiPlxuICAgICAgICA8ZGl2IFtmb3JtR3JvdXBOYW1lXT1cImZpZWxkLm5hbWVcIiBjbGFzcz1cImdyb3VwLWNvbnRhaW5lclwiIFtzdHlsZS5mbGV4LWRpcmVjdGlvbl09XCJmaWVsZC5kaXJlY3Rpb24gfHwgJ2luaGVyaXQnXCIgW25nQ2xhc3NdPVwiZmllbGQubmdDbGFzc1wiPlxuICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdGb3I9XCJsZXQgc3ViZmllbGQgb2YgZmllbGQuY29sbGVjdGlvbnM7XCI+XG4gICAgICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cInN1YmZpZWxkLnZpc2libGUgIT09IGZhbHNlXCIga2xlc0R5bmFtaWNGaWVsZCBbZmllbGRdPVwic3ViZmllbGRcIiBbZ3JvdXBdPVwic3ViR3JvdXBcIiBbc2libGluZ0ZpZWxkc109XCJmaWVsZC5jb2xsZWN0aW9uc1wiPlxuICAgICAgICAgICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuYCxcbiAgICBzdHlsZXM6IFsnbWF0LWZvcm0tZmllbGQge3dpZHRoOiBjYWxjKDEwMCUpfScsXG4gICAgICAgICc6aG9zdCB7IGRpc3BsYXk6ZmxleDsgZmxleC1kaXJlY3Rpb246IGluaGVyaXR9JyxcbiAgICAgICAgLy8gJy5yb3cgeyBnYXA6MTBweDt9JyxcbiAgICAgICAgLy8gJy5ncm91cC1jb250YWluZXIge2Rpc3BsYXk6ZmxleDsgZmxleC1kaXJlY3Rpb246IGluaGVyaXQ7IHdpZHRoOiBpbmhlcml0OyBmbGV4LXdyYXA6IHdyYXB9J1xuICAgICAgICAnLmdyb3VwLWNvbnRhaW5lciB7ZGlzcGxheTpmbGV4OyBmbGV4LWRpcmVjdGlvbjogaW5oZXJpdDsgd2lkdGg6IGluaGVyaXQ7fSdcbiAgICBdXG59KVxuZXhwb3J0IGNsYXNzIEtsZXNGb3JtR3JvdXBDb21wb25lbnQgZXh0ZW5kcyBLbGVzRmllbGRBYnN0cmFjdCBpbXBsZW1lbnRzIE9uSW5pdCwgT25EZXN0cm95IHtcblxuICAgIHN1Ykdyb3VwOiBVbnR5cGVkRm9ybUdyb3VwO1xuXG4gICAgbmdPbkluaXQoKSB7XG4gICAgICAgIHRoaXMuc3ViR3JvdXAgPSB0aGlzLmdyb3VwLmNvbnRyb2xzW3RoaXMuZmllbGQubmFtZV0gYXMgVW50eXBlZEZvcm1Hcm91cDtcbiAgICAgICAgc3VwZXIubmdPbkluaXQoKTtcbiAgICB9XG5cbiAgICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICAgICAgc3VwZXIubmdPbkRlc3Ryb3koKTtcbiAgICB9XG59XG4iXX0=
52
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JvdXAuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2xlcy1tYXRlcmlhbC1keW5hbWljZm9ybXMvc3JjL2xpYi9maWVsZHMvZ3JvdXAuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFxQixNQUFNLGVBQWUsQ0FBQztBQUU3RCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDMUQsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLG1DQUFtQyxDQUFDO0FBQ2hFLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUM5QyxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxrQkFBa0IsQ0FBQzs7Ozs7QUF3QjlDLElBQU0sc0JBQXNCLEdBQTVCLE1BQU0sc0JBQXVCLFNBQVEsaUJBQWlCO0lBSXpELFFBQVE7UUFDSixJQUFJLENBQUMsUUFBUSxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFxQixDQUFDO1FBQ3pFLEtBQUssQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUNyQixDQUFDO0lBRUQsV0FBVztRQUNQLEtBQUssQ0FBQyxXQUFXLEVBQUUsQ0FBQztJQUN4QixDQUFDOzhHQVhRLHNCQUFzQjtrR0FBdEIsc0JBQXNCLHlFQW5CckI7Ozs7Ozs7Ozs7O0NBV2I7O0FBUVksc0JBQXNCO0lBdEJsQyxXQUFXLENBQUMsRUFBRSxJQUFJLEVBQUUsUUFBUSxDQUFDLEtBQUssRUFBRSxPQUFPLEVBQUUsQ0FBQyxLQUFLLEVBQUUsRUFBRSxDQUFDLENBQUMsSUFBSSxhQUFhLENBQUMsS0FBSyxDQUFDLENBQUMsTUFBTSxFQUFFLENBQUMsRUFBRSxDQUFDO0dBc0JsRixzQkFBc0IsQ0FZbEM7U0FaWSxzQkFBc0I7MkZBQXRCLHNCQUFzQjtrQkFyQmxDLFNBQVM7K0JBQ0ksWUFBWSxZQUNaOzs7Ozs7Ozs7OztDQVdiIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBPbkRlc3Ryb3ksIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgVW50eXBlZEZvcm1Hcm91cCB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7IEtsZXNGb3JtR3JvdXAgfSBmcm9tICcuLi9jb250cm9scy9ncm91cC5jb250cm9sJztcbmltcG9ydCB7IEZpZWxkTWFwcGVyIH0gZnJvbSAnLi4vZGVjb3JhdG9ycy9jb21wb25lbnQuZGVjb3JhdG9yJztcbmltcG9ydCB7IEVudW1UeXBlIH0gZnJvbSAnLi4vZW51bXMvdHlwZS5lbnVtJztcbmltcG9ydCB7IEtsZXNGaWVsZEFic3RyYWN0IH0gZnJvbSAnLi9maWVsZC5hYnN0cmFjdCc7XG5cbkBGaWVsZE1hcHBlcih7IHR5cGU6IEVudW1UeXBlLmdyb3VwLCBmYWN0b3J5OiAoZmllbGQpID0+IChuZXcgS2xlc0Zvcm1Hcm91cChmaWVsZCkuY3JlYXRlKCkpIH0pXG5AQ29tcG9uZW50KHtcbiAgICBzZWxlY3RvcjogJ2tsZXMtZ3JvdXAnLFxuICAgIHRlbXBsYXRlOiBgXG4gICAgPGRpdiBbZm9ybUdyb3VwXT1cImdyb3VwXCIgY2xhc3M9XCJncm91cC1jb250YWluZXJcIj5cbiAgICAgICAgPGRpdiBbZm9ybUdyb3VwTmFtZV09XCJmaWVsZC5uYW1lXCIgY2xhc3M9XCJncm91cC1jb250YWluZXJcIiBcbiAgICAgICAgW25nQ2xhc3NdPVwieydyb3cnOiBmaWVsZC5kaXJlY3Rpb24gPT09J3Jvdyd9XCJcbiAgICAgICAgW3N0eWxlLmZsZXgtZGlyZWN0aW9uXT1cImZpZWxkLmRpcmVjdGlvbiB8fCAnaW5oZXJpdCdcIiBbbmdDbGFzc109XCJmaWVsZC5kaXJlY3Rpb24gPT09J3JvdycgPyAoZmllbGQubmdDbGFzcysnICcrICdyb3cnKTogZmllbGQubmdDbGFzc1wiPlxuICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdGb3I9XCJsZXQgc3ViZmllbGQgb2YgZmllbGQuY29sbGVjdGlvbnM7XCI+XG4gICAgICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cInN1YmZpZWxkLnZpc2libGUgIT09IGZhbHNlXCIga2xlc0R5bmFtaWNGaWVsZCBbZmllbGRdPVwic3ViZmllbGRcIiBbZ3JvdXBdPVwic3ViR3JvdXBcIiBbc2libGluZ0ZpZWxkc109XCJmaWVsZC5jb2xsZWN0aW9uc1wiPlxuICAgICAgICAgICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuYCxcbiAgICBzdHlsZXM6IFsnbWF0LWZvcm0tZmllbGQge3dpZHRoOiBjYWxjKDEwMCUpfScsXG4gICAgICAgICc6aG9zdCB7IGRpc3BsYXk6ZmxleDsgZmxleC1kaXJlY3Rpb246IGluaGVyaXR9JyxcbiAgICAgICAgJy5yb3cgeyBhbGlnbi1pdGVtczogYmFzZWxpbmUgfScsXG4gICAgICAgIC8vICcuZ3JvdXAtY29udGFpbmVyIHtkaXNwbGF5OmZsZXg7IGZsZXgtZGlyZWN0aW9uOiBpbmhlcml0OyB3aWR0aDogaW5oZXJpdDsgZmxleC13cmFwOiB3cmFwfSdcbiAgICAgICAgJy5ncm91cC1jb250YWluZXIge2Rpc3BsYXk6ZmxleDsgZmxleC1kaXJlY3Rpb246IGluaGVyaXQ7IHdpZHRoOiBpbmhlcml0O30nXG4gICAgXVxufSlcbmV4cG9ydCBjbGFzcyBLbGVzRm9ybUdyb3VwQ29tcG9uZW50IGV4dGVuZHMgS2xlc0ZpZWxkQWJzdHJhY3QgaW1wbGVtZW50cyBPbkluaXQsIE9uRGVzdHJveSB7XG5cbiAgICBzdWJHcm91cDogVW50eXBlZEZvcm1Hcm91cDtcblxuICAgIG5nT25Jbml0KCkge1xuICAgICAgICB0aGlzLnN1Ykdyb3VwID0gdGhpcy5ncm91cC5jb250cm9sc1t0aGlzLmZpZWxkLm5hbWVdIGFzIFVudHlwZWRGb3JtR3JvdXA7XG4gICAgICAgIHN1cGVyLm5nT25Jbml0KCk7XG4gICAgfVxuXG4gICAgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgICAgIHN1cGVyLm5nT25EZXN0cm95KCk7XG4gICAgfVxufVxuIl19
@@ -2282,14 +2282,16 @@ let KlesFormGroupComponent = class KlesFormGroupComponent extends KlesFieldAbstr
2282
2282
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: KlesFormGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2283
2283
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: KlesFormGroupComponent, selector: "kles-group", usesInheritance: true, ngImport: i0, template: `
2284
2284
  <div [formGroup]="group" class="group-container">
2285
- <div [formGroupName]="field.name" class="group-container" [style.flex-direction]="field.direction || 'inherit'" [ngClass]="field.ngClass">
2285
+ <div [formGroupName]="field.name" class="group-container"
2286
+ [ngClass]="{'row': field.direction ==='row'}"
2287
+ [style.flex-direction]="field.direction || 'inherit'" [ngClass]="field.direction ==='row' ? (field.ngClass+' '+ 'row'): field.ngClass">
2286
2288
  <ng-container *ngFor="let subfield of field.collections;">
2287
2289
  <ng-container *ngIf="subfield.visible !== false" klesDynamicField [field]="subfield" [group]="subGroup" [siblingFields]="field.collections">
2288
2290
  </ng-container>
2289
2291
  </ng-container>
2290
2292
  </div>
2291
2293
  </div>
2292
- `, isInline: true, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".group-container{display:flex;flex-direction:inherit;width:inherit}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "siblingFields"] }] }); }
2294
+ `, isInline: true, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".row{align-items:baseline}\n", ".group-container{display:flex;flex-direction:inherit;width:inherit}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "siblingFields"] }] }); }
2293
2295
  };
2294
2296
  KlesFormGroupComponent = __decorate([
2295
2297
  FieldMapper({ type: EnumType.group, factory: (field) => (new KlesFormGroup(field).create()) })
@@ -2298,14 +2300,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
2298
2300
  type: Component,
2299
2301
  args: [{ selector: 'kles-group', template: `
2300
2302
  <div [formGroup]="group" class="group-container">
2301
- <div [formGroupName]="field.name" class="group-container" [style.flex-direction]="field.direction || 'inherit'" [ngClass]="field.ngClass">
2303
+ <div [formGroupName]="field.name" class="group-container"
2304
+ [ngClass]="{'row': field.direction ==='row'}"
2305
+ [style.flex-direction]="field.direction || 'inherit'" [ngClass]="field.direction ==='row' ? (field.ngClass+' '+ 'row'): field.ngClass">
2302
2306
  <ng-container *ngFor="let subfield of field.collections;">
2303
2307
  <ng-container *ngIf="subfield.visible !== false" klesDynamicField [field]="subfield" [group]="subGroup" [siblingFields]="field.collections">
2304
2308
  </ng-container>
2305
2309
  </ng-container>
2306
2310
  </div>
2307
2311
  </div>
2308
- `, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".group-container{display:flex;flex-direction:inherit;width:inherit}\n"] }]
2312
+ `, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".row{align-items:baseline}\n", ".group-container{display:flex;flex-direction:inherit;width:inherit}\n"] }]
2309
2313
  }] });
2310
2314
 
2311
2315
  class KlesFormInputClearableComponent extends KlesFormInputComponent {
@@ -3034,7 +3038,7 @@ let KlesFormArrayComponent = class KlesFormArrayComponent extends KlesFieldAbstr
3034
3038
  }
3035
3039
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: KlesFormArrayComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
3036
3040
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: KlesFormArrayComponent, selector: "kles-array", usesInheritance: true, ngImport: i0, template: `
3037
- <div [formGroup]="group">
3041
+ <div [formGroup]="group" class="container" [ngClass]="{'container-column': field.direction ==='column'}">
3038
3042
  <ng-container [formArrayName]="field.name">
3039
3043
  <div class="group-container" *ngFor="let subGroup of formArray.controls let index = index;"
3040
3044
  [ngClass]="field.direction === 'column' ? 'column': 'row'">
@@ -3046,7 +3050,7 @@ let KlesFormArrayComponent = class KlesFormArrayComponent extends KlesFieldAbstr
3046
3050
  </div>
3047
3051
  </ng-container>
3048
3052
  </div>
3049
- `, isInline: true, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".group-container{display:flex;flex-direction:inherit}\n", ".row{gap:10px;flex-direction:row}\n", ".column{flex-direction:column;gap:0px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "siblingFields"] }] }); }
3053
+ `, isInline: true, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".container{display:flex;flex-direction:inherit}\n", ".container-column{gap:10px}\n", ".group-container{display:flex;flex-direction:inherit}\n", ".row{gap:10px;flex-direction:row;align-items:baseline}\n", ".column{flex-direction:column;gap:0px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "siblingFields"] }] }); }
3050
3054
  };
3051
3055
  KlesFormArrayComponent = __decorate([
3052
3056
  FieldMapper({ type: EnumType.array, factory: (field) => (new KlesFormArray(field).create()) })
@@ -3054,7 +3058,7 @@ KlesFormArrayComponent = __decorate([
3054
3058
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: KlesFormArrayComponent, decorators: [{
3055
3059
  type: Component,
3056
3060
  args: [{ selector: 'kles-array', template: `
3057
- <div [formGroup]="group">
3061
+ <div [formGroup]="group" class="container" [ngClass]="{'container-column': field.direction ==='column'}">
3058
3062
  <ng-container [formArrayName]="field.name">
3059
3063
  <div class="group-container" *ngFor="let subGroup of formArray.controls let index = index;"
3060
3064
  [ngClass]="field.direction === 'column' ? 'column': 'row'">
@@ -3066,7 +3070,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
3066
3070
  </div>
3067
3071
  </ng-container>
3068
3072
  </div>
3069
- `, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".group-container{display:flex;flex-direction:inherit}\n", ".row{gap:10px;flex-direction:row}\n", ".column{flex-direction:column;gap:0px}\n"] }]
3073
+ `, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".container{display:flex;flex-direction:inherit}\n", ".container-column{gap:10px}\n", ".group-container{display:flex;flex-direction:inherit}\n", ".row{gap:10px;flex-direction:row;align-items:baseline}\n", ".column{flex-direction:column;gap:0px}\n"] }]
3070
3074
  }] });
3071
3075
 
3072
3076
  class KlesFormRange extends KlesFormControl {