@bylqwjc/media-editor-video 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 media-editor-sdk contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,55 @@
+# @media-editor/video
+
+框架无关视频编辑器运行时。内部封装 React 和完整视频编辑 UI，支持时间轴、剪辑、裁剪、调色、滤镜、标注、贴纸、比例、封面和导出。
+
+## 安装
+
+```bash
+pnpm add @media-editor/video @media-editor/styles
+```
+
+视频导出需要后端接口，通常配合 `@media-editor/server`。
+
+## 使用
+
+```ts
+import { mountVideoEditor } from '@media-editor/video';
+import '@media-editor/styles/theme.css';
+
+const handle = mountVideoEditor(el, {
+  source: videoFile,
+  baseUrl: '/api/editor',
+  locale: 'zh',
+  theme: 'dark',
+  onExported: async (blob, filename) => {
+    await saveVideoToYourApp(blob, filename);
+  },
+  onError: console.error,
+});
+
+handle.update({ locale: 'en' });
+handle.destroy();
+```
+
+`locale` 支持 `zh`、`en`、`es` 和 `zh-Hant`。
+
+`source` 传 `File` 后，编辑器打开即导入该视频文件；用户不需要再在编辑器内点「+ 视频」。如果业务侧只有远程视频 URL，建议先由业务应用 fetch 成 `File` 再传入，保证导出时能上传原始源文件。
+
+## Lazy
+
+```ts
+import { mountVideoEditorLazy, preloadVideoEditor } from '@media-editor/video/lazy';
+
+preloadVideoEditor();
+await mountVideoEditorLazy(el, options);
+```
+
+## 导出回调
+
+导出过程中编辑器会显示 loading。导出成功后触发:
+
+```ts
+onExported: (blob: Blob, filename: string) => void
+```
+
+如果需要接入自定义鉴权或上传网关，可以传入 `client`，覆盖默认 `baseUrl + /api/editor/video` 行为。

package/dist/chunk-EK7ODJWE.js

@@ -0,0 +1 @@
+var l=Object.create,a=Object.defineProperty,n=Object.getOwnPropertyDescriptor,f=Object.getOwnPropertyNames,u=Object.getPrototypeOf,O=Object.prototype.hasOwnProperty,c=(r,e)=>()=>(e||r((e={exports:{}}).exports,e),e.exports),s=(r,e,t,p)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of f(e))!O.call(r,o)&&o!==t&&a(r,o,{get:()=>e[o],enumerable:!(p=n(e,o))||p.enumerable});return r},v=(r,e,t)=>(t=r!=null?l(u(r)):{},s(e||!r||!r.__esModule?a(t,"default",{value:r,enumerable:!0}):t,r));export{c as a,v as b};

package/dist/index-CX2iAapm.d.ts

@@ -0,0 +1,51 @@
+import { EditorLocale } from '@media-editor/core';
+import { VideoEditorEngine } from '@media-editor/core/engine';
+import { EditorClient } from '@media-editor/client';
+
+interface FullscreenToggleOptions {
+    mode?: 'overlay' | 'inline';
+    className?: string;
+}
+type VideoEditorFullscreenOptions = false | (FullscreenToggleOptions & {
+    /** Element that should enter fullscreen. Defaults to the editor target. */
+    target?: HTMLElement;
+    /** Element that should receive the toggle button. Defaults to the editor target. */
+    buttonContainer?: HTMLElement | null;
+});
+interface MountVideoEditorOptions {
+    /** 初始视频文件;传入后会像图片编辑器一样打开即导入,无需用户再点一次「+ 视频」 */
+    source?: File;
+    /** 文案语言,默认 'zh' */
+    locale?: EditorLocale;
+    /** 明暗:'auto'(默认跟随系统)/ 'light' / 'dark' */
+    theme?: 'auto' | 'light' | 'dark';
+    /** 导出后端基址(未传 client 时建默认 client) */
+    baseUrl?: string;
+    /** 覆盖默认导出 client */
+    client?: EditorClient;
+    /** 复用外部引擎(跨组件共享);省略则内部自建 */
+    engine?: VideoEditorEngine;
+    /** 导出完成回调 */
+    onExported?: (blob: Blob, name: string) => void;
+    onError?: (err: Error) => void;
+    maxVideos?: number;
+    maxAudios?: number;
+    /** 全屏按钮配置;传 false 可关闭内置按钮,也可把按钮放进宿主返回栏 */
+    fullscreen?: VideoEditorFullscreenOptions;
+}
+interface VideoEditorHandle {
+    update(opts: MountVideoEditorOptions): void;
+    destroy(): void;
+}
+declare function mountVideoEditor(target: HTMLElement, opts?: MountVideoEditorOptions): VideoEditorHandle;
+
+type __index_MountVideoEditorOptions = MountVideoEditorOptions;
+declare const __index_VideoEditorEngine: typeof VideoEditorEngine;
+type __index_VideoEditorFullscreenOptions = VideoEditorFullscreenOptions;
+type __index_VideoEditorHandle = VideoEditorHandle;
+declare const __index_mountVideoEditor: typeof mountVideoEditor;
+declare namespace __index {
+  export { type __index_MountVideoEditorOptions as MountVideoEditorOptions, __index_VideoEditorEngine as VideoEditorEngine, type __index_VideoEditorFullscreenOptions as VideoEditorFullscreenOptions, type __index_VideoEditorHandle as VideoEditorHandle, __index_mountVideoEditor as mountVideoEditor };
+}
+
+export { type MountVideoEditorOptions as M, type VideoEditorHandle as V, __index as _, type VideoEditorFullscreenOptions as a, mountVideoEditor as m };

package/dist/index.d.ts

@@ -0,0 +1,61 @@
+import type { EditorClient } from '@media-editor/client';
+import type { EditorLocale } from '@media-editor/core';
+import type { VideoEditorEngine } from '@media-editor/core/engine';
+export { VideoEditorEngine } from '@media-editor/core/engine';
+
+interface FullscreenToggleOptions {
+    mode?: 'overlay' | 'inline';
+    className?: string;
+}
+
+export type VideoEditorFullscreenOptions = false | (FullscreenToggleOptions & {
+    target?: HTMLElement;
+    buttonContainer?: HTMLElement | null;
+});
+
+export interface MountVideoEditorOptions {
+    source?: File;
+    locale?: EditorLocale;
+    theme?: 'auto' | 'light' | 'dark';
+    baseUrl?: string;
+    client?: EditorClient;
+    engine?: VideoEditorEngine;
+    onExported?: (blob: Blob, name: string) => void;
+    onError?: (err: Error) => void;
+    maxVideos?: number;
+    maxAudios?: number;
+    fullscreen?: VideoEditorFullscreenOptions;
+    [key: string]: unknown;
+}
+
+export interface VideoEditorHandle {
+    update(opts: MountVideoEditorOptions): void;
+    destroy(): void;
+}
+
+export interface FitVideoEditorShellOptions {
+    height?: string;
+}
+
+export interface VideoEditorShellOptions {
+    append?: boolean;
+    backButton?: HTMLElement | string | false;
+    className?: string;
+    fitToViewport?: boolean;
+    height?: string;
+    hostClassName?: string;
+    actionsClassName?: string;
+    onBack?: (event: MouseEvent) => void;
+}
+
+export interface VideoEditorShellHandle {
+    shell: HTMLDivElement;
+    actions: HTMLDivElement;
+    host: HTMLDivElement;
+    backButton: HTMLElement | null;
+    destroy(): void;
+}
+
+export declare function fitVideoEditorShellToViewport(shell: HTMLElement, options?: FitVideoEditorShellOptions): () => void;
+export declare function createVideoEditorShell(parent: HTMLElement, options?: VideoEditorShellOptions): VideoEditorShellHandle;
+export declare function mountVideoEditor(target: HTMLElement, options?: MountVideoEditorOptions): VideoEditorHandle;