ngx-render-material-forms 2.5.5 → 2.5.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/components/add-on-products/add-on-products.component.mjs +22 -1
- package/esm2020/lib/components/common.service.mjs +10 -7
- package/esm2020/lib/components/select/select.component.mjs +11 -86
- package/fesm2015/ngx-render-material-forms.js +41 -94
- package/fesm2015/ngx-render-material-forms.mjs.map +1 -1
- package/fesm2020/ngx-render-material-forms.js +40 -91
- package/fesm2020/ngx-render-material-forms.mjs.map +1 -1
- package/lib/components/add-on-products/add-on-products.component.d.ts +1 -0
- package/lib/components/select/select.component.d.ts +0 -4
- package/package.json +1 -1
|
@@ -2687,6 +2687,7 @@ class CommonService {
|
|
|
2687
2687
|
}
|
|
2688
2688
|
}
|
|
2689
2689
|
loadProducts(pageNumber, pazeSize, search = '', onlyActive = true, description = false, levelOneId, levelTwoId, levelThreeId, levelFourId) {
|
|
2690
|
+
this.paramsData = JSON.parse(localStorage.getItem('productPickerParams'));
|
|
2690
2691
|
const baseApiUrl = this.getBaseApiUrl();
|
|
2691
2692
|
const vendorId = this.getValueByKey(this.paramsData, 'vendorId');
|
|
2692
2693
|
const programId = this.getValueByKey(this.paramsData, 'programId');
|
|
@@ -2697,6 +2698,7 @@ class CommonService {
|
|
|
2697
2698
|
return this.http.get(apiUrl);
|
|
2698
2699
|
}
|
|
2699
2700
|
listSubCategory(category) {
|
|
2701
|
+
this.paramsData = JSON.parse(localStorage.getItem('productPickerParams'));
|
|
2700
2702
|
const vendorId = this.getValueByKey(this.paramsData, 'vendorId');
|
|
2701
2703
|
const baseApiUrl = this.getBaseApiUrl();
|
|
2702
2704
|
return this.http.get(`${baseApiUrl}/api/VendorFormBuilder/GetProductsSubCategory?vendorId=${vendorId}&categoryName=${category}`);
|
|
@@ -2718,26 +2720,31 @@ class CommonService {
|
|
|
2718
2720
|
return queryString;
|
|
2719
2721
|
}
|
|
2720
2722
|
listProductCategory() {
|
|
2723
|
+
this.paramsData = JSON.parse(localStorage.getItem('productPickerParams'));
|
|
2721
2724
|
const vendorId = this.getValueByKey(this.paramsData, 'vendorId');
|
|
2722
2725
|
const baseApiUrl = this.getBaseApiUrl();
|
|
2723
2726
|
return this.http.get(`${baseApiUrl}/api/VendorFormBuilder/GetProductsCategory?vendorId=${vendorId}`);
|
|
2724
2727
|
}
|
|
2725
2728
|
productLevelOne() {
|
|
2729
|
+
this.paramsData = JSON.parse(localStorage.getItem('productPickerParams'));
|
|
2726
2730
|
const baseApiUrl = this.getBaseApiUrl();
|
|
2727
2731
|
const vendorId = this.getValueByKey(this.paramsData, 'vendorId');
|
|
2728
2732
|
return this.http.get(`${baseApiUrl}/api/VendorFormBuilder/GetProductLevelOne?vendorId=${vendorId}`);
|
|
2729
2733
|
}
|
|
2730
2734
|
productLevelTwo(levelOneId) {
|
|
2735
|
+
this.paramsData = JSON.parse(localStorage.getItem('productPickerParams'));
|
|
2731
2736
|
const baseApiUrl = this.getBaseApiUrl();
|
|
2732
2737
|
const vendorId = this.getValueByKey(this.paramsData, 'vendorId');
|
|
2733
2738
|
return this.http.get(`${baseApiUrl}/api/VendorFormBuilder/GetProductLevelTwo?levelOneId=${levelOneId}&vendorId=${vendorId}`);
|
|
2734
2739
|
}
|
|
2735
2740
|
productLevelThree(levelOneId, levelTwoId) {
|
|
2741
|
+
this.paramsData = JSON.parse(localStorage.getItem('productPickerParams'));
|
|
2736
2742
|
const baseApiUrl = this.getBaseApiUrl();
|
|
2737
2743
|
const vendorId = this.getValueByKey(this.paramsData, 'vendorId');
|
|
2738
2744
|
return this.http.get(`${baseApiUrl}/api/VendorFormBuilder/GetProductLevelThree?levelOneId=${levelOneId}&levelTwoId=${levelTwoId}&vendorId=${vendorId}`);
|
|
2739
2745
|
}
|
|
2740
2746
|
productLevelFour(levelOneId, levelTwoId, levelThreeId) {
|
|
2747
|
+
this.paramsData = JSON.parse(localStorage.getItem('productPickerParams'));
|
|
2741
2748
|
const baseApiUrl = this.getBaseApiUrl();
|
|
2742
2749
|
const vendorId = this.getValueByKey(this.paramsData, 'vendorId');
|
|
2743
2750
|
return this.http.get(`${baseApiUrl}/api/VendorFormBuilder/GetProductLevelFour?levelOneId=${levelOneId}&levelTwoId=${levelTwoId}&levelThreeId=${levelThreeId}&vendorId=${vendorId}`);
|
|
@@ -2771,12 +2778,8 @@ class CommonService {
|
|
|
2771
2778
|
}
|
|
2772
2779
|
/*Funtion to check if property is matched with given attributes in formBuilder or not */
|
|
2773
2780
|
checkIsAttributeTrue(newProductPickerFlag, attributeName) {
|
|
2774
|
-
|
|
2775
|
-
|
|
2776
|
-
// newProductPickerFlag[key].toLowerCase() === "true"
|
|
2777
|
-
// );
|
|
2778
|
-
return newProductPickerFlag && Object.keys(newProductPickerFlag).some(key => key.trim().toLowerCase() === attributeName.trim().toLowerCase() &&
|
|
2779
|
-
String(newProductPickerFlag[key]).trim().toLowerCase() === "true");
|
|
2781
|
+
return newProductPickerFlag && Object.keys(newProductPickerFlag).some(key => key.toLocaleLowerCase() === attributeName.toLowerCase() &&
|
|
2782
|
+
newProductPickerFlag[key].toLowerCase() === "true");
|
|
2780
2783
|
}
|
|
2781
2784
|
getglobedata() {
|
|
2782
2785
|
const hostMappings = {
|
|
@@ -2841,8 +2844,6 @@ class MaterialSelectComponent extends MaterialComponent {
|
|
|
2841
2844
|
this.storeDependentItems = [];
|
|
2842
2845
|
this.executionFlag = false;
|
|
2843
2846
|
this.apiCounter = 0;
|
|
2844
|
-
this.lastOptionsHash = '';
|
|
2845
|
-
this.hasInitializedOptions = false;
|
|
2846
2847
|
}
|
|
2847
2848
|
onInputChange(event) {
|
|
2848
2849
|
if (this.instance.component.key.toLowerCase() === 'vendorproductid' && event.target.value === '') {
|
|
@@ -3048,7 +3049,6 @@ class MaterialSelectComponent extends MaterialComponent {
|
|
|
3048
3049
|
const vendorId = this.getValueByKey(paramsData, 'vendorId');
|
|
3049
3050
|
const dealId = this.getValueByKey(paramsData, 'dealId');
|
|
3050
3051
|
const isEdit = this.getValueByKey(paramsData, 'isEdit');
|
|
3051
|
-
this.isEditFlag = isEdit;
|
|
3052
3052
|
let finalParams;
|
|
3053
3053
|
((_c = (_b = (_a = this.instance) === null || _a === void 0 ? void 0 : _a.parent) === null || _b === void 0 ? void 0 : _b.components) === null || _c === void 0 ? void 0 : _c.length) && this.instance.parent.components.forEach(items => {
|
|
3054
3054
|
var _a, _b, _c, _d;
|
|
@@ -3104,8 +3104,6 @@ class MaterialSelectComponent extends MaterialComponent {
|
|
|
3104
3104
|
// If the object doesn't exist, add it to the array
|
|
3105
3105
|
finalParams.push({ key: 'dataValue', value: value });
|
|
3106
3106
|
}
|
|
3107
|
-
this.secondDropdownItems = [];
|
|
3108
|
-
this.commonService.setDropdownItems(this.secondDropdownItems);
|
|
3109
3107
|
this.commonService.initializeApiPath(apiEndPoint, finalParams).subscribe(response => {
|
|
3110
3108
|
if (response && response.code === 200) {
|
|
3111
3109
|
this.secondDropdownItems = response.data;
|
|
@@ -3125,7 +3123,7 @@ class MaterialSelectComponent extends MaterialComponent {
|
|
|
3125
3123
|
}
|
|
3126
3124
|
}
|
|
3127
3125
|
this.selectElem.openedChange.subscribe((isOpen) => __awaiter(this, void 0, void 0, function* () {
|
|
3128
|
-
var _a, _b;
|
|
3126
|
+
var _a, _b, _c;
|
|
3129
3127
|
let i = 0;
|
|
3130
3128
|
if (isOpen) {
|
|
3131
3129
|
const newProductPickerFlag = (_b = (_a = this.instance) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.attributes;
|
|
@@ -3141,89 +3139,21 @@ class MaterialSelectComponent extends MaterialComponent {
|
|
|
3141
3139
|
});
|
|
3142
3140
|
}
|
|
3143
3141
|
if (this.checkVendorRefItems(this.instance) && checkInvokeFromLibrary) {
|
|
3144
|
-
|
|
3145
|
-
|
|
3146
|
-
|
|
3147
|
-
|
|
3148
|
-
|
|
3149
|
-
// });
|
|
3150
|
-
// }
|
|
3151
|
-
// if (!this.commonService.getDropDownFlag()) {
|
|
3152
|
-
// this.storeDependentItems = this.instance.component.data.values;
|
|
3153
|
-
// }
|
|
3154
|
-
// this.filteredOptions = Promise.resolve(this.storeDependentItems);
|
|
3155
|
-
// this.selectOptions = Promise.resolve(this.storeDependentItems);
|
|
3156
|
-
// this.selectOptions.then(result => {
|
|
3157
|
-
// this.filteredOptionsLength = result.length
|
|
3158
|
-
// });
|
|
3159
|
-
const incomingItems = this.commonService.getDropdownItems();
|
|
3160
|
-
const seen = new Set();
|
|
3161
|
-
const newOptions = [];
|
|
3162
|
-
if (incomingItems === null || incomingItems === void 0 ? void 0 : incomingItems.length) {
|
|
3163
|
-
incomingItems.forEach(item => {
|
|
3164
|
-
var _a;
|
|
3165
|
-
const rawValue = this.commonService.onlyNumbers(item['value']) ? item['value'] + ' ' : item['value'];
|
|
3166
|
-
const label = (_a = item['text']) === null || _a === void 0 ? void 0 : _a.trim();
|
|
3167
|
-
if (label && rawValue) {
|
|
3168
|
-
const key = `${label}-${rawValue}`;
|
|
3169
|
-
if (!seen.has(key)) {
|
|
3170
|
-
seen.add(key);
|
|
3171
|
-
newOptions.push({ label, value: rawValue });
|
|
3172
|
-
}
|
|
3173
|
-
}
|
|
3142
|
+
this.storeDependentItems = [];
|
|
3143
|
+
this.secondDropdownItems = this.commonService.getDropdownItems();
|
|
3144
|
+
if ((_c = this.secondDropdownItems) === null || _c === void 0 ? void 0 : _c.length) {
|
|
3145
|
+
this.secondDropdownItems.forEach((renderElement, index, array) => {
|
|
3146
|
+
this.storeDependentItems.push({ label: renderElement['text'], value: this.commonService.onlyNumbers(renderElement['value']) ? renderElement['value'] + ' ' : renderElement['value'] });
|
|
3174
3147
|
});
|
|
3175
3148
|
}
|
|
3176
|
-
// compare hashes to avoid unnecessary reassignments
|
|
3177
|
-
const newHash = JSON.stringify(newOptions);
|
|
3178
|
-
//start
|
|
3179
|
-
this.storeDependentItems = newOptions;
|
|
3180
3149
|
if (!this.commonService.getDropDownFlag()) {
|
|
3181
3150
|
this.storeDependentItems = this.instance.component.data.values;
|
|
3182
3151
|
}
|
|
3183
|
-
|
|
3184
|
-
|
|
3185
|
-
|
|
3186
|
-
this.
|
|
3187
|
-
}
|
|
3188
|
-
if (newHash !== this.lastOptionsHash) {
|
|
3189
|
-
this.lastOptionsHash = newHash;
|
|
3190
|
-
this.storeDependentItems = newOptions;
|
|
3191
|
-
if (!this.commonService.getDropDownFlag()) {
|
|
3192
|
-
this.storeDependentItems = this.instance.component.data.values;
|
|
3193
|
-
}
|
|
3194
|
-
const selectedIndex = this.storeDependentItems.findIndex(item => this.compareObjects(item.value, this.control.value));
|
|
3195
|
-
if (selectedIndex < 0) {
|
|
3196
|
-
this.filteredOptions = Promise.resolve(this.storeDependentItems);
|
|
3197
|
-
this.selectOptions = Promise.resolve(this.storeDependentItems);
|
|
3198
|
-
this.selectOptions.then(result => {
|
|
3199
|
-
this.filteredOptionsLength = result.length;
|
|
3200
|
-
});
|
|
3201
|
-
}
|
|
3202
|
-
setTimeout(() => {
|
|
3203
|
-
var _a, _b, _c;
|
|
3204
|
-
const panel = (_b = (_a = this.selectElem) === null || _a === void 0 ? void 0 : _a.panel) === null || _b === void 0 ? void 0 : _b.nativeElement;
|
|
3205
|
-
if (panel && ((_c = this.storeDependentItems) === null || _c === void 0 ? void 0 : _c.length)) {
|
|
3206
|
-
const matOptions = panel.querySelectorAll('.mat-option');
|
|
3207
|
-
const selected = panel.querySelector('.mat-option.mat-selected');
|
|
3208
|
-
if (selected && !selected.classList.contains('mat-active')) {
|
|
3209
|
-
matOptions.forEach(option => option.classList.remove('mat-active'));
|
|
3210
|
-
}
|
|
3211
|
-
const selectedIndex = this.storeDependentItems.findIndex(item => this.compareObjects(item.value, this.control.value));
|
|
3212
|
-
const optionHeight = 48;
|
|
3213
|
-
const visibleTop = panel.scrollTop;
|
|
3214
|
-
const visibleBottom = visibleTop + panel.offsetHeight;
|
|
3215
|
-
const itemTop = selectedIndex * optionHeight;
|
|
3216
|
-
const itemBottom = itemTop + optionHeight;
|
|
3217
|
-
const shouldScroll = selectedIndex >= 0 && (itemTop < visibleTop || itemBottom > visibleBottom);
|
|
3218
|
-
if (selectedIndex >= 0) {
|
|
3219
|
-
panel.scrollTo({
|
|
3220
|
-
top: itemTop,
|
|
3221
|
-
behavior: 'smooth'
|
|
3222
|
-
});
|
|
3223
|
-
}
|
|
3224
|
-
}
|
|
3225
|
-
}, 150);
|
|
3226
|
-
}
|
|
3152
|
+
this.filteredOptions = Promise.resolve(this.storeDependentItems);
|
|
3153
|
+
this.selectOptions = Promise.resolve(this.storeDependentItems);
|
|
3154
|
+
this.selectOptions.then(result => {
|
|
3155
|
+
this.filteredOptionsLength = result.length;
|
|
3156
|
+
});
|
|
3227
3157
|
}
|
|
3228
3158
|
}
|
|
3229
3159
|
}));
|
|
@@ -3309,7 +3239,6 @@ class MaterialSelectComponent extends MaterialComponent {
|
|
|
3309
3239
|
const dataUrl = (_a = instance.component['data']) === null || _a === void 0 ? void 0 : _a.url;
|
|
3310
3240
|
const isSelectValuesValid = selectValues != null && selectValues !== '' && selectValues !== undefined;
|
|
3311
3241
|
const isDataUrlInvalid = dataUrl == null || dataUrl === '' || dataUrl === undefined;
|
|
3312
|
-
instance.component.defaultValue = "";
|
|
3313
3242
|
return isSelectValuesValid && isDataUrlInvalid;
|
|
3314
3243
|
}
|
|
3315
3244
|
getVendorRefList(instance) {
|
|
@@ -3327,9 +3256,6 @@ class MaterialSelectComponent extends MaterialComponent {
|
|
|
3327
3256
|
return false;
|
|
3328
3257
|
}
|
|
3329
3258
|
}
|
|
3330
|
-
isValidData(data) {
|
|
3331
|
-
return !data.some(item => { var _a, _b; return !((_a = item.label) === null || _a === void 0 ? void 0 : _a.trim()) || !((_b = item.value) === null || _b === void 0 ? void 0 : _b.trim()); });
|
|
3332
|
-
}
|
|
3333
3259
|
getErrorMessage() {
|
|
3334
3260
|
if (this.instance.error && this.instance.error.messages) {
|
|
3335
3261
|
const { messages } = this.instance.error;
|
|
@@ -3830,6 +3756,9 @@ class AddOnProductsComponent {
|
|
|
3830
3756
|
}
|
|
3831
3757
|
else {
|
|
3832
3758
|
this.form.markAllAsTouched();
|
|
3759
|
+
setTimeout(() => {
|
|
3760
|
+
this.scrollToFirstInvalidControl();
|
|
3761
|
+
});
|
|
3833
3762
|
}
|
|
3834
3763
|
}
|
|
3835
3764
|
isAllSelected() {
|
|
@@ -4295,6 +4224,24 @@ class AddOnProductsComponent {
|
|
|
4295
4224
|
}
|
|
4296
4225
|
}
|
|
4297
4226
|
}
|
|
4227
|
+
scrollToFirstInvalidControl() {
|
|
4228
|
+
const dialogContent = document.querySelector('.mat-dialog-content');
|
|
4229
|
+
const firstMatError = dialogContent === null || dialogContent === void 0 ? void 0 : dialogContent.querySelector('mat-error');
|
|
4230
|
+
if (!dialogContent || !firstMatError)
|
|
4231
|
+
return;
|
|
4232
|
+
const matFormField = firstMatError.closest('mat-form-field');
|
|
4233
|
+
if (!matFormField)
|
|
4234
|
+
return;
|
|
4235
|
+
dialogContent.scrollTop = dialogContent.scrollTop + 1;
|
|
4236
|
+
matFormField.scrollIntoView({
|
|
4237
|
+
behavior: 'smooth',
|
|
4238
|
+
block: 'center'
|
|
4239
|
+
});
|
|
4240
|
+
setTimeout(() => {
|
|
4241
|
+
const input = matFormField.querySelector('input, select, textarea');
|
|
4242
|
+
input === null || input === void 0 ? void 0 : input.focus();
|
|
4243
|
+
}, 300);
|
|
4244
|
+
}
|
|
4298
4245
|
}
|
|
4299
4246
|
AddOnProductsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: AddOnProductsComponent, deps: [{ token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i2.FormBuilder }, { token: i1$1.MatDialog }, { token: CommonService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4300
4247
|
AddOnProductsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: AddOnProductsComponent, selector: "ngx-mat-add-on-products", viewQueries: [{ propertyName: "firstscrollableDiv", first: true, predicate: ["firstscrollableDiv"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"spinnerFlag\" class=\"OverlayDiv\">\r\n <div class=\"OverlayDivContent\">\r\n <mat-spinner></mat-spinner>\r\n </div>\r\n</div>\r\n<div class=\"mat-dialog-heading\">\r\n <h1 mat-dialog-title>Add Products</h1>\r\n</div>\r\n\r\n<mat-dialog-content [ngClass]=\"dataSource?.data?.length > 0 ? 'products-scroll-visible': ''\">\r\n <div class=\"mat-dialog-content\">\r\n <!--Search Start-->\r\n <div class=\"basic-search\" [hidden]=\"currentPage !== 'select-products'\">\r\n <div class=\"basic-search-wrp\">\r\n <div class=\"search-icon\">\r\n <svg width=\"80\" height=\"80\" viewBox=\"0 0 24 25\" xmlns=\"http://www.w3.org/2000/svg\"\r\n transform=\"rotate(0 0 0)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\r\n d=\"M11.25 2.75C6.14154 2.75 2 6.89029 2 11.998C2 17.1056 6.14154 21.2459 11.25 21.2459C13.5335 21.2459 15.6238 20.4187 17.2373 19.0475L20.7182 22.5287C21.011 22.8216 21.4859 22.8217 21.7788 22.5288C22.0717 22.2359 22.0718 21.761 21.7789 21.4681L18.2983 17.9872C19.6714 16.3736 20.5 14.2826 20.5 11.998C20.5 6.89029 16.3585 2.75 11.25 2.75ZM3.5 11.998C3.5 7.71905 6.96962 4.25 11.25 4.25C15.5304 4.25 19 7.71905 19 11.998C19 16.2769 15.5304 19.7459 11.25 19.7459C6.96962 19.7459 3.5 16.2769 3.5 11.998Z\" />\r\n </svg>\r\n </div>\r\n <form [formGroup]=\"form\">\r\n <div class=\"input-search\">\r\n <input (keydown.enter)=\"handleDropdownFilter(); $event.stopPropagation()\" type=\"text\" matInput\r\n placeholder=\"Search Product\" formControlName=\"searchProductName\"\r\n (input)=\"clearIfEmpty($event)\">\r\n </div>\r\n </form>\r\n <!-- <div class=\"advfilter\">\r\n <button class=\"adv\" (click)=\"toggleSection();$event.stopPropagation();\">\r\n <mat-icon class=\"material-icons-round\" aria-hidden=\"false\"\r\n aria-label=\"tune\">tune\r\n </mat-icon>\r\n <span *ngIf=\"activeFiltersCount > 0\" class=\"custom-badge\">{{ activeFiltersCount }}</span>\r\n </button>\r\n </div> -->\r\n </div>\r\n <div class=\"search-btn\">\r\n <button mat-raised-button color=\"primary\"\r\n (click)=\"handleDropdownFilter();$event.stopPropagation();\">Search</button>\r\n </div>\r\n </div>\r\n <!--Search End-->\r\n <div class=\"product-selector\">\r\n <div [hidden]=\"currentPage !== 'select-products'\">\r\n <form [formGroup]=\"form\">\r\n <div class=\"product-selection-container\" *ngIf=\"isVisible && dropdownL1\">\r\n <div class=\"dropdown-selection\" *ngIf=\"dropdownL1\">\r\n <div [ngClass]=\"dropDownCount === 1 ? 'no-child': 'child'\">\r\n <div class=\"title-adv\">\r\n <h5>Advanced Filters</h5>\r\n <button class=\"clr-all-picker\" type=\"button\" (click)=\"resetTable()\"\r\n *ngIf=\"activeFiltersCount > 0\">Clear All</button>\r\n </div>\r\n <div class=\"row\">\r\n <div class=\"col-lg-6\">\r\n <div class=\"example-full-width\">\r\n <mat-form-field *ngIf=\"dropdownL1\" class=\"example-full-width\">\r\n <mat-label>{{dropdownL1Label}}</mat-label>\r\n <input type=\"text\" matInput formControlName=\"dropdownLevel1\"\r\n [matAutocomplete]=\"auto3\"\r\n (input)=\"onInputChange($event, 'category1')\">\r\n <mat-autocomplete [displayWith]=\"displayFn\" #auto3=\"matAutocomplete\"\r\n (optionSelected)=\"onOptionSelected($event, 'category1')\">\r\n <mat-option *ngFor=\"let option of filteredDropdownOne\"\r\n [value]=\"option\">{{option.name}}</mat-option>\r\n </mat-autocomplete>\r\n <mat-icon matSuffix *ngIf=\"form.get('dropdownLevel1').value\"\r\n (click)=\"clearField('dropdownLevel1', 'category1', $event)\"\r\n class=\"iconclose\">close</mat-icon>\r\n <mat-icon class=\"icondropdown\" matSuffix>arrow_drop_down</mat-icon>\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n <div class=\"col-lg-6\">\r\n <div class=\"example-full-width\">\r\n <mat-form-field *ngIf=\"dropdownL2\" class=\"example-full-width\">\r\n <mat-label>{{dropdownL2Label}}</mat-label>\r\n <input type=\"text\" matInput formControlName=\"dropdownLevel2\"\r\n [matAutocomplete]=\"auto4\"\r\n (input)=\"onInputChange($event, 'category2')\">\r\n <mat-autocomplete [displayWith]=\"displayFn\" #auto4=\"matAutocomplete\"\r\n (optionSelected)=\"onOptionSelected($event, 'category2')\">\r\n <mat-option *ngFor=\"let option of filteredDropdownTwo\"\r\n [value]=\"option\">{{option.name}}</mat-option>\r\n </mat-autocomplete>\r\n <mat-icon matSuffix *ngIf=\"form.get('dropdownLevel2').value\"\r\n (click)=\"clearField('dropdownLevel2', 'category2', $event)\"\r\n class=\"iconclose\">close</mat-icon>\r\n <mat-icon class=\"icondropdown\" matSuffix\r\n [ngClass]=\"{'disabled-icon': isDisabled2}\">arrow_drop_down</mat-icon>\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n\r\n <div class=\"col-lg-6\">\r\n <div class=\"example-full-width\">\r\n <mat-form-field *ngIf=\"dropdownL3\" class=\"example-full-width\">\r\n <mat-label>{{dropdownL3Label}}</mat-label>\r\n <input type=\"text\" matInput formControlName=\"dropdownLevel3\"\r\n [matAutocomplete]=\"auto5\"\r\n (input)=\"onInputChange($event, 'category3')\">\r\n <mat-autocomplete [displayWith]=\"displayFn\" #auto5=\"matAutocomplete\"\r\n (optionSelected)=\"onOptionSelected($event, 'category3')\">\r\n <mat-option *ngFor=\"let option of filteredDropdownThree\"\r\n [value]=\"option\">{{option.name}}</mat-option>\r\n </mat-autocomplete>\r\n <mat-icon matSuffix *ngIf=\"form.get('dropdownLevel3').value\"\r\n (click)=\"clearField('dropdownLevel3', 'category3', $event)\"\r\n class=\"iconclose\">close</mat-icon>\r\n <mat-icon class=\"icondropdown\" matSuffix\r\n [ngClass]=\"{'disable-icon': isDisabled3}\">arrow_drop_down</mat-icon>\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n <div class=\"col-lg-6\">\r\n <div class=\"example-full-width\">\r\n <mat-form-field *ngIf=\"dropdownL4\" class=\"example-full-width\">\r\n <mat-label>{{dropdownL4Label}}</mat-label>\r\n <input type=\"text\" matInput formControlName=\"dropdownLevel4\"\r\n [matAutocomplete]=\"auto6\"\r\n (input)=\"onInputChange($event, 'category4')\">\r\n <mat-autocomplete [displayWith]=\"displayFn\" #auto6=\"matAutocomplete\"\r\n (optionSelected)=\"onOptionSelected($event, 'category4')\">\r\n <mat-option *ngFor=\"let option of filteredDropdownFour\"\r\n [value]=\"option\">{{option.name}}</mat-option>\r\n </mat-autocomplete>\r\n <mat-icon matSuffix *ngIf=\"form.get('dropdownLevel4').value\"\r\n (click)=\"clearField('dropdownLevel4', 'category4', $event)\"\r\n class=\"iconclose\">close</mat-icon>\r\n <mat-icon class=\"icondropdown\" matSuffix\r\n [ngClass]=\"{'disable-icon': isDisabled4}\">arrow_drop_down</mat-icon>\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div #firstscrollableDiv id=\"firstscrollableDiv\" class=\"new-class first-div\"\r\n (scroll)=\"onScroll($event)\" [ngClass]=\"dataSource?.data?.length > 0 ? 'tbl-record-found': ''\">\r\n <table mat-table [dataSource]=\"dataSource\" class=\"mat-table abc\"\r\n *ngIf=\"dataSource && dataSource?.data?.length > 0; else noData\">\r\n <ng-container matColumnDef=\"select\">\r\n <th mat-header-cell *matHeaderCellDef>\r\n </th>\r\n <td mat-cell *matCellDef=\"let row\" class=\"checkbox-picker-pointer\">\r\n <mat-checkbox color=\"primary\" (click)=\"$event.stopPropagation()\"\r\n (change)=\"$event ? toggleSelection(row) : null\"\r\n [checked]=\"selection.isSelected(row)\"></mat-checkbox>\r\n </td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"productName\">\r\n <th mat-header-cell *matHeaderCellDef> {{productTweek}} </th>\r\n <td mat-cell *matCellDef=\"let element\"> {{element?.text}} </td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"skuNumber\" *ngIf=\"showSkuNumber\">\r\n <th mat-header-cell *matHeaderCellDef> {{skuTweek}} </th>\r\n <td mat-cell *matCellDef=\"let element\"> {{element?.otherInformation0}} </td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"inventory\" *ngIf=\"showInventory\">\r\n <th mat-header-cell *matHeaderCellDef> {{inventoryTweek}} </th>\r\n <td mat-cell *matCellDef=\"let element\"> {{element?.otherInformation1}} </td>\r\n </ng-container>\r\n <tr mat-header-row *matHeaderRowDef=\"addProductsColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: addProductsColumns;\"\r\n [class.selected]=\"selection.isSelected(row)\"></tr>\r\n </table>\r\n <ng-template #noData>\r\n <div class=\"no-data-message\">\r\n <!--No data found.-->\r\n <div class=\"pp-empty-state\">\r\n <div class=\"img-empty-state\">\r\n <img [src]=\"emptyImage\" alt=\"\">\r\n </div>\r\n <h3>No records to show at the moment</h3>\r\n <p>Please modify your search criteria to find the desired result</p>\r\n </div>\r\n\r\n </div>\r\n </ng-template>\r\n </div>\r\n <div class=\"row-summary\" *ngIf=\"dataSource && dataSource?.data?.length > 0\">\r\n <div>Selected: <strong>{{ getSelectedRowsCount() }}</strong> </div>\r\n <div>Total Records: <strong>{{ getTotalRecords }}</strong></div>\r\n </div>\r\n </form>\r\n </div>\r\n\r\n <div [hidden]=\"currentPage !== 'edit-save'\">\r\n <form [formGroup]=\"form\">\r\n <div class=\"new-class\"\r\n [ngClass]=\"selectedDataSource && selectedDataSource.data.length > 0 ? 'added-products': ''\">\r\n <table mat-table [dataSource]=\"selectedDataSource\"\r\n *ngIf=\"selectedDataSource && selectedDataSource.data.length > 0; else showBlank\">\r\n <ng-container matColumnDef=\"delete\">\r\n <th mat-header-cell *matHeaderCellDef></th>\r\n <td mat-cell *matCellDef=\"let element\">\r\n <button class=\"delete-btn-picker\" mat-button\r\n (click)=\"$event.stopPropagation();removeRow($event, element)\">\r\n <mat-icon aria-hidden=\"false\" aria-label=\"Remove row\">delete</mat-icon>\r\n </button>\r\n </td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"productName\">\r\n <th mat-header-cell *matHeaderCellDef> {{productTweek}} </th>\r\n <td mat-cell *matCellDef=\"let element\"> {{element.text}} </td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"categoryName\" *ngIf=\"showCategory\">\r\n <th mat-header-cell *matHeaderCellDef> {{categoryTweek}} </th>\r\n <td mat-cell *matCellDef=\"let element\"> {{element.category}} </td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"subCategory\" *ngIf=\"showSubcategory\">\r\n <th mat-header-cell *matHeaderCellDef> {{subCategoryTweek}} </th>\r\n <td mat-cell *matCellDef=\"let element\"> {{element.subCategory}} </td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"price\" *ngIf=\"showPrice\">\r\n <th mat-header-cell *matHeaderCellDef>{{priceTweek}}</th>\r\n <td mat-cell *matCellDef=\"let element; let i = index\">\r\n <mat-form-field class=\"example-full-width select-price\">\r\n <mat-label>{{priceTweek}}</mat-label>\r\n <input matInput [formControl]=\"selectedProducts.at(i).get('price')\"\r\n (input)=\"applyValidationRule($event, i, 'price')\"\r\n (keypress)=\"restrictInput($event, '')\" (paste)=\"handlePaste($event, '')\">\r\n <mat-error *ngIf=\"selectedProducts.at(i).get('price').hasError('required')\">\r\n This field is required\r\n </mat-error>\r\n </mat-form-field>\r\n </td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"Quantity\" *ngIf=\"showQuantity\">\r\n <th mat-header-cell *matHeaderCellDef> {{quantityTweek}} </th>\r\n <td mat-cell *matCellDef=\"let element; let i = index\">\r\n <mat-form-field class=\"example-full-width\">\r\n <mat-label>{{quantityTweek}}</mat-label>\r\n <input matInput [formControl]=\"selectedProducts.at(i).get('quantity')\"\r\n type=\"number\" min=\"1\" step=\"1\" (input)=\"onQuantityChange($event, i)\">\r\n <mat-error *ngIf=\"selectedProducts.at(i).get('quantity').hasError('required')\">\r\n This field is required\r\n </mat-error>\r\n <mat-error *ngIf=\"selectedProducts.at(i).get('quantity').hasError('min')\">\r\n Quantity can not be less than 1\r\n </mat-error>\r\n <mat-error *ngIf=\"selectedProducts.at(i).get('quantity').hasError('pattern')\">\r\n Decimals not allowed\r\n </mat-error>\r\n </mat-form-field>\r\n </td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"skuNumber\" *ngIf=\"showSkuNumber\">\r\n <th mat-header-cell *matHeaderCellDef> {{skuTweek}} </th>\r\n <td mat-cell *matCellDef=\"let element\">{{element?.otherInformation0}} </td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"inventory\" *ngIf=\"showInventory\">\r\n <th mat-header-cell *matHeaderCellDef> {{inventoryTweek}} </th>\r\n <td mat-cell *matCellDef=\"let element\">{{element?.otherInformation1}} </td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"cost\" *ngIf=\"showCost\">\r\n <th mat-header-cell *matHeaderCellDef>{{costTweek}}</th>\r\n <td mat-cell *matCellDef=\"let element; let i = index\">\r\n <mat-form-field class=\"example-full-width select-cost\">\r\n <mat-label>{{costTweek}}</mat-label>\r\n <input matInput [formControl]=\"selectedProducts.at(i).get('otherInformation0')\"\r\n (input)=\"applyValidationRule($event, i, 'otherInformation0')\"\r\n (keypress)=\"restrictInput($event, 'otherInformation0')\" (paste)=\"handlePaste($event, 'otherInformation0')\">\r\n <mat-error\r\n *ngIf=\"selectedProducts.at(i).get('otherInformation0').hasError('required')\">\r\n This field is required\r\n </mat-error>\r\n </mat-form-field>\r\n </td>\r\n </ng-container>\r\n <tr mat-header-row *matHeaderRowDef=\"showAllproductsColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: showAllproductsColumns;\"></tr>\r\n </table>\r\n <!-- <ng-template #showBlank>\r\n <div class=\"no-data-message\">\r\n No data found.\r\n </div>\r\n </ng-template> -->\r\n <ng-template #showBlank>\r\n <div class=\"no-data-message\">\r\n <div class=\"pp-empty-state\">\r\n <div class=\"img-empty-state\">\r\n <img [src]=\"emptyImage\" alt=\"\">\r\n </div>\r\n <h3>No Product added</h3>\r\n <p>Please go back and start adding products</p>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n</mat-dialog-content>\r\n\r\n<mat-dialog-actions>\r\n <div class=\"tabs-action-step-one\" *ngIf=\"currentPage === 'select-products'\">\r\n <div>\r\n <button mat-button (click)=\"goToNextPage()\" [disabled]=\"selection.selected.length ? false : true\"\r\n color=\"primary\" mat-raised-button>Edit Selected Products</button>\r\n </div>\r\n <div>\r\n <button mat-button (click)=\"goToNextPage()\" [disabled]=\"selection.selected.length ? false : true\"\r\n color=\"primary\" mat-raised-button>Next</button>\r\n <button mat-button [mat-dialog-close]=\"false\">Cancel</button>\r\n </div>\r\n </div>\r\n <div class=\"tabs-action\" *ngIf=\"currentPage === 'edit-save'\">\r\n <div class=\"tab-action-wrp\">\r\n <button mat-button (click)=\"goToPreviousPage()\">Back</button>\r\n <button mat-button type=\"submit\" color=\"primary\" mat-raised-button (click)=\"onSubmit()\">Add/Update</button>\r\n </div>\r\n </div>\r\n</mat-dialog-actions>", styles: [".mat-dialog-heading{margin:0 0 20px;position:relative;display:flex;align-items:center}:host ::ng-deep .mat-dialog-title{width:100%;padding:0 40px;margin:0;font-family:Inter,sans-serif;font-size:20px;color:#000;letter-spacing:normal;text-align:center}.mat-dialog-close mat-icon{color:#000}.example-full-width{width:100%}.mat-dialog-content p{margin-bottom:15px;font-family:Inter,sans-serif}.mat-dialog-content a{color:#2196f3}.mat-dialog-content a:hover{text-decoration:none}:host ::ng-deep .mat-dialog-actions{justify-content:flex-end}.mat-stroked-button.mat-primary{color:#0078d6}.OverlayDiv{position:fixed;display:block;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:#00000080;z-index:500;cursor:pointer}.OverlayDivContent{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%)}.basic-search{display:flex;align-items:center;width:100%;margin-bottom:20px}.basic-search-wrp{border:1px solid #DADCE0;border-radius:5px;padding-left:15px;height:46px;display:flex;align-items:center;flex:1;margin-right:20px}.basic-search-wrp mat-icon{color:#0006}.basic-search-wrp form{width:100%}.search-icon{margin:0;display:flex}.search-icon mat-icon{color:#0006}.search-icon svg{width:24px;height:24px}.search-icon svg path{fill:#999}.input-search{margin:0;border:0;width:100%;padding:0 18px 0 10px}.input-search input{border:0;width:100%;font-size:15px;line-height:1}.input-search input:focus{border:0;outline:0 none}.advfilter{display:flex;margin-left:auto}.advfilter button{border:0;background-color:transparent;margin:0;padding:0;display:flex;position:relative}.advfilter button mat-icon{color:#0006}.advfilter button span{font-weight:600;font-size:10px;display:flex;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;justify-content:center;width:20px;height:20px;color:#fff!important;border-radius:50%;background-color:#f44336!important;position:absolute;top:-5px;right:-10px}.search-btn{margin-left:auto;min-width:137px}.search-btn button{box-shadow:none;height:46px;width:100%}.product-selection-container{border:1px solid #DADCE0;padding:20px;margin-bottom:20px;border-radius:5px}.product-selection-container h5{margin:0;color:#202020!important;font-size:16px!important}.pp-empty-state{max-width:420px;margin:0 auto;padding:50px 0;text-align:center}.img-empty-state{width:100%;margin-bottom:20px}.img-empty-state img{width:100%}.pp-empty-state h3{font-size:20px!important;margin:0 0 5px;padding:0;font-weight:400;color:#202020!important}.pp-empty-state p{font-size:15px!important;margin:0 0 20px!important;padding:0;color:#656667!important}.mat-dialog-content{max-height:none!important;overflow:hidden!important}.tbl-record-found{border-left:1px solid #0000001f;border-right:1px solid #0000001f;border-top:1px solid #0000001f;border-radius:5px 5px 0 0;min-height:104px;max-height:296px;overflow-y:auto;height:100%}.tbl-record-found table{border-collapse:separate}.tbl-record-found tr:last-child td{border-bottom:none}.tbl-record-found thead,.tbl-record-found th{position:-webkit-sticky;position:sticky;top:0;z-index:100;background-color:#fff}.tbl-record-found th.mat-header-cell:first-of-type,.tbl-record-found td.mat-cell:first-of-type,.tbl-record-found td.mat-footer-cell:first-of-type{width:70px}.row-summary{padding:15px 25px;border-left:1px solid #0000001f;border-top:1px solid #0000001f;display:flex;justify-content:space-between;border-right:1px solid #0000001f;border-bottom:1px solid #0000001f;border-radius:0 0 5px 5px}.row-summary div{margin-right:30px}button.delete-btn-picker{background:transparent!important;padding:0!important;min-width:auto!important}button.delete-btn-picker:hover{background:transparent!important}button.delete-btn-picker:hover .mat-button-focus-overlay{opacity:0!important}button.delete-btn-picker mat-icon{color:#f44336!important}mat-icon.icondropdown{line-height:1.6!important}mat-icon.iconclose{line-height:2!important;font-size:120%!important}.added-products{border:1px solid #0000001f;border-bottom:none;border-radius:5px;min-height:133px;max-height:444px;overflow-y:auto;height:100%}.added-products table{border-collapse:separate}.added-products thead,.added-products th{position:-webkit-sticky;position:sticky;top:0;z-index:100;background-color:#fff}.added-products th.mat-header-cell:first-of-type,.added-products td.mat-cell:first-of-type,.added-products td.mat-footer-cell:first-of-type{width:70px}.mat-header-cell{font-weight:500!important;color:#0000008a!important}.clr-all-picker{display:inline-block;border:0;outline:0 none;padding:0;background-color:transparent;color:#2196f3;margin-left:20px}.title-adv{display:flex;align-items:center;margin-bottom:15px}.tabs-action-step-one{display:flex;justify-content:space-between;width:100%}.tbl-record-found td.checkbox-picker-pointer{cursor:pointer!important}.tbl-record-found td{cursor:text!important}.basic-search form{margin:0}@media only screen and (max-width:1545px){.pp-empty-state h3{font-size:18px}.pp-empty-state p{font-size:14px}.pp-empty-state{padding:20px 0;max-width:392px}.product-selection-container h5{font-size:14px;margin-bottom:5px}.product-selection-container{padding:15px 20px}.basic-search{margin-bottom:20px}.mat-dialog-heading{margin-bottom:10px}.mat-dialog-title{font-size:18px}.mat-dialog-content{max-height:60vh!important;overflow:auto!important}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { 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.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i3$2.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$5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i5$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i10$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i10$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i10$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i10$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i10$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i10$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i10$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i10$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i10$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i10$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i11.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i6.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "directive", type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: i14.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i14.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }], animations: [
|