text: 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 { Component, Input, Output, EventEmitter, ElementRef, ViewChild, ChangeDetectionStrategy, ChangeDetectorRef, NgZone } from '@angular/core';
  import { trimLabel } from '../common/trim-label.helper';
  import { roundedRect } from '../common/shape.helper';
  import { count, decimalChecker } from '../common/count';
  import { escapeLabel } from '../common/label.helper';
  var CardComponent = /** @class */ (function () {
      function CardComponent(element, cd, zone) {
          this.cd = cd;
          this.zone = zone;
          this.animations = true;
          this.select = new EventEmitter();
          this.value = '';
          this.textFontSize = 12;
          this.textTransform = '';
          this.initialized = false;
          this.bandHeight = 10;
          this.textPadding = [10, 20, 5, 20];
          this.labelFontSize = 15;
          this.element = element.nativeElement;
      }
      CardComponent.prototype.ngOnChanges = function (changes) {
          this.update();
      };
      CardComponent.prototype.ngOnDestroy = function () {
          cancelAnimationFrame(this.animationReq);
      };
      CardComponent.prototype.update = function () {
          var _this = this;
          this.zone.run(function () {
              var hasValue = _this.data && typeof _this.data.value !== 'undefined';
              var valueFormatting = _this.valueFormatting || (function (card) { return card.value.toLocaleString(); });
              var labelFormatting = _this.labelFormatting || (function (card) { return escapeLabel(trimLabel(card.label, 55)); });
              _this.transform = "translate(" + _this.x + " , " + _this.y + ")";
              _this.textWidth = Math.max(0, _this.width) - _this.textPadding[1] - _this.textPadding[3];
              _this.cardWidth = Math.max(0, _this.width);
              _this.cardHeight = Math.max(0, _this.height);
              _this.label = _this.label ? _this.label : _this.data.name;
              var cardData = {
                  label: _this.label,
                  data: _this.data,
                  value: _this.data.value
              };
              _this.formattedLabel = labelFormatting(cardData);
              _this.transformBand = "translate(0 , " + (_this.cardHeight - _this.bandHeight) + ")";
              var value = hasValue ? valueFormatting(cardData) : '';
              _this.value = _this.paddedValue(value);
              _this.setPadding();
              _this.bandPath = roundedRect(0, 0, _this.cardWidth, _this.bandHeight, 3, [false, false, true, true]);
              setTimeout(function () {
                  _this.scaleText();
                  _this.value = value;
                  if (hasValue && !_this.initialized) {
                      setTimeout(function () { return _this.startCount(); }, 20);
                  }
              }, 8);
          });
      };
      CardComponent.prototype.paddedValue = function (value) {
          if (this.medianSize && this.medianSize > value.length) {
              value += '\u2007'.repeat(this.medianSize - value.length);
          }
          return value;
      };
      CardComponent.prototype.startCount = function () {
          var _this = this;
          if (!this.initialized && this.animations) {
              cancelAnimationFrame(this.animationReq);
              var val_1 = this.data.value;
              var decs = decimalChecker(val_1);
              var valueFormatting_1 = this.valueFormatting || (function (card) { return card.value.toLocaleString(); });
              var callback = function (_a) {
                  var value = _a.value, finished = _a.finished;
                  _this.zone.run(function () {
                      value = finished ? val_1 : value;
                      _this.value = valueFormatting_1({ label: _this.label, data: _this.data, value: value });
                      if (!finished) {
                          _this.value = _this.paddedValue(_this.value);
                      }
                      _this.cd.markForCheck();
                  });
              };
              this.animationReq = count(0, val_1, decs, 1, callback);
              this.initialized = true;
          }
      };
      CardComponent.prototype.scaleText = function () {
          var _this = this;
          this.zone.run(function () {
              var _a = _this.textEl.nativeElement.getBoundingClientRect(), width = _a.width, height = _a.height;
              if (width === 0 || height === 0) {
                  return;
              }
              var textPadding = (_this.textPadding[1] = _this.textPadding[3] = _this.cardWidth / 8);
              var availableWidth = _this.cardWidth - 2 * textPadding;
              var availableHeight = _this.cardHeight / 3;
              var resizeScale = Math.min(availableWidth / width, availableHeight / height);
              _this.textFontSize = Math.floor(_this.textFontSize * resizeScale);
              _this.labelFontSize = Math.min(_this.textFontSize, 15);
              _this.setPadding();
              _this.cd.markForCheck();
          });
      };
      CardComponent.prototype.setPadding = function () {
          this.textPadding[1] = this.textPadding[3] = this.cardWidth / 8;
          var padding = this.cardHeight / 2;
          this.textPadding[0] = padding - this.textFontSize - this.labelFontSize / 2;
          this.textPadding[2] = padding - this.labelFontSize;
      };
      CardComponent.prototype.onClick = function () {
          this.select.emit(this.data);
      };
      __decorate([
          Input(),
          __metadata("design:type", Object)
      ], CardComponent.prototype, "color", void 0);
      __decorate([
          Input(),
          __metadata("design:type", Object)
      ], CardComponent.prototype, "bandColor", void 0);
      __decorate([
          Input(),
          __metadata("design:type", Object)
      ], CardComponent.prototype, "textColor", void 0);
      __decorate([
          Input(),
          __metadata("design:type", Object)
      ], CardComponent.prototype, "x", void 0);
      __decorate([
          Input(),
          __metadata("design:type", Object)
      ], CardComponent.prototype, "y", void 0);
      __decorate([
          Input(),
          __metadata("design:type", Object)
      ], CardComponent.prototype, "width", void 0);
      __decorate([
          Input(),
          __metadata("design:type", Object)
      ], CardComponent.prototype, "height", void 0);
      __decorate([
          Input(),
          __metadata("design:type", Object)
      ], CardComponent.prototype, "label", void 0);
      __decorate([
          Input(),
          __metadata("design:type", Object)
      ], CardComponent.prototype, "data", void 0);
      __decorate([
          Input(),
          __metadata("design:type", Number)
      ], CardComponent.prototype, "medianSize", void 0);
      __decorate([
          Input(),
          __metadata("design:type", Object)
      ], CardComponent.prototype, "valueFormatting", void 0);
      __decorate([
          Input(),
          __metadata("design:type", Object)
      ], CardComponent.prototype, "labelFormatting", void 0);
      __decorate([
          Input(),
          __metadata("design:type", Boolean)
      ], CardComponent.prototype, "animations", void 0);
      __decorate([
          Output(),
          __metadata("design:type", Object)
      ], CardComponent.prototype, "select", void 0);
      __decorate([
          ViewChild('textEl', { static: false }),
          __metadata("design:type", ElementRef)
      ], CardComponent.prototype, "textEl", void 0);
      CardComponent = __decorate([
          Component({
              selector: 'g[ngx-charts-card]',
              template: "\n    <svg:g [attr.transform]=\"transform\" class=\"cell\" (click)=\"onClick()\">\n      <svg:rect class=\"card\" [style.fill]=\"color\" [attr.width]=\"cardWidth\" [attr.height]=\"cardHeight\" rx=\"3\" ry=\"3\" />\n      <svg:path\n        *ngIf=\"bandColor && bandColor !== color\"\n        class=\"card-band\"\n        [attr.fill]=\"bandColor\"\n        [attr.transform]=\"transformBand\"\n        stroke=\"none\"\n        [attr.d]=\"bandPath\"\n      />\n      <title>{{ label }}</title>\n      <svg:foreignObject\n        class=\"trimmed-label\"\n        x=\"5\"\n        [attr.x]=\"textPadding[3]\"\n        [attr.y]=\"cardHeight - textPadding[2]\"\n        [attr.width]=\"textWidth\"\n        [attr.height]=\"labelFontSize + textPadding[2]\"\n        alignment-baseline=\"hanging\"\n      >\n        <xhtml:p\n          [style.color]=\"textColor\"\n          [style.fontSize.px]=\"labelFontSize\"\n          [style.lineHeight.px]=\"labelFontSize\"\n          [innerHTML]=\"formattedLabel\"\n        >\n        </xhtml:p>\n      </svg:foreignObject>\n      <svg:text\n        #textEl\n        class=\"value-text\"\n        [attr.x]=\"textPadding[3]\"\n        [attr.y]=\"textPadding[0]\"\n        [style.fill]=\"textColor\"\n        text-anchor=\"start\"\n        alignment-baseline=\"hanging\"\n        [style.font-size.pt]=\"textFontSize\"\n      >\n        {{ value }}\n      </svg:text>\n    </svg:g>\n  ",
              changeDetection: ChangeDetectionStrategy.OnPush
          }),
          __metadata("design:paramtypes", [ElementRef, ChangeDetectorRef, NgZone])
      ], CardComponent);
      return CardComponent;
  }());
  export { CardComponent };
  //# sourceMappingURL=card.component.js.map