Video Composition

Build video scenes with Editframe elements. Use web components, for example <ef-timegroup> and <ef-video>. Or use React components, for example <Timegroup> and <Video>. Both syntaxes share the same composition model and the same rendering pipeline. Pick the syntax that fits your project.

Web component attributes use kebab-case, for example file-id and api-host. React props use camelCase, for example fileId and apiHost. Four attributes break this pattern: sourcein, sourceout, trimstart, and trimend. Each of these uses the same lowercase string as both the HTML attribute and the React prop. The Element Reference section lists both forms for every attribute.

Let Editframe control time and media

Editframe owns the composition clock and every media source. Build timing and media with Editframe elements and attributes. Use CSS for layout and appearance. Use JavaScript for computed visuals inside the Editframe frame hooks.