import type { TokensType } from '../theme/interface';
export declare const varCreator: (TOKENS: TokensType) => {
    steps_background_color: string;
    steps_padding_vertical: number;
    steps_padding_horizontal: number;
    steps_icon_dot_size: number;
    steps_icon_dot_active_size: number;
    steps_icon_success_active_size: number;
    steps_title_size: number;
    steps_title_color: string;
};
declare type ComponentVars = ReturnType<typeof varCreator>;
export declare const styleCreator: (cv: ComponentVars, TOKENS: TokensType) => {
    scrollViewBox: {
        width: string;
    };
    outWrap: {
        backgroundColor: string;
        paddingVertical: number;
        paddingHorizontal: number;
    };
    stepsBox: {
        alignItems: "flex-start";
        flexDirection: "row";
        justifyContent: "center";
        position: "relative";
    };
    stepWrap: {
        alignItems: "center";
        justifyContent: "center";
        flexShrink: number;
    };
    stepIconWrap: {
        height: number;
        justifyContent: "center";
        backgroundColor: string;
        paddingHorizontal: number;
        position: "relative";
        zIndex: number;
        marginBottom: number;
    };
    line: {
        position: "absolute";
        top: number;
        zIndex: number;
        height: number;
        backgroundColor: string;
    };
    dot: {
        width: number;
        height: number;
        backgroundColor: string;
        borderRadius: number;
    };
    dotActive: {
        width: number;
        height: number;
        backgroundColor: string;
        borderRadius: number;
    };
    titleText: {
        fontSize: number;
        color: string;
        marginHorizontal: number;
    };
    activeTitleText: {
        fontSize: number;
        color: string;
        marginHorizontal: number;
    };
};
export {};