@alicloud/cloud-charts/lib/Wnumbercard/index.d.ts


import React from 'react';
import { WlineConfig } from '../Wline';
import { WcircleProps } from '../Wcircle';
import { customFormatterConfig } from '../common/common';
import './index.scss';
export interface LineProps {
    type: 'Wline';
    data: any[];
    width?: number | string;
    height?: number | string;
    position?: 'left' | 'right' | 'top' | 'bottom';
    config?: WlineConfig;
}
export interface CircleProps {
    type: 'Wcircle';
    data: number;
    position?: 'left' | 'right' | 'top' | 'bottom';
    config?: WcircleProps;
}
declare type Status = 'default' | 'normal' | 'warning' | 'error' | 'success' | 'mention' | 'help' | 'p1' | 'p2' | 'p3' | 'p4' | 'p5' | 'p6' | 'p7';
interface LabelTagProps {
    /** tag上的文字 */
    text: string;
    /** tag的状态，默认default */
    status?: Status;
}
interface ValueTagProps extends LabelTagProps {
    /** 上三角与下三角 */
    trend?: 'up' | 'down';
}
interface IConfig extends customFormatterConfig {
    /** 指标卡的label和value的位置，默认左边 */
    position?: 'left' | 'center';
    /** 业务状态，默认default */
    status?: Status;
    /** icon */
    icon?: React.ReactNode;
    /** 卡片中的value字号尺寸，默认medium */
    size?: 'small' | 'medium';
    /** 背景类型，灰色/透明/背景图片，有图表时默认fill，无图表时默认none */
    backgroundType?: 'fill' | 'none' | 'image';
    /** 背景图,image时必传 */
    backgroundImage?: string;
    /** icon位置，默认左边 */
    iconPosition?: 'left' | 'right' | 'top-left';
    /** label旁边的tags */
    labelTags?: LabelTagProps[];
    /** value旁边的tags */
    valueTags?: ValueTagProps[];
    /** 图表，支持线图、圆环图与RN */
    chart?: LineProps | CircleProps | React.ReactNode;
    /** 右上角操作 */
    extra?: React.ReactNode;
    /** 右上角操作的显示逻辑，默认none，一直展示 */
    extraTriggerType?: 'hover' | 'none';
    /** 各种自定义样式，隐藏 */
    itemStyle?: React.CSSProperties;
    labelStyle?: React.CSSProperties;
    valueStyle?: React.CSSProperties;
    [key: string]: any;
}
export interface IDataItem {
    data: {
        /** 标签，超出长度自动省略并显示tooltip */
        label: string | React.ReactNode;
        /** 数值 */
        value?: number | string | React.ReactNode;
        /** 单位 */
        unit?: string;
    };
    config?: IConfig;
}
export declare const Wnumbercard: React.FC<IDataItem>;
export interface IDataOverviewCard {
    data: IDataItem[];
    config?: {
        /** 列数，columns=1表示竖着排，不指定则自适应 */
        columns?: number;
        /** 间距，默认16 */
        margin?: number | [number, number];
        /** 是否显示竖线,不指定则根据backgroundType自动判断 */
        showDivider?: boolean;
        backgroundType?: 'fill' | 'none' | 'image';
        /** 整体的卡片尺寸，默认medium */
        size?: 'small' | 'medium';
    };
}
export declare const Wnumberoverview: React.FC<IDataOverviewCard>;
export {};