import { Icon } from '@judo/model-api';
import { SxProps, Theme } from '@mui/material/styles';
export interface IconRendererProps {
    /** Icon model object containing iconName, or a string icon name */
    icon: Icon | string | undefined | null;
    /** Additional CSS classes (e.g., 'mdi-spin', 'mdi-rotate-90') */
    className?: string;
    /** Icon size - maps to font-size */
    size?: "small" | "medium" | "large" | number;
    /** Icon color - inherits from parent by default */
    color?: string;
    /** MUI sx prop for additional styling */
    sx?: SxProps<Theme>;
}
/**
 * Renders icons using MDI webfont classes.
 *
 * The icon is rendered as a <span> with MDI CSS classes:
 * - `mdi` - base class required for all icons
 * - `mdi-{iconName}` - specific icon (e.g., `mdi-home`, `mdi-account`)
 *
 * Icon name aliases are automatically resolved to canonical names using
 * the MDI metadata (e.g., `note-add` -> `note-plus`).
 *
 * Helper classes can be added via className prop:
 * - Rotation: `mdi-rotate-45`, `mdi-rotate-90`, `mdi-rotate-180`, etc.
 * - Flip: `mdi-flip-h`, `mdi-flip-v`
 * - Spin: `mdi-spin` (for loading indicators)
 *
 * @example
 * // Using Icon object from model
 * <IconRenderer icon={{ iconName: 'home' }} />
 *
 * // Using string directly
 * <IconRenderer icon="account" />
 *
 * // Using alias - automatically resolved
 * <IconRenderer icon="note-add" /> // renders as mdi-note-plus
 *
 * // With helper classes
 * <IconRenderer icon="loading" className="mdi-spin" />
 */
export declare function IconRenderer({ icon, className, size, color, sx: sxProp }: IconRendererProps): import("react/jsx-runtime").JSX.Element | null;
//# sourceMappingURL=IconRenderer.d.ts.map