vue-chrts 0.1.0-beta.2-internal-17 → 0.1.0-beta.2-internal-19

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.
Files changed (111) hide show
  1. package/dist/vue-chrts.js +8524 -0
  2. package/dist/vue-chrts.umd.cjs +373 -0
  3. package/package.json +8 -21
  4. package/dist/components/Area/AreaChart.cjs +0 -7
  5. package/dist/components/Area/AreaChart.cjs.map +0 -1
  6. package/dist/components/Area/AreaChart.d.ts +0 -17
  7. package/dist/components/Area/AreaChart.js +0 -134
  8. package/dist/components/Area/AreaChart.js.map +0 -1
  9. package/dist/components/Area/AreaChart2.cjs +0 -2
  10. package/dist/components/Area/AreaChart2.cjs.map +0 -1
  11. package/dist/components/Area/AreaChart2.js +0 -5
  12. package/dist/components/Area/AreaChart2.js.map +0 -1
  13. package/dist/components/Area/index.d.ts +0 -2
  14. package/dist/components/Area/types.d.ts +0 -83
  15. package/dist/components/AreaStacked/AreaStackedChart.cjs +0 -2
  16. package/dist/components/AreaStacked/AreaStackedChart.cjs.map +0 -1
  17. package/dist/components/AreaStacked/AreaStackedChart.d.ts +0 -20
  18. package/dist/components/AreaStacked/AreaStackedChart.js +0 -70
  19. package/dist/components/AreaStacked/AreaStackedChart.js.map +0 -1
  20. package/dist/components/AreaStacked/AreaStackedChart2.cjs +0 -2
  21. package/dist/components/AreaStacked/AreaStackedChart2.cjs.map +0 -1
  22. package/dist/components/AreaStacked/AreaStackedChart2.js +0 -5
  23. package/dist/components/AreaStacked/AreaStackedChart2.js.map +0 -1
  24. package/dist/components/AreaStacked/index.d.ts +0 -1
  25. package/dist/components/Bar/BarChart.cjs +0 -2
  26. package/dist/components/Bar/BarChart.cjs.map +0 -1
  27. package/dist/components/Bar/BarChart.d.ts +0 -36
  28. package/dist/components/Bar/BarChart.js +0 -114
  29. package/dist/components/Bar/BarChart.js.map +0 -1
  30. package/dist/components/Bar/BarChart2.cjs +0 -2
  31. package/dist/components/Bar/BarChart2.cjs.map +0 -1
  32. package/dist/components/Bar/BarChart2.js +0 -5
  33. package/dist/components/Bar/BarChart2.js.map +0 -1
  34. package/dist/components/Bar/index.d.ts +0 -1
  35. package/dist/components/Crosshair/Crosshair.cjs +0 -2
  36. package/dist/components/Crosshair/Crosshair.cjs.map +0 -1
  37. package/dist/components/Crosshair/Crosshair.d.ts +0 -38
  38. package/dist/components/Crosshair/Crosshair.js +0 -40
  39. package/dist/components/Crosshair/Crosshair.js.map +0 -1
  40. package/dist/components/Crosshair/Crosshair2.cjs +0 -2
  41. package/dist/components/Crosshair/Crosshair2.cjs.map +0 -1
  42. package/dist/components/Crosshair/Crosshair2.js +0 -5
  43. package/dist/components/Crosshair/Crosshair2.js.map +0 -1
  44. package/dist/components/Crosshair/index.d.ts +0 -1
  45. package/dist/components/Donut/DonutChart.cjs +0 -6
  46. package/dist/components/Donut/DonutChart.cjs.map +0 -1
  47. package/dist/components/Donut/DonutChart.d.ts +0 -22
  48. package/dist/components/Donut/DonutChart.js +0 -59
  49. package/dist/components/Donut/DonutChart.js.map +0 -1
  50. package/dist/components/Donut/DonutChart2.cjs +0 -2
  51. package/dist/components/Donut/DonutChart2.cjs.map +0 -1
  52. package/dist/components/Donut/DonutChart2.js +0 -5
  53. package/dist/components/Donut/DonutChart2.js.map +0 -1
  54. package/dist/components/Donut/index.cjs +0 -2
  55. package/dist/components/Donut/index.cjs.map +0 -1
  56. package/dist/components/Donut/index.d.ts +0 -17
  57. package/dist/components/Donut/index.js +0 -5
  58. package/dist/components/Donut/index.js.map +0 -1
  59. package/dist/components/Line/LineChart.cjs +0 -2
  60. package/dist/components/Line/LineChart.cjs.map +0 -1
  61. package/dist/components/Line/LineChart.d.ts +0 -27
  62. package/dist/components/Line/LineChart.js +0 -91
  63. package/dist/components/Line/LineChart.js.map +0 -1
  64. package/dist/components/Line/LineChart2.cjs +0 -2
  65. package/dist/components/Line/LineChart2.cjs.map +0 -1
  66. package/dist/components/Line/LineChart2.js +0 -5
  67. package/dist/components/Line/LineChart2.js.map +0 -1
  68. package/dist/components/Line/index.d.ts +0 -1
  69. package/dist/components/Tooltip.cjs +0 -2
  70. package/dist/components/Tooltip.cjs.map +0 -1
  71. package/dist/components/Tooltip.d.ts +0 -17
  72. package/dist/components/Tooltip.js +0 -38
  73. package/dist/components/Tooltip.js.map +0 -1
  74. package/dist/components/Tooltip2.cjs +0 -2
  75. package/dist/components/Tooltip2.cjs.map +0 -1
  76. package/dist/components/Tooltip2.js +0 -5
  77. package/dist/components/Tooltip2.js.map +0 -1
  78. package/dist/components.d.ts +0 -6
  79. package/dist/index.cjs +0 -2
  80. package/dist/index.cjs.map +0 -1
  81. package/dist/index.d.ts +0 -6
  82. package/dist/index.js +0 -23
  83. package/dist/index.js.map +0 -1
  84. package/dist/types/components/Area/AreaChart.vue.d.ts +0 -16
  85. package/dist/types/components/Area/index.d.ts +0 -2
  86. package/dist/types/components/Area/types.d.ts +0 -82
  87. package/dist/types/components/AreaStacked/AreaStackedChart.vue.d.ts +0 -22
  88. package/dist/types/components/AreaStacked/index.d.ts +0 -1
  89. package/dist/types/components/Bar/BarChart.vue.d.ts +0 -35
  90. package/dist/types/components/Bar/index.d.ts +0 -1
  91. package/dist/types/components/Crosshair/Crosshair.vue.d.ts +0 -12
  92. package/dist/types/components/Crosshair/index.d.ts +0 -1
  93. package/dist/types/components/Donut/DonutChart.vue.d.ts +0 -29
  94. package/dist/types/components/Donut/index.d.ts +0 -17
  95. package/dist/types/components/Line/LineChart.vue.d.ts +0 -29
  96. package/dist/types/components/Line/index.d.ts +0 -1
  97. package/dist/types/components/Tooltip.vue.d.ts +0 -19
  98. package/dist/types/components.d.ts +0 -6
  99. package/dist/types/index.d.ts +0 -6
  100. package/dist/types/types.d.ts +0 -4
  101. package/dist/types/utils.d.ts +0 -1
  102. package/dist/types.cjs +0 -2
  103. package/dist/types.cjs.map +0 -1
  104. package/dist/types.d.ts +0 -4
  105. package/dist/types.js +0 -5
  106. package/dist/types.js.map +0 -1
  107. package/dist/utils.cjs +0 -2
  108. package/dist/utils.cjs.map +0 -1
  109. package/dist/utils.d.ts +0 -1
  110. package/dist/utils.js +0 -19
  111. package/dist/utils.js.map +0 -1
@@ -1,114 +0,0 @@
1
- import { defineComponent as v, computed as s, createApp as B, createElementBlock as m, openBlock as d, normalizeClass as f, createVNode as o, createCommentVNode as P, unref as a, withCtx as V, createBlock as y } from "vue";
2
- import { Orientation as l, StackedBar as L, GroupedBar as T } from "@unovis/ts";
3
- import { VisXYContainer as C, VisTooltip as A, VisGroupedBar as N, VisStackedBar as F, VisAxis as b, VisBulletLegend as j } from "@unovis/vue";
4
- import w from "../Tooltip.js";
5
- import { PaginationPosition as k } from "../../types.js";
6
- const H = /* @__PURE__ */ v({
7
- __name: "BarChart",
8
- props: {
9
- data: {},
10
- stacked: { type: Boolean },
11
- height: {},
12
- xLabel: {},
13
- yLabel: {},
14
- categories: {},
15
- xFormatter: {},
16
- yFormatter: {},
17
- yNumTicks: {},
18
- xNumTicks: {},
19
- yAxis: {},
20
- groupPadding: {},
21
- barPadding: {},
22
- radius: {},
23
- hideLegend: { type: Boolean },
24
- orientation: { default: l.Vertical },
25
- paginationPosition: { default: k.Bottom }
26
- },
27
- setup(h) {
28
- const n = h, u = s(() => n.yAxis.map((e) => (i) => i[e])), p = (e, i) => Object.values(n.categories)[i].color, c = s(() => (e) => {
29
- if (typeof window > "u" || typeof document > "u")
30
- return "";
31
- try {
32
- const i = B(w, {
33
- data: e,
34
- categories: n.categories
35
- }), t = document.createElement("div");
36
- i.mount(t);
37
- const r = t.innerHTML;
38
- return i.unmount(), r;
39
- } catch {
40
- return "";
41
- }
42
- }), g = s(
43
- () => n.paginationPosition === k.Top
44
- );
45
- return (e, i) => (d(), m("div", {
46
- class: f(["flex flex-col space-y-4", { "flex-col-reverse": g.value }])
47
- }, [
48
- o(a(C), { height: e.height }, {
49
- default: V(() => [
50
- o(a(A), {
51
- triggers: {
52
- [a(T).selectors.bar]: c.value,
53
- [a(L).selectors.bar]: c.value
54
- }
55
- }, null, 8, ["triggers"]),
56
- e.stacked ? (d(), y(a(F), {
57
- key: 1,
58
- data: e.data,
59
- x: (t, r) => r,
60
- y: u.value,
61
- "grid-line": !1,
62
- "domain-line": !1,
63
- color: p,
64
- "rounded-corners": e.radius ?? 0,
65
- "group-padding": e.groupPadding ?? 0,
66
- "bar-padding": e.barPadding ?? 0.2,
67
- orientation: e.orientation ?? a(l).Vertical
68
- }, null, 8, ["data", "x", "y", "rounded-corners", "group-padding", "bar-padding", "orientation"])) : (d(), y(a(N), {
69
- key: 0,
70
- data: e.data,
71
- x: (t, r) => r,
72
- y: u.value,
73
- "grid-line": !1,
74
- "domain-line": !1,
75
- color: p,
76
- "rounded-corners": e.radius ?? 0,
77
- "group-padding": e.groupPadding ?? 0,
78
- "bar-padding": e.barPadding ?? 0.2,
79
- orientation: e.orientation ?? a(l).Vertical
80
- }, null, 8, ["data", "x", "y", "rounded-corners", "group-padding", "bar-padding", "orientation"])),
81
- o(a(b), {
82
- type: "x",
83
- label: e.xLabel,
84
- "grid-line": !1,
85
- "domain-line": !1,
86
- "tick-format": e.xFormatter,
87
- "num-ticks": e.xNumTicks,
88
- "tick-line": !1
89
- }, null, 8, ["label", "tick-format", "num-ticks"]),
90
- o(a(b), {
91
- type: "y",
92
- label: e.yLabel,
93
- "grid-line": e.orientation !== a(l).Horizontal,
94
- "domain-line": !1,
95
- "tick-format": e.yFormatter
96
- }, null, 8, ["label", "grid-line", "tick-format"])
97
- ]),
98
- _: 1
99
- }, 8, ["height"]),
100
- e.hideLegend ? P("", !0) : (d(), m("div", {
101
- key: 0,
102
- class: f(["flex items center justify-end", { "pb-4": g.value }])
103
- }, [
104
- o(a(j), {
105
- items: Object.values(e.categories)
106
- }, null, 8, ["items"])
107
- ], 2))
108
- ], 2));
109
- }
110
- });
111
- export {
112
- H as default
113
- };
114
- //# sourceMappingURL=BarChart.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"BarChart.js","sources":["../../../src/components/Bar/BarChart.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { computed, ComputedRef, createApp } from \"vue\";\nimport { BulletLegendItemInterface, GroupedBar, Orientation, StackedBar } from \"@unovis/ts\";\n\nimport {\n VisAxis,\n VisBulletLegend,\n VisGroupedBar,\n VisStackedBar,\n VisTooltip,\n VisXYContainer,\n} from \"@unovis/vue\";\n\nimport Tooltip from \"./../Tooltip.vue\";\nimport { PaginationPosition } from \"../../types\";\n\ntype BarChartProps<T> = {\n data: T[];\n stacked?: boolean;\n height: number;\n xLabel?: string;\n yLabel?: string;\n categories: Record<string, BulletLegendItemInterface>;\n xFormatter: (i: number, idx?: number) => string | number;\n yFormatter?: (i: number, idx?: number) => string | number;\n yNumTicks?: number;\n xNumTicks?: number;\n yAxis: (keyof T)[];\n groupPadding?: number;\n barPadding?: number;\n radius?: number;\n hideLegend?: boolean;\n orientation?: Orientation;\n paginationPosition?: PaginationPosition;\n};\n\nconst props = withDefaults(defineProps<BarChartProps<T>>(), {\n orientation: Orientation.Vertical,\n paginationPosition: PaginationPosition.Bottom,\n});\n\nconst yAxis: ComputedRef<((d: T) => T[keyof T])[]> = computed(() => {\n return props.yAxis.map((key) => (d: T) => {\n return d[key];\n });\n});\n\nconst color = (_: T, i: number) => Object.values(props.categories)[i].color;\n\nconst generateTooltip = computed(() => (d: T) => {\n if (typeof window === 'undefined' || typeof document === 'undefined') {\n return '';\n }\n \n try {\n const app = createApp(Tooltip, {\n data: d,\n categories: props.categories,\n });\n\n const container = document.createElement(\"div\");\n app.mount(container);\n\n const html = container.innerHTML;\n app.unmount();\n\n return html;\n } catch (error) {\n return '';\n }\n});\n\nconst PaginationPositionTop = computed(\n () => props.paginationPosition === PaginationPosition.Top\n);\n</script>\n\n<template>\n <div\n class=\"flex flex-col space-y-4\"\n :class=\"{ 'flex-col-reverse': PaginationPositionTop }\"\n >\n <VisXYContainer :height=\"height\">\n <VisTooltip\n :triggers=\"{\n [GroupedBar.selectors.bar]: generateTooltip,\n [StackedBar.selectors.bar]: generateTooltip,\n }\"\n />\n\n <VisGroupedBar\n v-if=\"!stacked\"\n :data=\"data\"\n :x=\"(_: T, i: number) => i\"\n :y=\"yAxis\"\n :grid-line=\"false\"\n :domain-line=\"false\"\n :color=\"color\"\n :rounded-corners=\"radius ?? 0\"\n :group-padding=\"groupPadding ?? 0\"\n :bar-padding=\"barPadding ?? 0.2\"\n :orientation=\"orientation ?? Orientation.Vertical\"\n />\n <VisStackedBar\n v-else\n :data=\"data\"\n :x=\"(_: T, i: number) => i\"\n :y=\"yAxis\"\n :grid-line=\"false\"\n :domain-line=\"false\"\n :color=\"color\"\n :rounded-corners=\"radius ?? 0\"\n :group-padding=\"groupPadding ?? 0\"\n :bar-padding=\"barPadding ?? 0.2\"\n :orientation=\"orientation ?? Orientation.Vertical\"\n />\n <VisAxis\n type=\"x\"\n :label=\"xLabel\"\n :grid-line=\"false\"\n :domain-line=\"false\"\n :tick-format=\"xFormatter\"\n :num-ticks=\"xNumTicks\"\n :tick-line=\"false\"\n />\n <VisAxis\n type=\"y\"\n :label=\"yLabel\"\n :grid-line=\"orientation !== Orientation.Horizontal\"\n :domain-line=\"false\"\n :tick-format=\"yFormatter\"\n />\n </VisXYContainer>\n <div\n v-if=\"!hideLegend\"\n class=\"flex items center justify-end\"\n :class=\"{ 'pb-4': PaginationPositionTop }\"\n >\n <VisBulletLegend :items=\"Object.values(categories)\" />\n </div>\n </div>\n</template>\n"],"names":["props","__props","yAxis","computed","key","d","color","_","generateTooltip","app","createApp","Tooltip","container","html","PaginationPositionTop","PaginationPosition"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,UAAMA,IAAQC,GAKRC,IAA+CC,EAAS,MACrDH,EAAM,MAAM,IAAI,CAACI,MAAQ,CAACC,MACxBA,EAAED,CAAG,CACb,CACF,GAEKE,IAAQ,CAACC,GAAM,MAAc,OAAO,OAAOP,EAAM,UAAU,EAAE,CAAC,EAAE,OAEhEQ,IAAkBL,EAAS,MAAM,CAACE,MAAS;AAC/C,UAAI,OAAO,SAAW,OAAe,OAAO,WAAa;AAChD,eAAA;AAGL,UAAA;AACI,cAAAI,IAAMC,EAAUC,GAAS;AAAA,UAC7B,MAAMN;AAAA,UACN,YAAYL,EAAM;AAAA,QAAA,CACnB,GAEKY,IAAY,SAAS,cAAc,KAAK;AAC9C,QAAAH,EAAI,MAAMG,CAAS;AAEnB,cAAMC,IAAOD,EAAU;AACvB,eAAAH,EAAI,QAAQ,GAELI;AAAA,cACO;AACP,eAAA;AAAA,MAAA;AAAA,IACT,CACD,GAEKC,IAAwBX;AAAA,MAC5B,MAAMH,EAAM,uBAAuBe,EAAmB;AAAA,IACxD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./BarChart.cjs");exports.default=e.default;
2
- //# sourceMappingURL=BarChart2.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"BarChart2.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -1,5 +0,0 @@
1
- import f from "./BarChart.js";
2
- export {
3
- f as default
4
- };
5
- //# sourceMappingURL=BarChart2.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"BarChart2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1 +0,0 @@
1
- export { default as BarChart } from './BarChart';
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),d=require("@unovis/ts"),i=require("@unovis/vue"),_=e.defineComponent({__name:"Crosshair",props:{colors:{default:()=>[]},index:{},items:{},customTooltip:{}},setup(s){const o=s,r=new WeakMap;function c(t){if(r.has(t))return r.get(t);if(typeof window<"u"){const n=document.createElement("div"),u=Object.entries(d.omit(t,[o.index])).map(([p,m])=>({...o.items.find(f=>f.name===p),value:m})),l=o.customTooltip??i.VisTooltip;return e.createApp(l,{title:t[o.index].toString(),data:u}).mount(n),r.set(t,n.innerHTML),n.innerHTML}}function a(t,n){return o.colors[n]??"transparent"}return(t,n)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createVNode(e.unref(i.VisTooltip),{"horizontal-shift":20,"vertical-shift":20}),e.createVNode(e.unref(i.VisCrosshair),{template:c,color:a})],64))}});exports.default=_;
2
- //# sourceMappingURL=Crosshair.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Crosshair.cjs","sources":["../../../src/components/Crosshair/Crosshair.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { BulletLegendItemInterface } from '@unovis/ts'\nimport { omit } from '@unovis/ts'\nimport { VisCrosshair, VisTooltip } from '@unovis/vue'\nimport { type Component, createApp } from 'vue'\n\nconst props = withDefaults(defineProps<{\n colors: string[]\n index: string\n items: BulletLegendItemInterface[]\n customTooltip?: Component\n}>(), {\n colors: () => [],\n})\n\n// Use weakmap to store reference to each datapoint for Tooltip\nconst wm = new WeakMap()\nfunction template(d: any) {\n if (wm.has(d)) {\n return wm.get(d)\n }\n else {\n if (typeof window !== 'undefined') {\n const componentDiv = document.createElement('div')\n const omittedData = Object.entries(omit(d, [props.index])).map(([key, value]) => {\n const legendReference = props.items.find(i => i.name === key)\n return { ...legendReference, value }\n })\n const TooltipComponent = props.customTooltip ?? VisTooltip\n createApp(TooltipComponent, { title: d[props.index].toString(), data: omittedData }).mount(componentDiv)\n wm.set(d, componentDiv.innerHTML)\n return componentDiv.innerHTML\n }\n\n }\n}\n\nfunction color(_: unknown, i: number) {\n return props.colors[i] ?? 'transparent'\n}\n</script>\n\n<template>\n <VisTooltip :horizontal-shift=\"20\" :vertical-shift=\"20\" />\n <VisCrosshair :template=\"template\" :color=\"color\" />\n</template>"],"names":["props","__props","wm","template","d","componentDiv","omittedData","omit","key","value","i","TooltipComponent","VisTooltip","createApp","color","_"],"mappings":"wSAMA,MAAMA,EAAQC,EAURC,MAAS,QACf,SAASC,EAASC,EAAQ,CACpB,GAAAF,EAAG,IAAIE,CAAC,EACH,OAAAF,EAAG,IAAIE,CAAC,EAGX,GAAA,OAAO,OAAW,IAAa,CAC3B,MAAAC,EAAe,SAAS,cAAc,KAAK,EAC3CC,EAAc,OAAO,QAAQC,EAAK,KAAAH,EAAG,CAACJ,EAAM,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,CAACQ,EAAKC,CAAK,KAElE,CAAE,GADeT,EAAM,MAAM,KAAUU,GAAAA,EAAE,OAASF,CAAG,EAC/B,MAAAC,CAAM,EACpC,EACGE,EAAmBX,EAAM,eAAiBY,EAAA,WAChDC,OAAAA,EAAAA,UAAUF,EAAkB,CAAE,MAAOP,EAAEJ,EAAM,KAAK,EAAE,SAAS,EAAG,KAAMM,CAAa,CAAA,EAAE,MAAMD,CAAY,EACpGH,EAAA,IAAIE,EAAGC,EAAa,SAAS,EACzBA,EAAa,SAAA,CAGtB,CAGO,SAAAS,EAAMC,EAAYL,EAAW,CAC7B,OAAAV,EAAM,OAAOU,CAAC,GAAK,aAAA"}
@@ -1,38 +0,0 @@
1
- import { BulletLegendItemInterface } from '@unovis/ts';
2
- import { Component } from 'vue';
3
-
4
- declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
5
- colors: string[];
6
- index: string;
7
- items: BulletLegendItemInterface[];
8
- customTooltip?: Component;
9
- }>, {
10
- colors: () => any[];
11
- }>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
12
- colors: string[];
13
- index: string;
14
- items: BulletLegendItemInterface[];
15
- customTooltip?: Component;
16
- }>, {
17
- colors: () => any[];
18
- }>>> & Readonly<{}>, {
19
- colors: string[];
20
- }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
21
- export default _default;
22
- type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
23
- type __VLS_TypePropsToRuntimeProps<T> = {
24
- [K in keyof T]-?: {} extends Pick<T, K> ? {
25
- type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
26
- } : {
27
- type: import('vue').PropType<T[K]>;
28
- required: true;
29
- };
30
- };
31
- type __VLS_WithDefaults<P, D> = {
32
- [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
33
- default: D[K];
34
- }> : P[K];
35
- };
36
- type __VLS_Prettify<T> = {
37
- [K in keyof T]: T[K];
38
- } & {};
@@ -1,40 +0,0 @@
1
- import { defineComponent as h, createElementBlock as _, openBlock as T, Fragment as g, createVNode as r, unref as i, createApp as x } from "vue";
2
- import { omit as w } from "@unovis/ts";
3
- import { VisTooltip as s, VisCrosshair as C } from "@unovis/vue";
4
- const B = /* @__PURE__ */ h({
5
- __name: "Crosshair",
6
- props: {
7
- colors: { default: () => [] },
8
- index: {},
9
- items: {},
10
- customTooltip: {}
11
- },
12
- setup(c) {
13
- const n = c, o = /* @__PURE__ */ new WeakMap();
14
- function a(e) {
15
- if (o.has(e))
16
- return o.get(e);
17
- if (typeof window < "u") {
18
- const t = document.createElement("div"), p = Object.entries(w(e, [n.index])).map(([f, u]) => ({ ...n.items.find((d) => d.name === f), value: u })), l = n.customTooltip ?? s;
19
- return x(l, { title: e[n.index].toString(), data: p }).mount(t), o.set(e, t.innerHTML), t.innerHTML;
20
- }
21
- }
22
- function m(e, t) {
23
- return n.colors[t] ?? "transparent";
24
- }
25
- return (e, t) => (T(), _(g, null, [
26
- r(i(s), {
27
- "horizontal-shift": 20,
28
- "vertical-shift": 20
29
- }),
30
- r(i(C), {
31
- template: a,
32
- color: m
33
- })
34
- ], 64));
35
- }
36
- });
37
- export {
38
- B as default
39
- };
40
- //# sourceMappingURL=Crosshair.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Crosshair.js","sources":["../../../src/components/Crosshair/Crosshair.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { BulletLegendItemInterface } from '@unovis/ts'\nimport { omit } from '@unovis/ts'\nimport { VisCrosshair, VisTooltip } from '@unovis/vue'\nimport { type Component, createApp } from 'vue'\n\nconst props = withDefaults(defineProps<{\n colors: string[]\n index: string\n items: BulletLegendItemInterface[]\n customTooltip?: Component\n}>(), {\n colors: () => [],\n})\n\n// Use weakmap to store reference to each datapoint for Tooltip\nconst wm = new WeakMap()\nfunction template(d: any) {\n if (wm.has(d)) {\n return wm.get(d)\n }\n else {\n if (typeof window !== 'undefined') {\n const componentDiv = document.createElement('div')\n const omittedData = Object.entries(omit(d, [props.index])).map(([key, value]) => {\n const legendReference = props.items.find(i => i.name === key)\n return { ...legendReference, value }\n })\n const TooltipComponent = props.customTooltip ?? VisTooltip\n createApp(TooltipComponent, { title: d[props.index].toString(), data: omittedData }).mount(componentDiv)\n wm.set(d, componentDiv.innerHTML)\n return componentDiv.innerHTML\n }\n\n }\n}\n\nfunction color(_: unknown, i: number) {\n return props.colors[i] ?? 'transparent'\n}\n</script>\n\n<template>\n <VisTooltip :horizontal-shift=\"20\" :vertical-shift=\"20\" />\n <VisCrosshair :template=\"template\" :color=\"color\" />\n</template>"],"names":["props","__props","wm","template","d","componentDiv","omittedData","omit","key","value","i","TooltipComponent","VisTooltip","createApp","color","_"],"mappings":";;;;;;;;;;;;AAMA,UAAMA,IAAQC,GAURC,wBAAS,QAAQ;AACvB,aAASC,EAASC,GAAQ;AACpB,UAAAF,EAAG,IAAIE,CAAC;AACH,eAAAF,EAAG,IAAIE,CAAC;AAGX,UAAA,OAAO,SAAW,KAAa;AAC3B,cAAAC,IAAe,SAAS,cAAc,KAAK,GAC3CC,IAAc,OAAO,QAAQC,EAAKH,GAAG,CAACJ,EAAM,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,CAACQ,GAAKC,CAAK,OAElE,EAAE,GADeT,EAAM,MAAM,KAAK,CAAKU,MAAAA,EAAE,SAASF,CAAG,GAC/B,OAAAC,EAAM,EACpC,GACGE,IAAmBX,EAAM,iBAAiBY;AAChD,eAAAC,EAAUF,GAAkB,EAAE,OAAOP,EAAEJ,EAAM,KAAK,EAAE,SAAS,GAAG,MAAMM,EAAa,CAAA,EAAE,MAAMD,CAAY,GACpGH,EAAA,IAAIE,GAAGC,EAAa,SAAS,GACzBA,EAAa;AAAA,MAAA;AAAA,IAGtB;AAGO,aAAAS,EAAMC,GAAYL,GAAW;AAC7B,aAAAV,EAAM,OAAOU,CAAC,KAAK;AAAA,IAAA;;;;;;;;;;;;;"}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./Crosshair.cjs");exports.default=e.default;
2
- //# sourceMappingURL=Crosshair2.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Crosshair2.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -1,5 +0,0 @@
1
- import f from "./Crosshair.js";
2
- export {
3
- f as default
4
- };
5
- //# sourceMappingURL=Crosshair2.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Crosshair2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1 +0,0 @@
1
- export { default as Crosshair } from './Crosshair';
@@ -1,6 +0,0 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),c=require("@unovis/ts"),n=require("@unovis/vue"),u=require("./index.cjs"),d={class:"flex items-center justify-center"},g={key:0,class:"flex items-center justify-center mt-4"},f=e.defineComponent({__name:"DonutChart",props:{type:{},data:{},height:{},radius:{},hidePagination:{type:Boolean},labels:{}},setup(r){const o=r,i=t=>t,l=o.type===u.DonutType.Half,s={[c.Donut.selectors.segment]:t=>`<div class='flex items-center'><div class='w-2 h-2 rounded-full mr-2' style='background-color: ${o.labels[t.index].color} ;'></div>
2
- <div>${t.data}</div>
3
- </vistooltip>
4
- </vissinglecontainer>
5
- </div>`};return(t,m)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",d,[e.createVNode(e.unref(n.VisSingleContainer),{data:t.data,height:t.height,margin:{}},{default:e.withCtx(()=>[e.createVNode(e.unref(n.VisTooltip),{"horizontal-shift":20,"vertical-shift":20,triggers:s}),e.createVNode(e.unref(n.VisDonut),{value:i,"corner-radius":t.radius,color:o.labels.map(a=>a.color),"angle-range":l?[-1.5707963267948966,1.5707963267948966]:[]},null,8,["corner-radius","color","angle-range"])]),_:1},8,["data","height"]),e.renderSlot(t.$slots,"default")]),t.hidePagination?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",g,[e.createVNode(e.unref(n.VisBulletLegend),{items:t.labels},null,8,["items"])]))],64))}});exports.default=f;
6
- //# sourceMappingURL=DonutChart.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DonutChart.cjs","sources":["../../../src/components/Donut/DonutChart.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Donut } from \"@unovis/ts\";\nimport {\n VisBulletLegend,\n VisDonut,\n VisSingleContainer,\n VisTooltip,\n} from \"@unovis/vue\";\nimport { type DonutChartProps, DonutType } from \".\";\n\nconst props = defineProps<DonutChartProps>()\n\nconst value = (d: number) => d;\n\nconst isHalf = props.type === DonutType.Half;\n\nconst tooltip = {\n [Donut.selectors.segment]: (d: any) => {\n return `<div class='flex items-center'><div class='w-2 h-2 rounded-full mr-2' style='background-color: ${\n props.labels[d.index].color\n } ;'></div>\n <div>${d.data}</div>\n </vistooltip>\n </vissinglecontainer>\n </div>`;\n },\n};\n</script>\n\n<template>\n <div class=\"flex items-center justify-center\">\n <VisSingleContainer\n :data=\"data\"\n :height=\"height\"\n :margin=\"{}\"\n >\n <VisTooltip\n :horizontal-shift=\"20\"\n :vertical-shift=\"20\"\n :triggers=\"tooltip\"\n />\n\n <VisDonut\n :value=\"value\"\n :corner-radius=\"radius\"\n :color=\"props.labels.map((l) => l.color)\"\n :angle-range=\"isHalf ? [-1.5707963267948966, 1.5707963267948966] : []\"\n />\n </VisSingleContainer>\n\n <slot />\n </div>\n\n <div v-if=\"!hidePagination\" class=\"flex items-center justify-center mt-4\">\n <VisBulletLegend :items=\"labels\" />\n </div>\n</template>\n"],"names":["props","__props","value","d","isHalf","DonutType","tooltip","Donut"],"mappings":"wbAUA,MAAMA,EAAQC,EAERC,EAASC,GAAcA,EAEvBC,EAASJ,EAAM,OAASK,EAAU,UAAA,KAElCC,EAAU,CACd,CAACC,QAAM,UAAU,OAAO,EAAIJ,GACnB,kGACLH,EAAM,OAAOG,EAAE,KAAK,EAAE,KACxB;AAAA,eACWA,EAAE,IAAI;AAAA;AAAA;AAAA,SAKrB"}
@@ -1,22 +0,0 @@
1
- import { DonutChartProps } from '.';
2
-
3
- declare function __VLS_template(): {
4
- default?(_: {}): any;
5
- };
6
- declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<DonutChartProps>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<DonutChartProps>>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
7
- declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
8
- export default _default;
9
- type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
10
- type __VLS_TypePropsToRuntimeProps<T> = {
11
- [K in keyof T]-?: {} extends Pick<T, K> ? {
12
- type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
13
- } : {
14
- type: import('vue').PropType<T[K]>;
15
- required: true;
16
- };
17
- };
18
- type __VLS_WithTemplateSlots<T, S> = T & {
19
- new (): {
20
- $slots: S;
21
- };
22
- };
@@ -1,59 +0,0 @@
1
- import { defineComponent as u, createElementBlock as n, openBlock as r, Fragment as m, createElementVNode as f, createCommentVNode as p, createVNode as t, renderSlot as g, unref as o, withCtx as h } from "vue";
2
- import { Donut as v } from "@unovis/ts";
3
- import { VisSingleContainer as y, VisTooltip as V, VisDonut as b, VisBulletLegend as C } from "@unovis/vue";
4
- import { DonutType as _ } from "./index.js";
5
- const k = { class: "flex items-center justify-center" }, B = {
6
- key: 0,
7
- class: "flex items-center justify-center mt-4"
8
- }, E = /* @__PURE__ */ u({
9
- __name: "DonutChart",
10
- props: {
11
- type: {},
12
- data: {},
13
- height: {},
14
- radius: {},
15
- hidePagination: { type: Boolean },
16
- labels: {}
17
- },
18
- setup(a) {
19
- const i = a, l = (e) => e, s = i.type === _.Half, d = {
20
- [v.selectors.segment]: (e) => `<div class='flex items-center'><div class='w-2 h-2 rounded-full mr-2' style='background-color: ${i.labels[e.index].color} ;'></div>
21
- <div>${e.data}</div>
22
- </vistooltip>
23
- </vissinglecontainer>
24
- </div>`
25
- };
26
- return (e, D) => (r(), n(m, null, [
27
- f("div", k, [
28
- t(o(y), {
29
- data: e.data,
30
- height: e.height,
31
- margin: {}
32
- }, {
33
- default: h(() => [
34
- t(o(V), {
35
- "horizontal-shift": 20,
36
- "vertical-shift": 20,
37
- triggers: d
38
- }),
39
- t(o(b), {
40
- value: l,
41
- "corner-radius": e.radius,
42
- color: i.labels.map((c) => c.color),
43
- "angle-range": s ? [-1.5707963267948966, 1.5707963267948966] : []
44
- }, null, 8, ["corner-radius", "color", "angle-range"])
45
- ]),
46
- _: 1
47
- }, 8, ["data", "height"]),
48
- g(e.$slots, "default")
49
- ]),
50
- e.hidePagination ? p("", !0) : (r(), n("div", B, [
51
- t(o(C), { items: e.labels }, null, 8, ["items"])
52
- ]))
53
- ], 64));
54
- }
55
- });
56
- export {
57
- E as default
58
- };
59
- //# sourceMappingURL=DonutChart.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DonutChart.js","sources":["../../../src/components/Donut/DonutChart.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Donut } from \"@unovis/ts\";\nimport {\n VisBulletLegend,\n VisDonut,\n VisSingleContainer,\n VisTooltip,\n} from \"@unovis/vue\";\nimport { type DonutChartProps, DonutType } from \".\";\n\nconst props = defineProps<DonutChartProps>()\n\nconst value = (d: number) => d;\n\nconst isHalf = props.type === DonutType.Half;\n\nconst tooltip = {\n [Donut.selectors.segment]: (d: any) => {\n return `<div class='flex items-center'><div class='w-2 h-2 rounded-full mr-2' style='background-color: ${\n props.labels[d.index].color\n } ;'></div>\n <div>${d.data}</div>\n </vistooltip>\n </vissinglecontainer>\n </div>`;\n },\n};\n</script>\n\n<template>\n <div class=\"flex items-center justify-center\">\n <VisSingleContainer\n :data=\"data\"\n :height=\"height\"\n :margin=\"{}\"\n >\n <VisTooltip\n :horizontal-shift=\"20\"\n :vertical-shift=\"20\"\n :triggers=\"tooltip\"\n />\n\n <VisDonut\n :value=\"value\"\n :corner-radius=\"radius\"\n :color=\"props.labels.map((l) => l.color)\"\n :angle-range=\"isHalf ? [-1.5707963267948966, 1.5707963267948966] : []\"\n />\n </VisSingleContainer>\n\n <slot />\n </div>\n\n <div v-if=\"!hidePagination\" class=\"flex items-center justify-center mt-4\">\n <VisBulletLegend :items=\"labels\" />\n </div>\n</template>\n"],"names":["props","__props","value","d","isHalf","DonutType","tooltip","Donut"],"mappings":";;;;;;;;;;;;;;;;;;AAUA,UAAMA,IAAQC,GAERC,IAAQ,CAACC,MAAcA,GAEvBC,IAASJ,EAAM,SAASK,EAAU,MAElCC,IAAU;AAAA,MACd,CAACC,EAAM,UAAU,OAAO,GAAG,CAACJ,MACnB,kGACLH,EAAM,OAAOG,EAAE,KAAK,EAAE,KACxB;AAAA,eACWA,EAAE,IAAI;AAAA;AAAA;AAAA;AAAA,IAKrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./DonutChart.cjs");exports.default=e.default;
2
- //# sourceMappingURL=DonutChart2.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DonutChart2.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -1,5 +0,0 @@
1
- import f from "./DonutChart.js";
2
- export {
3
- f as default
4
- };
5
- //# sourceMappingURL=DonutChart2.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DonutChart2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var e=(l=>(l.Half="half",l.Full="full",l))(e||{});exports.DonutType=e;
2
- //# sourceMappingURL=index.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.cjs","sources":["../../../src/components/Donut/index.ts"],"sourcesContent":["export { default as DonutChart } from \"./DonutChart.vue\";\n\ntype DonutChartProps = {\n type?: string;\n data: number[];\n height: number;\n radius: number;\n hidePagination?: boolean;\n labels: {\n name: string;\n color: string;\n }[];\n};\n\nenum DonutType {\n Half = \"half\",\n Full = \"full\",\n}\n\nexport { type DonutChartProps, DonutType };\n"],"names":["DonutType"],"mappings":"gFAcK,IAAAA,GAAAA,IACHA,EAAA,KAAO,OACPA,EAAA,KAAO,OAFJA,IAAAA,GAAA,CAAA,CAAA"}
@@ -1,17 +0,0 @@
1
- export { default as DonutChart } from './DonutChart';
2
- type DonutChartProps = {
3
- type?: string;
4
- data: number[];
5
- height: number;
6
- radius: number;
7
- hidePagination?: boolean;
8
- labels: {
9
- name: string;
10
- color: string;
11
- }[];
12
- };
13
- declare enum DonutType {
14
- Half = "half",
15
- Full = "full"
16
- }
17
- export { type DonutChartProps, DonutType };
@@ -1,5 +0,0 @@
1
- var r = /* @__PURE__ */ ((l) => (l.Half = "half", l.Full = "full", l))(r || {});
2
- export {
3
- r as DonutType
4
- };
5
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/components/Donut/index.ts"],"sourcesContent":["export { default as DonutChart } from \"./DonutChart.vue\";\n\ntype DonutChartProps = {\n type?: string;\n data: number[];\n height: number;\n radius: number;\n hidePagination?: boolean;\n labels: {\n name: string;\n color: string;\n }[];\n};\n\nenum DonutType {\n Half = \"half\",\n Full = \"full\",\n}\n\nexport { type DonutChartProps, DonutType };\n"],"names":["DonutType"],"mappings":"AAcK,IAAAA,sBAAAA,OACHA,EAAA,OAAO,QACPA,EAAA,OAAO,QAFJA,IAAAA,KAAA,CAAA,CAAA;"}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),l=require("@unovis/ts"),o=require("@unovis/vue"),d=require("../Tooltip.cjs"),f={class:"flex items center justify-end"},y=e.defineComponent({__name:"LineChart",props:{data:{},height:{},xLabel:{},yLabel:{},categories:{},xFormatter:{type:Function},yFormatter:{type:Function},curveType:{},yNumTicks:{},xNumTicks:{},paginationPosition:{}},setup(s){const n=s,u=t=>Object.values(n.categories)[t].color,m=e.computed(()=>t=>{if(typeof window>"u"||typeof document>"u")return"";try{const r=e.createApp(d.default,{data:t,categories:n.categories}),a=document.createElement("div");r.mount(a);const i=a.innerHTML;return r.unmount(),i}catch{return""}});return(t,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["space-y-4 flex flex-col",{"flex-col-reverse":n.paginationPosition==="top"}])},[e.createVNode(e.unref(o.VisXYContainer),{data:t.data,height:t.height},{default:e.withCtx(()=>[e.createVNode(e.unref(o.VisTooltip),{"horizontal-placement":e.unref(l.Position).Right,"vertical-placement":e.unref(l.Position).Top},null,8,["horizontal-placement","vertical-placement"]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(Object.keys(n.categories),(a,i)=>(e.openBlock(),e.createBlock(e.unref(o.VisLine),{key:i,x:(c,p)=>p,y:c=>c[a],color:u(i),"curve-type":t.curveType??e.unref(l.CurveType).MonotoneX},null,8,["x","y","color","curve-type"]))),128)),e.createVNode(e.unref(o.VisAxis),{type:"x","tick-format":t.xFormatter,"num-ticks":t.xNumTicks??4,label:t.xLabel,"label-margin":8,"domain-line":!1,"grid-line":!1},null,8,["tick-format","num-ticks","label"]),e.createVNode(e.unref(o.VisAxis),{type:"y","num-ticks":t.yNumTicks??4,"tick-format":t.yFormatter,label:t.yLabel,"domain-line":!1},null,8,["num-ticks","tick-format","label"]),e.createVNode(e.unref(o.VisCrosshair),{color:"#666",template:m.value},null,8,["template"])]),_:1},8,["data","height"]),e.createElementVNode("div",f,[e.createVNode(e.unref(o.VisBulletLegend),{items:Object.values(t.categories)},null,8,["items"])])],2))}});exports.default=y;
2
- //# sourceMappingURL=LineChart.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"LineChart.cjs","sources":["../../../src/components/Line/LineChart.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { computed, createApp } from \"vue\";\n\nimport { CurveType, BulletLegendItemInterface, Position } from \"@unovis/ts\";\n\nimport {\n VisAxis,\n VisBulletLegend,\n VisCrosshair,\n VisLine,\n VisXYContainer,\n VisTooltip,\n} from \"@unovis/vue\";\n\nimport Tooltip from \"./../Tooltip.vue\";\nimport { PaginationPosition } from \"../../types\";\n\ntype LineChartProps<T> = {\n data: T[];\n height: number;\n xLabel?: string;\n yLabel?: string;\n categories: Record<string, BulletLegendItemInterface>;\n xFormatter: (i: number, idx: number) => string;\n yFormatter?: (i: number, idx: number) => string;\n curveType?: CurveType;\n yNumTicks?: number;\n xNumTicks?: number;\n paginationPosition?: PaginationPosition;\n};\n\nconst props = defineProps<LineChartProps<T>>();\n\nconst color = (key: number) => Object.values(props.categories)[key].color;\n\nconst generateTooltip = computed(() => (d: T) => {\n if (typeof window === 'undefined' || typeof document === 'undefined') {\n return '';\n }\n \n try {\n const app = createApp(Tooltip, {\n data: d,\n categories: props.categories,\n });\n\n const container = document.createElement(\"div\");\n app.mount(container);\n\n const html = container.innerHTML;\n app.unmount();\n\n return html;\n } catch (error) {\n return '';\n }\n});\n</script>\n\n<template>\n <div\n class=\"space-y-4 flex flex-col\"\n :class=\"{\n 'flex-col-reverse': props.paginationPosition === 'top',\n }\"\n >\n <VisXYContainer :data=\"data\" :height=\"height\">\n <VisTooltip\n :horizontal-placement=\"Position.Right\"\n :vertical-placement=\"Position.Top\"\n />\n <template v-for=\"(i, iKey) in Object.keys(props.categories)\" :key=\"iKey\">\n <VisLine\n :x=\"(_: any, i: number) => i\"\n :y=\"(d: T) => d[i as keyof typeof d]\"\n :color=\"color(iKey)\"\n :curve-type=\"curveType ?? CurveType.MonotoneX\"\n />\n </template>\n <VisAxis\n type=\"x\"\n :tick-format=\"xFormatter\"\n :num-ticks=\"xNumTicks ?? 4\"\n :label=\"xLabel\"\n :label-margin=\"8\"\n :domain-line=\"false\"\n :grid-line=\"false\"\n />\n <VisAxis\n type=\"y\"\n :num-ticks=\"yNumTicks ?? 4\"\n :tick-format=\"yFormatter\"\n :label=\"yLabel\"\n :domain-line=\"false\"\n />\n <VisCrosshair color=\"#666\" :template=\"generateTooltip\" />\n </VisXYContainer>\n <div class=\"flex items center justify-end\">\n <VisBulletLegend :items=\"Object.values(categories)\" />\n </div>\n </div>\n</template>\n"],"names":["props","__props","color","key","generateTooltip","computed","d","app","createApp","Tooltip","container","html"],"mappings":"0dA+BA,MAAMA,EAAQC,EAERC,EAASC,GAAgB,OAAO,OAAOH,EAAM,UAAU,EAAEG,CAAG,EAAE,MAE9DC,EAAkBC,EAAAA,SAAS,IAAOC,GAAS,CAC/C,GAAI,OAAO,OAAW,KAAe,OAAO,SAAa,IAChD,MAAA,GAGL,GAAA,CACI,MAAAC,EAAMC,YAAUC,UAAS,CAC7B,KAAMH,EACN,WAAYN,EAAM,UAAA,CACnB,EAEKU,EAAY,SAAS,cAAc,KAAK,EAC9CH,EAAI,MAAMG,CAAS,EAEnB,MAAMC,EAAOD,EAAU,UACvB,OAAAH,EAAI,QAAQ,EAELI,OACO,CACP,MAAA,EAAA,CACT,CACD"}
@@ -1,27 +0,0 @@
1
- import { CurveType, BulletLegendItemInterface } from '@unovis/ts';
2
- import { PaginationPosition } from '../../types';
3
-
4
- declare const _default: <T>(__VLS_props: Awaited<typeof __VLS_setup>["props"], __VLS_ctx?: __VLS_Prettify<Pick<Awaited<typeof __VLS_setup>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
5
- props: __VLS_Prettify<__VLS_OmitKeepDiscriminatedUnion<(Partial<{}> & Omit<{} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>) & {
6
- data: T[];
7
- height: number;
8
- xLabel?: string;
9
- yLabel?: string;
10
- categories: Record<string, BulletLegendItemInterface>;
11
- xFormatter: (i: number, idx: number) => string;
12
- yFormatter?: (i: number, idx: number) => string;
13
- curveType?: CurveType;
14
- yNumTicks?: number;
15
- xNumTicks?: number;
16
- paginationPosition?: PaginationPosition;
17
- }, keyof import('vue').VNodeProps | keyof import('vue').AllowedComponentProps>> & {} & (import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps);
18
- expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
19
- attrs: any;
20
- slots: ReturnType<() => {}>;
21
- emit: typeof __VLS_emit;
22
- }>) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
23
- [key: string]: any;
24
- }> & {
25
- __ctx?: Awaited<typeof __VLS_setup>;
26
- };
27
- export default _default;
@@ -1,91 +0,0 @@
1
- import { defineComponent as g, computed as h, createApp as k, createElementBlock as s, openBlock as l, normalizeClass as v, createVNode as o, createElementVNode as b, unref as t, withCtx as T, Fragment as L, renderList as V, createBlock as x } from "vue";
2
- import { Position as m, CurveType as C } from "@unovis/ts";
3
- import { VisXYContainer as F, VisTooltip as N, VisLine as j, VisAxis as u, VisCrosshair as B, VisBulletLegend as w } from "@unovis/vue";
4
- import z from "../Tooltip.js";
5
- const E = { class: "flex items center justify-end" }, X = /* @__PURE__ */ g({
6
- __name: "LineChart",
7
- props: {
8
- data: {},
9
- height: {},
10
- xLabel: {},
11
- yLabel: {},
12
- categories: {},
13
- xFormatter: { type: Function },
14
- yFormatter: { type: Function },
15
- curveType: {},
16
- yNumTicks: {},
17
- xNumTicks: {},
18
- paginationPosition: {}
19
- },
20
- setup(p) {
21
- const n = p, d = (e) => Object.values(n.categories)[e].color, f = h(() => (e) => {
22
- if (typeof window > "u" || typeof document > "u")
23
- return "";
24
- try {
25
- const r = k(z, {
26
- data: e,
27
- categories: n.categories
28
- }), a = document.createElement("div");
29
- r.mount(a);
30
- const i = a.innerHTML;
31
- return r.unmount(), i;
32
- } catch {
33
- return "";
34
- }
35
- });
36
- return (e, r) => (l(), s("div", {
37
- class: v(["space-y-4 flex flex-col", {
38
- "flex-col-reverse": n.paginationPosition === "top"
39
- }])
40
- }, [
41
- o(t(F), {
42
- data: e.data,
43
- height: e.height
44
- }, {
45
- default: T(() => [
46
- o(t(N), {
47
- "horizontal-placement": t(m).Right,
48
- "vertical-placement": t(m).Top
49
- }, null, 8, ["horizontal-placement", "vertical-placement"]),
50
- (l(!0), s(L, null, V(Object.keys(n.categories), (a, i) => (l(), x(t(j), {
51
- key: i,
52
- x: (c, y) => y,
53
- y: (c) => c[a],
54
- color: d(i),
55
- "curve-type": e.curveType ?? t(C).MonotoneX
56
- }, null, 8, ["x", "y", "color", "curve-type"]))), 128)),
57
- o(t(u), {
58
- type: "x",
59
- "tick-format": e.xFormatter,
60
- "num-ticks": e.xNumTicks ?? 4,
61
- label: e.xLabel,
62
- "label-margin": 8,
63
- "domain-line": !1,
64
- "grid-line": !1
65
- }, null, 8, ["tick-format", "num-ticks", "label"]),
66
- o(t(u), {
67
- type: "y",
68
- "num-ticks": e.yNumTicks ?? 4,
69
- "tick-format": e.yFormatter,
70
- label: e.yLabel,
71
- "domain-line": !1
72
- }, null, 8, ["num-ticks", "tick-format", "label"]),
73
- o(t(B), {
74
- color: "#666",
75
- template: f.value
76
- }, null, 8, ["template"])
77
- ]),
78
- _: 1
79
- }, 8, ["data", "height"]),
80
- b("div", E, [
81
- o(t(w), {
82
- items: Object.values(e.categories)
83
- }, null, 8, ["items"])
84
- ])
85
- ], 2));
86
- }
87
- });
88
- export {
89
- X as default
90
- };
91
- //# sourceMappingURL=LineChart.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"LineChart.js","sources":["../../../src/components/Line/LineChart.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { computed, createApp } from \"vue\";\n\nimport { CurveType, BulletLegendItemInterface, Position } from \"@unovis/ts\";\n\nimport {\n VisAxis,\n VisBulletLegend,\n VisCrosshair,\n VisLine,\n VisXYContainer,\n VisTooltip,\n} from \"@unovis/vue\";\n\nimport Tooltip from \"./../Tooltip.vue\";\nimport { PaginationPosition } from \"../../types\";\n\ntype LineChartProps<T> = {\n data: T[];\n height: number;\n xLabel?: string;\n yLabel?: string;\n categories: Record<string, BulletLegendItemInterface>;\n xFormatter: (i: number, idx: number) => string;\n yFormatter?: (i: number, idx: number) => string;\n curveType?: CurveType;\n yNumTicks?: number;\n xNumTicks?: number;\n paginationPosition?: PaginationPosition;\n};\n\nconst props = defineProps<LineChartProps<T>>();\n\nconst color = (key: number) => Object.values(props.categories)[key].color;\n\nconst generateTooltip = computed(() => (d: T) => {\n if (typeof window === 'undefined' || typeof document === 'undefined') {\n return '';\n }\n \n try {\n const app = createApp(Tooltip, {\n data: d,\n categories: props.categories,\n });\n\n const container = document.createElement(\"div\");\n app.mount(container);\n\n const html = container.innerHTML;\n app.unmount();\n\n return html;\n } catch (error) {\n return '';\n }\n});\n</script>\n\n<template>\n <div\n class=\"space-y-4 flex flex-col\"\n :class=\"{\n 'flex-col-reverse': props.paginationPosition === 'top',\n }\"\n >\n <VisXYContainer :data=\"data\" :height=\"height\">\n <VisTooltip\n :horizontal-placement=\"Position.Right\"\n :vertical-placement=\"Position.Top\"\n />\n <template v-for=\"(i, iKey) in Object.keys(props.categories)\" :key=\"iKey\">\n <VisLine\n :x=\"(_: any, i: number) => i\"\n :y=\"(d: T) => d[i as keyof typeof d]\"\n :color=\"color(iKey)\"\n :curve-type=\"curveType ?? CurveType.MonotoneX\"\n />\n </template>\n <VisAxis\n type=\"x\"\n :tick-format=\"xFormatter\"\n :num-ticks=\"xNumTicks ?? 4\"\n :label=\"xLabel\"\n :label-margin=\"8\"\n :domain-line=\"false\"\n :grid-line=\"false\"\n />\n <VisAxis\n type=\"y\"\n :num-ticks=\"yNumTicks ?? 4\"\n :tick-format=\"yFormatter\"\n :label=\"yLabel\"\n :domain-line=\"false\"\n />\n <VisCrosshair color=\"#666\" :template=\"generateTooltip\" />\n </VisXYContainer>\n <div class=\"flex items center justify-end\">\n <VisBulletLegend :items=\"Object.values(categories)\" />\n </div>\n </div>\n</template>\n"],"names":["props","__props","color","key","generateTooltip","computed","d","app","createApp","Tooltip","container","html"],"mappings":";;;;;;;;;;;;;;;;;;;;AA+BA,UAAMA,IAAQC,GAERC,IAAQ,CAACC,MAAgB,OAAO,OAAOH,EAAM,UAAU,EAAEG,CAAG,EAAE,OAE9DC,IAAkBC,EAAS,MAAM,CAACC,MAAS;AAC/C,UAAI,OAAO,SAAW,OAAe,OAAO,WAAa;AAChD,eAAA;AAGL,UAAA;AACI,cAAAC,IAAMC,EAAUC,GAAS;AAAA,UAC7B,MAAMH;AAAA,UACN,YAAYN,EAAM;AAAA,QAAA,CACnB,GAEKU,IAAY,SAAS,cAAc,KAAK;AAC9C,QAAAH,EAAI,MAAMG,CAAS;AAEnB,cAAMC,IAAOD,EAAU;AACvB,eAAAH,EAAI,QAAQ,GAELI;AAAA,cACO;AACP,eAAA;AAAA,MAAA;AAAA,IACT,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./LineChart.cjs");exports.default=e.default;
2
- //# sourceMappingURL=LineChart2.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"LineChart2.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -1,5 +0,0 @@
1
- import f from "./LineChart.js";
2
- export {
3
- f as default
4
- };
5
- //# sourceMappingURL=LineChart2.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"LineChart2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1 +0,0 @@
1
- export { default as LineChart } from './LineChart';
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),s=e.defineComponent({__name:"Tooltip",props:{data:{},categories:{}},setup(r){const l=r,n=["_index","_stacked","_ending"],i=e.computed(()=>Object.entries(l.data).filter(([o,a])=>{var t;return!n.includes(o)&&((t=l.categories[o])==null?void 0:t.color)}));return(o,a)=>(e.openBlock(),e.createElementBlock("div",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.value,([t,c])=>(e.openBlock(),e.createElementBlock("div",{key:t,style:{display:"flex","align-items":"center","margin-bottom":"4px"}},[e.createElementVNode("span",{style:e.normalizeStyle([{width:"8px",height:"8px","border-radius":"4px","margin-right":"8px"},{backgroundColor:o.categories[t].color}])},null,4),e.createElementVNode("div",null,[e.createElementVNode("span",{style:e.normalizeStyle([{"font-weight":"600","margin-right":"8px"},{color:"var(--tooltip-label-color)"}])},e.toDisplayString(t)+":",1),e.createElementVNode("span",{style:e.normalizeStyle([{"font-weight":"400"},{color:"var(--tooltip-value-color)"}])},e.toDisplayString(c),1)])]))),128))]))}});exports.default=s;
2
- //# sourceMappingURL=Tooltip.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Tooltip.cjs","sources":["../../src/components/Tooltip.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T\">\nimport { BulletLegendItemInterface } from \"@unovis/ts\";\nimport { computed } from \"vue\";\n\nconst props = defineProps<{\n data: T;\n categories: Record<string, BulletLegendItemInterface>;\n}>();\n\nconst keyBlockList = [\"_index\", \"_stacked\", \"_ending\"];\n\nconst visibleEntries = computed(() => {\n return Object.entries(props.data).filter(\n ([key, _]) => !keyBlockList.includes(key) && props.categories[key]?.color\n );\n});\n</script>\n\n<template>\n <div>\n <div v-for=\"[key, value] in visibleEntries\" :key=\"key\" style=\"display: flex; align-items: center; margin-bottom: 4px;\">\n <span\n style=\"width: 8px; height: 8px; border-radius: 4px; margin-right: 8px;\"\n :style=\"{ backgroundColor: categories[key].color }\"\n ></span>\n <div>\n <span style=\"font-weight: 600; margin-right: 8px;\" :style=\"{ color: 'var(--tooltip-label-color)' }\">{{ key }}:</span>\n <span style=\"font-weight: 400;\" :style=\"{ color: 'var(--tooltip-value-color)' }\">{{ value }}</span>\n </div>\n </div>\n </div>\n</template>\n"],"names":["props","__props","keyBlockList","visibleEntries","computed","key","_","_a"],"mappings":"gNAIA,MAAMA,EAAQC,EAKRC,EAAe,CAAC,SAAU,WAAY,SAAS,EAE/CC,EAAiBC,EAAAA,SAAS,IACvB,OAAO,QAAQJ,EAAM,IAAI,EAAE,OAChC,CAAC,CAACK,EAAKC,CAAC,IAAM,OAAA,OAACJ,EAAa,SAASG,CAAG,KAAKE,EAAAP,EAAM,WAAWK,CAAG,IAApB,YAAAE,EAAuB,OACtE,CACD"}