vue-chrts 0.0.139 → 0.0.141

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 +1 @@
1
- {"version":3,"file":"AreaChart.cjs","sources":["../../../src/components/Area/AreaChart.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { computed, createApp } from \"vue\";\nimport type { BulletLegendItemInterface, NumericAccessor } from \"@unovis/ts\";\nimport { CurveType, Position } from \"@unovis/ts\";\nimport {\n VisArea,\n VisAxis,\n VisBulletLegend,\n VisCrosshair,\n VisLine,\n VisTooltip,\n VisXYContainer,\n} from \"@unovis/vue\";\n\nimport Tooltip from \"./../Tooltip.vue\";\nimport { PaginationPosition } from \"../..\";\n\ntype AreaChartProps<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 | number;\n curveType?: CurveType;\n xNumTicks?: number;\n yNumTicks?: number;\n hideLegend?: boolean;\n hideTooltip?: boolean;\n gridLineX?: boolean;\n domainLineX?: boolean;\n gridLineY?: boolean;\n domainLineY?: boolean;\n paginationPoisition?: PaginationPosition;\n};\n\nconst props = withDefaults(defineProps<AreaChartProps<T>>(), {\n xNumTicks: (props) =>\n props.data.length > 24 ? 24 / 4 : props.data.length - 1,\n yNumTicks: (props) =>\n props.data.length > 24 ? 24 / 4 : props.data.length - 1,\n});\n\nconst colors = Object.values(props.categories).map((c) => c.color);\n\nconst generateTooltip = computed(() => (d: T) => {\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});\n\nfunction accessors(id: string): { y: NumericAccessor<T>; color: string } {\n return {\n y: (d: T) => Number(d[id as keyof typeof d]),\n color: props.categories[id]?.color ?? \"#3b82f6\",\n };\n}\n\nconst svgDefs = colors\n .map(\n (color, index) => `\n <linearGradient id=\"gradient${index}-${color}\" gradientTransform=\"rotate(90)\">\n <stop offset=\"0%\" stop-color=\"${color}\" stop-opacity=\"1\" />\n <stop offset=\"100%\" stop-color=\"${color}\" stop-opacity=\"0\" />\n </linearGradient>\n`\n )\n .join(\"\");\n</script>\n\n<template>\n <div\n class=\"flex flex-col space-y-4\"\n :class=\"{\n 'flex-col-reverse': props.paginationPoisition === 'top',\n }\"\n >\n <VisXYContainer :data=\"data\" :height=\"height\" :svg-defs=\"svgDefs\">\n <VisTooltip\n v-if=\"!hideTooltip\"\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 <VisArea\n :x=\"(_: T, i: number) => i\"\n v-bind=\"accessors(i)\"\n :color=\"`url(#gradient${iKey}-${colors[iKey]})`\"\n :opacity=\"0.5\"\n :curve-type=\"curveType ?? CurveType.MonotoneX\"\n />\n <VisLine\n :x=\"(_: any, i: number) => i\"\n :y=\"(d: T) => d[i as keyof typeof d]\"\n :color=\"colors[iKey]\"\n :curve-type=\"curveType ?? CurveType.MonotoneX\"\n />\n </template>\n\n <VisAxis\n type=\"x\"\n :tick-format=\"xFormatter\"\n :num-ticks=\"xNumTicks\"\n :label=\"xLabel\"\n :grid-line=\"gridLineX\"\n :domain-line=\"domainLineX\"\n :tick-line=\"!!gridLineX\"\n />\n <VisAxis\n type=\"y\"\n :num-ticks=\"yNumTicks ?? data.length\"\n :tick-format=\"yFormatter\"\n :label=\"yLabel\"\n :grid-line=\"gridLineY\"\n :domain-line=\"domainLineY\"\n :tick-line=\"!!gridLineY\"\n />\n <VisCrosshair\n v-if=\"!hideTooltip\"\n color=\"#666\"\n :template=\"generateTooltip\"\n />\n </VisXYContainer>\n <div v-if=\"!hideLegend\" class=\"flex items center justify-end\">\n <VisBulletLegend :items=\"Object.values(categories)\" />\n </div>\n </div>\n</template>\n"],"names":["props","__props","colors","c","generateTooltip","computed","d","app","createApp","Tooltip","container","html","accessors","id","_a","svgDefs","color","index"],"mappings":"osBAqCA,MAAMA,EAAQC,EAORC,EAAS,OAAO,OAAOF,EAAM,UAAU,EAAE,IAAKG,GAAMA,EAAE,KAAK,EAE3DC,EAAkBC,EAAAA,SAAS,IAAOC,GAAS,CACzC,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,CAAA,CACR,EAED,SAASC,EAAUC,EAAsD,OAChE,MAAA,CACL,EAAIP,GAAS,OAAOA,EAAEO,CAAoB,CAAC,EAC3C,QAAOC,EAAAd,EAAM,WAAWa,CAAE,IAAnB,YAAAC,EAAsB,QAAS,SACxC,CAAA,CAGF,MAAMC,EAAUb,EACb,IACC,CAACc,EAAOC,IAAU;AAAA,gCACUA,CAAK,IAAID,CAAK;AAAA,oCACVA,CAAK;AAAA,sCACHA,CAAK;AAAA;AAAA,CAAA,EAIxC,KAAK,EAAE"}
1
+ {"version":3,"file":"AreaChart.cjs","sources":["../../../src/components/Area/AreaChart.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { computed, createApp } from \"vue\";\nimport type { BulletLegendItemInterface, NumericAccessor } from \"@unovis/ts\";\nimport { CurveType, Position } from \"@unovis/ts\";\nimport {\n VisArea,\n VisAxis,\n VisBulletLegend,\n VisCrosshair,\n VisLine,\n VisTooltip,\n VisXYContainer,\n} from \"@unovis/vue\";\n\nimport Tooltip from \"./../Tooltip.vue\";\nimport { PaginationPosition } from \"../../types\";\n\ntype AreaChartProps<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 | number;\n curveType?: CurveType;\n xNumTicks?: number;\n yNumTicks?: number;\n hideLegend?: boolean;\n hideTooltip?: boolean;\n gridLineX?: boolean;\n domainLineX?: boolean;\n gridLineY?: boolean;\n domainLineY?: boolean;\n paginationPoisition?: PaginationPosition;\n};\n\nconst props = withDefaults(defineProps<AreaChartProps<T>>(), {\n xNumTicks: (props) =>\n props.data.length > 24 ? 24 / 4 : props.data.length - 1,\n yNumTicks: (props) =>\n props.data.length > 24 ? 24 / 4 : props.data.length - 1,\n});\n\nconst colors = Object.values(props.categories).map((c) => c.color);\n\nconst generateTooltip = computed(() => (d: T) => {\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});\n\nfunction accessors(id: string): { y: NumericAccessor<T>; color: string } {\n return {\n y: (d: T) => Number(d[id as keyof typeof d]),\n color: props.categories[id]?.color ?? \"#3b82f6\",\n };\n}\n\nconst svgDefs = colors\n .map(\n (color, index) => `\n <linearGradient id=\"gradient${index}-${color}\" gradientTransform=\"rotate(90)\">\n <stop offset=\"0%\" stop-color=\"${color}\" stop-opacity=\"1\" />\n <stop offset=\"100%\" stop-color=\"${color}\" stop-opacity=\"0\" />\n </linearGradient>\n`\n )\n .join(\"\");\n</script>\n\n<template>\n <div\n class=\"flex flex-col space-y-4\"\n :class=\"{\n 'flex-col-reverse': props.paginationPoisition === 'top',\n }\"\n >\n <VisXYContainer :data=\"data\" :height=\"height\" :svg-defs=\"svgDefs\">\n <VisTooltip\n v-if=\"!hideTooltip\"\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 <VisArea\n :x=\"(_: T, i: number) => i\"\n v-bind=\"accessors(i)\"\n :color=\"`url(#gradient${iKey}-${colors[iKey]})`\"\n :opacity=\"0.5\"\n :curve-type=\"curveType ?? CurveType.MonotoneX\"\n />\n <VisLine\n :x=\"(_: any, i: number) => i\"\n :y=\"(d: T) => d[i as keyof typeof d]\"\n :color=\"colors[iKey]\"\n :curve-type=\"curveType ?? CurveType.MonotoneX\"\n />\n </template>\n\n <VisAxis\n type=\"x\"\n :tick-format=\"xFormatter\"\n :num-ticks=\"xNumTicks\"\n :label=\"xLabel\"\n :grid-line=\"gridLineX\"\n :domain-line=\"domainLineX\"\n :tick-line=\"!!gridLineX\"\n />\n <VisAxis\n type=\"y\"\n :num-ticks=\"yNumTicks ?? data.length\"\n :tick-format=\"yFormatter\"\n :label=\"yLabel\"\n :grid-line=\"gridLineY\"\n :domain-line=\"domainLineY\"\n :tick-line=\"!!gridLineY\"\n />\n <VisCrosshair\n v-if=\"!hideTooltip\"\n color=\"#666\"\n :template=\"generateTooltip\"\n />\n </VisXYContainer>\n <div v-if=\"!hideLegend\" class=\"flex items center justify-end\">\n <VisBulletLegend :items=\"Object.values(categories)\" />\n </div>\n </div>\n</template>\n"],"names":["props","__props","colors","c","generateTooltip","computed","d","app","createApp","Tooltip","container","html","accessors","id","_a","svgDefs","color","index"],"mappings":"osBAqCA,MAAMA,EAAQC,EAORC,EAAS,OAAO,OAAOF,EAAM,UAAU,EAAE,IAAKG,GAAMA,EAAE,KAAK,EAE3DC,EAAkBC,EAAAA,SAAS,IAAOC,GAAS,CACzC,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,CAAA,CACR,EAED,SAASC,EAAUC,EAAsD,OAChE,MAAA,CACL,EAAIP,GAAS,OAAOA,EAAEO,CAAoB,CAAC,EAC3C,QAAOC,EAAAd,EAAM,WAAWa,CAAE,IAAnB,YAAAC,EAAsB,QAAS,SACxC,CAAA,CAGF,MAAMC,EAAUb,EACb,IACC,CAACc,EAAOC,IAAU;AAAA,gCACUA,CAAK,IAAID,CAAK;AAAA,oCACVA,CAAK;AAAA,sCACHA,CAAK;AAAA;AAAA,CAAA,EAIxC,KAAK,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"file":"AreaChart.js","sources":["../../../src/components/Area/AreaChart.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { computed, createApp } from \"vue\";\nimport type { BulletLegendItemInterface, NumericAccessor } from \"@unovis/ts\";\nimport { CurveType, Position } from \"@unovis/ts\";\nimport {\n VisArea,\n VisAxis,\n VisBulletLegend,\n VisCrosshair,\n VisLine,\n VisTooltip,\n VisXYContainer,\n} from \"@unovis/vue\";\n\nimport Tooltip from \"./../Tooltip.vue\";\nimport { PaginationPosition } from \"../..\";\n\ntype AreaChartProps<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 | number;\n curveType?: CurveType;\n xNumTicks?: number;\n yNumTicks?: number;\n hideLegend?: boolean;\n hideTooltip?: boolean;\n gridLineX?: boolean;\n domainLineX?: boolean;\n gridLineY?: boolean;\n domainLineY?: boolean;\n paginationPoisition?: PaginationPosition;\n};\n\nconst props = withDefaults(defineProps<AreaChartProps<T>>(), {\n xNumTicks: (props) =>\n props.data.length > 24 ? 24 / 4 : props.data.length - 1,\n yNumTicks: (props) =>\n props.data.length > 24 ? 24 / 4 : props.data.length - 1,\n});\n\nconst colors = Object.values(props.categories).map((c) => c.color);\n\nconst generateTooltip = computed(() => (d: T) => {\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});\n\nfunction accessors(id: string): { y: NumericAccessor<T>; color: string } {\n return {\n y: (d: T) => Number(d[id as keyof typeof d]),\n color: props.categories[id]?.color ?? \"#3b82f6\",\n };\n}\n\nconst svgDefs = colors\n .map(\n (color, index) => `\n <linearGradient id=\"gradient${index}-${color}\" gradientTransform=\"rotate(90)\">\n <stop offset=\"0%\" stop-color=\"${color}\" stop-opacity=\"1\" />\n <stop offset=\"100%\" stop-color=\"${color}\" stop-opacity=\"0\" />\n </linearGradient>\n`\n )\n .join(\"\");\n</script>\n\n<template>\n <div\n class=\"flex flex-col space-y-4\"\n :class=\"{\n 'flex-col-reverse': props.paginationPoisition === 'top',\n }\"\n >\n <VisXYContainer :data=\"data\" :height=\"height\" :svg-defs=\"svgDefs\">\n <VisTooltip\n v-if=\"!hideTooltip\"\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 <VisArea\n :x=\"(_: T, i: number) => i\"\n v-bind=\"accessors(i)\"\n :color=\"`url(#gradient${iKey}-${colors[iKey]})`\"\n :opacity=\"0.5\"\n :curve-type=\"curveType ?? CurveType.MonotoneX\"\n />\n <VisLine\n :x=\"(_: any, i: number) => i\"\n :y=\"(d: T) => d[i as keyof typeof d]\"\n :color=\"colors[iKey]\"\n :curve-type=\"curveType ?? CurveType.MonotoneX\"\n />\n </template>\n\n <VisAxis\n type=\"x\"\n :tick-format=\"xFormatter\"\n :num-ticks=\"xNumTicks\"\n :label=\"xLabel\"\n :grid-line=\"gridLineX\"\n :domain-line=\"domainLineX\"\n :tick-line=\"!!gridLineX\"\n />\n <VisAxis\n type=\"y\"\n :num-ticks=\"yNumTicks ?? data.length\"\n :tick-format=\"yFormatter\"\n :label=\"yLabel\"\n :grid-line=\"gridLineY\"\n :domain-line=\"domainLineY\"\n :tick-line=\"!!gridLineY\"\n />\n <VisCrosshair\n v-if=\"!hideTooltip\"\n color=\"#666\"\n :template=\"generateTooltip\"\n />\n </VisXYContainer>\n <div v-if=\"!hideLegend\" class=\"flex items center justify-end\">\n <VisBulletLegend :items=\"Object.values(categories)\" />\n </div>\n </div>\n</template>\n"],"names":["props","__props","colors","c","generateTooltip","computed","d","app","createApp","Tooltip","container","html","accessors","id","_a","svgDefs","color","index"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA,UAAMA,IAAQC,GAORC,IAAS,OAAO,OAAOF,EAAM,UAAU,EAAE,IAAI,CAACG,MAAMA,EAAE,KAAK,GAE3DC,IAAkBC,EAAS,MAAM,CAACC,MAAS;AACzC,YAAAC,IAAMC,EAAUC,GAAS;AAAA,QAC7B,MAAMH;AAAA,QACN,YAAYN,EAAM;AAAA,MAAA,CACnB,GAEKU,IAAY,SAAS,cAAc,KAAK;AAC9C,MAAAH,EAAI,MAAMG,CAAS;AAEnB,YAAMC,IAAOD,EAAU;AACvB,aAAAH,EAAI,QAAQ,GAELI;AAAA,IAAA,CACR;AAED,aAASC,EAAUC,GAAsD;;AAChE,aAAA;AAAA,QACL,GAAG,CAACP,MAAS,OAAOA,EAAEO,CAAoB,CAAC;AAAA,QAC3C,SAAOC,IAAAd,EAAM,WAAWa,CAAE,MAAnB,gBAAAC,EAAsB,UAAS;AAAA,MACxC;AAAA,IAAA;AAGF,UAAMC,IAAUb,EACb;AAAA,MACC,CAACc,GAAOC,MAAU;AAAA,gCACUA,CAAK,IAAID,CAAK;AAAA,oCACVA,CAAK;AAAA,sCACHA,CAAK;AAAA;AAAA;AAAA,IAAA,EAIxC,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AreaChart.js","sources":["../../../src/components/Area/AreaChart.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { computed, createApp } from \"vue\";\nimport type { BulletLegendItemInterface, NumericAccessor } from \"@unovis/ts\";\nimport { CurveType, Position } from \"@unovis/ts\";\nimport {\n VisArea,\n VisAxis,\n VisBulletLegend,\n VisCrosshair,\n VisLine,\n VisTooltip,\n VisXYContainer,\n} from \"@unovis/vue\";\n\nimport Tooltip from \"./../Tooltip.vue\";\nimport { PaginationPosition } from \"../../types\";\n\ntype AreaChartProps<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 | number;\n curveType?: CurveType;\n xNumTicks?: number;\n yNumTicks?: number;\n hideLegend?: boolean;\n hideTooltip?: boolean;\n gridLineX?: boolean;\n domainLineX?: boolean;\n gridLineY?: boolean;\n domainLineY?: boolean;\n paginationPoisition?: PaginationPosition;\n};\n\nconst props = withDefaults(defineProps<AreaChartProps<T>>(), {\n xNumTicks: (props) =>\n props.data.length > 24 ? 24 / 4 : props.data.length - 1,\n yNumTicks: (props) =>\n props.data.length > 24 ? 24 / 4 : props.data.length - 1,\n});\n\nconst colors = Object.values(props.categories).map((c) => c.color);\n\nconst generateTooltip = computed(() => (d: T) => {\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});\n\nfunction accessors(id: string): { y: NumericAccessor<T>; color: string } {\n return {\n y: (d: T) => Number(d[id as keyof typeof d]),\n color: props.categories[id]?.color ?? \"#3b82f6\",\n };\n}\n\nconst svgDefs = colors\n .map(\n (color, index) => `\n <linearGradient id=\"gradient${index}-${color}\" gradientTransform=\"rotate(90)\">\n <stop offset=\"0%\" stop-color=\"${color}\" stop-opacity=\"1\" />\n <stop offset=\"100%\" stop-color=\"${color}\" stop-opacity=\"0\" />\n </linearGradient>\n`\n )\n .join(\"\");\n</script>\n\n<template>\n <div\n class=\"flex flex-col space-y-4\"\n :class=\"{\n 'flex-col-reverse': props.paginationPoisition === 'top',\n }\"\n >\n <VisXYContainer :data=\"data\" :height=\"height\" :svg-defs=\"svgDefs\">\n <VisTooltip\n v-if=\"!hideTooltip\"\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 <VisArea\n :x=\"(_: T, i: number) => i\"\n v-bind=\"accessors(i)\"\n :color=\"`url(#gradient${iKey}-${colors[iKey]})`\"\n :opacity=\"0.5\"\n :curve-type=\"curveType ?? CurveType.MonotoneX\"\n />\n <VisLine\n :x=\"(_: any, i: number) => i\"\n :y=\"(d: T) => d[i as keyof typeof d]\"\n :color=\"colors[iKey]\"\n :curve-type=\"curveType ?? CurveType.MonotoneX\"\n />\n </template>\n\n <VisAxis\n type=\"x\"\n :tick-format=\"xFormatter\"\n :num-ticks=\"xNumTicks\"\n :label=\"xLabel\"\n :grid-line=\"gridLineX\"\n :domain-line=\"domainLineX\"\n :tick-line=\"!!gridLineX\"\n />\n <VisAxis\n type=\"y\"\n :num-ticks=\"yNumTicks ?? data.length\"\n :tick-format=\"yFormatter\"\n :label=\"yLabel\"\n :grid-line=\"gridLineY\"\n :domain-line=\"domainLineY\"\n :tick-line=\"!!gridLineY\"\n />\n <VisCrosshair\n v-if=\"!hideTooltip\"\n color=\"#666\"\n :template=\"generateTooltip\"\n />\n </VisXYContainer>\n <div v-if=\"!hideLegend\" class=\"flex items center justify-end\">\n <VisBulletLegend :items=\"Object.values(categories)\" />\n </div>\n </div>\n</template>\n"],"names":["props","__props","colors","c","generateTooltip","computed","d","app","createApp","Tooltip","container","html","accessors","id","_a","svgDefs","color","index"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA,UAAMA,IAAQC,GAORC,IAAS,OAAO,OAAOF,EAAM,UAAU,EAAE,IAAI,CAACG,MAAMA,EAAE,KAAK,GAE3DC,IAAkBC,EAAS,MAAM,CAACC,MAAS;AACzC,YAAAC,IAAMC,EAAUC,GAAS;AAAA,QAC7B,MAAMH;AAAA,QACN,YAAYN,EAAM;AAAA,MAAA,CACnB,GAEKU,IAAY,SAAS,cAAc,KAAK;AAC9C,MAAAH,EAAI,MAAMG,CAAS;AAEnB,YAAMC,IAAOD,EAAU;AACvB,aAAAH,EAAI,QAAQ,GAELI;AAAA,IAAA,CACR;AAED,aAASC,EAAUC,GAAsD;;AAChE,aAAA;AAAA,QACL,GAAG,CAACP,MAAS,OAAOA,EAAEO,CAAoB,CAAC;AAAA,QAC3C,SAAOC,IAAAd,EAAM,WAAWa,CAAE,MAAnB,gBAAAC,EAAsB,UAAS;AAAA,MACxC;AAAA,IAAA;AAGF,UAAMC,IAAUb,EACb;AAAA,MACC,CAACc,GAAOC,MAAU;AAAA,gCACUA,CAAK,IAAID,CAAK;AAAA,oCACVA,CAAK;AAAA,sCACHA,CAAK;AAAA;AAAA;AAAA,IAAA,EAIxC,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,5 +1,5 @@
1
1
  import { BulletLegendItemInterface, CurveType } from '@unovis/ts';
2
- import { PaginationPosition } from '../..';
2
+ import { PaginationPosition } from '../../types';
3
3
 
4
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
5
  props: __VLS_Prettify<__VLS_OmitKeepDiscriminatedUnion<(Partial<{}> & Omit<{} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>) & {
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),r=require("@unovis/vue"),i=require("@unovis/ts"),u={class:"flex flex-col space-y-4"},l={class:"flex items center justify-end"},d=e.defineComponent({__name:"AreaStackedChart",props:{data:{},categories:{}},setup(s){const o=s,a=t=>Number.parseInt(t.time),n=[t=>t.firstTime,t=>t.returning];return(t,f)=>(e.openBlock(),e.createElementBlock("div",u,[e.createVNode(e.unref(r.VisXYContainer),{data:t.data,height:200},{default:e.withCtx(()=>[e.createVNode(e.unref(r.VisArea),{x:a,y:n,color:Object.values(o.categories).map(c=>c.color),"curve-type":e.unref(i.CurveType).Linear},null,8,["color","curve-type"]),e.createVNode(e.unref(r.VisAxis),{type:"x",label:"Time","num-ticks":12}),e.createVNode(e.unref(r.VisAxis),{type:"y",label:"Number of visitors","num-ticks":3})]),_:1},8,["data"]),e.createElementVNode("div",l,[e.createVNode(e.unref(r.VisBulletLegend),{items:Object.values(t.categories)},null,8,["items"])])]))}});exports.default=d;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),r=require("@unovis/vue"),p=require("@unovis/ts"),d=require("../Tooltip.cjs"),m={class:"flex flex-col space-y-4"},f={class:"flex items center justify-end"},_=e.defineComponent({__name:"AreaStackedChart",props:{data:{},categories:{},hideTooltip:{type:Boolean}},setup(s){const a=s,c=e.computed(()=>t=>{const n=e.createApp(d.default,{data:t,categories:a.categories}),o=document.createElement("div");n.mount(o);const l=o.innerHTML;return n.unmount(),l}),i=t=>Number.parseInt(t.time),u=[t=>t.firstTime,t=>t.returning];return(t,n)=>(e.openBlock(),e.createElementBlock("div",m,[e.createVNode(e.unref(r.VisXYContainer),{data:t.data,height:200},{default:e.withCtx(()=>[e.createVNode(e.unref(r.VisArea),{x:i,y:u,color:Object.values(a.categories).map(o=>o.color),"curve-type":e.unref(p.CurveType).Linear},null,8,["color","curve-type"]),e.createVNode(e.unref(r.VisAxis),{type:"x",label:"Time","num-ticks":12}),e.createVNode(e.unref(r.VisAxis),{type:"y",label:"Number of visitors","num-ticks":3}),t.hideTooltip?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(e.unref(r.VisCrosshair),{key:0,color:"#666",template:c.value},null,8,["template"]))]),_:1},8,["data"]),e.createElementVNode("div",f,[e.createVNode(e.unref(r.VisBulletLegend),{items:Object.values(t.categories)},null,8,["items"])])]))}});exports.default=_;
2
2
  //# sourceMappingURL=AreaStackedChart.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"AreaStackedChart.cjs","sources":["../../../src/components/AreaStacked/AreaStackedChart.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { VisXYContainer, VisAxis, VisArea, VisBulletLegend } from '@unovis/vue'\nimport { BulletLegendItemInterface, CurveType } from '@unovis/ts'\n\nexport type AreaStackedChartProps<T> = {\n data: T[];\n categories: Record<string, BulletLegendItemInterface>;\n }\n\nconst props = defineProps<AreaStackedChartProps<T>>()\n\nconst x = (d: any) => {\n return Number.parseInt(d.time)\n}\nconst y = [\n (d: any) => d.firstTime,\n (d: any) => d.returning\n]\n</script>\n\n<template>\n <div class=\"flex flex-col space-y-4\">\n <VisXYContainer\n :data=\"data\"\n :height=\"200\"\n >\n <VisArea\n :x=\"x\"\n :y=\"y\"\n :color=\"Object.values(props.categories).map((i) => i.color) \"\n :curve-type=\"CurveType.Linear\"\n />\n <VisAxis\n type=\"x\"\n label=\"Time\"\n :num-ticks=\"12\"\n\n />\n <VisAxis\n type=\"y\"\n label=\"Number of visitors\"\n :num-ticks=\"3\"\n />\n </VisXYContainer>\n <div class=\"flex items center justify-end\">\n <VisBulletLegend\n :items=\"Object.values(categories)\"\n />\n </div>\n </div>\n</template>"],"names":["props","__props","x","d","y"],"mappings":"wVASA,MAAMA,EAAQC,EAERC,EAAKC,GACF,OAAO,SAASA,EAAE,IAAI,EAEzBC,EAAI,CACPD,GAAWA,EAAE,UACbA,GAAWA,EAAE,SAChB"}
1
+ {"version":3,"file":"AreaStackedChart.cjs","sources":["../../../src/components/AreaStacked/AreaStackedChart.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { VisXYContainer, VisAxis, VisArea, VisBulletLegend, VisCrosshair } from \"@unovis/vue\";\nimport { BulletLegendItemInterface, CurveType } from \"@unovis/ts\";\nimport Tooltip from \"./../Tooltip.vue\";\nimport { computed, createApp } from \"vue\";\n\nexport type AreaStackedChartProps<T> = {\n data: T[];\n categories: Record<string, BulletLegendItemInterface>;\n hideTooltip?: boolean;\n};\n\nconst props = defineProps<AreaStackedChartProps<T>>();\n\nconst generateTooltip = computed(() => (d: T) => {\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});\n\nconst x = (d: any) => {\n return Number.parseInt(d.time);\n};\nconst y = [(d: any) => d.firstTime, (d: any) => d.returning];\n</script>\n\n<template>\n <div class=\"flex flex-col space-y-4\">\n <VisXYContainer :data=\"data\" :height=\"200\">\n <VisArea\n :x=\"x\"\n :y=\"y\"\n :color=\"Object.values(props.categories).map((i) => i.color)\"\n :curve-type=\"CurveType.Linear\"\n />\n <VisAxis type=\"x\" label=\"Time\" :num-ticks=\"12\" />\n <VisAxis type=\"y\" label=\"Number of visitors\" :num-ticks=\"3\" />\n <VisCrosshair\n v-if=\"!hideTooltip\"\n color=\"#666\"\n :template=\"generateTooltip\"\n />\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","generateTooltip","computed","d","app","createApp","Tooltip","container","html","x","y"],"mappings":"+YAYA,MAAMA,EAAQC,EAERC,EAAkBC,EAAAA,SAAS,IAAOC,GAAS,CACzC,MAAAC,EAAMC,YAAUC,UAAS,CAC7B,KAAMH,EACN,WAAYJ,EAAM,UAAA,CACnB,EAEKQ,EAAY,SAAS,cAAc,KAAK,EAC9CH,EAAI,MAAMG,CAAS,EAEnB,MAAMC,EAAOD,EAAU,UACvB,OAAAH,EAAI,QAAQ,EAELI,CAAA,CACR,EAEKC,EAAKN,GACF,OAAO,SAASA,EAAE,IAAI,EAEzBO,EAAI,CAAEP,GAAWA,EAAE,UAAYA,GAAWA,EAAE,SAAS"}
@@ -1,44 +1,56 @@
1
- import { defineComponent as l, createElementBlock as m, openBlock as u, createVNode as r, createElementVNode as p, unref as t, withCtx as d } from "vue";
2
- import { VisXYContainer as f, VisArea as y, VisAxis as s, VisBulletLegend as _ } from "@unovis/vue";
3
- import { CurveType as v } from "@unovis/ts";
4
- const h = { class: "flex flex-col space-y-4" }, x = { class: "flex items center justify-end" }, C = /* @__PURE__ */ l({
1
+ import { defineComponent as d, computed as f, createApp as h, createElementBlock as y, openBlock as i, createVNode as o, createElementVNode as v, unref as t, withCtx as _, createBlock as g, createCommentVNode as V } from "vue";
2
+ import { VisXYContainer as k, VisArea as C, VisAxis as s, VisCrosshair as T, VisBulletLegend as b } from "@unovis/vue";
3
+ import { CurveType as x } from "@unovis/ts";
4
+ import B from "../Tooltip.js";
5
+ const N = { class: "flex flex-col space-y-4" }, A = { class: "flex items center justify-end" }, w = /* @__PURE__ */ d({
5
6
  __name: "AreaStackedChart",
6
7
  props: {
7
8
  data: {},
8
- categories: {}
9
+ categories: {},
10
+ hideTooltip: { type: Boolean }
9
11
  },
10
- setup(o) {
11
- const a = o, i = (e) => Number.parseInt(e.time), c = [
12
- (e) => e.firstTime,
13
- (e) => e.returning
14
- ];
15
- return (e, b) => (u(), m("div", h, [
16
- r(t(f), {
12
+ setup(c) {
13
+ const n = c, l = f(() => (e) => {
14
+ const a = h(B, {
15
+ data: e,
16
+ categories: n.categories
17
+ }), r = document.createElement("div");
18
+ a.mount(r);
19
+ const u = r.innerHTML;
20
+ return a.unmount(), u;
21
+ }), m = (e) => Number.parseInt(e.time), p = [(e) => e.firstTime, (e) => e.returning];
22
+ return (e, a) => (i(), y("div", N, [
23
+ o(t(k), {
17
24
  data: e.data,
18
25
  height: 200
19
26
  }, {
20
- default: d(() => [
21
- r(t(y), {
22
- x: i,
23
- y: c,
24
- color: Object.values(a.categories).map((n) => n.color),
25
- "curve-type": t(v).Linear
27
+ default: _(() => [
28
+ o(t(C), {
29
+ x: m,
30
+ y: p,
31
+ color: Object.values(n.categories).map((r) => r.color),
32
+ "curve-type": t(x).Linear
26
33
  }, null, 8, ["color", "curve-type"]),
27
- r(t(s), {
34
+ o(t(s), {
28
35
  type: "x",
29
36
  label: "Time",
30
37
  "num-ticks": 12
31
38
  }),
32
- r(t(s), {
39
+ o(t(s), {
33
40
  type: "y",
34
41
  label: "Number of visitors",
35
42
  "num-ticks": 3
36
- })
43
+ }),
44
+ e.hideTooltip ? V("", !0) : (i(), g(t(T), {
45
+ key: 0,
46
+ color: "#666",
47
+ template: l.value
48
+ }, null, 8, ["template"]))
37
49
  ]),
38
50
  _: 1
39
51
  }, 8, ["data"]),
40
- p("div", x, [
41
- r(t(_), {
52
+ v("div", A, [
53
+ o(t(b), {
42
54
  items: Object.values(e.categories)
43
55
  }, null, 8, ["items"])
44
56
  ])
@@ -46,6 +58,6 @@ const h = { class: "flex flex-col space-y-4" }, x = { class: "flex items center
46
58
  }
47
59
  });
48
60
  export {
49
- C as default
61
+ w as default
50
62
  };
51
63
  //# sourceMappingURL=AreaStackedChart.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"AreaStackedChart.js","sources":["../../../src/components/AreaStacked/AreaStackedChart.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { VisXYContainer, VisAxis, VisArea, VisBulletLegend } from '@unovis/vue'\nimport { BulletLegendItemInterface, CurveType } from '@unovis/ts'\n\nexport type AreaStackedChartProps<T> = {\n data: T[];\n categories: Record<string, BulletLegendItemInterface>;\n }\n\nconst props = defineProps<AreaStackedChartProps<T>>()\n\nconst x = (d: any) => {\n return Number.parseInt(d.time)\n}\nconst y = [\n (d: any) => d.firstTime,\n (d: any) => d.returning\n]\n</script>\n\n<template>\n <div class=\"flex flex-col space-y-4\">\n <VisXYContainer\n :data=\"data\"\n :height=\"200\"\n >\n <VisArea\n :x=\"x\"\n :y=\"y\"\n :color=\"Object.values(props.categories).map((i) => i.color) \"\n :curve-type=\"CurveType.Linear\"\n />\n <VisAxis\n type=\"x\"\n label=\"Time\"\n :num-ticks=\"12\"\n\n />\n <VisAxis\n type=\"y\"\n label=\"Number of visitors\"\n :num-ticks=\"3\"\n />\n </VisXYContainer>\n <div class=\"flex items center justify-end\">\n <VisBulletLegend\n :items=\"Object.values(categories)\"\n />\n </div>\n </div>\n</template>"],"names":["props","__props","x","d","y"],"mappings":";;;;;;;;;;AASA,UAAMA,IAAQC,GAERC,IAAI,CAACC,MACF,OAAO,SAASA,EAAE,IAAI,GAEzBC,IAAI;AAAA,MACR,CAACD,MAAWA,EAAE;AAAA,MACd,CAACA,MAAWA,EAAE;AAAA,IAChB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AreaStackedChart.js","sources":["../../../src/components/AreaStacked/AreaStackedChart.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { VisXYContainer, VisAxis, VisArea, VisBulletLegend, VisCrosshair } from \"@unovis/vue\";\nimport { BulletLegendItemInterface, CurveType } from \"@unovis/ts\";\nimport Tooltip from \"./../Tooltip.vue\";\nimport { computed, createApp } from \"vue\";\n\nexport type AreaStackedChartProps<T> = {\n data: T[];\n categories: Record<string, BulletLegendItemInterface>;\n hideTooltip?: boolean;\n};\n\nconst props = defineProps<AreaStackedChartProps<T>>();\n\nconst generateTooltip = computed(() => (d: T) => {\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});\n\nconst x = (d: any) => {\n return Number.parseInt(d.time);\n};\nconst y = [(d: any) => d.firstTime, (d: any) => d.returning];\n</script>\n\n<template>\n <div class=\"flex flex-col space-y-4\">\n <VisXYContainer :data=\"data\" :height=\"200\">\n <VisArea\n :x=\"x\"\n :y=\"y\"\n :color=\"Object.values(props.categories).map((i) => i.color)\"\n :curve-type=\"CurveType.Linear\"\n />\n <VisAxis type=\"x\" label=\"Time\" :num-ticks=\"12\" />\n <VisAxis type=\"y\" label=\"Number of visitors\" :num-ticks=\"3\" />\n <VisCrosshair\n v-if=\"!hideTooltip\"\n color=\"#666\"\n :template=\"generateTooltip\"\n />\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","generateTooltip","computed","d","app","createApp","Tooltip","container","html","x","y"],"mappings":";;;;;;;;;;;;AAYA,UAAMA,IAAQC,GAERC,IAAkBC,EAAS,MAAM,CAACC,MAAS;AACzC,YAAAC,IAAMC,EAAUC,GAAS;AAAA,QAC7B,MAAMH;AAAA,QACN,YAAYJ,EAAM;AAAA,MAAA,CACnB,GAEKQ,IAAY,SAAS,cAAc,KAAK;AAC9C,MAAAH,EAAI,MAAMG,CAAS;AAEnB,YAAMC,IAAOD,EAAU;AACvB,aAAAH,EAAI,QAAQ,GAELI;AAAA,IAAA,CACR,GAEKC,IAAI,CAACN,MACF,OAAO,SAASA,EAAE,IAAI,GAEzBO,IAAI,CAAC,CAACP,MAAWA,EAAE,WAAW,CAACA,MAAWA,EAAE,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -3,6 +3,7 @@ import { BulletLegendItemInterface } from '@unovis/ts';
3
3
  export type AreaStackedChartProps<T> = {
4
4
  data: T[];
5
5
  categories: Record<string, BulletLegendItemInterface>;
6
+ hideTooltip?: boolean;
6
7
  };
7
8
  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<{
8
9
  props: __VLS_Prettify<__VLS_OmitKeepDiscriminatedUnion<(Partial<{}> & Omit<{} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>) & AreaStackedChartProps<T>, keyof import('vue').VNodeProps | keyof import('vue').AllowedComponentProps>> & {} & (import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps);
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),o=require("@unovis/ts"),i=require("@unovis/vue"),m=require("../Tooltip.cjs"),c=require("../../index.cjs"),f=e.defineComponent({__name:"BarChart",props:{data:{},stacked:{type:Boolean},height:{},xLabel:{},yLabel:{},categories:{},xFormatter:{},yFormatter:{},yNumTicks:{},xNumTicks:{},yAxis:{},groupPadding:{},barPadding:{},radius:{},hideLegend:{type:Boolean},orientation:{default:o.Orientation.Vertical},paginationPosition:{default:c.PaginationPosition.Bottom}},setup(p){const r=p,d=e.computed(()=>r.yAxis.map(a=>n=>n[a])),s=(a,n)=>Object.values(r.categories)[n].color,g=e.computed(()=>a=>{const n=e.createApp(m.default,{data:a,categories:r.categories}),l=document.createElement("div");n.mount(l);const t=l.innerHTML;return n.unmount(),t}),u=e.computed(()=>r.paginationPosition===c.PaginationPosition.Top);return(a,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["flex flex-col space-y-4",{"flex-col-reverse":u.value}])},[e.createVNode(e.unref(i.VisXYContainer),{height:a.height},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VisTooltip),{triggers:{[e.unref(o.GroupedBar).selectors.bar]:g.value}},null,8,["triggers"]),a.stacked?(e.openBlock(),e.createBlock(e.unref(i.VisStackedBar),{key:1,data:a.data,x:(l,t)=>t,y:d.value,"grid-line":!1,"domain-line":!1,color:s,"rounded-corners":a.radius??0,"group-padding":a.groupPadding??0,"bar-padding":a.barPadding??.2,orientation:a.orientation??e.unref(o.Orientation).Vertical},null,8,["data","x","y","rounded-corners","group-padding","bar-padding","orientation"])):(e.openBlock(),e.createBlock(e.unref(i.VisGroupedBar),{key:0,data:a.data,x:(l,t)=>t,y:d.value,"grid-line":!1,"domain-line":!1,color:s,"rounded-corners":a.radius??0,"group-padding":a.groupPadding??0,"bar-padding":a.barPadding??.2,orientation:a.orientation??e.unref(o.Orientation).Vertical},null,8,["data","x","y","rounded-corners","group-padding","bar-padding","orientation"])),e.createVNode(e.unref(i.VisAxis),{type:"x",label:a.xLabel,"grid-line":!1,"domain-line":!1,"tick-format":a.xFormatter,"num-ticks":a.xNumTicks,"tick-line":!1},null,8,["label","tick-format","num-ticks"]),e.createVNode(e.unref(i.VisAxis),{type:"y",label:a.yLabel,"grid-line":a.orientation!==e.unref(o.Orientation).Horizontal,"domain-line":!1,"tick-format":a.yFormatter},null,8,["label","grid-line","tick-format"])]),_:1},8,["height"]),a.hideLegend?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["flex items center justify-end",{"pb-4":u.value}])},[e.createVNode(e.unref(i.VisBulletLegend),{items:Object.values(a.categories)},null,8,["items"])],2))],2))}});exports.default=f;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),r=require("@unovis/ts"),t=require("@unovis/vue"),m=require("../Tooltip.cjs"),p=require("../../types.cjs"),f=e.defineComponent({__name:"BarChart",props:{data:{},stacked:{type:Boolean},height:{},xLabel:{},yLabel:{},categories:{},xFormatter:{},yFormatter:{},yNumTicks:{},xNumTicks:{},yAxis:{},groupPadding:{},barPadding:{},radius:{},hideLegend:{type:Boolean},orientation:{default:r.Orientation.Vertical},paginationPosition:{default:p.PaginationPosition.Bottom}},setup(g){const o=g,s=e.computed(()=>o.yAxis.map(a=>n=>n[a])),d=(a,n)=>Object.values(o.categories)[n].color,u=e.computed(()=>a=>{const n=e.createApp(m.default,{data:a,categories:o.categories}),l=document.createElement("div");n.mount(l);const i=l.innerHTML;return n.unmount(),i}),c=e.computed(()=>o.paginationPosition===p.PaginationPosition.Top);return(a,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["flex flex-col space-y-4",{"flex-col-reverse":c.value}])},[e.createVNode(e.unref(t.VisXYContainer),{height:a.height},{default:e.withCtx(()=>[e.createVNode(e.unref(t.VisTooltip),{triggers:{[e.unref(r.GroupedBar).selectors.bar]:u.value,[e.unref(r.StackedBar).selectors.bar]:u.value}},null,8,["triggers"]),a.stacked?(e.openBlock(),e.createBlock(e.unref(t.VisStackedBar),{key:1,data:a.data,x:(l,i)=>i,y:s.value,"grid-line":!1,"domain-line":!1,color:d,"rounded-corners":a.radius??0,"group-padding":a.groupPadding??0,"bar-padding":a.barPadding??.2,orientation:a.orientation??e.unref(r.Orientation).Vertical},null,8,["data","x","y","rounded-corners","group-padding","bar-padding","orientation"])):(e.openBlock(),e.createBlock(e.unref(t.VisGroupedBar),{key:0,data:a.data,x:(l,i)=>i,y:s.value,"grid-line":!1,"domain-line":!1,color:d,"rounded-corners":a.radius??0,"group-padding":a.groupPadding??0,"bar-padding":a.barPadding??.2,orientation:a.orientation??e.unref(r.Orientation).Vertical},null,8,["data","x","y","rounded-corners","group-padding","bar-padding","orientation"])),e.createVNode(e.unref(t.VisAxis),{type:"x",label:a.xLabel,"grid-line":!1,"domain-line":!1,"tick-format":a.xFormatter,"num-ticks":a.xNumTicks,"tick-line":!1},null,8,["label","tick-format","num-ticks"]),e.createVNode(e.unref(t.VisAxis),{type:"y",label:a.yLabel,"grid-line":a.orientation!==e.unref(r.Orientation).Horizontal,"domain-line":!1,"tick-format":a.yFormatter},null,8,["label","grid-line","tick-format"])]),_:1},8,["height"]),a.hideLegend?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["flex items center justify-end",{"pb-4":c.value}])},[e.createVNode(e.unref(t.VisBulletLegend),{items:Object.values(a.categories)},null,8,["items"])],2))],2))}});exports.default=f;
2
2
  //# sourceMappingURL=BarChart.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"BarChart.cjs","sources":["../../../src/components/Bar/BarChart.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { computed, ComputedRef, createApp } from \"vue\";\nimport { BulletLegendItemInterface, GroupedBar, Orientation } 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 \"../..\";\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 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});\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 }\"\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","_","i","generateTooltip","app","createApp","Tooltip","container","html","PaginationPositionTop","PaginationPosition"],"mappings":"ulBAoCA,MAAMA,EAAQC,EAKRC,EAA+CC,EAAAA,SAAS,IACrDH,EAAM,MAAM,IAAKI,GAASC,GACxBA,EAAED,CAAG,CACb,CACF,EAEKE,EAAQ,CAACC,EAAMC,IAAc,OAAO,OAAOR,EAAM,UAAU,EAAEQ,CAAC,EAAE,MAEhEC,EAAkBN,EAAAA,SAAS,IAAOE,GAAS,CACzC,MAAAK,EAAMC,YAAUC,UAAS,CAC7B,KAAMP,EACN,WAAYL,EAAM,UAAA,CACnB,EAEKa,EAAY,SAAS,cAAc,KAAK,EAC9CH,EAAI,MAAMG,CAAS,EAEnB,MAAMC,EAAOD,EAAU,UACvB,OAAAH,EAAI,QAAQ,EAELI,CAAA,CACR,EAEKC,EAAwBZ,EAAA,SAC5B,IAAMH,EAAM,qBAAuBgB,qBAAmB,GACxD"}
1
+ {"version":3,"file":"BarChart.cjs","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 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});\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","_","i","generateTooltip","app","createApp","Tooltip","container","html","PaginationPositionTop","PaginationPosition"],"mappings":"ulBAoCA,MAAMA,EAAQC,EAKRC,EAA+CC,EAAAA,SAAS,IACrDH,EAAM,MAAM,IAAKI,GAASC,GACxBA,EAAED,CAAG,CACb,CACF,EAEKE,EAAQ,CAACC,EAAMC,IAAc,OAAO,OAAOR,EAAM,UAAU,EAAEQ,CAAC,EAAE,MAEhEC,EAAkBN,EAAAA,SAAS,IAAOE,GAAS,CACzC,MAAAK,EAAMC,YAAUC,UAAS,CAC7B,KAAMP,EACN,WAAYL,EAAM,UAAA,CACnB,EAEKa,EAAY,SAAS,cAAc,KAAK,EAC9CH,EAAI,MAAMG,CAAS,EAEnB,MAAMC,EAAOD,EAAU,UACvB,OAAAH,EAAI,QAAQ,EAELI,CAAA,CACR,EAEKC,EAAwBZ,EAAA,SAC5B,IAAMH,EAAM,qBAAuBgB,qBAAmB,GACxD"}
@@ -1,9 +1,9 @@
1
- import { defineComponent as P, computed as s, createApp as v, createElementBlock as m, openBlock as l, normalizeClass as c, createVNode as n, createCommentVNode as B, unref as a, withCtx as V, createBlock as f } from "vue";
2
- import { Orientation as d, GroupedBar as L } from "@unovis/ts";
3
- import { VisXYContainer as T, VisTooltip as C, VisGroupedBar as A, VisStackedBar as N, VisAxis as y, VisBulletLegend as F } from "@unovis/vue";
4
- import j from "../Tooltip.js";
5
- import { PaginationPosition as b } from "../../index.js";
6
- const H = /* @__PURE__ */ P({
1
+ import { defineComponent as v, computed as s, createApp as B, createElementBlock as c, openBlock as l, normalizeClass as f, createVNode as r, createCommentVNode as P, unref as a, withCtx as V, createBlock as y } from "vue";
2
+ import { Orientation as d, 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 O from "../Tooltip.js";
5
+ import { PaginationPosition as k } from "../../types.js";
6
+ const S = /* @__PURE__ */ v({
7
7
  __name: "BarChart",
8
8
  props: {
9
9
  data: {},
@@ -22,31 +22,32 @@ const H = /* @__PURE__ */ P({
22
22
  radius: {},
23
23
  hideLegend: { type: Boolean },
24
24
  orientation: { default: d.Vertical },
25
- paginationPosition: { default: b.Bottom }
25
+ paginationPosition: { default: k.Bottom }
26
26
  },
27
- setup(k) {
28
- const r = k, u = s(() => r.yAxis.map((e) => (i) => i[e])), p = (e, i) => Object.values(r.categories)[i].color, h = s(() => (e) => {
29
- const i = v(j, {
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, g = s(() => (e) => {
29
+ const i = B(O, {
30
30
  data: e,
31
- categories: r.categories
31
+ categories: n.categories
32
32
  }), t = document.createElement("div");
33
33
  i.mount(t);
34
34
  const o = t.innerHTML;
35
35
  return i.unmount(), o;
36
- }), g = s(
37
- () => r.paginationPosition === b.Top
36
+ }), m = s(
37
+ () => n.paginationPosition === k.Top
38
38
  );
39
- return (e, i) => (l(), m("div", {
40
- class: c(["flex flex-col space-y-4", { "flex-col-reverse": g.value }])
39
+ return (e, i) => (l(), c("div", {
40
+ class: f(["flex flex-col space-y-4", { "flex-col-reverse": m.value }])
41
41
  }, [
42
- n(a(T), { height: e.height }, {
42
+ r(a(C), { height: e.height }, {
43
43
  default: V(() => [
44
- n(a(C), {
44
+ r(a(A), {
45
45
  triggers: {
46
- [a(L).selectors.bar]: h.value
46
+ [a(T).selectors.bar]: g.value,
47
+ [a(L).selectors.bar]: g.value
47
48
  }
48
49
  }, null, 8, ["triggers"]),
49
- e.stacked ? (l(), f(a(N), {
50
+ e.stacked ? (l(), y(a(F), {
50
51
  key: 1,
51
52
  data: e.data,
52
53
  x: (t, o) => o,
@@ -58,7 +59,7 @@ const H = /* @__PURE__ */ P({
58
59
  "group-padding": e.groupPadding ?? 0,
59
60
  "bar-padding": e.barPadding ?? 0.2,
60
61
  orientation: e.orientation ?? a(d).Vertical
61
- }, null, 8, ["data", "x", "y", "rounded-corners", "group-padding", "bar-padding", "orientation"])) : (l(), f(a(A), {
62
+ }, null, 8, ["data", "x", "y", "rounded-corners", "group-padding", "bar-padding", "orientation"])) : (l(), y(a(N), {
62
63
  key: 0,
63
64
  data: e.data,
64
65
  x: (t, o) => o,
@@ -71,7 +72,7 @@ const H = /* @__PURE__ */ P({
71
72
  "bar-padding": e.barPadding ?? 0.2,
72
73
  orientation: e.orientation ?? a(d).Vertical
73
74
  }, null, 8, ["data", "x", "y", "rounded-corners", "group-padding", "bar-padding", "orientation"])),
74
- n(a(y), {
75
+ r(a(b), {
75
76
  type: "x",
76
77
  label: e.xLabel,
77
78
  "grid-line": !1,
@@ -80,7 +81,7 @@ const H = /* @__PURE__ */ P({
80
81
  "num-ticks": e.xNumTicks,
81
82
  "tick-line": !1
82
83
  }, null, 8, ["label", "tick-format", "num-ticks"]),
83
- n(a(y), {
84
+ r(a(b), {
84
85
  type: "y",
85
86
  label: e.yLabel,
86
87
  "grid-line": e.orientation !== a(d).Horizontal,
@@ -90,11 +91,11 @@ const H = /* @__PURE__ */ P({
90
91
  ]),
91
92
  _: 1
92
93
  }, 8, ["height"]),
93
- e.hideLegend ? B("", !0) : (l(), m("div", {
94
+ e.hideLegend ? P("", !0) : (l(), c("div", {
94
95
  key: 0,
95
- class: c(["flex items center justify-end", { "pb-4": g.value }])
96
+ class: f(["flex items center justify-end", { "pb-4": m.value }])
96
97
  }, [
97
- n(a(F), {
98
+ r(a(j), {
98
99
  items: Object.values(e.categories)
99
100
  }, null, 8, ["items"])
100
101
  ], 2))
@@ -102,6 +103,6 @@ const H = /* @__PURE__ */ P({
102
103
  }
103
104
  });
104
105
  export {
105
- H as default
106
+ S as default
106
107
  };
107
108
  //# sourceMappingURL=BarChart.js.map
@@ -1 +1 @@
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 } 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 \"../..\";\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 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});\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 }\"\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;AACzC,YAAAI,IAAMC,EAAUC,GAAS;AAAA,QAC7B,MAAMN;AAAA,QACN,YAAYL,EAAM;AAAA,MAAA,CACnB,GAEKY,IAAY,SAAS,cAAc,KAAK;AAC9C,MAAAH,EAAI,MAAMG,CAAS;AAEnB,YAAMC,IAAOD,EAAU;AACvB,aAAAH,EAAI,QAAQ,GAELI;AAAA,IAAA,CACR,GAEKC,IAAwBX;AAAA,MAC5B,MAAMH,EAAM,uBAAuBe,EAAmB;AAAA,IACxD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
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 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});\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;AACzC,YAAAI,IAAMC,EAAUC,GAAS;AAAA,QAC7B,MAAMN;AAAA,QACN,YAAYL,EAAM;AAAA,MAAA,CACnB,GAEKY,IAAY,SAAS,cAAc,KAAK;AAC9C,MAAAH,EAAI,MAAMG,CAAS;AAEnB,YAAMC,IAAOD,EAAU;AACvB,aAAAH,EAAI,QAAQ,GAELI;AAAA,IAAA,CACR,GAEKC,IAAwBX;AAAA,MAC5B,MAAMH,EAAM,uBAAuBe,EAAmB;AAAA,IACxD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,5 +1,5 @@
1
1
  import { BulletLegendItemInterface, Orientation } from '@unovis/ts';
2
- import { PaginationPosition } from '../..';
2
+ import { PaginationPosition } from '../../types';
3
3
 
4
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
5
  props: __VLS_Prettify<__VLS_OmitKeepDiscriminatedUnion<(Partial<{}> & Omit<{} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>) & {
@@ -1 +1 @@
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\n\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 \"../..\";\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 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});\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":"0dAiCA,MAAMA,EAAQC,EAERC,EAASC,GAAgB,OAAO,OAAOH,EAAM,UAAU,EAAEG,CAAG,EAAE,MAE9DC,EAAkBC,EAAAA,SAAS,IAAOC,GAAS,CACzC,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,CAAA,CACR"}
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 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});\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,CACzC,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,CAAA,CACR"}
@@ -1 +1 @@
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\n\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 \"../..\";\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 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});\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":";;;;;;;;;;;;;;;;;;;;AAiCA,UAAMA,IAAQC,GAERC,IAAQ,CAACC,MAAgB,OAAO,OAAOH,EAAM,UAAU,EAAEG,CAAG,EAAE,OAE9DC,IAAkBC,EAAS,MAAM,CAACC,MAAS;AACzC,YAAAC,IAAMC,EAAUC,GAAS;AAAA,QAC7B,MAAMH;AAAA,QACN,YAAYN,EAAM;AAAA,MAAA,CACnB,GAEKU,IAAY,SAAS,cAAc,KAAK;AAC9C,MAAAH,EAAI,MAAMG,CAAS;AAEnB,YAAMC,IAAOD,EAAU;AACvB,aAAAH,EAAI,QAAQ,GAELI;AAAA,IAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
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 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});\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;AACzC,YAAAC,IAAMC,EAAUC,GAAS;AAAA,QAC7B,MAAMH;AAAA,QACN,YAAYN,EAAM;AAAA,MAAA,CACnB,GAEKU,IAAY,SAAS,cAAc,KAAK;AAC9C,MAAAH,EAAI,MAAMG,CAAS;AAEnB,YAAMC,IAAOD,EAAU;AACvB,aAAAH,EAAI,QAAQ,GAELI;AAAA,IAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,5 +1,5 @@
1
1
  import { CurveType, BulletLegendItemInterface } from '@unovis/ts';
2
- import { PaginationPosition } from '../..';
2
+ import { PaginationPosition } from '../../types';
3
3
 
4
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
5
  props: __VLS_Prettify<__VLS_OmitKeepDiscriminatedUnion<(Partial<{}> & Omit<{} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>) & {
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),l={class:"flex flex-col"},s={class:"flex items-center mr-2 mt-2"},r={class:"font-semibold capitalize text-white/75"},c={class:"font-normal"},a=e.defineComponent({__name:"Tooltip",props:{data:{}},setup(i){return(o,d)=>(e.openBlock(),e.createElementBlock("div",l,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(Object.entries(o.data),([t,n])=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:t},[e.createElementVNode("div",s,[e.createElementVNode("span",r,e.toDisplayString(t)+":",1)]),e.createElementVNode("span",c,e.toDisplayString(n),1)],64))),128))]))}});exports.default=a;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),s={class:"flex flex-col"},a={key:1},i={class:"font-semibold capitalize text-white/75 mr-2"},d={class:"font-normal"},m=e.defineComponent({__name:"Tooltip",props:{data:{},categories:{}},setup(u){const c=["_index","_stacked","_ending"];return(o,p)=>(e.openBlock(),e.createElementBlock("div",s,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(Object.entries(o.data),([t,r])=>{var l,n;return e.openBlock(),e.createElementBlock("div",{key:t,class:"flex items-center mr-2 mt-2"},[(l=o.categories[t])!=null&&l.color?(e.openBlock(),e.createElementBlock("span",{key:0,class:"w-3 h-3 rounded-full mr-2",style:e.normalizeStyle({backgroundColor:(n=o.categories[t])==null?void 0:n.color})},null,4)):e.createCommentVNode("",!0),c.includes(t)?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",a,[e.createElementVNode("span",i,e.toDisplayString(t)+":",1),e.createElementVNode("span",d,e.toDisplayString(r),1)]))])}),128))]))}});exports.default=m;
2
2
  //# sourceMappingURL=Tooltip.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
1
+ {"version":3,"file":"Tooltip.cjs","sources":["../../src/components/Tooltip.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T\">\nimport { BulletLegendItemInterface } from \"@unovis/ts\";\n\nconst props = defineProps<{\n data: T;\n categories: Record<string, BulletLegendItemInterface>;\n}>();\n\nconst keyBlockList = ['_index', '_stacked', '_ending']\n</script>\n\n<template>\n <div class=\"flex flex-col\">\n <template v-for=\"[key, value] in Object.entries(data)\" :key=\"key\">\n <div class=\"flex items-center mr-2 mt-2\">\n <span v-if=\"categories[key]?.color\" class=\"w-3 h-3 rounded-full mr-2\" :style=\"{ backgroundColor: categories[key]?.color }\"></span>\n <div v-if=\"!keyBlockList.includes(key)\">\n <span class=\"font-semibold capitalize text-white/75 mr-2\">{{ key }}:</span>\n <span class=\"font-normal\">{{ value }}</span>\n </div>\n </div>\n </template>\n </div>\n</template>\n"],"names":["keyBlockList"],"mappings":"oUAQA,MAAMA,EAAe,CAAC,SAAU,WAAY,SAAS"}
@@ -1,21 +1,34 @@
1
- import { defineComponent as l, createElementBlock as e, openBlock as t, Fragment as n, renderList as i, createElementVNode as s, toDisplayString as a } from "vue";
2
- const _ = { class: "flex flex-col" }, p = { class: "flex items-center mr-2 mt-2" }, d = { class: "font-semibold capitalize text-white/75" }, m = { class: "font-normal" }, x = /* @__PURE__ */ l({
1
+ import { defineComponent as m, createElementBlock as t, openBlock as o, Fragment as _, renderList as p, createCommentVNode as l, normalizeStyle as u, createElementVNode as a, toDisplayString as c } from "vue";
2
+ const f = { class: "flex flex-col" }, g = { key: 1 }, h = { class: "font-semibold capitalize text-white/75 mr-2" }, k = { class: "font-normal" }, B = /* @__PURE__ */ m({
3
3
  __name: "Tooltip",
4
4
  props: {
5
- data: {}
5
+ data: {},
6
+ categories: {}
6
7
  },
7
- setup(f) {
8
- return (r, u) => (t(), e("div", _, [
9
- (t(!0), e(n, null, i(Object.entries(r.data), ([o, c]) => (t(), e(n, { key: o }, [
10
- s("div", p, [
11
- s("span", d, a(o) + ":", 1)
12
- ]),
13
- s("span", m, a(c), 1)
14
- ], 64))), 128))
8
+ setup(x) {
9
+ const i = ["_index", "_stacked", "_ending"];
10
+ return (s, b) => (o(), t("div", f, [
11
+ (o(!0), t(_, null, p(Object.entries(s.data), ([e, d]) => {
12
+ var n, r;
13
+ return o(), t("div", {
14
+ key: e,
15
+ class: "flex items-center mr-2 mt-2"
16
+ }, [
17
+ (n = s.categories[e]) != null && n.color ? (o(), t("span", {
18
+ key: 0,
19
+ class: "w-3 h-3 rounded-full mr-2",
20
+ style: u({ backgroundColor: (r = s.categories[e]) == null ? void 0 : r.color })
21
+ }, null, 4)) : l("", !0),
22
+ i.includes(e) ? l("", !0) : (o(), t("div", g, [
23
+ a("span", h, c(e) + ":", 1),
24
+ a("span", k, c(d), 1)
25
+ ]))
26
+ ]);
27
+ }), 128))
15
28
  ]));
16
29
  }
17
30
  });
18
31
  export {
19
- x as default
32
+ B as default
20
33
  };
21
34
  //# sourceMappingURL=Tooltip.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Tooltip.js","sources":["../../src/components/Tooltip.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T\">\nimport { BulletLegendItemInterface } from \"@unovis/ts\";\n\nconst props = defineProps<{\n data: T;\n categories: Record<string, BulletLegendItemInterface>;\n}>();\n\nconst keyBlockList = ['_index', '_stacked', '_ending']\n</script>\n\n<template>\n <div class=\"flex flex-col\">\n <template v-for=\"[key, value] in Object.entries(data)\" :key=\"key\">\n <div class=\"flex items-center mr-2 mt-2\">\n <span v-if=\"categories[key]?.color\" class=\"w-3 h-3 rounded-full mr-2\" :style=\"{ backgroundColor: categories[key]?.color }\"></span>\n <div v-if=\"!keyBlockList.includes(key)\">\n <span class=\"font-semibold capitalize text-white/75 mr-2\">{{ key }}:</span>\n <span class=\"font-normal\">{{ value }}</span>\n </div>\n </div>\n </template>\n </div>\n</template>\n"],"names":["keyBlockList"],"mappings":";;;;;;;;AAQA,UAAMA,IAAe,CAAC,UAAU,YAAY,SAAS;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,6 +1,9 @@
1
+ import { BulletLegendItemInterface } from '@unovis/ts';
2
+
1
3
  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<{
2
4
  props: __VLS_Prettify<__VLS_OmitKeepDiscriminatedUnion<(Partial<{}> & Omit<{} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>) & {
3
5
  data: T;
6
+ categories: Record<string, BulletLegendItemInterface>;
4
7
  }, keyof import('vue').VNodeProps | keyof import('vue').AllowedComponentProps>> & {} & (import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps);
5
8
  expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
6
9
  attrs: any;
package/dist/index.cjs CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./components/Area/AreaChart.cjs"),u=require("./components/AreaStacked/AreaStackedChart.cjs"),_=require("./components/Line/LineChart.cjs"),a=require("./components/Bar/BarChart.cjs"),s=require("./components/Donut/DonutChart.cjs"),p=require("./components/Crosshair/Crosshair.cjs");var t=(e=>(e.Top="top",e.Bottom="bottom",e))(t||{});exports.AreaChart=r.default;exports.AreaStackedChart=u.default;exports.LineChart=_.default;exports.BarChart=a.default;exports.DonutChart=s.default;exports.Crosshair=p.default;exports.PaginationPosition=t;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./components/Area/AreaChart.cjs"),t=require("./components/AreaStacked/AreaStackedChart.cjs"),r=require("./components/Line/LineChart.cjs"),_=require("./components/Bar/BarChart.cjs"),u=require("./components/Donut/DonutChart.cjs"),a=require("./components/Crosshair/Crosshair.cjs");exports.AreaChart=e.default;exports.AreaStackedChart=t.default;exports.LineChart=r.default;exports.BarChart=_.default;exports.DonutChart=u.default;exports.Crosshair=a.default;
2
2
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":["../src/index.ts"],"sourcesContent":["export * from \"./components\";\nexport enum PaginationPosition {\n Top = \"top\",\n Bottom = \"bottom\",\n}\n"],"names":["PaginationPosition"],"mappings":"uXACY,IAAAA,GAAAA,IACVA,EAAA,IAAM,MACNA,EAAA,OAAS,SAFCA,IAAAA,GAAA,CAAA,CAAA"}
1
+ {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
package/dist/index.d.ts CHANGED
@@ -1,5 +1 @@
1
1
  export * from './components';
2
- export declare enum PaginationPosition {
3
- Top = "top",
4
- Bottom = "bottom"
5
- }
package/dist/index.js CHANGED
@@ -1,17 +1,15 @@
1
- import { default as o } from "./components/Area/AreaChart.js";
2
- import { default as p } from "./components/AreaStacked/AreaStackedChart.js";
3
- import { default as u } from "./components/Line/LineChart.js";
4
- import { default as s } from "./components/Bar/BarChart.js";
5
- import { default as h } from "./components/Donut/DonutChart.js";
6
- import { default as C } from "./components/Crosshair/Crosshair.js";
7
- var t = /* @__PURE__ */ ((r) => (r.Top = "top", r.Bottom = "bottom", r))(t || {});
1
+ import { default as t } from "./components/Area/AreaChart.js";
2
+ import { default as o } from "./components/AreaStacked/AreaStackedChart.js";
3
+ import { default as s } from "./components/Line/LineChart.js";
4
+ import { default as u } from "./components/Bar/BarChart.js";
5
+ import { default as l } from "./components/Donut/DonutChart.js";
6
+ import { default as p } from "./components/Crosshair/Crosshair.js";
8
7
  export {
9
- o as AreaChart,
10
- p as AreaStackedChart,
11
- s as BarChart,
12
- C as Crosshair,
13
- h as DonutChart,
14
- u as LineChart,
15
- t as PaginationPosition
8
+ t as AreaChart,
9
+ o as AreaStackedChart,
10
+ u as BarChart,
11
+ p as Crosshair,
12
+ l as DonutChart,
13
+ s as LineChart
16
14
  };
17
15
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["export * from \"./components\";\nexport enum PaginationPosition {\n Top = \"top\",\n Bottom = \"bottom\",\n}\n"],"names":["PaginationPosition"],"mappings":";;;;;;AACY,IAAAA,sBAAAA,OACVA,EAAA,MAAM,OACNA,EAAA,SAAS,UAFCA,IAAAA,KAAA,CAAA,CAAA;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
package/dist/types.cjs ADDED
@@ -0,0 +1,2 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var o=(t=>(t.Top="top",t.Bottom="bottom",t))(o||{});exports.PaginationPosition=o;
2
+ //# sourceMappingURL=types.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.cjs","sources":["../src/types.ts"],"sourcesContent":["export enum PaginationPosition {\n Top = \"top\",\n Bottom = \"bottom\",\n }\n "],"names":["PaginationPosition"],"mappings":"gFAAY,IAAAA,GAAAA,IACRA,EAAA,IAAM,MACNA,EAAA,OAAS,SAFDA,IAAAA,GAAA,CAAA,CAAA"}
@@ -0,0 +1,4 @@
1
+ export declare enum PaginationPosition {
2
+ Top = "top",
3
+ Bottom = "bottom"
4
+ }
package/dist/types.js ADDED
@@ -0,0 +1,5 @@
1
+ var o = /* @__PURE__ */ ((t) => (t.Top = "top", t.Bottom = "bottom", t))(o || {});
2
+ export {
3
+ o as PaginationPosition
4
+ };
5
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.js","sources":["../src/types.ts"],"sourcesContent":["export enum PaginationPosition {\n Top = \"top\",\n Bottom = \"bottom\",\n }\n "],"names":["PaginationPosition"],"mappings":"AAAY,IAAAA,sBAAAA,OACRA,EAAA,MAAM,OACNA,EAAA,SAAS,UAFDA,IAAAA,KAAA,CAAA,CAAA;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vue-chrts",
3
- "version": "0.0.139",
3
+ "version": "0.0.141",
4
4
  "license": "MIT",
5
5
  "files": [
6
6
  "dist"
@@ -33,6 +33,8 @@
33
33
  "@tailwindcss/vite": "^4.0.9",
34
34
  "@tanstack/vue-table": "^8.21.2",
35
35
  "@unhead/vue": "^1.11.18",
36
+ "@unovis/ts": "^1.5.0",
37
+ "@unovis/vue": "^1.5.0",
36
38
  "@vueuse/core": "^12.6.1",
37
39
  "d3": "^7.8.5",
38
40
  "tailwindcss": "^4.0.9",
@@ -44,14 +46,11 @@
44
46
  "rollup-plugin-commonjs": "^10.1.0",
45
47
  "rollup-plugin-typescript2": "^0.31.1",
46
48
  "@types/d3": "^7.4.0",
47
- "@unovis/ts": "^1.5.0",
48
- "@unovis/vue": "^1.5.0",
49
49
  "@vitejs/plugin-vue": "^5.2.1",
50
50
  "@vue/tsconfig": "^0.7.0",
51
51
  "typescript": "~5.6.2",
52
52
  "vite": "^6.0.5",
53
53
  "vite-plugin-dts": "^3.9.1",
54
54
  "vue-tsc": "^2.2.0"
55
- },
56
- "packageManager": "pnpm@9.13.2+sha512.88c9c3864450350e65a33587ab801acf946d7c814ed1134da4a924f6df5a2120fd36b46aab68f7cd1d413149112d53c7db3a4136624cfd00ff1846a0c6cef48a"
55
+ }
57
56
  }