@c8y/ngx-components
Version:
Angular modules for Cumulocity IoT applications
36 lines • 8.72 kB
JavaScript
import { Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/forms";
import * as i3 from "./form-group.component";
import * as i4 from "./required-input-placeholder.directive";
import * as i5 from "./min-validation.directive";
import * as i6 from "./input-group-list.component";
import * as i7 from "./input-group-list-container.directive";
import * as i8 from "../i18n/c8y-translate.pipe";
export class IpRangeInputListComponent {
set data(list) {
this.ipRangeList = list;
if (this.ipRangeList.length === 0) {
this.add();
}
}
get data() {
return this.ipRangeList;
}
add() {
this.ipRangeList.push({ ip: '', cidr: undefined });
}
remove(index) {
this.ipRangeList.splice(index, 1);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: IpRangeInputListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: IpRangeInputListComponent, selector: "c8y-ip-range-input-list", inputs: { data: "data" }, ngImport: i0, template: "<c8y-form-group class=\"m-t-8 m-b-8\">\n <ul c8yInputGroupListContainer class=\"list-unstyled\">\n <li class=\"m-b-8\" *ngFor=\"let item of data; let i = index\">\n <c8y-input-group-list [index]=\"i\" (onAdd)=\"add()\" (onRemove)=\"remove($event)\">\n <input\n type=\"text\"\n name=\"ipAddress\"\n class=\"form-control m-r-4\"\n placeholder=\"{{ 'IP range start, e.g.' | translate }} 192.168.0.1\"\n style=\"flex-grow: 2\"\n [(ngModel)]=\"item.ip\"\n [required]=\"true\"\n #ipAddress\n />\n <input\n type=\"number\"\n name=\"cidr\"\n [min]=\"0\"\n class=\"form-control\"\n placeholder=\"{{ 'e.g.' | translate }} 20\"\n [(ngModel)]=\"item.cidr\"\n [required]=\"true\"\n #cidr\n />\n </c8y-input-group-list>\n </li>\n </ul>\n</c8y-form-group>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: i4.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: i5.MinValidationDirective, selector: "[min]", inputs: ["min"] }, { kind: "component", type: i6.InputGroupListComponent, selector: "c8y-input-group-list", inputs: ["plus", "minus", "index"], outputs: ["onRemove", "onAdd"] }, { kind: "directive", type: i7.InputGroupListContainerDirective, selector: "[c8yInputGroupListContainer]" }, { kind: "pipe", type: i8.C8yTranslatePipe, name: "translate" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: IpRangeInputListComponent, decorators: [{
type: Component,
args: [{ selector: 'c8y-ip-range-input-list', template: "<c8y-form-group class=\"m-t-8 m-b-8\">\n <ul c8yInputGroupListContainer class=\"list-unstyled\">\n <li class=\"m-b-8\" *ngFor=\"let item of data; let i = index\">\n <c8y-input-group-list [index]=\"i\" (onAdd)=\"add()\" (onRemove)=\"remove($event)\">\n <input\n type=\"text\"\n name=\"ipAddress\"\n class=\"form-control m-r-4\"\n placeholder=\"{{ 'IP range start, e.g.' | translate }} 192.168.0.1\"\n style=\"flex-grow: 2\"\n [(ngModel)]=\"item.ip\"\n [required]=\"true\"\n #ipAddress\n />\n <input\n type=\"number\"\n name=\"cidr\"\n [min]=\"0\"\n class=\"form-control\"\n placeholder=\"{{ 'e.g.' | translate }} 20\"\n [(ngModel)]=\"item.cidr\"\n [required]=\"true\"\n #cidr\n />\n </c8y-input-group-list>\n </li>\n </ul>\n</c8y-form-group>\n" }]
}], propDecorators: { data: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaXAtcmFuZ2UtaW5wdXQtbGlzdC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb3JlL2Zvcm1zL2lwLXJhbmdlLWlucHV0LWxpc3QuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vY29yZS9mb3Jtcy9pcC1yYW5nZS1pbnB1dC1saXN0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7Ozs7Ozs7O0FBTWpELE1BQU0sT0FBTyx5QkFBeUI7SUFDcEMsSUFDSSxJQUFJLENBQUMsSUFBSTtRQUNYLElBQUksQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDO1FBQ3hCLElBQUksSUFBSSxDQUFDLFdBQVcsQ0FBQyxNQUFNLEtBQUssQ0FBQyxFQUFFLENBQUM7WUFDbEMsSUFBSSxDQUFDLEdBQUcsRUFBRSxDQUFDO1FBQ2IsQ0FBQztJQUNILENBQUM7SUFFRCxJQUFJLElBQUk7UUFDTixPQUFPLElBQUksQ0FBQyxXQUFXLENBQUM7SUFDMUIsQ0FBQztJQUlELEdBQUc7UUFDRCxJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsSUFBSSxFQUFFLFNBQVMsRUFBRSxDQUFDLENBQUM7SUFDckQsQ0FBQztJQUVELE1BQU0sQ0FBQyxLQUFLO1FBQ1YsSUFBSSxDQUFDLFdBQVcsQ0FBQyxNQUFNLENBQUMsS0FBSyxFQUFFLENBQUMsQ0FBQyxDQUFDO0lBQ3BDLENBQUM7K0dBckJVLHlCQUF5QjttR0FBekIseUJBQXlCLHlGQ050QyxzNkJBNEJBOzs0RkR0QmEseUJBQXlCO2tCQUpyQyxTQUFTOytCQUNFLHlCQUF5Qjs4QkFLL0IsSUFBSTtzQkFEUCxLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdjOHktaXAtcmFuZ2UtaW5wdXQtbGlzdCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9pcC1yYW5nZS1pbnB1dC1saXN0LmNvbXBvbmVudC5odG1sJ1xufSlcbmV4cG9ydCBjbGFzcyBJcFJhbmdlSW5wdXRMaXN0Q29tcG9uZW50IHtcbiAgQElucHV0KClcbiAgc2V0IGRhdGEobGlzdCkge1xuICAgIHRoaXMuaXBSYW5nZUxpc3QgPSBsaXN0O1xuICAgIGlmICh0aGlzLmlwUmFuZ2VMaXN0Lmxlbmd0aCA9PT0gMCkge1xuICAgICAgdGhpcy5hZGQoKTtcbiAgICB9XG4gIH1cblxuICBnZXQgZGF0YSgpIHtcbiAgICByZXR1cm4gdGhpcy5pcFJhbmdlTGlzdDtcbiAgfVxuXG4gIGlwUmFuZ2VMaXN0OiBBcnJheTx7IGlwOiBzdHJpbmc7IGNpZHI6IG51bWJlciB9PjtcblxuICBhZGQoKSB7XG4gICAgdGhpcy5pcFJhbmdlTGlzdC5wdXNoKHsgaXA6ICcnLCBjaWRyOiB1bmRlZmluZWQgfSk7XG4gIH1cblxuICByZW1vdmUoaW5kZXgpIHtcbiAgICB0aGlzLmlwUmFuZ2VMaXN0LnNwbGljZShpbmRleCwgMSk7XG4gIH1cbn1cbiIsIjxjOHktZm9ybS1ncm91cCBjbGFzcz1cIm0tdC04IG0tYi04XCI+XG4gIDx1bCBjOHlJbnB1dEdyb3VwTGlzdENvbnRhaW5lciBjbGFzcz1cImxpc3QtdW5zdHlsZWRcIj5cbiAgICA8bGkgY2xhc3M9XCJtLWItOFwiICpuZ0Zvcj1cImxldCBpdGVtIG9mIGRhdGE7IGxldCBpID0gaW5kZXhcIj5cbiAgICAgIDxjOHktaW5wdXQtZ3JvdXAtbGlzdCBbaW5kZXhdPVwiaVwiIChvbkFkZCk9XCJhZGQoKVwiIChvblJlbW92ZSk9XCJyZW1vdmUoJGV2ZW50KVwiPlxuICAgICAgICA8aW5wdXRcbiAgICAgICAgICB0eXBlPVwidGV4dFwiXG4gICAgICAgICAgbmFtZT1cImlwQWRkcmVzc1wiXG4gICAgICAgICAgY2xhc3M9XCJmb3JtLWNvbnRyb2wgbS1yLTRcIlxuICAgICAgICAgIHBsYWNlaG9sZGVyPVwie3sgJ0lQIHJhbmdlIHN0YXJ0LCBlLmcuJyB8IHRyYW5zbGF0ZSB9fSAxOTIuMTY4LjAuMVwiXG4gICAgICAgICAgc3R5bGU9XCJmbGV4LWdyb3c6IDJcIlxuICAgICAgICAgIFsobmdNb2RlbCldPVwiaXRlbS5pcFwiXG4gICAgICAgICAgW3JlcXVpcmVkXT1cInRydWVcIlxuICAgICAgICAgICNpcEFkZHJlc3NcbiAgICAgICAgLz5cbiAgICAgICAgPGlucHV0XG4gICAgICAgICAgdHlwZT1cIm51bWJlclwiXG4gICAgICAgICAgbmFtZT1cImNpZHJcIlxuICAgICAgICAgIFttaW5dPVwiMFwiXG4gICAgICAgICAgY2xhc3M9XCJmb3JtLWNvbnRyb2xcIlxuICAgICAgICAgIHBsYWNlaG9sZGVyPVwie3sgJ2UuZy4nIHwgdHJhbnNsYXRlIH19IDIwXCJcbiAgICAgICAgICBbKG5nTW9kZWwpXT1cIml0ZW0uY2lkclwiXG4gICAgICAgICAgW3JlcXVpcmVkXT1cInRydWVcIlxuICAgICAgICAgICNjaWRyXG4gICAgICAgIC8+XG4gICAgICA8L2M4eS1pbnB1dC1ncm91cC1saXN0PlxuICAgIDwvbGk+XG4gIDwvdWw+XG48L2M4eS1mb3JtLWdyb3VwPlxuIl19