0.1.5 • Published 10 months ago
@pxjam/text-splitter v0.1.5
Text Splitter
A < 1Kb helper for splitting and wrapping each word/letter of text/html with a span tag with custom class and computable styles.
It does not use DOM API, so it can be used outside the browser (e.g. in Node.js for SSR).
Basic usage
npm install @pxjam/text-splitter
<p id="p">This is a <strong>HTML text</strong> that will be split into separate lines, words, and letters.</p>
import { TextSplitter } from '@pxjam/text-splitter'
const el = document.getElementById('p')
const letters = textSplitter(el.innerHTML, {
wordCls: 'W',
letterCls: 'L',
getWordStyle: (idx) => `transform: translateY(${idx * 5}px)`,
getLetterStyle: (idx) => `transform: translateX(${idx * 10}px)`
})
el.innerHTML = letters