@spaced-out/ui-design-system/lib/types/charts.d.ts

Sense UI components library

export type ChartOptions = {
    chart?: {
        polar?: boolean;
        type?: string;
        margin?: Array<number>;
        style?: CSSObject;
        spacing?: [number, number, number, number];
        spacingBottom?: number;
        spacingLeft?: number;
        spacingRight?: number;
        spacingTop?: number;
        events?: {
            render?: (this: any) => void;
        };
    };
    title?: {
        align?: string;
        floating?: boolean;
        margin?: number;
        style?: {
            color?: string;
            fontWeight?: string;
        };
        text?: string | null;
        useHTML?: boolean;
        verticalAlign?: 'top' | 'middle' | 'bottom';
        widthAdjust?: number;
        x?: number;
        y?: number;
    };
    exporting?: {
        allowHTML?: boolean;
        allowTableSorting?: boolean;
        buttons?: {
            contextButton?: {
                enabled?: boolean;
            };
        };
        enabled?: boolean;
        filename?: string;
        showExportInProgress?: boolean;
        showTable?: boolean;
        sourceHeight?: number;
        sourceWidth?: number;
        useRowspanHeaders?: boolean;
        width?: number;
    };
    credits?: Credits;
    tooltip?: ChartTooltip;
    xAxis?: AxisOptions;
    yAxis?: AxisOptions;
    zAxis?: AxisOptions;
    drilldown?: Drilldown;
    plotOptions?: PlotOptionsType;
    series?: Array<SeriesOptionsType>;
    subtitle?: {
        useHTML: boolean;
        text?: string;
        verticalAlign?: 'middle';
        align?: string;
        style?: CSSObject;
        x?: number;
    };
    pane?: {
        center?: [string, string];
        size?: string;
    };
    legend?: LegendOptionsType;
    navigation?: Navigation;
};
export type AxisOptions = {
    categories?: Array<string>;
    gridLineInterpolation?: 'circle' | 'polygon';
    lineWidth?: number;
    tickmarkPlacement?: string;
    labels?: {
        align?: string;
        distance?: number;
        style?: CSSObject;
    };
    title?: {
        text?: string;
        margin?: number;
        style?: CSSObject;
    };
    type?: string;
    padding?: number;
    lineColor?: string;
};
export type BreadcrumbsOptions = {
    floating?: boolean;
    style?: CSSObject;
    buttonTheme?: ButtonTheme;
};
export type LegendOptionsType = {
    layout?: string;
    align?: string;
    verticalAlign?: string;
    itemMarginBottom?: number;
    padding?: number;
    itemStyle?: CSSObject;
    enabled?: boolean;
    symbolHeight?: number;
    symbolWidth?: number;
    symbolPadding?: number;
    width?: string;
};
export type CSSObject = {
    alignItems?: string;
    color?: string;
    display?: string;
    fontFamily?: string;
    fontSize?: string;
    fontStyle?: string;
    fontWeight?: string;
    letterSpacing?: string;
    lineHeight?: string;
    margin?: number;
    textAlign?: string;
    minWidth?: string;
    maxWidth?: string;
    minHeight?: string;
    maxHeight?: string;
    alignContent?: string;
    overflow?: string;
    textOverflow?: string;
    zIndex?: number;
    paddingTop?: string;
    transform?: string;
};
export type DataOptionsType = {
    y?: number;
    name?: string;
    color?: string;
    drilldown?: string;
    id?: string;
};
export type SeriesOptionsType = {
    id?: string;
    name?: string;
    data: Array<DataOptionsType>;
};
export type Drilldown = {
    activeAxisLabelStyle?: CSSObject;
    activeDataLabelStyle?: CSSObject;
    series?: Array<SeriesOptionsType>;
    breadcrumbs?: BreadcrumbsOptions;
};
export type PlotOptionsType = Partial<Record<'pie' | 'line' | 'funnel', {
    innerSize?: string;
    allowPointSelect?: boolean;
    cursor?: 'pointer';
    dataLabels?: {
        enabled?: boolean;
        distance?: number;
        connectorColor?: string;
        useHTML?: boolean;
        format?: string;
        style?: CSSObject;
    };
    showInLegend?: boolean;
    center?: [string, string];
    size?: string;
    borderWidth?: number;
    borderRadius?: number;
    neckWidth?: string | number;
    neckHeight?: string | number;
    minSize?: string | number;
    width?: string | number;
    clip?: boolean;
}>>;
export type ChartTooltip = {
    useHTML?: boolean;
    followPointer?: boolean;
    backgroundColor?: string;
    style?: CSSObject;
    outside?: boolean;
    headerFormat?: string;
    pointFormat?: string;
    shared?: boolean;
};
export type Legend = {
    align?: 'left' | 'center' | 'right';
    alignColumns?: boolean;
    backgroundColor?: string;
    borderColor?: string;
    borderRadius?: number;
    borderWidth?: number;
    className?: string;
    enabled?: boolean;
    floating?: boolean;
    itemDistance?: number;
    itemMarginBottom?: number;
    labelFormat?: string;
    layout?: 'horizontal' | 'vertical' | 'proximate';
    margin?: number;
    maxHeight?: number;
    padding?: number;
    reversed?: boolean;
    x?: number;
    y?: number;
};
export type Credits = {
    enabled?: boolean;
    href?: string;
    position?: {
        align?: 'right' | 'left';
        verticalAlign?: 'bottom' | 'top';
        x?: number;
        y?: number;
    };
};
export type Navigation = {
    breadcrumbs?: ChartBreadcrumbs;
};
export type ChartBreadcrumbs = {
    position?: Position;
    style?: CSSObject;
    buttonTheme?: ButtonTheme;
    separator?: {
        text?: string;
    };
};
export type ButtonTheme = {
    style?: CSSObject;
};
export type Position = {
    align?: string;
    verticalAlign?: string;
    x?: number;
    y?: number;
};
//# sourceMappingURL=charts.d.ts.map