@twick/timeline 0.14.3 → 0.14.4

package/dist/types/index.d.ts

@@ -1,167 +1,22 @@
-export type Colors = {
-    text?: string;
-    background?: string;
-    highlight?: string;
-};
-export type Fonts = {
-    family?: string;
-    size?: number;
-    weight?: number;
-    style?: string;
-};
-export type Position = {
-    x: number;
-    y: number;
-};
-export type TextEffect = {
-    name: string;
-    duration?: number;
-    delay?: number;
-    bufferTime?: number;
-};
-export type Size = {
-    width: number;
-    height: number;
-};
-export type SizeArray = [number, number];
-export type Frame = {
-    size?: [number, number];
-    x?: number;
-    y?: number;
-    fill?: string;
-    stroke?: string;
-    strokeWidth?: number;
-};
-export type FrameEffectProps = {
-    frameSize: SizeArray;
-    frameShape: "circle" | "rect";
-    framePosition: Position;
-    radius?: number;
-    objectFit?: ObjectFit;
-    transitionDuration?: number;
-    transitionEasing?: string;
-    elementPosition?: Position;
-};
-export type FrameEffect = {
-    s: number;
-    e: number;
-    props: FrameEffectProps;
-};
-export type ObjectFit = "cover" | "contain" | "fill" | "none";
-export type TextAlign = "left" | "center" | "right";
-export type AudioProps = {
-    src: string;
-    volume?: number;
-    loop?: boolean;
-    playbackRate?: number;
-    time?: number;
-};
-export type CaptionProps = {
-    font?: {
-        family?: string;
-        size?: number;
-        fill?: string;
-    };
-    pos?: {
-        x: number;
-        y: number;
-    };
-    color?: {
-        text?: string;
-        background?: string;
-        highlight?: string;
-    };
-};
-export type CircleProps = {
-    radius: number;
-    fill: string;
-};
-export type IconProps = {
-    src: string;
-    size: Size;
-};
-export type ImageProps = {
-    src: string;
-    mediaFilter?: string;
-};
-export type RectProps = {
-    width: number;
-    height: number;
-    fill: string;
-};
-export type TextProps = {
-    text: string;
-    fill?: string;
-    rotation?: number;
-    fontSize?: number;
-    fontFamily?: string;
-    fontWeight?: number;
-    fontStyle?: "normal" | "italic";
-    textAlign?: TextAlign;
-    stroke?: string;
-    lineWidth?: number;
-};
-export type VideoProps = {
-    src: string;
-    playbackRate?: number;
-    time?: number;
-    mediaFilter?: string;
-    volume?: number;
-};
 export type Animation = {
     name: string;
     interval?: number;
+    duration?: number;
     intensity?: number;
     animate?: "enter" | "exit" | "both";
     mode?: "in" | "out";
     direction?: "up" | "down" | "left" | "right" | "center";
-};
-export type ElementJSON = {
-    id: string;
-    type: string;
-    s: number;
-    e: number;
-    t?: string;
-    trackId: string;
-    name: string;
-    trackType?: string;
-    backgroundColor?: string;
-    frameEffects?: FrameEffect[];
-    animation?: Animation;
-    textEffect?: TextEffect;
-    objectFit?: ObjectFit;
-    mediaDuration?: number;
-    props?: {
-        playbackRate?: number;
-        capStyle?: string;
-        time?: number;
-        videoFilter?: string;
-        text?: string;
-        src?: string;
-        size?: [number, number];
-        play?: boolean;
-        mute?: boolean;
-        hWords?: Record<string, any>;
-        [key: string]: any;
-    };
-    frame?: Frame;
-};
-export type TrackJSON = {
-    id: string;
-    name: string;
-    type: string;
-    allowOverlap?: boolean;
-    elements: ElementJSON[];
-    props?: {
-        capStyle?: string;
-        font?: Fonts;
-        wordsPerPhrase?: number;
-        pos?: Position;
-        colors?: Colors;
-        hWords?: Record<string, any>;
+    options?: {
+        animate?: ("enter" | "exit" | "both")[];
+        mode?: ("in" | "out")[];
+        direction?: ("left" | "right" | "center" | "up" | "down")[];
+        intensity?: [number, number];
+        interval?: [number, number];
+        duration?: [number, number];
     };
+    getSample?: (animation?: Animation) => string;
 };
-export type ProjectJSON = {
-    tracks: TrackJSON[];
-    version: number;
+export type Size = {
+    width: number;
+    height: number;
 };

package/dist/types.d.ts

@@ -0,0 +1,128 @@
+export interface Position {
+    x: number;
+    y: number;
+}
+export interface Size {
+    width: number;
+    height: number;
+}
+export interface Frame {
+    x: number;
+    y: number;
+    width?: number;
+    height?: number;
+    size?: [number, number];
+}
+export interface ElementJSON {
+    id: string;
+    type: string;
+    s: number;
+    e: number;
+    position?: Position;
+    rotation?: number;
+    opacity?: number;
+    [key: string]: any;
+}
+export interface TrackJSON {
+    id: string;
+    name: string;
+    type?: string;
+    elements: ElementJSON[];
+}
+export interface ProjectJSON {
+    tracks: TrackJSON[];
+    version: number;
+}
+export interface BaseMediaProps {
+    src: string;
+    time?: number;
+    playbackRate?: number;
+    volume?: number;
+    autoPlay?: boolean;
+    loop?: boolean;
+    muted?: boolean;
+    controls?: boolean;
+}
+export interface VideoProps extends BaseMediaProps {
+    width?: number;
+    height?: number;
+    mediaFilter?: string;
+    src: string;
+    time?: number;
+    playbackRate?: number;
+    volume?: number;
+}
+export interface AudioProps extends BaseMediaProps {
+    src: string;
+    time?: number;
+    playbackRate?: number;
+    volume?: number;
+    loop?: boolean;
+}
+export interface ImageProps {
+    src: string;
+    width?: number;
+    height?: number;
+    objectFit?: ObjectFit;
+    mediaFilter?: string;
+}
+export interface TextProps {
+    text: string;
+    fontSize?: number;
+    fontFamily?: string;
+    fill?: string;
+    stroke?: string;
+    strokeWidth?: number;
+    textAlign?: TextAlign;
+    fontWeight?: number | string;
+    lineWidth?: number;
+    rotation?: number;
+    fontStyle?: string;
+}
+export interface RectProps {
+    fill: string;
+    width: number;
+    height: number;
+    radius: number;
+    strokeColor?: string;
+    lineWidth?: number;
+}
+export interface CircleProps {
+    fill: string;
+    radius: number;
+    strokeColor?: string;
+    lineWidth?: number;
+}
+export interface IconProps {
+    fill: string;
+    size?: number;
+}
+export interface TextEffect {
+    duration: number;
+    delay?: number;
+    bufferTime?: number;
+    name: string;
+}
+export interface FrameEffectProps {
+    frameSize: [number, number];
+    framePosition: Position;
+    radius?: number;
+    transitionDuration?: number;
+    objectFit?: ObjectFit;
+}
+export interface FrameEffect {
+    s: number;
+    e: number;
+    props: FrameEffectProps;
+}
+export interface Animation {
+    name: string;
+    animate?: 'enter' | 'exit' | 'both';
+    interval?: number;
+    direction?: 'up' | 'down' | 'left' | 'right' | 'center';
+    intensity?: number;
+    mode?: 'in' | 'out';
+    duration?: number;
+}
+export type ObjectFit = 'contain' | 'cover' | 'fill' | 'none' | 'scale-down';
+export type TextAlign = 'left' | 'center' | 'right' | 'justify';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@twick/timeline",
-  "version": "0.14.3",
+  "version": "0.14.4",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -23,7 +23,7 @@
     "docs": "typedoc"
   },
   "dependencies": {
-    "@twick/media-utils": "0.14.3",
+    "@twick/media-utils": "0.14.4",
     "posthog-js": "^1.258.5"
   },
   "devDependencies": {