ugcinc-render 1.8.0 → 1.8.2

package/dist/index-C5NlUiZT.d.mts

@@ -0,0 +1,1065 @@
+/**
+ * Base types used throughout the rendering system
+ */
+/**
+ * Time value - can be absolute (milliseconds) or relative (0-1 percentage)
+ *
+ * @example
+ * // Absolute: 500 milliseconds
+ * { type: 'absolute', value: 500 }
+ *
+ * @example
+ * // Relative: 50% of total duration
+ * { type: 'relative', value: 0.5 }
+ */
+interface TimeValue {
+    type: 'absolute' | 'relative';
+    value: number;
+}
+/**
+ * Border radius configuration for individual corners.
+ * All values in pixels, default 0 (no rounding).
+ */
+interface BorderRadiusConfig {
+    /** Top-left corner radius in pixels */
+    topLeft?: number;
+    /** Top-right corner radius in pixels */
+    topRight?: number;
+    /** Bottom-right corner radius in pixels */
+    bottomRight?: number;
+    /** Bottom-left corner radius in pixels */
+    bottomLeft?: number;
+}
+/**
+ * Fit mode for media (images/videos)
+ * - cover: Fill the area, cropping if necessary
+ * - contain: Fit within the area, letterboxing if necessary
+ * - fill: Stretch to fill the area exactly
+ */
+type FitMode = 'cover' | 'contain' | 'fill';
+/**
+ * Segment type identifiers
+ */
+type SegmentType = 'video' | 'image' | 'text' | 'audio' | 'editor';
+/**
+ * Font type identifiers
+ */
+type FontType = 'arial' | 'tiktok' | 'apple';
+/**
+ * Font weight options
+ */
+type FontWeight = 'normal' | 'bold';
+/**
+ * Text alignment options
+ */
+type TextAlignment = 'left' | 'center' | 'right' | 'justify';
+/**
+ * Vertical alignment options
+ */
+type VerticalAlignment = 'top' | 'middle' | 'bottom';
+/**
+ * Text direction
+ */
+type TextDirection = 'ltr' | 'rtl';
+/**
+ * Text wrapping mode
+ */
+type TextWrap = 'word' | 'char' | 'none';
+/**
+ * Word break behavior
+ */
+type WordBreak = 'normal' | 'break-all' | 'break-word';
+/**
+ * Hyphenation mode
+ */
+type Hyphenation = 'none' | 'auto';
+/**
+ * Text overflow behavior
+ */
+type TextOverflow = 'clip' | 'ellipsis';
+/**
+ * Shared text styling properties used by both render and UI text segments.
+ * This ensures feature parity between image editor and video editor text elements.
+ */
+interface TextStyleProperties {
+    /** Horizontal alignment (default: 'left') */
+    alignment?: TextAlignment;
+    /** Vertical alignment within bounds (default: 'top') */
+    verticalAlign?: VerticalAlignment;
+    /** Text direction (default: 'ltr') */
+    direction?: TextDirection;
+    /** Inner padding in pixels - uniform for all sides (default: 0) */
+    padding?: number;
+    /** Top padding in pixels */
+    paddingTop?: number;
+    /** Right padding in pixels */
+    paddingRight?: number;
+    /** Bottom padding in pixels */
+    paddingBottom?: number;
+    /** Left padding in pixels */
+    paddingLeft?: number;
+    /** Extra top padding added when text has 2+ lines */
+    multiLineExtraPaddingTop?: number;
+    /** Extra right padding added when text has 2+ lines */
+    multiLineExtraPaddingRight?: number;
+    /** Extra bottom padding added when text has 2+ lines */
+    multiLineExtraPaddingBottom?: number;
+    /** Extra left padding added when text has 2+ lines */
+    multiLineExtraPaddingLeft?: number;
+    /** Font family (default: 'arial') */
+    fontType?: FontType;
+    /** Font size in pixels (default: 40) */
+    fontSize?: number;
+    /** Font weight (default: 'normal') */
+    fontWeight?: FontWeight;
+    /** Line height multiplier (default: 1.2) */
+    lineHeight?: number;
+    /** Letter spacing in pixels (default: 0) */
+    letterSpacing?: number;
+    /** How text wraps to new lines (default: 'word') */
+    textWrap?: TextWrap;
+    /** How words break across lines (default: 'normal') */
+    wordBreak?: WordBreak;
+    /** Automatic hyphenation (default: 'none') */
+    hyphenation?: Hyphenation;
+    /** Maximum lines (0 = unlimited) (default: 0) */
+    maxLines?: number;
+    /** How overflow is handled (default: 'clip') */
+    textOverflow?: TextOverflow;
+    /** Ellipsis string for overflow (default: '...') */
+    ellipsis?: string;
+    /** Text color (default: '#000000') */
+    color?: string;
+    /** Background color in hex format #RRGGBB (default: transparent) */
+    backgroundColor?: string;
+    /** Background opacity 0-100 (default: 100) */
+    backgroundOpacity?: number;
+    /** Border radius for background box - individual corners (default: 0) */
+    backgroundBorderRadius?: BorderRadiusConfig;
+    /** Text outline color (default: none) */
+    strokeColor?: string;
+    /** Outline width in pixels (default: 0) */
+    strokeWidth?: number;
+    /** When true, box shrinks to fit content (width becomes max width) */
+    autoWidth?: boolean;
+    /** Which side the box anchors to when autoWidth is true (default: 'left') */
+    boxAlign?: 'left' | 'center' | 'right';
+}
+
+/**
+ * Position and anchor types for relative element positioning
+ */
+/**
+ * Vertical anchor for Y positioning (parent element)
+ * Specifies which vertical edge of the reference element to anchor to
+ */
+type VerticalAnchor = 'top' | 'bottom';
+/**
+ * Horizontal anchor for X positioning (parent element)
+ * Specifies which horizontal edge of the reference element to anchor to
+ */
+type HorizontalAnchor = 'left' | 'right';
+/**
+ * Self anchor for X positioning
+ * Specifies which horizontal edge of THIS element to use for positioning
+ */
+type HorizontalSelfAnchor = 'left' | 'center' | 'right';
+/**
+ * Self anchor for Y positioning
+ * Specifies which vertical edge of THIS element to use for positioning
+ */
+type VerticalSelfAnchor = 'top' | 'middle' | 'bottom';
+/**
+ * Relative X position configuration
+ * When set, the segment's X position is calculated relative to another segment
+ *
+ * @example
+ * // Position this segment to the right of another segment with 10px gap
+ * { elementId: 'other-element', anchor: 'right', selfAnchor: 'left', offset: 10 }
+ */
+interface RelativePositionConfigX {
+    /** ID of the segment to position relative to */
+    elementId: string;
+    /** Which horizontal edge of the reference segment to anchor to */
+    anchor: HorizontalAnchor;
+    /** Which horizontal edge of THIS segment to use (default: opposite of anchor) */
+    selfAnchor?: HorizontalSelfAnchor;
+    /** Offset in pixels from the anchor point */
+    offset: number;
+}
+/**
+ * Relative Y position configuration
+ * When set, the segment's Y position is calculated relative to another segment
+ *
+ * @example
+ * // Position this segment below another segment with a 10px gap
+ * { elementId: 'message-1', anchor: 'bottom', selfAnchor: 'top', offset: 10 }
+ */
+interface RelativePositionConfigY {
+    /** ID of the segment to position relative to */
+    elementId: string;
+    /** Which vertical edge of the reference segment to anchor to */
+    anchor: VerticalAnchor;
+    /** Which vertical edge of THIS segment to use (default: opposite of anchor) */
+    selfAnchor?: VerticalSelfAnchor;
+    /** Offset in pixels from the anchor point */
+    offset: number;
+}
+
+/**
+ * Dynamic cropping configuration types
+ *
+ * Dynamic cropping allows the output dimensions to be calculated
+ * based on element positions at render time.
+ */
+/**
+ * Crop boundary - can be static (element ID) or dynamic (input reference)
+ */
+interface CropBoundary {
+    /** Static: reference a specific element by ID */
+    elementId?: string;
+    /** Variable: get element ID from input (creates an input port) */
+    inputRef?: string;
+}
+/**
+ * Configuration for cropping along one axis (vertical = height, horizontal = width)
+ */
+interface CropAxisConfig {
+    /** Whether cropping is enabled for this axis */
+    enabled: boolean;
+    /**
+     * Crop mode:
+     * - 'all-elements': Crop to bounding box of all visible elements
+     * - 'between-elements': Crop between specific boundary elements
+     */
+    mode: 'all-elements' | 'between-elements';
+    /** Top/left element boundary (between-elements mode only) */
+    startBoundary?: CropBoundary;
+    /** Bottom/right element boundary (between-elements mode only) */
+    endBoundary?: CropBoundary;
+    /** Padding before (top/left) in pixels */
+    paddingStart?: number;
+    /** Padding after (bottom/right) in pixels */
+    paddingEnd?: number;
+    /** Minimum dimension (prevents cropping too small) */
+    minSize?: number;
+}
+/**
+ * Dynamic crop configuration for image/video editor
+ */
+interface DynamicCropConfig {
+    /** Crop height based on elements */
+    vertical?: CropAxisConfig;
+    /** Crop width based on elements */
+    horizontal?: CropAxisConfig;
+}
+/**
+ * Result of crop bounds calculation
+ */
+interface CropBounds {
+    /** Left edge of crop area */
+    x: number;
+    /** Top edge of crop area */
+    y: number;
+    /** Width of cropped output */
+    width: number;
+    /** Height of cropped output */
+    height: number;
+}
+
+/**
+ * Raw element types for editor input
+ *
+ * These types represent the raw configuration that users define in the editor.
+ * They include relative positioning which gets resolved to absolute positions
+ * before rendering.
+ */
+
+/**
+ * Dimension preset keys for image editor
+ */
+type DimensionPresetKey = 'tiktok' | 'instagram-square' | 'instagram-post' | 'youtube' | 'twitter' | 'custom';
+/**
+ * Dimension preset configuration
+ */
+interface DimensionPreset {
+    width: number;
+    height: number;
+    label: string;
+    ratio: string;
+}
+/**
+ * Standard dimension presets
+ */
+declare const DIMENSION_PRESETS: Record<Exclude<DimensionPresetKey, 'custom'>, DimensionPreset>;
+/**
+ * Image editor element - a raw image or text layer in the editor
+ *
+ * This is the input format that includes relative positioning.
+ * It gets resolved to absolute positions before being converted to segments.
+ */
+interface ImageEditorElement {
+    /** Unique element identifier */
+    id: string;
+    /** Element type */
+    type: 'image' | 'text';
+    /** X position in pixels (may be overridden by relativePositionX) */
+    x: number;
+    /** Y position in pixels (may be overridden by relativePositionY) */
+    y: number;
+    /** Width in pixels */
+    width: number;
+    /** Height in pixels */
+    height: number;
+    /** Z-index for layering */
+    zIndex: number;
+    /** Rotation in degrees clockwise */
+    rotation?: number;
+    /** Whether the element is locked from editing */
+    locked?: boolean;
+    /** Relative X positioning config - when set, x is calculated from the reference element */
+    relativePositionX?: RelativePositionConfigX;
+    /** Relative Y positioning config - when set, y is calculated from the reference element */
+    relativePositionY?: RelativePositionConfigY;
+    /** Text content */
+    text?: string;
+    /** Maps to text input port for variable text (e.g., "text_1") */
+    textInputId?: string;
+    /** Text color (hex) */
+    color?: string;
+    /** Outline width in pixels (0 = no outline) */
+    outlineWidth?: number;
+    /** Outline color */
+    strokeColor?: string;
+    /** Font family */
+    font?: FontType;
+    /** Font size in pixels */
+    fontSize?: number;
+    /** Font weight */
+    fontWeight?: FontWeight;
+    /** Line height multiplier */
+    lineHeight?: number;
+    /** Letter spacing in pixels */
+    letterSpacing?: number;
+    /** Horizontal text alignment */
+    textAlign?: TextAlignment;
+    /** Vertical text alignment within bounds */
+    verticalAlign?: VerticalAlignment;
+    /** Background color for text box (hex) */
+    backgroundColor?: string;
+    /** Background opacity 0-100 */
+    backgroundOpacity?: number;
+    /** Corner radius for background box */
+    backgroundBorderRadius?: BorderRadiusConfig;
+    paddingTop?: number;
+    paddingRight?: number;
+    paddingBottom?: number;
+    paddingLeft?: number;
+    multiLineExtraPaddingTop?: number;
+    multiLineExtraPaddingRight?: number;
+    multiLineExtraPaddingBottom?: number;
+    multiLineExtraPaddingLeft?: number;
+    /** When true, box shrinks to fit content (width becomes max width) */
+    autoWidth?: boolean;
+    /** Which side the box anchors to when autoWidth is true */
+    boxAlign?: 'left' | 'center' | 'right';
+    /** Maps to input port (e.g., "image_1", "image_2") */
+    inputId?: string;
+    /** How the image fits its container */
+    fit?: FitMode;
+    /** Opacity percentage 0-100 */
+    opacity?: number;
+    /** Corner radius - single number for all corners, or object for individual */
+    borderRadius?: number | BorderRadiusConfig;
+}
+/**
+ * Image editor node configuration
+ *
+ * This is the complete configuration for an image editor node,
+ * including canvas dimensions, elements, and crop settings.
+ */
+interface ImageEditorNodeConfig {
+    /** Canvas width in pixels */
+    width: number;
+    /** Canvas height in pixels */
+    height: number;
+    /** Aspect ratio string (e.g., "9:16") */
+    aspectRatio: string;
+    /** Dimension preset key */
+    dimensionPreset: DimensionPresetKey;
+    /** Elements to render */
+    elements: ImageEditorElement[];
+    /** Background type: 'image' for image input, 'color' for solid color */
+    backgroundType?: 'image' | 'color';
+    /** Background color (hex) when backgroundType is 'color' */
+    backgroundColor?: string;
+    /** How the background image fits the canvas */
+    backgroundFit?: FitMode;
+    /** Cached background image URL for consistent preview */
+    previewBackgroundUrl?: string;
+    /** Cached image URLs for image elements (keyed by inputId) */
+    previewImageUrls?: Record<string, string>;
+    /** Cached text values for text elements (keyed by textInputId) */
+    previewTextValues?: Record<string, string>;
+    /** Dynamic cropping configuration */
+    dynamicCrop?: DynamicCropConfig;
+}
+
+/**
+ * Video editor types for the WEBAPP UI
+ *
+ * These types include UI-only fields (marked with comments).
+ * The renderer uses types from editor.ts and segment.ts instead.
+ *
+ * UI-only fields are stripped before sending to renderer:
+ * - timeMode: UI helper for displaying timing mode
+ * - inputRef/textInputRef: Resolved to source/text before rendering
+ * - dimensionPreset: Renderer uses width/height directly
+ * - previewUrls/previewTextValues: Only for UI preview
+ */
+
+/**
+ * UI helper for timing mode - not sent to renderer
+ */
+type TimeMode = 'fixed' | 'flexible';
+/**
+ * Base properties for all video editor segments (UI)
+ */
+interface VideoEditorBaseSegment {
+    /** Unique segment identifier */
+    id: string;
+    /** Order in the channel (0-based) */
+    order: number;
+    /** Time offset from previous segment or absolute position */
+    offset: TimeValue;
+    /** Segment duration - required for sequential playback */
+    duration?: TimeValue;
+    /** Trim from start in milliseconds */
+    startTrim?: number;
+    /** Trim from end in milliseconds */
+    endTrim?: number;
+    /** UI-only: reference to input for dynamic start trim value - resolved to startTrim before rendering */
+    startTrimInputRef?: string;
+    /** UI-only: reference to input for dynamic end trim value - resolved to endTrim before rendering */
+    endTrimInputRef?: string;
+    /** UI-only: helper for timing mode display - stripped before rendering */
+    timeMode?: TimeMode;
+    /** Parent segment ID for overlays */
+    parentId?: string;
+    /** Relative start (0-1) within parent for overlays */
+    relativeStart?: number;
+    /** Relative end (0-1) within parent for overlays */
+    relativeEnd?: number;
+    /** Fade-in duration in milliseconds */
+    fadeIn?: number;
+}
+/**
+ * Base properties for visual segments
+ */
+interface VideoEditorVisualSegment extends VideoEditorBaseSegment {
+    xOffset: number;
+    yOffset: number;
+    width: number;
+    height: number;
+    zIndex?: number;
+    scale?: number;
+    rotation?: number;
+    opacity?: number;
+}
+/**
+ * Video segment (UI)
+ */
+interface VideoEditorVideoSegment extends VideoEditorVisualSegment {
+    type: 'video';
+    /** UI-only: reference to input node - resolved to source before rendering */
+    inputRef?: string;
+    /** Actual source URL (set after inputRef is resolved) */
+    source?: string;
+    fit?: FitMode;
+    speed?: number;
+    volume?: number;
+    borderRadius?: number | BorderRadiusConfig;
+}
+/**
+ * Audio segment (UI)
+ */
+interface VideoEditorAudioSegment extends VideoEditorBaseSegment {
+    type: 'audio';
+    /** UI-only: reference to input node - resolved to source before rendering */
+    inputRef?: string;
+    /** Actual source URL (set after inputRef is resolved) */
+    source?: string;
+    volume?: number;
+}
+/**
+ * Image segment (UI)
+ */
+interface VideoEditorImageSegment extends VideoEditorVisualSegment {
+    type: 'image';
+    /** UI-only: reference to input node - resolved to source before rendering */
+    inputRef?: string;
+    /** Actual source URL (set after inputRef is resolved) */
+    source?: string;
+    fit?: FitMode;
+    loop?: boolean;
+    borderRadius?: number | BorderRadiusConfig;
+}
+/**
+ * Text segment (UI)
+ *
+ * Extends TextStyleProperties which contains all shared text styling options.
+ * This ensures feature parity between image editor and video editor text elements.
+ */
+interface VideoEditorTextSegment extends VideoEditorVisualSegment, TextStyleProperties {
+    type: 'text';
+    /** UI-only: reference to text input - resolved to text before rendering */
+    textInputRef?: string;
+    /** Actual text content (set after textInputRef is resolved) */
+    text?: string;
+}
+/**
+ * Union of all video editor segment types
+ */
+type VideoEditorSegment = VideoEditorVideoSegment | VideoEditorAudioSegment | VideoEditorImageSegment | VideoEditorTextSegment;
+/**
+ * Video editor channel
+ */
+interface VideoEditorChannel {
+    id: string;
+    name: string;
+    segments: VideoEditorSegment[];
+}
+/**
+ * Video editor node configuration for WEBAPP UI
+ *
+ * Duration is NOT stored - it's calculated from segment durations.
+ * dimensionPreset, previewUrls, previewTextValues are UI-only.
+ */
+interface VideoEditorNodeConfig {
+    /** Canvas width in pixels */
+    width: number;
+    /** Canvas height in pixels */
+    height: number;
+    /** Frames per second */
+    fps: number;
+    /** UI-only: dimension preset selector */
+    dimensionPreset: DimensionPresetKey;
+    /** Channels containing segments */
+    channels: VideoEditorChannel[];
+    /** UI-only: preview URLs for displaying in editor */
+    previewUrls?: Record<string, string>;
+    /** UI-only: preview text values for displaying in editor */
+    previewTextValues?: Record<string, string>;
+}
+/**
+ * Segment position on timeline (calculated from segment timing properties)
+ */
+interface SegmentTimelinePosition {
+    /** Start time in milliseconds */
+    startMs: number;
+    /** Duration in milliseconds */
+    durationMs: number;
+}
+
+/**
+ * Caption types for auto-captioning functionality
+ *
+ * These types are used by both the CaptionOverlay component (client + server)
+ * and the AutoCaptionComposition for rendering captioned videos.
+ */
+/**
+ * Caption word with timing information from transcription
+ */
+interface CaptionWord {
+    /** The word text */
+    word: string;
+    /** Start time in milliseconds */
+    startMs: number;
+    /** End time in milliseconds */
+    endMs: number;
+}
+/**
+ * Caption page - a group of words displayed together
+ */
+interface CaptionPage {
+    /** Words in this page */
+    words: CaptionWord[];
+    /** Start time of first word in ms */
+    startMs: number;
+    /** End time of last word in ms */
+    endMs: number;
+}
+/**
+ * Caption style preset names
+ */
+type CaptionPreset = 'hormozi' | 'minimal' | 'bold-pop' | 'clean' | 'neon';
+/**
+ * Caption vertical position on screen
+ */
+type CaptionPosition = 'top' | 'center' | 'bottom';
+/**
+ * Caption font weight options
+ */
+type CaptionFontWeight = 'normal' | 'bold' | 'black';
+/**
+ * Full caption style configuration
+ */
+interface CaptionStyle {
+    /** Preset name (if used, provides defaults for other fields) */
+    preset?: CaptionPreset;
+    /** Google Font name (e.g., 'Montserrat', 'Inter') */
+    fontName: string;
+    /** Font size in pixels (relative to 1920p height) */
+    fontSize: number;
+    /** Font weight */
+    fontWeight: CaptionFontWeight;
+    /** Text color for inactive words */
+    fontColor: string;
+    /** Text color for the currently active/highlighted word */
+    highlightColor: string;
+    /** Stroke/outline color */
+    strokeColor: string;
+    /** Stroke width in pixels */
+    strokeWidth: number;
+    /** Background color (hex) - omit for transparent */
+    backgroundColor?: string;
+    /** Background opacity (0-1) */
+    backgroundOpacity?: number;
+    /** Background border radius in pixels */
+    backgroundBorderRadius?: number;
+    /** Vertical position on screen */
+    position: CaptionPosition;
+    /** Vertical offset in pixels from position edge */
+    yOffset: number;
+    /** Max width as percentage of video width (0-100) */
+    maxWidth: number;
+    /** Enable bounce/scale animation on active word */
+    enableAnimation: boolean;
+    /** Maximum words per caption page/screen */
+    wordsPerPage: number;
+}
+/**
+ * Props for AutoCaptionComposition
+ */
+interface AutoCaptionCompositionProps {
+    /** Video source URL */
+    videoUrl: string;
+    /** Video width in pixels */
+    width: number;
+    /** Video height in pixels */
+    height: number;
+    /** Video duration in milliseconds */
+    durationMs: number;
+    /** Caption words with timing */
+    captions: CaptionWord[];
+    /** Caption styling configuration */
+    style: CaptionStyle;
+}
+/**
+ * Props for CaptionOverlay component
+ */
+interface CaptionOverlayProps {
+    /** Caption words with timing */
+    captions: CaptionWord[];
+    /** Caption styling configuration */
+    style: CaptionStyle;
+    /** Override current time for preview mode (ms) */
+    previewTimeMs?: number;
+}
+
+/**
+ * Font utilities for the rendering system
+ */
+
+/**
+ * Apple Color Emoji font name - used as fallback for emoji characters
+ */
+declare const APPLE_EMOJI_FONT = "\"Apple Color Emoji\"";
+/**
+ * Font family CSS strings for each font type
+ * These match the fonts registered in the rendering system
+ * Apple Color Emoji is added as a fallback for consistent emoji rendering
+ */
+declare const FONT_FAMILIES: Record<FontType, string>;
+/**
+ * Get the CSS font family string for a font type
+ */
+declare function getFontFamily(fontType: FontType): string;
+/**
+ * Build a CSS font string
+ */
+declare function buildFontString({ fontType, fontSize, fontWeight, }: {
+    fontType: FontType;
+    fontSize: number;
+    fontWeight: 'normal' | 'bold';
+}): string;
+/**
+ * Font URLs for loading web fonts
+ * These are the public URLs to the font files
+ */
+declare const FONT_URLS: {
+    tiktok: {
+        regular: string;
+        bold: string;
+    };
+    apple: {
+        regular: string;
+    };
+    emoji: {
+        apple: string;
+    };
+};
+/**
+ * Preload fonts for rendering
+ * Call this in your Root component or composition
+ */
+declare function preloadFonts(): Promise<void>;
+/**
+ * Check if fonts are loaded
+ */
+declare function areFontsLoaded(): boolean;
+/**
+ * Debug utility to log current font status
+ */
+declare function debugFontStatus(): void;
+
+/**
+ * Fit calculation utilities for media positioning
+ */
+
+/**
+ * Result of fit dimension calculation
+ */
+interface FitDimensions {
+    /** X offset within target area */
+    x: number;
+    /** Y offset within target area */
+    y: number;
+    /** Rendered width */
+    width: number;
+    /** Rendered height */
+    height: number;
+    /** Source X offset (for cropping) */
+    sourceX: number;
+    /** Source Y offset (for cropping) */
+    sourceY: number;
+    /** Source width to use */
+    sourceWidth: number;
+    /** Source height to use */
+    sourceHeight: number;
+}
+/**
+ * Calculate dimensions for fit modes (cover, contain, fill)
+ */
+declare function calculateFitDimensions({ sourceWidth, sourceHeight, targetWidth, targetHeight, fit, }: {
+    sourceWidth: number;
+    sourceHeight: number;
+    targetWidth: number;
+    targetHeight: number;
+    fit: FitMode;
+}): FitDimensions;
+
+/**
+ * Default values for segment properties
+ *
+ * These defaults match the server-side rendering defaults exactly
+ * to ensure consistent behavior between client preview and server render.
+ */
+
+/**
+ * Default values for text segments
+ */
+declare const TEXT_DEFAULTS: {
+    fontType: FontType;
+    fontSize: number;
+    fontWeight: FontWeight;
+    color: string;
+    alignment: TextAlignment;
+    verticalAlign: VerticalAlignment;
+    direction: TextDirection;
+    lineHeight: number;
+    letterSpacing: number;
+    padding: number;
+    textWrap: TextWrap;
+    wordBreak: WordBreak;
+    hyphenation: Hyphenation;
+    maxLines: number;
+    textOverflow: TextOverflow;
+    ellipsis: string;
+    strokeWidth: number;
+    backgroundOpacity: number;
+    autoWidth: boolean;
+    boxAlign: "left";
+};
+/**
+ * Default values for image segments
+ */
+declare const IMAGE_DEFAULTS: {
+    fit: FitMode;
+    opacity: number;
+    loop: boolean;
+    speed: number;
+};
+/**
+ * Default values for video segments
+ */
+declare const VIDEO_DEFAULTS: {
+    volume: number;
+    fit: FitMode;
+    opacity: number;
+    loop: boolean;
+    speed: number;
+};
+/**
+ * Default values for visual segment positioning
+ */
+declare const VISUAL_DEFAULTS: {
+    xOffset: number;
+    yOffset: number;
+    zIndex: number;
+    scale: number;
+    rotation: number;
+    opacity: number;
+};
+/**
+ * Apply default values to a text segment
+ */
+declare function applyTextDefaults<T extends Record<string, unknown>>(segment: T): T & typeof TEXT_DEFAULTS;
+/**
+ * Apply default values to an image segment
+ */
+declare function applyImageDefaults<T extends Record<string, unknown>>(segment: T): T & typeof IMAGE_DEFAULTS;
+/**
+ * Apply default values to a video segment
+ */
+declare function applyVideoDefaults<T extends Record<string, unknown>>(segment: T): T & typeof VIDEO_DEFAULTS;
+
+/**
+ * Text utilities for measuring and wrapping text
+ */
+
+/**
+ * Wrap text to fit within a specific width
+ * Accounts for letter spacing when measuring text width
+ */
+declare function wrapText({ text, maxWidth, letterSpacing, textWrap, maxLines, measureText, }: {
+    text: string;
+    maxWidth: number;
+    letterSpacing?: number;
+    textWrap?: 'word' | 'char' | 'none';
+    maxLines?: number;
+    measureText: (text: string) => number;
+}): string[];
+/**
+ * Calculate line width with letter spacing
+ */
+declare function calculateLineWidth({ line, letterSpacing, measureText, }: {
+    line: string;
+    letterSpacing: number;
+    measureText: (text: string) => number;
+}): number;
+/**
+ * Convert borderRadius value to array format for roundRect()
+ * Returns [topLeft, topRight, bottomRight, bottomLeft] or null if no rounding needed
+ */
+declare function getBorderRadii(borderRadius: number | BorderRadiusConfig | undefined): number[] | null;
+/**
+ * Parse hex color to RGB values
+ */
+declare function parseHexColor(hex: string): {
+    r: number;
+    g: number;
+    b: number;
+};
+/**
+ * Convert hex color and opacity to rgba string
+ */
+declare function hexToRgba(hex: string, opacity?: number): string;
+
+/**
+ * Position Resolution Utility
+ *
+ * Resolves relative element positions to absolute coordinates.
+ * X and Y positions can be independently set to relative or absolute.
+ * Handles dependency resolution, circular dependency detection, and cascading updates.
+ */
+
+/**
+ * Calculate the actual dimensions of a text element when autoWidth is enabled
+ * Returns { actualWidth, actualX, actualHeight } where:
+ * - actualX is adjusted based on boxAlign
+ * - actualHeight is calculated based on the number of wrapped lines
+ */
+declare function calculateAutoWidthDimensions(elem: ImageEditorElement, textContent: string, ctx?: CanvasRenderingContext2D | null): {
+    actualWidth: number;
+    actualX: number;
+    actualHeight: number;
+    lineCount: number;
+} | null;
+interface PositionResolutionError {
+    elementId: string;
+    type: 'circular_dependency' | 'missing_reference' | 'invalid_config';
+    message: string;
+    /** Which axis the error is for */
+    axis?: 'x' | 'y';
+    /** For circular dependencies, the cycle path */
+    cyclePath?: string[];
+}
+interface PositionResolutionResult {
+    /** Elements with resolved absolute positions */
+    elements: ImageEditorElement[];
+    /** Any errors encountered during resolution */
+    errors: PositionResolutionError[];
+}
+/**
+ * Resolve all relative positions to absolute coordinates
+ *
+ * X and Y are resolved independently, allowing:
+ * - X absolute, Y relative (common for vertical stacking)
+ * - X relative, Y absolute (common for horizontal stacking)
+ * - Both relative (can be to different elements)
+ * - Both absolute
+ *
+ * @param elements - Array of elements to resolve
+ * @param textValues - Optional map of textInputId -> text content for autoWidth calculation
+ */
+declare function resolveElementPositions(elements: ImageEditorElement[], textValues?: Record<string, string>): PositionResolutionResult;
+/**
+ * Check if an element can be set as a reference for another element on a specific axis
+ */
+declare function canSetAsReference(elements: ImageEditorElement[], elementId: string, proposedReferenceId: string, axis: 'x' | 'y'): boolean;
+/**
+ * Get all elements that would be affected if a given element's position/size changes
+ */
+declare function getDependentElements(elements: ImageEditorElement[], elementId: string): string[];
+/**
+ * Get the element that a given element references for X position (if any)
+ */
+declare function getReferenceElementX(elements: ImageEditorElement[], elementId: string): ImageEditorElement | null;
+/**
+ * Get the element that a given element references for Y position (if any)
+ */
+declare function getReferenceElementY(elements: ImageEditorElement[], elementId: string): ImageEditorElement | null;
+
+/**
+ * Utility functions for calculating dynamic crop bounds
+ */
+
+/**
+ * Calculate dynamic crop bounds based on element positions
+ *
+ * @param elements - Array of resolved elements with absolute positions
+ * @param dynamicCrop - Crop configuration
+ * @param canvasWidth - Original canvas width
+ * @param canvasHeight - Original canvas height
+ * @param textValues - Optional map of textInputId -> text content for height calculation
+ * @returns CropBounds with x, y, width, height
+ */
+declare function calculateCropBounds(elements: ImageEditorElement[], dynamicCrop: DynamicCropConfig | undefined, canvasWidth: number, canvasHeight: number, textValues?: Record<string, string>): CropBounds;
+/**
+ * Check if dynamic crop is enabled (either vertical or horizontal)
+ */
+declare function isDynamicCropEnabled(dynamicCrop: DynamicCropConfig | undefined): boolean;
+
+/**
+ * Timeline utility functions for video editor
+ *
+ * These functions calculate segment positions on the timeline based on
+ * the segment/overlay timing model. Used by both the webapp UI and
+ * the VideoEditorComposition for rendering.
+ */
+
+/**
+ * Create a default TimeValue for segment offsets
+ */
+declare function defaultOffset(mode?: TimeMode): TimeValue;
+/**
+ * Get base segments (no parentId) for a channel
+ * Base segments are the primary timeline elements that overlays attach to
+ */
+declare function getBaseSegments(channel: VideoEditorChannel): VideoEditorSegment[];
+/**
+ * Get overlays for a specific parent segment (or global overlays if parentId is null)
+ */
+declare function getOverlays(channel: VideoEditorChannel, parentId: string | null): VideoEditorSegment[];
+/**
+ * Calculate segment position on timeline
+ *
+ * For base segments:
+ * - Position is calculated from offset and previous segments
+ * - Duration is from the duration property or default (5 seconds)
+ *
+ * For overlay segments:
+ * - Position is calculated relative to parent using relativeStart/relativeEnd
+ * - relativeStart/relativeEnd are fractions (0-1) of parent duration
+ */
+declare function getSegmentTimelinePosition(segment: VideoEditorSegment, baseSegments: VideoEditorSegment[], channel: VideoEditorChannel): SegmentTimelinePosition;
+/**
+ * Check if a segment is visible at a given time
+ */
+declare function isSegmentVisibleAtTime(segment: VideoEditorSegment, time: number, channel: VideoEditorChannel): boolean;
+/**
+ * Calculate estimated total duration based on segments
+ */
+declare function calculateEstimatedDuration(channels: VideoEditorChannel[]): number;
+/**
+ * Calculate the timeline content end time (used for both ruler and scroll width)
+ */
+declare function calculateTimelineContentEnd(channel: VideoEditorChannel): number;
+/**
+ * Format time in mm:ss.ms
+ */
+declare function formatTime(ms: number): string;
+/**
+ * Parse time string to milliseconds
+ */
+declare function parseTime(timeStr: string): number;
+/**
+ * Generate a unique segment ID
+ */
+declare function generateSegmentId(): string;
+/**
+ * Generate a unique overlay ID
+ */
+declare function generateOverlayId(): string;
+
+/**
+ * Caption style presets and resolution utilities
+ *
+ * Provides TikTok-style caption presets and a function to resolve
+ * partial config into a complete CaptionStyle object.
+ */
+
+/**
+ * Predefined caption style presets
+ *
+ * Font sizes are designed for 1920p height and scale proportionally.
+ * maxWidth is a percentage of video width (0-100).
+ */
+declare const CAPTION_PRESETS: Record<CaptionPreset, Omit<CaptionStyle, 'preset'>>;
+/**
+ * Default caption style (used when no preset or custom values provided)
+ */
+declare const DEFAULT_CAPTION_STYLE: Omit<CaptionStyle, "preset">;
+/**
+ * Resolve a partial caption style config into a complete CaptionStyle object
+ *
+ * Priority:
+ * 1. Explicit values in the input style
+ * 2. Preset values (if preset is specified)
+ * 3. Default values (hormozi preset)
+ *
+ * @param style - Partial caption style configuration
+ * @returns Complete CaptionStyle object with all fields populated
+ */
+declare function resolveCaptionStyle(style: Partial<CaptionStyle> | undefined): CaptionStyle;
+/**
+ * Get all available preset names
+ */
+declare function getCaptionPresetNames(): CaptionPreset[];
+/**
+ * Check if a string is a valid caption preset name
+ */
+declare function isValidCaptionPreset(name: string): name is CaptionPreset;
+
+export { FONT_URLS as $, type AutoCaptionCompositionProps as A, type BorderRadiusConfig as B, type CaptionOverlayProps as C, type DynamicCropConfig as D, type SegmentTimelinePosition as E, type FitMode as F, type CropBoundary as G, type Hyphenation as H, type ImageEditorElement as I, type CropAxisConfig as J, type CropBounds as K, type CaptionWord as L, type CaptionPage as M, type CaptionPreset as N, type CaptionPosition as O, type PositionResolutionResult as P, type CaptionFontWeight as Q, type RelativePositionConfigX as R, type SegmentType as S, type TimeValue as T, type CaptionStyle as U, type VerticalAlignment as V, type WordBreak as W, FONT_FAMILIES as X, APPLE_EMOJI_FONT as Y, getFontFamily as Z, buildFontString as _, type RelativePositionConfigY as a, preloadFonts as a0, areFontsLoaded as a1, debugFontStatus as a2, calculateFitDimensions as a3, type FitDimensions as a4, TEXT_DEFAULTS as a5, IMAGE_DEFAULTS as a6, VIDEO_DEFAULTS as a7, VISUAL_DEFAULTS as a8, applyTextDefaults as a9, generateOverlayId as aA, CAPTION_PRESETS as aB, DEFAULT_CAPTION_STYLE as aC, resolveCaptionStyle as aD, getCaptionPresetNames as aE, isValidCaptionPreset as aF, applyImageDefaults as aa, applyVideoDefaults as ab, wrapText as ac, calculateLineWidth as ad, getBorderRadii as ae, parseHexColor as af, hexToRgba as ag, resolveElementPositions as ah, calculateAutoWidthDimensions as ai, canSetAsReference as aj, getDependentElements as ak, getReferenceElementX as al, getReferenceElementY as am, type PositionResolutionError as an, calculateCropBounds as ao, isDynamicCropEnabled as ap, defaultOffset as aq, getBaseSegments as ar, getOverlays as as, getSegmentTimelinePosition as at, isSegmentVisibleAtTime as au, calculateEstimatedDuration as av, calculateTimelineContentEnd as aw, formatTime as ax, parseTime as ay, generateSegmentId as az, type TextStyleProperties as b, type FontType as c, type FontWeight as d, type TextAlignment as e, type TextDirection as f, type TextWrap as g, type TextOverflow as h, type VerticalAnchor as i, type HorizontalAnchor as j, type HorizontalSelfAnchor as k, type VerticalSelfAnchor as l, type ImageEditorNodeConfig as m, type DimensionPresetKey as n, type DimensionPreset as o, DIMENSION_PRESETS as p, type TimeMode as q, type VideoEditorBaseSegment as r, type VideoEditorVisualSegment as s, type VideoEditorVideoSegment as t, type VideoEditorAudioSegment as u, type VideoEditorImageSegment as v, type VideoEditorTextSegment as w, type VideoEditorSegment as x, type VideoEditorChannel as y, type VideoEditorNodeConfig as z };