import { useCssVars as te, computed as v, ref as h, useSlots as ae, onMounted as z, watch as oe, createElementBlock as l, openBlock as n, unref as u, normalizeClass as E, normalizeStyle as C, createBlock as se, createCommentVNode as c, createElementVNode as g, createSlots as ne, withCtx as b, renderSlot as r, normalizeProps as G, guardReactiveProps as B, Fragment as k, renderList as w, mergeProps as f, createVNode as le, nextTick as re } from "vue";
import { u as ue, c as H, a as ie, o as de, e as pe, a4 as ve, G as ce, O as me, q as fe, r as he } from "./index-C7spnOfS.js";
import { u as A } from "./useNestedProp-BXHzK3EV.js";
import { u as ge, U as be } from "./usePrinter-BDUIRBP4.js";
import { _ as ye } from "./Shape-CWFBkvfP.js";
import { u as Ce } from "./useUserOptionState-BIvW1Kz7.js";
import { _ as ke } from "./_plugin-vue_export-helper-CHgC5LLL.js";
const _e = ["id"], Ie = { role: "cell" }, $e = { role: "row" }, we = ["data-cell"], Oe = {
  key: 0,
  style: { display: "flex", "flex-direction": "row", gap: "2px", "align-items": "center" }
}, xe = ["height", "width"], Fe = {
  key: 0,
  role: "cell",
  "data-cell": "sum"
}, Pe = {
  key: 1,
  role: "cell",
  "data-cell": "average"
}, Ne = {
  key: 2,
  role: "cell",
  "data-cell": "median"
}, Ve = {
  key: 1,
  ref: "source",
  dir: "auto"
}, Re = {
  __name: "vue-ui-table-heatmap",
  props: {
    config: {
      type: Object,
      default() {
        return {};
      }
    },
    dataset: {
      type: Array,
      default() {
        return [];
      }
    }
  },
  setup(D, { expose: L }) {
    te((e) => ({
      "1e8210e3": j.value,
      "7fb93384": Z.value
    }));
    const { vue_ui_table_heatmap: X } = ue(), m = D, _ = h(H()), i = h(!1), y = h(null), I = h(!1), O = h(0), W = ae();
    z(() => {
      W["chart-background"] && console.warn("VueUiTableHeatmap does not support the #chart-background slot.");
    });
    const t = v({
      get: () => P(),
      set: (e) => e
    }), { userOptionsVisible: $, setUserOptionsVisibility: x, keepUserOptionState: F } = Ce({ config: t.value });
    function P() {
      const e = A({
        userConfig: m.config,
        defaultConfig: X
      });
      return e.theme ? {
        ...A({
          userConfig: ie.vue_ui_table_heatmap[e.theme] || m.config,
          defaultConfig: e
        })
      } : e;
    }
    oe(() => m.config, (e) => {
      t.value = P(), $.value = !t.value.userOptions.showOnChartHover, R();
    }, { deep: !0 });
    const { isPrinting: q, isImaging: J, generatePdf: N, generateImage: V } = ge({
      elementId: `table_heatmap_${_.value}`,
      fileName: "vue-ui-table-heatmap",
      options: t.value.userOptions.print
    }), K = v(() => t.value.table.responsiveBreakpoint), Q = v(() => !!m.dataset && m.dataset.length);
    z(() => {
      R();
    });
    function R() {
      de(m.dataset) && pe({
        componentName: "VueUiTableHeatmap",
        type: "dataset"
      });
      const e = new ResizeObserver((o) => {
        o.forEach((a) => {
          i.value = a.contentRect.width < K.value;
        });
      });
      y.value && e.observe(y.value);
    }
    const M = v(() => m.dataset.map((e) => {
      const o = e.values.map((s) => isNaN(s) ? 0 : s), a = o.reduce((s, p) => s + p, 0);
      return {
        ...e,
        values: o,
        serieExtremes: {
          max: Math.max(...o),
          min: Math.min(...o)
        },
        sum: a,
        average: a / o.length,
        median: ve(o),
        displayValues: [e.name, ...e.values],
        id: H()
      };
    })), S = v(() => {
      const e = M.value.flatMap((o) => o.values);
      return {
        min: Math.min(...e),
        max: Math.max(...e)
      };
    });
    function Y(e, o) {
      const a = t.value.style.heatmapColors.useIndividualScale;
      return me(t.value.style.heatmapColors.min, t.value.style.heatmapColors.max, a ? o.min : S.value.min, a ? o.max : S.value.max, e);
    }
    const T = v(() => M.value.map((e) => ({
      ...e,
      colors: e.displayValues.map((o) => isNaN(o) ? t.value.style.backgroundColor : Y(o, e.serieExtremes))
    }))), Z = v(() => t.value.style.backgroundColor), j = v(() => `${t.value.table.borderWidth}px`);
    function U() {
      re(() => {
        const e = T.value.map((s) => [
          [s.name],
          s.displayValues,
          [s.sum],
          [s.average],
          [s.median]
        ]), o = [[[""], t.value.table.head.values, ["sum"], ["average"], ["median"]]].concat(e), a = fe(o);
        he({ csvContent: a, title: "vue-ui-table-heatmap" });
      });
    }
    function ee(e) {
      I.value = e, O.value += 1;
    }
    return L({
      generatePdf: N,
      generateCsv: U,
      generateImage: V
    }), (e, o) => (n(), l("div", {
      ref_key: "tableContainer",
      ref: y,
      style: C(`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: E({ "vue-ui-responsive": i.value }),
      id: `table_heatmap_${_.value}`,
      onMouseenter: o[0] || (o[0] = () => u(x)(!0)),
      onMouseleave: o[1] || (o[1] = () => u(x)(!1))
    }, [
      t.value.userOptions.show && Q.value && (u(F) || u($)) ? (n(), se(be, {
        ref: "details",
        key: `user_option_${O.value}`,
        backgroundColor: t.value.style.backgroundColor,
        color: t.value.style.color,
        isPrinting: u(q),
        isImaging: u(J),
        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: y.value,
        position: t.value.userOptions.position,
        onToggleFullscreen: ee,
        onGeneratePdf: u(N),
        onGenerateCsv: U,
        onGenerateImage: u(V),
        style: C({
          visibility: u(F) ? u($) ? "visible" : "hidden" : "visible"
        })
      }, ne({ _: 2 }, [
        e.$slots.menuIcon ? {
          name: "menuIcon",
          fn: b(({ isOpen: a, color: s }) => [
            r(e.$slots, "menuIcon", G(B({ isOpen: a, color: s })), void 0, !0)
          ]),
          key: "0"
        } : void 0,
        e.$slots.optionPdf ? {
          name: "optionPdf",
          fn: b(() => [
            r(e.$slots, "optionPdf", {}, void 0, !0)
          ]),
          key: "1"
        } : void 0,
        e.$slots.optionCsv ? {
          name: "optionCsv",
          fn: b(() => [
            r(e.$slots, "optionCsv", {}, void 0, !0)
          ]),
          key: "2"
        } : void 0,
        e.$slots.optionImg ? {
          name: "optionImg",
          fn: b(() => [
            r(e.$slots, "optionImg", {}, void 0, !0)
          ]),
          key: "3"
        } : void 0,
        e.$slots.optionFullscreen ? {
          name: "optionFullscreen",
          fn: b(({ toggleFullscreen: a, isFullscreen: s }) => [
            r(e.$slots, "optionFullscreen", G(B({ toggleFullscreen: a, isFullscreen: s })), void 0, !0)
          ]),
          key: "4"
        } : void 0
      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasXls", "hasImg", "hasFullscreen", "isFullscreen", "titles", "chartElement", "position", "onGeneratePdf", "onGenerateImage", "style"])) : c("", !0),
      g("table", {
        class: E({ "vue-ui-table-heatmap": !0 }),
        style: C(`width:100%;font-family:${t.value.style.fontFamily};background:${t.value.style.backgroundColor};`)
      }, [
        g("caption", null, [
          r(e.$slots, "caption", {}, void 0, !0)
        ]),
        g("thead", null, [
          g("tr", {
            role: "row",
            style: C(`background:${t.value.table.head.backgroundColor};color:${t.value.table.head.color}`)
          }, [
            (n(!0), l(k, null, w(t.value.table.head.values, (a, s) => (n(), l("th", Ie, [
              r(e.$slots, "head", f({ ref_for: !0 }, { value: a, rowIndex: s, type: typeof a, isResponsive: i.value }), void 0, !0)
            ]))), 256))
          ], 4)
        ]),
        g("tbody", null, [
          (n(!0), l(k, null, w(T.value, (a, s) => (n(), l("tr", $e, [
            (n(!0), l(k, null, w(a.displayValues, (p, d) => (n(), l("td", {
              role: "cell",
              "data-cell": t.value.table.head.values[d]
            }, [
              a.color && d === 0 ? (n(), l("div", Oe, [
                a.color ? (n(), l("svg", {
                  key: 0,
                  height: t.value.style.shapeSize,
                  width: t.value.style.shapeSize,
                  viewBox: "0 0 20 20",
                  style: { background: "none", overflow: "visible" }
                }, [
                  le(ye, {
                    plot: { x: 10, y: 10 },
                    color: a.color,
                    radius: 9,
                    shape: a.shape || "circle"
                  }, null, 8, ["color", "shape"])
                ], 8, xe)) : c("", !0),
                r(e.$slots, "rowTitle", f({ ref_for: !0 }, { value: p, rowIndex: s, colIndex: d, type: typeof p, isResponsive: i.value }), void 0, !0)
              ])) : (n(), l(k, { key: 1 }, [
                d === 0 ? r(e.$slots, "rowTitle", f({
                  key: 0,
                  ref_for: !0
                }, { value: p, rowIndex: s, colIndex: d, type: typeof p, isResponsive: i.value }), void 0, !0) : c("", !0),
                d > 0 ? r(e.$slots, "cell", f({
                  key: 1,
                  ref_for: !0
                }, { value: p, rowIndex: s, colIndex: d, type: typeof p, isResponsive: i.value, color: a.colors[d], textColor: u(ce)(a.colors[d]) }), void 0, !0) : c("", !0)
              ], 64))
            ], 8, we))), 256)),
            t.value.table.showSum ? (n(), l("td", Fe, [
              r(e.$slots, "sum", f({ ref_for: !0 }, { value: a.sum, rowIndex: s, isResponsive: i.value }), void 0, !0)
            ])) : c("", !0),
            t.value.table.showAverage ? (n(), l("td", Pe, [
              r(e.$slots, "average", f({ ref_for: !0 }, { value: a.average, rowIndex: s, isResponsive: i.value }), void 0, !0)
            ])) : c("", !0),
            t.value.table.showMedian ? (n(), l("td", Ne, [
              r(e.$slots, "median", f({ ref_for: !0 }, { value: a.median, rowIndex: s, isResponsive: i.value }), void 0, !0)
            ])) : c("", !0)
          ]))), 256))
        ])
      ], 4),
      e.$slots.source ? (n(), l("div", Ve, [
        r(e.$slots, "source", {}, void 0, !0)
      ], 512)) : c("", !0)
    ], 46, _e));
  }
}, Be = /* @__PURE__ */ ke(Re, [["__scopeId", "data-v-dd493d6a"]]);
export {
  Be as default
};
