/// <reference types="react" />
export declare type ElementPropValueMethod = (value: any, theme: MoTheme) => string;
export declare type EPV<T> = T | [T, boolean];
export declare type JSXChild = string | JSX.Element;
export declare type JSXChildren = JSXChild | JSXChild[];
export declare type Value = string | number;
export declare type ValueMix = Value | Value[];
export declare type SetValue<T> = ((value: T) => void) | React.Dispatch<React.SetStateAction<T>>;
export interface ThemeVariable<T> {
    [key: string]: T;
}
export interface JSXElementProps {
    [key: string]: any;
}
export interface Keys {
    [key: string]: string | ElementPropValueMethod;
}
export interface VariantOptions {
    util?: boolean;
    alert?: boolean;
    breadcrumb?: boolean;
    button?: boolean;
    dropdown?: boolean;
    form?: boolean;
    pagination?: boolean;
    popover?: boolean;
    progressBar?: boolean;
    table?: boolean;
    waveEffect?: boolean;
}
export interface ColorObject {
    color: number[];
    valpha: number;
    isDark: () => boolean;
    isLight: () => boolean;
    hex: () => ColorObject;
    rgb: () => ColorObject;
    hsl: () => ColorObject;
    darken: (value: number) => ColorObject;
    alpha: (value: number) => ColorObject;
}
export interface Grid {
    small: number;
    medium: number;
    large: number;
    xlarge: number;
}
export interface Variant {
    main: string;
    font?: string;
    dark?: string;
    darker?: string;
    darkest?: string;
    light?: string;
    lighter?: string;
    lightest?: string;
    shadow?: string;
    alert?: {
        background?: string;
        border?: string;
        font?: string;
        fontFill?: string;
        linkFont?: string;
        hr?: string;
    };
    breadcrumb?: {
        background?: string;
        font?: string;
        fontFill?: string;
    };
    button?: {
        background?: string;
        placeholder?: string;
        placeholderFill?: string;
    };
    dropdown?: {
        background?: string;
        font?: string;
    };
    form?: {
        radioColor?: string;
        radioBorder?: string;
        inputBackground?: string;
        inputBorder?: string;
        inputFont?: string;
        inputPlaceholder?: string;
        inputPlaceholderFill?: string;
    };
    pagination?: {
        background?: string;
        border?: string;
        font?: string;
    };
    popover?: {
        background?: string;
        border?: string;
        headerBackground?: string;
        headerBorder?: string;
    };
    progressBar?: {
        background?: string;
        backgroundFill?: string;
        backgroundAlt?: string;
    };
    table?: {
        background?: string;
        border?: string;
        font?: string;
        stripedBackground?: string;
        stripedFont?: string;
        hoverBackground?: string;
        hoverFont?: string;
    };
    waveEffect?: {
        color?: string;
    };
}
export interface Coordinator<T> {
    x: T;
    y: T;
}
export interface MoTheme {
    variant: {
        [key: string]: Variant;
    };
    isMobile: boolean;
    zIndex: ThemeVariable<number>;
    length: ThemeVariable<Value>;
    radius: ThemeVariable<Value>;
    color: ThemeVariable<string>;
    fontFamily: ThemeVariable<string>;
    fontWeight: ThemeVariable<Value>;
    fontSize: ThemeVariable<Value>;
    iconSize: ThemeVariable<Value>;
    alert: {
        padding: ThemeVariable<Coordinator<string> & {
            xHalf: string;
        }>;
        radius: string;
        fontSize: ThemeVariable<string>;
        linkFontWeight: string;
    };
    badge: {
        fixedSize: ThemeVariable<string>;
        padding: ThemeVariable<Coordinator<string>>;
        margin: Coordinator<string>;
        radius: ThemeVariable<string>;
        fontSize: ThemeVariable<string>;
    };
    breadcrumb: {
        padding: Coordinator<string>;
        radius: ThemeVariable<string>;
        fontSize: string;
        disabledOpacity: number;
        transition: string;
    };
    button: {
        fixedSize: ThemeVariable<string>;
        padding: ThemeVariable<Coordinator<string> & {
            xHalf: string;
        }>;
        radius: ThemeVariable<string>;
        fontSize: ThemeVariable<string>;
        disabledOpacity: number;
        transition: string;
    };
    colorPicker: {
        colorLight: string;
        colorDark: string;
        pickerBoxShadow: string;
        draggerBoxShadow: string;
        paletteIconColor: string;
        paletteBorderColor: string;
    };
    datePicker: {
        background: string;
        font: string;
        inactive: string;
        arrowActive: string;
    };
    dropdown: {
        padding: ThemeVariable<string>;
        margin: ThemeVariable<Coordinator<string>>;
        radius: ThemeVariable<string>;
        fontSize: ThemeVariable<string>;
        disabledOpacity: number;
    };
    fixedBox: {
        boxShadow: string;
    };
    form: {
        disabledOpacity: number;
        radioSpanSpace: string;
        radioSpanFontSize: ThemeVariable<string>;
        inputPadding: ThemeVariable<Coordinator<string>>;
        inputRadius: ThemeVariable<string>;
        inputFontSize: ThemeVariable<string>;
        optionPadding: ThemeVariable<string>;
        optionMargin: ThemeVariable<Coordinator<string>>;
        optionFontSize: ThemeVariable<string>;
    };
    grid: {
        breakpoint: Grid;
        containerWidth: Grid;
        columnGap: string;
    };
    loading: {
        size: ThemeVariable<string>;
        animation: string;
    };
    modal: {
        width: ThemeVariable<string>;
        borderColor: string;
        borderRadius: string;
        backgroundColor: string;
        fontColor: string;
        modalContentPadding: Coordinator<string>;
        modalContentBorderColor: string;
        modalFooterPadding: Coordinator<string>;
        modalFooterContentMargin: Coordinator<string>;
    };
    overlay: {
        space: string;
        background: string;
    };
    pagination: {
        padding: Coordinator<string>;
        margin: Coordinator<string>;
        fixedSize: string;
        radius: ThemeVariable<string>;
        fontSize: string;
        disabledOpacity: number;
        transition: string;
    };
    popover: {
        radius: string;
        fontSize: ThemeVariable<string>;
        headerPadding: ThemeVariable<Coordinator<string>>;
        bodyPadding: ThemeVariable<Coordinator<string>>;
    };
    progressBar: {
        radius: ThemeVariable<string>;
        transitionType: string;
        stripedAnimationType: string;
    };
    table: {
        padding: ThemeVariable<string>;
        fontSize: ThemeVariable<string>;
        stripedOrientation: string;
        hoverTransition: string;
    };
    tooltip: {
        padding: ThemeVariable<Coordinator<string>>;
        radius: string;
        fontSize: ThemeVariable<string>;
    };
    waveEffect: {
        transition: string;
    };
}
export interface SizeStrictProps {
    size: string;
    sizeSm: string;
    sizeMd: string;
    sizeLg: string;
    sizeXl: string;
}