@flowtools/uplot 0.0.6 → 0.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.es.js CHANGED
@@ -1,58 +1,58 @@
1
- import { defineComponent as U, ref as k, onMounted as V, watch as b, nextTick as $, openBlock as u, createElementBlock as p, renderSlot as D, unref as f, createElementVNode as g, createTextVNode as P, toDisplayString as h, createCommentVNode as S, Fragment as F, renderList as N, normalizeClass as L, normalizeStyle as j } from "vue";
2
- import M from "uplot";
3
- import { useElementSize as R, useVModel as C } from "@vueuse/core";
4
- const T = (a) => {
5
- if (typeof a == "object" && a !== null) {
1
+ import { defineComponent as N, ref as D, onMounted as P, watch as v, nextTick as R, openBlock as p, createElementBlock as u, createTextVNode as j, toDisplayString as d, renderSlot as C, unref as m, createElementVNode as y, createCommentVNode as S, Fragment as U, renderList as L, normalizeClass as M, normalizeStyle as T } from "vue";
2
+ import q from "uplot";
3
+ import { useElementSize as G, useVModel as B } from "@vueuse/core";
4
+ const E = (n) => {
5
+ if (typeof n == "object" && n !== null) {
6
6
  if (typeof Object.getPrototypeOf == "function") {
7
- const r = Object.getPrototypeOf(a);
7
+ const r = Object.getPrototypeOf(n);
8
8
  return r === Object.prototype || r === null;
9
9
  }
10
- return Object.prototype.toString.call(a) === "[object Object]";
10
+ return Object.prototype.toString.call(n) === "[object Object]";
11
11
  }
12
12
  return !1;
13
- }, c = (...a) => a.reduce((r, s) => {
14
- if (Array.isArray(s))
13
+ }, c = (...n) => n.reduce((r, a) => {
14
+ if (Array.isArray(a))
15
15
  throw new TypeError(
16
16
  "Arguments provided to ts-deepmerge must be objects, not arrays."
17
17
  );
18
- return s && Object.keys(s).forEach((o) => {
19
- ["__proto__", "constructor", "prototype"].includes(o) || (Array.isArray(r[o]) && Array.isArray(s[o]) ? r[o] = c.options.mergeArrays ? Array.from(new Set(r[o].concat(s[o]))) : s[o] : T(r[o]) && T(s[o]) ? r[o] = c(r[o], s[o]) : r[o] = s[o]);
18
+ return a && Object.keys(a).forEach((o) => {
19
+ ["__proto__", "constructor", "prototype"].includes(o) || (Array.isArray(r[o]) && Array.isArray(a[o]) ? r[o] = c.options.mergeArrays ? Array.from(new Set(r[o].concat(a[o]))) : a[o] : E(r[o]) && E(a[o]) ? r[o] = c(r[o], a[o]) : r[o] = a[o]);
20
20
  }), r;
21
- }, {}), B = {
21
+ }, {}), $ = {
22
22
  mergeArrays: !0
23
23
  };
24
- c.options = B;
25
- c.withOptions = (a, ...r) => {
24
+ c.options = $;
25
+ c.withOptions = (n, ...r) => {
26
26
  c.options = {
27
27
  mergeArrays: !0,
28
- ...a
28
+ ...n
29
29
  };
30
- const s = c(...r);
31
- return c.options = B, s;
30
+ const a = c(...r);
31
+ return c.options = $, a;
32
32
  };
33
- const q = { class: "__uplot-root" }, G = {
33
+ const H = { class: "__uplot-root" }, I = {
34
34
  key: 0,
35
35
  class: "extra-info"
36
- }, H = /* @__PURE__ */ g("br", null, null, -1), I = { style: { "text-align": "left" } }, J = { class: "__uplot-legend" }, K = ["onClick"], Q = {
36
+ }, J = /* @__PURE__ */ y("br", null, null, -1), K = { style: { "text-align": "left" } }, Q = { class: "__uplot-legend" }, W = ["onClick"], X = {
37
37
  key: 1,
38
38
  class: "__uplot-legend-value"
39
- }, W = {
39
+ }, Y = {
40
40
  key: 2,
41
41
  class: "__uplot-legend-value"
42
- }, oe = /* @__PURE__ */ U({
43
- __name: "Uplot",
42
+ }, te = /* @__PURE__ */ N({
43
+ __name: "uplot",
44
44
  props: {
45
- options: null,
46
- data: null,
45
+ options: {},
46
+ data: {},
47
47
  noResetScale: { type: Boolean, default: !1 },
48
48
  showDebug: { type: Boolean, default: !1 },
49
49
  noFooter: { type: Boolean, default: !1 },
50
50
  zoom: { default: () => [null, null] },
51
- series: null
51
+ series: {}
52
52
  },
53
53
  emits: ["select", "cursor", "update:zoom", "update:series"],
54
- setup(a, { expose: r, emit: s }) {
55
- const o = a, v = k(), { width: y, height: w } = R(v), x = C(o, "zoom", s, { passive: !0 }), i = C(o, "series", s, { passive: !0 }), E = {
54
+ setup(n, { expose: r, emit: a }) {
55
+ const o = n, _ = a, b = D(), { width: w, height: x } = G(b), z = B(o, "zoom", _, { passive: !0 }), i = B(o, "series", _, { passive: !0 }), F = {
56
56
  title: void 0,
57
57
  legend: {
58
58
  show: !1
@@ -72,13 +72,13 @@ const q = { class: "__uplot-root" }, G = {
72
72
  ],
73
73
  setCursor: [
74
74
  (e) => {
75
- s("cursor", e.cursor), i.value = e.series.map((l, t) => {
76
- var d, _;
75
+ _("cursor", e.cursor), i.value = e.series.map((l, t) => {
76
+ var f, h;
77
77
  return {
78
78
  label: l.label,
79
79
  stroke: typeof l.stroke == "function" ? l.stroke(e, t) : null,
80
80
  value: e.cursor.idx && e.data[t][e.cursor.idx] ? typeof l.value == "function" ? l.value(e, e.data[t][e.cursor.idx], t, e.cursor.idx) : e.data[t][e.cursor.idx] : null,
81
- data: (d = e.cursor) != null && d.idx ? e.data[t][(_ = e.cursor) == null ? void 0 : _.idx] : null,
81
+ data: (f = e.cursor) != null && f.idx ? e.data[t][(h = e.cursor) == null ? void 0 : h.idx] : null,
82
82
  show: l.show
83
83
  // ...s,
84
84
  };
@@ -87,7 +87,7 @@ const q = { class: "__uplot-root" }, G = {
87
87
  ],
88
88
  setSelect: [
89
89
  (e) => {
90
- s("select", e.select), o.showDebug && console.log("setSelect", e.select), x.value = [
90
+ _("select", e.select), o.showDebug && console.log("setSelect", e.select), z.value = [
91
91
  e.posToVal(e.select.left, "x"),
92
92
  e.posToVal(e.select.left + e.select.width, "x")
93
93
  ];
@@ -95,7 +95,7 @@ const q = { class: "__uplot-root" }, G = {
95
95
  ],
96
96
  setScale: [
97
97
  (e) => {
98
- x.value = [
98
+ o.showDebug && console.log("setScale", e.scales), z.value = [
99
99
  e.scales.x.min || null,
100
100
  e.scales.x.max || null
101
101
  ];
@@ -103,71 +103,74 @@ const q = { class: "__uplot-root" }, G = {
103
103
  ]
104
104
  }
105
105
  };
106
- let n;
107
- const z = k();
108
- function O() {
109
- n && n.destroy(), n = new M({ width: 100, height: 100, ...c(o.options, E) }, o.data, v.value), z.value = n, o.zoom[0] !== null && o.zoom[1] !== null && n.setScale("x", { min: o.zoom[0], max: o.zoom[1] }), setTimeout(() => {
110
- A();
106
+ let s;
107
+ const O = D();
108
+ function A() {
109
+ s && s.destroy(), s = new q({ width: 100, height: 100, ...c(o.options, F) }, o.data, b.value), O.value = s, o.zoom[0] !== null && o.zoom[1] !== null && s.setScale("x", { min: o.zoom[0], max: o.zoom[1] }), setTimeout(() => {
110
+ k();
111
111
  }, 0);
112
112
  }
113
- V(() => {
114
- O();
115
- }), b([y, w], () => {
116
- $(() => {
117
- A();
113
+ P(() => {
114
+ A();
115
+ }), v([w, x], () => {
116
+ R(() => {
117
+ k();
118
118
  });
119
- }), b(o.data, (e) => {
119
+ }), v(o.data, (e) => {
120
120
  if (o.noResetScale) {
121
- n.setData(e);
121
+ s.setData(e, !1), s.redraw(!1);
122
122
  return;
123
123
  }
124
- n.setData(e, !0), n.redraw();
125
- }), b(o.options, (e, l) => {
126
- o.showDebug && console.log("watch options", e, l), O();
124
+ s.setData(e, !0);
125
+ }), v(o.options, (e, l) => {
126
+ o.showDebug && console.log("watch options", e, l), A();
127
+ }), v(() => o.zoom, (e, l) => {
128
+ e[0] !== null && e[1] !== null && (s.scales.x.min !== e[0] || s.scales.x.max !== e[1]) && (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] }));
127
129
  });
128
- function A() {
129
- n.setSize({ width: y.value, height: w.value }), o.showDebug && console.log("resize", n);
130
+ function k() {
131
+ s.setSize({ width: w.value, height: x.value }), o.showDebug && console.log("resize", s);
130
132
  }
131
- function m(e) {
133
+ function g(e) {
132
134
  var l, t;
133
- typeof e == "object" && (e = ((l = i.value) == null ? void 0 : l.indexOf(e)) || -1), n.setSeries(e, { show: !n.series[e].show }), (t = i.value) != null && t[e] && (i.value[e].show = n.series[e].show);
135
+ typeof e == "object" && (e = ((l = i.value) == null ? void 0 : l.indexOf(e)) || -1), s.setSeries(e, { show: !s.series[e].show }), (t = i.value) != null && t[e] && (i.value[e].show = s.series[e].show);
134
136
  }
135
- return r({ toggleShow: m, uplot: z }), (e, l) => (u(), p("div", q, [
136
- D(e.$slots, "header", {
137
- series: f(i),
138
- toggleShow: m
137
+ return r({ toggleShow: g, uplot: O }), (e, l) => (p(), u("div", H, [
138
+ j(" r " + d(e.noResetScale) + " ", 1),
139
+ C(e.$slots, "header", {
140
+ series: m(i),
141
+ toggleShow: g
139
142
  }),
140
- g("div", {
143
+ y("div", {
141
144
  ref_key: "el",
142
- ref: v,
145
+ ref: b,
143
146
  class: "__uplot"
144
147
  }, null, 512),
145
- a.showDebug ? (u(), p("div", G, [
146
- P(h(f(y)) + " x " + h(f(w)) + " ", 1),
147
- H,
148
- g("pre", I, h(f(i)), 1)
148
+ e.showDebug ? (p(), u("div", I, [
149
+ j(d(m(w)) + " x " + d(m(x)) + " ", 1),
150
+ J,
151
+ y("pre", K, d(m(i)), 1)
149
152
  ])) : S("", !0),
150
- a.noFooter ? S("", !0) : D(e.$slots, "footer", {
153
+ e.noFooter ? S("", !0) : C(e.$slots, "footer", {
151
154
  key: 1,
152
- series: f(i),
153
- toggleShow: m
155
+ series: m(i),
156
+ toggleShow: g
154
157
  }, () => [
155
- g("div", J, [
156
- (u(!0), p(F, null, N(f(i), (t, d) => {
157
- var _;
158
- return u(), p("div", {
158
+ y("div", Q, [
159
+ (p(!0), u(U, null, L(m(i), (t, f) => {
160
+ var h;
161
+ return p(), u("div", {
159
162
  key: t.label,
160
- class: L(["__uplot-legend-series", [`__uplot-${(_ = t.label) == null ? void 0 : _.toLowerCase()}`, `__uplot-i-${d}`]]),
161
- style: j({ backgroundColor: t.show ? "" : "lightgrey" }),
162
- onClick: (X) => m(d)
163
+ class: M(["__uplot-legend-series", [`__uplot-${(h = t.label) == null ? void 0 : h.toLowerCase()}`, `__uplot-i-${f}`]]),
164
+ style: T({ backgroundColor: t.show ? "" : "lightgrey" }),
165
+ onClick: (Z) => g(f)
163
166
  }, [
164
- d !== 0 ? (u(), p("span", {
167
+ f !== 0 ? (p(), u("span", {
165
168
  key: 0,
166
- style: j({ color: t.stroke || "black" }),
169
+ style: T({ color: t.stroke || "black" }),
167
170
  class: "__uplot-legend-label"
168
- }, h(t.label), 5)) : S("", !0),
169
- t.value ? (u(), p("span", Q, h(t.value), 1)) : (u(), p("span", W, "--"))
170
- ], 14, K);
171
+ }, d(t.label), 5)) : S("", !0),
172
+ t.value ? (p(), u("span", X, d(t.value), 1)) : (p(), u("span", Y, "--"))
173
+ ], 14, W);
171
174
  }), 128))
172
175
  ])
173
176
  ])
@@ -175,5 +178,5 @@ const q = { class: "__uplot-root" }, G = {
175
178
  }
176
179
  });
177
180
  export {
178
- oe as Uplot
181
+ te as Uplot
179
182
  };
package/dist/index.umd.js CHANGED
@@ -1 +1 @@
1
- (function(i,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("uplot"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","uplot","@vueuse/core"],e):(i=typeof globalThis<"u"?globalThis:i||self,e(i["change-name"]={},i.vue,i.Uplot,i.core))})(this,function(i,e,z,h){"use strict";const U="",w=c=>{if(typeof c=="object"&&c!==null){if(typeof Object.getPrototypeOf=="function"){const r=Object.getPrototypeOf(c);return r===Object.prototype||r===null}return Object.prototype.toString.call(c)==="[object Object]"}return!1},d=(...c)=>c.reduce((r,n)=>{if(Array.isArray(n))throw new TypeError("Arguments provided to ts-deepmerge must be objects, not arrays.");return n&&Object.keys(n).forEach(o=>{["__proto__","constructor","prototype"].includes(o)||(Array.isArray(r[o])&&Array.isArray(n[o])?r[o]=d.options.mergeArrays?Array.from(new Set(r[o].concat(n[o]))):n[o]:w(r[o])&&w(n[o])?r[o]=d(r[o],n[o]):r[o]=n[o])}),r},{}),b={mergeArrays:!0};d.options=b,d.withOptions=(c,...r)=>{d.options={mergeArrays:!0,...c};const n=d(...r);return d.options=b,n};const E={class:"__uplot-root"},O={key:0,class:"extra-info"},D=e.createElementVNode("br",null,null,-1),A={style:{"text-align":"left"}},V={class:"__uplot-legend"},j=["onClick"],C={key:1,class:"__uplot-legend-value"},T={key:2,class:"__uplot-legend-value"},N=e.defineComponent({__name:"Uplot",props:{options:null,data:null,noResetScale:{type:Boolean,default:!1},showDebug:{type:Boolean,default:!1},noFooter:{type:Boolean,default:!1},zoom:{default:()=>[null,null]},series:null},emits:["select","cursor","update:zoom","update:series"],setup(c,{expose:r,emit:n}){const o=c,_=e.ref(),{width:g,height:y}=h.useElementSize(_),S=h.useVModel(o,"zoom",n,{passive:!0}),p=h.useVModel(o,"series",n,{passive:!0}),P={title:void 0,legend:{show:!1},hooks:{init:[t=>{o.showDebug&&console.log("init",t),p.value=t.series.map((s,l)=>({label:s.label,stroke:typeof s.stroke=="function"?s.stroke(t,l):null,value:null,data:null,show:s.show}))}],setCursor:[t=>{n("cursor",t.cursor),p.value=t.series.map((s,l)=>{var f,u;return{label:s.label,stroke:typeof s.stroke=="function"?s.stroke(t,l):null,value:t.cursor.idx&&t.data[l][t.cursor.idx]?typeof s.value=="function"?s.value(t,t.data[l][t.cursor.idx],l,t.cursor.idx):t.data[l][t.cursor.idx]:null,data:(f=t.cursor)!=null&&f.idx?t.data[l][(u=t.cursor)==null?void 0:u.idx]:null,show:s.show}})}],setSelect:[t=>{n("select",t.select),o.showDebug&&console.log("setSelect",t.select),S.value=[t.posToVal(t.select.left,"x"),t.posToVal(t.select.left+t.select.width,"x")]}],setScale:[t=>{S.value=[t.scales.x.min||null,t.scales.x.max||null]}]}};let a;const k=e.ref();function B(){a&&a.destroy(),a=new z({width:100,height:100,...d(o.options,P)},o.data,_.value),k.value=a,o.zoom[0]!==null&&o.zoom[1]!==null&&a.setScale("x",{min:o.zoom[0],max:o.zoom[1]}),setTimeout(()=>{x()},0)}e.onMounted(()=>{B()}),e.watch([g,y],()=>{e.nextTick(()=>{x()})}),e.watch(o.data,t=>{if(o.noResetScale){a.setData(t);return}a.setData(t,!0),a.redraw()}),e.watch(o.options,(t,s)=>{o.showDebug&&console.log("watch options",t,s),B()});function x(){a.setSize({width:g.value,height:y.value}),o.showDebug&&console.log("resize",a)}function m(t){var s,l;typeof t=="object"&&(t=((s=p.value)==null?void 0:s.indexOf(t))||-1),a.setSeries(t,{show:!a.series[t].show}),(l=p.value)!=null&&l[t]&&(p.value[t].show=a.series[t].show)}return r({toggleShow:m,uplot:k}),(t,s)=>(e.openBlock(),e.createElementBlock("div",E,[e.renderSlot(t.$slots,"header",{series:e.unref(p),toggleShow:m}),e.createElementVNode("div",{ref_key:"el",ref:_,class:"__uplot"},null,512),c.showDebug?(e.openBlock(),e.createElementBlock("div",O,[e.createTextVNode(e.toDisplayString(e.unref(g))+" x "+e.toDisplayString(e.unref(y))+" ",1),D,e.createElementVNode("pre",A,e.toDisplayString(e.unref(p)),1)])):e.createCommentVNode("",!0),c.noFooter?e.createCommentVNode("",!0):e.renderSlot(t.$slots,"footer",{key:1,series:e.unref(p),toggleShow:m},()=>[e.createElementVNode("div",V,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(p),(l,f)=>{var u;return e.openBlock(),e.createElementBlock("div",{key:l.label,class:e.normalizeClass(["__uplot-legend-series",[`__uplot-${(u=l.label)==null?void 0:u.toLowerCase()}`,`__uplot-i-${f}`]]),style:e.normalizeStyle({backgroundColor:l.show?"":"lightgrey"}),onClick:M=>m(f)},[f!==0?(e.openBlock(),e.createElementBlock("span",{key:0,style:e.normalizeStyle({color:l.stroke||"black"}),class:"__uplot-legend-label"},e.toDisplayString(l.label),5)):e.createCommentVNode("",!0),l.value?(e.openBlock(),e.createElementBlock("span",C,e.toDisplayString(l.value),1)):(e.openBlock(),e.createElementBlock("span",T,"--"))],14,j)}),128))])])]))}}),$="";i.Uplot=N,Object.defineProperty(i,Symbol.toStringTag,{value:"Module"})});
1
+ (function(i,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("vue"),require("uplot"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","uplot","@vueuse/core"],o):(i=typeof globalThis<"u"?globalThis:i||self,o(i["change-name"]={},i.vue,i.Uplot,i.core))})(this,function(i,o,D,g){"use strict";const b=c=>{if(typeof c=="object"&&c!==null){if(typeof Object.getPrototypeOf=="function"){const r=Object.getPrototypeOf(c);return r===Object.prototype||r===null}return Object.prototype.toString.call(c)==="[object Object]"}return!1},d=(...c)=>c.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]:b(r[t])&&b(a[t])?r[t]=d(r[t],a[t]):r[t]=a[t])}),r},{}),w={mergeArrays:!0};d.options=w,d.withOptions=(c,...r)=>{d.options={mergeArrays:!0,...c};const a=d(...r);return d.options=w,a};const E={class:"__uplot-root"},O={key:0,class:"extra-info"},A=o.createElementVNode("br",null,null,-1),j={style:{"text-align":"left"}},C={class:"__uplot-legend"},T=["onClick"],N={key:1,class:"__uplot-legend-value"},V={key:2,class:"__uplot-legend-value"},$=o.defineComponent({__name:"uplot",props:{options:{},data:{},noResetScale:{type:Boolean,default:!1},showDebug:{type:Boolean,default:!1},noFooter:{type:Boolean,default:!1},zoom:{default:()=>[null,null]},series:{}},emits:["select","cursor","update:zoom","update:series"],setup(c,{expose:r,emit:a}){const t=c,h=a,_=o.ref(),{width:y,height:S}=g.useElementSize(_),k=g.useVModel(t,"zoom",h,{passive:!0}),p=g.useVModel(t,"series",h,{passive:!0}),M={title:void 0,legend:{show:!1},hooks:{init:[e=>{t.showDebug&&console.log("init",e),p.value=e.series.map((n,l)=>({label:n.label,stroke:typeof n.stroke=="function"?n.stroke(e,l):null,value:null,data:null,show:n.show}))}],setCursor:[e=>{h("cursor",e.cursor),p.value=e.series.map((n,l)=>{var f,m;return{label:n.label,stroke:typeof n.stroke=="function"?n.stroke(e,l):null,value:e.cursor.idx&&e.data[l][e.cursor.idx]?typeof n.value=="function"?n.value(e,e.data[l][e.cursor.idx],l,e.cursor.idx):e.data[l][e.cursor.idx]:null,data:(f=e.cursor)!=null&&f.idx?e.data[l][(m=e.cursor)==null?void 0:m.idx]:null,show:n.show}})}],setSelect:[e=>{h("select",e.select),t.showDebug&&console.log("setSelect",e.select),k.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),k.value=[e.scales.x.min||null,e.scales.x.max||null]}]}};let s;const x=o.ref();function z(){s&&s.destroy(),s=new D({width:100,height:100,...d(t.options,M)},t.data,_.value),x.value=s,t.zoom[0]!==null&&t.zoom[1]!==null&&s.setScale("x",{min:t.zoom[0],max:t.zoom[1]}),setTimeout(()=>{B()},0)}o.onMounted(()=>{z()}),o.watch([y,S],()=>{o.nextTick(()=>{B()})}),o.watch(t.data,e=>{if(t.noResetScale){s.setData(e,!1),s.redraw(!1);return}s.setData(e,!0)}),o.watch(t.options,(e,n)=>{t.showDebug&&console.log("watch options",e,n),z()}),o.watch(()=>t.zoom,(e,n)=>{e[0]!==null&&e[1]!==null&&(s.scales.x.min!==e[0]||s.scales.x.max!==e[1])&&(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 B(){s.setSize({width:y.value,height:S.value}),t.showDebug&&console.log("resize",s)}function u(e){var n,l;typeof e=="object"&&(e=((n=p.value)==null?void 0:n.indexOf(e))||-1),s.setSeries(e,{show:!s.series[e].show}),(l=p.value)!=null&&l[e]&&(p.value[e].show=s.series[e].show)}return r({toggleShow:u,uplot:x}),(e,n)=>(o.openBlock(),o.createElementBlock("div",E,[o.createTextVNode(" r "+o.toDisplayString(e.noResetScale)+" ",1),o.renderSlot(e.$slots,"header",{series:o.unref(p),toggleShow:u}),o.createElementVNode("div",{ref_key:"el",ref:_,class:"__uplot"},null,512),e.showDebug?(o.openBlock(),o.createElementBlock("div",O,[o.createTextVNode(o.toDisplayString(o.unref(y))+" x "+o.toDisplayString(o.unref(S))+" ",1),A,o.createElementVNode("pre",j,o.toDisplayString(o.unref(p)),1)])):o.createCommentVNode("",!0),e.noFooter?o.createCommentVNode("",!0):o.renderSlot(e.$slots,"footer",{key:1,series:o.unref(p),toggleShow:u},()=>[o.createElementVNode("div",C,[(o.openBlock(!0),o.createElementBlock(o.Fragment,null,o.renderList(o.unref(p),(l,f)=>{var m;return o.openBlock(),o.createElementBlock("div",{key:l.label,class:o.normalizeClass(["__uplot-legend-series",[`__uplot-${(m=l.label)==null?void 0:m.toLowerCase()}`,`__uplot-i-${f}`]]),style:o.normalizeStyle({backgroundColor:l.show?"":"lightgrey"}),onClick:P=>u(f)},[f!==0?(o.openBlock(),o.createElementBlock("span",{key:0,style:o.normalizeStyle({color:l.stroke||"black"}),class:"__uplot-legend-label"},o.toDisplayString(l.label),5)):o.createCommentVNode("",!0),l.value?(o.openBlock(),o.createElementBlock("span",N,o.toDisplayString(l.value),1)):(o.openBlock(),o.createElementBlock("span",V,"--"))],14,T)}),128))])])]))}});i.Uplot=$,Object.defineProperty(i,Symbol.toStringTag,{value:"Module"})});
@@ -0,0 +1,99 @@
1
+ import Uplot from 'uplot';
2
+ export type Options = Omit<Uplot.Options, 'height' | 'width'>;
3
+ export type AlignedData = Uplot.AlignedData;
4
+ export interface Series {
5
+ label: string | undefined;
6
+ stroke: string | null;
7
+ value: number | string | null | undefined;
8
+ data: number | null | undefined;
9
+ show: boolean | undefined;
10
+ }
11
+ export type Cursor = Uplot.Cursor;
12
+ export type Select = Uplot.Select;
13
+ export interface UplotElement extends Partial<HTMLElement> {
14
+ toggleShow: (serie: Series | number) => void;
15
+ uplot: Uplot;
16
+ }
17
+ interface UplotProps {
18
+ options: Options;
19
+ data: Uplot.AlignedData;
20
+ noResetScale?: boolean;
21
+ showDebug?: boolean;
22
+ noFooter?: boolean;
23
+ zoom?: number[] | null[];
24
+ series?: Series[];
25
+ }
26
+ declare function toggleShow(idx: number | Series): void;
27
+ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<UplotProps>, {
28
+ noResetScale: boolean;
29
+ showDebug: boolean;
30
+ noFooter: boolean;
31
+ zoom: () => null[];
32
+ }>, {
33
+ toggleShow: typeof toggleShow;
34
+ uplot: import("vue").Ref<any>;
35
+ }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
36
+ select: (select: Uplot.Select) => void;
37
+ cursor: (cursor: Uplot.Cursor) => void;
38
+ "update:zoom": (zoom: number[]) => void;
39
+ "update:series": (series: Series[]) => void;
40
+ }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<UplotProps>, {
41
+ noResetScale: boolean;
42
+ showDebug: boolean;
43
+ noFooter: boolean;
44
+ zoom: () => null[];
45
+ }>>> & {
46
+ onSelect?: ((select: Uplot.Select) => any) | undefined;
47
+ onCursor?: ((cursor: Uplot.Cursor) => any) | undefined;
48
+ "onUpdate:zoom"?: ((zoom: number[]) => any) | undefined;
49
+ "onUpdate:series"?: ((series: Series[]) => any) | undefined;
50
+ }, {
51
+ noResetScale: boolean;
52
+ showDebug: boolean;
53
+ noFooter: boolean;
54
+ zoom: number[] | null[];
55
+ }, {}>, {
56
+ header?(_: {
57
+ series: {
58
+ label: string | undefined;
59
+ stroke: string | null;
60
+ value: string | number | null | undefined;
61
+ data: number | null | undefined;
62
+ show: boolean | undefined;
63
+ }[] | undefined;
64
+ toggleShow: typeof toggleShow;
65
+ }): any;
66
+ footer?(_: {
67
+ series: {
68
+ label: string | undefined;
69
+ stroke: string | null;
70
+ value: string | number | null | undefined;
71
+ data: number | null | undefined;
72
+ show: boolean | undefined;
73
+ }[] | undefined;
74
+ toggleShow: typeof toggleShow;
75
+ }): any;
76
+ }>;
77
+ export default _default;
78
+ type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
79
+ type __VLS_TypePropsToRuntimeProps<T> = {
80
+ [K in keyof T]-?: {} extends Pick<T, K> ? {
81
+ type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
82
+ } : {
83
+ type: import('vue').PropType<T[K]>;
84
+ required: true;
85
+ };
86
+ };
87
+ type __VLS_WithDefaults<P, D> = {
88
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
89
+ default: D[K];
90
+ }> : P[K];
91
+ };
92
+ type __VLS_Prettify<T> = {
93
+ [K in keyof T]: T[K];
94
+ } & {};
95
+ type __VLS_WithTemplateSlots<T, S> = T & {
96
+ new (): {
97
+ $slots: S;
98
+ };
99
+ };
@@ -0,0 +1 @@
1
+ export {};
package/dist/style.css CHANGED
@@ -1 +1 @@
1
- .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;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:rgba(0,0,0,.07);position:absolute;pointer-events:none}.u-cursor-x,.u-cursor-y{position:absolute;left:0;top:0;pointer-events:none;will-change:transform;z-index:100}.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;z-index:100;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;top:0;left:0;right:0;bottom: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}
1
+ .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;top:0;left:0;right:0;bottom: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}
@@ -0,0 +1 @@
1
+ export {};
File without changes
@@ -0,0 +1,2 @@
1
+ declare const _default: import("vite").UserConfig;
2
+ export default _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flowtools/uplot",
3
- "version": "0.0.6",
3
+ "version": "0.0.8",
4
4
  "description": "Modern vue component for uplot",
5
5
  "keywords": [
6
6
  "add keywords"
@@ -38,21 +38,21 @@
38
38
  "vue": "=>3.2.47"
39
39
  },
40
40
  "devDependencies": {
41
- "@antfu/eslint-config": "^0.36.0",
42
- "@vitejs/plugin-vue": "^4.1.0",
43
- "@vitest/coverage-c8": "^0.29.3",
44
- "@vue/test-utils": "^2.3.1",
45
- "@vueuse/core": "^9.13.0",
46
- "bumpp": "^9.0.0",
47
- "eslint": "^8.36.0",
48
- "jsdom": "^21.1.1",
49
- "typescript": "^5.0.2",
50
- "uplot": "^1.6.24",
41
+ "@antfu/eslint-config": "^2.6.3",
42
+ "@vitejs/plugin-vue": "^5.0.3",
43
+ "@vitest/coverage-c8": "^0.33.0",
44
+ "@vue/test-utils": "^2.4.3",
45
+ "@vueuse/core": "^10.7.2",
46
+ "bumpp": "^9.3.0",
47
+ "eslint": "^8.56.0",
48
+ "jsdom": "^24.0.0",
49
+ "typescript": "^5.3.3",
50
+ "uplot": "^1.6.28",
51
51
  "vi-canvas-mock": "^1.0.0",
52
- "vite": "^4.2.0",
53
- "vite-plugin-dts": "^2.1.0",
54
- "vitest": "^0.29.3",
55
- "vue": "^3.2.47"
52
+ "vite": "^5.0.12",
53
+ "vite-plugin-dts": "^3.7.1",
54
+ "vitest": "^1.2.1",
55
+ "vue": "^3.4.15"
56
56
  },
57
57
  "publishConfig": {
58
58
  "access": "public"
File without changes
File without changes