Fix Axis reactivity with LayerChart 1.x and Svelte 5.34+ (#643)

* Update Svelte to 5.38.2 to reproduce issue #641 and update LayerCake

* Add simle reproduction

* fix(Axis): Fix reactivity issue with xRange/yRange in Svelte 5.34+. Fixes #641

* Remove issue example

* Downgrade LayerCake back to 8.4.3 (fix svelte-check errors and update not needed at this time)

Author: techniq

.changeset/rude-gifts-type.md

@@ -0,0 +1,5 @@
+---
+'layerchart': patch
+---
+
+fix(Axis): Fix reactivity issue with xRange/yRange in Svelte 5.34+. Fixes #641

packages/layerchart/package.json

@@ -63,7 +63,7 @@
     "rehype-slug": "^6.0.0",
     "shapefile": "^0.6.6",
     "solar-calculator": "^0.3.0",
-    "svelte": "5.29.0",
+    "svelte": "5.38.2",
     "svelte-check": "^4.2.0",
     "svelte-json-tree": "^2.2.0",
     "svelte-ux": "^1.0.5",
@@ -105,7 +105,7 @@
     "d3-tile": "^1.0.0",
     "d3-time": "^3.1.0",
     "date-fns": "^4.1.0",
-    "layercake": "^8.4.3",
+    "layercake": "8.4.3",
     "lodash-es": "^4.17.21"
   },
   "peerDependencies": {

packages/layerchart/src/lib/components/Axis.svelte

@@ -87,9 +87,6 @@
     tickLabel?: string;
   } = {};
 
-  $: [xRangeMin, xRangeMax] = extent<number>($xRange) as [number, number];
-  $: [yRangeMin, yRangeMax] = extent<number>($yRange) as [number, number];
-
   $: tickVals = Array.isArray(ticks)
     ? ticks
     : typeof ticks === 'function'
@@ -102,7 +99,10 @@
             : _scale.domain()
           : _scale.ticks(ticks ?? (placement === 'left' || placement === 'right' ? 4 : undefined));
 
-  function getCoords(tick: any) {
+  function getCoords(tick: any, xRange: [number, number], yRange: [number, number]) {
+    const [xRangeMin, xRangeMax] = extent(xRange) as [number, number];
+    const [yRangeMin, yRangeMax] = extent(yRange) as [number, number];
+
     switch (placement) {
       case 'top':
         return {
@@ -257,7 +257,7 @@
   {/if}
 
   {#each tickVals as tick, index (tick)}
-    {@const tickCoords = getCoords(tick)}
+    {@const tickCoords = getCoords(tick, $xRange, $yRange)}
     {@const [radialTickCoordsX, radialTickCoordsY] = pointRadial(tickCoords.x, tickCoords.y)}
     {@const [radialTickMarkCoordsX, radialTickMarkCoordsY] = pointRadial(
       tickCoords.x,