UNPKG

ngx-ui-hero

Version:

Simple, fast and reliable utilities for Angular.

64 lines 12.7 kB
import { Component, Inject, Input, Optional, ViewChild } from '@angular/core'; import { NG_ASYNC_VALIDATORS, NG_VALIDATORS, NG_VALUE_ACCESSOR, NgModel } from '@angular/forms'; import { ElementBase } from '../../base/element-base'; import { INPUT_FORMS_CONFIG } from '../../input-forms-config.constants'; import * as i0 from "@angular/core"; import * as i1 from "@angular/common"; import * as i2 from "@angular/forms"; import * as i3 from "../../../ui/directives/auto-select-on-focus.directive"; import * as i4 from "ngx-bootstrap/tooltip"; import * as i5 from "../input-validations/input-validations.component"; import * as i6 from "../../masking/mask.directive"; let identifier = 0; export class InputTextMaskComponent extends ElementBase { constructor(validators, asyncValidators, config) { super(validators, asyncValidators, config); this.config = config; this.placeholder = ''; this.includeLiterals = false; this.wasTouched = false; this.identifier = `input-text-mask-${identifier++}`; } ngOnInit() { } onTouch() { this.wasTouched = true; } } InputTextMaskComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: InputTextMaskComponent, deps: [{ token: NG_VALIDATORS, optional: true }, { token: NG_ASYNC_VALIDATORS, optional: true }, { token: INPUT_FORMS_CONFIG }], target: i0.ɵɵFactoryTarget.Component }); InputTextMaskComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: InputTextMaskComponent, selector: "input-text-mask", inputs: { placeholder: "placeholder", masking: "masking", includeLiterals: "includeLiterals" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: InputTextMaskComponent, multi: true }], viewQueries: [{ propertyName: "model", first: true, predicate: NgModel, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<label *ngIf=\"label\" [attr.for]=\"identifier\">\n {{label}}\n <span class=\"required-symbol\" *ngIf=\"isRequired\"> *</span>\n <i class=\"fa fa-question-circle ml-2\" tooltip=\"{{help}}\" container=\"body\" *ngIf=\"help\"></i>\n</label>\n\n<input \n type=\"text\" \n class=\"form-control\" \n [disabled]=\"disabled\" \n [placeholder]=\"placeholder\" \n [autocomplete]=\"autocomplete\"\n [mask]=\"masking\"\n [includeLiterals]=\"includeLiterals\"\n [(ngModel)]=\"value\"\n [id]=\"identifier\"\n autoSelectOnFocus\n [ngClass]=\"{\n 'is-valid': showValidations && !disabled && wasTouched && !(invalid | async),\n 'is-invalid': showValidations && !disabled && wasTouched && (invalid | async)\n }\"\n (blur)=\"onTouch()\" />\n\n<small class=\"text-muted\" *ngIf=\"description\">{{description}}</small>\n\n<input-validations\n *ngIf=\"showValidations && !disabled && wasTouched && (invalid | async)\"\n [messages]=\"failures | async\">\n</input-validations>\n ", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.AutoSelectOnFocusDirective, selector: "input[autoSelectOnFocus]" }, { kind: "directive", type: i4.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["containerClass", "tooltipAnimation", "tooltipFadeDuration", "isOpen", "tooltipHtml", "tooltip", "tooltipPlacement", "placement", "tooltipIsOpen", "tooltipEnable", "isDisabled", "tooltipAppendToBody", "container", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "delay", "tooltipTrigger", "triggers", "adaptivePosition"], outputs: ["tooltipChange", "tooltipStateChanged", "onShown", "onHidden"], exportAs: ["bs-tooltip"] }, { kind: "component", type: i5.InputValidationsComponent, selector: "input-validations", inputs: ["messages"] }, { kind: "directive", type: i6.MaskDirective, selector: "[mask]", inputs: ["mask", "promptChar", "includeLiterals", "placeholder", "displayValuePipe", "focusedValuePipe", "dataValue"], outputs: ["onValueChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: InputTextMaskComponent, decorators: [{ type: Component, args: [{ selector: 'input-text-mask', providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: InputTextMaskComponent, multi: true }], template: "<label *ngIf=\"label\" [attr.for]=\"identifier\">\n {{label}}\n <span class=\"required-symbol\" *ngIf=\"isRequired\"> *</span>\n <i class=\"fa fa-question-circle ml-2\" tooltip=\"{{help}}\" container=\"body\" *ngIf=\"help\"></i>\n</label>\n\n<input \n type=\"text\" \n class=\"form-control\" \n [disabled]=\"disabled\" \n [placeholder]=\"placeholder\" \n [autocomplete]=\"autocomplete\"\n [mask]=\"masking\"\n [includeLiterals]=\"includeLiterals\"\n [(ngModel)]=\"value\"\n [id]=\"identifier\"\n autoSelectOnFocus\n [ngClass]=\"{\n 'is-valid': showValidations && !disabled && wasTouched && !(invalid | async),\n 'is-invalid': showValidations && !disabled && wasTouched && (invalid | async)\n }\"\n (blur)=\"onTouch()\" />\n\n<small class=\"text-muted\" *ngIf=\"description\">{{description}}</small>\n\n<input-validations\n *ngIf=\"showValidations && !disabled && wasTouched && (invalid | async)\"\n [messages]=\"failures | async\">\n</input-validations>\n " }] }], ctorParameters: function () { return [{ type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [NG_VALIDATORS] }] }, { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [NG_ASYNC_VALIDATORS] }] }, { type: undefined, decorators: [{ type: Inject, args: [INPUT_FORMS_CONFIG] }] }]; }, propDecorators: { placeholder: [{ type: Input }], masking: [{ type: Input }], includeLiterals: [{ type: Input }], model: [{ type: ViewChild, args: [NgModel, { static: true }] }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQtdGV4dC1tYXNrLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC11aS1oZXJvL3NyYy9saWIvaW5wdXQtZm9ybXMvY29tcG9uZW50cy9pbnB1dC10ZXh0LW1hc2svaW5wdXQtdGV4dC1tYXNrLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC11aS1oZXJvL3NyYy9saWIvaW5wdXQtZm9ybXMvY29tcG9uZW50cy9pbnB1dC10ZXh0LW1hc2svaW5wdXQtdGV4dC1tYXNrLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBVSxRQUFRLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3RGLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxhQUFhLEVBQUUsaUJBQWlCLEVBQUUsT0FBTyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFFaEcsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBR3RELE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLG9DQUFvQyxDQUFDOzs7Ozs7OztBQUV4RSxJQUFJLFVBQVUsR0FBRyxDQUFDLENBQUM7QUFXbkIsTUFBTSxPQUFPLHNCQUF1QixTQUFRLFdBQW1CO0lBVzdELFlBQ3FDLFVBQTBCLEVBQ3BCLGVBQW9DLEVBQ3hDLE1BQXdCO1FBRTdELEtBQUssQ0FBQyxVQUFVLEVBQUUsZUFBZSxFQUFFLE1BQU0sQ0FBQyxDQUFDO1FBRk4sV0FBTSxHQUFOLE1BQU0sQ0FBa0I7UUFiL0MsZ0JBQVcsR0FBRyxFQUFFLENBQUM7UUFFakIsb0JBQWUsR0FBWSxLQUFLLENBQUM7UUFFakQsZUFBVSxHQUFZLEtBQUssQ0FBQztRQUlyQixlQUFVLEdBQUcsbUJBQW1CLFVBQVUsRUFBRSxFQUFFLENBQUM7SUFRdEQsQ0FBQztJQUVELFFBQVE7SUFDUixDQUFDO0lBRUQsT0FBTztRQUNMLElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDO0lBQ3pCLENBQUM7O29IQXhCVSxzQkFBc0Isa0JBWVgsYUFBYSw2QkFDYixtQkFBbUIsNkJBQzlCLGtCQUFrQjt3R0FkbEIsc0JBQXNCLDBJQU50QixDQUFDO1lBQ1YsT0FBTyxFQUFFLGlCQUFpQjtZQUMxQixXQUFXLEVBQUUsc0JBQXNCO1lBQ25DLEtBQUssRUFBRSxJQUFJO1NBQ1osQ0FBQyxpRUFTUyxPQUFPLHFGQzFCcEIsb2dDQTZCRTs0RkRWVyxzQkFBc0I7a0JBVGxDLFNBQVM7K0JBQ0UsaUJBQWlCLGFBRWhCLENBQUM7NEJBQ1YsT0FBTyxFQUFFLGlCQUFpQjs0QkFDMUIsV0FBVyx3QkFBd0I7NEJBQ25DLEtBQUssRUFBRSxJQUFJO3lCQUNaLENBQUM7OzBCQWNDLFFBQVE7OzBCQUFJLE1BQU07MkJBQUMsYUFBYTs7MEJBQ2hDLFFBQVE7OzBCQUFJLE1BQU07MkJBQUMsbUJBQW1COzswQkFDdEMsTUFBTTsyQkFBRSxrQkFBa0I7NENBYmIsV0FBVztzQkFBMUIsS0FBSztnQkFDVSxPQUFPO3NCQUF0QixLQUFLO2dCQUNVLGVBQWU7c0JBQTlCLEtBQUs7Z0JBSThCLEtBQUs7c0JBQXhDLFNBQVM7dUJBQUMsT0FBTyxFQUFFLEVBQUMsTUFBTSxFQUFFLElBQUksRUFBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5qZWN0LCBJbnB1dCwgT25Jbml0LCBPcHRpb25hbCwgVmlld0NoaWxkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBOR19BU1lOQ19WQUxJREFUT1JTLCBOR19WQUxJREFUT1JTLCBOR19WQUxVRV9BQ0NFU1NPUiwgTmdNb2RlbCB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcblxuaW1wb3J0IHsgRWxlbWVudEJhc2UgfSBmcm9tICcuLi8uLi9iYXNlL2VsZW1lbnQtYmFzZSc7XG5pbXBvcnQgeyBBc3luY1ZhbGlkYXRvckFycmF5LCBWYWxpZGF0b3JBcnJheSB9IGZyb20gJy4uLy4uL2Jhc2UvdmFsaWRhdGUnO1xuaW1wb3J0IHsgSW5wdXRGb3Jtc0NvbmZpZyB9IGZyb20gJy4uLy4uL2lucHV0LWZvcm1zLWNvbmZpZyc7XG5pbXBvcnQgeyBJTlBVVF9GT1JNU19DT05GSUcgfSBmcm9tICcuLi8uLi9pbnB1dC1mb3Jtcy1jb25maWcuY29uc3RhbnRzJztcblxubGV0IGlkZW50aWZpZXIgPSAwO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdpbnB1dC10ZXh0LW1hc2snLFxuICB0ZW1wbGF0ZVVybDogJy4vaW5wdXQtdGV4dC1tYXNrLmNvbXBvbmVudC5odG1sJyxcbiAgcHJvdmlkZXJzOiBbe1xuICAgIHByb3ZpZGU6IE5HX1ZBTFVFX0FDQ0VTU09SLFxuICAgIHVzZUV4aXN0aW5nOiBJbnB1dFRleHRNYXNrQ29tcG9uZW50LFxuICAgIG11bHRpOiB0cnVlXG4gIH1dXG59KVxuZXhwb3J0IGNsYXNzIElucHV0VGV4dE1hc2tDb21wb25lbnQgZXh0ZW5kcyBFbGVtZW50QmFzZTxzdHJpbmc+IGltcGxlbWVudHMgT25Jbml0IHtcbiAgQElucHV0KCkgcHVibGljIHBsYWNlaG9sZGVyID0gJyc7XG4gIEBJbnB1dCgpIHB1YmxpYyBtYXNraW5nOiBzdHJpbmc7XG4gIEBJbnB1dCgpIHB1YmxpYyBpbmNsdWRlTGl0ZXJhbHM6IGJvb2xlYW4gPSBmYWxzZTtcblxuICB3YXNUb3VjaGVkOiBib29sZWFuID0gZmFsc2U7XG4gXG4gIEBWaWV3Q2hpbGQoTmdNb2RlbCwge3N0YXRpYzogdHJ1ZX0pIG1vZGVsOiBOZ01vZGVsO1xuICBcbiAgcHVibGljIGlkZW50aWZpZXIgPSBgaW5wdXQtdGV4dC1tYXNrLSR7aWRlbnRpZmllcisrfWA7ICBcbiBcbiAgY29uc3RydWN0b3IoXG4gICAgQE9wdGlvbmFsKCkgQEluamVjdChOR19WQUxJREFUT1JTKSB2YWxpZGF0b3JzOiBWYWxpZGF0b3JBcnJheSxcbiAgICBAT3B0aW9uYWwoKSBASW5qZWN0KE5HX0FTWU5DX1ZBTElEQVRPUlMpIGFzeW5jVmFsaWRhdG9yczogQXN5bmNWYWxpZGF0b3JBcnJheSxcbiAgICBASW5qZWN0KCBJTlBVVF9GT1JNU19DT05GSUcgKSBwdWJsaWMgY29uZmlnOiBJbnB1dEZvcm1zQ29uZmlnXG4gICkge1xuICAgIHN1cGVyKHZhbGlkYXRvcnMsIGFzeW5jVmFsaWRhdG9ycywgY29uZmlnKTtcbiAgfVxuXG4gIG5nT25Jbml0KCkgeyAgICAgICAgXG4gIH1cblxuICBvblRvdWNoKCk6IHZvaWQge1xuICAgIHRoaXMud2FzVG91Y2hlZCA9IHRydWU7XG4gIH1cbiBcbn1cbiIsIjxsYWJlbCAqbmdJZj1cImxhYmVsXCIgW2F0dHIuZm9yXT1cImlkZW50aWZpZXJcIj5cbiAgICB7e2xhYmVsfX1cbiAgICA8c3BhbiBjbGFzcz1cInJlcXVpcmVkLXN5bWJvbFwiICpuZ0lmPVwiaXNSZXF1aXJlZFwiPiAqPC9zcGFuPlxuICAgIDxpIGNsYXNzPVwiZmEgZmEtcXVlc3Rpb24tY2lyY2xlIG1sLTJcIiB0b29sdGlwPVwie3toZWxwfX1cIiBjb250YWluZXI9XCJib2R5XCIgKm5nSWY9XCJoZWxwXCI+PC9pPlxuPC9sYWJlbD5cblxuPGlucHV0IFxuICAgIHR5cGU9XCJ0ZXh0XCIgXG4gICAgY2xhc3M9XCJmb3JtLWNvbnRyb2xcIiBcbiAgICBbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIiBcbiAgICBbcGxhY2Vob2xkZXJdPVwicGxhY2Vob2xkZXJcIiAgXG4gICAgW2F1dG9jb21wbGV0ZV09XCJhdXRvY29tcGxldGVcIlxuICAgIFttYXNrXT1cIm1hc2tpbmdcIlxuICAgIFtpbmNsdWRlTGl0ZXJhbHNdPVwiaW5jbHVkZUxpdGVyYWxzXCJcbiAgICBbKG5nTW9kZWwpXT1cInZhbHVlXCJcbiAgICBbaWRdPVwiaWRlbnRpZmllclwiXG4gICAgYXV0b1NlbGVjdE9uRm9jdXNcbiAgICBbbmdDbGFzc109XCJ7XG4gICAgICAgICdpcy12YWxpZCc6IHNob3dWYWxpZGF0aW9ucyAmJiAhZGlzYWJsZWQgJiYgd2FzVG91Y2hlZCAmJiAhKGludmFsaWQgfCBhc3luYyksXG4gICAgICAgICdpcy1pbnZhbGlkJzogc2hvd1ZhbGlkYXRpb25zICYmICFkaXNhYmxlZCAmJiB3YXNUb3VjaGVkICYmIChpbnZhbGlkIHwgYXN5bmMpXG4gICAgfVwiXG4gICAgKGJsdXIpPVwib25Ub3VjaCgpXCIgLz5cblxuPHNtYWxsIGNsYXNzPVwidGV4dC1tdXRlZFwiICpuZ0lmPVwiZGVzY3JpcHRpb25cIj57e2Rlc2NyaXB0aW9ufX08L3NtYWxsPlxuXG48aW5wdXQtdmFsaWRhdGlvbnNcbiAgICAqbmdJZj1cInNob3dWYWxpZGF0aW9ucyAmJiAhZGlzYWJsZWQgJiYgd2FzVG91Y2hlZCAmJiAoaW52YWxpZCB8IGFzeW5jKVwiXG4gICAgW21lc3NhZ2VzXT1cImZhaWx1cmVzIHwgYXN5bmNcIj5cbjwvaW5wdXQtdmFsaWRhdGlvbnM+XG4gICJdfQ==