import { default as React } from 'react';
export interface KeyValuePairProps {
    /** Label/key text */
    label: string;
    /** Value content */
    value: React.ReactNode;
    /** Layout orientation */
    orientation?: 'horizontal' | 'vertical';
    /** Alignment for horizontal layout */
    align?: 'start' | 'center' | 'between';
    /** Label width (for horizontal layout) */
    labelWidth?: 'auto' | 'sm' | 'md' | 'lg';
    /** Text size */
    size?: 'sm' | 'md' | 'lg';
    /** Show separator */
    separator?: boolean;
    /** Label color variant */
    labelVariant?: 'default' | 'muted' | 'strong';
    /** Value color variant */
    valueVariant?: 'default' | 'muted' | 'strong' | 'primary';
    /** Additional className for container */
    className?: string;
    /** Additional className for label */
    labelClassName?: string;
    /** Additional className for value */
    valueClassName?: string;
}
/**
 * KeyValuePair Component
 *
 * Displays a label-value pair with flexible layout and styling options.
 * Commonly used in forms, details pages, and data displays.
 *
 * @example
 * ```tsx
 * <KeyValuePair label="Email" value="user@example.com" />
 * <KeyValuePair
 *   label="Status"
 *   value={<Badge variant="success">Active</Badge>}
 *   orientation="horizontal"
 *   align="between"
 * />
 * ```
 *
 * @example
 * ```tsx
 * <KeyValuePair
 *   label="Wallet Address"
 *   value="0x742d35Cc6634C0532925a3b844Bc9e7595f0bEb"
 *   separator
 *   valueVariant="primary"
 * />
 * ```
 */
export declare const KeyValuePair: React.FC<KeyValuePairProps>;
//# sourceMappingURL=key-value-pair.d.ts.map