Merge pull request #362 from TheOriginalJosh/input-warning-option

Input warning option

bootstrapper/inputs/inputsNg1.html

@@ -88,7 +88,7 @@ <h3><a href="https://github.com/SamGraber/TypeScript-Angular-Components/blob/mas
 
 <div>
 	<label><a href="https://github.com/SamGraber/TypeScript-Angular-Components/tree/master/source/behaviors/required/required.md">Required input</a>:</label>
-	<rl-textbox ng-model="input.requiredText" rl-required="Input required"></rl-textbox>
+	<rl-textbox ng-model="input.requiredText" warning="true"></rl-textbox>
 </div>
 <div>
 	<label>One validator:</label>

package.json

@@ -47,7 +47,7 @@
     "bundle-deps": "gulp bundle-bootstrapper-vendor && gulp bundle-bootstrapper-renovo && gulp bundle-tests-vendor && gulp bundle-tests-renovo"
   },
   "devDependencies": {
-    "@renovolive/gulp-utilities": "~2.3.0",
+    "@renovolive/gulp-utilities": "~2.4.0",
     "chai": "~3.5.0",
     "concurrently": "~2.0.0",
     "del": "^2.2.0",
@@ -93,7 +93,7 @@
     "@types/jquery": "^2.0.32",
     "@types/jquery.jsignature": "^2.0.28",
     "@types/lodash": "^4.14.36",
-    "@types/moment-timezone": "^0.2.31",
+    "@types/moment-timezone": "0.2.31",
     "@types/sinon": "^1.16.31",
     "angular": "~1.5.3",
     "angular-animate": "~1.5.3",
@@ -112,7 +112,6 @@
     "rl-http": "~1.2.0",
     "rxjs": "5.0.0-beta.12",
     "systemjs": "^0.19.28",
-    "typescript": "^2.0.3",
     "typescript-angular-utilities": "~3.9.0",
     "ui-select": "~0.14.7",
     "zone.js": "~0.6.25"

source/components/inputs/absoluteTime/absoluteTime.html

@@ -1,4 +1,5 @@
 <div class="field input-group"
+	[class.warning]="warning"
 	[class.error]="componentValidator.error$ | async"
 	(offClick)="closeTimes()">
 	<label [@slide]="labelState">{{label}}</label>

source/components/inputs/dateTime/dateTime.html

@@ -1,4 +1,5 @@
 <div class="field date-time"
+	 [class.warning]="warning"
 	 [class.has-warning]="!validFormat"
 	 [class.error]="componentValidator.error$ | async"
 	 [class.datepicker-with-clear]="showClear">

source/components/inputs/dateTime/dateTime.ng1.html

@@ -1,4 +1,4 @@
-<div class="field date-time" ng-class="{ 'has-warning': !dateTime.validFormat, 'error': dateTime.ngModel.$invalid, 'datepicker-with-clear': dateTime.clearButton }">
+<div class="field date-time" ng-class="{ 'has-warning': !dateTime.validFormat, 'warning': input.warning, 'error': dateTime.ngModel.$invalid, 'datepicker-with-clear': dateTime.clearButton }">
 	<span class="show-date-picker datepicker-input-group">
 		<label class="label-slide angular-animate" ng-show="dateTime.ngModel.$viewValue | isEmpty:false && dateTime.label">{{dateTime.label}}</label>
 		<input type="text" class="form-control" ng-model="dateTime.ngModel.$viewValue" placeholder="{{dateTime.label}}"/>

source/components/inputs/input.ng1.ts

@@ -44,6 +44,7 @@ export class InputController {
 	validators: __validation.IValidationHandler[];
 	label: string;
 	name: string;
+	warning: boolean;
 
 	ngModel: INgModelValidator;
 	required: RequiredController;
@@ -109,6 +110,7 @@ let baseInputOptions: angular.IComponentOptions = {
 		validators: '<?',
 		label: '@',
 		name: '@',
+		warning:'<?'
 	},
 };
 

source/components/inputs/input.ts

@@ -8,14 +8,15 @@ import __guid = services.guid;
 import { FormComponent } from '../form/form';
 import { slide } from '../../animations/index';
 
-export const baseInputs: string[] = ['name', 'label', 'value', 'disabled'];
+export const baseInputs: string[] = ['name', 'label', 'value', 'disabled','warning'];
 export const baseOutputs: string[] = ['change', 'valueChange'];
 export const baseAnimations = [slide.animation];
 
 export class InputComponent<T> implements AfterViewInit, OnInit {
 	name: string;
 	label: string = '';
 	disabled: boolean;
+	warning: boolean;
 	value: T;
 	labelState: string = slide.hide;
 	hidePlaceholder: boolean = false;

source/components/inputs/select/select.html

@@ -1,4 +1,5 @@
 <div class="field rl-select"
+	 [class.warning]="warning"
 	 [class.error]="componentValidator.error$ | async"
 	 [class.rl-select-loading]="busy?.loading">
 	<label [@slide]="labelState">{{label}}</label>

source/components/inputs/select/select.ng1.html

@@ -1,4 +1,4 @@
-<div class="field rl-select" ng-class="{ 'error': select.ngModel.$invalid, 'rl-select-loading': select.loading }">
+<div class="field rl-select" ng-class="{ 'error': select.ngModel.$invalid, 'rl-select-loading': select.loading, 'warning': input.warning }">
 	<label ng-show="select.selection" class="label-slide angular-animate">
 		{{::select.label}}
 	</label>

source/components/inputs/spinner/spinner.html

@@ -1,6 +1,7 @@
 <span [ngSwitch]="disabled">
 	<div *ngSwitchDefault
 		 class="field"
+		 [class.warning]="warning"
 		 [class.error]="componentValidator.error$ | async">
 		 <label [@slide]="labelState">{{label}}</label>
 		 <input type="text"

source/components/inputs/spinner/spinner.ng1.html

@@ -1,6 +1,6 @@
 <rl-generic-container selector="spinner.ngDisabled" class="spinner-container">
 	<template default>
-		<div class="field" ng-class="{ 'error': spinner.ngModel.$invalid }">
+		<div class="field" ng-class="{ 'error': spinner.ngModel.$invalid, 'warning': input.warning }">
 			<label class="label-slide angular-animate" ng-show="spinner.ngModel.$viewValue | isEmpty:false && spinner.label">{{spinner.label}}</label>
 			<input name="{{::spinner.name}}" class="spinner" id="{{::spinner.spinnerId}}" type="text" placeholder="{{spinner.label}}"/>
 			<span class="error-string" ng-if="spinner.inputValidator.error | isEmpty:false">{{spinner.inputValidator.error}}</span>

source/components/inputs/textarea/textarea.html

@@ -1,4 +1,5 @@
 <div class="field"
+	[class.warning]="warning"
 	[class.error]="componentValidator.error$ | async">
 	<label [@slide]="labelState">{{label}}</label>
 	<textarea type="text"

source/components/inputs/textarea/textarea.ng1.html

@@ -1,4 +1,4 @@
-<div class="field" ng-class="{ 'error': input.ngModel.$invalid }">
+<div class="field" ng-class="{ 'error': input.ngModel.$invalid, 'warning': input.warning }">
 	<label ng-show="input.inputValue && input.label" class="label-slide angular-animate">{{::input.label}}</label>
 	<textarea class="form-control" ng-model="input.inputValue" rows="{{::input.rows}}" maxlength="{{::input.maxlength}}" ng-disabled="input.ngDisabled" placeholder="{{::input.label}}"></textarea>
 	<span class="error-string angular-animate" ng-if="input.inputValidator.error | isEmpty:false">{{input.inputValidator.error}}</span>

source/components/inputs/textbox/textbox.html

@@ -1,4 +1,5 @@
 <div class="field"
+	[class.warning]="warning"
 	[class.error]="componentValidator.error$ | async">
 	<label [@slide]="labelState">{{label}}</label>
 	<input type="text"

source/components/inputs/textbox/textbox.ng1.html

@@ -1,4 +1,4 @@
-<div class="field" ng-class="{ 'error': input.ngModel.$invalid }">
+<div class="field" ng-class="{ 'error': input.ngModel.$invalid, 'warning': input.warning }">
 	<label ng-show="input.inputValue && input.label" class="label-slide angular-animate">{{::input.label}}</label>
 	<input  type="text" class="form-control angular-animate" ng-model="input.inputValue" placeholder="{{::input.label}}" maxlength="{{::input.maxlength}}" />
 	<span class="error-string angular-animate" ng-if="input.inputValidator.error | isEmpty:false">{{input.inputValidator.error}}</span>

source/components/inputs/typeahead/typeahead.html

@@ -1,4 +1,5 @@
 <div class="field typeahead"
+	 [class.warning]="warning"
 	 [class.error]="componentValidator.error$ | async">
 	<label [@slide]="labelState">{{label}}</label>
 	<div [hidden]="collapsed">

source/components/inputs/typeahead/typeahead.ng1.html

@@ -1,4 +1,4 @@
-<div class="field typeahead" ng-class="{ 'error': typeahead.ngModel.$invalid }">
+<div class="field typeahead" ng-class="{ 'error': typeahead.ngModel.$invalid, 'warning': input.warning }">
 	<label ng-show="typeahead.selection" class="label-slide angular-animate">
 		{{::typeahead.label}}
 	</label>