vccs 0.2.0 → 0.4.0

package/dist/cartesian/reference-dot/ReferenceDot.d.ts

@@ -0,0 +1,143 @@
+import { PropType, SVGAttributes, SlotsType } from 'vue';
+import { AxisId } from '../../state/cartesianAxisSlice';
+import { IfOverflow } from '../../types';
+export interface ReferenceDotShapeProps extends SVGAttributes {
+    cx: number;
+    cy: number;
+    r: number;
+    fill?: string;
+    stroke?: string;
+    clipPath?: string;
+}
+export interface ReferenceDotSlots {
+    shape?: (props: ReferenceDotShapeProps) => any;
+}
+export declare const ReferenceDotVueProps: {
+    x: {
+        type: PropType<number | string>;
+        default: any;
+    };
+    y: {
+        type: PropType<number | string>;
+        default: any;
+    };
+    r: {
+        type: NumberConstructor;
+        default: number;
+    };
+    xAxisId: {
+        type: PropType<AxisId>;
+        default: number;
+    };
+    yAxisId: {
+        type: PropType<AxisId>;
+        default: number;
+    };
+    fill: {
+        type: StringConstructor;
+        default: string;
+    };
+    stroke: {
+        type: StringConstructor;
+        default: string;
+    };
+    label: {
+        type: PropType<string | number | boolean | Record<string, any>>;
+        default: any;
+    };
+    ifOverflow: {
+        type: PropType<IfOverflow>;
+        default: string;
+    };
+};
+declare const _ReferenceDot: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    x: {
+        type: PropType<number | string>;
+        default: any;
+    };
+    y: {
+        type: PropType<number | string>;
+        default: any;
+    };
+    r: {
+        type: NumberConstructor;
+        default: number;
+    };
+    xAxisId: {
+        type: PropType<AxisId>;
+        default: number;
+    };
+    yAxisId: {
+        type: PropType<AxisId>;
+        default: number;
+    };
+    fill: {
+        type: StringConstructor;
+        default: string;
+    };
+    stroke: {
+        type: StringConstructor;
+        default: string;
+    };
+    label: {
+        type: PropType<string | number | boolean | Record<string, any>>;
+        default: any;
+    };
+    ifOverflow: {
+        type: PropType<IfOverflow>;
+        default: string;
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    x: {
+        type: PropType<number | string>;
+        default: any;
+    };
+    y: {
+        type: PropType<number | string>;
+        default: any;
+    };
+    r: {
+        type: NumberConstructor;
+        default: number;
+    };
+    xAxisId: {
+        type: PropType<AxisId>;
+        default: number;
+    };
+    yAxisId: {
+        type: PropType<AxisId>;
+        default: number;
+    };
+    fill: {
+        type: StringConstructor;
+        default: string;
+    };
+    stroke: {
+        type: StringConstructor;
+        default: string;
+    };
+    label: {
+        type: PropType<string | number | boolean | Record<string, any>>;
+        default: any;
+    };
+    ifOverflow: {
+        type: PropType<IfOverflow>;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    fill: string;
+    x: string | number;
+    y: string | number;
+    yAxisId: AxisId;
+    xAxisId: AxisId;
+    ifOverflow: IfOverflow;
+    r: number;
+    stroke: string;
+    label: string | number | boolean | Record<string, any>;
+}, SlotsType<ReferenceDotSlots>, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const ReferenceDot: typeof _ReferenceDot & {
+    new (): {
+        $slots: ReferenceDotSlots;
+    };
+};
+export {};

package/dist/cartesian/reference-dot/index.d.ts

@@ -0,0 +1,2 @@
+export { ReferenceDot } from './ReferenceDot';
+export type { ReferenceDotShapeProps, ReferenceDotSlots } from './ReferenceDot';

package/dist/cartesian/reference-line/ReferenceLine.d.ts

@@ -38,8 +38,8 @@ export declare const ReferenceLineVueProps: {
         type: PropType<IfOverflow>;
         default: string;
     };
-    className: {
-        type: StringConstructor;
+    class: {
+        type: PropType<import('../../types').VueClassValue>;
         default: any;
     };
 };
@@ -80,8 +80,8 @@ export declare const ReferenceLine: import('vue').DefineComponent<import('vue').
         type: PropType<IfOverflow>;
         default: string;
     };
-    className: {
-        type: StringConstructor;
+    class: {
+        type: PropType<import('../../types').VueClassValue>;
         default: any;
     };
 }>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
@@ -121,8 +121,8 @@ export declare const ReferenceLine: import('vue').DefineComponent<import('vue').
         type: PropType<IfOverflow>;
         default: string;
     };
-    className: {
-        type: StringConstructor;
+    class: {
+        type: PropType<import('../../types').VueClassValue>;
         default: any;
     };
 }>> & Readonly<{}>, {
@@ -132,8 +132,8 @@ export declare const ReferenceLine: import('vue').DefineComponent<import('vue').
     yAxisId: AxisId;
     xAxisId: AxisId;
     ifOverflow: IfOverflow;
+    class: import('../../types').VueClassValue;
     stroke: string;
-    label: string | number | boolean | Record<string, any>;
-    className: string;
     strokeWidth: string | number;
+    label: string | number | boolean | Record<string, any>;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/dist/cartesian/scatter/Scatter.d.ts

@@ -148,11 +148,11 @@ export declare const Scatter: import('vue').DefineComponent<import('vue').Extrac
     xAxisId: string | number;
     line: boolean | Record<string, any>;
     dataKey: DataKey<any>;
+    transition: AnimationOptions;
     name: string | number;
     data: readonly Record<string, any>[];
     label: boolean | Record<string, any>;
     hide: boolean;
-    transition: AnimationOptions;
     tooltipType: "none";
     legendType: string;
     isAnimationActive: boolean;

package/dist/chart/RechartsWrapper.d.ts

@@ -2,7 +2,8 @@ import { CSSProperties, PropType } from 'vue';
 import { CategoricalChartFunc } from '../types';
 export declare const RechartsWrapper: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
     class: {
-        type: StringConstructor;
+        type: PropType<import('../types').VueClassValue>;
+        default: any;
     };
     height: {
         type: NumberConstructor;
@@ -50,7 +51,8 @@ export declare const RechartsWrapper: import('vue').DefineComponent<import('vue'
     };
 }>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     class: {
-        type: StringConstructor;
+        type: PropType<import('../types').VueClassValue>;
+        default: any;
     };
     height: {
         type: NumberConstructor;
@@ -96,4 +98,6 @@ export declare const RechartsWrapper: import('vue').DefineComponent<import('vue'
         type: NumberConstructor;
         required: true;
     };
-}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+}>> & Readonly<{}>, {
+    class: import('../types').VueClassValue;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/dist/chart/Surface.d.ts

@@ -1,4 +1,5 @@
 import { CSSProperties } from 'vue';
+import { VueClassValue } from '../types';
 interface SurfaceProps {
     width: number;
     height: number;
@@ -8,7 +9,7 @@ interface SurfaceProps {
         width?: number;
         height?: number;
     };
-    class?: string;
+    class?: VueClassValue;
     style?: CSSProperties;
     title?: string;
     desc?: string;

package/dist/chart/Treemap.d.ts

@@ -0,0 +1,237 @@
+import { PropType, SlotsType } from 'vue';
+import { AnimationOptions } from 'motion-v';
+import { TooltipPayloadSearcher } from '../state/tooltipSlice';
+import { TreemapLayoutNode } from './treemapUtils';
+export interface TreemapContentSlotProps extends TreemapLayoutNode {
+    index: number;
+    fill: string;
+    stroke: string;
+}
+export interface TreemapSlots {
+    content?: (props: TreemapContentSlotProps) => any;
+    default?: () => any;
+}
+/**
+ * Tooltip payload searcher for Treemap — navigates nested node structure
+ * using a path string like 'children[0].children[1]'.
+ */
+export declare const treemapPayloadSearcher: TooltipPayloadSearcher;
+export declare const TreemapVueProps: {
+    data: {
+        type: PropType<Record<string, any>[]>;
+        required: true;
+    };
+    dataKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    nameKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    width: {
+        type: NumberConstructor;
+        required: true;
+    };
+    height: {
+        type: NumberConstructor;
+        required: true;
+    };
+    aspectRatio: {
+        type: NumberConstructor;
+        default: number;
+    };
+    fill: {
+        type: StringConstructor;
+        default: string;
+    };
+    stroke: {
+        type: StringConstructor;
+        default: string;
+    };
+    type: {
+        type: PropType<"flat" | "nest">;
+        default: string;
+    };
+    colorPanel: {
+        type: PropType<string[]>;
+        default: any;
+    };
+    isAnimationActive: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    transition: {
+        type: PropType<AnimationOptions>;
+        default: () => {
+            duration: number;
+            ease: "easeOut";
+        };
+    };
+    onClick: {
+        type: PropType<(node: any, e: MouseEvent) => void>;
+        default: any;
+    };
+    onMouseEnter: {
+        type: PropType<(node: any, e: MouseEvent) => void>;
+        default: any;
+    };
+    onMouseLeave: {
+        type: PropType<(node: any, e: MouseEvent) => void>;
+        default: any;
+    };
+};
+/**
+ * Treemap chart — hierarchical data visualization using nested rectangles.
+ *
+ * Supports `<Tooltip>` as a child component (same pattern as BarChart, LineChart, etc.).
+ *
+ * Usage:
+ * ```vue
+ * <Treemap :data="data" data-key="value" :width="600" :height="400">
+ *   <Tooltip />
+ * </Treemap>
+ * ```
+ */
+export declare const Treemap: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    data: {
+        type: PropType<Record<string, any>[]>;
+        required: true;
+    };
+    dataKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    nameKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    width: {
+        type: NumberConstructor;
+        required: true;
+    };
+    height: {
+        type: NumberConstructor;
+        required: true;
+    };
+    aspectRatio: {
+        type: NumberConstructor;
+        default: number;
+    };
+    fill: {
+        type: StringConstructor;
+        default: string;
+    };
+    stroke: {
+        type: StringConstructor;
+        default: string;
+    };
+    type: {
+        type: PropType<"flat" | "nest">;
+        default: string;
+    };
+    colorPanel: {
+        type: PropType<string[]>;
+        default: any;
+    };
+    isAnimationActive: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    transition: {
+        type: PropType<AnimationOptions>;
+        default: () => {
+            duration: number;
+            ease: "easeOut";
+        };
+    };
+    onClick: {
+        type: PropType<(node: any, e: MouseEvent) => void>;
+        default: any;
+    };
+    onMouseEnter: {
+        type: PropType<(node: any, e: MouseEvent) => void>;
+        default: any;
+    };
+    onMouseLeave: {
+        type: PropType<(node: any, e: MouseEvent) => void>;
+        default: any;
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    data: {
+        type: PropType<Record<string, any>[]>;
+        required: true;
+    };
+    dataKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    nameKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    width: {
+        type: NumberConstructor;
+        required: true;
+    };
+    height: {
+        type: NumberConstructor;
+        required: true;
+    };
+    aspectRatio: {
+        type: NumberConstructor;
+        default: number;
+    };
+    fill: {
+        type: StringConstructor;
+        default: string;
+    };
+    stroke: {
+        type: StringConstructor;
+        default: string;
+    };
+    type: {
+        type: PropType<"flat" | "nest">;
+        default: string;
+    };
+    colorPanel: {
+        type: PropType<string[]>;
+        default: any;
+    };
+    isAnimationActive: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    transition: {
+        type: PropType<AnimationOptions>;
+        default: () => {
+            duration: number;
+            ease: "easeOut";
+        };
+    };
+    onClick: {
+        type: PropType<(node: any, e: MouseEvent) => void>;
+        default: any;
+    };
+    onMouseEnter: {
+        type: PropType<(node: any, e: MouseEvent) => void>;
+        default: any;
+    };
+    onMouseLeave: {
+        type: PropType<(node: any, e: MouseEvent) => void>;
+        default: any;
+    };
+}>> & Readonly<{}>, {
+    fill: string;
+    type: "flat" | "nest";
+    dataKey: string;
+    aspectRatio: number;
+    stroke: string;
+    transition: AnimationOptions;
+    onClick: (node: any, e: MouseEvent) => void;
+    nameKey: string;
+    isAnimationActive: boolean;
+    onMouseEnter: (node: any, e: MouseEvent) => void;
+    onMouseLeave: (node: any, e: MouseEvent) => void;
+    colorPanel: string[];
+}, SlotsType<TreemapSlots>, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/dist/chart/generateCategoricalChart.d.ts

@@ -19,7 +19,8 @@ export declare const CategoricalProps: {
         type: (NumberConstructor | StringConstructor)[];
     };
     class: {
-        type: StringConstructor;
+        type: PropType<import('../types').VueClassValue>;
+        default: any;
     };
     compact: {
         type: BooleanConstructor;

package/dist/chart/index.d.ts

@@ -7,3 +7,4 @@ export * from './RadarChart';
 export * from './ScatterChart';
 export * from './RadialBarChart';
 export * from './FunnelChart';
+export * from './Treemap';

package/dist/chart/treemapUtils.d.ts

@@ -0,0 +1,22 @@
+export interface TreemapLayoutNode {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    depth: number;
+    name: string;
+    value: number;
+    payload: Record<string, any>;
+    color?: string;
+    root: number;
+}
+export interface TreemapLayoutOptions {
+    data: Record<string, any>[];
+    width: number;
+    height: number;
+    dataKey: string;
+    aspectRatio?: number;
+    nameKey?: string;
+    colorPanel?: string[];
+}
+export declare function computeTreemapLayout(options: TreemapLayoutOptions): TreemapLayoutNode[];

package/dist/components/Customized.d.ts

@@ -0,0 +1,23 @@
+import { SlotsType } from 'vue';
+import { CartesianGraphicalItemSettings, PolarGraphicalItemSettings } from '../state/graphicalItemsSlice';
+import { DataKey } from '../types';
+export interface FormattedGraphicalItem {
+    type: string;
+    dataKey: DataKey<any> | undefined;
+    props: CartesianGraphicalItemSettings | PolarGraphicalItemSettings;
+}
+export interface CustomizedSlotProps {
+    formattedGraphicalItems: FormattedGraphicalItem[];
+    chartWidth: number;
+    chartHeight: number;
+    offset: {
+        top: number;
+        right: number;
+        bottom: number;
+        left: number;
+    };
+}
+export interface CustomizedSlots {
+    default?: (props: CustomizedSlotProps) => any;
+}
+export declare const Customized: import('vue').DefineComponent<{}, () => any, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, SlotsType<CustomizedSlots>, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/dist/components/Text.d.ts

@@ -1,4 +1,13 @@
-declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: SVGTextElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
     x: {
         type: (NumberConstructor | StringConstructor)[];
         default: number;
@@ -134,16 +143,22 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     x: string | number;
     y: string | number;
     value: string | number;
-    style: Record<string, any>;
-    dx: number;
-    dy: number;
-    angle: number;
     lineHeight: string | number;
     textAnchor: string;
     capHeight: string | number;
+    dx: number;
+    dy: number;
+    style: Record<string, any>;
+    angle: number;
     scaleToFit: boolean;
     verticalAnchor: string;
     breakAll: boolean;
     maxLines: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, SVGTextElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Tooltip.d.ts

@@ -1,8 +1,9 @@
 import { PropType, SlotsType } from 'vue';
 import { TooltipIndex, TooltipPayload, TooltipPayloadEntry } from '../state/tooltipSlice';
 import { AxisId } from '../state/cartesianAxisSlice';
-import { ChartCoordinate, Coordinate } from '../types';
+import { ChartCoordinate, Coordinate, LayoutType } from '../types';
 import { TooltipTrigger } from '../types/tooltip';
+import { Point } from '../shape';
 export type ContentType = any | ((props: TooltipContentProps) => any);
 export type TooltipContentProps = {
     label?: string | number;
@@ -16,6 +17,49 @@ type AllowInDimension = {
     x: boolean;
     y: boolean;
 };
+type CursorSlotCommon = {
+    class: string | string[];
+    style: {
+        pointerEvents: 'none';
+    };
+    /** Chart area offset — same fields spread by Recharts: left, top, width, height */
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+    payload: TooltipPayload;
+    /** Active tooltip index — named payloadIndex to match Recharts */
+    payloadIndex: string | undefined;
+    [key: string]: any;
+};
+export type CrossCursorSlotProps = CursorSlotCommon & {
+    stroke: string;
+    fill: string;
+    x: number;
+    y: number;
+};
+export type RectangleCursorSlotProps = CursorSlotCommon & {
+    stroke: string;
+    fill: string;
+    x: number;
+    y: number;
+};
+export type SectorCursorSlotProps = CursorSlotCommon & {
+    stroke: string;
+    fill: string;
+    cx: number;
+    cy: number;
+    startAngle: number;
+    endAngle: number;
+    innerRadius: number;
+    outerRadius: number;
+};
+export type CurveCursorSlotProps = CursorSlotCommon & {
+    stroke: string;
+    layout: LayoutType;
+    points: ReadonlyArray<Point>;
+};
+export type CursorSlotProps = CrossCursorSlotProps | RectangleCursorSlotProps | SectorCursorSlotProps | CurveCursorSlotProps;
 type UniqueFunc<T> = (entry: T) => unknown;
 export type UniqueOption<T> = boolean | UniqueFunc<T>;
 export declare function getUniqPayload<T>(payload: ReadonlyArray<T>, option: UniqueOption<T>, defaultUniqBy: UniqueFunc<T>): ReadonlyArray<T>;
@@ -224,9 +268,9 @@ export declare const Tooltip: import('vue').DefineComponent<import('vue').Extrac
         readonly default: " : ";
     };
 }>> & Readonly<{}>, {
-    readonly style: Record<string, any>;
     readonly cursor: boolean | object;
     readonly offset: number;
+    readonly style: Record<string, any>;
     readonly isAnimationActive: boolean;
     readonly includeHidden: boolean;
     readonly active: boolean;
@@ -244,7 +288,7 @@ export declare const Tooltip: import('vue').DefineComponent<import('vue').Extrac
     readonly filterNull: boolean;
 }, SlotsType<{
     content?: (props: TooltipContentProps) => any;
-    cursor?: (props: Record<string, any>) => any;
+    cursor?: (props: CursorSlotProps) => any;
     default?: () => any;
 }>, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 export default Tooltip;

package/dist/components/index.d.ts

@@ -1,4 +1,6 @@
 export * from './Cell';
+export * from './Customized';
 export * from './label';
 export * from './legend';
+export { default as Text } from './Text';
 export * from './Tooltip';