@tetacom/svg-charts 1.2.13 → 1.2.16

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.
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Injectable, Component, Input, ChangeDetectionStrategy, ChangeDetectorRef, HostListener, Directive, HostBinding, ViewChild, EventEmitter, Output, NgModule } from '@angular/core';
2
+ import { Injectable, Component, Input, ChangeDetectionStrategy, ChangeDetectorRef, HostListener, ElementRef, ViewChild, Directive, HostBinding, EventEmitter, Output, NgModule } from '@angular/core';
3
3
  import * as i4 from '@angular/common';
4
4
  import { CommonModule } from '@angular/common';
5
5
  import { BehaviorSubject, Subject, of, withLatestFrom, map, shareReplay, filter, lastValueFrom, take, combineLatest, ReplaySubject, tap, takeWhile, combineLatestWith, observeOn, animationFrameScheduler } from 'rxjs';
@@ -8,7 +8,8 @@ import { zoomIdentity } from 'd3';
8
8
  import objectHash from 'object-hash';
9
9
  import { maxIndex } from 'd3-array';
10
10
  import { debounceTime, tap as tap$1 } from 'rxjs/operators';
11
- import { tetaZoneFull } from '@tetacom/ng-components';
11
+ import * as i5 from '@tetacom/ng-components';
12
+ import { PositionUtil, Align, VerticalAlign, tetaZoneFull, LetModule } from '@tetacom/ng-components';
12
13
  import * as i3 from '@angular/platform-browser';
13
14
 
14
15
  var ZoomType;
@@ -1398,9 +1399,8 @@ class BlockAreaSeriesComponent extends SeriesBaseComponent {
1398
1399
  this.id = (Date.now() + Math.random()).toString(36);
1399
1400
  }
1400
1401
  ngOnInit() {
1401
- const defaultVisiblePixels = 0;
1402
- this.x = this.scaleService.scales.pipe(map((_) => _.x.get(this.series.xAxisIndex).scale));
1403
- this.y = this.scaleService.scales.pipe(map((_) => _.y.get(this.series.yAxisIndex).scale));
1402
+ this.x = this.scaleService.scales.pipe(map((_) => _.x.get(this.series.xAxisIndex)?.scale));
1403
+ this.y = this.scaleService.scales.pipe(map((_) => _.y.get(this.series.yAxisIndex)?.scale));
1404
1404
  this.displayPoints = this.y.pipe(map((y) => {
1405
1405
  return this.series.data.filter((point, index, arr) => {
1406
1406
  const [min, max] = y.domain();
@@ -1546,23 +1546,23 @@ class GridlinesComponent {
1546
1546
  this.config = this.chartService.config;
1547
1547
  this.tickYValues = this.svc.scales.pipe(map((_) => {
1548
1548
  const ratio = this.size.height / 40;
1549
- return _.y.get(0).scale.ticks(ratio);
1549
+ return _.y.get(0)?.scale.ticks(ratio);
1550
1550
  }));
1551
1551
  this.tickXValues = this.svc.scales.pipe(map((_) => {
1552
1552
  const ratio = this.size.width / 40;
1553
- return _.x.get(0).scale.ticks(ratio);
1553
+ return _.x.get(0)?.scale.ticks(ratio);
1554
1554
  }));
1555
- this.y = this.svc.scales.pipe(map((_) => _.y.get(0).scale));
1556
- this.x = this.svc.scales.pipe(map((_) => _.x.get(0).scale));
1555
+ this.y = this.svc.scales.pipe(map((_) => _.y.get(0)?.scale));
1556
+ this.x = this.svc.scales.pipe(map((_) => _.x.get(0)?.scale));
1557
1557
  }
1558
1558
  ngAfterViewInit() {
1559
1559
  }
1560
1560
  }
1561
1561
  GridlinesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: GridlinesComponent, deps: [{ token: ScaleService }, { token: ChartService }], target: i0.ɵɵFactoryTarget.Component });
1562
- GridlinesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: GridlinesComponent, selector: "[teta-gridlines]", inputs: { size: "size" }, ngImport: i0, template: "<ng-container *ngIf=\"{\n xValues: tickXValues | async,\n yValues: tickYValues | async,\n x: x | async,\n y: y | async,\n config: config | async\n} as data\">\n <ng-container *ngIf=\"data.config.gridLines?.showY !== false\">\n <ng-container *ngFor=\"let tick of data.yValues\">\n <svg:line [attr.x1]=\"0\"\n [attr.y1]=\"data.y(tick)\"\n [attr.x2]=\"size?.width\"\n [attr.y2]=\"data.y(tick)\"></svg:line>\n </ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"data.config.gridLines?.showX !== false\">\n <ng-container *ngFor=\"let tick of data.xValues\">\n <svg:line [attr.x1]=\"data.x(tick)\"\n [attr.y1]=\"0\"\n [attr.x2]=\"data.x(tick)\"\n [attr.y2]=\"size?.height\"></svg:line>\n </ng-container>\n </ng-container>\n\n</ng-container>\n\n\n", styles: [":host{shape-rendering:crispEdges}:host line{stroke:var(--color-text-5)}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1562
+ GridlinesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: GridlinesComponent, selector: "[teta-gridlines]", inputs: { size: "size" }, ngImport: i0, template: "<ng-container *ngIf=\"{\n xValues: tickXValues | async,\n yValues: tickYValues | async,\n x: x | async,\n y: y | async,\n config: config | async\n} as data\">\n <ng-container *ngIf=\"data.y && data.config.gridLines?.showY !== false\">\n <ng-container *ngFor=\"let tick of data.yValues\">\n <svg:line [attr.x1]=\"0\"\n [attr.y1]=\"data.y(tick)\"\n [attr.x2]=\"size?.width\"\n [attr.y2]=\"data.y(tick)\"></svg:line>\n </ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"data.x && data.config.gridLines?.showX !== false\">\n <ng-container *ngFor=\"let tick of data.xValues\">\n <svg:line [attr.x1]=\"data.x(tick)\"\n [attr.y1]=\"0\"\n [attr.x2]=\"data.x(tick)\"\n [attr.y2]=\"size?.height\"></svg:line>\n </ng-container>\n </ng-container>\n\n</ng-container>\n\n\n", styles: [":host{shape-rendering:crispEdges}:host line{stroke:var(--color-text-5)}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1563
1563
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: GridlinesComponent, decorators: [{
1564
1564
  type: Component,
1565
- args: [{ selector: '[teta-gridlines]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n xValues: tickXValues | async,\n yValues: tickYValues | async,\n x: x | async,\n y: y | async,\n config: config | async\n} as data\">\n <ng-container *ngIf=\"data.config.gridLines?.showY !== false\">\n <ng-container *ngFor=\"let tick of data.yValues\">\n <svg:line [attr.x1]=\"0\"\n [attr.y1]=\"data.y(tick)\"\n [attr.x2]=\"size?.width\"\n [attr.y2]=\"data.y(tick)\"></svg:line>\n </ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"data.config.gridLines?.showX !== false\">\n <ng-container *ngFor=\"let tick of data.xValues\">\n <svg:line [attr.x1]=\"data.x(tick)\"\n [attr.y1]=\"0\"\n [attr.x2]=\"data.x(tick)\"\n [attr.y2]=\"size?.height\"></svg:line>\n </ng-container>\n </ng-container>\n\n</ng-container>\n\n\n", styles: [":host{shape-rendering:crispEdges}:host line{stroke:var(--color-text-5)}\n"] }]
1565
+ args: [{ selector: '[teta-gridlines]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n xValues: tickXValues | async,\n yValues: tickYValues | async,\n x: x | async,\n y: y | async,\n config: config | async\n} as data\">\n <ng-container *ngIf=\"data.y && data.config.gridLines?.showY !== false\">\n <ng-container *ngFor=\"let tick of data.yValues\">\n <svg:line [attr.x1]=\"0\"\n [attr.y1]=\"data.y(tick)\"\n [attr.x2]=\"size?.width\"\n [attr.y2]=\"data.y(tick)\"></svg:line>\n </ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"data.x && data.config.gridLines?.showX !== false\">\n <ng-container *ngFor=\"let tick of data.xValues\">\n <svg:line [attr.x1]=\"data.x(tick)\"\n [attr.y1]=\"0\"\n [attr.x2]=\"data.x(tick)\"\n [attr.y2]=\"size?.height\"></svg:line>\n </ng-container>\n </ng-container>\n\n</ng-container>\n\n\n", styles: [":host{shape-rendering:crispEdges}:host line{stroke:var(--color-text-5)}\n"] }]
1566
1566
  }], ctorParameters: function () { return [{ type: ScaleService }, { type: ChartService }]; }, propDecorators: { size: [{
1567
1567
  type: Input
1568
1568
  }] } });
@@ -1577,14 +1577,15 @@ class XAxisComponent {
1577
1577
  }));
1578
1578
  this.ticks = this.x.pipe(withLatestFrom(this._svc.size), map((_) => {
1579
1579
  const [x, size] = _;
1580
- const maxSymbolLength = parseInt(d3.max(x.ticks().map((_) => getTextWidth(this.axis.options.tickFormat ? this.axis.options.tickFormat(_) : this.axis.defaultFormatter()(_)))), 10);
1581
- return x.ticks(size.width / (maxSymbolLength * 2.5));
1580
+ const tickSize = x.ticks().map((_) => getTextWidth(this.axis.options.tickFormat ? this.axis.options.tickFormat(_) : this.axis.defaultFormatter()(_), 0.45, 11));
1581
+ return x.ticks(size.width / parseInt(d3.max(tickSize), 10) / 2);
1582
1582
  }));
1583
1583
  }
1584
1584
  getLabelTransform() {
1585
1585
  return `translate(${this.size.width / 2}, ${this.axis.options.opposite ? -32 : 32})`;
1586
1586
  }
1587
- ngOnInit() { }
1587
+ ngOnInit() {
1588
+ }
1588
1589
  ngOnDestroy() {
1589
1590
  this._alive = false;
1590
1591
  }
@@ -1852,12 +1853,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImpor
1852
1853
  }] } });
1853
1854
 
1854
1855
  class TooltipComponent {
1855
- constructor(svc, cdr, zoomService, sanitizer, _zone) {
1856
+ constructor(svc, cdr, zoomService, sanitizer, _zone, _elementRef) {
1856
1857
  this.svc = svc;
1857
1858
  this.cdr = cdr;
1858
1859
  this.zoomService = zoomService;
1859
1860
  this.sanitizer = sanitizer;
1860
1861
  this._zone = _zone;
1862
+ this._elementRef = _elementRef;
1861
1863
  this.tooltips = this.svc.tooltips.pipe(map((_) => [..._.values()]));
1862
1864
  }
1863
1865
  ngOnInit() {
@@ -1902,20 +1904,15 @@ class TooltipComponent {
1902
1904
  }));
1903
1905
  }
1904
1906
  getPosition(event) {
1905
- const centerX = this.size.width / 2;
1906
- const centerY = this.size.height / 2;
1907
- const padding = this.config?.tooltip?.padding;
1908
- const scene = {
1909
- left: event.pageX > centerX ? 'initial' : `${event.pageX + padding.x}px`,
1910
- top: event.pageY > centerY ? 'initial' : `${event.pageY + padding.y}px`,
1911
- bottom: event.pageY > centerY
1912
- ? `${window.innerHeight - event.pageY + padding.y}px`
1913
- : 'initial',
1914
- right: event.pageX > centerX
1915
- ? `${window.innerWidth - event.pageX + padding.x}px`
1916
- : 'initial',
1917
- };
1918
- return scene;
1907
+ if (!this.tooltip) {
1908
+ return null;
1909
+ }
1910
+ return PositionUtil.getPosition({
1911
+ top: event.pageY,
1912
+ bottom: event.pageY,
1913
+ left: event.pageX,
1914
+ right: event.pageX,
1915
+ }, this.tooltip?.nativeElement?.getBoundingClientRect(), Align.auto, VerticalAlign.top, 12);
1919
1916
  }
1920
1917
  format(input) {
1921
1918
  if (input instanceof Date) {
@@ -1926,15 +1923,18 @@ class TooltipComponent {
1926
1923
  return format(input);
1927
1924
  }
1928
1925
  }
1929
- TooltipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: TooltipComponent, deps: [{ token: ChartService }, { token: i0.ChangeDetectorRef }, { token: ZoomService }, { token: i3.DomSanitizer }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
1930
- TooltipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: TooltipComponent, selector: "teta-tooltip", inputs: { size: "size", config: "config" }, ngImport: i0, template: "<ng-container *ngIf=\"position | async as p\">\n <ng-container *ngIf=\"tooltips | async as t\">\n <div class=\"chart-tooltip color-text-90 bg-background-50 shadow-2\"\n [style.position]=\"'fixed'\"\n *ngIf=\"t.length > 0\"\n [style.opacity]=\"display | async\"\n style=\"pointer-events: none; min-width: 200px;\"\n [style.left]=\"p.left\"\n [style.top]=\"p.top\"\n [style.bottom]=\"p.bottom\"\n [style.right]=\"p.right\"\n >\n <ng-container *ngIf=\"config.tooltip?.template\">\n <ng-container *ngTemplateOutlet=\"config.tooltip.template; context: {$implicit: t}\"></ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"config.tooltip?.format; else default\">\n <div [innerHTML]=\"displayTooltips | async\"></div>\n </ng-container>\n\n <ng-template #default>\n <div *ngIf=\"!config.tooltip?.template\" class=\"padding-2 border-radius-1\">\n <ng-container *ngFor=\"let tooltip of t\">\n <div class=\"display-flex align-center\">\n <span class=\"display-block margin-right-1\" [style.width.px]=\"10\" [style.height.px]=\"2\"\n [style.background-color]=\"tooltip.series?.color\"></span>\n <span class=\"font-title-3\">\n {{ tooltip.series?.name }}\n <span class=\"font-body-3\">\n x: {{ format(tooltip.point?.x) }}\n y: {{ format(tooltip.point?.y) }}\n </span>\n </span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n </ng-container>\n</ng-container>\n\n\n\n", styles: [":host{position:absolute;z-index:2}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1926
+ TooltipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: TooltipComponent, deps: [{ token: ChartService }, { token: i0.ChangeDetectorRef }, { token: ZoomService }, { token: i3.DomSanitizer }, { token: i0.NgZone }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
1927
+ TooltipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: TooltipComponent, selector: "teta-tooltip", inputs: { size: "size", config: "config" }, viewQueries: [{ propertyName: "tooltip", first: true, predicate: ["tooltip"], descendants: true, read: ElementRef }], ngImport: i0, template: "<ng-container *tetaLet=\"position | async as p\">\n <ng-container *ngIf=\"tooltips | async as t\">\n <div class=\"chart-tooltip color-text-90 bg-background-50 shadow-2\"\n #tooltip\n [style.position]=\"'fixed'\"\n *ngIf=\"t.length > 0\"\n [style.opacity]=\"display | async\"\n style=\"pointer-events: none; min-width: 200px;\"\n [style.left.px]=\"p?.left\"\n [style.top.px]=\"p?.top\"\n [style.bottom.px]=\"p?.bottom\"\n [style.right.px]=\"p?.right\"\n >\n <ng-container *ngIf=\"config.tooltip?.template\">\n <ng-container *ngTemplateOutlet=\"config.tooltip.template; context: {$implicit: t}\"></ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"config.tooltip?.format; else default\">\n <div [innerHTML]=\"displayTooltips | async\"></div>\n </ng-container>\n\n <ng-template #default>\n <div *ngIf=\"!config.tooltip?.template\" class=\"padding-2 border-radius-1\">\n <ng-container *ngFor=\"let tooltip of t\">\n <div class=\"display-flex align-center\">\n <span class=\"display-block margin-right-1\" [style.width.px]=\"10\" [style.height.px]=\"2\"\n [style.background-color]=\"tooltip.series?.color\"></span>\n <span class=\"font-title-3\">\n {{ tooltip.series?.name }}\n <span class=\"font-body-3\">\n x: {{ format(tooltip.point?.x) }}\n y: {{ format(tooltip.point?.y) }}\n </span>\n </span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n </ng-container>\n</ng-container>\n\n\n\n", styles: [":host{position:absolute;z-index:2}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.LetDirective, selector: "[tetaLet]", inputs: ["tetaLet"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1931
1928
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: TooltipComponent, decorators: [{
1932
1929
  type: Component,
1933
- args: [{ selector: 'teta-tooltip', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"position | async as p\">\n <ng-container *ngIf=\"tooltips | async as t\">\n <div class=\"chart-tooltip color-text-90 bg-background-50 shadow-2\"\n [style.position]=\"'fixed'\"\n *ngIf=\"t.length > 0\"\n [style.opacity]=\"display | async\"\n style=\"pointer-events: none; min-width: 200px;\"\n [style.left]=\"p.left\"\n [style.top]=\"p.top\"\n [style.bottom]=\"p.bottom\"\n [style.right]=\"p.right\"\n >\n <ng-container *ngIf=\"config.tooltip?.template\">\n <ng-container *ngTemplateOutlet=\"config.tooltip.template; context: {$implicit: t}\"></ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"config.tooltip?.format; else default\">\n <div [innerHTML]=\"displayTooltips | async\"></div>\n </ng-container>\n\n <ng-template #default>\n <div *ngIf=\"!config.tooltip?.template\" class=\"padding-2 border-radius-1\">\n <ng-container *ngFor=\"let tooltip of t\">\n <div class=\"display-flex align-center\">\n <span class=\"display-block margin-right-1\" [style.width.px]=\"10\" [style.height.px]=\"2\"\n [style.background-color]=\"tooltip.series?.color\"></span>\n <span class=\"font-title-3\">\n {{ tooltip.series?.name }}\n <span class=\"font-body-3\">\n x: {{ format(tooltip.point?.x) }}\n y: {{ format(tooltip.point?.y) }}\n </span>\n </span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n </ng-container>\n</ng-container>\n\n\n\n", styles: [":host{position:absolute;z-index:2}\n"] }]
1934
- }], ctorParameters: function () { return [{ type: ChartService }, { type: i0.ChangeDetectorRef }, { type: ZoomService }, { type: i3.DomSanitizer }, { type: i0.NgZone }]; }, propDecorators: { size: [{
1930
+ args: [{ selector: 'teta-tooltip', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *tetaLet=\"position | async as p\">\n <ng-container *ngIf=\"tooltips | async as t\">\n <div class=\"chart-tooltip color-text-90 bg-background-50 shadow-2\"\n #tooltip\n [style.position]=\"'fixed'\"\n *ngIf=\"t.length > 0\"\n [style.opacity]=\"display | async\"\n style=\"pointer-events: none; min-width: 200px;\"\n [style.left.px]=\"p?.left\"\n [style.top.px]=\"p?.top\"\n [style.bottom.px]=\"p?.bottom\"\n [style.right.px]=\"p?.right\"\n >\n <ng-container *ngIf=\"config.tooltip?.template\">\n <ng-container *ngTemplateOutlet=\"config.tooltip.template; context: {$implicit: t}\"></ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"config.tooltip?.format; else default\">\n <div [innerHTML]=\"displayTooltips | async\"></div>\n </ng-container>\n\n <ng-template #default>\n <div *ngIf=\"!config.tooltip?.template\" class=\"padding-2 border-radius-1\">\n <ng-container *ngFor=\"let tooltip of t\">\n <div class=\"display-flex align-center\">\n <span class=\"display-block margin-right-1\" [style.width.px]=\"10\" [style.height.px]=\"2\"\n [style.background-color]=\"tooltip.series?.color\"></span>\n <span class=\"font-title-3\">\n {{ tooltip.series?.name }}\n <span class=\"font-body-3\">\n x: {{ format(tooltip.point?.x) }}\n y: {{ format(tooltip.point?.y) }}\n </span>\n </span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n </ng-container>\n</ng-container>\n\n\n\n", styles: [":host{position:absolute;z-index:2}\n"] }]
1931
+ }], ctorParameters: function () { return [{ type: ChartService }, { type: i0.ChangeDetectorRef }, { type: ZoomService }, { type: i3.DomSanitizer }, { type: i0.NgZone }, { type: i0.ElementRef }]; }, propDecorators: { size: [{
1935
1932
  type: Input
1936
1933
  }], config: [{
1937
1934
  type: Input
1935
+ }], tooltip: [{
1936
+ type: ViewChild,
1937
+ args: ['tooltip', { static: false, read: ElementRef }]
1938
1938
  }] } });
1939
1939
 
1940
1940
  class ZoomableDirective {
@@ -2716,7 +2716,7 @@ ChartModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
2716
2716
  BlockSeriesComponent,
2717
2717
  BlockAreaSeriesComponent,
2718
2718
  AnnotationComponent,
2719
- CrosshairComponent], imports: [CommonModule], exports: [ChartComponent,
2719
+ CrosshairComponent], imports: [CommonModule, LetModule], exports: [ChartComponent,
2720
2720
  LegendComponent,
2721
2721
  SeriesBaseComponent,
2722
2722
  LineSeriesComponent,
@@ -2725,7 +2725,7 @@ ChartModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
2725
2725
  AreaSeriesComponent,
2726
2726
  BlockSeriesComponent,
2727
2727
  BlockAreaSeriesComponent] });
2728
- ChartModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ChartModule, imports: [CommonModule] });
2728
+ ChartModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ChartModule, imports: [CommonModule, LetModule] });
2729
2729
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ChartModule, decorators: [{
2730
2730
  type: NgModule,
2731
2731
  args: [{
@@ -2764,7 +2764,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImpor
2764
2764
  BlockSeriesComponent,
2765
2765
  BlockAreaSeriesComponent,
2766
2766
  ],
2767
- imports: [CommonModule],
2767
+ imports: [CommonModule, LetModule],
2768
2768
  }]
2769
2769
  }] });
2770
2770