q2-tecton-elements 1.51.0 → 1.52.0

package/dist/q2-tecton-elements/q2-chart-bar.entry.js

@@ -0,0 +1,1479 @@
+import { r as e, h as r, g as a } from "./index-7a5365e2.js";
+
+import { o as t, l as i } from "./index-d18e2a20.js";
+
+import { _ as s, I as n, S as o, b6 as h, P as u, b7 as l, o as d, a0 as c, h as f, i as v, u as p, s as g, H as b, b8 as m, G as w, m as S, d as B, C as A, W as y, a as x, g as M, b as k, b9 as P, t as V, z as C, ba as N, V as L, ai as D, bb as z, bc as j, a9 as U, aa as T, ab as I, ac as O, ad as R, ae as E, af as W } from "./charting-1abfb877.js";
+
+import { c as _, j as X, g as Y, i as H, a as F, e as q, f as Z, h as G } from "./dataSample-7b62e101.js";
+
+import { g as J, i as K } from "./sectorHelper-183cedd0.js";
+
+var Q = /** @class */ function(e) {
+  s(BaseBarSeriesModel, e);
+  function BaseBarSeriesModel() {
+    var r = e !== null && e.apply(this, arguments) || this;
+    r.type = BaseBarSeriesModel.type;
+    return r;
+  }
+  BaseBarSeriesModel.prototype.getInitialData = function(e, r) {
+    return _(null, this, {
+      useEncodeDefaulter: true
+    });
+  };
+  BaseBarSeriesModel.prototype.getMarkerPosition = function(e, r, a) {
+    var t = this.coordinateSystem;
+    if (t && t.clampData) {
+      // PENDING if clamp ?
+      var i = t.clampData(e);
+      var s = t.dataToPoint(i);
+      if (a) {
+        n(t.getAxes(), (function(e, a) {
+          // If axis type is category, use tick coords instead
+          if (e.type === "category" && r != null) {
+            var t = e.getTicksCoords();
+            var n = e.getTickModel().get("alignWithLabel");
+            var o = i[a];
+            // The index of rightmost tick of markArea is 1 larger than x1/y1 index
+                        var h = r[a] === "x1" || r[a] === "y1";
+            if (h && !n) {
+              o += 1;
+            }
+            // The only contains one tick, tickCoords is
+            // like [{coord: 0, tickValue: 0}, {coord: 0}]
+            // to the length should always be larger than 1
+                        if (t.length < 2) {
+              return;
+            } else if (t.length === 2) {
+              // The left value and right value of the axis are
+              // the same. coord is 0 in both items. Use the max
+              // value of the axis as the coord
+              s[a] = e.toGlobalCoord(e.getExtent()[h ? 1 : 0]);
+              return;
+            }
+            var u = void 0;
+            var l = void 0;
+            var d = 1;
+            for (var c = 0; c < t.length; c++) {
+              var f = t[c].coord;
+              // The last item of tickCoords doesn't contain
+              // tickValue
+                            var v = c === t.length - 1 ? t[c - 1].tickValue + d : t[c].tickValue;
+              if (v === o) {
+                l = f;
+                break;
+              } else if (v < o) {
+                u = f;
+              } else if (u != null && v > o) {
+                l = (f + u) / 2;
+                break;
+              }
+              if (c === 1) {
+                // Here we assume the step of category axes is
+                // the same
+                d = v - t[0].tickValue;
+              }
+            }
+            if (l == null) {
+              if (!u) {
+                // targetTickId is smaller than all tick ids in the
+                // visible area, use the leftmost tick coord
+                l = t[0].coord;
+              } else if (u) {
+                // targetTickId is larger than all tick ids in the
+                // visible area, use the rightmost tick coord
+                l = t[t.length - 1].coord;
+              }
+            }
+            s[a] = e.toGlobalCoord(l);
+          }
+        }));
+      } else {
+        var o = this.getData();
+        var h = o.getLayout("offset");
+        var u = o.getLayout("size");
+        var l = t.getBaseAxis().isHorizontal() ? 0 : 1;
+        s[l] += h + u / 2;
+      }
+      return s;
+    }
+    return [ NaN, NaN ];
+  };
+  BaseBarSeriesModel.type = "series.__base_bar__";
+  BaseBarSeriesModel.defaultOption = {
+    // zlevel: 0,
+    z: 2,
+    coordinateSystem: "cartesian2d",
+    legendHoverLink: true,
+    // stack: null
+    // Cartesian coordinate system
+    // xAxisIndex: 0,
+    // yAxisIndex: 0,
+    barMinHeight: 0,
+    barMinAngle: 0,
+    // cursor: null,
+    large: false,
+    largeThreshold: 400,
+    progressive: 3e3,
+    progressiveChunkMode: "mod"
+  };
+  return BaseBarSeriesModel;
+}(o);
+
+o.registerClass(Q);
+
+const $ = Q;
+
+var ee = /** @class */ function(e) {
+  s(BarSeriesModel, e);
+  function BarSeriesModel() {
+    var r = e !== null && e.apply(this, arguments) || this;
+    r.type = BarSeriesModel.type;
+    return r;
+  }
+  BarSeriesModel.prototype.getInitialData = function() {
+    return _(null, this, {
+      useEncodeDefaulter: true,
+      createInvertedIndices: !!this.get("realtimeSort", true) || null
+    });
+  };
+  /**
+   * @override
+   */  BarSeriesModel.prototype.getProgressive = function() {
+    // Do not support progressive in normal mode.
+    return this.get("large") ? this.get("progressive") : false;
+  };
+  /**
+   * @override
+   */  BarSeriesModel.prototype.getProgressiveThreshold = function() {
+    // Do not support progressive in normal mode.
+    var e = this.get("progressiveThreshold");
+    var r = this.get("largeThreshold");
+    if (r > e) {
+      e = r;
+    }
+    return e;
+  };
+  BarSeriesModel.prototype.brushSelector = function(e, r, a) {
+    return a.rect(r.getItemLayout(e));
+  };
+  BarSeriesModel.type = "series.bar";
+  BarSeriesModel.dependencies = [ "grid", "polar" ];
+  BarSeriesModel.defaultOption = h($.defaultOption, {
+    // If clipped
+    // Only available on cartesian2d
+    clip: true,
+    roundCap: false,
+    showBackground: false,
+    backgroundStyle: {
+      color: "rgba(180, 180, 180, 0.2)",
+      borderColor: null,
+      borderWidth: 0,
+      borderType: "solid",
+      borderRadius: 0,
+      shadowBlur: 0,
+      shadowColor: null,
+      shadowOffsetX: 0,
+      shadowOffsetY: 0,
+      opacity: 1
+    },
+    select: {
+      itemStyle: {
+        borderColor: "#212121"
+      }
+    },
+    realtimeSort: false
+  });
+  return BarSeriesModel;
+}($);
+
+const re = ee;
+
+/**
+ * Sausage: similar to sector, but have half circle on both sides
+ */ var ae = /** @class */ function() {
+  function SausageShape() {
+    this.cx = 0;
+    this.cy = 0;
+    this.r0 = 0;
+    this.r = 0;
+    this.startAngle = 0;
+    this.endAngle = Math.PI * 2;
+    this.clockwise = true;
+  }
+  return SausageShape;
+}();
+
+var te = /** @class */ function(e) {
+  s(SausagePath, e);
+  function SausagePath(r) {
+    var a = e.call(this, r) || this;
+    a.type = "sausage";
+    return a;
+  }
+  SausagePath.prototype.getDefaultShape = function() {
+    return new ae;
+  };
+  SausagePath.prototype.buildPath = function(e, r) {
+    var a = r.cx;
+    var t = r.cy;
+    var i = Math.max(r.r0 || 0, 0);
+    var s = Math.max(r.r, 0);
+    var n = (s - i) * .5;
+    var o = i + n;
+    var h = r.startAngle;
+    var u = r.endAngle;
+    var l = r.clockwise;
+    var d = Math.PI * 2;
+    var c = l ? u - h < d : h - u < d;
+    if (!c) {
+      // Normalize angles
+      h = u - (l ? d : -d);
+    }
+    var f = Math.cos(h);
+    var v = Math.sin(h);
+    var p = Math.cos(u);
+    var g = Math.sin(u);
+    if (c) {
+      e.moveTo(f * i + a, v * i + t);
+      e.arc(f * o + a, v * o + t, n, -Math.PI + h, h, !l);
+    } else {
+      e.moveTo(f * s + a, v * s + t);
+    }
+    e.arc(a, t, s, h, u, !l);
+    e.arc(p * o + a, g * o + t, n, u - Math.PI * 2, u - Math.PI, !l);
+    if (i !== 0) {
+      e.arc(a, t, i, u, h, l);
+    }
+    // ctx.closePath();
+    };
+  return SausagePath;
+}(u);
+
+const ie = te;
+
+function createSectorCalculateTextPosition(e, r) {
+  r = r || {};
+  var a = r.isRoundCap;
+  return function(r, t, i) {
+    var s = t.position;
+    if (!s || s instanceof Array) {
+      return l(r, t, i);
+    }
+    var n = e(s);
+    var o = t.distance != null ? t.distance : 5;
+    var h = this.shape;
+    var u = h.cx;
+    var d = h.cy;
+    var c = h.r;
+    var f = h.r0;
+    var v = (c + f) / 2;
+    var p = h.startAngle;
+    var g = h.endAngle;
+    var b = (p + g) / 2;
+    var m = a ? Math.abs(c - f) / 2 : 0;
+    var w = Math.cos;
+    var S = Math.sin;
+    // base position: top-left
+        var B = u + c * w(p);
+    var A = d + c * S(p);
+    var y = "left";
+    var x = "top";
+    switch (n) {
+     case "startArc":
+      B = u + (f - o) * w(b);
+      A = d + (f - o) * S(b);
+      y = "center";
+      x = "top";
+      break;
+
+     case "insideStartArc":
+      B = u + (f + o) * w(b);
+      A = d + (f + o) * S(b);
+      y = "center";
+      x = "bottom";
+      break;
+
+     case "startAngle":
+      B = u + v * w(p) + adjustAngleDistanceX(p, o + m, false);
+      A = d + v * S(p) + adjustAngleDistanceY(p, o + m, false);
+      y = "right";
+      x = "middle";
+      break;
+
+     case "insideStartAngle":
+      B = u + v * w(p) + adjustAngleDistanceX(p, -o + m, false);
+      A = d + v * S(p) + adjustAngleDistanceY(p, -o + m, false);
+      y = "left";
+      x = "middle";
+      break;
+
+     case "middle":
+      B = u + v * w(b);
+      A = d + v * S(b);
+      y = "center";
+      x = "middle";
+      break;
+
+     case "endArc":
+      B = u + (c + o) * w(b);
+      A = d + (c + o) * S(b);
+      y = "center";
+      x = "bottom";
+      break;
+
+     case "insideEndArc":
+      B = u + (c - o) * w(b);
+      A = d + (c - o) * S(b);
+      y = "center";
+      x = "top";
+      break;
+
+     case "endAngle":
+      B = u + v * w(g) + adjustAngleDistanceX(g, o + m, true);
+      A = d + v * S(g) + adjustAngleDistanceY(g, o + m, true);
+      y = "left";
+      x = "middle";
+      break;
+
+     case "insideEndAngle":
+      B = u + v * w(g) + adjustAngleDistanceX(g, -o + m, true);
+      A = d + v * S(g) + adjustAngleDistanceY(g, -o + m, true);
+      y = "right";
+      x = "middle";
+      break;
+
+     default:
+      return l(r, t, i);
+    }
+    r = r || {};
+    r.x = B;
+    r.y = A;
+    r.align = y;
+    r.verticalAlign = x;
+    return r;
+  };
+}
+
+function setSectorTextRotation(e, r, a, t) {
+  if (d(t)) {
+    // user-set rotation
+    e.setTextConfig({
+      rotation: t
+    });
+    return;
+  } else if (c(r)) {
+    // user-set position, use 0 as auto rotation
+    e.setTextConfig({
+      rotation: 0
+    });
+    return;
+  }
+  var i = e.shape;
+  var s = i.clockwise ? i.startAngle : i.endAngle;
+  var n = i.clockwise ? i.endAngle : i.startAngle;
+  var o = (s + n) / 2;
+  var h;
+  var u = a(r);
+  switch (u) {
+   case "startArc":
+   case "insideStartArc":
+   case "middle":
+   case "insideEndArc":
+   case "endArc":
+    h = o;
+    break;
+
+   case "startAngle":
+   case "insideStartAngle":
+    h = s;
+    break;
+
+   case "endAngle":
+   case "insideEndAngle":
+    h = n;
+    break;
+
+   default:
+    e.setTextConfig({
+      rotation: 0
+    });
+    return;
+  }
+  var l = Math.PI * 1.5 - h;
+  /**
+   * TODO: labels with rotate > Math.PI / 2 should be rotate another
+   * half round flipped to increase readability. However, only middle
+   * position supports this for now, because in other positions, the
+   * anchor point is not at the center of the text, so the positions
+   * after rotating is not as expected.
+   */  if (u === "middle" && l > Math.PI / 2 && l < Math.PI * 1.5) {
+    l -= Math.PI;
+  }
+  e.setTextConfig({
+    rotation: l
+  });
+}
+
+function adjustAngleDistanceX(e, r, a) {
+  return r * Math.sin(e) * (a ? -1 : 1);
+}
+
+function adjustAngleDistanceY(e, r, a) {
+  return r * Math.cos(e) * (a ? 1 : -1);
+}
+
+var se = Math.max;
+
+var ne = Math.min;
+
+function getClipArea(e, r) {
+  var a = e.getArea && e.getArea();
+  if (H(e, "cartesian2d")) {
+    var t = e.getBaseAxis();
+    // When boundaryGap is false or using time axis. bar may exceed the grid.
+    // We should not clip this part.
+    // See test/bar2.html
+        if (t.type !== "category" || !t.onBand) {
+      var i = r.getLayout("bandWidth");
+      if (t.isHorizontal()) {
+        a.x -= i;
+        a.width += i * 2;
+      } else {
+        a.y -= i;
+        a.height += i * 2;
+      }
+    }
+  }
+  return a;
+}
+
+var oe = /** @class */ function(e) {
+  s(BarView, e);
+  function BarView() {
+    var r = e.call(this) || this;
+    r.type = BarView.type;
+    r._isFirstFrame = true;
+    return r;
+  }
+  BarView.prototype.render = function(e, r, a, t) {
+    this._model = e;
+    this._removeOnRenderedListener(a);
+    this._updateDrawMode(e);
+    var i = e.get("coordinateSystem");
+    if (i === "cartesian2d" || i === "polar") {
+      // Clear previously rendered progressive elements.
+      this._progressiveEls = null;
+      this._isLargeDraw ? this._renderLarge(e, r, a) : this._renderNormal(e, r, a, t);
+    }
+  };
+  BarView.prototype.incrementalPrepareRender = function(e) {
+    this._clear();
+    this._updateDrawMode(e);
+    // incremental also need to clip, otherwise might be overlow.
+    // But must not set clip in each frame, otherwise all of the children will be marked redraw.
+        this._updateLargeClip(e);
+  };
+  BarView.prototype.incrementalRender = function(e, r) {
+    // Reset
+    this._progressiveEls = [];
+    // Do not support progressive in normal mode.
+        this._incrementalRenderLarge(e, r);
+  };
+  BarView.prototype.eachRendered = function(e) {
+    f(this._progressiveEls || this.group, e);
+  };
+  BarView.prototype._updateDrawMode = function(e) {
+    var r = e.pipelineContext.large;
+    if (this._isLargeDraw == null || r !== this._isLargeDraw) {
+      this._isLargeDraw = r;
+      this._clear();
+    }
+  };
+  BarView.prototype._renderNormal = function(e, r, a, t) {
+    var i = this.group;
+    var s = e.getData();
+    var n = this._data;
+    var o = e.coordinateSystem;
+    var h = o.getBaseAxis();
+    var u;
+    if (o.type === "cartesian2d") {
+      u = h.isHorizontal();
+    } else if (o.type === "polar") {
+      u = h.dim === "angle";
+    }
+    var l = e.isAnimationEnabled() ? e : null;
+    var d = shouldRealtimeSort(e, o);
+    if (d) {
+      this._enableRealtimeSort(d, s, a);
+    }
+    var c = e.get("clip", true) || d;
+    var f = getClipArea(o, s);
+    // If there is clipPath created in large mode. Remove it.
+        i.removeClipPath();
+    // We don't use clipPath in normal mode because we needs a perfect animation
+    // And don't want the label are clipped.
+        var S = e.get("roundCap", true);
+    var B = e.get("showBackground", true);
+    var A = e.getModel("backgroundStyle");
+    var y = A.get("borderRadius") || 0;
+    var x = [];
+    var M = this._backgroundEls;
+    var k = t && t.isInitSort;
+    var P = t && t.type === "changeAxisOrder";
+    function createBackground(e) {
+      var r = fe[o.type](s, e);
+      var a = createBackgroundEl(o, u, r);
+      a.useStyle(A.getItemStyle());
+      // Only cartesian2d support borderRadius.
+            if (o.type === "cartesian2d") {
+        a.setShape("r", y);
+      } else {
+        a.setShape("cornerRadius", y);
+      }
+      x[e] = a;
+      return a;
+    }
+    s.diff(n).add((function(r) {
+      var a = s.getItemModel(r);
+      var t = fe[o.type](s, r, a);
+      if (B) {
+        createBackground(r);
+      }
+      // If dataZoom in filteMode: 'empty', the baseValue can be set as NaN in "axisProxy".
+            if (!s.hasValue(r) || !ce[o.type](t)) {
+        return;
+      }
+      var n = false;
+      if (c) {
+        // Clip will modify the layout params.
+        // And return a boolean to determine if the shape are fully clipped.
+        n = he[o.type](f, t);
+      }
+      var p = ue[o.type](e, s, r, t, u, l, h.model, false, S);
+      if (d) {
+        /**
+         * Force label animation because even if the element is
+         * ignored because it's clipped, it may not be clipped after
+         * changing order. Then, if not using forceLabelAnimation,
+         * the label animation was never started, in which case,
+         * the label will be the final value and doesn't have label
+         * animation.
+         */
+        p.forceLabelAnimation = true;
+      }
+      updateStyle(p, s, r, a, t, e, u, o.type === "polar");
+      if (k) {
+        p.attr({
+          shape: t
+        });
+      } else if (d) {
+        updateRealtimeAnimation(d, l, p, t, r, u, false, false);
+      } else {
+        v(p, {
+          shape: t
+        }, e, r);
+      }
+      s.setItemGraphicEl(r, p);
+      i.add(p);
+      p.ignore = n;
+    })).update((function(r, a) {
+      var t = s.getItemModel(r);
+      var v = fe[o.type](s, r, t);
+      if (B) {
+        var m = void 0;
+        if (M.length === 0) {
+          m = createBackground(a);
+        } else {
+          m = M[a];
+          m.useStyle(A.getItemStyle());
+          // Only cartesian2d support borderRadius.
+                    if (o.type === "cartesian2d") {
+            m.setShape("r", y);
+          } else {
+            m.setShape("cornerRadius", y);
+          }
+          x[r] = m;
+        }
+        var w = fe[o.type](s, r);
+        var V = createBackgroundShape(u, w, o);
+        p(m, {
+          shape: V
+        }, l, r);
+      }
+      var C = n.getItemGraphicEl(a);
+      if (!s.hasValue(r) || !ce[o.type](v)) {
+        i.remove(C);
+        return;
+      }
+      var N = false;
+      if (c) {
+        N = he[o.type](f, v);
+        if (N) {
+          i.remove(C);
+        }
+      }
+      if (!C) {
+        C = ue[o.type](e, s, r, v, u, l, h.model, !!C, S);
+      } else {
+        g(C);
+      }
+      if (d) {
+        C.forceLabelAnimation = true;
+      }
+      if (P) {
+        var L = C.getTextContent();
+        if (L) {
+          var D = b(L);
+          if (D.prevValue != null) {
+            /**
+             * Set preValue to be value so that no new label
+             * should be started, otherwise, it will take a full
+             * `animationDurationUpdate` time to finish the
+             * animation, which is not expected.
+             */
+            D.prevValue = D.value;
+          }
+        }
+      }
+      // Not change anything if only order changed.
+      // Especially not change label.
+       else {
+        updateStyle(C, s, r, t, v, e, u, o.type === "polar");
+      }
+      if (k) {
+        C.attr({
+          shape: v
+        });
+      } else if (d) {
+        updateRealtimeAnimation(d, l, C, v, r, u, true, P);
+      } else {
+        p(C, {
+          shape: v
+        }, e, r, null);
+      }
+      s.setItemGraphicEl(r, C);
+      C.ignore = N;
+      i.add(C);
+    })).remove((function(r) {
+      var a = n.getItemGraphicEl(r);
+      a && m(a, e, r);
+    })).execute();
+    var V = this._backgroundGroup || (this._backgroundGroup = new w);
+    V.removeAll();
+    for (var C = 0; C < x.length; ++C) {
+      V.add(x[C]);
+    }
+    i.add(V);
+    this._backgroundEls = x;
+    this._data = s;
+  };
+  BarView.prototype._renderLarge = function(e, r, a) {
+    this._clear();
+    createLarge(e, this.group);
+    this._updateLargeClip(e);
+  };
+  BarView.prototype._incrementalRenderLarge = function(e, r) {
+    this._removeBackground();
+    createLarge(r, this.group, this._progressiveEls, true);
+  };
+  BarView.prototype._updateLargeClip = function(e) {
+    // Use clipPath in large mode.
+    var r = e.get("clip", true) && X(e.coordinateSystem, false, e);
+    var a = this.group;
+    if (r) {
+      a.setClipPath(r);
+    } else {
+      a.removeClipPath();
+    }
+  };
+  BarView.prototype._enableRealtimeSort = function(e, r, a) {
+    var t = this;
+    // If no data in the first frame, wait for data to initSort
+        if (!r.count()) {
+      return;
+    }
+    var i = e.baseAxis;
+    if (this._isFirstFrame) {
+      this._dispatchInitSort(r, e, a);
+      this._isFirstFrame = false;
+    } else {
+      var orderMapping_1 = function(e) {
+        var a = r.getItemGraphicEl(e);
+        var t = a && a.shape;
+        return t && 
+        // The result should be consistent with the initial sort by data value.
+        // Do not support the case that both positive and negative exist.
+        Math.abs(i.isHorizontal() ? t.height : t.width) || 0;
+      };
+      this._onRendered = function() {
+        t._updateSortWithinSameData(r, orderMapping_1, i, a);
+      };
+      a.getZr().on("rendered", this._onRendered);
+    }
+  };
+  BarView.prototype._dataSort = function(e, r, a) {
+    var t = [];
+    e.each(e.mapDimension(r.dim), (function(e, r) {
+      var i = a(r);
+      i = i == null ? NaN : i;
+      t.push({
+        dataIndex: r,
+        mappedValue: i,
+        ordinalNumber: e
+      });
+    }));
+    t.sort((function(e, r) {
+      // If NaN, it will be treated as min val.
+      return r.mappedValue - e.mappedValue;
+    }));
+    return {
+      ordinalNumbers: S(t, (function(e) {
+        return e.ordinalNumber;
+      }))
+    };
+  };
+  BarView.prototype._isOrderChangedWithinSameData = function(e, r, a) {
+    var t = a.scale;
+    var i = e.mapDimension(a.dim);
+    var s = Number.MAX_VALUE;
+    for (var n = 0, o = t.getOrdinalMeta().categories.length; n < o; ++n) {
+      var h = e.rawIndexOf(i, t.getRawOrdinalNumber(n));
+      var u = h < 0 ? Number.MIN_VALUE : r(e.indexOfRawIndex(h));
+      if (u > s) {
+        return true;
+      }
+      s = u;
+    }
+    return false;
+  };
+  /*
+   * Consider the case when A and B changed order, whose representing
+   * bars are both out of sight, we don't wish to trigger reorder action
+   * as long as the order in the view doesn't change.
+   */  BarView.prototype._isOrderDifferentInView = function(e, r) {
+    var a = r.scale;
+    var t = a.getExtent();
+    var i = Math.max(0, t[0]);
+    var s = Math.min(t[1], a.getOrdinalMeta().categories.length - 1);
+    for (;i <= s; ++i) {
+      if (e.ordinalNumbers[i] !== a.getRawOrdinalNumber(i)) {
+        return true;
+      }
+    }
+  };
+  BarView.prototype._updateSortWithinSameData = function(e, r, a, t) {
+    if (!this._isOrderChangedWithinSameData(e, r, a)) {
+      return;
+    }
+    var i = this._dataSort(e, a, r);
+    if (this._isOrderDifferentInView(i, a)) {
+      this._removeOnRenderedListener(t);
+      t.dispatchAction({
+        type: "changeAxisOrder",
+        componentType: a.dim + "Axis",
+        axisId: a.index,
+        sortInfo: i
+      });
+    }
+  };
+  BarView.prototype._dispatchInitSort = function(e, r, a) {
+    var t = r.baseAxis;
+    var i = this._dataSort(e, t, (function(a) {
+      return e.get(e.mapDimension(r.otherAxis.dim), a);
+    }));
+    a.dispatchAction({
+      type: "changeAxisOrder",
+      componentType: t.dim + "Axis",
+      isInitSort: true,
+      axisId: t.index,
+      sortInfo: i
+    });
+  };
+  BarView.prototype.remove = function(e, r) {
+    this._clear(this._model);
+    this._removeOnRenderedListener(r);
+  };
+  BarView.prototype.dispose = function(e, r) {
+    this._removeOnRenderedListener(r);
+  };
+  BarView.prototype._removeOnRenderedListener = function(e) {
+    if (this._onRendered) {
+      e.getZr().off("rendered", this._onRendered);
+      this._onRendered = null;
+    }
+  };
+  BarView.prototype._clear = function(e) {
+    var r = this.group;
+    var a = this._data;
+    if (e && e.isAnimationEnabled() && a && !this._isLargeDraw) {
+      this._removeBackground();
+      this._backgroundEls = [];
+      a.eachItemGraphicEl((function(r) {
+        m(r, e, B(r).dataIndex);
+      }));
+    } else {
+      r.removeAll();
+    }
+    this._data = null;
+    this._isFirstFrame = true;
+  };
+  BarView.prototype._removeBackground = function() {
+    this.group.remove(this._backgroundGroup);
+    this._backgroundGroup = null;
+  };
+  BarView.type = "bar";
+  return BarView;
+}(A);
+
+var he = {
+  cartesian2d: function(e, r) {
+    var a = r.width < 0 ? -1 : 1;
+    var t = r.height < 0 ? -1 : 1;
+    // Needs positive width and height
+        if (a < 0) {
+      r.x += r.width;
+      r.width = -r.width;
+    }
+    if (t < 0) {
+      r.y += r.height;
+      r.height = -r.height;
+    }
+    var i = e.x + e.width;
+    var s = e.y + e.height;
+    var n = se(r.x, e.x);
+    var o = ne(r.x + r.width, i);
+    var h = se(r.y, e.y);
+    var u = ne(r.y + r.height, s);
+    var l = o < n;
+    var d = u < h;
+    // When xClipped or yClipped, the element will be marked as `ignore`.
+    // But we should also place the element at the edge of the coord sys bounding rect.
+    // Because if data changed and the bar shows again, its transition animation
+    // will begin at this place.
+        r.x = l && n > i ? o : n;
+    r.y = d && h > s ? u : h;
+    r.width = l ? 0 : o - n;
+    r.height = d ? 0 : u - h;
+    // Reverse back
+        if (a < 0) {
+      r.x += r.width;
+      r.width = -r.width;
+    }
+    if (t < 0) {
+      r.y += r.height;
+      r.height = -r.height;
+    }
+    return l || d;
+  },
+  polar: function(e, r) {
+    var a = r.r0 <= r.r ? 1 : -1;
+    // Make sure r is larger than r0
+        if (a < 0) {
+      var t = r.r;
+      r.r = r.r0;
+      r.r0 = t;
+    }
+    var i = ne(r.r, e.r);
+    var s = se(r.r0, e.r0);
+    r.r = i;
+    r.r0 = s;
+    var n = i - s < 0;
+    // Reverse back
+        if (a < 0) {
+      var t = r.r;
+      r.r = r.r0;
+      r.r0 = t;
+    }
+    return n;
+  }
+};
+
+var ue = {
+  cartesian2d: function(e, r, a, t, i, s, n, o, h) {
+    var u = new y({
+      shape: x({}, t),
+      z2: 1
+    });
+    u.__dataIndex = a;
+    u.name = "item";
+    if (s) {
+      var l = u.shape;
+      var d = i ? "height" : "width";
+      l[d] = 0;
+    }
+    return u;
+  },
+  polar: function(e, r, a, t, i, s, n, o, h) {
+    var u = !i && h ? ie : L;
+    var l = new u({
+      shape: t,
+      z2: 1
+    });
+    l.name = "item";
+    var d = createPolarPositionMapping(i);
+    l.calculateTextPosition = createSectorCalculateTextPosition(d, {
+      isRoundCap: u === ie
+    });
+    // Animation
+        if (s) {
+      var c = l.shape;
+      var f = i ? "r" : "endAngle";
+      var g = {};
+      c[f] = i ? t.r0 : t.startAngle;
+      g[f] = t[f];
+      (o ? p : v)(l, {
+        shape: g
+      }, s);
+    }
+    return l;
+  }
+};
+
+function shouldRealtimeSort(e, r) {
+  var a = e.get("realtimeSort", true);
+  var t = r.getBaseAxis();
+  if (a && t.type === "category" && r.type === "cartesian2d") {
+    return {
+      baseAxis: t,
+      otherAxis: r.getOtherAxis(t)
+    };
+  }
+}
+
+function updateRealtimeAnimation(e, r, a, t, i, s, n, o) {
+  var h;
+  var u;
+  if (s) {
+    u = {
+      x: t.x,
+      width: t.width
+    };
+    h = {
+      y: t.y,
+      height: t.height
+    };
+  } else {
+    u = {
+      y: t.y,
+      height: t.height
+    };
+    h = {
+      x: t.x,
+      width: t.width
+    };
+  }
+  if (!o) {
+    // Keep the original growth animation if only axis order changed.
+    // Not start a new animation.
+    (n ? p : v)(a, {
+      shape: h
+    }, r, i, null);
+  }
+  var l = r ? e.baseAxis.model : null;
+  (n ? p : v)(a, {
+    shape: u
+  }, l, i);
+}
+
+function checkPropertiesNotValid(e, r) {
+  for (var a = 0; a < r.length; a++) {
+    if (!isFinite(e[r[a]])) {
+      return true;
+    }
+  }
+  return false;
+}
+
+var le = [ "x", "y", "width", "height" ];
+
+var de = [ "cx", "cy", "r", "startAngle", "endAngle" ];
+
+var ce = {
+  cartesian2d: function(e) {
+    return !checkPropertiesNotValid(e, le);
+  },
+  polar: function(e) {
+    return !checkPropertiesNotValid(e, de);
+  }
+};
+
+var fe = {
+  // itemModel is only used to get borderWidth, which is not needed
+  // when calculating bar background layout.
+  cartesian2d: function(e, r, a) {
+    var t = e.getItemLayout(r);
+    var i = a ? getLineWidth(a, t) : 0;
+    // fix layout with lineWidth
+        var s = t.width > 0 ? 1 : -1;
+    var n = t.height > 0 ? 1 : -1;
+    return {
+      x: t.x + s * i / 2,
+      y: t.y + n * i / 2,
+      width: t.width - s * i,
+      height: t.height - n * i
+    };
+  },
+  polar: function(e, r, a) {
+    var t = e.getItemLayout(r);
+    return {
+      cx: t.cx,
+      cy: t.cy,
+      r0: t.r0,
+      r: t.r,
+      startAngle: t.startAngle,
+      endAngle: t.endAngle,
+      clockwise: t.clockwise
+    };
+  }
+};
+
+function isZeroOnPolar(e) {
+  return e.startAngle != null && e.endAngle != null && e.startAngle === e.endAngle;
+}
+
+function createPolarPositionMapping(e) {
+  return function(e) {
+    var r = e ? "Arc" : "Angle";
+    return function(e) {
+      switch (e) {
+       case "start":
+       case "insideStart":
+       case "end":
+       case "insideEnd":
+        return e + r;
+
+       default:
+        return e;
+      }
+    };
+  }(e);
+}
+
+function updateStyle(e, r, a, t, i, s, o, h) {
+  var u = r.getItemVisual(a, "style");
+  if (!h) {
+    var l = t.get([ "itemStyle", "borderRadius" ]) || 0;
+    e.setShape("r", l);
+  } else if (!s.get("roundCap")) {
+    var d = e.shape;
+    var c = J(t.getModel("itemStyle"), d, true);
+    x(d, c);
+    e.setShape(d);
+  }
+  e.useStyle(u);
+  var f = t.getShallow("cursor");
+  f && e.attr("cursor", f);
+  var v = h ? o ? i.r >= i.r0 ? "endArc" : "startArc" : i.endAngle >= i.startAngle ? "endAngle" : "startAngle" : o ? i.height >= 0 ? "bottom" : "top" : i.width >= 0 ? "right" : "left";
+  var p = M(t);
+  k(e, p, {
+    labelFetcher: s,
+    labelDataIndex: a,
+    defaultText: Y(s.getData(), a),
+    inheritColor: u.fill,
+    defaultOpacity: u.opacity,
+    defaultOutsidePosition: v
+  });
+  var g = e.getTextContent();
+  if (h && g) {
+    var b = t.get([ "label", "position" ]);
+    e.textConfig.inside = b === "middle" ? true : null;
+    setSectorTextRotation(e, b === "outside" ? v : b, createPolarPositionMapping(o), t.get([ "label", "rotate" ]));
+  }
+  P(g, p, s.getRawValue(a), (function(e) {
+    return F(r, e);
+  }));
+  var m = t.getModel([ "emphasis" ]);
+  V(e, m.get("focus"), m.get("blurScope"), m.get("disabled"));
+  C(e, t);
+  if (isZeroOnPolar(i)) {
+    e.style.fill = "none";
+    e.style.stroke = "none";
+    n(e.states, (function(e) {
+      if (e.style) {
+        e.style.fill = e.style.stroke = "none";
+      }
+    }));
+  }
+}
+
+// In case width or height are too small.
+function getLineWidth(e, r) {
+  // Has no border.
+  var a = e.get([ "itemStyle", "borderColor" ]);
+  if (!a || a === "none") {
+    return 0;
+  }
+  var t = e.get([ "itemStyle", "borderWidth" ]) || 0;
+  // width or height may be NaN for empty data
+    var i = isNaN(r.width) ? Number.MAX_VALUE : Math.abs(r.width);
+  var s = isNaN(r.height) ? Number.MAX_VALUE : Math.abs(r.height);
+  return Math.min(t, i, s);
+}
+
+var ve = /** @class */ function() {
+  function LagePathShape() {}
+  return LagePathShape;
+}();
+
+var pe = /** @class */ function(e) {
+  s(LargePath, e);
+  function LargePath(r) {
+    var a = e.call(this, r) || this;
+    a.type = "largeBar";
+    return a;
+  }
+  LargePath.prototype.getDefaultShape = function() {
+    return new ve;
+  };
+  LargePath.prototype.buildPath = function(e, r) {
+    // Drawing lines is more efficient than drawing
+    // a whole line or drawing rects.
+    var a = r.points;
+    var t = this.baseDimIdx;
+    var i = 1 - this.baseDimIdx;
+    var s = [];
+    var n = [];
+    var o = this.barWidth;
+    for (var h = 0; h < a.length; h += 3) {
+      n[t] = o;
+      n[i] = a[h + 2];
+      s[t] = a[h + t];
+      s[i] = a[h + i];
+      e.rect(s[0], s[1], n[0], n[1]);
+    }
+  };
+  return LargePath;
+}(u);
+
+function createLarge(e, r, a, t) {
+  // TODO support polar
+  var i = e.getData();
+  var s = i.getLayout("valueAxisHorizontal") ? 1 : 0;
+  var n = i.getLayout("largeDataIndices");
+  var o = i.getLayout("size");
+  var h = e.getModel("backgroundStyle");
+  var u = i.getLayout("largeBackgroundPoints");
+  if (u) {
+    var l = new pe({
+      shape: {
+        points: u
+      },
+      incremental: !!t,
+      silent: true,
+      z2: 0
+    });
+    l.baseDimIdx = s;
+    l.largeDataIndices = n;
+    l.barWidth = o;
+    l.useStyle(h.getItemStyle());
+    r.add(l);
+    a && a.push(l);
+  }
+  var d = new pe({
+    shape: {
+      points: i.getLayout("largePoints")
+    },
+    incremental: !!t,
+    ignoreCoarsePointer: true,
+    z2: 1
+  });
+  d.baseDimIdx = s;
+  d.largeDataIndices = n;
+  d.barWidth = o;
+  r.add(d);
+  d.useStyle(i.getVisual("style"));
+  // Enable tooltip and user mouse/touch event handlers.
+    B(d).seriesIndex = e.seriesIndex;
+  if (!e.get("silent")) {
+    d.on("mousedown", ge);
+    d.on("mousemove", ge);
+  }
+  a && a.push(d);
+}
+
+// Use throttle to avoid frequently traverse to find dataIndex.
+var ge = N((function(e) {
+  var r = this;
+  var a = largePathFindDataIndex(r, e.offsetX, e.offsetY);
+  B(r).dataIndex = a >= 0 ? a : null;
+}), 30, false);
+
+function largePathFindDataIndex(e, r, a) {
+  var t = e.baseDimIdx;
+  var i = 1 - t;
+  var s = e.shape.points;
+  var n = e.largeDataIndices;
+  var o = [];
+  var h = [];
+  var u = e.barWidth;
+  for (var l = 0, d = s.length / 3; l < d; l++) {
+    var c = l * 3;
+    h[t] = u;
+    h[i] = s[c + 2];
+    o[t] = s[c + t];
+    o[i] = s[c + i];
+    if (h[i] < 0) {
+      o[i] += h[i];
+      h[i] = -h[i];
+    }
+    if (r >= o[0] && r <= o[0] + h[0] && a >= o[1] && a <= o[1] + h[1]) {
+      return n[l];
+    }
+  }
+  return -1;
+}
+
+function createBackgroundShape(e, r, a) {
+  if (H(a, "cartesian2d")) {
+    var t = r;
+    var i = a.getArea();
+    return {
+      x: e ? t.x : i.x,
+      y: e ? i.y : t.y,
+      width: e ? t.width : i.width,
+      height: e ? i.height : t.height
+    };
+  } else {
+    var i = a.getArea();
+    var s = r;
+    return {
+      cx: i.cx,
+      cy: i.cy,
+      r0: e ? i.r0 : s.r0,
+      r: e ? i.r : s.r,
+      startAngle: e ? s.startAngle : 0,
+      endAngle: e ? s.endAngle : Math.PI * 2
+    };
+  }
+}
+
+function createBackgroundEl(e, r, a) {
+  var t = e.type === "polar" ? L : y;
+  return new t({
+    shape: createBackgroundShape(r, a, e),
+    silent: true,
+    z2: 0
+  });
+}
+
+const be = oe;
+
+function install(e) {
+  e.registerChartView(be);
+  e.registerSeriesModel(re);
+  e.registerLayout(e.PRIORITY.VISUAL.LAYOUT, D(j, "bar"));
+  // Do layout after other overall layout, which can prepare some information.
+    e.registerLayout(e.PRIORITY.VISUAL.PROGRESSIVE_LAYOUT, z("bar"));
+  // Down sample after filter
+    e.registerProcessor(e.PRIORITY.PROCESSOR.STATISTIC, q("bar"));
+  /**
+   * @payload
+   * @property {string} [componentType=series]
+   * @property {number} [dx]
+   * @property {number} [dy]
+   * @property {number} [zoom]
+   * @property {number} [originX]
+   * @property {number} [originY]
+   */  e.registerAction({
+    type: "changeAxisOrder",
+    event: "changeAxisOrder",
+    update: "update"
+  }, (function(e, r) {
+    var a = e.componentType || "series";
+    r.eachComponent({
+      mainType: a,
+      query: e
+    }, (function(r) {
+      if (e.sortInfo) {
+        r.axis.setCategorySortInfo(e.sortInfo);
+      }
+    }));
+  }));
+}
+
+const me = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{width:var(--tct-bar-chart-width, 100%);height:var(--tct-bar-chart-height, 100%);display:block}.container{width:100%;height:100%}.chart-container{width:100%;height:100%}";
+
+const we = me;
+
+U([ T, install, I, K, Z, G ]);
+
+const Se = class {
+  constructor(r) {
+    e(this, r);
+    this.alignChartName = undefined;
+    this.chartName = undefined;
+    this.chartSubTitle = undefined;
+    this.color = undefined;
+    this.data = [];
+    this.dataNamesOverflow = undefined;
+    this.dataNamesWidth = undefined;
+    this.format = undefined;
+    this.formatModifier = undefined;
+    this.gridPadding = undefined;
+    this.hideBarLabels = false;
+    this.hideValueAxisLabels = false;
+    this.offsetDataNames = false;
+    this.offsetDataValues = false;
+    this.orientation = undefined;
+    this.showChartName = false;
+    this.sort = false;
+  }
+  // #endregion
+  // #region Component Lifecycle Events
+  disconnectedCallback() {
+    window.removeEventListener("resize", this.resizeEventListener);
+  }
+  componentDidLoad() {
+    const e = O(this.chartContainer);
+    this.chart = e;
+    this.resizeEventListener = () => this.resizeChart();
+    window.addEventListener("resize", this.resizeEventListener);
+    this.cacheComputedStyles();
+    this.updateChart(e);
+    this.setupChartEvents(e);
+    t(this.hostElement);
+  }
+  // #endregion
+  // #region Watchers
+  propsUpdates() {
+    this.updateChart(this.chart);
+  }
+  // #endregion
+  // #region Local Methods
+  cacheComputedStyles() {
+    this.chartContainerStyles = getComputedStyle(this.chartContainer);
+    this.hostElementStyles = getComputedStyle(this.hostElement);
+  }
+  getColor(e) {
+    const r = R("var(--t-primary)", this.chartContainerStyles, this.hostElementStyles);
+    const a = R(this.color, this.chartContainerStyles, this.hostElementStyles);
+    const t = R(e, this.chartContainerStyles, this.hostElementStyles);
+    if (t) return t;
+    if (E(e)) return e;
+    if (a) return a;
+    if (E(this.color)) return this.color;
+    return r;
+  }
+  processData(e) {
+    return e.map((e => ({
+      value: e.value || 0,
+      itemStyle: {
+        color: this.getColor(e.color)
+      }
+    })));
+  }
+  resizeChart() {
+    this.chart.resize();
+  }
+  setupChartEvents(e) {
+    e.on("finished", (() => {
+      var r;
+      const a = e.getDom().querySelector("canvas");
+      if ((r = a === null || a === void 0 ? void 0 : a.hasAttribute("aria-hidden")) !== null && r !== void 0 ? r : false) return;
+      a.setAttribute("aria-hidden", "true");
+    }));
+  }
+  updateChart(e) {
+    var r;
+    const a = ((r = this.formatModifier) === null || r === void 0 ? void 0 : r.includes("dec")) ? this.formatModifier.replace("dec", "") : 0;
+    const t = {
+      type: "value",
+      axisLabel: {
+        formatter: e => W(e, {
+          type: this.format,
+          decimals: a
+        }),
+        rotate: this.offsetDataValues ? 45 : 0,
+        margin: this.offsetDataValues ? 15 : 8,
+        show: !this.hideValueAxisLabels
+      }
+    };
+    const s = {
+      type: "category",
+      data: this.data.map((e => i(e.name) || "")),
+      axisLabel: {
+        rotate: this.offsetDataNames ? 45 : 0,
+        margin: this.offsetDataNames ? 15 : 8,
+        interval: 0,
+        width: this.dataNamesWidth || 50,
+        overflow: this.dataNamesOverflow || "none",
+        truncate: "ellipsis"
+      },
+      axisTick: {
+        alignWithLabel: this.offsetDataNames
+      }
+    };
+    return e.setOption({
+      aria: {
+        enabled: true
+      },
+      title: {
+        text: i(this.chartName),
+        show: this.showChartName,
+        left: this.alignChartName,
+        subtext: this.chartSubTitle
+      },
+      grid: Object.assign({
+        containLabel: true
+      }, this.gridPadding),
+      xAxis: this.orientation === "horizontal" ? t : s,
+      yAxis: this.orientation === "horizontal" ? s : t,
+      series: [ {
+        data: this.processData(this.data),
+        id: "bar",
+        type: "bar",
+        label: {
+          show: !this.hideBarLabels,
+          position: "top",
+          fontWeight: "bold",
+          formatter: e => W(e.value, {
+            type: this.format,
+            decimals: a
+          })
+        },
+        realtimeSort: this.sort
+      } ]
+    });
+  }
+  // #endregion
+  // #region Render Methods
+  render() {
+    return r("div", {
+      key: "b40ff8d49858ebfc55afb86a2a385bbe3c3e6851",
+      class: "container"
+    }, r("div", {
+      key: "dffb3ce8dd7e638842d58d59ef09c34f9904af56",
+      ref: e => this.chartContainer = e,
+      class: "chart-container",
+      role: "img",
+      "test-id": "barChartContainer"
+    }));
+  }
+  get hostElement() {
+    return a(this);
+  }
+  static get watchers() {
+    return {
+      chartName: [ "propsUpdates" ],
+      chartSubTitle: [ "propsUpdates" ],
+      color: [ "propsUpdates" ],
+      hideBarLabels: [ "propsUpdates" ],
+      showChartName: [ "propsUpdates" ],
+      alignChartName: [ "propsUpdates" ],
+      orientation: [ "propsUpdates" ],
+      format: [ "propsUpdates" ],
+      sort: [ "propsUpdates" ],
+      data: [ "propsUpdates" ],
+      offsetDataNames: [ "propsUpdates" ],
+      hideValueAxisLabels: [ "propsUpdates" ],
+      formatModifier: [ "propsUpdates" ],
+      dataNamesOverflow: [ "propsUpdates" ],
+      gridPadding: [ "propsUpdates" ]
+    };
+  }
+};
+
+Se.style = we;
+
+export { Se as q2_chart_bar };
+//# sourceMappingURL=q2-chart-bar.entry.js.map