@magic-xpa/angular-material-core 4.702.0 → 4.800.0-dev000.0

package/bundles/magic-xpa-angular-material-core.umd.js

@@ -1,8 +1,30 @@
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('@magic-xpa/angular'), require('@angular/material/sort'), require('@angular/material/table'), require('@angular/cdk/collections'), require('@magic-xpa/engine'), require('util'), require('@angular/material/paginator'), require('@angular/material/dialog'), require('@angular/material/input'), require('@angular/material/button'), require('@angular/material/list'), require('@angular/material/checkbox'), require('@angular/material/tabs'), require('@angular/material/select'), require('@angular/material/datepicker'), require('@angular/material/core')) :
     typeof define === 'function' && define.amd ? define('@magic-xpa/angular-material-core', ['exports', '@angular/core', '@angular/common', '@angular/forms', '@magic-xpa/angular', '@angular/material/sort', '@angular/material/table', '@angular/cdk/collections', '@magic-xpa/engine', 'util', '@angular/material/paginator', '@angular/material/dialog', '@angular/material/input', '@angular/material/button', '@angular/material/list', '@angular/material/checkbox', '@angular/material/tabs', '@angular/material/select', '@angular/material/datepicker', '@angular/material/core'], factory) :
-    (global = global || self, factory((global['magic-xpa'] = global['magic-xpa'] || {}, global['magic-xpa']['angular-material-core'] = {}), global.ng.core, global.ng.common, global.ng.forms, global.i1, global.ng.material.sort, global.ng.material.table, global.ng.cdk.collections, global.engine, global.util, global.ng.material.paginator, global.ng.material.dialog, global.ng.material.input, global.ng.material.button, global.ng.material.list, global.ng.material.checkbox, global.ng.material.tabs, global.ng.material.select, global.ng.material.datepicker, global.ng.material.core));
-}(this, (function (exports, i0, common, forms, i1, sort, table, collections, engine, util, paginator, i1$1, input, button, list, checkbox, tabs, select, datepicker, core) { 'use strict';
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global["magic-xpa"] = global["magic-xpa"] || {}, global["magic-xpa"]["angular-material-core"] = {}), global.ng.core, global.ng.common, global.ng.forms, global.i1, global.ng.material.sort, global.ng.material.table, global.ng.cdk.collections, global.engine, global.util, global.ng.material.paginator, global.ng.material.dialog, global.ng.material.input, global.ng.material.button, global.ng.material.list, global.ng.material.checkbox, global.ng.material.tabs, global.ng.material.select, global.ng.material.datepicker, global.ng.material.core));
+})(this, (function (exports, i0, common, forms, i1, sort, table, collections, engine, util, paginator, i1$1, input, button, list, checkbox, tabs, select, datepicker, core) { 'use strict';
+
+    function _interopNamespace(e) {
+        if (e && e.__esModule) return e;
+        var n = Object.create(null);
+        if (e) {
+            Object.keys(e).forEach(function (k) {
+                if (k !== 'default') {
+                    var d = Object.getOwnPropertyDescriptor(e, k);
+                    Object.defineProperty(n, k, d.get ? d : {
+                        enumerable: true,
+                        get: function () { return e[k]; }
+                    });
+                }
+            });
+        }
+        n["default"] = e;
+        return Object.freeze(n);
+    }
+
+    var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
+    var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
+    var i1__namespace$1 = /*#__PURE__*/_interopNamespace(i1$1);
 
     /*! *****************************************************************************
     Copyright (c) Microsoft Corporation.
@@ -296,9 +318,6 @@
         return value;
     }
 
-    /**
-     * Directive for material-design checkboxes not on material-design table
-     */
     var MatCheckboxDirective = /** @class */ (function (_super) {
         __extends(MatCheckboxDirective, _super);
         function MatCheckboxDirective() {
@@ -306,11 +325,11 @@
         }
         return MatCheckboxDirective;
     }(i1.CheckboxMagicDirective));
-    /** @nocollapse */ MatCheckboxDirective.ɵfac = function MatCheckboxDirective_Factory(t) { return ɵMatCheckboxDirective_BaseFactory(t || MatCheckboxDirective); };
-    /** @nocollapse */ MatCheckboxDirective.ɵdir = i0.ɵɵdefineDirective({ type: MatCheckboxDirective, selectors: [["mat-checkbox", "magic", "", 3, "noFormControl", ""]], features: [i0.ɵɵInheritDefinitionFeature] });
-    var ɵMatCheckboxDirective_BaseFactory = /*@__PURE__*/ i0.ɵɵgetInheritedFactory(MatCheckboxDirective);
-    /*@__PURE__*/ (function () {
-        i0.ɵsetClassMetadata(MatCheckboxDirective, [{
+    MatCheckboxDirective.ɵfac = function MatCheckboxDirective_Factory(t) { return ɵMatCheckboxDirective_BaseFactory(t || MatCheckboxDirective); };
+    MatCheckboxDirective.ɵdir = i0__namespace.ɵɵdefineDirective({ type: MatCheckboxDirective, selectors: [["mat-checkbox", "magic", "", 3, "noFormControl", ""]], features: [i0__namespace.ɵɵInheritDefinitionFeature] });
+    var ɵMatCheckboxDirective_BaseFactory = i0__namespace.ɵɵgetInheritedFactory(MatCheckboxDirective);
+    (function () {
+        i0__namespace.ɵsetClassMetadata(MatCheckboxDirective, [{
                 type: i0.Directive,
                 args: [{
                         selector: "\n    mat-checkbox[magic]:not([noFormControl])\n    ",
@@ -318,18 +337,11 @@
             }], null, null);
     })();
 
-    /**
-     * Directive for material-design comboboxes not on material-design table
-     */
     var MatComboboxDirective = /** @class */ (function (_super) {
         __extends(MatComboboxDirective, _super);
         function MatComboboxDirective() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        /**
-         * Handles the "selectionChange" event - pass it to the "change" event handler
-         * @param $event
-         */
         MatComboboxDirective.prototype.onChange = function ($event) {
             _super.prototype.onChange.call(this, $event);
         };
@@ -338,15 +350,15 @@
         };
         return MatComboboxDirective;
     }(i1.ComboboxMagicDirective));
-    /** @nocollapse */ MatComboboxDirective.ɵfac = function MatComboboxDirective_Factory(t) { return ɵMatComboboxDirective_BaseFactory(t || MatComboboxDirective); };
-    /** @nocollapse */ MatComboboxDirective.ɵdir = i0.ɵɵdefineDirective({ type: MatComboboxDirective, selectors: [["mat-select", "magic", ""]], hostBindings: function MatComboboxDirective_HostBindings(rf, ctx) {
+    MatComboboxDirective.ɵfac = function MatComboboxDirective_Factory(t) { return ɵMatComboboxDirective_BaseFactory(t || MatComboboxDirective); };
+    MatComboboxDirective.ɵdir = i0__namespace.ɵɵdefineDirective({ type: MatComboboxDirective, selectors: [["mat-select", "magic", ""]], hostBindings: function MatComboboxDirective_HostBindings(rf, ctx) {
             if (rf & 1) {
-                i0.ɵɵlistener("selectionChange", function MatComboboxDirective_selectionChange_HostBindingHandler($event) { return ctx.onChange($event); })("openedChange", function MatComboboxDirective_openedChange_HostBindingHandler($event) { return ctx.onOpenedChanged($event); });
+                i0__namespace.ɵɵlistener("selectionChange", function MatComboboxDirective_selectionChange_HostBindingHandler($event) { return ctx.onChange($event); })("openedChange", function MatComboboxDirective_openedChange_HostBindingHandler($event) { return ctx.onOpenedChanged($event); });
             }
-        }, features: [i0.ɵɵInheritDefinitionFeature] });
-    var ɵMatComboboxDirective_BaseFactory = /*@__PURE__*/ i0.ɵɵgetInheritedFactory(MatComboboxDirective);
-    /*@__PURE__*/ (function () {
-        i0.ɵsetClassMetadata(MatComboboxDirective, [{
+        }, features: [i0__namespace.ɵɵInheritDefinitionFeature] });
+    var ɵMatComboboxDirective_BaseFactory = i0__namespace.ɵɵgetInheritedFactory(MatComboboxDirective);
+    (function () {
+        i0__namespace.ɵsetClassMetadata(MatComboboxDirective, [{
                 type: i0.Directive,
                 args: [{
                         selector: "mat-select[magic]",
@@ -360,14 +372,8 @@
                 }] });
     })();
 
-    /**
-     * Extends the Magic table service to supply functionality for Material Design tables
-     */
     var MgMatTableService = /** @class */ (function (_super) {
         __extends(MgMatTableService, _super);
-        /**
-         * @ignore
-         */
         function MgMatTableService(componentList, task) {
             var _this = _super.call(this, componentList, task) || this;
             _this.componentList = componentList;
@@ -375,15 +381,9 @@
             return _this;
         }
         Object.defineProperty(MgMatTableService.prototype, "DataSource", {
-            /**
-             * @ignore
-             */
             get: function () {
                 return this.dataSource;
             },
-            /**
-             * @ignore
-             */
             set: function (dataSource) {
                 this.dataSource = dataSource;
             },
@@ -391,15 +391,9 @@
             configurable: true
         });
         Object.defineProperty(MgMatTableService.prototype, "Selection", {
-            /**
-             * @ignore
-             */
             get: function () {
                 return this.selection;
             },
-            /**
-             * @ignore
-             */
             set: function (selection) {
                 this.selection = selection;
             },
@@ -407,86 +401,47 @@
             configurable: true
         });
         Object.defineProperty(MgMatTableService.prototype, "Paginator", {
-            /**
-             * @ignore
-             */
             get: function () {
                 return this.paginator;
             },
-            /**
-             * @ignore
-             */
             set: function (paginator) {
                 this.paginator = paginator;
             },
             enumerable: false,
             configurable: true
         });
-        /**
-         * Connects the service to the elements of the table component
-         * @param dataSource Table data source
-         * @param paginator Table paginator
-         * @param selection table SelectionModel
-         * @param dialog Dialog used for editing values
-         */
         MgMatTableService.prototype.connect = function (dataSource, paginator, selection, dialog) {
             this.dataSource = dataSource;
             this.paginator = paginator;
             this.selection = selection;
             this.dialog = dialog;
         };
-        /**
-         * @ignore
-         */
         MgMatTableService.prototype.refreshDataSource = function () {
             if (!util.isNullOrUndefined(this.paginator))
                 this.dataSource.paginator = this.paginator;
             this.dataSource.data = (this.task.mgAccessorService.isDataviewEmpty() ? [] : this.task.Records.list);
         };
-        /**
-         * returns the page size of the table
-         * @returns
-         */
         MgMatTableService.prototype.getPageSize = function () {
             if (util.isNullOrUndefined(this.paginator))
                 return _super.prototype.getPageSize.call(this);
             return this.paginator.pageSize;
         };
-        /**
-         * Selects a table row
-         * @param guiRowid Id of row to be selected
-         */
         MgMatTableService.prototype.selectRow = function (guiRowid) {
             _super.prototype.selectRow.call(this, guiRowid);
             this.selection.select(this.task.Records.list[guiRowid]);
             this.refreshDataSource();
         };
-        /**
-         * @ignore
-         */
         MgMatTableService.prototype.getDialog = function () {
             return this.dialog;
         };
-        /**
-         * Displays the requested table page
-         * @param pageId Id of page to be selected
-         */
         MgMatTableService.prototype.selectPage = function (pageId) {
             if (!util.isNullOrUndefined(this.paginator))
                 this.paginator.pageIndex = pageId;
             this.refreshDataSource();
         };
-        /**
-         * Returns the currently seleted row
-         * @returns
-         */
         MgMatTableService.prototype.selectedRow = function () {
             return this.selection.selected[0];
         };
-        /**
-         * Handle the paginator's "page" event
-         * @param e The event received from the UI
-         */
         MgMatTableService.prototype.mgOnPaginateChange = function (e) {
             if (this.task.oldPageSize != e.pageSize) {
                 this.handleResize(e.pageIndex, e.previousPageIndex, e.pageSize);
@@ -495,32 +450,16 @@
             else
                 this.getRowsIfNeeded(e.pageIndex, e.previousPageIndex, e.pageSize);
         };
-        /**
-         * Handle resize and set table top index.
-         * @param pageIndex : New page index.
-         * @param prevPageIndex : Prev page index
-         * @param pageSize : PageSize
-         */
         MgMatTableService.prototype.handleResize = function (pageIndex, prevPageIndex, pageSize) {
             var requiredGuiRowId = pageIndex * pageSize;
             this.task.resize(pageSize, requiredGuiRowId);
         };
-        /**
-         * Execute getRows to fetch required chunk of records.
-         * @param pageIndex : New page index.
-         * @param prevPageIndex : Prev page index
-         * @param pageSize : PageSize
-         */
         MgMatTableService.prototype.getRowsIfNeeded = function (pageIndex, prevPageIndex, pageSize) {
             var guiEvent = engine.getGuiEventObj("getRows", "table", 0);
             guiEvent.Line = pageIndex * pageSize;
             this.task.insertEvent(guiEvent);
             this.setTableTopIndex(this.task.getDvRowId(pageSize * pageIndex));
         };
-        /**
-         * Handles the "matSortChange" event
-         * @param e The event received from the UI
-         */
         MgMatTableService.prototype.sortData = function (e) {
             var direction = 0;
             if (e.direction === 'asc')
@@ -530,13 +469,8 @@
             var guiEvent = engine.getGuiEventObj("columnSort", e.active, direction);
             this.task.insertEvent(guiEvent);
         };
-        /**
-         * Change the number of lines in a table
-         * @param  size New number of lines in table
-         */
         MgMatTableService.prototype.updateTableSize = function (size) {
-            if (size === 0) // never remove row 0 for now
-             {
+            if (size === 0) {
                 size = 1;
                 this.task.Records.clearFirstTableRecord(this.task.template);
             }
@@ -546,57 +480,37 @@
             this.task.Records.updateSize(size);
             this.task.setIncludesFirst(false);
         };
-        /**
-         * Handle the selection of row and if needed move to respective page.
-         * @param  guiRowId New number of lines in table
-         */
         MgMatTableService.prototype.selectPageForGuiRowId = function (guiRowId) {
             var pageToBeSelected = 0;
             var prevSelectedRow = this.selectedRow();
             pageToBeSelected = Math.floor(guiRowId / this.getPageSize());
-            // Explicitly handle selection of page when it's not raised by using pagination
             if ((util.isNullOrUndefined(prevSelectedRow) || (!util.isNullOrUndefined(this.paginator) && pageToBeSelected != this.paginator.pageIndex)))
                 this.selectPage(pageToBeSelected);
         };
-        /**
-         * @ignore
-         */
         MgMatTableService.prototype.setTableTopIndex = function (value) {
             this.task.Records.setGuiTopIndex(value);
             if (value >= 0)
                 this.selectPageForGuiRowId(this.task.getGuiRowId(value, true));
         };
-        /**
-         * @ignore
-         */
         MgMatTableService.prototype.getTableTopIndex = function () {
             return this.task.Records.getGuiTopIndex();
         };
         return MgMatTableService;
     }(i1.TableMagicService));
-    /** @nocollapse */ MgMatTableService.ɵfac = function MgMatTableService_Factory(t) { return new (t || MgMatTableService)(i0.ɵɵinject(i1.ComponentListMagicService), i0.ɵɵinject(i1.TaskMagicService)); };
-    /** @nocollapse */ MgMatTableService.ɵprov = i0.ɵɵdefineInjectable({ token: MgMatTableService, factory: MgMatTableService.ɵfac });
-    /*@__PURE__*/ (function () {
-        i0.ɵsetClassMetadata(MgMatTableService, [{
+    MgMatTableService.ɵfac = function MgMatTableService_Factory(t) { return new (t || MgMatTableService)(i0__namespace.ɵɵinject(i1__namespace.ComponentListMagicService), i0__namespace.ɵɵinject(i1__namespace.TaskMagicService)); };
+    MgMatTableService.ɵprov = i0__namespace.ɵɵdefineInjectable({ token: MgMatTableService, factory: MgMatTableService.ɵfac });
+    (function () {
+        i0__namespace.ɵsetClassMetadata(MgMatTableService, [{
                 type: i0.Injectable
-            }], function () { return [{ type: i1.ComponentListMagicService }, { type: i1.TaskMagicService }]; }, null);
+            }], function () { return [{ type: i1__namespace.ComponentListMagicService }, { type: i1__namespace.TaskMagicService }]; }, null);
     })();
 
-    /**
-     * @ignore
-     */
     var matMagicProviders = __spread(i1.basicMagicProviders, [
         { provide: i1.TableMagicService, useClass: MgMatTableService }
     ]);
 
-    /**
-     * This component is the base component for forms which has a material-design table (grid)
-     */
     var BaseMatTableMagicComponent = /** @class */ (function (_super) {
         __extends(BaseMatTableMagicComponent, _super);
-        /**
-         * @ignore
-         */
         function BaseMatTableMagicComponent(dialog, ref, magicService) {
             var _this = _super.call(this, ref, magicService) || this;
             _this.dialog = dialog;
@@ -607,16 +521,10 @@
             _this.selection = new collections.SelectionModel(false, []);
             return _this;
         }
-        /**
-         * Initializer
-         */
         BaseMatTableMagicComponent.prototype.ngOnInit = function () {
             _super.prototype.ngOnInit.call(this);
             this.magicService.tableService.connect(this.dataSource, this.paginator, this.selection, this.dialog);
         };
-        /**
-         * AfterContentChecked implementation
-         */
         BaseMatTableMagicComponent.prototype.ngAfterContentChecked = function () {
             if (!util.isNullOrUndefined(this.paginator) && !util.isNullOrUndefined(this.paginator.pageSize) &&
                 this.paginator.pageSize != this.task.oldPageSize) {
@@ -626,26 +534,26 @@
         };
         return BaseMatTableMagicComponent;
     }(i1.TaskBaseMagicComponent));
-    /** @nocollapse */ BaseMatTableMagicComponent.ɵfac = function BaseMatTableMagicComponent_Factory(t) { return new (t || BaseMatTableMagicComponent)(i0.ɵɵdirectiveInject(i1$1.MatDialog), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i1.MagicServices)); };
-    /** @nocollapse */ BaseMatTableMagicComponent.ɵcmp = i0.ɵɵdefineComponent({ type: BaseMatTableMagicComponent, selectors: [["ng-component"]], viewQuery: function BaseMatTableMagicComponent_Query(rf, ctx) {
+    BaseMatTableMagicComponent.ɵfac = function BaseMatTableMagicComponent_Factory(t) { return new (t || BaseMatTableMagicComponent)(i0__namespace.ɵɵdirectiveInject(i1__namespace$1.MatDialog), i0__namespace.ɵɵdirectiveInject(i0__namespace.ChangeDetectorRef), i0__namespace.ɵɵdirectiveInject(i1__namespace.MagicServices)); };
+    BaseMatTableMagicComponent.ɵcmp = i0__namespace.ɵɵdefineComponent({ type: BaseMatTableMagicComponent, selectors: [["ng-component"]], viewQuery: function BaseMatTableMagicComponent_Query(rf, ctx) {
             if (rf & 1) {
-                i0.ɵɵstaticViewQuery(paginator.MatPaginator, true);
-                i0.ɵɵstaticViewQuery(sort.MatSort, true);
+                i0__namespace.ɵɵstaticViewQuery(paginator.MatPaginator, true);
+                i0__namespace.ɵɵstaticViewQuery(sort.MatSort, true);
             }
             if (rf & 2) {
                 var _t;
-                i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.paginator = _t.first);
-                i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.sort = _t.first);
+                i0__namespace.ɵɵqueryRefresh(_t = i0__namespace.ɵɵloadQuery()) && (ctx.paginator = _t.first);
+                i0__namespace.ɵɵqueryRefresh(_t = i0__namespace.ɵɵloadQuery()) && (ctx.sort = _t.first);
             }
-        }, features: [i0.ɵɵProvidersFeature(matMagicProviders), i0.ɵɵInheritDefinitionFeature], decls: 0, vars: 0, template: function BaseMatTableMagicComponent_Template(rf, ctx) { }, encapsulation: 2 });
-    /*@__PURE__*/ (function () {
-        i0.ɵsetClassMetadata(BaseMatTableMagicComponent, [{
+        }, features: [i0__namespace.ɵɵProvidersFeature(matMagicProviders), i0__namespace.ɵɵInheritDefinitionFeature], decls: 0, vars: 0, template: function BaseMatTableMagicComponent_Template(rf, ctx) { }, encapsulation: 2 });
+    (function () {
+        i0__namespace.ɵsetClassMetadata(BaseMatTableMagicComponent, [{
                 type: i0.Component,
                 args: [{
                         providers: matMagicProviders,
                         template: ''
                     }]
-            }], function () { return [{ type: i1$1.MatDialog }, { type: i0.ChangeDetectorRef }, { type: i1.MagicServices }]; }, { paginator: [{
+            }], function () { return [{ type: i1__namespace$1.MatDialog }, { type: i0__namespace.ChangeDetectorRef }, { type: i1__namespace.MagicServices }]; }, { paginator: [{
                     type: i0.ViewChild,
                     args: [paginator.MatPaginator, { static: true }]
                 }], sort: [{
@@ -654,43 +562,65 @@
                 }] });
     })();
 
-    /**
-     * Directive for material-design listboxes not on material-design table
-     */
     var MatListboxDirective = /** @class */ (function () {
         function MatListboxDirective(magicDirective) {
             this.magicDirective = magicDirective;
         }
-        /**
-         * Handles the "selectionChange" event - pass it to the "change" event handler
-         * @param $event
-         */
         MatListboxDirective.prototype.onChange = function ($event) {
             this.magicDirective.task.onListBoxSelectionChanged($event, this.magicDirective.id);
         };
         return MatListboxDirective;
     }());
-    /** @nocollapse */ MatListboxDirective.ɵfac = function MatListboxDirective_Factory(t) { return new (t || MatListboxDirective)(i0.ɵɵdirectiveInject(i1.MagicDirective)); };
-    /** @nocollapse */ MatListboxDirective.ɵdir = i0.ɵɵdefineDirective({ type: MatListboxDirective, selectors: [["mat-selection-list", "magic", ""]], hostBindings: function MatListboxDirective_HostBindings(rf, ctx) {
+    MatListboxDirective.ɵfac = function MatListboxDirective_Factory(t) { return new (t || MatListboxDirective)(i0__namespace.ɵɵdirectiveInject(i1__namespace.MagicDirective)); };
+    MatListboxDirective.ɵdir = i0__namespace.ɵɵdefineDirective({ type: MatListboxDirective, selectors: [["mat-selection-list", "magic", ""]], hostBindings: function MatListboxDirective_HostBindings(rf, ctx) {
             if (rf & 1) {
-                i0.ɵɵlistener("selectionChange", function MatListboxDirective_selectionChange_HostBindingHandler($event) { return ctx.onChange($event); });
+                i0__namespace.ɵɵlistener("selectionChange", function MatListboxDirective_selectionChange_HostBindingHandler($event) { return ctx.onChange($event); });
             }
         } });
-    /*@__PURE__*/ (function () {
-        i0.ɵsetClassMetadata(MatListboxDirective, [{
+    (function () {
+        i0__namespace.ɵsetClassMetadata(MatListboxDirective, [{
                 type: i0.Directive,
                 args: [{
                         selector: "mat-selection-list[magic]",
                     }]
-            }], function () { return [{ type: i1.MagicDirective }]; }, { onChange: [{
+            }], function () { return [{ type: i1__namespace.MagicDirective }]; }, { onChange: [{
                     type: i0.HostListener,
                     args: ['selectionChange', ['$event']]
                 }] });
     })();
 
-    /**
-     * @ignore
-     */
+    var MatMagicAutocompleteDirective = /** @class */ (function () {
+        function MatMagicAutocompleteDirective() {
+        }
+        MatMagicAutocompleteDirective.prototype.onOpenedChanged = function ($event) {
+            i1.MagicDirective.noOfAutoCompleteBoxesOpened++;
+        };
+        MatMagicAutocompleteDirective.prototype.onClosedChanged = function ($event) {
+            i1.MagicDirective.noOfAutoCompleteBoxesOpened--;
+        };
+        return MatMagicAutocompleteDirective;
+    }());
+    MatMagicAutocompleteDirective.ɵfac = function MatMagicAutocompleteDirective_Factory(t) { return new (t || MatMagicAutocompleteDirective)(); };
+    MatMagicAutocompleteDirective.ɵdir = i0__namespace.ɵɵdefineDirective({ type: MatMagicAutocompleteDirective, selectors: [["mat-autocomplete", "magic", ""]], hostBindings: function MatMagicAutocompleteDirective_HostBindings(rf, ctx) {
+            if (rf & 1) {
+                i0__namespace.ɵɵlistener("opened", function MatMagicAutocompleteDirective_opened_HostBindingHandler($event) { return ctx.onOpenedChanged($event); })("closed", function MatMagicAutocompleteDirective_closed_HostBindingHandler($event) { return ctx.onClosedChanged($event); });
+            }
+        } });
+    (function () {
+        i0__namespace.ɵsetClassMetadata(MatMagicAutocompleteDirective, [{
+                type: i0.Directive,
+                args: [{
+                        selector: 'mat-autocomplete[magic]'
+                    }]
+            }], null, { onOpenedChanged: [{
+                    type: i0.HostListener,
+                    args: ['opened', ['$event']]
+                }], onClosedChanged: [{
+                    type: i0.HostListener,
+                    args: ['closed', ['$event']]
+                }] });
+    })();
+
     var materialModules = [
         table.MatTableModule,
         paginator.MatPaginatorModule,
@@ -704,26 +634,24 @@
         core.MatNativeDateModule,
         i1$1.MatDialogModule
     ];
-    /**
-     * @ignore
-     */
     var MagicAngularMaterialModule = /** @class */ (function () {
         function MagicAngularMaterialModule(componentList, matdialog) {
             componentList.dialogs.set('MatDialog', matdialog);
         }
         return MagicAngularMaterialModule;
     }());
-    /** @nocollapse */ MagicAngularMaterialModule.ɵmod = i0.ɵɵdefineNgModule({ type: MagicAngularMaterialModule });
-    /** @nocollapse */ MagicAngularMaterialModule.ɵinj = i0.ɵɵdefineInjector({ factory: function MagicAngularMaterialModule_Factory(t) { return new (t || MagicAngularMaterialModule)(i0.ɵɵinject(i1.ComponentListMagicService), i0.ɵɵinject(i1$1.MatDialog)); }, imports: [__spread([
+    MagicAngularMaterialModule.ɵmod = i0__namespace.ɵɵdefineNgModule({ type: MagicAngularMaterialModule });
+    MagicAngularMaterialModule.ɵinj = i0__namespace.ɵɵdefineInjector({ factory: function MagicAngularMaterialModule_Factory(t) { return new (t || MagicAngularMaterialModule)(i0__namespace.ɵɵinject(i1__namespace.ComponentListMagicService), i0__namespace.ɵɵinject(i1__namespace$1.MatDialog)); }, imports: [__spread([
                 common.CommonModule,
                 forms.FormsModule
             ], materialModules, [
                 i1.MagicModule
             ])] });
     (function () {
-        (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(MagicAngularMaterialModule, { declarations: [MatCheckboxDirective,
+        (typeof ngJitMode === "undefined" || ngJitMode) && i0__namespace.ɵɵsetNgModuleScope(MagicAngularMaterialModule, { declarations: [MatCheckboxDirective,
                 MatComboboxDirective,
                 MatListboxDirective,
+                MatMagicAutocompleteDirective,
                 BaseMatTableMagicComponent], imports: [common.CommonModule,
                 forms.FormsModule, table.MatTableModule,
                 paginator.MatPaginatorModule,
@@ -738,22 +666,25 @@
                 i1$1.MatDialogModule, i1.MagicModule], exports: [MatCheckboxDirective,
                 MatComboboxDirective,
                 MatListboxDirective,
+                MatMagicAutocompleteDirective,
                 BaseMatTableMagicComponent] });
     })();
-    /*@__PURE__*/ (function () {
-        i0.ɵsetClassMetadata(MagicAngularMaterialModule, [{
+    (function () {
+        i0__namespace.ɵsetClassMetadata(MagicAngularMaterialModule, [{
                 type: i0.NgModule,
                 args: [{
                         declarations: [
                             MatCheckboxDirective,
                             MatComboboxDirective,
                             MatListboxDirective,
+                            MatMagicAutocompleteDirective,
                             BaseMatTableMagicComponent,
                         ],
                         exports: [
                             MatCheckboxDirective,
                             MatComboboxDirective,
                             MatListboxDirective,
+                            MatMagicAutocompleteDirective,
                             BaseMatTableMagicComponent
                         ],
                         imports: __spread([
@@ -763,23 +694,20 @@
                             i1.MagicModule
                         ])
                     }]
-            }], function () { return [{ type: i1.ComponentListMagicService }, { type: i1$1.MatDialog }]; }, null);
+            }], function () { return [{ type: i1__namespace.ComponentListMagicService }, { type: i1__namespace$1.MatDialog }]; }, null);
     })();
 
-    /**
-     * Generated bundle index. Do not edit.
-     */
-
     exports.BaseMatTableMagicComponent = BaseMatTableMagicComponent;
     exports.MagicAngularMaterialModule = MagicAngularMaterialModule;
     exports.MatCheckboxDirective = MatCheckboxDirective;
     exports.MatComboboxDirective = MatComboboxDirective;
     exports.MatListboxDirective = MatListboxDirective;
+    exports.MatMagicAutocompleteDirective = MatMagicAutocompleteDirective;
     exports.MgMatTableService = MgMatTableService;
     exports.matMagicProviders = matMagicProviders;
     exports.materialModules = materialModules;
 
     Object.defineProperty(exports, '__esModule', { value: true });
 
-})));
+}));
 //# sourceMappingURL=magic-xpa-angular-material-core.umd.js.map