@blazes/data-visualization 0.0.0-stage → 1.0.0-alpha.1

package/dist/vue/index.js

@@ -0,0 +1,1075 @@
+import { defineComponent as O, openBlock as p, createElementBlock as w, normalizeClass as q, createElementVNode as I, Fragment as H, renderList as K, normalizeStyle as ue, toDisplayString as L, createVNode as R, unref as u, mergeProps as xe, withCtx as k, createTextVNode as U, createBlock as z, createCommentVNode as $, ref as j, computed as P, onErrorCaptured as Ce, watch as Se, resolveDynamicComponent as pe, pushScopeId as ke, popScopeId as Re, shallowRef as Ie, onMounted as fe, onBeforeUnmount as ve, onBeforeMount as $e, markRaw as Pe, toRaw as De, h as V } from "vue";
+import { FormatType as Z, ChartBar as Ae, Size as J, ChartLine as ze, ChartPie as Le } from "@blazes/charts";
+import { a as ee, b as G, c as Q, S as te } from "../visual-theme-DH-k3L51.js";
+import { v as E } from "../value-formatter-D5QmLSMG.js";
+import { RedoOutlined as X, ExclamationCircleOutlined as Te, BarChartOutlined as Fe, WarningOutlined as Ee, CloudDownloadOutlined as Ve, QuestionCircleOutlined as Oe, RiseOutlined as me, FallOutlined as _e, MinusOutlined as ge } from "@ant-design/icons-vue";
+import { RangePicker as Be, RadioGroup as Ue, RadioButton as Ne, Select as le, Tooltip as N, Button as Y, Card as je, Spin as de, Dropdown as Ye, Menu as He, MenuItem as ce, Progress as qe, Tag as Ke, Table as Ge } from "ant-design-vue";
+import { b as We, s as Ze, a as Qe, P as Xe } from "../csv-Dyrr2yMA.js";
+const Je = { class: "dv-filter-bar__controls" }, et = { class: "dv-filter-bar__label" }, tt = {
+  key: 0,
+  class: "dv-filter-bar__date-range"
+}, nt = /* @__PURE__ */ O({
+  __name: "DashboardFilterBar",
+  props: {
+    config: {},
+    context: {},
+    loading: { type: Boolean }
+  },
+  emits: ["change", "refresh"],
+  setup(r, { emit: _ }) {
+    const o = r, e = _;
+    function h(i) {
+      return {
+        "--dv-filter-xs": String(i.xs),
+        "--dv-filter-sm": String(i.sm ?? i.xs),
+        "--dv-filter-md": String(i.md ?? i.sm ?? i.xs),
+        "--dv-filter-lg": String(i.lg ?? i.md ?? i.sm ?? i.xs),
+        "--dv-filter-xl": String(i.xl ?? i.lg ?? i.md ?? i.sm ?? i.xs)
+      };
+    }
+    function x(i) {
+      return i;
+    }
+    function C(i) {
+      return i.map((a) => ({ ...a }));
+    }
+    function s(i) {
+      if (typeof i != "string" || !/^\d{4}-\d{2}-\d{2}$/.test(i)) return;
+      const a = /* @__PURE__ */ new Date(`${i}T12:00:00Z`);
+      return Number.isNaN(a.getTime()) ? void 0 : a;
+    }
+    function S(i) {
+      return i.toISOString().slice(0, 10);
+    }
+    function D() {
+      const i = new Intl.DateTimeFormat("en-CA", {
+        timeZone: o.context.timezone,
+        year: "numeric",
+        month: "2-digit",
+        day: "2-digit"
+      }).formatToParts(/* @__PURE__ */ new Date()), a = Object.fromEntries(i.map((g) => [g.type, g.value])), t = /* @__PURE__ */ new Date(`${a.year}-${a.month}-${a.day}T12:00:00Z`);
+      return t.setUTCDate(t.getUTCDate() - 1), t;
+    }
+    function c(i) {
+      return o.context.variables[i];
+    }
+    function l(i) {
+      const a = c(i.startVariableId), t = c(i.endVariableId);
+      return typeof a != "string" || typeof t != "string" || !s(a) || !s(t) ? {} : { value: [a, t] };
+    }
+    function f(i, a) {
+      if (!Array.isArray(a) || a.length !== 2) return;
+      const [t, g] = a;
+      typeof t != "string" || typeof g != "string" || e("change", {
+        [i.startVariableId]: t,
+        [i.endVariableId]: g
+      });
+    }
+    function d(i) {
+      var y, A;
+      const a = s(c(i.startVariableId)), t = s(c(i.endVariableId));
+      if (!a || !t || t.getTime() !== D().getTime()) return;
+      const g = Math.round((t.getTime() - a.getTime()) / 864e5) + 1;
+      return (A = (y = i.presets) == null ? void 0 : y.find((F) => F.days === g)) == null ? void 0 : A.id;
+    }
+    function n(i, a) {
+      var F;
+      const t = typeof a.target.value == "string" ? a.target.value : void 0, g = (F = i.presets) == null ? void 0 : F.find((W) => W.id === t);
+      if (!g) return;
+      const y = D(), A = new Date(y);
+      A.setUTCDate(A.getUTCDate() - g.days + 1), e("change", {
+        [i.startVariableId]: S(A),
+        [i.endVariableId]: S(y)
+      });
+    }
+    function M(i, a) {
+      e("change", { [i]: a ?? null });
+    }
+    return (i, a) => i.config ? (p(), w("div", {
+      key: 0,
+      class: q(["dv-filter-bar", { "dv-filter-bar--flow": i.config.layout === "flow" }])
+    }, [
+      I("div", Je, [
+        (p(!0), w(H, null, K(i.config.controls, (t) => {
+          var g;
+          return p(), w("div", {
+            key: t.id,
+            class: q(["dv-filter-bar__control", `dv-filter-bar__control--${t.type}`]),
+            style: ue(h(t.layout))
+          }, [
+            I("label", et, L(t.label), 1),
+            t.type === "date-range" ? (p(), w("div", tt, [
+              R(u(Be), xe({
+                class: "dv-filter-bar__range-picker",
+                "allow-clear": !1,
+                disabled: t.disabled ?? !1,
+                "dropdown-class-name": "dv-filter-bar__date-popup",
+                format: t.format ?? "YYYY-MM-DD"
+              }, l(t), {
+                "value-format": "YYYY-MM-DD",
+                onChange: (y) => f(t, y)
+              }), {
+                separator: k(() => [
+                  U("至")
+                ]),
+                _: 2
+              }, 1040, ["disabled", "format", "onChange"]),
+              (g = t.presets) != null && g.length ? (p(), z(u(Ue), {
+                key: 0,
+                class: "dv-filter-bar__presets",
+                disabled: t.disabled ?? !1,
+                size: "small",
+                value: d(t),
+                onChange: (y) => n(t, y)
+              }, {
+                default: k(() => [
+                  (p(!0), w(H, null, K(t.presets, (y) => (p(), z(u(Ne), {
+                    key: y.id,
+                    value: y.id
+                  }, {
+                    default: k(() => [
+                      U(L(y.label), 1)
+                    ]),
+                    _: 2
+                  }, 1032, ["value"]))), 128))
+                ]),
+                _: 2
+              }, 1032, ["disabled", "value", "onChange"])) : $("", !0)
+            ])) : t.type === "multi-select" ? (p(), z(u(le), {
+              key: 1,
+              "allow-clear": t.allowClear ?? !1,
+              disabled: t.disabled ?? !1,
+              "max-tag-count": t.maxTagCount ?? "responsive",
+              mode: "multiple",
+              "option-filter-prop": "label",
+              options: C(t.options),
+              placeholder: t.placeholder ?? "",
+              "show-search": t.showSearch ?? !1,
+              value: i.context.variables[t.variableId],
+              onChange: (y) => M(t.variableId, y)
+            }, null, 8, ["allow-clear", "disabled", "max-tag-count", "options", "placeholder", "show-search", "value", "onChange"])) : (p(), z(u(le), {
+              key: 2,
+              "allow-clear": t.allowClear ?? !1,
+              disabled: t.disabled ?? !1,
+              "option-filter-prop": "label",
+              options: C(t.options),
+              placeholder: t.placeholder ?? "",
+              "show-search": t.showSearch ?? !1,
+              value: i.context.variables[t.variableId],
+              onChange: (y) => M(t.variableId, y)
+            }, null, 8, ["allow-clear", "disabled", "options", "placeholder", "show-search", "value", "onChange"]))
+          ], 6);
+        }), 128))
+      ]),
+      i.config.showRefresh !== !1 ? (p(), z(u(N), {
+        key: 0,
+        title: "刷新全部"
+      }, {
+        default: k(() => [
+          R(u(Y), {
+            type: "primary",
+            class: "dv-filter-bar__refresh",
+            loading: i.loading ?? !1,
+            onClick: a[0] || (a[0] = (t) => i.$emit("refresh"))
+          }, {
+            icon: k(() => [
+              R(u(X))
+            ]),
+            default: k(() => [
+              U(" 刷新 ")
+            ]),
+            _: 1
+          }, 8, ["loading"])
+        ]),
+        _: 1
+      })) : $("", !0)
+    ], 2)) : $("", !0);
+  }
+}), B = (r, _) => {
+  const o = r.__vccOpts || r;
+  for (const [e, h] of _)
+    o[e] = h;
+  return o;
+}, at = /* @__PURE__ */ B(nt, [["__scopeId", "data-v-45855b0b"]]), he = (r) => (ke("data-v-b524c4f2"), r = r(), Re(), r), it = { class: "dv-panel__heading" }, ot = { class: "dv-panel__title-group" }, rt = { class: "dv-panel__title" }, st = {
+  key: 0,
+  class: "dv-panel__title-note"
+}, lt = { class: "dv-panel__actions" }, dt = {
+  key: 0,
+  class: "dv-panel__filters"
+}, ct = {
+  key: 1,
+  class: "dv-panel__state dv-panel__state--failure",
+  role: "status"
+}, ut = { class: "dv-panel__failure" }, pt = { class: "dv-panel__failure-copy" }, ft = { class: "dv-panel__failure-heading" }, vt = ["title"], mt = /* @__PURE__ */ he(() => /* @__PURE__ */ I("span", { class: "dv-panel__retry-label" }, "重新加载", -1)), _t = {
+  key: 2,
+  class: "dv-panel__state dv-panel__state--loading"
+}, gt = {
+  key: 0,
+  class: "dv-panel__state dv-panel__state--metric-empty"
+}, ht = {
+  key: 1,
+  class: "dv-panel__state dv-panel__state--empty",
+  role: "status",
+  "aria-live": "polite"
+}, yt = {
+  class: "dv-panel__empty-icon",
+  "aria-hidden": "true"
+}, bt = /* @__PURE__ */ he(() => /* @__PURE__ */ I("div", { class: "dv-panel__empty-copy" }, [
+  /* @__PURE__ */ I("div", { class: "dv-panel__empty-title" }, "暂无数据")
+], -1)), wt = {
+  key: 4,
+  class: "dv-panel__renderer"
+}, Mt = {
+  key: 0,
+  class: "dv-panel__refreshing"
+}, xt = {
+  key: 5,
+  class: "dv-panel__state dv-panel__idle"
+}, Ct = {
+  key: 6,
+  class: "dv-panel__updated"
+}, St = /* @__PURE__ */ O({
+  __name: "DashboardPanel",
+  props: {
+    panel: {},
+    state: {},
+    context: {},
+    definition: {},
+    renderer: {},
+    filterSummary: {},
+    refreshDisabled: { type: Boolean }
+  },
+  emits: ["refresh", "retry", "exportCsv", "exportPng", "action", "visualizationEvent"],
+  setup(r, { expose: _, emit: o }) {
+    const e = r, h = o, x = j(), C = j(), s = P(() => e.panel.rendererId === "metric"), S = P(() => {
+      var n;
+      if (C.value)
+        return { title: "图表暂时无法展示", detail: C.value.message };
+      if (e.state.status === "error" || e.state.status === "cancelled")
+        return { title: "数据暂时无法加载", detail: (n = e.state.error) == null ? void 0 : n.message };
+    }), D = P(
+      () => e.definition.capabilities.csv && !!e.state.dataset || e.definition.capabilities.png && !!e.state.viewModel
+    ), c = P(() => {
+      const n = e.panel.layout.minHeight ?? (s.value ? 119 : 401), M = s.value ? 40 : 50;
+      return { minHeight: `${Math.max(n - M - 2, s.value ? 77 : 190)}px` };
+    }), l = P(
+      () => e.state.lastSuccessfulAt ? new Intl.DateTimeFormat(e.context.locale, { timeStyle: "medium", timeZone: e.context.timezone }).format(
+        new Date(e.state.lastSuccessfulAt)
+      ) : ""
+    );
+    function f() {
+      var n, M;
+      return (M = (n = x.value) == null ? void 0 : n.exportPng) == null ? void 0 : M.call(n);
+    }
+    function d(n) {
+      n.key === "csv" && h("exportCsv"), n.key === "png" && h("exportPng");
+    }
+    return Ce((n) => (C.value = n instanceof Error ? n : new Error(String(n)), !1)), Se(
+      () => [e.state.generation, e.state.viewModel],
+      () => {
+        C.value = void 0;
+      }
+    ), _({ exportPng: f }), (n, M) => (p(), z(u(je), {
+      class: q(["dv-panel", { "dv-panel--metric": s.value }]),
+      "body-style": c.value
+    }, {
+      title: k(() => [
+        I("div", it, [
+          I("span", ot, [
+            I("span", rt, L(n.panel.title), 1),
+            n.panel.description ? (p(), z(u(N), {
+              key: 0,
+              title: n.panel.description
+            }, {
+              default: k(() => [
+                R(u(Oe))
+              ]),
+              _: 1
+            }, 8, ["title"])) : $("", !0)
+          ]),
+          n.panel.titleNote ? (p(), w("span", st, L(n.panel.titleNote), 1)) : $("", !0)
+        ])
+      ]),
+      extra: k(() => {
+        var i;
+        return [
+          I("div", lt, [
+            n.state.status === "stale" ? (p(), z(u(N), {
+              key: 0,
+              title: `刷新失败，当前展示上次成功数据${(i = n.state.error) != null && i.message ? `：${n.state.error.message}` : ""}`
+            }, {
+              default: k(() => [
+                R(u(Ee), { class: "dv-panel__warning" })
+              ]),
+              _: 1
+            }, 8, ["title"])) : $("", !0),
+            R(u(N), {
+              title: n.refreshDisabled ? "正在刷新全部" : "刷新"
+            }, {
+              default: k(() => [
+                R(u(Y), {
+                  disabled: n.refreshDisabled ?? !1,
+                  type: "text",
+                  size: "small",
+                  onClick: M[0] || (M[0] = (a) => n.$emit("refresh"))
+                }, {
+                  icon: k(() => [
+                    R(u(X))
+                  ]),
+                  _: 1
+                }, 8, ["disabled"])
+              ]),
+              _: 1
+            }, 8, ["title"]),
+            D.value ? (p(), z(u(Ye), {
+              key: 1,
+              placement: "bottomRight",
+              trigger: ["click"]
+            }, {
+              overlay: k(() => [
+                R(u(He), { onClick: d }, {
+                  default: k(() => [
+                    n.definition.capabilities.csv && n.state.dataset ? (p(), z(u(ce), { key: "csv" }, {
+                      default: k(() => [
+                        U("导出 CSV")
+                      ]),
+                      _: 1
+                    })) : $("", !0),
+                    n.definition.capabilities.png && n.state.viewModel ? (p(), z(u(ce), { key: "png" }, {
+                      default: k(() => [
+                        U("导出 PNG")
+                      ]),
+                      _: 1
+                    })) : $("", !0)
+                  ]),
+                  _: 1
+                })
+              ]),
+              default: k(() => [
+                R(u(N), { title: "下载" }, {
+                  default: k(() => [
+                    R(u(Y), {
+                      type: "text",
+                      size: "small"
+                    }, {
+                      icon: k(() => [
+                        R(u(Ve))
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            })) : $("", !0),
+            (p(!0), w(H, null, K(n.panel.actions ?? [], (a) => (p(), z(u(Y), {
+              key: a.id,
+              type: "link",
+              size: "small",
+              onClick: (t) => n.$emit("action", a.id)
+            }, {
+              default: k(() => [
+                U(L(a.label ?? a.id), 1)
+              ]),
+              _: 2
+            }, 1032, ["onClick"]))), 128))
+          ])
+        ];
+      }),
+      default: k(() => [
+        n.filterSummary ? (p(), w("div", dt, L(n.filterSummary), 1)) : $("", !0),
+        S.value ? (p(), w("div", ct, [
+          I("div", ut, [
+            R(u(Te), { class: "dv-panel__failure-icon" }),
+            I("div", pt, [
+              I("div", ft, L(S.value.title), 1),
+              S.value.detail ? (p(), w("div", {
+                key: 0,
+                class: "dv-panel__failure-detail",
+                title: S.value.detail
+              }, L(S.value.detail), 9, vt)) : $("", !0)
+            ]),
+            R(u(N), { title: "重试" }, {
+              default: k(() => [
+                R(u(Y), {
+                  class: "dv-panel__retry",
+                  size: "small",
+                  "aria-label": "重试",
+                  onClick: M[1] || (M[1] = (i) => n.$emit("retry"))
+                }, {
+                  icon: k(() => [
+                    R(u(X))
+                  ]),
+                  default: k(() => [
+                    mt
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            })
+          ])
+        ])) : n.state.status === "loading" && !n.state.viewModel ? (p(), w("div", _t, [
+          R(u(de))
+        ])) : n.state.status === "empty" ? (p(), w(H, { key: 3 }, [
+          s.value ? (p(), w("div", gt, "暂无数据")) : (p(), w("div", ht, [
+            I("span", yt, [
+              R(u(Fe))
+            ]),
+            bt
+          ]))
+        ], 64)) : n.state.viewModel ? (p(), w("div", wt, [
+          (p(), z(pe(n.renderer), {
+            ref_key: "rendererRef",
+            ref: x,
+            context: n.context,
+            panel: n.panel,
+            "view-model": n.state.viewModel,
+            onVisualizationEvent: M[2] || (M[2] = (i) => n.$emit("visualizationEvent", i))
+          }, null, 40, ["context", "panel", "view-model"])),
+          n.state.isRefreshing ? (p(), w("div", Mt, [
+            R(u(de))
+          ])) : $("", !0)
+        ])) : (p(), w("div", xt, "等待加载")),
+        n.state.lastSuccessfulAt ? (p(), w("div", Ct, "更新于 " + L(l.value), 1)) : $("", !0)
+      ]),
+      _: 1
+    }, 8, ["class", "body-style"]));
+  }
+}), kt = /* @__PURE__ */ B(St, [["__scopeId", "data-v-b524c4f2"]]);
+function Rt(r, _ = {}) {
+  const o = Ie(r.snapshot);
+  let e;
+  return fe(() => {
+    e = r.subscribe((h) => {
+      o.value = h;
+    }), _.autoLoad !== !1 && r.load();
+  }), ve(() => e == null ? void 0 : e()), {
+    snapshot: o,
+    context: P(() => o.value.context),
+    panelStates: P(() => o.value.panelStates),
+    isLoading: P(() => o.value.isGlobalLoading),
+    loadPanels: (h) => r.loadPanels(h),
+    refreshAll: () => r.refreshAll(),
+    refreshPanels: (h, x) => r.refreshPanels(h, x),
+    refreshPanel: (h) => r.refreshPanel(h),
+    retryPanel: (h) => r.retryPanel(h),
+    setVariables: (h, x) => r.setVariables(h, x)
+  };
+}
+function It(r, _, o) {
+  const e = URL.createObjectURL(new Blob([r], { type: _ }));
+  ye(e, o), window.setTimeout(() => URL.revokeObjectURL(e), 0);
+}
+function $t(r, _) {
+  ye(r, _);
+}
+function ye(r, _) {
+  const o = document.createElement("a");
+  o.href = r, o.download = _, o.hidden = !0, document.body.append(o), o.click(), o.remove();
+}
+const Pt = {
+  key: 0,
+  class: "dv-dashboard__header"
+}, Dt = { key: 0 }, At = { class: "dv-dashboard__grid" }, zt = ["data-panel-id"], Lt = /* @__PURE__ */ O({
+  __name: "DashboardRenderer",
+  props: {
+    runtime: {},
+    rendererRegistry: {},
+    panelComponents: {},
+    autoLoad: { type: Boolean, default: !0 },
+    lazyLoad: { type: Boolean, default: !0 },
+    lazyLoadRootMargin: { default: "600px 0px" },
+    syncUrl: { type: Boolean, default: !0 },
+    showHeader: { type: Boolean, default: !0 }
+  },
+  setup(r, { expose: _ }) {
+    const o = r, e = /* @__PURE__ */ new Map(), h = j(), x = /* @__PURE__ */ new Set(), C = /* @__PURE__ */ new Set();
+    let s, S = !1, D = !1;
+    $e(() => {
+      o.syncUrl && typeof window < "u" && o.runtime.restoreContext(window.location.search);
+    });
+    const {
+      context: c,
+      panelStates: l,
+      isLoading: f,
+      loadPanels: d,
+      refreshAll: n,
+      refreshPanels: M,
+      refreshPanel: i,
+      retryPanel: a,
+      setVariables: t
+    } = Rt(o.runtime, { autoLoad: o.autoLoad && !o.lazyLoad });
+    fe(() => {
+      var v;
+      if (!(!o.autoLoad || !o.lazyLoad)) {
+        if (typeof IntersectionObserver > "u") {
+          n();
+          return;
+        }
+        S = !0, s = new IntersectionObserver(be, {
+          rootMargin: o.lazyLoadRootMargin
+        }), (v = h.value) == null || v.querySelectorAll(".dv-dashboard__cell").forEach((m) => s == null ? void 0 : s.observe(m));
+      }
+    }), ve(() => {
+      s == null || s.disconnect(), s = void 0, S = !1, x.clear(), C.clear();
+    });
+    const g = P(
+      () => (o.runtime.config.variables ?? []).map((v) => `${v.label}: ${y(c.value.variables[v.id])}`).join(" · ")
+    );
+    function y(v) {
+      return Array.isArray(v) ? v.join(", ") : String(v ?? "--");
+    }
+    function A(v) {
+      const m = v.layout.span;
+      return {
+        "--dv-panel-xs": String(m.xs),
+        "--dv-panel-sm": String(m.sm ?? m.xs),
+        "--dv-panel-md": String(m.md ?? m.sm ?? m.xs),
+        "--dv-panel-lg": String(m.lg ?? m.md ?? m.sm ?? m.xs),
+        "--dv-panel-xl": String(m.xl ?? m.lg ?? m.md ?? m.sm ?? m.xs)
+      };
+    }
+    function F(v) {
+      var b;
+      const m = ((b = o.panelComponents) == null ? void 0 : b[v.id]) ?? o.rendererRegistry.require(v.rendererId).component;
+      return Pe(De(m));
+    }
+    function W(v, m) {
+      m ? e.set(v, m) : e.delete(v);
+    }
+    function be(v) {
+      v.forEach((m) => {
+        const b = m.target.dataset.panelId;
+        b && (m.isIntersecting ? (x.add(b), C.add(b)) : (x.delete(b), C.delete(b)));
+      }), !(!C.size || D) && (D = !0, queueMicrotask(() => {
+        D = !1;
+        const m = Array.from(C);
+        C.clear(), d(m);
+      }));
+    }
+    function ie() {
+      return S ? M(x, { deferUnselected: !0 }) : n();
+    }
+    async function we(v) {
+      const m = t(v, S ? x : void 0);
+      if (o.syncUrl && typeof window < "u") {
+        const b = We(o.runtime.config, o.runtime.context, window.location.search);
+        window.history.replaceState(
+          window.history.state,
+          "",
+          `${window.location.pathname}${b}${window.location.hash}`
+        );
+      }
+      await m;
+    }
+    function oe(v) {
+      var se;
+      const m = o.runtime.config.panels.find((Me) => Me.id === v), b = (se = l.value[v]) == null ? void 0 : se.dataset;
+      if (!b) return;
+      const T = Ze(b, m, c.value);
+      It(T, "text/csv;charset=utf-8", Qe(o.runtime.config.id, m.id));
+    }
+    function re(v) {
+      var b;
+      const m = (b = e.get(v)) == null ? void 0 : b.exportPng();
+      m && $t(m, `${o.runtime.config.id}-${v}.png`);
+    }
+    return _({ refreshAll: ie, refreshPanel: i, exportCsv: oe, exportPng: re }), (v, m) => (p(), w("section", {
+      ref_key: "dashboardElement",
+      ref: h,
+      class: "dv-dashboard"
+    }, [
+      v.showHeader ? (p(), w("header", Pt, [
+        I("div", null, [
+          I("h1", null, L(v.runtime.config.title), 1),
+          v.runtime.config.description ? (p(), w("p", Dt, L(v.runtime.config.description), 1)) : $("", !0)
+        ])
+      ])) : $("", !0),
+      v.runtime.config.filterBar ? (p(), z(at, {
+        key: 1,
+        config: v.runtime.config.filterBar,
+        context: u(c),
+        loading: u(f),
+        onChange: we,
+        onRefresh: ie
+      }, null, 8, ["config", "context", "loading"])) : $("", !0),
+      I("div", At, [
+        (p(!0), w(H, null, K(v.runtime.config.panels, (b) => (p(), w("div", {
+          key: b.id,
+          class: "dv-dashboard__cell",
+          "data-panel-id": b.id,
+          style: ue(A(b))
+        }, [
+          R(kt, {
+            ref_for: !0,
+            ref: (T) => W(b.id, T),
+            context: u(c),
+            definition: v.runtime.dataRuntime.registries.rendererDefinitions.require(b.rendererId),
+            "filter-summary": g.value,
+            panel: b,
+            "refresh-disabled": u(f),
+            renderer: F(b),
+            state: u(l)[b.id],
+            onAction: (T) => v.runtime.executePanelAction(b.id, T),
+            onExportCsv: (T) => oe(b.id),
+            onExportPng: (T) => re(b.id),
+            onRefresh: (T) => u(i)(b.id),
+            onRetry: (T) => u(a)(b.id),
+            onVisualizationEvent: m[0] || (m[0] = (T) => v.runtime.dispatchEvent(T))
+          }, null, 8, ["context", "definition", "filter-summary", "panel", "refresh-disabled", "renderer", "state", "onAction", "onExportCsv", "onExportPng", "onRefresh", "onRetry"])
+        ], 12, zt))), 128))
+      ])
+    ], 512));
+  }
+}), dn = /* @__PURE__ */ B(Lt, [["__scopeId", "data-v-6d4b5bdb"]]);
+function ne(r) {
+  return r.type === "percent" ? Z.PERCENT : r.type === "decimal" ? Z.DECIMAL : Z.COMMAS;
+}
+function ae(r) {
+  return typeof r == "object" && r !== null ? r : {};
+}
+const Tt = { class: "dv-chart-renderer dv-bar-renderer" }, Ft = /* @__PURE__ */ O({
+  __name: "BarRenderer",
+  props: {
+    viewModel: {},
+    panel: {},
+    context: {}
+  },
+  emits: ["visualizationEvent"],
+  setup(r, { expose: _, emit: o }) {
+    const e = r, h = o, x = j();
+    function C(c, l, f = !1) {
+      const d = f ? E.formatAxis(c, l.format, e.context) : E.formatTooltip(c, l.format, e.context), n = l.format.type === "currency" || l.format.type === "percent" || l.format.unit;
+      return c != null && c !== "" && l.unit && !n ? `${d}${l.unit}` : d;
+    }
+    const s = P(() => ({
+      categories: [...e.viewModel.categories],
+      colors: [...te],
+      orientation: e.viewModel.orientation,
+      ...e.viewModel.visibleCount !== void 0 ? { visibleCount: e.viewModel.visibleCount } : {},
+      grid: {
+        top: 18,
+        right: e.viewModel.orientation === "horizontal" && e.viewModel.showLabels ? 78 : 18,
+        bottom: 10,
+        left: 16,
+        containLabel: !0
+      },
+      categoryAxis: {
+        ...Q,
+        ...e.viewModel.orientation === "horizontal" && e.viewModel.visibleCount !== void 0 ? { inverse: !0 } : {},
+        axisLabel: { ...Q.axisLabel, interval: 0 }
+      },
+      valueAxis: {
+        ...G,
+        splitNumber: 4,
+        axisLabel: {
+          ...G.axisLabel,
+          hideOverlap: !0,
+          ...e.viewModel.series[0] ? { formatter: (c) => C(c, e.viewModel.series[0], !0) } : {}
+        }
+      },
+      tooltip: {
+        ...ee,
+        axisPointer: { type: "shadow", shadowStyle: { color: "rgba(91, 114, 238, 0.055)" } }
+      },
+      ...e.viewModel.stacked ? { stack: "total" } : {},
+      series: e.viewModel.series.map((c) => ({
+        name: c.label,
+        data: [...c.values],
+        formatType: ne(c.format),
+        valueFormatter: (l) => C(l, c),
+        showLabel: e.viewModel.showLabels,
+        itemStyle: {
+          borderRadius: e.viewModel.orientation === "horizontal" ? [0, 5, 5, 0] : [5, 5, 0, 0]
+        }
+      }))
+    }));
+    function S(c) {
+      const l = ae(c), f = typeof l.seriesIndex == "number" ? l.seriesIndex : 0, d = e.panel.binding.type === "bar" ? e.panel.binding : void 0;
+      d && h("visualizationEvent", {
+        type: "dataPointClick",
+        panelId: e.panel.id,
+        datasetId: d.datasetId,
+        fields: Object.freeze({
+          [d.categoryField]: l.name,
+          ...d.seriesField ? { [d.seriesField]: l.seriesName } : {},
+          [d.valueFields[d.seriesField ? 0 : f] ?? d.valueFields[0]]: l.value
+        })
+      });
+    }
+    function D() {
+      var c;
+      return (c = x.value) == null ? void 0 : c.exportPng();
+    }
+    return _({ exportPng: D }), (c, l) => (p(), w("div", Tt, [
+      R(u(Ae), {
+        ref_key: "chartRef",
+        ref: x,
+        option: s.value,
+        size: u(J).SMALL,
+        onDataPointClick: S
+      }, null, 8, ["option", "size"])
+    ]));
+  }
+}), Et = /* @__PURE__ */ B(Ft, [["__scopeId", "data-v-4f111bdf"]]), Vt = { class: "dv-chart-renderer dv-line-renderer" }, Ot = /* @__PURE__ */ O({
+  __name: "LineRenderer",
+  props: {
+    viewModel: {},
+    panel: {},
+    context: {}
+  },
+  emits: ["visualizationEvent"],
+  setup(r, { expose: _, emit: o }) {
+    const e = r, h = o, x = j();
+    function C(l, f) {
+      const d = E.formatAxis(l, f.format, e.context);
+      return s(d, f);
+    }
+    function s(l, f) {
+      const d = f.format.type === "currency" || f.format.type === "percent" || f.format.unit;
+      return f.unit && !d ? `${l}${f.unit}` : l;
+    }
+    const S = P(() => {
+      const l = Array.from(
+        new Map(e.viewModel.series.map((d) => [d.axisKey, d])).values()
+      ), f = new Map(l.map((d, n) => [d.axisKey, n]));
+      return {
+        colors: [...te],
+        grid: { top: 18, right: l.length > 1 ? 24 : 16, bottom: 10, left: 16, containLabel: !0 },
+        tooltip: {
+          ...ee,
+          axisPointer: { type: "line", lineStyle: { color: "#b8c1d1", type: "dashed" } }
+        },
+        xAxis: {
+          data: e.viewModel.categories.map(String),
+          ...Q,
+          ...e.viewModel.categoryFormat ? {
+            valueFormatter: (d) => E.formatAxis(d, e.viewModel.categoryFormat, e.context)
+          } : {}
+        },
+        yAxis: l.map((d, n) => ({
+          ...G,
+          position: n === 0 ? "left" : "right",
+          show: n < 2,
+          axisLabel: {
+            ...G.axisLabel,
+            formatter: (M) => C(M, d)
+          },
+          splitLine: {
+            show: n === 0,
+            lineStyle: { color: "#edf0f5", type: "dashed" }
+          }
+        })),
+        series: e.viewModel.series.map((d, n) => ({
+          name: d.label,
+          data: d.values.map((M) => M ?? void 0),
+          formatType: ne(d.format),
+          valueFormatter: (M) => {
+            const i = E.formatTooltip(M, d.format, e.context);
+            return M == null || M === "" ? i : s(i, d);
+          },
+          showLabel: e.viewModel.showLabels,
+          smooth: e.viewModel.smooth,
+          yAxisIndex: f.get(d.axisKey) ?? 0,
+          showSymbol: !1,
+          symbol: "circle",
+          symbolSize: 7,
+          lineStyle: { width: n === 0 ? 3 : 2.25 },
+          ...n === 0 ? {
+            areaStyle: {
+              opacity: 1,
+              color: {
+                type: "linear",
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                  { offset: 0, color: "rgba(79, 107, 237, 0.22)" },
+                  { offset: 1, color: "rgba(79, 107, 237, 0.015)" }
+                ]
+              }
+            }
+          } : {}
+        })),
+        markLine: {
+          xAxis: e.viewModel.annotations.filter((d) => d.type === "category").map((d) => String(d.value)),
+          yAxis: e.viewModel.annotations.filter((d) => d.type === "value").map((d) => String(d.value))
+        }
+      };
+    });
+    function D(l) {
+      const f = ae(l), d = typeof f.seriesIndex == "number" ? f.seriesIndex : 0, n = e.panel.binding.type === "line" ? e.panel.binding : void 0;
+      n && h("visualizationEvent", {
+        type: "dataPointClick",
+        panelId: e.panel.id,
+        datasetId: n.datasetId,
+        fields: Object.freeze({
+          [n.xField]: f.name,
+          ...n.seriesField ? { [n.seriesField]: f.seriesName } : {},
+          [n.yFields[n.seriesField ? 0 : d] ?? n.yFields[0]]: f.value
+        })
+      });
+    }
+    function c() {
+      var l;
+      return (l = x.value) == null ? void 0 : l.exportPng();
+    }
+    return _({ exportPng: c }), (l, f) => (p(), w("div", Vt, [
+      R(u(ze), {
+        ref_key: "chartRef",
+        ref: x,
+        option: S.value,
+        size: u(J).SMALL,
+        onDataPointClick: D
+      }, null, 8, ["option", "size"])
+    ]));
+  }
+}), Bt = /* @__PURE__ */ B(Ot, [["__scopeId", "data-v-efc34766"]]), Ut = { class: "dv-metric" }, Nt = { class: "dv-metric__value" }, jt = { class: "dv-metric__number" }, Yt = {
+  key: 0,
+  class: "dv-metric__unit"
+}, Ht = {
+  key: 0,
+  class: "dv-metric__comparison"
+}, qt = /* @__PURE__ */ O({
+  __name: "MetricRenderer",
+  props: {
+    viewModel: {},
+    panel: {},
+    context: {}
+  },
+  setup(r) {
+    const _ = r, o = P(
+      () => E.formatDisplay(_.viewModel.value, _.viewModel.format, _.context)
+    ), e = P(
+      () => _.viewModel.format.type === "currency" || _.viewModel.format.type === "percent" ? void 0 : _.viewModel.unit
+    ), h = P(() => {
+      const s = _.viewModel.comparison;
+      return s ? E.formatDisplay(s.value, s.format, _.context) : "";
+    }), x = P(() => {
+      var s, S;
+      return ((s = _.viewModel.comparison) == null ? void 0 : s.direction) === "up" ? me : ((S = _.viewModel.comparison) == null ? void 0 : S.direction) === "down" ? _e : ge;
+    }), C = P(() => {
+      const s = _.viewModel.comparison;
+      return !s || s.direction === "flat" ? "neutral" : s.colorMode === "direction" ? s.direction === "up" ? "unfavorable" : "favorable" : s.meaning === "neutral" ? "neutral" : s.meaning === "positive" && s.direction === "up" || s.meaning === "negative" && s.direction === "down" ? "favorable" : "unfavorable";
+    });
+    return (s, S) => (p(), w("div", Ut, [
+      I("div", Nt, [
+        I("span", jt, L(o.value), 1),
+        e.value ? (p(), w("span", Yt, L(e.value), 1)) : $("", !0)
+      ]),
+      s.viewModel.comparison ? (p(), w("div", Ht, [
+        I("span", null, L(s.viewModel.comparison.label), 1),
+        I("strong", {
+          class: q(`dv-metric__comparison--${C.value}`)
+        }, [
+          (p(), z(pe(x.value))),
+          U(" " + L(h.value), 1)
+        ], 2)
+      ])) : $("", !0)
+    ]));
+  }
+}), Kt = /* @__PURE__ */ B(qt, [["__scopeId", "data-v-efa26253"]]), Gt = { class: "dv-chart-renderer dv-pie-renderer" }, Wt = /* @__PURE__ */ O({
+  __name: "PieRenderer",
+  props: {
+    viewModel: {},
+    panel: {},
+    context: {}
+  },
+  emits: ["visualizationEvent"],
+  setup(r, { expose: _, emit: o }) {
+    const e = r, h = o, x = j();
+    function C(c) {
+      const l = E.formatTooltip(c, e.viewModel.valueFormat, e.context), f = e.viewModel.valueFormat.type === "currency" || e.viewModel.valueFormat.type === "percent" || e.viewModel.valueFormat.unit;
+      return e.viewModel.unit && !f ? `${l}${e.viewModel.unit}` : l;
+    }
+    const s = P(() => ({
+      colors: [...te],
+      donut: e.viewModel.donut,
+      showLegend: e.viewModel.showLegend,
+      showLabels: !1,
+      center: ["50%", "43%"],
+      radius: e.viewModel.donut ? ["50%", "70%"] : "70%",
+      itemStyle: { borderColor: "#fff", borderWidth: 3, borderRadius: 4 },
+      tooltip: { ...ee },
+      series: e.viewModel.items.map((c) => ({
+        name: c.label,
+        data: c.value,
+        formatType: ne(e.viewModel.valueFormat),
+        valueFormatter: C
+      })),
+      ...e.viewModel.donut ? {
+        aggregation: {
+          total: e.viewModel.items.reduce((c, l) => c + l.value, 0),
+          label: e.panel.title.replace(/占比$/, ""),
+          valueFormatter: C,
+          ...e.viewModel.unit ? { unit: e.viewModel.unit } : {}
+        }
+      } : {}
+    }));
+    function S(c) {
+      const l = ae(c), f = e.panel.binding.type === "pie" ? e.panel.binding : void 0;
+      f && h("visualizationEvent", {
+        type: "dataPointClick",
+        panelId: e.panel.id,
+        datasetId: f.datasetId,
+        fields: Object.freeze({ [f.nameField]: l.name, [f.valueField]: l.value })
+      });
+    }
+    function D() {
+      var c;
+      return (c = x.value) == null ? void 0 : c.exportPng();
+    }
+    return _({ exportPng: D }), (c, l) => (p(), w("div", Gt, [
+      R(u(Le), {
+        ref_key: "chartRef",
+        ref: x,
+        option: s.value,
+        size: u(J).SMALL,
+        onDataPointClick: S
+      }, null, 8, ["option", "size"])
+    ]));
+  }
+}), Zt = /* @__PURE__ */ B(Wt, [["__scopeId", "data-v-ccdee116"]]), Qt = { class: "dv-table-scroll" }, Xt = /* @__PURE__ */ O({
+  __name: "TableRenderer",
+  props: {
+    viewModel: {},
+    panel: {},
+    context: {}
+  },
+  emits: ["visualizationEvent"],
+  setup(r, { emit: _ }) {
+    const o = r, e = _, h = P(
+      () => o.viewModel.columns.map((a) => ({
+        title: a.label,
+        dataIndex: a.field,
+        key: a.field,
+        ...a.width ? { width: a.width } : {},
+        sorter: a.sortable,
+        ...a.filterable ? {
+          filters: Array.from(new Set(o.viewModel.rows.map((t) => String(t[a.field] ?? "")))).slice(0, 50).map((t) => ({ text: t || "--", value: t })),
+          onFilter: (t, g) => String(g[a.field] ?? "") === String(t)
+        } : {},
+        customRender: ({ text: t }) => C(t, a)
+      }))
+    );
+    function x(a, t) {
+      return E.formatDisplay(
+        a,
+        t.format ?? {
+          type: t.dataType === "date" ? "date" : t.dataType === "datetime" ? "datetime" : "number"
+        },
+        o.context
+      );
+    }
+    function C(a, t) {
+      const g = x(a, t);
+      return t.display ? t.display.type === "progress" ? S(a, g, t.display) : t.display.type === "trend" ? D(a, g, t.display) : c(a, g, t.display) : g;
+    }
+    function s(a) {
+      return typeof a == "number" && Number.isFinite(a) ? a : void 0;
+    }
+    function S(a, t, g) {
+      const y = s(a);
+      if (y === void 0) return t;
+      const A = g.max ?? 1, F = Math.min(100, Math.max(0, y / A * 100));
+      return V("div", { class: "dv-table__progress-cell" }, [
+        V(qe, { percent: F, showInfo: !1, size: "small", strokeWidth: 6 }),
+        V("span", { class: "dv-table__cell-value" }, t)
+      ]);
+    }
+    function D(a, t, g) {
+      const y = s(a);
+      if (y === void 0) return t;
+      const A = y > 0 ? g.positiveTone ?? "success" : y < 0 ? g.negativeTone ?? "danger" : g.zeroTone ?? "neutral", F = y > 0 ? me : y < 0 ? _e : ge;
+      return V("span", { class: ["dv-table__trend", `dv-table__trend--${A}`] }, [V(F), V("span", t)]);
+    }
+    function c(a, t, g) {
+      var A;
+      const y = ((A = g.toneByValue) == null ? void 0 : A[String(a ?? "")]) ?? g.defaultTone ?? "neutral";
+      return l(t, y);
+    }
+    function l(a, t, g) {
+      return V(
+        Ke,
+        { class: ["dv-table__tag", `dv-table__tag--${t}`] },
+        { default: () => [V("span", a)] }
+      );
+    }
+    const f = /* @__PURE__ */ new WeakMap();
+    let d = 0;
+    function n(a) {
+      const t = f.get(a);
+      if (t) return t;
+      const g = `row-${++d}`;
+      return f.set(a, g), g;
+    }
+    function M(a) {
+      return {
+        onClick: () => e("visualizationEvent", {
+          type: "rowClick",
+          panelId: o.panel.id,
+          datasetId: o.panel.binding.datasetId,
+          fields: a
+        })
+      };
+    }
+    function i() {
+    }
+    return (a, t) => (p(), w("div", Qt, [
+      R(u(Ge), {
+        class: "dv-table",
+        columns: h.value,
+        "data-source": [...a.viewModel.rows],
+        pagination: a.viewModel.showPagination ? { pageSize: a.viewModel.pageSize, showSizeChanger: !1 } : !1,
+        "row-key": n,
+        scroll: { x: "max-content" },
+        size: "small",
+        onChange: i,
+        "custom-row": M
+      }, null, 8, ["columns", "data-source", "pagination"])
+    ]));
+  }
+}), Jt = /* @__PURE__ */ B(Xt, [["__scopeId", "data-v-c8a717c4"]]);
+function cn(r) {
+  return r.registerMany([
+    { id: "metric", component: Kt },
+    { id: "line", component: Bt },
+    { id: "bar", component: Et },
+    { id: "pie", component: Zt },
+    { id: "table", component: Jt }
+  ]), r;
+}
+class en extends Xe {
+  constructor() {
+    super("VueVisualizationRenderer");
+  }
+}
+function un() {
+  return new en();
+}
+export {
+  Et as BarRenderer,
+  at as DashboardFilterBar,
+  kt as DashboardPanel,
+  dn as DashboardRenderer,
+  Bt as LineRenderer,
+  Kt as MetricRenderer,
+  Zt as PieRenderer,
+  Q as STANDARD_CATEGORY_AXIS,
+  te as STANDARD_CHART_COLORS,
+  ee as STANDARD_CHART_TOOLTIP,
+  G as STANDARD_VALUE_AXIS,
+  Jt as TableRenderer,
+  en as VueRendererRegistry,
+  ae as chartEventFields,
+  un as createVueRendererRegistry,
+  It as downloadBlob,
+  $t as downloadDataUrl,
+  cn as registerStandardVueRenderers,
+  ne as toChartFormat,
+  Rt as useDashboardRuntime
+};
+//# sourceMappingURL=index.js.map