/**
 * Shared SEO UI primitives — token-only, accessible building blocks used across
 * the five SEO tabs. No raw palette colours: status uses the theme's
 * success / warning / destructive / muted tokens.
 */
import type { ReactNode } from 'react';
import type { SeoGrade, SeoSeverity } from '../../lib/seo-service.js';
export interface GradeMeta {
    label: string;
    text: string;
    bg: string;
    dot: string;
}
export declare function gradeMeta(grade: SeoGrade): GradeMeta;
/** Grade band from a numeric 0-100 score. */
export declare function gradeFromScore(score: number): SeoGrade;
export declare function severityMeta(severity: SeoSeverity): GradeMeta;
export declare function SeoStatusBadge({ label, tone, }: {
    label: string;
    tone: 'good' | 'fair' | 'poor' | 'critical' | 'neutral';
}): import("react/jsx-runtime").JSX.Element;
/** A horizontal score bar (0-100), coloured by grade. */
export declare function SeoScoreBar({ score, className }: {
    score: number;
    className?: string;
}): import("react/jsx-runtime").JSX.Element;
export declare function ScorePill({ score }: {
    score: number;
}): import("react/jsx-runtime").JSX.Element;
export declare function SectionCard({ title, description, action, children, className, }: {
    title?: string;
    description?: string;
    action?: ReactNode;
    children: ReactNode;
    className?: string;
}): import("react/jsx-runtime").JSX.Element;
export declare function SeoLoading({ label }: {
    label?: string;
}): import("react/jsx-runtime").JSX.Element;
export declare function SeoEmptyState({ icon, title, description, action, }: {
    icon?: ReactNode;
    title: string;
    description?: string;
    action?: ReactNode;
}): import("react/jsx-runtime").JSX.Element;
export declare function SeoErrorState({ message, onRetry }: {
    message: string;
    onRetry?: () => void;
}): import("react/jsx-runtime").JSX.Element;
export declare const btnPrimary = "inline-flex items-center justify-center gap-2 rounded-md bg-primary px-4 py-2 text-base font-medium text-primary-foreground transition-colors hover:bg-primary/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:opacity-60";
export declare const btnSecondary = "inline-flex items-center justify-center gap-2 rounded-md border border-border bg-card px-4 py-2 text-base font-medium text-foreground transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:opacity-60";
export declare const btnGhostIcon = "inline-flex items-center justify-center rounded-md p-2 text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring";
//# sourceMappingURL=primitives.d.ts.map