nmce-directives 0.0.3 → 0.0.8

package/_directives/autofocus.d.ts

@@ -0,0 +1,20 @@
+import { AfterViewInit, DoCheck, ElementRef } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Use as a parametered input parameter in html element.
+ * When used inside a material dialog, this directive may be at odd against the autofocus config parameter of MatDialogConfig,
+ * if the autofocus config is not false. Generally speaking, no need to use this directive in a component presented in a mateiral dialog.
+ */
+export declare class AutofocusDirective implements AfterViewInit, DoCheck {
+    private el;
+    private toFocus;
+    private focused;
+    private initialised;
+    private everFocused;
+    constructor(el: ElementRef);
+    ngAfterViewInit(): void;
+    ngDoCheck(): void;
+    set autofocus(condition: boolean);
+    static ɵfac: i0.ɵɵFactoryDeclaration<AutofocusDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<AutofocusDirective, "[autofocus]", never, { "autofocus": "autofocus"; }, {}, never>;
+}

package/_directives/currencyFormatter.directive.d.ts

@@ -0,0 +1,16 @@
+import { ElementRef, OnInit } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Decorate HTML input for inputing and displaying currency. The input type must not be number and should be text only.
+ * If the input type is number, the built-in validator will be fighting against this directive.
+ */
+export declare class CurrencyFormatterDirective implements OnInit {
+    private elementRef;
+    private el;
+    constructor(elementRef: ElementRef);
+    ngOnInit(): void;
+    onFocus(value: string): void;
+    onBlur(value: string): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CurrencyFormatterDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CurrencyFormatterDirective, "[currencyFormatter]", never, {}, {}, never>;
+}

package/_directives/dataComponent.directive.d.ts

@@ -0,0 +1,8 @@
+import { ViewContainerRef } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class DataComponentDirective {
+    viewContainerRef: ViewContainerRef;
+    constructor(viewContainerRef: ViewContainerRef);
+    static ɵfac: i0.ɵɵFactoryDeclaration<DataComponentDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DataComponentDirective, "[dataComponentHost]", never, {}, {}, never>;
+}

package/_directives/directives.module.d.ts

@@ -0,0 +1,16 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./autofocus";
+import * as i2 from "./currencyFormatter.directive";
+import * as i3 from "./scrollInto.directive";
+import * as i4 from "./dataComponent.directive";
+import * as i5 from "@angular/common";
+import * as i6 from "@angular/forms";
+/**
+ * Contain components. Other feature/lazy modules that need to access custom html element of components like my-datetimepicker still need to import this module explicitly.
+ *
+ */
+export declare class NmceDirectivesModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<NmceDirectivesModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<NmceDirectivesModule, [typeof i1.AutofocusDirective, typeof i2.CurrencyFormatterDirective, typeof i3.ScrollIntoDirective, typeof i4.DataComponentDirective], [typeof i5.CommonModule, typeof i6.FormsModule], [typeof i1.AutofocusDirective, typeof i2.CurrencyFormatterDirective, typeof i3.ScrollIntoDirective, typeof i4.DataComponentDirective]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<NmceDirectivesModule>;
+}

package/_directives/index.d.ts

@@ -0,0 +1,4 @@
+export * from './autofocus';
+export * from './currencyFormatter.directive';
+export * from './dataComponent.directive';
+export * from './scrollInto.directive';

package/_directives/scrollInto.directive.d.ts

@@ -0,0 +1,13 @@
+import { AfterViewInit, ElementRef } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Scroll to element attached. And the element may be an Angular Material component too.
+ */
+export declare class ScrollIntoDirective implements AfterViewInit {
+    private el;
+    constructor(el: ElementRef);
+    scrollInto: boolean;
+    ngAfterViewInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScrollIntoDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ScrollIntoDirective, "[scrollInto]", never, { "scrollInto": "scrollInto"; }, {}, never>;
+}

package/esm2020/_directives/autofocus.mjs

@@ -0,0 +1,46 @@
+import { Directive, Input } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Use as a parametered input parameter in html element.
+ * When used inside a material dialog, this directive may be at odd against the autofocus config parameter of MatDialogConfig,
+ * if the autofocus config is not false. Generally speaking, no need to use this directive in a component presented in a mateiral dialog.
+ */
+export class AutofocusDirective {
+    constructor(el) {
+        this.el = el;
+        this.toFocus = false;
+        this.focused = false;
+        this.initialised = false;
+        this.everFocused = false;
+        //console.debug('autofocusDirective created.');
+    }
+    ngAfterViewInit() {
+        this.initialised = true;
+        this.ngDoCheck();
+    }
+    ngDoCheck() {
+        if (!this.initialised) {
+            return;
+        }
+        if (this.toFocus && !this.everFocused && !this.focused) {
+            this.el.nativeElement.focus();
+            this.focused = true;
+            this.everFocused = true;
+            console.debug('focused now.');
+        }
+    }
+    set autofocus(condition) {
+        this.toFocus = condition !== false;
+    }
+}
+AutofocusDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AutofocusDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+AutofocusDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: AutofocusDirective, selector: "[autofocus]", inputs: { autofocus: "autofocus" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AutofocusDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[autofocus]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { autofocus: [{
+                type: Input
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXV0b2ZvY3VzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbm1jZS1kaXJlY3RpdmVzL3NyYy9fZGlyZWN0aXZlcy9hdXRvZm9jdXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFpQixTQUFTLEVBQXVCLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFFckY7Ozs7R0FJRztBQUlILE1BQU0sT0FBTyxrQkFBa0I7SUFLOUIsWUFBb0IsRUFBYztRQUFkLE9BQUUsR0FBRixFQUFFLENBQVk7UUFKMUIsWUFBTyxHQUFHLEtBQUssQ0FBQztRQUNoQixZQUFPLEdBQUcsS0FBSyxDQUFDO1FBQ2hCLGdCQUFXLEdBQUcsS0FBSyxDQUFDO1FBQ3BCLGdCQUFXLEdBQUcsS0FBSyxDQUFDO1FBRTNCLCtDQUErQztJQUNoRCxDQUFDO0lBRUQsZUFBZTtRQUNkLElBQUksQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDO1FBQ3hCLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQztJQUNsQixDQUFDO0lBRUQsU0FBUztRQUNSLElBQUksQ0FBQyxJQUFJLENBQUMsV0FBVyxFQUFFO1lBQUUsT0FBTztTQUFFO1FBQ2xDLElBQUksSUFBSSxDQUFDLE9BQU8sSUFBSSxDQUFDLElBQUksQ0FBQyxXQUFXLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFO1lBQ3ZELElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLEtBQUssRUFBRSxDQUFDO1lBQzlCLElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDO1lBQ3BCLElBQUksQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDO1lBQ3hCLE9BQU8sQ0FBQyxLQUFLLENBQUMsY0FBYyxDQUFDLENBQUM7U0FDOUI7SUFDRixDQUFDO0lBRUQsSUFBYSxTQUFTLENBQUMsU0FBa0I7UUFDeEMsSUFBSSxDQUFDLE9BQU8sR0FBRyxTQUFTLEtBQUssS0FBSyxDQUFDO0lBQ3BDLENBQUM7OytHQTFCVyxrQkFBa0I7bUdBQWxCLGtCQUFrQjsyRkFBbEIsa0JBQWtCO2tCQUg5QixTQUFTO21CQUFDO29CQUNWLFFBQVEsRUFBRSxhQUFhO2lCQUN2QjtpR0F5QmEsU0FBUztzQkFBckIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEFmdGVyVmlld0luaXQsIERpcmVjdGl2ZSwgRG9DaGVjaywgRWxlbWVudFJlZiwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuXHJcbi8qKlxyXG4gKiBVc2UgYXMgYSBwYXJhbWV0ZXJlZCBpbnB1dCBwYXJhbWV0ZXIgaW4gaHRtbCBlbGVtZW50LlxyXG4gKiBXaGVuIHVzZWQgaW5zaWRlIGEgbWF0ZXJpYWwgZGlhbG9nLCB0aGlzIGRpcmVjdGl2ZSBtYXkgYmUgYXQgb2RkIGFnYWluc3QgdGhlIGF1dG9mb2N1cyBjb25maWcgcGFyYW1ldGVyIG9mIE1hdERpYWxvZ0NvbmZpZywgXHJcbiAqIGlmIHRoZSBhdXRvZm9jdXMgY29uZmlnIGlzIG5vdCBmYWxzZS4gR2VuZXJhbGx5IHNwZWFraW5nLCBubyBuZWVkIHRvIHVzZSB0aGlzIGRpcmVjdGl2ZSBpbiBhIGNvbXBvbmVudCBwcmVzZW50ZWQgaW4gYSBtYXRlaXJhbCBkaWFsb2cuXHJcbiAqL1xyXG5ARGlyZWN0aXZlKHtcclxuXHRzZWxlY3RvcjogJ1thdXRvZm9jdXNdJ1xyXG59KVxyXG5leHBvcnQgY2xhc3MgQXV0b2ZvY3VzRGlyZWN0aXZlIGltcGxlbWVudHMgQWZ0ZXJWaWV3SW5pdCwgRG9DaGVjayB7XHJcblx0cHJpdmF0ZSB0b0ZvY3VzID0gZmFsc2U7XHJcblx0cHJpdmF0ZSBmb2N1c2VkID0gZmFsc2U7XHJcblx0cHJpdmF0ZSBpbml0aWFsaXNlZCA9IGZhbHNlO1xyXG5cdHByaXZhdGUgZXZlckZvY3VzZWQgPSBmYWxzZTtcclxuXHRjb25zdHJ1Y3Rvcihwcml2YXRlIGVsOiBFbGVtZW50UmVmKSB7XHJcblx0XHQvL2NvbnNvbGUuZGVidWcoJ2F1dG9mb2N1c0RpcmVjdGl2ZSBjcmVhdGVkLicpO1xyXG5cdH1cclxuXHJcblx0bmdBZnRlclZpZXdJbml0KCkge1xyXG5cdFx0dGhpcy5pbml0aWFsaXNlZCA9IHRydWU7XHJcblx0XHR0aGlzLm5nRG9DaGVjaygpO1xyXG5cdH1cclxuXHJcblx0bmdEb0NoZWNrKCkge1xyXG5cdFx0aWYgKCF0aGlzLmluaXRpYWxpc2VkKSB7IHJldHVybjsgfVxyXG5cdFx0aWYgKHRoaXMudG9Gb2N1cyAmJiAhdGhpcy5ldmVyRm9jdXNlZCAmJiAhdGhpcy5mb2N1c2VkKSB7XHJcblx0XHRcdHRoaXMuZWwubmF0aXZlRWxlbWVudC5mb2N1cygpO1xyXG5cdFx0XHR0aGlzLmZvY3VzZWQgPSB0cnVlO1xyXG5cdFx0XHR0aGlzLmV2ZXJGb2N1c2VkID0gdHJ1ZTtcclxuXHRcdFx0Y29uc29sZS5kZWJ1ZygnZm9jdXNlZCBub3cuJyk7XHJcblx0XHR9XHJcblx0fVxyXG5cclxuXHRASW5wdXQoKSBzZXQgYXV0b2ZvY3VzKGNvbmRpdGlvbjogYm9vbGVhbikge1xyXG5cdFx0dGhpcy50b0ZvY3VzID0gY29uZGl0aW9uICE9PSBmYWxzZTtcclxuXHR9XHJcbn1cclxuIl19

package/esm2020/_directives/currencyFormatter.directive.mjs

@@ -0,0 +1,35 @@
+import { Directive, HostListener } from '@angular/core';
+import { CurrencyFunc } from 'nmce-func';
+import * as i0 from "@angular/core";
+/**
+ * Decorate HTML input for inputing and displaying currency. The input type must not be number and should be text only.
+ * If the input type is number, the built-in validator will be fighting against this directive.
+ */
+export class CurrencyFormatterDirective {
+    constructor(elementRef) {
+        this.elementRef = elementRef;
+        this.el = this.elementRef.nativeElement;
+    }
+    ngOnInit() {
+        this.el.value = CurrencyFunc.transformCurrency(this.el.value);
+    }
+    onFocus(value) {
+        this.el.value = CurrencyFunc.parseCurrency(value); // opossite of transform
+    }
+    onBlur(value) {
+        this.el.value = CurrencyFunc.transformCurrency(value);
+    }
+}
+CurrencyFormatterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: CurrencyFormatterDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+CurrencyFormatterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: CurrencyFormatterDirective, selector: "[currencyFormatter]", host: { listeners: { "focus": "onFocus($event.target.value)", "blur": "onBlur($event.target.value)" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: CurrencyFormatterDirective, decorators: [{
+            type: Directive,
+            args: [{ selector: '[currencyFormatter]' }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { onFocus: [{
+                type: HostListener,
+                args: ['focus', ['$event.target.value']]
+            }], onBlur: [{
+                type: HostListener,
+                args: ['blur', ['$event.target.value']]
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3VycmVuY3lGb3JtYXR0ZXIuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbm1jZS1kaXJlY3RpdmVzL3NyYy9fZGlyZWN0aXZlcy9jdXJyZW5jeUZvcm1hdHRlci5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBYyxZQUFZLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFDNUUsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLFdBQVcsQ0FBQzs7QUFFekM7OztHQUdHO0FBRUgsTUFBTSxPQUFPLDBCQUEwQjtJQUl0QyxZQUFvQixVQUFzQjtRQUF0QixlQUFVLEdBQVYsVUFBVSxDQUFZO1FBQ3pDLElBQUksQ0FBQyxFQUFFLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUM7SUFDekMsQ0FBQztJQUVELFFBQVE7UUFDUCxJQUFJLENBQUMsRUFBRSxDQUFDLEtBQUssR0FBRyxZQUFZLENBQUMsaUJBQWlCLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUMvRCxDQUFDO0lBR0QsT0FBTyxDQUFDLEtBQWE7UUFDcEIsSUFBSSxDQUFDLEVBQUUsQ0FBQyxLQUFLLEdBQUcsWUFBWSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLHdCQUF3QjtJQUM1RSxDQUFDO0lBR0QsTUFBTSxDQUFDLEtBQWE7UUFDbkIsSUFBSSxDQUFDLEVBQUUsQ0FBQyxLQUFLLEdBQUcsWUFBWSxDQUFDLGlCQUFpQixDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ3ZELENBQUM7O3VIQXBCVywwQkFBMEI7MkdBQTFCLDBCQUEwQjsyRkFBMUIsMEJBQTBCO2tCQUR0QyxTQUFTO21CQUFDLEVBQUUsUUFBUSxFQUFFLHFCQUFxQixFQUFFO2lHQWM3QyxPQUFPO3NCQUROLFlBQVk7dUJBQUMsT0FBTyxFQUFFLENBQUMscUJBQXFCLENBQUM7Z0JBTTlDLE1BQU07c0JBREwsWUFBWTt1QkFBQyxNQUFNLEVBQUUsQ0FBQyxxQkFBcUIsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSG9zdExpc3RlbmVyLCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgQ3VycmVuY3lGdW5jIH0gZnJvbSAnbm1jZS1mdW5jJztcclxuXHJcbi8qKlxyXG4gKiBEZWNvcmF0ZSBIVE1MIGlucHV0IGZvciBpbnB1dGluZyBhbmQgZGlzcGxheWluZyBjdXJyZW5jeS4gVGhlIGlucHV0IHR5cGUgbXVzdCBub3QgYmUgbnVtYmVyIGFuZCBzaG91bGQgYmUgdGV4dCBvbmx5LlxyXG4gKiBJZiB0aGUgaW5wdXQgdHlwZSBpcyBudW1iZXIsIHRoZSBidWlsdC1pbiB2YWxpZGF0b3Igd2lsbCBiZSBmaWdodGluZyBhZ2FpbnN0IHRoaXMgZGlyZWN0aXZlLlxyXG4gKi9cclxuQERpcmVjdGl2ZSh7IHNlbGVjdG9yOiAnW2N1cnJlbmN5Rm9ybWF0dGVyXScgfSkvL2luc3BpcmVkIGJ5IGh0dHBzOi8vYmxvZy5uZ2NvbnN1bHRhbnQuaW8vY3VzdG9tLWlucHV0LWZvcm1hdHRpbmctd2l0aC1zaW1wbGUtZGlyZWN0aXZlcy1mb3ItYW5ndWxhci0yLWVjNzkyMDgyOTc2XHJcbmV4cG9ydCBjbGFzcyBDdXJyZW5jeUZvcm1hdHRlckRpcmVjdGl2ZSBpbXBsZW1lbnRzIE9uSW5pdCB7XHJcblxyXG5cdHByaXZhdGUgZWw6IEhUTUxJbnB1dEVsZW1lbnQ7XHJcblxyXG5cdGNvbnN0cnVjdG9yKHByaXZhdGUgZWxlbWVudFJlZjogRWxlbWVudFJlZikge1xyXG5cdFx0dGhpcy5lbCA9IHRoaXMuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50O1xyXG5cdH1cclxuXHJcblx0bmdPbkluaXQoKSB7XHJcblx0XHR0aGlzLmVsLnZhbHVlID0gQ3VycmVuY3lGdW5jLnRyYW5zZm9ybUN1cnJlbmN5KHRoaXMuZWwudmFsdWUpO1xyXG5cdH1cclxuXHJcblx0QEhvc3RMaXN0ZW5lcignZm9jdXMnLCBbJyRldmVudC50YXJnZXQudmFsdWUnXSlcclxuXHRvbkZvY3VzKHZhbHVlOiBzdHJpbmcpIHtcclxuXHRcdHRoaXMuZWwudmFsdWUgPSBDdXJyZW5jeUZ1bmMucGFyc2VDdXJyZW5jeSh2YWx1ZSk7IC8vIG9wb3NzaXRlIG9mIHRyYW5zZm9ybVxyXG5cdH1cclxuXHJcblx0QEhvc3RMaXN0ZW5lcignYmx1cicsIFsnJGV2ZW50LnRhcmdldC52YWx1ZSddKVxyXG5cdG9uQmx1cih2YWx1ZTogc3RyaW5nKSB7XHJcblx0XHR0aGlzLmVsLnZhbHVlID0gQ3VycmVuY3lGdW5jLnRyYW5zZm9ybUN1cnJlbmN5KHZhbHVlKTtcclxuXHR9XHJcblxyXG59XHJcblxyXG4iXX0=

package/esm2020/_directives/dataComponent.directive.mjs

@@ -0,0 +1,16 @@
+import { Directive } from '@angular/core';
+import * as i0 from "@angular/core";
+export class DataComponentDirective {
+    constructor(viewContainerRef) {
+        this.viewContainerRef = viewContainerRef;
+    }
+}
+DataComponentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: DataComponentDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
+DataComponentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: DataComponentDirective, selector: "[dataComponentHost]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: DataComponentDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[dataComponentHost]',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0YUNvbXBvbmVudC5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9ubWNlLWRpcmVjdGl2ZXMvc3JjL19kaXJlY3RpdmVzL2RhdGFDb21wb25lbnQuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQW9CLE1BQU0sZUFBZSxDQUFDOztBQUs1RCxNQUFNLE9BQU8sc0JBQXNCO0lBQ2xDLFlBQW1CLGdCQUFrQztRQUFsQyxxQkFBZ0IsR0FBaEIsZ0JBQWdCLENBQWtCO0lBQUksQ0FBQzs7bUhBRDlDLHNCQUFzQjt1R0FBdEIsc0JBQXNCOzJGQUF0QixzQkFBc0I7a0JBSGxDLFNBQVM7bUJBQUM7b0JBQ1YsUUFBUSxFQUFFLHFCQUFxQjtpQkFDL0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEaXJlY3RpdmUsIFZpZXdDb250YWluZXJSZWYgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuXHJcbkBEaXJlY3RpdmUoe1xyXG5cdHNlbGVjdG9yOiAnW2RhdGFDb21wb25lbnRIb3N0XScsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBEYXRhQ29tcG9uZW50RGlyZWN0aXZlIHtcclxuXHRjb25zdHJ1Y3RvcihwdWJsaWMgdmlld0NvbnRhaW5lclJlZjogVmlld0NvbnRhaW5lclJlZikgeyB9XHJcbn1cclxuIl19

package/esm2020/_directives/directives.module.mjs

@@ -0,0 +1,46 @@
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+import { AutofocusDirective, CurrencyFormatterDirective, DataComponentDirective, ScrollIntoDirective } from './index';
+import * as i0 from "@angular/core";
+/**
+ * Contain components. Other feature/lazy modules that need to access custom html element of components like my-datetimepicker still need to import this module explicitly.
+ *
+ */
+export class NmceDirectivesModule {
+}
+NmceDirectivesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: NmceDirectivesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NmceDirectivesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: NmceDirectivesModule, declarations: [AutofocusDirective,
+        CurrencyFormatterDirective,
+        ScrollIntoDirective,
+        DataComponentDirective], imports: [CommonModule,
+        FormsModule], exports: [AutofocusDirective,
+        CurrencyFormatterDirective,
+        ScrollIntoDirective,
+        DataComponentDirective] });
+NmceDirectivesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: NmceDirectivesModule, imports: [[
+            CommonModule,
+            FormsModule,
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: NmceDirectivesModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        FormsModule,
+                    ],
+                    declarations: [
+                        AutofocusDirective,
+                        CurrencyFormatterDirective,
+                        ScrollIntoDirective,
+                        DataComponentDirective,
+                    ],
+                    exports: [
+                        AutofocusDirective,
+                        CurrencyFormatterDirective,
+                        ScrollIntoDirective,
+                        DataComponentDirective,
+                    ]
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGlyZWN0aXZlcy5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9ubWNlLWRpcmVjdGl2ZXMvc3JjL19kaXJlY3RpdmVzL2RpcmVjdGl2ZXMubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3pDLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUM3QyxPQUFPLEVBQ04sa0JBQWtCLEVBQUUsMEJBQTBCLEVBQUUsc0JBQXNCLEVBQUUsbUJBQW1CLEVBQzNGLE1BQU0sU0FBUyxDQUFDOztBQUlqQjs7O0dBR0c7QUFzQkgsTUFBTSxPQUFPLG9CQUFvQjs7aUhBQXBCLG9CQUFvQjtrSEFBcEIsb0JBQW9CLGlCQWQvQixrQkFBa0I7UUFDbEIsMEJBQTBCO1FBQzFCLG1CQUFtQjtRQUNuQixzQkFBc0IsYUFSdEIsWUFBWTtRQUNaLFdBQVcsYUFZWCxrQkFBa0I7UUFDbEIsMEJBQTBCO1FBQzFCLG1CQUFtQjtRQUNuQixzQkFBc0I7a0hBR1gsb0JBQW9CLFlBcEJ2QjtZQUNSLFlBQVk7WUFDWixXQUFXO1NBQ1g7MkZBaUJXLG9CQUFvQjtrQkFyQmhDLFFBQVE7bUJBQUM7b0JBQ1QsT0FBTyxFQUFFO3dCQUNSLFlBQVk7d0JBQ1osV0FBVztxQkFDWDtvQkFFRCxZQUFZLEVBQUU7d0JBQ2Isa0JBQWtCO3dCQUNsQiwwQkFBMEI7d0JBQzFCLG1CQUFtQjt3QkFDbkIsc0JBQXNCO3FCQUN0QjtvQkFHRCxPQUFPLEVBQUU7d0JBQ1Isa0JBQWtCO3dCQUNsQiwwQkFBMEI7d0JBQzFCLG1CQUFtQjt3QkFDbkIsc0JBQXNCO3FCQUN0QjtpQkFDRCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcbmltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IEZvcm1zTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xyXG5pbXBvcnQge1xyXG5cdEF1dG9mb2N1c0RpcmVjdGl2ZSwgQ3VycmVuY3lGb3JtYXR0ZXJEaXJlY3RpdmUsIERhdGFDb21wb25lbnREaXJlY3RpdmUsIFNjcm9sbEludG9EaXJlY3RpdmVcclxufSBmcm9tICcuL2luZGV4JztcclxuXHJcblxyXG5cclxuLyoqXHJcbiAqIENvbnRhaW4gY29tcG9uZW50cy4gT3RoZXIgZmVhdHVyZS9sYXp5IG1vZHVsZXMgdGhhdCBuZWVkIHRvIGFjY2VzcyBjdXN0b20gaHRtbCBlbGVtZW50IG9mIGNvbXBvbmVudHMgbGlrZSBteS1kYXRldGltZXBpY2tlciBzdGlsbCBuZWVkIHRvIGltcG9ydCB0aGlzIG1vZHVsZSBleHBsaWNpdGx5LlxyXG4gKlxyXG4gKi9cclxuQE5nTW9kdWxlKHtcclxuXHRpbXBvcnRzOiBbXHJcblx0XHRDb21tb25Nb2R1bGUsXHJcblx0XHRGb3Jtc01vZHVsZSxcclxuXHRdLFxyXG5cclxuXHRkZWNsYXJhdGlvbnM6IFtcclxuXHRcdEF1dG9mb2N1c0RpcmVjdGl2ZSxcclxuXHRcdEN1cnJlbmN5Rm9ybWF0dGVyRGlyZWN0aXZlLFxyXG5cdFx0U2Nyb2xsSW50b0RpcmVjdGl2ZSxcclxuXHRcdERhdGFDb21wb25lbnREaXJlY3RpdmUsXHJcblx0XSxcclxuXHJcblxyXG5cdGV4cG9ydHM6IFtcclxuXHRcdEF1dG9mb2N1c0RpcmVjdGl2ZSxcclxuXHRcdEN1cnJlbmN5Rm9ybWF0dGVyRGlyZWN0aXZlLFxyXG5cdFx0U2Nyb2xsSW50b0RpcmVjdGl2ZSxcclxuXHRcdERhdGFDb21wb25lbnREaXJlY3RpdmUsXHJcblx0XVxyXG59KVxyXG5leHBvcnQgY2xhc3MgTm1jZURpcmVjdGl2ZXNNb2R1bGUgeyB9XHJcbiJdfQ==

package/esm2020/_directives/index.mjs

@@ -0,0 +1,5 @@
+export * from './autofocus';
+export * from './currencyFormatter.directive';
+export * from './dataComponent.directive';
+export * from './scrollInto.directive';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9ubWNlLWRpcmVjdGl2ZXMvc3JjL19kaXJlY3RpdmVzL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsYUFBYSxDQUFDO0FBQzVCLGNBQWMsK0JBQStCLENBQUM7QUFDOUMsY0FBYywyQkFBMkIsQ0FBQztBQUMxQyxjQUFjLHdCQUF3QixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0ICogZnJvbSAnLi9hdXRvZm9jdXMnO1xyXG5leHBvcnQgKiBmcm9tICcuL2N1cnJlbmN5Rm9ybWF0dGVyLmRpcmVjdGl2ZSc7XHJcbmV4cG9ydCAqIGZyb20gJy4vZGF0YUNvbXBvbmVudC5kaXJlY3RpdmUnO1xyXG5leHBvcnQgKiBmcm9tICcuL3Njcm9sbEludG8uZGlyZWN0aXZlJztcclxuIl19

package/esm2020/_directives/scrollInto.directive.mjs

@@ -0,0 +1,28 @@
+import { Directive, Input } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Scroll to element attached. And the element may be an Angular Material component too.
+ */
+export class ScrollIntoDirective {
+    constructor(el) {
+        this.el = el;
+        this.scrollInto = false;
+        //	console.debug('ScrollIntoDirective created.');
+    }
+    ngAfterViewInit() {
+        if (this.scrollInto) {
+            this.el.nativeElement.scrollIntoView();
+        }
+    }
+}
+ScrollIntoDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ScrollIntoDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+ScrollIntoDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: ScrollIntoDirective, selector: "[scrollInto]", inputs: { scrollInto: "scrollInto" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ScrollIntoDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[scrollInto]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { scrollInto: [{
+                type: Input
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2Nyb2xsSW50by5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9ubWNlLWRpcmVjdGl2ZXMvc3JjL19kaXJlY3RpdmVzL3Njcm9sbEludG8uZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBaUIsU0FBUyxFQUFjLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFFNUU7O0dBRUc7QUFJSCxNQUFNLE9BQU8sbUJBQW1CO0lBQy9CLFlBQW9CLEVBQWM7UUFBZCxPQUFFLEdBQUYsRUFBRSxDQUFZO1FBS2xDLGVBQVUsR0FBWSxLQUFLLENBQUM7UUFKM0IsaURBQWlEO0lBQ2xELENBQUM7SUFLRCxlQUFlO1FBQ2QsSUFBSSxJQUFJLENBQUMsVUFBVSxFQUFFO1lBQ3BCLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLGNBQWMsRUFBRSxDQUFDO1NBQ3ZDO0lBQ0YsQ0FBQzs7Z0hBWlcsbUJBQW1CO29HQUFuQixtQkFBbUI7MkZBQW5CLG1CQUFtQjtrQkFIL0IsU0FBUzttQkFBQztvQkFDVixRQUFRLEVBQUUsY0FBYztpQkFDeEI7aUdBT0EsVUFBVTtzQkFEVCxLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQWZ0ZXJWaWV3SW5pdCwgRGlyZWN0aXZlLCBFbGVtZW50UmVmLCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5cclxuLyoqXHJcbiAqIFNjcm9sbCB0byBlbGVtZW50IGF0dGFjaGVkLiBBbmQgdGhlIGVsZW1lbnQgbWF5IGJlIGFuIEFuZ3VsYXIgTWF0ZXJpYWwgY29tcG9uZW50IHRvby5cclxuICovXHJcbkBEaXJlY3RpdmUoe1xyXG5cdHNlbGVjdG9yOiAnW3Njcm9sbEludG9dJ1xyXG59KVxyXG5leHBvcnQgY2xhc3MgU2Nyb2xsSW50b0RpcmVjdGl2ZSBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQge1xyXG5cdGNvbnN0cnVjdG9yKHByaXZhdGUgZWw6IEVsZW1lbnRSZWYpIHtcclxuXHRcdC8vXHRjb25zb2xlLmRlYnVnKCdTY3JvbGxJbnRvRGlyZWN0aXZlIGNyZWF0ZWQuJyk7XHJcblx0fVxyXG5cclxuXHRASW5wdXQoKVxyXG5cdHNjcm9sbEludG86IGJvb2xlYW4gPSBmYWxzZTtcclxuXHJcblx0bmdBZnRlclZpZXdJbml0KCkge1xyXG5cdFx0aWYgKHRoaXMuc2Nyb2xsSW50bykge1xyXG5cdFx0XHR0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuc2Nyb2xsSW50b1ZpZXcoKTtcclxuXHRcdH1cclxuXHR9XHJcbn1cclxuIl19

package/esm2020/nmce-directives.mjs

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './public-api';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibm1jZS1kaXJlY3RpdmVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vcHJvamVjdHMvbm1jZS1kaXJlY3RpdmVzL3NyYy9ubWNlLWRpcmVjdGl2ZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLGNBQWMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9wdWJsaWMtYXBpJztcbiJdfQ==

package/esm2020/public-api.mjs

@@ -0,0 +1,6 @@
+/*
+ * Public API Surface of nmce-directives
+ */
+export * from './_directives/index';
+export * from './_directives/directives.module';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL25tY2UtZGlyZWN0aXZlcy9zcmMvcHVibGljLWFwaS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMscUJBQXFCLENBQUM7QUFDcEMsY0FBYyxpQ0FBaUMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBQdWJsaWMgQVBJIFN1cmZhY2Ugb2Ygbm1jZS1kaXJlY3RpdmVzXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9fZGlyZWN0aXZlcy9pbmRleCc7XG5leHBvcnQgKiBmcm9tICcuL19kaXJlY3RpdmVzL2RpcmVjdGl2ZXMubW9kdWxlJztcblxuIl19

package/fesm2015/nmce-directives.mjs

@@ -0,0 +1,173 @@
+import * as i0 from '@angular/core';
+import { Directive, Input, HostListener, NgModule } from '@angular/core';
+import { CurrencyFunc } from 'nmce-func';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+/**
+ * Use as a parametered input parameter in html element.
+ * When used inside a material dialog, this directive may be at odd against the autofocus config parameter of MatDialogConfig,
+ * if the autofocus config is not false. Generally speaking, no need to use this directive in a component presented in a mateiral dialog.
+ */
+class AutofocusDirective {
+    constructor(el) {
+        this.el = el;
+        this.toFocus = false;
+        this.focused = false;
+        this.initialised = false;
+        this.everFocused = false;
+        //console.debug('autofocusDirective created.');
+    }
+    ngAfterViewInit() {
+        this.initialised = true;
+        this.ngDoCheck();
+    }
+    ngDoCheck() {
+        if (!this.initialised) {
+            return;
+        }
+        if (this.toFocus && !this.everFocused && !this.focused) {
+            this.el.nativeElement.focus();
+            this.focused = true;
+            this.everFocused = true;
+            console.debug('focused now.');
+        }
+    }
+    set autofocus(condition) {
+        this.toFocus = condition !== false;
+    }
+}
+AutofocusDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AutofocusDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+AutofocusDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: AutofocusDirective, selector: "[autofocus]", inputs: { autofocus: "autofocus" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AutofocusDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[autofocus]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { autofocus: [{
+                type: Input
+            }] } });
+
+/**
+ * Decorate HTML input for inputing and displaying currency. The input type must not be number and should be text only.
+ * If the input type is number, the built-in validator will be fighting against this directive.
+ */
+class CurrencyFormatterDirective {
+    constructor(elementRef) {
+        this.elementRef = elementRef;
+        this.el = this.elementRef.nativeElement;
+    }
+    ngOnInit() {
+        this.el.value = CurrencyFunc.transformCurrency(this.el.value);
+    }
+    onFocus(value) {
+        this.el.value = CurrencyFunc.parseCurrency(value); // opossite of transform
+    }
+    onBlur(value) {
+        this.el.value = CurrencyFunc.transformCurrency(value);
+    }
+}
+CurrencyFormatterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: CurrencyFormatterDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+CurrencyFormatterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: CurrencyFormatterDirective, selector: "[currencyFormatter]", host: { listeners: { "focus": "onFocus($event.target.value)", "blur": "onBlur($event.target.value)" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: CurrencyFormatterDirective, decorators: [{
+            type: Directive,
+            args: [{ selector: '[currencyFormatter]' }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { onFocus: [{
+                type: HostListener,
+                args: ['focus', ['$event.target.value']]
+            }], onBlur: [{
+                type: HostListener,
+                args: ['blur', ['$event.target.value']]
+            }] } });
+
+class DataComponentDirective {
+    constructor(viewContainerRef) {
+        this.viewContainerRef = viewContainerRef;
+    }
+}
+DataComponentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: DataComponentDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
+DataComponentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: DataComponentDirective, selector: "[dataComponentHost]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: DataComponentDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[dataComponentHost]',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; } });
+
+/**
+ * Scroll to element attached. And the element may be an Angular Material component too.
+ */
+class ScrollIntoDirective {
+    constructor(el) {
+        this.el = el;
+        this.scrollInto = false;
+        //	console.debug('ScrollIntoDirective created.');
+    }
+    ngAfterViewInit() {
+        if (this.scrollInto) {
+            this.el.nativeElement.scrollIntoView();
+        }
+    }
+}
+ScrollIntoDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ScrollIntoDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+ScrollIntoDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: ScrollIntoDirective, selector: "[scrollInto]", inputs: { scrollInto: "scrollInto" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ScrollIntoDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[scrollInto]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { scrollInto: [{
+                type: Input
+            }] } });
+
+/**
+ * Contain components. Other feature/lazy modules that need to access custom html element of components like my-datetimepicker still need to import this module explicitly.
+ *
+ */
+class NmceDirectivesModule {
+}
+NmceDirectivesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: NmceDirectivesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NmceDirectivesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: NmceDirectivesModule, declarations: [AutofocusDirective,
+        CurrencyFormatterDirective,
+        ScrollIntoDirective,
+        DataComponentDirective], imports: [CommonModule,
+        FormsModule], exports: [AutofocusDirective,
+        CurrencyFormatterDirective,
+        ScrollIntoDirective,
+        DataComponentDirective] });
+NmceDirectivesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: NmceDirectivesModule, imports: [[
+            CommonModule,
+            FormsModule,
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: NmceDirectivesModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        FormsModule,
+                    ],
+                    declarations: [
+                        AutofocusDirective,
+                        CurrencyFormatterDirective,
+                        ScrollIntoDirective,
+                        DataComponentDirective,
+                    ],
+                    exports: [
+                        AutofocusDirective,
+                        CurrencyFormatterDirective,
+                        ScrollIntoDirective,
+                        DataComponentDirective,
+                    ]
+                }]
+        }] });
+
+/*
+ * Public API Surface of nmce-directives
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AutofocusDirective, CurrencyFormatterDirective, DataComponentDirective, NmceDirectivesModule, ScrollIntoDirective };
+//# sourceMappingURL=nmce-directives.mjs.map

package/fesm2015/nmce-directives.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"nmce-directives.mjs","sources":["../../../projects/nmce-directives/src/_directives/autofocus.ts","../../../projects/nmce-directives/src/_directives/currencyFormatter.directive.ts","../../../projects/nmce-directives/src/_directives/dataComponent.directive.ts","../../../projects/nmce-directives/src/_directives/scrollInto.directive.ts","../../../projects/nmce-directives/src/_directives/directives.module.ts","../../../projects/nmce-directives/src/public-api.ts","../../../projects/nmce-directives/src/nmce-directives.ts"],"sourcesContent":["import { AfterViewInit, Directive, DoCheck, ElementRef, Input } from '@angular/core';\r\n\r\n/**\r\n * Use as a parametered input parameter in html element.\r\n * When used inside a material dialog, this directive may be at odd against the autofocus config parameter of MatDialogConfig, \r\n * if the autofocus config is not false. Generally speaking, no need to use this directive in a component presented in a mateiral dialog.\r\n */\r\n@Directive({\r\n\tselector: '[autofocus]'\r\n})\r\nexport class AutofocusDirective implements AfterViewInit, DoCheck {\r\n\tprivate toFocus = false;\r\n\tprivate focused = false;\r\n\tprivate initialised = false;\r\n\tprivate everFocused = false;\r\n\tconstructor(private el: ElementRef) {\r\n\t\t//console.debug('autofocusDirective created.');\r\n\t}\r\n\r\n\tngAfterViewInit() {\r\n\t\tthis.initialised = true;\r\n\t\tthis.ngDoCheck();\r\n\t}\r\n\r\n\tngDoCheck() {\r\n\t\tif (!this.initialised) { return; }\r\n\t\tif (this.toFocus && !this.everFocused && !this.focused) {\r\n\t\t\tthis.el.nativeElement.focus();\r\n\t\t\tthis.focused = true;\r\n\t\t\tthis.everFocused = true;\r\n\t\t\tconsole.debug('focused now.');\r\n\t\t}\r\n\t}\r\n\r\n\t@Input() set autofocus(condition: boolean) {\r\n\t\tthis.toFocus = condition !== false;\r\n\t}\r\n}\r\n","import { Directive, ElementRef, HostListener, OnInit } from '@angular/core';\r\nimport { CurrencyFunc } from 'nmce-func';\r\n\r\n/**\r\n * Decorate HTML input for inputing and displaying currency. The input type must not be number and should be text only.\r\n * If the input type is number, the built-in validator will be fighting against this directive.\r\n */\r\n@Directive({ selector: '[currencyFormatter]' })//inspired by https://blog.ngconsultant.io/custom-input-formatting-with-simple-directives-for-angular-2-ec792082976\r\nexport class CurrencyFormatterDirective implements OnInit {\r\n\r\n\tprivate el: HTMLInputElement;\r\n\r\n\tconstructor(private elementRef: ElementRef) {\r\n\t\tthis.el = this.elementRef.nativeElement;\r\n\t}\r\n\r\n\tngOnInit() {\r\n\t\tthis.el.value = CurrencyFunc.transformCurrency(this.el.value);\r\n\t}\r\n\r\n\t@HostListener('focus', ['$event.target.value'])\r\n\tonFocus(value: string) {\r\n\t\tthis.el.value = CurrencyFunc.parseCurrency(value); // opossite of transform\r\n\t}\r\n\r\n\t@HostListener('blur', ['$event.target.value'])\r\n\tonBlur(value: string) {\r\n\t\tthis.el.value = CurrencyFunc.transformCurrency(value);\r\n\t}\r\n\r\n}\r\n\r\n","import { Directive, ViewContainerRef } from '@angular/core';\r\n\r\n@Directive({\r\n\tselector: '[dataComponentHost]',\r\n})\r\nexport class DataComponentDirective {\r\n\tconstructor(public viewContainerRef: ViewContainerRef) { }\r\n}\r\n","import { AfterViewInit, Directive, ElementRef, Input } from '@angular/core';\r\n\r\n/**\r\n * Scroll to element attached. And the element may be an Angular Material component too.\r\n */\r\n@Directive({\r\n\tselector: '[scrollInto]'\r\n})\r\nexport class ScrollIntoDirective implements AfterViewInit {\r\n\tconstructor(private el: ElementRef) {\r\n\t\t//\tconsole.debug('ScrollIntoDirective created.');\r\n\t}\r\n\r\n\t@Input()\r\n\tscrollInto: boolean = false;\r\n\r\n\tngAfterViewInit() {\r\n\t\tif (this.scrollInto) {\r\n\t\t\tthis.el.nativeElement.scrollIntoView();\r\n\t\t}\r\n\t}\r\n}\r\n","import { CommonModule } from '@angular/common';\r\nimport { NgModule } from '@angular/core';\r\nimport { FormsModule } from '@angular/forms';\r\nimport {\r\n\tAutofocusDirective, CurrencyFormatterDirective, DataComponentDirective, ScrollIntoDirective\r\n} from './index';\r\n\r\n\r\n\r\n/**\r\n * Contain components. Other feature/lazy modules that need to access custom html element of components like my-datetimepicker still need to import this module explicitly.\r\n *\r\n */\r\n@NgModule({\r\n\timports: [\r\n\t\tCommonModule,\r\n\t\tFormsModule,\r\n\t],\r\n\r\n\tdeclarations: [\r\n\t\tAutofocusDirective,\r\n\t\tCurrencyFormatterDirective,\r\n\t\tScrollIntoDirective,\r\n\t\tDataComponentDirective,\r\n\t],\r\n\r\n\r\n\texports: [\r\n\t\tAutofocusDirective,\r\n\t\tCurrencyFormatterDirective,\r\n\t\tScrollIntoDirective,\r\n\t\tDataComponentDirective,\r\n\t]\r\n})\r\nexport class NmceDirectivesModule { }\r\n","/*\n * Public API Surface of nmce-directives\n */\n\nexport * from './_directives/index';\nexport * from './_directives/directives.module';\n\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2020/nmce-directives.mjs

@@ -0,0 +1,173 @@
+import * as i0 from '@angular/core';
+import { Directive, Input, HostListener, NgModule } from '@angular/core';
+import { CurrencyFunc } from 'nmce-func';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+/**
+ * Use as a parametered input parameter in html element.
+ * When used inside a material dialog, this directive may be at odd against the autofocus config parameter of MatDialogConfig,
+ * if the autofocus config is not false. Generally speaking, no need to use this directive in a component presented in a mateiral dialog.
+ */
+class AutofocusDirective {
+    constructor(el) {
+        this.el = el;
+        this.toFocus = false;
+        this.focused = false;
+        this.initialised = false;
+        this.everFocused = false;
+        //console.debug('autofocusDirective created.');
+    }
+    ngAfterViewInit() {
+        this.initialised = true;
+        this.ngDoCheck();
+    }
+    ngDoCheck() {
+        if (!this.initialised) {
+            return;
+        }
+        if (this.toFocus && !this.everFocused && !this.focused) {
+            this.el.nativeElement.focus();
+            this.focused = true;
+            this.everFocused = true;
+            console.debug('focused now.');
+        }
+    }
+    set autofocus(condition) {
+        this.toFocus = condition !== false;
+    }
+}
+AutofocusDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AutofocusDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+AutofocusDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: AutofocusDirective, selector: "[autofocus]", inputs: { autofocus: "autofocus" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AutofocusDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[autofocus]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { autofocus: [{
+                type: Input
+            }] } });
+
+/**
+ * Decorate HTML input for inputing and displaying currency. The input type must not be number and should be text only.
+ * If the input type is number, the built-in validator will be fighting against this directive.
+ */
+class CurrencyFormatterDirective {
+    constructor(elementRef) {
+        this.elementRef = elementRef;
+        this.el = this.elementRef.nativeElement;
+    }
+    ngOnInit() {
+        this.el.value = CurrencyFunc.transformCurrency(this.el.value);
+    }
+    onFocus(value) {
+        this.el.value = CurrencyFunc.parseCurrency(value); // opossite of transform
+    }
+    onBlur(value) {
+        this.el.value = CurrencyFunc.transformCurrency(value);
+    }
+}
+CurrencyFormatterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: CurrencyFormatterDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+CurrencyFormatterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: CurrencyFormatterDirective, selector: "[currencyFormatter]", host: { listeners: { "focus": "onFocus($event.target.value)", "blur": "onBlur($event.target.value)" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: CurrencyFormatterDirective, decorators: [{
+            type: Directive,
+            args: [{ selector: '[currencyFormatter]' }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { onFocus: [{
+                type: HostListener,
+                args: ['focus', ['$event.target.value']]
+            }], onBlur: [{
+                type: HostListener,
+                args: ['blur', ['$event.target.value']]
+            }] } });
+
+class DataComponentDirective {
+    constructor(viewContainerRef) {
+        this.viewContainerRef = viewContainerRef;
+    }
+}
+DataComponentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: DataComponentDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
+DataComponentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: DataComponentDirective, selector: "[dataComponentHost]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: DataComponentDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[dataComponentHost]',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; } });
+
+/**
+ * Scroll to element attached. And the element may be an Angular Material component too.
+ */
+class ScrollIntoDirective {
+    constructor(el) {
+        this.el = el;
+        this.scrollInto = false;
+        //	console.debug('ScrollIntoDirective created.');
+    }
+    ngAfterViewInit() {
+        if (this.scrollInto) {
+            this.el.nativeElement.scrollIntoView();
+        }
+    }
+}
+ScrollIntoDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ScrollIntoDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+ScrollIntoDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: ScrollIntoDirective, selector: "[scrollInto]", inputs: { scrollInto: "scrollInto" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ScrollIntoDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[scrollInto]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { scrollInto: [{
+                type: Input
+            }] } });
+
+/**
+ * Contain components. Other feature/lazy modules that need to access custom html element of components like my-datetimepicker still need to import this module explicitly.
+ *
+ */
+class NmceDirectivesModule {
+}
+NmceDirectivesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: NmceDirectivesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NmceDirectivesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: NmceDirectivesModule, declarations: [AutofocusDirective,
+        CurrencyFormatterDirective,
+        ScrollIntoDirective,
+        DataComponentDirective], imports: [CommonModule,
+        FormsModule], exports: [AutofocusDirective,
+        CurrencyFormatterDirective,
+        ScrollIntoDirective,
+        DataComponentDirective] });
+NmceDirectivesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: NmceDirectivesModule, imports: [[
+            CommonModule,
+            FormsModule,
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: NmceDirectivesModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        FormsModule,
+                    ],
+                    declarations: [
+                        AutofocusDirective,
+                        CurrencyFormatterDirective,
+                        ScrollIntoDirective,
+                        DataComponentDirective,
+                    ],
+                    exports: [
+                        AutofocusDirective,
+                        CurrencyFormatterDirective,
+                        ScrollIntoDirective,
+                        DataComponentDirective,
+                    ]
+                }]
+        }] });
+
+/*
+ * Public API Surface of nmce-directives
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AutofocusDirective, CurrencyFormatterDirective, DataComponentDirective, NmceDirectivesModule, ScrollIntoDirective };
+//# sourceMappingURL=nmce-directives.mjs.map

package/fesm2020/nmce-directives.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"nmce-directives.mjs","sources":["../../../projects/nmce-directives/src/_directives/autofocus.ts","../../../projects/nmce-directives/src/_directives/currencyFormatter.directive.ts","../../../projects/nmce-directives/src/_directives/dataComponent.directive.ts","../../../projects/nmce-directives/src/_directives/scrollInto.directive.ts","../../../projects/nmce-directives/src/_directives/directives.module.ts","../../../projects/nmce-directives/src/public-api.ts","../../../projects/nmce-directives/src/nmce-directives.ts"],"sourcesContent":["import { AfterViewInit, Directive, DoCheck, ElementRef, Input } from '@angular/core';\r\n\r\n/**\r\n * Use as a parametered input parameter in html element.\r\n * When used inside a material dialog, this directive may be at odd against the autofocus config parameter of MatDialogConfig, \r\n * if the autofocus config is not false. Generally speaking, no need to use this directive in a component presented in a mateiral dialog.\r\n */\r\n@Directive({\r\n\tselector: '[autofocus]'\r\n})\r\nexport class AutofocusDirective implements AfterViewInit, DoCheck {\r\n\tprivate toFocus = false;\r\n\tprivate focused = false;\r\n\tprivate initialised = false;\r\n\tprivate everFocused = false;\r\n\tconstructor(private el: ElementRef) {\r\n\t\t//console.debug('autofocusDirective created.');\r\n\t}\r\n\r\n\tngAfterViewInit() {\r\n\t\tthis.initialised = true;\r\n\t\tthis.ngDoCheck();\r\n\t}\r\n\r\n\tngDoCheck() {\r\n\t\tif (!this.initialised) { return; }\r\n\t\tif (this.toFocus && !this.everFocused && !this.focused) {\r\n\t\t\tthis.el.nativeElement.focus();\r\n\t\t\tthis.focused = true;\r\n\t\t\tthis.everFocused = true;\r\n\t\t\tconsole.debug('focused now.');\r\n\t\t}\r\n\t}\r\n\r\n\t@Input() set autofocus(condition: boolean) {\r\n\t\tthis.toFocus = condition !== false;\r\n\t}\r\n}\r\n","import { Directive, ElementRef, HostListener, OnInit } from '@angular/core';\r\nimport { CurrencyFunc } from 'nmce-func';\r\n\r\n/**\r\n * Decorate HTML input for inputing and displaying currency. The input type must not be number and should be text only.\r\n * If the input type is number, the built-in validator will be fighting against this directive.\r\n */\r\n@Directive({ selector: '[currencyFormatter]' })//inspired by https://blog.ngconsultant.io/custom-input-formatting-with-simple-directives-for-angular-2-ec792082976\r\nexport class CurrencyFormatterDirective implements OnInit {\r\n\r\n\tprivate el: HTMLInputElement;\r\n\r\n\tconstructor(private elementRef: ElementRef) {\r\n\t\tthis.el = this.elementRef.nativeElement;\r\n\t}\r\n\r\n\tngOnInit() {\r\n\t\tthis.el.value = CurrencyFunc.transformCurrency(this.el.value);\r\n\t}\r\n\r\n\t@HostListener('focus', ['$event.target.value'])\r\n\tonFocus(value: string) {\r\n\t\tthis.el.value = CurrencyFunc.parseCurrency(value); // opossite of transform\r\n\t}\r\n\r\n\t@HostListener('blur', ['$event.target.value'])\r\n\tonBlur(value: string) {\r\n\t\tthis.el.value = CurrencyFunc.transformCurrency(value);\r\n\t}\r\n\r\n}\r\n\r\n","import { Directive, ViewContainerRef } from '@angular/core';\r\n\r\n@Directive({\r\n\tselector: '[dataComponentHost]',\r\n})\r\nexport class DataComponentDirective {\r\n\tconstructor(public viewContainerRef: ViewContainerRef) { }\r\n}\r\n","import { AfterViewInit, Directive, ElementRef, Input } from '@angular/core';\r\n\r\n/**\r\n * Scroll to element attached. And the element may be an Angular Material component too.\r\n */\r\n@Directive({\r\n\tselector: '[scrollInto]'\r\n})\r\nexport class ScrollIntoDirective implements AfterViewInit {\r\n\tconstructor(private el: ElementRef) {\r\n\t\t//\tconsole.debug('ScrollIntoDirective created.');\r\n\t}\r\n\r\n\t@Input()\r\n\tscrollInto: boolean = false;\r\n\r\n\tngAfterViewInit() {\r\n\t\tif (this.scrollInto) {\r\n\t\t\tthis.el.nativeElement.scrollIntoView();\r\n\t\t}\r\n\t}\r\n}\r\n","import { CommonModule } from '@angular/common';\r\nimport { NgModule } from '@angular/core';\r\nimport { FormsModule } from '@angular/forms';\r\nimport {\r\n\tAutofocusDirective, CurrencyFormatterDirective, DataComponentDirective, ScrollIntoDirective\r\n} from './index';\r\n\r\n\r\n\r\n/**\r\n * Contain components. Other feature/lazy modules that need to access custom html element of components like my-datetimepicker still need to import this module explicitly.\r\n *\r\n */\r\n@NgModule({\r\n\timports: [\r\n\t\tCommonModule,\r\n\t\tFormsModule,\r\n\t],\r\n\r\n\tdeclarations: [\r\n\t\tAutofocusDirective,\r\n\t\tCurrencyFormatterDirective,\r\n\t\tScrollIntoDirective,\r\n\t\tDataComponentDirective,\r\n\t],\r\n\r\n\r\n\texports: [\r\n\t\tAutofocusDirective,\r\n\t\tCurrencyFormatterDirective,\r\n\t\tScrollIntoDirective,\r\n\t\tDataComponentDirective,\r\n\t]\r\n})\r\nexport class NmceDirectivesModule { }\r\n","/*\n * Public API Surface of nmce-directives\n */\n\nexport * from './_directives/index';\nexport * from './_directives/directives.module';\n\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/nmce-directives.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="nmce-directives" />
+export * from './public-api';

package/package.json

@@ -1,11 +1,39 @@
 {
   "name": "nmce-directives",
-  "version": "0.0.3",
+  "version": "0.0.8",
+  "author": {
+    "name": "Z"
+  },
+  "description": "Common simple Angular directives used in business applications.",
+  "license": "MIT",
+  "repository": {
+    "url": "https://github.com/zijianhuang/nmce"
+  },
   "peerDependencies": {
-    "@angular/common": "^12.0.1",
-    "@angular/core": "^12.0.1"
+    "@angular/common": "^13.1.1",
+    "@angular/core": "^13.1.1"
   },
   "dependencies": {
-    "tslib": "^2.2.0"
-  }
+    "tslib": "^2.3.1"
+  },
+  "module": "fesm2015/nmce-directives.mjs",
+  "es2020": "fesm2020/nmce-directives.mjs",
+  "esm2020": "esm2020/nmce-directives.mjs",
+  "fesm2020": "fesm2020/nmce-directives.mjs",
+  "fesm2015": "fesm2015/nmce-directives.mjs",
+  "typings": "nmce-directives.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./nmce-directives.d.ts",
+      "esm2020": "./esm2020/nmce-directives.mjs",
+      "es2020": "./fesm2020/nmce-directives.mjs",
+      "es2015": "./fesm2015/nmce-directives.mjs",
+      "node": "./fesm2015/nmce-directives.mjs",
+      "default": "./fesm2020/nmce-directives.mjs"
+    }
+  },
+  "sideEffects": false
 }

package/{src/public-api.ts → public-api.d.ts}

@@ -1,7 +1,2 @@
-/*
- * Public API Surface of nmce-directives
- */
-
-export * from './_directives/index';
-export * from './_directives/directives.module';
-
+export * from './_directives/index';
+export * from './_directives/directives.module';

package/karma.conf.js

@@ -1,44 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      jasmine: {
-        // you can add configuration options for Jasmine here
-        // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html
-        // for example, you can disable the random execution with `random: false`
-        // or set a specific seed with `seed: 4321`
-      },
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    jasmineHtmlReporter: {
-      suppressAll: true // removes the duplicated traces
-    },
-    coverageReporter: {
-      dir: require('path').join(__dirname, '../../coverage/nmce-directives'),
-      subdir: '.',
-      reporters: [
-        { type: 'html' },
-        { type: 'text-summary' }
-      ]
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};

package/ng-package.json

@@ -1,11 +0,0 @@
-{
-  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
-  "dest": "../../dist/nmce-directives",
-  "lib": {
-    "entryFile": "src/public-api.ts",
-    "umdModuleIds": {
-      "moment": "moment",
-      "nmce-func": "nmce-func"
-    }  
-  }
-}

package/src/_directives/autofocus.ts

@@ -1,33 +0,0 @@
-import { Directive, AfterViewInit, ElementRef, DoCheck, Input } from '@angular/core';
-
-
-// Simple example directive that fixes autofocus problem with multiple views, source: https://www.picnet.com.au/blogs/guido/post/2016/09/20/angular2-ng2-focus-directive/
-@Directive({
-	selector: '[autofocus]' // using [ ] means selecting attributes
-})
-
-export class AutofocusDirective implements AfterViewInit, DoCheck {
-	private lastVisible = false;
-	private initialised = false;
-	constructor(private el: ElementRef) {
-		console.debug('autofocusDirective created.');
-	}
-
-	ngAfterViewInit() {
-		this.initialised = true;
-		this.ngDoCheck();
-	}
-
-	ngDoCheck() {
-		if (!this.initialised) { return; }
-		const visible = !!this.el.nativeElement.offsetParent;
-		if (visible && !this.lastVisible) {
-			setTimeout(() => { this.el.nativeElement.focus(); }, 2); //no need to clearTimeout
-		}
-		this.lastVisible = visible;
-	}
-
-	@Input() set autofocus(condition: boolean) {
-		this.lastVisible = condition !== false;
-	}
-}

package/src/_directives/currencyFormatter.directive.ts

@@ -1,31 +0,0 @@
-import { Directive, HostListener, ElementRef, OnInit } from '@angular/core';
-import { CurrencyFunc } from 'nmce-func';
-
-/**
- *
- */
-@Directive({ selector: '[currencyFormatter]' })//inspired by https://blog.ngconsultant.io/custom-input-formatting-with-simple-directives-for-angular-2-ec792082976
-export class CurrencyFormatterDirective implements OnInit {
-
-	private el: HTMLInputElement;
-
-	constructor(private elementRef: ElementRef) {
-		this.el = this.elementRef.nativeElement;
-	}
-
-	ngOnInit() {
-		this.el.value = CurrencyFunc.transformCurrency(this.el.value);
-	}
-
-	@HostListener('focus', ['$event.target.value'])
-	onFocus(value: string) {
-		this.el.value = CurrencyFunc.parseCurrency(value); // opossite of transform
-	}
-
-	@HostListener('blur', ['$event.target.value'])
-	onBlur(value: string) {
-		this.el.value = CurrencyFunc.transformCurrency(value);
-	}
-
-}
-

package/src/_directives/dataComponent.directive.ts

@@ -1,8 +0,0 @@
-import { Directive, ViewContainerRef } from '@angular/core';
-
-@Directive({
-	selector: '[dataComponentHost]',
-})
-export class DataComponentDirective {
-	constructor(public viewContainerRef: ViewContainerRef) { }
-}

package/src/_directives/datetimeFormatter.directive.ts

@@ -1,58 +0,0 @@
-import { Directive, HostListener, ElementRef, OnInit } from '@angular/core';
-import moment from 'moment';
-
-/**
- *
- */
-@Directive({ selector: '[datetimeFormatter]' })//inspired by https://blog.ngconsultant.io/custom-input-formatting-with-simple-directives-for-angular-2-ec792082976
-export class DatetimeFormatterDirective implements OnInit {
-
-	private el: HTMLInputElement;
-
-	//@Input('datetimeFormatter')
-	format = 'DD/MM/YYYY HH:mm';
-
-	formats = ['', 'DD/MM/YYYY HH:mm'];
-
-	constructor(private elementRef: ElementRef) {
-		this.el = this.elementRef.nativeElement;
-	}
-
-	ngOnInit() {
-		const s = this.parse(this.el.value);
-		this.el.value = this.transform(s);
-	}
-
-	@HostListener('focus', ['$event.target.value'])
-	onFocus() {
-		const s = this.parse(this.el.value);
-		this.el.value = this.transform(s);
-	}
-
-	@HostListener('blur', ['$event.target.value'])
-	onBlur() {
-		this.el.value = this.transform(this.el.value);
-	}
-
-	transform(value: Date | string | null): string {
-		if (!value) {
-			return '';
-		}
-
-		const s = moment(value).format(this.format);
-		console.debug(`With format ${this.format} transform to ${s}`);
-		return s;
-	}
-
-	parse(value: string): Date | null {
-		if (!value) {
-			return null;
-		}
-
-		const d = moment(value, this.formats).toDate();
-		console.debug(`parse ${value} to ${d}`);
-		return d;
-	}
-
-}
-

package/src/_directives/directives.module.ts

@@ -1,39 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-
-
-import {
-	AutofocusDirective, HighlightDirective, CurrencyFormatterDirective, DatetimeFormatterDirective, ScrollIntoDirective, DataComponentDirective,
-} from './index';
-
-/**
- * Contain components. Other feature/lazy modules that need to access custom html element of components like my-datetimepicker still need to import this module explicitly.
- *
- */
-@NgModule({
-	imports: [
-		CommonModule,
-		FormsModule,
-	],
-
-	declarations: [
-		AutofocusDirective,
-		HighlightDirective,
-		CurrencyFormatterDirective,
-		DatetimeFormatterDirective,
-		ScrollIntoDirective,
-		DataComponentDirective,
-	],
-
-
-	exports: [
-		AutofocusDirective,
-		HighlightDirective,
-		CurrencyFormatterDirective,
-		DatetimeFormatterDirective,
-		ScrollIntoDirective,
-		DataComponentDirective,
-	]
-})
-export class NmceDirectivesModule { }

package/src/_directives/highlight.directive.ts

@@ -1,21 +0,0 @@
-import { Directive, ElementRef, HostListener, Input } from '@angular/core';
-@Directive({
-	selector: '[myHighlight]'
-})
-export class HighlightDirective {
-	constructor(private el: ElementRef) {
-		console.debug('HighlightDirective created.');
-	}
-
-	@Input() defaultColor?: string;
-	@Input('myHighlight') highlightColor?: string;
-	@HostListener('mouseenter') onMouseEnter() {
-		this.highlight(this.highlightColor || this.defaultColor || 'red');
-	}
-	@HostListener('mouseleave') onMouseLeave() {
-		this.highlight(undefined);
-	}
-	private highlight(color: string | undefined) {
-		this.el.nativeElement.style.backgroundColor = color;
-	}
-}

package/src/_directives/index.ts

@@ -1,6 +0,0 @@
-export * from './autofocus';
-export * from './highlight.directive';
-export * from './currencyFormatter.directive';
-export * from './datetimeFormatter.directive';
-export * from './scrollInto.directive';
-export * from './dataComponent.directive';

package/src/_directives/scrollInto.directive.ts

@@ -1,18 +0,0 @@
-import { AfterViewInit, Directive, ElementRef, Input } from '@angular/core';
-@Directive({
-	selector: '[scrollInto]'
-})
-export class ScrollIntoDirective implements AfterViewInit {
-	constructor(private el: ElementRef) {
-		//	console.debug('ScrollIntoDirective created.');
-	}
-
-	@Input()
-	scrollInto: boolean = false;
-
-	ngAfterViewInit() {
-		if (this.scrollInto) {
-			this.el.nativeElement.scrollIntoView();
-		}
-	}
-}

package/src/test.ts

@@ -1,26 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: {
-  context(path: string, deep?: boolean, filter?: RegExp): {
-    keys(): string[];
-    <T>(id: string): T;
-  };
-};
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);

package/tsconfig.lib.json

@@ -1,25 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../out-tsc/lib",
-    "target": "es2015",
-    "declaration": true,
-    "declarationMap": true,
-    "inlineSources": true,
-    "types": [],
-    "lib": [
-      "dom",
-      "es2018"
-    ]
-  },
-  "angularCompilerOptions": {
-    "skipTemplateCodegen": true,
-    "strictMetadataEmit": true,
-    "enableResourceInlining": true
-  },
-  "exclude": [
-    "src/test.ts",
-    "**/*.spec.ts"
-  ]
-}

package/tsconfig.lib.prod.json

@@ -1,10 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "./tsconfig.lib.json",
-  "compilerOptions": {
-    "declarationMap": false
-  },
-  "angularCompilerOptions": {
-    "enableIvy": false
-  }
-}

package/tsconfig.spec.json

@@ -1,17 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine"
-    ]
-  },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
-}

package/tslint.json

@@ -1,17 +0,0 @@
-{
-  "extends": "../../tslint.json",
-  "rules": {
-    "directive-selector": [
-      true,
-      "attribute",
-      "lib",
-      "camelCase"
-    ],
-    "component-selector": [
-      true,
-      "element",
-      "lib",
-      "kebab-case"
-    ]
-  }
-}