@orchidui/dashboard 1.51.0 → 1.52.0

package/dist/Dashboard/Charts/OverviewPieChart/OcOverviewPieChart.js

@@ -1,5 +1,5 @@
 import { defineAsyncComponent as e } from "vue";
-const r = e(() => import("../../../OcOverviewPieChart-D_5Rlnk-.js"));
+const r = e(() => import("../../../OcOverviewPieChart-D2YLaN_P.js"));
 export {
   r as OcOverviewPieChart
 };

package/dist/OcOverviewPieChart-D2YLaN_P.js

@@ -0,0 +1,100 @@
+import { ref as m, computed as y, watch as x, nextTick as C, createElementBlock as u, openBlock as d, createElementVNode as a, createCommentVNode as F, toDisplayString as f, Fragment as w, renderList as k, normalizeStyle as S } from "vue";
+import { u as V } from "./useChart-D5nAyTGV.js";
+import "./dayjs.min-CTPVfFeV.js";
+const L = { class: "flex flex-col items-center justify-center" }, N = { class: "relative w-[210px] h-[210px]" }, T = { class: "absolute inset-0 flex flex-col items-center justify-center pointer-events-none" }, O = { class: "text-center" }, j = { class: "text-oc-text-400" }, E = { class: "text-lg font-semibold font-reddit-mono" }, P = {
+  key: 0,
+  class: "mt-4 flex flex-wrap gap-3 justify-center"
+}, z = { class: "text-sm" }, U = {
+  __name: "OcOverviewPieChart",
+  props: {
+    chartData: Array
+  },
+  setup(r) {
+    const o = r, s = m(""), n = m(0), b = (e, t = "SGD") => (typeof e == "number" ? e : Number(e)).toLocaleString("en-US", {
+      minimumFractionDigits: 2,
+      maximumFractionDigits: 2
+    }), _ = (e) => {
+      const t = typeof e == "number" ? e : Number(e);
+      return l.value ? Math.round(t / l.value * 100) : 0;
+    }, l = y(() => !o.chartData || o.chartData.length === 0 ? 0 : o.chartData.reduce((e, t) => e + (t.value || 0), 0)), h = () => {
+      s.value = "Total", n.value = l.value;
+    }, g = y(() => ({
+      series: [{
+        id: "overviewPieChart",
+        data: o.chartData || [],
+        type: "pie",
+        radius: ["80%", "100%"],
+        avoidLabelOverlap: !1,
+        itemStyle: {
+          borderRadius: 6,
+          borderColor: "#fff",
+          borderWidth: 2
+        },
+        label: {
+          show: !1
+          // Hide default labels
+        },
+        labelLine: {
+          show: !1
+        },
+        // Emphasize hovered/active slice and blur others to gray
+        emphasis: {
+          scale: !1,
+          focus: "self",
+          label: { show: !1 }
+        },
+        blur: {
+          itemStyle: {
+            color: "#F2F2F4"
+            // Tailwind gray-200
+          },
+          label: { show: !1 }
+        }
+      }]
+    })), v = m(), { chart: p } = V(v, g), D = (e) => {
+      const t = ["#356DFF", "#AEC5FF", "#86FFCC"];
+      return t[e % t.length];
+    };
+    return x(p, async (e) => {
+      e && (await C(), h(), e.on("mouseover", "series", (t) => {
+        if (t.componentType === "series" && t.seriesType === "pie") {
+          const c = t.name || "Unknown", i = t.value || 0;
+          s.value = `${c} (${_(i)}%)`, n.value = t.value || 0;
+        }
+      }), e.on("mouseout", "series", () => {
+        s.value = "Total", n.value = l.value;
+      }));
+    }), x(() => o.chartData, () => {
+      p.value && h();
+    }, { deep: !0 }), (e, t) => (d(), u("div", L, [
+      a("div", N, [
+        a("div", {
+          ref_key: "pieChart",
+          ref: v,
+          class: "w-[210px] h-[210px]"
+        }, null, 512),
+        a("div", T, [
+          a("div", O, [
+            a("div", j, f(s.value), 1),
+            a("div", E, "SGD " + f(b(n.value)), 1)
+          ])
+        ])
+      ]),
+      r.chartData && r.chartData.length > 0 ? (d(), u("div", P, [
+        (d(!0), u(w, null, k(r.chartData, (c, i) => (d(), u("div", {
+          key: i,
+          class: "flex items-center gap-2 cursor-pointer hover:opacity-80 transition-opacity"
+        }, [
+          a("div", {
+            class: "w-3 h-3 rounded-full",
+            style: S({ backgroundColor: D(i) })
+          }, null, 4),
+          a("span", z, f(c.name), 1)
+        ]))), 128))
+      ])) : F("", !0)
+    ]));
+  }
+};
+export {
+  U as default
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@orchidui/dashboard",
   "description": "Orchid Dashboard UI , Dashboard Ui Library Vue 3 tailwind css",
-  "version": "1.51.0",
+  "version": "1.52.0",
   "type": "module",
   "scripts": {
     "build": "vite build"
@@ -35,7 +35,7 @@
   "dependencies": {
     "dayjs": "^1.11.10",
     "echarts": "^5.4.3",
-    "@orchidui/core": "1.51.0",
+    "@orchidui/core": "1.52.0",
     "lottie-web": "^5.12.2",
     "quill": "^2.0.3",
     "quill-better-table": "^1.2.10",

package/dist/OcOverviewPieChart-D_5Rlnk-.js

@@ -1,94 +0,0 @@
-import { ref as d, computed as x, watch as y, nextTick as C, createElementBlock as i, openBlock as c, createElementVNode as a, createCommentVNode as k, toDisplayString as h, Fragment as w, renderList as F, normalizeStyle as L } from "vue";
-import { u as S } from "./useChart-D5nAyTGV.js";
-import "./dayjs.min-CTPVfFeV.js";
-const V = { class: "flex flex-col items-center justify-center" }, T = { class: "relative w-[210px] h-[210px]" }, I = { class: "absolute inset-0 flex flex-col items-center justify-center pointer-events-none" }, O = { class: "text-center" }, j = { class: "text-oc-text-400" }, A = { class: "text-lg font-semibold font-reddit-mono" }, E = {
-  key: 0,
-  class: "mt-4 flex flex-wrap gap-3 justify-center"
-}, N = ["onClick"], z = { class: "text-sm" }, R = {
-  __name: "OcOverviewPieChart",
-  props: {
-    chartData: Array
-  },
-  setup(r) {
-    const s = r, n = d(""), o = d(0), _ = (e, t = "SGD") => (typeof e == "number" ? e : Number(e)).toLocaleString("en-US", {
-      minimumFractionDigits: 2,
-      maximumFractionDigits: 2
-    }), m = x(() => !s.chartData || s.chartData.length === 0 ? 0 : s.chartData.reduce((e, t) => e + (t.value || 0), 0)), v = () => {
-      n.value = "Total", o.value = m.value;
-    }, g = x(() => ({
-      series: [{
-        id: "overviewPieChart",
-        data: s.chartData || [],
-        type: "pie",
-        radius: ["80%", "100%"],
-        avoidLabelOverlap: !1,
-        itemStyle: {
-          borderRadius: 6,
-          borderColor: "#fff",
-          borderWidth: 2
-        },
-        label: {
-          show: !1
-          // Hide default labels
-        },
-        labelLine: {
-          show: !1
-        },
-        emphasis: {
-          disabled: !0,
-          label: {
-            show: !1
-          }
-        }
-      }]
-    })), f = d(), { chart: l } = S(f, g), D = (e) => {
-      const t = ["#356DFF", "#AEC5FF", "#86FFCC"];
-      return t[e % t.length];
-    }, b = (e) => {
-      n.value = e.name, o.value = e.value, l.value && l.value.dispatchAction({
-        type: "highlight",
-        seriesIndex: 0,
-        dataIndex: s.chartData.findIndex((t) => t.name === e.name)
-      });
-    };
-    return y(l, async (e) => {
-      e && (await C(), v(), e.on("mouseover", "series", (t) => {
-        t.componentType === "series" && t.seriesType === "pie" && (n.value = t.name || "Unknown", o.value = t.value || 0);
-      }), e.on("mouseout", "series", () => {
-        n.value = "Total", o.value = m.value;
-      }));
-    }), y(() => s.chartData, () => {
-      l.value && v();
-    }, { deep: !0 }), (e, t) => (c(), i("div", V, [
-      a("div", T, [
-        a("div", {
-          ref_key: "pieChart",
-          ref: f,
-          class: "w-[210px] h-[210px]"
-        }, null, 512),
-        a("div", I, [
-          a("div", O, [
-            a("div", j, h(n.value), 1),
-            a("div", A, "SGD " + h(_(o.value)), 1)
-          ])
-        ])
-      ]),
-      r.chartData && r.chartData.length > 0 ? (c(), i("div", E, [
-        (c(!0), i(w, null, F(r.chartData, (u, p) => (c(), i("div", {
-          key: p,
-          class: "flex items-center gap-2 cursor-pointer hover:opacity-80 transition-opacity",
-          onClick: (B) => b(u)
-        }, [
-          a("div", {
-            class: "w-3 h-3 rounded-full",
-            style: L({ backgroundColor: D(p) })
-          }, null, 4),
-          a("span", z, h(u.name), 1)
-        ], 8, N))), 128))
-      ])) : k("", !0)
-    ]));
-  }
-};
-export {
-  R as default
-};