@iyulab/u-widgets 0.7.1 → 0.8.1

package/dist/u-widgets-charts.js

@@ -1,204 +1,239 @@
-import { css as M, LitElement as V, nothing as P, html as E } from "lit";
-import { property as R, customElement as D } from "lit/decorators.js";
-import { a as T, t as $ } from "./tokens-x1kDxgG8.js";
-import * as z from "echarts/core";
-import { BarChart as B, LineChart as q, PieChart as W, ScatterChart as G, RadarChart as H, HeatmapChart as K, BoxplotChart as U, FunnelChart as Y, TreemapChart as J } from "echarts/charts";
-import { GridComponent as Q, TooltipComponent as X, LegendComponent as Z, RadarComponent as ee, MarkLineComponent as te, VisualMapComponent as re } from "echarts/components";
-import { CanvasRenderer as se } from "echarts/renderers";
-function ie(e) {
-  const t = e.widget, i = e.data, r = e.mapping ? T(e.mapping) : void 0, n = e.options ?? {};
+import { css as P, LitElement as E, nothing as R, html as T } from "lit";
+import { property as D, customElement as $ } from "lit/decorators.js";
+import { a as B, t as W } from "./tokens-D5aWvczs.js";
+import * as O from "echarts/core";
+import { BarChart as q, LineChart as G, PieChart as H, ScatterChart as K, RadarChart as U, HeatmapChart as Y, BoxplotChart as J, FunnelChart as Q, TreemapChart as X } from "echarts/charts";
+import { GridComponent as Z, TooltipComponent as ee, LegendComponent as te, RadarComponent as re, MarkLineComponent as ie, VisualMapComponent as se } from "echarts/components";
+import { CanvasRenderer as ne } from "echarts/renderers";
+function L(e, r) {
+  for (const i of r) {
+    const t = e[i.field];
+    if (t == null) continue;
+    const n = Number(t);
+    if (Number.isNaN(n)) continue;
+    const s = i.above === void 0 || n > i.above, d = i.below === void 0 || n < i.below;
+    if (s && d) return i;
+  }
+}
+function ae(e) {
+  const r = e.widget, i = e.data, t = e.mapping ? B(e.mapping) : void 0, n = e.options ?? {};
   if (!i) return {};
   let s;
-  switch (t) {
+  switch (r) {
     case "chart.bar":
-      s = F(i, r, "bar", n);
+      s = z(i, t, "bar", n);
       break;
     case "chart.line":
-      s = F(i, r, "line", n);
+      s = z(i, t, "line", n);
       break;
     case "chart.area":
-      s = F(i, r, "line", { ...n, _area: !0 });
+      s = z(i, t, "line", { ...n, _area: !0 });
       break;
     case "chart.pie":
-      s = ae(i, r, n);
+      s = le(i, t, n);
       break;
     case "chart.scatter":
-      s = ne(i, r, n);
+      s = oe(i, t, n);
       break;
     case "chart.radar":
-      s = oe(i, r);
+      s = ce(i, t);
       break;
     case "chart.heatmap":
-      s = le(i, r, n);
+      s = ue(i, t, n);
       break;
     case "chart.box":
-      s = ce(i, r);
+      s = fe(i, t);
       break;
     case "chart.funnel":
-      s = ue(i, r);
+      s = ye(i, t);
       break;
     case "chart.waterfall":
-      s = fe(i, r);
+      s = he(i, t);
       break;
     case "chart.treemap":
-      s = ye(i);
+      s = de(i);
+      break;
+    case "chart.histogram":
+      s = me(i, t, n);
       break;
     default:
       return {};
   }
   n.legend === !1 && s.legend && (s.legend = { ...s.legend, show: !1 }), n.grid === !1 && (s.xAxis && typeof s.xAxis == "object" && !Array.isArray(s.xAxis) && (s.xAxis = { ...s.xAxis, splitLine: { show: !1 } }), s.yAxis && typeof s.yAxis == "object" && !Array.isArray(s.yAxis) && (s.yAxis = { ...s.yAxis, splitLine: { show: !1 } })), n.animate === !1 && (s.animation = !1), Array.isArray(n.colors) && n.colors.length > 0 && (s.color = n.colors);
-  const y = n.echarts;
-  return y && typeof y == "object" && (s = L(s, y)), s;
+  const d = n.echarts;
+  return d && typeof d == "object" && (s = I(s, d)), s;
 }
-function F(e, t, i, r) {
+function z(e, r, i, t) {
   if (!Array.isArray(e)) return {};
-  const n = t?.x ?? C(e), s = t?.y ?? [k(e)].filter(Boolean);
+  const n = r?.x ?? C(e), s = r?.y ?? [_(e)].filter(Boolean);
   if (!n || s.length === 0) return {};
-  const y = e.map((a) => String(a[n] ?? "")), f = !!r.horizontal, d = Array.isArray(r.series) ? r.series : [], c = s.map((a, o) => {
-    const l = {
+  const d = e.map((a) => String(a[n] ?? "")), m = !!t.horizontal, h = Array.isArray(t.series) ? t.series : [], y = t.conditionalStyles, u = s.map((a, l) => {
+    const c = {
       name: a,
       type: i,
-      data: e.map((p) => p[a] ?? null)
+      data: e.map((p) => {
+        const w = p[a] ?? null;
+        if (y?.length) {
+          const S = L(p, y);
+          if (S) {
+            const F = { value: w, itemStyle: { color: S.color } };
+            return S.symbol && (F.symbol = S.symbol), S.symbolSize && (F.symbolSize = S.symbolSize), F;
+          }
+        }
+        return w;
+      })
     };
-    r._area && (l.areaStyle = {}), r.smooth && (l.smooth = !0), r.step && (l.step = r.step === !0 ? "end" : r.step);
-    const u = d[o];
-    return u && (u.color && (l.itemStyle = { color: u.color }, l.lineStyle = { ...l.lineStyle ?? {}, color: u.color }), u.lineStyle && (l.lineStyle = { ...l.lineStyle ?? {}, ...u.lineStyle }), u.symbol !== void 0 && (l.symbol = u.symbol), u.label && (l.name = u.label), u.type && (l.type = u.type), u.yAxisIndex !== void 0 && (l.yAxisIndex = u.yAxisIndex)), l;
-  }), h = { type: "category", data: y }, m = { type: "value" };
-  r.histogram && (h.axisTick = { alignWithLabel: !0 }, c.forEach((a) => {
+    t._area && (c.areaStyle = {}), t.smooth && (c.smooth = !0), t.step && (c.step = t.step === !0 ? "end" : t.step);
+    const o = h[l];
+    return o && (o.color && (c.itemStyle = { color: o.color }, c.lineStyle = { ...c.lineStyle ?? {}, color: o.color }), o.lineStyle && (c.lineStyle = { ...c.lineStyle ?? {}, ...o.lineStyle }), o.symbol !== void 0 && (c.symbol = o.symbol), o.label && (c.name = o.label), o.type && (c.type = o.type), o.yAxisIndex !== void 0 && (c.yAxisIndex = o.yAxisIndex)), c;
+  }), x = { type: "category", data: d }, g = { type: "value" };
+  t.histogram && (x.axisTick = { alignWithLabel: !0 }, u.forEach((a) => {
     a.barCategoryGap = "0%";
   }));
-  const x = !f && c.some((a) => a.yAxisIndex >= 1);
-  let b;
-  if (x) {
-    const a = Array.isArray(r.yAxis) && r.yAxis.length >= 2 ? r.yAxis[1] : { type: "value" };
-    b = [m, a];
+  const A = !m && u.some((a) => a.yAxisIndex >= 1);
+  let f;
+  if (A) {
+    const a = Array.isArray(t.yAxis) && t.yAxis.length >= 2 ? t.yAxis[1] : { type: "value" };
+    f = [g, a];
   } else
-    b = f ? h : m;
-  const A = {
-    xAxis: f ? m : h,
-    yAxis: b,
-    series: c,
+    f = m ? x : g;
+  const b = {
+    xAxis: m ? g : x,
+    yAxis: f,
+    series: u,
     tooltip: { trigger: "axis" }
   };
   if (s.length > 1) {
-    const a = c.map((o) => o.name);
-    A.legend = { data: a };
+    const a = u.map((l) => l.name);
+    b.legend = { data: a };
   }
-  r.stack && A.series.forEach((a) => {
+  t.stack && b.series.forEach((a) => {
     a.stack = "total";
   });
-  const v = r.referenceLines;
-  return Array.isArray(v) && v.length > 0 && c.length > 0 && (c[0].markLine = {
+  const v = t.referenceLines;
+  return Array.isArray(v) && v.length > 0 && u.length > 0 && (u[0].markLine = {
     silent: !0,
     symbol: "none",
     data: v.map((a) => {
-      const o = {};
-      a.axis === "x" ? o.xAxis = a.value : o.yAxis = a.value, a.label && (o.name = a.label);
       const l = {};
-      return a.color && (l.color = a.color), a.style && (l.type = a.style), Object.keys(l).length > 0 && (o.lineStyle = l), a.label && (o.label = { formatter: a.label, position: "end" }), o;
+      a.axis === "x" ? l.xAxis = a.value : l.yAxis = a.value, a.label && (l.name = a.label);
+      const c = {};
+      return a.color && (c.color = a.color), a.style && (c.type = a.style), Object.keys(c).length > 0 && (l.lineStyle = c), a.label && (l.label = { formatter: a.label, position: "end" }), l;
     })
-  }), A;
+  }), b;
 }
-function ne(e, t, i) {
+function oe(e, r, i) {
   if (!Array.isArray(e)) return {};
-  const r = j(e), n = t?.x ?? r[0], s = (t?.y ?? [r[1]])[0], y = t?.color, f = t?.size, d = t?.opacity;
+  const t = j(e), n = r?.x ?? t[0], s = (r?.y ?? [t[1]])[0], d = r?.color, m = r?.size, h = r?.opacity;
   if (!n || !s) return {};
-  const c = {
+  const y = {
     xAxis: { type: "value" },
     yAxis: { type: "value" },
     tooltip: { trigger: "item" }
   };
-  let h = 1 / 0, m = -1 / 0;
-  if (d)
+  let u = 1 / 0, x = -1 / 0;
+  if (h)
     for (const a of e) {
-      const o = Number(a[d] ?? 0);
-      o < h && (h = o), o > m && (m = o);
+      const l = Number(a[h] ?? 0);
+      l < u && (u = l), l > x && (x = l);
+    }
+  const g = x - u || 1, A = i.conditionalStyles, f = (a) => {
+    const l = [Number(a[n] ?? 0), Number(a[s] ?? 0)];
+    if (m && l.push(Number(a[m] ?? 0)), A?.length) {
+      const c = L(a, A);
+      if (c) {
+        const o = { color: c.color };
+        if (h) {
+          const w = Number(a[h] ?? 0);
+          o.opacity = Math.round((0.1 + 0.9 * ((w - u) / g)) * 100) / 100;
+        }
+        const p = { value: l, itemStyle: o };
+        return c.symbol && (p.symbol = c.symbol), c.symbolSize && (p.symbolSize = c.symbolSize), p;
+      }
     }
-  const x = m - h || 1, b = (a) => {
-    const o = [Number(a[n] ?? 0), Number(a[s] ?? 0)];
-    if (f && o.push(Number(a[f] ?? 0)), d) {
-      const u = 0.1 + 0.9 * ((Number(a[d] ?? 0) - h) / x);
-      return { value: o, itemStyle: { opacity: Math.round(u * 100) / 100 } };
+    if (h) {
+      const o = 0.1 + 0.9 * ((Number(a[h] ?? 0) - u) / g);
+      return { value: l, itemStyle: { opacity: Math.round(o * 100) / 100 } };
     }
-    return o;
-  }, A = f ? (a) => {
-    const l = (Array.isArray(a) ? a : a.value)[2] ?? 0;
-    return Math.max(4, Math.min(60, Math.sqrt(l) * 4));
+    return l;
+  }, b = m ? (a) => {
+    const c = (Array.isArray(a) ? a : a.value)[2] ?? 0;
+    return Math.max(4, Math.min(60, Math.sqrt(c) * 4));
   } : void 0;
-  if (y) {
+  if (d) {
     const a = /* @__PURE__ */ new Map();
-    for (const l of e) {
-      const u = String(l[y] ?? "unknown");
-      a.has(u) || a.set(u, []), a.get(u).push(b(l));
+    for (const c of e) {
+      const o = String(c[d] ?? "unknown");
+      a.has(o) || a.set(o, []), a.get(o).push(f(c));
     }
-    const o = [];
-    for (const [l, u] of a) {
-      const p = { name: l, type: "scatter", data: u };
-      A && (p.symbolSize = A), o.push(p);
+    const l = [];
+    for (const [c, o] of a) {
+      const p = { name: c, type: "scatter", data: o };
+      b && (p.symbolSize = b), l.push(p);
     }
-    c.series = o, c.legend = { data: Array.from(a.keys()) };
+    y.series = l, y.legend = { data: Array.from(a.keys()) };
   } else {
-    const o = { type: "scatter", data: e.map((l) => b(l)) };
-    A && (o.symbolSize = A), c.series = [o];
+    const l = { type: "scatter", data: e.map((c) => f(c)) };
+    b && (l.symbolSize = b), y.series = [l];
   }
   const v = i.referenceLines;
   if (Array.isArray(v) && v.length > 0) {
-    const a = c.series[0];
+    const a = y.series[0];
     a.markLine = {
       silent: !0,
       symbol: "none",
-      data: v.map((o) => {
-        const l = {};
-        o.axis === "x" ? l.xAxis = o.value : l.yAxis = o.value, o.label && (l.name = o.label);
-        const u = {};
-        return o.color && (u.color = o.color), o.style && (u.type = o.style), Object.keys(u).length > 0 && (l.lineStyle = u), o.label && (l.label = { formatter: o.label, position: "end" }), l;
+      data: v.map((l) => {
+        const c = {};
+        l.axis === "x" ? c.xAxis = l.value : c.yAxis = l.value, l.label && (c.name = l.label);
+        const o = {};
+        return l.color && (o.color = l.color), l.style && (o.type = l.style), Object.keys(o).length > 0 && (c.lineStyle = o), l.label && (c.label = { formatter: l.label, position: "end" }), c;
       })
     };
   }
-  return c;
+  return y;
 }
-function ae(e, t, i) {
+function le(e, r, i) {
   if (!Array.isArray(e)) return {};
-  const r = t?.label ?? C(e), n = t?.value ?? k(e);
-  if (!r || !n) return {};
-  const s = e.map((h) => ({
-    name: String(h[r] ?? ""),
-    value: Number(h[n] ?? 0)
-  })), f = {
+  const t = r?.label ?? C(e), n = r?.value ?? _(e);
+  if (!t || !n) return {};
+  const s = e.map((u) => ({
+    name: String(u[t] ?? ""),
+    value: Number(u[n] ?? 0)
+  })), m = {
     type: "pie",
     radius: i.donut ? ["40%", "70%"] : "50%",
     data: s,
     label: { overflow: "truncate", width: 80 }
   };
-  i.showLabel === !1 && (f.label = { show: !1 });
-  const d = {
+  i.showLabel === !1 && (m.label = { show: !1 });
+  const h = {
     tooltip: { trigger: "item" },
     legend: { orient: "vertical", left: "left" },
-    series: [f]
-  }, c = i.center;
-  if (i.donut && c && (c.label || c.value)) {
-    const h = [];
-    c.label && h.push({
+    series: [m]
+  }, y = i.center;
+  if (i.donut && y && (y.label || y.value)) {
+    const u = [];
+    y.label && u.push({
       type: "text",
-      top: c.value ? -16 : 0,
-      style: { text: c.label, fontSize: 13, fill: "#999", textAlign: "center" }
-    }), c.value && h.push({
+      top: y.value ? -16 : 0,
+      style: { text: y.label, fontSize: 13, fill: "#999", textAlign: "center" }
+    }), y.value && u.push({
       type: "text",
-      top: c.label ? 8 : 0,
-      style: { text: c.value, fontSize: 20, fontWeight: "bold", fill: "#333", textAlign: "center" }
-    }), d.graphic = [{ type: "group", left: "center", top: "middle", children: h }];
+      top: y.label ? 8 : 0,
+      style: { text: y.value, fontSize: 20, fontWeight: "bold", fill: "#333", textAlign: "center" }
+    }), h.graphic = [{ type: "group", left: "center", top: "middle", children: u }];
   }
-  return d;
+  return h;
 }
-function oe(e, t, i) {
+function ce(e, r, i) {
   if (!Array.isArray(e)) return {};
-  const r = t?.axis ?? C(e), n = t?.y ?? j(e);
-  if (!r || n.length === 0) return {};
-  const s = e.map((f) => ({
-    name: String(f[r] ?? "")
-  })), y = n.map((f) => ({
-    name: f,
-    value: e.map((d) => Number(d[f] ?? 0))
+  const t = r?.axis ?? C(e), n = r?.y ?? j(e);
+  if (!t || n.length === 0) return {};
+  const s = e.map((m) => ({
+    name: String(m[t] ?? "")
+  })), d = n.map((m) => ({
+    name: m,
+    value: e.map((h) => Number(h[m] ?? 0))
   }));
   return {
     tooltip: {},
@@ -207,98 +242,98 @@ function oe(e, t, i) {
     series: [
       {
         type: "radar",
-        data: y
+        data: d
       }
     ]
   };
 }
-function le(e, t, i) {
+function ue(e, r, i) {
   if (!Array.isArray(e)) return {};
-  const r = e[0] ?? {}, n = Object.keys(r), s = n.filter((p) => typeof r[p] == "string"), y = n.filter((p) => typeof r[p] == "number"), f = t?.x ?? s[0], d = t?.y?.[0] ?? s.find((p) => p !== f), c = t?.value ?? y[0];
-  if (!f || !d || !c) return {};
-  const h = [], m = [], x = /* @__PURE__ */ new Set(), b = /* @__PURE__ */ new Set();
-  for (const p of e) {
-    const g = String(p[f] ?? ""), w = String(p[d] ?? "");
-    x.has(g) || (x.add(g), h.push(g)), b.has(w) || (b.add(w), m.push(w));
+  const t = e[0] ?? {}, n = Object.keys(t), s = n.filter((o) => typeof t[o] == "string"), d = n.filter((o) => typeof t[o] == "number"), m = r?.x ?? s[0], h = r?.y?.[0] ?? s.find((o) => o !== m), y = r?.value ?? d[0];
+  if (!m || !h || !y) return {};
+  const u = [], x = [], g = /* @__PURE__ */ new Set(), A = /* @__PURE__ */ new Set();
+  for (const o of e) {
+    const p = String(o[m] ?? ""), w = String(o[h] ?? "");
+    g.has(p) || (g.add(p), u.push(p)), A.has(w) || (A.add(w), x.push(w));
   }
-  const A = /* @__PURE__ */ new Map();
-  h.forEach((p, g) => A.set(p, g));
-  const v = /* @__PURE__ */ new Map();
-  m.forEach((p, g) => v.set(p, g));
-  const a = [];
-  let o = 1 / 0, l = -1 / 0;
-  for (const p of e) {
-    const g = A.get(String(p[f] ?? "")) ?? 0, w = v.get(String(p[d] ?? "")) ?? 0, S = p[c] != null ? Number(p[c]) : null;
-    a.push([g, w, S]), S != null && (S < o && (o = S), S > l && (l = S));
+  const f = /* @__PURE__ */ new Map();
+  u.forEach((o, p) => f.set(o, p));
+  const b = /* @__PURE__ */ new Map();
+  x.forEach((o, p) => b.set(o, p));
+  const v = [];
+  let a = 1 / 0, l = -1 / 0;
+  for (const o of e) {
+    const p = f.get(String(o[m] ?? "")) ?? 0, w = b.get(String(o[h] ?? "")) ?? 0, S = o[y] != null ? Number(o[y]) : null;
+    v.push([p, w, S]), S != null && (S < a && (a = S), S > l && (l = S));
   }
-  isFinite(o) || (o = 0, l = 1);
-  const u = i.colorRange ?? ["#313695", "#4575b4", "#74add1", "#abd9e9", "#fee090", "#fdae61", "#f46d43", "#d73027"];
+  isFinite(a) || (a = 0, l = 1);
+  const c = i.colorRange ?? ["#313695", "#4575b4", "#74add1", "#abd9e9", "#fee090", "#fdae61", "#f46d43", "#d73027"];
   return {
-    xAxis: { type: "category", data: h, splitArea: { show: !0 } },
-    yAxis: { type: "category", data: m, splitArea: { show: !0 } },
+    xAxis: { type: "category", data: u, splitArea: { show: !0 } },
+    yAxis: { type: "category", data: x, splitArea: { show: !0 } },
     visualMap: {
-      min: i.min != null ? Number(i.min) : o,
+      min: i.min != null ? Number(i.min) : a,
       max: i.max != null ? Number(i.max) : l,
       calculable: !0,
       orient: "horizontal",
       left: "center",
       bottom: 0,
-      inRange: { color: u }
+      inRange: { color: c }
     },
     tooltip: {
       trigger: "item",
-      formatter: (p) => {
-        const g = p.data;
-        return g ? `${h[g[0]]} × ${m[g[1]]}: ${g[2] != null ? g[2] : "-"}` : "";
+      formatter: (o) => {
+        const p = o.data;
+        return p ? `${u[p[0]]} × ${x[p[1]]}: ${p[2] != null ? p[2] : "-"}` : "";
       }
     },
     grid: { bottom: 60 },
     series: [{
       type: "heatmap",
-      data: a,
+      data: v,
       label: { show: i.showLabel !== !1 }
     }]
   };
 }
-function ce(e, t, i) {
+function fe(e, r, i) {
   if (!Array.isArray(e) || e.length === 0) return {};
-  const r = e[0] ?? {}, n = Object.keys(r), s = n.filter((x) => typeof r[x] == "string"), y = n.filter((x) => typeof r[x] == "number"), f = t?.x ?? s[0];
-  let d;
-  if (t?.y && t.y.length >= 5)
-    d = t.y.slice(0, 5);
+  const t = e[0] ?? {}, n = Object.keys(t), s = n.filter((g) => typeof t[g] == "string"), d = n.filter((g) => typeof t[g] == "number"), m = r?.x ?? s[0];
+  let h;
+  if (r?.y && r.y.length >= 5)
+    h = r.y.slice(0, 5);
   else {
-    const b = ["min", "q1", "median", "q3", "max"].filter((A) => y.includes(A));
-    d = b.length === 5 ? b : y.slice(0, 5);
+    const A = ["min", "q1", "median", "q3", "max"].filter((f) => d.includes(f));
+    h = A.length === 5 ? A : d.slice(0, 5);
   }
-  if (d.length < 5) return {};
-  const c = f ? e.map((x) => String(x[f] ?? "")) : void 0, h = e.map(
-    (x) => d.map((b) => Number(x[b] ?? 0))
-  ), m = {
+  if (h.length < 5) return {};
+  const y = m ? e.map((g) => String(g[m] ?? "")) : void 0, u = e.map(
+    (g) => h.map((A) => Number(g[A] ?? 0))
+  ), x = {
     tooltip: { trigger: "item" },
     series: [{
       type: "boxplot",
-      data: h
+      data: u
     }]
   };
-  return c ? (m.xAxis = { type: "category", data: c }, m.yAxis = { type: "value" }) : (m.xAxis = { type: "category" }, m.yAxis = { type: "value" }), m;
+  return y ? (x.xAxis = { type: "category", data: y }, x.yAxis = { type: "value" }) : (x.xAxis = { type: "category" }, x.yAxis = { type: "value" }), x;
 }
 function C(e) {
   if (e.length === 0) return;
-  const t = e[0];
-  return Object.keys(t).find((i) => typeof t[i] == "string");
+  const r = e[0];
+  return Object.keys(r).find((i) => typeof r[i] == "string");
 }
-function k(e) {
+function _(e) {
   if (e.length === 0) return;
-  const t = e[0];
-  return Object.keys(t).find((i) => typeof t[i] == "number");
+  const r = e[0];
+  return Object.keys(r).find((i) => typeof r[i] == "number");
 }
-function ue(e, t, i) {
+function ye(e, r, i) {
   if (!Array.isArray(e)) return {};
-  const r = t?.label ?? C(e), n = t?.value ?? k(e);
-  if (!r || !n) return {};
-  const s = e.map((y) => ({
-    name: String(y[r] ?? ""),
-    value: Number(y[n] ?? 0)
+  const t = r?.label ?? C(e), n = r?.value ?? _(e);
+  if (!t || !n) return {};
+  const s = e.map((d) => ({
+    name: String(d[t] ?? ""),
+    value: Number(d[n] ?? 0)
   }));
   return {
     tooltip: { trigger: "item", formatter: "{b}: {c} ({d}%)" },
@@ -312,19 +347,19 @@ function ue(e, t, i) {
     }]
   };
 }
-function fe(e, t, i) {
+function he(e, r, i) {
   if (!Array.isArray(e)) return {};
-  const r = e, n = t?.x ?? C(r), s = (t?.y ?? [k(r)])[0];
+  const t = e, n = r?.x ?? C(t), s = (r?.y ?? [_(t)])[0];
   if (!n || !s) return {};
-  const y = [], f = [], d = [], c = [];
-  let h = 0;
-  for (const m of r) {
-    const x = String(m[n] ?? ""), b = Number(m[s] ?? 0);
-    y.push(x), b >= 0 ? (f.push(h), d.push(b), c.push(null)) : (f.push(h + b), d.push(null), c.push(Math.abs(b))), h += b;
+  const d = [], m = [], h = [], y = [];
+  let u = 0;
+  for (const x of t) {
+    const g = String(x[n] ?? ""), A = Number(x[s] ?? 0);
+    d.push(g), A >= 0 ? (m.push(u), h.push(A), y.push(null)) : (m.push(u + A), h.push(null), y.push(Math.abs(A))), u += A;
   }
   return {
     tooltip: { trigger: "axis", axisPointer: { type: "shadow" } },
-    xAxis: { type: "category", data: y },
+    xAxis: { type: "category", data: d },
     yAxis: { type: "value" },
     series: [
       {
@@ -333,26 +368,26 @@ function fe(e, t, i) {
         stack: "waterfall",
         itemStyle: { borderColor: "transparent", color: "transparent" },
         emphasis: { itemStyle: { borderColor: "transparent", color: "transparent" } },
-        data: f
+        data: m
       },
       {
         name: "Positive",
         type: "bar",
         stack: "waterfall",
-        data: d
+        data: h
       },
       {
         name: "Negative",
         type: "bar",
         stack: "waterfall",
-        data: c
+        data: y
       }
     ]
   };
 }
-function ye(e, t) {
+function de(e, r) {
   if (!Array.isArray(e)) return {};
-  const i = e.map((r) => N(r));
+  const i = e.map((t) => M(t));
   return {
     tooltip: { trigger: "item" },
     series: [{
@@ -364,38 +399,77 @@ function ye(e, t) {
     }]
   };
 }
-function N(e) {
-  const t = {
+function M(e) {
+  const r = {
     name: String(e.name ?? ""),
     value: Number(e.value ?? 0)
   };
-  return Array.isArray(e.children) && (t.children = e.children.map((i) => N(i))), t;
+  return Array.isArray(e.children) && (r.children = e.children.map((i) => M(i))), r;
+}
+function me(e, r, i) {
+  let t;
+  if (!Array.isArray(e) || e.length === 0) return {};
+  if (typeof e[0] == "number")
+    t = e;
+  else {
+    const f = r?.value ?? _(e);
+    if (!f) return {};
+    t = e.map((b) => Number(b[f] ?? 0));
+  }
+  if (t.length === 0) return {};
+  const n = typeof i.bins == "number" ? i.bins : Math.ceil(Math.log2(t.length) + 1), s = Math.min(...t), h = (Math.max(...t) - s) / n || 1, y = new Array(n).fill(0), u = [];
+  for (let f = 0; f < n; f++) {
+    const b = s + f * h, v = s + (f + 1) * h, a = (l) => Number.isInteger(l) ? String(l) : l.toFixed(1);
+    u.push(`${a(b)}–${a(v)}`);
+  }
+  for (const f of t) {
+    let b = Math.floor((f - s) / h);
+    b >= n && (b = n - 1), y[b]++;
+  }
+  const x = {
+    type: "bar",
+    data: y,
+    barCategoryGap: "0%"
+  }, g = {
+    xAxis: { type: "category", data: u, axisTick: { alignWithLabel: !0 } },
+    yAxis: { type: "value" },
+    series: [x],
+    tooltip: { trigger: "axis" }
+  }, A = i.referenceLines;
+  return Array.isArray(A) && A.length > 0 && (x.markLine = {
+    silent: !0,
+    symbol: "none",
+    data: A.map((f) => {
+      const b = {};
+      f.axis === "x" ? b.xAxis = f.value : b.yAxis = f.value, f.label && (b.name = f.label);
+      const v = {};
+      return f.color && (v.color = f.color), f.style && (v.type = f.style), Object.keys(v).length > 0 && (b.lineStyle = v), f.label && (b.label = { formatter: f.label, position: "end" }), b;
+    })
+  }), g;
 }
 function j(e) {
   if (e.length === 0) return [];
-  const t = e[0];
-  return Object.keys(t).filter((i) => typeof t[i] == "number");
+  const r = e[0];
+  return Object.keys(r).filter((i) => typeof r[i] == "number");
 }
-function L(e, t) {
+function I(e, r) {
   const i = { ...e };
-  for (const r of Object.keys(t)) {
-    const n = e[r], s = t[r];
-    O(n) && O(s) ? i[r] = L(n, s) : i[r] = s;
+  for (const t of Object.keys(r)) {
+    const n = e[t], s = r[t];
+    N(n) && N(s) ? i[t] = I(n, s) : i[t] = s;
   }
   return i;
 }
-function O(e) {
+function N(e) {
   return e != null && typeof e == "object" && !Array.isArray(e);
 }
-var he = Object.defineProperty, de = Object.getOwnPropertyDescriptor, I = (e, t, i, r) => {
-  for (var n = r > 1 ? void 0 : r ? de(t, i) : t, s = e.length - 1, y; s >= 0; s--)
-    (y = e[s]) && (n = (r ? y(t, i, n) : y(n)) || n);
-  return r && n && he(t, i, n), n;
+var be = Object.defineProperty, pe = Object.getOwnPropertyDescriptor, V = (e, r, i, t) => {
+  for (var n = t > 1 ? void 0 : t ? pe(r, i) : r, s = e.length - 1, d; s >= 0; s--)
+    (d = e[s]) && (n = (t ? d(r, i, n) : d(n)) || n);
+  return t && n && be(r, i, n), n;
 };
-z.use([
-  B,
+O.use([
   q,
-  W,
   G,
   H,
   K,
@@ -408,16 +482,18 @@ z.use([
   ee,
   te,
   re,
-  se
+  ie,
+  se,
+  ne
 ]);
-let _ = class extends V {
+let k = class extends E {
   constructor() {
     super(...arguments), this.spec = null, this._chart = null, this._container = null, this._resizeObserver = null;
   }
   render() {
-    if (!this.spec) return P;
+    if (!this.spec) return R;
     const e = this.spec.title ?? `${this.spec.widget} chart`;
-    return E`<div class="chart-container" part="chart" role="img" aria-label=${e}></div>`;
+    return T`<div class="chart-container" part="chart" role="img" aria-label=${e}></div>`;
   }
   firstUpdated() {
     this._container = this.shadowRoot?.querySelector(".chart-container"), this._initChart(), this._container && (this._resizeObserver = new ResizeObserver(() => this._chart?.resize()), this._resizeObserver.observe(this._container));
@@ -428,7 +504,7 @@ let _ = class extends V {
   _initChart() {
     if (!(!this._container || !this.spec))
       try {
-        this._chart = z.init(this._container), this._chart.on("click", (e) => {
+        this._chart = O.init(this._container), this._chart.on("click", (e) => {
           this._onChartClick(e);
         }), this._updateChart();
       } catch (e) {
@@ -437,7 +513,7 @@ let _ = class extends V {
   }
   _onChartClick(e) {
     if (!this.spec) return;
-    const t = {
+    const r = {
       type: "select",
       widget: this.spec.widget,
       id: this.spec.id,
@@ -450,7 +526,7 @@ let _ = class extends V {
     };
     this.dispatchEvent(
       new CustomEvent("u-widget-internal", {
-        detail: t,
+        detail: r,
         bubbles: !0,
         composed: !0
       })
@@ -458,30 +534,30 @@ let _ = class extends V {
   }
   _updateChart() {
     if (!this._chart || !this.spec) return;
-    const e = ie(this.spec), t = this._readThemeColors();
-    t.length > 0 && (e.color = t), this._readCSSVar("--u-widget-bg") && (e.backgroundColor = "transparent"), this._applyThemeStyle(e), this._chart.setOption(e, !0);
+    const e = ae(this.spec), r = this._readThemeColors();
+    r.length > 0 && (e.color = r), this._readCSSVar("--u-widget-bg") && (e.backgroundColor = "transparent"), this._applyThemeStyle(e), this._chart.setOption(e, !0);
   }
   _applyThemeStyle(e) {
-    const t = this._readCSSVar("--u-widget-text"), i = this._readCSSVar("--u-widget-text-secondary"), r = this._readCSSVar("--u-widget-border");
-    if (!t) return;
-    e.textStyle = { ...e.textStyle, color: t };
+    const r = this._readCSSVar("--u-widget-text"), i = this._readCSSVar("--u-widget-text-secondary"), t = this._readCSSVar("--u-widget-border");
+    if (!r) return;
+    e.textStyle = { ...e.textStyle, color: r };
     const n = {
-      axisLabel: { color: i || t },
-      axisLine: { lineStyle: { color: r || i } },
-      splitLine: { lineStyle: { color: r } }
+      axisLabel: { color: i || r },
+      axisLine: { lineStyle: { color: t || i } },
+      splitLine: { lineStyle: { color: t } }
     };
-    e.xAxis && typeof e.xAxis == "object" && (e.xAxis = { ...e.xAxis, ...n }), e.yAxis && typeof e.yAxis == "object" && (e.yAxis = { ...e.yAxis, ...n }), e.legend && typeof e.legend == "object" && (e.legend = { ...e.legend, textStyle: { color: t } });
+    e.xAxis && typeof e.xAxis == "object" && (e.xAxis = { ...e.xAxis, ...n }), e.yAxis && typeof e.yAxis == "object" && (e.yAxis = { ...e.yAxis, ...n }), e.legend && typeof e.legend == "object" && (e.legend = { ...e.legend, textStyle: { color: r } });
   }
   _readThemeColors() {
     const e = [];
-    for (let t = 1; t <= 10; t++) {
-      const i = this._readCSSVar(`--u-widget-chart-color-${t}`);
+    for (let r = 1; r <= 10; r++) {
+      const i = this._readCSSVar(`--u-widget-chart-color-${r}`);
       if (i) e.push(i);
       else break;
     }
     if (e.length === 0) {
-      const t = this._readCSSVar("--u-widget-primary");
-      t && e.push(t);
+      const r = this._readCSSVar("--u-widget-primary");
+      r && e.push(r);
     }
     return e;
   }
@@ -496,9 +572,9 @@ let _ = class extends V {
     this._chart?.resize();
   }
 };
-_.styles = [
-  $,
-  M`
+k.styles = [
+  W,
+  P`
       :host {
         display: block;
         container: uw-chart / inline-size;
@@ -516,14 +592,14 @@ _.styles = [
       }
     `
 ];
-I([
-  R({ type: Object })
-], _.prototype, "spec", 2);
-_ = I([
-  D("uw-chart")
-], _);
+V([
+  D({ type: Object })
+], k.prototype, "spec", 2);
+k = V([
+  $("uw-chart")
+], k);
 export {
-  _ as UwChart,
-  ie as toEChartsOption
+  k as UwChart,
+  ae as toEChartsOption
 };
 //# sourceMappingURL=u-widgets-charts.js.map