@c-standard/angular-devui-extension
Version:
an extensional components lib for devui
57 lines • 6.39 kB
JavaScript
import { Component, EventEmitter, HostListener, Input, Output, } from '@angular/core';
import { fadeInOut } from 'ng-devui/utils';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class ContextMenuComponent {
constructor(ref) {
this.ref = ref;
this.offset = { x: 0, y: 0 };
this.visible = false;
this.visibleChange = new EventEmitter();
this.repaint();
}
clickOut(e) {
if (!this.ref.nativeElement.contains(e.target)) {
this.visibleChange.emit(false);
}
}
ngOnChanges({ offset }) {
if (offset) {
this.repaint();
}
}
repaint() {
this.ref.nativeElement.style.top = this.offset?.y + 'px';
this.ref.nativeElement.style.left = this.offset?.x + 'px';
}
}
ContextMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: ContextMenuComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
ContextMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: ContextMenuComponent, selector: "d-context-menu", inputs: { offset: "offset", visible: "visible" }, outputs: { visibleChange: "visibleChange" }, host: { listeners: { "document:click": "clickOut($event)" } }, usesOnChanges: true, ngImport: i0, template: `
<div
*ngIf="visible"
[@fadeInOut]="visible ? 'bottom' : 'void'"
>
<ng-content></ng-content>
</div>
`, isInline: true, styles: [":host{position:absolute;z-index:var(--devui-z-index-dropdown, 1052);margin:10px}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [fadeInOut] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: ContextMenuComponent, decorators: [{
type: Component,
args: [{ selector: 'd-context-menu', template: `
<div
*ngIf="visible"
[@fadeInOut]="visible ? 'bottom' : 'void'"
>
<ng-content></ng-content>
</div>
`, animations: [fadeInOut], styles: [":host{position:absolute;z-index:var(--devui-z-index-dropdown, 1052);margin:10px}\n"] }]
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { offset: [{
type: Input
}], visible: [{
type: Input
}], visibleChange: [{
type: Output
}], clickOut: [{
type: HostListener,
args: ['document:click', ['$event']]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udGV4dC1tZW51LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudHMvY29udGV4dC1tZW51L2NvbnRleHQtbWVudS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBYyxZQUFZLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBYSxNQUFNLEdBQWtCLE1BQU0sZUFBZSxDQUFDO0FBQzVILE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQzs7O0FBZTNDLE1BQU0sT0FBTyxvQkFBb0I7SUFZN0IsWUFBb0IsR0FBZTtRQUFmLFFBQUcsR0FBSCxHQUFHLENBQVk7UUFYMUIsV0FBTSxHQUE4QixFQUFDLENBQUMsRUFBRSxDQUFDLEVBQUUsQ0FBQyxFQUFFLENBQUMsRUFBQyxDQUFDO1FBQ2pELFlBQU8sR0FBWSxLQUFLLENBQUM7UUFDeEIsa0JBQWEsR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO1FBVWxELElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQztJQUNuQixDQUFDO0lBUkQsUUFBUSxDQUFDLENBQWE7UUFDbEIsSUFBSSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsYUFBYSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLEVBQUU7WUFDNUMsSUFBSSxDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7U0FDbEM7SUFDTCxDQUFDO0lBTUQsV0FBVyxDQUFDLEVBQUMsTUFBTSxFQUFnQjtRQUMvQixJQUFJLE1BQU0sRUFBRTtZQUNSLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQztTQUNsQjtJQUNMLENBQUM7SUFFTyxPQUFPO1FBQ1gsSUFBSSxDQUFDLEdBQUcsQ0FBQyxhQUFhLENBQUMsS0FBSyxDQUFDLEdBQUcsR0FBRyxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUMsR0FBRyxJQUFJLENBQUM7UUFDekQsSUFBSSxDQUFDLEdBQUcsQ0FBQyxhQUFhLENBQUMsS0FBSyxDQUFDLElBQUksR0FBRyxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUMsR0FBRyxJQUFJLENBQUM7SUFDOUQsQ0FBQzs7aUhBekJRLG9CQUFvQjtxR0FBcEIsb0JBQW9CLHlPQVhuQjs7Ozs7OztLQU9ULDZOQUVXLENBQUMsU0FBUyxDQUFDOzJGQUVkLG9CQUFvQjtrQkFiaEMsU0FBUzsrQkFDSSxnQkFBZ0IsWUFDaEI7Ozs7Ozs7S0FPVCxjQUVXLENBQUMsU0FBUyxDQUFDO2lHQUdkLE1BQU07c0JBQWQsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0ksYUFBYTtzQkFBdEIsTUFBTTtnQkFHUCxRQUFRO3NCQURQLFlBQVk7dUJBQUMsZ0JBQWdCLEVBQUUsQ0FBQyxRQUFRLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEVsZW1lbnRSZWYsIEV2ZW50RW1pdHRlciwgSG9zdExpc3RlbmVyLCBJbnB1dCwgT25DaGFuZ2VzLCBPdXRwdXQsIFNpbXBsZUNoYW5nZXMsIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IGZhZGVJbk91dCB9IGZyb20gJ25nLWRldnVpL3V0aWxzJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gICAgc2VsZWN0b3I6ICdkLWNvbnRleHQtbWVudScsXHJcbiAgICB0ZW1wbGF0ZTogYFxyXG4gICAgICAgIDxkaXZcclxuICAgICAgICAgICAgKm5nSWY9XCJ2aXNpYmxlXCJcclxuICAgICAgICAgICAgW0BmYWRlSW5PdXRdPVwidmlzaWJsZSA/ICdib3R0b20nIDogJ3ZvaWQnXCJcclxuICAgICAgICA+XHJcbiAgICAgICAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cclxuICAgICAgICA8L2Rpdj5cclxuICAgIGAsXHJcbiAgICBzdHlsZVVybHM6IFsnLi9jb250ZXh0LW1lbnUuY29tcG9uZW50Lmxlc3MnXSxcclxuICAgIGFuaW1hdGlvbnM6IFtmYWRlSW5PdXRdLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgQ29udGV4dE1lbnVDb21wb25lbnQgaW1wbGVtZW50cyBPbkNoYW5nZXMge1xyXG4gICAgQElucHV0KCkgb2Zmc2V0PzogeyB4OiBudW1iZXI7IHk6IG51bWJlciB9ID0ge3g6IDAsIHk6IDB9O1xyXG4gICAgQElucHV0KCkgdmlzaWJsZTogYm9vbGVhbiA9IGZhbHNlO1xyXG4gICAgQE91dHB1dCgpIHZpc2libGVDaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPGJvb2xlYW4+KCk7XHJcblxyXG4gICAgQEhvc3RMaXN0ZW5lcignZG9jdW1lbnQ6Y2xpY2snLCBbJyRldmVudCddKVxyXG4gICAgY2xpY2tPdXQoZTogTW91c2VFdmVudCkge1xyXG4gICAgICAgIGlmICghdGhpcy5yZWYubmF0aXZlRWxlbWVudC5jb250YWlucyhlLnRhcmdldCkpIHtcclxuICAgICAgICAgICAgdGhpcy52aXNpYmxlQ2hhbmdlLmVtaXQoZmFsc2UpO1xyXG4gICAgICAgIH1cclxuICAgIH1cclxuXHJcbiAgICBjb25zdHJ1Y3Rvcihwcml2YXRlIHJlZjogRWxlbWVudFJlZikge1xyXG4gICAgICAgIHRoaXMucmVwYWludCgpO1xyXG4gICAgfVxyXG5cclxuICAgIG5nT25DaGFuZ2VzKHtvZmZzZXR9OiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XHJcbiAgICAgICAgaWYgKG9mZnNldCkge1xyXG4gICAgICAgICAgICB0aGlzLnJlcGFpbnQoKTtcclxuICAgICAgICB9XHJcbiAgICB9XHJcblxyXG4gICAgcHJpdmF0ZSByZXBhaW50KCkge1xyXG4gICAgICAgIHRoaXMucmVmLm5hdGl2ZUVsZW1lbnQuc3R5bGUudG9wID0gdGhpcy5vZmZzZXQ/LnkgKyAncHgnO1xyXG4gICAgICAgIHRoaXMucmVmLm5hdGl2ZUVsZW1lbnQuc3R5bGUubGVmdCA9IHRoaXMub2Zmc2V0Py54ICsgJ3B4JztcclxuICAgIH1cclxufVxyXG4iXX0=