import { jsx as _jsx } from "react/jsx-runtime";
import React from "react";
export function StatusHint({ text, tokens, tone = "secondary", }) {
    if (!text) {
        return null;
    }
    return (_jsx("div", { style: {
            color: tone === "error"
                ? tokens.color.statusError
                : tokens.color.textSecondary,
            marginTop: tokens.spacing.statusHintTop,
            fontSize: tokens.typography.statusHint.size,
            lineHeight: `${tokens.typography.statusHint.lineHeight}px`,
            fontWeight: tokens.typography.statusHint.weight,
        }, children: text }));
}
