import { useCssVars as Ae, ref as v, computed as h, watch as de, onMounted as Ie, openBlock as d, createElementBlock as c, normalizeClass as R, unref as s, createElementVNode as p, normalizeStyle as i, toDisplayString as k, createCommentVNode as g, withDirectives as Oe, createBlock as H, Fragment as q, renderList as X, createSlots as $e, withCtx as P, renderSlot as O, normalizeProps as ze, guardReactiveProps as Pe, createVNode as Ne, nextTick as De } from "vue";
import { u as Fe, c as Ve, t as Te, a as We, p as N, b as Me, o as Ee, e as ve, g as Be, $ as Ge, d as Ue, i as D, f as F, q as Le, r as Re } from "./index-BbPeL8Gp.js";
import { u as ce } from "./useNestedProp-BN8claGG.js";
import He from "./vue-ui-sparkline-ccfl0s3m.js";
import fe from "./BaseIcon-CmiukQBl.js";
import { u as qe, U as Xe, v as je } from "./usePrinter-DaybDVqP.js";
import { u as Je } from "./useUserOptionState-BIvW1Kz7.js";
import { _ as Ke } from "./_plugin-vue_export-helper-CHgC5LLL.js";
const Qe = ["id"], Ye = { style: { "z-index": "1", "padding-right": "24px" } }, Ze = ["onClick"], et = ["data-cell"], tt = ["data-cell", "onPointerenter"], at = ["data-cell"], lt = ["data-cell"], ot = ["data-cell"], nt = ["data-cell"], ut = {
  key: 0,
  ref: "source",
  dir: "auto"
}, rt = {
  __name: "vue-ui-table-sparkline",
  props: {
    config: {
      type: Object,
      default() {
        return {};
      }
    },
    dataset: {
      type: Array,
      default() {
        return [];
      }
    }
  },
  setup(pe, { expose: me }) {
    const _ = pe;
    Ae((t) => ({
      e629975c: t.tdo
    }));
    const { vue_ui_table_sparkline: ge } = Fe(), V = v(Ve()), j = v(0), T = v(0), W = v(null), e = h({
      get: () => Y(),
      set: (t) => t
    }), { userOptionsVisible: J, setUserOptionsVisibility: K, keepUserOptionState: Q } = Je({ config: e.value });
    function Y() {
      const t = ce({
        userConfig: _.config,
        defaultConfig: ge
      });
      return t.theme ? {
        ...ce({
          userConfig: Te.vue_ui_table_sparkline[t.theme] || _.config,
          defaultConfig: t
        }),
        customPalette: We[t.theme] || N
      } : t;
    }
    de(() => _.config, (t) => {
      e.value = Y(), le(), T.value += 1;
    }, { deep: !0 }), de(() => _.dataset, (t) => {
      b.value = A.value, T.value += 1;
    }, { deep: !0 });
    const { isPrinting: Z, isImaging: ee, generatePdf: te, generateImage: ae } = qe({
      elementId: `table_${V.value}`,
      fileName: e.value.title.text || "vue-ui-table-sparkline"
    }), be = h(() => Me(e.value.customPalette)), $ = v(null), M = v(!1), ye = h(() => e.value.responsiveBreakpoint);
    Ie(() => {
      le();
    });
    const E = v(e.value.colNames);
    function le() {
      Ee(_.dataset) && ve({
        componentName: "VueUiTableSparkline",
        type: "dataset"
      });
      const t = new ResizeObserver((l) => {
        l.forEach((a) => {
          M.value = a.contentRect.width < ye.value;
        });
      });
      $.value && t.observe($.value), E.value = [];
      for (let l = 0; l < re.value; l += 1)
        E.value.push(e.value.colNames[l] || `col ${l}`);
    }
    const oe = h(() => (_.dataset.forEach((t, l) => {
      Be({
        datasetObject: t,
        requiredAttributes: ["name", "values"]
      }).forEach((a) => {
        ve({
          componentName: "VueUiTableSparkline",
          type: "datasetSerieAttribute",
          property: a,
          index: l
        });
      });
    }), _.dataset.map((t, l) => {
      const a = (t.values || []).map((n) => isNaN(n) ? 0 : n ?? 0), o = a.reduce((n, f) => n + f, 0), r = o / a.length, u = Ge(a);
      return {
        ...t,
        values: t.values || [],
        color: Ue(t.color) || be.value[l] || N[l] || N[l % N.length],
        sum: o,
        average: r,
        median: u,
        sparklineDataset: a.map((n, f) => ({
          period: e.value.colNames[f] || `col ${f}`,
          value: n || 0
        }))
      };
    })));
    function he(t) {
      const a = (t[0].values || []).map(
        (r, u) => t.map((n) => n.values[u] || [])
      ).map(
        (r) => r.map((u, n) => [u, n]).sort((u, n) => n[0] - u[0]).map((u) => u[1])
      );
      return t.map((r, u) => ({
        ...r,
        values: r.values || [],
        orders: a[u]
      }));
    }
    const A = h(() => he(oe.value)), b = v(A.value), ke = h(() => Math.max(...b.value.map((t) => (t.values || []).length))), z = v(void 0), B = v(!1), m = v(void 0), ne = v(1);
    function w() {
      B.value = !1, m.value = void 0, y.value = void 0, ne.value = 1, I.value.forEach((t) => t.state = 1), x.value = {
        name: 1,
        sum: 1,
        average: 1,
        median: 1
      }, b.value = A.value;
    }
    function ue(t, l) {
      if (["name", "sum", "average", "median"].includes(t.type)) {
        _e(t.type, l);
        return;
      }
      if (!U(l)) return;
      if (S.value = l, y.value = void 0, ![null, void 0].includes(m.value) && l !== m.value && (m.value = void 0, w()), I.value[l].state === 1 && m.value === l) {
        m.value = void 0, w();
        return;
      }
      B.value = !0, m.value = l;
      const a = A.value.map((n) => n.values[l] || []), o = z.value === l ? 1 : -1;
      I.value[l].state = o, ne.value = o, l === z.value ? z.value = void 0 : z.value = l;
      const u = a.map((n, f) => [f, n]).sort((n, f) => o * (f[1] - n[1])).map((n) => n[0]).map((n) => A.value[n]);
      b.value = u, T.value += 1;
    }
    const re = h(() => Math.max(..._.dataset.map((t) => (t.values || []).length))), C = h(() => {
      let t = E.value.map((a) => ({
        type: "reg",
        value: a
      }));
      if (!t.length)
        for (let a = 0; a < re.value; a += 1)
          t.push({ type: "reg", value: `col ${a + 1}` });
      e.value.showTotal && (t = [...t, { type: "sum", value: e.value.translations.total }]);
      let l;
      return e.value.showAverage && e.value.showMedian ? l = [
        ...t,
        { type: "average", value: e.value.translations.average },
        { type: "median", value: e.value.translations.median }
      ] : e.value.showAverage && !e.value.showMedian ? l = [...t, { type: "average", value: e.value.translations.average }] : !e.value.showAverage && e.value.showMedian ? l = [...t, { type: "median", value: e.value.translations.median }] : l = t, e.value.showSparklines ? [...l, { type: "chart", value: e.value.translations.chart }] : l;
    }), x = v({
      name: 1,
      sum: 1,
      average: 1,
      median: 1
    }), y = v(void 0);
    function _e(t, l) {
      if (!b.value || b.value.length === 0 || !L(t)) return;
      if (y.value !== t && (y.value = void 0), ![null, void 0].includes(m.value) && l !== m.value && w(), m.value = void 0, x.value[t] === 1 && y.value) {
        y.value = void 0, w();
        return;
      }
      y.value = t, B.value = !0, x.value[t] = x.value[t] === -1 ? 1 : -1, [null, void 0].includes(l) || (I.value[l].state = x.value[t]);
      const a = x.value[t], o = [...b.value].sort((r, u) => {
        const n = r[t] ?? (typeof r[t] == "number" ? 0 : ""), f = u[t] ?? (typeof u[t] == "number" ? 0 : "");
        return typeof n == "string" && typeof f == "string" ? a === -1 ? n.localeCompare(f) : f.localeCompare(n) : typeof n == "number" && typeof f == "number" ? a === -1 ? n - f : f - n : 0;
      });
      b.value = o;
    }
    const S = v(void 0), G = v(void 0);
    function Ce({ dataIndex: t, serieIndex: l }) {
      S.value = t, G.value = l, W.value[t] && !M.value && W.value[t].scrollIntoView({ behavior: "smooth", block: "nearest", inline: "center" });
    }
    const se = v(!1);
    function xe(t) {
      se.value = t, j.value += 1;
    }
    function ie() {
      De(() => {
        const t = [e.value.translations.serie].concat(C.value), l = oe.value.map((r, u) => [
          [r.name],
          r.values,
          [r.sum],
          [r.average],
          [r.median]
        ]), a = [t].concat(l), o = Le(a);
        Re({
          csvContent: o,
          title: e.value.title.text || "vue-ui-table-sparkline"
        });
      });
    }
    function U(t) {
      return e.value.sortedDataColumnIndices.includes(t);
    }
    function L(t) {
      return t.type === "name" || t === "name" ? e.value.sortedSeriesName : t.type === "sum" || t === "sum" ? e.value.sortedSum : t.type === "average" || t === "average" ? e.value.sortedAverage : t.type === "median" || t === "median" ? e.value.sortedMedian : !1;
    }
    function Se(t, l) {
      return ["sum", "average", "median"].includes(l.type) ? y.value === l.type ? 1 : 0.3 : t === m.value ? 1 : 0.3;
    }
    function we() {
      e.value.resetSortOnClickOutside && w();
    }
    const I = h({
      get: () => C.value.map((t) => ({ state: 1 })),
      set: (t) => t
    });
    return me({
      generatePdf: te,
      generateImage: ae,
      generateCsv: ie,
      restoreOrder: w
    }), (t, l) => (d(), c("div", {
      ref_key: "tableContainer",
      ref: $,
      class: R({ "vue-ui-responsive": M.value }),
      style: { overflow: "hidden" },
      id: `table_${V.value}`,
      onMouseenter: l[2] || (l[2] = () => s(K)(!0)),
      onMouseleave: l[3] || (l[3] = () => s(K)(!1))
    }, [
      p("div", {
        style: { overflow: "auto" },
        onPointerleave: l[1] || (l[1] = (a) => {
          G.value = void 0, S.value = void 0;
        })
      }, [
        p("table", {
          class: "vue-ui-data-table",
          style: i({ fontFamily: e.value.fontFamily, position: "relative" })
        }, [
          e.value.title.text ? (d(), c("caption", {
            key: 0,
            style: i({ backgroundColor: e.value.title.backgroundColor })
          }, [
            p("div", {
              style: i({
                fontSize: `${e.value.title.fontSize}px`,
                fontWeight: e.value.title.bold ? "bold" : "normal",
                color: e.value.title.color,
                textAlign: e.value.title.textAlign
              })
            }, k(e.value.title.text), 5),
            e.value.title.subtitle.text ? (d(), c("div", {
              key: 0,
              style: i({
                fontSize: `${e.value.title.subtitle.fontSize}px`,
                fontWeight: e.value.title.subtitle.bold ? "bold" : "normal",
                color: e.value.title.subtitle.color,
                textAlign: e.value.title.textAlign
              })
            }, k(e.value.title.subtitle.text), 5)) : g("", !0)
          ], 4)) : g("", !0),
          p("thead", Ye, [
            Oe((d(), c("tr", {
              role: "row",
              class: "vue-ui-data-table__thead-row",
              style: i({
                backgroundColor: e.value.thead.backgroundColor,
                color: e.value.thead.color
              })
            }, [
              p("th", {
                role: "cell",
                style: i({
                  backgroundColor: e.value.thead.backgroundColor,
                  border: e.value.thead.outline,
                  textAlign: e.value.thead.textAlign,
                  fontWeight: e.value.thead.bold ? "bold" : "normal",
                  cursor: e.value.sortedSeriesName ? "pointer" : "default"
                }),
                class: "sticky-col-first",
                onClick: l[0] || (l[0] = (a) => ue({ type: "name" }, null))
              }, [
                p("div", {
                  style: i({
                    display: "flex",
                    flexDirection: "row",
                    alignItems: "center",
                    gap: "6px",
                    justifyContent: e.value.thead.textAlign,
                    pointerEvents: "none"
                  })
                }, [
                  p("span", null, k(e.value.translations.serie), 1),
                  e.value.sortedSeriesName ? (d(), H(fe, {
                    key: 0,
                    size: 12,
                    name: x.value.name === 1 ? "arrowBottom" : "arrowTop",
                    stroke: e.value.thead.color,
                    style: i({
                      opacity: y.value === "name" ? 1 : 0.3
                    })
                  }, null, 8, ["name", "stroke", "style"])) : g("", !0)
                ], 4)
              ], 4),
              (d(!0), c(q, null, X(C.value, (a, o) => (d(), c("th", {
                role: "cell",
                style: i({
                  background: e.value.thead.backgroundColor,
                  border: e.value.thead.outline,
                  textAlign: e.value.thead.textAlign,
                  fontWeight: e.value.thead.bold ? "bold" : "normal",
                  minWidth: o === C.value.length - 1 ? `${e.value.sparkline.dimensions.width}px` : "48px",
                  cursor: U(o) || L(a) ? "pointer" : "default",
                  paddingRight: o === C.value.length - 1 && e.value.userOptions.show ? "36px" : ""
                }),
                onClick: () => ue(a, o),
                class: R({ "sticky-col": o === C.value.length - 1 && e.value.showSparklines })
              }, [
                p("div", {
                  style: i({
                    display: "flex",
                    flexDirection: "row",
                    alignItems: "center",
                    gap: "6px",
                    justifyContent: e.value.thead.textAlign,
                    pointerEvents: "none"
                  })
                }, [
                  p("span", null, k(a.value), 1),
                  U(o) || L(a) ? (d(), H(fe, {
                    key: 0,
                    size: 12,
                    name: I.value[o].state === 1 ? "arrowBottom" : "arrowTop",
                    stroke: e.value.thead.color,
                    style: i({
                      opacity: Se(o, a)
                    })
                  }, null, 8, ["name", "stroke", "style"])) : g("", !0)
                ], 4),
                e.value.userOptions.show && o === C.value.length - 1 && (s(Q) || s(J)) ? (d(), H(Xe, {
                  ref_for: !0,
                  ref: "details",
                  key: `user_option_${j.value}`,
                  backgroundColor: e.value.thead.backgroundColor,
                  color: e.value.thead.color,
                  isPrinting: s(Z),
                  isImaging: s(ee),
                  uid: V.value,
                  hasPdf: e.value.userOptions.buttons.pdf,
                  hasXls: e.value.userOptions.buttons.csv,
                  hasImg: e.value.userOptions.buttons.img,
                  hasFullscreen: e.value.userOptions.buttons.fullscreen,
                  isFullscreen: se.value,
                  titles: { ...e.value.userOptions.buttonTitles },
                  chartElement: $.value,
                  position: e.value.userOptions.position,
                  onToggleFullscreen: xe,
                  onGeneratePdf: s(te),
                  onGenerateImage: s(ae),
                  onGenerateCsv: ie,
                  style: i({
                    visibility: s(Q) ? s(J) ? "visible" : "hidden" : "visible"
                  })
                }, $e({ _: 2 }, [
                  t.$slots.optionPdf ? {
                    name: "optionPdf",
                    fn: P(() => [
                      O(t.$slots, "optionPdf", {}, void 0, !0)
                    ]),
                    key: "0"
                  } : void 0,
                  t.$slots.optionCsv ? {
                    name: "optionCsv",
                    fn: P(() => [
                      O(t.$slots, "optionCsv", {}, void 0, !0)
                    ]),
                    key: "1"
                  } : void 0,
                  t.$slots.optionImg ? {
                    name: "optionImg",
                    fn: P(() => [
                      O(t.$slots, "optionImg", {}, void 0, !0)
                    ]),
                    key: "2"
                  } : void 0,
                  t.$slots.optionFullscreen ? {
                    name: "optionFullscreen",
                    fn: P(({ toggleFullscreen: r, isFullscreen: u }) => [
                      O(t.$slots, "optionFullscreen", ze(Pe({ toggleFullscreen: r, isFullscreen: u })), void 0, !0)
                    ]),
                    key: "3"
                  } : void 0
                ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasXls", "hasImg", "hasFullscreen", "isFullscreen", "titles", "chartElement", "position", "onGeneratePdf", "onGenerateImage", "style"])) : g("", !0)
              ], 14, Ze))), 256))
            ], 4)), [
              [s(je), we]
            ])
          ]),
          p("tbody", null, [
            (d(!0), c(q, null, X(b.value, (a, o) => (d(), c("tr", {
              role: "row",
              style: i({
                backgroundColor: e.value.tbody.backgroundColor,
                color: e.value.tbody.color
              }),
              class: R({ "vue-ui-data-table__tbody__row": !0, "vue-ui-data-table__tbody__row-even": o % 2 === 0, "vue-ui-data-table__tbody__row-odd": o % 2 !== 0 })
            }, [
              p("td", {
                role: "cell",
                style: i({
                  backgroundColor: e.value.tbody.backgroundColor,
                  border: e.value.tbody.outline,
                  fontSize: `${e.value.tbody.fontSize}px`,
                  fontWeight: e.value.tbody.bold ? "bold" : "normal",
                  textAlign: e.value.tbody.textAlign
                }),
                "data-cell": e.value.translations.serie,
                class: "vue-ui-data-table__tbody__td sticky-col-first"
              }, [
                p("div", {
                  dir: "auto",
                  style: i({
                    display: "flex",
                    flexDirection: "row",
                    alignItems: "center",
                    gap: "6px",
                    justifyContent: e.value.tbody.textAlign
                  })
                }, [
                  e.value.tbody.showColorMarker ? (d(), c("span", {
                    key: 0,
                    style: i({ color: a.color })
                  }, "⬤", 4)) : g("", !0),
                  p("span", null, k(a.name ?? "-"), 1)
                ], 4)
              ], 12, et),
              (d(!0), c(q, null, X(ke.value, (r, u) => (d(), c("td", {
                dir: "auto",
                role: "cell",
                ref_for: !0,
                ref_key: "TD",
                ref: W,
                style: i({
                  border: e.value.tbody.outline,
                  fontSize: `${e.value.tbody.fontSize}px`,
                  fontWeight: e.value.tbody.bold ? "bold" : "normal",
                  textAlign: e.value.tbody.textAlign,
                  background: S.value !== void 0 && u === S.value ? e.value.tbody.selectedColor.useSerieColor ? `${a.color.length > 7 ? a.color.slice(0, -2) : a.color}33` : e.value.tbody.selectedColor.fallback : ""
                }),
                "data-cell": C.value[u],
                class: "vue-ui-data-table__tbody__td",
                onPointerenter: (n) => {
                  G.value = o, S.value = u;
                }
              }, k([null, void 0].includes(a.values[u]) ? "-" : s(D)(
                e.value.formatter,
                Number(a.values[u]),
                s(F)({
                  p: e.value.prefix,
                  v: Number(a.values[u]),
                  s: e.value.suffix,
                  r: e.value.roundingValues
                }),
                { datapoint: a, seriesIndex: o, datapointIndex: u }
              )), 45, tt))), 256)),
              e.value.showTotal ? (d(), c("td", {
                key: 0,
                dir: "auto",
                role: "cell",
                style: i({
                  border: e.value.tbody.outline,
                  fontSize: `${e.value.tbody.fontSize}px`,
                  fontWeight: e.value.tbody.bold ? "bold" : "normal",
                  textAlign: e.value.tbody.textAlign
                }),
                "data-cell": e.value.translations.total,
                class: "vue-ui-data-table__tbody__td"
              }, k(s(D)(
                e.value.formatter,
                a.sum,
                s(F)({
                  p: e.value.prefix,
                  v: a.sum,
                  s: e.value.suffix,
                  r: e.value.roundingTotal
                }),
                { datapoint: a.sum, seriesIndex: o }
              )), 13, at)) : g("", !0),
              e.value.showAverage ? (d(), c("td", {
                key: 1,
                dir: "auto",
                role: "cell",
                style: i({
                  border: e.value.tbody.outline,
                  fontSize: `${e.value.tbody.fontSize}px`,
                  fontWeight: e.value.tbody.bold ? "bold" : "normal",
                  textAlign: e.value.tbody.textAlign
                }),
                "data-cell": e.value.translations.average,
                class: "vue-ui-data-table__tbody__td"
              }, k(s(D)(
                e.value.formatter,
                a.average,
                s(F)({
                  p: e.value.prefix,
                  v: a.average,
                  s: e.value.suffix,
                  r: e.value.roundingAverage
                }),
                { datapoint: a.average, seriesIndex: o }
              )), 13, lt)) : g("", !0),
              e.value.showMedian ? (d(), c("td", {
                key: 2,
                dir: "auto",
                role: "cell",
                style: i({
                  border: e.value.tbody.outline,
                  fontSize: `${e.value.tbody.fontSize}px`,
                  fontWeight: e.value.tbody.bold ? "bold" : "normal",
                  textAlign: e.value.tbody.textAlign
                }),
                "data-cell": e.value.translations.median,
                class: "vue-ui-data-table__tbody__td"
              }, k(s(D)(
                e.value.formatter,
                a.median,
                s(F)({
                  p: e.value.prefix,
                  v: a.median,
                  s: e.value.suffix,
                  r: e.value.roundingMedian
                }),
                { datapoint: a.median, seriesIndex: o }
              )), 13, ot)) : g("", !0),
              e.value.showSparklines ? (d(), c("td", {
                key: 3,
                role: "cell",
                "data-cell": e.value.translations.chart,
                style: i({
                  border: e.value.tbody.outline,
                  fontSize: `${e.value.tbody.fontSize}px`,
                  fontWeight: e.value.tbody.bold ? "bold" : "normal",
                  textAlign: e.value.tbody.textAlign,
                  backgroundColor: e.value.tbody.backgroundColor,
                  padding: "0"
                }),
                class: "vue-ui-data-table__tbody__td sticky-col"
              }, [
                Ne(He, {
                  onHoverIndex: ({ index: r }) => Ce({ dataIndex: r, serieIndex: o }),
                  "height-ratio": e.value.sparkline.dimensions.heightRatio,
                  "forced-padding": 30,
                  dataset: a.sparklineDataset,
                  showInfo: !1,
                  selectedIndex: S.value,
                  config: {
                    type: e.value.sparkline.type,
                    style: {
                      backgroundColor: "transparent",
                      animation: {
                        show: e.value.sparkline.animation.show && !s(Z) && !s(ee),
                        animationFrames: e.value.sparkline.animation.animationFrames
                      },
                      line: {
                        color: a.color,
                        smooth: e.value.sparkline.smooth,
                        strokeWidth: e.value.sparkline.strokeWidth
                      },
                      bar: {
                        color: a.color
                      },
                      area: {
                        color: a.color,
                        opacity: e.value.sparkline.showArea ? 16 : 0,
                        useGradient: e.value.sparkline.useGradient
                      },
                      verticalIndicator: {
                        color: a.color
                      },
                      plot: {
                        radius: 9,
                        stroke: e.value.tbody.backgroundColor,
                        strokeWidth: 3
                      }
                    }
                  }
                }, null, 8, ["onHoverIndex", "height-ratio", "dataset", "selectedIndex", "config"])
              ], 12, nt)) : g("", !0)
            ], 6))), 256))
          ])
        ], 4)
      ], 32),
      t.$slots.source ? (d(), c("div", ut, [
        O(t.$slots, "source", {}, void 0, !0)
      ], 512)) : g("", !0)
    ], 42, Qe));
  }
}, gt = /* @__PURE__ */ Ke(rt, [["__scopeId", "data-v-5bd76162"]]);
export {
  gt as default
};
