vue-data-ui 3.5.2 → 3.7.0

package/dist/{vue-ui-table-CcuoPHgI.js → vue-ui-table-DMM090pe.js}

@@ -1,8 +1,8 @@
-import { L as Y, t as W, S as G, Q as J, d as K, U as Z, P as q, ai as Q, h as $, J as ee, s as E, p as te } from "./lib-C_mNZmhD.js";
-import { u as se } from "./useNestedProp-CReNavA0.js";
-import ne from "./vue-ui-xy-Cz2qIEfi.js";
-import re from "./vue-ui-donut-B_tEm4dT.js";
-import le from "./BaseIcon-BmMbm4d0.js";
+import { m as Y, t as W, n as G, q as J, d as K, r as Z, u as q, v as Q, l as $, w as ee, s as E, p as te } from "./lib-C5BH09_g.js";
+import { u as se } from "./useNestedProp-CWo6bftQ.js";
+import { V as ne } from "./vue-ui-xy-Cy7mOurZ.js";
+import { V as re } from "./vue-ui-donut-BLb0kj_P.js";
+import le from "./BaseIcon-CofSxalQ.js";
 import { resolveComponent as D, createElementBlock as u, openBlock as c, normalizeStyle as g, createCommentVNode as b, createElementVNode as a, toDisplayString as h, withDirectives as O, withKeys as L, withModifiers as S, vModelText as A, createVNode as P, Fragment as C, renderList as k, normalizeClass as p, createTextVNode as _, vModelSelect as H, createBlock as R, ref as oe, computed as ae, useCssVars as ie } from "vue";
 import { _ as ce } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const x = {

package/dist/vue-ui-table-heatmap-vQEFrjCX.js

@@ -0,0 +1,307 @@
+import { useCssVars as de, computed as v, defineAsyncComponent as ce, ref as b, useSlots as pe, onMounted as R, watch as ve, createElementBlock as r, openBlock as s, unref as i, normalizeClass as U, normalizeStyle as y, createBlock as fe, createCommentVNode as f, createElementVNode as g, createSlots as me, withCtx as h, renderSlot as u, normalizeProps as B, guardReactiveProps as D, Fragment as k, renderList as F, mergeProps as m, createVNode as be, nextTick as ge } from "vue";
+import { c as G, o as he, g as Ce, ak as ye, w as ke, ai as _e, u as Ie, q as $e } from "./lib-C5BH09_g.js";
+import { u as Fe, a as w } from "./useNestedProp-CWo6bftQ.js";
+import { u as we } from "./usePrinter-DCJzEiS8.js";
+import { u as Oe } from "./useThemeCheck-DGJ31Vi5.js";
+import { u as Ae } from "./useUserOptionState-BIvW1Kz7.js";
+import { _ as xe } from "./Shape-DE6X_t31.js";
+import { _ as Pe } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const H = { style: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, table: { head: { backgroundColor: "#1A1A1A", color: "#CCCCCC" } } }, L = { style: { backgroundColor: "#FFF8E1", color: "#424242", heatmapColors: { min: "#FFECB3", max: "#D32F2F" } }, table: { head: { backgroundColor: "#FFF8E1", color: "#424242" } } }, X = { style: { backgroundColor: "#1A1A1A", color: "#99AA99", heatmapColors: { min: "#333333", max: "#66CC66" } }, table: { head: { backgroundColor: "#1A1A1A", color: "#99AA99" } } }, W = { style: { backgroundColor: "#fbfafa", color: "#8A9892", heatmapColors: { max: "#C09E85", min: "#DCDFE7" } }, table: { head: { backgroundColor: "#fbfafa", color: "#8A9892" } } }, q = { style: { backgroundColor: "#f6f6fb", color: "#50606C", heatmapColors: { max: "#4A6A75", min: "#EFECEC" } }, table: { head: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, J = {
+  default: {},
+  dark: H,
+  celebration: L,
+  hack: X,
+  zen: W,
+  concrete: q
+}, Ye = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  celebration: L,
+  concrete: q,
+  dark: H,
+  default: J,
+  hack: X,
+  zen: W
+}, Symbol.toStringTag, { value: "Module" })), Ee = ["id"], Se = { role: "cell" }, Te = { role: "row" }, Ne = ["data-cell"], Ve = {
+  key: 0,
+  style: { display: "flex", "flex-direction": "row", gap: "2px", "align-items": "center" }
+}, Me = ["height", "width"], ze = {
+  key: 0,
+  role: "cell",
+  "data-cell": "sum"
+}, Re = {
+  key: 1,
+  role: "cell",
+  "data-cell": "average"
+}, Ue = {
+  key: 2,
+  role: "cell",
+  "data-cell": "median"
+}, Be = {
+  key: 1,
+  ref: "source",
+  dir: "auto"
+}, De = {
+  __name: "vue-ui-table-heatmap",
+  props: {
+    config: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    dataset: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  setup(K, { expose: Q }) {
+    de((e) => ({
+      v7bb1d4dc: ue.value,
+      v4b487b6d: re.value
+    }));
+    const Y = ce(() => import("./UserOptions-B3I-s3Lw.js")), { vue_ui_table_heatmap: Z } = Fe(), { isThemeValid: j, warnInvalidTheme: ee } = Oe(), p = K, _ = b(G()), d = b(!1), C = b(null), I = b(!1), O = b(0), te = pe();
+    R(() => {
+      te["chart-background"] && console.warn("VueUiTableHeatmap does not support the #chart-background slot.");
+    });
+    const t = v({
+      get: () => P(),
+      set: (e) => e
+    }), { userOptionsVisible: $, setUserOptionsVisibility: A, keepUserOptionState: x } = Ae({ config: t.value });
+    function P() {
+      const e = w({
+        userConfig: p.config,
+        defaultConfig: Z
+      }), a = e.theme;
+      if (!a) return e;
+      if (!j.value(e))
+        return ee(e), e;
+      const o = w({
+        userConfig: J[a] || p.config,
+        defaultConfig: e
+      });
+      return w({
+        userConfig: p.config,
+        defaultConfig: o
+      });
+    }
+    ve(() => p.config, (e) => {
+      t.value = P(), $.value = !t.value.userOptions.showOnChartHover, T();
+    }, { deep: !0 });
+    const { isPrinting: oe, isImaging: ae, generatePdf: E, generateImage: S } = we({
+      elementId: `table_heatmap_${_.value}`,
+      fileName: "vue-ui-table-heatmap",
+      options: t.value.userOptions.print
+    }), ne = v(() => t.value.table.responsiveBreakpoint), se = v(() => !!p.dataset && p.dataset.length);
+    R(() => {
+      T();
+    });
+    function T() {
+      he(p.dataset) && Ce({
+        componentName: "VueUiTableHeatmap",
+        type: "dataset"
+      });
+      const e = new ResizeObserver((a) => {
+        a.forEach((o) => {
+          d.value = o.contentRect.width < ne.value;
+        });
+      });
+      C.value && e.observe(C.value);
+    }
+    const N = v(() => p.dataset.map((e) => {
+      const a = e.values.map((n) => isNaN(n) ? 0 : n), o = a.reduce((n, l) => n + l, 0);
+      return {
+        ...e,
+        values: a,
+        serieExtremes: {
+          max: Math.max(...a),
+          min: Math.min(...a)
+        },
+        sum: o,
+        average: o / a.length,
+        median: ye(a),
+        displayValues: [e.name, ...e.values],
+        id: G()
+      };
+    })), V = v(() => {
+      const e = N.value.flatMap((a) => a.values);
+      return {
+        min: Math.min(...e),
+        max: Math.max(...e)
+      };
+    });
+    function le(e, a) {
+      const o = t.value.style.heatmapColors.useIndividualScale;
+      return _e(t.value.style.heatmapColors.min, t.value.style.heatmapColors.max, o ? a.min : V.value.min, o ? a.max : V.value.max, e);
+    }
+    const M = v(() => N.value.map((e) => ({
+      ...e,
+      colors: e.displayValues.map((a) => isNaN(a) ? t.value.style.backgroundColor : le(a, e.serieExtremes))
+    }))), re = v(() => t.value.style.backgroundColor), ue = v(() => `${t.value.table.borderWidth}px`);
+    function z(e = null) {
+      ge(() => {
+        const a = M.value.map((l) => [
+          [l.name],
+          l.displayValues,
+          [l.sum],
+          [l.average],
+          [l.median]
+        ]), o = [[[""], t.value.table.head.values, ["sum"], ["average"], ["median"]]].concat(a), n = Ie(o);
+        e ? e(n) : $e({ csvContent: n, title: "vue-ui-table-heatmap" });
+      });
+    }
+    function ie(e) {
+      I.value = e, O.value += 1;
+    }
+    return Q({
+      generatePdf: E,
+      generateCsv: z,
+      generateImage: S
+    }), (e, a) => (s(), r("div", {
+      ref_key: "tableContainer",
+      ref: C,
+      style: y(`width:100%; overflow-x:auto; container-type: inline-size;padding-top:${t.value.userOptions.show ? "36px" : ""}; ${I.value ? "vue-data-ui-wrapper-fullscreen" : ""}; position:relative;`),
+      class: U({ "vue-data-ui-component": !0, "vue-ui-responsive": d.value }),
+      id: `table_heatmap_${_.value}`,
+      onMouseenter: a[0] || (a[0] = () => i(A)(!0)),
+      onMouseleave: a[1] || (a[1] = () => i(A)(!1))
+    }, [
+      t.value.userOptions.show && se.value && (i(x) || i($)) ? (s(), fe(i(Y), {
+        ref: "details",
+        key: `user_option_${O.value}`,
+        backgroundColor: t.value.style.backgroundColor,
+        color: t.value.style.color,
+        isPrinting: i(oe),
+        isImaging: i(ae),
+        uid: _.value,
+        hasPdf: t.value.userOptions.buttons.pdf,
+        hasXls: t.value.userOptions.buttons.csv,
+        hasImg: t.value.userOptions.buttons.img,
+        hasFullscreen: t.value.userOptions.buttons.fullscreen,
+        isFullscreen: I.value,
+        titles: { ...t.value.userOptions.buttonTitles },
+        chartElement: C.value,
+        position: t.value.userOptions.position,
+        callbacks: t.value.userOptions.callbacks,
+        printScale: t.value.userOptions.print.scale,
+        onToggleFullscreen: ie,
+        onGeneratePdf: i(E),
+        onGenerateCsv: z,
+        onGenerateImage: i(S),
+        style: y({
+          visibility: i(x) ? i($) ? "visible" : "hidden" : "visible"
+        })
+      }, me({ _: 2 }, [
+        e.$slots.menuIcon ? {
+          name: "menuIcon",
+          fn: h(({ isOpen: o, color: n }) => [
+            u(e.$slots, "menuIcon", B(D({ isOpen: o, color: n })), void 0, !0)
+          ]),
+          key: "0"
+        } : void 0,
+        e.$slots.optionPdf ? {
+          name: "optionPdf",
+          fn: h(() => [
+            u(e.$slots, "optionPdf", {}, void 0, !0)
+          ]),
+          key: "1"
+        } : void 0,
+        e.$slots.optionCsv ? {
+          name: "optionCsv",
+          fn: h(() => [
+            u(e.$slots, "optionCsv", {}, void 0, !0)
+          ]),
+          key: "2"
+        } : void 0,
+        e.$slots.optionImg ? {
+          name: "optionImg",
+          fn: h(() => [
+            u(e.$slots, "optionImg", {}, void 0, !0)
+          ]),
+          key: "3"
+        } : void 0,
+        e.$slots.optionFullscreen ? {
+          name: "optionFullscreen",
+          fn: h(({ toggleFullscreen: o, isFullscreen: n }) => [
+            u(e.$slots, "optionFullscreen", B(D({ toggleFullscreen: o, isFullscreen: n })), void 0, !0)
+          ]),
+          key: "4"
+        } : void 0
+      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasXls", "hasImg", "hasFullscreen", "isFullscreen", "titles", "chartElement", "position", "callbacks", "printScale", "onGeneratePdf", "onGenerateImage", "style"])) : f("", !0),
+      g("table", {
+        class: U({ "vue-ui-table-heatmap": !0 }),
+        style: y(`width:100%;font-family:${t.value.style.fontFamily};background:${t.value.style.backgroundColor};`)
+      }, [
+        g("caption", null, [
+          u(e.$slots, "caption", {}, void 0, !0)
+        ]),
+        g("thead", null, [
+          g("tr", {
+            role: "row",
+            style: y(`background:${t.value.table.head.backgroundColor};color:${t.value.table.head.color}`)
+          }, [
+            (s(!0), r(k, null, F(t.value.table.head.values, (o, n) => (s(), r("th", Se, [
+              u(e.$slots, "head", m({ ref_for: !0 }, { value: o, rowIndex: n, type: typeof o, isResponsive: d.value }), void 0, !0)
+            ]))), 256))
+          ], 4)
+        ]),
+        g("tbody", null, [
+          (s(!0), r(k, null, F(M.value, (o, n) => (s(), r("tr", Te, [
+            (s(!0), r(k, null, F(o.displayValues, (l, c) => (s(), r("td", {
+              role: "cell",
+              "data-cell": t.value.table.head.values[c]
+            }, [
+              o.color && c === 0 ? (s(), r("div", Ve, [
+                o.color ? (s(), r("svg", {
+                  key: 0,
+                  height: t.value.style.shapeSize,
+                  width: t.value.style.shapeSize,
+                  viewBox: "0 0 20 20",
+                  style: { background: "none", overflow: "visible" }
+                }, [
+                  be(xe, {
+                    plot: { x: 10, y: 10 },
+                    color: o.color,
+                    radius: 9,
+                    shape: o.shape || "circle"
+                  }, null, 8, ["color", "shape"])
+                ], 8, Me)) : f("", !0),
+                u(e.$slots, "rowTitle", m({ ref_for: !0 }, { value: l, rowIndex: n, colIndex: c, type: typeof l, isResponsive: d.value }), void 0, !0)
+              ])) : (s(), r(k, { key: 1 }, [
+                c === 0 ? u(e.$slots, "rowTitle", m({
+                  key: 0,
+                  ref_for: !0
+                }, { value: l, rowIndex: n, colIndex: c, type: typeof l, isResponsive: d.value }), void 0, !0) : f("", !0),
+                c > 0 ? u(e.$slots, "cell", m({
+                  key: 1,
+                  ref_for: !0
+                }, { value: l, rowIndex: n, colIndex: c, type: typeof l, isResponsive: d.value, color: o.colors[c], textColor: i(ke)(o.colors[c]) }), void 0, !0) : f("", !0)
+              ], 64))
+            ], 8, Ne))), 256)),
+            t.value.table.showSum ? (s(), r("td", ze, [
+              u(e.$slots, "sum", m({ ref_for: !0 }, { value: o.sum, rowIndex: n, isResponsive: d.value }), void 0, !0)
+            ])) : f("", !0),
+            t.value.table.showAverage ? (s(), r("td", Re, [
+              u(e.$slots, "average", m({ ref_for: !0 }, { value: o.average, rowIndex: n, isResponsive: d.value }), void 0, !0)
+            ])) : f("", !0),
+            t.value.table.showMedian ? (s(), r("td", Ue, [
+              u(e.$slots, "median", m({ ref_for: !0 }, { value: o.median, rowIndex: n, isResponsive: d.value }), void 0, !0)
+            ])) : f("", !0)
+          ]))), 256))
+        ])
+      ], 4),
+      e.$slots.source ? (s(), r("div", Be, [
+        u(e.$slots, "source", {}, void 0, !0)
+      ], 512)) : f("", !0)
+    ], 46, Ee));
+  }
+}, Ge = /* @__PURE__ */ Pe(De, [["__scopeId", "data-v-9de1ab93"]]), Ze = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  default: Ge
+}, Symbol.toStringTag, { value: "Module" }));
+export {
+  Ye as a,
+  Ze as b,
+  Ge as v
+};