@makolabs/ripple/dist/layout/card/ranked-card.d.ts

Simple Svelte 5 powered component library ✨

export declare const rankedCard: import("tailwind-variants").TVReturnType<{
    columns: {
        1: {
            container: string;
        };
        2: {
            container: string;
        };
        3: {
            container: string;
        };
        4: {
            container: string;
        };
    };
}, {
    container: string;
    card: string;
    header: string;
    rank: string;
    title: string;
    metricsContainer: string;
    metricRow: string;
    metricLabel: string;
    metricValue: string;
    actionContainer: string;
    actionText: string;
    actionLabel: string;
}, undefined, {
    columns: {
        1: {
            container: string;
        };
        2: {
            container: string;
        };
        3: {
            container: string;
        };
        4: {
            container: string;
        };
    };
}, {
    container: string;
    card: string;
    header: string;
    rank: string;
    title: string;
    metricsContainer: string;
    metricRow: string;
    metricLabel: string;
    metricValue: string;
    actionContainer: string;
    actionText: string;
    actionLabel: string;
}, import("tailwind-variants").TVReturnType<{
    columns: {
        1: {
            container: string;
        };
        2: {
            container: string;
        };
        3: {
            container: string;
        };
        4: {
            container: string;
        };
    };
}, {
    container: string;
    card: string;
    header: string;
    rank: string;
    title: string;
    metricsContainer: string;
    metricRow: string;
    metricLabel: string;
    metricValue: string;
    actionContainer: string;
    actionText: string;
    actionLabel: string;
}, undefined, unknown, unknown, undefined>>;
export type RankedCardMetric = {
    label: string;
    value: string;
    color?: string;
};
export type RankedCardItem = {
    rank: number;
    title: string;
    metrics: RankedCardMetric[];
    action?: {
        text: string;
        color?: string;
    };
};
export type RankedCardProps = {
    items: RankedCardItem[];
    columns?: 1 | 2 | 3 | 4;
    class?: string;
};