@dotglitch/ngx-common 1.0.41 → 1.0.43
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/vscode/vscode.component.d.ts +1 -5
- package/esm2020/components/menu/menu.component.mjs +13 -5
- package/esm2020/components/vscode/vscode.component.mjs +46 -50
- package/fesm2015/dotglitch-ngx-common.mjs +58 -54
- package/fesm2015/dotglitch-ngx-common.mjs.map +1 -1
- package/fesm2020/dotglitch-ngx-common.mjs +58 -54
- package/fesm2020/dotglitch-ngx-common.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -599,6 +599,8 @@ class MenuComponent {
|
|
|
599
599
|
else {
|
|
600
600
|
item['_children'] = item.children;
|
|
601
601
|
}
|
|
602
|
+
if (item['_children'] || item.childTemplate)
|
|
603
|
+
row['_open'] = true;
|
|
602
604
|
if (!item.childTemplate && !item.children) {
|
|
603
605
|
if (typeof item.action == "function") {
|
|
604
606
|
const res = await item.action(this.data, context);
|
|
@@ -665,6 +667,7 @@ class MenuComponent {
|
|
|
665
667
|
this.close();
|
|
666
668
|
}
|
|
667
669
|
}
|
|
670
|
+
row['_open'] = false;
|
|
668
671
|
this.childDialogs.splice(this.childDialogs.indexOf(dialogRef), 1);
|
|
669
672
|
_s.unsubscribe();
|
|
670
673
|
});
|
|
@@ -694,11 +697,16 @@ class MenuComponent {
|
|
|
694
697
|
}
|
|
695
698
|
}
|
|
696
699
|
startHoverTimer(item, row) {
|
|
697
|
-
|
|
700
|
+
// Invert check to make the logic simpler
|
|
701
|
+
// TL;DR: if (any) of these are true, we will do the hover action
|
|
702
|
+
if (!(Array.isArray(item.children) && item.children.length > 0 ||
|
|
703
|
+
typeof item.children == "function" ||
|
|
704
|
+
item.childTemplate ||
|
|
705
|
+
item.childrenResolver))
|
|
698
706
|
return;
|
|
699
707
|
item[$hover] = setTimeout(() => {
|
|
700
708
|
delete item[$hover];
|
|
701
|
-
row['
|
|
709
|
+
row['_open'] = true;
|
|
702
710
|
this.onMenuItemClick(item, row);
|
|
703
711
|
}, this.hoverDelay);
|
|
704
712
|
}
|
|
@@ -743,7 +751,7 @@ class MenuComponent {
|
|
|
743
751
|
}
|
|
744
752
|
}
|
|
745
753
|
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 });
|
|
746
|
-
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", overlayOverlap: "overlayOverlap", hoverDelay: "hoverDelay", showDebugOverlay: "showDebugOverlay", ownerCords: "ownerCords", selfCords: "selfCords", parentItem: "parentItem", parentContext: "parentContext" }, 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.background]=\"showDebugOverlay ? '#f004' : '#0000'\"\n style=\"z-index: -1\"\n></div>\n\n<div class=\"void\"\n [style.background]=\"showDebugOverlay ? '#00f4' : '#0000'\"\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 <!-- 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]=\"
|
|
754
|
+
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", overlayOverlap: "overlayOverlap", hoverDelay: "hoverDelay", showDebugOverlay: "showDebugOverlay", ownerCords: "ownerCords", selfCords: "selfCords", parentItem: "parentItem", parentContext: "parentContext" }, 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.background]=\"showDebugOverlay ? '#f004' : '#0000'\"\n style=\"z-index: -1\"\n></div>\n\n<div class=\"void\"\n [style.background]=\"showDebugOverlay ? '#00f4' : '#0000'\"\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 <!-- 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]=\"row['hover']\"\n [class.open]=\"row['_open']\"\n (pointerenter)=\"row['hover'] = true; startHoverTimer(item, row)\"\n (pointerleave)=\"row['hover'] = false; stopHoverTimer(item)\"\n >\n\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 <td class=\"label\"\n [style.padding-left]=\"showIconColumn ? 0 : '16px'\"\n >\n <a\n #anchor\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 simpleLabel\"\n [ngTemplateOutlet]=\"$any(item).labelTemplate\"\n [ngTemplateOutletContext]=\"{\n '$implicit': data,\n 'dialog': dialogRef,\n 'context': item['_context'],\n 'item': item,\n 'element': anchor,\n 'menu': this\n }\"\n />\n\n <ng-template #simpleLabel>\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\n <td class=\"shortcut\" *ngIf=\"showShortcutColumn\">\n {{item.shortcutLabel}}\n </td>\n <td style=\"min-width: 16px\">\n <mat-icon *ngIf=\"(\n (item['children']?.length > 0) ||\n (item['_children']?.length > 0) ||\n item.childTemplate ||\n item.children?.['call'] ||\n item.childrenResolver\n ) &&\n !item['_isResolving']\n \"\n style=\"transform: translateY(2px)\"\n >\n chevron_right\n </mat-icon>\n\n <mat-progress-spinner\n *ngIf=\"item['_isResolving']\"\n mode=\"indeterminate\"\n [diameter]=\"20\"\n style=\"margin-right: 4px\"\n />\n </td>\n </tr>\n\n <!-- Separator with label -->\n <tr\n *ngIf=\"item != 'separator' && item.separator == true\"\n class=\"disabled separator\"\n >\n <td\n class=\"center\"\n [attr.colspan]=\"2 + (showIconColumn ? 1 : 0) + (showShortcutColumn ? 1 : 0)\"\n >\n <span class=\"hr\">\n {{item['label'] || ''}}\n </span>\n </td>\n </tr>\n\n <!-- Separator -->\n <tr\n *ngIf=\"item == 'separator'\"\n class=\"disabled separator\"\n >\n <td\n [attr.colspan]=\"2 + (showIconColumn ? 1 : 0) + (showShortcutColumn ? 1 : 0)\"\n >\n <hr/>\n </td>\n </tr>\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]=\"{\n '$implicit': data,\n 'dialog': dialogRef,\n 'context': parentContext,\n 'item': parentItem,\n 'element': this.viewContainer?.element?.nativeElement,\n 'menu': this\n }\"\n />\n </ng-container>\n <ng-template\n #portalOutlet\n [cdkPortalOutlet]=\"componentPortal\"\n />\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,tr:not(.disabled).open{background-color:var(--ngx-menu-hover-background-color, #94ebeb);color:var(--ngx-menu-hover-text-color, #000)}tr:not(.disabled).hover a,tr:not(.disabled).open 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"] }] });
|
|
747
755
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuComponent, decorators: [{
|
|
748
756
|
type: Component,
|
|
749
757
|
args: [{ selector: 'ngx-menu', imports: [
|
|
@@ -754,7 +762,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
754
762
|
MatIconModule,
|
|
755
763
|
MatProgressSpinnerModule,
|
|
756
764
|
TooltipDirective
|
|
757
|
-
], 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.background]=\"showDebugOverlay ? '#f004' : '#0000'\"\n style=\"z-index: -1\"\n></div>\n\n<div class=\"void\"\n [style.background]=\"showDebugOverlay ? '#00f4' : '#0000'\"\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 <!-- 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]=\"
|
|
765
|
+
], 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.background]=\"showDebugOverlay ? '#f004' : '#0000'\"\n style=\"z-index: -1\"\n></div>\n\n<div class=\"void\"\n [style.background]=\"showDebugOverlay ? '#00f4' : '#0000'\"\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 <!-- 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]=\"row['hover']\"\n [class.open]=\"row['_open']\"\n (pointerenter)=\"row['hover'] = true; startHoverTimer(item, row)\"\n (pointerleave)=\"row['hover'] = false; stopHoverTimer(item)\"\n >\n\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 <td class=\"label\"\n [style.padding-left]=\"showIconColumn ? 0 : '16px'\"\n >\n <a\n #anchor\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 simpleLabel\"\n [ngTemplateOutlet]=\"$any(item).labelTemplate\"\n [ngTemplateOutletContext]=\"{\n '$implicit': data,\n 'dialog': dialogRef,\n 'context': item['_context'],\n 'item': item,\n 'element': anchor,\n 'menu': this\n }\"\n />\n\n <ng-template #simpleLabel>\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\n <td class=\"shortcut\" *ngIf=\"showShortcutColumn\">\n {{item.shortcutLabel}}\n </td>\n <td style=\"min-width: 16px\">\n <mat-icon *ngIf=\"(\n (item['children']?.length > 0) ||\n (item['_children']?.length > 0) ||\n item.childTemplate ||\n item.children?.['call'] ||\n item.childrenResolver\n ) &&\n !item['_isResolving']\n \"\n style=\"transform: translateY(2px)\"\n >\n chevron_right\n </mat-icon>\n\n <mat-progress-spinner\n *ngIf=\"item['_isResolving']\"\n mode=\"indeterminate\"\n [diameter]=\"20\"\n style=\"margin-right: 4px\"\n />\n </td>\n </tr>\n\n <!-- Separator with label -->\n <tr\n *ngIf=\"item != 'separator' && item.separator == true\"\n class=\"disabled separator\"\n >\n <td\n class=\"center\"\n [attr.colspan]=\"2 + (showIconColumn ? 1 : 0) + (showShortcutColumn ? 1 : 0)\"\n >\n <span class=\"hr\">\n {{item['label'] || ''}}\n </span>\n </td>\n </tr>\n\n <!-- Separator -->\n <tr\n *ngIf=\"item == 'separator'\"\n class=\"disabled separator\"\n >\n <td\n [attr.colspan]=\"2 + (showIconColumn ? 1 : 0) + (showShortcutColumn ? 1 : 0)\"\n >\n <hr/>\n </td>\n </tr>\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]=\"{\n '$implicit': data,\n 'dialog': dialogRef,\n 'context': parentContext,\n 'item': parentItem,\n 'element': this.viewContainer?.element?.nativeElement,\n 'menu': this\n }\"\n />\n </ng-container>\n <ng-template\n #portalOutlet\n [cdkPortalOutlet]=\"componentPortal\"\n />\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,tr:not(.disabled).open{background-color:var(--ngx-menu-hover-background-color, #94ebeb);color:var(--ngx-menu-hover-text-color, #000)}tr:not(.disabled).hover a,tr:not(.disabled).open 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"] }]
|
|
758
766
|
}], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i1$1.DomSanitizer }, { type: undefined, decorators: [{
|
|
759
767
|
type: Optional
|
|
760
768
|
}, {
|
|
@@ -10364,7 +10372,7 @@ class VscodeComponent {
|
|
|
10364
10372
|
this.resize = () => {
|
|
10365
10373
|
this.editor?.layout();
|
|
10366
10374
|
};
|
|
10367
|
-
this.
|
|
10375
|
+
InstallMonacoUMD(this.installationLocation);
|
|
10368
10376
|
this._sub = this.typeDebounce.subscribe(t => {
|
|
10369
10377
|
this.codeChange.next(this._code = this.editor.getValue());
|
|
10370
10378
|
});
|
|
@@ -10381,21 +10389,7 @@ class VscodeComponent {
|
|
|
10381
10389
|
Monaco?.editor.setTheme(this.theme);
|
|
10382
10390
|
}
|
|
10383
10391
|
async ngAfterViewInit() {
|
|
10384
|
-
await
|
|
10385
|
-
let count = 0;
|
|
10386
|
-
let i = window.setInterval(() => {
|
|
10387
|
-
count++;
|
|
10388
|
-
if (window['monaco'] != undefined) {
|
|
10389
|
-
window.clearInterval(i);
|
|
10390
|
-
Monaco = window['monaco'];
|
|
10391
|
-
res(true);
|
|
10392
|
-
}
|
|
10393
|
-
if (count >= 100) {
|
|
10394
|
-
window.clearInterval(i);
|
|
10395
|
-
res(false);
|
|
10396
|
-
}
|
|
10397
|
-
}, 100);
|
|
10398
|
-
});
|
|
10392
|
+
await InstallMonacoUMD();
|
|
10399
10393
|
this.createEditor();
|
|
10400
10394
|
}
|
|
10401
10395
|
ngOnDestroy() {
|
|
@@ -10419,35 +10413,6 @@ class VscodeComponent {
|
|
|
10419
10413
|
}
|
|
10420
10414
|
configureLanguageSupport() {
|
|
10421
10415
|
}
|
|
10422
|
-
installMonaco() {
|
|
10423
|
-
if (VscodeComponent.isMonacoInstalled)
|
|
10424
|
-
return;
|
|
10425
|
-
if (window['monaco']) {
|
|
10426
|
-
VscodeComponent.isMonacoInstalled = true;
|
|
10427
|
-
return;
|
|
10428
|
-
}
|
|
10429
|
-
// Monaco has a UMD loader that requires this
|
|
10430
|
-
// Merge with any pre-existing global require objects.
|
|
10431
|
-
if (!window['require'])
|
|
10432
|
-
window['require'] = {};
|
|
10433
|
-
if (!window['require']['paths'])
|
|
10434
|
-
window['require']['paths'] = {};
|
|
10435
|
-
if (this.installationLocation.endsWith('/'))
|
|
10436
|
-
this.installationLocation = this.installationLocation.slice(0, -1);
|
|
10437
|
-
window['require']['paths'].vs = this.installationLocation;
|
|
10438
|
-
const monacoFiles = [
|
|
10439
|
-
'loader.js',
|
|
10440
|
-
'editor/editor.main.nls.js',
|
|
10441
|
-
'editor/editor.main.js',
|
|
10442
|
-
];
|
|
10443
|
-
for (let i = 0; i < monacoFiles.length; i++) {
|
|
10444
|
-
const script = document.createElement("script");
|
|
10445
|
-
script.setAttribute("defer", "");
|
|
10446
|
-
script.setAttribute("src", this.installationLocation + '/' + monacoFiles[i]);
|
|
10447
|
-
document.body.append(script);
|
|
10448
|
-
}
|
|
10449
|
-
VscodeComponent.isMonacoInstalled = true;
|
|
10450
|
-
}
|
|
10451
10416
|
download() {
|
|
10452
10417
|
const code = this.editor.getValue();
|
|
10453
10418
|
let blob = new Blob([code], { type: 'text/log' });
|
|
@@ -10463,10 +10428,6 @@ class VscodeComponent {
|
|
|
10463
10428
|
URL.revokeObjectURL(blobURL);
|
|
10464
10429
|
}
|
|
10465
10430
|
}
|
|
10466
|
-
/**
|
|
10467
|
-
* true if the monaco UMD files are injected into the webpage
|
|
10468
|
-
*/
|
|
10469
|
-
VscodeComponent.isMonacoInstalled = false;
|
|
10470
10431
|
VscodeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: VscodeComponent, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
10471
10432
|
VscodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: VscodeComponent, isStandalone: true, selector: "app-vscode", inputs: { code: "code", customLanguage: "customLanguage", language: "language", installationLocation: "installationLocation", tabSize: "tabSize", readOnly: "readOnly", theme: "theme", fontFamily: "fontFamily", fontSize: "fontSize", automaticLayout: "automaticLayout", colorDecorators: "colorDecorators", folding: "folding", minimapEnabled: "minimapEnabled", minimap: "minimap", scrollbar: "scrollbar", smoothScrolling: "smoothScrolling", mouseWheelScrollSensitivity: "mouseWheelScrollSensitivity", scrollBeyondLastLine: "scrollBeyondLastLine", scrollBeyondLastColumn: "scrollBeyondLastColumn", lineNumbers: "lineNumbers", restSettings: "restSettings" }, outputs: { codeChange: "codeChange" }, host: { listeners: { "window:resize": "resize($event)" } }, usesOnChanges: true, ngImport: i0, template: '', isInline: true, styles: [":host{display:block;height:100%;max-height:100vh;max-width:100vw}\n"] });
|
|
10472
10433
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: VscodeComponent, decorators: [{
|
|
@@ -10520,6 +10481,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
10520
10481
|
type: HostListener,
|
|
10521
10482
|
args: ['window:resize', ['$event']]
|
|
10522
10483
|
}] } });
|
|
10484
|
+
const InstallMonacoUMD = async (path) => {
|
|
10485
|
+
if (window['monaco'])
|
|
10486
|
+
return window['monaco'];
|
|
10487
|
+
// Only perform installation if a path is specified.
|
|
10488
|
+
if (path) {
|
|
10489
|
+
// Monaco has a UMD loader that requires this
|
|
10490
|
+
// Merge with any pre-existing global require objects.
|
|
10491
|
+
if (!window['require'])
|
|
10492
|
+
window['require'] = {};
|
|
10493
|
+
if (!window['require']['paths'])
|
|
10494
|
+
window['require']['paths'] = {};
|
|
10495
|
+
if (path.endsWith('/'))
|
|
10496
|
+
path = path.slice(0, -1);
|
|
10497
|
+
window['require']['paths'].vs = path;
|
|
10498
|
+
const monacoFiles = [
|
|
10499
|
+
'loader.js',
|
|
10500
|
+
'editor/editor.main.nls.js',
|
|
10501
|
+
'editor/editor.main.js',
|
|
10502
|
+
];
|
|
10503
|
+
for (let i = 0; i < monacoFiles.length; i++) {
|
|
10504
|
+
const script = document.createElement("script");
|
|
10505
|
+
script.setAttribute("defer", "");
|
|
10506
|
+
script.setAttribute("src", path + '/' + monacoFiles[i]);
|
|
10507
|
+
document.body.append(script);
|
|
10508
|
+
}
|
|
10509
|
+
}
|
|
10510
|
+
// Return a promise that will resolve when monaco finishes loading
|
|
10511
|
+
return await new Promise((res, rej) => {
|
|
10512
|
+
let count = 0;
|
|
10513
|
+
let i = window.setInterval(() => {
|
|
10514
|
+
count++;
|
|
10515
|
+
if (window['monaco'] != undefined) {
|
|
10516
|
+
window.clearInterval(i);
|
|
10517
|
+
Monaco = window['monaco'];
|
|
10518
|
+
res(true);
|
|
10519
|
+
}
|
|
10520
|
+
else if (count >= 100) {
|
|
10521
|
+
window.clearInterval(i);
|
|
10522
|
+
res(false);
|
|
10523
|
+
}
|
|
10524
|
+
}, 100);
|
|
10525
|
+
});
|
|
10526
|
+
};
|
|
10523
10527
|
|
|
10524
10528
|
/**
|
|
10525
10529
|
* Extend this component to automatically generate
|
|
@@ -10600,5 +10604,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
10600
10604
|
* Generated bundle index. Do not edit.
|
|
10601
10605
|
*/
|
|
10602
10606
|
|
|
10603
|
-
export { ComponentResolveStrategy, DependencyService, DialogService, DynamicHTMLComponent, DynamicHTMLOptions, DynamicHTMLRenderer, Fetch, FileService, FilemanagerComponent, HtmlBypass, KeyboardService, LazyLoaderComponent, LazyLoaderModule, LazyLoaderService, MenuDirective, NGX_DYNAMIC_CONFIG, NGX_LAZY_LOADER_CONFIG, NGX_WEB_COMPONENTS_CONFIG, NavigationService, NgxDynamicHTMLModule, OnMount, ReactMagicWrapperComponent, ResourceBypass, ScriptBypass, StyleBypass, TabulatorComponent, ThemeService, TooltipDirective, UrlBypass, VscodeComponent, openMenu, openTooltip };
|
|
10607
|
+
export { ComponentResolveStrategy, DependencyService, DialogService, DynamicHTMLComponent, DynamicHTMLOptions, DynamicHTMLRenderer, Fetch, FileService, FilemanagerComponent, HtmlBypass, InstallMonacoUMD, KeyboardService, LazyLoaderComponent, LazyLoaderModule, LazyLoaderService, MenuDirective, NGX_DYNAMIC_CONFIG, NGX_LAZY_LOADER_CONFIG, NGX_WEB_COMPONENTS_CONFIG, NavigationService, NgxDynamicHTMLModule, OnMount, ReactMagicWrapperComponent, ResourceBypass, ScriptBypass, StyleBypass, TabulatorComponent, ThemeService, TooltipDirective, UrlBypass, VscodeComponent, openMenu, openTooltip };
|
|
10604
10608
|
//# sourceMappingURL=dotglitch-ngx-common.mjs.map
|