WIP: Groupedbar, Heatmap and Sparkline Charts
This commit is contained in:
cmack
parent
f667f05f19
commit
a0d9bd9774
|
|
@ -471,6 +471,143 @@ export default {
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: "Heatmap",
|
||||||
|
_component: "@budibase/standard-components/heatmap",
|
||||||
|
description: "Heatmap chart",
|
||||||
|
icon: "ri-bar-chart-fill",
|
||||||
|
presetProps: {
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
day: 0,
|
||||||
|
hour: 0,
|
||||||
|
value: 7,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
day: 0,
|
||||||
|
hour: 1,
|
||||||
|
value: 10,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
properties: {
|
||||||
|
settings: [
|
||||||
|
{
|
||||||
|
label: "Color",
|
||||||
|
key: "color",
|
||||||
|
control: OptionSelect,
|
||||||
|
options: [
|
||||||
|
"britecharts",
|
||||||
|
"blueGreen",
|
||||||
|
"green",
|
||||||
|
"grey",
|
||||||
|
"orange",
|
||||||
|
"pink",
|
||||||
|
"purple",
|
||||||
|
"red",
|
||||||
|
"teal",
|
||||||
|
"yellow",
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Show Legend",
|
||||||
|
key: "useLegend ",
|
||||||
|
valueKey: "checked",
|
||||||
|
control: Checkbox,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Height",
|
||||||
|
key: "height",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Width",
|
||||||
|
key: "width",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Boxsize",
|
||||||
|
key: "boxSize",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "Sparkline",
|
||||||
|
_component: "@budibase/standard-components/sparkline",
|
||||||
|
description: "Sparkline chart",
|
||||||
|
icon: "ri-bar-chart-fill",
|
||||||
|
presetProps: {
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
value: 1,
|
||||||
|
date: "2011-01-06T00:00:00Z",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 2,
|
||||||
|
date: "2011-01-07T00:00:00Z",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
properties: {
|
||||||
|
settings: [
|
||||||
|
{
|
||||||
|
label: "Line Gradient",
|
||||||
|
key: "lineGradient",
|
||||||
|
control: OptionSelect,
|
||||||
|
options: [
|
||||||
|
{ value: "", label: "None" },
|
||||||
|
{ value: "bluePurple", label: "Blue Purple" },
|
||||||
|
{ value: "greenBlue", label: "Green Blue" },
|
||||||
|
{ value: "orangePink", label: "Orange Pink" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Area Gradient",
|
||||||
|
key: "areaGradient",
|
||||||
|
control: OptionSelect,
|
||||||
|
options: [
|
||||||
|
{ value: "", label: "None" },
|
||||||
|
{ value: "bluePurple", label: "Blue Purple" },
|
||||||
|
{ value: "greenBlue", label: "Green Blue" },
|
||||||
|
{ value: "orangePink", label: "Orange Pink" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "height",
|
||||||
|
label: "Height",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "width",
|
||||||
|
label: "Width",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "dateLabel",
|
||||||
|
label: "Date Label",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "isAnimated",
|
||||||
|
label: "Is Animated",
|
||||||
|
valueKey: "checked",
|
||||||
|
control: Checkbox,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "titleText",
|
||||||
|
label: "Title Text",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "valueLabel",
|
||||||
|
label: "Value Label",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
{
|
{
|
||||||
name: "Bar",
|
name: "Bar",
|
||||||
_component: "@budibase/standard-components/bar",
|
_component: "@budibase/standard-components/bar",
|
||||||
|
|
@ -717,6 +854,100 @@ export default {
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: "Groupedbar",
|
||||||
|
_component: "@budibase/standard-components/groupedbar",
|
||||||
|
description: "Groupedbar chart",
|
||||||
|
icon: "ri-bar-chart-fill",
|
||||||
|
presetProps: {
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
name: "2011-01",
|
||||||
|
group: "Direct",
|
||||||
|
value: 0,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
properties: {
|
||||||
|
settings: [
|
||||||
|
{
|
||||||
|
label: "Color",
|
||||||
|
key: "color",
|
||||||
|
control: OptionSelect,
|
||||||
|
options: [
|
||||||
|
"britecharts",
|
||||||
|
"blueGreen",
|
||||||
|
"green",
|
||||||
|
"grey",
|
||||||
|
"orange",
|
||||||
|
"pink",
|
||||||
|
"purple",
|
||||||
|
"red",
|
||||||
|
"teal",
|
||||||
|
"yellow",
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Height",
|
||||||
|
key: "height",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Width",
|
||||||
|
key: "width",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Aspect Ratio",
|
||||||
|
key: "aspectRatio",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Height",
|
||||||
|
key: "height",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Grid",
|
||||||
|
key: "grid",
|
||||||
|
control: OptionSelect,
|
||||||
|
options: ["vertical", "horizontal", "full"],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Group Label",
|
||||||
|
key: "groupLabel",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Name Label",
|
||||||
|
key: "nameLabel",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Y Ticks",
|
||||||
|
key: "yTicks",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Y Tick Text Offset",
|
||||||
|
key: "yTickTextOffset",
|
||||||
|
control: Input,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Is Animated",
|
||||||
|
key: "isAnimated",
|
||||||
|
valueKey: "checked",
|
||||||
|
control: Checkbox,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Is Horizontal",
|
||||||
|
key: "isHorizontal",
|
||||||
|
valueKey: "checked",
|
||||||
|
control: Checkbox,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
{
|
{
|
||||||
name: "Bullet",
|
name: "Bullet",
|
||||||
_component: "@budibase/standard-components/bullet",
|
_component: "@budibase/standard-components/bullet",
|
||||||
|
|
|
||||||
|
|
@ -271,6 +271,21 @@
|
||||||
"percentageFormat": "string"
|
"percentageFormat": "string"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"sparkline": {
|
||||||
|
"description": "Sparkline Chart",
|
||||||
|
"data": true,
|
||||||
|
"props": {
|
||||||
|
"areaGradient": "string",
|
||||||
|
"height": "number",
|
||||||
|
"width": "number",
|
||||||
|
"dateLabel": "string",
|
||||||
|
"duration": "string",
|
||||||
|
"isAnimated": "bool",
|
||||||
|
"lineGradient": "string",
|
||||||
|
"titleText": "string",
|
||||||
|
"valueLabel": "string"
|
||||||
|
}
|
||||||
|
},
|
||||||
"bar": {
|
"bar": {
|
||||||
"description": "Bar Chart",
|
"description": "Bar Chart",
|
||||||
"data": true,
|
"data": true,
|
||||||
|
|
@ -339,6 +354,38 @@
|
||||||
"xAxisCustomFormat": "string"
|
"xAxisCustomFormat": "string"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"heatmap": {
|
||||||
|
"description": "Groupedbar chart",
|
||||||
|
"data": true,
|
||||||
|
"props": {
|
||||||
|
"color": "string",
|
||||||
|
"height": "number",
|
||||||
|
"width": "number",
|
||||||
|
"useLegend": "bool",
|
||||||
|
"yAxisLabel": "string",
|
||||||
|
"boxSize": "number"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"groupedbar": {
|
||||||
|
"description": "Groupedbar chart",
|
||||||
|
"data": true,
|
||||||
|
"props": {
|
||||||
|
"color": "string",
|
||||||
|
"height": "string",
|
||||||
|
"width": "string",
|
||||||
|
"margin": "string",
|
||||||
|
"aspectRatio": "number",
|
||||||
|
"grid":"string",
|
||||||
|
"groupLabel": "string",
|
||||||
|
"isAnimated": "bool",
|
||||||
|
"isHorizontal": "bool",
|
||||||
|
"nameLabel": "string",
|
||||||
|
"valueLabel":"string",
|
||||||
|
"yTicks": "string",
|
||||||
|
"yTickTextOffset": "string",
|
||||||
|
"useLegend": "bool"
|
||||||
|
}
|
||||||
|
},
|
||||||
"bullet": {
|
"bullet": {
|
||||||
"description": "Bullet chart",
|
"description": "Bullet chart",
|
||||||
"data": true,
|
"data": true,
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,139 @@
|
||||||
|
<script>
|
||||||
|
import { getColorSchema, getChartGradient, notNull } from "./utils"
|
||||||
|
import britecharts from "britecharts"
|
||||||
|
import { onMount } from "svelte"
|
||||||
|
|
||||||
|
/*
|
||||||
|
ISSUES
|
||||||
|
- Renders but seems to be a problem with tooltip hover
|
||||||
|
*/
|
||||||
|
|
||||||
|
import { select } from "d3-selection"
|
||||||
|
import shortid from "shortid"
|
||||||
|
|
||||||
|
const _id = shortid.generate()
|
||||||
|
|
||||||
|
const chart = britecharts.groupedBar()
|
||||||
|
const chartClass = `groupedbar-container-${_id}`
|
||||||
|
const legendClass = `legend-container-${_id}`
|
||||||
|
|
||||||
|
let tooltip
|
||||||
|
let tooltipContainer
|
||||||
|
let chartElement = null
|
||||||
|
let chartContainer = null
|
||||||
|
|
||||||
|
export let customMouseOver = () => tooltip.show()
|
||||||
|
export let customMouseMove = (dataPoint, topicColorMap, dataPointXPosition) =>
|
||||||
|
tooltip.update(dataPoint, topicColorMap, dataPointXPosition)
|
||||||
|
export let customMouseOut = () => tooltip.hide()
|
||||||
|
export let customClick = null
|
||||||
|
|
||||||
|
export let data = []
|
||||||
|
export let color = "britecharts"
|
||||||
|
export let height = 200
|
||||||
|
export let width = 200
|
||||||
|
export let margin = { top: 0, right: 0, bottom: 0, left: 0 }
|
||||||
|
export let aspectRatio = null
|
||||||
|
export let grid = null
|
||||||
|
export let groupLabel = null
|
||||||
|
export let isAnimated = null
|
||||||
|
export let isHorizontal = null
|
||||||
|
export let nameLabel = null
|
||||||
|
export let valueLabel = null
|
||||||
|
export let valueLabelFormat = null
|
||||||
|
export let xTicks = null
|
||||||
|
export let yAxisLabel = null
|
||||||
|
export let yAxisLabelOffset = null
|
||||||
|
export let yTicks = null
|
||||||
|
export let yTickTextOffset = null
|
||||||
|
export let useLegend = true
|
||||||
|
|
||||||
|
onMount(() => {
|
||||||
|
if (chart) {
|
||||||
|
chartContainer = select(`.${chartClass}`)
|
||||||
|
bindChartUIProps()
|
||||||
|
// bindChartEvents()
|
||||||
|
chartContainer.datum(data).call(chart)
|
||||||
|
// bindChartTooltip()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
function bindChartUIProps() {
|
||||||
|
if (notNull(color)) {
|
||||||
|
chart.colorSchema(colorSchema)
|
||||||
|
}
|
||||||
|
if (notNull(height)) {
|
||||||
|
chart.height(height)
|
||||||
|
}
|
||||||
|
if (notNull(width)) {
|
||||||
|
chart.width(width)
|
||||||
|
}
|
||||||
|
if (notNull(aspectRatio)) {
|
||||||
|
chart.aspectRatio(aspectRatio)
|
||||||
|
}
|
||||||
|
if (notNull(grid)) {
|
||||||
|
chart.grid(grid)
|
||||||
|
}
|
||||||
|
if (notNull(groupLabel)) {
|
||||||
|
chart.groupLabel(groupLabel)
|
||||||
|
}
|
||||||
|
if (notNull(isAnimated)) {
|
||||||
|
chart.isAnimated(isAnimated)
|
||||||
|
}
|
||||||
|
if (notNull(isHorizontal)) {
|
||||||
|
chart.isHorizontal(isHorizontal)
|
||||||
|
}
|
||||||
|
if (notNull(nameLabel)) {
|
||||||
|
chart.nameLabel(nameLabel)
|
||||||
|
}
|
||||||
|
if (notNull(valueLabel)) {
|
||||||
|
chart.valueLabel(valueLabel)
|
||||||
|
}
|
||||||
|
if (notNull(valueLabelFormat)) {
|
||||||
|
chart.valueLabelFormat(valueLabelFormat)
|
||||||
|
}
|
||||||
|
if (notNull(xTicks)) {
|
||||||
|
chart.xTicks(xTicks)
|
||||||
|
}
|
||||||
|
if (notNull(yAxisLabel)) {
|
||||||
|
chart.yAxisLabel(yAxisLabel)
|
||||||
|
}
|
||||||
|
if (notNull(yAxisLabelOffset)) {
|
||||||
|
chart.yAxisLabelOffset(yAxisLabelOffset)
|
||||||
|
}
|
||||||
|
if (notNull(yTicks)) {
|
||||||
|
chart.yTicks(yTicks)
|
||||||
|
}
|
||||||
|
if (notNull(yTickTextOffset)) {
|
||||||
|
chart.yTickTextOffset(yTickTextOffset)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function bindChartTooltip() {
|
||||||
|
tooltip = britecharts.miniTooltip()
|
||||||
|
tooltipContainer = select(`.${chartClass} .metadata-group`)
|
||||||
|
tooltipContainer.datum([]).call(tooltip)
|
||||||
|
}
|
||||||
|
|
||||||
|
function bindChartEvents() {
|
||||||
|
if (customClick) {
|
||||||
|
chart.on("customClick", customClick)
|
||||||
|
}
|
||||||
|
if (customMouseMove) {
|
||||||
|
chart.on("customMouseMove", customMouseMove)
|
||||||
|
}
|
||||||
|
if (customMouseOut) {
|
||||||
|
chart.on("customMouseOut", customMouseOut)
|
||||||
|
}
|
||||||
|
if (customMouseOver) {
|
||||||
|
chart.on("customMouseOver", customMouseOver)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$: colorSchema = getColorSchema(color)
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div bind:this={chartElement} class={chartClass} />
|
||||||
|
{#if useLegend}
|
||||||
|
<div class={legendClass} />
|
||||||
|
{/if}
|
||||||
|
|
@ -0,0 +1,59 @@
|
||||||
|
<script>
|
||||||
|
import { getColorSchema, getChartGradient, notNull } from "./utils"
|
||||||
|
import britecharts from "britecharts"
|
||||||
|
import { onMount } from "svelte"
|
||||||
|
|
||||||
|
import { select } from "d3-selection"
|
||||||
|
import shortid from "shortid"
|
||||||
|
|
||||||
|
const _id = shortid.generate()
|
||||||
|
|
||||||
|
const chart = britecharts.heatmap()
|
||||||
|
const chartClass = `heatmap-container-${_id}`
|
||||||
|
const legendClass = `legend-container-${_id}`
|
||||||
|
|
||||||
|
let chartElement = null
|
||||||
|
let chartContainer = null
|
||||||
|
|
||||||
|
export let data = []
|
||||||
|
export let color = "britecharts"
|
||||||
|
export let height = 200
|
||||||
|
export let width = 200
|
||||||
|
export let margin = { top: 0, right: 0, bottom: 0, left: 0 }
|
||||||
|
export let useLegend = true
|
||||||
|
export let yAxisLabels = null
|
||||||
|
export let boxSize = null
|
||||||
|
|
||||||
|
onMount(() => {
|
||||||
|
if (chart) {
|
||||||
|
chartContainer = select(`.${chartClass}`)
|
||||||
|
bindChartUIProps()
|
||||||
|
chartContainer.datum(data).call(chart)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
function bindChartUIProps() {
|
||||||
|
if (notNull(color)) {
|
||||||
|
chart.colorSchema(colorSchema)
|
||||||
|
}
|
||||||
|
if (notNull(height)) {
|
||||||
|
chart.height(height)
|
||||||
|
}
|
||||||
|
if (notNull(width)) {
|
||||||
|
chart.width(width)
|
||||||
|
}
|
||||||
|
if (notNull(boxSize)) {
|
||||||
|
chart.boxSize(boxSize)
|
||||||
|
}
|
||||||
|
if (notNull(yAxisLabels)) {
|
||||||
|
chart.yAxisLabels(yAxisLabels)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$: colorSchema = getColorSchema(color)
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div bind:this={chartElement} class={chartClass} />
|
||||||
|
{#if useLegend}
|
||||||
|
<div class={legendClass} />
|
||||||
|
{/if}
|
||||||
|
|
@ -0,0 +1,79 @@
|
||||||
|
<script>
|
||||||
|
import { getColorSchema, getChartGradient, notNull } from "./utils"
|
||||||
|
import britecharts from "britecharts"
|
||||||
|
import { onMount } from "svelte"
|
||||||
|
|
||||||
|
import { select } from "d3-selection"
|
||||||
|
import shortid from "shortid"
|
||||||
|
|
||||||
|
const _id = shortid.generate()
|
||||||
|
|
||||||
|
const chart = britecharts.sparkline()
|
||||||
|
const chartClass = `sparkline-container-${_id}`
|
||||||
|
const legendClass = `legend-container-${_id}`
|
||||||
|
|
||||||
|
let chartElement = null
|
||||||
|
let chartContainer = null
|
||||||
|
|
||||||
|
export let data = []
|
||||||
|
export let areaGradient = null
|
||||||
|
export let height = null
|
||||||
|
export let width = null
|
||||||
|
export let dateLabel = null
|
||||||
|
export let duration = null
|
||||||
|
export let isAnimated = null
|
||||||
|
export let lineGradient = null
|
||||||
|
export let titleText = null
|
||||||
|
export let titleTextStyle = null
|
||||||
|
export let valueLabel = null
|
||||||
|
export let useLegend = true
|
||||||
|
|
||||||
|
onMount(() => {
|
||||||
|
if (chart) {
|
||||||
|
chartContainer = select(`.${chartClass}`)
|
||||||
|
bindChartUIProps()
|
||||||
|
chartContainer.datum(data).call(chart)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
function bindChartUIProps() {
|
||||||
|
if (notNull(areaGradient)) {
|
||||||
|
chart.areaGradient(aGradient)
|
||||||
|
}
|
||||||
|
if (notNull(lineGradient)) {
|
||||||
|
chart.lineGradient(lGradient)
|
||||||
|
}
|
||||||
|
if (notNull(height)) {
|
||||||
|
chart.height(height)
|
||||||
|
}
|
||||||
|
if (notNull(width)) {
|
||||||
|
chart.width(width)
|
||||||
|
}
|
||||||
|
if (notNull(dateLabel)) {
|
||||||
|
chart.dateLabel(dateLabel)
|
||||||
|
}
|
||||||
|
if (notNull(duration)) {
|
||||||
|
chart.duration(duration)
|
||||||
|
}
|
||||||
|
if (notNull(isAnimated)) {
|
||||||
|
chart.isAnimated(isAnimated)
|
||||||
|
}
|
||||||
|
if (notNull(titleText)) {
|
||||||
|
chart.titleText(titleText)
|
||||||
|
}
|
||||||
|
if (notNull(titleTextStyle)) {
|
||||||
|
chart.titleTextStyle(titleTextStyle)
|
||||||
|
}
|
||||||
|
if (notNull(valueLabel)) {
|
||||||
|
chart.valueLabel(valueLabel)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$: aGradient = getChartGradient(areaGradient)
|
||||||
|
$: lGradient = getChartGradient(lineGradient)
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div bind:this={chartElement} class={chartClass} />
|
||||||
|
{#if useLegend}
|
||||||
|
<div class={legendClass} />
|
||||||
|
{/if}
|
||||||
|
|
@ -31,6 +31,8 @@
|
||||||
bindChartTooltip()
|
bindChartTooltip()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
$: colorSchema = getColorSchema(color)
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div bind:this={chartElement} class={chartClass} />
|
<div bind:this={chartElement} class={chartClass} />
|
||||||
|
|
|
||||||
|
|
@ -3,4 +3,7 @@ export { default as bar } from "./Bar.svelte"
|
||||||
export { default as line } from "./Line.svelte"
|
export { default as line } from "./Line.svelte"
|
||||||
export { default as brush } from "./Brush.svelte"
|
export { default as brush } from "./Brush.svelte"
|
||||||
export { default as bullet } from "./Bullet.svelte"
|
export { default as bullet } from "./Bullet.svelte"
|
||||||
|
export { default as groupedbar } from "./GroupedBar.svelte"
|
||||||
|
export { default as heatmap } from "./Heatmap.svelte"
|
||||||
|
export { default as sparkline } from "./Sparkline.svelte"
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue