solid-recharts 0.1.0

package/src/state/selectors/radarSelectors.ts

@@ -0,0 +1,152 @@
+// Ported from recharts 3.8.1 src/state/selectors/radarSelectors.ts (commit 7a23854).
+//
+// FULL SOLID-NATIVE REWRITE: reselect `createSelector` → plain functions
+// (memoization via `useAppSelector`'s `createMemo`).
+import { RechartsRootState } from "../store";
+import { AxisId } from "../cartesianAxisSlice";
+import { GraphicalItemId } from "../graphicalItemsSlice";
+import {
+  AngleAxisForRadar,
+  computeRadarPoints,
+  RadarComposedData,
+  RadiusAxisForRadar,
+} from "../../polar/Radar";
+import { BaseAxisWithScale } from "./axisSelectors";
+import { selectPolarAxisScale, selectPolarAxisTicks } from "./polarScaleSelectors";
+import { selectAngleAxis, selectPolarViewBox, selectRadiusAxis } from "./polarAxisSelectors";
+import { selectChartDataAndAlwaysIgnoreIndexes } from "./dataSelectors";
+import { DataKey, TickItem } from "../../util/types";
+import { selectChartLayout } from "../../context/chartLayoutContext";
+import { getBandSizeOfAxis, isCategoricalAxis } from "../../util/ChartUtils";
+import { RechartsScale } from "../../util/scale/RechartsScale";
+import { selectUnfilteredPolarItems } from "./polarSelectors";
+
+const selectRadiusAxisScale = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+): RechartsScale | undefined => selectPolarAxisScale(state, "radiusAxis", radiusAxisId);
+
+const selectRadiusAxisForRadar = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+): RadiusAxisForRadar | undefined => {
+  const scale = selectRadiusAxisScale(state, radiusAxisId);
+  return scale == null ? undefined : { scale };
+};
+
+export const selectRadiusAxisForBandSize = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+): BaseAxisWithScale | undefined => {
+  const axisSettings = selectRadiusAxis(state, radiusAxisId);
+  const scale = selectRadiusAxisScale(state, radiusAxisId);
+  if (axisSettings == null || scale == null) {
+    return undefined;
+  }
+  return { ...axisSettings, scale };
+};
+
+const selectRadiusAxisTicks = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+  isPanorama: boolean,
+): ReadonlyArray<TickItem> | undefined =>
+  selectPolarAxisTicks(state, "radiusAxis", radiusAxisId, isPanorama);
+
+const selectPolarAxisScaleForAngle = (
+  state: RechartsRootState,
+  angleAxisId: AxisId,
+): RechartsScale | undefined => selectPolarAxisScale(state, "angleAxis", angleAxisId);
+
+export const selectAngleAxisForBandSize = (
+  state: RechartsRootState,
+  angleAxisId: AxisId,
+): BaseAxisWithScale | undefined => {
+  const axisSettings = selectAngleAxis(state, angleAxisId);
+  const scale = selectPolarAxisScaleForAngle(state, angleAxisId);
+  if (axisSettings == null || scale == null) {
+    return undefined;
+  }
+  return { ...axisSettings, scale };
+};
+
+const selectAngleAxisTicks = (
+  state: RechartsRootState,
+  angleAxisId: AxisId,
+  isPanorama: boolean,
+): ReadonlyArray<TickItem> | undefined =>
+  selectPolarAxisTicks(state, "angleAxis", angleAxisId, isPanorama);
+
+export const selectAngleAxisWithScaleAndViewport = (
+  state: RechartsRootState,
+  angleAxisId: AxisId,
+): AngleAxisForRadar | undefined => {
+  const axisOptions = selectAngleAxis(state, angleAxisId);
+  const scale = selectPolarAxisScaleForAngle(state, angleAxisId);
+  const polarViewBox = selectPolarViewBox(state);
+  if (polarViewBox == null || scale == null) {
+    return undefined;
+  }
+  return {
+    scale,
+    type: axisOptions.type,
+    dataKey: axisOptions.dataKey,
+    cx: polarViewBox.cx,
+    cy: polarViewBox.cy,
+  };
+};
+
+const selectBandSizeOfAxis = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+  angleAxisId: AxisId,
+  isPanorama: boolean,
+): number | undefined => {
+  const layout = selectChartLayout(state);
+  if (isCategoricalAxis(layout, "radiusAxis")) {
+    return getBandSizeOfAxis(
+      selectRadiusAxisForBandSize(state, radiusAxisId),
+      selectRadiusAxisTicks(state, radiusAxisId, isPanorama),
+      false,
+    );
+  }
+  return getBandSizeOfAxis(
+    selectAngleAxisForBandSize(state, angleAxisId),
+    selectAngleAxisTicks(state, angleAxisId, isPanorama),
+    false,
+  );
+};
+
+const selectSynchronisedRadarDataKey = (
+  state: RechartsRootState,
+  radarId: GraphicalItemId,
+): DataKey<unknown> | undefined => {
+  const items = selectUnfilteredPolarItems(state);
+  const pgis = items.find((item) => item.type === "radar" && radarId === item.id);
+  return pgis?.dataKey;
+};
+
+export const selectRadarPoints = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+  angleAxisId: AxisId,
+  isPanorama: boolean,
+  radarId: GraphicalItemId,
+): RadarComposedData | undefined => {
+  const radiusAxis = selectRadiusAxisForRadar(state, radiusAxisId);
+  const angleAxis = selectAngleAxisWithScaleAndViewport(state, angleAxisId);
+  const { chartData, dataStartIndex, dataEndIndex } = selectChartDataAndAlwaysIgnoreIndexes(state);
+  const dataKey = selectSynchronisedRadarDataKey(state, radarId);
+  const bandSize = selectBandSizeOfAxis(state, radiusAxisId, angleAxisId, isPanorama);
+  if (
+    radiusAxis == null ||
+    angleAxis == null ||
+    chartData == null ||
+    bandSize == null ||
+    dataKey == null
+  ) {
+    return undefined;
+  }
+  const displayedData = chartData.slice(dataStartIndex, dataEndIndex + 1);
+  return computeRadarPoints({ radiusAxis, angleAxis, displayedData, dataKey, bandSize });
+};

package/src/state/selectors/radialBarSelectors.ts

@@ -0,0 +1,328 @@
+// Ported from recharts 3.8.1 src/state/selectors/radialBarSelectors.ts (commit 7a23854).
+//
+// FULL SOLID-NATIVE REWRITE: reselect `createSelector` → plain functions. Reuses
+// the cartesian bar-position machinery (combineBarSizeList / combineAllBarPositions
+// / combineBarPosition) keyed by the polar axes.
+//
+// STACKS wired (reference selectStackedRadialBars → selectPolarCombinedStackedData →
+// selectStackGroups → selectPolarStackedData, inlined into selectRadialBarSectors):
+// stacked RadialBars sharing a stackId render adjacent arcs from the shared d3 stack
+// series. `selectRadialBarLegendPayload` (per-row legend) IS wired here.
+import { RechartsRootState } from "../store";
+import { AxisId } from "../cartesianAxisSlice";
+import { ChartData } from "../chartDataSlice";
+import { LayoutType, LegendType, TickItem } from "../../util/types";
+import { LegendPayload } from "../../component/DefaultLegendContent";
+import { selectChartDataAndAlwaysIgnoreIndexes } from "./dataSelectors";
+import {
+  selectPolarAxisScale,
+  selectPolarAxisTicks,
+  selectPolarGraphicalItemAxisTicks,
+} from "./polarScaleSelectors";
+import { selectAngleAxis, selectPolarViewBox, selectRadiusAxis } from "./polarAxisSelectors";
+import { selectChartDataWithIndexes } from "./dataSelectors";
+import { BaseAxisWithScale } from "./axisSelectors";
+import { selectChartLayout } from "../../context/chartLayoutContext";
+import {
+  getBandSizeOfAxis,
+  getBaseValueOfBar,
+  getValueByDataKey,
+  isCategoricalAxis,
+} from "../../util/ChartUtils";
+import { BarWithPosition, SizeList } from "./barSelectors";
+import {
+  selectBarCategoryGap,
+  selectBarGap,
+  selectRootBarSize,
+  selectRootMaxBarSize,
+} from "./rootPropsSelectors";
+import { PolarGraphicalItemSettings } from "../graphicalItemsSlice";
+import { selectPolarStackGroups, selectUnfilteredPolarItems } from "./polarSelectors";
+import { combineStackedData } from "./combiners/combineStackedData";
+import { isNullish, isNumOrStr } from "../../util/DataUtils";
+import { combineBarSizeList } from "./combiners/combineBarSizeList";
+import { combineAllBarPositions } from "./combiners/combineAllBarPositions";
+import { combineBarPosition } from "./combiners/combineBarPosition";
+import { BarPositionPosition } from "../../util/ChartUtils";
+import { RadialBarSettings } from "../types/RadialBarSettings";
+import { computeRadialBarDataItems, RadialBarDataItem } from "../../polar/RadialBar";
+import type { CellProps } from "../../component/Cell";
+
+export const selectRadiusAxisWithScale = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+): BaseAxisWithScale | undefined => {
+  const axis = selectRadiusAxis(state, radiusAxisId);
+  const scale = selectPolarAxisScale(state, "radiusAxis", radiusAxisId);
+  if (axis == null || scale == null) {
+    return undefined;
+  }
+  return { ...axis, scale };
+};
+
+export const selectRadiusAxisTicks = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+): ReadonlyArray<TickItem> | undefined =>
+  selectPolarGraphicalItemAxisTicks(state, "radiusAxis", radiusAxisId, false);
+
+export const selectAngleAxisWithScale = (
+  state: RechartsRootState,
+  angleAxisId: AxisId,
+): BaseAxisWithScale | undefined => {
+  const axis = selectAngleAxis(state, angleAxisId);
+  const scale = selectPolarAxisScale(state, "angleAxis", angleAxisId);
+  if (axis == null || scale == null) {
+    return undefined;
+  }
+  return { ...axis, scale };
+};
+
+const selectAngleAxisTicks = (
+  state: RechartsRootState,
+  angleAxisId: AxisId,
+): ReadonlyArray<TickItem> | undefined =>
+  selectPolarAxisTicks(state, "angleAxis", angleAxisId, false);
+
+const isRadialBar = (item: PolarGraphicalItemSettings): item is RadialBarSettings =>
+  item.type === "radialBar";
+
+const selectSynchronisedRadialBarSettings = (
+  state: RechartsRootState,
+  radialBarSettings: RadialBarSettings,
+): RadialBarSettings | undefined => {
+  const items = selectUnfilteredPolarItems(state);
+  if (
+    items.some(
+      (pgis) =>
+        pgis.type === "radialBar" &&
+        radialBarSettings.dataKey === pgis.dataKey &&
+        radialBarSettings.stackId === pgis.stackId,
+    )
+  ) {
+    return radialBarSettings;
+  }
+  return undefined;
+};
+
+export const selectBandSizeOfPolarAxis = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+  angleAxisId: AxisId,
+): number | undefined => {
+  const layout = selectChartLayout(state);
+  if (isCategoricalAxis(layout, "radiusAxis")) {
+    return getBandSizeOfAxis(
+      selectRadiusAxisWithScale(state, radiusAxisId),
+      selectRadiusAxisTicks(state, radiusAxisId),
+      false,
+    );
+  }
+  return getBandSizeOfAxis(
+    selectAngleAxisWithScale(state, angleAxisId),
+    selectAngleAxisTicks(state, angleAxisId),
+    false,
+  );
+};
+
+export const selectBaseValue = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+  angleAxisId: AxisId,
+): unknown => {
+  const layout = selectChartLayout(state);
+  const numericAxis =
+    layout === "radial"
+      ? selectAngleAxisWithScale(state, angleAxisId)
+      : selectRadiusAxisWithScale(state, radiusAxisId);
+  if (numericAxis == null || numericAxis.scale == null) {
+    return undefined;
+  }
+  return getBaseValueOfBar({ numericAxis });
+};
+
+const selectAllVisibleRadialBars = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+  angleAxisId: AxisId,
+): ReadonlyArray<RadialBarSettings> => {
+  const layout = selectChartLayout(state);
+  return selectUnfilteredPolarItems(state)
+    .filter((i) =>
+      layout === "centric" ? i.angleAxisId === angleAxisId : i.radiusAxisId === radiusAxisId,
+    )
+    .filter((i) => i.hide === false)
+    .filter(isRadialBar);
+};
+
+// The generator never returns a total size for polar charts → percent barSize
+// is unsupported (recharts note).
+const selectPolarBarAxisSize = (): undefined => undefined;
+
+export const selectPolarBarSizeList = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+  angleAxisId: AxisId,
+): SizeList =>
+  combineBarSizeList(
+    selectAllVisibleRadialBars(state, radiusAxisId, angleAxisId),
+    selectRootBarSize(state),
+    selectPolarBarAxisSize(),
+  );
+
+export const selectPolarBarBandSize = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+  angleAxisId: AxisId,
+  radialBarSettings: RadialBarSettings,
+): number => {
+  const layout = selectChartLayout(state);
+  const globalMaxBarSize = selectRootMaxBarSize(state);
+  const childMaxBarSize = radialBarSettings.maxBarSize;
+  const maxBarSize = isNullish(childMaxBarSize) ? globalMaxBarSize : childMaxBarSize;
+  if (layout === "centric") {
+    return (
+      getBandSizeOfAxis(
+        selectAngleAxisWithScale(state, angleAxisId),
+        selectAngleAxisTicks(state, angleAxisId),
+        true,
+      ) ??
+      maxBarSize ??
+      0
+    );
+  }
+  return (
+    getBandSizeOfAxis(
+      selectRadiusAxisWithScale(state, radiusAxisId),
+      selectRadiusAxisTicks(state, radiusAxisId),
+      true,
+    ) ??
+    maxBarSize ??
+    0
+  );
+};
+
+export const selectAllPolarBarPositions = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+  angleAxisId: AxisId,
+  radialBarSettings: RadialBarSettings,
+): ReadonlyArray<BarWithPosition> | undefined =>
+  combineAllBarPositions(
+    selectPolarBarSizeList(state, radiusAxisId, angleAxisId),
+    selectRootMaxBarSize(state),
+    selectBarGap(state),
+    selectBarCategoryGap(state),
+    selectPolarBarBandSize(state, radiusAxisId, angleAxisId, radialBarSettings),
+    selectBandSizeOfPolarAxis(state, radiusAxisId, angleAxisId),
+    radialBarSettings.maxBarSize,
+  );
+
+export const selectPolarBarPosition = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+  angleAxisId: AxisId,
+  radialBarSettings: RadialBarSettings,
+): BarPositionPosition | undefined =>
+  combineBarPosition(
+    selectAllPolarBarPositions(state, radiusAxisId, angleAxisId, radialBarSettings),
+    selectSynchronisedRadialBarSettings(state, radialBarSettings),
+  );
+
+export const selectRadialBarSectors = (
+  state: RechartsRootState,
+  radiusAxisId: AxisId,
+  angleAxisId: AxisId,
+  radialBarSettings: RadialBarSettings,
+  cells?: ReadonlyArray<CellProps>,
+): ReadonlyArray<RadialBarDataItem> => {
+  const angleAxis = selectAngleAxisWithScale(state, angleAxisId);
+  const angleAxisTicks = selectAngleAxisTicks(state, angleAxisId);
+  const radiusAxis = selectRadiusAxisWithScale(state, radiusAxisId);
+  const radiusAxisTicks = selectRadiusAxisTicks(state, radiusAxisId);
+  const { chartData, dataStartIndex, dataEndIndex } = selectChartDataWithIndexes(state);
+  const settings = selectSynchronisedRadialBarSettings(state, radialBarSettings);
+  const bandSize = selectBandSizeOfPolarAxis(state, radiusAxisId, angleAxisId);
+  const layout: LayoutType = selectChartLayout(state);
+  const baseValue = selectBaseValue(state, radiusAxisId, angleAxisId);
+  const polarViewBox = selectPolarViewBox(state);
+  const pos = selectPolarBarPosition(state, radiusAxisId, angleAxisId, radialBarSettings);
+
+  if (
+    settings == null ||
+    radiusAxis == null ||
+    angleAxis == null ||
+    chartData == null ||
+    bandSize == null ||
+    pos == null ||
+    (layout !== "centric" && layout !== "radial") ||
+    radiusAxisTicks == null ||
+    polarViewBox == null
+  ) {
+    return [];
+  }
+  // Stack chain (reference selectPolarStackedData): the polar stack groups on the
+  // numeric axis (radius axis in centric layout, angle axis in radial layout) →
+  // this item's stack series.
+  const stackAxisType = layout === "centric" ? ("radiusAxis" as const) : ("angleAxis" as const);
+  const stackAxisId = layout === "centric" ? radiusAxisId : angleAxisId;
+  const stackedData = combineStackedData(
+    selectPolarStackGroups(state, stackAxisType, stackAxisId),
+    settings,
+  );
+  const numericAxis = layout === "centric" ? radiusAxis : angleAxis;
+  const stackedDomain: ReadonlyArray<unknown> | null =
+    stackedData != null ? numericAxis.scale.domain() : null;
+
+  const { dataKey, minPointSize } = settings;
+  const { cx, cy, startAngle, endAngle } = polarViewBox;
+  const displayedData: ChartData = chartData.slice(dataStartIndex, dataEndIndex + 1);
+  return computeRadialBarDataItems({
+    angleAxis,
+    angleAxisTicks,
+    bandSize,
+    baseValue,
+    cx,
+    cy,
+    dataKey,
+    dataStartIndex,
+    displayedData,
+    endAngle,
+    layout,
+    minPointSize,
+    pos,
+    radiusAxis,
+    radiusAxisTicks,
+    stackedData,
+    stackedDomain,
+    startAngle,
+    cells,
+  });
+};
+
+// One legend entry per displayed data row (recharts' selectRadialBarLegendPayload).
+// Faithful to reference: reads `name`/`fill` straight off each row — RadialBar's
+// legend does NOT merge <Cell> props (unlike the sectors / Pie legend).
+export const selectRadialBarLegendPayload = (
+  state: RechartsRootState,
+  legendType: LegendType | undefined,
+): ReadonlyArray<LegendPayload> => {
+  const { chartData, dataStartIndex, dataEndIndex } = selectChartDataAndAlwaysIgnoreIndexes(state);
+  if (chartData == null) {
+    return [];
+  }
+  const displayedData = chartData.slice(dataStartIndex, dataEndIndex + 1);
+  if (displayedData.length === 0) {
+    return [];
+  }
+  return displayedData.map((entry): LegendPayload => {
+    const nameRaw: unknown = getValueByDataKey(entry, "name");
+    const fillRaw: unknown = getValueByDataKey(entry, "fill");
+    return {
+      type: legendType,
+      value: isNumOrStr(nameRaw) ? String(nameRaw) : undefined,
+      color: typeof fillRaw === "string" ? fillRaw : undefined,
+      payload: typeof entry === "object" && entry != null ? entry : undefined,
+    };
+  });
+};

package/src/state/selectors/rootPropsSelectors.ts

@@ -0,0 +1,36 @@
+// Partial port of recharts 3.8.1 src/state/selectors/rootPropsSelectors.ts
+// (commit 7a23854). Only the leaf accessors the axis vertical needs today; the
+// module grows as more root props are consumed.
+import { RechartsRootState } from "../store";
+import { BaseValue, StackOffsetType, SyncMethod } from "../../util/types";
+
+export const selectBarCategoryGap = (state: RechartsRootState): string | number =>
+  state.rootProps.barCategoryGap;
+
+export const selectBarGap = (state: RechartsRootState): string | number => state.rootProps.barGap;
+
+export const selectRootBarSize = (state: RechartsRootState): string | number | undefined =>
+  state.rootProps.barSize;
+
+export const selectRootMaxBarSize = (state: RechartsRootState): number | undefined =>
+  state.rootProps.maxBarSize;
+
+export const selectStackOffsetType = (state: RechartsRootState): StackOffsetType =>
+  state.rootProps.stackOffset;
+
+export const selectReverseStackOrder = (state: RechartsRootState): boolean =>
+  state.rootProps.reverseStackOrder;
+
+export const selectChartName = (state: RechartsRootState): string => state.options.chartName;
+
+export const selectChartBaseValue = (state: RechartsRootState): BaseValue | undefined =>
+  state.rootProps.baseValue;
+
+export const selectSyncMethod = (state: RechartsRootState): SyncMethod =>
+  state.rootProps.syncMethod;
+
+export const selectSyncId = (state: RechartsRootState): number | string | undefined =>
+  state.rootProps.syncId;
+
+export const selectEventEmitter = (state: RechartsRootState): symbol | undefined =>
+  state.options.eventEmitter;

package/src/state/selectors/scatterSelectors.ts

@@ -0,0 +1,77 @@
+// Ported from recharts 3.8.1 src/state/selectors/scatterSelectors.ts (commit 7a23854).
+// Solid-native plain functions. The `cells` parameter (per-point <Cell> overrides)
+// is wired — see [[cells-cellreader-port]].
+import { computeScatterPoints, ScatterPointItem } from "../../cartesian/Scatter";
+import type { CellProps } from "../../component/Cell";
+import { RechartsRootState } from "../store";
+import { AxisId } from "../cartesianAxisSlice";
+import { selectChartDataWithIndexesIfNotInPanoramaPosition4 } from "./dataSelectors";
+import { ChartData } from "../chartDataSlice";
+import {
+  selectAxisWithScale,
+  selectTicksOfGraphicalItem,
+  selectUnfilteredCartesianItems,
+  selectZAxisWithScale,
+} from "./axisSelectors";
+import { ScatterSettings } from "../types/ScatterSettings";
+import { GraphicalItemId } from "../graphicalItemsSlice";
+
+const selectSynchronisedScatterSettings = (
+  state: RechartsRootState,
+  id: GraphicalItemId,
+): ScatterSettings | undefined => {
+  const item = selectUnfilteredCartesianItems(state).find((it) => it.id === id);
+  return item != null && item.type === "scatter" ? item : undefined;
+};
+
+export const selectScatterPoints = (
+  state: RechartsRootState,
+  xAxisId: AxisId,
+  yAxisId: AxisId,
+  zAxisId: AxisId,
+  id: GraphicalItemId,
+  isPanorama: boolean,
+  cells?: ReadonlyArray<CellProps>,
+): ReadonlyArray<ScatterPointItem> | undefined => {
+  const scatterSettings = selectSynchronisedScatterSettings(state, id);
+  if (scatterSettings == null) {
+    return undefined;
+  }
+  const xAxis = selectAxisWithScale(state, "xAxis", xAxisId, isPanorama);
+  const yAxis = selectAxisWithScale(state, "yAxis", yAxisId, isPanorama);
+  const xAxisTicks = selectTicksOfGraphicalItem(state, "xAxis", xAxisId, isPanorama);
+  const yAxisTicks = selectTicksOfGraphicalItem(state, "yAxis", yAxisId, isPanorama);
+  const zAxis = selectZAxisWithScale(state, "zAxis", zAxisId, false);
+  const { chartData, dataStartIndex, dataEndIndex } =
+    selectChartDataWithIndexesIfNotInPanoramaPosition4(state, undefined, undefined, isPanorama);
+
+  let displayedData: ChartData | undefined;
+  if (scatterSettings.data != null && scatterSettings.data.length > 0) {
+    displayedData = scatterSettings.data;
+  } else {
+    displayedData = chartData?.slice(dataStartIndex, dataEndIndex + 1);
+  }
+
+  if (
+    displayedData == null ||
+    xAxis == null ||
+    yAxis == null ||
+    xAxisTicks == null ||
+    yAxisTicks == null ||
+    xAxisTicks.length === 0 ||
+    yAxisTicks.length === 0
+  ) {
+    return undefined;
+  }
+
+  return computeScatterPoints({
+    displayedData,
+    xAxis,
+    yAxis,
+    zAxis,
+    scatterSettings,
+    xAxisTicks,
+    yAxisTicks,
+    cells,
+  });
+};

package/src/state/selectors/selectAllAxes.ts

@@ -0,0 +1,10 @@
+// Ported from recharts 3.8.1 src/state/selectors/selectAllAxes.ts (commit 7a23854).
+// Solid-native: plain selectors (memoization comes from useAppSelector's createMemo).
+import { RechartsRootState } from "../store";
+import { XAxisSettings, YAxisSettings } from "../cartesianAxisSlice";
+
+export const selectAllXAxes = (state: RechartsRootState): ReadonlyArray<XAxisSettings> =>
+  Object.values(state.cartesianAxis.xAxis);
+
+export const selectAllYAxes = (state: RechartsRootState): ReadonlyArray<YAxisSettings> =>
+  Object.values(state.cartesianAxis.yAxis);

package/src/state/selectors/selectChartOffset.ts

@@ -0,0 +1,15 @@
+// Ported from recharts 3.8.1 src/state/selectors/selectChartOffset.ts (commit 7a23854).
+// Solid-native plain function (no reselect; memoization comes from useAppSelector).
+import { selectChartOffsetInternal } from "./selectChartOffsetInternal";
+import { RechartsRootState } from "../store";
+import { ChartOffset } from "../../types";
+
+export const selectChartOffset = (state: RechartsRootState): ChartOffset => {
+  const offsetInternal = selectChartOffsetInternal(state);
+  return {
+    top: offsetInternal.top,
+    bottom: offsetInternal.bottom,
+    left: offsetInternal.left,
+    right: offsetInternal.right,
+  };
+};