rumble-charts/types/Chart.d.ts

Truly declarative React charts components

import type { ReactElement, ReactNode } from 'react';
import type { CommonProps, Size } from './types';
export declare type ChartProps = {
    /**
     * Chart width (pixels or percents). In case of percents, layoutWidth or viewBox should be defined
     */
    width?: Size;
    /**
     * Chart height (pixels or percents). In case of percents, layoutHeight or viewBox should be defined
     */
    height?: Size;
    /**
     * Chart SVG viewBox.
     */
    viewBox?: string;
    /**
     * Layer width (pixels). Useful when you want to make a responsive chart using viewBox prop, but
     * don't want to specify width of svg tag.
     */
    layerWidth?: number;
    /**
     * Layer height (pixels). Useful when you want to make a responsive chart using viewBox prop, but
     * don't want to specify height of svg tag.
     */
    layerHeight?: number;
    /**
     * It can be change to `"g"`, if you want to include your chart inside another svg graphic.
     */
    tag?: string;
    /**
     * Rumble-charts components (one or more) and any other valid svg tag
     * (i.e. `<defs>`, `<g>`, `<rect>`, `<circle>` etc)
     */
    children: ReactNode;
} & CommonProps;
/**
 * Every chart should start with `<Chart>` component. It serves to set sizes (`width` and `height`)
 * and to wrap all another components:
 * - [Graphics](#graphics)
 * - [Wrappers](#wrappers)
 * - [Helpers](#helpers)
 *
 * Also read more about [hidden props](#magic--hidden-props).
 */
export declare function Chart(allProps: ChartProps): ReactElement;