import { type ReactNode } from 'react';
import type { SettingsSourceMetadata, ValidationIssue } from './useGeneralSettings.js';
/**
 * The canonical Settings section card: a bordered `bg-card` surface with a
 * header (title + optional description) and an optional right-aligned actions
 * slot. This is the single source of truth for the Settings design language —
 * every tab's sections render through it so spacing, padding, typography, and
 * the title/description rhythm stay identical across General, Appearance,
 * Security, SEO, AI, and beyond. Match the Appearance tab exactly: `p-6`,
 * `text-lg` medium title, `text-sm` muted description.
 */
export declare function SettingsCard({ title, description, actions, children, className, headingLevel: Heading, }: {
    title: ReactNode;
    description?: ReactNode;
    /** Right-aligned controls in the header (e.g. a Refresh or Add button). */
    actions?: ReactNode;
    children: ReactNode;
    className?: string;
    /** Override the heading element for correct document outline nesting. */
    headingLevel?: 'h2' | 'h3';
}): import("react/jsx-runtime").JSX.Element;
/**
 * A sub-section inside a {@link SettingsCard}: a top divider plus a
 * `text-base` medium label and optional description. Use for grouped controls
 * within a single card (e.g. "Admin branding" under "Branding").
 */
export declare function SettingsSubsection({ title, description, children, className, }: {
    title: ReactNode;
    description?: ReactNode;
    children?: ReactNode;
    className?: string;
}): import("react/jsx-runtime").JSX.Element;
/**
 * A single setting row: an optional leading visual plus a label and
 * description on the left, and a control aligned to the right edge. This is the
 * uniform rhythm for compact controls (upload buttons, segmented toggles)
 * inside a {@link SettingsCard} — mirror it everywhere so rows line up instead
 * of stacking controls beneath their copy.
 */
export declare function SettingsControlRow({ label, description, control, leading, htmlFor, align, className, }: {
    label: ReactNode;
    description?: ReactNode;
    /** Right-aligned control(s) for this row. */
    control: ReactNode;
    /** Optional visual (e.g. a logo thumbnail) shown before the label. */
    leading?: ReactNode;
    /** When set, the label renders as a `<label>` bound to this control id. */
    htmlFor?: string;
    /** Vertical alignment of the two columns. Defaults to centered. */
    align?: 'center' | 'start';
    className?: string;
}): import("react/jsx-runtime").JSX.Element;
/** Small badge showing where a setting's value comes from. */
export declare function SettingsSourceBadge({ meta }: {
    meta?: SettingsSourceMetadata;
}): import("react/jsx-runtime").JSX.Element | null;
/** A labelled switch row with description, used for the SEO defaults. */
export declare function SettingsToggleRow({ label, description, checked, onChange, disabled, badge, }: {
    label: string;
    description: string;
    checked: boolean;
    onChange: (value: boolean) => void;
    disabled?: boolean;
    badge?: ReactNode;
}): import("react/jsx-runtime").JSX.Element;
/** Aggregated validation messages shown above the cards. */
export declare function SettingsValidationSummary({ issues }: {
    issues: ValidationIssue[];
}): import("react/jsx-runtime").JSX.Element | null;
/** Sticky footer with Reset + Save, gated on dirty state. */
export declare function SettingsSaveBar({ dirty, canEdit, hasErrors, saveState, onSave, onReset, }: {
    dirty: boolean;
    canEdit: boolean;
    hasErrors: boolean;
    saveState: 'idle' | 'saving' | 'success' | 'error';
    onSave: () => void;
    onReset: () => void;
}): import("react/jsx-runtime").JSX.Element;
/** Confirmation dialog for dangerous indexing changes. */
export declare function ConfirmDangerousSettingDialog({ open, title, description, confirmLabel, onConfirm, onCancel, }: {
    open: boolean;
    title: string;
    description: string;
    confirmLabel?: string;
    onConfirm: () => void;
    onCancel: () => void;
}): import("react/jsx-runtime").JSX.Element;
//# sourceMappingURL=components.d.ts.map