reaviz
Version:
Data Visualization using React
56 lines (55 loc) • 1.56 kB
TypeScript
import { default as React, FC, ReactElement } from 'react';
import { HierarchyCircularNode } from 'd3-hierarchy';
import { ChartTooltip, ChartTooltipProps } from '../common/Tooltip';
import { Gradient, GradientProps } from '../common/Gradient';
import { Mask, MaskProps } from '../common/Mask';
import { Glow } from '../common/Glow';
export interface BubbleProps {
/**
* Id set by the parent.
*/
id: string;
/**
* The internal data object built by d3
*/
data: HierarchyCircularNode<any>;
/**
* Fill for the bubble.
*/
fill: string;
/**
* Whether the chart is animated or not.
*/
animated?: boolean;
/**
* Tooltip element.
*
* @default `<ChartTooltip />`
*/
tooltip?: ReactElement<ChartTooltipProps, typeof ChartTooltip> | null;
/**
* Mask element for the bubble.
*/
mask: ReactElement<MaskProps, typeof Mask> | null;
/**
* Glow styling for the bubble.
*/
glow?: Glow;
/**
* Gradient shades for the bubble.
*/
gradient: ReactElement<GradientProps, typeof Gradient> | null;
/**
* Event for when the bubble is clicked.
*/
onClick?: (event: React.MouseEvent<SVGCircleElement>, currentItem?: HierarchyCircularNode<any>) => void;
/**
* Event for when the mouse enters bubble.
*/
onMouseEnter?: (event: any) => void;
/**
* Event for when the mouse leaves the bubble.
*/
onMouseLeave?: (event: any) => void;
}
export declare const Bubble: FC<Partial<BubbleProps>>;