Repository navigation
Releases: ariefsn/svelte-video-editor
Releases · ariefsn/svelte-video-editor
Release list
[v1.2.0] - 2026-09-29
What's Changed
- feat(demo): add local file import to advanced demo and document
binImportby @ariefsn in #3 - feat(lib): add framework-free ./pure subpath with shared render helpers by @ariefsn in #4
Full Changelog: v1.1.0...v1.2.0
[v1.1.0] - 2026-06-15
[1.1.0] - 2026-06-15
Changed (breaking)
- i18n message keys renamed
snake_case→camelCase. Every key in theMessages/
MessagesOverridecatalog is now camelCase (e.g.add_text→addText,
background_opacity→backgroundOpacity,op_blocked_locked→opBlockedLocked). Hosts
that pass amessagesoverride must rename their keys to match. The exported type names
(Messages,MessageKey,MessagesOverride) are unchanged.
Added
- Customizable preview background — the composition background (previously always black) can
now be a solid color or a linear gradient, picked from a swatch button in the toolbar
(and the bottom zoom bar on mobile). Each category has a full-width Solid/Gradient tab, 20
presets, and custom pickers (gradient = two stops + angle), plus a transparent option. Stored on
the project asProjectBackground(backgroundfield;null= transparent) and exposed via the
purebackgroundCss()helper so hosts render the same background on export. Older projects
default to solid black, preserving the previous look. New exports:ProjectBackground,
defaultProjectBackground,BACKGROUND_SOLID_PRESETS,BACKGROUND_GRADIENT_PRESETS,
backgroundCss. - Text clip border — per-text-clip border with a toggle, color picker, and width
(TextClipStyle.borderColor/borderWidthPct), mirroring the existing background control. - Customizable text shadow — when a text clip's shadow is enabled, its color, blur, and
offset are now editable (TextClipStyle.shadowColor/shadowBlurPct/shadowOffsetPct)
instead of a fixed black drop shadow. Older projects fall back to the previous look. - Animation enter/exit tabs — the inspector's Animation section now switches between
"On enter" and "On exit" with a tab instead of stacking both control sets.
Changed
- Select dropdowns now render a custom chevron (
appearance-none+ padding) so the arrow has
comfortable spacing from the edge instead of sitting flush against it (affects the frame-rate,
easing, and preset dropdowns). - Popover gained an opt-in
fixedmode that positions the panel in a viewport-clamped fixed
layer, so popovers can't be clipped by an ancestor'soverflow(used by the background picker
inside the toolbar / bottom bar). - Wider zoom-out range — the timeline minimum zoom (
ZOOM_MIN) drops from 10 to 5 px/sec,
letting long projects zoom out further. - Group is now a toggle —
groupSelection()(⌘G) ungroups a selection that is already a
single group instead of reassigning a new group id (which only recolored it). Ungroup also
stays available explicitly via ⌘⇧G.
Fixed
- Older projects now backfill newly-added text style fields during migration, so the inspector's
Background/Border toggles always match what's rendered (previously an absent field could show a
toggle in the wrong state).
[v1.0.0] - 2026-06-14
Initial public release of @ariefsn/svelte-video-editor — a host-agnostic, Svelte 5
video timeline editor with zero design-system dependency.
Added
- Timeline editing — clips, tracks, and trimming with CapCut/Premiere-style edits:
ripple, roll, and slip. Includes clip grouping, linked audio, markers, in/out range
selection, and full undo/redo history. - Clip transitions — per-clip enter/exit animations (
fade,slide-left,slide-right,
slide-up,slide-down,scale,zoom,bounce,pop,spin,blur,wipe,flip)
with frame-based duration and easing (linear,ease-in,ease-out,ease-in-out),
scrubbed live by the playhead from the inspector's Animation section. Exposes the
ClipAnimation,ClipTransition,AnimPreset, andEasingtypes plusANIM_PRESETS,
EASINGS,defaultTransition, and the pureclipAnimStyle(clip, playheadSec, fps)helper
so hosts render transitions frame-for-frame on export. Each clip'sanimationround-trips
through the project JSON. - Real-time DOM preview —
<video>/<audio>/canvas playback driven by
requestAnimationFrame, fully replaceable with a custom preview renderer
(Remotion, canvas, WebGL compositor, …). - Host-agnostic contract — all external concerns (asset URLs, thumbnails, export,
permissions, persistence, notifications, confirmation, i18n) are injected by the host.
The library owns no storage and persists nothing itself. - Responsive & mobile-ready UI — the media bin and clip inspector collapse into bottom
sheets, the toolbar folds into an overflow menu, clip options are reachable by touch, and
keyboard shortcuts are centrally managed. - Customization — replace any editor section via snippets receiving
SectionCtx;
Tailwind v4 theming through--ts-*CSS variables with built-in light/dark palettes; and
localization via the i18n message catalog. - Atomic-design component library — atoms / molecules / organisms built with Svelte 5
runes and strict TypeScript, with zero design-system dependency (no shadcn or bits-ui).
Public API and theme tokens are exported fromsrc/lib/index.tsand the shippedapp.css.