@gpa-gemstone/react-graph
Version:
Interactive UI Components for GPA products
74 lines (73 loc) • 1.88 kB
TypeScript
import { IActionFunctions, AxisIdentifier } from './GraphContext';
export interface IProps {
/**
* Data for the pill and circles:
* [x1, x2]
* - x1: The x-coordinate of the left edge of the pill.
* - x2: The x-coordinate of the right edge of the pill.
*/
XData: [number, number];
/**
* Data for the pill and circles:
* [y1, y2]
* - y1: The y-coordinate of the bottom edge of the pill.
* - y2: The y-coordinate of the top edge of the pill.
*/
YData: [number, number];
/**
* Radius of the pill in pixels.
*/
RadiusPX: number;
/**
* Fill color of the pill.
* @type {string}
*/
Color: string;
/**
* Color of text in pill.
* @type {string}
*/
TextColor?: string;
/**
* Stroke color of the pill and circles.
* @optional
* @type {string}
*/
BorderColor?: string;
/**
* Stroke thickness of the pill and circles.
* @optional
* @type {number}
*/
BorderThickness?: number;
/**
* Optional text to display inside the pill.
* @optional
* @type {string}
*/
Text?: string;
/**
* Where to place text in the pill
*/
TextPlacement?: 'center' | 'left' | 'right';
/**
* Opacity of the pill and circles.
* @optional
* @type {number}
*/
Opacity?: number;
/**
* Axis identifier used for vertical positioning.
* @optional
* @type {AxisIdentifier}
*/
Axis?: AxisIdentifier;
/**
* Callback function to handle click events on the pill. Provides action functions to update domains.
* @optional
* @type {(actions: IActionFunctions) => void}
*/
OnClick?: (x: number, y: number, actions: IActionFunctions) => void;
}
declare const Pill: (props: IProps) => JSX.Element | null;
export default Pill;