vue-data-ui 2.2.90 → 2.2.91

package/dist/title-BF-9Qcni.js

@@ -0,0 +1,56 @@
+import { openBlock as n, createElementBlock as r, Fragment as s, createElementVNode as f, normalizeStyle as i, unref as e, toDisplayString as c, createCommentVNode as u } from "vue";
+import { t as a, c as d } from "./data-table-d-VcuH-r.js";
+function p({ defaultConfig: o, userConfig: l }) {
+  if (!Object.keys(l || {}).length)
+    return o;
+  const t = a({
+    defaultConfig: o,
+    userConfig: l
+  });
+  return d(t);
+}
+const y = {
+  __name: "Title",
+  props: {
+    config: {
+      type: Object,
+      default() {
+        return {};
+      }
+    }
+  },
+  setup(o) {
+    const t = p({
+      userConfig: o.config,
+      defaultConfig: {
+        title: {
+          cy: "",
+          text: "",
+          color: "",
+          fontSize: 20,
+          bold: !0
+        },
+        subtitle: {
+          cy: "",
+          text: "",
+          color: "",
+          fontSize: 14,
+          bold: !1
+        }
+      }
+    });
+    return (b, m) => (n(), r(s, null, [
+      f("div", {
+        style: i(`width: 100%; text-align:center;color:${e(t).title.color};font-size:${e(t).title.fontSize}px;font-weight:${e(t).title.bold ? "bold" : ""}`)
+      }, c(e(t).title.text), 5),
+      e(t).subtitle.text ? (n(), r("div", {
+        key: 0,
+        style: i(`width: 100%; text-align:center;color:${e(t).subtitle.color};font-size:${e(t).subtitle.fontSize}px;font-weight:${e(t).subtitle.bold ? "bold" : ""}`)
+      }, c(e(t).subtitle.text), 5)) : u("", !0)
+    ], 64));
+  }
+};
+export {
+  y as _,
+  p as u
+};

package/dist/tooltip-D85WEOKi.js

@@ -0,0 +1,94 @@
+import { ref as u, onMounted as f, onUnmounted as m, computed as y, openBlock as b, createElementBlock as v, normalizeClass as p, normalizeStyle as g, unref as $, renderSlot as a, createElementVNode as h, createCommentVNode as x } from "vue";
+import { o as C } from "./data-table-d-VcuH-r.js";
+function S({ tooltip: e, chart: o, clientPosition: t }) {
+  const l = u(0), r = u(48);
+  if (e && o) {
+    const { width: n, height: i } = e.getBoundingClientRect(), { right: d, left: s, bottom: c } = o.getBoundingClientRect();
+    t.x + n / 2 > d ? l.value = -n : t.x - n / 2 < s ? l.value = 0 : l.value = -n / 2, t.y + i > c && (r.value = -i - 48);
+  }
+  return {
+    top: t.y + r.value,
+    left: t.x + l.value
+  };
+}
+function k(e, o, t) {
+  f(() => e.addEventListener(o, t)), m(() => e.removeEventListener(o, t));
+}
+function w() {
+  const e = u(0), o = u(0);
+  return k(window, "mousemove", (t) => {
+    e.value = t.clientX, o.value = t.clientY;
+  }), { x: e, y: o };
+}
+const B = ["innerHTML"], z = {
+  __name: "Tooltip",
+  props: {
+    backgroundColor: {
+      type: String,
+      default: "#FFFFFF"
+    },
+    color: {
+      type: String,
+      default: "#000000"
+    },
+    content: String,
+    maxWidth: {
+      type: String,
+      default: "300px"
+    },
+    parent: {
+      type: Object
+    },
+    show: {
+      type: Boolean,
+      default: !1
+    },
+    isCustom: {
+      type: Boolean,
+      default: !1
+    },
+    fontSize: {
+      type: [Number, String],
+      default: 14
+    },
+    borderRadius: {
+      type: Number,
+      default: 4
+    },
+    borderColor: {
+      type: String,
+      default: "#e1e5e8"
+    },
+    borderWidth: {
+      type: Number,
+      default: 1
+    },
+    backgroundOpacity: {
+      type: Number,
+      default: 100
+    }
+  },
+  setup(e) {
+    const o = e, t = u(null), l = u(w()), r = y(() => S({
+      tooltip: t.value,
+      chart: o.parent,
+      clientPosition: l.value
+    }));
+    return (n, i) => e.show ? (b(), v("div", {
+      key: 0,
+      ref_key: "tooltip",
+      ref: t,
+      class: p({ "vue-data-ui-custom-tooltip": e.isCustom, "vue-data-ui-tooltip": !e.isCustom }),
+      style: g(`top:${r.value.top}px;left:${r.value.left}px;${e.isCustom ? "" : `background:${e.backgroundColor}${$(C)[e.backgroundOpacity]};color:${e.color};max-width:${e.maxWidth};font-size:${e.fontSize}px`};border-radius:${e.borderRadius}px;border:${e.borderWidth}px solid ${e.borderColor};`)
+    }, [
+      a(n.$slots, "tooltip-before"),
+      a(n.$slots, "default"),
+      h("div", { innerHTML: e.content }, null, 8, B),
+      a(n.$slots, "tooltip-after")
+    ], 6)) : x("", !0);
+  }
+};
+export {
+  z as _,
+  w as u
+};

package/dist/user-options-DZgCz8UA.js

@@ -0,0 +1,415 @@
+import { ref as c, onMounted as j, onBeforeUnmount as A, withDirectives as W, openBlock as o, createElementBlock as s, normalizeStyle as d, createElementVNode as L, withModifiers as X, withKeys as q, createVNode as H, normalizeClass as g, renderSlot as y, Fragment as C, createBlock as r, toDisplayString as m, createCommentVNode as u, normalizeProps as G, mergeProps as J, unref as Q } from "vue";
+import { _ as R, B as i } from "./data-table-d-VcuH-r.js";
+const Y = {
+  beforeMount(e, v) {
+    e.clickOutsideEvent = function(f) {
+      e === f.target || e.contains(f.target) || v.value(f);
+    }, document.addEventListener("click", e.clickOutsideEvent);
+  },
+  unmounted(e) {
+    document.removeEventListener("click", e.clickOutsideEvent);
+  }
+}, Z = ["title", "onClick", "onKeypress"], x = ["data-open"], _ = {
+  __name: "UserOptions",
+  props: {
+    hasPdf: {
+      type: Boolean,
+      default: !0
+    },
+    hasXls: {
+      type: Boolean,
+      default: !0
+    },
+    hasImg: {
+      type: Boolean,
+      default: !1
+    },
+    hasLabel: {
+      type: Boolean,
+      default: !1
+    },
+    isLabelActive: {
+      type: Boolean,
+      default: !1
+    },
+    hasTable: {
+      type: Boolean,
+      default: !1
+    },
+    hasSort: {
+      type: Boolean,
+      default: !1
+    },
+    hasStack: {
+      type: Boolean,
+      default: !1
+    },
+    hasTooltip: {
+      type: Boolean,
+      default: !1
+    },
+    color: {
+      type: String
+    },
+    backgroundColor: {
+      type: String
+    },
+    isPrinting: {
+      type: Boolean,
+      default: !1
+    },
+    isImaging: {
+      type: Boolean,
+      default: !1
+    },
+    title: {
+      type: String
+    },
+    uid: {
+      type: String
+    },
+    hasFullscreen: {
+      type: Boolean,
+      default: !1
+    },
+    chartElement: {
+      type: HTMLElement,
+      default: null
+    },
+    isFullscreen: {
+      type: Boolean,
+      default: !1
+    },
+    isStacked: {
+      type: Boolean,
+      default: !1
+    },
+    isTooltip: {
+      type: Boolean,
+      default: !1
+    },
+    titles: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    showTooltips: {
+      type: Boolean,
+      default: !0
+    }
+  },
+  emits: ["generatePdf", "generateCsv", "generateImage", "toggleTable", "toggleLabels", "toggleSort", "toggleFullscreen", "toggleStack", "toggleTooltip"],
+  setup(e, { emit: v }) {
+    const f = e;
+    function E() {
+      v("generatePdf");
+    }
+    function P() {
+      v("generateCsv");
+    }
+    function O() {
+      v("generateImage");
+    }
+    const p = c(!1);
+    function w() {
+      p.value = !p.value, v("toggleTable");
+    }
+    const $ = c(!1), h = c(!0);
+    function T() {
+      b.value = window.innerWidth > 600, $.value = !$.value, $.value && (h.value = !1);
+    }
+    function z() {
+      f.isPrinting || f.isImaging || ($.value = !1);
+    }
+    function D() {
+      $.value && z();
+    }
+    const S = c(f.isLabelActive);
+    function U() {
+      S.value = !S.value, v("toggleLabels");
+    }
+    function K() {
+      v("toggleSort");
+    }
+    const B = c(f.isStacked);
+    function N() {
+      B.value = !B.value, v("toggleStack");
+    }
+    const M = c(f.isTooltip);
+    function V() {
+      M.value = !M.value, v("toggleTooltip");
+    }
+    const k = c(!1);
+    function F(n) {
+      f.chartElement && (n === "in" ? (k.value = !0, f.chartElement.requestFullscreen(), v("toggleFullscreen", !0)) : (k.value = !1, document && document.exitFullscreen(), v("toggleFullscreen", !1)));
+    }
+    function I(n) {
+      document.fullscreenElement ? k.value = !0 : k.value = !1;
+    }
+    j(() => {
+      document.addEventListener("fullscreenchange", I);
+    }), A(() => {
+      document.removeEventListener("fullscreenchange", I);
+    });
+    const b = c(window.innerWidth > 600), l = c({
+      tooltip: !1,
+      pdf: !1,
+      csv: !1,
+      img: !1,
+      table: !1,
+      labels: !1,
+      sort: !1,
+      stack: !1,
+      fullscreen: !1
+    });
+    return (n, t) => W((o(), s("div", {
+      "data-html2canvas-ignore": "",
+      class: "vue-ui-user-options",
+      style: d(`height: 34px; position: ${k.value ? "fixed" : "absolute"}; top: 0; right:${k.value ? "12px" : "0"}; padding: 4px; background:transparent; z-index: 1`)
+    }, [
+      L("div", {
+        tabindex: "0",
+        title: $.value ? e.titles.close || "" : e.titles.open || "",
+        style: d(`width:32px; position: absolute; top: 0; right:4px; padding: 0 0px; display: flex; align-items:center;justify-content:center;height: 36px;  cursor:pointer; background:${e.backgroundColor};`),
+        onClick: X(T, ["stop"]),
+        onKeypress: q(T, ["enter"])
+      }, [
+        H(i, {
+          name: $.value ? "close" : "menu",
+          stroke: "#CCCCCC",
+          "stroke-width": 2
+        }, null, 8, ["name"])
+      ], 44, Z),
+      L("div", {
+        "data-open": $.value,
+        class: g({ "vue-ui-user-options-drawer": !0 }),
+        style: d(`background:${e.backgroundColor};`)
+      }, [
+        e.hasTooltip ? (o(), s("button", {
+          key: 0,
+          tabindex: "0",
+          class: "vue-ui-user-options-button",
+          onClick: V,
+          onMouseenter: t[0] || (t[0] = (a) => l.value.tooltip = !0),
+          onMouseout: t[1] || (t[1] = (a) => l.value.tooltip = !1)
+        }, [
+          n.$slots.optionTooltip ? y(n.$slots, "optionTooltip", { key: 0 }, void 0, !0) : (o(), s(C, { key: 1 }, [
+            M.value ? (o(), r(i, {
+              key: 0,
+              name: "tooltip",
+              stroke: e.color,
+              style: { "pointer-events": "none" }
+            }, null, 8, ["stroke"])) : (o(), r(i, {
+              key: 1,
+              name: "tooltipDisabled",
+              stroke: e.color,
+              style: { "pointer-events": "none" }
+            }, null, 8, ["stroke"]))
+          ], 64)),
+          b.value && e.titles.tooltip && !n.$slots.optionTooltip ? (o(), s("div", {
+            key: 2,
+            class: g({ "button-info": !0, "button-info-visible": l.value.tooltip }),
+            style: d({ background: e.backgroundColor })
+          }, m(e.titles.tooltip), 7)) : u("", !0)
+        ], 32)) : u("", !0),
+        e.hasPdf ? (o(), s("button", {
+          key: 1,
+          tabindex: "0",
+          class: "vue-ui-user-options-button",
+          onClick: E,
+          onMouseenter: t[2] || (t[2] = (a) => l.value.pdf = !0),
+          onMouseout: t[3] || (t[3] = (a) => l.value.pdf = !1)
+        }, [
+          n.$slots.optionPdf ? y(n.$slots, "optionPdf", { key: 0 }, void 0, !0) : (o(), s(C, { key: 1 }, [
+            e.isPrinting ? (o(), r(i, {
+              key: 0,
+              name: "spin",
+              isSpin: "",
+              stroke: e.color,
+              style: { "pointer-events": "none" }
+            }, null, 8, ["stroke"])) : (o(), r(i, {
+              key: 1,
+              name: "pdf",
+              stroke: e.color,
+              style: { "pointer-events": "none" }
+            }, null, 8, ["stroke"]))
+          ], 64)),
+          b.value && e.titles.pdf && !n.$slots.optionPdf ? (o(), s("div", {
+            key: 2,
+            class: g({ "button-info": !0, "button-info-visible": l.value.pdf }),
+            style: d({ background: e.backgroundColor })
+          }, m(e.titles.pdf), 7)) : u("", !0)
+        ], 32)) : u("", !0),
+        e.hasXls ? (o(), s("button", {
+          key: 2,
+          tabindex: "0",
+          class: "vue-ui-user-options-button",
+          onClick: P,
+          onMouseenter: t[4] || (t[4] = (a) => l.value.csv = !0),
+          onMouseout: t[5] || (t[5] = (a) => l.value.csv = !1)
+        }, [
+          n.$slots.optionCsv ? y(n.$slots, "optionCsv", { key: 0 }, void 0, !0) : (o(), r(i, {
+            key: 1,
+            name: "excel",
+            stroke: e.color,
+            style: { "pointer-events": "none" }
+          }, null, 8, ["stroke"])),
+          b.value && e.titles.csv && !n.$slots.optionCsv ? (o(), s("div", {
+            key: 2,
+            class: g({ "button-info": !0, "button-info-visible": l.value.csv }),
+            style: d({ background: e.backgroundColor })
+          }, m(e.titles.csv), 7)) : u("", !0)
+        ], 32)) : u("", !0),
+        e.hasImg ? (o(), s("button", {
+          key: 3,
+          tabindex: "0",
+          class: "vue-ui-user-options-button",
+          onClick: O,
+          onMouseenter: t[6] || (t[6] = (a) => l.value.img = !0),
+          onMouseout: t[7] || (t[7] = (a) => l.value.img = !1)
+        }, [
+          n.$slots.optionImg ? y(n.$slots, "optionImg", { key: 0 }, void 0, !0) : (o(), s(C, { key: 1 }, [
+            e.isImaging ? (o(), r(i, {
+              key: 0,
+              name: "spin",
+              isSpin: "",
+              stroke: e.color,
+              style: { "pointer-events": "none" }
+            }, null, 8, ["stroke"])) : (o(), r(i, {
+              key: 1,
+              name: "image",
+              stroke: e.color,
+              style: { "pointer-events": "none" }
+            }, null, 8, ["stroke"]))
+          ], 64)),
+          b.value && e.titles.img && !n.$slots.optionImg ? (o(), s("div", {
+            key: 2,
+            class: g({ "button-info": !0, "button-info-visible": l.value.img }),
+            style: d({ background: e.backgroundColor })
+          }, m(e.titles.img), 7)) : u("", !0)
+        ], 32)) : u("", !0),
+        e.hasTable ? (o(), s("button", {
+          key: 4,
+          tabindex: "0",
+          class: "vue-ui-user-options-button",
+          onClick: w,
+          onMouseenter: t[8] || (t[8] = (a) => l.value.table = !0),
+          onMouseout: t[9] || (t[9] = (a) => l.value.table = !1)
+        }, [
+          n.$slots.optionTable ? y(n.$slots, "optionTable", { key: 0 }, void 0, !0) : (o(), r(i, {
+            key: 1,
+            name: p.value ? "tableClose" : "tableOpen",
+            stroke: e.color,
+            style: { "pointer-events": "none" }
+          }, null, 8, ["name", "stroke"])),
+          b.value && e.titles.table && !n.$slots.optionTable ? (o(), s("div", {
+            key: 2,
+            class: g({ "button-info": !0, "button-info-visible": l.value.table }),
+            style: d({ background: e.backgroundColor })
+          }, m(e.titles.table), 7)) : u("", !0)
+        ], 32)) : u("", !0),
+        e.hasLabel ? (o(), s("button", {
+          key: 5,
+          tabindex: "0",
+          class: "vue-ui-user-options-button",
+          onClick: U,
+          onMouseenter: t[10] || (t[10] = (a) => l.value.labels = !0),
+          onMouseout: t[11] || (t[11] = (a) => l.value.labels = !1)
+        }, [
+          n.$slots.optionLabels ? y(n.$slots, "optionLabels", { key: 0 }, void 0, !0) : (o(), r(i, {
+            key: 1,
+            name: S.value ? "labelClose" : "labelOpen",
+            stroke: e.color,
+            style: { "pointer-events": "none" }
+          }, null, 8, ["name", "stroke"])),
+          b.value && e.titles.labels && !n.$slots.optionLabels ? (o(), s("div", {
+            key: 2,
+            class: g({ "button-info": !0, "button-info-visible": l.value.labels }),
+            style: d({ background: e.backgroundColor })
+          }, m(e.titles.labels), 7)) : u("", !0)
+        ], 32)) : u("", !0),
+        e.hasSort ? (o(), s("button", {
+          key: 6,
+          tabindex: "0",
+          class: "vue-ui-user-options-button",
+          onClick: K,
+          onMouseenter: t[12] || (t[12] = (a) => l.value.sort = !0),
+          onMouseout: t[13] || (t[13] = (a) => l.value.sort = !1)
+        }, [
+          n.$slots.optionSort ? y(n.$slots, "optionSort", { key: 0 }, void 0, !0) : (o(), r(i, {
+            key: 1,
+            name: "sort",
+            stroke: e.color,
+            style: { "pointer-events": "none" }
+          }, null, 8, ["stroke"])),
+          b.value && e.titles.sort && !n.$slots.optionSort ? (o(), s("div", {
+            key: 2,
+            class: g({ "button-info": !0, "button-info-visible": l.value.sort }),
+            style: d({ background: e.backgroundColor })
+          }, m(e.titles.sort), 7)) : u("", !0)
+        ], 32)) : u("", !0),
+        e.hasStack ? (o(), s("button", {
+          key: 7,
+          tabindex: "0",
+          class: "vue-ui-user-options-button",
+          onClick: N,
+          onMouseenter: t[14] || (t[14] = (a) => l.value.stack = !0),
+          onMouseout: t[15] || (t[15] = (a) => l.value.stack = !1)
+        }, [
+          n.$slots.optionStack ? y(n.$slots, "optionStack", { key: 0 }, void 0, !0) : (o(), s(C, { key: 1 }, [
+            B.value ? (o(), r(i, {
+              key: 0,
+              name: "unstack",
+              stroke: e.color,
+              style: { "pointer-events": "none" }
+            }, null, 8, ["stroke"])) : (o(), r(i, {
+              key: 1,
+              name: "stack",
+              stroke: e.color,
+              style: { "pointer-events": "none" }
+            }, null, 8, ["stroke"]))
+          ], 64)),
+          b.value && e.titles.stack && !n.$slots.optionStack ? (o(), s("div", {
+            key: 2,
+            class: g({ "button-info": !0, "button-info-visible": l.value.stack }),
+            style: d({ background: e.backgroundColor })
+          }, m(e.titles.stack), 7)) : u("", !0)
+        ], 32)) : u("", !0),
+        e.hasFullscreen ? (o(), s("button", {
+          key: 8,
+          tabindex: "0",
+          class: "vue-ui-user-options-button",
+          onMouseenter: t[16] || (t[16] = (a) => l.value.fullscreen = !0),
+          onMouseout: t[17] || (t[17] = (a) => l.value.fullscreen = !1),
+          onClick: t[18] || (t[18] = (a) => F(k.value ? "out" : "in"))
+        }, [
+          n.$slots.optionFullscreen ? y(n.$slots, "optionFullscreen", G(J({ key: 0 }, { toggleFullscreen: F, isFullscreen: k.value })), void 0, !0) : (o(), s(C, { key: 1 }, [
+            k.value ? (o(), r(i, {
+              key: 0,
+              name: "exitFullscreen",
+              stroke: e.color,
+              style: { "pointer-events": "none" }
+            }, null, 8, ["stroke"])) : u("", !0),
+            k.value ? u("", !0) : (o(), r(i, {
+              key: 1,
+              name: "fullscreen",
+              stroke: e.color,
+              style: { "pointer-events": "none" }
+            }, null, 8, ["stroke"]))
+          ], 64)),
+          b.value && e.titles.fullscreen && !n.$slots.optionFullscreen ? (o(), s("div", {
+            key: 2,
+            class: g({ "button-info": !0, "button-info-visible": l.value.fullscreen }),
+            style: d({ background: e.backgroundColor })
+          }, m(e.titles.fullscreen), 7)) : u("", !0)
+        ], 32)) : u("", !0)
+      ], 12, x)
+    ], 4)), [
+      [Q(Y), D]
+    ]);
+  }
+}, oe = /* @__PURE__ */ R(_, [["__scopeId", "data-v-857d2388"]]);
+export {
+  oe as U
+};