@maskito/angular
Version:
The Angular-specific Maskito's library
55 lines • 7.92 kB
JavaScript
import { Directive, ElementRef, inject, Input, NgZone } from '@angular/core';
import { DefaultValueAccessor } from '@angular/forms';
import { Maskito, MASKITO_DEFAULT_ELEMENT_PREDICATE, maskitoTransform, } from '@maskito/core';
import * as i0 from "@angular/core";
class MaskitoDirective {
constructor() {
this.elementRef = inject(ElementRef).nativeElement;
this.ngZone = inject(NgZone);
this.maskedElement = null;
this.options = null;
this.elementPredicate = MASKITO_DEFAULT_ELEMENT_PREDICATE;
const accessor = inject(DefaultValueAccessor, { self: true, optional: true });
if (accessor) {
const original = accessor.writeValue.bind(accessor);
accessor.writeValue = (value) => {
original(this.options
? maskitoTransform(String(value ?? ''), this.options)
: value);
};
}
}
async ngOnChanges() {
const { elementPredicate, options, maskedElement, elementRef, ngZone } = this;
maskedElement?.destroy();
if (!options) {
return;
}
const predicateResult = await elementPredicate(elementRef);
if (this.elementPredicate !== elementPredicate || this.options !== options) {
// Ignore the result of the predicate if the
// maskito element (or its options) has changed before the predicate was resolved.
return;
}
ngZone.runOutsideAngular(() => {
this.maskedElement = new Maskito(predicateResult, options);
});
}
ngOnDestroy() {
this.maskedElement?.destroy();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MaskitoDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: MaskitoDirective, isStandalone: true, selector: "[maskito]", inputs: { options: ["maskito", "options"], elementPredicate: ["maskitoElement", "elementPredicate"] }, usesOnChanges: true, ngImport: i0 }); }
}
export { MaskitoDirective };
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MaskitoDirective, decorators: [{
type: Directive,
args: [{ standalone: true, selector: '[maskito]' }]
}], ctorParameters: function () { return []; }, propDecorators: { options: [{
type: Input,
args: ['maskito']
}], elementPredicate: [{
type: Input,
args: ['maskitoElement']
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWFza2l0by5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyL3NyYy9saWIvbWFza2l0by5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQ0EsT0FBTyxFQUFDLFNBQVMsRUFBRSxVQUFVLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFDM0UsT0FBTyxFQUFDLG9CQUFvQixFQUFDLE1BQU0sZ0JBQWdCLENBQUM7QUFFcEQsT0FBTyxFQUNILE9BQU8sRUFDUCxpQ0FBaUMsRUFDakMsZ0JBQWdCLEdBQ25CLE1BQU0sZUFBZSxDQUFDOztBQUV2QixNQUNhLGdCQUFnQjtJQVd6QjtRQVZpQixlQUFVLEdBQWdCLE1BQU0sQ0FBQyxVQUFVLENBQUMsQ0FBQyxhQUFhLENBQUM7UUFDM0QsV0FBTSxHQUFHLE1BQU0sQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUNqQyxrQkFBYSxHQUFtQixJQUFJLENBQUM7UUFHdEMsWUFBTyxHQUEwQixJQUFJLENBQUM7UUFHdEMscUJBQWdCLEdBQTRCLGlDQUFpQyxDQUFDO1FBR2pGLE1BQU0sUUFBUSxHQUFHLE1BQU0sQ0FBQyxvQkFBb0IsRUFBRSxFQUFDLElBQUksRUFBRSxJQUFJLEVBQUUsUUFBUSxFQUFFLElBQUksRUFBQyxDQUFDLENBQUM7UUFFNUUsSUFBSSxRQUFRLEVBQUU7WUFDVixNQUFNLFFBQVEsR0FBRyxRQUFRLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztZQUVwRCxRQUFRLENBQUMsVUFBVSxHQUFHLENBQUMsS0FBYyxFQUFFLEVBQUU7Z0JBQ3JDLFFBQVEsQ0FDSixJQUFJLENBQUMsT0FBTztvQkFDUixDQUFDLENBQUMsZ0JBQWdCLENBQUMsTUFBTSxDQUFDLEtBQUssSUFBSSxFQUFFLENBQUMsRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDO29CQUNyRCxDQUFDLENBQUMsS0FBSyxDQUNkLENBQUM7WUFDTixDQUFDLENBQUM7U0FDTDtJQUNMLENBQUM7SUFFTSxLQUFLLENBQUMsV0FBVztRQUNwQixNQUFNLEVBQUMsZ0JBQWdCLEVBQUUsT0FBTyxFQUFFLGFBQWEsRUFBRSxVQUFVLEVBQUUsTUFBTSxFQUFDLEdBQUcsSUFBSSxDQUFDO1FBRTVFLGFBQWEsRUFBRSxPQUFPLEVBQUUsQ0FBQztRQUV6QixJQUFJLENBQUMsT0FBTyxFQUFFO1lBQ1YsT0FBTztTQUNWO1FBRUQsTUFBTSxlQUFlLEdBQUcsTUFBTSxnQkFBZ0IsQ0FBQyxVQUFVLENBQUMsQ0FBQztRQUUzRCxJQUFJLElBQUksQ0FBQyxnQkFBZ0IsS0FBSyxnQkFBZ0IsSUFBSSxJQUFJLENBQUMsT0FBTyxLQUFLLE9BQU8sRUFBRTtZQUN4RSw0Q0FBNEM7WUFDNUMsa0ZBQWtGO1lBQ2xGLE9BQU87U0FDVjtRQUVELE1BQU0sQ0FBQyxpQkFBaUIsQ0FBQyxHQUFHLEVBQUU7WUFDMUIsSUFBSSxDQUFDLGFBQWEsR0FBRyxJQUFJLE9BQU8sQ0FBQyxlQUFlLEVBQUUsT0FBTyxDQUFDLENBQUM7UUFDL0QsQ0FBQyxDQUFDLENBQUM7SUFDUCxDQUFDO0lBRU0sV0FBVztRQUNkLElBQUksQ0FBQyxhQUFhLEVBQUUsT0FBTyxFQUFFLENBQUM7SUFDbEMsQ0FBQzsrR0FuRFEsZ0JBQWdCO21HQUFoQixnQkFBZ0I7O1NBQWhCLGdCQUFnQjs0RkFBaEIsZ0JBQWdCO2tCQUQ1QixTQUFTO21CQUFDLEVBQUMsVUFBVSxFQUFFLElBQUksRUFBRSxRQUFRLEVBQUUsV0FBVyxFQUFDOzBFQU96QyxPQUFPO3NCQURiLEtBQUs7dUJBQUMsU0FBUztnQkFJVCxnQkFBZ0I7c0JBRHRCLEtBQUs7dUJBQUMsZ0JBQWdCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHR5cGUge09uQ2hhbmdlcywgT25EZXN0cm95fSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7RGlyZWN0aXZlLCBFbGVtZW50UmVmLCBpbmplY3QsIElucHV0LCBOZ1pvbmV9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtEZWZhdWx0VmFsdWVBY2Nlc3Nvcn0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHR5cGUge01hc2tpdG9FbGVtZW50UHJlZGljYXRlLCBNYXNraXRvT3B0aW9uc30gZnJvbSAnQG1hc2tpdG8vY29yZSc7XG5pbXBvcnQge1xuICAgIE1hc2tpdG8sXG4gICAgTUFTS0lUT19ERUZBVUxUX0VMRU1FTlRfUFJFRElDQVRFLFxuICAgIG1hc2tpdG9UcmFuc2Zvcm0sXG59IGZyb20gJ0BtYXNraXRvL2NvcmUnO1xuXG5ARGlyZWN0aXZlKHtzdGFuZGFsb25lOiB0cnVlLCBzZWxlY3RvcjogJ1ttYXNraXRvXSd9KVxuZXhwb3J0IGNsYXNzIE1hc2tpdG9EaXJlY3RpdmUgaW1wbGVtZW50cyBPbkRlc3Ryb3ksIE9uQ2hhbmdlcyB7XG4gICAgcHJpdmF0ZSByZWFkb25seSBlbGVtZW50UmVmOiBIVE1MRWxlbWVudCA9IGluamVjdChFbGVtZW50UmVmKS5uYXRpdmVFbGVtZW50O1xuICAgIHByaXZhdGUgcmVhZG9ubHkgbmdab25lID0gaW5qZWN0KE5nWm9uZSk7XG4gICAgcHJpdmF0ZSBtYXNrZWRFbGVtZW50OiBNYXNraXRvIHwgbnVsbCA9IG51bGw7XG5cbiAgICBASW5wdXQoJ21hc2tpdG8nKVxuICAgIHB1YmxpYyBvcHRpb25zOiBNYXNraXRvT3B0aW9ucyB8IG51bGwgPSBudWxsO1xuXG4gICAgQElucHV0KCdtYXNraXRvRWxlbWVudCcpXG4gICAgcHVibGljIGVsZW1lbnRQcmVkaWNhdGU6IE1hc2tpdG9FbGVtZW50UHJlZGljYXRlID0gTUFTS0lUT19ERUZBVUxUX0VMRU1FTlRfUFJFRElDQVRFO1xuXG4gICAgY29uc3RydWN0b3IoKSB7XG4gICAgICAgIGNvbnN0IGFjY2Vzc29yID0gaW5qZWN0KERlZmF1bHRWYWx1ZUFjY2Vzc29yLCB7c2VsZjogdHJ1ZSwgb3B0aW9uYWw6IHRydWV9KTtcblxuICAgICAgICBpZiAoYWNjZXNzb3IpIHtcbiAgICAgICAgICAgIGNvbnN0IG9yaWdpbmFsID0gYWNjZXNzb3Iud3JpdGVWYWx1ZS5iaW5kKGFjY2Vzc29yKTtcblxuICAgICAgICAgICAgYWNjZXNzb3Iud3JpdGVWYWx1ZSA9ICh2YWx1ZTogdW5rbm93bikgPT4ge1xuICAgICAgICAgICAgICAgIG9yaWdpbmFsKFxuICAgICAgICAgICAgICAgICAgICB0aGlzLm9wdGlvbnNcbiAgICAgICAgICAgICAgICAgICAgICAgID8gbWFza2l0b1RyYW5zZm9ybShTdHJpbmcodmFsdWUgPz8gJycpLCB0aGlzLm9wdGlvbnMpXG4gICAgICAgICAgICAgICAgICAgICAgICA6IHZhbHVlLFxuICAgICAgICAgICAgICAgICk7XG4gICAgICAgICAgICB9O1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgcHVibGljIGFzeW5jIG5nT25DaGFuZ2VzKCk6IFByb21pc2U8dm9pZD4ge1xuICAgICAgICBjb25zdCB7ZWxlbWVudFByZWRpY2F0ZSwgb3B0aW9ucywgbWFza2VkRWxlbWVudCwgZWxlbWVudFJlZiwgbmdab25lfSA9IHRoaXM7XG5cbiAgICAgICAgbWFza2VkRWxlbWVudD8uZGVzdHJveSgpO1xuXG4gICAgICAgIGlmICghb3B0aW9ucykge1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9XG5cbiAgICAgICAgY29uc3QgcHJlZGljYXRlUmVzdWx0ID0gYXdhaXQgZWxlbWVudFByZWRpY2F0ZShlbGVtZW50UmVmKTtcblxuICAgICAgICBpZiAodGhpcy5lbGVtZW50UHJlZGljYXRlICE9PSBlbGVtZW50UHJlZGljYXRlIHx8IHRoaXMub3B0aW9ucyAhPT0gb3B0aW9ucykge1xuICAgICAgICAgICAgLy8gSWdub3JlIHRoZSByZXN1bHQgb2YgdGhlIHByZWRpY2F0ZSBpZiB0aGVcbiAgICAgICAgICAgIC8vIG1hc2tpdG8gZWxlbWVudCAob3IgaXRzIG9wdGlvbnMpIGhhcyBjaGFuZ2VkIGJlZm9yZSB0aGUgcHJlZGljYXRlIHdhcyByZXNvbHZlZC5cbiAgICAgICAgICAgIHJldHVybjtcbiAgICAgICAgfVxuXG4gICAgICAgIG5nWm9uZS5ydW5PdXRzaWRlQW5ndWxhcigoKSA9PiB7XG4gICAgICAgICAgICB0aGlzLm1hc2tlZEVsZW1lbnQgPSBuZXcgTWFza2l0byhwcmVkaWNhdGVSZXN1bHQsIG9wdGlvbnMpO1xuICAgICAgICB9KTtcbiAgICB9XG5cbiAgICBwdWJsaWMgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgICAgIHRoaXMubWFza2VkRWxlbWVudD8uZGVzdHJveSgpO1xuICAgIH1cbn1cbiJdfQ==