@dotglitch/ngx-common 1.0.22 → 1.0.24

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.
@@ -4,7 +4,7 @@ import { TemplateRef, Component, Optional, Inject, Input, HostListener, Directiv
4
4
  import * as i1 from '@angular/material/dialog';
5
5
  import { MAT_DIALOG_DATA, MatDialog } from '@angular/material/dialog';
6
6
  import * as i2 from '@angular/common';
7
- import { CommonModule, NgTemplateOutlet, NgIf, NgForOf, DOCUMENT, NgComponentOutlet, DatePipe } from '@angular/common';
7
+ import { CommonModule, NgIf, NgForOf, NgTemplateOutlet, DOCUMENT, NgComponentOutlet, DatePipe } from '@angular/common';
8
8
  import * as i1$1 from '@angular/platform-browser';
9
9
  import { createApplication } from '@angular/platform-browser';
10
10
  import { firstValueFrom, debounceTime, of, Subject, BehaviorSubject } from 'rxjs';
@@ -12,16 +12,16 @@ import * as i5 from '@angular/material/icon';
12
12
  import { MatIconModule } from '@angular/material/icon';
13
13
  import * as i5$1 from '@angular/material/progress-spinner';
14
14
  import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
15
- import * as i2$1 from '@angular/cdk/portal';
15
+ import * as i3 from '@angular/cdk/portal';
16
16
  import { ComponentPortal, PortalModule } from '@angular/cdk/portal';
17
- import * as i2$2 from '@angular/cdk/dialog';
17
+ import * as i2$1 from '@angular/cdk/dialog';
18
18
  import { retry } from 'rxjs/operators';
19
19
  import * as i1$2 from '@angular/common/http';
20
20
  import * as i4 from '@angular/material/tabs';
21
21
  import { MatTabsModule } from '@angular/material/tabs';
22
22
  import * as i6$1 from '@angular/material/sidenav';
23
23
  import { MatDrawerContainer, MatSidenavModule } from '@angular/material/sidenav';
24
- import * as i3 from 'angular-split';
24
+ import * as i3$1 from 'angular-split';
25
25
  import { AngularSplitModule } from 'angular-split';
26
26
  import * as i6 from '@angular/material/checkbox';
27
27
  import { MatCheckboxModule } from '@angular/material/checkbox';
@@ -33,9 +33,9 @@ import { NgScrollbarModule } from 'ngx-scrollbar';
33
33
  import { TabulatorFull } from 'tabulator-tables';
34
34
  import * as i7 from '@angular/material/progress-bar';
35
35
  import { MatProgressBarModule } from '@angular/material/progress-bar';
36
- import * as i2$3 from '@angular/material/button';
36
+ import * as i2$2 from '@angular/material/button';
37
37
  import { MatButtonModule } from '@angular/material/button';
38
- import * as i2$4 from '@angular/material/expansion';
38
+ import * as i2$3 from '@angular/material/expansion';
39
39
  import { MatExpansionModule } from '@angular/material/expansion';
40
40
  import * as path from 'path-browserify';
41
41
 
@@ -460,53 +460,6 @@ const calcComponentBounds = (component, data) => __awaiter(void 0, void 0, void
460
460
  del.remove();
461
461
  return rect;
462
462
  });
463
- class TemplateWrapper {
464
- constructor(dialogRef, _data, viewContainer) {
465
- this.dialogRef = dialogRef;
466
- this._data = _data;
467
- this.viewContainer = viewContainer;
468
- this.data = _data.data;
469
- this.template = _data.template;
470
- this.templateType = this.template instanceof TemplateRef ? "template" : "component";
471
- if (this.templateType == "component") {
472
- this.componentPortal = new ComponentPortal(this.template);
473
- }
474
- }
475
- }
476
- TemplateWrapper.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TemplateWrapper, deps: [{ token: i1.MatDialogRef, optional: true }, { token: MAT_DIALOG_DATA }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
477
- TemplateWrapper.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TemplateWrapper, isStandalone: true, selector: "ngx-menu-template-wrapper", ngImport: i0, template: `
478
- <ng-container *ngIf="templateType == 'template'; else portalOutlet">
479
- <ng-container
480
- [ngTemplateOutlet]="template"
481
- [ngTemplateOutletContext]="{ '$implicit': data, dialog: dialogRef }"
482
- />
483
- </ng-container>
484
- <ng-template #portalOutlet [cdkPortalOutlet]="componentPortal" ></ng-template>
485
- `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i2$1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
486
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TemplateWrapper, decorators: [{
487
- type: Component,
488
- args: [{
489
- selector: 'ngx-menu-template-wrapper',
490
- template: `
491
- <ng-container *ngIf="templateType == 'template'; else portalOutlet">
492
- <ng-container
493
- [ngTemplateOutlet]="template"
494
- [ngTemplateOutletContext]="{ '$implicit': data, dialog: dialogRef }"
495
- />
496
- </ng-container>
497
- <ng-template #portalOutlet [cdkPortalOutlet]="componentPortal" ></ng-template>
498
- `,
499
- imports: [NgTemplateOutlet, PortalModule, NgIf],
500
- standalone: true
501
- }]
502
- }], ctorParameters: function () {
503
- return [{ type: i1.MatDialogRef, decorators: [{
504
- type: Optional
505
- }] }, { type: undefined, decorators: [{
506
- type: Inject,
507
- args: [MAT_DIALOG_DATA]
508
- }] }, { type: i0.ViewContainerRef }];
509
- } });
510
463
  class MenuComponent {
511
464
  constructor(viewContainer, sanitizer, _data, dialog, // optional only for the purpose of estimating dimensions
512
465
  dialogRef) {
@@ -530,6 +483,7 @@ class MenuComponent {
530
483
  this.matIconRx = /[\/\.]/i;
531
484
  this.showIconColumn = true;
532
485
  this.showShortcutColumn = true;
486
+ this.childDialogs = [];
533
487
  // Defaults are set before @Input() hooks evaluate
534
488
  this.data = (_a = this._data) === null || _a === void 0 ? void 0 : _a.data;
535
489
  this.ownerCords = (_b = this._data) === null || _b === void 0 ? void 0 : _b.ownerCords;
@@ -537,6 +491,11 @@ class MenuComponent {
537
491
  this.items = (_d = this._data) === null || _d === void 0 ? void 0 : _d.items;
538
492
  this.config = (_e = this._data) === null || _e === void 0 ? void 0 : _e.config;
539
493
  this.id = (_f = this._data) === null || _f === void 0 ? void 0 : _f.id;
494
+ this.template = _data.template;
495
+ this.templateType = this.template instanceof TemplateRef ? "template" : "component";
496
+ if (this.templateType == "component") {
497
+ this.componentPortal = new ComponentPortal(this.template);
498
+ }
540
499
  }
541
500
  ngOnInit() {
542
501
  var _a, _b, _c;
@@ -634,7 +593,7 @@ class MenuComponent {
634
593
  };
635
594
  // Set position coordinates
636
595
  const { width, height } = yield (item.childTemplate
637
- ? calcComponentBounds(TemplateWrapper, { template: item.childTemplate })
596
+ ? calcComponentBounds(MenuComponent, { template: item.childTemplate })
638
597
  : calcMenuItemBounds(item.children, this.data));
639
598
  if (bounds.y + height > window.innerHeight)
640
599
  cords.bottom = "0px";
@@ -644,7 +603,7 @@ class MenuComponent {
644
603
  cords.top = bounds.y + "px";
645
604
  if (!cords.left)
646
605
  cords.left = bounds.x + bounds.width + "px";
647
- const component = item.children ? MenuComponent : TemplateWrapper;
606
+ const component = item.children ? MenuComponent : MenuComponent;
648
607
  const dialogRef = this.dialog.open(component, {
649
608
  position: cords,
650
609
  panelClass: ["ngx-menu"].concat(((_a = this.config) === null || _a === void 0 ? void 0 : _a.customClass) || []),
@@ -670,8 +629,10 @@ class MenuComponent {
670
629
  else {
671
630
  item['_selfclose'] = Date.now();
672
631
  }
632
+ this.childDialogs.splice(this.childDialogs.findIndex(d => d == dialogRef), 1);
673
633
  _s.unsubscribe();
674
634
  });
635
+ this.childDialogs.push(dialogRef);
675
636
  return dialogRef;
676
637
  });
677
638
  }
@@ -688,10 +649,16 @@ class MenuComponent {
688
649
  */
689
650
  // @HostListener("window:resize", ['event'])
690
651
  // @HostListener("window:blur", ['event'])
691
- close() {
652
+ close(result) {
692
653
  var _a;
693
- this.closeSignal.emit();
694
- (_a = this.dialogRef) === null || _a === void 0 ? void 0 : _a.close();
654
+ if (result != -1)
655
+ this.closeSignal.emit();
656
+ this.childDialogs.forEach(d => d.close());
657
+ (_a = this.dialogRef) === null || _a === void 0 ? void 0 : _a.close(result);
658
+ }
659
+ closeOnVoid(force = false) {
660
+ if (!this.isLockedOpen || force)
661
+ this.close(-1);
695
662
  }
696
663
  /**
697
664
  * Check if the dialog is clipping offscreen
@@ -717,10 +684,6 @@ class MenuComponent {
717
684
  target.style['margin-left'] = newLeft;
718
685
  }
719
686
  }
720
- closeOnVoid(force = false) {
721
- if (!this.isLockedOpen || force)
722
- this.dialogRef.close(-1);
723
- }
724
687
  // If the void element gets stuck open, make wheel events pass through.
725
688
  onWheel(evt) {
726
689
  const el = this.viewContainer.element.nativeElement;
@@ -735,17 +698,18 @@ class MenuComponent {
735
698
  }
736
699
  }
737
700
  MenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuComponent, deps: [{ token: i0.ViewContainerRef }, { token: i1$1.DomSanitizer }, { token: MAT_DIALOG_DATA, optional: true }, { token: i1.MatDialog, optional: true }, { token: i1.MatDialogRef, optional: true }], target: i0.ɵɵFactoryTarget.Component });
738
- MenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: MenuComponent, isStandalone: true, selector: "ngx-menu", inputs: { data: "data", items: "items", config: "config", id: "id", ownerCords: "ownerCords", selfCords: "selfCords" }, outputs: { closeSignal: "closeSignal" }, host: { listeners: { "window:resize": "onResize()" } }, ngImport: i0, template: "<!-- Mouse event blocker for pointer leave -->\n<div\n *ngIf=\"coverRectCords\"\n class=\"owner-mask\"\n [style.top]=\"coverRectCords.top + 'px'\"\n [style.left]=\"coverRectCords.left + 'px'\"\n [style.height]=\"coverRectCords.height + 'px'\"\n [style.width]=\"coverRectCords.width + 'px'\"\n style=\"z-index: -1\"\n></div>\n\n<div class=\"void\"\n (pointerenter)=\"pointerIsOnVoid = true; hasBootstrapped && !isLockedOpen && closeOnVoid()\"\n (pointerleave)=\"pointerIsOnVoid = false\"\n (pointerdown)=\"hasBootstrapped && closeOnVoid(true)\"\n (wheel)=\"onWheel($event)\"\n></div>\n\n<table>\n <tbody>\n <ng-container *ngFor=\"let item of items\">\n <ng-container>\n\n <!-- A row with a click action -->\n <tr #row\n *ngIf=\"item != 'separator' && item.separator != true && item['_visible']\"\n [class.disabled]=\"item['_disabled']\"\n (click)=\"!item['_disabled'] && onMenuItemClick(item, row)\"\n [class.hover]=\"item['children'] && row['hover']\"\n (pointerenter)=\"row['hover'] = true;\"\n (pointerleave)=\"row['hover'] = false\"\n >\n <!-- (item['children']?.length > 0 || item['childTemplate']) && onHover(item, row); closeOnLeave=true -->\n <td class=\"icon\" *ngIf=\"showIconColumn\">\n <img *ngIf=\"matIconRx.test(item.icon); else matIcon\" [src]=\"item.icon\" />\n <ng-template #matIcon>\n <mat-icon [fontIcon]=\"item.icon\"></mat-icon>\n </ng-template>\n </td>\n\n <!-- 'Normal' action based item -->\n <ng-container>\n <td class=\"label\"\n [style.padding-left]=\"showIconColumn ? 0 : '16px'\"\n >\n <a\n [attr.target]=\"item.linkTarget\"\n [attr.href]=\"(item['_link'] || item.link) ? sanitizer.bypassSecurityTrustUrl(item['_link'] || item.link) : undefined\"\n >\n <ng-container\n *ngIf=\"$any(item.labelTemplate)?.prototype; else labelTemplate\"\n [ngTemplateOutlet]=\"$any(item).labelTemplate\"\n [ngTemplateOutletContext]=\"{ '$implicit': data, 'dialog': dialogRef }\"\n />\n\n <ng-template #labelTemplate>\n <ng-container *ngIf=\"!$any(item)?.labelTemplate\">\n <div [innerHTML]=\"item['_formattedLabel']\"></div>\n </ng-container>\n <ng-container *ngIf=\"$any(item)?.labelTemplate\">\n {{$any(item)?.labelTemplate(data || {})}}\n </ng-container>\n </ng-template>\n </a>\n </td>\n </ng-container>\n\n <td class=\"shortcut\" *ngIf=\"showShortcutColumn\">\n {{item.shortcutLabel}}\n </td>\n <td style=\"min-width: 16px\">\n <mat-icon *ngIf=\"\n (item.children && item.children.length > 0) ||\n item.childTemplate ||\n (item.childrenResolver && !item['_isResolving'])\n \"\n sytle=\"transform: translateY(2px)\"\n >\n chevron_right\n </mat-icon>\n\n <mat-progress-spinner *ngIf=\"item['_isResolving']\" mode=\"indeterminate\" [diameter]=\"20\" style=\"margin-right: 4px\"/>\n </td>\n </tr>\n\n <tr *ngIf=\"item != 'separator' && item.separator == true\" class=\"disabled separator\">\n <td class=\"center\" [attr.colspan]=\"2 + (showIconColumn ? 1 : 0) + (showShortcutColumn ? 1 : 0)\">\n <span class=\"hr\">\n {{item['label'] || ''}}\n </span>\n </td>\n </tr>\n <tr *ngIf=\"item == 'separator'\" class=\"disabled separator\">\n <td [attr.colspan]=\"2 + (showIconColumn ? 1 : 0) + (showShortcutColumn ? 1 : 0)\">\n <hr/>\n </td>\n </tr>\n </ng-container>\n </ng-container>\n </tbody>\n</table>\n\n<!-- <div *ngIf=\"true\" class=\"backdrop\"></div> -->\n<!-- <div\n *ngIf=\"parentCords && this.selfCords\"\n class=\"backdrop parent\"\n [style.top]=\"(parentCords.y - selfCords.y + 6) + 'px'\"\n [style.left]=\"(parentCords.x - selfCords.x + 12) + 'px'\"\n [style.width]=\"(parentCords.width) + 'px'\"\n [style.height]=\"(parentCords.height) + 'px'\"\n>\n</div> -->\n<!-- <ng-container *ngIf=\"parentCords && selfCords\">\n <div #top\n class=\"backdrop-outer\"\n [style.bottom]=\"(parentCords.y - selfCords.y)*-1 + parentCords.height + 'px'\"\n style=\"background: #f003;\"\n (pointerenter)=\"onLeave()\"\n ></div>\n <div #right\n class=\"backdrop-outer\"\n [style.left]=\"((parentCords.x - selfCords.x) + parentCords.width) + 'px'\"\n style=\"background: #0f03;\"\n (pointerenter)=\"onLeave()\"\n >\n <div>px: {{parentCords.x}}</div>\n <div>py: {{parentCords.y}}</div>\n <div>pw: {{parentCords.width}}</div>\n <div>ph: {{parentCords.height}}</div>\n <div>sx: {{selfCords.x}}</div>\n <div>sy: {{selfCords.y}}</div>\n <div>sw: {{selfCords.width}}</div>\n <div>sh: {{selfCords.height}}</div>\n </div>\n <div #bottom\n class=\"backdrop-outer\"\n [style.top]=\"((parentCords.y + parentCords.height - selfCords.y)) + 'px'\"\n style=\"background: #00f3;\"\n (pointerenter)=\"onLeave()\"\n ></div>\n <div #left\n class=\"backdrop-outer\"\n [style.right]=\"((parentCords.x - selfCords.x)*-1 + parentCords.width + 32) + 'px'\"\n style=\"background: #fff3;\"\n (pointerenter)=\"onLeave()\"\n ></div>\n</ng-container> -->\n", styles: ["::ng-deep .cdk-overlay-container .ngx-menu{--mdc-dialog-container-color: var(--ngx-menu-background-color, #2f2f2f)}::ng-deep .cdk-overlay-container .ngx-menu .mdc-dialog__container{transform-origin:top left}::ng-deep .cdk-overlay-container .ngx-menu .mdc-dialog--open .mdc-dialog__container{transform:none}::ng-deep .cdk-overlay-pane.ngx-menu .mat-mdc-dialog-surface{overflow:visible}:host{-webkit-user-select:none;user-select:none;z-index:1;position:relative;display:block}table{border-spacing:0;border-radius:5px;padding:4px 0}tr{color:var(--ngx-menu-text-color, #ccc);font-size:14px;cursor:pointer;transition:background-color 75ms ease,color 75ms ease}tr:not(.disabled):hover{background-color:var(--ngx-menu-hover-background-color, #94ebeb);color:var(--ngx-menu-hover-text-color, #000)}tr:not(.disabled):hover a{color:var(--ngx-menu-hover-text-color, #000)}tr:not(.separator){height:36px}tr.disabled .label{color:var(--ngx-menu-disabled-text-color, #919191)}tr .center{text-align:center}tr a{outline:0;display:flex;align-items:center;gap:10px;justify-content:space-between;height:100%;width:100%}tr .label{min-width:100px}.hr{height:1px;text-align:center;position:relative}.hr:before,.hr:after{content:\"\";background:var(--ngx-menu-separator-color, #2a2a2a);display:block;position:absolute;top:0;bottom:0;height:1px;margin:auto;width:300px}.hr:before{right:calc(100% + 4px)}.hr:after{left:calc(100% + 4px)}hr{background:var(--ngx-menu-separator-color, #2a2a2a);border:0;height:1px;margin:0}.icon{width:24px;height:24px;padding-left:10px}.icon mat-icon{transform:translateY(2px)}.shortcut{color:var(--ngx-menu-shortcut-text-color, #848484);text-align:end;padding-right:10px;padding-left:12px}.label{height:var(--ngx-menu-item-height, 30px)}td{vertical-align:middle}.void,.owner-mask{position:absolute}.void{top:-100vh;right:-100vw;bottom:-100vh;left:-100vw;z-index:-2}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i5$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }] });
701
+ MenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: MenuComponent, isStandalone: true, selector: "ngx-menu", inputs: { data: "data", items: "items", config: "config", id: "id", ownerCords: "ownerCords", selfCords: "selfCords" }, outputs: { closeSignal: "closeSignal" }, host: { listeners: { "window:resize": "onResize()" } }, ngImport: i0, template: "<!-- Mouse event blocker for pointer leave -->\n<div\n *ngIf=\"coverRectCords\"\n class=\"owner-mask\"\n [style.top]=\"coverRectCords.top + 'px'\"\n [style.left]=\"coverRectCords.left + 'px'\"\n [style.height]=\"coverRectCords.height + 'px'\"\n [style.width]=\"coverRectCords.width + 'px'\"\n style=\"z-index: -1\"\n></div>\n\n<div class=\"void\"\n (pointerenter)=\"pointerIsOnVoid = true; hasBootstrapped && !isLockedOpen && closeOnVoid()\"\n (pointerleave)=\"pointerIsOnVoid = false\"\n (pointerdown)=\"hasBootstrapped && closeOnVoid(true)\"\n (wheel)=\"onWheel($event)\"\n></div>\n\n<table *ngIf=\"!template\">\n <tbody>\n <ng-container *ngFor=\"let item of items\">\n <ng-container>\n\n <!-- A row with a click action -->\n <tr #row\n *ngIf=\"item != 'separator' && item.separator != true && item['_visible']\"\n [class.disabled]=\"item['_disabled']\"\n (click)=\"!item['_disabled'] && onMenuItemClick(item, row)\"\n [class.hover]=\"item['children'] && row['hover']\"\n (pointerenter)=\"row['hover'] = true;\"\n (pointerleave)=\"row['hover'] = false\"\n >\n <!-- (item['children']?.length > 0 || item['childTemplate']) && onHover(item, row); closeOnLeave=true -->\n <td class=\"icon\" *ngIf=\"showIconColumn\">\n <img *ngIf=\"matIconRx.test(item.icon); else matIcon\" [src]=\"item.icon\" />\n <ng-template #matIcon>\n <mat-icon [fontIcon]=\"item.icon\" [style.color]=\"item.iconColor\"></mat-icon>\n </ng-template>\n </td>\n\n <!-- 'Normal' action based item -->\n <ng-container>\n <td class=\"label\"\n [style.padding-left]=\"showIconColumn ? 0 : '16px'\"\n >\n <a\n [attr.target]=\"item.linkTarget\"\n [attr.href]=\"(item['_link'] || item.link) ? sanitizer.bypassSecurityTrustUrl(item['_link'] || item.link) : undefined\"\n >\n <ng-container\n *ngIf=\"$any(item.labelTemplate)?.prototype; else labelTemplate\"\n [ngTemplateOutlet]=\"$any(item).labelTemplate\"\n [ngTemplateOutletContext]=\"{ '$implicit': data, 'dialog': dialogRef }\"\n />\n\n <ng-template #labelTemplate>\n <ng-container *ngIf=\"!$any(item)?.labelTemplate\">\n <div [innerHTML]=\"item['_formattedLabel']\"></div>\n </ng-container>\n <ng-container *ngIf=\"$any(item)?.labelTemplate\">\n {{$any(item)?.labelTemplate(data || {})}}\n </ng-container>\n </ng-template>\n </a>\n </td>\n </ng-container>\n\n <td class=\"shortcut\" *ngIf=\"showShortcutColumn\">\n {{item.shortcutLabel}}\n </td>\n <td style=\"min-width: 16px\">\n <mat-icon *ngIf=\"\n (item.children && item.children.length > 0) ||\n item.childTemplate ||\n (item.childrenResolver && !item['_isResolving'])\n \"\n sytle=\"transform: translateY(2px)\"\n >\n chevron_right\n </mat-icon>\n\n <mat-progress-spinner *ngIf=\"item['_isResolving']\" mode=\"indeterminate\" [diameter]=\"20\" style=\"margin-right: 4px\"/>\n </td>\n </tr>\n\n <tr *ngIf=\"item != 'separator' && item.separator == true\" class=\"disabled separator\">\n <td class=\"center\" [attr.colspan]=\"2 + (showIconColumn ? 1 : 0) + (showShortcutColumn ? 1 : 0)\">\n <span class=\"hr\">\n {{item['label'] || ''}}\n </span>\n </td>\n </tr>\n <tr *ngIf=\"item == 'separator'\" class=\"disabled separator\">\n <td [attr.colspan]=\"2 + (showIconColumn ? 1 : 0) + (showShortcutColumn ? 1 : 0)\">\n <hr/>\n </td>\n </tr>\n </ng-container>\n </ng-container>\n </tbody>\n</table>\n\n<ng-container *ngIf=\"template\">\n <ng-container *ngIf=\"templateType == 'template'; else portalOutlet\">\n <ng-container\n [ngTemplateOutlet]=\"template\"\n [ngTemplateOutletContext]=\"{ '$implicit': data, dialog: dialogRef }\"\n />\n </ng-container>\n <ng-template #portalOutlet [cdkPortalOutlet]=\"componentPortal\" ></ng-template>\n</ng-container>\n", styles: ["::ng-deep .cdk-overlay-container .ngx-menu{--mdc-dialog-container-color: var(--ngx-menu-background-color, #2f2f2f)}::ng-deep .cdk-overlay-container .ngx-menu .mdc-dialog__container{transform-origin:top left}::ng-deep .cdk-overlay-container .ngx-menu .mdc-dialog--open .mdc-dialog__container{transform:none}::ng-deep .cdk-overlay-pane.ngx-menu .mat-mdc-dialog-surface{overflow:visible}:host{-webkit-user-select:none;user-select:none;z-index:1;position:relative;display:block}table{border-spacing:0;border-radius:5px;padding:4px 0}tr{color:var(--ngx-menu-text-color, #ccc);font-size:14px;cursor:pointer;transition:background-color 75ms ease,color 75ms ease}tr:not(.disabled):hover{background-color:var(--ngx-menu-hover-background-color, #94ebeb);color:var(--ngx-menu-hover-text-color, #000)}tr:not(.disabled):hover a{color:var(--ngx-menu-hover-text-color, #000)}tr:not(.separator){height:36px}tr.disabled .label{color:var(--ngx-menu-disabled-text-color, #919191)}tr .center{text-align:center}tr a{outline:0;display:flex;align-items:center;gap:10px;justify-content:space-between;height:100%;width:100%}tr .label{min-width:100px}.hr{height:1px;text-align:center;position:relative}.hr:before,.hr:after{content:\"\";background:var(--ngx-menu-separator-color, #2a2a2a);display:block;position:absolute;top:0;bottom:0;height:1px;margin:auto;width:300px}.hr:before{right:calc(100% + 4px)}.hr:after{left:calc(100% + 4px)}hr{background:var(--ngx-menu-separator-color, #2a2a2a);border:0;height:1px;margin:0}.icon{width:24px;height:24px;padding-left:10px}.icon mat-icon{transform:translateY(2px)}.shortcut{color:var(--ngx-menu-shortcut-text-color, #848484);text-align:end;padding-right:10px;padding-left:12px}.label{height:var(--ngx-menu-item-height, 30px)}td{vertical-align:middle}.void,.owner-mask{position:absolute}.void{top:-100vh;right:-100vw;bottom:-100vh;left:-100vw;z-index:-2}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i5$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }] });
739
702
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuComponent, decorators: [{
740
703
  type: Component,
741
704
  args: [{ selector: 'ngx-menu', imports: [
742
705
  NgIf,
743
706
  NgForOf,
744
707
  NgTemplateOutlet,
708
+ PortalModule,
745
709
  MatIconModule,
746
710
  MatProgressSpinnerModule,
747
711
  TooltipDirective
748
- ], standalone: true, template: "<!-- Mouse event blocker for pointer leave -->\n<div\n *ngIf=\"coverRectCords\"\n class=\"owner-mask\"\n [style.top]=\"coverRectCords.top + 'px'\"\n [style.left]=\"coverRectCords.left + 'px'\"\n [style.height]=\"coverRectCords.height + 'px'\"\n [style.width]=\"coverRectCords.width + 'px'\"\n style=\"z-index: -1\"\n></div>\n\n<div class=\"void\"\n (pointerenter)=\"pointerIsOnVoid = true; hasBootstrapped && !isLockedOpen && closeOnVoid()\"\n (pointerleave)=\"pointerIsOnVoid = false\"\n (pointerdown)=\"hasBootstrapped && closeOnVoid(true)\"\n (wheel)=\"onWheel($event)\"\n></div>\n\n<table>\n <tbody>\n <ng-container *ngFor=\"let item of items\">\n <ng-container>\n\n <!-- A row with a click action -->\n <tr #row\n *ngIf=\"item != 'separator' && item.separator != true && item['_visible']\"\n [class.disabled]=\"item['_disabled']\"\n (click)=\"!item['_disabled'] && onMenuItemClick(item, row)\"\n [class.hover]=\"item['children'] && row['hover']\"\n (pointerenter)=\"row['hover'] = true;\"\n (pointerleave)=\"row['hover'] = false\"\n >\n <!-- (item['children']?.length > 0 || item['childTemplate']) && onHover(item, row); closeOnLeave=true -->\n <td class=\"icon\" *ngIf=\"showIconColumn\">\n <img *ngIf=\"matIconRx.test(item.icon); else matIcon\" [src]=\"item.icon\" />\n <ng-template #matIcon>\n <mat-icon [fontIcon]=\"item.icon\"></mat-icon>\n </ng-template>\n </td>\n\n <!-- 'Normal' action based item -->\n <ng-container>\n <td class=\"label\"\n [style.padding-left]=\"showIconColumn ? 0 : '16px'\"\n >\n <a\n [attr.target]=\"item.linkTarget\"\n [attr.href]=\"(item['_link'] || item.link) ? sanitizer.bypassSecurityTrustUrl(item['_link'] || item.link) : undefined\"\n >\n <ng-container\n *ngIf=\"$any(item.labelTemplate)?.prototype; else labelTemplate\"\n [ngTemplateOutlet]=\"$any(item).labelTemplate\"\n [ngTemplateOutletContext]=\"{ '$implicit': data, 'dialog': dialogRef }\"\n />\n\n <ng-template #labelTemplate>\n <ng-container *ngIf=\"!$any(item)?.labelTemplate\">\n <div [innerHTML]=\"item['_formattedLabel']\"></div>\n </ng-container>\n <ng-container *ngIf=\"$any(item)?.labelTemplate\">\n {{$any(item)?.labelTemplate(data || {})}}\n </ng-container>\n </ng-template>\n </a>\n </td>\n </ng-container>\n\n <td class=\"shortcut\" *ngIf=\"showShortcutColumn\">\n {{item.shortcutLabel}}\n </td>\n <td style=\"min-width: 16px\">\n <mat-icon *ngIf=\"\n (item.children && item.children.length > 0) ||\n item.childTemplate ||\n (item.childrenResolver && !item['_isResolving'])\n \"\n sytle=\"transform: translateY(2px)\"\n >\n chevron_right\n </mat-icon>\n\n <mat-progress-spinner *ngIf=\"item['_isResolving']\" mode=\"indeterminate\" [diameter]=\"20\" style=\"margin-right: 4px\"/>\n </td>\n </tr>\n\n <tr *ngIf=\"item != 'separator' && item.separator == true\" class=\"disabled separator\">\n <td class=\"center\" [attr.colspan]=\"2 + (showIconColumn ? 1 : 0) + (showShortcutColumn ? 1 : 0)\">\n <span class=\"hr\">\n {{item['label'] || ''}}\n </span>\n </td>\n </tr>\n <tr *ngIf=\"item == 'separator'\" class=\"disabled separator\">\n <td [attr.colspan]=\"2 + (showIconColumn ? 1 : 0) + (showShortcutColumn ? 1 : 0)\">\n <hr/>\n </td>\n </tr>\n </ng-container>\n </ng-container>\n </tbody>\n</table>\n\n<!-- <div *ngIf=\"true\" class=\"backdrop\"></div> -->\n<!-- <div\n *ngIf=\"parentCords && this.selfCords\"\n class=\"backdrop parent\"\n [style.top]=\"(parentCords.y - selfCords.y + 6) + 'px'\"\n [style.left]=\"(parentCords.x - selfCords.x + 12) + 'px'\"\n [style.width]=\"(parentCords.width) + 'px'\"\n [style.height]=\"(parentCords.height) + 'px'\"\n>\n</div> -->\n<!-- <ng-container *ngIf=\"parentCords && selfCords\">\n <div #top\n class=\"backdrop-outer\"\n [style.bottom]=\"(parentCords.y - selfCords.y)*-1 + parentCords.height + 'px'\"\n style=\"background: #f003;\"\n (pointerenter)=\"onLeave()\"\n ></div>\n <div #right\n class=\"backdrop-outer\"\n [style.left]=\"((parentCords.x - selfCords.x) + parentCords.width) + 'px'\"\n style=\"background: #0f03;\"\n (pointerenter)=\"onLeave()\"\n >\n <div>px: {{parentCords.x}}</div>\n <div>py: {{parentCords.y}}</div>\n <div>pw: {{parentCords.width}}</div>\n <div>ph: {{parentCords.height}}</div>\n <div>sx: {{selfCords.x}}</div>\n <div>sy: {{selfCords.y}}</div>\n <div>sw: {{selfCords.width}}</div>\n <div>sh: {{selfCords.height}}</div>\n </div>\n <div #bottom\n class=\"backdrop-outer\"\n [style.top]=\"((parentCords.y + parentCords.height - selfCords.y)) + 'px'\"\n style=\"background: #00f3;\"\n (pointerenter)=\"onLeave()\"\n ></div>\n <div #left\n class=\"backdrop-outer\"\n [style.right]=\"((parentCords.x - selfCords.x)*-1 + parentCords.width + 32) + 'px'\"\n style=\"background: #fff3;\"\n (pointerenter)=\"onLeave()\"\n ></div>\n</ng-container> -->\n", styles: ["::ng-deep .cdk-overlay-container .ngx-menu{--mdc-dialog-container-color: var(--ngx-menu-background-color, #2f2f2f)}::ng-deep .cdk-overlay-container .ngx-menu .mdc-dialog__container{transform-origin:top left}::ng-deep .cdk-overlay-container .ngx-menu .mdc-dialog--open .mdc-dialog__container{transform:none}::ng-deep .cdk-overlay-pane.ngx-menu .mat-mdc-dialog-surface{overflow:visible}:host{-webkit-user-select:none;user-select:none;z-index:1;position:relative;display:block}table{border-spacing:0;border-radius:5px;padding:4px 0}tr{color:var(--ngx-menu-text-color, #ccc);font-size:14px;cursor:pointer;transition:background-color 75ms ease,color 75ms ease}tr:not(.disabled):hover{background-color:var(--ngx-menu-hover-background-color, #94ebeb);color:var(--ngx-menu-hover-text-color, #000)}tr:not(.disabled):hover a{color:var(--ngx-menu-hover-text-color, #000)}tr:not(.separator){height:36px}tr.disabled .label{color:var(--ngx-menu-disabled-text-color, #919191)}tr .center{text-align:center}tr a{outline:0;display:flex;align-items:center;gap:10px;justify-content:space-between;height:100%;width:100%}tr .label{min-width:100px}.hr{height:1px;text-align:center;position:relative}.hr:before,.hr:after{content:\"\";background:var(--ngx-menu-separator-color, #2a2a2a);display:block;position:absolute;top:0;bottom:0;height:1px;margin:auto;width:300px}.hr:before{right:calc(100% + 4px)}.hr:after{left:calc(100% + 4px)}hr{background:var(--ngx-menu-separator-color, #2a2a2a);border:0;height:1px;margin:0}.icon{width:24px;height:24px;padding-left:10px}.icon mat-icon{transform:translateY(2px)}.shortcut{color:var(--ngx-menu-shortcut-text-color, #848484);text-align:end;padding-right:10px;padding-left:12px}.label{height:var(--ngx-menu-item-height, 30px)}td{vertical-align:middle}.void,.owner-mask{position:absolute}.void{top:-100vh;right:-100vw;bottom:-100vh;left:-100vw;z-index:-2}\n"] }]
712
+ ], standalone: true, template: "<!-- Mouse event blocker for pointer leave -->\n<div\n *ngIf=\"coverRectCords\"\n class=\"owner-mask\"\n [style.top]=\"coverRectCords.top + 'px'\"\n [style.left]=\"coverRectCords.left + 'px'\"\n [style.height]=\"coverRectCords.height + 'px'\"\n [style.width]=\"coverRectCords.width + 'px'\"\n style=\"z-index: -1\"\n></div>\n\n<div class=\"void\"\n (pointerenter)=\"pointerIsOnVoid = true; hasBootstrapped && !isLockedOpen && closeOnVoid()\"\n (pointerleave)=\"pointerIsOnVoid = false\"\n (pointerdown)=\"hasBootstrapped && closeOnVoid(true)\"\n (wheel)=\"onWheel($event)\"\n></div>\n\n<table *ngIf=\"!template\">\n <tbody>\n <ng-container *ngFor=\"let item of items\">\n <ng-container>\n\n <!-- A row with a click action -->\n <tr #row\n *ngIf=\"item != 'separator' && item.separator != true && item['_visible']\"\n [class.disabled]=\"item['_disabled']\"\n (click)=\"!item['_disabled'] && onMenuItemClick(item, row)\"\n [class.hover]=\"item['children'] && row['hover']\"\n (pointerenter)=\"row['hover'] = true;\"\n (pointerleave)=\"row['hover'] = false\"\n >\n <!-- (item['children']?.length > 0 || item['childTemplate']) && onHover(item, row); closeOnLeave=true -->\n <td class=\"icon\" *ngIf=\"showIconColumn\">\n <img *ngIf=\"matIconRx.test(item.icon); else matIcon\" [src]=\"item.icon\" />\n <ng-template #matIcon>\n <mat-icon [fontIcon]=\"item.icon\" [style.color]=\"item.iconColor\"></mat-icon>\n </ng-template>\n </td>\n\n <!-- 'Normal' action based item -->\n <ng-container>\n <td class=\"label\"\n [style.padding-left]=\"showIconColumn ? 0 : '16px'\"\n >\n <a\n [attr.target]=\"item.linkTarget\"\n [attr.href]=\"(item['_link'] || item.link) ? sanitizer.bypassSecurityTrustUrl(item['_link'] || item.link) : undefined\"\n >\n <ng-container\n *ngIf=\"$any(item.labelTemplate)?.prototype; else labelTemplate\"\n [ngTemplateOutlet]=\"$any(item).labelTemplate\"\n [ngTemplateOutletContext]=\"{ '$implicit': data, 'dialog': dialogRef }\"\n />\n\n <ng-template #labelTemplate>\n <ng-container *ngIf=\"!$any(item)?.labelTemplate\">\n <div [innerHTML]=\"item['_formattedLabel']\"></div>\n </ng-container>\n <ng-container *ngIf=\"$any(item)?.labelTemplate\">\n {{$any(item)?.labelTemplate(data || {})}}\n </ng-container>\n </ng-template>\n </a>\n </td>\n </ng-container>\n\n <td class=\"shortcut\" *ngIf=\"showShortcutColumn\">\n {{item.shortcutLabel}}\n </td>\n <td style=\"min-width: 16px\">\n <mat-icon *ngIf=\"\n (item.children && item.children.length > 0) ||\n item.childTemplate ||\n (item.childrenResolver && !item['_isResolving'])\n \"\n sytle=\"transform: translateY(2px)\"\n >\n chevron_right\n </mat-icon>\n\n <mat-progress-spinner *ngIf=\"item['_isResolving']\" mode=\"indeterminate\" [diameter]=\"20\" style=\"margin-right: 4px\"/>\n </td>\n </tr>\n\n <tr *ngIf=\"item != 'separator' && item.separator == true\" class=\"disabled separator\">\n <td class=\"center\" [attr.colspan]=\"2 + (showIconColumn ? 1 : 0) + (showShortcutColumn ? 1 : 0)\">\n <span class=\"hr\">\n {{item['label'] || ''}}\n </span>\n </td>\n </tr>\n <tr *ngIf=\"item == 'separator'\" class=\"disabled separator\">\n <td [attr.colspan]=\"2 + (showIconColumn ? 1 : 0) + (showShortcutColumn ? 1 : 0)\">\n <hr/>\n </td>\n </tr>\n </ng-container>\n </ng-container>\n </tbody>\n</table>\n\n<ng-container *ngIf=\"template\">\n <ng-container *ngIf=\"templateType == 'template'; else portalOutlet\">\n <ng-container\n [ngTemplateOutlet]=\"template\"\n [ngTemplateOutletContext]=\"{ '$implicit': data, dialog: dialogRef }\"\n />\n </ng-container>\n <ng-template #portalOutlet [cdkPortalOutlet]=\"componentPortal\" ></ng-template>\n</ng-container>\n", styles: ["::ng-deep .cdk-overlay-container .ngx-menu{--mdc-dialog-container-color: var(--ngx-menu-background-color, #2f2f2f)}::ng-deep .cdk-overlay-container .ngx-menu .mdc-dialog__container{transform-origin:top left}::ng-deep .cdk-overlay-container .ngx-menu .mdc-dialog--open .mdc-dialog__container{transform:none}::ng-deep .cdk-overlay-pane.ngx-menu .mat-mdc-dialog-surface{overflow:visible}:host{-webkit-user-select:none;user-select:none;z-index:1;position:relative;display:block}table{border-spacing:0;border-radius:5px;padding:4px 0}tr{color:var(--ngx-menu-text-color, #ccc);font-size:14px;cursor:pointer;transition:background-color 75ms ease,color 75ms ease}tr:not(.disabled):hover{background-color:var(--ngx-menu-hover-background-color, #94ebeb);color:var(--ngx-menu-hover-text-color, #000)}tr:not(.disabled):hover a{color:var(--ngx-menu-hover-text-color, #000)}tr:not(.separator){height:36px}tr.disabled .label{color:var(--ngx-menu-disabled-text-color, #919191)}tr .center{text-align:center}tr a{outline:0;display:flex;align-items:center;gap:10px;justify-content:space-between;height:100%;width:100%}tr .label{min-width:100px}.hr{height:1px;text-align:center;position:relative}.hr:before,.hr:after{content:\"\";background:var(--ngx-menu-separator-color, #2a2a2a);display:block;position:absolute;top:0;bottom:0;height:1px;margin:auto;width:300px}.hr:before{right:calc(100% + 4px)}.hr:after{left:calc(100% + 4px)}hr{background:var(--ngx-menu-separator-color, #2a2a2a);border:0;height:1px;margin:0}.icon{width:24px;height:24px;padding-left:10px}.icon mat-icon{transform:translateY(2px)}.shortcut{color:var(--ngx-menu-shortcut-text-color, #848484);text-align:end;padding-right:10px;padding-left:12px}.label{height:var(--ngx-menu-item-height, 30px)}td{vertical-align:middle}.void,.owner-mask{position:absolute}.void{top:-100vh;right:-100vw;bottom:-100vh;left:-100vw;z-index:-2}\n"] }]
749
713
  }], ctorParameters: function () {
750
714
  return [{ type: i0.ViewContainerRef }, { type: i1$1.DomSanitizer }, { type: undefined, decorators: [{
751
715
  type: Optional
@@ -1669,7 +1633,7 @@ class LazyLoaderComponent {
1669
1633
  this.showLoader = false;
1670
1634
  }
1671
1635
  }
1672
- LazyLoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LazyLoaderComponent, deps: [{ token: LazyLoaderService }, { token: i0.ViewContainerRef, optional: true }, { token: i2$2.DialogRef, optional: true }, { token: MAT_DIALOG_DATA, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1636
+ LazyLoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LazyLoaderComponent, deps: [{ token: LazyLoaderService }, { token: i0.ViewContainerRef, optional: true }, { token: i2$1.DialogRef, optional: true }, { token: MAT_DIALOG_DATA, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1673
1637
  LazyLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: LazyLoaderComponent, isStandalone: true, selector: "ngx-lazy-loader", inputs: { id: ["component", "id"], group: "group", inputs: "inputs", outputs: "outputs" }, outputs: { componentLoadError: "componentLoadError", componentLoaded: "componentLoaded" }, viewQueries: [{ propertyName: "targetContainer", first: true, predicate: ["content"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<ng-container #content></ng-container>\n\n<div class=\"ngx-lazy-loader-distractor\" [class.destroying]=\"isClearingLoader\">\n <ng-container *ngIf=\"config.loaderDistractorComponent\" [ngComponentOutlet]=\"config.loaderDistractorComponent\"></ng-container>\n <ng-container *ngIf=\"config.loaderDistractorTemplate\" [ngTemplateOutlet]=\"config.loaderDistractorTemplate\" [ngTemplateOutletContext]=\"{ '$implicit': inputs }\"></ng-container>\n</div>\n", styles: [":host{display:contents;contain:content;z-index:1;position:relative}.ngx-lazy-loader-distractor{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background-color:var(--background-color, #212121);opacity:1;transition:opacity .3s ease;z-index:999999}.ngx-lazy-loader-distractor.destroying{opacity:0;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
1674
1638
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LazyLoaderComponent, decorators: [{
1675
1639
  type: Component,
@@ -1677,7 +1641,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
1677
1641
  }], ctorParameters: function () {
1678
1642
  return [{ type: LazyLoaderService }, { type: i0.ViewContainerRef, decorators: [{
1679
1643
  type: Optional
1680
- }] }, { type: i2$2.DialogRef, decorators: [{
1644
+ }] }, { type: i2$1.DialogRef, decorators: [{
1681
1645
  type: Optional
1682
1646
  }] }, { type: undefined, decorators: [{
1683
1647
  type: Optional
@@ -9137,7 +9101,7 @@ class GtkIconButtonComponent {
9137
9101
  }
9138
9102
  }
9139
9103
  GtkIconButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GtkIconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
9140
- GtkIconButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GtkIconButtonComponent, isStandalone: true, selector: "gtk-icon-button", inputs: { fontIcon: "fontIcon", disabled: "disabled" }, outputs: { click: "click" }, ngImport: i0, template: "<button mat-flat-button [disabled]=\"disabled\">\n <mat-icon [fontIcon]=\"fontIcon\"></mat-icon>\n</button>\n", styles: [":host{position:relative}button{padding:0;min-width:36px;background-color:var(--gtk-button-background-color)!important;color:var(--gtk-button-text-color)!important;border:1px solid var(--gtk-button-border-color);border-bottom-color:var(--gtk-button-border-bottom-color);transition:.25s ease;transition-property:border-color,background-color,color}mat-icon{margin:0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$3.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] });
9104
+ GtkIconButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GtkIconButtonComponent, isStandalone: true, selector: "gtk-icon-button", inputs: { fontIcon: "fontIcon", disabled: "disabled" }, outputs: { click: "click" }, ngImport: i0, template: "<button mat-flat-button [disabled]=\"disabled\">\n <mat-icon [fontIcon]=\"fontIcon\"></mat-icon>\n</button>\n", styles: [":host{position:relative}button{padding:0;min-width:36px;background-color:var(--gtk-button-background-color)!important;color:var(--gtk-button-text-color)!important;border:1px solid var(--gtk-button-border-color);border-bottom-color:var(--gtk-button-border-bottom-color);transition:.25s ease;transition-property:border-color,background-color,color}mat-icon{margin:0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] });
9141
9105
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GtkIconButtonComponent, decorators: [{
9142
9106
  type: Component,
9143
9107
  args: [{ selector: 'gtk-icon-button', imports: [
@@ -9289,7 +9253,7 @@ class ToolbarComponent {
9289
9253
  }
9290
9254
  }
9291
9255
  ToolbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ToolbarComponent, deps: [{ token: FilemanagerComponent }, { token: DialogService }, { token: Fetch }], target: i0.ɵɵFactoryTarget.Component });
9292
- ToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ToolbarComponent, isStandalone: true, selector: "app-toolbar", inputs: { config: "config", currentTab: "currentTab", showHiddenFiles: "showHiddenFiles", showSidebar: "showSidebar", drawerMode: "drawerMode", showBareMinimum: "showBareMinimum" }, outputs: { onBreadcrumbClick: "onBreadcrumbClick", showHiddenFilesChange: "showHiddenFilesChange", showSidebarChange: "showSidebarChange" }, viewQueries: [{ propertyName: "zoomTemplate", first: true, predicate: ["zoomTemplate"], descendants: true }, { propertyName: "actionTemplate", first: true, predicate: ["actionTemplate"], descendants: true }], ngImport: i0, template: "<button\n *ngIf=\"fileManager.sidebarOverlay && !drawerMode\"\n mat-icon-button\n (click)=\"toggleDrawer()\"\n>\n <mat-icon>list</mat-icon>\n</button>\n\n<ng-container *ngIf=\"!showBareMinimum\">\n <div class=\"buttongroup\">\n <gtk-icon-button\n fontIcon=\"arrow_back_ios_new\"\n (click)=\"historyBack(currentTab)\"\n [disabled]=\"currentTab.history?.length <= 1\"\n />\n <gtk-icon-button\n fontIcon=\"arrow_forward_ios\"\n (click)=\"historyForward(currentTab)\"\n [disabled]=\"currentTab.historyIndex >= (currentTab.history?.length-1)\"\n />\n </div>\n\n <div style=\"width: 40px\" *ngIf=\"!drawerMode\"></div>\n</ng-container>\n\n\n<app-breadcrumb\n *ngIf=\"currentTab\"\n style=\"flex: 1\"\n [crumbs]=\"currentTab.breadcrumb\"\n (crumbClick)=\"onBreadcrumbClick.next($event)\"\n [config]=\"config\"\n/>\n\n<ng-container *ngIf=\"!drawerMode\">\n <!-- <div style=\"flex: 1\"></div> -->\n\n <gtk-icon-button\n fontIcon=\"more_vert\"\n [ngx-menu]=\"fileOptions\"\n [ngx-menu-config]=\"{position: 'bottom'}\"\n />\n\n <div style=\"width: 8px\"></div>\n\n <!-- <gtk-icon-button\n fontIcon=\"search\"\n /> -->\n\n <div style=\"width: 100px\" *ngIf=\"fileManager.width > 800\"></div>\n\n <gtk-icon-button\n [fontIcon]=\"currentTab.viewMode == 'list' ? 'view_list' : 'grid_view'\"\n (click)=\"currentTab.viewMode = currentTab.viewMode == 'list' ? 'grid' : 'list'; fileManager.onResize()\"\n />\n\n <gtk-icon-button\n fontIcon=\"sort\"\n [ngx-menu]=\"sortOptions\"\n [ngx-menu-config]=\"{position: 'bottom'}\"\n />\n</ng-container>\n\n", styles: [":host{display:flex}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$3.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: GtkIconButtonComponent, selector: "gtk-icon-button", inputs: ["fontIcon", "disabled"], outputs: ["click"] }, { kind: "component", type: GtkBreadcrumbComponent, selector: "app-breadcrumb", inputs: ["crumbs", "config"], outputs: ["crumbClick"] }, { kind: "directive", type: MenuDirective, selector: "[ngx-contextmenu],[ngx-menu],[ngxContextmenu],[ngxMenu]", inputs: ["ngx-menu-context", "ngx-contextmenu", "ngx-menu", "ngx-menu-config"] }] });
9256
+ ToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ToolbarComponent, isStandalone: true, selector: "app-toolbar", inputs: { config: "config", currentTab: "currentTab", showHiddenFiles: "showHiddenFiles", showSidebar: "showSidebar", drawerMode: "drawerMode", showBareMinimum: "showBareMinimum" }, outputs: { onBreadcrumbClick: "onBreadcrumbClick", showHiddenFilesChange: "showHiddenFilesChange", showSidebarChange: "showSidebarChange" }, viewQueries: [{ propertyName: "zoomTemplate", first: true, predicate: ["zoomTemplate"], descendants: true }, { propertyName: "actionTemplate", first: true, predicate: ["actionTemplate"], descendants: true }], ngImport: i0, template: "<button\n *ngIf=\"fileManager.sidebarOverlay && !drawerMode\"\n mat-icon-button\n (click)=\"toggleDrawer()\"\n>\n <mat-icon>list</mat-icon>\n</button>\n\n<ng-container *ngIf=\"!showBareMinimum\">\n <div class=\"buttongroup\">\n <gtk-icon-button\n fontIcon=\"arrow_back_ios_new\"\n (click)=\"historyBack(currentTab)\"\n [disabled]=\"currentTab.history?.length <= 1\"\n />\n <gtk-icon-button\n fontIcon=\"arrow_forward_ios\"\n (click)=\"historyForward(currentTab)\"\n [disabled]=\"currentTab.historyIndex >= (currentTab.history?.length-1)\"\n />\n </div>\n\n <div style=\"width: 40px\" *ngIf=\"!drawerMode\"></div>\n</ng-container>\n\n\n<app-breadcrumb\n *ngIf=\"currentTab\"\n style=\"flex: 1\"\n [crumbs]=\"currentTab.breadcrumb\"\n (crumbClick)=\"onBreadcrumbClick.next($event)\"\n [config]=\"config\"\n/>\n\n<ng-container *ngIf=\"!drawerMode\">\n <!-- <div style=\"flex: 1\"></div> -->\n\n <gtk-icon-button\n fontIcon=\"more_vert\"\n [ngx-menu]=\"fileOptions\"\n [ngx-menu-config]=\"{position: 'bottom'}\"\n />\n\n <div style=\"width: 8px\"></div>\n\n <!-- <gtk-icon-button\n fontIcon=\"search\"\n /> -->\n\n <div style=\"width: 100px\" *ngIf=\"fileManager.width > 800\"></div>\n\n <gtk-icon-button\n [fontIcon]=\"currentTab.viewMode == 'list' ? 'view_list' : 'grid_view'\"\n (click)=\"currentTab.viewMode = currentTab.viewMode == 'list' ? 'grid' : 'list'; fileManager.onResize()\"\n />\n\n <gtk-icon-button\n fontIcon=\"sort\"\n [ngx-menu]=\"sortOptions\"\n [ngx-menu-config]=\"{position: 'bottom'}\"\n />\n</ng-container>\n\n", styles: [":host{display:flex}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: GtkIconButtonComponent, selector: "gtk-icon-button", inputs: ["fontIcon", "disabled"], outputs: ["click"] }, { kind: "component", type: GtkBreadcrumbComponent, selector: "app-breadcrumb", inputs: ["crumbs", "config"], outputs: ["crumbClick"] }, { kind: "directive", type: MenuDirective, selector: "[ngx-contextmenu],[ngx-menu],[ngxContextmenu],[ngxMenu]", inputs: ["ngx-menu-context", "ngx-contextmenu", "ngx-menu", "ngx-menu-config"] }] });
9293
9257
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ToolbarComponent, decorators: [{
9294
9258
  type: Component,
9295
9259
  args: [{ selector: 'app-toolbar', imports: [
@@ -9346,7 +9310,7 @@ class TreeViewComponent {
9346
9310
  }
9347
9311
  }
9348
9312
  TreeViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TreeViewComponent, deps: [{ token: FilemanagerComponent }], target: i0.ɵɵFactoryTarget.Component });
9349
- TreeViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TreeViewComponent, isStandalone: true, selector: "app-tree-view", inputs: { rowTemplateIn: ["rowTemplate", "rowTemplateIn"], data: "data" }, outputs: { click: "click", loadChildren: "loadChildren" }, queries: [{ propertyName: "rowTemplate", first: true, predicate: ["rowTemplate"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<mat-accordion displayMode=\"flat\" [multi]=\"true\">\n <mat-expansion-panel\n #panel\n *ngFor=\"let item of data\"\n expanded=\"false\"\n togglePosition=\"before\"\n [class.isleaf]=\"item['_children']?.length == 0\"\n (afterExpand)=\"tryLoadChildren(item, panel)\"\n >\n <mat-expansion-panel-header>\n <div (click)=\"$event.stopPropagation(); click.next(item);\" style=\"display: flex; align-items: center;\">\n <ng-container *ngIf=\"!panel.expanded\">\n <img style=\"height: 20px; margin-right: 8px\" [src]=\"iconResolver.resolveIcon(item)?.path\"/>\n </ng-container>\n <ng-container *ngIf=\"panel.expanded\">\n <img style=\"height: 20px; margin-right: 8px\" [src]=\"iconResolver.resolveIcon(item)?.path.replace('.svg', '-open.svg')\"/>\n </ng-container>\n {{item.name}}\n </div>\n </mat-expansion-panel-header>\n\n <app-tree-view\n *ngIf=\"item['_children']; else loadingTemplate\"\n [data]=\"item['_children']\"\n (click)=\"click.next(item)\"\n (loadChildren)=\"loadChildren.next($event)\"\n />\n <ng-template #loadingTemplate>\n <mat-progress-bar color=\"primary\" mode=\"query\"/>\n </ng-template>\n </mat-expansion-panel>\n</mat-accordion>\n", styles: [":host{display:block;color:var(--text-color)}ul{list-style:none;padding:0;margin:0}ul li>div:hover{background-color:var(--list-row-hover-background-color)}.label{top:4px;position:relative}.active ::ng-deep>.mat-expansion-panel-header>.mat-content{background-color:#494949;border-radius:7px;padding-left:12px}.active ::ng-deep>.mat-expansion-panel-header>.mat-content.label{font-weight:bolder}.isleaf ::ng-deep .mat-expansion-indicator{display:none}:host ::ng-deep .mat-expansion-panel-header,:host ::ng-deep .mat-expansion-panel-header.mat-expanded{height:32px}:host ::ng-deep .mat-expansion-panel-body{padding:0 0 0 24px}:host ::ng-deep .mat-expansion-panel{box-shadow:none!important;background:rgba(0,0,0,0)}:host ::ng-deep .mat-expansion-panel .mat-content{align-items:center}:host ::ng-deep .mat-expansion-panel-header .mat-expansion-indicator:after{transform:rotate(315deg);transition:transform .2s ease}:host ::ng-deep .mat-expansion-panel-header.mat-expanded .mat-expansion-indicator:after{transform:rotate(225deg)}\n"], dependencies: [{ kind: "component", type: TreeViewComponent, selector: "app-tree-view", inputs: ["rowTemplate", "data"], outputs: ["click", "loadChildren"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i2$4.MatAccordion, selector: "mat-accordion", inputs: ["multi", "hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i2$4.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["disabled", "expanded", "hideToggle", "togglePosition"], outputs: ["opened", "closed", "expandedChange", "afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2$4.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["tabIndex", "expandedHeight", "collapsedHeight"] }, { kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i7.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }] });
9313
+ TreeViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TreeViewComponent, isStandalone: true, selector: "app-tree-view", inputs: { rowTemplateIn: ["rowTemplate", "rowTemplateIn"], data: "data" }, outputs: { click: "click", loadChildren: "loadChildren" }, queries: [{ propertyName: "rowTemplate", first: true, predicate: ["rowTemplate"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<mat-accordion displayMode=\"flat\" [multi]=\"true\">\n <mat-expansion-panel\n #panel\n *ngFor=\"let item of data\"\n expanded=\"false\"\n togglePosition=\"before\"\n [class.isleaf]=\"item['_children']?.length == 0\"\n (afterExpand)=\"tryLoadChildren(item, panel)\"\n >\n <mat-expansion-panel-header>\n <div (click)=\"$event.stopPropagation(); click.next(item);\" style=\"display: flex; align-items: center;\">\n <ng-container *ngIf=\"!panel.expanded\">\n <img style=\"height: 20px; margin-right: 8px\" [src]=\"iconResolver.resolveIcon(item)?.path\"/>\n </ng-container>\n <ng-container *ngIf=\"panel.expanded\">\n <img style=\"height: 20px; margin-right: 8px\" [src]=\"iconResolver.resolveIcon(item)?.path.replace('.svg', '-open.svg')\"/>\n </ng-container>\n {{item.name}}\n </div>\n </mat-expansion-panel-header>\n\n <app-tree-view\n *ngIf=\"item['_children']; else loadingTemplate\"\n [data]=\"item['_children']\"\n (click)=\"click.next(item)\"\n (loadChildren)=\"loadChildren.next($event)\"\n />\n <ng-template #loadingTemplate>\n <mat-progress-bar color=\"primary\" mode=\"query\"/>\n </ng-template>\n </mat-expansion-panel>\n</mat-accordion>\n", styles: [":host{display:block;color:var(--text-color)}ul{list-style:none;padding:0;margin:0}ul li>div:hover{background-color:var(--list-row-hover-background-color)}.label{top:4px;position:relative}.active ::ng-deep>.mat-expansion-panel-header>.mat-content{background-color:#494949;border-radius:7px;padding-left:12px}.active ::ng-deep>.mat-expansion-panel-header>.mat-content.label{font-weight:bolder}.isleaf ::ng-deep .mat-expansion-indicator{display:none}:host ::ng-deep .mat-expansion-panel-header,:host ::ng-deep .mat-expansion-panel-header.mat-expanded{height:32px}:host ::ng-deep .mat-expansion-panel-body{padding:0 0 0 24px}:host ::ng-deep .mat-expansion-panel{box-shadow:none!important;background:rgba(0,0,0,0)}:host ::ng-deep .mat-expansion-panel .mat-content{align-items:center}:host ::ng-deep .mat-expansion-panel-header .mat-expansion-indicator:after{transform:rotate(315deg);transition:transform .2s ease}:host ::ng-deep .mat-expansion-panel-header.mat-expanded .mat-expansion-indicator:after{transform:rotate(225deg)}\n"], dependencies: [{ kind: "component", type: TreeViewComponent, selector: "app-tree-view", inputs: ["rowTemplate", "data"], outputs: ["click", "loadChildren"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i2$3.MatAccordion, selector: "mat-accordion", inputs: ["multi", "hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i2$3.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["disabled", "expanded", "hideToggle", "togglePosition"], outputs: ["opened", "closed", "expandedChange", "afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2$3.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["tabIndex", "expandedHeight", "collapsedHeight"] }, { kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i7.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }] });
9350
9314
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TreeViewComponent, decorators: [{
9351
9315
  type: Component,
9352
9316
  args: [{ selector: 'app-tree-view', imports: [
@@ -9587,7 +9551,7 @@ class FilemanagerComponent {
9587
9551
  }
9588
9552
  }
9589
9553
  FilemanagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FilemanagerComponent, deps: [{ token: NGX_WEB_COMPONENTS_CONFIG, optional: true }, { token: LazyLoaderService }, { token: i0.ViewContainerRef }, { token: Fetch }], target: i0.ɵɵFactoryTarget.Component });
9590
- FilemanagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FilemanagerComponent, isStandalone: true, selector: "app-filemanager", inputs: { config: "config", gridSize: "gridSize", mode: "mode", contextTags: "contextTags", value: "value" }, outputs: { valueChange: "valueChange", focusedFilesChange: "focusedFilesChange", fileUpload: "fileUpload", fileDownload: "fileDownload", fileRename: "fileRename", fileDelete: "fileDelete", fileCopy: "fileCopy", filePaste: "filePaste", fileSelect: "fileSelect", fileDblClick: "fileDblClick", folderSelect: "folderSelect", folderDblClick: "folderDblClick", filesSelect: "filesSelect" }, viewQueries: [{ propertyName: "tabGroup", first: true, predicate: ["tabGroup"], descendants: true }, { propertyName: "treeView", first: true, predicate: TreeViewComponent, descendants: true }, { propertyName: "toolbar", first: true, predicate: ToolbarComponent, descendants: true }, { propertyName: "drawer", first: true, predicate: MatDrawerContainer, descendants: true }, { propertyName: "fileGrids", predicate: FileGridComponent, descendants: true }], ngImport: i0, template: "<app-toolbar\n [currentTab]=\"currentTab\"\n [(showHiddenFiles)]=\"showHiddenFiles\"\n [(showSidebar)]=\"showSidebar\"\n [config]=\"config\"\n [showBareMinimum]=\"width < 500 && config.showBreadcrumb != false\"\n (onBreadcrumbClick)=\"onBreadcrumbClick($event)\"\n/>\n\n<mat-drawer-container>\n <mat-drawer #drawer mode=\"over\">\n <app-toolbar\n *ngIf=\"width < 500 && config.showBreadcrumb != false\"\n [currentTab]=\"currentTab\"\n [(showHiddenFiles)]=\"showHiddenFiles\"\n [(showSidebar)]=\"showSidebar\"\n [config]=\"config\"\n [drawerMode]=\"true\"\n (onBreadcrumbClick)=\"onBreadcrumbClick($event)\"\n />\n <app-tree-view\n [data]=\"currentTab.sidebarItems\"\n (loadChildren)=\"onTreeViewLoadChildren($event)\"\n (click)=\"onTreeViewSelect($event)\"\n />\n </mat-drawer>\n <mat-drawer-content>\n <as-split direction=\"horizontal\" [gutterSize]=\"sidebarOverlay ? 0 : 2\" [unit]=\"'pixel'\" (dragEnd)=\"onResizeEnd()\">\n <as-split-area\n style=\"background-color: var(--filemanager-sidebar-background-color, #2c2c2c)\"\n [size]=\"215\"\n [minSize]=\"215\"\n [maxSize]=\"width/4\"\n [visible]=\"!sidebarOverlay && config.showTreeview != false\"\n >\n <div class=\"sidebar\"\n *ngIf=\"!sidebarOverlay && config.showTreeview != false\"\n (click)=\"currentTab.selection = []\"\n >\n <app-tree-view\n [data]=\"currentTab.sidebarItems\"\n (loadChildren)=\"onTreeViewLoadChildren($event)\"\n (click)=\"onTreeViewSelect($event)\"\n />\n </div>\n </as-split-area>\n <as-split-area style=\"background-color: var(--filemanager-background-color, #272727);\">\n <div class=\"content\"\n [style.--tab-height]=\"tabs.length > 1 ? '36px' : '0'\"\n >\n <mat-tab-group #tabGroup (selectedTabChange)=\"currentTab = tabs[$event.index]\" [(selectedIndex)]=\"tabIndex\">\n <mat-tab *ngFor=\"let tab of tabs; let i = index\">\n <ng-template mat-tab-label>\n {{tab.label}}\n <mat-icon\n class=\"close\"\n (click)=\"closeTab(tab)\">\n close\n </mat-icon>\n </ng-template>\n\n <ng-template matTabContent>\n <app-file-grid\n [viewMode]=\"tab.viewMode\"\n [tab]=\"tab\"\n [config]=\"config\"\n [gridSize]=\"gridSize\"\n [sortOrder]=\"tab.sortOrder\"\n [(selection)]=\"tab.selection\"\n [(path)]=\"tab.path\"\n (pathChange)=\"onTabPathChange(tab)\"\n [(value)]=\"gridValues[i]\"\n (valueChange)=\"onGridValueChange()\"\n (loadFiles)=\"onTabLoadFiles(tab, $event)\"\n\n (fileSelect)=\"fileSelect.next($event)\"\n (fileDblClick)=\"fileDblClick.next($event)\"\n (folderSelect)=\"folderSelect.next($event)\"\n (folderDblClick)=\"folderDblClick.next($event)\"\n />\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </div>\n </as-split-area>\n </as-split>\n </mat-drawer-content>\n</mat-drawer-container>\n\n", styles: [":host{display:flex;flex-direction:column;height:100%;width:100%}:host .content{display:flex;height:100%;overflow:hidden}:host ::ng-deep .as-split-gutter{background-color:var(--gutter-color, #121212)!important}:host ::ng-deep .mat-mdc-tab-header{height:var(--tab-height, 0);transition:height .25s ease}:host ::ng-deep .mat-mdc-tab-header .mdc-tab{height:var(--tab-height, 0);background-color:var(--filemanager-tab-background-color, #303030)}:host ::ng-deep .mat-mdc-tab .mdc-tab__content{position:static}:host ::ng-deep .mat-mdc-tab:not(.mat-mdc-tab-disabled).mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .mat-mdc-tab-link:not(.mat-mdc-tab-disabled).mdc-tab--active .mdc-tab__text-label{color:var(--text-subdued-color)}.sidebar{border-right:1px solid transparent;transition:background-color .2s cubic-bezier(0,0,.2,1),border-color .2s ease}.sidebar ul{list-style-type:none;text-align:left;margin:0;padding:0;display:flex;flex-direction:column}.sidebar ul li{display:flex;align-items:center;transition:all .2s ease;font-size:14px;padding:6px 6px 6px 24px}.sidebar ul li mat-icon{margin-right:8px}.sidebar ul li:hover{background-color:#343434}.sidebar ul .tooltip{background-color:#101010cc;border:1px solid #414141;opacity:0;pointer-events:none;transition:all .2s ease}.active .sidebar{background-color:#2c2c2c;border-right-color:#1c1c1c}.active .sidebar li:hover{background-color:#343434}.close{position:absolute;right:12px;color:#666;transition:color .25s ease}.close:hover{color:#ccc}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: AngularSplitModule }, { kind: "component", type: i3.SplitComponent, selector: "as-split", inputs: ["direction", "unit", "gutterSize", "gutterStep", "restrictMove", "useTransition", "disabled", "dir", "gutterDblClickDuration", "gutterClickDeltaPx", "gutterAriaLabel"], outputs: ["transitionEnd", "dragStart", "dragEnd", "gutterClick", "gutterDblClick"], exportAs: ["asSplit"] }, { kind: "directive", type: i3.SplitAreaDirective, selector: "as-split-area, [as-split-area]", inputs: ["order", "size", "minSize", "maxSize", "lockSize", "visible"], exportAs: ["asSplitArea"] }, { kind: "component", type: FileGridComponent, selector: "app-file-grid", inputs: ["path", "config", "showHiddenFiles", "viewMode", "gridSize", "tab", "selection", "value", "sortOrder"], outputs: ["pathChange", "fileSelect", "fileDblClick", "folderSelect", "folderDblClick", "newTab", "loadFiles", "selectionChange", "valueChange"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "directive", type: i4.MatTabContent, selector: "[matTabContent]" }, { kind: "directive", type: i4.MatTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i4.MatTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }, { kind: "component", type: i4.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple", "fitInkBarToContent", "mat-stretch-tabs"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i6$1.MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "component", type: i6$1.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i6$1.MatDrawerContent, selector: "mat-drawer-content" }, { kind: "component", type: ToolbarComponent, selector: "app-toolbar", inputs: ["config", "currentTab", "showHiddenFiles", "showSidebar", "drawerMode", "showBareMinimum"], outputs: ["onBreadcrumbClick", "showHiddenFilesChange", "showSidebarChange"] }, { kind: "component", type: TreeViewComponent, selector: "app-tree-view", inputs: ["rowTemplate", "data"], outputs: ["click", "loadChildren"] }] });
9554
+ FilemanagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FilemanagerComponent, isStandalone: true, selector: "app-filemanager", inputs: { config: "config", gridSize: "gridSize", mode: "mode", contextTags: "contextTags", value: "value" }, outputs: { valueChange: "valueChange", focusedFilesChange: "focusedFilesChange", fileUpload: "fileUpload", fileDownload: "fileDownload", fileRename: "fileRename", fileDelete: "fileDelete", fileCopy: "fileCopy", filePaste: "filePaste", fileSelect: "fileSelect", fileDblClick: "fileDblClick", folderSelect: "folderSelect", folderDblClick: "folderDblClick", filesSelect: "filesSelect" }, viewQueries: [{ propertyName: "tabGroup", first: true, predicate: ["tabGroup"], descendants: true }, { propertyName: "treeView", first: true, predicate: TreeViewComponent, descendants: true }, { propertyName: "toolbar", first: true, predicate: ToolbarComponent, descendants: true }, { propertyName: "drawer", first: true, predicate: MatDrawerContainer, descendants: true }, { propertyName: "fileGrids", predicate: FileGridComponent, descendants: true }], ngImport: i0, template: "<app-toolbar\n [currentTab]=\"currentTab\"\n [(showHiddenFiles)]=\"showHiddenFiles\"\n [(showSidebar)]=\"showSidebar\"\n [config]=\"config\"\n [showBareMinimum]=\"width < 500 && config.showBreadcrumb != false\"\n (onBreadcrumbClick)=\"onBreadcrumbClick($event)\"\n/>\n\n<mat-drawer-container>\n <mat-drawer #drawer mode=\"over\">\n <app-toolbar\n *ngIf=\"width < 500 && config.showBreadcrumb != false\"\n [currentTab]=\"currentTab\"\n [(showHiddenFiles)]=\"showHiddenFiles\"\n [(showSidebar)]=\"showSidebar\"\n [config]=\"config\"\n [drawerMode]=\"true\"\n (onBreadcrumbClick)=\"onBreadcrumbClick($event)\"\n />\n <app-tree-view\n [data]=\"currentTab.sidebarItems\"\n (loadChildren)=\"onTreeViewLoadChildren($event)\"\n (click)=\"onTreeViewSelect($event)\"\n />\n </mat-drawer>\n <mat-drawer-content>\n <as-split direction=\"horizontal\" [gutterSize]=\"sidebarOverlay ? 0 : 2\" [unit]=\"'pixel'\" (dragEnd)=\"onResizeEnd()\">\n <as-split-area\n style=\"background-color: var(--filemanager-sidebar-background-color, #2c2c2c)\"\n [size]=\"215\"\n [minSize]=\"215\"\n [maxSize]=\"width/4\"\n [visible]=\"!sidebarOverlay && config.showTreeview != false\"\n >\n <div class=\"sidebar\"\n *ngIf=\"!sidebarOverlay && config.showTreeview != false\"\n (click)=\"currentTab.selection = []\"\n >\n <app-tree-view\n [data]=\"currentTab.sidebarItems\"\n (loadChildren)=\"onTreeViewLoadChildren($event)\"\n (click)=\"onTreeViewSelect($event)\"\n />\n </div>\n </as-split-area>\n <as-split-area style=\"background-color: var(--filemanager-background-color, #272727);\">\n <div class=\"content\"\n [style.--tab-height]=\"tabs.length > 1 ? '36px' : '0'\"\n >\n <mat-tab-group #tabGroup (selectedTabChange)=\"currentTab = tabs[$event.index]\" [(selectedIndex)]=\"tabIndex\">\n <mat-tab *ngFor=\"let tab of tabs; let i = index\">\n <ng-template mat-tab-label>\n {{tab.label}}\n <mat-icon\n class=\"close\"\n (click)=\"closeTab(tab)\">\n close\n </mat-icon>\n </ng-template>\n\n <ng-template matTabContent>\n <app-file-grid\n [viewMode]=\"tab.viewMode\"\n [tab]=\"tab\"\n [config]=\"config\"\n [gridSize]=\"gridSize\"\n [sortOrder]=\"tab.sortOrder\"\n [(selection)]=\"tab.selection\"\n [(path)]=\"tab.path\"\n (pathChange)=\"onTabPathChange(tab)\"\n [(value)]=\"gridValues[i]\"\n (valueChange)=\"onGridValueChange()\"\n (loadFiles)=\"onTabLoadFiles(tab, $event)\"\n\n (fileSelect)=\"fileSelect.next($event)\"\n (fileDblClick)=\"fileDblClick.next($event)\"\n (folderSelect)=\"folderSelect.next($event)\"\n (folderDblClick)=\"folderDblClick.next($event)\"\n />\n </ng-template>\n </mat-tab>\n </mat-tab-group>\n </div>\n </as-split-area>\n </as-split>\n </mat-drawer-content>\n</mat-drawer-container>\n\n", styles: [":host{display:flex;flex-direction:column;height:100%;width:100%}:host .content{display:flex;height:100%;overflow:hidden}:host ::ng-deep .as-split-gutter{background-color:var(--gutter-color, #121212)!important}:host ::ng-deep .mat-mdc-tab-header{height:var(--tab-height, 0);transition:height .25s ease}:host ::ng-deep .mat-mdc-tab-header .mdc-tab{height:var(--tab-height, 0);background-color:var(--filemanager-tab-background-color, #303030)}:host ::ng-deep .mat-mdc-tab .mdc-tab__content{position:static}:host ::ng-deep .mat-mdc-tab:not(.mat-mdc-tab-disabled).mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .mat-mdc-tab-link:not(.mat-mdc-tab-disabled).mdc-tab--active .mdc-tab__text-label{color:var(--text-subdued-color)}.sidebar{border-right:1px solid transparent;transition:background-color .2s cubic-bezier(0,0,.2,1),border-color .2s ease}.sidebar ul{list-style-type:none;text-align:left;margin:0;padding:0;display:flex;flex-direction:column}.sidebar ul li{display:flex;align-items:center;transition:all .2s ease;font-size:14px;padding:6px 6px 6px 24px}.sidebar ul li mat-icon{margin-right:8px}.sidebar ul li:hover{background-color:#343434}.sidebar ul .tooltip{background-color:#101010cc;border:1px solid #414141;opacity:0;pointer-events:none;transition:all .2s ease}.active .sidebar{background-color:#2c2c2c;border-right-color:#1c1c1c}.active .sidebar li:hover{background-color:#343434}.close{position:absolute;right:12px;color:#666;transition:color .25s ease}.close:hover{color:#ccc}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: AngularSplitModule }, { kind: "component", type: i3$1.SplitComponent, selector: "as-split", inputs: ["direction", "unit", "gutterSize", "gutterStep", "restrictMove", "useTransition", "disabled", "dir", "gutterDblClickDuration", "gutterClickDeltaPx", "gutterAriaLabel"], outputs: ["transitionEnd", "dragStart", "dragEnd", "gutterClick", "gutterDblClick"], exportAs: ["asSplit"] }, { kind: "directive", type: i3$1.SplitAreaDirective, selector: "as-split-area, [as-split-area]", inputs: ["order", "size", "minSize", "maxSize", "lockSize", "visible"], exportAs: ["asSplitArea"] }, { kind: "component", type: FileGridComponent, selector: "app-file-grid", inputs: ["path", "config", "showHiddenFiles", "viewMode", "gridSize", "tab", "selection", "value", "sortOrder"], outputs: ["pathChange", "fileSelect", "fileDblClick", "folderSelect", "folderDblClick", "newTab", "loadFiles", "selectionChange", "valueChange"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "directive", type: i4.MatTabContent, selector: "[matTabContent]" }, { kind: "directive", type: i4.MatTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i4.MatTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }, { kind: "component", type: i4.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple", "fitInkBarToContent", "mat-stretch-tabs"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i6$1.MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "component", type: i6$1.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i6$1.MatDrawerContent, selector: "mat-drawer-content" }, { kind: "component", type: ToolbarComponent, selector: "app-toolbar", inputs: ["config", "currentTab", "showHiddenFiles", "showSidebar", "drawerMode", "showBareMinimum"], outputs: ["onBreadcrumbClick", "showHiddenFilesChange", "showSidebarChange"] }, { kind: "component", type: TreeViewComponent, selector: "app-tree-view", inputs: ["rowTemplate", "data"], outputs: ["click", "loadChildren"] }] });
9591
9555
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FilemanagerComponent, decorators: [{
9592
9556
  type: Component,
9593
9557
  args: [{ selector: 'app-filemanager', imports: [