@codingfactory/mediables-vue 2.8.0 → 2.9.1

package/dist/video/project/visualLayerSchema.d.ts

@@ -0,0 +1,238 @@
+export type VisualLayerType = 'text' | 'caption' | 'shape' | 'image' | 'sticker' | 'svg' | 'adjustment';
+export type BlendMode = 'normal' | 'multiply' | 'screen' | 'overlay' | 'darken' | 'lighten' | 'color-dodge' | 'color-burn' | 'hard-light' | 'soft-light' | 'difference' | 'exclusion';
+export type TextAlign = 'left' | 'center' | 'right' | 'justify';
+export type VerticalAlign = 'top' | 'middle' | 'bottom';
+export type TextWrapMode = 'auto' | 'none' | 'manual';
+export type CaptionSource = 'manual' | 'srt-import' | 'transcription';
+export type CaptionStylePreset = 'default' | 'subtitle' | 'karaoke' | 'boxed' | 'minimal';
+export type CaptionAnimationPreset = 'none' | 'fade' | 'pop' | 'word-highlight';
+export type TransitionType = 'cut' | 'fade' | 'crossfade' | 'dip-to-black' | 'wipe-left' | 'wipe-right' | 'slide-left' | 'slide-right' | 'zoom';
+export type EasingType = 'linear' | 'ease-in' | 'ease-out' | 'ease-in-out';
+export type KeyframeEasing = EasingType | 'hold' | 'step';
+export type KeyframeTargetProperty = 'transform.position.x' | 'transform.position.y' | 'transform.scale.x' | 'transform.scale.y' | 'transform.rotation' | 'opacity' | 'text.style.fontSize' | 'text.style.colorAlpha' | 'adjustment.intensity';
+export type SchemaValidationErrorCode = 'empty-id' | 'empty-track-id' | 'invalid-time' | 'invalid-duration' | 'invalid-opacity' | 'invalid-transform' | 'invalid-caption-segment' | 'invalid-transition-boundary' | 'transition-overlap' | 'invalid-keyframe';
+export declare class VisualLayerSchemaError extends Error {
+    readonly code: SchemaValidationErrorCode;
+    constructor(code: SchemaValidationErrorCode, message: string);
+}
+export interface LayerPoint {
+    x: number;
+    y: number;
+}
+export interface LayerTransform {
+    position: LayerPoint;
+    anchor: LayerPoint;
+    scale: LayerPoint;
+    rotation: number;
+}
+export interface MobileVisualCapabilityFlags {
+    canPreview: boolean;
+    canEdit: boolean;
+    canExport: boolean;
+    supportsKeyframeEditor: boolean;
+    supportsTransitionEditor: boolean;
+}
+export interface VisualFeatureCapabilityMatrix {
+    visualLayers: {
+        supportedTypes: VisualLayerType[];
+        maxLayerCount: number;
+        mobile: MobileVisualCapabilityFlags;
+    };
+    captions: {
+        supportsManualTracks: boolean;
+        supportsSrtImport: boolean;
+        supportsTranscription: boolean;
+        supportsWordTiming: boolean;
+        mobile: MobileVisualCapabilityFlags;
+    };
+    transitions: {
+        supportedTypes: TransitionType[];
+        mobile: MobileVisualCapabilityFlags;
+    };
+    keyframes: {
+        supportedProperties: KeyframeTargetProperty[];
+        mobile: MobileVisualCapabilityFlags;
+    };
+}
+export interface RichTextStyle {
+    fontFamily: string;
+    fontSize: number;
+    fontWeight: number;
+    fontStyle: 'normal' | 'italic';
+    color: string;
+    backgroundColor: string;
+    backgroundOpacity: number;
+    strokeColor: string;
+    strokeWidth: number;
+    shadowColor: string;
+    shadowBlur: number;
+    shadowOffsetX: number;
+    shadowOffsetY: number;
+    lineHeight: number;
+    letterSpacing: number;
+    textAlign: TextAlign;
+    verticalAlign: VerticalAlign;
+}
+export interface VisualLayerKeyframe {
+    id: string;
+    property: KeyframeTargetProperty;
+    time: number;
+    value: number;
+    easing: KeyframeEasing;
+}
+export interface BaseVisualLayerRecipe {
+    id: string;
+    type: VisualLayerType;
+    trackId: string;
+    startTime: number;
+    duration: number;
+    zIndex: number;
+    enabled: boolean;
+    blendMode: BlendMode;
+    opacity: number;
+    transform: LayerTransform;
+    capabilities?: MobileVisualCapabilityFlags;
+    keyframes?: VisualLayerKeyframe[];
+}
+export interface TextLayerRecipe extends BaseVisualLayerRecipe {
+    type: 'text';
+    text: {
+        content: string;
+        style: RichTextStyle;
+        wrap: TextWrapMode;
+        maxWidth?: number;
+    };
+    animation?: {
+        preset: 'none' | 'fade' | 'slide' | 'scale' | 'typewriter';
+        duration: number;
+        easing: EasingType;
+    };
+}
+export interface CaptionLayerRecipe extends BaseVisualLayerRecipe {
+    type: 'caption';
+    captionTrackId: string;
+    segmentIds?: string[];
+}
+export interface ShapeLayerRecipe extends BaseVisualLayerRecipe {
+    type: 'shape';
+    shape: {
+        kind: 'rectangle' | 'ellipse' | 'line';
+        fillColor: string;
+        strokeColor?: string;
+        strokeWidth?: number;
+        cornerRadius?: number;
+    };
+}
+export interface ImageLayerRecipe extends BaseVisualLayerRecipe {
+    type: 'image';
+    sourceRefId: string;
+    fit: 'contain' | 'cover' | 'stretch';
+}
+export interface StickerLayerRecipe extends BaseVisualLayerRecipe {
+    type: 'sticker';
+    sourceRefId: string;
+    label?: string;
+}
+export interface SvgLayerRecipe extends BaseVisualLayerRecipe {
+    type: 'svg';
+    sourceRefId?: string;
+    sanitizedMarkup?: string;
+    viewBox?: string;
+}
+export interface AdjustmentLayerRecipe extends BaseVisualLayerRecipe {
+    type: 'adjustment';
+    adjustment: {
+        kind: 'color' | 'blur' | 'vignette' | 'lut';
+        intensity: number;
+    };
+}
+export type VisualLayerRecipe = TextLayerRecipe | CaptionLayerRecipe | ShapeLayerRecipe | ImageLayerRecipe | StickerLayerRecipe | SvgLayerRecipe | AdjustmentLayerRecipe;
+export interface CaptionWordRecipe {
+    id: string;
+    startTime: number;
+    endTime: number;
+    text: string;
+}
+export interface CaptionSegmentRecipe {
+    id: string;
+    startTime: number;
+    endTime: number;
+    text: string;
+    words?: CaptionWordRecipe[];
+}
+export interface CaptionTrackRecipe {
+    id: string;
+    source: CaptionSource;
+    language?: string;
+    stylePreset: CaptionStylePreset;
+    animation: CaptionAnimationPreset;
+    segments: CaptionSegmentRecipe[];
+}
+export interface TransitionParams {
+    direction?: 'left' | 'right' | 'up' | 'down';
+    color?: string;
+    softness?: number;
+}
+export interface TransitionRecipe {
+    id: string;
+    type: TransitionType;
+    fromClipId: string;
+    toClipId: string;
+    duration: number;
+    easing: EasingType;
+    cutTime?: number;
+    params?: TransitionParams;
+}
+export interface TransitionClipBoundary {
+    id: string;
+    timelineStart: number;
+    timelineEnd: number;
+}
+export interface NormalizedTransitionWindow {
+    transition: TransitionRecipe & {
+        cutTime: number;
+    };
+    fromWindow: {
+        clipId: string;
+        startTime: number;
+        endTime: number;
+    };
+    toWindow: {
+        clipId: string;
+        startTime: number;
+        endTime: number;
+    };
+}
+export type VisualLayerDefaultKey = 'zIndex' | 'enabled' | 'blendMode' | 'opacity' | 'transform' | 'capabilities' | 'keyframes';
+export type TextLayerInput = Omit<TextLayerRecipe, VisualLayerDefaultKey | 'text'> & Partial<Pick<BaseVisualLayerRecipe, VisualLayerDefaultKey>> & {
+    text: {
+        content: string;
+        style?: Partial<RichTextStyle>;
+        wrap?: TextWrapMode;
+        maxWidth?: number;
+    };
+};
+export type CaptionLayerInput = Omit<CaptionLayerRecipe, VisualLayerDefaultKey> & Partial<Pick<BaseVisualLayerRecipe, VisualLayerDefaultKey>>;
+export type ShapeLayerInput = Omit<ShapeLayerRecipe, VisualLayerDefaultKey> & Partial<Pick<BaseVisualLayerRecipe, VisualLayerDefaultKey>>;
+export type ImageLayerInput = Omit<ImageLayerRecipe, VisualLayerDefaultKey> & Partial<Pick<BaseVisualLayerRecipe, VisualLayerDefaultKey>>;
+export type StickerLayerInput = Omit<StickerLayerRecipe, VisualLayerDefaultKey> & Partial<Pick<BaseVisualLayerRecipe, VisualLayerDefaultKey>>;
+export type SvgLayerInput = Omit<SvgLayerRecipe, VisualLayerDefaultKey> & Partial<Pick<BaseVisualLayerRecipe, VisualLayerDefaultKey>>;
+export type AdjustmentLayerInput = Omit<AdjustmentLayerRecipe, VisualLayerDefaultKey> & Partial<Pick<BaseVisualLayerRecipe, VisualLayerDefaultKey>>;
+export type VisualLayerInput = TextLayerInput | CaptionLayerInput | ShapeLayerInput | ImageLayerInput | StickerLayerInput | SvgLayerInput | AdjustmentLayerInput;
+export interface CaptionTrackInput {
+    id: string;
+    source: CaptionSource;
+    language?: string;
+    stylePreset?: CaptionStylePreset;
+    animation?: CaptionAnimationPreset;
+    segments: CaptionSegmentRecipe[];
+}
+export declare const DEFAULT_LAYER_TRANSFORM: LayerTransform;
+export declare const DEFAULT_RICH_TEXT_STYLE: RichTextStyle;
+export declare const DEFAULT_MOBILE_VISUAL_CAPABILITIES: MobileVisualCapabilityFlags;
+export declare const DEFAULT_VISUAL_FEATURE_CAPABILITIES: VisualFeatureCapabilityMatrix;
+export declare function normalizeVisualLayer(layer: VisualLayerInput): VisualLayerRecipe;
+export declare function normalizeCaptionTrack(track: CaptionTrackInput): CaptionTrackRecipe;
+export declare function normalizeLayerKeyframes(keyframes: VisualLayerKeyframe[]): VisualLayerKeyframe[];
+export declare function normalizeTransitionWindow(transition: TransitionRecipe, fromClip: TransitionClipBoundary, toClip: TransitionClipBoundary): NormalizedTransitionWindow;
+export declare function validateTransitionWindowsDoNotOverlap(windows: NormalizedTransitionWindow[]): void;

package/dist/video-engine/adapters/AudioManager.d.ts

@@ -39,6 +39,10 @@ export declare class AudioManager {
      * Add an audio track to the composition
      */
     addAudioTrack(config: AudioTrackConfig): Promise<string>;
+    private resolveAudioSource;
+    private createAudioClipConfig;
+    private findAudioTrack;
+    private removeClipFromTrack;
     /**
      * Create volume keyframes for fade effects
      */
@@ -47,6 +51,10 @@ export declare class AudioManager {
      * Update audio track volume
      */
     updateVolume(id: string, volume: number): Promise<void>;
+    /**
+     * Update an audio track's source, timing, fades, loop flag, or name.
+     */
+    updateAudioTrack(id: string, config: Partial<AudioTrackConfig>): Promise<void>;
     /**
      * Apply fade in effect to an audio track
      */
@@ -67,6 +75,7 @@ export declare class AudioManager {
      * Set master volume (affects all tracks)
      */
     setMasterVolume(volume: number): void;
+    private resolveLayerVolume;
     /**
      * Get master volume
      */

package/dist/video-engine/adapters/MediablesCompositionAdapter.d.ts

@@ -24,6 +24,9 @@ export declare class MediablesCompositionAdapter {
     attachPlayer(element: HTMLDivElement): Promise<void>;
     private setupResponsiveScaling;
     loadFromRecipe(recipe: VideoRecipe): Promise<void>;
+    private applyTransitionsToClips;
+    private mapTransitionType;
+    private mapTransitionEasing;
     private addTimelineClip;
     private addTextOverlay;
     private applyFiltersToClip;

package/dist/video-engine/adapters/TextOverlayManager.d.ts

@@ -38,6 +38,7 @@ export interface TextOverlayConfig {
 export declare class TextOverlayManager {
     private composition;
     private textClips;
+    private overlayConfigs;
     private fonts;
     private nextId;
     constructor(composition: Composition);
@@ -54,6 +55,8 @@ export declare class TextOverlayManager {
      * Add a text overlay to the composition
      */
     addTextOverlay(config: TextOverlayConfig): Promise<string>;
+    private buildTextClipConfig;
+    private applyPosition;
     /**
      * Apply animation to text clip configuration
      */
@@ -84,8 +87,7 @@ export declare class TextOverlayManager {
     /**
      * Create animated captions from transcript
      */
-    addCaptions(transcript: any, // Would be core.Transcript type
-    preset?: 'classic' | 'cascade' | 'guinea' | 'solar' | 'spotlight' | 'whisper', position?: {
+    addCaptions(transcript: core.Transcript, preset?: 'classic' | 'cascade' | 'guinea' | 'solar' | 'spotlight' | 'whisper', position?: {
         x?: string | number;
         y?: string | number;
     }): Promise<void>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codingfactory/mediables-vue",
-  "version": "2.8.0",
+  "version": "2.9.1",
   "publishConfig": {
     "access": "restricted"
   },

package/dist/PixiFrameExporter-CqKXaoCX.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("./index-DNo3Kr1t.cjs");function V(){return typeof VideoEncoder<"u"&&typeof VideoFrame<"u"}function z(){return typeof AudioEncoder<"u"&&typeof AudioData<"u"}async function L(i,d){try{const t=await fetch(i,d?{signal:d}:{});if(!t.ok)return null;const r=await t.arrayBuffer(),u=new AudioContext;try{return await u.decodeAudioData(r)}catch{return null}finally{await u.close()}}catch{return null}}function N(i,d,a){const t=i.sampleRate,r=Math.max(0,Math.floor(d*t)),u=Math.min(i.length,Math.ceil(a*t)),p=Math.max(0,u-r),n=[];for(let s=0;s<i.numberOfChannels;s++){const l=i.getChannelData(s);n.push(l.slice(r,r+p))}return{channels:n,sampleRate:t,numberOfChannels:i.numberOfChannels}}async function P(i,d,a,t,r){const u={codec:"mp4a.40.2",numberOfChannels:t,sampleRate:a,bitrate:r};if(!(await AudioEncoder.isConfigSupported(u)).supported)return;const n=new AudioEncoder({output:(e,c)=>{i.addAudioChunk(e,c)},error:e=>{}});n.configure(u);const s=1024,l=d[0].length;for(let e=0;e<l;e+=s){const c=Math.min(s,l-e),h=new Float32Array(t*c);for(let f=0;f<t;f++)h.set(d[f].subarray(e,e+c),f*c);const w=new AudioData({format:"f32-planar",sampleRate:a,numberOfFrames:c,numberOfChannels:t,timestamp:Math.floor(e/a*1e6),data:h});n.encode(w),w.close(),n.encodeQueueSize>10&&await new Promise(f=>{n.addEventListener("dequeue",()=>f(),{once:!0})})}await n.flush(),n.close()}async function X(i,d){const{width:a,height:t,fps:r,bitrate:u=5e6,audioBitrate:p=128e3,trimStart:n=0,trimEnd:s,sourceUrl:l,onProgress:e,signal:c}=d;if(!V())throw new Error("WebCodecs API is not supported in this browser");const h=i.duration.value,w=3600,f=w*60;if(!Number.isFinite(h)||h<=0)throw new Error(`Invalid video duration: ${h}. The video metadata may not have loaded. Please ensure the video is fully loaded before exporting.`);const A=s??h,E=Math.max(0,A-n);if(!Number.isFinite(E)||E<=0)throw new Error(`Invalid export duration: ${E} (trimStart=${n}, trimEnd=${A}). Check that the trim points are valid.`);if(E>w)throw new Error(`Export duration (${Math.round(E)}s) exceeds maximum allowed (${w}s).`);const g=Math.min(Math.max(1,Math.ceil(E*r)),f);let F=Promise.resolve(null);l&&z()&&(F=L(l,c));const v=await F,D=!!v&&v.numberOfChannels>0&&v.length>0,O={target:new R.ArrayBufferTarget,video:{codec:"avc",width:a,height:t,frameRate:r},fastStart:"in-memory"};D&&(O.audio={codec:"aac",numberOfChannels:v.numberOfChannels,sampleRate:v.sampleRate});const C=new R.Muxer(O),$=[{codec:"avc1.640028",hw:"prefer-hardware"},{codec:"avc1.4d0028",hw:"prefer-hardware"},{codec:"avc1.420028",hw:"prefer-hardware"},{codec:"avc1.640028",hw:"prefer-software"},{codec:"avc1.4d0028",hw:"prefer-software"},{codec:"avc1.420028",hw:"prefer-software"}];let y=null;for(const o of $){const x={codec:o.codec,width:a,height:t,bitrate:u,framerate:r,hardwareAcceleration:o.hw};if((await VideoEncoder.isConfigSupported(x)).supported){y=x;break}}if(!y)throw new Error(`No supported VideoEncoder codec found for ${a}×${t}. Try a lower export resolution or use a browser with H.264 encoding support (Chrome 94+).`);const m=new VideoEncoder({output:(o,x)=>{C.addVideoChunk(o,x)},error:o=>{}});m.configure(y);const b=document.createElement("canvas");b.width=a,b.height=t;const M=b.getContext("2d");if(!M)throw new Error("Failed to create 2D context for export target canvas");for(let o=0;o<g;o++){if(c!=null&&c.aborted)throw m.close(),new DOMException("Export aborted","AbortError");const x=n+o/r,S=await i.captureFrameAt(x);if(!S)continue;M.clearRect(0,0,a,t),M.drawImage(S,0,0,a,t);const I=Math.floor(o/r*1e6),q=Math.floor(1e6/r),T=new VideoFrame(b,{timestamp:I,duration:q}),B=o%(r*2)===0;m.encode(T,{keyFrame:B}),T.close(),m.encodeQueueSize>5&&await new Promise(_=>{m.addEventListener("dequeue",()=>_(),{once:!0})});const W=Math.round((o+1)/g*90);e==null||e(W)}if(await m.flush(),m.close(),D){e==null||e(91);const o=N(v,n,A);await P(C,o.channels,o.sampleRate,o.numberOfChannels,p),e==null||e(99)}C.finalize();const{buffer:k}=C.target;return e==null||e(100),new Blob([k],{type:"video/mp4"})}exports.exportWithPixiFrames=X;exports.isWebCodecsSupported=V;
-//# sourceMappingURL=PixiFrameExporter-CqKXaoCX.cjs.map