Every data change went through renderChart, which rebuilt the chart from a
full option set: animations restarted and zoom/selection state was lost.
Add an updateData path that patches the live chart via ApexCharts'
updateSeries (and updateOptions only when categories/labels actually
change), exposed as AxisChart.updateData / PieChart.updateData. Before the
first render there is nothing to patch, so those fall back to setData.
The theme overlay is re-applied to the merged options, so a rebuild after
a detach starts from the patched data.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0124BiJikbhbiEsNfJxdWM69
The layout was saved to localStorage, but restoring it did not reliably
reproduce it:
- restore() applied the saved nodes one by one via grid.update(). A later
item could collide with one already put back and push it off its saved
spot, and nothing moved it back — so the restored layout was not the one
the user left. Use grid.load(nodes, false) instead: it sorts the nodes,
removes them from the engine before re-placing them, and runs in a single
batch. addRemove is off because Flow owns which children exist.
- gridstack's save() omits w/h when they are 1. The manual restore passed
them through as undefined, and the server read them as 0 and wrote a
zero-sized widget back onto the item. load() re-applies gridstack's own
defaults; onLayoutChange now reads a missing w/h as 1.
- A drag followed immediately by navigating to another route detached the
element inside the 150ms persist debounce, dropping the pending save.
disconnectedCallback now flushes it to localStorage first.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ue9ZtWUBQF4SuSHpzZ3zwq