@swimlane/ngx-charts
Version:
Declarative Charting Framework for Angular
136 lines • 6.55 kB
JavaScript
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
import { Input, Component, ElementRef, ViewEncapsulation, HostListener, ViewChild, HostBinding, Renderer2 } from '@angular/core';
import { throttleable } from '../../utils/throttle';
import { PositionHelper, PlacementTypes } from './position';
import { StyleTypes } from './style.type';
import { AlignmentTypes } from './alignment.type';
var TooltipContentComponent = /** @class */ (function () {
function TooltipContentComponent(element, renderer) {
this.element = element;
this.renderer = renderer;
}
Object.defineProperty(TooltipContentComponent.prototype, "cssClasses", {
get: function () {
var clz = 'ngx-charts-tooltip-content';
clz += " position-" + this.placement;
clz += " type-" + this.type;
clz += " " + this.cssClass;
return clz;
},
enumerable: true,
configurable: true
});
TooltipContentComponent.prototype.ngAfterViewInit = function () {
setTimeout(this.position.bind(this));
};
TooltipContentComponent.prototype.position = function () {
var _this = this;
var nativeElm = this.element.nativeElement;
var hostDim = this.host.nativeElement.getBoundingClientRect();
// if no dims were found, never show
if (!hostDim.height && !hostDim.width)
return;
var elmDim = nativeElm.getBoundingClientRect();
this.checkFlip(hostDim, elmDim);
this.positionContent(nativeElm, hostDim, elmDim);
if (this.showCaret) {
this.positionCaret(hostDim, elmDim);
}
// animate its entry
setTimeout(function () { return _this.renderer.addClass(nativeElm, 'animate'); }, 1);
};
TooltipContentComponent.prototype.positionContent = function (nativeElm, hostDim, elmDim) {
var _a = PositionHelper.positionContent(this.placement, elmDim, hostDim, this.spacing, this.alignment), top = _a.top, left = _a.left;
this.renderer.setStyle(nativeElm, 'top', top + "px");
this.renderer.setStyle(nativeElm, 'left', left + "px");
};
TooltipContentComponent.prototype.positionCaret = function (hostDim, elmDim) {
var caretElm = this.caretElm.nativeElement;
var caretDimensions = caretElm.getBoundingClientRect();
var _a = PositionHelper.positionCaret(this.placement, elmDim, hostDim, caretDimensions, this.alignment), top = _a.top, left = _a.left;
this.renderer.setStyle(caretElm, 'top', top + "px");
this.renderer.setStyle(caretElm, 'left', left + "px");
};
TooltipContentComponent.prototype.checkFlip = function (hostDim, elmDim) {
this.placement = PositionHelper.determinePlacement(this.placement, elmDim, hostDim, this.spacing);
};
TooltipContentComponent.prototype.onWindowResize = function () {
this.position();
};
__decorate([
Input(),
__metadata("design:type", Object)
], TooltipContentComponent.prototype, "host", void 0);
__decorate([
Input(),
__metadata("design:type", Boolean)
], TooltipContentComponent.prototype, "showCaret", void 0);
__decorate([
Input(),
__metadata("design:type", Number)
], TooltipContentComponent.prototype, "type", void 0);
__decorate([
Input(),
__metadata("design:type", Number)
], TooltipContentComponent.prototype, "placement", void 0);
__decorate([
Input(),
__metadata("design:type", Number)
], TooltipContentComponent.prototype, "alignment", void 0);
__decorate([
Input(),
__metadata("design:type", Number)
], TooltipContentComponent.prototype, "spacing", void 0);
__decorate([
Input(),
__metadata("design:type", String)
], TooltipContentComponent.prototype, "cssClass", void 0);
__decorate([
Input(),
__metadata("design:type", String)
], TooltipContentComponent.prototype, "title", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], TooltipContentComponent.prototype, "template", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], TooltipContentComponent.prototype, "context", void 0);
__decorate([
ViewChild('caretElm', { static: false }),
__metadata("design:type", Object)
], TooltipContentComponent.prototype, "caretElm", void 0);
__decorate([
HostBinding('class'),
__metadata("design:type", String),
__metadata("design:paramtypes", [])
], TooltipContentComponent.prototype, "cssClasses", null);
__decorate([
HostListener('window:resize'),
throttleable(100),
__metadata("design:type", Function),
__metadata("design:paramtypes", []),
__metadata("design:returntype", void 0)
], TooltipContentComponent.prototype, "onWindowResize", null);
TooltipContentComponent = __decorate([
Component({
selector: 'ngx-tooltip-content',
template: "\n <div>\n <span #caretElm [hidden]=\"!showCaret\" class=\"tooltip-caret position-{{ this.placement }}\"> </span>\n <div class=\"tooltip-content\">\n <span *ngIf=\"!title\">\n <ng-template [ngTemplateOutlet]=\"template\" [ngTemplateOutletContext]=\"{ model: context }\"> </ng-template>\n </span>\n <span *ngIf=\"title\" [innerHTML]=\"title\"> </span>\n </div>\n </div>\n ",
encapsulation: ViewEncapsulation.None,
styleUrls: ['./tooltip.component.css']
}),
__metadata("design:paramtypes", [ElementRef, Renderer2])
], TooltipContentComponent);
return TooltipContentComponent;
}());
export { TooltipContentComponent };
//# sourceMappingURL=tooltip.component.js.map