@octanejs/recharts 0.1.0

package/src/animation/easing.js

@@ -0,0 +1,193 @@
+// Vendored verbatim from recharts@3.9.2 es6/animation/easing.js (framework-agnostic).
+// Do not edit — update by re-vendoring when the recharts devDependency moves.
+export var ACCURACY = 1e-4;
+var cubicBezierFactor = (c1, c2) => [0, 3 * c1, 3 * c2 - 6 * c1, 3 * c1 - 3 * c2 + 1];
+var evaluatePolynomial = (params, animationElapsedTime) =>
+	params.map((param, i) => param * animationElapsedTime ** i).reduce((pre, curr) => pre + curr);
+var cubicBezier = (c1, c2) => (animationElapsedTime) => {
+	var params = cubicBezierFactor(c1, c2);
+	return evaluatePolynomial(params, animationElapsedTime);
+};
+var derivativeCubicBezier = (c1, c2) => (animationElapsedTime) => {
+	var params = cubicBezierFactor(c1, c2);
+	var newParams = [...params.map((param, i) => param * i).slice(1), 0];
+	return evaluatePolynomial(newParams, animationElapsedTime);
+};
+var parseCubicBezier = (easing) => {
+	var _easingParts$;
+	var easingParts = easing.split('(');
+	if (easingParts.length !== 2 || easingParts[0] !== 'cubic-bezier') {
+		return null;
+	}
+	var numbers =
+		(_easingParts$ = easingParts[1]) === null ||
+		_easingParts$ === void 0 ||
+		(_easingParts$ = _easingParts$.split(')')[0]) === null ||
+		_easingParts$ === void 0
+			? void 0
+			: _easingParts$.split(',');
+	if (numbers == null || numbers.length !== 4) {
+		return null;
+	}
+	var coords = numbers.map((x) => parseFloat(x));
+	return [coords[0], coords[1], coords[2], coords[3]];
+};
+var getBezierCoordinates = function getBezierCoordinates() {
+	for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+		args[_key] = arguments[_key];
+	}
+	if (args.length === 1) {
+		switch (args[0]) {
+			case 'linear':
+				return [0.0, 0.0, 1.0, 1.0];
+			case 'ease':
+				return [0.25, 0.1, 0.25, 1.0];
+			case 'ease-in':
+				return [0.42, 0.0, 1.0, 1.0];
+			case 'ease-out':
+				return [0.42, 0.0, 0.58, 1.0];
+			case 'ease-in-out':
+				return [0.0, 0.0, 0.58, 1.0];
+			default: {
+				var easing = parseCubicBezier(args[0]);
+				if (easing) {
+					return easing;
+				}
+			}
+		}
+	}
+	if (args.length === 4) {
+		return args;
+	}
+
+	// Fallback for invalid inputs. The previous implementation was buggy and would lead to NaN.
+	// Returning linear easing is a safe default.
+	return [0.0, 0.0, 1.0, 1.0];
+};
+var createBezierEasing = (x1, y1, x2, y2) => {
+	var curveX = cubicBezier(x1, x2);
+	var curveY = cubicBezier(y1, y2);
+	var derCurveX = derivativeCubicBezier(x1, x2);
+	var rangeValue = (value) => {
+		if (value > 1) {
+			return 1;
+		}
+		if (value < 0) {
+			return 0;
+		}
+		return value;
+	};
+	var bezier = (_animationElapsedTime) => {
+		var animationElapsedTime = _animationElapsedTime > 1 ? 1 : _animationElapsedTime;
+		var x = animationElapsedTime;
+		for (var i = 0; i < 8; ++i) {
+			var evalT = curveX(x) - animationElapsedTime;
+			var derVal = derCurveX(x);
+			if (Math.abs(evalT - animationElapsedTime) < ACCURACY || derVal < ACCURACY) {
+				return curveY(x);
+			}
+			x = rangeValue(x - evalT / derVal);
+		}
+		return curveY(x);
+	};
+	bezier.isStepper = false;
+	return bezier;
+};
+
+// calculate cubic-bezier using Newton's method
+export var configBezier = function configBezier() {
+	return createBezierEasing(...getBezierCoordinates(...arguments));
+};
+/**
+ * Creates a performance-optimized, progress-based spring easing function.
+ * It pre-calculates ("bakes") spring physics frames upfront based on a fixed duration,
+ * then returns a pure, lightweight function mapping progress (0 to 1) to the animated position.
+ * This approach is ideal for low-power devices because it removes heavy physics math from the frame loop.
+ */
+export var createSpringEasing = function createSpringEasing() {
+	var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+	var _config$stiff = config.stiff,
+		stiff = _config$stiff === void 0 ? 100 : _config$stiff,
+		_config$damping = config.damping,
+		damping = _config$damping === void 0 ? 8 : _config$damping,
+		_config$dt = config.dt,
+		dt = _config$dt === void 0 ? 16.67 : _config$dt;
+	var destX = 1;
+	var positions = [0];
+	var currX = 0;
+	var currV = 0;
+
+	// Safety valve to prevent accidental infinite loops if physics config is extreme
+	var maxIterations = 10000;
+	var iterations = 0;
+
+	// 1. Run the simulation until the spring completely stops moving
+	while (iterations < maxIterations) {
+		var FSpring = -(currX - destX) * stiff;
+		var FDamping = currV * damping;
+		currV += ((FSpring - FDamping) * dt) / 1000;
+		currX += (currV * dt) / 1000;
+		positions.push(currX);
+
+		// Stop only when position is essentially at 1.0 AND bounce velocity has died down
+		if (Math.abs(currX - destX) < ACCURACY && Math.abs(currV) < ACCURACY) {
+			break;
+		}
+		iterations++;
+	}
+
+	// Force the absolute final element to be exactly 1.0 for a perfect finish
+	positions[positions.length - 1] = destX;
+	var maxIndex = positions.length - 1;
+
+	// 2. The ultra-smooth runtime function mapping your 0..1 progress
+	return (t) => {
+		var _positions$index, _positions, _positions$index2;
+		if (t <= 0) return 0;
+		if (t >= 1) return destX;
+
+		// Scale t (0..1) proportionally across our entire pre-calculated array
+		var exactFrame = t * maxIndex;
+		var index = Math.floor(exactFrame);
+		var fraction = exactFrame - index;
+
+		// Blend between the two closest frames
+		return (
+			((_positions$index = positions[index]) !== null && _positions$index !== void 0
+				? _positions$index
+				: 0) +
+			(((_positions = positions[index + 1]) !== null && _positions !== void 0 ? _positions : 0) -
+				((_positions$index2 = positions[index]) !== null && _positions$index2 !== void 0
+					? _positions$index2
+					: 0)) *
+				fraction
+		);
+	};
+};
+
+/**
+ * @inline
+ */
+
+export var createEasingFunction = (easing) => {
+	if (typeof easing === 'string') {
+		switch (easing) {
+			case 'ease':
+			case 'ease-in-out':
+			case 'ease-out':
+			case 'ease-in':
+			case 'linear':
+				return configBezier(easing);
+			case 'spring':
+				return createSpringEasing();
+			default:
+				if (easing.split('(')[0] === 'cubic-bezier') {
+					return configBezier(easing);
+				}
+		}
+	}
+	if (typeof easing === 'function') {
+		return easing;
+	}
+	return null;
+};

package/src/animation/matchBy.js

@@ -0,0 +1,279 @@
+// Vendored verbatim from recharts@3.9.2 es6/animation/matchBy.js (framework-agnostic).
+// Do not edit — update by re-vendoring when the recharts devDependency moves.
+function _slicedToArray(r, e) {
+	return (
+		_arrayWithHoles(r) ||
+		_iterableToArrayLimit(r, e) ||
+		_unsupportedIterableToArray(r, e) ||
+		_nonIterableRest()
+	);
+}
+function _nonIterableRest() {
+	throw new TypeError(
+		'Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.',
+	);
+}
+function _unsupportedIterableToArray(r, a) {
+	if (r) {
+		if ('string' == typeof r) return _arrayLikeToArray(r, a);
+		var t = {}.toString.call(r).slice(8, -1);
+		return (
+			'Object' === t && r.constructor && (t = r.constructor.name),
+			'Map' === t || 'Set' === t
+				? Array.from(r)
+				: 'Arguments' === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)
+					? _arrayLikeToArray(r, a)
+					: void 0
+		);
+	}
+}
+function _arrayLikeToArray(r, a) {
+	(null == a || a > r.length) && (a = r.length);
+	for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
+	return n;
+}
+function _iterableToArrayLimit(r, l) {
+	var t =
+		null == r ? null : ('undefined' != typeof Symbol && r[Symbol.iterator]) || r['@@iterator'];
+	if (null != t) {
+		var e,
+			n,
+			i,
+			u,
+			a = [],
+			f = !0,
+			o = !1;
+		try {
+			if (((i = (t = t.call(r)).next), 0 === l)) {
+				if (Object(t) !== t) return;
+				f = !1;
+			} else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
+		} catch (r) {
+			((o = !0), (n = r));
+		} finally {
+			try {
+				if (!f && null != t.return && ((u = t.return()), Object(u) !== u)) return;
+			} finally {
+				if (o) throw n;
+			}
+		}
+		return a;
+	}
+}
+function _arrayWithHoles(r) {
+	if (Array.isArray(r)) return r;
+}
+import { getValueByDataKey } from '../util/ChartUtils';
+
+/**
+ * A tagged union describing the status of an item during animation.
+ *
+ * - `matched`: item exists in both previous and next data — interpolate between positions
+ * - `added`: item is new (no previous position) — animate in
+ * - `removed`: item was in previous data but not in next — animate out
+ *
+ * @since 3.9
+ * @see {@link https://recharts.github.io/en-US/guide/animations Animation guide}
+ */
+
+/**
+ * A function that extracts a key from an animation item for matching purposes.
+ * Items in the previous and next arrays that return the same key are considered
+ * the same logical item and will animate between their positions.
+ *
+ * @param item The chart item (e.g., a bar rectangle, a line point, a pie sector)
+ * @param index The index of the item in the array
+ * @returns A string or number key, or null if the item cannot be matched
+ *
+ * @since 3.9
+ * @see {@link https://recharts.github.io/en-US/guide/animations Animation guide}
+ */
+
+/**
+ * The union of all accepted `animationMatchBy` prop values:
+ * a built-in sentinel string, or a custom matching function.
+ *
+ * @since 3.9
+ * @see {@link https://recharts.github.io/en-US/guide/animations Animation guide}
+ */
+
+/**
+ * Match animation items by their array index (the default behavior).
+ *
+ * Previous items are paired with next items based on their position
+ * in the array, with proportional stretching when array lengths differ.
+ * When going from 5 to 15 items, each old point "covers" approximately 3 new points;
+ * when shrinking, some old points are skipped.
+ *
+ * @example
+ * import { matchByIndex } from 'recharts';
+ * <Line animationMatchBy={matchByIndex} />
+ *
+ * @since 3.9
+ * @see {@link https://recharts.github.io/en-US/guide/animations Animation guide}
+ */
+export var matchByIndex = 'index';
+
+/**
+ * Match animation items sequentially: previous item 0 pairs with next item 0,
+ * previous item 1 pairs with next item 1, and so on. When the new array is longer,
+ * the extra items have no match and animate in from their default position.
+ * When the new array is shorter, the ancient items are simply dropped.
+ *
+ * This is useful when new data is appended at the end of the array, and you want
+ * existing points to stay in place while new points animate in.
+ *
+ * @example
+ * import { matchAppend } from 'recharts';
+ * <Line animationMatchBy={matchAppend} />
+ *
+ * @since 3.9
+ * @see {@link https://recharts.github.io/en-US/guide/animations Animation guide}
+ */
+export var matchAppend = 'append';
+
+/**
+ * Create a matching function that pairs items by a data key from their payload.
+ *
+ * Useful for time-series or streaming charts where new data points are added
+ * to one end and old points are removed from the other. This ensures existing
+ * points animate smoothly to their new positions instead of shifting by index.
+ *
+ * @param dataKey The key to look up in each item's payload (e.g., 'timestamp', 'date', 'id')
+ * @returns An AnimationMatchBy function that can be passed to the animationMatchBy prop
+ *
+ * @example
+ * import { matchByDataKey } from 'recharts';
+ * <Line animationMatchBy={matchByDataKey('timestamp')} />
+ * <Bar animationMatchBy={matchByDataKey('name')} />
+ * <Pie animationMatchBy={matchByDataKey('id')} />
+ *
+ * @since 3.9
+ * @see {@link https://recharts.github.io/en-US/guide/animations Animation guide}
+ */
+export function matchByDataKey(dataKey) {
+	return (item) => {
+		if (item.payload == null || typeof item.payload !== 'object') return null;
+		var value = getValueByDataKey(item.payload, dataKey);
+		if (value == null) return null;
+		if (typeof value === 'string' || typeof value === 'number') return value;
+		return JSON.stringify(value);
+	};
+}
+function tagAlignedItems(alignedPrevItems, nextItems) {
+	var removedPrevItems = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+	var tagged = [];
+	/*
+	 * We put removed points at the start because we assume that a typical chart animates right-to-left
+	 * and the removed points will disappear from the left edge and outside the plot area.
+	 * If you chart behaves differently you may want to customize your matching function.
+	 */
+	for (var prev of removedPrevItems) {
+		tagged.push({
+			status: 'removed',
+			prev,
+		});
+	}
+	for (var i = 0; i < nextItems.length; i++) {
+		// This function intentionally pairs by array index. The strategy-specific functions above are
+		// responsible for producing an alignedPrevItems array whose indices already correspond to nextItems.
+		var _prev = alignedPrevItems[i];
+		var next = nextItems[i];
+		if (_prev != null) {
+			tagged.push({
+				status: 'matched',
+				prev: _prev,
+				next,
+			});
+		} else {
+			tagged.push({
+				status: 'added',
+				next,
+			});
+		}
+	}
+	return tagged;
+}
+function matchByIndexImpl(prevItems, nextItems) {
+	var factor = prevItems.length / nextItems.length;
+	var alignedPrevItems = nextItems.map((_, i) => prevItems[Math.floor(i * factor)]);
+	return tagAlignedItems(alignedPrevItems, nextItems);
+}
+function matchAppendImpl(prevItems, nextItems) {
+	var alignedPrevItems = nextItems.map((_, i) => prevItems[i]);
+	return tagAlignedItems(alignedPrevItems, nextItems);
+}
+function buildPrevKeyMap(prevItems, matchBy) {
+	var prevMap = new Map();
+	for (var i = 0; i < prevItems.length; i++) {
+		var _item = prevItems[i];
+		if (_item == null) continue;
+		var key = matchBy(_item, i);
+		if (key != null && !prevMap.has(key)) {
+			prevMap.set(key, _item);
+		}
+	}
+	return prevMap;
+}
+
+/**
+ * Match previous items to next items by key, and include removed items explicitly.
+ *
+ * @internal
+ */
+function matchByKey(prevItems, nextItems, matchBy) {
+	var prevMap = buildPrevKeyMap(prevItems, matchBy);
+
+	// Track which prev keys were matched
+	var matchedKeys = new Set();
+	var alignedPrevItems = nextItems.map((next, i) => {
+		var key = matchBy(next, i);
+		if (key != null) {
+			var prev = prevMap.get(key);
+			if (prev !== undefined) {
+				matchedKeys.add(key);
+				return prev;
+			}
+		}
+		return undefined;
+	});
+
+	// Removed = prev items whose keys were not matched to any next item
+	var removedPrevItems = [];
+	for (var _ref3 of prevMap) {
+		var _ref2 = _slicedToArray(_ref3, 2);
+		var key = _ref2[0];
+		var _item2 = _ref2[1];
+		if (!matchedKeys.has(key)) {
+			removedPrevItems.push(_item2);
+		}
+	}
+	return tagAlignedItems(alignedPrevItems, nextItems, removedPrevItems);
+}
+
+/**
+ * Match previous items to next items using the given matching strategy and return tagged animation items.
+ *
+ * On first render, all next items are returned as `{ status: 'added' }`.
+ * For key-based matching, unmatched previous items are appended as `{ status: 'removed' }`.
+ *
+ * @internal
+ */
+export function matchAnimationItems(prevItems, nextItems, matchBy) {
+	if (nextItems == null) {
+		return null;
+	}
+	if (prevItems == null) {
+		return nextItems.map((next) => ({
+			status: 'added',
+			next,
+		}));
+	}
+	if (matchBy === matchByIndex) {
+		return matchByIndexImpl(prevItems, nextItems);
+	}
+	if (matchBy === matchAppend) {
+		return matchAppendImpl(prevItems, nextItems);
+	}
+	return matchByKey(prevItems, nextItems, matchBy);
+}

package/src/animation/timeoutController.js

@@ -0,0 +1,49 @@
+// Vendored verbatim from recharts@3.9.2 es6/animation/timeoutController.js (framework-agnostic).
+// Do not edit — update by re-vendoring when the recharts devDependency moves.
+/**
+ * Callback type for the timeout function.
+ * Receives current time as an argument.
+ */
+
+/**
+ * A function that, when called, cancels the timeout.
+ *
+ * @since 3.9
+ */
+
+/**
+ * TimeoutController is responsible for controlling the movement of time.
+ * Think of it as a clock.
+ *
+ * Recharts default implementation uses requestAnimationFrame which works great in a browser.
+ * You may choose to override this which is especially useful if you want to control animations.
+ *
+ * Why would you want to do this?
+ * - unit tests
+ * - animations based on something other than time: UI controls, page scroll, mouse movement ...
+ *
+ * @see {@link https://recharts.github.io/en-US/guide/animations/ Animation guide}
+ *
+ * @since 3.9
+ */
+
+export class RequestAnimationFrameTimeoutController {
+	setTimeout(callback) {
+		var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+		var startTime = performance.now();
+		var requestId = null;
+		var executeCallback = (now) => {
+			if (now - startTime >= delay) {
+				callback(now);
+			} else {
+				requestId = requestAnimationFrame(executeCallback);
+			}
+		};
+		requestId = requestAnimationFrame(executeCallback);
+		return () => {
+			if (requestId != null) {
+				cancelAnimationFrame(requestId);
+			}
+		};
+	}
+}

package/src/animation/useAnimationController.ts

@@ -0,0 +1,22 @@
+// Port of animation/useAnimationController.tsx — context override point for
+// the animation driver (tests inject a mock controller; the default ticks on
+// requestAnimationFrame).
+import { createContext, useContext, useMemo } from 'octane';
+import { animationControllerImpl } from './AnimationControllerImpl';
+
+const AnimationControllerContext = createContext(animationControllerImpl);
+
+/**
+ * Allows overriding the default AnimationController that Recharts uses
+ * internally to drive animations.
+ * @since 3.9
+ */
+export const AnimationControllerProvider = AnimationControllerContext.Provider;
+
+export function useAnimationController(animationControllerFromProps: unknown) {
+	const animationControllerFromContext = useContext(AnimationControllerContext);
+	return useMemo(
+		() => animationControllerFromProps ?? animationControllerFromContext,
+		[animationControllerFromProps, animationControllerFromContext],
+	);
+}

package/src/animation/useAnimationStartSnapshot.ts

@@ -0,0 +1,43 @@
+// Port of animation/useAnimationStartSnapshot.ts — interruption-safe animation
+// snapshots: `startValue` is frozen per animation cycle; the live "latest
+// visible frame" ref is only writable after the new cycle's t=0 handshake.
+import { useCallback, useRef } from 'octane';
+
+export function useAnimationStartSnapshot(
+	animationInput: unknown,
+	previousValueRef: { current: any },
+) {
+	// Identity of the animation cycle currently being served.
+	const previousAnimationInputRef = useRef(animationInput);
+	// Frozen start-of-cycle value used for interpolation.
+	const startValueRef = useRef(previousValueRef.current);
+	// Blocks live-ref writes until the new animation renders its own t=0 frame.
+	const isReadyToCommitRef = useRef(true);
+	if (previousAnimationInputRef.current !== animationInput) {
+		// New animation cycle: capture exactly one frozen starting snapshot.
+		previousAnimationInputRef.current = animationInput;
+		startValueRef.current = previousValueRef.current;
+		isReadyToCommitRef.current = false;
+	}
+	const syncStepValue = useCallback(
+		(stepValue: any, animationElapsedTime: number, canCommit = true) => {
+			if (animationElapsedTime === 0) {
+				// t=0 handshake: the new animation has rendered its starting frame.
+				isReadyToCommitRef.current = true;
+				return;
+			}
+			if (animationElapsedTime === 1) {
+				// Keep the frozen snapshot aligned with the fully completed geometry.
+				startValueRef.current = stepValue;
+			}
+			if (animationElapsedTime > 0 && isReadyToCommitRef.current && canCommit) {
+				previousValueRef.current = stepValue;
+			}
+		},
+		[previousValueRef],
+	);
+	return {
+		startValue: startValueRef.current,
+		syncStepValue,
+	};
+}

package/src/animation/util.js

@@ -0,0 +1,11 @@
+// Vendored verbatim from recharts@3.9.2 es6/animation/util.js (framework-agnostic).
+// Do not edit — update by re-vendoring when the recharts devDependency moves.
+/*
+ * @description: convert camel case to dash case
+ * string => string
+ */
+export var getDashCase = (name) => name.replace(/([A-Z])/g, (v) => '-'.concat(v.toLowerCase()));
+export var getTransitionVal = (props, duration, easing) =>
+	props
+		.map((prop) => ''.concat(getDashCase(prop), ' ').concat(duration, 'ms ').concat(easing))
+		.join(',');

package/src/cartesian/Bar.ts

@@ -0,0 +1,4 @@
+// Extensionless-resolution shim: vendored modules (state/selectors/
+// barSelectors.js) import `computeBarRectangles` from '../../cartesian/Bar' —
+// this .ts entry forwards to the .tsrx implementation.
+export { Bar, computeBarRectangles, defaultBarProps } from './Bar.tsrx';