Move resolveAccessor out of AreaChart/BarChart and into series.svelte.ts, but will refine further into chart.svelte.ts soon.

Author: techniq

packages/layerchart/src/lib/components/charts/AreaChart.svelte

@@ -49,7 +49,6 @@
     chartDataArray,
     defaultChartPadding,
     getObjectOrNull,
-    type Accessor,
   } from '$lib/utils/common.js';
   import { SeriesState, type StackLayout } from '$lib/states/series.svelte.js';
   import type { BrushDomainType } from '../../states/brush.svelte.js';
@@ -110,32 +109,14 @@
       console.timeEnd('AreaChart render');
     });
   }
-
-  function resolveAccessor(acc: Accessor<TData> | undefined) {
-    if (seriesState.isStacked) {
-      // For stacked series, collect all y0/y1 values for domain calculation
-      return (d: TData) => {
-        const values: number[] = [];
-        for (const s of seriesState.visibleSeries) {
-          const stackValue = seriesState.getStackValue(s.key, d);
-          if (stackValue) {
-            values.push(stackValue[0], stackValue[1]);
-          }
-        }
-        return values.length ? values : undefined;
-      };
-    }
-    if (acc) return acc;
-    return seriesState.visibleSeries.map((s) => s.value ?? s.key);
-  }
 </script>
 
 <Chart
   bind:context
   {data}
   {x}
   {xDomain}
-  y={resolveAccessor(y)}
+  y={seriesState.getValueDomainAccessor(y)}
   yBaseline={0}
   yNice
   {radial}

packages/layerchart/src/lib/components/charts/BarChart.svelte

@@ -80,7 +80,6 @@
     accessor,
     chartDataArray,
     defaultChartPadding,
-    type Accessor,
   } from '$lib/utils/common.js';
   import { isScaleTime, type AnyScale } from '$lib/utils/scales.svelte.js';
   import { SeriesState, type StackLayout } from '$lib/states/series.svelte.js';
@@ -224,30 +223,12 @@
       console.timeEnd('BarChart render');
     });
   }
-
-  function resolveAccessor(acc: Accessor<TData> | undefined) {
-    if (acc) return acc;
-    if (seriesState.isStacked) {
-      // For stacked series, collect all y0/y1 values for domain calculation
-      return (d: TData) => {
-        const values: number[] = [];
-        for (const s of seriesState.visibleSeries) {
-          const stackValue = seriesState.getStackValue(s.key, d);
-          if (stackValue) {
-            values.push(stackValue[0], stackValue[1]);
-          }
-        }
-        return values.length ? values : undefined;
-      };
-    }
-    return seriesState.visibleSeries.map((s) => s.value ?? s.key);
-  }
 </script>
 
 <Chart
   bind:context
   {data}
-  x={resolveAccessor(xProp)}
+  x={valueAxis === 'x' ? seriesState.getValueDomainAccessor(xProp) : xProp}
   {xDomain}
   {xScale}
   {xBaseline}
@@ -256,7 +237,7 @@
   {x1Domain}
   {x1Range}
   {xInterval}
-  y={resolveAccessor(yProp)}
+  y={valueAxis === 'y' ? seriesState.getValueDomainAccessor(yProp) : yProp}
   {yScale}
   {yBaseline}
   yNice={valueAxis === 'y'}

packages/layerchart/src/lib/states/series.svelte.ts

@@ -122,6 +122,35 @@ export class SeriesState<TData, TComponent extends Component> {
     };
   }
 
+  /**
+   * Resolve accessor for domain calculation, handling stacked and multi-series cases.
+   * For stacked series, returns a function that collects all y0/y1 values.
+   * For multi-series without explicit accessor, returns array of series value accessors.
+   * @param acc - The explicit accessor provided by the user, if any
+   * @returns The resolved accessor for domain calculation
+   */
+  getValueDomainAccessor<T extends Accessor<TData>>(acc: T | undefined): T | Accessor<TData> {
+    // If explicit accessor provided, use it
+    if (acc) return acc;
+
+    // For stacked series, collect all y0/y1 values for domain calculation
+    if (this.isStacked) {
+      return ((d: TData) => {
+        const values: number[] = [];
+        for (const s of this.visibleSeries) {
+          const stackValue = this.getStackValue(s.key, d);
+          if (stackValue) {
+            values.push(stackValue[0], stackValue[1]);
+          }
+        }
+        return values.length ? values : undefined;
+      }) as Accessor<TData>;
+    }
+
+    // Multi-series: use all visible series accessors
+    return this.visibleSeries.map((s) => s.value ?? s.key) as Accessor<TData>;
+  }
+
   /**
    * Get all series for the chart.
    */