slot-text — tiny text roll animation

Text roll animation for tiny, tactile UI labels. Now rolls by character or whole word. import { slotText } from "slot-text"; import "slot-text/style.css"; const label = slotText(el, "Save"); label.set("Changes saved", { rollBy: "word", });import { SlotText } from "slot-text/react"; import "slot-text/style.css"; <SlotText text="Changes saved" options={{ rollBy: "word" }} />import { SlotText } from "slot-text/vue"; import "slot-text/style.css"; <SlotText text="Changes saved" :options="{ rollBy: 'word' }" />import { slotText } from "slot-text/solid"; import "slot-text/style.css"; <span use:slotText={{ text: "Changes saved", options: { rollBy: "word" }, }} />import { slotText } from "slot-text/svelte"; import "slot-text/style.css"; <span use:slotText={{ text: "Changes saved", options: { rollBy: "word" }, }} ></span> Character or whole-word roll with spring easing Per-segment stagger and duration controls set and flash with spam-safe interrupt handling Per-segment color, chromatic() rainbow helper React, Vue, Solid, and Svelte adapters Zero dependencies, ~1 kB of CSS Real browser tests — suite runs in actual Chromium, every roll and cleanup tested where it happens Reduced motion — respects prefers-reduced-motion, text swaps instantly Screen reader support — animation stays visual-only, assistive tech reads the final text once Full emoji and grapheme support — rolls as one character, not four Stable API — locked surface, strict semver, changelog. Safe to build on Zero-setup styles — no separate CSS import, it just works (CSS file stays for strict-CSP) Awaitable rolls — await label.set("Done") and get notified when the last character lands Number mode — odometer-style digit rolling, each digit takes the shortest path Scramble style — characters spin through random glyphs before landing Stagger origin — roll from start, end, center, or random order Timing presets — snappy, smooth, playful — three tuned defaults <slot-text> web component — one tag for Angular, Astro, or plain HTML Docs site with live playground — tweak options, copy the code