@octanejs/recharts 0.1.62 → 0.1.64

package/src/component/TooltipBoundingBox.tsrx

@@ -44,8 +44,7 @@ function resolveTransitionProperty(args: {
 		return undefined;
 	}
 	if (args.isAnimationActive && args.active) {
-		const easing =
-			typeof args.animationEasing === 'string' ? args.animationEasing : 'ease';
+		const easing = typeof args.animationEasing === 'string' ? args.animationEasing : 'ease';
 		return `transform ${args.animationDuration}ms ${easing}`;
 	}
 	return undefined;
@@ -53,12 +52,10 @@ function resolveTransitionProperty(args: {
 
 function TooltipBoundingBoxImpl(props: TooltipBoundingBoxProps) {
 	const prefersReducedMotion = usePrefersReducedMotion();
-	const [state, setState] = React.useState(
-		() => ({
-			dismissed: false,
-			dismissedAtCoordinate: { x: 0, y: 0 },
-		}),
-	);
+	const [state, setState] = React.useState(() => ({
+		dismissed: false,
+		dismissedAtCoordinate: { x: 0, y: 0 },
+	}));
 
 	React.useEffect(() => {
 		const handleKeyDown = (event: KeyboardEvent) => {
@@ -80,8 +77,8 @@ function TooltipBoundingBoxImpl(props: TooltipBoundingBoxProps) {
 
 	if (
 		state.dismissed &&
-			((props.coordinate?.x ?? 0) !== state.dismissedAtCoordinate.x ||
-				(props.coordinate?.y ?? 0) !== state.dismissedAtCoordinate.y)
+		((props.coordinate?.x ?? 0) !== state.dismissedAtCoordinate.x ||
+			(props.coordinate?.y ?? 0) !== state.dismissedAtCoordinate.y)
 	) {
 		setState({ ...state, dismissed: false });
 	}
@@ -100,35 +97,38 @@ function TooltipBoundingBoxImpl(props: TooltipBoundingBoxProps) {
 		useTranslate3d: props.useTranslate3d,
 		viewBox: props.viewBox,
 	});
-	const positionStyle: CSSProperties =
-		props.hasPortalFromProps
-			? {}
-			: {
-					transition: resolveTransitionProperty({
-						prefersReducedMotion,
-						isAnimationActive: props.isAnimationActive,
-						active: props.active,
-						animationDuration: props.animationDuration,
-						animationEasing: props.animationEasing,
-					}),
-					...cssProperties,
-					pointerEvents: 'none',
-					position: 'absolute',
-					top: 0,
-					left: 0,
-				};
+	const positionStyle: CSSProperties = props.hasPortalFromProps
+		? {}
+		: {
+				transition: resolveTransitionProperty({
+					prefersReducedMotion,
+					isAnimationActive: props.isAnimationActive,
+					active: props.active,
+					animationDuration: props.animationDuration,
+					animationEasing: props.animationEasing,
+				}),
+				...cssProperties,
+				pointerEvents: 'none',
+				position: 'absolute',
+				top: 0,
+				left: 0,
+			};
 	const outerStyle: CSSProperties = {
 		...positionStyle,
 		visibility: !state.dismissed && props.active && props.hasPayload ? 'visible' : 'hidden',
 		...props.wrapperStyle,
 	};
-	return <div
-		xmlns="http://www.w3.org/1999/xhtml"
-		tabIndex={-1}
-		className={cssClasses}
-		style={outerStyle}
-		ref={props.innerRef}
-	>{props.children}</div>;
+	return (
+		<div
+			xmlns="http://www.w3.org/1999/xhtml"
+			tabIndex={-1}
+			className={cssClasses}
+			style={outerStyle}
+			ref={props.innerRef}
+		>
+			{props.children}
+		</div>
+	);
 }
 
 export const TooltipBoundingBox = React.memo(TooltipBoundingBoxImpl);

package/src/container/ClipPathProvider.tsrx

@@ -8,9 +8,7 @@ import { usePlotArea } from '../hooks';
 
 const ClipPathIdContext = createContext<string | undefined>(undefined);
 
-export function ClipPathProvider(props: {
-	children: OctaneNode;
-}) @{
+export function ClipPathProvider(props: { children: OctaneNode }) @{
 	const { children } = props;
 	const [clipPathId] = useState(uniqueId('recharts') + '-clip');
 	const plotArea = usePlotArea();

package/src/container/Layer.tsrx

@@ -12,5 +12,9 @@ import { svgPropertiesAndEvents } from '../util/svgPropertiesAndEvents.ts';
 export function Layer(props: Props) {
 	const { children, className, ref, ...others } = props;
 	const layerClass = clsx('recharts-layer', className);
-	return <g className={layerClass} {...svgPropertiesAndEvents(others)} ref={ref}>{children}</g>;
+	return (
+		<g className={layerClass} {...svgPropertiesAndEvents(others)} ref={ref}>
+			{children}
+		</g>
+	);
 }

package/src/container/RootSurface.tsrx

@@ -48,40 +48,50 @@ function MainChartSurface(props: RootSurfaceProps) {
 			role = hasAccessibilityLayer ? 'application' : undefined;
 		}
 	}
-	return <Surface
-		{...otherAttributes}
-		title={title}
-		desc={desc}
-		role={role}
-		tabIndex={tabIndex}
-		width={width}
-		height={height}
-		style={FULL_WIDTH_AND_HEIGHT}
-		ref={ref}
-	>{children}</Surface>;
+	return (
+		<Surface
+			{...otherAttributes}
+			title={title}
+			desc={desc}
+			role={role}
+			tabIndex={tabIndex}
+			width={width}
+			height={height}
+			style={FULL_WIDTH_AND_HEIGHT}
+			ref={ref}
+		>
+			{children}
+		</Surface>
+	);
 }
 
-function BrushPanoramaSurface(props: {
-	children: OctaneNode;
-}) {
+function BrushPanoramaSurface(props: { children: OctaneNode }) {
 	const { children } = props;
 	const brushDimensions = useAppSelector(selectBrushDimensions);
 	if (!brushDimensions) {
 		return null;
 	}
 	const { width, height, y, x } = brushDimensions;
-	return <Surface width={width} height={height} x={x} y={y}>{children}</Surface>;
+	return (
+		<Surface width={width} height={height} x={x} y={y}>
+			{children}
+		</Surface>
+	);
 }
 
 export function RootSurface(props: RootSurfaceProps) {
 	const { children, ref, ...rest } = props;
 	const isPanorama = useIsPanorama();
 	if (isPanorama) {
-		return <BrushPanoramaSurface>
-			<AllZIndexPortals isPanorama={true}>{children}</AllZIndexPortals>
-		</BrushPanoramaSurface>;
+		return (
+			<BrushPanoramaSurface>
+				<AllZIndexPortals isPanorama={true}>{children}</AllZIndexPortals>
+			</BrushPanoramaSurface>
+		);
 	}
-	return <MainChartSurface ref={ref} {...rest}>
-		<AllZIndexPortals isPanorama={false}>{children}</AllZIndexPortals>
-	</MainChartSurface>;
+	return (
+		<MainChartSurface ref={ref} {...rest}>
+			<AllZIndexPortals isPanorama={false}>{children}</AllZIndexPortals>
+		</MainChartSurface>
+	);
 }

package/src/container/Surface.tsrx

@@ -21,17 +21,19 @@ export function Surface(props: Props) {
 	const { children, width, height, viewBox, className, style, title, desc, ref, ...others } = props;
 	const svgView = viewBox || { width, height, x: 0, y: 0 };
 	const layerClass = clsx('recharts-surface', className);
-	return <svg
-		{...svgPropertiesAndEvents(others)}
-		className={layerClass}
-		width={width}
-		height={height}
-		style={style}
-		viewBox={svgView.x + ' ' + svgView.y + ' ' + svgView.width + ' ' + svgView.height}
-		ref={ref}
-	>
-		<title>{title}</title>
-		<desc>{desc}</desc>
-		{children}
-	</svg>;
+	return (
+		<svg
+			{...svgPropertiesAndEvents(others)}
+			className={layerClass}
+			width={width}
+			height={height}
+			style={style}
+			viewBox={svgView.x + ' ' + svgView.y + ' ' + svgView.width + ' ' + svgView.height}
+			ref={ref}
+		>
+			<title>{title}</title>
+			<desc>{desc}</desc>
+			{children}
+		</svg>
+	);
 }

package/src/context/ErrorBarContext.tsrx

@@ -31,11 +31,11 @@ const initialContextState: ErrorBarContextType<any> = {
 
 const ErrorBarContext = createContext(initialContextState);
 
-export function SetErrorBarContext<
-	T extends BarRectangleItem | LinePointItem | ScatterPointItem,
->(props: ErrorBarContextType<T> & {
-	children: OctaneNode;
-}) {
+export function SetErrorBarContext<T extends BarRectangleItem | LinePointItem | ScatterPointItem>(
+	props: ErrorBarContextType<T> & {
+		children: OctaneNode;
+	},
+) {
 	const { children, ...rest } = props;
 	return <ErrorBarContext value={rest}>{children}</ErrorBarContext>;
 }