@djangocfg/ui-tools 2.1.91

package/dist/index.d.ts

@@ -0,0 +1,1591 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { CommonExternalProps } from 'react-json-tree';
+import * as React$1 from 'react';
+import React__default, { ReactNode } from 'react';
+import { Language } from 'prism-react-renderer';
+export { Language } from 'prism-react-renderer';
+import { RJSFSchema, UiSchema, WidgetProps, FieldTemplateProps, ObjectFieldTemplateProps, ArrayFieldTemplateProps, ArrayFieldItemTemplateProps, ErrorListProps } from '@rjsf/utils';
+import { FormProps, IChangeEvent } from '@rjsf/core';
+import { MediaPlayerInstance } from '@vidstack/react';
+import * as zustand_middleware from 'zustand/middleware';
+import * as zustand from 'zustand';
+
+interface JsonTreeConfig {
+    /** Maximum depth to expand automatically (default: 2) */
+    maxAutoExpandDepth?: number;
+    /** Maximum items in array to auto-expand (default: 10) */
+    maxAutoExpandArrayItems?: number;
+    /** Maximum object keys to auto-expand (default: 5) */
+    maxAutoExpandObjectKeys?: number;
+    /** Maximum string length before truncation (default: 200) */
+    maxStringLength?: number;
+    /** Collection limit for performance (default: 50) */
+    collectionLimit?: number;
+    /** Whether to show collection info (array length, object keys count) */
+    showCollectionInfo?: boolean;
+    /** Whether to show expand/collapse all buttons */
+    showExpandControls?: boolean;
+    /** Whether to show copy/download buttons */
+    showActionButtons?: boolean;
+    /** Custom CSS classes for the container */
+    className?: string;
+    /** Whether to preserve object key order (default: true) */
+    preserveKeyOrder?: boolean;
+}
+interface JsonTreeComponentProps {
+    title?: string;
+    data: unknown;
+    config?: JsonTreeConfig;
+    /** Override for react-json-tree props */
+    jsonTreeProps?: Partial<CommonExternalProps>;
+}
+declare const JsonTreeComponent: ({ title, data, config, jsonTreeProps }: JsonTreeComponentProps) => react_jsx_runtime.JSX.Element;
+
+/**
+ * Mermaid Component - Dynamic Import Wrapper
+ *
+ * Lazy loads the heavy Mermaid library (~800KB) only when needed.
+ * This significantly reduces the initial bundle size.
+ */
+
+interface MermaidProps {
+    chart: string;
+    className?: string;
+    isCompact?: boolean;
+}
+declare const Mermaid: React__default.FC<MermaidProps>;
+
+/**
+ * PrettyCode Component - Dynamic Import Wrapper
+ *
+ * Lazy loads the heavy Prism library (~500KB) only when needed.
+ * This significantly reduces the initial bundle size.
+ */
+
+interface PrettyCodeProps {
+    data: string | object;
+    language: Language;
+    className?: string;
+    mode?: 'dark' | 'light';
+    inline?: boolean;
+    customBg?: string;
+    isCompact?: boolean;
+}
+declare const PrettyCode: React__default.FC<PrettyCodeProps>;
+
+/**
+ * LottiePlayer Types
+ *
+ * Type definitions for the Lottie animation player component
+ */
+type LottieSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'full';
+type LottieSpeed = 0.5 | 1 | 1.5 | 2;
+type LottieDirection = 1 | -1;
+interface LottiePlayerProps {
+    /**
+     * Animation data (JSON object) or URL to load from
+     */
+    src: string | object;
+    /**
+     * Size preset for the player
+     * @default 'md'
+     */
+    size?: LottieSize;
+    /**
+     * Custom width (overrides size preset)
+     */
+    width?: number | string;
+    /**
+     * Custom height (overrides size preset)
+     */
+    height?: number | string;
+    /**
+     * Autoplay animation
+     * @default true
+     */
+    autoplay?: boolean;
+    /**
+     * Loop animation
+     * @default true
+     */
+    loop?: boolean | number;
+    /**
+     * Playback speed
+     * @default 1
+     */
+    speed?: LottieSpeed;
+    /**
+     * Direction (1 = forward, -1 = reverse)
+     * @default 1
+     */
+    direction?: LottieDirection;
+    /**
+     * Show playback controls
+     * @default false
+     */
+    controls?: boolean;
+    /**
+     * Background color
+     */
+    background?: string;
+    /**
+     * CSS class name
+     */
+    className?: string;
+    /**
+     * Show loading state
+     * @default true
+     */
+    showLoading?: boolean;
+    /**
+     * Callback when animation completes
+     */
+    onComplete?: () => void;
+    /**
+     * Callback when animation loads
+     */
+    onLoad?: () => void;
+    /**
+     * Callback on error
+     */
+    onError?: (error: Error) => void;
+}
+
+/**
+ * useLottie Hook
+ *
+ * Hook for loading and managing Lottie animation data
+ */
+interface UseLottieOptions {
+    /**
+     * Animation data (JSON object) or URL to load from
+     */
+    src: string | object;
+    /**
+     * Enable caching of loaded animations
+     * @default true
+     */
+    cache?: boolean;
+}
+interface UseLottieReturn {
+    /**
+     * Loaded animation data
+     */
+    animationData: object | null;
+    /**
+     * Loading state
+     */
+    isLoading: boolean;
+    /**
+     * Error state
+     */
+    error: Error | null;
+    /**
+     * Retry loading the animation
+     */
+    retry: () => void;
+}
+/**
+ * Hook for loading Lottie animations from URLs or objects
+ *
+ * Features:
+ * - Loads animations from URLs or accepts animation objects directly
+ * - Caching support to prevent re-fetching the same animation
+ * - Error handling with retry capability
+ * - Loading states
+ *
+ * Usage:
+ * ```tsx
+ * const { animationData, isLoading, error, retry } = useLottie({
+ *   src: 'https://example.com/animation.json'
+ * });
+ *
+ * if (isLoading) return <div>Loading...</div>;
+ * if (error) return <div>Error: {error.message} <button onClick={retry}>Retry</button></div>;
+ * if (!animationData) return null;
+ *
+ * return <LottiePlayer animationData={animationData} />;
+ * ```
+ */
+declare function useLottie(options: UseLottieOptions): UseLottieReturn;
+
+/**
+ * LottiePlayer component wrapper with dynamic import
+ *
+ * This component automatically handles code splitting and lazy loading
+ * of the Lottie player to optimize bundle size.
+ *
+ * Usage:
+ * ```tsx
+ * import { LottiePlayer } from '@djangocfg/ui-core/tools';
+ *
+ * <LottiePlayer
+ *   src="https://example.com/animation.json"
+ *   size="md"
+ *   autoplay
+ *   loop
+ * />
+ * ```
+ */
+declare function LottiePlayer(props: LottiePlayerProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * JSON Schema Form props interface
+ */
+interface JsonSchemaFormProps<T = any> extends Partial<FormProps<T>> {
+    /** JSON Schema that defines the form structure */
+    schema: RJSFSchema;
+    /** UI Schema for customizing the form appearance */
+    uiSchema?: UiSchema;
+    /** Initial form data */
+    formData?: T;
+    /** Callback when form is submitted */
+    onSubmit?: (data: IChangeEvent<T>) => void;
+    /** Callback when form data changes */
+    onChange?: (data: IChangeEvent<T>) => void;
+    /** Callback when form has validation errors */
+    onError?: (errors: any[]) => void;
+    /** Whether to show error list at the top of form */
+    showErrorList?: false | 'top' | 'bottom';
+    /** Whether to live validate on change */
+    liveValidate?: boolean;
+    /** Whether the form is disabled */
+    disabled?: boolean;
+    /** Whether the form is read-only */
+    readonly?: boolean;
+    /** Custom CSS class name */
+    className?: string;
+    /** Whether to show submit button */
+    showSubmitButton?: boolean;
+    /** Submit button text */
+    submitButtonText?: string;
+}
+
+/**
+ * JSON Schema Form Component
+ *
+ * A fully-featured form generator that creates forms from JSON Schema.
+ * Built on top of react-jsonschema-form with custom widgets and templates
+ * using @djangocfg/ui components.
+ *
+ * @example
+ * ```tsx
+ * const schema = {
+ *   type: 'object',
+ *   required: ['name'],
+ *   properties: {
+ *     name: { type: 'string', title: 'Name' },
+ *     age: { type: 'number', title: 'Age' },
+ *     active: { type: 'boolean', title: 'Active' }
+ *   }
+ * };
+ *
+ * <JsonSchemaForm
+ *   schema={schema}
+ *   onSubmit={(data) => console.log(data.formData)}
+ * />
+ * ```
+ */
+declare function JsonSchemaForm<T = any>(props: JsonSchemaFormProps<T>): react_jsx_runtime.JSX.Element;
+
+/**
+ * Text input widget for JSON Schema Form
+ * Handles string fields with optional textarea for multiline
+ */
+declare function TextWidget(props: WidgetProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Number input widget for JSON Schema Form
+ * Handles integer and number fields
+ */
+declare function NumberWidget(props: WidgetProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Checkbox widget for JSON Schema Form
+ * Handles boolean fields
+ */
+declare function CheckboxWidget(props: WidgetProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Select dropdown widget for JSON Schema Form
+ * Handles enum fields
+ */
+declare function SelectWidget(props: WidgetProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Switch toggle widget for JSON Schema Form
+ * Alternative boolean input
+ */
+declare function SwitchWidget(props: WidgetProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Color input widget for JSON Schema Form
+ * Supports HSL format (h s% l%) and HEX format
+ * Click on color box to open native color picker directly
+ */
+declare function ColorWidget(props: WidgetProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Slider widget for JSON Schema Form
+ *
+ * Supports:
+ * - number/integer types
+ * - min/max from schema
+ * - step from schema or options
+ * - unit suffix (e.g., "rem", "px", "%")
+ * - optional text input for precise values
+ *
+ * Usage in uiSchema:
+ * ```json
+ * {
+ *   "radius": {
+ *     "ui:widget": "slider",
+ *     "ui:options": {
+ *       "unit": "rem",
+ *       "showInput": true,
+ *       "step": 0.125
+ *     }
+ *   }
+ * }
+ * ```
+ */
+declare function SliderWidget(props: WidgetProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Field template for JSON Schema Form
+ * Controls the layout and styling of individual form fields
+ */
+declare function FieldTemplate(props: FieldTemplateProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Object field template for JSON Schema Form
+ *
+ * Supports:
+ * - Collapsible groups via ui:collapsible option
+ * - Grid layout via ui:grid option
+ * - Custom styling via ui:className
+ *
+ * Usage in uiSchema:
+ * ```json
+ * {
+ *   "colors": {
+ *     "ui:collapsible": true,
+ *     "ui:collapsed": false,
+ *     "ui:grid": 2
+ *   }
+ * }
+ * ```
+ */
+declare function ObjectFieldTemplate(props: ObjectFieldTemplateProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Array field template for JSON Schema Form
+ * Renders array items with add/remove controls
+ *
+ * NOTE: In RJSF v6, `items` is an array of ReactElement (already rendered),
+ * NOT an array of objects with {children, hasRemove, etc.}.
+ * The actual rendering of each item (including remove buttons) is handled
+ * by ArrayFieldItemTemplate.
+ */
+declare function ArrayFieldTemplate(props: ArrayFieldTemplateProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Array field item template for JSON Schema Form
+ * Renders individual array items with proper styling and action buttons
+ *
+ * In RJSF v6, this template is responsible for rendering each item in an array,
+ * including the item content (children) and the action buttons (remove, move up/down, copy).
+ */
+declare function ArrayFieldItemTemplate(props: ArrayFieldItemTemplateProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Error list template for JSON Schema Form
+ * Displays validation errors at the top of the form
+ */
+declare function ErrorListTemplate(props: ErrorListProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Base input template for JSON Schema Form
+ *
+ * This template is CRITICAL for rendering primitive types (string, number)
+ * inside arrays. Without it, array items with primitive types will render
+ * as empty containers.
+ *
+ * RJSF uses this template for:
+ * - Array items with primitive types (e.g., array of strings)
+ * - Fields without explicit widget mapping
+ * - All text-based widgets internally
+ *
+ * @see https://rjsf-team.github.io/react-jsonschema-form/docs/advanced-customization/custom-templates/#baseinputtemplate
+ */
+declare function BaseInputTemplate(props: WidgetProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Utility functions for JSON Schema Form
+ */
+/**
+ * Safely validates and normalizes JSON Schema
+ * Ensures schema is valid before rendering
+ */
+declare function validateSchema(schema: any): RJSFSchema | null;
+/**
+ * Safely normalizes form data
+ * Removes undefined values and ensures data structure matches schema
+ */
+declare function normalizeFormData<T = any>(formData: any, schema: RJSFSchema): T;
+/**
+ * Merges schema defaults with form data
+ */
+declare function mergeDefaults(formData: any, schema: RJSFSchema): any;
+/**
+ * Safely parses JSON string with error handling
+ */
+declare function safeJsonParse<T = any>(jsonString: string, fallback: T): T;
+/**
+ * Safely stringifies object to JSON
+ */
+declare function safeJsonStringify(obj: any, pretty?: boolean): string;
+/**
+ * Checks if schema has required fields
+ */
+declare function hasRequiredFields(schema: RJSFSchema): boolean;
+/**
+ * Gets all required field paths from schema
+ */
+declare function getRequiredFields(schema: RJSFSchema, prefix?: string): string[];
+/**
+ * Validates form data against required fields
+ */
+declare function validateRequiredFields(formData: any, schema: RJSFSchema): {
+    valid: boolean;
+    missing: string[];
+};
+
+interface SchemaSource {
+    id: string;
+    name: string;
+    url: string;
+}
+interface PlaygroundConfig {
+    schemas: SchemaSource[];
+    defaultSchemaId?: string;
+}
+
+interface PlaygroundProps {
+    config: PlaygroundConfig;
+}
+declare const Playground: React__default.FC<PlaygroundProps>;
+
+/**
+ * Video source type definitions
+ */
+/** Simple URL source (mp4, webm, etc.) */
+interface UrlSource {
+    type: 'url';
+    url: string;
+    title?: string;
+    poster?: string;
+}
+/** YouTube embed source */
+interface YouTubeSource {
+    type: 'youtube';
+    /** YouTube video ID (11 characters) */
+    id: string;
+    title?: string;
+    poster?: string;
+}
+/** Vimeo embed source */
+interface VimeoSource {
+    type: 'vimeo';
+    /** Vimeo video ID */
+    id: string;
+    title?: string;
+    poster?: string;
+}
+/** HLS streaming source */
+interface HLSSource {
+    type: 'hls';
+    /** URL to .m3u8 manifest */
+    url: string;
+    title?: string;
+    poster?: string;
+}
+/** DASH streaming source */
+interface DASHSource {
+    type: 'dash';
+    /** URL to .mpd manifest */
+    url: string;
+    title?: string;
+    poster?: string;
+}
+/** HTTP Range streaming source (for large files with auth) */
+interface StreamSource {
+    type: 'stream';
+    /** Session ID for authorization */
+    sessionId: string;
+    /** File path on server */
+    path: string;
+    /** Function to generate stream URL */
+    getStreamUrl: (sessionId: string, path: string) => string;
+    /** MIME type for the video */
+    mimeType?: string;
+    title?: string;
+    poster?: string;
+}
+/** Binary data source (ArrayBuffer) */
+interface BlobSource {
+    type: 'blob';
+    /** Video data as ArrayBuffer */
+    data: ArrayBuffer;
+    /** MIME type (default: video/mp4) */
+    mimeType?: string;
+    title?: string;
+    poster?: string;
+}
+/** Base64 data URL source */
+interface DataUrlSource {
+    type: 'data-url';
+    /** Base64 encoded data URL */
+    data: string;
+    title?: string;
+    poster?: string;
+}
+/** Union of all source types */
+type VideoSourceUnion = UrlSource | YouTubeSource | VimeoSource | HLSSource | DASHSource | StreamSource | BlobSource | DataUrlSource;
+
+/**
+ * Player configuration types
+ */
+
+/** Player mode - determines which provider to use */
+type PlayerMode = 'auto' | 'vidstack' | 'native' | 'streaming';
+/** Aspect ratio options */
+type AspectRatioValue = number | 'auto' | 'fill';
+/** Common player settings */
+interface CommonPlayerSettings {
+    /** Auto-play video */
+    autoPlay?: boolean;
+    /** Mute video by default */
+    muted?: boolean;
+    /** Loop video */
+    loop?: boolean;
+    /** Play video inline on mobile */
+    playsInline?: boolean;
+    /** Show player controls */
+    controls?: boolean;
+    /**
+     * Aspect ratio:
+     * - number (e.g. 16/9): Fixed aspect ratio
+     * - 'auto': Natural video aspect ratio
+     * - 'fill': Fill parent container (100% width & height)
+     */
+    aspectRatio?: AspectRatioValue;
+    /** Preload strategy */
+    preload?: 'auto' | 'metadata' | 'none';
+}
+/** Common player events */
+interface CommonPlayerEvents {
+    onPlay?: () => void;
+    onPause?: () => void;
+    onEnded?: () => void;
+    onError?: (error: string) => void;
+    onLoadStart?: () => void;
+    onCanPlay?: () => void;
+    onTimeUpdate?: (currentTime: number, duration: number) => void;
+    /** Called when buffering progress changes (buffered seconds, total duration) */
+    onBufferProgress?: (buffered: number, duration: number) => void;
+}
+/** Error fallback render props */
+interface ErrorFallbackProps {
+    error: string;
+    retry?: () => void;
+}
+/** Main VideoPlayer props */
+interface VideoPlayerProps extends CommonPlayerSettings, CommonPlayerEvents {
+    /** Video source configuration */
+    source: VideoSourceUnion;
+    /** Player mode (default: 'auto') */
+    mode?: PlayerMode;
+    /** Player theme (Vidstack only) */
+    theme?: 'default' | 'minimal' | 'modern';
+    /** Show video info below player */
+    showInfo?: boolean;
+    /** Container className */
+    className?: string;
+    /** Video element className (native/streaming only) */
+    videoClassName?: string;
+    /** Disable right-click context menu */
+    disableContextMenu?: boolean;
+    /** Show loading spinner */
+    showPreloader?: boolean;
+    /** Preloader timeout in ms */
+    preloaderTimeout?: number;
+    /** Custom error fallback UI */
+    errorFallback?: React__default.ReactNode | ((props: ErrorFallbackProps) => React__default.ReactNode);
+}
+/** VideoPlayer ref methods */
+interface VideoPlayerRef {
+    /** Play video */
+    play: () => Promise<void> | void;
+    /** Pause video */
+    pause: () => void;
+    /** Toggle play/pause */
+    togglePlay: () => void;
+    /** Seek to time in seconds */
+    seekTo: (time: number) => void;
+    /** Set volume (0-1) */
+    setVolume: (volume: number) => void;
+    /** Toggle mute */
+    toggleMute: () => void;
+    /** Enter fullscreen */
+    enterFullscreen: () => void;
+    /** Exit fullscreen */
+    exitFullscreen: () => void;
+    /** Current playback time in seconds */
+    readonly currentTime: number;
+    /** Video duration in seconds */
+    readonly duration: number;
+    /** Whether video is paused */
+    readonly paused: boolean;
+}
+
+/**
+ * Provider-specific types
+ */
+
+/** Props passed to Vidstack provider */
+interface VidstackProviderProps extends CommonPlayerSettings, CommonPlayerEvents {
+    source: UrlSource | YouTubeSource | VimeoSource | HLSSource | DASHSource;
+    theme?: 'default' | 'minimal' | 'modern';
+    showInfo?: boolean;
+    className?: string;
+    errorFallback?: React__default.ReactNode | ((props: ErrorFallbackProps) => React__default.ReactNode);
+}
+/** Props passed to Native provider */
+interface NativeProviderProps extends CommonPlayerSettings, CommonPlayerEvents {
+    source: UrlSource | DataUrlSource;
+    className?: string;
+    videoClassName?: string;
+    disableContextMenu?: boolean;
+    showPreloader?: boolean;
+    preloaderTimeout?: number;
+}
+/** Props passed to Stream provider */
+interface StreamProviderProps extends CommonPlayerSettings, CommonPlayerEvents {
+    source: StreamSource | BlobSource | DataUrlSource;
+    className?: string;
+    videoClassName?: string;
+    disableContextMenu?: boolean;
+    showPreloader?: boolean;
+    preloaderTimeout?: number;
+    errorFallback?: React__default.ReactNode | ((props: ErrorFallbackProps) => React__default.ReactNode);
+}
+/** Options for resolving file source */
+interface ResolveFileSourceOptions {
+    /** File content - can be data URL string or binary ArrayBuffer */
+    content: string | ArrayBuffer | null | undefined;
+    /** File path for streaming */
+    path: string;
+    /** MIME type of the file */
+    mimeType?: string;
+    /** Session ID for authenticated streaming */
+    sessionId?: string | null;
+    /** Load method hint - 'http_stream' enables streaming mode */
+    loadMethod?: 'http_stream' | 'rpc' | 'unspecified' | 'skip' | string;
+    /** Function to generate stream URL (required for streaming) */
+    getStreamUrl?: (sessionId: string, path: string) => string;
+    /** Optional title */
+    title?: string;
+    /** Optional poster */
+    poster?: string;
+}
+interface VideoPlayerContextValue {
+    /** Function to generate stream URL (for HTTP Range streaming) */
+    getStreamUrl?: (sessionId: string, path: string) => string;
+    /** Current session ID */
+    sessionId?: string | null;
+}
+interface VideoPlayerProviderProps extends VideoPlayerContextValue {
+    children: React__default.ReactNode;
+}
+/** Simplified stream source (uses context for getStreamUrl) */
+interface SimpleStreamSource {
+    type: 'stream';
+    /** File path on server */
+    path: string;
+    /** Session ID (optional, uses context if not provided) */
+    sessionId?: string;
+    /** MIME type for the video */
+    mimeType?: string;
+    title?: string;
+    poster?: string;
+}
+
+/**
+ * VideoPlayer - Unified Video Player Component
+ *
+ * Supports multiple modes:
+ * - vidstack: Full-featured player (YouTube, Vimeo, HLS, DASH)
+ * - native: Lightweight HTML5 player
+ * - streaming: HTTP Range streaming with auth / Blob sources
+ *
+ * @example
+ * // YouTube video
+ * <VideoPlayer source={{ type: 'youtube', id: 'dQw4w9WgXcQ' }} />
+ *
+ * @example
+ * // HLS stream
+ * <VideoPlayer source={{ type: 'hls', url: 'https://example.com/video.m3u8' }} />
+ *
+ * @example
+ * // HTTP Range streaming with auth (full source)
+ * <VideoPlayer
+ *   source={{
+ *     type: 'stream',
+ *     sessionId: 'abc123',
+ *     path: '/videos/movie.mp4',
+ *     getStreamUrl: (id, path) => `/api/stream/${id}?path=${path}&token=${token}`
+ *   }}
+ * />
+ *
+ * @example
+ * // HTTP Range streaming (simplified, using VideoPlayerProvider context)
+ * <VideoPlayerProvider sessionId={sessionId} getStreamUrl={getStreamUrl}>
+ *   <VideoPlayer source={{ type: 'stream', path: '/videos/movie.mp4' }} />
+ * </VideoPlayerProvider>
+ *
+ * @example
+ * // Blob/ArrayBuffer
+ * <VideoPlayer source={{ type: 'blob', data: arrayBuffer, mimeType: 'video/mp4' }} />
+ */
+
+declare const VideoPlayer: React__default.ForwardRefExoticComponent<VideoPlayerProps & {
+    source: VideoSourceUnion | SimpleStreamSource;
+} & React__default.RefAttributes<VideoPlayerRef>>;
+
+interface VideoControlsProps {
+    player: React__default.RefObject<MediaPlayerInstance | null>;
+    className?: string;
+}
+declare function VideoControls({ player, className }: VideoControlsProps): react_jsx_runtime.JSX.Element;
+
+interface VideoErrorFallbackProps extends ErrorFallbackProps {
+    /** URL for download button (if provided, shows download button) */
+    downloadUrl?: string;
+    /** Filename for download */
+    downloadFilename?: string;
+    /** File size to display */
+    fileSize?: string;
+    /** Show retry button */
+    showRetry?: boolean;
+    /** Custom className */
+    className?: string;
+    /** Custom icon */
+    icon?: React__default.ReactNode;
+    /** Custom title (defaults to error message) */
+    title?: string;
+    /** Custom description */
+    description?: string;
+}
+/**
+ * Pre-built error fallback component for VideoPlayer
+ *
+ * @example
+ * // Basic usage
+ * <VideoPlayer
+ *   source={source}
+ *   errorFallback={(props) => (
+ *     <VideoErrorFallback
+ *       {...props}
+ *       downloadUrl={getDownloadUrl()}
+ *       downloadFilename="video.mp4"
+ *     />
+ *   )}
+ * />
+ *
+ * @example
+ * // With file size
+ * <VideoErrorFallback
+ *   error="Failed to load video"
+ *   downloadUrl="/api/download/video.mp4"
+ *   fileSize="125 MB"
+ *   showRetry
+ *   retry={() => reloadVideo()}
+ * />
+ */
+declare function VideoErrorFallback({ error, retry, downloadUrl, downloadFilename, fileSize, showRetry, className, icon, title, description, }: VideoErrorFallbackProps): react_jsx_runtime.JSX.Element;
+interface CreateVideoErrorFallbackOptions {
+    /** Function to get download URL from source */
+    getDownloadUrl?: (source: unknown) => string | undefined;
+    /** Function to get filename from source */
+    getFilename?: (source: unknown) => string | undefined;
+    /** Function to get file size from source */
+    getFileSize?: (source: unknown) => string | undefined;
+    /** Show retry button */
+    showRetry?: boolean;
+}
+/**
+ * Factory to create error fallback function for VideoPlayer
+ *
+ * @example
+ * const errorFallback = createVideoErrorFallback({
+ *   getDownloadUrl: (source) => source.downloadUrl,
+ *   getFilename: (source) => source.filename,
+ *   showRetry: true,
+ * });
+ *
+ * <VideoPlayer source={source} errorFallback={errorFallback} />
+ */
+declare function createVideoErrorFallback(options: CreateVideoErrorFallbackOptions): (props: ErrorFallbackProps, source?: unknown) => React__default.ReactNode;
+
+/**
+ * VidstackProvider - Full-featured video player using Vidstack
+ * Supports YouTube, Vimeo, HLS, DASH, and direct URLs
+ */
+
+declare const VidstackProvider: React__default.ForwardRefExoticComponent<VidstackProviderProps & React__default.RefAttributes<VideoPlayerRef>>;
+
+/**
+ * NativeProvider - Lightweight native HTML5 video player
+ * For demo videos, background videos, autoplay loop muted scenarios
+ */
+
+declare const NativeProvider: React__default.ForwardRefExoticComponent<NativeProviderProps & React__default.RefAttributes<VideoPlayerRef>>;
+
+/**
+ * StreamProvider - HTTP Range streaming and Blob video player
+ * Supports:
+ * - HTTP Range requests with authorization (for large files)
+ * - Blob/ArrayBuffer sources
+ * - Data URL sources
+ * - Fill parent container mode
+ * - Custom error fallback
+ */
+
+declare const StreamProvider: React__default.ForwardRefExoticComponent<StreamProviderProps & React__default.RefAttributes<VideoPlayerRef>>;
+
+/**
+ * Provider for VideoPlayer streaming configuration
+ *
+ * @example
+ * // In your app layout or FileWorkspace
+ * <VideoPlayerProvider
+ *   sessionId={sessionId}
+ *   getStreamUrl={terminalClient.terminal_media.streamStreamRetrieveUrl}
+ * >
+ *   <VideoPlayer source={{ type: 'stream', path: '/video.mp4' }} />
+ * </VideoPlayerProvider>
+ */
+declare function VideoPlayerProvider({ children, getStreamUrl, sessionId, }: VideoPlayerProviderProps): react_jsx_runtime.JSX.Element;
+/**
+ * Hook to access VideoPlayer context
+ */
+declare function useVideoPlayerContext(): VideoPlayerContextValue | null;
+
+/**
+ * Video source and player mode resolvers
+ */
+
+/**
+ * Determine which provider to use based on source type
+ */
+declare function resolvePlayerMode(source: VideoSourceUnion, mode?: PlayerMode): 'vidstack' | 'native' | 'streaming';
+/**
+ * Check if source is a simplified stream source (without getStreamUrl)
+ */
+declare function isSimpleStreamSource(source: VideoSourceUnion | SimpleStreamSource): source is SimpleStreamSource;
+/**
+ * Resolve simplified stream source to full stream source using context
+ */
+declare function resolveStreamSource(source: SimpleStreamSource, context: VideoPlayerContextValue | null): StreamSource | null;
+
+/**
+ * File source resolution utilities
+ */
+
+/**
+ * Resolve file content to VideoSourceUnion
+ * Useful for FileWorkspace/file manager integrations
+ *
+ * @example
+ * const source = resolveFileSource({
+ *   content: file.content,
+ *   path: file.path,
+ *   mimeType: file.mimeType,
+ *   sessionId: sessionId,
+ *   loadMethod: file.loadMethod,
+ *   getStreamUrl: terminalClient.terminal_media.streamStreamRetrieveUrl
+ * });
+ *
+ * <VideoPlayer source={source} />
+ */
+declare function resolveFileSource(options: ResolveFileSourceOptions): VideoSourceUnion | null;
+
+interface HybridAudioPlayerProps {
+    /** Show playback controls */
+    showControls?: boolean;
+    /** Show frequency waveform */
+    showWaveform?: boolean;
+    /** Waveform visualization mode */
+    waveformMode?: 'frequency' | 'static';
+    /** Waveform height in pixels */
+    waveformHeight?: number;
+    /** Show time display */
+    showTimer?: boolean;
+    /** Show volume control */
+    showVolume?: boolean;
+    /** Show loop button */
+    showLoop?: boolean;
+    /** Additional CSS class */
+    className?: string;
+    /** Inline styles */
+    style?: React.CSSProperties;
+}
+declare const HybridAudioPlayer: React$1.NamedExoticComponent<HybridAudioPlayerProps>;
+
+/**
+ * Audio Reactive Effects - Common utilities and types
+ *
+ * Provides reusable effect calculations and configurations
+ */
+type EffectVariant = 'glow' | 'orbs' | 'spotlight' | 'mesh';
+type EffectIntensity = 'subtle' | 'medium' | 'strong';
+type EffectColorScheme = 'primary' | 'vibrant' | 'cool' | 'warm';
+interface AudioLevels {
+    bass: number;
+    mid: number;
+    high: number;
+    overall: number;
+}
+interface EffectConfig$1 {
+    opacity: number;
+    scale: number;
+    blur: string;
+}
+interface EffectColors {
+    colors: string[];
+    hueShift: number;
+}
+interface EffectLayer {
+    inset: number;
+    opacity: number;
+    scale: number;
+    background: string;
+    blur: string;
+    animation?: string;
+}
+declare const INTENSITY_CONFIG: Record<EffectIntensity, EffectConfig$1>;
+declare const COLOR_SCHEMES: Record<EffectColorScheme, string[]>;
+/**
+ * Get effect configuration from intensity setting
+ */
+declare function getEffectConfig(intensity: EffectIntensity): EffectConfig$1;
+/**
+ * Get color array from color scheme
+ */
+declare function getColors(colorScheme: EffectColorScheme): string[];
+/**
+ * Prepare colors with hue shift based on audio levels
+ */
+declare function prepareEffectColors(colorScheme: EffectColorScheme, levels: AudioLevels): EffectColors;
+/**
+ * Calculate glow layer properties
+ */
+declare function calculateGlowLayers(levels: AudioLevels, config: EffectConfig$1, colors: string[]): EffectLayer[];
+/**
+ * Calculate orb positions and properties - highly reactive
+ */
+declare function calculateOrbs(levels: AudioLevels, config: EffectConfig$1, colors: string[], baseSize?: number): {
+    x: number;
+    y: number;
+    size: number;
+    color: string;
+    opacity: number;
+    scale: number;
+}[];
+/**
+ * Calculate mesh gradient positions - dynamic and reactive
+ */
+declare function calculateMeshGradients(levels: AudioLevels, config: EffectConfig$1, colors: string[]): ({
+    width: string;
+    height: string;
+    top: string;
+    right: string;
+    color: string;
+    opacity: number;
+    scale: number;
+    rotation: number;
+    blur: string;
+    bottom?: undefined;
+    left?: undefined;
+    isCenter?: undefined;
+} | {
+    width: string;
+    height: string;
+    bottom: string;
+    left: string;
+    color: string;
+    opacity: number;
+    scale: number;
+    rotation: number;
+    blur: string;
+    top?: undefined;
+    right?: undefined;
+    isCenter?: undefined;
+} | {
+    width: string;
+    height: string;
+    top: string;
+    left: string;
+    color: string;
+    opacity: number;
+    scale: number;
+    rotation: number;
+    blur: string;
+    right?: undefined;
+    bottom?: undefined;
+    isCenter?: undefined;
+} | {
+    width: string;
+    height: string;
+    top: string;
+    left: string;
+    color: string;
+    opacity: number;
+    scale: number;
+    rotation: number;
+    isCenter: boolean;
+    blur: string;
+    right?: undefined;
+    bottom?: undefined;
+})[];
+/**
+ * Calculate spotlight effect properties - highly reactive
+ */
+declare function calculateSpotlight(levels: AudioLevels, config: EffectConfig$1, colors: string[], rotation: number): {
+    rotation: number;
+    inset: number;
+    colors: {
+        color: string;
+        opacity: number;
+    }[];
+    pulseInset: number;
+    pulseOpacity: number;
+    pulseScale: number;
+    ringOpacity: number;
+    ringScale: number;
+};
+/**
+ * CSS for effect animations - can be injected once
+ */
+declare const EFFECT_ANIMATIONS = "\n  @keyframes spotlight-spin {\n    0% { transform: rotate(0deg); }\n    100% { transform: rotate(360deg); }\n  }\n\n  @keyframes orb-float-1 {\n    0%, 100% { transform: translate(-50%, -50%) translateY(0); }\n    50% { transform: translate(-50%, -50%) translateY(-15px); }\n  }\n\n  @keyframes orb-float-2 {\n    0%, 100% { transform: translate(-50%, -50%) translateX(0); }\n    50% { transform: translate(-50%, -50%) translateX(15px); }\n  }\n\n  @keyframes orb-float-3 {\n    0%, 100% { transform: translate(-50%, -50%) translate(0, 0); }\n    33% { transform: translate(-50%, -50%) translate(10px, -10px); }\n    66% { transform: translate(-50%, -50%) translate(-10px, 10px); }\n  }\n\n  @keyframes orb-float-4 {\n    0%, 100% { transform: translate(-50%, -50%) translate(0, 0); }\n    50% { transform: translate(-50%, -50%) translate(-15px, -10px); }\n  }\n\n  @keyframes mesh-float-1 {\n    0%, 100% { transform: translate(0, 0) scale(1); }\n    25% { transform: translate(-5%, 10%) scale(1.05); }\n    50% { transform: translate(5%, 5%) scale(0.95); }\n    75% { transform: translate(-3%, -5%) scale(1.02); }\n  }\n\n  @keyframes mesh-float-2 {\n    0%, 100% { transform: translate(0, 0) scale(1); }\n    33% { transform: translate(8%, -8%) scale(1.08); }\n    66% { transform: translate(-6%, 6%) scale(0.92); }\n  }\n\n  @keyframes mesh-float-3 {\n    0%, 100% { transform: translate(0, 0) scale(1); }\n    50% { transform: translate(10%, 10%) scale(1.1); }\n  }\n\n  @keyframes mesh-float-4 {\n    0%, 100% { transform: translate(0, 0) scale(1) rotate(0deg); }\n    25% { transform: translate(10%, -5%) scale(1.1) rotate(5deg); }\n    50% { transform: translate(-5%, 10%) scale(0.95) rotate(-5deg); }\n    75% { transform: translate(-10%, -10%) scale(1.05) rotate(3deg); }\n  }\n\n  @keyframes mesh-pulse {\n    0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.3; }\n    50% { transform: translate(-50%, -50%) scale(1.2); opacity: 0.5; }\n  }\n\n  @keyframes glow-breathe {\n    0%, 100% { opacity: 0.6; transform: scale(1); }\n    50% { opacity: 1; transform: scale(1.05); }\n  }\n\n  @keyframes glow-rotate {\n    0% { transform: rotate(0deg); }\n    100% { transform: rotate(360deg); }\n  }\n\n  @keyframes sparkle-move {\n    0% { opacity: 0; transform: scale(0.8); }\n    50% { opacity: 1; }\n    100% { opacity: 0; transform: scale(1.2); }\n  }\n";
+
+interface UseHybridAudioOptions {
+    src: string;
+    autoPlay?: boolean;
+    initialVolume?: number;
+    loop?: boolean;
+    crossOrigin?: 'anonymous' | 'use-credentials';
+    onPlay?: () => void;
+    onPause?: () => void;
+    onEnded?: () => void;
+    onTimeUpdate?: (time: number) => void;
+    onError?: (error: Error) => void;
+    onReady?: () => void;
+}
+interface HybridAudioState {
+    isReady: boolean;
+    isPlaying: boolean;
+    currentTime: number;
+    duration: number;
+    volume: number;
+    isMuted: boolean;
+    isLooping: boolean;
+    buffered: TimeRanges | null;
+    error: Error | null;
+}
+interface HybridAudioControls {
+    play: () => Promise<void>;
+    pause: () => void;
+    togglePlay: () => void;
+    seek: (time: number) => void;
+    seekTo: (progress: number) => void;
+    skip: (seconds: number) => void;
+    setVolume: (vol: number) => void;
+    toggleMute: () => void;
+    toggleLoop: () => void;
+    setLoop: (enabled: boolean) => void;
+    restart: () => void;
+}
+interface HybridWebAudioAPI {
+    context: AudioContext | null;
+    analyser: AnalyserNode | null;
+    sourceNode: MediaElementAudioSourceNode | null;
+}
+interface UseHybridAudioReturn {
+    audioRef: React.RefObject<HTMLAudioElement | null>;
+    state: HybridAudioState;
+    controls: HybridAudioControls;
+    webAudio: HybridWebAudioAPI;
+}
+declare function useHybridAudio(options: UseHybridAudioOptions): UseHybridAudioReturn;
+
+declare function useHybridAudioAnalysis(analyser: AnalyserNode | null, isPlaying: boolean): AudioLevels;
+
+type VisualizationVariant = 'glow' | 'orbs' | 'spotlight' | 'mesh' | 'none';
+type VisualizationIntensity = 'subtle' | 'medium' | 'strong';
+type VisualizationColorScheme = 'primary' | 'vibrant' | 'cool' | 'warm';
+interface VisualizationSettings {
+    /** Enable reactive cover animation */
+    enabled: boolean;
+    /** Visual effect variant */
+    variant: VisualizationVariant;
+    /** Effect intensity */
+    intensity: VisualizationIntensity;
+    /** Color scheme */
+    colorScheme: VisualizationColorScheme;
+    /** Playback volume (0-1) */
+    volume: number;
+    /** Loop playback */
+    isLooping: boolean;
+}
+interface UseVisualizationReturn {
+    /** Current settings */
+    settings: VisualizationSettings;
+    /** Toggle visualization on/off */
+    toggle: () => void;
+    /** Set specific setting */
+    setSetting: <K extends keyof VisualizationSettings>(key: K, value: VisualizationSettings[K]) => void;
+    /** Cycle to next variant */
+    nextVariant: () => void;
+    /** Cycle to next intensity */
+    nextIntensity: () => void;
+    /** Cycle to next color scheme */
+    nextColorScheme: () => void;
+    /** Reset to defaults */
+    reset: () => void;
+}
+type UseAudioVisualizationReturn = UseVisualizationReturn;
+interface VisualizationProviderProps {
+    children: ReactNode;
+}
+declare function VisualizationProvider({ children }: VisualizationProviderProps): react_jsx_runtime.JSX.Element;
+declare function useVisualization(): UseVisualizationReturn;
+declare const useAudioVisualization: typeof useVisualization;
+declare const VARIANT_INFO: Record<VisualizationVariant, {
+    label: string;
+    icon: string;
+}>;
+declare const INTENSITY_INFO: Record<VisualizationIntensity, {
+    label: string;
+}>;
+declare const COLOR_SCHEME_INFO: Record<VisualizationColorScheme, {
+    label: string;
+    preview: string;
+}>;
+
+interface HybridSimplePlayerProps {
+    /** Audio source URL */
+    src: string;
+    /** Track title */
+    title?: string;
+    /** Artist name */
+    artist?: string;
+    /** Cover art URL or ReactNode */
+    coverArt?: string | ReactNode;
+    /** Cover art size */
+    coverSize?: 'sm' | 'md' | 'lg';
+    /** Show frequency waveform */
+    showWaveform?: boolean;
+    /** Waveform visualization mode */
+    waveformMode?: 'frequency' | 'static';
+    /** Waveform height in pixels */
+    waveformHeight?: number;
+    /** Show timer */
+    showTimer?: boolean;
+    /** Show volume control */
+    showVolume?: boolean;
+    /** Show loop/repeat button */
+    showLoop?: boolean;
+    /** Enable audio-reactive cover effects */
+    reactiveCover?: boolean;
+    /** Reactive effect variant */
+    variant?: VisualizationVariant;
+    /** Reactive effect intensity */
+    intensity?: EffectIntensity;
+    /** Reactive effect color scheme */
+    colorScheme?: EffectColorScheme;
+    /** Auto-play on load */
+    autoPlay?: boolean;
+    /** Loop playback */
+    loop?: boolean;
+    /** Initial volume (0-1) */
+    initialVolume?: number;
+    /** Layout direction */
+    layout?: 'vertical' | 'horizontal';
+    /** Additional class name */
+    className?: string;
+    /** Callbacks */
+    onPlay?: () => void;
+    onPause?: () => void;
+    onEnded?: () => void;
+    onError?: (error: Error) => void;
+}
+declare function HybridSimplePlayer(props: HybridSimplePlayerProps): react_jsx_runtime.JSX.Element;
+
+interface HybridWaveformProps {
+    /** Visualization mode */
+    mode?: 'frequency' | 'static';
+    /** Canvas height in pixels */
+    height?: number;
+    /** Bar width in pixels */
+    barWidth?: number;
+    /** Gap between bars in pixels */
+    barGap?: number;
+    /** Bar border radius */
+    barRadius?: number;
+    /** Color for played portion */
+    progressColor?: string;
+    /** Color for unplayed portion */
+    waveColor?: string;
+    /** Color for buffered regions indicator */
+    bufferedColor?: string;
+    /** Additional CSS class */
+    className?: string;
+    /** Callback when user seeks */
+    onSeek?: (time: number) => void;
+}
+declare const HybridWaveform: React$1.NamedExoticComponent<HybridWaveformProps>;
+
+interface AudioReactiveCoverProps {
+    children: ReactNode;
+    size?: 'sm' | 'md' | 'lg';
+    variant?: EffectVariant;
+    intensity?: EffectIntensity;
+    colorScheme?: EffectColorScheme;
+    onClick?: () => void;
+    className?: string;
+}
+declare function AudioReactiveCover({ children, size, variant, intensity, colorScheme, onClick, className, }: AudioReactiveCoverProps): react_jsx_runtime.JSX.Element;
+
+interface GlowEffectData {
+    layers: ReturnType<typeof calculateGlowLayers>;
+    hueShift: number;
+    showPulseRings: boolean;
+    showSparkle: boolean;
+}
+interface GlowEffectProps {
+    data: GlowEffectData;
+    colors: string[];
+    isPlaying: boolean;
+}
+declare function GlowEffect({ data, colors, isPlaying }: GlowEffectProps): react_jsx_runtime.JSX.Element;
+
+interface OrbsEffectProps {
+    orbs: ReturnType<typeof calculateOrbs>;
+    blur: string;
+    isPlaying: boolean;
+}
+declare function OrbsEffect({ orbs, blur, isPlaying }: OrbsEffectProps): react_jsx_runtime.JSX.Element;
+
+interface SpotlightEffectProps {
+    data: ReturnType<typeof calculateSpotlight>;
+    colors: string[];
+    blur: string;
+    isPlaying: boolean;
+}
+declare function SpotlightEffect({ data, colors, blur, isPlaying }: SpotlightEffectProps): react_jsx_runtime.JSX.Element;
+
+interface MeshEffectProps {
+    gradients: ReturnType<typeof calculateMeshGradients>;
+    blur: string;
+    isPlaying: boolean;
+}
+declare function MeshEffect({ gradients, isPlaying }: MeshEffectProps): react_jsx_runtime.JSX.Element;
+
+interface HybridAudioContextValue {
+    state: HybridAudioState;
+    controls: HybridAudioControls;
+    webAudio: HybridWebAudioAPI;
+    audioLevels: AudioLevels;
+    audioRef: React.RefObject<HTMLAudioElement | null>;
+}
+interface HybridAudioProviderProps extends UseHybridAudioOptions {
+    children: ReactNode;
+}
+declare function HybridAudioProvider({ children, ...options }: HybridAudioProviderProps): react_jsx_runtime.JSX.Element;
+/**
+ * Access full hybrid audio context
+ */
+declare function useHybridAudioContext(): HybridAudioContextValue;
+/**
+ * Access audio state only (read-only)
+ */
+declare function useHybridAudioState(): HybridAudioState;
+/**
+ * Access audio controls only (no state re-renders)
+ */
+declare function useHybridAudioControls(): HybridAudioControls;
+/**
+ * Access audio levels for reactive effects
+ */
+declare function useHybridAudioLevels(): AudioLevels;
+/**
+ * Access Web Audio API for custom visualizations
+ */
+declare function useHybridWebAudio(): HybridWebAudioAPI;
+
+/**
+ * AudioPlayer types
+ */
+interface EqualizerOptions {
+    barCount?: number;
+    height?: number;
+    gap?: number;
+    showPeaks?: boolean;
+    barColor?: string;
+    peakColor?: string;
+}
+
+/**
+ * formatTime - Format seconds to mm:ss string
+ */
+declare function formatTime(seconds: number): string;
+
+/**
+ * ImageViewer type definitions
+ */
+interface ImageFile {
+    /** Display name for the image */
+    name: string;
+    /** File path used for change detection and caching */
+    path: string;
+    /** Optional MIME type */
+    mimeType?: string;
+}
+interface ImageViewerProps {
+    /** File info (name, path, mimeType) */
+    file: ImageFile;
+    /** Image content as string (data URL or base64) or ArrayBuffer */
+    content: string | ArrayBuffer;
+    /**
+     * Direct image URL for HTTP streaming.
+     * When provided, bypasses content→blob conversion and uses URL directly.
+     * Useful for large files loaded via HTTP Range requests.
+     */
+    src?: string;
+    /** Hide expand button when already in dialog */
+    inDialog?: boolean;
+}
+
+declare function ImageViewer({ file, content, src: directSrc, inDialog }: ImageViewerProps): react_jsx_runtime.JSX.Element;
+
+interface BlobUrlEntry {
+    url: string;
+    refCount: number;
+    createdAt: number;
+}
+interface ImageDimensions {
+    width: number;
+    height: number;
+}
+interface VideoMetadata {
+    duration: number;
+    width: number;
+    height: number;
+    codec?: string;
+}
+interface EffectConfig {
+    opacity: number;
+    scale: number;
+    blur: string;
+}
+/** Video player settings (persisted) */
+interface VideoPlayerSettings {
+    volume: number;
+    isLooping: boolean;
+}
+interface MediaCacheState {
+    blobUrls: Map<string, BlobUrlEntry>;
+    imageDimensions: Map<string, ImageDimensions>;
+    audioPlaybackPositions: Map<string, number>;
+    audioEffectConfigs: Map<string, EffectConfig>;
+    videoStreamUrls: Map<string, {
+        url: string;
+        timestamp: number;
+    }>;
+    videoPosterUrls: Map<string, string>;
+    videoPlaybackPositions: Map<string, number>;
+    videoMetadata: Map<string, VideoMetadata>;
+    videoPlayerSettings: VideoPlayerSettings;
+}
+interface MediaCacheActions {
+    getOrCreateBlobUrl: (key: string, content: ArrayBuffer, mimeType: string) => string;
+    releaseBlobUrl: (key: string) => void;
+    hasBlobUrl: (key: string) => boolean;
+    cacheDimensions: (src: string, dims: ImageDimensions) => void;
+    getDimensions: (src: string) => ImageDimensions | null;
+    saveAudioPosition: (uri: string, time: number) => void;
+    getAudioPosition: (uri: string) => number | null;
+    getEffectConfig: (key: string) => EffectConfig | null;
+    cacheEffectConfig: (key: string, config: EffectConfig) => void;
+    getOrCreateStreamUrl: (sessionId: string, path: string, generator: (sessionId: string, path: string) => string) => string;
+    getPosterUrl: (title: string) => string | null;
+    cachePosterUrl: (title: string, url: string) => void;
+    saveVideoPosition: (key: string, time: number) => void;
+    getVideoPosition: (key: string) => number | null;
+    cacheVideoMetadata: (url: string, meta: VideoMetadata) => void;
+    getVideoMetadata: (url: string) => VideoMetadata | null;
+    invalidateSession: (sessionId: string) => void;
+    getVideoPlayerSettings: () => VideoPlayerSettings;
+    saveVideoPlayerSettings: (settings: Partial<VideoPlayerSettings>) => void;
+    clearCache: () => void;
+    getCacheStats: () => {
+        blobUrls: number;
+        dimensions: number;
+        audioPositions: number;
+        videoPositions: number;
+    };
+}
+type MediaCacheStore = MediaCacheState & MediaCacheActions;
+declare const useMediaCacheStore: zustand.UseBoundStore<Omit<Omit<zustand.StoreApi<MediaCacheStore>, "setState" | "devtools"> & {
+    setState(partial: MediaCacheStore | Partial<MediaCacheStore> | ((state: MediaCacheStore) => MediaCacheStore | Partial<MediaCacheStore>), replace?: false, action?: string | {
+        [x: string]: unknown;
+        [x: number]: unknown;
+        [x: symbol]: unknown;
+        type: string;
+    }): void;
+    setState(state: MediaCacheStore | ((state: MediaCacheStore) => MediaCacheStore), replace: true, action?: string | {
+        [x: string]: unknown;
+        [x: number]: unknown;
+        [x: symbol]: unknown;
+        type: string;
+    }): void;
+    devtools: {
+        cleanup: () => void;
+    };
+}, "setState" | "persist"> & {
+    setState(partial: MediaCacheStore | Partial<MediaCacheStore> | ((state: MediaCacheStore) => MediaCacheStore | Partial<MediaCacheStore>), replace?: false, action?: string | {
+        [x: string]: unknown;
+        [x: number]: unknown;
+        [x: symbol]: unknown;
+        type: string;
+    }): unknown;
+    setState(state: MediaCacheStore | ((state: MediaCacheStore) => MediaCacheStore), replace: true, action?: string | {
+        [x: string]: unknown;
+        [x: number]: unknown;
+        [x: symbol]: unknown;
+        type: string;
+    }): unknown;
+    persist: {
+        setOptions: (options: Partial<zustand_middleware.PersistOptions<MediaCacheStore, {
+            audioPlaybackPositions: [string, number][];
+            videoPlaybackPositions: [string, number][];
+            videoPosterUrls: [string, string][];
+            videoPlayerSettings: VideoPlayerSettings;
+        }, unknown>>) => void;
+        clearStorage: () => void;
+        rehydrate: () => Promise<void> | void;
+        hasHydrated: () => boolean;
+        onHydrate: (fn: (state: MediaCacheStore) => void) => () => void;
+        onFinishHydration: (fn: (state: MediaCacheStore) => void) => () => void;
+        getOptions: () => Partial<zustand_middleware.PersistOptions<MediaCacheStore, {
+            audioPlaybackPositions: [string, number][];
+            videoPlaybackPositions: [string, number][];
+            videoPosterUrls: [string, string][];
+            videoPlayerSettings: VideoPlayerSettings;
+        }, unknown>>;
+    };
+}>;
+/**
+ * Hook for image-related cache operations
+ * Uses useShallow to prevent infinite re-renders
+ */
+declare const useImageCache: () => {
+    getOrCreateBlobUrl: (key: string, content: ArrayBuffer, mimeType: string) => string;
+    releaseBlobUrl: (key: string) => void;
+    hasBlobUrl: (key: string) => boolean;
+    cacheDimensions: (src: string, dims: ImageDimensions) => void;
+    getDimensions: (src: string) => ImageDimensions | null;
+};
+/**
+ * Hook for audio-related cache operations
+ * Uses useShallow to prevent infinite re-renders
+ */
+declare const useAudioCache: () => {
+    getOrCreateBlobUrl: (key: string, content: ArrayBuffer, mimeType: string) => string;
+    releaseBlobUrl: (key: string) => void;
+    hasBlobUrl: (key: string) => boolean;
+    saveAudioPosition: (uri: string, time: number) => void;
+    getAudioPosition: (uri: string) => number | null;
+    getEffectConfig: (key: string) => EffectConfig | null;
+    cacheEffectConfig: (key: string, config: EffectConfig) => void;
+};
+/**
+ * Hook for video-related cache operations
+ * Uses useShallow to prevent infinite re-renders
+ */
+declare const useVideoCache: () => {
+    getOrCreateBlobUrl: (key: string, content: ArrayBuffer, mimeType: string) => string;
+    releaseBlobUrl: (key: string) => void;
+    hasBlobUrl: (key: string) => boolean;
+    getOrCreateStreamUrl: (sessionId: string, path: string, generator: (sessionId: string, path: string) => string) => string;
+    getPosterUrl: (title: string) => string | null;
+    cachePosterUrl: (title: string, url: string) => void;
+    saveVideoPosition: (key: string, time: number) => void;
+    getVideoPosition: (key: string) => number | null;
+    cacheVideoMetadata: (url: string, meta: VideoMetadata) => void;
+    getVideoMetadata: (url: string) => VideoMetadata | null;
+    invalidateSession: (sessionId: string) => void;
+    getVideoPlayerSettings: () => VideoPlayerSettings;
+    saveVideoPlayerSettings: (settings: Partial<VideoPlayerSettings>) => void;
+};
+/**
+ * Hook for video player settings only
+ * Returns current settings and save function
+ */
+declare const useVideoPlayerSettings: () => {
+    settings: VideoPlayerSettings;
+    saveSettings: (settings: Partial<VideoPlayerSettings>) => void;
+};
+/**
+ * Hook for blob URL cleanup on unmount
+ */
+declare function useBlobUrlCleanup(key: string | null): void;
+/**
+ * Generate a cache key from ArrayBuffer content
+ * Uses first and last 1KB + length for fast hashing
+ */
+declare function generateContentKey(content: ArrayBuffer): string;
+
+interface MarkdownMessageProps {
+    /** Markdown content to render */
+    content: string;
+    /** Additional CSS classes */
+    className?: string;
+    /** Whether the message is from the user (affects styling) */
+    isUser?: boolean;
+    /** Use compact size (text-xs instead of text-sm) */
+    isCompact?: boolean;
+}
+/**
+ * MarkdownMessage - Renders markdown content with syntax highlighting and GFM support
+ *
+ * Features:
+ * - GitHub Flavored Markdown (GFM) support
+ * - Syntax highlighted code blocks with copy button
+ * - Mermaid diagram rendering
+ * - Tables, lists, blockquotes
+ * - User/assistant styling modes
+ *
+ * @example
+ * ```tsx
+ * <MarkdownMessage content="# Hello\n\nThis is **bold** text." />
+ *
+ * // User message styling
+ * <MarkdownMessage content="Some content" isUser />
+ * ```
+ */
+declare const MarkdownMessage: React__default.FC<MarkdownMessageProps>;
+
+export { ArrayFieldItemTemplate, ArrayFieldTemplate, type AspectRatioValue, type AudioLevels, AudioReactiveCover, type AudioReactiveCoverProps, BaseInputTemplate, type BlobSource, COLOR_SCHEMES, COLOR_SCHEME_INFO, CheckboxWidget, ColorWidget, type CreateVideoErrorFallbackOptions, type DASHSource, type DataUrlSource, EFFECT_ANIMATIONS, type EffectColorScheme, type EffectColors, type EffectConfig$1 as EffectConfig, type EffectIntensity, type EffectLayer, type EffectVariant, type EqualizerOptions, type ErrorFallbackProps, ErrorListTemplate, FieldTemplate, GlowEffect, type GlowEffectData, type HLSSource, type HybridAudioContextValue, type HybridAudioControls, HybridAudioPlayer, type HybridAudioPlayerProps, HybridAudioProvider, type HybridAudioProviderProps, type HybridAudioState, HybridSimplePlayer, type HybridSimplePlayerProps, HybridWaveform, type HybridWaveformProps, type HybridWebAudioAPI, INTENSITY_CONFIG, INTENSITY_INFO, type ImageFile, ImageViewer, type ImageViewerProps, JsonSchemaForm, type JsonSchemaFormProps, JsonTreeComponent as JsonTree, type JsonTreeConfig, type LottieDirection, LottiePlayer, type LottiePlayerProps, type LottieSize, type LottieSpeed, MarkdownMessage, type MarkdownMessageProps, Mermaid, MeshEffect, NativeProvider, NumberWidget, ObjectFieldTemplate, Playground as OpenapiViewer, OrbsEffect, type PlayerMode, type PlaygroundConfig, type PlaygroundProps, PrettyCode, type ResolveFileSourceOptions, type SchemaSource, SelectWidget, type SimpleStreamSource, SliderWidget, SpotlightEffect, StreamProvider, type StreamSource, SwitchWidget, TextWidget, type UrlSource, type UseAudioVisualizationReturn, type UseHybridAudioOptions, type UseHybridAudioReturn, type UseLottieOptions, type UseLottieReturn, type UseVisualizationReturn, VARIANT_INFO, VideoControls, VideoErrorFallback, type VideoErrorFallbackProps, VideoPlayer, type VideoPlayerContextValue, type VideoPlayerProps, VideoPlayerProvider, type VideoPlayerProviderProps, type VideoPlayerRef, type VideoSourceUnion, VidstackProvider, type VimeoSource, type VisualizationColorScheme, type VisualizationIntensity, VisualizationProvider, type VisualizationProviderProps, type VisualizationSettings, type VisualizationVariant, type YouTubeSource, calculateGlowLayers, calculateMeshGradients, calculateOrbs, calculateSpotlight, createVideoErrorFallback, formatTime, generateContentKey, getColors, getEffectConfig, getRequiredFields, hasRequiredFields, isSimpleStreamSource, mergeDefaults, normalizeFormData, prepareEffectColors, resolveFileSource, resolvePlayerMode, resolveStreamSource, safeJsonParse, safeJsonStringify, useAudioCache, useAudioVisualization, useBlobUrlCleanup, useHybridAudio, useHybridAudioAnalysis, useHybridAudioContext, useHybridAudioControls, useHybridAudioLevels, useHybridAudioState, useHybridWebAudio, useImageCache, useLottie, useMediaCacheStore, useVideoCache, useVideoPlayerContext, useVideoPlayerSettings, useVisualization, validateRequiredFields, validateSchema };