@octanejs/recharts 0.1.0

package/src/cartesian/getEquidistantTicks.js

@@ -0,0 +1,133 @@
+// Vendored verbatim from recharts@3.9.2 es6/cartesian/getEquidistantTicks.js (framework-agnostic).
+// Do not edit — update by re-vendoring when the recharts devDependency moves.
+import { isVisible } from '../util/TickUtils';
+import { getEveryNth } from '../util/getEveryNth';
+export function getEquidistantTicks(sign, boundaries, getTickSize, ticks, minTickGap) {
+	// If the ticks are readonly, then the slice might not be necessary
+	var result = (ticks || []).slice();
+	var initialStart = boundaries.start,
+		end = boundaries.end;
+	var index = 0;
+	// Premature optimisation idea 1: Estimate a lower bound, and start from there.
+	// For now, start from every tick
+	var stepsize = 1;
+	var start = initialStart;
+	var _loop = function _loop() {
+			// Given stepsize, evaluate whether every stepsize-th tick can be shown.
+			// If it can not, then increase the stepsize by 1, and try again.
+
+			var entry = ticks === null || ticks === void 0 ? void 0 : ticks[index];
+
+			// Break condition - If we have evaluated all the ticks, then we are done.
+			if (entry === undefined) {
+				return {
+					v: getEveryNth(ticks, stepsize),
+				};
+			}
+
+			// Check if the element collides with the next element
+			var i = index;
+			var size;
+			var getSize = () => {
+				if (size === undefined) {
+					size = getTickSize(entry, i);
+				}
+				return size;
+			};
+			var tickCoord = entry.coordinate;
+			// We will always show the first tick.
+			var isShow = index === 0 || isVisible(sign, tickCoord, getSize, start, end);
+			if (!isShow) {
+				// Start all over with a larger stepsize
+				index = 0;
+				start = initialStart;
+				stepsize += 1;
+			}
+			if (isShow) {
+				// If it can be shown, update the start
+				start = tickCoord + sign * (getSize() / 2 + minTickGap);
+				index += stepsize;
+			}
+		},
+		_ret;
+	while (stepsize <= result.length) {
+		_ret = _loop();
+		if (_ret) return _ret.v;
+	}
+	return [];
+}
+export function getEquidistantPreserveEndTicks(sign, boundaries, getTickSize, ticks, minTickGap) {
+	// If the ticks are readonly, then the slice might not be necessary
+	// Reworked logic for getEquidistantPreserveEndTicks
+	var result = (ticks || []).slice();
+	var len = result.length;
+	if (len === 0) {
+		return [];
+	}
+	var initialStart = boundaries.start,
+		end = boundaries.end;
+
+	// Start with stepsize = 1 (every tick) up to the maximum possible stepsize (len)
+	for (var stepsize = 1; stepsize <= len; stepsize++) {
+		// 1. Calculate the offset so the last tick (index len - 1) is always included in the sequence.
+		var offset = (len - 1) % stepsize;
+		var start = initialStart; // `start` tracks the coordinate of the last successfully drawn tick + gap
+		var ok = true;
+
+		// 2. Iterate through the end-anchored sequence: offset, offset + stepsize, ..., len - 1
+		var _loop2 = function _loop2() {
+				var entry = ticks[index];
+				if (entry == null) {
+					return 0; // continue
+				}
+				var i = index;
+				var size;
+
+				// Use a function to get size, as in the original code
+				var getSize = () => {
+					if (size === undefined) {
+						size = getTickSize(entry, i);
+					}
+					return size;
+				};
+				var tickCoord = entry.coordinate;
+
+				// 3. Apply visibility logic (including the first tick special case)
+				// The reviewer says *not* to unconditionally bypass checks for the last tick.
+				var isShow = index === offset || isVisible(sign, tickCoord, getSize, start, end);
+				if (!isShow) {
+					// If any tick in this end-anchored sequence fails visibility/collision,
+					// reject this stepsize and move to the next iteration (larger stepsize).
+					ok = false;
+					return 1; // break
+				}
+
+				// 4. If showable, update the 'start' coordinate for the next collision check
+				if (isShow) {
+					start = tickCoord + sign * (getSize() / 2 + minTickGap);
+				}
+			},
+			_ret2;
+		for (var index = offset; index < len; index += stepsize) {
+			_ret2 = _loop2();
+			if (_ret2 === 0) continue;
+			if (_ret2 === 1) break;
+		}
+
+		// 5. If the entire sequence for this stepsize passed the visibility check, return the result
+		if (ok) {
+			// Build the final result array explicitly using the validated stepsize and offset.
+			var finalTicks = [];
+			for (var _index = offset; _index < len; _index += stepsize) {
+				var tick = ticks[_index];
+				if (tick != null) {
+					finalTicks.push(tick);
+				}
+			}
+			return finalTicks;
+		}
+	}
+
+	// If no stepsize works (this shouldn't happen unless minTickGap is huge), return an empty array.
+	return [];
+}

package/src/cartesian/getTicks.js

@@ -0,0 +1,280 @@
+// Vendored verbatim from recharts@3.9.2 es6/cartesian/getTicks.js (framework-agnostic).
+// Do not edit — update by re-vendoring when the recharts devDependency moves.
+function ownKeys(e, r) {
+	var t = Object.keys(e);
+	if (Object.getOwnPropertySymbols) {
+		var o = Object.getOwnPropertySymbols(e);
+		(r &&
+			(o = o.filter(function (r) {
+				return Object.getOwnPropertyDescriptor(e, r).enumerable;
+			})),
+			t.push.apply(t, o));
+	}
+	return t;
+}
+function _objectSpread(e) {
+	for (var r = 1; r < arguments.length; r++) {
+		var t = null != arguments[r] ? arguments[r] : {};
+		r % 2
+			? ownKeys(Object(t), !0).forEach(function (r) {
+					_defineProperty(e, r, t[r]);
+				})
+			: Object.getOwnPropertyDescriptors
+				? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t))
+				: ownKeys(Object(t)).forEach(function (r) {
+						Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
+					});
+	}
+	return e;
+}
+function _defineProperty(e, r, t) {
+	return (
+		(r = _toPropertyKey(r)) in e
+			? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 })
+			: (e[r] = t),
+		e
+	);
+}
+function _toPropertyKey(t) {
+	var i = _toPrimitive(t, 'string');
+	return 'symbol' == typeof i ? i : i + '';
+}
+function _toPrimitive(t, r) {
+	if ('object' != typeof t || !t) return t;
+	var e = t[Symbol.toPrimitive];
+	if (void 0 !== e) {
+		var i = e.call(t, r || 'default');
+		if ('object' != typeof i) return i;
+		throw new TypeError('@@toPrimitive must return a primitive value.');
+	}
+	return ('string' === r ? String : Number)(t);
+}
+import { mathSign, isNumber } from '../util/DataUtils';
+import { getStringSize } from '../util/DOMUtils';
+import { Global } from '../util/Global';
+import {
+	isVisible,
+	getTickBoundaries,
+	getNumberIntervalTicks,
+	getAngledTickWidth,
+} from '../util/TickUtils';
+import { getEquidistantTicks, getEquidistantPreserveEndTicks } from './getEquidistantTicks';
+function getTicksEnd(sign, boundaries, getTickSize, ticks, minTickGap) {
+	var result = (ticks || []).slice();
+	var len = result.length;
+	var start = boundaries.start;
+	var end = boundaries.end;
+	var _loop = function _loop(i) {
+		var initialEntry = result[i];
+		if (initialEntry == null) {
+			return 1; // continue
+		}
+		var entry = initialEntry;
+		var size;
+		var getSize = () => {
+			if (size === undefined) {
+				size = getTickSize(initialEntry, i);
+			}
+			return size;
+		};
+		if (i === len - 1) {
+			var gap = sign * (entry.coordinate + (sign * getSize()) / 2 - end);
+			result[i] = entry = _objectSpread(
+				_objectSpread({}, entry),
+				{},
+				{
+					tickCoord: gap > 0 ? entry.coordinate - gap * sign : entry.coordinate,
+				},
+			);
+		} else {
+			result[i] = entry = _objectSpread(
+				_objectSpread({}, entry),
+				{},
+				{
+					tickCoord: entry.coordinate,
+				},
+			);
+		}
+		if (entry.tickCoord != null) {
+			var isShow = isVisible(sign, entry.tickCoord, getSize, start, end);
+			if (isShow) {
+				end = entry.tickCoord - sign * (getSize() / 2 + minTickGap);
+				result[i] = _objectSpread(
+					_objectSpread({}, entry),
+					{},
+					{
+						isShow: true,
+					},
+				);
+			}
+		}
+	};
+	for (var i = len - 1; i >= 0; i--) {
+		if (_loop(i)) continue;
+	}
+	return result;
+}
+function getTicksStart(sign, boundaries, getTickSize, ticks, minTickGap, preserveEnd) {
+	// This method is mutating the array so clone is indeed necessary here
+	var result = (ticks || []).slice();
+	var len = result.length;
+	var start = boundaries.start,
+		end = boundaries.end;
+	if (preserveEnd) {
+		// Try to guarantee the tail to be displayed
+		var tail = ticks[len - 1];
+		if (tail != null) {
+			var tailSize = getTickSize(tail, len - 1);
+			var tailGap = sign * (tail.coordinate + (sign * tailSize) / 2 - end);
+			result[len - 1] = tail = _objectSpread(
+				_objectSpread({}, tail),
+				{},
+				{
+					tickCoord: tailGap > 0 ? tail.coordinate - tailGap * sign : tail.coordinate,
+				},
+			);
+			if (tail.tickCoord != null) {
+				var isTailShow = isVisible(sign, tail.tickCoord, () => tailSize, start, end);
+				if (isTailShow) {
+					end = tail.tickCoord - sign * (tailSize / 2 + minTickGap);
+					result[len - 1] = _objectSpread(
+						_objectSpread({}, tail),
+						{},
+						{
+							isShow: true,
+						},
+					);
+				}
+			}
+		}
+	}
+	var count = preserveEnd ? len - 1 : len;
+	var _loop2 = function _loop2(i) {
+		var initialEntry = result[i];
+		if (initialEntry == null) {
+			return 1; // continue
+		}
+		var entry = initialEntry;
+		var size;
+		var getSize = () => {
+			if (size === undefined) {
+				size = getTickSize(initialEntry, i);
+			}
+			return size;
+		};
+		if (i === 0) {
+			var gap = sign * (entry.coordinate - (sign * getSize()) / 2 - start);
+			result[i] = entry = _objectSpread(
+				_objectSpread({}, entry),
+				{},
+				{
+					tickCoord: gap < 0 ? entry.coordinate - gap * sign : entry.coordinate,
+				},
+			);
+		} else {
+			result[i] = entry = _objectSpread(
+				_objectSpread({}, entry),
+				{},
+				{
+					tickCoord: entry.coordinate,
+				},
+			);
+		}
+		if (entry.tickCoord != null) {
+			var isShow = isVisible(sign, entry.tickCoord, getSize, start, end);
+			if (isShow) {
+				start = entry.tickCoord + sign * (getSize() / 2 + minTickGap);
+				result[i] = _objectSpread(
+					_objectSpread({}, entry),
+					{},
+					{
+						isShow: true,
+					},
+				);
+			}
+		}
+	};
+	for (var i = 0; i < count; i++) {
+		if (_loop2(i)) continue;
+	}
+	return result;
+}
+export function getTicks(props, fontSize, letterSpacing) {
+	var tick = props.tick,
+		ticks = props.ticks,
+		viewBox = props.viewBox,
+		minTickGap = props.minTickGap,
+		orientation = props.orientation,
+		interval = props.interval,
+		tickFormatter = props.tickFormatter,
+		unit = props.unit,
+		angle = props.angle;
+	if (!ticks || !ticks.length || !tick) {
+		return [];
+	}
+	if (isNumber(interval) || Global.isSsr) {
+		var _getNumberIntervalTic;
+		return (_getNumberIntervalTic = getNumberIntervalTicks(
+			ticks,
+			isNumber(interval) ? interval : 0,
+		)) !== null && _getNumberIntervalTic !== void 0
+			? _getNumberIntervalTic
+			: [];
+	}
+	var candidates = [];
+	var sizeKey = orientation === 'top' || orientation === 'bottom' ? 'width' : 'height';
+	var unitSize =
+		unit && sizeKey === 'width'
+			? getStringSize(unit, {
+					fontSize,
+					letterSpacing,
+				})
+			: {
+					width: 0,
+					height: 0,
+				};
+	var getTickSize = (content, index) => {
+		var value =
+			typeof tickFormatter === 'function' ? tickFormatter(content.value, index) : content.value;
+		// Recharts only supports angles when sizeKey === 'width'
+		return sizeKey === 'width'
+			? getAngledTickWidth(
+					getStringSize(value, {
+						fontSize,
+						letterSpacing,
+					}),
+					unitSize,
+					angle,
+				)
+			: getStringSize(value, {
+					fontSize,
+					letterSpacing,
+				})[sizeKey];
+	};
+	var tick0 = ticks[0];
+	var tick1 = ticks[1];
+	var sign =
+		ticks.length >= 2 && tick0 != null && tick1 != null
+			? mathSign(tick1.coordinate - tick0.coordinate)
+			: 1;
+	var boundaries = getTickBoundaries(viewBox, sign, sizeKey);
+	if (interval === 'equidistantPreserveStart') {
+		return getEquidistantTicks(sign, boundaries, getTickSize, ticks, minTickGap);
+	}
+	if (interval === 'equidistantPreserveEnd') {
+		return getEquidistantPreserveEndTicks(sign, boundaries, getTickSize, ticks, minTickGap);
+	}
+	if (interval === 'preserveStart' || interval === 'preserveStartEnd') {
+		candidates = getTicksStart(
+			sign,
+			boundaries,
+			getTickSize,
+			ticks,
+			minTickGap,
+			interval === 'preserveStartEnd',
+		);
+	} else {
+		candidates = getTicksEnd(sign, boundaries, getTickSize, ticks, minTickGap);
+	}
+	return candidates.filter((entry) => entry.isShow);
+}

package/src/cartesian/useAnimatedLineLength.ts

@@ -0,0 +1,33 @@
+// Port of cartesian/useAnimatedLineLength.ts — monotonically-growing visible
+// path length across data changes (drives the line-draw entrance dasharray).
+import { useCallback, useRef } from 'octane';
+import { round } from '../util/round';
+
+export function useAnimatedLineLength(points: unknown) {
+	const startingLengthRef = useRef(0);
+	const maxAnimatedLengthRef = useRef(0);
+	const reachedFullRef = useRef(false);
+	const prevPointsRef = useRef(points);
+	if (prevPointsRef.current !== points) {
+		startingLengthRef.current = maxAnimatedLengthRef.current;
+		prevPointsRef.current = points;
+	}
+	// Stable callback (reads only refs) — never re-triggers consumers.
+	return useCallback((animationElapsedTime: number, totalLength: number) => {
+		if (reachedFullRef.current) {
+			return null;
+		}
+		const visibleLength = Math.min(
+			round(startingLengthRef.current + animationElapsedTime * totalLength),
+			totalLength,
+		);
+		if (animationElapsedTime > 0 && totalLength > 0) {
+			maxAnimatedLengthRef.current = Math.max(maxAnimatedLengthRef.current, visibleLength);
+			if (visibleLength >= totalLength) {
+				reachedFullRef.current = true;
+				return null;
+			}
+		}
+		return visibleLength;
+	}, []);
+}

package/src/chart/BarChart.tsrx

@@ -0,0 +1,22 @@
+// Port of chart/BarChart.tsx.
+import { arrayTooltipSearcher } from '../state/optionsSlice';
+import { CartesianChart } from './CartesianChart.tsrx';
+
+const allowedTooltipTypes = ['axis', 'item'];
+
+/**
+ * @consumes ResponsiveContainerContext
+ * @provides CartesianViewBoxContext
+ * @provides CartesianChartContext
+ */
+export function BarChart(props) {
+	const { ref, ...rest } = props;
+	return <CartesianChart
+		chartName="BarChart"
+		defaultTooltipEventType="axis"
+		validateTooltipEventTypes={allowedTooltipTypes}
+		tooltipPayloadSearcher={arrayTooltipSearcher}
+		categoricalChartProps={rest}
+		ref={ref}
+	/>;
+}

package/src/chart/BarChart.tsrx.d.ts

@@ -0,0 +1,2 @@
+// Type declaration for the .tsrx component (resolved by relative path).
+export declare const BarChart: (props: Record<string, unknown>) => unknown;

package/src/chart/CartesianChart.tsrx

@@ -0,0 +1,76 @@
+// Port of chart/CartesianChart.tsx — the store provider + reporter components
+// every cartesian chart (BarChart, LineChart, …) shares.
+import { RechartsStoreProvider } from '../state/RechartsStoreProvider.tsrx';
+import { ChartDataContextProvider } from '../context/chartDataContext.ts';
+import { ReportMainChartProps } from '../state/ReportMainChartProps';
+import { ReportChartProps } from '../state/ReportChartProps';
+import { ReportEventSettings } from '../state/ReportEventSettings';
+import { CategoricalChart } from './CategoricalChart.tsrx';
+import { resolveDefaultProps } from '../util/resolveDefaultProps';
+import { initialEventSettingsState } from '../state/eventSettingsSlice';
+
+const defaultMargin = { top: 5, right: 5, bottom: 5, left: 5 };
+
+export const defaultCartesianChartProps = {
+	accessibilityLayer: true,
+	barCategoryGap: '10%',
+	barGap: 4,
+	layout: 'horizontal',
+	margin: defaultMargin,
+	responsive: false,
+	reverseStackOrder: false,
+	stackOffset: 'none',
+	syncMethod: 'index',
+	...initialEventSettingsState,
+};
+
+/**
+ * One-time, immutable options deciding chart behavior — usually filled in by
+ * the convenience wrappers (BarChart, LineChart, …).
+ */
+export function CartesianChart(props) @{
+	const rootChartProps = resolveDefaultProps(
+		props.categoricalChartProps,
+		defaultCartesianChartProps,
+	);
+	const {
+		chartName,
+		defaultTooltipEventType,
+		validateTooltipEventTypes,
+		tooltipPayloadSearcher,
+		categoricalChartProps,
+		ref,
+	} = props;
+	const options = {
+		chartName,
+		defaultTooltipEventType,
+		validateTooltipEventTypes,
+		tooltipPayloadSearcher,
+		eventEmitter: undefined,
+	};
+	<RechartsStoreProvider
+		preloadedState={{ options }}
+		reduxStoreName={categoricalChartProps.id ?? chartName}
+	>
+		<ChartDataContextProvider chartData={categoricalChartProps.data} />
+		<ReportMainChartProps layout={rootChartProps.layout} margin={rootChartProps.margin} />
+		<ReportEventSettings
+			throttleDelay={rootChartProps.throttleDelay}
+			throttledEvents={rootChartProps.throttledEvents}
+		/>
+		<ReportChartProps
+			baseValue={rootChartProps.baseValue}
+			accessibilityLayer={rootChartProps.accessibilityLayer}
+			barCategoryGap={rootChartProps.barCategoryGap}
+			maxBarSize={rootChartProps.maxBarSize}
+			stackOffset={rootChartProps.stackOffset}
+			barGap={rootChartProps.barGap}
+			barSize={rootChartProps.barSize}
+			syncId={rootChartProps.syncId}
+			syncMethod={rootChartProps.syncMethod}
+			className={rootChartProps.className}
+			reverseStackOrder={rootChartProps.reverseStackOrder}
+		/>
+		<CategoricalChart {...rootChartProps} ref={ref} />
+	</RechartsStoreProvider>
+}

package/src/chart/CartesianChart.tsrx.d.ts

@@ -0,0 +1,10 @@
+// Type declaration for the .tsrx component (resolved by relative path).
+export declare const defaultCartesianChartProps: Record<string, unknown>;
+export declare const CartesianChart: (props: {
+	chartName: string;
+	defaultTooltipEventType: string;
+	validateTooltipEventTypes: readonly string[];
+	tooltipPayloadSearcher: unknown;
+	categoricalChartProps: Record<string, unknown>;
+	ref?: unknown;
+}) => unknown;

package/src/chart/CategoricalChart.tsrx

@@ -0,0 +1,54 @@
+// Port of chart/CategoricalChart.tsx — the wrapper-div + root-svg pairing
+// (or, in compact/panorama mode, just the bare surface).
+import { RootSurface } from '../container/RootSurface.tsrx';
+import { RechartsWrapper } from './RechartsWrapper.tsrx';
+import { ClipPathProvider } from '../container/ClipPathProvider.tsrx';
+import { svgPropertiesNoEvents } from '../util/svgPropertiesNoEvents';
+import { ReportChartSize } from '../context/chartLayoutContext.ts';
+
+export function CategoricalChart(props) {
+	const {
+		width,
+		height,
+		responsive,
+		children,
+		className,
+		style,
+		compact,
+		title,
+		desc,
+		ref,
+		...others
+	} = props;
+	const attrs = svgPropertiesNoEvents(others);
+	// "compact" is the Brush panorama mode (but it's public, so it can render
+	// outside Brush too).
+	if (compact) {
+		return <>
+			<ReportChartSize width={width} height={height} />
+			<RootSurface otherAttributes={attrs} title={title} desc={desc}>{children}</RootSurface>
+		</>;
+	}
+	return <RechartsWrapper
+		className={className}
+		style={style}
+		width={width}
+		height={height}
+		responsive={responsive ?? false}
+		onClick={props.onClick}
+		onMouseLeave={props.onMouseLeave}
+		onMouseEnter={props.onMouseEnter}
+		onMouseMove={props.onMouseMove}
+		onMouseDown={props.onMouseDown}
+		onMouseUp={props.onMouseUp}
+		onContextMenu={props.onContextMenu}
+		onDoubleClick={props.onDoubleClick}
+		onTouchStart={props.onTouchStart}
+		onTouchMove={props.onTouchMove}
+		onTouchEnd={props.onTouchEnd}
+	>
+		<RootSurface otherAttributes={attrs} title={title} desc={desc} ref={ref}>
+			<ClipPathProvider>{children}</ClipPathProvider>
+		</RootSurface>
+	</RechartsWrapper>;
+}

package/src/chart/LineChart.tsrx

@@ -0,0 +1,22 @@
+// Port of chart/LineChart.tsx.
+import { arrayTooltipSearcher } from '../state/optionsSlice';
+import { CartesianChart } from './CartesianChart.tsrx';
+
+const allowedTooltipTypes = ['axis'];
+
+/**
+ * @consumes ResponsiveContainerContext
+ * @provides CartesianViewBoxContext
+ * @provides CartesianChartContext
+ */
+export function LineChart(props) {
+	const { ref, ...rest } = props;
+	return <CartesianChart
+		chartName="LineChart"
+		defaultTooltipEventType="axis"
+		validateTooltipEventTypes={allowedTooltipTypes}
+		tooltipPayloadSearcher={arrayTooltipSearcher}
+		categoricalChartProps={rest}
+		ref={ref}
+	/>;
+}

package/src/chart/LineChart.tsrx.d.ts

@@ -0,0 +1,2 @@
+// Type declaration for the .tsrx component (resolved by relative path).
+export declare const LineChart: (props: Record<string, unknown>) => unknown;