feat(bootstrap): support version 3 (#574)

ngx-formly · Nov 27, 2017 · a447bf8 · a447bf8
1 parent 745478d
commit a447bf8
Show file tree

Hide file tree

Showing 9 changed files with 88 additions and 107 deletions.
diff --git a/package.json b/package.json
@@ -59,7 +59,7 @@
   "devDependencies": {
     "@angular/animations": "4.4.6",
     "@angular/cdk": "^5.0.0-rc0",
-    "@angular/cli": "^1.5.0",
+    "@angular/cli": "^1.5.4",
     "@angular/common": "4.4.6",
     "@angular/compiler": "4.4.6",
     "@angular/compiler-cli": "4.4.6",
@@ -73,9 +73,9 @@
     "@compodoc/compodoc": "^1.0.4",
     "@types/jasmine": "2.6.0",
     "@types/node": "^7.0.22",
-    "angular-cli-ghpages": "^0.5.1",
+    "angular-cli-ghpages": "^0.5.2",
     "angular2-template-loader": "^0.6.2",
-    "awesome-typescript-loader": "^3.3.0",
+    "awesome-typescript-loader": "^3.4.0",
     "codecov": "^3.0.0",
     "codelyzer": "^4.0.1",
     "commitizen": "^2.9.6",
@@ -90,7 +90,7 @@
     "karma-mocha-reporter": "^2.2.4",
     "karma-remap-coverage": "^0.1.4",
     "karma-sourcemap-loader": "^0.3.7",
-    "karma-webpack": "^2.0.5",
+    "karma-webpack": "^2.0.6",
     "lodash.clonedeep": "^4.5.0",
     "ng-packagr": "^1.5.0",
     "raw-loader": "^0.5.1",

diff --git a/src/core/src/components/formly.field.config.ts b/src/core/src/components/formly.field.config.ts
@@ -1,4 +1,4 @@
-import { FormGroup, AbstractControl, FormGroupDirective, NgForm, ValidatorFn, AsyncValidatorFn } from '@angular/forms';
+import { FormGroup, AbstractControl, FormGroupDirective, NgForm } from '@angular/forms';
 import { Subject } from 'rxjs/Subject';
 import { Field } from './../templates/field';
 

diff --git a/src/core/src/components/formly.group.ts b/src/core/src/components/formly.group.ts
@@ -1,5 +1,4 @@
 import { Component } from '@angular/core';
-import { AbstractControl } from '@angular/forms';
 import { FieldType } from '../templates/field.type';
 
 @Component({

diff --git a/src/ui-bootstrap/src/types/input.ts b/src/ui-bootstrap/src/types/input.ts
@@ -4,9 +4,11 @@ import { FieldType } from '@ngx-formly/core';
 @Component({
   selector: 'formly-field-input',
   template: `
-    <input [type]="type" [formControl]="formControl" class="form-control"
-      [formlyAttributes]="field" [class.is-invalid]="showError">
-    `,
+    <input [type]="type" [formControl]="formControl" class="form-control" [formlyAttributes]="field" [class.is-invalid]="showError">
+  `,
+  host: {
+    '[class.d-inline-flex]': 'to.addonLeft || to.addonRight',
+  },
 })
 export class FormlyFieldInput extends FieldType {
   get type() {

diff --git a/src/ui-bootstrap/src/wrappers/addons.ts b/src/ui-bootstrap/src/wrappers/addons.ts
@@ -1,4 +1,4 @@
-import { Component, ViewChild, ViewContainerRef, ViewEncapsulation } from '@angular/core';
+import { Component, ViewChild, ViewContainerRef } from '@angular/core';
 import { FieldWrapper } from '@ngx-formly/core';
 
 @Component({
@@ -22,8 +22,6 @@ import { FieldWrapper } from '@ngx-formly/core';
       </div>
     </div>
   `,
-  styles: [`.input-group formly-field-input { display: inline-flex; }`],
-  encapsulation: ViewEncapsulation.None,
 })
 export class FormlyWrapperAddons extends FieldWrapper {
   @ViewChild('fieldComponent', {read: ViewContainerRef}) fieldComponent: ViewContainerRef;

diff --git a/src/ui-bootstrap/src/wrappers/fieldset.ts b/src/ui-bootstrap/src/wrappers/fieldset.ts
@@ -4,7 +4,7 @@ import { FieldWrapper } from '@ngx-formly/core';
 @Component({
   selector: 'formly-wrapper-fieldset',
   template: `
-    <div class="form-group">
+    <div class="form-group" [class.has-error]="showError">
       <ng-template #fieldComponent></ng-template>
     </div>
   `,

diff --git a/src/ui-bootstrap/src/wrappers/message-validation.ts b/src/ui-bootstrap/src/wrappers/message-validation.ts
@@ -6,7 +6,7 @@ import { FieldWrapper } from '@ngx-formly/core';
   template: `
     <ng-template #fieldComponent></ng-template>
     <div>
-      <small class="invalid-feedback" [style.display]="'block'" *ngIf="showError" role="alert" [id]="validationId">
+      <small class="text-danger invalid-feedback" [style.display]="'block'" *ngIf="showError" role="alert" [id]="validationId">
         <formly-validation-message [fieldForm]="formControl" [field]="field"></formly-validation-message>
       </small>
     </div>

diff --git a/tslint.json b/tslint.json
@@ -5,7 +5,7 @@
         "component-selector": [true, "element", "formly", "kebab-case"],
         "use-input-property-decorator": true,
         "use-output-property-decorator": true,
-        "use-host-property-decorator": true,
+        "use-host-property-decorator": false,
         "no-attribute-parameter-decorator": true,
         "angular-whitespace": [true, "check-interpolation", "check-pipe"],
         "no-input-rename": false,