@octanejs/recharts 0.1.52 → 0.1.53

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@octanejs/recharts",
-  "version": "0.1.52",
+  "version": "0.1.53",
   "license": "MIT",
   "type": "module",
   "engines": {
@@ -43,10 +43,10 @@
     "reselect": "5.2.0",
     "tiny-invariant": "^1.3.3",
     "victory-vendor": "^37.3.6",
-    "@octanejs/redux": "0.1.50"
+    "@octanejs/redux": "0.1.51"
   },
   "peerDependencies": {
-    "octane": "^0.1.51 || ^0.2.0"
+    "octane": "^0.1.51 || ^0.2.0 || ^0.3.0"
   },
   "devDependencies": {
     "@tsrx/react": "^0.3.0",
@@ -55,7 +55,7 @@
     "react-dom": "19.2.7",
     "recharts": "3.9.2",
     "vitest": "^4.1.10",
-    "octane": "0.2.14"
+    "octane": "0.3.0"
   },
   "scripts": {
     "test": "vitest run"

package/src/animation/useAnimationController.ts

@@ -12,7 +12,7 @@ const AnimationControllerContext = createContext(animationControllerImpl);
  * internally to drive animations.
  * @since 3.9
  */
-export const AnimationControllerProvider = AnimationControllerContext.Provider;
+export const AnimationControllerProvider = AnimationControllerContext;
 
 export function useAnimationController(
 	animationControllerFromProps?: AnimationController,

package/src/cartesian/Bar.tsrx

@@ -750,7 +750,7 @@ function BarImpl(props: BarImplProps) {
 		dataPointFormatter={errorBarDataPointFormatter}
 		errorBarOffset={errorBarOffset}
 	>
-		<CellsContext.Provider value={cellRegistry}>
+		<CellsContext value={cellRegistry}>
 			<BarWithState
 				{...props}
 				layout={layout}
@@ -767,7 +767,7 @@ function BarImpl(props: BarImplProps) {
 				animationEasing={animationEasing}
 				isAnimationActive={isAnimationActive}
 			/>
-		</CellsContext.Provider>
+		</CellsContext>
 	</SetErrorBarContext>;
 }
 

package/src/cartesian/BarStack.tsrx

@@ -106,10 +106,10 @@ function BarStackImpl(props: BarStackProps) @{
 		resolvedStackId,
 		radius,
 	]);
-	<BarStackContext.Provider value={context}>
+	<BarStackContext value={context}>
 		<BarStackClipPath stackId={resolvedStackId} radius={radius} />
 		{children}
-	</BarStackContext.Provider>
+	</BarStackContext>
 }
 
 /**

package/src/cartesian/Funnel.tsrx

@@ -614,7 +614,7 @@ function FunnelImpl(props: WithIdRequired<RequiresDefaultProps<Props, typeof def
 	}, [fill, hide, legendType, props.dataKey, trapezoids]);
 
 	if (hide || !trapezoids || !trapezoids.length || !plotArea) {
-		return <CellsContext.Provider value={cellRegistry}>
+		return <CellsContext value={cellRegistry}>
 			<SetLegendPayload legendPayload={legendPayload} />
 			<SetFunnelTooltipEntrySettings
 				dataKey={props.dataKey}
@@ -631,13 +631,13 @@ function FunnelImpl(props: WithIdRequired<RequiresDefaultProps<Props, typeof def
 				id={id}
 			/>
 			{props.children}
-		</CellsContext.Provider>;
+		</CellsContext>;
 	}
 	const { height, width } = plotArea;
 
 	const layerClass = clsx('recharts-trapezoids', props.className);
 
-	return <CellsContext.Provider value={cellRegistry}>
+	return <CellsContext value={cellRegistry}>
 		<SetLegendPayload legendPayload={legendPayload} />
 		<SetFunnelTooltipEntrySettings
 			dataKey={props.dataKey}
@@ -672,7 +672,7 @@ function FunnelImpl(props: WithIdRequired<RequiresDefaultProps<Props, typeof def
 				trapezoids={trapezoids}
 			/>
 		</Layer>
-	</CellsContext.Provider>;
+	</CellsContext>;
 }
 
 function normalizeFunnelValue(value: unknown): {

package/src/cartesian/Scatter.tsrx

@@ -1005,9 +1005,9 @@ function ScatterImpl(props: WithIdRequired<Props>) {
 		return selectScatterPoints(state, xAxisId, yAxisId, zAxisId, props.id, cells, isPanorama);
 	});
 	if (needClip == null || points == null) {
-		return <CellsContext.Provider value={cellRegistry}>{props.children}</CellsContext.Provider>;
+		return <CellsContext value={cellRegistry}>{props.children}</CellsContext>;
 	}
-	return <CellsContext.Provider value={cellRegistry}>
+	return <CellsContext value={cellRegistry}>
 		<SetScatterTooltipEntrySettings
 			dataKey={props.dataKey}
 			points={points}
@@ -1037,7 +1037,7 @@ function ScatterImpl(props: WithIdRequired<Props>) {
 			points={points}
 			needClip={needClip}
 		/>
-	</CellsContext.Provider>;
+	</CellsContext>;
 }
 
 function ScatterFn<DataPointType = any, ValueAxisType = any>(

package/src/chart/RechartsWrapper.tsrx

@@ -299,8 +299,8 @@ export function RechartsWrapper(props: RechartsWrapperProps) {
 		dispatch(externalEventAction({ handler: onTouchEnd, reactEvent: e }));
 	}, [dispatch, onTouchEnd]);
 	const WrapperDiv = responsive ? ResponsiveDiv : NonResponsiveDiv;
-	return <TooltipPortalContext.Provider value={tooltipPortal}>
-		<LegendPortalContext.Provider value={legendPortal}>
+	return <TooltipPortalContext value={tooltipPortal}>
+		<LegendPortalContext value={legendPortal}>
 			<WrapperDiv
 				width={width ?? style?.width}
 				height={height ?? style?.height}
@@ -325,6 +325,6 @@ export function RechartsWrapper(props: RechartsWrapperProps) {
 				<EventSynchronizer />
 				{children}
 			</WrapperDiv>
-		</LegendPortalContext.Provider>
-	</TooltipPortalContext.Provider>;
+		</LegendPortalContext>
+	</TooltipPortalContext>;
 }

package/src/chart/Sankey.tsrx

@@ -1516,7 +1516,7 @@ export function Sankey(outsideProps: Props) {
 			onTouchMove={undefined}
 			onTouchEnd={undefined}
 		>
-			<TooltipPortalContext.Provider value={tooltipPortal}>
+			<TooltipPortalContext value={tooltipPortal}>
 				<RegisterGraphicalItemId id={externalId} type="sankey">
 					{(id) => <>
 						<SetSankeyTooltipEntrySettings
@@ -1532,7 +1532,7 @@ export function Sankey(outsideProps: Props) {
 						<SankeyImpl {...props} id={id} />
 					</>}
 				</RegisterGraphicalItemId>
-			</TooltipPortalContext.Provider>
+			</TooltipPortalContext>
 		</RechartsWrapper>
 	</RechartsStoreProvider>;
 }

package/src/chart/SunburstChart.tsrx

@@ -475,7 +475,7 @@ export const SunburstChart = (outsideProps: SunburstChartProps) => {
 		<ReportChartSize width={width} height={height} />
 		<ReportChartMargin margin={defaultSunburstMargin} />
 		<ReportEventSettings throttleDelay={throttleDelay} throttledEvents={throttledEvents} />
-		<TooltipPortalContext.Provider value={tooltipPortal}>
+		<TooltipPortalContext value={tooltipPortal}>
 			<RechartsWrapper
 				className={className}
 				width={width}
@@ -503,6 +503,6 @@ export const SunburstChart = (outsideProps: SunburstChartProps) => {
 					{(id) => <SunburstChartImpl {...props} id={id} />}
 				</RegisterGraphicalItemId>
 			</RechartsWrapper>
-		</TooltipPortalContext.Provider>
+		</TooltipPortalContext>
 	</RechartsStoreProvider>;
 };

package/src/component/Label.tsrx

@@ -92,7 +92,7 @@ export function CartesianLabelContextProvider(props: TrapezoidViewBox & {
 		width,
 		height,
 	]);
-	<CartesianLabelContext.Provider value={viewBox}>{children}</CartesianLabelContext.Provider>
+	<CartesianLabelContext value={viewBox}>{children}</CartesianLabelContext>
 }
 
 function useCartesianLabelContext() {
@@ -112,7 +112,7 @@ export function PolarLabelContextProvider(props: PolarViewBoxRequired & {
 		() => ({ cx, cy, innerRadius, outerRadius, startAngle, endAngle, clockWise }),
 		[cx, cy, innerRadius, outerRadius, startAngle, endAngle, clockWise],
 	);
-	<PolarLabelContext.Provider value={viewBox}>{children}</PolarLabelContext.Provider>
+	<PolarLabelContext value={viewBox}>{children}</PolarLabelContext>
 }
 
 export function usePolarLabelContext() {

package/src/component/LabelList.tsrx

@@ -64,11 +64,11 @@ const defaultAccessor = (entry: LabelListEntry) => {
 const CartesianLabelListContext = createContext<ReadonlyArray<CartesianLabelListEntry> | undefined>(
 	undefined,
 );
-export const CartesianLabelListContextProvider = CartesianLabelListContext.Provider;
+export const CartesianLabelListContextProvider = CartesianLabelListContext;
 const PolarLabelListContext = createContext<ReadonlyArray<PolarLabelListEntry> | undefined>(
 	undefined,
 );
-export const PolarLabelListContextProvider = PolarLabelListContext.Provider;
+export const PolarLabelListContextProvider = PolarLabelListContext;
 
 function useCartesianLabelListContext() {
 	return useContext(CartesianLabelListContext);

package/src/component/ResponsiveContainer.tsrx

@@ -49,7 +49,7 @@ export interface Props extends Omit<
 const initialDimension = defaultResponsiveContainerProps.initialDimension;
 const ResponsiveContainerContext = createContext<ResponsiveContainerDimensions>(initialDimension);
 
-export const ResponsiveContainerContextProviderInternal = ResponsiveContainerContext.Provider;
+export const ResponsiveContainerContextProviderInternal = ResponsiveContainerContext;
 export const useResponsiveContainerContext = () => useContext(ResponsiveContainerContext);
 export { initialDimension as defaultResponsiveContainerDimension };
 

package/src/container/ClipPathProvider.tsrx

@@ -18,14 +18,14 @@ export function ClipPathProvider(props: {
 		return null;
 	}
 	const { x, y, width, height } = plotArea;
-	<ClipPathIdContext.Provider value={clipPathId}>
+	<ClipPathIdContext value={clipPathId}>
 		<defs>
 			<clipPath id={clipPathId}>
 				<rect x={x} y={y} height={height} width={width} />
 			</clipPath>
 		</defs>
 		{children}
-	</ClipPathIdContext.Provider>
+	</ClipPathIdContext>
 }
 
 export const useClipPathId = () => {

package/src/context/CellsContext.ts

@@ -33,7 +33,7 @@ function toCellArray(map: Map<object, CellProps>): RegisteredCell[] | undefined
 
 /**
  * Owns the collected cells state. Returns `[cells, registry]`; provide the
- * registry via `<CellsContext.Provider value={registry}>` around the item's
+ * registry via `<CellsContext value={registry}>` around the item's
  * children, and pass `cells` wherever upstream passed findAllByType's result.
  * `cells` is `undefined` until the first Cell registers — matching upstream,
  * where a childless item passes an empty find result whose `cells[index]`

package/src/context/ErrorBarContext.tsrx

@@ -37,7 +37,7 @@ export function SetErrorBarContext<
 	children: OctaneNode;
 }) {
 	const { children, ...rest } = props;
-	return <ErrorBarContext.Provider value={rest}>{children}</ErrorBarContext.Provider>;
+	return <ErrorBarContext value={rest}>{children}</ErrorBarContext>;
 }
 
 export const useErrorBarContext = () => useContext(ErrorBarContext);

package/src/context/RegisterGraphicalItemId.tsrx

@@ -17,9 +17,7 @@ const GraphicalItemIdContext = createContext<GraphicalItemId | undefined>(undefi
 export function RegisterGraphicalItemId(props: IdSetter) {
 	const { id, type, children } = props;
 	const resolvedId = useUniqueId('recharts-' + type, id);
-	return <GraphicalItemIdContext.Provider value={resolvedId}>{children(
-		resolvedId,
-	)}</GraphicalItemIdContext.Provider>;
+	return <GraphicalItemIdContext value={resolvedId}>{children(resolvedId)}</GraphicalItemIdContext>;
 }
 
 export function useGraphicalItemId() {

package/src/polar/Pie.tsrx

@@ -1154,17 +1154,17 @@ function PieImpl(props: WithIdRequired<PropsWithResolvedDefaults>) {
 
 	if (sectors == null) {
 		previousSectorsRef.current = null;
-		return <CellsContext.Provider value={cellRegistry}>
+		return <CellsContext value={cellRegistry}>
 			<SetPiePayloadLegend cells={cells} id={id} />
 			<Layer tabIndex={rootTabIndex} className={layerClass}>{props.children}</Layer>
-		</CellsContext.Provider>;
+		</CellsContext>;
 	}
 
 	if (hide) {
 		previousSectorsRef.current = null;
 	}
 
-	return <CellsContext.Provider value={cellRegistry}>
+	return <CellsContext value={cellRegistry}>
 		<SetPiePayloadLegend cells={cells} id={id} />
 		<ZIndexLayer zIndex={props.zIndex}>
 			<SetPieTooltipEntrySettings
@@ -1191,7 +1191,7 @@ function PieImpl(props: WithIdRequired<PropsWithResolvedDefaults>) {
 					: props.children}
 			</Layer>
 		</ZIndexLayer>
-	</CellsContext.Provider>;
+	</CellsContext>;
 }
 
 type PropsWithResolvedDefaults = RequiresDefaultProps<Props, typeof defaultPieProps>;

package/src/polar/RadialBar.tsrx

@@ -687,7 +687,7 @@ function RadialBarImpl(props: WithIdRequired<PropsWithDefaults>) {
 			),
 		) ??
 			STABLE_EMPTY_ARRAY;
-	return <CellsContext.Provider value={cellRegistry}>
+	return <CellsContext value={cellRegistry}>
 		<SetRadialBarTooltipEntrySettings
 			dataKey={props.dataKey}
 			sectors={sectors}
@@ -701,7 +701,7 @@ function RadialBarImpl(props: WithIdRequired<PropsWithDefaults>) {
 			id={props.id}
 		/>
 		<RadialBarWithState {...props} sectors={sectors} />
-	</CellsContext.Provider>;
+	</CellsContext>;
 }
 
 export const defaultRadialBarProps = {