@wizishop/angular-components 0.0.168 → 0.0.172

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.
@@ -1,8 +1,8 @@
1
1
  (function (global, factory) {
2
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@wizishop/ng-wizi-bulma'), require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('ngx-perfect-scrollbar'), require('rxjs'), require('rxjs/operators'), require('@angular/cdk/overlay'), require('@angular/cdk/table'), require('@angular/animations'), require('ngx-chips'), require('@ngx-translate/core'), require('@angular/router'), require('ngx-autosize')) :
3
- typeof define === 'function' && define.amd ? define('@wizishop/angular-components', ['exports', '@wizishop/ng-wizi-bulma', '@angular/core', '@angular/common', '@angular/forms', 'ngx-perfect-scrollbar', 'rxjs', 'rxjs/operators', '@angular/cdk/overlay', '@angular/cdk/table', '@angular/animations', 'ngx-chips', '@ngx-translate/core', '@angular/router', 'ngx-autosize'], factory) :
4
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.wizishop = global.wizishop || {}, global.wizishop['angular-components'] = {}), global['ng-wizi-bulma'], global.ng.core, global.ng.common, global.ng.forms, global['ngx-perfect-scrollbar'], global.rxjs, global.rxjs.operators, global.ng.cdk.overlay, global.ng.cdk.table, global.ng.animations, global['ngx-chips'], global['@ngx-translate/core'], global.ng.router, global.ngxAutosize));
5
- }(this, (function (exports, i1$1, i0, common, forms, ngxPerfectScrollbar, rxjs, operators, i1, table, animations, ngxChips, core, router, ngxAutosize) { 'use strict';
2
+ typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@wizishop/ng-wizi-bulma'), require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('ngx-perfect-scrollbar'), require('rxjs'), require('rxjs/operators'), require('@angular/cdk/overlay'), require('@angular/cdk/table'), require('@angular/animations'), require('ngx-chips'), require('@ngx-translate/core'), require('@angular/router'), require('ngx-autosize'), require('ngx-scrollbar'), require('ngx-scrollbar/reached-event')) :
3
+ typeof define === 'function' && define.amd ? define('@wizishop/angular-components', ['exports', '@wizishop/ng-wizi-bulma', '@angular/core', '@angular/common', '@angular/forms', 'ngx-perfect-scrollbar', 'rxjs', 'rxjs/operators', '@angular/cdk/overlay', '@angular/cdk/table', '@angular/animations', 'ngx-chips', '@ngx-translate/core', '@angular/router', 'ngx-autosize', 'ngx-scrollbar', 'ngx-scrollbar/reached-event'], factory) :
4
+ (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.wizishop = global.wizishop || {}, global.wizishop['angular-components'] = {}), global['ng-wizi-bulma'], global.ng.core, global.ng.common, global.ng.forms, global['ngx-perfect-scrollbar'], global.rxjs, global.rxjs.operators, global.ng.cdk.overlay, global.ng.cdk.table, global.ng.animations, global['ngx-chips'], global['@ngx-translate/core'], global.ng.router, global.ngxAutosize, global.ngxScrollbar, global.reachedEvent));
5
+ }(this, (function (exports, i1$1, i0, common, forms, ngxPerfectScrollbar, rxjs, operators, i1, table, animations, ngxChips, core, router, ngxAutosize, ngxScrollbar, reachedEvent) { 'use strict';
6
6
 
7
7
  /*! *****************************************************************************
8
8
  Copyright (c) Microsoft Corporation.
@@ -2030,7 +2030,7 @@
2030
2030
  TextAreaComponent.decorators = [
2031
2031
  { type: i0.Component, args: [{
2032
2032
  selector: 'wac-text-area',
2033
- template: "<div class=\"field wac-text-area\" [ngClass]=\"{'dynamic': dynamicSize}\">\n <div class=\"field-label is-normal has-text-left\">\n <label class=\"label has-text-weight-normal\" [innerHTML]=\"label\" [for]=\"id\"></label>\n </div>\n <div class=\"field-body\">\n <div class=\"field\">\n <p class=\"control\" [ngClass]=\"{ 'has-icons-right': textError }\">\n <textarea\n class=\"textarea\"\n [id]=\"id\"\n [ngClass]=\"{ 'is-danger': textError, 'has-help-text': textInfo != '' || size }\"\n [placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [(ngModel)]=\"value\"\n (ngModelChange)=\"onChange($event)\"\n (blur)=\"onBlur()\"\n [disabled]=\"disabled\"\n [autosize]=\"dynamicSize\"\n [onlyGrow]=\"true\"\n [maxlength]=\"maxlength ? maxlength : 524288\"\n ></textarea>\n\n <span *ngIf=\"textError\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n <span\n *ngIf=\"textInfo && (textError === null || textError === '')\"\n class=\"is-size-7 wac-text-area__info text-info\"\n [innerHtml]=\"textInfo\"\n ></span>\n <span *ngIf=\"textError\" class=\"is-size-7 wac-text-area__error has-text-danger\" [innerHtml]=\"textError\"></span>\n <span\n *ngIf=\"size && !progressBar\"\n class=\"is-size-7 wac-text-area__size\"\n [ngClass]=\"value && value.length > size ? 'has-text-danger' : ''\"\n >{{ value ? value.length : 0 }}/{{ size }}</span\n >\n </p>\n <wac-progress-bar *ngIf=\"progressBar && value\" [min]=\"min\" [max]=\"max\" [valueLength]=\"value.length\"></wac-progress-bar>\n </div>\n </div>\n</div>\n",
2033
+ template: "<div class=\"field wac-text-area\" [ngClass]=\"{'dynamic': dynamicSize}\">\n <div class=\"field-label is-normal has-text-left\">\n <label class=\"label has-text-weight-normal\" [innerHTML]=\"label\" [for]=\"id\"></label>\n </div>\n <div class=\"field-body\">\n <div class=\"field\">\n <p class=\"control\" [ngClass]=\"{ 'has-icons-right': textError }\">\n <textarea\n class=\"textarea\"\n [id]=\"id\"\n [ngClass]=\"{ 'is-danger': textError, 'has-help-text': textInfo != '' || size }\"\n [placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [(ngModel)]=\"value\"\n (ngModelChange)=\"onChange($event)\"\n (blur)=\"onBlur()\"\n [disabled]=\"disabled\"\n [autosize]=\"dynamicSize\"\n [onlyGrow]=\"true\"\n [maxlength]=\"maxlength ? maxlength : 524288\"\n [minlength]=\"minlength ? minlength : 0\"\n ></textarea>\n\n <span *ngIf=\"textError\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n <span\n *ngIf=\"textInfo && (textError === null || textError === '')\"\n class=\"is-size-7 wac-text-area__info text-info\"\n [innerHtml]=\"textInfo\"\n ></span>\n <span *ngIf=\"textError\" class=\"is-size-7 wac-text-area__error has-text-danger\" [innerHtml]=\"textError\"></span>\n <span\n *ngIf=\"size && !progressBar\"\n class=\"is-size-7 wac-text-area__size\"\n [ngClass]=\"value.length > size ? 'has-text-danger' : ''\"\n >{{ value ? value.length : 0 }}/{{ size }}</span\n >\n </p>\n <wac-progress-bar *ngIf=\"progressBar && value\" [min]=\"min\" [max]=\"max\" [valueLength]=\"value.length\"></wac-progress-bar>\n </div>\n </div>\n</div>\n",
2034
2034
  providers: [{ provide: forms.NG_VALUE_ACCESSOR, useExisting: TextAreaComponent, multi: true }]
2035
2035
  },] }
2036
2036
  ];
@@ -2042,11 +2042,12 @@
2042
2042
  textError: [{ type: i0.Input }],
2043
2043
  size: [{ type: i0.Input }],
2044
2044
  min: [{ type: i0.Input }],
2045
- maxlength: [{ type: i0.Input }],
2046
2045
  max: [{ type: i0.Input }],
2047
2046
  dynamicSize: [{ type: i0.Input }],
2048
2047
  progressBar: [{ type: i0.Input }],
2049
- disabled: [{ type: i0.Input }]
2048
+ disabled: [{ type: i0.Input }],
2049
+ maxlength: [{ type: i0.Input }],
2050
+ minlength: [{ type: i0.Input }]
2050
2051
  };
2051
2052
 
2052
2053
  var H1Component = /** @class */ (function () {
@@ -2213,7 +2214,7 @@
2213
2214
  InputComponent.decorators = [
2214
2215
  { type: i0.Component, args: [{
2215
2216
  selector: 'wac-input',
2216
- template: "<div\n class=\"field wac-input\"\n [ngClass]=\"{ 'has-no-block': withoutBlock, 'is-big': big, 'is-medium': medium, 'with-padding': padding, 'indication-left': indicationLeft, 'with-progress-bar': progressBar }\"\n>\n <div class=\"field-label is-normal has-text-left\" *ngIf=\"!withoutBlock\">\n <label\n [ngClass]=\"[boldLabel == 'true' ? 'label has-text-weight-bold' : 'label has-text-weight-normal', showTooltip ? 'label-inline' : '']\"\n [innerHTML]=\"label\"\n [for]=\"id\"\n ></label>\n <wac-tooltip\n *ngIf=\"showTooltip\"\n [tooltipIcon]=\"iconTooltip\"\n [tooltipText]=\"textTooltip\"\n [tooltipLink]=\"linkTooltip\"\n [tooltipUrl]=\"urlTooltip\"\n ></wac-tooltip>\n <!-- Size -->\n <span *ngIf=\"value && size && !progressBar\" class=\"is-size-7 wac-input__size\">\n <strong>{{ value.toString().length }}</strong> / {{ size }}\n </span>\n </div>\n <div class=\"field-body\">\n <div class=\"field\">\n <p\n class=\"control\"\n [ngClass]=\"{ 'has-icons-right': textError || success, 'has-icons-left': icon !== '', 'has-input-group': textAppend || textPrepend }\"\n >\n <!-- Text Prepend -->\n <span *ngIf=\"textPrepend\" class=\"has-input-group\">\n <span class=\"has-input-group-text prepend\">{{ textPrepend }}</span>\n <span *ngIf=\"icon !== ''\" class=\"icon is-small is-left\">\n <i [class]=\"icon\"></i>\n </span>\n </span>\n\n <!-- Input -->\n <input\n [class]=\"'input ' + extraClasses\"\n [id]=\"id\"\n [ngClass]=\"{\n 'is-danger': textError,\n 'is-large': big,\n 'is-number': isNumber,\n 'remove-margin': disableMargin,\n 'text-append': textAppend\n }\"\n [type]=\"type\"\n [placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [(ngModel)]=\"value\"\n (ngModelChange)=\"onChange($event)\"\n (blur)=\"onBlur()\"\n [disabled]=\"disabled\"\n (focusout)=\"onFocusOut()\"\n [min]=\"min\"\n [max]=\"max\"\n (keypress)=\"keyPress($event)\"\n />\n\n <!-- Indication at the end of the input -->\n <span class=\"indication\" *ngIf=\"indication\" [ngClass]=\"{'reverse': indicationLeft}\">\n <span [innerHTML]=\"indication\"></span>\n </span>\n\n <!-- Text Append -->\n <span *ngIf=\"textAppend && !indicationLeft\" class=\"has-input-group\">\n <span class=\"has-input-group-text append\">{{ textAppend }}</span>\n <!-- error if text append not empty -->\n <span *ngIf=\"textError\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n </span>\n\n <!-- Icon Left -->\n <span *ngIf=\"icon !== '' && !textPrepend && !indicationLeft\" class=\"icon is-small is-left\">\n <i [class]=\"icon\"></i>\n </span>\n\n <!-- Icon error if textAppend empty -->\n <span *ngIf=\"textError && !textAppend && !indicationLeft\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n\n <!-- Icon success -->\n <span *ngIf=\"success\" class=\"icon is-small is-right\">\n <i class=\"fas fa-check has-text-success\"></i>\n </span>\n\n <!-- Text Info -->\n <span\n *ngIf=\"textInfo && (textError === null || textError === '') && !progressBar && !indicationLeft\"\n class=\"is-size-7 wac-input__info text-info\"\n [innerHtml]=\"textInfo\"\n ></span>\n\n <!-- Text Error -->\n <span *ngIf=\"textError && !progressBar && !indicationLeft\" class=\"is-size-7 wac-input__error has-text-danger\" [innerHtml]=\"textError\"></span>\n </p>\n\n <!-- Progress Bar -->\n <wac-progress-bar *ngIf=\"progressBar && !indicationLeft\" [min]=\"min\" [max]=\"max\" [valueLength]=\"value.length\"></wac-progress-bar>\n </div>\n </div>\n</div>\n",
2217
+ template: "<div\n class=\"field wac-input\"\n [ngClass]=\"{ 'has-no-block': withoutBlock, 'is-big': big, 'is-medium': medium, 'with-padding': padding, 'indication-left': indicationLeft, 'with-progress-bar': progressBar }\"\n>\n <div class=\"field-label is-normal has-text-left\" *ngIf=\"!withoutBlock\">\n <label\n [ngClass]=\"[boldLabel == 'true' ? 'label has-text-weight-bold' : 'label has-text-weight-normal', showTooltip ? 'label-inline' : '']\"\n [innerHTML]=\"label\"\n [for]=\"id\"\n ></label>\n <wac-tooltip\n *ngIf=\"showTooltip\"\n [tooltipIcon]=\"iconTooltip\"\n [tooltipText]=\"textTooltip\"\n [tooltipLink]=\"linkTooltip\"\n [tooltipUrl]=\"urlTooltip\"\n ></wac-tooltip>\n <!-- Size -->\n <span *ngIf=\"size && !progressBar\" class=\"is-size-7 wac-input__size\">\n <strong>{{ value.toString().length }}</strong> / {{ size }}\n </span>\n </div>\n <div class=\"field-body\">\n <div class=\"field\">\n <p\n class=\"control\"\n [ngClass]=\"{ 'has-icons-right': textError || success, 'has-icons-left': icon !== '', 'has-input-group': textAppend || textPrepend }\"\n >\n <!-- Text Prepend -->\n <span *ngIf=\"textPrepend\" class=\"has-input-group\">\n <span class=\"has-input-group-text prepend\">{{ textPrepend }}</span>\n <span *ngIf=\"icon !== ''\" class=\"icon is-small is-left\">\n <i [class]=\"icon\"></i>\n </span>\n </span>\n\n <!-- Input -->\n <input\n [class]=\"'input ' + extraClasses\"\n [id]=\"id\"\n [ngClass]=\"{\n 'is-danger': textError,\n 'is-large': big,\n 'is-number': isNumber,\n 'remove-margin': disableMargin,\n 'text-append': textAppend\n }\"\n [type]=\"type\"\n [placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [(ngModel)]=\"value\"\n (ngModelChange)=\"onChange($event)\"\n (blur)=\"onBlur()\"\n [disabled]=\"disabled\"\n (focusout)=\"onFocusOut()\"\n [min]=\"min\"\n [max]=\"max\"\n [maxlength]=\"maxlength ? maxlength : 524288\"\n [minlength]=\"minlength ? minlength : 0\"\n (keypress)=\"keyPress($event)\"\n />\n\n <!-- Indication at the end of the input -->\n <span class=\"indication\" *ngIf=\"indication\" [ngClass]=\"{'reverse': indicationLeft}\">\n <span [innerHTML]=\"indication\"></span>\n </span>\n\n <!-- Text Append -->\n <span *ngIf=\"textAppend && !indicationLeft\" class=\"has-input-group\">\n <span class=\"has-input-group-text append\">{{ textAppend }}</span>\n <!-- error if text append not empty -->\n <span *ngIf=\"textError\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n </span>\n\n <!-- Icon Left -->\n <span *ngIf=\"icon !== '' && !textPrepend && !indicationLeft\" class=\"icon is-small is-left\">\n <i [class]=\"icon\"></i>\n </span>\n\n <!-- Icon error if textAppend empty -->\n <span *ngIf=\"textError && !textAppend && !indicationLeft\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n\n <!-- Icon success -->\n <span *ngIf=\"success\" class=\"icon is-small is-right\">\n <i class=\"fas fa-check has-text-success\"></i>\n </span>\n\n <!-- Text Info -->\n <span\n *ngIf=\"textInfo && (textError === null || textError === '') && !progressBar && !indicationLeft\"\n class=\"is-size-7 wac-input__info text-info\"\n [innerHtml]=\"textInfo\"\n ></span>\n\n <!-- Text Error -->\n <span *ngIf=\"textError && !progressBar && !indicationLeft\" class=\"is-size-7 wac-input__error has-text-danger\" [innerHtml]=\"textError\"></span>\n </p>\n\n <!-- Progress Bar -->\n <wac-progress-bar *ngIf=\"progressBar && !indicationLeft\" [min]=\"min\" [max]=\"max\" [valueLength]=\"value.length\"></wac-progress-bar>\n </div>\n </div>\n</div>\n",
2217
2218
  providers: [{ provide: forms.NG_VALUE_ACCESSOR, useExisting: InputComponent, multi: true }]
2218
2219
  },] }
2219
2220
  ];
@@ -2248,6 +2249,8 @@
2248
2249
  disabled: [{ type: i0.Input }],
2249
2250
  indication: [{ type: i0.Input }],
2250
2251
  success: [{ type: i0.Input }],
2252
+ maxlength: [{ type: i0.Input }],
2253
+ minlength: [{ type: i0.Input }],
2251
2254
  indicationLeft: [{ type: i0.Input }],
2252
2255
  keypressEnter: [{ type: i0.Output }]
2253
2256
  };
@@ -4209,12 +4212,14 @@
4209
4212
  WrapperSidebarComponent.decorators = [
4210
4213
  { type: i0.Component, args: [{
4211
4214
  selector: 'wac-wrapper-sidebar',
4212
- template: "<div class=\"wac-wrapper-sidebar\" [ngClass]=\"{'reverse': reverse}\">\n <div class=\"wac-wrapper-sidebar__left\">\n <ng-content select=\"[sidebar]\"></ng-content>\n </div>\n <div class=\"wac-wrapper-sidebar__right\">\n <ng-content select=\"[content]\"></ng-content>\n </div>\n</div>\n"
4215
+ template: "<div class=\"wac-wrapper-sidebar\" [ngClass]=\"{'reverse': reverse}\">\n <div class=\"wac-wrapper-sidebar__left\">\n <ng-content select=\"[sidebar]\"></ng-content>\n </div>\n <div class=\"wac-wrapper-sidebar__right\" [style.backgroundImage]=\"'url(' + backgroundGrey + ')'\" [style.backgroundSize]=\"backgroundWidth\">\n <ng-content select=\"[content]\"></ng-content>\n </div>\n</div>\n"
4213
4216
  },] }
4214
4217
  ];
4215
4218
  WrapperSidebarComponent.ctorParameters = function () { return []; };
4216
4219
  WrapperSidebarComponent.propDecorators = {
4217
- reverse: [{ type: i0.Input }]
4220
+ reverse: [{ type: i0.Input }],
4221
+ backgroundGrey: [{ type: i0.Input }],
4222
+ backgroundWidth: [{ type: i0.Input }]
4218
4223
  };
4219
4224
 
4220
4225
  var BreadcrumbsComponent = /** @class */ (function () {
@@ -4328,7 +4333,9 @@
4328
4333
  this.worldAction.emit(true);
4329
4334
  };
4330
4335
  BlockWithCheckboxComponent.prototype.removeFirstClass = function () {
4331
- document.querySelectorAll('.firstWacRadioBLock')[0].classList.remove('firstWacRadioBLock');
4336
+ if (typeof document.querySelectorAll('.firstWacRadioBLock')[0] !== typeof undefined) {
4337
+ document.querySelectorAll('.firstWacRadioBLock')[0].classList.remove('firstWacRadioBLock');
4338
+ }
4332
4339
  };
4333
4340
  return BlockWithCheckboxComponent;
4334
4341
  }());
@@ -4417,6 +4424,9 @@
4417
4424
  }
4418
4425
  return columns;
4419
4426
  };
4427
+ MosaicComponent.prototype.onBottomReached = function () {
4428
+ console.log('end bottom !');
4429
+ };
4420
4430
  MosaicComponent.prototype.onImportImage = function (src) {
4421
4431
  this.importImageSrc.emit(src);
4422
4432
  };
@@ -4425,7 +4435,7 @@
4425
4435
  MosaicComponent.decorators = [
4426
4436
  { type: i0.Component, args: [{
4427
4437
  selector: 'wac-mosaic',
4428
- template: "<div class=\"wac-mosaic__loader\" *ngIf=\"isLoading\">\n <wac-loader></wac-loader>\n</div>\n<div class=\"wac-mosaic\" *ngIf=\"!isLoading\">\n <div class=\"wac-mosaic__wrapper\">\n <div class=\"wac-mosaic__wrapper__column\" *ngFor=\"let column of columns\">\n <div class=\"wac-mosaic__wrapper__column__image\" *ngFor=\"let image of column; let i = index;\">\n <img [src]=\"image.src\" [alt]=\"image.alt\"/>\n <div class=\"hover\">\n <ng-container\n [ngTemplateOutlet]=\"importButtonTemplate || defaultImportButton\"\n [ngTemplateOutletContext]=\"{ $implicit: image }\"\n >\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n<ng-template #defaultImportButton let-image>\n <wac-button [icon]=\"'fa-solid fa-image'\" [label]=\"'wac.MosaicComponent.import' | translate\" [extraClasses]=\"'is-success'\" (click)=\"onImportImage(image.src)\"></wac-button>\n</ng-template>\n",
4438
+ template: "<div class=\"wac-mosaic\" *ngIf=\"!isLoading; else loading\">\n <ng-scrollbar (reachedBottom)=\"onBottomReached()\" reachedOffset=\"200\" class=\"wac-mosaic__wrapper__scrollbar\">\n <div class=\"wac-mosaic__wrapper\">\n <div class=\"wac-mosaic__wrapper__column\" *ngFor=\"let column of columns\">\n <div class=\"wac-mosaic__wrapper__column__image\" *ngFor=\"let image of column; let i = index;\">\n <img [src]=\"image.src\" [alt]=\"image.alt\"/>\n <div class=\"hover\">\n <ng-container\n [ngTemplateOutlet]=\"importButtonTemplate || defaultImportButton\"\n [ngTemplateOutletContext]=\"{ $implicit: image }\"\n >\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n </ng-scrollbar>\n</div>\n\n<ng-template #defaultImportButton let-image>\n <wac-button [icon]=\"'fa-solid fa-image'\" [label]=\"'wac.MosaicComponent.import' | translate\" [extraClasses]=\"'is-success'\" (click)=\"onImportImage(image.src)\"></wac-button>\n</ng-template>\n\n<ng-template #loading>\n <div class=\"wac-mosaic__loader\" *ngIf=\"isLoading\">\n <wac-loader></wac-loader>\n </div>\n</ng-template>\n",
4429
4439
  encapsulation: i0.ViewEncapsulation.None
4430
4440
  },] }
4431
4441
  ];
@@ -4532,6 +4542,8 @@
4532
4542
  AlertPopupModule,
4533
4543
  router.RouterModule,
4534
4544
  ngxAutosize.AutosizeModule,
4545
+ ngxScrollbar.NgScrollbarModule,
4546
+ reachedEvent.NgScrollbarReachedModule,
4535
4547
  TreeModule
4536
4548
  ],
4537
4549
  declarations: components,