ngx-render-material-forms 1.2.7 → 1.2.9

package/fesm2015/ngx-render-material-forms.js

@@ -81,14 +81,14 @@ import RadioComponent from 'formiojs/components/radio/Radio.js';
 import SelectBoxesComponent from 'formiojs/components/selectboxes/SelectBoxes.js';
 import SelectComponent from 'formiojs/components/select/Select.js';
 import { Subject } from 'rxjs';
-import { debounceTime, distinctUntilChanged, takeUntil } from 'rxjs/operators';
+import { debounceTime, tap, distinctUntilChanged, takeUntil } from 'rxjs/operators';
 import * as CryptoJS from 'crypto-js';
 import { isNullOrUndefined } from 'util';
-import * as i8 from 'ngx-mat-select-search';
+import * as i9 from 'ngx-mat-select-search';
 import { NgxMatSelectSearchModule } from 'ngx-mat-select-search';
 import WellComponent from 'formiojs/components/well/Well.js';
 import DataGridComponent from 'formiojs/components/datagrid/DataGrid.js';
-import * as i8$1 from '@angular/cdk/drag-drop';
+import * as i8 from '@angular/cdk/drag-drop';
 import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
 import EditGridComponent from 'formiojs/components/editgrid/EditGrid.js';
 import Components$2 from 'formiojs/components/Components';
@@ -2538,18 +2538,20 @@ class MaterialSelectComponent extends MaterialComponent {
         this.holy = '';
         this.grail = '';
         this.productsloadingFlag = false;
-        this.searchFlag = true;
+        this.searching = false;
+        // Variable to hold the reference to the current panel element
+        this.currentPanelElement = null;
         this.holy = CryptoJS.enc.Base64.parse('8F/2+T2NXqUBQERR12R4sw==');
         this.grail = CryptoJS.enc.Base64.parse('yE0CgQbYzK5wqeoKTVzhOQ==');
     }
-    onSearchInputChange(value) {
-        if (value === '') {
+    onInputChange(event) {
+        if (this.instance.component.key.toLowerCase() === 'vendorproductid' && event.target.value === '') {
             this.onClearAll();
         }
     }
-    onChange(event) {
-        if (event) {
-            this.searchFlag = false;
+    clearProducts() {
+        if (this.instance.component.key.toLowerCase() === 'vendorproductid') {
+            this.onClearAll();
         }
     }
     scrumble(msg) {
@@ -2574,28 +2576,23 @@ class MaterialSelectComponent extends MaterialComponent {
             padding: CryptoJS.pad.Pkcs7
         });
     }
-    // Method to handle when the mat-select is opened
-    onMatSelectOpen(select) {
-        this.selectElem = select;
-        this.registerPanelScrollEvent();
-    }
-    registerPanelScrollEvent() {
-        if (this.selectElem) {
-            this.selectElem.panel.nativeElement.addEventListener('scroll', this.onScroll.bind(this));
-        }
+    registerPanelScrollEvent(selectElem) {
+        const panelElement = selectElem.panel.nativeElement;
+        panelElement.addEventListener('scroll', this.onScroll.bind(this));
     }
     onScroll(event) {
         if (this.instance.component.key.toLowerCase() === 'vendorproductid') {
             const scrollElement = event.target;
             const trackHeight = scrollElement.scrollHeight - scrollElement.offsetHeight;
-            console.log('productsloadingFlagScroll=>', this.productsloadingFlag);
             if (this.productsloadingFlag && Math.floor(scrollElement.scrollTop / trackHeight * 100) > 50) {
                 this.productsloadingFlag = false;
                 if (this.pageNumber < this.totalPages) {
                     this.pageNumber = this.pageNumber + 1;
-                    console.log('this.pageNumber', this.pageNumber, this.totalPages);
                     this.loadData(this.pageNumber, this.pageSize, this.searchQuery);
                 }
+                else {
+                    this.productsloadingFlag = true;
+                }
             }
         }
     }
@@ -2622,8 +2619,11 @@ class MaterialSelectComponent extends MaterialComponent {
         const enpageNumber = this.scrumble(pageNumber);
         const enpageSize = this.scrumble(pageSize);
         const ensearchQuery = this.scrumble(searchQuery);
-        const enactive = this.scrumble(onlyActive);
-        // const endescription = this.scrumble(includeDescription);
+        let enactive = this.scrumble(false);
+        //Check if enactive is undefined, null, or blank
+        if (enactive === undefined || enactive === null || enactive === '') {
+            enactive = this.scrumble(true); // Set default value to true
+        }
         // Scrumble and handle the includeDescription parameter
         let endescription = this.scrumble(includeDescription);
         if (!endescription) {
@@ -2642,21 +2642,29 @@ class MaterialSelectComponent extends MaterialComponent {
         this.http.get(`${baseApiUrl}/api/VendorFormBuilder/GetVendorProducts?vendorId=${envendorId}&pageNumber=${enpageNumber}&pageSize=${enpageSize}&search=${ensearchQuery}&onlyActive=${enactive}&includeDescription=${endescription}`, { headers }).subscribe(response => {
             var _a;
             if (response && response.code === 200) {
-                this.totalPages = (_a = response === null || response === void 0 ? void 0 : response.data) === null || _a === void 0 ? void 0 : _a.totalPages;
                 if (this.instance.component.key.toLowerCase() === 'vendorproductid') {
-                    const transformedData = this.transformResponseData(response.data.dataSource);
-                    // Process the transformed data
+                    this.totalPages = (_a = response === null || response === void 0 ? void 0 : response.data) === null || _a === void 0 ? void 0 : _a.totalPages;
+                    const data = response.data.dataSource;
+                    const transformedData = this.transformResponseData(data);
+                    this.filteredOptionsLength = transformedData.length;
+                    // Update filteredOptions with transformedData
                     this.filteredOptions = Promise.resolve(transformedData.map(item => ({
                         label: item.label,
                         value: item.value,
                         date: item.date
                     })));
-                }
-                setTimeout(() => {
+                    this.searching = false;
+                    // Update filteredOptions with transformedData
+                    // this.filteredOptions = this.filteredOptions.then(existingOptions => {
+                    //   const newOptions = transformedData.map(item => ({
+                    //     label: item.label,
+                    //     value: item.value,
+                    //     date: item.date
+                    //   }));
+                    //   return existingOptions.concat(newOptions);
+                    // });
                     this.productsloadingFlag = true;
-                }, 1000);
-                console.log('productsloadingFlag', this.productsloadingFlag);
-                console.log('totalPage=>', this.totalPages);
+                }
             }
         });
     }
@@ -2697,35 +2705,49 @@ class MaterialSelectComponent extends MaterialComponent {
         this.instance.triggerUpdate();
     }
     onClearAll() {
-        if (this.searchFlag) {
-            if (this.instance.component.key.toLowerCase() === 'vendorproductid') {
-                this.loadData(1, 20, '');
-            }
+        if (this.instance.component.key.toLowerCase() === 'vendorproductid') {
+            this.pageNumber = 1;
+            this.pageSize = 20;
+            this.searchQuery = '';
+            this.loadData(this.pageNumber, this.pageSize, this.searchQuery);
         }
     }
     ngAfterViewInit() {
-        this.selectElem.openedChange.subscribe((isOpen) => {
-            if (isOpen) {
-                this.searchFlag = false;
-                if (this.instance.component.key.toLowerCase() === 'vendorproductid') {
-                    this.loadData(1, 20, '');
+        if (this.instance.component.key.toLowerCase() === 'vendorproductid') {
+            this.selectElem.openedChange.subscribe((isOpen) => {
+                if (isOpen) {
+                    this.pageNumber = 1;
+                    this.pageSize = 20;
+                    this.searchQuery = '';
+                    this.searching = true;
+                    this.loadData(this.pageNumber, this.pageSize, this.searchQuery);
+                    this.registerPanelScrollEvent(this.selectElem);
                 }
-            }
-            else {
-                this.searchFlag = false;
-            }
-        });
+                else {
+                    this.removePanelScrollEvent();
+                    console.log('closed');
+                }
+            });
+        }
+    }
+    removePanelScrollEvent() {
+        // Remove the scroll event listener
+        if (this.currentPanelElement) {
+            this.currentPanelElement.removeEventListener('scroll', this.onScroll.bind(this));
+            this.currentPanelElement = null;
+        }
     }
     ngOnInit() {
         /*new logic */
         if (this.instance.component.key.toLowerCase() === 'vendorproductid') {
             this.websiteMultiFilterCtrl.valueChanges
                 .pipe(debounceTime(1000), // Time in milliseconds between key events
-            distinctUntilChanged(), takeUntil(this._onDestroy))
+            tap(() => this.searching = true), distinctUntilChanged(), takeUntil(this._onDestroy))
                 .subscribe((searchQuery) => {
                 if (searchQuery != '') {
-                    this.searchFlag = true;
-                    this.loadData(1, 20, searchQuery);
+                    this.pageNumber = 1;
+                    this.pageSize = 20;
+                    this.loadData(this.pageNumber, this.pageSize, searchQuery);
                 }
             });
         }
@@ -2766,20 +2788,19 @@ MaterialSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
                 [multiple]="instance.component.multiple"
                 [formControl]="control"
                 [placeholder]="instance.component.placeholder"
-                (selectionChange)="onChange($event)"
+                (selectionChange)="onChange()"
                 [compareWith]="compareObjects"
                 #productSelect
-                (openedChange)="onMatSelectOpen($event ? selectElem : null)"
         >
-
         <mat-option>
-        <ngx-mat-select-search (ngModelChange)="onSearchInputChange($event)" placeholderLabel="Type to search" [formControl]="websiteMultiFilterCtrl"></ngx-mat-select-search>
+        <ngx-mat-select-search [searching]="instance.component.key.toLowerCase() === 'vendorproductid' ? searching : false" (input)="onInputChange($event)" placeholderLabel="Type to search" [formControl]="websiteMultiFilterCtrl"> 
+        <mat-icon ngxMatSelectSearchClear (click)="clearProducts()">close</mat-icon>
+        </ngx-mat-select-search>
       </mat-option>
 
       <mat-option *ngFor="let option of filteredOptions | async" [value]="option.value" class="virtual-full-view">
           <span [innerHTML]="option.label"></span>
         </mat-option>   
-
           <mat-option *ngIf="!filteredOptionsLength" disabled>
             <span>Nothing was found</span>
           </mat-option>
@@ -2791,7 +2812,7 @@ MaterialSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
         <mat-error *ngIf="instance.error">{{ instance.error.message }}</mat-error>
       </mat-form-field>
     </ng-template>
-  `, isInline: true, styles: [".example-viewport{height:200px}.product-picker{overflow-x:hidden}.virtual-full-view{height:auto!important;white-space:normal!important;line-height:1.4!important;text-overflow:initial!important;min-height:48px!important;overflow:visible!important;overflow:initial!important;padding-top:10px!important;padding-bottom:10px!important}::ng-deep .product-picker .cdk-virtual-scroll-content-wrapper{width:100%!important}.virtual-full-view .mat-pseudo-checkbox{align-self:top!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix]" }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix]" }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i5$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i5.FlexFillDirective, selector: "[fxFill], [fxFlexFill]" }, { kind: "component", type: i8.MatSelectSearchComponent, selector: "ngx-mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "indexAndLengthScreenReaderText", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toogleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { kind: "component", type: FormioFormFieldComponent, selector: "mat-formio-form-field", inputs: ["labelTemplate", "renderTopLabel", "showDescription", "renderElementOnly", "instance", "componentTemplate"] }, { kind: "component", type: LabelComponent, selector: "span[matFormioLabel]", inputs: ["instance"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
+  `, isInline: true, styles: [".example-viewport{height:200px}.product-picker{overflow-x:hidden}.virtual-full-view{height:auto!important;white-space:normal!important;line-height:1.4!important;text-overflow:initial!important;min-height:48px!important;overflow:visible!important;overflow:initial!important;padding-top:10px!important;padding-bottom:10px!important}::ng-deep .product-picker .cdk-virtual-scroll-content-wrapper{width:100%!important}.virtual-full-view .mat-pseudo-checkbox{align-self:top!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix]" }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix]" }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i5$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i5.FlexFillDirective, selector: "[fxFill], [fxFlexFill]" }, { kind: "component", type: i9.MatSelectSearchComponent, selector: "ngx-mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "indexAndLengthScreenReaderText", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toogleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { kind: "directive", type: i9.MatSelectSearchClearDirective, selector: "[ngxMatSelectSearchClear]" }, { kind: "component", type: FormioFormFieldComponent, selector: "mat-formio-form-field", inputs: ["labelTemplate", "renderTopLabel", "showDescription", "renderElementOnly", "instance", "componentTemplate"] }, { kind: "component", type: LabelComponent, selector: "span[matFormioLabel]", inputs: ["instance"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MaterialSelectComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mat-formio-select', template: `
@@ -2810,20 +2831,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImpor
                 [multiple]="instance.component.multiple"
                 [formControl]="control"
                 [placeholder]="instance.component.placeholder"
-                (selectionChange)="onChange($event)"
+                (selectionChange)="onChange()"
                 [compareWith]="compareObjects"
                 #productSelect
-                (openedChange)="onMatSelectOpen($event ? selectElem : null)"
         >
-
         <mat-option>
-        <ngx-mat-select-search (ngModelChange)="onSearchInputChange($event)" placeholderLabel="Type to search" [formControl]="websiteMultiFilterCtrl"></ngx-mat-select-search>
+        <ngx-mat-select-search [searching]="instance.component.key.toLowerCase() === 'vendorproductid' ? searching : false" (input)="onInputChange($event)" placeholderLabel="Type to search" [formControl]="websiteMultiFilterCtrl"> 
+        <mat-icon ngxMatSelectSearchClear (click)="clearProducts()">close</mat-icon>
+        </ngx-mat-select-search>
       </mat-option>
 
       <mat-option *ngFor="let option of filteredOptions | async" [value]="option.value" class="virtual-full-view">
           <span [innerHTML]="option.label"></span>
         </mat-option>   
-
           <mat-option *ngIf="!filteredOptionsLength" disabled>
             <span>Nothing was found</span>
           </mat-option>
@@ -3060,7 +3080,7 @@ MaterialDataGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.
         <span [instance]="instance" matFormioLabel></span>
       </mat-card-title>
     </ng-template>
-  `, isInline: true, styles: [".datagrid-row{height:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4$7.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4$7.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4$7.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4$7.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i4$7.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4$7.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4$7.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4$7.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4$7.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4$7.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i5.FlexFillDirective, selector: "[fxFill], [fxFlexFill]" }, { kind: "component", type: i4.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i4.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "directive", type: i4.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "directive", type: i4.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i8$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i8$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i8$1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: FormioFormFieldComponent, selector: "mat-formio-form-field", inputs: ["labelTemplate", "renderTopLabel", "showDescription", "renderElementOnly", "instance", "componentTemplate"] }, { kind: "component", type: LabelComponent, selector: "span[matFormioLabel]", inputs: ["instance"] }] });
+  `, isInline: true, styles: [".datagrid-row{height:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4$7.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4$7.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4$7.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4$7.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i4$7.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4$7.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4$7.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4$7.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4$7.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4$7.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i5.FlexFillDirective, selector: "[fxFill], [fxFlexFill]" }, { kind: "component", type: i4.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i4.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "directive", type: i4.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "directive", type: i4.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i8.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i8.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i8.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: FormioFormFieldComponent, selector: "mat-formio-form-field", inputs: ["labelTemplate", "renderTopLabel", "showDescription", "renderElementOnly", "instance", "componentTemplate"] }, { kind: "component", type: LabelComponent, selector: "span[matFormioLabel]", inputs: ["instance"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: MaterialDataGridComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mat-formio-datagrid', template: `