remove palette name

This commit is contained in:
Gerard Burns 2024-05-14 09:49:53 +01:00
parent bad7a535dc
commit 1c14a71ef8
9 changed files with 107 additions and 96 deletions

View File

@ -1714,19 +1714,19 @@
"type": "select",
"label": "Colors",
"key": "palette",
"defaultValue": "palette1",
"defaultValue": "Palette 1",
"options": [
{ "label": "Custom", "value": "Custom" },
{ "label": "Palette 1", "value": "palette1" },
{ "label": "Palette 2", "value": "palette2" },
{ "label": "Palette 3", "value": "palette3" },
{ "label": "Palette 4", "value": "palette4" },
{ "label": "Palette 5", "value": "palette5" },
{ "label": "Palette 6", "value": "palette6" },
{ "label": "Palette 7", "value": "palette7" },
{ "label": "Palette 8", "value": "palette8" },
{ "label": "Palette 9", "value": "palette9" },
{ "label": "Palette 10", "value": "palette10" }
"Custom",
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10"
]
},
{
@ -1883,19 +1883,19 @@
"type": "select",
"label": "Colors",
"key": "palette",
"defaultValue": "palette1",
"defaultValue": "Palette 1",
"options": [
{ "label": "Custom", "value": "Custom" },
{ "label": "Palette 1", "value": "palette1" },
{ "label": "Palette 2", "value": "palette2" },
{ "label": "Palette 3", "value": "palette3" },
{ "label": "Palette 4", "value": "palette4" },
{ "label": "Palette 5", "value": "palette5" },
{ "label": "Palette 6", "value": "palette6" },
{ "label": "Palette 7", "value": "palette7" },
{ "label": "Palette 8", "value": "palette8" },
{ "label": "Palette 9", "value": "palette9" },
{ "label": "Palette 10", "value": "palette10" }
"Custom",
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10"
]
},
{
@ -2047,19 +2047,19 @@
"type": "select",
"label": "Colors",
"key": "palette",
"defaultValue": "palette1",
"defaultValue": "Palette 1",
"options": [
{ "label": "Custom", "value": "Custom" },
{ "label": "Palette 1", "value": "palette1" },
{ "label": "Palette 2", "value": "palette2" },
{ "label": "Palette 3", "value": "palette3" },
{ "label": "Palette 4", "value": "palette4" },
{ "label": "Palette 5", "value": "palette5" },
{ "label": "Palette 6", "value": "palette6" },
{ "label": "Palette 7", "value": "palette7" },
{ "label": "Palette 8", "value": "palette8" },
{ "label": "Palette 9", "value": "palette9" },
{ "label": "Palette 10", "value": "palette10" }
"Custom",
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10"
]
},
{
@ -2206,19 +2206,19 @@
"type": "select",
"label": "Colors",
"key": "palette",
"defaultValue": "palette1",
"defaultValue": "Palette 1",
"options": [
{ "label": "Custom", "value": "Custom" },
{ "label": "Palette 1", "value": "palette1" },
{ "label": "Palette 2", "value": "palette2" },
{ "label": "Palette 3", "value": "palette3" },
{ "label": "Palette 4", "value": "palette4" },
{ "label": "Palette 5", "value": "palette5" },
{ "label": "Palette 6", "value": "palette6" },
{ "label": "Palette 7", "value": "palette7" },
{ "label": "Palette 8", "value": "palette8" },
{ "label": "Palette 9", "value": "palette9" },
{ "label": "Palette 10", "value": "palette10" }
"Custom",
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10"
]
},
{
@ -2346,19 +2346,19 @@
"type": "select",
"label": "Colors",
"key": "palette",
"defaultValue": "palette1",
"defaultValue": "Palette 1",
"options": [
{ "label": "Custom", "value": "Custom" },
{ "label": "Palette 1", "value": "palette1" },
{ "label": "Palette 2", "value": "palette2" },
{ "label": "Palette 3", "value": "palette3" },
{ "label": "Palette 4", "value": "palette4" },
{ "label": "Palette 5", "value": "palette5" },
{ "label": "Palette 6", "value": "palette6" },
{ "label": "Palette 7", "value": "palette7" },
{ "label": "Palette 8", "value": "palette8" },
{ "label": "Palette 9", "value": "palette9" },
{ "label": "Palette 10", "value": "palette10" }
"Custom",
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10"
]
},
{
@ -2615,19 +2615,19 @@
"type": "select",
"label": "Colors",
"key": "palette",
"defaultValue": "palette1",
"defaultValue": "Palette 1",
"options": [
{ "label": "Custom", "value": "Custom" },
{ "label": "Palette 1", "value": "palette1" },
{ "label": "Palette 2", "value": "palette2" },
{ "label": "Palette 3", "value": "palette3" },
{ "label": "Palette 4", "value": "palette4" },
{ "label": "Palette 5", "value": "palette5" },
{ "label": "Palette 6", "value": "palette6" },
{ "label": "Palette 7", "value": "palette7" },
{ "label": "Palette 8", "value": "palette8" },
{ "label": "Palette 9", "value": "palette9" },
{ "label": "Palette 10", "value": "palette10" }
"Custom",
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10"
]
},
{
@ -5292,19 +5292,19 @@
"type": "select",
"label": "Colors",
"key": "palette",
"defaultValue": "palette1",
"defaultValue": "Palette 1",
"options": [
{ "label": "Custom", "value": "Custom" },
{ "label": "Palette 1", "value": "palette1" },
{ "label": "Palette 2", "value": "palette2" },
{ "label": "Palette 3", "value": "palette3" },
{ "label": "Palette 4", "value": "palette4" },
{ "label": "Palette 5", "value": "palette5" },
{ "label": "Palette 6", "value": "palette6" },
{ "label": "Palette 7", "value": "palette7" },
{ "label": "Palette 8", "value": "palette8" },
{ "label": "Palette 9", "value": "palette9" },
{ "label": "Palette 10", "value": "palette10" }
"Custom",
"Palette 1",
"Palette 2",
"Palette 3",
"Palette 4",
"Palette 5",
"Palette 6",
"Palette 7",
"Palette 8",
"Palette 9",
"Palette 10"
]
},
{

View File

@ -11,7 +11,6 @@
// Apex charts directly modifies the options object with default properties and internal variables. These being present could unintentionally cause issues to the provider of this prop as the changes are reflected in that component as well. To prevent any issues we clone options here to provide a buffer.
$: optionsCopy = cloneDeep(options)
$: console.log(options, optionsCopy)
let chartElement
let chart

View File

@ -1,6 +1,6 @@
<script>
import ApexChart from "./ApexChart.svelte"
import { formatters } from "./utils"
import { formatters, parsePalette } from "./utils"
export let title
export let dataProvider
@ -41,7 +41,7 @@
},
colors: palette === "Custom" ? [c1, c2, c3, c4, c5] : [],
theme: {
palette: palette === "Custom" ? null : palette,
palette: parsePalette(palette),
},
fill,
legend: {

View File

@ -1,6 +1,6 @@
<script>
import ApexChart from "./ApexChart.svelte"
import { formatters } from "./utils"
import { formatters, parsePalette } from "./utils"
export let dataProvider
export let labelColumn
@ -34,7 +34,7 @@
series,
colors: palette === "Custom" ? [c1, c2, c3, c4, c5] : [],
theme: {
palette: palette === "Custom" ? null : palette,
palette: parsePalette(palette),
},
legend: {
show: legend,

View File

@ -1,6 +1,6 @@
<script>
import ApexChart from "./ApexChart.svelte"
import { formatters } from "./utils"
import { formatters, parsePalette } from "./utils"
export let title
export let dataProvider
@ -26,7 +26,7 @@
labels,
colors: palette === "Custom" ? [c1, c2, c3, c4, c5] : [],
theme: {
palette: palette === "Custom" ? null : palette,
palette: parsePalette(palette),
},
legend: {
show: legend,

View File

@ -1,5 +1,6 @@
<script>
import ApexChart from "./ApexChart.svelte"
import { parsePalette } from "./utils"
export let dataProvider
export let valueColumn
@ -25,7 +26,7 @@
series,
colors: palette === "Custom" ? [c1, c2, c3, c4, c5] : [],
theme: {
palette: palette === "Custom" ? null : palette,
palette: parsePalette(palette),
},
title: {
text: title,

View File

@ -1,6 +1,6 @@
<script>
import ApexChart from "./ApexChart.svelte"
import { formatters } from "./utils"
import { formatters, parsePalette } from "./utils"
export let title
export let dataProvider
@ -35,7 +35,7 @@
},
colors: palette === "Custom" ? [c1, c2, c3, c4, c5] : [],
theme: {
palette: palette === "Custom" ? null : palette,
palette: parsePalette(palette),
},
legend: {
show: legend,

View File

@ -1,6 +1,6 @@
<script>
import ApexChart from "./ApexChart.svelte"
import { formatters } from "./utils"
import { formatters, parsePalette } from "./utils"
export let title
export let dataProvider
@ -26,7 +26,7 @@
labels,
colors: palette === "Custom" ? [c1, c2, c3, c4, c5] : [],
theme: {
palette: palette === "Custom" ? null : palette,
palette: parsePalette(palette),
},
legend: {
show: legend,

View File

@ -5,6 +5,17 @@ export const formatters = {
["Datetime"]: val => new Date(val).toLocaleString(),
}
export const parsePalette = (paletteName) => {
if (paletteName === "Custom") {
// return null in this case so that the palette option doesn't get consumed by Apex Charts
return null;
}
const [_, number] = paletteName.split(" ");
return `pallete${number}`
}
// Deep clone which copies function references
export const cloneDeep = (value) => {
const typesToNaiveCopy = ["string", "boolean", "number", "function", "symbol"]