nmce-directives 0.0.2 → 0.0.7

package/_directives/autofocus.d.ts

@@ -1,8 +1,15 @@
-import { AfterViewInit, ElementRef, DoCheck } from '@angular/core';
+import { AfterViewInit, DoCheck, ElementRef } 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 lastVisible;
+    private toFocus;
+    private focused;
     private initialised;
+    private everFocused;
     constructor(el: ElementRef);
     ngAfterViewInit(): void;
     ngDoCheck(): void;

package/_directives/currencyFormatter.directive.d.ts

@@ -1,6 +1,7 @@
 import { ElementRef, OnInit } 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;

package/_directives/index.d.ts

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

package/_directives/scrollInto.directive.d.ts

@@ -1,4 +1,7 @@
 import { AfterViewInit, ElementRef } 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);

package/bundles/nmce-directives.umd.js

@@ -1,39 +1,41 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('nmce-func'), require('moment'), require('@angular/common'), require('@angular/forms')) :
-    typeof define === 'function' && define.amd ? define('nmce-directives', ['exports', '@angular/core', 'nmce-func', 'moment', '@angular/common', '@angular/forms'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['nmce-directives'] = {}, global.ng.core, global['nmce-func'], global.moment, global.ng.common, global.ng.forms));
-}(this, (function (exports, core, nmceFunc, moment, common, forms) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('nmce-func'), require('@angular/common'), require('@angular/forms')) :
+    typeof define === 'function' && define.amd ? define('nmce-directives', ['exports', '@angular/core', 'nmce-func', '@angular/common', '@angular/forms'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['nmce-directives'] = {}, global.ng.core, global['nmce-func'], global.ng.common, global.ng.forms));
+}(this, (function (exports, core, nmceFunc, common, forms) { 'use strict';
 
-    function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-    var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment);
-
-    // 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/
+    /**
+     * 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.
+     */
     var AutofocusDirective = /** @class */ (function () {
         function AutofocusDirective(el) {
             this.el = el;
-            this.lastVisible = false;
+            this.toFocus = false;
+            this.focused = false;
             this.initialised = false;
-            console.debug('autofocusDirective created.');
+            this.everFocused = false;
+            //console.debug('autofocusDirective created.');
         }
         AutofocusDirective.prototype.ngAfterViewInit = function () {
             this.initialised = true;
             this.ngDoCheck();
         };
         AutofocusDirective.prototype.ngDoCheck = function () {
-            var _this = this;
             if (!this.initialised) {
                 return;
             }
-            var visible = !!this.el.nativeElement.offsetParent;
-            if (visible && !this.lastVisible) {
-                setTimeout(function () { _this.el.nativeElement.focus(); }, 2); //no need to clearTimeout
+            if (this.toFocus && !this.everFocused && !this.focused) {
+                this.el.nativeElement.focus();
+                this.focused = true;
+                this.everFocused = true;
+                console.debug('focused now.');
             }
-            this.lastVisible = visible;
         };
         Object.defineProperty(AutofocusDirective.prototype, "autofocus", {
             set: function (condition) {
-                this.lastVisible = condition !== false;
+                this.toFocus = condition !== false;
             },
             enumerable: false,
             configurable: true
@@ -42,7 +44,7 @@
     }());
     AutofocusDirective.decorators = [
         { type: core.Directive, args: [{
-                    selector: '[autofocus]' // using [ ] means selecting attributes
+                    selector: '[autofocus]'
                 },] }
     ];
     AutofocusDirective.ctorParameters = function () { return [
@@ -52,39 +54,9 @@
         autofocus: [{ type: core.Input }]
     };
 
-    var HighlightDirective = /** @class */ (function () {
-        function HighlightDirective(el) {
-            this.el = el;
-            console.debug('HighlightDirective created.');
-        }
-        HighlightDirective.prototype.onMouseEnter = function () {
-            this.highlight(this.highlightColor || this.defaultColor || 'red');
-        };
-        HighlightDirective.prototype.onMouseLeave = function () {
-            this.highlight(undefined);
-        };
-        HighlightDirective.prototype.highlight = function (color) {
-            this.el.nativeElement.style.backgroundColor = color;
-        };
-        return HighlightDirective;
-    }());
-    HighlightDirective.decorators = [
-        { type: core.Directive, args: [{
-                    selector: '[myHighlight]'
-                },] }
-    ];
-    HighlightDirective.ctorParameters = function () { return [
-        { type: core.ElementRef }
-    ]; };
-    HighlightDirective.propDecorators = {
-        defaultColor: [{ type: core.Input }],
-        highlightColor: [{ type: core.Input, args: ['myHighlight',] }],
-        onMouseEnter: [{ type: core.HostListener, args: ['mouseenter',] }],
-        onMouseLeave: [{ type: core.HostListener, args: ['mouseleave',] }]
-    };
-
     /**
-     *
+     * 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.
      */
     var CurrencyFormatterDirective = /** @class */ (function () {
         function CurrencyFormatterDirective(elementRef) {
@@ -103,7 +75,8 @@
         return CurrencyFormatterDirective;
     }());
     CurrencyFormatterDirective.decorators = [
-        { type: core.Directive, args: [{ selector: '[currencyFormatter]' },] }
+        { type: core.Directive, args: [{ selector: '[currencyFormatter]' }, //inspired by https://blog.ngconsultant.io/custom-input-formatting-with-simple-directives-for-angular-2-ec792082976
+            ] }
     ];
     CurrencyFormatterDirective.ctorParameters = function () { return [
         { type: core.ElementRef }
@@ -113,57 +86,24 @@
         onBlur: [{ type: core.HostListener, args: ['blur', ['$event.target.value'],] }]
     };
 
-    /**
-     *
-     */
-    var DatetimeFormatterDirective = /** @class */ (function () {
-        function DatetimeFormatterDirective(elementRef) {
-            this.elementRef = elementRef;
-            //@Input('datetimeFormatter')
-            this.format = 'DD/MM/YYYY HH:mm';
-            this.formats = ['', 'DD/MM/YYYY HH:mm'];
-            this.el = this.elementRef.nativeElement;
+    var DataComponentDirective = /** @class */ (function () {
+        function DataComponentDirective(viewContainerRef) {
+            this.viewContainerRef = viewContainerRef;
         }
-        DatetimeFormatterDirective.prototype.ngOnInit = function () {
-            var s = this.parse(this.el.value);
-            this.el.value = this.transform(s);
-        };
-        DatetimeFormatterDirective.prototype.onFocus = function () {
-            var s = this.parse(this.el.value);
-            this.el.value = this.transform(s);
-        };
-        DatetimeFormatterDirective.prototype.onBlur = function () {
-            this.el.value = this.transform(this.el.value);
-        };
-        DatetimeFormatterDirective.prototype.transform = function (value) {
-            if (!value) {
-                return '';
-            }
-            var s = moment__default['default'](value).format(this.format);
-            console.debug("With format " + this.format + " transform to " + s);
-            return s;
-        };
-        DatetimeFormatterDirective.prototype.parse = function (value) {
-            if (!value) {
-                return null;
-            }
-            var d = moment__default['default'](value, this.formats).toDate();
-            console.debug("parse " + value + " to " + d);
-            return d;
-        };
-        return DatetimeFormatterDirective;
+        return DataComponentDirective;
     }());
-    DatetimeFormatterDirective.decorators = [
-        { type: core.Directive, args: [{ selector: '[datetimeFormatter]' },] }
+    DataComponentDirective.decorators = [
+        { type: core.Directive, args: [{
+                    selector: '[dataComponentHost]',
+                },] }
     ];
-    DatetimeFormatterDirective.ctorParameters = function () { return [
-        { type: core.ElementRef }
-    ]; };
-    DatetimeFormatterDirective.propDecorators = {
-        onFocus: [{ type: core.HostListener, args: ['focus', ['$event.target.value'],] }],
-        onBlur: [{ type: core.HostListener, args: ['blur', ['$event.target.value'],] }]
-    };
+    DataComponentDirective.ctorParameters = function () { return [
+        { type: core.ViewContainerRef }
+    ]; };
 
+    /**
+     * Scroll to element attached. And the element may be an Angular Material component too.
+     */
     var ScrollIntoDirective = /** @class */ (function () {
         function ScrollIntoDirective(el) {
             this.el = el;
@@ -189,21 +129,6 @@
         scrollInto: [{ type: core.Input }]
     };
 
-    var DataComponentDirective = /** @class */ (function () {
-        function DataComponentDirective(viewContainerRef) {
-            this.viewContainerRef = viewContainerRef;
-        }
-        return DataComponentDirective;
-    }());
-    DataComponentDirective.decorators = [
-        { type: core.Directive, args: [{
-                    selector: '[dataComponentHost]',
-                },] }
-    ];
-    DataComponentDirective.ctorParameters = function () { return [
-        { type: core.ViewContainerRef }
-    ]; };
-
     /**
      * 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.
      *
@@ -221,17 +146,13 @@
                     ],
                     declarations: [
                         AutofocusDirective,
-                        HighlightDirective,
                         CurrencyFormatterDirective,
-                        DatetimeFormatterDirective,
                         ScrollIntoDirective,
                         DataComponentDirective,
                     ],
                     exports: [
                         AutofocusDirective,
-                        HighlightDirective,
                         CurrencyFormatterDirective,
-                        DatetimeFormatterDirective,
                         ScrollIntoDirective,
                         DataComponentDirective,
                     ]
@@ -249,8 +170,6 @@
     exports.AutofocusDirective = AutofocusDirective;
     exports.CurrencyFormatterDirective = CurrencyFormatterDirective;
     exports.DataComponentDirective = DataComponentDirective;
-    exports.DatetimeFormatterDirective = DatetimeFormatterDirective;
-    exports.HighlightDirective = HighlightDirective;
     exports.NmceDirectivesModule = NmceDirectivesModule;
     exports.ScrollIntoDirective = ScrollIntoDirective;
 

package/bundles/nmce-directives.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"nmce-directives.umd.js","sources":["../../../projects/nmce-directives/src/_directives/autofocus.ts","../../../projects/nmce-directives/src/_directives/highlight.directive.ts","../../../projects/nmce-directives/src/_directives/currencyFormatter.directive.ts","../../../projects/nmce-directives/src/_directives/datetimeFormatter.directive.ts","../../../projects/nmce-directives/src/_directives/scrollInto.directive.ts","../../../projects/nmce-directives/src/_directives/dataComponent.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 { Directive, AfterViewInit, ElementRef, DoCheck, Input } from '@angular/core';\r\n\r\n\r\n// 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/\r\n@Directive({\r\n\tselector: '[autofocus]' // using [ ] means selecting attributes\r\n})\r\n\r\nexport class AutofocusDirective implements AfterViewInit, DoCheck {\r\n\tprivate lastVisible = false;\r\n\tprivate initialised = false;\r\n\tconstructor(private el: ElementRef) {\r\n\t\tconsole.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\tconst visible = !!this.el.nativeElement.offsetParent;\r\n\t\tif (visible && !this.lastVisible) {\r\n\t\t\tsetTimeout(() => { this.el.nativeElement.focus(); }, 2); //no need to clearTimeout\r\n\t\t}\r\n\t\tthis.lastVisible = visible;\r\n\t}\r\n\r\n\t@Input() set autofocus(condition: boolean) {\r\n\t\tthis.lastVisible = condition !== false;\r\n\t}\r\n}\r\n","import { Directive, ElementRef, HostListener, Input } from '@angular/core';\r\n@Directive({\r\n\tselector: '[myHighlight]'\r\n})\r\nexport class HighlightDirective {\r\n\tconstructor(private el: ElementRef) {\r\n\t\tconsole.debug('HighlightDirective created.');\r\n\t}\r\n\r\n\t@Input() defaultColor?: string;\r\n\t@Input('myHighlight') highlightColor?: string;\r\n\t@HostListener('mouseenter') onMouseEnter() {\r\n\t\tthis.highlight(this.highlightColor || this.defaultColor || 'red');\r\n\t}\r\n\t@HostListener('mouseleave') onMouseLeave() {\r\n\t\tthis.highlight(undefined);\r\n\t}\r\n\tprivate highlight(color: string | undefined) {\r\n\t\tthis.el.nativeElement.style.backgroundColor = color;\r\n\t}\r\n}\r\n","import { Directive, HostListener, ElementRef, OnInit } from '@angular/core';\r\nimport { CurrencyFunc } from 'nmce-func';\r\n\r\n/**\r\n *\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, HostListener, ElementRef, OnInit } from '@angular/core';\r\nimport moment from 'moment';\r\n\r\n/**\r\n *\r\n */\r\n@Directive({ selector: '[datetimeFormatter]' })//inspired by https://blog.ngconsultant.io/custom-input-formatting-with-simple-directives-for-angular-2-ec792082976\r\nexport class DatetimeFormatterDirective implements OnInit {\r\n\r\n\tprivate el: HTMLInputElement;\r\n\r\n\t//@Input('datetimeFormatter')\r\n\tformat = 'DD/MM/YYYY HH:mm';\r\n\r\n\tformats = ['', 'DD/MM/YYYY HH:mm'];\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\tconst s = this.parse(this.el.value);\r\n\t\tthis.el.value = this.transform(s);\r\n\t}\r\n\r\n\t@HostListener('focus', ['$event.target.value'])\r\n\tonFocus() {\r\n\t\tconst s = this.parse(this.el.value);\r\n\t\tthis.el.value = this.transform(s);\r\n\t}\r\n\r\n\t@HostListener('blur', ['$event.target.value'])\r\n\tonBlur() {\r\n\t\tthis.el.value = this.transform(this.el.value);\r\n\t}\r\n\r\n\ttransform(value: Date | string | null): string {\r\n\t\tif (!value) {\r\n\t\t\treturn '';\r\n\t\t}\r\n\r\n\t\tconst s = moment(value).format(this.format);\r\n\t\tconsole.debug(`With format ${this.format} transform to ${s}`);\r\n\t\treturn s;\r\n\t}\r\n\r\n\tparse(value: string): Date | null {\r\n\t\tif (!value) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\tconst d = moment(value, this.formats).toDate();\r\n\t\tconsole.debug(`parse ${value} to ${d}`);\r\n\t\treturn d;\r\n\t}\r\n\r\n}\r\n\r\n","import { AfterViewInit, Directive, ElementRef, Input } from '@angular/core';\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 { 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 { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { FormsModule } from '@angular/forms';\r\n\r\n\r\nimport {\r\n\tAutofocusDirective, HighlightDirective, CurrencyFormatterDirective, DatetimeFormatterDirective, ScrollIntoDirective, DataComponentDirective,\r\n} from './index';\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\tHighlightDirective,\r\n\t\tCurrencyFormatterDirective,\r\n\t\tDatetimeFormatterDirective,\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\tHighlightDirective,\r\n\t\tCurrencyFormatterDirective,\r\n\t\tDatetimeFormatterDirective,\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":["Directive","ElementRef","Input","HostListener","CurrencyFunc","moment","ViewContainerRef","NgModule","CommonModule","FormsModule"],"mappings":"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"}
+{"version":3,"file":"nmce-directives.umd.js","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":["Directive","ElementRef","Input","CurrencyFunc","HostListener","ViewContainerRef","NgModule","CommonModule","FormsModule"],"mappings":"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"}

package/bundles/nmce-directives.umd.min.js

@@ -1,2 +1,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("nmce-func"),require("moment"),require("@angular/common"),require("@angular/forms")):"function"==typeof define&&define.amd?define("nmce-directives",["exports","@angular/core","nmce-func","moment","@angular/common","@angular/forms"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self)["nmce-directives"]={},e.ng.core,e["nmce-func"],e.moment,e.ng.common,e.ng.forms)}(this,(function(e,t,r,o,n,i){"use strict";function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=s(o),u=function(){function e(e){this.el=e,this.lastVisible=!1,this.initialised=!1,console.debug("autofocusDirective created.")}return e.prototype.ngAfterViewInit=function(){this.initialised=!0,this.ngDoCheck()},e.prototype.ngDoCheck=function(){var e=this;if(this.initialised){var t=!!this.el.nativeElement.offsetParent;t&&!this.lastVisible&&setTimeout((function(){e.el.nativeElement.focus()}),2),this.lastVisible=t}},Object.defineProperty(e.prototype,"autofocus",{set:function(e){this.lastVisible=!1!==e},enumerable:!1,configurable:!0}),e}();u.decorators=[{type:t.Directive,args:[{selector:"[autofocus]"}]}],u.ctorParameters=function(){return[{type:t.ElementRef}]},u.propDecorators={autofocus:[{type:t.Input}]};var c=function(){function e(e){this.el=e,console.debug("HighlightDirective created.")}return e.prototype.onMouseEnter=function(){this.highlight(this.highlightColor||this.defaultColor||"red")},e.prototype.onMouseLeave=function(){this.highlight(void 0)},e.prototype.highlight=function(e){this.el.nativeElement.style.backgroundColor=e},e}();c.decorators=[{type:t.Directive,args:[{selector:"[myHighlight]"}]}],c.ctorParameters=function(){return[{type:t.ElementRef}]},c.propDecorators={defaultColor:[{type:t.Input}],highlightColor:[{type:t.Input,args:["myHighlight"]}],onMouseEnter:[{type:t.HostListener,args:["mouseenter"]}],onMouseLeave:[{type:t.HostListener,args:["mouseleave"]}]};var l=function(){function e(e){this.elementRef=e,this.el=this.elementRef.nativeElement}return e.prototype.ngOnInit=function(){this.el.value=r.CurrencyFunc.transformCurrency(this.el.value)},e.prototype.onFocus=function(e){this.el.value=r.CurrencyFunc.parseCurrency(e)},e.prototype.onBlur=function(e){this.el.value=r.CurrencyFunc.transformCurrency(e)},e}();l.decorators=[{type:t.Directive,args:[{selector:"[currencyFormatter]"}]}],l.ctorParameters=function(){return[{type:t.ElementRef}]},l.propDecorators={onFocus:[{type:t.HostListener,args:["focus",["$event.target.value"]]}],onBlur:[{type:t.HostListener,args:["blur",["$event.target.value"]]}]};var f=function(){function e(e){this.elementRef=e,this.format="DD/MM/YYYY HH:mm",this.formats=["","DD/MM/YYYY HH:mm"],this.el=this.elementRef.nativeElement}return e.prototype.ngOnInit=function(){var e=this.parse(this.el.value);this.el.value=this.transform(e)},e.prototype.onFocus=function(){var e=this.parse(this.el.value);this.el.value=this.transform(e)},e.prototype.onBlur=function(){this.el.value=this.transform(this.el.value)},e.prototype.transform=function(e){if(!e)return"";var t=a.default(e).format(this.format);return console.debug("With format "+this.format+" transform to "+t),t},e.prototype.parse=function(e){if(!e)return null;var t=a.default(e,this.formats).toDate();return console.debug("parse "+e+" to "+t),t},e}();f.decorators=[{type:t.Directive,args:[{selector:"[datetimeFormatter]"}]}],f.ctorParameters=function(){return[{type:t.ElementRef}]},f.propDecorators={onFocus:[{type:t.HostListener,args:["focus",["$event.target.value"]]}],onBlur:[{type:t.HostListener,args:["blur",["$event.target.value"]]}]};var p=function(){function e(e){this.el=e,this.scrollInto=!1}return e.prototype.ngAfterViewInit=function(){this.scrollInto&&this.el.nativeElement.scrollIntoView()},e}();p.decorators=[{type:t.Directive,args:[{selector:"[scrollInto]"}]}],p.ctorParameters=function(){return[{type:t.ElementRef}]},p.propDecorators={scrollInto:[{type:t.Input}]};var m=function(e){this.viewContainerRef=e};m.decorators=[{type:t.Directive,args:[{selector:"[dataComponentHost]"}]}],m.ctorParameters=function(){return[{type:t.ViewContainerRef}]};var h=function(){};h.decorators=[{type:t.NgModule,args:[{imports:[n.CommonModule,i.FormsModule],declarations:[u,c,l,f,p,m],exports:[u,c,l,f,p,m]}]}],e.AutofocusDirective=u,e.CurrencyFormatterDirective=l,e.DataComponentDirective=m,e.DatetimeFormatterDirective=f,e.HighlightDirective=c,e.NmceDirectivesModule=h,e.ScrollIntoDirective=p,Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("nmce-func"),require("@angular/common"),require("@angular/forms")):"function"==typeof define&&define.amd?define("nmce-directives",["exports","@angular/core","nmce-func","@angular/common","@angular/forms"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self)["nmce-directives"]={},e.ng.core,e["nmce-func"],e.ng.common,e.ng.forms)}(this,(function(e,t,o,r,n){"use strict";var i=function(){function e(e){this.el=e,this.toFocus=!1,this.focused=!1,this.initialised=!1,this.everFocused=!1}return e.prototype.ngAfterViewInit=function(){this.initialised=!0,this.ngDoCheck()},e.prototype.ngDoCheck=function(){this.initialised&&(!this.toFocus||this.everFocused||this.focused||(this.el.nativeElement.focus(),this.focused=!0,this.everFocused=!0,console.debug("focused now.")))},Object.defineProperty(e.prototype,"autofocus",{set:function(e){this.toFocus=!1!==e},enumerable:!1,configurable:!0}),e}();i.decorators=[{type:t.Directive,args:[{selector:"[autofocus]"}]}],i.ctorParameters=function(){return[{type:t.ElementRef}]},i.propDecorators={autofocus:[{type:t.Input}]};var c=function(){function e(e){this.elementRef=e,this.el=this.elementRef.nativeElement}return e.prototype.ngOnInit=function(){this.el.value=o.CurrencyFunc.transformCurrency(this.el.value)},e.prototype.onFocus=function(e){this.el.value=o.CurrencyFunc.parseCurrency(e)},e.prototype.onBlur=function(e){this.el.value=o.CurrencyFunc.transformCurrency(e)},e}();c.decorators=[{type:t.Directive,args:[{selector:"[currencyFormatter]"}]}],c.ctorParameters=function(){return[{type:t.ElementRef}]},c.propDecorators={onFocus:[{type:t.HostListener,args:["focus",["$event.target.value"]]}],onBlur:[{type:t.HostListener,args:["blur",["$event.target.value"]]}]};var s=function(e){this.viewContainerRef=e};s.decorators=[{type:t.Directive,args:[{selector:"[dataComponentHost]"}]}],s.ctorParameters=function(){return[{type:t.ViewContainerRef}]};var u=function(){function e(e){this.el=e,this.scrollInto=!1}return e.prototype.ngAfterViewInit=function(){this.scrollInto&&this.el.nativeElement.scrollIntoView()},e}();u.decorators=[{type:t.Directive,args:[{selector:"[scrollInto]"}]}],u.ctorParameters=function(){return[{type:t.ElementRef}]},u.propDecorators={scrollInto:[{type:t.Input}]};var a=function(){};a.decorators=[{type:t.NgModule,args:[{imports:[r.CommonModule,n.FormsModule],declarations:[i,c,u,s],exports:[i,c,u,s]}]}],e.AutofocusDirective=i,e.CurrencyFormatterDirective=c,e.DataComponentDirective=s,e.NmceDirectivesModule=a,e.ScrollIntoDirective=u,Object.defineProperty(e,"__esModule",{value:!0})}));
 //# sourceMappingURL=nmce-directives.umd.min.js.map

package/bundles/nmce-directives.umd.min.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../projects/nmce-directives/src/_directives/autofocus.ts","../../../projects/nmce-directives/src/_directives/highlight.directive.ts","../../../projects/nmce-directives/src/_directives/currencyFormatter.directive.ts","../../../projects/nmce-directives/src/_directives/datetimeFormatter.directive.ts","../../../projects/nmce-directives/src/_directives/scrollInto.directive.ts","../../../projects/nmce-directives/src/_directives/dataComponent.directive.ts","../../../projects/nmce-directives/src/_directives/directives.module.ts"],"names":["AutofocusDirective","el","this","lastVisible","initialised","console","debug","prototype","ngAfterViewInit","ngDoCheck","_this","visible","nativeElement","offsetParent","setTimeout","focus","Object","defineProperty","condition","Directive","args","selector","ElementRef","Input","HighlightDirective","onMouseEnter","highlight","highlightColor","defaultColor","onMouseLeave","undefined","color","style","backgroundColor","HostListener","CurrencyFormatterDirective","elementRef","ngOnInit","value","CurrencyFunc","transformCurrency","onFocus","parseCurrency","onBlur","DatetimeFormatterDirective","format","formats","s","parse","transform","moment","d","toDate","ScrollIntoDirective","scrollInto","scrollIntoView","viewContainerRef","ViewContainerRef","NgModule","imports","CommonModule","FormsModule","declarations","DataComponentDirective","exports"],"mappings":"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","sourcesContent":["import { Directive, AfterViewInit, ElementRef, DoCheck, Input } from '@angular/core';\r\n\r\n\r\n// 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/\r\n@Directive({\r\n\tselector: '[autofocus]' // using [ ] means selecting attributes\r\n})\r\n\r\nexport class AutofocusDirective implements AfterViewInit, DoCheck {\r\n\tprivate lastVisible = false;\r\n\tprivate initialised = false;\r\n\tconstructor(private el: ElementRef) {\r\n\t\tconsole.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\tconst visible = !!this.el.nativeElement.offsetParent;\r\n\t\tif (visible && !this.lastVisible) {\r\n\t\t\tsetTimeout(() => { this.el.nativeElement.focus(); }, 2); //no need to clearTimeout\r\n\t\t}\r\n\t\tthis.lastVisible = visible;\r\n\t}\r\n\r\n\t@Input() set autofocus(condition: boolean) {\r\n\t\tthis.lastVisible = condition !== false;\r\n\t}\r\n}\r\n","import { Directive, ElementRef, HostListener, Input } from '@angular/core';\r\n@Directive({\r\n\tselector: '[myHighlight]'\r\n})\r\nexport class HighlightDirective {\r\n\tconstructor(private el: ElementRef) {\r\n\t\tconsole.debug('HighlightDirective created.');\r\n\t}\r\n\r\n\t@Input() defaultColor?: string;\r\n\t@Input('myHighlight') highlightColor?: string;\r\n\t@HostListener('mouseenter') onMouseEnter() {\r\n\t\tthis.highlight(this.highlightColor || this.defaultColor || 'red');\r\n\t}\r\n\t@HostListener('mouseleave') onMouseLeave() {\r\n\t\tthis.highlight(undefined);\r\n\t}\r\n\tprivate highlight(color: string | undefined) {\r\n\t\tthis.el.nativeElement.style.backgroundColor = color;\r\n\t}\r\n}\r\n","import { Directive, HostListener, ElementRef, OnInit } from '@angular/core';\r\nimport { CurrencyFunc } from 'nmce-func';\r\n\r\n/**\r\n *\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, HostListener, ElementRef, OnInit } from '@angular/core';\r\nimport moment from 'moment';\r\n\r\n/**\r\n *\r\n */\r\n@Directive({ selector: '[datetimeFormatter]' })//inspired by https://blog.ngconsultant.io/custom-input-formatting-with-simple-directives-for-angular-2-ec792082976\r\nexport class DatetimeFormatterDirective implements OnInit {\r\n\r\n\tprivate el: HTMLInputElement;\r\n\r\n\t//@Input('datetimeFormatter')\r\n\tformat = 'DD/MM/YYYY HH:mm';\r\n\r\n\tformats = ['', 'DD/MM/YYYY HH:mm'];\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\tconst s = this.parse(this.el.value);\r\n\t\tthis.el.value = this.transform(s);\r\n\t}\r\n\r\n\t@HostListener('focus', ['$event.target.value'])\r\n\tonFocus() {\r\n\t\tconst s = this.parse(this.el.value);\r\n\t\tthis.el.value = this.transform(s);\r\n\t}\r\n\r\n\t@HostListener('blur', ['$event.target.value'])\r\n\tonBlur() {\r\n\t\tthis.el.value = this.transform(this.el.value);\r\n\t}\r\n\r\n\ttransform(value: Date | string | null): string {\r\n\t\tif (!value) {\r\n\t\t\treturn '';\r\n\t\t}\r\n\r\n\t\tconst s = moment(value).format(this.format);\r\n\t\tconsole.debug(`With format ${this.format} transform to ${s}`);\r\n\t\treturn s;\r\n\t}\r\n\r\n\tparse(value: string): Date | null {\r\n\t\tif (!value) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\tconst d = moment(value, this.formats).toDate();\r\n\t\tconsole.debug(`parse ${value} to ${d}`);\r\n\t\treturn d;\r\n\t}\r\n\r\n}\r\n\r\n","import { AfterViewInit, Directive, ElementRef, Input } from '@angular/core';\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 { 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 { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { FormsModule } from '@angular/forms';\r\n\r\n\r\nimport {\r\n\tAutofocusDirective, HighlightDirective, CurrencyFormatterDirective, DatetimeFormatterDirective, ScrollIntoDirective, DataComponentDirective,\r\n} from './index';\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\tHighlightDirective,\r\n\t\tCurrencyFormatterDirective,\r\n\t\tDatetimeFormatterDirective,\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\tHighlightDirective,\r\n\t\tCurrencyFormatterDirective,\r\n\t\tDatetimeFormatterDirective,\r\n\t\tScrollIntoDirective,\r\n\t\tDataComponentDirective,\r\n\t]\r\n})\r\nexport class NmceDirectivesModule { }\r\n"]}
+{"version":3,"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"],"names":["AutofocusDirective","el","this","toFocus","focused","initialised","everFocused","prototype","ngAfterViewInit","ngDoCheck","nativeElement","focus","console","debug","Object","defineProperty","condition","Directive","args","selector","ElementRef","Input","CurrencyFormatterDirective","elementRef","ngOnInit","value","CurrencyFunc","transformCurrency","onFocus","parseCurrency","onBlur","HostListener","viewContainerRef","ViewContainerRef","ScrollIntoDirective","scrollInto","scrollIntoView","NgModule","imports","CommonModule","FormsModule","declarations","DataComponentDirective","exports"],"mappings":"ufAeC,SAAAA,EAAoBC,GAAAC,KAAAD,GAAAA,EAJZC,KAAAC,SAAU,EACVD,KAAAE,SAAU,EACVF,KAAAG,aAAc,EACdH,KAAAI,aAAc,SAKtBN,EAAAO,UAAAC,gBAAA,WACCN,KAAKG,aAAc,EACnBH,KAAKO,aAGNT,EAAAO,UAAAE,UAAA,WACMP,KAAKG,eACNH,KAAKC,SAAYD,KAAKI,aAAgBJ,KAAKE,UAC9CF,KAAKD,GAAGS,cAAcC,QACtBT,KAAKE,SAAU,EACfF,KAAKI,aAAc,EACnBM,QAAQC,MAAM,mBAIhBC,OAAAC,eAAaf,EAAAO,UAAA,YAAS,KAAtB,SAAuBS,GACtBd,KAAKC,SAAwB,IAAda,4DA5BhBC,EAAAA,UAASC,KAAA,CAAC,CACVC,SAAU,2DARiCC,EAAAA,iDAkC1CC,EAAAA,0BCtBD,SAAAC,EAAoBC,GAAArB,KAAAqB,WAAAA,EACnBrB,KAAKD,GAAKC,KAAKqB,WAAWb,qBAG3BY,EAAAf,UAAAiB,SAAA,WACCtB,KAAKD,GAAGwB,MAAQC,EAAAA,aAAaC,kBAAkBzB,KAAKD,GAAGwB,QAIxDH,EAAAf,UAAAqB,QAAA,SAAQH,GACPvB,KAAKD,GAAGwB,MAAQC,EAAAA,aAAaG,cAAcJ,IAI5CH,EAAAf,UAAAuB,OAAA,SAAOL,GACNvB,KAAKD,GAAGwB,MAAQC,EAAAA,aAAaC,kBAAkBF,6BApBhDR,EAAAA,UAASC,KAAA,CAAC,CAAEC,SAAU,mEAPHC,EAAAA,+CAoBlBW,EAAAA,aAAYb,KAAA,CAAC,QAAS,CAAC,wCAKvBa,EAAAA,aAAYb,KAAA,CAAC,OAAQ,CAAC,iCCnBvB,SAAmBc,GAAA9B,KAAA8B,iBAAAA,uBAJnBf,EAAAA,UAASC,KAAA,CAAC,CACVC,SAAU,mEAHSc,EAAAA,qCCSnB,SAAAC,EAAoBjC,GAAAC,KAAAD,GAAAA,EAKpBC,KAAAiC,YAAsB,SAEtBD,EAAA3B,UAAAC,gBAAA,WACKN,KAAKiC,YACRjC,KAAKD,GAAGS,cAAc0B,2CAbxBnB,EAAAA,UAASC,KAAA,CAAC,CACVC,SAAU,4DANwBC,EAAAA,kDAajCC,EAAAA,eCqBF,iCArBCgB,EAAAA,SAAQnB,KAAA,CAAC,CACToB,QAAS,CACRC,EAAAA,aACAC,EAAAA,aAGDC,aAAc,CACbzC,EACAsB,EACAY,EACAQ,GAIDC,QAAS,CACR3C,EACAsB,EACAY,EACAQ","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"]}

package/esm2015/_directives/autofocus.js

@@ -1,11 +1,17 @@
 import { Directive, ElementRef, 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/
+/**
+ * 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.lastVisible = false;
+        this.toFocus = false;
+        this.focused = false;
         this.initialised = false;
-        console.debug('autofocusDirective created.');
+        this.everFocused = false;
+        //console.debug('autofocusDirective created.');
     }
     ngAfterViewInit() {
         this.initialised = true;
@@ -15,19 +21,20 @@ export class AutofocusDirective {
         if (!this.initialised) {
             return;
         }
-        const visible = !!this.el.nativeElement.offsetParent;
-        if (visible && !this.lastVisible) {
-            setTimeout(() => { this.el.nativeElement.focus(); }, 2); //no need to clearTimeout
+        if (this.toFocus && !this.everFocused && !this.focused) {
+            this.el.nativeElement.focus();
+            this.focused = true;
+            this.everFocused = true;
+            console.debug('focused now.');
         }
-        this.lastVisible = visible;
     }
     set autofocus(condition) {
-        this.lastVisible = condition !== false;
+        this.toFocus = condition !== false;
     }
 }
 AutofocusDirective.decorators = [
     { type: Directive, args: [{
-                selector: '[autofocus]' // using [ ] means selecting attributes
+                selector: '[autofocus]'
             },] }
 ];
 AutofocusDirective.ctorParameters = () => [
@@ -36,4 +43,4 @@ AutofocusDirective.ctorParameters = () => [
 AutofocusDirective.propDecorators = {
     autofocus: [{ type: Input }]
 };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXV0b2ZvY3VzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbm1jZS1kaXJlY3RpdmVzL3NyYy9fZGlyZWN0aXZlcy9hdXRvZm9jdXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBaUIsVUFBVSxFQUFXLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUdyRix5S0FBeUs7QUFLekssTUFBTSxPQUFPLGtCQUFrQjtJQUc5QixZQUFvQixFQUFjO1FBQWQsT0FBRSxHQUFGLEVBQUUsQ0FBWTtRQUYxQixnQkFBVyxHQUFHLEtBQUssQ0FBQztRQUNwQixnQkFBVyxHQUFHLEtBQUssQ0FBQztRQUUzQixPQUFPLENBQUMsS0FBSyxDQUFDLDZCQUE2QixDQUFDLENBQUM7SUFDOUMsQ0FBQztJQUVELGVBQWU7UUFDZCxJQUFJLENBQUMsV0FBVyxHQUFHLElBQUksQ0FBQztRQUN4QixJQUFJLENBQUMsU0FBUyxFQUFFLENBQUM7SUFDbEIsQ0FBQztJQUVELFNBQVM7UUFDUixJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRTtZQUFFLE9BQU87U0FBRTtRQUNsQyxNQUFNLE9BQU8sR0FBRyxDQUFDLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUMsWUFBWSxDQUFDO1FBQ3JELElBQUksT0FBTyxJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRTtZQUNqQyxVQUFVLENBQUMsR0FBRyxFQUFFLEdBQUcsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUMsS0FBSyxFQUFFLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUMsQ0FBQyx5QkFBeUI7U0FDbEY7UUFDRCxJQUFJLENBQUMsV0FBVyxHQUFHLE9BQU8sQ0FBQztJQUM1QixDQUFDO0lBRUQsSUFBYSxTQUFTLENBQUMsU0FBa0I7UUFDeEMsSUFBSSxDQUFDLFdBQVcsR0FBRyxTQUFTLEtBQUssS0FBSyxDQUFDO0lBQ3hDLENBQUM7OztZQTNCRCxTQUFTLFNBQUM7Z0JBQ1YsUUFBUSxFQUFFLGFBQWEsQ0FBQyx1Q0FBdUM7YUFDL0Q7OztZQU5rQyxVQUFVOzs7d0JBNkIzQyxLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGlyZWN0aXZlLCBBZnRlclZpZXdJbml0LCBFbGVtZW50UmVmLCBEb0NoZWNrLCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5cclxuXHJcbi8vIFNpbXBsZSBleGFtcGxlIGRpcmVjdGl2ZSB0aGF0IGZpeGVzIGF1dG9mb2N1cyBwcm9ibGVtIHdpdGggbXVsdGlwbGUgdmlld3MsIHNvdXJjZTogaHR0cHM6Ly93d3cucGljbmV0LmNvbS5hdS9ibG9ncy9ndWlkby9wb3N0LzIwMTYvMDkvMjAvYW5ndWxhcjItbmcyLWZvY3VzLWRpcmVjdGl2ZS9cclxuQERpcmVjdGl2ZSh7XHJcblx0c2VsZWN0b3I6ICdbYXV0b2ZvY3VzXScgLy8gdXNpbmcgWyBdIG1lYW5zIHNlbGVjdGluZyBhdHRyaWJ1dGVzXHJcbn0pXHJcblxyXG5leHBvcnQgY2xhc3MgQXV0b2ZvY3VzRGlyZWN0aXZlIGltcGxlbWVudHMgQWZ0ZXJWaWV3SW5pdCwgRG9DaGVjayB7XHJcblx0cHJpdmF0ZSBsYXN0VmlzaWJsZSA9IGZhbHNlO1xyXG5cdHByaXZhdGUgaW5pdGlhbGlzZWQgPSBmYWxzZTtcclxuXHRjb25zdHJ1Y3Rvcihwcml2YXRlIGVsOiBFbGVtZW50UmVmKSB7XHJcblx0XHRjb25zb2xlLmRlYnVnKCdhdXRvZm9jdXNEaXJlY3RpdmUgY3JlYXRlZC4nKTtcclxuXHR9XHJcblxyXG5cdG5nQWZ0ZXJWaWV3SW5pdCgpIHtcclxuXHRcdHRoaXMuaW5pdGlhbGlzZWQgPSB0cnVlO1xyXG5cdFx0dGhpcy5uZ0RvQ2hlY2soKTtcclxuXHR9XHJcblxyXG5cdG5nRG9DaGVjaygpIHtcclxuXHRcdGlmICghdGhpcy5pbml0aWFsaXNlZCkgeyByZXR1cm47IH1cclxuXHRcdGNvbnN0IHZpc2libGUgPSAhIXRoaXMuZWwubmF0aXZlRWxlbWVudC5vZmZzZXRQYXJlbnQ7XHJcblx0XHRpZiAodmlzaWJsZSAmJiAhdGhpcy5sYXN0VmlzaWJsZSkge1xyXG5cdFx0XHRzZXRUaW1lb3V0KCgpID0+IHsgdGhpcy5lbC5uYXRpdmVFbGVtZW50LmZvY3VzKCk7IH0sIDIpOyAvL25vIG5lZWQgdG8gY2xlYXJUaW1lb3V0XHJcblx0XHR9XHJcblx0XHR0aGlzLmxhc3RWaXNpYmxlID0gdmlzaWJsZTtcclxuXHR9XHJcblxyXG5cdEBJbnB1dCgpIHNldCBhdXRvZm9jdXMoY29uZGl0aW9uOiBib29sZWFuKSB7XHJcblx0XHR0aGlzLmxhc3RWaXNpYmxlID0gY29uZGl0aW9uICE9PSBmYWxzZTtcclxuXHR9XHJcbn1cclxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXV0b2ZvY3VzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbm1jZS1kaXJlY3RpdmVzL3NyYy9fZGlyZWN0aXZlcy9hdXRvZm9jdXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFpQixTQUFTLEVBQVcsVUFBVSxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUVyRjs7OztHQUlHO0FBSUgsTUFBTSxPQUFPLGtCQUFrQjtJQUs5QixZQUFvQixFQUFjO1FBQWQsT0FBRSxHQUFGLEVBQUUsQ0FBWTtRQUoxQixZQUFPLEdBQUcsS0FBSyxDQUFDO1FBQ2hCLFlBQU8sR0FBRyxLQUFLLENBQUM7UUFDaEIsZ0JBQVcsR0FBRyxLQUFLLENBQUM7UUFDcEIsZ0JBQVcsR0FBRyxLQUFLLENBQUM7UUFFM0IsK0NBQStDO0lBQ2hELENBQUM7SUFFRCxlQUFlO1FBQ2QsSUFBSSxDQUFDLFdBQVcsR0FBRyxJQUFJLENBQUM7UUFDeEIsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDO0lBQ2xCLENBQUM7SUFFRCxTQUFTO1FBQ1IsSUFBSSxDQUFDLElBQUksQ0FBQyxXQUFXLEVBQUU7WUFBRSxPQUFPO1NBQUU7UUFDbEMsSUFBSSxJQUFJLENBQUMsT0FBTyxJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLEVBQUU7WUFDdkQsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUMsS0FBSyxFQUFFLENBQUM7WUFDOUIsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUM7WUFDcEIsSUFBSSxDQUFDLFdBQVcsR0FBRyxJQUFJLENBQUM7WUFDeEIsT0FBTyxDQUFDLEtBQUssQ0FBQyxjQUFjLENBQUMsQ0FBQztTQUM5QjtJQUNGLENBQUM7SUFFRCxJQUFhLFNBQVMsQ0FBQyxTQUFrQjtRQUN4QyxJQUFJLENBQUMsT0FBTyxHQUFHLFNBQVMsS0FBSyxLQUFLLENBQUM7SUFDcEMsQ0FBQzs7O1lBN0JELFNBQVMsU0FBQztnQkFDVixRQUFRLEVBQUUsYUFBYTthQUN2Qjs7O1lBVDJDLFVBQVU7Ozt3QkFrQ3BELEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBZnRlclZpZXdJbml0LCBEaXJlY3RpdmUsIERvQ2hlY2ssIEVsZW1lbnRSZWYsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcblxyXG4vKipcclxuICogVXNlIGFzIGEgcGFyYW1ldGVyZWQgaW5wdXQgcGFyYW1ldGVyIGluIGh0bWwgZWxlbWVudC5cclxuICogV2hlbiB1c2VkIGluc2lkZSBhIG1hdGVyaWFsIGRpYWxvZywgdGhpcyBkaXJlY3RpdmUgbWF5IGJlIGF0IG9kZCBhZ2FpbnN0IHRoZSBhdXRvZm9jdXMgY29uZmlnIHBhcmFtZXRlciBvZiBNYXREaWFsb2dDb25maWcsIFxyXG4gKiBpZiB0aGUgYXV0b2ZvY3VzIGNvbmZpZyBpcyBub3QgZmFsc2UuIEdlbmVyYWxseSBzcGVha2luZywgbm8gbmVlZCB0byB1c2UgdGhpcyBkaXJlY3RpdmUgaW4gYSBjb21wb25lbnQgcHJlc2VudGVkIGluIGEgbWF0ZWlyYWwgZGlhbG9nLlxyXG4gKi9cclxuQERpcmVjdGl2ZSh7XHJcblx0c2VsZWN0b3I6ICdbYXV0b2ZvY3VzXSdcclxufSlcclxuZXhwb3J0IGNsYXNzIEF1dG9mb2N1c0RpcmVjdGl2ZSBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQsIERvQ2hlY2sge1xyXG5cdHByaXZhdGUgdG9Gb2N1cyA9IGZhbHNlO1xyXG5cdHByaXZhdGUgZm9jdXNlZCA9IGZhbHNlO1xyXG5cdHByaXZhdGUgaW5pdGlhbGlzZWQgPSBmYWxzZTtcclxuXHRwcml2YXRlIGV2ZXJGb2N1c2VkID0gZmFsc2U7XHJcblx0Y29uc3RydWN0b3IocHJpdmF0ZSBlbDogRWxlbWVudFJlZikge1xyXG5cdFx0Ly9jb25zb2xlLmRlYnVnKCdhdXRvZm9jdXNEaXJlY3RpdmUgY3JlYXRlZC4nKTtcclxuXHR9XHJcblxyXG5cdG5nQWZ0ZXJWaWV3SW5pdCgpIHtcclxuXHRcdHRoaXMuaW5pdGlhbGlzZWQgPSB0cnVlO1xyXG5cdFx0dGhpcy5uZ0RvQ2hlY2soKTtcclxuXHR9XHJcblxyXG5cdG5nRG9DaGVjaygpIHtcclxuXHRcdGlmICghdGhpcy5pbml0aWFsaXNlZCkgeyByZXR1cm47IH1cclxuXHRcdGlmICh0aGlzLnRvRm9jdXMgJiYgIXRoaXMuZXZlckZvY3VzZWQgJiYgIXRoaXMuZm9jdXNlZCkge1xyXG5cdFx0XHR0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuZm9jdXMoKTtcclxuXHRcdFx0dGhpcy5mb2N1c2VkID0gdHJ1ZTtcclxuXHRcdFx0dGhpcy5ldmVyRm9jdXNlZCA9IHRydWU7XHJcblx0XHRcdGNvbnNvbGUuZGVidWcoJ2ZvY3VzZWQgbm93LicpO1xyXG5cdFx0fVxyXG5cdH1cclxuXHJcblx0QElucHV0KCkgc2V0IGF1dG9mb2N1cyhjb25kaXRpb246IGJvb2xlYW4pIHtcclxuXHRcdHRoaXMudG9Gb2N1cyA9IGNvbmRpdGlvbiAhPT0gZmFsc2U7XHJcblx0fVxyXG59XHJcbiJdfQ==

package/esm2015/_directives/currencyFormatter.directive.js

@@ -1,7 +1,8 @@
-import { Directive, HostListener, ElementRef } from '@angular/core';
+import { Directive, ElementRef, HostListener } from '@angular/core';
 import { CurrencyFunc } from 'nmce-func';
 /**
- *
+ * 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) {
@@ -19,7 +20,8 @@ export class CurrencyFormatterDirective {
     }
 }
 CurrencyFormatterDirective.decorators = [
-    { type: Directive, args: [{ selector: '[currencyFormatter]' },] }
+    { type: Directive, args: [{ selector: '[currencyFormatter]' }, //inspired by https://blog.ngconsultant.io/custom-input-formatting-with-simple-directives-for-angular-2-ec792082976
+        ] }
 ];
 CurrencyFormatterDirective.ctorParameters = () => [
     { type: ElementRef }
@@ -28,4 +30,4 @@ CurrencyFormatterDirective.propDecorators = {
     onFocus: [{ type: HostListener, args: ['focus', ['$event.target.value'],] }],
     onBlur: [{ type: HostListener, args: ['blur', ['$event.target.value'],] }]
 };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3VycmVuY3lGb3JtYXR0ZXIuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbm1jZS1kaXJlY3RpdmVzL3NyYy9fZGlyZWN0aXZlcy9jdXJyZW5jeUZvcm1hdHRlci5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsVUFBVSxFQUFVLE1BQU0sZUFBZSxDQUFDO0FBQzVFLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxXQUFXLENBQUM7QUFFekM7O0dBRUc7QUFFSCxNQUFNLE9BQU8sMEJBQTBCO0lBSXRDLFlBQW9CLFVBQXNCO1FBQXRCLGVBQVUsR0FBVixVQUFVLENBQVk7UUFDekMsSUFBSSxDQUFDLEVBQUUsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQztJQUN6QyxDQUFDO0lBRUQsUUFBUTtRQUNQLElBQUksQ0FBQyxFQUFFLENBQUMsS0FBSyxHQUFHLFlBQVksQ0FBQyxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQy9ELENBQUM7SUFHRCxPQUFPLENBQUMsS0FBYTtRQUNwQixJQUFJLENBQUMsRUFBRSxDQUFDLEtBQUssR0FBRyxZQUFZLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsd0JBQXdCO0lBQzVFLENBQUM7SUFHRCxNQUFNLENBQUMsS0FBYTtRQUNuQixJQUFJLENBQUMsRUFBRSxDQUFDLEtBQUssR0FBRyxZQUFZLENBQUMsaUJBQWlCLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDdkQsQ0FBQzs7O1lBckJELFNBQVMsU0FBQyxFQUFFLFFBQVEsRUFBRSxxQkFBcUIsRUFBRTs7O1lBTlosVUFBVTs7O3NCQW1CMUMsWUFBWSxTQUFDLE9BQU8sRUFBRSxDQUFDLHFCQUFxQixDQUFDO3FCQUs3QyxZQUFZLFNBQUMsTUFBTSxFQUFFLENBQUMscUJBQXFCLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEaXJlY3RpdmUsIEhvc3RMaXN0ZW5lciwgRWxlbWVudFJlZiwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IEN1cnJlbmN5RnVuYyB9IGZyb20gJ25tY2UtZnVuYyc7XHJcblxyXG4vKipcclxuICpcclxuICovXHJcbkBEaXJlY3RpdmUoeyBzZWxlY3RvcjogJ1tjdXJyZW5jeUZvcm1hdHRlcl0nIH0pLy9pbnNwaXJlZCBieSBodHRwczovL2Jsb2cubmdjb25zdWx0YW50LmlvL2N1c3RvbS1pbnB1dC1mb3JtYXR0aW5nLXdpdGgtc2ltcGxlLWRpcmVjdGl2ZXMtZm9yLWFuZ3VsYXItMi1lYzc5MjA4Mjk3NlxyXG5leHBvcnQgY2xhc3MgQ3VycmVuY3lGb3JtYXR0ZXJEaXJlY3RpdmUgaW1wbGVtZW50cyBPbkluaXQge1xyXG5cclxuXHRwcml2YXRlIGVsOiBIVE1MSW5wdXRFbGVtZW50O1xyXG5cclxuXHRjb25zdHJ1Y3Rvcihwcml2YXRlIGVsZW1lbnRSZWY6IEVsZW1lbnRSZWYpIHtcclxuXHRcdHRoaXMuZWwgPSB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudDtcclxuXHR9XHJcblxyXG5cdG5nT25Jbml0KCkge1xyXG5cdFx0dGhpcy5lbC52YWx1ZSA9IEN1cnJlbmN5RnVuYy50cmFuc2Zvcm1DdXJyZW5jeSh0aGlzLmVsLnZhbHVlKTtcclxuXHR9XHJcblxyXG5cdEBIb3N0TGlzdGVuZXIoJ2ZvY3VzJywgWyckZXZlbnQudGFyZ2V0LnZhbHVlJ10pXHJcblx0b25Gb2N1cyh2YWx1ZTogc3RyaW5nKSB7XHJcblx0XHR0aGlzLmVsLnZhbHVlID0gQ3VycmVuY3lGdW5jLnBhcnNlQ3VycmVuY3kodmFsdWUpOyAvLyBvcG9zc2l0ZSBvZiB0cmFuc2Zvcm1cclxuXHR9XHJcblxyXG5cdEBIb3N0TGlzdGVuZXIoJ2JsdXInLCBbJyRldmVudC50YXJnZXQudmFsdWUnXSlcclxuXHRvbkJsdXIodmFsdWU6IHN0cmluZykge1xyXG5cdFx0dGhpcy5lbC52YWx1ZSA9IEN1cnJlbmN5RnVuYy50cmFuc2Zvcm1DdXJyZW5jeSh2YWx1ZSk7XHJcblx0fVxyXG5cclxufVxyXG5cclxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3VycmVuY3lGb3JtYXR0ZXIuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbm1jZS1kaXJlY3RpdmVzL3NyYy9fZGlyZWN0aXZlcy9jdXJyZW5jeUZvcm1hdHRlci5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxVQUFVLEVBQUUsWUFBWSxFQUFVLE1BQU0sZUFBZSxDQUFDO0FBQzVFLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxXQUFXLENBQUM7QUFFekM7OztHQUdHO0FBRUgsTUFBTSxPQUFPLDBCQUEwQjtJQUl0QyxZQUFvQixVQUFzQjtRQUF0QixlQUFVLEdBQVYsVUFBVSxDQUFZO1FBQ3pDLElBQUksQ0FBQyxFQUFFLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUM7SUFDekMsQ0FBQztJQUVELFFBQVE7UUFDUCxJQUFJLENBQUMsRUFBRSxDQUFDLEtBQUssR0FBRyxZQUFZLENBQUMsaUJBQWlCLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUMvRCxDQUFDO0lBR0QsT0FBTyxDQUFDLEtBQWE7UUFDcEIsSUFBSSxDQUFDLEVBQUUsQ0FBQyxLQUFLLEdBQUcsWUFBWSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLHdCQUF3QjtJQUM1RSxDQUFDO0lBR0QsTUFBTSxDQUFDLEtBQWE7UUFDbkIsSUFBSSxDQUFDLEVBQUUsQ0FBQyxLQUFLLEdBQUcsWUFBWSxDQUFDLGlCQUFpQixDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ3ZELENBQUM7OztZQXJCRCxTQUFTLFNBQUMsRUFBRSxRQUFRLEVBQUUscUJBQXFCLEVBQUUsRUFBQyxtSEFBbUg7Ozs7WUFQOUksVUFBVTs7O3NCQW9CNUIsWUFBWSxTQUFDLE9BQU8sRUFBRSxDQUFDLHFCQUFxQixDQUFDO3FCQUs3QyxZQUFZLFNBQUMsTUFBTSxFQUFFLENBQUMscUJBQXFCLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEaXJlY3RpdmUsIEVsZW1lbnRSZWYsIEhvc3RMaXN0ZW5lciwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IEN1cnJlbmN5RnVuYyB9IGZyb20gJ25tY2UtZnVuYyc7XHJcblxyXG4vKipcclxuICogRGVjb3JhdGUgSFRNTCBpbnB1dCBmb3IgaW5wdXRpbmcgYW5kIGRpc3BsYXlpbmcgY3VycmVuY3kuIFRoZSBpbnB1dCB0eXBlIG11c3Qgbm90IGJlIG51bWJlciBhbmQgc2hvdWxkIGJlIHRleHQgb25seS5cclxuICogSWYgdGhlIGlucHV0IHR5cGUgaXMgbnVtYmVyLCB0aGUgYnVpbHQtaW4gdmFsaWRhdG9yIHdpbGwgYmUgZmlnaHRpbmcgYWdhaW5zdCB0aGlzIGRpcmVjdGl2ZS5cclxuICovXHJcbkBEaXJlY3RpdmUoeyBzZWxlY3RvcjogJ1tjdXJyZW5jeUZvcm1hdHRlcl0nIH0pLy9pbnNwaXJlZCBieSBodHRwczovL2Jsb2cubmdjb25zdWx0YW50LmlvL2N1c3RvbS1pbnB1dC1mb3JtYXR0aW5nLXdpdGgtc2ltcGxlLWRpcmVjdGl2ZXMtZm9yLWFuZ3VsYXItMi1lYzc5MjA4Mjk3NlxyXG5leHBvcnQgY2xhc3MgQ3VycmVuY3lGb3JtYXR0ZXJEaXJlY3RpdmUgaW1wbGVtZW50cyBPbkluaXQge1xyXG5cclxuXHRwcml2YXRlIGVsOiBIVE1MSW5wdXRFbGVtZW50O1xyXG5cclxuXHRjb25zdHJ1Y3Rvcihwcml2YXRlIGVsZW1lbnRSZWY6IEVsZW1lbnRSZWYpIHtcclxuXHRcdHRoaXMuZWwgPSB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudDtcclxuXHR9XHJcblxyXG5cdG5nT25Jbml0KCkge1xyXG5cdFx0dGhpcy5lbC52YWx1ZSA9IEN1cnJlbmN5RnVuYy50cmFuc2Zvcm1DdXJyZW5jeSh0aGlzLmVsLnZhbHVlKTtcclxuXHR9XHJcblxyXG5cdEBIb3N0TGlzdGVuZXIoJ2ZvY3VzJywgWyckZXZlbnQudGFyZ2V0LnZhbHVlJ10pXHJcblx0b25Gb2N1cyh2YWx1ZTogc3RyaW5nKSB7XHJcblx0XHR0aGlzLmVsLnZhbHVlID0gQ3VycmVuY3lGdW5jLnBhcnNlQ3VycmVuY3kodmFsdWUpOyAvLyBvcG9zc2l0ZSBvZiB0cmFuc2Zvcm1cclxuXHR9XHJcblxyXG5cdEBIb3N0TGlzdGVuZXIoJ2JsdXInLCBbJyRldmVudC50YXJnZXQudmFsdWUnXSlcclxuXHRvbkJsdXIodmFsdWU6IHN0cmluZykge1xyXG5cdFx0dGhpcy5lbC52YWx1ZSA9IEN1cnJlbmN5RnVuYy50cmFuc2Zvcm1DdXJyZW5jeSh2YWx1ZSk7XHJcblx0fVxyXG5cclxufVxyXG5cclxuIl19

package/esm2015/_directives/directives.module.js

@@ -1,7 +1,7 @@
-import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
-import { AutofocusDirective, HighlightDirective, CurrencyFormatterDirective, DatetimeFormatterDirective, ScrollIntoDirective, DataComponentDirective, } from './index';
+import { AutofocusDirective, CurrencyFormatterDirective, DataComponentDirective, ScrollIntoDirective } 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.
  *
@@ -16,20 +16,16 @@ NmceDirectivesModule.decorators = [
                 ],
                 declarations: [
                     AutofocusDirective,
-                    HighlightDirective,
                     CurrencyFormatterDirective,
-                    DatetimeFormatterDirective,
                     ScrollIntoDirective,
                     DataComponentDirective,
                 ],
                 exports: [
                     AutofocusDirective,
-                    HighlightDirective,
                     CurrencyFormatterDirective,
-                    DatetimeFormatterDirective,
                     ScrollIntoDirective,
                     DataComponentDirective,
                 ]
             },] }
 ];
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGlyZWN0aXZlcy5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9ubWNlLWRpcmVjdGl2ZXMvc3JjL19kaXJlY3RpdmVzL2RpcmVjdGl2ZXMubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUc3QyxPQUFPLEVBQ04sa0JBQWtCLEVBQUUsa0JBQWtCLEVBQUUsMEJBQTBCLEVBQUUsMEJBQTBCLEVBQUUsbUJBQW1CLEVBQUUsc0JBQXNCLEdBQzNJLE1BQU0sU0FBUyxDQUFDO0FBRWpCOzs7R0FHRztBQTBCSCxNQUFNLE9BQU8sb0JBQW9COzs7WUF6QmhDLFFBQVEsU0FBQztnQkFDVCxPQUFPLEVBQUU7b0JBQ1IsWUFBWTtvQkFDWixXQUFXO2lCQUNYO2dCQUVELFlBQVksRUFBRTtvQkFDYixrQkFBa0I7b0JBQ2xCLGtCQUFrQjtvQkFDbEIsMEJBQTBCO29CQUMxQiwwQkFBMEI7b0JBQzFCLG1CQUFtQjtvQkFDbkIsc0JBQXNCO2lCQUN0QjtnQkFHRCxPQUFPLEVBQUU7b0JBQ1Isa0JBQWtCO29CQUNsQixrQkFBa0I7b0JBQ2xCLDBCQUEwQjtvQkFDMUIsMEJBQTBCO29CQUMxQixtQkFBbUI7b0JBQ25CLHNCQUFzQjtpQkFDdEI7YUFDRCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcbmltcG9ydCB7IEZvcm1zTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xyXG5cclxuXHJcbmltcG9ydCB7XHJcblx0QXV0b2ZvY3VzRGlyZWN0aXZlLCBIaWdobGlnaHREaXJlY3RpdmUsIEN1cnJlbmN5Rm9ybWF0dGVyRGlyZWN0aXZlLCBEYXRldGltZUZvcm1hdHRlckRpcmVjdGl2ZSwgU2Nyb2xsSW50b0RpcmVjdGl2ZSwgRGF0YUNvbXBvbmVudERpcmVjdGl2ZSxcclxufSBmcm9tICcuL2luZGV4JztcclxuXHJcbi8qKlxyXG4gKiBDb250YWluIGNvbXBvbmVudHMuIE90aGVyIGZlYXR1cmUvbGF6eSBtb2R1bGVzIHRoYXQgbmVlZCB0byBhY2Nlc3MgY3VzdG9tIGh0bWwgZWxlbWVudCBvZiBjb21wb25lbnRzIGxpa2UgbXktZGF0ZXRpbWVwaWNrZXIgc3RpbGwgbmVlZCB0byBpbXBvcnQgdGhpcyBtb2R1bGUgZXhwbGljaXRseS5cclxuICpcclxuICovXHJcbkBOZ01vZHVsZSh7XHJcblx0aW1wb3J0czogW1xyXG5cdFx0Q29tbW9uTW9kdWxlLFxyXG5cdFx0Rm9ybXNNb2R1bGUsXHJcblx0XSxcclxuXHJcblx0ZGVjbGFyYXRpb25zOiBbXHJcblx0XHRBdXRvZm9jdXNEaXJlY3RpdmUsXHJcblx0XHRIaWdobGlnaHREaXJlY3RpdmUsXHJcblx0XHRDdXJyZW5jeUZvcm1hdHRlckRpcmVjdGl2ZSxcclxuXHRcdERhdGV0aW1lRm9ybWF0dGVyRGlyZWN0aXZlLFxyXG5cdFx0U2Nyb2xsSW50b0RpcmVjdGl2ZSxcclxuXHRcdERhdGFDb21wb25lbnREaXJlY3RpdmUsXHJcblx0XSxcclxuXHJcblxyXG5cdGV4cG9ydHM6IFtcclxuXHRcdEF1dG9mb2N1c0RpcmVjdGl2ZSxcclxuXHRcdEhpZ2hsaWdodERpcmVjdGl2ZSxcclxuXHRcdEN1cnJlbmN5Rm9ybWF0dGVyRGlyZWN0aXZlLFxyXG5cdFx0RGF0ZXRpbWVGb3JtYXR0ZXJEaXJlY3RpdmUsXHJcblx0XHRTY3JvbGxJbnRvRGlyZWN0aXZlLFxyXG5cdFx0RGF0YUNvbXBvbmVudERpcmVjdGl2ZSxcclxuXHRdXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBObWNlRGlyZWN0aXZlc01vZHVsZSB7IH1cclxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGlyZWN0aXZlcy5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9ubWNlLWRpcmVjdGl2ZXMvc3JjL19kaXJlY3RpdmVzL2RpcmVjdGl2ZXMubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3pDLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUM3QyxPQUFPLEVBQ04sa0JBQWtCLEVBQUUsMEJBQTBCLEVBQUUsc0JBQXNCLEVBQUUsbUJBQW1CLEVBQzNGLE1BQU0sU0FBUyxDQUFDO0FBSWpCOzs7R0FHRztBQXNCSCxNQUFNLE9BQU8sb0JBQW9COzs7WUFyQmhDLFFBQVEsU0FBQztnQkFDVCxPQUFPLEVBQUU7b0JBQ1IsWUFBWTtvQkFDWixXQUFXO2lCQUNYO2dCQUVELFlBQVksRUFBRTtvQkFDYixrQkFBa0I7b0JBQ2xCLDBCQUEwQjtvQkFDMUIsbUJBQW1CO29CQUNuQixzQkFBc0I7aUJBQ3RCO2dCQUdELE9BQU8sRUFBRTtvQkFDUixrQkFBa0I7b0JBQ2xCLDBCQUEwQjtvQkFDMUIsbUJBQW1CO29CQUNuQixzQkFBc0I7aUJBQ3RCO2FBQ0QiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xyXG5pbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBGb3Jtc01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuaW1wb3J0IHtcclxuXHRBdXRvZm9jdXNEaXJlY3RpdmUsIEN1cnJlbmN5Rm9ybWF0dGVyRGlyZWN0aXZlLCBEYXRhQ29tcG9uZW50RGlyZWN0aXZlLCBTY3JvbGxJbnRvRGlyZWN0aXZlXHJcbn0gZnJvbSAnLi9pbmRleCc7XHJcblxyXG5cclxuXHJcbi8qKlxyXG4gKiBDb250YWluIGNvbXBvbmVudHMuIE90aGVyIGZlYXR1cmUvbGF6eSBtb2R1bGVzIHRoYXQgbmVlZCB0byBhY2Nlc3MgY3VzdG9tIGh0bWwgZWxlbWVudCBvZiBjb21wb25lbnRzIGxpa2UgbXktZGF0ZXRpbWVwaWNrZXIgc3RpbGwgbmVlZCB0byBpbXBvcnQgdGhpcyBtb2R1bGUgZXhwbGljaXRseS5cclxuICpcclxuICovXHJcbkBOZ01vZHVsZSh7XHJcblx0aW1wb3J0czogW1xyXG5cdFx0Q29tbW9uTW9kdWxlLFxyXG5cdFx0Rm9ybXNNb2R1bGUsXHJcblx0XSxcclxuXHJcblx0ZGVjbGFyYXRpb25zOiBbXHJcblx0XHRBdXRvZm9jdXNEaXJlY3RpdmUsXHJcblx0XHRDdXJyZW5jeUZvcm1hdHRlckRpcmVjdGl2ZSxcclxuXHRcdFNjcm9sbEludG9EaXJlY3RpdmUsXHJcblx0XHREYXRhQ29tcG9uZW50RGlyZWN0aXZlLFxyXG5cdF0sXHJcblxyXG5cclxuXHRleHBvcnRzOiBbXHJcblx0XHRBdXRvZm9jdXNEaXJlY3RpdmUsXHJcblx0XHRDdXJyZW5jeUZvcm1hdHRlckRpcmVjdGl2ZSxcclxuXHRcdFNjcm9sbEludG9EaXJlY3RpdmUsXHJcblx0XHREYXRhQ29tcG9uZW50RGlyZWN0aXZlLFxyXG5cdF1cclxufSlcclxuZXhwb3J0IGNsYXNzIE5tY2VEaXJlY3RpdmVzTW9kdWxlIHsgfVxyXG4iXX0=

package/esm2015/_directives/index.js

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

package/esm2015/_directives/scrollInto.directive.js

@@ -1,4 +1,7 @@
 import { Directive, ElementRef, Input } 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;
@@ -22,4 +25,4 @@ ScrollIntoDirective.ctorParameters = () => [
 ScrollIntoDirective.propDecorators = {
     scrollInto: [{ type: Input }]
 };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2Nyb2xsSW50by5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9ubWNlLWRpcmVjdGl2ZXMvc3JjL19kaXJlY3RpdmVzL3Njcm9sbEludG8uZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBaUIsU0FBUyxFQUFFLFVBQVUsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFJNUUsTUFBTSxPQUFPLG1CQUFtQjtJQUMvQixZQUFvQixFQUFjO1FBQWQsT0FBRSxHQUFGLEVBQUUsQ0FBWTtRQUtsQyxlQUFVLEdBQVksS0FBSyxDQUFDO1FBSjNCLGlEQUFpRDtJQUNsRCxDQUFDO0lBS0QsZUFBZTtRQUNkLElBQUksSUFBSSxDQUFDLFVBQVUsRUFBRTtZQUNwQixJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsQ0FBQyxjQUFjLEVBQUUsQ0FBQztTQUN2QztJQUNGLENBQUM7OztZQWZELFNBQVMsU0FBQztnQkFDVixRQUFRLEVBQUUsY0FBYzthQUN4Qjs7O1lBSGtDLFVBQVU7Ozt5QkFTM0MsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEFmdGVyVmlld0luaXQsIERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuQERpcmVjdGl2ZSh7XHJcblx0c2VsZWN0b3I6ICdbc2Nyb2xsSW50b10nXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBTY3JvbGxJbnRvRGlyZWN0aXZlIGltcGxlbWVudHMgQWZ0ZXJWaWV3SW5pdCB7XHJcblx0Y29uc3RydWN0b3IocHJpdmF0ZSBlbDogRWxlbWVudFJlZikge1xyXG5cdFx0Ly9cdGNvbnNvbGUuZGVidWcoJ1Njcm9sbEludG9EaXJlY3RpdmUgY3JlYXRlZC4nKTtcclxuXHR9XHJcblxyXG5cdEBJbnB1dCgpXHJcblx0c2Nyb2xsSW50bzogYm9vbGVhbiA9IGZhbHNlO1xyXG5cclxuXHRuZ0FmdGVyVmlld0luaXQoKSB7XHJcblx0XHRpZiAodGhpcy5zY3JvbGxJbnRvKSB7XHJcblx0XHRcdHRoaXMuZWwubmF0aXZlRWxlbWVudC5zY3JvbGxJbnRvVmlldygpO1xyXG5cdFx0fVxyXG5cdH1cclxufVxyXG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2Nyb2xsSW50by5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9ubWNlLWRpcmVjdGl2ZXMvc3JjL19kaXJlY3RpdmVzL3Njcm9sbEludG8uZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBaUIsU0FBUyxFQUFFLFVBQVUsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFFNUU7O0dBRUc7QUFJSCxNQUFNLE9BQU8sbUJBQW1CO0lBQy9CLFlBQW9CLEVBQWM7UUFBZCxPQUFFLEdBQUYsRUFBRSxDQUFZO1FBS2xDLGVBQVUsR0FBWSxLQUFLLENBQUM7UUFKM0IsaURBQWlEO0lBQ2xELENBQUM7SUFLRCxlQUFlO1FBQ2QsSUFBSSxJQUFJLENBQUMsVUFBVSxFQUFFO1lBQ3BCLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLGNBQWMsRUFBRSxDQUFDO1NBQ3ZDO0lBQ0YsQ0FBQzs7O1lBZkQsU0FBUyxTQUFDO2dCQUNWLFFBQVEsRUFBRSxjQUFjO2FBQ3hCOzs7WUFQa0MsVUFBVTs7O3lCQWEzQyxLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQWZ0ZXJWaWV3SW5pdCwgRGlyZWN0aXZlLCBFbGVtZW50UmVmLCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5cclxuLyoqXHJcbiAqIFNjcm9sbCB0byBlbGVtZW50IGF0dGFjaGVkLiBBbmQgdGhlIGVsZW1lbnQgbWF5IGJlIGFuIEFuZ3VsYXIgTWF0ZXJpYWwgY29tcG9uZW50IHRvby5cclxuICovXHJcbkBEaXJlY3RpdmUoe1xyXG5cdHNlbGVjdG9yOiAnW3Njcm9sbEludG9dJ1xyXG59KVxyXG5leHBvcnQgY2xhc3MgU2Nyb2xsSW50b0RpcmVjdGl2ZSBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQge1xyXG5cdGNvbnN0cnVjdG9yKHByaXZhdGUgZWw6IEVsZW1lbnRSZWYpIHtcclxuXHRcdC8vXHRjb25zb2xlLmRlYnVnKCdTY3JvbGxJbnRvRGlyZWN0aXZlIGNyZWF0ZWQuJyk7XHJcblx0fVxyXG5cclxuXHRASW5wdXQoKVxyXG5cdHNjcm9sbEludG86IGJvb2xlYW4gPSBmYWxzZTtcclxuXHJcblx0bmdBZnRlclZpZXdJbml0KCkge1xyXG5cdFx0aWYgKHRoaXMuc2Nyb2xsSW50bykge1xyXG5cdFx0XHR0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuc2Nyb2xsSW50b1ZpZXcoKTtcclxuXHRcdH1cclxuXHR9XHJcbn1cclxuIl19

package/fesm2015/nmce-directives.js

@@ -1,16 +1,21 @@
 import { Directive, ElementRef, Input, HostListener, ViewContainerRef, NgModule } from '@angular/core';
 import { CurrencyFunc } from 'nmce-func';
-import moment from 'moment';
 import { CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
 
-// 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/
+/**
+ * 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.lastVisible = false;
+        this.toFocus = false;
+        this.focused = false;
         this.initialised = false;
-        console.debug('autofocusDirective created.');
+        this.everFocused = false;
+        //console.debug('autofocusDirective created.');
     }
     ngAfterViewInit() {
         this.initialised = true;
@@ -20,19 +25,20 @@ class AutofocusDirective {
         if (!this.initialised) {
             return;
         }
-        const visible = !!this.el.nativeElement.offsetParent;
-        if (visible && !this.lastVisible) {
-            setTimeout(() => { this.el.nativeElement.focus(); }, 2); //no need to clearTimeout
+        if (this.toFocus && !this.everFocused && !this.focused) {
+            this.el.nativeElement.focus();
+            this.focused = true;
+            this.everFocused = true;
+            console.debug('focused now.');
         }
-        this.lastVisible = visible;
     }
     set autofocus(condition) {
-        this.lastVisible = condition !== false;
+        this.toFocus = condition !== false;
     }
 }
 AutofocusDirective.decorators = [
     { type: Directive, args: [{
-                selector: '[autofocus]' // using [ ] means selecting attributes
+                selector: '[autofocus]'
             },] }
 ];
 AutofocusDirective.ctorParameters = () => [
@@ -42,38 +48,9 @@ AutofocusDirective.propDecorators = {
     autofocus: [{ type: Input }]
 };
 
-class HighlightDirective {
-    constructor(el) {
-        this.el = el;
-        console.debug('HighlightDirective created.');
-    }
-    onMouseEnter() {
-        this.highlight(this.highlightColor || this.defaultColor || 'red');
-    }
-    onMouseLeave() {
-        this.highlight(undefined);
-    }
-    highlight(color) {
-        this.el.nativeElement.style.backgroundColor = color;
-    }
-}
-HighlightDirective.decorators = [
-    { type: Directive, args: [{
-                selector: '[myHighlight]'
-            },] }
-];
-HighlightDirective.ctorParameters = () => [
-    { type: ElementRef }
-];
-HighlightDirective.propDecorators = {
-    defaultColor: [{ type: Input }],
-    highlightColor: [{ type: Input, args: ['myHighlight',] }],
-    onMouseEnter: [{ type: HostListener, args: ['mouseenter',] }],
-    onMouseLeave: [{ type: HostListener, args: ['mouseleave',] }]
-};
-
 /**
- *
+ * 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) {
@@ -91,7 +68,8 @@ class CurrencyFormatterDirective {
     }
 }
 CurrencyFormatterDirective.decorators = [
-    { type: Directive, args: [{ selector: '[currencyFormatter]' },] }
+    { type: Directive, args: [{ selector: '[currencyFormatter]' }, //inspired by https://blog.ngconsultant.io/custom-input-formatting-with-simple-directives-for-angular-2-ec792082976
+        ] }
 ];
 CurrencyFormatterDirective.ctorParameters = () => [
     { type: ElementRef }
@@ -101,56 +79,23 @@ CurrencyFormatterDirective.propDecorators = {
     onBlur: [{ type: HostListener, args: ['blur', ['$event.target.value'],] }]
 };
 
-/**
- *
- */
-class DatetimeFormatterDirective {
-    constructor(elementRef) {
-        this.elementRef = elementRef;
-        //@Input('datetimeFormatter')
-        this.format = 'DD/MM/YYYY HH:mm';
-        this.formats = ['', 'DD/MM/YYYY HH:mm'];
-        this.el = this.elementRef.nativeElement;
-    }
-    ngOnInit() {
-        const s = this.parse(this.el.value);
-        this.el.value = this.transform(s);
-    }
-    onFocus() {
-        const s = this.parse(this.el.value);
-        this.el.value = this.transform(s);
-    }
-    onBlur() {
-        this.el.value = this.transform(this.el.value);
-    }
-    transform(value) {
-        if (!value) {
-            return '';
-        }
-        const s = moment(value).format(this.format);
-        console.debug(`With format ${this.format} transform to ${s}`);
-        return s;
-    }
-    parse(value) {
-        if (!value) {
-            return null;
-        }
-        const d = moment(value, this.formats).toDate();
-        console.debug(`parse ${value} to ${d}`);
-        return d;
+class DataComponentDirective {
+    constructor(viewContainerRef) {
+        this.viewContainerRef = viewContainerRef;
     }
 }
-DatetimeFormatterDirective.decorators = [
-    { type: Directive, args: [{ selector: '[datetimeFormatter]' },] }
-];
-DatetimeFormatterDirective.ctorParameters = () => [
-    { type: ElementRef }
+DataComponentDirective.decorators = [
+    { type: Directive, args: [{
+                selector: '[dataComponentHost]',
+            },] }
 ];
-DatetimeFormatterDirective.propDecorators = {
-    onFocus: [{ type: HostListener, args: ['focus', ['$event.target.value'],] }],
-    onBlur: [{ type: HostListener, args: ['blur', ['$event.target.value'],] }]
-};
+DataComponentDirective.ctorParameters = () => [
+    { type: ViewContainerRef }
+];
 
+/**
+ * Scroll to element attached. And the element may be an Angular Material component too.
+ */
 class ScrollIntoDirective {
     constructor(el) {
         this.el = el;
@@ -175,20 +120,6 @@ ScrollIntoDirective.propDecorators = {
     scrollInto: [{ type: Input }]
 };
 
-class DataComponentDirective {
-    constructor(viewContainerRef) {
-        this.viewContainerRef = viewContainerRef;
-    }
-}
-DataComponentDirective.decorators = [
-    { type: Directive, args: [{
-                selector: '[dataComponentHost]',
-            },] }
-];
-DataComponentDirective.ctorParameters = () => [
-    { type: ViewContainerRef }
-];
-
 /**
  * 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.
  *
@@ -203,17 +134,13 @@ NmceDirectivesModule.decorators = [
                 ],
                 declarations: [
                     AutofocusDirective,
-                    HighlightDirective,
                     CurrencyFormatterDirective,
-                    DatetimeFormatterDirective,
                     ScrollIntoDirective,
                     DataComponentDirective,
                 ],
                 exports: [
                     AutofocusDirective,
-                    HighlightDirective,
                     CurrencyFormatterDirective,
-                    DatetimeFormatterDirective,
                     ScrollIntoDirective,
                     DataComponentDirective,
                 ]
@@ -228,5 +155,5 @@ NmceDirectivesModule.decorators = [
  * Generated bundle index. Do not edit.
  */
 
-export { AutofocusDirective, CurrencyFormatterDirective, DataComponentDirective, DatetimeFormatterDirective, HighlightDirective, NmceDirectivesModule, ScrollIntoDirective };
+export { AutofocusDirective, CurrencyFormatterDirective, DataComponentDirective, NmceDirectivesModule, ScrollIntoDirective };
 //# sourceMappingURL=nmce-directives.js.map

package/fesm2015/nmce-directives.js.map

@@ -1 +1 @@
-{"version":3,"file":"nmce-directives.js","sources":["../../../projects/nmce-directives/src/_directives/autofocus.ts","../../../projects/nmce-directives/src/_directives/highlight.directive.ts","../../../projects/nmce-directives/src/_directives/currencyFormatter.directive.ts","../../../projects/nmce-directives/src/_directives/datetimeFormatter.directive.ts","../../../projects/nmce-directives/src/_directives/scrollInto.directive.ts","../../../projects/nmce-directives/src/_directives/dataComponent.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 { Directive, AfterViewInit, ElementRef, DoCheck, Input } from '@angular/core';\r\n\r\n\r\n// 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/\r\n@Directive({\r\n\tselector: '[autofocus]' // using [ ] means selecting attributes\r\n})\r\n\r\nexport class AutofocusDirective implements AfterViewInit, DoCheck {\r\n\tprivate lastVisible = false;\r\n\tprivate initialised = false;\r\n\tconstructor(private el: ElementRef) {\r\n\t\tconsole.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\tconst visible = !!this.el.nativeElement.offsetParent;\r\n\t\tif (visible && !this.lastVisible) {\r\n\t\t\tsetTimeout(() => { this.el.nativeElement.focus(); }, 2); //no need to clearTimeout\r\n\t\t}\r\n\t\tthis.lastVisible = visible;\r\n\t}\r\n\r\n\t@Input() set autofocus(condition: boolean) {\r\n\t\tthis.lastVisible = condition !== false;\r\n\t}\r\n}\r\n","import { Directive, ElementRef, HostListener, Input } from '@angular/core';\r\n@Directive({\r\n\tselector: '[myHighlight]'\r\n})\r\nexport class HighlightDirective {\r\n\tconstructor(private el: ElementRef) {\r\n\t\tconsole.debug('HighlightDirective created.');\r\n\t}\r\n\r\n\t@Input() defaultColor?: string;\r\n\t@Input('myHighlight') highlightColor?: string;\r\n\t@HostListener('mouseenter') onMouseEnter() {\r\n\t\tthis.highlight(this.highlightColor || this.defaultColor || 'red');\r\n\t}\r\n\t@HostListener('mouseleave') onMouseLeave() {\r\n\t\tthis.highlight(undefined);\r\n\t}\r\n\tprivate highlight(color: string | undefined) {\r\n\t\tthis.el.nativeElement.style.backgroundColor = color;\r\n\t}\r\n}\r\n","import { Directive, HostListener, ElementRef, OnInit } from '@angular/core';\r\nimport { CurrencyFunc } from 'nmce-func';\r\n\r\n/**\r\n *\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, HostListener, ElementRef, OnInit } from '@angular/core';\r\nimport moment from 'moment';\r\n\r\n/**\r\n *\r\n */\r\n@Directive({ selector: '[datetimeFormatter]' })//inspired by https://blog.ngconsultant.io/custom-input-formatting-with-simple-directives-for-angular-2-ec792082976\r\nexport class DatetimeFormatterDirective implements OnInit {\r\n\r\n\tprivate el: HTMLInputElement;\r\n\r\n\t//@Input('datetimeFormatter')\r\n\tformat = 'DD/MM/YYYY HH:mm';\r\n\r\n\tformats = ['', 'DD/MM/YYYY HH:mm'];\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\tconst s = this.parse(this.el.value);\r\n\t\tthis.el.value = this.transform(s);\r\n\t}\r\n\r\n\t@HostListener('focus', ['$event.target.value'])\r\n\tonFocus() {\r\n\t\tconst s = this.parse(this.el.value);\r\n\t\tthis.el.value = this.transform(s);\r\n\t}\r\n\r\n\t@HostListener('blur', ['$event.target.value'])\r\n\tonBlur() {\r\n\t\tthis.el.value = this.transform(this.el.value);\r\n\t}\r\n\r\n\ttransform(value: Date | string | null): string {\r\n\t\tif (!value) {\r\n\t\t\treturn '';\r\n\t\t}\r\n\r\n\t\tconst s = moment(value).format(this.format);\r\n\t\tconsole.debug(`With format ${this.format} transform to ${s}`);\r\n\t\treturn s;\r\n\t}\r\n\r\n\tparse(value: string): Date | null {\r\n\t\tif (!value) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\tconst d = moment(value, this.formats).toDate();\r\n\t\tconsole.debug(`parse ${value} to ${d}`);\r\n\t\treturn d;\r\n\t}\r\n\r\n}\r\n\r\n","import { AfterViewInit, Directive, ElementRef, Input } from '@angular/core';\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 { 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 { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { FormsModule } from '@angular/forms';\r\n\r\n\r\nimport {\r\n\tAutofocusDirective, HighlightDirective, CurrencyFormatterDirective, DatetimeFormatterDirective, ScrollIntoDirective, DataComponentDirective,\r\n} from './index';\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\tHighlightDirective,\r\n\t\tCurrencyFormatterDirective,\r\n\t\tDatetimeFormatterDirective,\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\tHighlightDirective,\r\n\t\tCurrencyFormatterDirective,\r\n\t\tDatetimeFormatterDirective,\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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"}
+{"version":3,"file":"nmce-directives.js","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":";;;;;AAEA;;;;;MAQa,kBAAkB;IAK9B,YAAoB,EAAc;QAAd,OAAE,GAAF,EAAE,CAAY;QAJ1B,YAAO,GAAG,KAAK,CAAC;QAChB,YAAO,GAAG,KAAK,CAAC;QAChB,gBAAW,GAAG,KAAK,CAAC;QACpB,gBAAW,GAAG,KAAK,CAAC;;KAG3B;IAED,eAAe;QACd,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QACxB,IAAI,CAAC,SAAS,EAAE,CAAC;KACjB;IAED,SAAS;QACR,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;YAAE,OAAO;SAAE;QAClC,IAAI,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;YACvD,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;YAC9B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;YACpB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;YACxB,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;SAC9B;KACD;IAED,IAAa,SAAS,CAAC,SAAkB;QACxC,IAAI,CAAC,OAAO,GAAG,SAAS,KAAK,KAAK,CAAC;KACnC;;;YA7BD,SAAS,SAAC;gBACV,QAAQ,EAAE,aAAa;aACvB;;;YAT2C,UAAU;;;wBAkCpD,KAAK;;;AC/BP;;;;MAKa,0BAA0B;IAItC,YAAoB,UAAsB;QAAtB,eAAU,GAAV,UAAU,CAAY;QACzC,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC;KACxC;IAED,QAAQ;QACP,IAAI,CAAC,EAAE,CAAC,KAAK,GAAG,YAAY,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;KAC9D;IAGD,OAAO,CAAC,KAAa;QACpB,IAAI,CAAC,EAAE,CAAC,KAAK,GAAG,YAAY,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;KAClD;IAGD,MAAM,CAAC,KAAa;QACnB,IAAI,CAAC,EAAE,CAAC,KAAK,GAAG,YAAY,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAC;KACtD;;;YArBD,SAAS,SAAC,EAAE,QAAQ,EAAE,qBAAqB,EAAE;;;;YAP1B,UAAU;;;sBAoB5B,YAAY,SAAC,OAAO,EAAE,CAAC,qBAAqB,CAAC;qBAK7C,YAAY,SAAC,MAAM,EAAE,CAAC,qBAAqB,CAAC;;;MCpBjC,sBAAsB;IAClC,YAAmB,gBAAkC;QAAlC,qBAAgB,GAAhB,gBAAgB,CAAkB;KAAK;;;YAJ1D,SAAS,SAAC;gBACV,QAAQ,EAAE,qBAAqB;aAC/B;;;YAJmB,gBAAgB;;;ACEpC;;;MAMa,mBAAmB;IAC/B,YAAoB,EAAc;QAAd,OAAE,GAAF,EAAE,CAAY;QAKlC,eAAU,GAAY,KAAK,CAAC;;KAH3B;IAKD,eAAe;QACd,IAAI,IAAI,CAAC,UAAU,EAAE;YACpB,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,cAAc,EAAE,CAAC;SACvC;KACD;;;YAfD,SAAS,SAAC;gBACV,QAAQ,EAAE,cAAc;aACxB;;;YAPkC,UAAU;;;yBAa3C,KAAK;;;ACJP;;;;MAyBa,oBAAoB;;;YArBhC,QAAQ,SAAC;gBACT,OAAO,EAAE;oBACR,YAAY;oBACZ,WAAW;iBACX;gBAED,YAAY,EAAE;oBACb,kBAAkB;oBAClB,0BAA0B;oBAC1B,mBAAmB;oBACnB,sBAAsB;iBACtB;gBAGD,OAAO,EAAE;oBACR,kBAAkB;oBAClB,0BAA0B;oBAC1B,mBAAmB;oBACnB,sBAAsB;iBACtB;aACD;;;ACjCD;;;;ACAA;;;;;;"}

package/nmce-directives.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"AutofocusDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":4,"character":1},"arguments":[{"selector":"[autofocus]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":11,"character":25}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngDoCheck":[{"__symbolic":"method"}],"autofocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":2}}]}]}},"HighlightDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":1,"character":1},"arguments":[{"selector":"[myHighlight]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":5,"character":25}]}],"defaultColor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":9,"character":2}}]}],"highlightColor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":10,"character":2},"arguments":["myHighlight"]}]}],"onMouseEnter":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":11,"character":2},"arguments":["mouseenter"]}]}],"onMouseLeave":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":14,"character":2},"arguments":["mouseleave"]}]}],"highlight":[{"__symbolic":"method"}]}},"CurrencyFormatterDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":6,"character":1},"arguments":[{"selector":"[currencyFormatter]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":11,"character":33}]}],"ngOnInit":[{"__symbolic":"method"}],"onFocus":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":19,"character":2},"arguments":["focus",["$event.target.value"]]}]}],"onBlur":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":24,"character":2},"arguments":["blur",["$event.target.value"]]}]}]}},"DatetimeFormatterDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":6,"character":1},"arguments":[{"selector":"[datetimeFormatter]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":16,"character":33}]}],"ngOnInit":[{"__symbolic":"method"}],"onFocus":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":25,"character":2},"arguments":["focus",["$event.target.value"]]}]}],"onBlur":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":31,"character":2},"arguments":["blur",["$event.target.value"]]}]}],"transform":[{"__symbolic":"method"}],"parse":[{"__symbolic":"method"}]}},"ScrollIntoDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":1,"character":1},"arguments":[{"selector":"[scrollInto]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":5,"character":25}]}],"scrollInto":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":9,"character":2}}]}],"ngAfterViewInit":[{"__symbolic":"method"}]}},"DataComponentDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[dataComponentHost]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":6,"character":38}]}]}},"NmceDirectivesModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":13,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":15,"character":2},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":16,"character":2}],"declarations":[{"__symbolic":"reference","name":"AutofocusDirective"},{"__symbolic":"reference","name":"HighlightDirective"},{"__symbolic":"reference","name":"CurrencyFormatterDirective"},{"__symbolic":"reference","name":"DatetimeFormatterDirective"},{"__symbolic":"reference","name":"ScrollIntoDirective"},{"__symbolic":"reference","name":"DataComponentDirective"}],"exports":[{"__symbolic":"reference","name":"AutofocusDirective"},{"__symbolic":"reference","name":"HighlightDirective"},{"__symbolic":"reference","name":"CurrencyFormatterDirective"},{"__symbolic":"reference","name":"DatetimeFormatterDirective"},{"__symbolic":"reference","name":"ScrollIntoDirective"},{"__symbolic":"reference","name":"DataComponentDirective"}]}]}],"members":{}}},"origins":{"AutofocusDirective":"./_directives/autofocus","HighlightDirective":"./_directives/highlight.directive","CurrencyFormatterDirective":"./_directives/currencyFormatter.directive","DatetimeFormatterDirective":"./_directives/datetimeFormatter.directive","ScrollIntoDirective":"./_directives/scrollInto.directive","DataComponentDirective":"./_directives/dataComponent.directive","NmceDirectivesModule":"./_directives/directives.module"},"importAs":"nmce-directives"}
+{"__symbolic":"module","version":4,"metadata":{"AutofocusDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":7,"character":1},"arguments":[{"selector":"[autofocus]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":15,"character":25}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngDoCheck":[{"__symbolic":"method"}],"autofocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":2}}]}]}},"CurrencyFormatterDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":7,"character":1},"arguments":[{"selector":"[currencyFormatter]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":12,"character":33}]}],"ngOnInit":[{"__symbolic":"method"}],"onFocus":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":20,"character":2},"arguments":["focus",["$event.target.value"]]}]}],"onBlur":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":25,"character":2},"arguments":["blur",["$event.target.value"]]}]}]}},"DataComponentDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[dataComponentHost]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":6,"character":38}]}]}},"ScrollIntoDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":5,"character":1},"arguments":[{"selector":"[scrollInto]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":9,"character":25}]}],"scrollInto":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":2}}]}],"ngAfterViewInit":[{"__symbolic":"method"}]}},"NmceDirectivesModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":13,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":15,"character":2},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":16,"character":2}],"declarations":[{"__symbolic":"reference","name":"AutofocusDirective"},{"__symbolic":"reference","name":"CurrencyFormatterDirective"},{"__symbolic":"reference","name":"ScrollIntoDirective"},{"__symbolic":"reference","name":"DataComponentDirective"}],"exports":[{"__symbolic":"reference","name":"AutofocusDirective"},{"__symbolic":"reference","name":"CurrencyFormatterDirective"},{"__symbolic":"reference","name":"ScrollIntoDirective"},{"__symbolic":"reference","name":"DataComponentDirective"}]}]}],"members":{}}},"origins":{"AutofocusDirective":"./_directives/autofocus","CurrencyFormatterDirective":"./_directives/currencyFormatter.directive","DataComponentDirective":"./_directives/dataComponent.directive","ScrollIntoDirective":"./_directives/scrollInto.directive","NmceDirectivesModule":"./_directives/directives.module"},"importAs":"nmce-directives"}

package/package.json

@@ -1,12 +1,20 @@
 {
   "name": "nmce-directives",
-  "version": "0.0.2",
+  "version": "0.0.7",
+  "author": {
+    "name": "Z"
+  },
+  "description": "Common simple Angular directives used in business applications.",
+  "license": "MIT",
+  "repository": {
+    "url": "https://github.com/zijianhuang/nmce"
+  },
   "peerDependencies": {
-    "@angular/common": "^11.2.5",
-    "@angular/core": "^11.2.5"
+    "@angular/common": "^12.0.1",
+    "@angular/core": "^12.0.1"
   },
   "dependencies": {
-    "tslib": "^2.0.0"
+    "tslib": "^2.2.0"
   },
   "main": "bundles/nmce-directives.umd.js",
   "module": "fesm2015/nmce-directives.js",

package/_directives/datetimeFormatter.directive.d.ts

@@ -1,16 +0,0 @@
-import { ElementRef, OnInit } from '@angular/core';
-/**
- *
- */
-export declare class DatetimeFormatterDirective implements OnInit {
-    private elementRef;
-    private el;
-    format: string;
-    formats: string[];
-    constructor(elementRef: ElementRef);
-    ngOnInit(): void;
-    onFocus(): void;
-    onBlur(): void;
-    transform(value: Date | string | null): string;
-    parse(value: string): Date | null;
-}

package/_directives/highlight.directive.d.ts

@@ -1,10 +0,0 @@
-import { ElementRef } from '@angular/core';
-export declare class HighlightDirective {
-    private el;
-    constructor(el: ElementRef);
-    defaultColor?: string;
-    highlightColor?: string;
-    onMouseEnter(): void;
-    onMouseLeave(): void;
-    private highlight;
-}

package/esm2015/_directives/datetimeFormatter.directive.js

@@ -1,52 +0,0 @@
-import { Directive, HostListener, ElementRef } from '@angular/core';
-import moment from 'moment';
-/**
- *
- */
-export class DatetimeFormatterDirective {
-    constructor(elementRef) {
-        this.elementRef = elementRef;
-        //@Input('datetimeFormatter')
-        this.format = 'DD/MM/YYYY HH:mm';
-        this.formats = ['', 'DD/MM/YYYY HH:mm'];
-        this.el = this.elementRef.nativeElement;
-    }
-    ngOnInit() {
-        const s = this.parse(this.el.value);
-        this.el.value = this.transform(s);
-    }
-    onFocus() {
-        const s = this.parse(this.el.value);
-        this.el.value = this.transform(s);
-    }
-    onBlur() {
-        this.el.value = this.transform(this.el.value);
-    }
-    transform(value) {
-        if (!value) {
-            return '';
-        }
-        const s = moment(value).format(this.format);
-        console.debug(`With format ${this.format} transform to ${s}`);
-        return s;
-    }
-    parse(value) {
-        if (!value) {
-            return null;
-        }
-        const d = moment(value, this.formats).toDate();
-        console.debug(`parse ${value} to ${d}`);
-        return d;
-    }
-}
-DatetimeFormatterDirective.decorators = [
-    { type: Directive, args: [{ selector: '[datetimeFormatter]' },] }
-];
-DatetimeFormatterDirective.ctorParameters = () => [
-    { type: ElementRef }
-];
-DatetimeFormatterDirective.propDecorators = {
-    onFocus: [{ type: HostListener, args: ['focus', ['$event.target.value'],] }],
-    onBlur: [{ type: HostListener, args: ['blur', ['$event.target.value'],] }]
-};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0ZXRpbWVGb3JtYXR0ZXIuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbm1jZS1kaXJlY3RpdmVzL3NyYy9fZGlyZWN0aXZlcy9kYXRldGltZUZvcm1hdHRlci5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsVUFBVSxFQUFVLE1BQU0sZUFBZSxDQUFDO0FBQzVFLE9BQU8sTUFBTSxNQUFNLFFBQVEsQ0FBQztBQUU1Qjs7R0FFRztBQUVILE1BQU0sT0FBTywwQkFBMEI7SUFTdEMsWUFBb0IsVUFBc0I7UUFBdEIsZUFBVSxHQUFWLFVBQVUsQ0FBWTtRQUwxQyw2QkFBNkI7UUFDN0IsV0FBTSxHQUFHLGtCQUFrQixDQUFDO1FBRTVCLFlBQU8sR0FBRyxDQUFDLEVBQUUsRUFBRSxrQkFBa0IsQ0FBQyxDQUFDO1FBR2xDLElBQUksQ0FBQyxFQUFFLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUM7SUFDekMsQ0FBQztJQUVELFFBQVE7UUFDUCxNQUFNLENBQUMsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDcEMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMsQ0FBQztJQUNuQyxDQUFDO0lBR0QsT0FBTztRQUNOLE1BQU0sQ0FBQyxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUNwQyxJQUFJLENBQUMsRUFBRSxDQUFDLEtBQUssR0FBRyxJQUFJLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxDQUFDO0lBQ25DLENBQUM7SUFHRCxNQUFNO1FBQ0wsSUFBSSxDQUFDLEVBQUUsQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQy9DLENBQUM7SUFFRCxTQUFTLENBQUMsS0FBMkI7UUFDcEMsSUFBSSxDQUFDLEtBQUssRUFBRTtZQUNYLE9BQU8sRUFBRSxDQUFDO1NBQ1Y7UUFFRCxNQUFNLENBQUMsR0FBRyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUM1QyxPQUFPLENBQUMsS0FBSyxDQUFDLGVBQWUsSUFBSSxDQUFDLE1BQU0saUJBQWlCLENBQUMsRUFBRSxDQUFDLENBQUM7UUFDOUQsT0FBTyxDQUFDLENBQUM7SUFDVixDQUFDO0lBRUQsS0FBSyxDQUFDLEtBQWE7UUFDbEIsSUFBSSxDQUFDLEtBQUssRUFBRTtZQUNYLE9BQU8sSUFBSSxDQUFDO1NBQ1o7UUFFRCxNQUFNLENBQUMsR0FBRyxNQUFNLENBQUMsS0FBSyxFQUFFLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQyxNQUFNLEVBQUUsQ0FBQztRQUMvQyxPQUFPLENBQUMsS0FBSyxDQUFDLFNBQVMsS0FBSyxPQUFPLENBQUMsRUFBRSxDQUFDLENBQUM7UUFDeEMsT0FBTyxDQUFDLENBQUM7SUFDVixDQUFDOzs7WUFoREQsU0FBUyxTQUFDLEVBQUUsUUFBUSxFQUFFLHFCQUFxQixFQUFFOzs7WUFOWixVQUFVOzs7c0JBeUIxQyxZQUFZLFNBQUMsT0FBTyxFQUFFLENBQUMscUJBQXFCLENBQUM7cUJBTTdDLFlBQVksU0FBQyxNQUFNLEVBQUUsQ0FBQyxxQkFBcUIsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgSG9zdExpc3RlbmVyLCBFbGVtZW50UmVmLCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IG1vbWVudCBmcm9tICdtb21lbnQnO1xyXG5cclxuLyoqXHJcbiAqXHJcbiAqL1xyXG5ARGlyZWN0aXZlKHsgc2VsZWN0b3I6ICdbZGF0ZXRpbWVGb3JtYXR0ZXJdJyB9KS8vaW5zcGlyZWQgYnkgaHR0cHM6Ly9ibG9nLm5nY29uc3VsdGFudC5pby9jdXN0b20taW5wdXQtZm9ybWF0dGluZy13aXRoLXNpbXBsZS1kaXJlY3RpdmVzLWZvci1hbmd1bGFyLTItZWM3OTIwODI5NzZcclxuZXhwb3J0IGNsYXNzIERhdGV0aW1lRm9ybWF0dGVyRGlyZWN0aXZlIGltcGxlbWVudHMgT25Jbml0IHtcclxuXHJcblx0cHJpdmF0ZSBlbDogSFRNTElucHV0RWxlbWVudDtcclxuXHJcblx0Ly9ASW5wdXQoJ2RhdGV0aW1lRm9ybWF0dGVyJylcclxuXHRmb3JtYXQgPSAnREQvTU0vWVlZWSBISDptbSc7XHJcblxyXG5cdGZvcm1hdHMgPSBbJycsICdERC9NTS9ZWVlZIEhIOm1tJ107XHJcblxyXG5cdGNvbnN0cnVjdG9yKHByaXZhdGUgZWxlbWVudFJlZjogRWxlbWVudFJlZikge1xyXG5cdFx0dGhpcy5lbCA9IHRoaXMuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50O1xyXG5cdH1cclxuXHJcblx0bmdPbkluaXQoKSB7XHJcblx0XHRjb25zdCBzID0gdGhpcy5wYXJzZSh0aGlzLmVsLnZhbHVlKTtcclxuXHRcdHRoaXMuZWwudmFsdWUgPSB0aGlzLnRyYW5zZm9ybShzKTtcclxuXHR9XHJcblxyXG5cdEBIb3N0TGlzdGVuZXIoJ2ZvY3VzJywgWyckZXZlbnQudGFyZ2V0LnZhbHVlJ10pXHJcblx0b25Gb2N1cygpIHtcclxuXHRcdGNvbnN0IHMgPSB0aGlzLnBhcnNlKHRoaXMuZWwudmFsdWUpO1xyXG5cdFx0dGhpcy5lbC52YWx1ZSA9IHRoaXMudHJhbnNmb3JtKHMpO1xyXG5cdH1cclxuXHJcblx0QEhvc3RMaXN0ZW5lcignYmx1cicsIFsnJGV2ZW50LnRhcmdldC52YWx1ZSddKVxyXG5cdG9uQmx1cigpIHtcclxuXHRcdHRoaXMuZWwudmFsdWUgPSB0aGlzLnRyYW5zZm9ybSh0aGlzLmVsLnZhbHVlKTtcclxuXHR9XHJcblxyXG5cdHRyYW5zZm9ybSh2YWx1ZTogRGF0ZSB8IHN0cmluZyB8IG51bGwpOiBzdHJpbmcge1xyXG5cdFx0aWYgKCF2YWx1ZSkge1xyXG5cdFx0XHRyZXR1cm4gJyc7XHJcblx0XHR9XHJcblxyXG5cdFx0Y29uc3QgcyA9IG1vbWVudCh2YWx1ZSkuZm9ybWF0KHRoaXMuZm9ybWF0KTtcclxuXHRcdGNvbnNvbGUuZGVidWcoYFdpdGggZm9ybWF0ICR7dGhpcy5mb3JtYXR9IHRyYW5zZm9ybSB0byAke3N9YCk7XHJcblx0XHRyZXR1cm4gcztcclxuXHR9XHJcblxyXG5cdHBhcnNlKHZhbHVlOiBzdHJpbmcpOiBEYXRlIHwgbnVsbCB7XHJcblx0XHRpZiAoIXZhbHVlKSB7XHJcblx0XHRcdHJldHVybiBudWxsO1xyXG5cdFx0fVxyXG5cclxuXHRcdGNvbnN0IGQgPSBtb21lbnQodmFsdWUsIHRoaXMuZm9ybWF0cykudG9EYXRlKCk7XHJcblx0XHRjb25zb2xlLmRlYnVnKGBwYXJzZSAke3ZhbHVlfSB0byAke2R9YCk7XHJcblx0XHRyZXR1cm4gZDtcclxuXHR9XHJcblxyXG59XHJcblxyXG4iXX0=

package/esm2015/_directives/highlight.directive.js

@@ -1,31 +0,0 @@
-import { Directive, ElementRef, HostListener, Input } from '@angular/core';
-export class HighlightDirective {
-    constructor(el) {
-        this.el = el;
-        console.debug('HighlightDirective created.');
-    }
-    onMouseEnter() {
-        this.highlight(this.highlightColor || this.defaultColor || 'red');
-    }
-    onMouseLeave() {
-        this.highlight(undefined);
-    }
-    highlight(color) {
-        this.el.nativeElement.style.backgroundColor = color;
-    }
-}
-HighlightDirective.decorators = [
-    { type: Directive, args: [{
-                selector: '[myHighlight]'
-            },] }
-];
-HighlightDirective.ctorParameters = () => [
-    { type: ElementRef }
-];
-HighlightDirective.propDecorators = {
-    defaultColor: [{ type: Input }],
-    highlightColor: [{ type: Input, args: ['myHighlight',] }],
-    onMouseEnter: [{ type: HostListener, args: ['mouseenter',] }],
-    onMouseLeave: [{ type: HostListener, args: ['mouseleave',] }]
-};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaGlnaGxpZ2h0LmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL25tY2UtZGlyZWN0aXZlcy9zcmMvX2RpcmVjdGl2ZXMvaGlnaGxpZ2h0LmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBSTNFLE1BQU0sT0FBTyxrQkFBa0I7SUFDOUIsWUFBb0IsRUFBYztRQUFkLE9BQUUsR0FBRixFQUFFLENBQVk7UUFDakMsT0FBTyxDQUFDLEtBQUssQ0FBQyw2QkFBNkIsQ0FBQyxDQUFDO0lBQzlDLENBQUM7SUFJMkIsWUFBWTtRQUN2QyxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxjQUFjLElBQUksSUFBSSxDQUFDLFlBQVksSUFBSSxLQUFLLENBQUMsQ0FBQztJQUNuRSxDQUFDO0lBQzJCLFlBQVk7UUFDdkMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxTQUFTLENBQUMsQ0FBQztJQUMzQixDQUFDO0lBQ08sU0FBUyxDQUFDLEtBQXlCO1FBQzFDLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxlQUFlLEdBQUcsS0FBSyxDQUFDO0lBQ3JELENBQUM7OztZQWxCRCxTQUFTLFNBQUM7Z0JBQ1YsUUFBUSxFQUFFLGVBQWU7YUFDekI7OztZQUhtQixVQUFVOzs7MkJBUzVCLEtBQUs7NkJBQ0wsS0FBSyxTQUFDLGFBQWE7MkJBQ25CLFlBQVksU0FBQyxZQUFZOzJCQUd6QixZQUFZLFNBQUMsWUFBWSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSG9zdExpc3RlbmVyLCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5ARGlyZWN0aXZlKHtcclxuXHRzZWxlY3RvcjogJ1tteUhpZ2hsaWdodF0nXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBIaWdobGlnaHREaXJlY3RpdmUge1xyXG5cdGNvbnN0cnVjdG9yKHByaXZhdGUgZWw6IEVsZW1lbnRSZWYpIHtcclxuXHRcdGNvbnNvbGUuZGVidWcoJ0hpZ2hsaWdodERpcmVjdGl2ZSBjcmVhdGVkLicpO1xyXG5cdH1cclxuXHJcblx0QElucHV0KCkgZGVmYXVsdENvbG9yPzogc3RyaW5nO1xyXG5cdEBJbnB1dCgnbXlIaWdobGlnaHQnKSBoaWdobGlnaHRDb2xvcj86IHN0cmluZztcclxuXHRASG9zdExpc3RlbmVyKCdtb3VzZWVudGVyJykgb25Nb3VzZUVudGVyKCkge1xyXG5cdFx0dGhpcy5oaWdobGlnaHQodGhpcy5oaWdobGlnaHRDb2xvciB8fCB0aGlzLmRlZmF1bHRDb2xvciB8fCAncmVkJyk7XHJcblx0fVxyXG5cdEBIb3N0TGlzdGVuZXIoJ21vdXNlbGVhdmUnKSBvbk1vdXNlTGVhdmUoKSB7XHJcblx0XHR0aGlzLmhpZ2hsaWdodCh1bmRlZmluZWQpO1xyXG5cdH1cclxuXHRwcml2YXRlIGhpZ2hsaWdodChjb2xvcjogc3RyaW5nIHwgdW5kZWZpbmVkKSB7XHJcblx0XHR0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuc3R5bGUuYmFja2dyb3VuZENvbG9yID0gY29sb3I7XHJcblx0fVxyXG59XHJcbiJdfQ==