import * as react_jsx_runtime from 'react/jsx-runtime';

type IncomingOutgoingsLabel = "Total Income" | "Essentials" | "Lifestyle: Discretionary" | "Debt Repayments" | "Surplus & Future Savings" | "Over Spending";
interface IncomingOutgoingsItem {
    label: IncomingOutgoingsLabel;
    /** Dollar value */
    value: number;
    /** CSS color string for the bar fill and icon */
    color: string;
    /** CSS color string for the bar track background */
    bgColor: string;
    /** Bar fill width as a percentage 0–100 */
    pct: number;
    /**
     * Optional "how is this calculated" explainer shown as an info-icon tooltip
     * next to the label (e.g. why Debt Repayments don't add up exactly to income).
     */
    tooltip?: string;
}
interface IncomingOutgoingsCardProps {
    items: IncomingOutgoingsItem[];
    title?: string;
    /** Optional whole-card explainer shown as an info-icon tooltip next to the title. */
    tooltip?: string;
    className?: string;
}
declare function IncomingOutgoingsCard({ items, title, tooltip, className, }: IncomingOutgoingsCardProps): react_jsx_runtime.JSX.Element | null;

export { IncomingOutgoingsCard, type IncomingOutgoingsCardProps, type IncomingOutgoingsItem, type IncomingOutgoingsLabel };