@flowtools/uplot 0.0.11 → 0.0.13
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/README.md +1 -1
- package/dist/index.es.js +90 -94
- package/dist/index.umd.js +1 -1
- package/dist/src/App.vue.d.ts +104 -0
- package/dist/src/components/uplot.vue.d.ts +41 -65
- package/dist/{style.css → uplot.css} +1 -1
- package/dist/vite.config.d.ts +1 -1
- package/package.json +21 -21
package/README.md
CHANGED
|
@@ -14,9 +14,9 @@ pnpm add @flowtools/uplot uplot @vueuse/core
|
|
|
14
14
|
|
|
15
15
|
```vue
|
|
16
16
|
<script setup lang="ts">
|
|
17
|
-
import { ref } from 'vue'
|
|
18
17
|
import type { AlignedData, Options } from '@flowtools/uplot'
|
|
19
18
|
import { Uplot } from '@flowtools/uplot'
|
|
19
|
+
import { ref } from 'vue'
|
|
20
20
|
|
|
21
21
|
const options = ref<Options>({
|
|
22
22
|
series: [
|
package/dist/index.es.js
CHANGED
|
@@ -1,62 +1,65 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
function
|
|
1
|
+
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";
|
|
2
|
+
import { useElementSize as G } from "@vueuse/core";
|
|
3
|
+
import H from "uplot";
|
|
4
|
+
function T(n) {
|
|
5
5
|
if (typeof n == "object" && n !== null) {
|
|
6
6
|
if (typeof Object.getPrototypeOf == "function") {
|
|
7
|
-
const
|
|
8
|
-
return
|
|
7
|
+
const a = Object.getPrototypeOf(n);
|
|
8
|
+
return a === Object.prototype || a === null;
|
|
9
9
|
}
|
|
10
10
|
return Object.prototype.toString.call(n) === "[object Object]";
|
|
11
11
|
}
|
|
12
12
|
return !1;
|
|
13
13
|
}
|
|
14
|
-
function
|
|
15
|
-
return n.reduce((
|
|
16
|
-
if (Array.isArray(
|
|
14
|
+
function u(...n) {
|
|
15
|
+
return n.reduce((a, r) => {
|
|
16
|
+
if (Array.isArray(r))
|
|
17
17
|
throw new TypeError(
|
|
18
18
|
"Arguments provided to ts-deepmerge must be objects, not arrays."
|
|
19
19
|
);
|
|
20
|
-
return
|
|
21
|
-
["__proto__", "constructor", "prototype"].includes(o) || (Array.isArray(
|
|
22
|
-
}),
|
|
20
|
+
return r && Object.keys(r).forEach((o) => {
|
|
21
|
+
["__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]);
|
|
22
|
+
}), a;
|
|
23
23
|
}, {});
|
|
24
24
|
}
|
|
25
|
-
const
|
|
25
|
+
const B = {
|
|
26
26
|
mergeArrays: !0
|
|
27
27
|
};
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
28
|
+
u.options = B;
|
|
29
|
+
u.withOptions = (n, ...a) => {
|
|
30
|
+
u.options = {
|
|
31
31
|
mergeArrays: !0,
|
|
32
32
|
...n
|
|
33
33
|
};
|
|
34
|
-
const
|
|
35
|
-
return
|
|
34
|
+
const r = u(...a);
|
|
35
|
+
return u.options = B, r;
|
|
36
36
|
};
|
|
37
|
-
const
|
|
37
|
+
const I = { class: "__uplot-root" }, J = {
|
|
38
38
|
key: 0,
|
|
39
39
|
class: "extra-info"
|
|
40
|
-
},
|
|
40
|
+
}, K = { style: { "text-align": "left" } }, Q = { class: "__uplot-legend" }, W = ["onClick"], X = {
|
|
41
41
|
key: 1,
|
|
42
42
|
class: "__uplot-legend-value"
|
|
43
43
|
}, Y = {
|
|
44
44
|
key: 2,
|
|
45
45
|
class: "__uplot-legend-value"
|
|
46
|
-
}, te = /* @__PURE__ */
|
|
46
|
+
}, te = /* @__PURE__ */ M({
|
|
47
47
|
__name: "uplot",
|
|
48
|
-
props: {
|
|
48
|
+
props: /* @__PURE__ */ A({
|
|
49
49
|
options: {},
|
|
50
50
|
data: {},
|
|
51
51
|
noResetScale: { type: Boolean, default: !1 },
|
|
52
52
|
showDebug: { type: Boolean, default: !1 },
|
|
53
|
-
noFooter: { type: Boolean, default: !1 }
|
|
53
|
+
noFooter: { type: Boolean, default: !1 }
|
|
54
|
+
}, {
|
|
54
55
|
zoom: { default: () => [null, null] },
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
56
|
+
zoomModifiers: {},
|
|
57
|
+
series: { default: () => [] },
|
|
58
|
+
seriesModifiers: {}
|
|
59
|
+
}),
|
|
60
|
+
emits: /* @__PURE__ */ A(["select", "cursor"], ["update:zoom", "update:series"]),
|
|
61
|
+
setup(n, { expose: a, emit: r }) {
|
|
62
|
+
const o = n, x = r, v = $("el"), { width: _, height: y } = G(v), c = D(n, "zoom"), i = D(n, "series"), E = {
|
|
60
63
|
title: void 0,
|
|
61
64
|
legend: {
|
|
62
65
|
show: !1
|
|
@@ -64,9 +67,9 @@ const H = { class: "__uplot-root" }, I = {
|
|
|
64
67
|
hooks: {
|
|
65
68
|
init: [
|
|
66
69
|
(e) => {
|
|
67
|
-
o.showDebug && console.log("init", e), i.value = e.series.map((l,
|
|
70
|
+
o.showDebug && console.log("init", e), i.value = e.series.map((l, s) => ({
|
|
68
71
|
label: l.label,
|
|
69
|
-
stroke: typeof l.stroke == "function" ? l.stroke(e,
|
|
72
|
+
stroke: typeof l.stroke == "function" ? l.stroke(e, s) : null,
|
|
70
73
|
value: null,
|
|
71
74
|
data: null,
|
|
72
75
|
show: l.show
|
|
@@ -76,22 +79,19 @@ const H = { class: "__uplot-root" }, I = {
|
|
|
76
79
|
],
|
|
77
80
|
setCursor: [
|
|
78
81
|
(e) => {
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
// ...s,
|
|
88
|
-
};
|
|
89
|
-
});
|
|
82
|
+
x("cursor", e.cursor), i.value = e.series.map((l, s) => ({
|
|
83
|
+
label: l.label,
|
|
84
|
+
stroke: typeof l.stroke == "function" ? l.stroke(e, s) : null,
|
|
85
|
+
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,
|
|
86
|
+
data: e.cursor?.idx ? e.data[s][e.cursor?.idx] : null,
|
|
87
|
+
show: l.show
|
|
88
|
+
// ...s,
|
|
89
|
+
}));
|
|
90
90
|
}
|
|
91
91
|
],
|
|
92
92
|
setSelect: [
|
|
93
93
|
(e) => {
|
|
94
|
-
|
|
94
|
+
x("select", e.select), o.showDebug && console.log("setSelect", e.select), c.value = [
|
|
95
95
|
e.posToVal(e.select.left, "x"),
|
|
96
96
|
e.posToVal(e.select.left + e.select.width, "x")
|
|
97
97
|
];
|
|
@@ -99,7 +99,7 @@ const H = { class: "__uplot-root" }, I = {
|
|
|
99
99
|
],
|
|
100
100
|
setScale: [
|
|
101
101
|
(e) => {
|
|
102
|
-
o.showDebug && console.log("setScale", e.scales),
|
|
102
|
+
o.showDebug && console.log("setScale", e.scales), c.value = [
|
|
103
103
|
e.scales.x.min || null,
|
|
104
104
|
e.scales.x.max || null
|
|
105
105
|
];
|
|
@@ -107,74 +107,70 @@ const H = { class: "__uplot-root" }, I = {
|
|
|
107
107
|
]
|
|
108
108
|
}
|
|
109
109
|
};
|
|
110
|
-
let
|
|
111
|
-
const
|
|
112
|
-
function
|
|
113
|
-
|
|
114
|
-
|
|
110
|
+
let t;
|
|
111
|
+
const S = F();
|
|
112
|
+
function O() {
|
|
113
|
+
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(() => {
|
|
114
|
+
z();
|
|
115
115
|
}, 0);
|
|
116
116
|
}
|
|
117
117
|
N(() => {
|
|
118
|
-
|
|
119
|
-
}),
|
|
118
|
+
O();
|
|
119
|
+
}), h([_, y], () => {
|
|
120
120
|
P(() => {
|
|
121
|
-
|
|
121
|
+
z();
|
|
122
122
|
});
|
|
123
|
-
}),
|
|
123
|
+
}), h(o.data, (e) => {
|
|
124
124
|
if (o.noResetScale) {
|
|
125
|
-
|
|
125
|
+
t.setData(e, !1), t.redraw(!1);
|
|
126
126
|
return;
|
|
127
127
|
}
|
|
128
|
-
|
|
129
|
-
}),
|
|
130
|
-
o.showDebug && console.log("watch options", e, l),
|
|
131
|
-
}),
|
|
132
|
-
e[0] !== null && e[1] !== null && (
|
|
128
|
+
t.setData(e, !0);
|
|
129
|
+
}), h(o.options, (e, l) => {
|
|
130
|
+
o.showDebug && console.log("watch options", e, l), O();
|
|
131
|
+
}), h(() => c.value, (e) => {
|
|
132
|
+
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] }));
|
|
133
133
|
});
|
|
134
|
-
function
|
|
135
|
-
|
|
134
|
+
function z() {
|
|
135
|
+
t.setSize({ width: _.value, height: y.value }), o.showDebug && console.log("resize", t);
|
|
136
136
|
}
|
|
137
|
-
function
|
|
138
|
-
|
|
139
|
-
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);
|
|
137
|
+
function m(e) {
|
|
138
|
+
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);
|
|
140
139
|
}
|
|
141
|
-
return
|
|
142
|
-
|
|
143
|
-
series:
|
|
144
|
-
toggleShow:
|
|
140
|
+
return a({ toggleShow: m, uplot: S }), (e, l) => (p(), f("div", I, [
|
|
141
|
+
k(e.$slots, "header", {
|
|
142
|
+
series: i.value,
|
|
143
|
+
toggleShow: m
|
|
145
144
|
}),
|
|
146
|
-
|
|
145
|
+
g("div", {
|
|
147
146
|
ref_key: "el",
|
|
148
|
-
ref:
|
|
147
|
+
ref: v,
|
|
149
148
|
class: "__uplot"
|
|
150
149
|
}, null, 512),
|
|
151
|
-
e.showDebug ? (p(),
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
])) :
|
|
156
|
-
e.noFooter ?
|
|
150
|
+
e.showDebug ? (p(), f("div", J, [
|
|
151
|
+
R(d(j(_)) + " x " + d(j(y)) + " ", 1),
|
|
152
|
+
l[0] || (l[0] = g("br", null, null, -1)),
|
|
153
|
+
g("pre", K, d(i.value), 1)
|
|
154
|
+
])) : w("", !0),
|
|
155
|
+
e.noFooter ? w("", !0) : k(e.$slots, "footer", {
|
|
157
156
|
key: 1,
|
|
158
|
-
series:
|
|
159
|
-
toggleShow:
|
|
157
|
+
series: i.value,
|
|
158
|
+
toggleShow: m
|
|
160
159
|
}, () => [
|
|
161
|
-
|
|
162
|
-
(p(!0),
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
t.value ? (p(), u("span", X, h(t.value), 1)) : (p(), u("span", Y, "--"))
|
|
176
|
-
], 14, W);
|
|
177
|
-
}), 128))
|
|
160
|
+
g("div", Q, [
|
|
161
|
+
(p(!0), f(U, null, L(i.value, (s, b) => (p(), f("div", {
|
|
162
|
+
key: s.label,
|
|
163
|
+
class: q(["__uplot-legend-series", [`__uplot-${s.label?.toLowerCase()}`, `__uplot-i-${b}`]]),
|
|
164
|
+
style: C({ backgroundColor: s.show ? "" : "lightgrey" }),
|
|
165
|
+
onClick: (Z) => m(b)
|
|
166
|
+
}, [
|
|
167
|
+
b !== 0 ? (p(), f("span", {
|
|
168
|
+
key: 0,
|
|
169
|
+
style: C({ color: s.stroke || "black" }),
|
|
170
|
+
class: "__uplot-legend-label"
|
|
171
|
+
}, d(s.label), 5)) : w("", !0),
|
|
172
|
+
s.value ? (p(), f("span", X, d(s.value), 1)) : (p(), f("span", Y, "--"))
|
|
173
|
+
], 14, W))), 128))
|
|
178
174
|
])
|
|
179
175
|
])
|
|
180
176
|
]));
|
package/dist/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(
|
|
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"})});
|
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
import { Options, Series } from './components/uplot.vue';
|
|
2
|
+
declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
|
|
3
|
+
thePlot: ({
|
|
4
|
+
$: import('vue').ComponentInternalInstance;
|
|
5
|
+
$data: {};
|
|
6
|
+
$props: {
|
|
7
|
+
readonly zoom?: number[] | null[] | undefined;
|
|
8
|
+
readonly series?: Series[] | undefined;
|
|
9
|
+
readonly options: Options;
|
|
10
|
+
readonly data: import('uplot').AlignedData;
|
|
11
|
+
readonly noResetScale?: boolean | undefined;
|
|
12
|
+
readonly showDebug?: boolean | undefined;
|
|
13
|
+
readonly noFooter?: boolean | undefined;
|
|
14
|
+
readonly onSelect?: ((select: import('uplot').Select) => any) | undefined;
|
|
15
|
+
readonly onCursor?: ((cursor: import('uplot').Cursor) => any) | undefined;
|
|
16
|
+
readonly "onUpdate:zoom"?: ((value: number[] | null[]) => any) | undefined;
|
|
17
|
+
readonly "onUpdate:series"?: ((value: Series[]) => any) | undefined;
|
|
18
|
+
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
|
|
19
|
+
$attrs: {
|
|
20
|
+
[x: string]: unknown;
|
|
21
|
+
};
|
|
22
|
+
$refs: {
|
|
23
|
+
[x: string]: unknown;
|
|
24
|
+
} & {
|
|
25
|
+
el: HTMLDivElement;
|
|
26
|
+
};
|
|
27
|
+
$slots: Readonly<{
|
|
28
|
+
[name: string]: import('vue').Slot<any> | undefined;
|
|
29
|
+
}>;
|
|
30
|
+
$root: import('vue').ComponentPublicInstance | null;
|
|
31
|
+
$parent: import('vue').ComponentPublicInstance | null;
|
|
32
|
+
$host: Element | null;
|
|
33
|
+
$emit: ((event: "select", select: import('uplot').Select) => void) & ((event: "cursor", cursor: import('uplot').Cursor) => void) & ((event: "update:zoom", value: number[] | null[]) => void) & ((event: "update:series", value: Series[]) => void);
|
|
34
|
+
$el: HTMLDivElement;
|
|
35
|
+
$options: import('vue').ComponentOptionsBase<Readonly<{
|
|
36
|
+
zoom?: number[] | null[];
|
|
37
|
+
series?: Series[];
|
|
38
|
+
} & import('./components/uplot.vue').UplotProps> & Readonly<{
|
|
39
|
+
onSelect?: ((select: import('uplot').Select) => any) | undefined;
|
|
40
|
+
onCursor?: ((cursor: import('uplot').Cursor) => any) | undefined;
|
|
41
|
+
"onUpdate:zoom"?: ((value: number[] | null[]) => any) | undefined;
|
|
42
|
+
"onUpdate:series"?: ((value: Series[]) => any) | undefined;
|
|
43
|
+
}>, {
|
|
44
|
+
toggleShow: (idx: number | Series) => void;
|
|
45
|
+
uplot: import('vue').Ref<any, any>;
|
|
46
|
+
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
47
|
+
"update:zoom": (value: number[] | null[]) => any;
|
|
48
|
+
"update:series": (value: Series[]) => any;
|
|
49
|
+
} & {
|
|
50
|
+
select: (select: import('uplot').Select) => any;
|
|
51
|
+
cursor: (cursor: import('uplot').Cursor) => any;
|
|
52
|
+
}, string, {
|
|
53
|
+
noResetScale: boolean;
|
|
54
|
+
showDebug: boolean;
|
|
55
|
+
noFooter: boolean;
|
|
56
|
+
}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
|
|
57
|
+
beforeCreate?: (() => void) | (() => void)[];
|
|
58
|
+
created?: (() => void) | (() => void)[];
|
|
59
|
+
beforeMount?: (() => void) | (() => void)[];
|
|
60
|
+
mounted?: (() => void) | (() => void)[];
|
|
61
|
+
beforeUpdate?: (() => void) | (() => void)[];
|
|
62
|
+
updated?: (() => void) | (() => void)[];
|
|
63
|
+
activated?: (() => void) | (() => void)[];
|
|
64
|
+
deactivated?: (() => void) | (() => void)[];
|
|
65
|
+
beforeDestroy?: (() => void) | (() => void)[];
|
|
66
|
+
beforeUnmount?: (() => void) | (() => void)[];
|
|
67
|
+
destroyed?: (() => void) | (() => void)[];
|
|
68
|
+
unmounted?: (() => void) | (() => void)[];
|
|
69
|
+
renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
|
|
70
|
+
renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
|
|
71
|
+
errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
|
|
72
|
+
};
|
|
73
|
+
$forceUpdate: () => void;
|
|
74
|
+
$nextTick: typeof import('vue').nextTick;
|
|
75
|
+
$watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
|
|
76
|
+
} & Readonly<{
|
|
77
|
+
noResetScale: boolean;
|
|
78
|
+
showDebug: boolean;
|
|
79
|
+
noFooter: boolean;
|
|
80
|
+
}> & Omit<Readonly<{
|
|
81
|
+
zoom?: number[] | null[];
|
|
82
|
+
series?: Series[];
|
|
83
|
+
} & import('./components/uplot.vue').UplotProps> & Readonly<{
|
|
84
|
+
onSelect?: ((select: import('uplot').Select) => any) | undefined;
|
|
85
|
+
onCursor?: ((cursor: import('uplot').Cursor) => any) | undefined;
|
|
86
|
+
"onUpdate:zoom"?: ((value: number[] | null[]) => any) | undefined;
|
|
87
|
+
"onUpdate:series"?: ((value: Series[]) => any) | undefined;
|
|
88
|
+
}>, "toggleShow" | "uplot" | ("noResetScale" | "showDebug" | "noFooter")> & import('vue').ShallowUnwrapRef<{
|
|
89
|
+
toggleShow: (idx: number | Series) => void;
|
|
90
|
+
uplot: import('vue').Ref<any, any>;
|
|
91
|
+
}> & {} & import('vue').ComponentCustomProperties & {} & {
|
|
92
|
+
$slots: {
|
|
93
|
+
header?(_: {
|
|
94
|
+
series: Series[];
|
|
95
|
+
toggleShow: (idx: number | Series) => void;
|
|
96
|
+
}): any;
|
|
97
|
+
footer?(_: {
|
|
98
|
+
series: Series[];
|
|
99
|
+
toggleShow: (idx: number | Series) => void;
|
|
100
|
+
}): any;
|
|
101
|
+
};
|
|
102
|
+
}) | null;
|
|
103
|
+
}, HTMLDivElement>;
|
|
104
|
+
export default _default;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import Uplot from 'uplot';
|
|
1
|
+
import { default as Uplot } from 'uplot';
|
|
2
2
|
export type Options = Omit<Uplot.Options, 'height' | 'width'>;
|
|
3
3
|
export type AlignedData = Uplot.AlignedData;
|
|
4
4
|
export interface Series {
|
|
@@ -14,84 +14,60 @@ export interface UplotElement extends Partial<HTMLElement> {
|
|
|
14
14
|
toggleShow: (serie: Series | number) => void;
|
|
15
15
|
uplot: Uplot;
|
|
16
16
|
}
|
|
17
|
-
interface UplotProps {
|
|
17
|
+
export interface UplotProps {
|
|
18
18
|
options: Options;
|
|
19
19
|
data: Uplot.AlignedData;
|
|
20
20
|
noResetScale?: boolean;
|
|
21
21
|
showDebug?: boolean;
|
|
22
22
|
noFooter?: boolean;
|
|
23
|
-
zoom?: number[] | null[];
|
|
24
|
-
series?: Series[];
|
|
25
23
|
}
|
|
24
|
+
type __VLS_Props = UplotProps;
|
|
26
25
|
declare function toggleShow(idx: number | Series): void;
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
26
|
+
type __VLS_PublicProps = {
|
|
27
|
+
'zoom'?: number[] | null[];
|
|
28
|
+
'series'?: Series[];
|
|
29
|
+
} & __VLS_Props;
|
|
30
|
+
declare function __VLS_template(): {
|
|
31
|
+
attrs: Partial<{}>;
|
|
32
|
+
slots: {
|
|
33
|
+
header?(_: {
|
|
34
|
+
series: Series[];
|
|
35
|
+
toggleShow: typeof toggleShow;
|
|
36
|
+
}): any;
|
|
37
|
+
footer?(_: {
|
|
38
|
+
series: Series[];
|
|
39
|
+
toggleShow: typeof toggleShow;
|
|
40
|
+
}): any;
|
|
41
|
+
};
|
|
42
|
+
refs: {
|
|
43
|
+
el: HTMLDivElement;
|
|
44
|
+
};
|
|
45
|
+
rootEl: HTMLDivElement;
|
|
46
|
+
};
|
|
47
|
+
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
48
|
+
declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {
|
|
33
49
|
toggleShow: typeof toggleShow;
|
|
34
|
-
uplot: import(
|
|
35
|
-
},
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
showDebug: boolean;
|
|
43
|
-
noFooter: boolean;
|
|
44
|
-
zoom: () => null[];
|
|
45
|
-
}>>> & {
|
|
50
|
+
uplot: import('vue').Ref<any, any>;
|
|
51
|
+
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
52
|
+
"update:zoom": (value: number[] | null[]) => any;
|
|
53
|
+
"update:series": (value: Series[]) => any;
|
|
54
|
+
} & {
|
|
55
|
+
select: (select: Uplot.Select) => any;
|
|
56
|
+
cursor: (cursor: Uplot.Cursor) => any;
|
|
57
|
+
}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
46
58
|
onSelect?: ((select: Uplot.Select) => any) | undefined;
|
|
47
59
|
onCursor?: ((cursor: Uplot.Cursor) => any) | undefined;
|
|
48
|
-
"onUpdate:zoom"?: ((
|
|
49
|
-
"onUpdate:series"?: ((
|
|
50
|
-
}
|
|
60
|
+
"onUpdate:zoom"?: ((value: number[] | null[]) => any) | undefined;
|
|
61
|
+
"onUpdate:series"?: ((value: Series[]) => any) | undefined;
|
|
62
|
+
}>, {
|
|
51
63
|
noResetScale: boolean;
|
|
52
64
|
showDebug: boolean;
|
|
53
65
|
noFooter: boolean;
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
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
|
-
}>;
|
|
66
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
67
|
+
el: HTMLDivElement;
|
|
68
|
+
}, HTMLDivElement>;
|
|
69
|
+
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
77
70
|
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
71
|
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
96
72
|
new (): {
|
|
97
73
|
$slots: S;
|
|
@@ -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;-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;
|
|
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;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}
|
package/dist/vite.config.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: import(
|
|
1
|
+
declare const _default: import('vite').UserConfig;
|
|
2
2
|
export default _default;
|
package/package.json
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@flowtools/uplot",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.0.
|
|
5
|
-
"packageManager": "pnpm@8.14.0",
|
|
4
|
+
"version": "0.0.13",
|
|
6
5
|
"description": "Modern vue component for uplot",
|
|
7
6
|
"author": "Jukka Raimovaara <roska@mentalhouse.fi> (Mentalhouse Oy)",
|
|
8
7
|
"license": "MIT",
|
|
@@ -37,28 +36,29 @@
|
|
|
37
36
|
"node": ">=18"
|
|
38
37
|
},
|
|
39
38
|
"peerDependencies": {
|
|
40
|
-
"@vueuse/core": "^
|
|
41
|
-
"uplot": "^1.6.
|
|
42
|
-
"vue": "
|
|
39
|
+
"@vueuse/core": "^13.6.0",
|
|
40
|
+
"uplot": "^1.6.32",
|
|
41
|
+
"vue": "^3.5.18"
|
|
43
42
|
},
|
|
44
43
|
"devDependencies": {
|
|
45
|
-
"@antfu/eslint-config": "^
|
|
46
|
-
"@
|
|
47
|
-
"@
|
|
48
|
-
"@
|
|
49
|
-
"@
|
|
50
|
-
"
|
|
51
|
-
"
|
|
52
|
-
"
|
|
53
|
-
"
|
|
54
|
-
"
|
|
55
|
-
"
|
|
56
|
-
"
|
|
44
|
+
"@antfu/eslint-config": "^5.0.0",
|
|
45
|
+
"@types/node": "^24.1.0",
|
|
46
|
+
"@vitejs/plugin-vue": "^6.0.1",
|
|
47
|
+
"@vitest/coverage-v8": "^3.2.4",
|
|
48
|
+
"@vue/test-utils": "^2.4.6",
|
|
49
|
+
"@vueuse/core": "^13.6.0",
|
|
50
|
+
"bumpp": "^10.2.1",
|
|
51
|
+
"eslint": "^9.15.0",
|
|
52
|
+
"jsdom": "^26.1.0",
|
|
53
|
+
"lint-staged": "^16.1.2",
|
|
54
|
+
"simple-git-hooks": "^2.11.1",
|
|
55
|
+
"typescript": "^5.7.2",
|
|
56
|
+
"uplot": "^1.6.31",
|
|
57
57
|
"vi-canvas-mock": "^1.0.0",
|
|
58
|
-
"vite": "^
|
|
59
|
-
"vite-plugin-dts": "^3.
|
|
60
|
-
"vitest": "^
|
|
61
|
-
"vue": "^3.
|
|
58
|
+
"vite": "^7.0.6",
|
|
59
|
+
"vite-plugin-dts": "^4.3.0",
|
|
60
|
+
"vitest": "^3.2.4",
|
|
61
|
+
"vue": "^3.5.13"
|
|
62
62
|
},
|
|
63
63
|
"simple-git-hooks": {
|
|
64
64
|
"pre-commit": "pnpm lint-staged"
|