vue-chrts 0.2.0-test.8 → 0.2.0

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.
@@ -1,8 +1,8 @@
1
- import { defineComponent as U, useSlots as j, useTemplateRef as w, ref as R, computed as d, createElementBlock as c, openBlock as a, normalizeClass as T, createVNode as u, createCommentVNode as p, createElementVNode as X, unref as i, withCtx as x, createBlock as m, Fragment as L, renderList as S, mergeProps as C, renderSlot as b } from "vue";
2
- import { Position as A, CurveType as B } from "@unovis/ts";
3
- import { createMarkers as Y, getFirstPropertyValue as z } from "../../utils.js";
4
- import I from "../Tooltip.js";
5
- import { VisXYContainer as H, VisTooltip as K, VisArea as q, VisLine as J, VisAxis as D, VisCrosshair as Q, VisBulletLegend as Z } from "@unovis/vue";
1
+ import { defineComponent as U, useSlots as j, useTemplateRef as w, ref as R, computed as d, createElementBlock as c, openBlock as a, normalizeClass as T, createVNode as u, createCommentVNode as p, createElementVNode as X, unref as i, withCtx as S, createBlock as m, Fragment as L, renderList as Y, mergeProps as C, renderSlot as A } from "vue";
2
+ import { Position as b, CurveType as D } from "@unovis/ts";
3
+ import { createMarkers as z, getFirstPropertyValue as I } from "../../utils.js";
4
+ import x from "../Tooltip.js";
5
+ import { VisXYContainer as H, VisTooltip as K, VisArea as q, VisLine as J, VisAxis as B, VisCrosshair as Q, VisBulletLegend as Z } from "@unovis/vue";
6
6
  import { LegendPosition as _ } from "../../types.js";
7
7
  const ee = {
8
8
  ref: "slotWrapper",
@@ -45,7 +45,7 @@ const ee = {
45
45
  setup(n, { emit: $ }) {
46
46
  const G = $, r = n, O = j(), h = w("slotWrapper"), s = R(), f = d(
47
47
  () => Object.values(r.categories).map((e) => e.color)
48
- ), N = d(() => r.markerConfig ? Y(r.markerConfig) : ""), g = d(() => r.legendPosition === _.Top), E = d(() => {
48
+ ), N = d(() => r.markerConfig ? z(r.markerConfig) : ""), g = d(() => r.legendPosition === _.Top), E = d(() => {
49
49
  const e = (t, o) => `
50
50
  <linearGradient id="gradient${t}-${o}" gradientTransform="rotate(90)">
51
51
  <stop offset="0%" stop-color="${o}" stop-opacity="1" />
@@ -84,30 +84,30 @@ const ee = {
84
84
  padding: e.padding,
85
85
  "svg-defs": E.value + N.value
86
86
  }, {
87
- default: x(() => [
87
+ default: S(() => [
88
88
  e.hideTooltip ? p("", !0) : (a(), m(i(K), {
89
89
  key: 0,
90
- "horizontal-placement": i(A).Right,
91
- "vertical-placement": i(A).Top
90
+ "horizontal-placement": i(b).Right,
91
+ "vertical-placement": i(b).Top
92
92
  }, null, 8, ["horizontal-placement", "vertical-placement"])),
93
- (a(!0), c(L, null, S(Object.keys(r.categories), (t, o) => (a(), c(L, { key: t }, [
93
+ (a(!0), c(L, null, Y(Object.keys(r.categories), (t, o) => (a(), c(L, { key: t }, [
94
94
  u(i(q), C({
95
95
  x: (k, v) => v
96
96
  }, { ref_for: !0 }, P(t), {
97
97
  color: `url(#gradient${o}-${f.value[o]})`,
98
98
  opacity: te,
99
- "curve-type": e.curveType ?? i(B).MonotoneX
99
+ "curve-type": e.curveType ?? i(D).MonotoneX
100
100
  }), null, 16, ["x", "color", "curve-type"]),
101
101
  u(i(J), {
102
102
  x: (k, v) => v,
103
103
  y: (k) => k[t],
104
104
  color: f.value[o],
105
- "curve-type": e.curveType ?? i(B).MonotoneX,
105
+ "curve-type": e.curveType ?? i(D).MonotoneX,
106
106
  "line-width": e.lineWidth,
107
- lineDashArray: e.lineDashArray
107
+ lineDashArray: e.lineDashArray ? e.lineDashArray[o] : void 0
108
108
  }, null, 8, ["x", "y", "color", "curve-type", "line-width", "lineDashArray"])
109
109
  ], 64))), 128)),
110
- e.hideXAxis ? p("", !0) : (a(), m(i(D), {
110
+ e.hideXAxis ? p("", !0) : (a(), m(i(B), {
111
111
  key: 1,
112
112
  type: "x",
113
113
  label: e.xLabel,
@@ -120,7 +120,7 @@ const ee = {
120
120
  "tick-line": e.xTickLine,
121
121
  "min-max-ticks-only": e.minMaxTicksOnly
122
122
  }, null, 8, ["label", "num-ticks", "tick-format", "tick-values", "grid-line", "domain-line", "tick-line", "min-max-ticks-only"])),
123
- e.hideYAxis ? p("", !0) : (a(), m(i(D), {
123
+ e.hideYAxis ? p("", !0) : (a(), m(i(B), {
124
124
  key: 2,
125
125
  type: "y",
126
126
  label: e.yLabel,
@@ -143,14 +143,14 @@ const ee = {
143
143
  }, null, 8, ["items"])
144
144
  ], 2)),
145
145
  X("div", ee, [
146
- i(O).tooltip ? b(e.$slots, "tooltip", {
146
+ i(O).tooltip ? A(e.$slots, "tooltip", {
147
147
  key: 0,
148
148
  values: s.value
149
- }) : s.value ? b(e.$slots, "fallback", { key: 1 }, () => [
150
- u(I, {
149
+ }) : s.value ? A(e.$slots, "fallback", { key: 1 }, () => [
150
+ u(x, {
151
151
  data: s.value,
152
152
  categories: e.categories,
153
- toolTipTitle: i(z)(s.value) ?? "",
153
+ toolTipTitle: i(I)(s.value) ?? "",
154
154
  yFormatter: r.yFormatter
155
155
  }, null, 8, ["data", "categories", "toolTipTitle", "yFormatter"])
156
156
  ]) : p("", !0)
@@ -1,4 +1,4 @@
1
- import { axisFormatter, LegendPosition, MarkerConfig } from '../../types';
1
+ import { axisFormatter, CrosshairConfig, LegendPosition, MarkerConfig } from '../../types';
2
2
  import { BulletLegendItemInterface, CurveType } from '@unovis/ts';
3
3
  export interface AreaChartProps<T> {
4
4
  /**
@@ -64,7 +64,7 @@ export interface AreaChartProps<T> {
64
64
  /**
65
65
  * Line dash array, see SVG's stroke-dasharray. Default: `undefined`
66
66
  */
67
- lineDashArray?: number[];
67
+ lineDashArray?: number[][];
68
68
  /**
69
69
  * The desired number of ticks on the x-axis.
70
70
  */
@@ -129,19 +129,5 @@ export interface AreaChartProps<T> {
129
129
  /**
130
130
  * Crosshair configuration object for customizing the appearance of the crosshair line.
131
131
  */
132
- crosshairConfig?: {
133
- /**
134
- * The color of the crosshair line. Accepts any valid CSS color string.
135
- * Example: '#f00', 'rgba(0,0,0,0.5)', 'blue'
136
- */
137
- color?: string;
138
- /**
139
- * The stroke color of the crosshair line. Accepts any valid CSS color string.
140
- */
141
- strokeColor?: string;
142
- /**
143
- * The stroke width of the crosshair line in pixels.
144
- */
145
- strokeWidth?: number;
146
- };
132
+ crosshairConfig?: CrosshairConfig;
147
133
  }
@@ -1,5 +1,4 @@
1
- import { BulletLegendItemInterface, Orientation } from '@unovis/ts';
2
- import { LegendPosition, axisFormatter } from '../../types';
1
+ import { BulletLegendItemInterface, Orientation, LegendPosition, axisFormatter } from '../../types';
3
2
  type BarChartPropsBase<T> = {
4
3
  /**
5
4
  * The data to be displayed in the bar chart.
@@ -1,18 +1,19 @@
1
- import { defineComponent as V, useSlots as b, useTemplateRef as D, ref as S, createElementBlock as d, openBlock as c, Fragment as T, createElementVNode as o, createCommentVNode as p, createVNode as r, renderSlot as a, unref as l, withCtx as w, normalizeStyle as B, toDisplayString as L } from "vue";
2
- import { Donut as $ } from "@unovis/ts";
3
- import { DonutType as H } from "./types.js";
4
- import { VisSingleContainer as N, VisTooltip as W, VisDonut as _, VisBulletLegend as j } from "@unovis/vue";
5
- const z = {
1
+ import { defineComponent as V, useSlots as b, useTemplateRef as w, ref as D, createElementBlock as u, openBlock as c, Fragment as S, createElementVNode as o, createCommentVNode as p, createVNode as n, renderSlot as s, unref as l, withCtx as T, normalizeStyle as W, toDisplayString as B } from "vue";
2
+ import { Donut as L } from "@unovis/ts";
3
+ import { DonutType as $ } from "./types.js";
4
+ import { VisSingleContainer as H, VisTooltip as N, VisDonut as j, VisBulletLegend as z } from "@unovis/vue";
5
+ const A = {
6
6
  ref: "slotWrapper",
7
7
  class: "hidden"
8
- }, A = { class: "flex items-center" }, E = {
8
+ }, E = { class: "flex items-center px-[15px] py-[10px]" }, R = {
9
9
  key: 0,
10
10
  class: "flex items-center justify-center mt-4"
11
- }, q = /* @__PURE__ */ V({
11
+ }, U = /* @__PURE__ */ V({
12
12
  __name: "DonutChart",
13
13
  props: {
14
14
  type: {},
15
15
  data: {},
16
+ arcWidth: {},
16
17
  height: {},
17
18
  radius: {},
18
19
  hideLegend: { type: Boolean },
@@ -21,63 +22,64 @@ const z = {
21
22
  },
22
23
  emits: ["click"],
23
24
  setup(f, { emit: m }) {
24
- const g = m, n = f, h = b(), i = D("slotWrapper"), t = S(), v = (e) => e, y = n.type === H.Half;
25
+ const g = m, r = f, h = b(), i = w("slotWrapper"), t = D(), v = (e) => e, y = r.type === $.Half;
25
26
  function k(e) {
26
27
  return t.value = e, C();
27
28
  }
28
29
  function C(e) {
29
30
  return typeof window > "u" ? "" : i.value ? i.value.innerHTML : "";
30
31
  }
31
- return (e, u) => (c(), d(T, null, [
32
+ return (e, d) => (c(), u(S, null, [
32
33
  o("div", {
33
34
  class: "flex items-center justify-center",
34
- onClick: u[0] || (u[0] = (s) => g("click", s, t.value))
35
+ onClick: d[0] || (d[0] = (a) => g("click", a, t.value))
35
36
  }, [
36
- r(l(N), {
37
+ n(l(H), {
37
38
  data: e.data,
38
39
  height: e.height,
39
40
  margin: {}
40
41
  }, {
41
- default: w(() => [
42
- r(l(W), {
42
+ default: T(() => [
43
+ n(l(N), {
43
44
  "horizontal-shift": 20,
44
45
  "vertical-shift": 20,
45
46
  triggers: {
46
- [l($).selectors.segment]: k
47
+ [l(L).selectors.segment]: k
47
48
  }
48
49
  }, null, 8, ["triggers"]),
49
- r(l(_), {
50
+ n(l(j), {
50
51
  value: v,
51
52
  "corner-radius": e.radius,
52
- color: n.labels.map((s) => s.color),
53
+ "arc-width": e.arcWidth ?? 20,
54
+ color: r.labels.map((a) => a.color),
53
55
  "angle-range": y ? [-1.5707963267948966, 1.5707963267948966] : [],
54
- "pad-angle": n.padAngle || 0
55
- }, null, 8, ["corner-radius", "color", "angle-range", "pad-angle"])
56
+ "pad-angle": r.padAngle || 0
57
+ }, null, 8, ["corner-radius", "arc-width", "color", "angle-range", "pad-angle"])
56
58
  ]),
57
59
  _: 1
58
60
  }, 8, ["data", "height"]),
59
- a(e.$slots, "default"),
60
- o("div", z, [
61
- l(h).tooltip ? a(e.$slots, "tooltip", {
61
+ s(e.$slots, "default"),
62
+ o("div", A, [
63
+ l(h).tooltip ? s(e.$slots, "tooltip", {
62
64
  key: 0,
63
65
  values: t.value
64
- }) : t.value ? a(e.$slots, "fallback", { key: 1 }, () => [
65
- o("div", A, [
66
+ }) : t.value ? s(e.$slots, "fallback", { key: 1 }, () => [
67
+ o("div", E, [
66
68
  o("div", {
67
69
  class: "w-2 h-2 rounded-full mr-2",
68
- style: B(`background-color: ${n.labels[t.value.index].color} ;`)
70
+ style: W(`background-color: ${r.labels[t.value.index].color} ;`)
69
71
  }, null, 4),
70
- o("div", null, L(t.value.data), 1)
72
+ o("div", null, B(t.value.data), 1)
71
73
  ])
72
74
  ]) : p("", !0)
73
75
  ], 512)
74
76
  ]),
75
- e.hideLegend ? p("", !0) : (c(), d("div", E, [
76
- r(l(j), { items: e.labels }, null, 8, ["items"])
77
+ e.hideLegend ? p("", !0) : (c(), u("div", R, [
78
+ n(l(z), { items: e.labels }, null, 8, ["items"])
77
79
  ]))
78
80
  ], 64));
79
81
  }
80
82
  });
81
83
  export {
82
- q as default
84
+ U as default
83
85
  };
@@ -10,8 +10,12 @@ export type DonutChartProps = {
10
10
  */
11
11
  data: number[];
12
12
  /**
13
- * The height of the chart in pixels.
13
+ * The arc width of the chart in pixels.
14
14
  */
15
+ arcWidth?: number;
16
+ /**
17
+ * The height of the chart in pixels.
18
+ */
15
19
  height: number;
16
20
  /**
17
21
  * The radius of the donut in pixels.
@@ -1,4 +1,4 @@
1
- import { defineComponent as P, computed as k, useSlots as x, useTemplateRef as O, ref as j, createElementBlock as u, openBlock as n, normalizeClass as g, createVNode as s, createCommentVNode as a, createElementVNode as w, unref as i, withCtx as M, createBlock as m, Fragment as W, renderList as E, mergeProps as G, renderSlot as h } from "vue";
1
+ import { defineComponent as P, computed as k, useSlots as O, useTemplateRef as j, ref as w, createElementBlock as c, openBlock as n, normalizeClass as g, createVNode as s, createCommentVNode as l, createElementVNode as x, unref as i, withCtx as M, createBlock as d, Fragment as W, renderList as E, mergeProps as G, renderSlot as h } from "vue";
2
2
  import { Position as v, CurveType as X } from "@unovis/ts";
3
3
  import { createMarkers as $, getFirstPropertyValue as z } from "../../utils.js";
4
4
  import R from "../Tooltip.js";
@@ -48,24 +48,24 @@ const J = {
48
48
  },
49
49
  emits: ["click"],
50
50
  setup(o, { emit: L }) {
51
- const C = L, t = o, b = k(() => t.markerConfig ? $(t.markerConfig) : ""), B = x(), c = O("slotWrapper"), l = j();
51
+ const C = L, t = o, b = k(() => t.markerConfig ? $(t.markerConfig) : ""), B = O(), p = j("slotWrapper"), a = w();
52
52
  function D(e) {
53
- return typeof window > "u" ? "" : c.value ? c.value.innerHTML : "";
53
+ return typeof window > "u" ? "" : p.value ? p.value.innerHTML : "";
54
54
  }
55
55
  function V(e) {
56
- return l.value = e, D();
56
+ return a.value = e, D();
57
57
  }
58
- const p = k(
58
+ const y = k(
59
59
  () => t.legendPosition === I.Top
60
60
  ), A = Object.values(t.categories).map(
61
61
  (e, r) => `var(--vis-color${r})`
62
62
  ), F = (e) => Object.values(t.categories)[e].color ?? A[e];
63
- return (e, r) => (n(), u("div", {
63
+ return (e, r) => (n(), c("div", {
64
64
  class: g(["flex flex-col space-y-4", {
65
- "flex-col-reverse": p.value,
65
+ "flex-col-reverse": y.value,
66
66
  markers: !!t.markerConfig
67
67
  }]),
68
- onClick: r[0] || (r[0] = (d) => C("click", d, l.value))
68
+ onClick: r[0] || (r[0] = (m) => C("click", m, a.value))
69
69
  }, [
70
70
  s(i(Y), {
71
71
  data: e.data,
@@ -78,16 +78,16 @@ const J = {
78
78
  "horizontal-placement": i(v).Right,
79
79
  "vertical-placement": i(v).Top
80
80
  }, null, 8, ["horizontal-placement", "vertical-placement"]),
81
- (n(!0), u(W, null, E(Object.keys(t.categories), (d, y) => (n(), m(i(H), {
82
- key: y,
81
+ (n(!0), c(W, null, E(Object.keys(t.categories), (m, u) => (n(), d(i(H), {
82
+ key: u,
83
83
  x: (f, N) => N,
84
- y: (f) => f[d],
85
- color: F(y),
84
+ y: (f) => f[m],
85
+ color: F(u),
86
86
  "curve-type": e.curveType ?? i(X).MonotoneX,
87
87
  "line-width": e.lineWidth,
88
- lineDashArray: e.lineDashArray
88
+ lineDashArray: e.lineDashArray ? e.lineDashArray[u] : void 0
89
89
  }, null, 8, ["x", "y", "color", "curve-type", "line-width", "lineDashArray"]))), 128)),
90
- e.hideXAxis ? a("", !0) : (n(), m(i(T), {
90
+ e.hideXAxis ? l("", !0) : (n(), d(i(T), {
91
91
  key: 0,
92
92
  type: "x",
93
93
  "tick-format": e.xFormatter,
@@ -100,7 +100,7 @@ const J = {
100
100
  "tick-values": e.xExplicitTicks,
101
101
  "min-max-ticks-only": e.minMaxTicksOnly
102
102
  }, null, 8, ["tick-format", "label", "domain-line", "grid-line", "tick-line", "num-ticks", "tick-values", "min-max-ticks-only"])),
103
- e.hideYAxis ? a("", !0) : (n(), m(i(T), {
103
+ e.hideYAxis ? l("", !0) : (n(), d(i(T), {
104
104
  key: 1,
105
105
  type: "y",
106
106
  "tick-format": e.yFormatter,
@@ -110,30 +110,30 @@ const J = {
110
110
  "grid-line": e.yGridLine,
111
111
  "tick-line": e.yTickLine
112
112
  }, null, 8, ["tick-format", "label", "num-ticks", "domain-line", "grid-line", "tick-line"])),
113
- e.hideTooltip ? a("", !0) : (n(), m(i(U), G({ key: 2 }, e.crosshairConfig, { template: V }), null, 16))
113
+ e.hideTooltip ? l("", !0) : (n(), d(i(U), G({ key: 2 }, e.crosshairConfig, { template: V }), null, 16))
114
114
  ]),
115
115
  _: 1
116
116
  }, 8, ["data", "padding", "height", "svgDefs"]),
117
- e.hideLegend ? a("", !0) : (n(), u("div", {
117
+ e.hideLegend ? l("", !0) : (n(), c("div", {
118
118
  key: 0,
119
- class: g(["flex items center justify-end", { "pb-4": p.value }])
119
+ class: g(["flex items center justify-end", { "pb-4": y.value }])
120
120
  }, [
121
121
  s(i(q), {
122
122
  items: Object.values(e.categories)
123
123
  }, null, 8, ["items"])
124
124
  ], 2)),
125
- w("div", J, [
125
+ x("div", J, [
126
126
  i(B).tooltip ? h(e.$slots, "tooltip", {
127
127
  key: 0,
128
- values: l.value
129
- }) : l.value ? h(e.$slots, "fallback", { key: 1 }, () => [
128
+ values: a.value
129
+ }) : a.value ? h(e.$slots, "fallback", { key: 1 }, () => [
130
130
  s(R, {
131
- data: l.value,
131
+ data: a.value,
132
132
  categories: e.categories,
133
- toolTipTitle: i(z)(l.value) ?? "",
133
+ toolTipTitle: i(z)(a.value) ?? "",
134
134
  yFormatter: t.yFormatter
135
135
  }, null, 8, ["data", "categories", "toolTipTitle", "yFormatter"])
136
- ]) : a("", !0)
136
+ ]) : l("", !0)
137
137
  ], 512)
138
138
  ], 2));
139
139
  }
@@ -1,5 +1,4 @@
1
- import { BulletLegendItemInterface, CurveType } from '@unovis/ts';
2
- import { axisFormatter, LegendPosition, MarkerConfig } from '../../types';
1
+ import { axisFormatter, BulletLegendItemInterface, CrosshairConfig, CurveType, LegendPosition, MarkerConfig } from '../../types';
3
2
  export interface LineChartProps<T> {
4
3
  /**
5
4
  * The data to be displayed in the line chart.
@@ -64,7 +63,7 @@ export interface LineChartProps<T> {
64
63
  /**
65
64
  * Line dash array, see SVG's stroke-dasharray. Default: `undefined`
66
65
  */
67
- lineDashArray?: number[];
66
+ lineDashArray?: number[][];
68
67
  /**
69
68
  * The desired number of ticks on the x-axis.
70
69
  */
@@ -129,19 +128,5 @@ export interface LineChartProps<T> {
129
128
  /**
130
129
  * Crosshair configuration object for customizing the appearance of the crosshair line.
131
130
  */
132
- crosshairConfig?: {
133
- /**
134
- * The color of the crosshair line. Accepts any valid CSS color string.
135
- * Example: '#f00', 'rgba(0,0,0,0.5)', 'blue'
136
- */
137
- color?: string;
138
- /**
139
- * The stroke color of the crosshair line. Accepts any valid CSS color string.
140
- */
141
- strokeColor?: string;
142
- /**
143
- * The stroke width of the crosshair line in pixels.
144
- */
145
- strokeWidth?: number;
146
- };
131
+ crosshairConfig?: CrosshairConfig;
147
132
  }
@@ -1,5 +1,5 @@
1
- import { defineComponent as b, computed as v, createElementBlock as r, openBlock as l, createElementVNode as o, toDisplayString as i, Fragment as y, renderList as h, normalizeStyle as n } from "vue";
2
- const f = {
1
+ import { defineComponent as b, computed as v, createElementBlock as r, openBlock as i, createElementVNode as o, toDisplayString as l, Fragment as y, renderList as h, normalizeStyle as a } from "vue";
2
+ const f = { class: "px-[15px] py-[10px]" }, _ = {
3
3
  class: "capitalize border-b mb-1 pb-1",
4
4
  style: {
5
5
  color: "var(--tooltip-value-color)",
@@ -14,29 +14,29 @@ const f = {
14
14
  yFormatter: { type: Function }
15
15
  },
16
16
  setup(p) {
17
- const a = p, d = ["_index", "_stacked", "_ending"], m = v(() => Object.entries(a.data ?? []).filter(
18
- ([e, g]) => !d.includes(e) && Object.keys(a.categories).includes(e)
17
+ const n = p, d = ["_index", "_stacked", "_ending"], m = v(() => Object.entries(n.data ?? []).filter(
18
+ ([e, g]) => !d.includes(e) && Object.keys(n.categories).includes(e)
19
19
  ));
20
- return (e, g) => (l(), r("div", null, [
21
- o("div", f, i(e.toolTipTitle), 1),
22
- (l(!0), r(y, null, h(m.value, ([t, s], u) => {
20
+ return (e, g) => (i(), r("div", f, [
21
+ o("div", _, l(e.toolTipTitle), 1),
22
+ (i(!0), r(y, null, h(m.value, ([t, s], u) => {
23
23
  var c;
24
- return l(), r("div", {
24
+ return i(), r("div", {
25
25
  key: t,
26
26
  style: { display: "flex", "align-items": "center", "margin-bottom": "4px" }
27
27
  }, [
28
28
  o("span", {
29
- style: n([{ width: "8px", height: "8px", "border-radius": "4px", "margin-right": "8px" }, {
29
+ style: a([{ width: "8px", height: "8px", "border-radius": "4px", "margin-right": "8px" }, {
30
30
  backgroundColor: (c = e.categories[t]) != null && c.color ? e.categories[t].color : `var(--vis-color${u})`
31
31
  }])
32
32
  }, null, 4),
33
33
  o("div", null, [
34
34
  o("span", {
35
- style: n([{ "font-weight": "600", "margin-right": "8px" }, { color: "var(--tooltip-label-color)" }])
36
- }, i(e.categories[t].name) + ":", 1),
35
+ style: a([{ "font-weight": "600", "margin-right": "8px" }, { color: "var(--tooltip-label-color)" }])
36
+ }, l(e.categories[t].name) + ":", 1),
37
37
  o("span", {
38
- style: n([{ "font-weight": "400" }, { color: "var(--tooltip-value-color)" }])
39
- }, i(e.yFormatter ? e.yFormatter(s) : s), 1)
38
+ style: a([{ "font-weight": "400" }, { color: "var(--tooltip-value-color)" }])
39
+ }, l(e.yFormatter ? e.yFormatter(s) : s), 1)
40
40
  ])
41
41
  ]);
42
42
  }), 128))
@@ -1,5 +1,4 @@
1
- import { axisFormatter } from '../types';
2
- import { BulletLegendItemInterface } from '@unovis/ts';
1
+ import { axisFormatter, BulletLegendItemInterface } from '../types';
3
2
  declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
4
3
  props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, never> & {
5
4
  data: T;
package/dist/index.d.ts CHANGED
@@ -3,5 +3,6 @@ import { default as AreaStackedChart } from './components/AreaStackedChart/AreaS
3
3
  import { default as LineChart } from './components/LineChart/LineChart.vue';
4
4
  import { default as BarChart } from './components/BarChart/BarChart.vue';
5
5
  import { default as DonutChart } from './components/DonutChart/DonutChart.vue';
6
- import { LegendPosition } from './types';
7
- export { AreaChart, AreaStackedChart, LineChart, BarChart, DonutChart, LegendPosition };
6
+ import { LegendPosition, CurveType, Orientation, BulletLegendItemInterface, MarkerConfig, CrosshairConfig } from './types';
7
+ export { AreaChart, AreaStackedChart, LineChart, BarChart, DonutChart, Orientation, CurveType, LegendPosition };
8
+ export type { BulletLegendItemInterface, MarkerConfig, CrosshairConfig };
package/dist/index.js CHANGED
@@ -1,14 +1,16 @@
1
- import { default as t } from "./components/AreaChart/AreaChart.js";
1
+ import { default as a } from "./components/AreaChart/AreaChart.js";
2
2
  import { default as o } from "./components/AreaStackedChart/AreaStackedChart.js";
3
3
  import { default as d } from "./components/LineChart/LineChart.js";
4
- import { default as p } from "./components/BarChart/BarChart.js";
5
- import { default as u } from "./components/DonutChart/DonutChart.js";
6
- import { LegendPosition as h } from "./types.js";
4
+ import { default as u } from "./components/BarChart/BarChart.js";
5
+ import { default as n } from "./components/DonutChart/DonutChart.js";
6
+ import { CurveType as x, LegendPosition as C, Orientation as h } from "./types.js";
7
7
  export {
8
- t as AreaChart,
8
+ a as AreaChart,
9
9
  o as AreaStackedChart,
10
- p as BarChart,
11
- u as DonutChart,
12
- h as LegendPosition,
13
- d as LineChart
10
+ u as BarChart,
11
+ x as CurveType,
12
+ n as DonutChart,
13
+ C as LegendPosition,
14
+ d as LineChart,
15
+ h as Orientation
14
16
  };
package/dist/types.d.ts CHANGED
@@ -1,7 +1,45 @@
1
- export declare enum LegendPosition {
1
+ import { AreaChartProps } from './components/AreaChart/types';
2
+ import { BarChartProps } from './components/BarChart/types';
3
+ import { LineChartProps } from './components/LineChart/types';
4
+ import { DonutChartProps } from './components/DonutChart/types';
5
+ declare enum LegendPosition {
2
6
  Top = "top",
3
7
  Bottom = "bottom"
4
8
  }
9
+ declare enum CurveType {
10
+ Basis = "basis",
11
+ BasisClosed = "basisClosed",
12
+ BasisOpen = "basisOpen",
13
+ Bundle = "bundle",
14
+ Cardinal = "cardinal",
15
+ CardinalClosed = "cardinalClosed",
16
+ CardinalOpen = "cardinalOpen",
17
+ CatmullRom = "catmullRom",
18
+ CatmullRomClosed = "catmullRomClosed",
19
+ CatmullRomOpen = "catmullRomOpen",
20
+ Linear = "linear",
21
+ LinearClosed = "linearClosed",
22
+ MonotoneX = "monotoneX",
23
+ MonotoneY = "monotoneY",
24
+ Natural = "natural",
25
+ Step = "step",
26
+ StepAfter = "stepAfter",
27
+ StepBefore = "stepBefore"
28
+ }
29
+ interface BulletLegendItemInterface {
30
+ name: string | number;
31
+ color?: string;
32
+ className?: string;
33
+ shape?: any;
34
+ inactive?: boolean;
35
+ hidden?: boolean;
36
+ pointer?: boolean;
37
+ }
38
+ declare enum Orientation {
39
+ Horizontal = "horizontal",
40
+ Vertical = "vertical"
41
+ }
42
+ export { LegendPosition, CurveType, Orientation, type AreaChartProps, type BarChartProps, type LineChartProps, type DonutChartProps, type BulletLegendItemInterface, };
5
43
  export type axisFormatter = ((tick: number, i?: number, ticks?: number[]) => string) | ((tick: Date, i?: number, ticks?: Date[]) => string);
6
44
  export interface MarkerConfig {
7
45
  type?: "circle" | "square" | "triangle" | "diamond";
@@ -10,3 +48,18 @@ export interface MarkerConfig {
10
48
  color?: string;
11
49
  strokeColor?: string;
12
50
  }
51
+ export interface CrosshairConfig {
52
+ /**
53
+ * The color of the crosshair line. Accepts any valid CSS color string.
54
+ * Example: '#f00', 'rgba(0,0,0,0.5)', 'blue'
55
+ */
56
+ color?: string;
57
+ /**
58
+ * The stroke color of the crosshair line. Accepts any valid CSS color string.
59
+ */
60
+ strokeColor?: string;
61
+ /**
62
+ * The stroke width of the crosshair line in pixels.
63
+ */
64
+ strokeWidth?: number;
65
+ }
package/dist/types.js CHANGED
@@ -1,4 +1,6 @@
1
- var o = /* @__PURE__ */ ((t) => (t.Top = "top", t.Bottom = "bottom", t))(o || {});
1
+ var l = /* @__PURE__ */ ((a) => (a.Top = "top", a.Bottom = "bottom", a))(l || {}), o = /* @__PURE__ */ ((a) => (a.Basis = "basis", a.BasisClosed = "basisClosed", a.BasisOpen = "basisOpen", a.Bundle = "bundle", a.Cardinal = "cardinal", a.CardinalClosed = "cardinalClosed", a.CardinalOpen = "cardinalOpen", a.CatmullRom = "catmullRom", a.CatmullRomClosed = "catmullRomClosed", a.CatmullRomOpen = "catmullRomOpen", a.Linear = "linear", a.LinearClosed = "linearClosed", a.MonotoneX = "monotoneX", a.MonotoneY = "monotoneY", a.Natural = "natural", a.Step = "step", a.StepAfter = "stepAfter", a.StepBefore = "stepBefore", a))(o || {}), t = /* @__PURE__ */ ((a) => (a.Horizontal = "horizontal", a.Vertical = "vertical", a))(t || {});
2
2
  export {
3
- o as LegendPosition
3
+ o as CurveType,
4
+ l as LegendPosition,
5
+ t as Orientation
4
6
  };
package/package.json CHANGED
@@ -1,16 +1,17 @@
1
1
  {
2
2
  "name": "vue-chrts",
3
- "version": "0.2.0-test.8",
3
+ "version": "0.2.0",
4
4
  "type": "module",
5
5
  "files": [
6
6
  "dist"
7
7
  ],
8
- "main": "./dist/index.js",
8
+ "main": "./dist/index.umd.cjs",
9
9
  "module": "./dist/index.js",
10
10
  "types": "./dist/index.d.ts",
11
11
  "exports": {
12
12
  ".": {
13
- "import": "./dist/index.js"
13
+ "import": "./dist/index.js",
14
+ "require": "./dist/index.umd.cjs"
14
15
  }
15
16
  },
16
17
  "scripts": {
@@ -23,21 +24,21 @@
23
24
  "vue": "^3.5.13"
24
25
  },
25
26
  "devDependencies": {
26
- "@tailwindcss/vite": "^4.1.11",
27
- "@tanstack/vue-table": "^8.21.3",
28
- "@types/node": "^22.16.5",
27
+ "@tailwindcss/vite": "^4.0.15",
28
+ "@tanstack/vue-table": "^8.21.2",
29
+ "@types/node": "^22.13.11",
29
30
  "@unovis/ts": "^1.5.2",
30
31
  "@unovis/vue": "^1.5.2",
31
- "@vitejs/plugin-vue": "^5.2.4",
32
+ "@vitejs/plugin-vue": "^5.2.1",
32
33
  "@vue/tsconfig": "^0.7.0",
33
- "@vueuse/core": "^13.5.0",
34
+ "@vueuse/core": "^13.0.0",
34
35
  "commit-and-tag-version": "^12.5.1",
35
- "tailwindcss": "^4.1.11",
36
- "typescript": "~5.7.3",
37
- "vite": "^6.3.5",
38
- "vite-plugin-dts": "^4.5.4",
39
- "vue-router": "^4.5.1",
40
- "vue-tsc": "^2.2.12"
36
+ "tailwindcss": "^4.0.15",
37
+ "typescript": "~5.7.2",
38
+ "vite": "^6.2.0",
39
+ "vite-plugin-dts": "^4.5.3",
40
+ "vue-router": "^4.5.0",
41
+ "vue-tsc": "^2.2.4"
41
42
  },
42
43
  "packageManager": "pnpm@8.15.4+sha256.cea6d0bdf2de3a0549582da3983c70c92ffc577ff4410cbf190817ddc35137c2"
43
44
  }