layerchart 1.0.4 → 1.0.6
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.
|
@@ -39,12 +39,14 @@
|
|
|
39
39
|
import { onMount, onDestroy } from 'svelte';
|
|
40
40
|
import { cls } from '@layerstack/tailwind';
|
|
41
41
|
import { Logger, localPoint } from '@layerstack/utils';
|
|
42
|
+
import { darkColorScheme } from '@layerstack/svelte-stores';
|
|
42
43
|
|
|
43
44
|
import { setRenderContext } from '../Chart.svelte';
|
|
44
45
|
import { chartContext } from '../ChartContext.svelte';
|
|
45
46
|
import { transformContext } from '../TransformContext.svelte';
|
|
46
47
|
import { getPixelColor, scaleCanvas, type ComputedStylesOptions } from '../../utils/canvas.js';
|
|
47
48
|
import { getColorStr, rgbColorGenerator } from '../../utils/color.js';
|
|
49
|
+
|
|
48
50
|
const { width, height, containerWidth, containerHeight, padding } = chartContext();
|
|
49
51
|
|
|
50
52
|
/** The `<canvas>` tag. Useful for bindings. */
|
|
@@ -153,6 +155,24 @@
|
|
|
153
155
|
hitCanvasContext = hitCanvasElement?.getContext('2d', {
|
|
154
156
|
willReadFrequently: false, // Explicitly set to `false` to resolve pixel artifacts between fill and stroke with the same color (issue #372)
|
|
155
157
|
}) as CanvasRenderingContext2D;
|
|
158
|
+
|
|
159
|
+
// Invalidate/redraw if color scheme changes, either via browser `prefers-color-scheme` (including emulation) or by changing `<html class="dark">` or `<html data-theme="...">`
|
|
160
|
+
darkColorScheme.subscribe(() => {
|
|
161
|
+
canvasContext.invalidate();
|
|
162
|
+
});
|
|
163
|
+
|
|
164
|
+
const observer = new MutationObserver(() => {
|
|
165
|
+
canvasContext.invalidate();
|
|
166
|
+
});
|
|
167
|
+
|
|
168
|
+
observer.observe(document.documentElement, {
|
|
169
|
+
attributes: true,
|
|
170
|
+
attributeFilter: ['class', 'data-theme'],
|
|
171
|
+
});
|
|
172
|
+
|
|
173
|
+
return () => {
|
|
174
|
+
observer.disconnect();
|
|
175
|
+
};
|
|
156
176
|
});
|
|
157
177
|
|
|
158
178
|
onDestroy(() => {
|
|
@@ -421,7 +421,8 @@
|
|
|
421
421
|
hideTooltip();
|
|
422
422
|
}}
|
|
423
423
|
on:click={(e) => {
|
|
424
|
-
|
|
424
|
+
// Ignore clicks without data (triggered from Legend clicks, for example)
|
|
425
|
+
if (triggerPointerEvents && $tooltip?.data != null) {
|
|
425
426
|
onclick(e, { data: $tooltip?.data });
|
|
426
427
|
}
|
|
427
428
|
}}
|