vccs 0.2.0 → 0.3.0

package/dist/es/utils/cell.mjs

@@ -0,0 +1,28 @@
+import { Cell } from "../components/Cell.mjs";
+import { Fragment } from "vue";
+//#region src/utils/cell.ts
+/**
+* Extract Cell VNode props from a VNode tree.
+* Handles Fragment wrapping from v-for.
+*/
+function extractCellProps(vnodes) {
+	const result = [];
+	for (const vnode of vnodes) if (vnode.type === Cell) result.push(vnode.props ?? {});
+	else if (vnode.type === Fragment && Array.isArray(vnode.children)) result.push(...extractCellProps(vnode.children));
+	return result;
+}
+/**
+* Filter out Cell VNodes from a VNode tree, preserving non-Cell siblings.
+* Recursively descends Fragment children to preserve co-located content (e.g. LabelList).
+*/
+function filterOutCells(vnodes) {
+	const result = [];
+	for (const vnode of vnodes) {
+		if (vnode.type === Cell) continue;
+		if (vnode.type === Fragment && Array.isArray(vnode.children)) result.push(...filterOutCells(vnode.children));
+		else result.push(vnode);
+	}
+	return result;
+}
+//#endregion
+export { extractCellProps, filterOutCells };

package/dist/es/utils/createCategoricalInverse.mjs

@@ -0,0 +1,46 @@
+//#region src/utils/createCategoricalInverse.ts
+/**
+* Binary search for sorted arrays (ascending or descending).
+*/
+function bisect(haystack, needle) {
+	let lo = 0;
+	let hi = haystack.length;
+	const ascending = haystack[0] < haystack[haystack.length - 1];
+	while (lo < hi) {
+		const mid = Math.floor((lo + hi) / 2);
+		if (ascending ? haystack[mid] < needle : haystack[mid] > needle) lo = mid + 1;
+		else hi = mid;
+	}
+	return lo;
+}
+/**
+* Creates an inverse scale function for categorical/ordinal scales.
+* Uses bisect to find the closest domain value for a given pixel coordinate.
+*/
+function createCategoricalInverse(scale, allDataPointsOnAxis) {
+	if (!scale) return;
+	const domain = allDataPointsOnAxis ?? scale.domain();
+	const pixelPositions = domain.map((d) => scale(d) ?? 0);
+	const range = scale.range();
+	if (domain.length === 0 || range.length < 2) return;
+	return (pixelValue) => {
+		const index = bisect(pixelPositions, pixelValue);
+		if (index <= 0) return domain[0];
+		if (index >= domain.length) return domain[domain.length - 1];
+		const leftPixel = pixelPositions[index - 1] ?? 0;
+		const rightPixel = pixelPositions[index] ?? 0;
+		if (Math.abs(pixelValue - leftPixel) <= Math.abs(pixelValue - rightPixel)) return domain[index - 1];
+		return domain[index];
+	};
+}
+/**
+* Creates an inverse function: uses native `.invert` for numeric scales,
+* falls back to categorical bisect for ordinal/band/point scales.
+*/
+function combineInverseScaleFunction(scale) {
+	if (scale == null) return;
+	if ("invert" in scale && typeof scale.invert === "function") return scale.invert.bind(scale);
+	return createCategoricalInverse(scale, void 0);
+}
+//#endregion
+export { combineInverseScaleFunction, createCategoricalInverse };

package/dist/es/utils/scale.mjs

@@ -0,0 +1,46 @@
+import { isWellBehavedNumber } from "./validate.mjs";
+//#region src/utils/scale.ts
+/**
+* Convert a data value to pixel coordinate using a D3 scale.
+* Automatically centers on band-scale categories by adding half the bandwidth.
+*/
+function scaleCoord(scale, value) {
+	const coord = scale(value);
+	if (!isWellBehavedNumber(coord)) return void 0;
+	return coord + (scale.bandwidth?.() ?? 0) / 2;
+}
+/**
+* Convert a data value to pixel coordinate for range boundaries.
+* `start` returns the left/top edge; `end` returns the right/bottom edge (adding full bandwidth).
+*/
+function scaleValue(scale, value, position) {
+	const coord = scale(value);
+	if (!isWellBehavedNumber(coord)) return void 0;
+	const bandwidth = scale.bandwidth?.() ?? 0;
+	return position === "start" ? coord : coord + bandwidth;
+}
+/**
+* Check whether a pixel coordinate falls within the scale's output range.
+*/
+function isInRange(scale, coord) {
+	const r = scale.range();
+	const min = Math.min(r[0], r[1]);
+	const max = Math.max(r[0], r[1]);
+	return coord >= min && coord <= max;
+}
+/**
+* Get the minimum value of a scale's range.
+*/
+function rangeMin(scale) {
+	const r = scale.range();
+	return Math.min(r[0], r[1]);
+}
+/**
+* Get the maximum value of a scale's range.
+*/
+function rangeMax(scale) {
+	const r = scale.range();
+	return Math.max(r[0], r[1]);
+}
+//#endregion
+export { isInRange, rangeMax, rangeMin, scaleCoord, scaleValue };

package/dist/hooks/publicHooks.d.ts

@@ -0,0 +1,143 @@
+import { ComputedRef } from 'vue';
+import { useChartHeight, useChartWidth, useMargin, useOffset } from '../context/chartLayoutContext';
+import { AxisId } from '../state/cartesianAxisSlice';
+import { Coordinate } from '../types/common';
+export type { InverseScaleFunction } from '../utils/createCategoricalInverse';
+export type ScaleFunction = (value: unknown) => number | undefined;
+export interface CartesianDataPoint {
+    x: number | string;
+    y: number | string;
+}
+export { useChartWidth, useChartHeight, useMargin, useOffset };
+export { useActiveTooltipDataPoints } from '../state/hooks';
+/**
+ * Returns whether the tooltip is currently active (visible).
+ *
+ * Must be used inside a chart component tree (where the Redux store is provided).
+ *
+ * @returns A reactive boolean indicating tooltip active state
+ */
+export declare function useIsTooltipActive(): Readonly<import('vue').ShallowRef<boolean>>;
+/**
+ * Returns the current coordinate of the active tooltip.
+ *
+ * Must be used inside a chart component tree (where the Redux store is provided).
+ *
+ * @returns A reactive Coordinate ({ x, y }) or undefined when no tooltip is active
+ */
+export declare function useActiveTooltipCoordinate(): Readonly<import('vue').ShallowRef<Coordinate>>;
+/**
+ * Returns the label of the currently active tooltip (the value from the axis dataKey at the hovered index).
+ *
+ * Must be used inside a chart component tree (where the Redux store is provided).
+ *
+ * @returns A reactive string label or undefined when no tooltip is active
+ */
+export declare function useActiveTooltipLabel(): Readonly<import('vue').ShallowRef<string>>;
+/**
+ * Returns the plot area rectangle { x, y, width, height }.
+ * This is the area inside all axes, legend, and brush — where graphical items render.
+ *
+ * Must be used inside a chart component tree (where the Redux store is provided).
+ *
+ * @returns A reactive object with x, y, width, height or undefined if offset is not yet available
+ */
+export declare function usePlotArea(): ComputedRef<{
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}>;
+/**
+ * Returns the computed domain of an X axis.
+ *
+ * @param axisId - The axis ID (defaults to 0)
+ * @returns A reactive domain (categorical or numerical) or undefined
+ */
+export declare function useXAxisDomain(axisId?: AxisId): Readonly<import('vue').ShallowRef<import('../types/axis').NumberDomain | import('../types').CategoricalDomain>>;
+/**
+ * Returns the computed domain of a Y axis.
+ *
+ * @param axisId - The axis ID (defaults to 0)
+ * @returns A reactive domain (categorical or numerical) or undefined
+ */
+export declare function useYAxisDomain(axisId?: AxisId): Readonly<import('vue').ShallowRef<import('../types/axis').NumberDomain | import('../types').CategoricalDomain>>;
+/**
+ * Returns the computed tick items of an X axis.
+ *
+ * @param axisId - The axis ID (defaults to 0)
+ * @returns A reactive array of TickItem or undefined
+ */
+export declare function useXAxisTicks(axisId?: AxisId): Readonly<import('vue').ShallowRef<readonly import('../types/common').TickItem[]>>;
+/**
+ * Returns the computed tick items of a Y axis.
+ *
+ * @param axisId - The axis ID (defaults to 0)
+ * @returns A reactive array of TickItem or undefined
+ */
+export declare function useYAxisTicks(axisId?: AxisId): Readonly<import('vue').ShallowRef<readonly import('../types/common').TickItem[]>>;
+/**
+ * Returns the scale function for an X axis, mapping data values to pixel coordinates.
+ *
+ * @param axisId - The axis ID (defaults to 0)
+ * @returns A reactive ScaleFunction or undefined if the axis is not yet initialized
+ */
+export declare function useXAxisScale(axisId?: AxisId): ComputedRef<ScaleFunction | undefined>;
+/**
+ * Returns the scale function for a Y axis, mapping data values to pixel coordinates.
+ *
+ * @param axisId - The axis ID (defaults to 0)
+ * @returns A reactive ScaleFunction or undefined if the axis is not yet initialized
+ */
+export declare function useYAxisScale(axisId?: AxisId): ComputedRef<ScaleFunction | undefined>;
+/**
+ * Returns the inverse scale function for an X axis, mapping pixel coordinates back to data values.
+ *
+ * @param axisId - The axis ID (defaults to 0)
+ * @returns A reactive InverseScaleFunction or undefined
+ */
+export declare function useXAxisInverseScale(axisId?: AxisId): Readonly<import('vue').ShallowRef<import('../utils/createCategoricalInverse').InverseScaleFunction>>;
+/**
+ * Returns the inverse scale function for a Y axis, mapping pixel coordinates back to data values.
+ *
+ * @param axisId - The axis ID (defaults to 0)
+ * @returns A reactive InverseScaleFunction or undefined
+ */
+export declare function useYAxisInverseScale(axisId?: AxisId): Readonly<import('vue').ShallowRef<import('../utils/createCategoricalInverse').InverseScaleFunction>>;
+/**
+ * Returns the inverse scale function for an X axis that snaps to the nearest data point.
+ *
+ * @param axisId - The axis ID (defaults to 0)
+ * @returns A reactive InverseScaleFunction or undefined
+ */
+export declare function useXAxisInverseDataSnapScale(axisId?: AxisId): Readonly<import('vue').ShallowRef<import('../utils/createCategoricalInverse').InverseScaleFunction>>;
+/**
+ * Returns the inverse scale function for a Y axis that snaps to the nearest data point.
+ *
+ * @param axisId - The axis ID (defaults to 0)
+ * @returns A reactive InverseScaleFunction or undefined
+ */
+export declare function useYAxisInverseDataSnapScale(axisId?: AxisId): Readonly<import('vue').ShallowRef<import('../utils/createCategoricalInverse').InverseScaleFunction>>;
+/**
+ * Returns the inverse scale function for an X axis that snaps to the nearest tick.
+ *
+ * @param axisId - The axis ID (defaults to 0)
+ * @returns A reactive InverseScaleFunction or undefined
+ */
+export declare function useXAxisInverseTickSnapScale(axisId?: AxisId): Readonly<import('vue').ShallowRef<import('../utils/createCategoricalInverse').InverseScaleFunction>>;
+/**
+ * Returns the inverse scale function for a Y axis that snaps to the nearest tick.
+ *
+ * @param axisId - The axis ID (defaults to 0)
+ * @returns A reactive InverseScaleFunction or undefined
+ */
+export declare function useYAxisInverseTickSnapScale(axisId?: AxisId): Readonly<import('vue').ShallowRef<import('../utils/createCategoricalInverse').InverseScaleFunction>>;
+/**
+ * Convenience hook that maps a data point to pixel coordinates using both X and Y axis scales.
+ *
+ * @param dataPoint - An object with x and y data values
+ * @param xAxisId - The X axis ID (defaults to 0)
+ * @param yAxisId - The Y axis ID (defaults to 0)
+ * @returns A reactive Coordinate ({ x, y }) or undefined if either scale is unavailable
+ */
+export declare function useCartesianScale(dataPoint: CartesianDataPoint, xAxisId?: AxisId, yAxisId?: AxisId): ComputedRef<Coordinate | undefined>;

package/dist/index.d.ts

@@ -4,3 +4,4 @@ export * from './container';
 export * from './components';
 export * from './polar';
 export * from './shape';
+export * from './hooks/publicHooks';

package/dist/polar/pie/type.d.ts

@@ -79,8 +79,8 @@ export declare const PieVueProps: {
         type: BooleanConstructor;
         default: boolean;
     };
-    className: {
-        type: StringConstructor;
+    class: {
+        type: PropType<import('../../types').VueClassValue>;
         default: any;
     };
 };

package/dist/polar/radar/Radar.d.ts

@@ -142,14 +142,14 @@ export declare const Radar: import('vue').DefineComponent<import('vue').ExtractP
     };
 }>> & Readonly<{}>, {
     fill: string;
-    name: string;
+    fillOpacity: number;
     stroke: string;
-    label: boolean | Record<string, any>;
-    connectNulls: boolean;
     strokeDasharray: string;
     strokeWidth: number;
+    name: string;
+    label: boolean | Record<string, any>;
+    connectNulls: boolean;
     hide: boolean;
-    fillOpacity: number;
     tooltipType: "none";
     legendType: LegendType;
     isAnimationActive: boolean;

package/dist/shape/Curve.d.ts

@@ -33,7 +33,8 @@ export declare const CurveVueProps: {
         type: StringConstructor;
     };
     class: {
-        type: (StringConstructor | ArrayConstructor)[];
+        type: PropType<import('../types').VueClassValue>;
+        default: any;
     };
 };
 export type CurvePropsWithOutSVG = VuePropsToType<typeof CurveVueProps>;

package/dist/shape/Polygon.d.ts

@@ -0,0 +1,9 @@
+import { SVGAttributes } from 'vue';
+export interface PolygonPoint {
+    x: number;
+    y: number;
+}
+export interface PolygonProps {
+    points?: PolygonPoint[];
+}
+export declare function Polygon(props: PolygonProps & SVGAttributes): import("vue/jsx-runtime").JSX.Element;

package/dist/shape/Rectangle.d.ts

@@ -2,10 +2,6 @@ import { PropType } from 'vue';
 import { VuePropsToType, WithSVGProps } from '../types';
 import { RectRadius } from '../types/bar';
 declare const RectangleVueProps: {
-    className: {
-        type: PropType<string>;
-        default: any;
-    };
     x: {
         type: PropType<number>;
         default: number;

package/dist/shape/Sector.d.ts

@@ -37,8 +37,8 @@ declare const SectorVueProps: {
         type: PropType<boolean>;
         default: boolean;
     };
-    className: {
-        type: PropType<string>;
+    class: {
+        type: PropType<import('../types').VueClassValue>;
         default: any;
     };
 };

package/dist/shape/Symbols.d.ts

@@ -1,7 +1,8 @@
+import { VueClassValue } from '../types/common';
 export type SymbolType = 'circle' | 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye';
 type SizeType = 'area' | 'diameter';
 export interface SymbolsProps {
-    className?: string;
+    class?: VueClassValue;
     type?: SymbolType;
     cx?: number;
     cy?: number;

package/dist/shape/Trapezoid.d.ts

@@ -1,30 +1,29 @@
-import { PropType } from 'vue';
 import { WithSVGProps } from '../types';
 declare const TrapezoidVueProps: {
-    className: {
-        type: PropType<string>;
-        default: any;
-    };
     x: {
-        type: PropType<number>;
+        type: NumberConstructor;
         default: number;
     };
     y: {
-        type: PropType<number>;
+        type: NumberConstructor;
         default: number;
     };
     upperWidth: {
-        type: PropType<number>;
+        type: NumberConstructor;
         default: number;
     };
     lowerWidth: {
-        type: PropType<number>;
+        type: NumberConstructor;
         default: number;
     };
     height: {
-        type: PropType<number>;
+        type: NumberConstructor;
         default: number;
     };
+    class: {
+        type: import('vue').PropType<import('../types').VueClassValue>;
+        default: any;
+    };
 };
 export type TrapezoidComponentProps = WithSVGProps<typeof TrapezoidVueProps>;
 export declare const Trapezoid: import('vue').DefineComponent<TrapezoidComponentProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<TrapezoidComponentProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/dist/shape/index.d.ts

@@ -3,6 +3,7 @@ export * from './Cross';
 export { Curve, CurveVueProps, getPath } from './Curve';
 export type { CurveType, CurvePropsWithOutSVG, CurveProps } from './Curve';
 export * from './Dot';
+export * from './Polygon';
 export * from './Rectangle';
 export * from './Symbols';
 export * from './Sector';

package/dist/shape/types.d.ts

@@ -1,4 +1,5 @@
-import { AnimationEasing } from '../types/bar';
+import { AnimationOptions } from 'motion-v';
+import { VueClassValue } from '../types/common';
 export interface Point {
     readonly x: number;
     readonly y: number;
@@ -6,7 +7,7 @@ export interface Point {
 export type MinPointSize = number | ((value: number, index: number) => number);
 export type NormalizedStackId = string;
 export interface TrapezoidProps {
-    className?: string;
+    class?: VueClassValue;
     x?: number;
     y?: number;
     width?: number;
@@ -14,7 +15,5 @@ export interface TrapezoidProps {
     lowerWidth?: number;
     height?: number;
     isUpdateAnimationActive?: boolean;
-    animationBegin?: number;
-    animationDuration?: number;
-    animationEasing?: AnimationEasing;
+    transition?: AnimationOptions;
 }

package/dist/state/ReportChartProps.d.ts

@@ -18,7 +18,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         default: any;
     };
     class: {
-        type: StringConstructor;
+        type: PropType<import('../types').VueClassValue>;
         default: any;
     };
     maxBarSize: {
@@ -55,7 +55,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         default: any;
     };
     class: {
-        type: StringConstructor;
+        type: PropType<import('../types').VueClassValue>;
         default: any;
     };
     maxBarSize: {
@@ -79,7 +79,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     barCategoryGap: string | number;
     barGap: number;
     barSize: string | number;
-    class: string;
+    class: import('../types').VueClassValue;
     maxBarSize: number;
     stackOffset: StackOffsetType;
     syncId: string | number;

package/dist/state/rootPropsSlice.d.ts

@@ -1,4 +1,4 @@
-import { StackOffsetType, SyncMethod } from '../types';
+import { StackOffsetType, SyncMethod, VueClassValue } from '../types';
 /**
  * These are chart options that users can choose - which means they can also
  * choose to change them which should trigger a re-render.
@@ -12,7 +12,7 @@ export type UpdatableChartOptions = {
      * Useful for debugging which chart is which when synchronising.
      * The className is also passed to the root element of the chart but that's done in the JSX, not through Redux.
      */
-    class: string | undefined;
+    class: VueClassValue | undefined;
     maxBarSize: number | undefined;
     stackOffset: StackOffsetType;
     /**

package/dist/state/selectors/axisSelectors.d.ts

@@ -10,6 +10,7 @@ import { AxisDomain, AxisType, NumberDomain } from '../../types/axis';
 import { CategoricalDomain, Coordinate, DataKey, LayoutType, Size, StackOffsetType, TickItem } from '../../types';
 import { StackId } from '../../types/tick';
 import { RechartsScale } from '../../types/scale';
+import { InverseScaleFunction } from '../../utils/createCategoricalInverse';
 import { AxisPropsForCartesianGridTicksGeneration } from '../../cartesian/cartesian-grid/type';
 /**
  * angle, radius, X, Y, and Z axes all have domain and range and scale and associated settings
@@ -876,6 +877,9 @@ export declare const selectAxisScale: ((state: {
     argsMemoize: typeof import('@reduxjs/toolkit').weakMapMemoize;
     memoize: typeof import('@reduxjs/toolkit').weakMapMemoize;
 };
+export declare const selectSortedDataPoints: (state: RechartsRootState, axisType: XorYorZType, axisId: AxisId, isPanorama: boolean) => ReadonlyArray<unknown> | undefined;
+export declare const selectAxisInverseScale: (state: RechartsRootState, axisType: XorYorZType, axisId: AxisId, isPanorama: boolean) => InverseScaleFunction | undefined;
+export declare const selectAxisInverseDataSnapScale: (state: RechartsRootState, axisType: XorYorZType, axisId: AxisId, isPanorama: boolean) => InverseScaleFunction | undefined;
 export declare const selectErrorBarsSettings: ((state: {
     brush: import('../brushSlice').BrushSettings;
     cartesianAxis: {
@@ -1702,6 +1706,7 @@ export declare const selectTicksOfAxis: ((state: {
     argsMemoize: typeof import('@reduxjs/toolkit').weakMapMemoize;
     memoize: typeof import('@reduxjs/toolkit').weakMapMemoize;
 };
+export declare const selectAxisInverseTickSnapScale: (state: RechartsRootState, axisType: XorYorZType, axisId: AxisId, isPanorama: boolean) => InverseScaleFunction | undefined;
 export declare function combineGraphicalItemTicks(layout: LayoutType, axis: AxisWithTicksSettings, scale: RechartsScale | undefined, axisRange: AxisRange | undefined, duplicateDomain: ReadonlyArray<unknown> | undefined, categoricalDomain: ReadonlyArray<unknown> | undefined, axisType: XorYType): TickItem[] | null;
 export declare const selectTicksOfGraphicalItem: (state: RechartsRootState, axisType: XorYType, axisId: AxisId, isPanorama: boolean) => TickItem[] | null;
 export type BaseAxisWithScale = BaseCartesianAxis & {

package/dist/types/axis.d.ts

@@ -1,4 +1,4 @@
-import { DataKey } from './common';
+import { DataKey, VueClassValue } from './common';
 import { RechartsScale, ScaleType } from './scale';
 import { TickFormatter, TicksSettings } from './tick';
 export type AxisId = string | number;
@@ -113,7 +113,7 @@ export interface XAxisProps {
     angle?: number;
     minTickGap?: number;
     label?: string | number | any;
-    className?: string;
+    class?: VueClassValue;
 }
 /**
  * NumberDomain is an evaluated {@link AxisDomain}.

package/dist/types/bar.d.ts

@@ -1,4 +1,4 @@
-import { Coordinate } from './common';
+import { Coordinate, VueClassValue } from './common';
 import { CartesianViewBox } from '../cartesian/type';
 export type BarPositionPosition = {
     /**
@@ -16,9 +16,8 @@ export type BarPositionPosition = {
     size: number | undefined | typeof NaN;
 };
 export type RectRadius = [number, number, number, number];
-export type AnimationEasing = 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'linear';
 interface RectangleProps {
-    className?: string;
+    class?: VueClassValue;
     x?: number;
     y?: number;
     width?: number;
@@ -26,9 +25,6 @@ interface RectangleProps {
     radius?: number | RectRadius;
     isAnimationActive?: boolean;
     isUpdateAnimationActive?: boolean;
-    animationBegin?: number;
-    animationDuration?: number;
-    animationEasing?: AnimationEasing;
 }
 export interface BarRectangleItem extends RectangleProps {
     value?: number | [number, number];

package/dist/types/categorical.d.ts

@@ -1,4 +1,4 @@
-import { DataKey, LayoutType, Margin, StackOffsetType, SyncMethod } from './common';
+import { DataKey, LayoutType, Margin, StackOffsetType, SyncMethod, VueClassValue } from './common';
 import { ExternalMouseEvents } from './event';
 export interface CategoricalChartProps extends Partial<ExternalMouseEvents> {
     accessibilityLayer?: boolean;
@@ -6,7 +6,7 @@ export interface CategoricalChartProps extends Partial<ExternalMouseEvents> {
     barGap?: number | string;
     barSize?: number | string;
     children?: any;
-    class?: string;
+    class?: VueClassValue;
     compact?: boolean;
     cx?: number | string;
     cy?: number | string;

package/dist/types/common.d.ts

@@ -73,7 +73,6 @@ export interface Size {
     width: number;
     height: number;
 }
-export type AnimationDuration = number;
 /**
  * Coordinates relative to the top-left corner of the chart.
  * Also include scale which means that a chart that's scaled will return the same coordinates as a chart that's not scaled.
@@ -126,4 +125,11 @@ export type AllowInDimension = {
     x?: boolean;
     y?: boolean;
 };
+/** Vue class binding type: string, string[], or { [className]: boolean } */
+export type VueClassValue = string | string[] | Record<string, boolean>;
+/** Shared Vue prop definition for `class` — use in VueProps objects to avoid repetition */
+export declare const classProp: {
+    type: PropType<VueClassValue>;
+    default: any;
+};
 export {};

package/dist/types/tooltip.d.ts

@@ -1,4 +1,4 @@
-import { DataKey } from './common';
+import { DataKey, VueClassValue } from './common';
 /**
  * null means no active index
  * string means: whichever index from the chart data it is.
@@ -27,7 +27,7 @@ export interface Payload<TValue extends ValueType, TName extends NameType> {
     stroke?: string;
     strokeDasharray?: string | number;
     strokeWidth?: number | string;
-    className?: string;
+    class?: VueClassValue;
     hide?: boolean;
     formatter?: Formatter<TValue, TName>;
 }

package/dist/utils/cell.d.ts

@@ -0,0 +1,11 @@
+import { VNode } from 'vue';
+/**
+ * Extract Cell VNode props from a VNode tree.
+ * Handles Fragment wrapping from v-for.
+ */
+export declare function extractCellProps(vnodes: VNode[]): Record<string, any>[];
+/**
+ * Filter out Cell VNodes from a VNode tree, preserving non-Cell siblings.
+ * Recursively descends Fragment children to preserve co-located content (e.g. LabelList).
+ */
+export declare function filterOutCells(vnodes: VNode[]): VNode[];

package/dist/utils/createCategoricalInverse.d.ts

@@ -0,0 +1,16 @@
+import { RechartsScale } from '../types/scale';
+export type InverseScaleFunction = (pixelValue: number) => unknown;
+/**
+ * Binary search for sorted arrays (ascending or descending).
+ */
+export declare function bisect(haystack: ReadonlyArray<number>, needle: number): number;
+/**
+ * Creates an inverse scale function for categorical/ordinal scales.
+ * Uses bisect to find the closest domain value for a given pixel coordinate.
+ */
+export declare function createCategoricalInverse(scale: RechartsScale | undefined, allDataPointsOnAxis?: ReadonlyArray<unknown>): InverseScaleFunction | undefined;
+/**
+ * Creates an inverse function: uses native `.invert` for numeric scales,
+ * falls back to categorical bisect for ordinal/band/point scales.
+ */
+export declare function combineInverseScaleFunction(scale: RechartsScale | undefined): InverseScaleFunction | undefined;

package/dist/utils/scale.d.ts

@@ -0,0 +1,23 @@
+import { RechartsScale } from '../types/scale';
+/**
+ * Convert a data value to pixel coordinate using a D3 scale.
+ * Automatically centers on band-scale categories by adding half the bandwidth.
+ */
+export declare function scaleCoord(scale: RechartsScale, value: number | string): number | undefined;
+/**
+ * Convert a data value to pixel coordinate for range boundaries.
+ * `start` returns the left/top edge; `end` returns the right/bottom edge (adding full bandwidth).
+ */
+export declare function scaleValue(scale: RechartsScale, value: number | string, position: 'start' | 'end'): number | undefined;
+/**
+ * Check whether a pixel coordinate falls within the scale's output range.
+ */
+export declare function isInRange(scale: RechartsScale, coord: number): boolean;
+/**
+ * Get the minimum value of a scale's range.
+ */
+export declare function rangeMin(scale: RechartsScale): number;
+/**
+ * Get the maximum value of a scale's range.
+ */
+export declare function rangeMax(scale: RechartsScale): number;