@flowtools/uplot 0.0.17 → 0.0.18

package/dist/index.es.js

@@ -1,181 +1,180 @@
-import { defineComponent as M, mergeModels as A, useTemplateRef as $, useModel as D, ref as F, onMounted as N, watch as h, nextTick as P, createElementBlock as f, openBlock as p, renderSlot as k, createElementVNode as g, createCommentVNode as w, createTextVNode as R, toDisplayString as d, unref as j, Fragment as U, renderList as L, normalizeStyle as C, normalizeClass as q } from "vue";
-import { useElementSize as G } from "@vueuse/core";
-import H from "uplot";
-function T(n) {
-  if (typeof n == "object" && n !== null) {
-    if (typeof Object.getPrototypeOf == "function") {
-      const a = Object.getPrototypeOf(n);
-      return a === Object.prototype || a === null;
-    }
-    return Object.prototype.toString.call(n) === "[object Object]";
-  }
-  return !1;
+import { Fragment as e, createCommentVNode as t, createElementBlock as n, createElementVNode as r, createTextVNode as i, defineComponent as a, mergeModels as o, nextTick as s, normalizeClass as c, normalizeStyle as l, onMounted as u, openBlock as d, ref as f, renderList as p, renderSlot as m, toDisplayString as h, unref as g, useModel as _, useTemplateRef as v, watch as y } from "vue";
+import { useElementSize as b } from "@vueuse/core";
+import x from "uplot";
+//#region src/utils/deepmerge.ts
+// istanbul ignore next
+function S(e) {
+	if (typeof e == "object" && e) {
+		if (typeof Object.getPrototypeOf == "function") {
+			let t = Object.getPrototypeOf(e);
+			return t === Object.prototype || t === null;
+		}
+		return Object.prototype.toString.call(e) === "[object Object]";
+	}
+	return !1;
 }
-function u(...n) {
-  return n.reduce((a, r) => {
-    if (Array.isArray(r))
-      throw new TypeError(
-        "Arguments provided to ts-deepmerge must be objects, not arrays."
-      );
-    return r && Object.keys(r).forEach((o) => {
-      ["__proto__", "constructor", "prototype"].includes(o) || (Array.isArray(a[o]) && Array.isArray(r[o]) ? a[o] = u.options.mergeArrays ? Array.from(new Set(a[o].concat(r[o]))) : r[o] : T(a[o]) && T(r[o]) ? a[o] = u(a[o], r[o]) : a[o] = r[o]);
-    }), a;
-  }, {});
+function C(...e) {
+	return e.reduce((e, t) => {
+		if (Array.isArray(t)) throw TypeError("Arguments provided to ts-deepmerge must be objects, not arrays.");
+		return t && Object.keys(t).forEach((n) => {
+			[
+				"__proto__",
+				"constructor",
+				"prototype"
+			].includes(n) || (Array.isArray(e[n]) && Array.isArray(t[n]) ? e[n] = C.options.mergeArrays ? Array.from(new Set(e[n].concat(t[n]))) : t[n] : S(e[n]) && S(t[n]) ? e[n] = C(e[n], t[n]) : e[n] = t[n]);
+		}), e;
+	}, {});
 }
-const B = {
-  mergeArrays: !0
+var w = { mergeArrays: !0 };
+C.options = w, C.withOptions = (e, ...t) => {
+	C.options = {
+		mergeArrays: !0,
+		...e
+	};
+	let n = C(...t);
+	return C.options = w, n;
 };
-u.options = B;
-u.withOptions = (n, ...a) => {
-  u.options = {
-    mergeArrays: !0,
-    ...n
-  };
-  const r = u(...a);
-  return u.options = B, r;
-};
-const I = { class: "__uplot-root" }, J = {
-  key: 0,
-  class: "extra-info"
-}, K = { style: { "text-align": "left" } }, Q = { class: "__uplot-legend" }, W = ["onClick"], X = {
-  key: 1,
-  class: "__uplot-legend-value"
-}, Y = {
-  key: 2,
-  class: "__uplot-legend-value"
-}, te = /* @__PURE__ */ M({
-  __name: "uplot",
-  props: /* @__PURE__ */ A({
-    options: {},
-    data: {},
-    noResetScale: { type: Boolean, default: !1 },
-    showDebug: { type: Boolean, default: !1 },
-    noFooter: { type: Boolean, default: !1 }
-  }, {
-    zoom: { default: () => [null, null] },
-    zoomModifiers: {},
-    series: { default: () => [] },
-    seriesModifiers: {}
-  }),
-  emits: /* @__PURE__ */ A(["select", "cursor"], ["update:zoom", "update:series"]),
-  setup(n, { expose: a, emit: r }) {
-    const o = n, x = r, v = $("el"), { width: _, height: y } = G(v), c = D(n, "zoom"), i = D(n, "series"), E = {
-      title: void 0,
-      legend: {
-        show: !1
-      },
-      hooks: {
-        init: [
-          (e) => {
-            o.showDebug && console.log("init", e), i.value = e.series.map((l, s) => ({
-              label: l.label,
-              stroke: typeof l.stroke == "function" ? l.stroke(e, s) : null,
-              value: null,
-              data: null,
-              show: l.show
-              // ...s,
-            }));
-          }
-        ],
-        setCursor: [
-          (e) => {
-            x("cursor", e.cursor), i.value = e.series.map((l, s) => ({
-              label: l.label,
-              stroke: typeof l.stroke == "function" ? l.stroke(e, s) : null,
-              value: e.cursor.idx && e.data[s][e.cursor.idx] ? typeof l.value == "function" ? l.value(e, e.data[s][e.cursor.idx], s, e.cursor.idx) : e.data[s][e.cursor.idx] : null,
-              data: e.cursor?.idx ? e.data[s][e.cursor?.idx] : null,
-              show: l.show
-              // ...s,
-            }));
-          }
-        ],
-        setSelect: [
-          (e) => {
-            x("select", e.select), o.showDebug && console.log("setSelect", e.select), c.value = [
-              e.posToVal(e.select.left, "x"),
-              e.posToVal(e.select.left + e.select.width, "x")
-            ];
-          }
-        ],
-        setScale: [
-          (e) => {
-            o.showDebug && console.log("setScale", e.scales), c.value = [
-              e.scales.x.min || null,
-              e.scales.x.max || null
-            ];
-          }
-        ]
-      }
-    };
-    let t;
-    const S = F();
-    function O() {
-      t && t.destroy(), t = new H({ width: 100, height: 100, ...u(o.options, E) }, o.data, v.value), S.value = t, c.value && c.value[0] !== null && c.value[1] !== null && t.setScale("x", { min: c.value[0], max: c.value[1] }), setTimeout(() => {
-        z();
-      }, 0);
-    }
-    N(() => {
-      O();
-    }), h([_, y], () => {
-      P(() => {
-        z();
-      });
-    }), h(o.data, (e) => {
-      if (o.noResetScale) {
-        t.setData(e, !1), t.redraw(!1);
-        return;
-      }
-      t.setData(e, !0);
-    }), h(o.options, (e, l) => {
-      o.showDebug && console.log("watch options", e, l), O();
-    }), h(() => c.value, (e) => {
-      e && e[0] !== null && e[1] !== null && (t.scales.x.min !== e[0] || t.scales.x.max !== e[1]) && (o.showDebug && console.log("watch zoom setScale", t.scales.x.min, e[0], t.scales.x.max, e[1]), t.setScale("x", { min: e[0], max: e[1] }));
-    });
-    function z() {
-      t.setSize({ width: _.value, height: y.value }), o.showDebug && console.log("resize", t);
-    }
-    function m(e) {
-      typeof e == "object" && (e = i.value?.indexOf(e) || -1), t.setSeries(e, { show: !t.series[e].show }), i.value?.[e] && (i.value[e].show = t.series[e].show);
-    }
-    return a({ toggleShow: m, uplot: S }), (e, l) => (p(), f("div", I, [
-      k(e.$slots, "header", {
-        series: i.value,
-        toggleShow: m
-      }),
-      g("div", {
-        ref_key: "el",
-        ref: v,
-        class: "__uplot"
-      }, null, 512),
-      e.showDebug ? (p(), f("div", J, [
-        R(d(j(_)) + " x " + d(j(y)) + " ", 1),
-        l[0] || (l[0] = g("br", null, null, -1)),
-        g("pre", K, d(i.value), 1)
-      ])) : w("", !0),
-      e.noFooter ? w("", !0) : k(e.$slots, "footer", {
-        key: 1,
-        series: i.value,
-        toggleShow: m
-      }, () => [
-        g("div", Q, [
-          (p(!0), f(U, null, L(i.value, (s, b) => (p(), f("div", {
-            key: s.label,
-            class: q(["__uplot-legend-series", [`__uplot-${s.label?.toLowerCase()}`, `__uplot-i-${b}`]]),
-            style: C({ backgroundColor: s.show ? "" : "lightgrey" }),
-            onClick: (Z) => m(b)
-          }, [
-            b !== 0 ? (p(), f("span", {
-              key: 0,
-              style: C({ color: s.stroke || "black" }),
-              class: "__uplot-legend-label"
-            }, d(s.label), 5)) : w("", !0),
-            s.value ? (p(), f("span", X, d(s.value), 1)) : (p(), f("span", Y, "--"))
-          ], 14, W))), 128))
-        ])
-      ])
-    ]));
-  }
+//#endregion
+//#region src/components/uplot.vue?vue&type=script&setup=true&lang.ts
+var T = { class: "__uplot-root" }, E = {
+	key: 0,
+	class: "extra-info"
+}, D = { style: { "text-align": "left" } }, O = { class: "__uplot-legend" }, k = ["onClick"], A = {
+	key: 1,
+	class: "__uplot-legend-value"
+}, j = {
+	key: 2,
+	class: "__uplot-legend-value"
+}, M = /* @__PURE__ */ a({
+	__name: "uplot",
+	props: /* @__PURE__ */ o({
+		options: {},
+		data: {},
+		noResetScale: {
+			type: Boolean,
+			default: !1
+		},
+		showDebug: {
+			type: Boolean,
+			default: !1
+		},
+		noFooter: {
+			type: Boolean,
+			default: !1
+		}
+	}, {
+		zoom: { default: () => [null, null] },
+		zoomModifiers: {},
+		series: { default: () => [] },
+		seriesModifiers: {}
+	}),
+	emits: /* @__PURE__ */ o(["select", "cursor"], ["update:zoom", "update:series"]),
+	setup(a, { expose: o, emit: S }) {
+		let w = a, M = S, N = v("el"), { width: P, height: F } = b(N), I = _(a, "zoom"), L = _(a, "series"), R = {
+			title: void 0,
+			legend: { show: !1 },
+			hooks: {
+				init: [(e) => {
+					w.showDebug && console.log("init", e), L.value = e.series.map((t, n) => ({
+						label: t.label,
+						stroke: typeof t.stroke == "function" ? t.stroke(e, n) : null,
+						value: null,
+						data: null,
+						show: t.show
+					}));
+				}],
+				setCursor: [(e) => {
+					M("cursor", e.cursor), L.value = e.series.map((t, n) => ({
+						label: t.label,
+						stroke: typeof t.stroke == "function" ? t.stroke(e, n) : null,
+						value: e.cursor.idx && e.data[n][e.cursor.idx] ? typeof t.value == "function" ? t.value(e, e.data[n][e.cursor.idx], n, e.cursor.idx) : e.data[n][e.cursor.idx] : null,
+						data: e.cursor?.idx ? e.data[n][e.cursor?.idx] : null,
+						show: t.show
+					}));
+				}],
+				setSelect: [(e) => {
+					M("select", e.select), w.showDebug && console.log("setSelect", e.select), I.value = [e.posToVal(e.select.left, "x"), e.posToVal(e.select.left + e.select.width, "x")];
+				}],
+				setScale: [(e) => {
+					w.showDebug && console.log("setScale", e.scales), I.value = [e.scales.x.min || null, e.scales.x.max || null];
+				}]
+			}
+		}, z, B = f();
+		function V() {
+			z && z.destroy(), z = new x({
+				width: 100,
+				height: 100,
+				...C(w.options, R)
+			}, w.data, N.value), B.value = z, I.value && I.value[0] !== null && I.value[1] !== null && z.setScale("x", {
+				min: I.value[0],
+				max: I.value[1]
+			}), setTimeout(() => {
+				H();
+			}, 0);
+		}
+		u(() => {
+			V();
+		}), y([P, F], () => {
+			s(() => {
+				H();
+			});
+		}), y(w.data, (e) => {
+			if (w.noResetScale) {
+				z.setData(e, !1), z.redraw(!1);
+				return;
+			}
+			z.setData(e, !0);
+		}), y(w.options, (e, t) => {
+			w.showDebug && console.log("watch options", e, t), V();
+		}), y(() => I.value, (e) => {
+			e && e[0] !== null && e[1] !== null && (z.scales.x.min !== e[0] || z.scales.x.max !== e[1]) && (w.showDebug && console.log("watch zoom setScale", z.scales.x.min, e[0], z.scales.x.max, e[1]), z.setScale("x", {
+				min: e[0],
+				max: e[1]
+			}));
+		});
+		function H() {
+			z.setSize({
+				width: P.value,
+				height: F.value
+			}), w.showDebug && console.log("resize", z);
+		}
+		function U(e) {
+			typeof e == "object" && (e = L.value?.indexOf(e) || -1), z.setSeries(e, { show: !z.series[e].show }), L.value?.[e] && (L.value[e].show = z.series[e].show);
+		}
+		return o({
+			toggleShow: U,
+			uplot: B
+		}), (o, s) => (d(), n("div", T, [
+			m(o.$slots, "header", {
+				series: L.value,
+				toggleShow: U
+			}),
+			r("div", {
+				ref_key: "el",
+				ref: N,
+				class: "__uplot"
+			}, null, 512),
+			a.showDebug ? (d(), n("div", E, [
+				i(h(g(P)) + " x " + h(g(F)) + " ", 1),
+				s[0] ||= r("br", null, null, -1),
+				r("pre", D, h(L.value), 1)
+			])) : t("", !0),
+			a.noFooter ? t("", !0) : m(o.$slots, "footer", {
+				key: 1,
+				series: L.value,
+				toggleShow: U
+			}, () => [r("div", O, [(d(!0), n(e, null, p(L.value, (e, r) => (d(), n("div", {
+				key: e.label,
+				class: c(["__uplot-legend-series", [`__uplot-${e.label?.toLowerCase()}`, `__uplot-i-${r}`]]),
+				style: l({ backgroundColor: e.show ? "" : "lightgrey" }),
+				onClick: (e) => U(r)
+			}, [r === 0 ? t("", !0) : (d(), n("span", {
+				key: 0,
+				style: l({ color: e.stroke || "black" }),
+				class: "__uplot-legend-label"
+			}, h(e.label), 5)), e.value ? (d(), n("span", A, h(e.value), 1)) : (d(), n("span", j, "--"))], 14, k))), 128))])])
+		]));
+	}
 });
-export {
-  te as Uplot
-};
+//#endregion
+export { M as Uplot };

package/dist/index.umd.js

@@ -1 +1 @@
-(function(c,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("vue"),require("@vueuse/core"),require("uplot")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core","uplot"],o):(c=typeof globalThis<"u"?globalThis:c||self,o(c["change-name"]={},c.Vue,c.VueUseCore,c.uPlot))})(this,function(c,o,B,D){"use strict";function _(i){if(typeof i=="object"&&i!==null){if(typeof Object.getPrototypeOf=="function"){const r=Object.getPrototypeOf(i);return r===Object.prototype||r===null}return Object.prototype.toString.call(i)==="[object Object]"}return!1}function d(...i){return i.reduce((r,a)=>{if(Array.isArray(a))throw new TypeError("Arguments provided to ts-deepmerge must be objects, not arrays.");return a&&Object.keys(a).forEach(t=>{["__proto__","constructor","prototype"].includes(t)||(Array.isArray(r[t])&&Array.isArray(a[t])?r[t]=d.options.mergeArrays?Array.from(new Set(r[t].concat(a[t]))):a[t]:_(r[t])&&_(a[t])?r[t]=d(r[t],a[t]):r[t]=a[t])}),r},{})}const b={mergeArrays:!0};d.options=b,d.withOptions=(i,...r)=>{d.options={mergeArrays:!0,...i};const a=d(...r);return d.options=b,a};const E={class:"__uplot-root"},O={key:0,class:"extra-info"},z={style:{"text-align":"left"}},A={class:"__uplot-legend"},C=["onClick"],j={key:1,class:"__uplot-legend-value"},T={key:2,class:"__uplot-legend-value"},M=o.defineComponent({__name:"uplot",props:o.mergeModels({options:{},data:{},noResetScale:{type:Boolean,default:!1},showDebug:{type:Boolean,default:!1},noFooter:{type:Boolean,default:!1}},{zoom:{default:()=>[null,null]},zoomModifiers:{},series:{default:()=>[]},seriesModifiers:{}}),emits:o.mergeModels(["select","cursor"],["update:zoom","update:series"]),setup(i,{expose:r,emit:a}){const t=i,w=a,u=o.useTemplateRef("el"),{width:h,height:g}=B.useElementSize(u),f=o.useModel(i,"zoom"),p=o.useModel(i,"series"),N={title:void 0,legend:{show:!1},hooks:{init:[e=>{t.showDebug&&console.log("init",e),p.value=e.series.map((s,n)=>({label:s.label,stroke:typeof s.stroke=="function"?s.stroke(e,n):null,value:null,data:null,show:s.show}))}],setCursor:[e=>{w("cursor",e.cursor),p.value=e.series.map((s,n)=>({label:s.label,stroke:typeof s.stroke=="function"?s.stroke(e,n):null,value:e.cursor.idx&&e.data[n][e.cursor.idx]?typeof s.value=="function"?s.value(e,e.data[n][e.cursor.idx],n,e.cursor.idx):e.data[n][e.cursor.idx]:null,data:e.cursor?.idx?e.data[n][e.cursor?.idx]:null,show:s.show}))}],setSelect:[e=>{w("select",e.select),t.showDebug&&console.log("setSelect",e.select),f.value=[e.posToVal(e.select.left,"x"),e.posToVal(e.select.left+e.select.width,"x")]}],setScale:[e=>{t.showDebug&&console.log("setScale",e.scales),f.value=[e.scales.x.min||null,e.scales.x.max||null]}]}};let l;const S=o.ref();function k(){l&&l.destroy(),l=new D({width:100,height:100,...d(t.options,N)},t.data,u.value),S.value=l,f.value&&f.value[0]!==null&&f.value[1]!==null&&l.setScale("x",{min:f.value[0],max:f.value[1]}),setTimeout(()=>{x()},0)}o.onMounted(()=>{k()}),o.watch([h,g],()=>{o.nextTick(()=>{x()})}),o.watch(t.data,e=>{if(t.noResetScale){l.setData(e,!1),l.redraw(!1);return}l.setData(e,!0)}),o.watch(t.options,(e,s)=>{t.showDebug&&console.log("watch options",e,s),k()}),o.watch(()=>f.value,e=>{e&&e[0]!==null&&e[1]!==null&&(l.scales.x.min!==e[0]||l.scales.x.max!==e[1])&&(t.showDebug&&console.log("watch zoom setScale",l.scales.x.min,e[0],l.scales.x.max,e[1]),l.setScale("x",{min:e[0],max:e[1]}))});function x(){l.setSize({width:h.value,height:g.value}),t.showDebug&&console.log("resize",l)}function m(e){typeof e=="object"&&(e=p.value?.indexOf(e)||-1),l.setSeries(e,{show:!l.series[e].show}),p.value?.[e]&&(p.value[e].show=l.series[e].show)}return r({toggleShow:m,uplot:S}),(e,s)=>(o.openBlock(),o.createElementBlock("div",E,[o.renderSlot(e.$slots,"header",{series:p.value,toggleShow:m}),o.createElementVNode("div",{ref_key:"el",ref:u,class:"__uplot"},null,512),e.showDebug?(o.openBlock(),o.createElementBlock("div",O,[o.createTextVNode(o.toDisplayString(o.unref(h))+" x "+o.toDisplayString(o.unref(g))+" ",1),s[0]||(s[0]=o.createElementVNode("br",null,null,-1)),o.createElementVNode("pre",z,o.toDisplayString(p.value),1)])):o.createCommentVNode("",!0),e.noFooter?o.createCommentVNode("",!0):o.renderSlot(e.$slots,"footer",{key:1,series:p.value,toggleShow:m},()=>[o.createElementVNode("div",A,[(o.openBlock(!0),o.createElementBlock(o.Fragment,null,o.renderList(p.value,(n,y)=>(o.openBlock(),o.createElementBlock("div",{key:n.label,class:o.normalizeClass(["__uplot-legend-series",[`__uplot-${n.label?.toLowerCase()}`,`__uplot-i-${y}`]]),style:o.normalizeStyle({backgroundColor:n.show?"":"lightgrey"}),onClick:P=>m(y)},[y!==0?(o.openBlock(),o.createElementBlock("span",{key:0,style:o.normalizeStyle({color:n.stroke||"black"}),class:"__uplot-legend-label"},o.toDisplayString(n.label),5)):o.createCommentVNode("",!0),n.value?(o.openBlock(),o.createElementBlock("span",j,o.toDisplayString(n.value),1)):(o.openBlock(),o.createElementBlock("span",T,"--"))],14,C))),128))])])]))}});c.Uplot=M,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})});
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`vue`),require(`@vueuse/core`),require(`uplot`)):typeof define==`function`&&define.amd?define([`exports`,`vue`,`@vueuse/core`,`uplot`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`change-name`]={},e.Vue,e.VueUseCore,e.uPlot))})(this,function(e,t,n,r){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var i=Object.create,a=Object.defineProperty,o=Object.getOwnPropertyDescriptor,s=Object.getOwnPropertyNames,c=Object.getPrototypeOf,l=Object.prototype.hasOwnProperty,u=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var i=s(t),c=0,u=i.length,d;c<u;c++)d=i[c],!l.call(e,d)&&d!==n&&a(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(r=o(t,d))||r.enumerable});return e};r=((e,t,n)=>(n=e==null?{}:i(c(e)),u(t||!e||!e.__esModule?a(n,`default`,{value:e,enumerable:!0}):n,e)))(r,1);function d(e){if(typeof e==`object`&&e){if(typeof Object.getPrototypeOf==`function`){let t=Object.getPrototypeOf(e);return t===Object.prototype||t===null}return Object.prototype.toString.call(e)===`[object Object]`}return!1}function f(...e){return e.reduce((e,t)=>{if(Array.isArray(t))throw TypeError(`Arguments provided to ts-deepmerge must be objects, not arrays.`);return t&&Object.keys(t).forEach(n=>{[`__proto__`,`constructor`,`prototype`].includes(n)||(Array.isArray(e[n])&&Array.isArray(t[n])?e[n]=f.options.mergeArrays?Array.from(new Set(e[n].concat(t[n]))):t[n]:d(e[n])&&d(t[n])?e[n]=f(e[n],t[n]):e[n]=t[n])}),e},{})}var p={mergeArrays:!0};f.options=p,f.withOptions=(e,...t)=>{f.options={mergeArrays:!0,...e};let n=f(...t);return f.options=p,n};var m={class:`__uplot-root`},h={key:0,class:`extra-info`},g={style:{"text-align":`left`}},_={class:`__uplot-legend`},v=[`onClick`],y={key:1,class:`__uplot-legend-value`},b={key:2,class:`__uplot-legend-value`};e.Uplot=(0,t.defineComponent)({__name:`uplot`,props:(0,t.mergeModels)({options:{},data:{},noResetScale:{type:Boolean,default:!1},showDebug:{type:Boolean,default:!1},noFooter:{type:Boolean,default:!1}},{zoom:{default:()=>[null,null]},zoomModifiers:{},series:{default:()=>[]},seriesModifiers:{}}),emits:(0,t.mergeModels)([`select`,`cursor`],[`update:zoom`,`update:series`]),setup(e,{expose:i,emit:a}){let o=e,s=a,c=(0,t.useTemplateRef)(`el`),{width:l,height:u}=(0,n.useElementSize)(c),d=(0,t.useModel)(e,`zoom`),p=(0,t.useModel)(e,`series`),x={title:void 0,legend:{show:!1},hooks:{init:[e=>{o.showDebug&&console.log(`init`,e),p.value=e.series.map((t,n)=>({label:t.label,stroke:typeof t.stroke==`function`?t.stroke(e,n):null,value:null,data:null,show:t.show}))}],setCursor:[e=>{s(`cursor`,e.cursor),p.value=e.series.map((t,n)=>({label:t.label,stroke:typeof t.stroke==`function`?t.stroke(e,n):null,value:e.cursor.idx&&e.data[n][e.cursor.idx]?typeof t.value==`function`?t.value(e,e.data[n][e.cursor.idx],n,e.cursor.idx):e.data[n][e.cursor.idx]:null,data:e.cursor?.idx?e.data[n][e.cursor?.idx]:null,show:t.show}))}],setSelect:[e=>{s(`select`,e.select),o.showDebug&&console.log(`setSelect`,e.select),d.value=[e.posToVal(e.select.left,`x`),e.posToVal(e.select.left+e.select.width,`x`)]}],setScale:[e=>{o.showDebug&&console.log(`setScale`,e.scales),d.value=[e.scales.x.min||null,e.scales.x.max||null]}]}},S,C=(0,t.ref)();function w(){S&&S.destroy(),S=new r.default({width:100,height:100,...f(o.options,x)},o.data,c.value),C.value=S,d.value&&d.value[0]!==null&&d.value[1]!==null&&S.setScale(`x`,{min:d.value[0],max:d.value[1]}),setTimeout(()=>{T()},0)}(0,t.onMounted)(()=>{w()}),(0,t.watch)([l,u],()=>{(0,t.nextTick)(()=>{T()})}),(0,t.watch)(o.data,e=>{if(o.noResetScale){S.setData(e,!1),S.redraw(!1);return}S.setData(e,!0)}),(0,t.watch)(o.options,(e,t)=>{o.showDebug&&console.log(`watch options`,e,t),w()}),(0,t.watch)(()=>d.value,e=>{e&&e[0]!==null&&e[1]!==null&&(S.scales.x.min!==e[0]||S.scales.x.max!==e[1])&&(o.showDebug&&console.log(`watch zoom setScale`,S.scales.x.min,e[0],S.scales.x.max,e[1]),S.setScale(`x`,{min:e[0],max:e[1]}))});function T(){S.setSize({width:l.value,height:u.value}),o.showDebug&&console.log(`resize`,S)}function E(e){typeof e==`object`&&(e=p.value?.indexOf(e)||-1),S.setSeries(e,{show:!S.series[e].show}),p.value?.[e]&&(p.value[e].show=S.series[e].show)}return i({toggleShow:E,uplot:C}),(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,m,[(0,t.renderSlot)(n.$slots,`header`,{series:p.value,toggleShow:E}),(0,t.createElementVNode)(`div`,{ref_key:`el`,ref:c,class:`__uplot`},null,512),e.showDebug?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,h,[(0,t.createTextVNode)((0,t.toDisplayString)((0,t.unref)(l))+` x `+(0,t.toDisplayString)((0,t.unref)(u))+` `,1),r[0]||=(0,t.createElementVNode)(`br`,null,null,-1),(0,t.createElementVNode)(`pre`,g,(0,t.toDisplayString)(p.value),1)])):(0,t.createCommentVNode)(``,!0),e.noFooter?(0,t.createCommentVNode)(``,!0):(0,t.renderSlot)(n.$slots,`footer`,{key:1,series:p.value,toggleShow:E},()=>[(0,t.createElementVNode)(`div`,_,[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(p.value,(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:e.label,class:(0,t.normalizeClass)([`__uplot-legend-series`,[`__uplot-${e.label?.toLowerCase()}`,`__uplot-i-${n}`]]),style:(0,t.normalizeStyle)({backgroundColor:e.show?``:`lightgrey`}),onClick:e=>E(n)},[n===0?(0,t.createCommentVNode)(``,!0):((0,t.openBlock)(),(0,t.createElementBlock)(`span`,{key:0,style:(0,t.normalizeStyle)({color:e.stroke||`black`}),class:`__uplot-legend-label`},(0,t.toDisplayString)(e.label),5)),e.value?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,y,(0,t.toDisplayString)(e.value),1)):((0,t.openBlock)(),(0,t.createElementBlock)(`span`,b,`--`))],14,v))),128))])])]))}})});

package/dist/src/App.vue.d.ts

@@ -16,9 +16,7 @@ declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import
             readonly "onUpdate:zoom"?: ((value: number[] | null[]) => any) | undefined;
             readonly "onUpdate:series"?: ((value: Series[]) => any) | undefined;
         } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
-        $attrs: {
-            [x: string]: unknown;
-        };
+        $attrs: import('vue').Attrs;
         $refs: {
             [x: string]: unknown;
         } & {
@@ -85,10 +83,10 @@ declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import
         onCursor?: ((cursor: import('uplot').Cursor) => any) | undefined;
         "onUpdate:zoom"?: ((value: number[] | null[]) => any) | undefined;
         "onUpdate:series"?: ((value: Series[]) => any) | undefined;
-    }>, "toggleShow" | "uplot" | ("noResetScale" | "showDebug" | "noFooter")> & import('vue').ShallowUnwrapRef<{
+    }>, "toggleShow" | "uplot" | ("noResetScale" | "showDebug" | "noFooter")> & {
         toggleShow: (idx: number | Series) => void;
-        uplot: import('vue').Ref<any, any>;
-    }> & {} & import('vue').ComponentCustomProperties & {} & {
+        uplot: any;
+    } & {} & import('vue').ComponentCustomProperties & {} & {
         $slots: {
             header?(_: {
                 series: Series[];

package/dist/uplot.css

@@ -1 +1,2 @@
-.uplot,.uplot *,.uplot *:before,.uplot *:after{box-sizing:border-box}.uplot{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";line-height:1.5;width:min-content}.u-title{text-align:center;font-size:18px;font-weight:700}.u-wrap{position:relative;-webkit-user-select:none;user-select:none}.u-over,.u-under{position:absolute}.u-under{overflow:hidden}.uplot canvas{display:block;position:relative;width:100%;height:100%}.u-axis{position:absolute}.u-legend{font-size:14px;margin:auto;text-align:center}.u-inline{display:block}.u-inline *{display:inline-block}.u-inline tr{margin-right:16px}.u-legend th{font-weight:600}.u-legend th>*{vertical-align:middle;display:inline-block}.u-legend .u-marker{width:1em;height:1em;margin-right:4px;background-clip:padding-box!important}.u-inline.u-live th:after{content:":";vertical-align:middle}.u-inline:not(.u-live) .u-value{display:none}.u-series>*{padding:4px}.u-series th{cursor:pointer}.u-legend .u-off>*{opacity:.3}.u-select{background:#00000012;position:absolute;pointer-events:none}.u-cursor-x,.u-cursor-y{position:absolute;left:0;top:0;pointer-events:none;will-change:transform}.u-hz .u-cursor-x,.u-vt .u-cursor-y{height:100%;border-right:1px dashed #607D8B}.u-hz .u-cursor-y,.u-vt .u-cursor-x{width:100%;border-bottom:1px dashed #607D8B}.u-cursor-pt{position:absolute;top:0;left:0;border-radius:50%;border:0 solid;pointer-events:none;will-change:transform;background-clip:padding-box!important}.u-axis.u-off,.u-select.u-off,.u-cursor-x.u-off,.u-cursor-y.u-off,.u-cursor-pt.u-off{display:none}.__uplot{flex:1 1 auto;min-height:120px;position:relative}.__uplot-root{display:flex;flex-direction:column;width:100%;height:100%}.__uplot .uplot{position:absolute;inset:0}.__uplot-legend{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;align-items:center;align-content:center;padding:.5em;gap:.25em;font-size:10px}.__uplot-legend-series{display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:space-between;align-items:center;align-content:center;padding:5px;background-color:#fff;color:#000;border:1px solid lightgray;border-radius:5px;min-width:6em;min-height:4em}.__uplot-i-0{min-width:12em;justify-content:end}.extra-info{position:absolute;bottom:0;left:0;background-color:#fff;color:#000;padding:5px;border:1px solid black}
+.uplot,.uplot *,.uplot :before,.uplot :after{box-sizing:border-box}.uplot{width:min-content;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}.u-title{text-align:center;font-size:18px;font-weight:700}.u-wrap{-webkit-user-select:none;user-select:none;position:relative}.u-over,.u-under{position:absolute}.u-under{overflow:hidden}.uplot canvas{width:100%;height:100%;display:block;position:relative}.u-axis{position:absolute}.u-legend{text-align:center;margin:auto;font-size:14px}.u-inline{display:block}.u-inline *{display:inline-block}.u-inline tr{margin-right:16px}.u-legend th{font-weight:600}.u-legend th>*{vertical-align:middle;display:inline-block}.u-legend .u-marker{width:1em;height:1em;margin-right:4px;background-clip:padding-box!important}.u-inline.u-live th:after{content:":";vertical-align:middle}.u-inline:not(.u-live) .u-value{display:none}.u-series>*{padding:4px}.u-series th{cursor:pointer}.u-legend .u-off>*{opacity:.3}.u-select{pointer-events:none;background:#00000012;position:absolute}.u-cursor-x,.u-cursor-y{pointer-events:none;will-change:transform;position:absolute;top:0;left:0}.u-hz .u-cursor-x,.u-vt .u-cursor-y{border-right:1px dashed #607d8b;height:100%}.u-hz .u-cursor-y,.u-vt .u-cursor-x{border-bottom:1px dashed #607d8b;width:100%}.u-cursor-pt{pointer-events:none;will-change:transform;border:0 solid;border-radius:50%;position:absolute;top:0;left:0;background-clip:padding-box!important}.u-axis.u-off,.u-select.u-off,.u-cursor-x.u-off,.u-cursor-y.u-off,.u-cursor-pt.u-off{display:none}.__uplot{flex:auto;min-height:120px;position:relative}.__uplot-root{flex-direction:column;width:100%;height:100%;display:flex}.__uplot .uplot{position:absolute;inset:0}.__uplot-legend{flex-flow:wrap;place-content:center space-between;align-items:center;gap:.25em;padding:.5em;font-size:10px;display:flex}.__uplot-legend-series{color:#000;background-color:#fff;border:1px solid #d3d3d3;border-radius:5px;flex-flow:column;place-content:center space-between;align-items:center;min-width:6em;min-height:4em;padding:5px;display:flex}.__uplot-i-0{justify-content:end;min-width:12em}.extra-info{color:#000;background-color:#fff;border:1px solid #000;padding:5px;position:absolute;bottom:0;left:0}
+/*$vite$:1*/

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@flowtools/uplot",
   "type": "module",
-  "version": "0.0.17",
+  "version": "0.0.18",
   "description": "Modern vue component for uplot",
   "author": "Jukka Raimovaara <roska@mentalhouse.fi> (Mentalhouse Oy)",
   "license": "MIT",
@@ -41,24 +41,24 @@
     "vue": "^3.5.18"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^5.0.0",
+    "@antfu/eslint-config": "^8.1.1",
     "@types/node": "^24.1.0",
-    "@vitejs/plugin-vue": "^6.0.1",
-    "@vitest/coverage-v8": "^3.2.4",
+    "@vitejs/plugin-vue": "^6.0.5",
+    "@vitest/coverage-v8": "^4.1.4",
     "@vue/test-utils": "^2.4.6",
-    "@vueuse/core": "^13.6.0",
-    "bumpp": "^10.2.1",
-    "eslint": "^9.15.0",
-    "jsdom": "^26.1.0",
-    "lint-staged": "^16.1.2",
-    "simple-git-hooks": "^2.11.1",
-    "typescript": "^5.7.2",
+    "@vueuse/core": "^14.2.1",
+    "bumpp": "^11.0.1",
+    "eslint": "^10.2.0",
+    "jsdom": "^29.0.2",
+    "lint-staged": "^16.4.0",
+    "simple-git-hooks": "^2.13.1",
+    "typescript": "^6.0.2",
     "uplot": "^1.6.31",
     "vi-canvas-mock": "^1.0.0",
-    "vite": "^7.0.6",
+    "vite": "^8.0.8",
     "vite-plugin-dts": "^4.3.0",
-    "vitest": "^3.2.4",
-    "vue": "^3.5.18"
+    "vitest": "^4.1.4",
+    "vue": "^3.5.32"
   },
   "simple-git-hooks": {
     "pre-commit": "pnpm lint-staged"