import React from "react";
import type { VideoProps } from "../types.js";
/**
 * Helper types for skin integration
 * Import from @page-speed/skins
 */
export interface VideoSkinDefinition {
    id: string;
    name: string;
    version: string;
    targets: string[];
    tokens: Record<string, string>;
    classes: Record<string, string>;
    assets?: Record<string, string>;
    description?: string;
    metadata?: any;
}
export interface VideoWithSkinProps extends VideoProps {
    /** Skin definition from @page-speed/skins */
    skin?: VideoSkinDefinition | null;
    /** Override to use native controls even when skin is provided */
    forceNativeControls?: boolean;
}
/**
 * VideoPlayer with automatic skin application
 *
 * @example
 * ```tsx
 * import { VideoWithSkin } from '@page-speed/video';
 * import { loadSkinFromJsDelivr } from '@page-speed/skins';
 *
 * const skin = await loadSkinFromJsDelivr('0.1.0', 'skins/video/linear-inspired.json');
 *
 * <VideoWithSkin
 *   src="video.mp4"
 *   skin={skin}
 * />
 * ```
 */
export declare const VideoWithSkin: React.ForwardRefExoticComponent<VideoWithSkinProps & React.RefAttributes<HTMLVideoElement>>;