ugcinc 1.1.1 → 1.1.2

package/README.md

@@ -25,6 +25,128 @@ if (response.ok) {
 }
 ```
 
+## Video Rendering
+
+The UGC Inc API now includes powerful video rendering capabilities. You can create custom videos by composing multiple layers of video, images, text, and audio.
+
+### Basic Video Rendering Example
+
+```typescript
+import { UGCClient } from 'ugcinc';
+
+const client = new UGCClient({
+  apiKey: 'your-api-key-here'
+});
+
+const result = await client.video.render({
+  editor: {
+    width: 1080,
+    height: 1920,
+    fps: 30,
+    duration: 5000, // 5 seconds in milliseconds
+    channels: [
+      {
+        id: "background",
+        segments: [
+          {
+            id: "bg-video",
+            type: "video",
+            source: "https://example.com/background.mp4",
+            order: 0,
+            offset: { type: "absolute", value: 0 },
+            startTrim: 0,
+            endTrim: 0,
+            xOffset: 0,
+            yOffset: 0,
+            width: 1080,
+            height: 1920,
+            zIndex: 0,
+            scale: 1,
+            rotation: 0,
+            fit: "cover",
+            speed: 1,
+            opacity: 100,
+            volume: 50
+          }
+        ]
+      },
+      {
+        id: "text-layer",
+        segments: [
+          {
+            id: "title",
+            type: "text",
+            source: "",
+            order: 0,
+            offset: { type: "absolute", value: 500 },
+            startTrim: 0,
+            endTrim: 0,
+            duration: { type: "absolute", value: 4000 },
+            xOffset: 90,
+            yOffset: 800,
+            width: 900,
+            height: 320,
+            zIndex: 10,
+            scale: 1,
+            rotation: 0,
+            text: "Hello World! 🎉",
+            alignment: "center",
+            verticalAlign: "middle",
+            direction: "ltr",
+            padding: 20,
+            fontType: "tiktok",
+            fontSize: 80,
+            fontWeight: "bold",
+            lineHeight: 1.2,
+            letterSpacing: 0,
+            textWrap: "word",
+            wordBreak: "break-word",
+            hyphenation: "none",
+            maxLines: 0,
+            textOverflow: "clip",
+            ellipsis: "...",
+            color: "#FFFFFF",
+            backgroundColor: "#00000080",
+            strokeColor: "#000000",
+            strokeWidth: 4
+          }
+        ]
+      }
+    ]
+  }
+});
+
+if (result.ok) {
+  console.log('Video URL:', result.data.video_url);
+}
+```
+
+### Segment Types
+
+The video renderer supports multiple segment types:
+
+- **video**: Video clips with playback control
+- **image**: Static or animated images (including GIFs)
+- **text**: Customizable text overlays with fonts, colors, and effects
+- **audio**: Audio tracks that can be mixed together
+- **editor**: Nested editors for complex compositions
+
+### Time Values
+
+Time values can be specified as absolute (milliseconds) or relative (0-1 percentage):
+
+```typescript
+// Absolute time (500ms)
+offset: { type: "absolute", value: 500 }
+
+// Relative time (50% of video duration)
+offset: { type: "relative", value: 0.5 }
+```
+
+### Layering with Channels
+
+Organize your composition into channels, where each channel can contain multiple segments. Segments are ordered by their `order` property and layered by their `zIndex`.
+
 ## Get Your API Key
 
 To get your API key:
@@ -46,7 +168,16 @@ For complete API documentation, including all endpoints, parameters, and example
 This package is written in TypeScript and provides full type definitions:
 
 ```typescript
-import type { Account, Post, Task, ApiResponse } from 'ugcinc';
+import type { 
+  Account, 
+  Post, 
+  Task, 
+  ApiResponse,
+  Editor,
+  VideoSegment,
+  TextSegment,
+  Channel
+} from 'ugcinc';
 ```
 
 ## License

package/dist/client.d.ts

@@ -2,6 +2,7 @@ import { AccountsClient } from './accounts';
 import { TasksClient } from './tasks';
 import { PostsClient } from './posts';
 import { StatsClient } from './stats';
+import { VideoClient } from './video';
 import type { ClientConfig } from './base';
 /**
  * Main UGC Inc API Client
@@ -26,6 +27,16 @@ import type { ClientConfig } from './base';
  *   videoUrl: 'https://example.com/video.mp4',
  *   caption: 'My awesome video!',
  * });
+ *
+ * // Render a video
+ * const renderResponse = await client.video.render({
+ *   editor: {
+ *     width: 1080,
+ *     height: 1920,
+ *     fps: 30,
+ *     channels: [...]
+ *   }
+ * });
  * ```
  */
 export declare class UGCClient {
@@ -45,5 +56,9 @@ export declare class UGCClient {
      * Client for statistics operations
      */
     stats: StatsClient;
+    /**
+     * Client for video rendering operations
+     */
+    video: VideoClient;
     constructor(config: ClientConfig);
 }

package/dist/client.js

@@ -5,6 +5,7 @@ const accounts_1 = require("./accounts");
 const tasks_1 = require("./tasks");
 const posts_1 = require("./posts");
 const stats_1 = require("./stats");
+const video_1 = require("./video");
 /**
  * Main UGC Inc API Client
  *
@@ -28,6 +29,16 @@ const stats_1 = require("./stats");
  *   videoUrl: 'https://example.com/video.mp4',
  *   caption: 'My awesome video!',
  * });
+ *
+ * // Render a video
+ * const renderResponse = await client.video.render({
+ *   editor: {
+ *     width: 1080,
+ *     height: 1920,
+ *     fps: 30,
+ *     channels: [...]
+ *   }
+ * });
  * ```
  */
 class UGCClient {
@@ -36,6 +47,7 @@ class UGCClient {
         this.tasks = new tasks_1.TasksClient(config);
         this.posts = new posts_1.PostsClient(config);
         this.stats = new stats_1.StatsClient(config);
+        this.video = new video_1.VideoClient(config);
     }
 }
 exports.UGCClient = UGCClient;

package/dist/index.d.ts

@@ -8,5 +8,6 @@ export { AccountsClient } from './accounts';
 export { TasksClient } from './tasks';
 export { PostsClient } from './posts';
 export { StatsClient } from './stats';
+export { VideoClient } from './video';
 export type { ClientConfig, } from './base';
-export type { SuccessResponse, ErrorResponse, ApiResponse, Account, AccountStat, AccountTask, EditProfileInfo, Task, TaskType, Post, PostType, PostStat, GetAccountsParams, GetAccountStatsParams, GetAccountStatusParams, UpdateAccountInfoParams, UpdateAccountSocialParams, GetTasksParams, GetPostsParams, CreateSlideshowParams, GetPostStatsParams, GetPostStatusParams, CreateVideoParams, RefreshStatsParams, RefreshStatsResponse, RefreshStatsError, } from './types';
+export type { SuccessResponse, ErrorResponse, ApiResponse, Account, AccountStat, AccountTask, EditProfileInfo, Task, TaskType, Post, PostType, PostStat, GetAccountsParams, GetAccountStatsParams, GetAccountStatusParams, UpdateAccountInfoParams, UpdateAccountSocialParams, GetTasksParams, GetPostsParams, CreateSlideshowParams, GetPostStatsParams, GetPostStatusParams, CreateVideoParams, RefreshStatsParams, RefreshStatsResponse, RefreshStatsError, RenderVideoParams, RenderVideoResponse, SegmentType, TimeValue, BaseSegment, VisualSegment, PictureSegment, VideoSegment, ImageSegment, AudioSegment, TextSegment, EditorSegment, Channel, Editor, } from './types';

package/dist/index.js

@@ -5,7 +5,7 @@
  * Official TypeScript/JavaScript client for the UGC Inc API
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.StatsClient = exports.PostsClient = exports.TasksClient = exports.AccountsClient = exports.UGCClient = void 0;
+exports.VideoClient = exports.StatsClient = exports.PostsClient = exports.TasksClient = exports.AccountsClient = exports.UGCClient = void 0;
 var client_1 = require("./client");
 Object.defineProperty(exports, "UGCClient", { enumerable: true, get: function () { return client_1.UGCClient; } });
 var accounts_1 = require("./accounts");
@@ -16,3 +16,5 @@ var posts_1 = require("./posts");
 Object.defineProperty(exports, "PostsClient", { enumerable: true, get: function () { return posts_1.PostsClient; } });
 var stats_1 = require("./stats");
 Object.defineProperty(exports, "StatsClient", { enumerable: true, get: function () { return stats_1.StatsClient; } });
+var video_1 = require("./video");
+Object.defineProperty(exports, "VideoClient", { enumerable: true, get: function () { return video_1.VideoClient; } });

package/dist/types.d.ts

@@ -173,3 +173,16 @@ export interface RefreshStatsResponse {
     post_stats_count: number;
     errors?: RefreshStatsError[];
 }
+/**
+ * Video rendering types - imported from video-render module
+ * These are copied during the build process from ../../src/video-render/types/
+ */
+import type { SegmentType, TimeValue, BaseSegment, VisualSegment, PictureSegment, VideoSegment, ImageSegment, AudioSegment, TextSegment, EditorSegment } from './video-render-types/segment';
+import type { Channel, Editor } from './video-render-types/video';
+export type { SegmentType, TimeValue, BaseSegment, VisualSegment, PictureSegment, VideoSegment, ImageSegment, AudioSegment, TextSegment, EditorSegment, Channel, Editor, };
+export interface RenderVideoParams {
+    editor: Editor;
+}
+export interface RenderVideoResponse {
+    video_url: string;
+}

package/dist/video-render-types/segment.d.ts

@@ -0,0 +1,78 @@
+export type SegmentType = 'video' | 'image' | 'text' | 'audio' | 'editor';
+export type TimeValue = {
+    type: 'absolute';
+    value: number;
+} | {
+    type: 'relative';
+    value: number;
+};
+export interface BaseSegment {
+    id: string;
+    type: SegmentType;
+    source: string;
+    order: number;
+    offset: TimeValue;
+    startTrim: number;
+    endTrim: number;
+    duration?: TimeValue;
+}
+export interface VisualSegment extends BaseSegment {
+    type: 'video' | 'image' | 'text';
+    xOffset: number;
+    yOffset: number;
+    width: number;
+    height: number;
+    zIndex: number;
+    scale: number;
+    rotation: number;
+}
+export interface PictureSegment extends VisualSegment {
+    type: 'video' | 'image';
+    fit: 'cover' | 'contain' | 'fill';
+    speed: number;
+    opacity: number;
+}
+export interface VideoSegment extends PictureSegment {
+    type: 'video';
+    volume: number;
+}
+export interface ImageSegment extends PictureSegment {
+    type: 'image';
+    loop: boolean;
+}
+export interface AudioSegment extends BaseSegment {
+    type: 'audio';
+}
+export interface TextSegment extends VisualSegment {
+    type: 'text';
+    text: string;
+    alignment: 'left' | 'center' | 'right' | 'justify';
+    verticalAlign: 'top' | 'middle' | 'bottom';
+    direction: 'ltr' | 'rtl' | 'auto';
+    padding: number;
+    fontType: 'arial' | 'tiktok' | 'apple';
+    fontSize: number;
+    fontWeight: 'normal' | 'bold';
+    lineHeight: number;
+    letterSpacing: number;
+    textWrap: 'word' | 'char' | 'none';
+    wordBreak: 'normal' | 'break-word' | 'break-all';
+    hyphenation: 'none' | 'auto';
+    maxLines: number;
+    textOverflow: 'clip' | 'ellipsis';
+    ellipsis: string;
+    color: string;
+    backgroundColor: string;
+    strokeColor?: string;
+    strokeWidth?: number;
+}
+import type { Editor } from './video';
+export interface EditorSegment extends Omit<VisualSegment, 'type' | 'source'> {
+    type: 'editor';
+    source: '';
+    editor: Editor;
+    fit?: 'cover' | 'contain' | 'fill';
+    opacity?: number;
+    speed?: number;
+    volume?: number;
+}

package/dist/video-render-types/segment.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/video-render-types/video.d.ts

@@ -0,0 +1,12 @@
+import type { BaseSegment, EditorSegment } from "./segment";
+export interface Channel {
+    id: string;
+    segments: Array<BaseSegment | EditorSegment>;
+}
+export interface Editor {
+    width: number;
+    height: number;
+    duration?: number;
+    fps: number;
+    channels: Channel[];
+}

package/dist/video-render-types/video.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/video.d.ts

@@ -0,0 +1,50 @@
+import { BaseClient } from './base';
+import type { RenderVideoParams, RenderVideoResponse, ApiResponse } from './types';
+/**
+ * Client for video rendering operations
+ */
+export declare class VideoClient extends BaseClient {
+    /**
+     * Render a video from an editor configuration
+     *
+     * @example
+     * ```typescript
+     * const result = await client.video.render({
+     *   editor: {
+     *     width: 1080,
+     *     height: 1920,
+     *     fps: 30,
+     *     duration: 5000,
+     *     channels: [
+     *       {
+     *         id: "background",
+     *         segments: [
+     *           {
+     *             id: "bg-video",
+     *             type: "video",
+     *             source: "https://example.com/video.mp4",
+     *             order: 0,
+     *             offset: { type: "absolute", value: 0 },
+     *             startTrim: 0,
+     *             endTrim: 0,
+     *             xOffset: 0,
+     *             yOffset: 0,
+     *             width: 1080,
+     *             height: 1920,
+     *             zIndex: 0,
+     *             scale: 1,
+     *             rotation: 0,
+     *             fit: "cover",
+     *             speed: 1,
+     *             opacity: 100,
+     *             volume: 50
+     *           }
+     *         ]
+     *       }
+     *     ]
+     *   }
+     * });
+     * ```
+     */
+    render(params: RenderVideoParams): Promise<ApiResponse<RenderVideoResponse>>;
+}

package/dist/video.js

@@ -0,0 +1,55 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VideoClient = void 0;
+const base_1 = require("./base");
+/**
+ * Client for video rendering operations
+ */
+class VideoClient extends base_1.BaseClient {
+    /**
+     * Render a video from an editor configuration
+     *
+     * @example
+     * ```typescript
+     * const result = await client.video.render({
+     *   editor: {
+     *     width: 1080,
+     *     height: 1920,
+     *     fps: 30,
+     *     duration: 5000,
+     *     channels: [
+     *       {
+     *         id: "background",
+     *         segments: [
+     *           {
+     *             id: "bg-video",
+     *             type: "video",
+     *             source: "https://example.com/video.mp4",
+     *             order: 0,
+     *             offset: { type: "absolute", value: 0 },
+     *             startTrim: 0,
+     *             endTrim: 0,
+     *             xOffset: 0,
+     *             yOffset: 0,
+     *             width: 1080,
+     *             height: 1920,
+     *             zIndex: 0,
+     *             scale: 1,
+     *             rotation: 0,
+     *             fit: "cover",
+     *             speed: 1,
+     *             opacity: 100,
+     *             volume: 50
+     *           }
+     *         ]
+     *       }
+     *     ]
+     *   }
+     * });
+     * ```
+     */
+    async render(params) {
+        return this.post('/video/render', params);
+    }
+}
+exports.VideoClient = VideoClient;

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "ugcinc",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "description": "TypeScript/JavaScript client for the UGC Inc API",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "scripts": {
-    "build": "tsc",
+    "prebuild": "node -e \"const fs = require('fs'); const path = require('path'); const srcDir = path.join(__dirname, '../../src/video-render/types'); const destDir = path.join(__dirname, 'src/video-render-types'); fs.mkdirSync(destDir, {recursive: true}); ['segment.ts', 'video.ts'].forEach(file => fs.copyFileSync(path.join(srcDir, file), path.join(destDir, file)));\"",
+    "build": "npm run prebuild && tsc",
     "prepublishOnly": "npm run build",
     "test": "echo \"No tests specified\" && exit 0"
   },