Add Caret Swap to the Catalog

Author: AksharP5Created Sep 12, 2026Updated Sep 12, 2026

Problem

Creating a caret wipe that replaces one phrase with another requires coordinating the wipe, text layout and typing. This should be a reusable Catalog effect with editable text and styling.

Proposed solution

Add a native HTML/GSAP caret-swap component. A gradient caret covers the first phrase, collapses to the left, then types and centers its replacement. Expose the phrases, text styling and gradient colors, preserve seeking, and fit the text and timing to the mount.

Reference

Hyfrme example, based on Remocn's MIT-licensed source.

The implementation, catalog docs and rendered preview are prepared in the linked PR.