ngx-form-control
Version:
Form controls for angular 6
1,263 lines (1,251 loc) • 192 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/forms'), require('@angular/platform-browser')) :
typeof define === 'function' && define.amd ? define('ngx-form-control', ['exports', '@angular/core', '@angular/forms', '@angular/platform-browser'], factory) :
(factory((global['ngx-form-control'] = {}),global.ng.core,global.ng.forms,global.ng.platformBrowser));
}(this, (function (exports,core,forms,platformBrowser) { 'use strict';
/*! *****************************************************************************
Copyright (c) Microsoft Corporation. All rights reserved.
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
this file except in compliance with the License. You may obtain a copy of the
License at http://www.apache.org/licenses/LICENSE-2.0
THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
MERCHANTABLITY OR NON-INFRINGEMENT.
See the Apache Version 2.0 License for specific language governing permissions
and limitations under the License.
***************************************************************************** */
/* global Reflect, Promise */
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b)
if (b.hasOwnProperty(p))
d[p] = b[p]; };
return extendStatics(d, b);
};
function __extends(d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
}
function __values(o) {
var m = typeof Symbol === "function" && o[Symbol.iterator], i = 0;
if (m)
return m.call(o);
return {
next: function () {
if (o && i >= o.length)
o = void 0;
return { value: o && o[i++], done: !o };
}
};
}
function __read(o, n) {
var m = typeof Symbol === "function" && o[Symbol.iterator];
if (!m)
return o;
var i = m.call(o), r, ar = [], e;
try {
while ((n === void 0 || n-- > 0) && !(r = i.next()).done)
ar.push(r.value);
}
catch (error) {
e = { error: error };
}
finally {
try {
if (r && !r.done && (m = i["return"]))
m.call(i);
}
finally {
if (e)
throw e.error;
}
}
return ar;
}
function __spread() {
for (var ar = [], i = 0; i < arguments.length; i++)
ar = ar.concat(__read(arguments[i]));
return ar;
}
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
/**
* @abstract
*/
var BaseControlComponent = (function () {
function BaseControlComponent() {
this.id = 'ngx-' + Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
this.innerCustomErrorMessages = [];
this.name = '';
this.label = '';
this.placeholder = '';
this.title = '';
this.required = false;
this.disabled = false;
this.validMessage = '';
this.requiredErrorMessage = 'This field is required.';
}
Object.defineProperty(BaseControlComponent.prototype, "customErrorMessages", {
set: /**
* @param {?} messages
* @return {?}
*/ function (messages) {
if (!messages) {
this.innerCustomErrorMessages = [];
}
else if ('string' === typeof messages) {
this.innerCustomErrorMessages = [messages];
}
else if (messages[0]) {
this.innerCustomErrorMessages = messages;
}
else {
this.innerCustomErrorMessages = [];
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(BaseControlComponent.prototype, "hasCustomError", {
get: /**
* @return {?}
*/ function () {
return !!(this.innerCustomErrorMessages && this.innerCustomErrorMessages[0]);
},
enumerable: true,
configurable: true
});
Object.defineProperty(BaseControlComponent.prototype, "hasRequiredError", {
get: /**
* @return {?}
*/ function () {
return this.required && this.value !== false && this.value !== 0 && !this.value;
},
enumerable: true,
configurable: true
});
/**
* @param {?} fn
* @return {?}
*/
BaseControlComponent.prototype.registerOnChange = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
var _this = this;
this._onChangeCallback = function (event) {
if (_this.cleanCustomErrorMessageOnChanged) {
_this.innerCustomErrorMessages = [];
}
return fn(event);
};
};
/**
* @param {?} fn
* @return {?}
*/
BaseControlComponent.prototype.registerOnTouched = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this._onTouchedCallback = fn;
};
/**
* @return {?}
*/
BaseControlComponent.prototype.triggerChange = /**
* @return {?}
*/
function () {
if (this._onChangeCallback) {
this._onChangeCallback(this.value);
}
};
BaseControlComponent.propDecorators = {
name: [{ type: core.Input }],
label: [{ type: core.Input }],
placeholder: [{ type: core.Input }],
title: [{ type: core.Input }],
required: [{ type: core.Input }],
disabled: [{ type: core.Input }],
validMessage: [{ type: core.Input }],
requiredErrorMessage: [{ type: core.Input }],
cleanCustomErrorMessageOnChanged: [{ type: core.Input }],
customErrorMessages: [{ type: core.Input }]
};
return BaseControlComponent;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
/**
* @abstract
*/
var BaseListControlComponent = (function (_super) {
__extends(BaseListControlComponent, _super);
function BaseListControlComponent() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this._options = [];
_this._selectOptions = [];
_this._selectedIndexes = [];
return _this;
}
Object.defineProperty(BaseListControlComponent.prototype, "textKey", {
set: /**
* @param {?} value
* @return {?}
*/ function (value) {
this._textKey = value;
this.initOptions();
},
enumerable: true,
configurable: true
});
Object.defineProperty(BaseListControlComponent.prototype, "valueKey", {
set: /**
* @param {?} value
* @return {?}
*/ function (value) {
this._valueKey = value;
this.initOptions();
},
enumerable: true,
configurable: true
});
Object.defineProperty(BaseListControlComponent.prototype, "comparedKey", {
set: /**
* @param {?} value
* @return {?}
*/ function (value) {
this._comparedKey = value;
this.initOptions();
},
enumerable: true,
configurable: true
});
Object.defineProperty(BaseListControlComponent.prototype, "options", {
set: /**
* @param {?} options
* @return {?}
*/ function (options) {
this._options = options;
this.initOptions();
},
enumerable: true,
configurable: true
});
Object.defineProperty(BaseListControlComponent.prototype, "selectOptions", {
get: /**
* @return {?}
*/ function () {
return this._selectOptions;
},
enumerable: true,
configurable: true
});
Object.defineProperty(BaseListControlComponent.prototype, "selectedIndexes", {
get: /**
* @return {?}
*/ function () {
return this._selectedIndexes;
},
set: /**
* @param {?} indexes
* @return {?}
*/ function (indexes) {
/** @type {?} */
var oldSelectedIndexes = JSON.stringify(this._selectedIndexes);
this._selectedIndexes = indexes && indexes.length ? indexes.reduce(function (arr, value) {
value = +value;
if (value > -1) {
arr.push(value);
}
return arr;
}, []) : [];
/** @type {?} */
var newSelectedIndexes = JSON.stringify(this._selectedIndexes);
if (newSelectedIndexes !== oldSelectedIndexes) {
this.triggerChange();
}
},
enumerable: true,
configurable: true
});
/**
* @param {?} value
* @return {?}
*/
BaseListControlComponent.prototype.findIndex = /**
* @param {?} value
* @return {?}
*/
function (value) {
/** @type {?} */
var comparedValue = this.getComparedValue(value);
return this._selectOptions.findIndex(function (option) {
return comparedValue === option.comparedValue;
});
};
/**
* @param {?} arrValue
* @return {?}
*/
BaseListControlComponent.prototype.findIndexes = /**
* @param {?} arrValue
* @return {?}
*/
function (arrValue) {
var _this = this;
if (!arrValue || !arrValue.length) {
return [];
}
return arrValue.reduce(function (arr, value) {
/** @type {?} */
var index = _this.findIndex(value);
if (index > -1) {
arr.push(index);
}
return arr;
}, []);
};
/**
* @return {?}
*/
BaseListControlComponent.prototype.initOptions = /**
* @return {?}
*/
function () {
var _this = this;
this.beforeInitOptions();
/** @type {?} */
var oldValue = this.value;
this._selectOptions = [];
if (this._options && this._options.length) {
this._options.map(function (option, index) {
/** @type {?} */
var text;
/** @type {?} */
var value;
if ('string' === typeof option || 'number' === typeof option) {
text = option;
value = option;
}
else {
text = option[_this._textKey || 'text'];
value = _this._valueKey ? option[_this._valueKey] : option;
}
_this._selectOptions.push({
id: index,
text: text,
value: value,
comparedValue: _this.getComparedValue(option),
});
});
}
this.afterInitOptions();
this.writeValue(oldValue);
/** @type {?} */
var newValue = this.value;
if (JSON.stringify(oldValue) !== JSON.stringify(newValue)) {
this.triggerChange();
}
};
/**
* @return {?}
*/
BaseListControlComponent.prototype.beforeInitOptions = /**
* @return {?}
*/
function () {
};
/**
* @return {?}
*/
BaseListControlComponent.prototype.afterInitOptions = /**
* @return {?}
*/
function () {
};
/**
* @param {?} option
* @return {?}
*/
BaseListControlComponent.prototype.getComparedValue = /**
* @param {?} option
* @return {?}
*/
function (option) {
if (!option) {
return '';
}
if ('string' === typeof option || 'number' === typeof option) {
return option;
}
/** @type {?} */
var value;
if (this._comparedKey) {
value = option[this._comparedKey];
}
else {
value = this._valueKey ? option[this._valueKey] : option;
}
if ('string' === typeof value || 'number' === typeof value) {
return value;
}
return JSON.stringify(value);
};
BaseListControlComponent.propDecorators = {
textKey: [{ type: core.Input }],
valueKey: [{ type: core.Input }],
comparedKey: [{ type: core.Input }],
options: [{ type: core.Input }]
};
return BaseListControlComponent;
}(BaseControlComponent));
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
var FormCheckboxComponent = (function (_super) {
__extends(FormCheckboxComponent, _super);
function FormCheckboxComponent() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this._isTouched = false;
return _this;
}
Object.defineProperty(FormCheckboxComponent.prototype, "isEmpty", {
get: /**
* @return {?}
*/ function () {
return !this._selectedIndexes || !this._selectedIndexes.length;
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormCheckboxComponent.prototype, "value", {
get: /**
* @return {?}
*/ function () {
var _this = this;
return this.isEmpty ? null : this._selectedIndexes.map(function (index) { return _this._selectOptions[index].value; });
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormCheckboxComponent.prototype, "invalid", {
get: /**
* @return {?}
*/ function () {
if (this.hasCustomError) {
return true;
}
if (!this._isTouched) {
return false;
}
return this.hasRequiredError;
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormCheckboxComponent.prototype, "valid", {
get: /**
* @return {?}
*/ function () {
if (this.hasCustomError) {
return false;
}
if (!this._isTouched) {
return false;
}
return !this.hasRequiredError;
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormCheckboxComponent.prototype, "errorMessages", {
get: /**
* @return {?}
*/ function () {
if (this.hasCustomError) {
return this.innerCustomErrorMessages;
}
if (this.hasRequiredError) {
return [this.requiredErrorMessage];
}
},
enumerable: true,
configurable: true
});
/**
* @param {?} value
* @return {?}
*/
FormCheckboxComponent.prototype.writeValue = /**
* @param {?} value
* @return {?}
*/
function (value) {
var _this = this;
/** @type {?} */
var listElement = this.listRadioElement.nativeElement.querySelectorAll('.custom-control-input');
try {
for (var listElement_1 = __values(listElement), listElement_1_1 = listElement_1.next(); !listElement_1_1.done; listElement_1_1 = listElement_1.next()) {
var element = listElement_1_1.value;
element.checked = false;
}
}
catch (e_1_1) {
e_1 = { error: e_1_1 };
}
finally {
try {
if (listElement_1_1 && !listElement_1_1.done && (_a = listElement_1.return))
_a.call(listElement_1);
}
finally {
if (e_1)
throw e_1.error;
}
}
if (!value) {
return;
}
this._selectedIndexes = this.findIndexes(value);
if (!this.listRadioElement || !this.listRadioElement.nativeElement) {
return;
}
if (this.value) {
setTimeout(function () {
_this._selectedIndexes.map(function (index) {
listElement[index].checked = true;
});
});
}
var e_1, _a;
};
/**
* @return {?}
*/
FormCheckboxComponent.prototype.validate = /**
* @return {?}
*/
function () {
/** @type {?} */
var result = {};
if (this.hasRequiredError) {
result['required'] = true;
}
return result;
};
// noinspection JSMethodCanBeStatic
/**
* @param {?} index
* @param {?} event
* @return {?}
*/
FormCheckboxComponent.prototype.toggle = /**
* @param {?} index
* @param {?} event
* @return {?}
*/
function (index, event) {
this._isTouched = true;
/** @type {?} */
var checked = event.target.checked;
index = +index;
if (checked) {
this._selectedIndexes.push(index);
}
else {
/** @type {?} */
var indexOfIndex = this._selectedIndexes.indexOf(index);
if (indexOfIndex > -1) {
this._selectedIndexes.splice(indexOfIndex, 1);
}
}
this.triggerChange();
};
/**
* @return {?}
*/
FormCheckboxComponent.prototype.reset = /**
* @return {?}
*/
function () {
this._isTouched = false;
};
FormCheckboxComponent.decorators = [
{ type: core.Component, args: [{
selector: 'ngx-form-checkbox',
template: "<label *ngIf=\"label\" [for]=\"id\">{{label}}</label>\n\n<div #listRadioElement>\n <div class=\"custom-control custom-checkbox\" *ngFor=\"let option of selectOptions; let index = index;\">\n <input class=\"custom-control-input\"\n [ngClass]=\"{'is-invalid': invalid, 'is-valid': valid}\"\n type=\"checkbox\"\n [id]=\"id + '-' + index\"\n [name]=\"id\"\n (click)=\"toggle(index, $event)\"\n title=\"\">\n <label class=\"custom-control-label\" [for]=\"id + '-' + index\">{{option.text}}</label>\n </div>\n</div>\n\n<ng-container *ngIf=\"valid && validMessage\">\n <div class=\"custom-control-input is-valid\"></div>\n <div class=\"valid-feedback\">{{validMessage}}</div>\n</ng-container>\n\n<ng-container *ngIf=\"invalid\">\n <div class=\"custom-control-input is-invalid\"></div>\n <div class=\"invalid-feedback\">\n <span *ngFor=\"let message of errorMessages; let last = last;\">\n {{message}}<br *ngIf=\"!last\">\n </span>\n </div>\n</ng-container>\n",
styles: [":host .form-check.is-valid~.invalid-feedback,:host .form-check.is-valid~.invalid-tooltip,:host .form-check.is-valid~.valid-feedback,:host .form-check.is-valid~.valid-tooltip,:host .was-validated~.invalid-feedback,:host .was-validated~.invalid-tooltip,:host .was-validated~.valid-feedback,:host .was-validated~.valid-tooltip{display:block}"],
providers: [
{ provide: forms.NG_VALUE_ACCESSOR, useExisting: FormCheckboxComponent, multi: true },
{ provide: forms.NG_VALIDATORS, useExisting: FormCheckboxComponent, multi: true }
]
},] },
];
FormCheckboxComponent.propDecorators = {
listRadioElement: [{ type: core.ViewChild, args: ['listRadioElement',] }]
};
return FormCheckboxComponent;
}(BaseListControlComponent));
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
var FormInputComponent = (function (_super) {
__extends(FormInputComponent, _super);
function FormInputComponent() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.type = 'text';
_this.pattern = '';
_this.readonly = false;
_this.autocomplete = true;
_this.trimResult = true;
_this.minLengthErrorMessage = 'Value is too short.';
_this.patternErrorMessage = 'Value is not valid.';
_this.matchErrorMessage = 'Value does not match.';
_this.focus = new core.EventEmitter();
_this.blur = new core.EventEmitter();
return _this;
}
Object.defineProperty(FormInputComponent.prototype, "match", {
set: /**
* @param {?} value
* @return {?}
*/ function (value) {
this._match = value || '';
this.triggerChange();
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormInputComponent.prototype, "value", {
get: /**
* @return {?}
*/ function () {
if (!this._innerValue) {
return '';
}
if ('string' !== typeof this._innerValue) {
return this._innerValue;
}
return this.trimResult ? this._innerValue.trim() : this._innerValue;
},
set: /**
* @param {?} value
* @return {?}
*/ function (value) {
if (value !== this._innerValue) {
this._innerValue = value;
this.triggerChange();
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormInputComponent.prototype, "hasMatchError", {
get: /**
* @return {?}
*/ function () {
return !!this._match && this._match !== this.value;
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormInputComponent.prototype, "hasPatternError", {
get: /**
* @return {?}
*/ function () {
return this.customInput.errors && this.customInput.errors['pattern'];
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormInputComponent.prototype, "hasMinLengthError", {
get: /**
* @return {?}
*/ function () {
return this.customInput.errors && this.customInput.errors['minlength'];
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormInputComponent.prototype, "invalid", {
get: /**
* @return {?}
*/ function () {
if (this.hasCustomError) {
return true;
}
if (!this.customInput.touched) {
return false;
}
return this.customInput.invalid || this.hasMatchError || this.hasRequiredError;
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormInputComponent.prototype, "valid", {
get: /**
* @return {?}
*/ function () {
if (this.hasCustomError) {
return false;
}
if (!this.customInput.touched) {
return false;
}
return !this.customInput.invalid && !this.hasMatchError && !this.hasRequiredError;
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormInputComponent.prototype, "errorMessages", {
get: /**
* @return {?}
*/ function () {
if (this.hasRequiredError) {
return [this.requiredErrorMessage];
}
if (this.hasMatchError) {
return [this.matchErrorMessage];
}
if (this.hasPatternError) {
return [this.patternErrorMessage];
}
if (this.hasMinLengthError) {
return [this.minLengthErrorMessage];
}
if (this.hasCustomError) {
return this.innerCustomErrorMessages;
}
},
enumerable: true,
configurable: true
});
/**
* @param {?} value
* @return {?}
*/
FormInputComponent.prototype.writeValue = /**
* @param {?} value
* @return {?}
*/
function (value) {
this._innerValue = value;
};
/**
* @return {?}
*/
FormInputComponent.prototype.validate = /**
* @return {?}
*/
function () {
/** @type {?} */
var result = this.customInput.errors || {};
if (this.hasRequiredError) {
result['required'] = true;
}
else {
delete result['required'];
}
if (this.hasMatchError) {
result['match'] = true;
}
return result;
};
// noinspection JSUnusedGlobalSymbols
/**
* @return {?}
*/
FormInputComponent.prototype.reset = /**
* @return {?}
*/
function () {
this.customInput.reset();
};
/**
* @param {?} event
* @return {?}
*/
FormInputComponent.prototype.onFocus = /**
* @param {?} event
* @return {?}
*/
function (event) {
this.focus.emit(event);
};
/**
* @param {?} event
* @return {?}
*/
FormInputComponent.prototype.onBlur = /**
* @param {?} event
* @return {?}
*/
function (event) {
this.blur.emit(event);
};
FormInputComponent.decorators = [
{ type: core.Component, args: [{
selector: 'ngx-form-input',
template: "<label *ngIf=\"label\" [for]=\"id\">{{label}}</label>\n\n<!--suppress HtmlFormInputWithoutLabel -->\n<input class=\"form-control\"\n [ngClass]=\"{'is-invalid': invalid, 'is-valid': valid}\"\n [type]=\"type\"\n [id]=\"id\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [minlength]=\"minlength\"\n [maxlength]=\"maxlength\"\n [placeholder]=\"placeholder\"\n [title]=\"title\"\n [pattern]=\"pattern\"\n [(ngModel)]=\"value\"\n (input)=\"triggerChange()\"\n [autocomplete]=\"autocomplete ? 'on' : 'off'\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onBlur($event)\"\n #customInput=\"ngModel\">\n\n<div class=\"valid-feedback\" *ngIf=\"valid && validMessage\">{{validMessage}}</div>\n\n<div class=\"invalid-feedback\" *ngIf=\"invalid\">\n <span *ngFor=\"let message of errorMessages; let last = last;\">\n {{message}}<br *ngIf=\"!last\">\n </span>\n</div>\n",
styles: [""],
providers: [
{ provide: forms.NG_VALUE_ACCESSOR, useExisting: FormInputComponent, multi: true },
{ provide: forms.NG_VALIDATORS, useExisting: FormInputComponent, multi: true }
]
},] },
];
FormInputComponent.propDecorators = {
type: [{ type: core.Input }],
pattern: [{ type: core.Input }],
readonly: [{ type: core.Input }],
autocomplete: [{ type: core.Input }],
minlength: [{ type: core.Input }],
maxlength: [{ type: core.Input }],
trimResult: [{ type: core.Input }],
minLengthErrorMessage: [{ type: core.Input }],
patternErrorMessage: [{ type: core.Input }],
matchErrorMessage: [{ type: core.Input }],
customInput: [{ type: core.ViewChild, args: ['customInput',] }],
match: [{ type: core.Input }],
focus: [{ type: core.Output }],
blur: [{ type: core.Output }]
};
return FormInputComponent;
}(BaseControlComponent));
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
var FormRadioComponent = (function (_super) {
__extends(FormRadioComponent, _super);
function FormRadioComponent() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this._isTouched = false;
return _this;
}
Object.defineProperty(FormRadioComponent.prototype, "isEmpty", {
get: /**
* @return {?}
*/ function () {
return !this._selectedIndexes || !this._selectedIndexes.length;
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormRadioComponent.prototype, "value", {
get: /**
* @return {?}
*/ function () {
return this.isEmpty ? null : this._selectOptions[this._selectedIndexes[0]].value;
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormRadioComponent.prototype, "invalid", {
get: /**
* @return {?}
*/ function () {
if (this.hasCustomError) {
return true;
}
if (!this._isTouched) {
return false;
}
return this.hasRequiredError;
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormRadioComponent.prototype, "valid", {
get: /**
* @return {?}
*/ function () {
if (this.hasCustomError) {
return false;
}
if (!this._isTouched) {
return false;
}
return !this.hasRequiredError;
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormRadioComponent.prototype, "errorMessages", {
get: /**
* @return {?}
*/ function () {
if (this.hasRequiredError) {
return [this.requiredErrorMessage];
}
if (this.hasCustomError) {
return this.innerCustomErrorMessages;
}
},
enumerable: true,
configurable: true
});
/**
* @param {?} value
* @return {?}
*/
FormRadioComponent.prototype.writeValue = /**
* @param {?} value
* @return {?}
*/
function (value) {
var _this = this;
/** @type {?} */
var listElement = this.listRadioElement.nativeElement.querySelectorAll('.custom-control-input');
try {
for (var listElement_1 = __values(listElement), listElement_1_1 = listElement_1.next(); !listElement_1_1.done; listElement_1_1 = listElement_1.next()) {
var element = listElement_1_1.value;
element.checked = false;
}
}
catch (e_1_1) {
e_1 = { error: e_1_1 };
}
finally {
try {
if (listElement_1_1 && !listElement_1_1.done && (_a = listElement_1.return))
_a.call(listElement_1);
}
finally {
if (e_1)
throw e_1.error;
}
}
if (!value) {
return;
}
this._selectedIndexes = this.findIndexes([value]);
if (!this.listRadioElement || !this.listRadioElement.nativeElement) {
return;
}
if (this.value) {
setTimeout(function () {
/** @type {?} */
var index = _this._selectedIndexes[0];
listElement[index].checked = true;
});
}
var e_1, _a;
};
/**
* @return {?}
*/
FormRadioComponent.prototype.validate = /**
* @return {?}
*/
function () {
/** @type {?} */
var result = {};
if (this.hasRequiredError) {
result['required'] = true;
}
return result;
};
// noinspection JSMethodCanBeStatic
/**
* @param {?} index
* @param {?} event
* @return {?}
*/
FormRadioComponent.prototype.toggle = /**
* @param {?} index
* @param {?} event
* @return {?}
*/
function (index, event) {
this._isTouched = true;
index = +index;
if (this.required || index !== this._selectedIndexes[0]) {
this._selectedIndexes = [+index];
}
else {
this._selectedIndexes = [];
event.target.checked = false;
}
this.triggerChange();
};
/**
* @return {?}
*/
FormRadioComponent.prototype.reset = /**
* @return {?}
*/
function () {
this._isTouched = false;
};
FormRadioComponent.decorators = [
{ type: core.Component, args: [{
selector: 'ngx-form-radio',
template: "<label *ngIf=\"label\" [for]=\"id\">{{label}}</label>\n\n<div #listRadioElement>\n <div class=\"custom-control custom-radio\" *ngFor=\"let option of selectOptions; let index = index;\">\n <input class=\"custom-control-input\"\n [ngClass]=\"{'is-invalid': invalid, 'is-valid': valid}\"\n type=\"radio\"\n [id]=\"id + '-' + index\"\n [name]=\"id\"\n (click)=\"toggle(index, $event)\"\n title=\"\">\n <label class=\"custom-control-label\" [for]=\"id + '-' + index\">{{option.text}}</label>\n </div>\n</div>\n\n<ng-container *ngIf=\"valid && validMessage\">\n <div class=\"custom-control-input is-valid\"></div>\n <div class=\"valid-feedback\">{{validMessage}}</div>\n</ng-container>\n\n<ng-container *ngIf=\"invalid\">\n <div class=\"custom-control-input is-invalid\"></div>\n <div class=\"invalid-feedback\">\n <span *ngFor=\"let message of errorMessages; let last = last;\">\n {{message}}<br *ngIf=\"!last\">\n </span>\n </div>\n</ng-container>\n",
styles: [":host .form-check.is-valid~.invalid-feedback,:host .form-check.is-valid~.invalid-tooltip,:host .form-check.is-valid~.valid-feedback,:host .form-check.is-valid~.valid-tooltip,:host .was-validated~.invalid-feedback,:host .was-validated~.invalid-tooltip,:host .was-validated~.valid-feedback,:host .was-validated~.valid-tooltip{display:block}"],
providers: [
{ provide: forms.NG_VALUE_ACCESSOR, useExisting: FormRadioComponent, multi: true },
{ provide: forms.NG_VALIDATORS, useExisting: FormRadioComponent, multi: true }
]
},] },
];
FormRadioComponent.propDecorators = {
listRadioElement: [{ type: core.ViewChild, args: ['listRadioElement',] }]
};
return FormRadioComponent;
}(BaseListControlComponent));
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
var FormSelectComponent = (function (_super) {
__extends(FormSelectComponent, _super);
function FormSelectComponent() {
return _super !== null && _super.apply(this, arguments) || this;
}
Object.defineProperty(FormSelectComponent.prototype, "multiple", {
get: /**
* @return {?}
*/ function () {
return this._multiple;
},
set: /**
* @param {?} value
* @return {?}
*/ function (value) {
this._multiple = value;
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormSelectComponent.prototype, "isEmpty", {
get: /**
* @return {?}
*/ function () {
return !this._selectedIndexes ||
!this._selectedIndexes.length ||
(1 === this._selectedIndexes.length && -1 === this._selectedIndexes[0]);
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormSelectComponent.prototype, "value", {
get: /**
* @return {?}
*/ function () {
var _this = this;
if (this.isEmpty) {
return null;
}
if (this._multiple) {
return this._selectedIndexes.map(function (index) { return _this._selectOptions[index].value; });
}
else {
/** @type {?} */
var index = this._selectedIndexes[0];
return this.selectOptions[index].value;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormSelectComponent.prototype, "invalid", {
get: /**
* @return {?}
*/ function () {
if (this.hasCustomError) {
return true;
}
if (!this.customSelect.touched) {
return false;
}
return this.customSelect.invalid || this.hasRequiredError;
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormSelectComponent.prototype, "valid", {
get: /**
* @return {?}
*/ function () {
if (this.hasCustomError) {
return false;
}
if (!this.customSelect.touched) {
return false;
}
return !this.customSelect.invalid && !this.hasRequiredError;
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormSelectComponent.prototype, "errorMessages", {
get: /**
* @return {?}
*/ function () {
if (this.hasRequiredError) {
return [this.requiredErrorMessage];
}
if (this.hasCustomError) {
return this.innerCustomErrorMessages;
}
},
enumerable: true,
configurable: true
});
/**
* @param {?} value
* @return {?}
*/
FormSelectComponent.prototype.writeValue = /**
* @param {?} value
* @return {?}
*/
function (value) {
if (!this.multiple) {
value = [value];
}
this._selectedIndexes = this.findIndexes(value);
};
/**
* @return {?}
*/
FormSelectComponent.prototype.validate = /**
* @return {?}
*/
function () {
/** @type {?} */
var result = this.customSelect.errors || {};
if (this.hasRequiredError) {
result['required'] = true;
}
else {
delete result['required'];
}
return result;
};
/**
* @return {?}
*/
FormSelectComponent.prototype.reset = /**
* @return {?}
*/
function () {
this.customSelect.reset();
};
FormSelectComponent.decorators = [
{ type: core.Component, args: [{
selector: 'ngx-form-select',
template: "<label *ngIf=\"label\" [for]=\"id\">{{label}}</label>\n\n<!--suppress HtmlFormInputWithoutLabel -->\n<select class=\"form-control\"\n [ngClass]=\"{'is-invalid': invalid, 'is-valid': valid}\"\n [id]=\"id\"\n [title]=\"title\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [multiple]=\"multiple\"\n [(ngModel)]=\"selectedIndexes\"\n #customSelect=\"ngModel\"\n #customSelectElement>\n <option value=\"-1\" *ngIf=\"placeholder\">{{placeholder}}</option>\n <option *ngFor=\"let option of selectOptions; let index = index;\" [value]=\"index\">{{option.text}}</option>\n</select>\n\n<div class=\"valid-feedback\" *ngIf=\"valid && validMessage\">{{validMessage}}</div>\n\n<div class=\"invalid-feedback\" *ngIf=\"invalid\">\n <span *ngFor=\"let message of errorMessages; let last = last;\">\n {{message}}<br *ngIf=\"!last\">\n </span>\n</div>\n",
styles: [""],
providers: [
{ provide: forms.NG_VALUE_ACCESSOR, useExisting: FormSelectComponent, multi: true },
{ provide: forms.NG_VALIDATORS, useExisting: FormSelectComponent, multi: true }
]
},] },
];
FormSelectComponent.propDecorators = {
customSelect: [{ type: core.ViewChild, args: ['customSelect',] }],
customSelectElement: [{ type: core.ViewChild, args: ['customSelectElement',] }],
multiple: [{ type: core.Input }]
};
return FormSelectComponent;
}(BaseListControlComponent));
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
var Common = (function () {
function Common() {
}
/**
* @return {?}
*/
Common.isClient = /**
* @return {?}
*/
function () {
return 'undefined' !== typeof window;
};
/**
* @return {?}
*/
Common.isServer = /**
* @return {?}
*/
function () {
return 'undefined' === typeof window;
};
return Common;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
var FormSelect2Component = (function (_super) {
__extends(FormSelect2Component, _super);
function FormSelect2Component() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this._isTouched = false;
return _this;
}
Object.defineProperty(FormSelect2Component.prototype, "placeholder", {
set: /**
* @param {?} value
* @return {?}
*/ function (value) {
this._placeholder = value;
this.updateSelect2Options();
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormSelect2Component.prototype, "required", {
set: /**
* @param {?} value
* @return {?}
*/ function (value) {
this._required = value;
this.updateSelect2Options();
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormSelect2Component.prototype, "disabled", {
set: /**
* @param {?} value
* @return {?}
*/ function (value) {
this._disabled = value;
this.updateSelect2Options();
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormSelect2Component.prototype, "multiple", {
set: /**
* @param {?} value
* @return {?}
*/ function (value) {
this._multiple = value;
this.updateSelect2Options();
},
enumerable: true,
configurable: true
});
Object.defineProperty(FormSelect2Component.prototype, "tag", {
set: /**
* @param {?} value