Update `plot-benchmarks` to use Svelte 5.0.
Test: Ran the app locally.
Change-Id: I7f0ed08b67bce54af608919cd621d7eef00e76bd
diff --git a/development/plot-benchmarks/src/lib/Chart.svelte b/development/plot-benchmarks/src/lib/Chart.svelte
index edf6584..c1143bf 100644
--- a/development/plot-benchmarks/src/lib/Chart.svelte
+++ b/development/plot-benchmarks/src/lib/Chart.svelte
@@ -15,13 +15,6 @@
export let isExperimental: boolean = false;
export let showHistogramControls: boolean = false;
- $: {
- if ($chart) {
- $chart.data = data;
- $chart.update();
- }
- }
-
// State
let controlsDispatcher = createEventDispatcher<ControlsEvent>();
let element: HTMLCanvasElement;
@@ -29,13 +22,20 @@
let chart: Writable<Chart | null> = writable(null);
let items: Writable<LegendItem[] | null> = writable(null);
+ $: {
+ if ($chart) {
+ $chart.data = data;
+ $chart.update();
+ }
+ }
+
// Effects
onMount(() => {
- const onUpdate = (chart: Chart) => {
- $chart = chart;
+ const onUpdate = (updated: Chart) => {
+ $chart = updated;
// Bad typings.
- const legend = chart.options.plugins?.legend as any;
- $items = legend.labels.generateLabels(chart);
+ const legend = updated.options.plugins?.legend as any;
+ $items = legend.labels.generateLabels($chart);
};
const plugins = {
tooltip: {
@@ -103,7 +103,7 @@
⎘
</button>
</div>
- <canvas class="chart" bind:this={element} />
+ <canvas class="chart" bind:this={element}> </canvas>
{#if showHistogramControls}
<div class="controls">
<label for="buckets">
