@orchidui/dashboard 1.8.1-93 → 1.8.1-96

package/dist/ui/chart/index.js

@@ -0,0 +1,8 @@
+import { a as r, _ as s, a9 as t, al as l, d as C } from "../../index-CumjCvqB.js";
+export {
+  r as ChartCrosshair,
+  s as ChartLegend,
+  t as ChartSingleTooltip,
+  l as ChartTooltip,
+  C as defaultColors
+};

package/dist/ui/chart/interface.js

@@ -0,0 +1 @@
+

package/dist/ui/chart-area/index.js

@@ -0,0 +1,331 @@
+import { defineComponent as U, inject as W, computed as N, ref as q, createElementBlock as S, onMounted as Z, nextTick as ee, onUnmounted as te, watch as E, openBlock as h, normalizeClass as ae, unref as v, createBlock as A, createCommentVNode as B, createVNode as oe, normalizeStyle as ne, withCtx as re, renderSlot as se, createElementVNode as F, Fragment as G, renderList as H } from "vue";
+import { w as ie, c as x, X as le, b as J, i as ce, e as ue, f as de, g as I, h as _, j as fe, k as z, s as R, l as pe, m as ye, n as me, o as he, p as ve, q as ge, r as ke, d as xe, _ as be, a as we } from "../../index-CumjCvqB.js";
+import { u as Ce } from "../../index-B3LW8uSH.js";
+import { c as Se } from "../../utils-SFgRDk1R.js";
+import { c as Ae, x as Te, y as $e, l as De, C as K, a as je, i as Be, S as Ge, L as Me } from "../../index-BlGEiPHj.js";
+import { u as Pe } from "../../useId-reAg216X.js";
+import { $ as Le, O as V, A as Oe } from "../../index-LqWMCtOd.js";
+import { a as Xe } from "../../array-CqVTtuYm.js";
+function Fe(y, i, t) {
+  var l = null, u = x(!0), f = null, c = Ae, o = null, w = ie(r);
+  y = typeof y == "function" ? y : y === void 0 ? Te : x(+y), i = typeof i == "function" ? i : i === void 0 ? x(0) : x(+i), t = typeof t == "function" ? t : t === void 0 ? $e : x(+t);
+  function r(e) {
+    var a, m, g, p = (e = Xe(e)).length, s, d = !1, b, k = new Array(p), C = new Array(p);
+    for (f == null && (o = c(b = w())), a = 0; a <= p; ++a) {
+      if (!(a < p && u(s = e[a], a, e)) === d)
+        if (d = !d)
+          m = a, o.areaStart(), o.lineStart();
+        else {
+          for (o.lineEnd(), o.lineStart(), g = a - 1; g >= m; --g)
+            o.point(k[g], C[g]);
+          o.lineEnd(), o.areaEnd();
+        }
+      d && (k[a] = +y(s, a, e), C[a] = +i(s, a, e), o.point(l ? +l(s, a, e) : k[a], t ? +t(s, a, e) : C[a]));
+    }
+    if (b) return o = null, b + "" || null;
+  }
+  function n() {
+    return De().defined(u).curve(c).context(f);
+  }
+  return r.x = function(e) {
+    return arguments.length ? (y = typeof e == "function" ? e : x(+e), l = null, r) : y;
+  }, r.x0 = function(e) {
+    return arguments.length ? (y = typeof e == "function" ? e : x(+e), r) : y;
+  }, r.x1 = function(e) {
+    return arguments.length ? (l = e == null ? null : typeof e == "function" ? e : x(+e), r) : l;
+  }, r.y = function(e) {
+    return arguments.length ? (i = typeof e == "function" ? e : x(+e), t = null, r) : i;
+  }, r.y0 = function(e) {
+    return arguments.length ? (i = typeof e == "function" ? e : x(+e), r) : i;
+  }, r.y1 = function(e) {
+    return arguments.length ? (t = e == null ? null : typeof e == "function" ? e : x(+e), r) : t;
+  }, r.lineX0 = r.lineY0 = function() {
+    return n().x(y).y(i);
+  }, r.lineY1 = function() {
+    return n().x(y).y(t);
+  }, r.lineX1 = function() {
+    return n().x(l).y(i);
+  }, r.defined = function(e) {
+    return arguments.length ? (u = typeof e == "function" ? e : x(!!e), r) : u;
+  }, r.curve = function(e) {
+    return arguments.length ? (c = e, f != null && (o = c(f)), r) : c;
+  }, r.context = function(e) {
+    return arguments.length ? (e == null ? f = o = null : o = c(f = e), r) : f;
+  }, r;
+}
+const He = Object.assign(Object.assign({}, le), { color: void 0, curveType: K.MonotoneX, baseline: () => 0, opacity: 1, cursor: null, minHeight1Px: !1, minHeight: void 0 }), Q = J`
+  label: area-component;
+`, Ne = ce`
+  :root {
+    --vis-area-cursor: default;
+    --vis-area-fill-opacity: 1;
+    --vis-area-stroke-color: none;
+    --vis-area-stroke-width: 0px;
+    --vis-area-stroke-dasharray: none;
+    --vis-area-stroke-opacity: 1;
+    --vis-area-hover-fill-opacity: none;
+    --vis-area-hover-stroke-width: none;
+
+    /* Dark Theme */
+    --vis-dark-area-stroke-color: none;
+  }
+
+  body.theme-dark ${`.${Q}`} {
+    --vis-area-stroke-color: var(--vis-dark-area-stroke-color);
+  }
+
+`, Y = J`
+  label: area;
+  cursor: var(--vis-area-cursor);
+  fill-opacity: var(--vis-area-fill-opacity);
+  stroke-width: var(--vis-area-stroke-width);
+  stroke-dasharray: var(--vis-area-stroke-dasharray);
+  stroke: var(--vis-area-stroke-color);
+  stroke-opacity: var(--vis-area-stroke-opacity);
+
+  &:hover {
+    fill-opacity: var(--vis-area-hover-fill-opacity);
+    stroke-width: var(--vis-area-hover-stroke-width);
+  }
+`, Ye = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  area: Y,
+  globalStyles: Ne,
+  root: Q
+}, Symbol.toStringTag, { value: "Module" }));
+class T extends ue {
+  constructor(i) {
+    super(), this._defaultConfig = He, this.config = this._defaultConfig, this.stacked = !0, this.events = {
+      [T.selectors.area]: {}
+    }, i && this.setConfig(i), this.stacked = Array.isArray(this.config.y);
+  }
+  _render(i) {
+    super._render(i);
+    const { config: t, datamodel: { data: l } } = this, u = de(i) ? i : t.duration, f = je[t.curveType];
+    this._areaGen = Fe().x((s) => s.x).y0((s) => s.y0).y1((s) => s.y1).curve(f);
+    const c = I(t.y) ? t.y : [t.y], o = l.map((s, d) => this.xScale(_(s, t.x, d))), w = fe(l, t.baseline, c, this._prevNegative);
+    this._prevNegative = w.map((s) => !!s.isMostlyNegative);
+    const r = [], n = w.map((s) => s.map((d, b) => {
+      var k, C;
+      const M = o[b], P = this.yScale(d[0]), L = this.yScale(d[1]), O = L > P, $ = r[b] || 0, X = O ? P + $ : P - $, D = O ? L + $ : L - $;
+      let j = 0;
+      return (t.minHeight || t.minHeight1Px) && Math.abs(D - X) < ((k = t.minHeight) !== null && k !== void 0 ? k : 1) && (j = ((C = t.minHeight) !== null && C !== void 0 ? C : 1) - Math.abs(D - X), r[b] = $ + j), {
+        x: M,
+        y0: X,
+        y1: O ? D + j : D - j
+      };
+    })), e = n.length - 1, a = n.reverse(), m = this.g.selectAll(`.${Y}`).data(a), g = m.enter().append("path").attr("class", Y).attr("d", (s) => this._areaGen(s) || this._emptyPath()).style("opacity", 0).style("fill", (s, d) => z(l, t.color, e - d)), p = R(g.merge(m), u).style("opacity", (s, d) => s.some((k) => k.y0 - k.y1 !== 0) ? _(l, t.opacity, e - d) : 0).style("fill", (s, d) => z(l, t.color, e - d)).style("cursor", (s, d) => pe(l, t.cursor, e - d));
+    u ? p.attrTween("d", (d, b, k) => {
+      const C = ye(k[b]).attr("d"), M = this._areaGen(d) || this._emptyPath();
+      return Be(C, M);
+    }) : p.attr("d", (s) => this._areaGen(s) || this._emptyPath()), R(m.exit(), u).style("opacity", 0).remove();
+  }
+  getYDataExtent(i) {
+    const { config: t, datamodel: l } = this, u = I(t.y) ? t.y : [t.y], f = i ? me(l.data, this.xScale.domain(), t.x) : l.data;
+    return he(f, t.baseline, ...u);
+  }
+  _emptyPath() {
+    const i = this.xScale.range(), t = this.yScale.domain(), l = this.yScale((t[0] + t[1]) / 2), u = l;
+    return this._areaGen([
+      { y0: l, y1: u, x: i[0] },
+      { y0: l, y1: u, x: i[1] }
+    ]);
+  }
+}
+T.selectors = Ye;
+const Ee = { "data-vis-component": "" };
+T.selectors;
+const Ie = /* @__PURE__ */ U({
+  __name: "index",
+  props: {
+    color: {},
+    curveType: {},
+    baseline: {},
+    opacity: {},
+    cursor: {},
+    minHeight1Px: { type: Boolean },
+    minHeight: {},
+    x: {},
+    y: {},
+    id: { type: Function },
+    xScale: { type: [Object, Function] },
+    yScale: { type: [Object, Function] },
+    excludeFromDomainCalculation: { type: Boolean },
+    duration: {},
+    events: {},
+    attributes: {},
+    data: {}
+  },
+  setup(y, { expose: i }) {
+    const t = W(ve), l = y, u = N(() => t.data.value ?? l.data), f = ge(l), c = q();
+    return Z(() => {
+      ee(() => {
+        var o;
+        c.value = new T(f.value), (o = c.value) == null || o.setData(u.value), t.update(c.value);
+      });
+    }), te(() => {
+      var o;
+      (o = c.value) == null || o.destroy(), t.destroy();
+    }), E(f, (o, w) => {
+      var r;
+      ke(o, w) || (r = c.value) == null || r.setConfig(f.value);
+    }), E(u, () => {
+      var o;
+      (o = c.value) == null || o.setData(u.value);
+    }), i({
+      component: c
+    }), (o, w) => (h(), S("div", Ee));
+  }
+}), _e = {
+  width: "0",
+  height: "0"
+}, ze = ["id"], Re = ["stop-color"], Ve = ["stop-color"], Ue = ["stop-color"], at = /* @__PURE__ */ U({
+  __name: "AreaChart",
+  props: {
+    data: {},
+    categories: {},
+    index: {},
+    colors: {},
+    margin: { default: () => ({ top: 0, bottom: 0, left: 0, right: 0 }) },
+    filterOpacity: { default: 0.2 },
+    xFormatter: {},
+    yFormatter: {},
+    showXAxis: { type: Boolean, default: !0 },
+    showYAxis: { type: Boolean, default: !0 },
+    showTooltip: { type: Boolean, default: !0 },
+    showLegend: { type: Boolean, default: !0 },
+    showGridLine: { type: Boolean, default: !0 },
+    customTooltip: {},
+    curveType: { default: K.MonotoneX },
+    showGradiant: { type: Boolean, default: !0 }
+  },
+  emits: ["legendItemClick"],
+  setup(y, { emit: i }) {
+    const t = y, l = i, u = Pe(), f = N(() => t.index), c = N(() => {
+      var n;
+      return (n = t.colors) != null && n.length ? t.colors : xe(t.categories.length);
+    }), o = q(t.categories.map((n, e) => ({
+      name: n,
+      color: c.value[e],
+      inactive: !1
+    }))), w = Ce();
+    function r(n, e) {
+      l("legendItemClick", n, e);
+    }
+    return (n, e) => (h(), S("div", {
+      class: ae(v(Se)("w-full h-[400px] flex flex-col items-end", n.$attrs.class ?? ""))
+    }, [
+      n.showLegend ? (h(), A(v(be), {
+        key: 0,
+        items: o.value,
+        "onUpdate:items": e[0] || (e[0] = (a) => o.value = a),
+        onLegendItemClick: r
+      }, null, 8, ["items"])) : B("", !0),
+      oe(v(Le), {
+        style: ne({ height: v(w) ? "100%" : "auto" }),
+        margin: { left: 20, right: 20 },
+        data: n.data
+      }, {
+        default: re(() => [
+          (h(), S("svg", _e, [
+            F("defs", null, [
+              (h(!0), S(G, null, H(c.value, (a, m) => (h(), S("linearGradient", {
+                id: `${v(u)}-color-${m}`,
+                key: m,
+                x1: "0",
+                y1: "0",
+                x2: "0",
+                y2: "1"
+              }, [
+                n.showGradiant ? (h(), S(G, { key: 0 }, [
+                  F("stop", {
+                    offset: "5%",
+                    "stop-color": a,
+                    "stop-opacity": "0.4"
+                  }, null, 8, Re),
+                  F("stop", {
+                    offset: "95%",
+                    "stop-color": a,
+                    "stop-opacity": "0"
+                  }, null, 8, Ve)
+                ], 64)) : (h(), S("stop", {
+                  key: 1,
+                  offset: "0%",
+                  "stop-color": a
+                }, null, 8, Ue))
+              ], 8, ze))), 128))
+            ])
+          ])),
+          n.showTooltip ? (h(), A(v(we), {
+            key: 0,
+            colors: c.value,
+            items: o.value,
+            index: f.value,
+            "custom-tooltip": n.customTooltip
+          }, null, 8, ["colors", "items", "index", "custom-tooltip"])) : B("", !0),
+          (h(!0), S(G, null, H(n.categories, (a, m) => {
+            var g;
+            return h(), A(v(Ie), {
+              key: a,
+              x: (p, s) => s,
+              y: (p) => p[a],
+              color: "auto",
+              "curve-type": n.curveType,
+              attributes: {
+                [v(T).selectors.area]: {
+                  fill: `url(#${v(u)}-color-${m})`
+                }
+              },
+              opacity: (g = o.value.find((p) => p.name === a)) != null && g.inactive ? n.filterOpacity : 1
+            }, null, 8, ["x", "y", "curve-type", "attributes", "opacity"]);
+          }), 128)),
+          (h(!0), S(G, null, H(n.categories, (a, m) => {
+            var g;
+            return h(), A(v(Ge), {
+              key: a,
+              x: (p, s) => s,
+              y: (p) => p[a],
+              color: c.value[m],
+              "curve-type": n.curveType,
+              attributes: {
+                [v(Me).selectors.line]: {
+                  opacity: (g = o.value.find((p) => p.name === a)) != null && g.inactive ? n.filterOpacity : 1
+                }
+              }
+            }, null, 8, ["x", "y", "color", "curve-type", "attributes"]);
+          }), 128)),
+          n.showXAxis ? (h(), A(v(V), {
+            key: 1,
+            type: "x",
+            "tick-format": n.xFormatter ?? ((a) => {
+              var m;
+              return (m = n.data[a]) == null ? void 0 : m[f.value];
+            }),
+            "grid-line": !1,
+            "tick-line": !1,
+            "tick-text-color": "hsl(var(--vis-text-color))"
+          }, null, 8, ["tick-format"])) : B("", !0),
+          n.showYAxis ? (h(), A(v(V), {
+            key: 2,
+            type: "y",
+            "tick-line": !1,
+            "tick-format": n.yFormatter,
+            "domain-line": !1,
+            "grid-line": n.showGridLine,
+            attributes: {
+              [v(Oe).selectors.grid]: {
+                class: "text-muted"
+              }
+            },
+            "tick-text-color": "hsl(var(--vis-text-color))"
+          }, null, 8, ["tick-format", "grid-line", "attributes"])) : B("", !0),
+          se(n.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["style", "data"])
+    ], 2));
+  }
+});
+export {
+  at as AreaChart
+};