ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
93 lines • 13.2 kB
JavaScript
/**
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
*/
import { CdkOverlayOrigin } from '@angular/cdk/overlay';
import { Directive, ElementRef, Input, booleanAttribute } from '@angular/core';
import { takeUntil } from 'rxjs/operators';
import { NzDestroyService } from 'ng-zorro-antd/core/services';
import { getPlacementName } from './overlay-position';
import * as i0 from "@angular/core";
import * as i1 from "@angular/cdk/overlay";
import * as i2 from "ng-zorro-antd/core/services";
export class NzConnectedOverlayDirective {
constructor(cdkConnectedOverlay, nzDestroyService) {
this.cdkConnectedOverlay = cdkConnectedOverlay;
this.nzDestroyService = nzDestroyService;
this.nzArrowPointAtCenter = false;
this.cdkConnectedOverlay.backdropClass = 'nz-overlay-transparent-backdrop';
this.cdkConnectedOverlay.positionChange
.pipe(takeUntil(this.nzDestroyService))
.subscribe((position) => {
if (this.nzArrowPointAtCenter) {
this.updateArrowPosition(position);
}
});
}
updateArrowPosition(position) {
const originRect = this.getOriginRect();
const placement = getPlacementName(position);
let offsetX = 0;
let offsetY = 0;
if (placement === 'topLeft' || placement === 'bottomLeft') {
offsetX = originRect.width / 2 - 14;
}
else if (placement === 'topRight' || placement === 'bottomRight') {
offsetX = -(originRect.width / 2 - 14);
}
else if (placement === 'leftTop' || placement === 'rightTop') {
offsetY = originRect.height / 2 - 10;
}
else if (placement === 'leftBottom' || placement === 'rightBottom') {
offsetY = -(originRect.height / 2 - 10);
}
if (this.cdkConnectedOverlay.offsetX !== offsetX || this.cdkConnectedOverlay.offsetY !== offsetY) {
this.cdkConnectedOverlay.offsetY = offsetY;
this.cdkConnectedOverlay.offsetX = offsetX;
this.cdkConnectedOverlay.overlayRef.updatePosition();
}
}
getFlexibleConnectedPositionStrategyOrigin() {
if (this.cdkConnectedOverlay.origin instanceof CdkOverlayOrigin) {
return this.cdkConnectedOverlay.origin.elementRef;
}
else {
return this.cdkConnectedOverlay.origin;
}
}
getOriginRect() {
const origin = this.getFlexibleConnectedPositionStrategyOrigin();
if (origin instanceof ElementRef) {
return origin.nativeElement.getBoundingClientRect();
}
// Check for Element so SVG elements are also supported.
if (origin instanceof Element) {
return origin.getBoundingClientRect();
}
const width = origin.width || 0;
const height = origin.height || 0;
// If the origin is a point, return a client rect as if it was a 0x0 element at the point.
return {
top: origin.y,
bottom: origin.y + height,
left: origin.x,
right: origin.x + width,
height,
width
};
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: NzConnectedOverlayDirective, deps: [{ token: i1.CdkConnectedOverlay }, { token: i2.NzDestroyService }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.1.2", type: NzConnectedOverlayDirective, selector: "[cdkConnectedOverlay][nzConnectedOverlay]", inputs: { nzArrowPointAtCenter: ["nzArrowPointAtCenter", "nzArrowPointAtCenter", booleanAttribute] }, providers: [NzDestroyService], exportAs: ["nzConnectedOverlay"], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: NzConnectedOverlayDirective, decorators: [{
type: Directive,
args: [{
selector: '[cdkConnectedOverlay][nzConnectedOverlay]',
exportAs: 'nzConnectedOverlay',
providers: [NzDestroyService]
}]
}], ctorParameters: () => [{ type: i1.CdkConnectedOverlay }, { type: i2.NzDestroyService }], propDecorators: { nzArrowPointAtCenter: [{
type: Input,
args: [{ transform: booleanAttribute }]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibnotY29ubmVjdGVkLW92ZXJsYXkuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL2NvcmUvb3ZlcmxheS9uei1jb25uZWN0ZWQtb3ZlcmxheS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7O0dBR0c7QUFFSCxPQUFPLEVBRUwsZ0JBQWdCLEVBR2pCLE1BQU0sc0JBQXNCLENBQUM7QUFDOUIsT0FBTyxFQUFFLFNBQVMsRUFBRSxVQUFVLEVBQUUsS0FBSyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQy9FLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUUzQyxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQztBQUUvRCxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQzs7OztBQVV0RCxNQUFNLE9BQU8sMkJBQTJCO0lBR3RDLFlBQ21CLG1CQUF3QyxFQUN4QyxnQkFBa0M7UUFEbEMsd0JBQW1CLEdBQW5CLG1CQUFtQixDQUFxQjtRQUN4QyxxQkFBZ0IsR0FBaEIsZ0JBQWdCLENBQWtCO1FBSmIseUJBQW9CLEdBQVksS0FBSyxDQUFDO1FBTTVFLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxhQUFhLEdBQUcsaUNBQWlDLENBQUM7UUFFM0UsSUFBSSxDQUFDLG1CQUFtQixDQUFDLGNBQWM7YUFDcEMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsQ0FBQzthQUN0QyxTQUFTLENBQUMsQ0FBQyxRQUF3QyxFQUFFLEVBQUU7WUFDdEQsSUFBSSxJQUFJLENBQUMsb0JBQW9CLEVBQUUsQ0FBQztnQkFDOUIsSUFBSSxDQUFDLG1CQUFtQixDQUFDLFFBQVEsQ0FBQyxDQUFDO1lBQ3JDLENBQUM7UUFDSCxDQUFDLENBQUMsQ0FBQztJQUNQLENBQUM7SUFFTyxtQkFBbUIsQ0FBQyxRQUF3QztRQUNsRSxNQUFN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O29CQUNULFFBQVEsRUFBRSwyQ0FBMkM7b0JBQ3JELFFBQVEsRUFBRSxvQkFBb0I7b0JBQzlCLFNBQVMsRUFBRSxDQUFDLGdCQUFnQixDQUFDO2lCQUM5Qjt1SEFFeUMsb0JBQW9CO3NCQUEzRCxLQUFLO3VCQUFDLEVBQUUsU0FBUyxFQUFFLGdCQUFnQixFQUFFIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBVc2Ugb2YgdGhpcyBzb3VyY2UgY29kZSBpcyBnb3Zlcm5lZCBieSBhbiBNSVQtc3R5bGUgbGljZW5zZSB0aGF0IGNhbiBiZVxuICogZm91bmQgaW4gdGhlIExJQ0VOU0UgZmlsZSBhdCBodHRwczovL2dpdGh1Yi5jb20vTkctWk9SUk8vbmctem9ycm8tYW50ZC9ibG9iL21hc3Rlci9MSUNFTlNFXG4gKi9cblxuaW1wb3J0IHtcbiAgQ2RrQ29ubmVjdGVkT3ZlcmxheSxcbiAgQ2RrT3ZlcmxheU9yaWdpbixcbiAgQ29ubmVjdGVkT3ZlcmxheVBvc2l0aW9uQ2hhbmdlLFxuICBGbGV4aWJsZUNvbm5lY3RlZFBvc2l0aW9uU3RyYXRlZ3lPcmlnaW5cbn0gZnJvbSAnQGFuZ3VsYXIvY2RrL292ZXJsYXknO1xuaW1wb3J0IHsgRGlyZWN0aXZlLCBFbGVtZW50UmVmLCBJbnB1dCwgYm9vbGVhbkF0dHJpYnV0ZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgdGFrZVVudGlsIH0gZnJvbSAncnhqcy9vcGVyYXRvcnMnO1xuXG5pbXBvcnQgeyBOekRlc3Ryb3lTZXJ2aWNlIH0gZnJvbSAnbmctem9ycm8tYW50ZC9jb3JlL3NlcnZpY2VzJztcblxuaW1wb3J0IHsgZ2V0UGxhY2VtZW50TmFtZSB9IGZyb20gJy4vb3ZlcmxheS1wb3NpdGlvbic7XG5cbi8qKiBFcXVpdmFsZW50IG9mIGBDbGllbnRSZWN0YCB3aXRob3V0IHNvbWUgb2YgdGhlIHByb3BlcnRpZXMgd2UgZG9uJ3QgY2FyZSBhYm91dC4gKi9cbnR5cGUgRGltZW5zaW9ucyA9IE9taXQ8Q2xpZW50UmVjdCwgJ3gnIHwgJ3knIHwgJ3RvSlNPTic+O1xuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbY2RrQ29ubmVjdGVkT3ZlcmxheV1bbnpDb25uZWN0ZWRPdmVybGF5XScsXG4gIGV4cG9ydEFzOiAnbnpDb25uZWN0ZWRPdmVybGF5JyxcbiAgcHJvdmlkZXJzOiBbTnpEZXN0cm95U2VydmljZV1cbn0pXG5leHBvcnQgY2xhc3MgTnpDb25uZWN0ZWRPdmVybGF5RGlyZWN0aXZlIHtcbiAgQElucHV0KHsgdHJhbnNmb3JtOiBib29sZWFuQXR0cmlidXRlIH0pIG56QXJyb3dQb2ludEF0Q2VudGVyOiBib29sZWFuID0gZmFsc2U7XG5cbiAgY29uc3RydWN0b3IoXG4gICAgcHJpdmF0ZSByZWFkb25seSBjZGtDb25uZWN0ZWRPdmVybGF5OiBDZGtDb25uZWN0ZWRPdmVybGF5LFxuICAgIHByaXZhdGUgcmVhZG9ubHkgbnpEZXN0cm95U2VydmljZTogTnpEZXN0cm95U2VydmljZVxuICApIHtcbiAgICB0aGlzLmNka0Nvbm5lY3RlZE92ZXJsYXkuYmFja2Ryb3BDbGFzcyA9ICduei1vdmVybGF5LXRyYW5zcGFyZW50LWJhY2tkcm9wJztcblxuICAgIHRoaXMuY2RrQ29ubmVjdGVkT3ZlcmxheS5wb3NpdGlvbkNoYW5nZVxuICAgICAgLnBpcGUodGFrZVVudGlsKHRoaXMubnpEZXN0cm95U2VydmljZSkpXG4gICAgICAuc3Vic2NyaWJlKChwb3NpdGlvbjogQ29ubmVjdGVkT3ZlcmxheVBvc2l0aW9uQ2hhbmdlKSA9PiB7XG4gICAgICAgIGlmICh0aGlzLm56QXJyb3dQb2ludEF0Q2VudGVyKSB7XG4gICAgICAgICAgdGhpcy51cGRhdGVBcnJvd1Bvc2l0aW9uKHBvc2l0aW9uKTtcbiAgICAgICAgfVxuICAgICAgfSk7XG4gIH1cblxuICBwcml2YXRlIHVwZGF0ZUFycm93UG9zaXRpb24ocG9zaXRpb246IENvbm5lY3RlZE92ZXJsYXlQb3NpdGlvbkNoYW5nZSk6IHZvaWQge1xuICAgIGNvbnN0IG9yaWdpblJlY3QgPSB0aGlzLmdldE9yaWdpblJlY3QoKTtcbiAgICBjb25zdCBwbGFjZW1lbnQgPSBnZXRQbGFjZW1lbnROYW1lKHBvc2l0aW9uKTtcblxuICAgIGxldCBvZmZzZXRYOiBudW1iZXIgfCB1bmRlZmluZWQgPSAwO1xuICAgIGxldCBvZmZzZXRZOiBudW1iZXIgfCB1bmRlZmluZWQgPSAwO1xuXG4gICAgaWYgKHBsYWNlbWVudCA9PT0gJ3RvcExlZnQnIHx8IHBsYWNlbWVudCA9PT0gJ2JvdHRvbUxlZnQnKSB7XG4gICAgICBvZmZzZXRYID0gb3JpZ2luUmVjdC53aWR0aCAvIDIgLSAxNDtcbiAgICB9IGVsc2UgaWYgKHBsYWNlbWVudCA9PT0gJ3RvcFJpZ2h0JyB8fCBwbGFjZW1lbnQgPT09ICdib3R0b21SaWdodCcpIHtcbiAgICAgIG9mZnNldFggPSAtKG9yaWdpblJlY3Qud2lkdGggLyAyIC0gMTQpO1xuICAgIH0gZWxzZSBpZiAocGxhY2VtZW50ID09PSAnbGVmdFRvcCcgfHwgcGxhY2VtZW50ID09PSAncmlnaHRUb3AnKSB7XG4gICAgICBvZmZzZXRZID0gb3JpZ2luUmVjdC5oZWlnaHQgLyAyIC0gMTA7XG4gICAgfSBlbHNlIGlmIChwbGFjZW1lbnQgPT09ICdsZWZ0Qm90dG9tJyB8fCBwbGFjZW1lbnQgPT09ICdyaWdodEJvdHRvbScpIHtcbiAgICAgIG9mZnNldFkgPSAtKG9yaWdpblJlY3QuaGVpZ2h0IC8gMiAtIDEwKTtcbiAgICB9XG5cbiAgICBpZiAodGhpcy5jZGtDb25uZWN0ZWRPdmVybGF5Lm9mZnNldFggIT09IG9mZnNldFggfHwgdGhpcy5jZGtDb25uZWN0ZWRPdmVybGF5Lm9mZnNldFkgIT09IG9mZnNldFkpIHtcbiAgICAgIHRoaXMuY2RrQ29ubmVjdGVkT3ZlcmxheS5vZmZzZXRZID0gb2Zmc2V0WTtcbiAgICAgIHRoaXMuY2RrQ29ubmVjdGVkT3ZlcmxheS5vZmZzZXRYID0gb2Zmc2V0WDtcbiAgICAgIHRoaXMuY2RrQ29ubmVjdGVkT3ZlcmxheS5vdmVybGF5UmVmLnVwZGF0ZVBvc2l0aW9uKCk7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBnZXRGbGV4aWJsZUNvbm5lY3RlZFBvc2l0aW9uU3RyYXRlZ3lPcmlnaW4oKTogRmxleGlibGVDb25uZWN0ZWRQb3NpdGlvblN0cmF0ZWd5T3JpZ2luIHtcbiAgICBpZiAodGhpcy5jZGtDb25uZWN0ZWRPdmVybGF5Lm9yaWdpbiBpbnN0YW5jZW9mIENka092ZXJsYXlPcmlnaW4pIHtcbiAgICAgIHJldHVybiB0aGlzLmNka0Nvbm5lY3RlZE92ZXJsYXkub3JpZ2luLmVsZW1lbnRSZWY7XG4gICAgfSBlbHNlIHtcbiAgICAgIHJldHVybiB0aGlzLmNka0Nvbm5lY3RlZE92ZXJsYXkub3JpZ2luO1xuICAgIH1cbiAgfVxuXG4gIHByaXZhdGUgZ2V0T3JpZ2luUmVjdCgpOiBEaW1lbnNpb25zIHtcbiAgICBjb25zdCBvcmlnaW4gPSB0aGlzLmdldEZsZXhpYmxlQ29ubmVjdGVkUG9zaXRpb25TdHJhdGVneU9yaWdpbigpO1xuXG4gICAgaWYgKG9yaWdpbiBpbnN0YW5jZW9mIEVsZW1lbnRSZWYpIHtcbiAgICAgIHJldHVybiBvcmlnaW4ubmF0aXZlRWxlbWVudC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcbiAgICB9XG5cbiAgICAvLyBDaGVjayBmb3IgRWxlbWVudCBzbyBTVkcgZWxlbWVudHMgYXJlIGFsc28gc3VwcG9ydGVkLlxuICAgIGlmIChvcmlnaW4gaW5zdGFuY2VvZiBFbGVtZW50KSB7XG4gICAgICByZXR1cm4gb3JpZ2luLmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpO1xuICAgIH1cblxuICAgIGNvbnN0IHdpZHRoID0gb3JpZ2luLndpZHRoIHx8IDA7XG4gICAgY29uc3QgaGVpZ2h0ID0gb3JpZ2luLmhlaWdodCB8fCAwO1xuXG4gICAgLy8gSWYgdGhlIG9yaWdpbiBpcyBhIHBvaW50LCByZXR1cm4gYSBjbGllbnQgcmVjdCBhcyBpZiBpdCB3YXMgYSAweDAgZWxlbWVudCBhdCB0aGUgcG9pbnQuXG4gICAgcmV0dXJuIHtcbiAgICAgIHRvcDogb3JpZ2luLnksXG4gICAgICBib3R0b206IG9yaWdpbi55ICsgaGVpZ2h0LFxuICAgICAgbGVmdDogb3JpZ2luLngsXG4gICAgICByaWdodDogb3JpZ2luLnggKyB3aWR0aCxcbiAgICAgIGhlaWdodCxcbiAgICAgIHdpZHRoXG4gICAgfTtcbiAgfVxufVxuIl19