KQ-013 · FOCUS/TEXT
Focus Text
Copy that resolves under the lens — words sharpen from an 8px blur like a microscope focus-pull, cascaded under the 600ms budget.
KQ-013 · FOCUS/TEXT
FIELD NOTE 07
Precision is a feeling. You know a good spring the moment your cursor touches it.
calibrated to the millisecond
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/focus-text
Props
- children
- string
- default —
- The copy to resolve.
- as
- "span" | "div" | "p" | "h1"–"h4"
- default "span"
- Rendered element.
- by
- "word" | "char"
- default "word"
- Split granularity; char mode never breaks mid-word.
- trigger / once
- "inView" | "mount" / boolean
- default "inView" / true
- When the pull runs, and whether it re-blurs out of view.
- stagger / startDelay
- number
- default —
- Seconds between units (defaults to the cascade budget) and lead-in delay.
| Prop | Type | Default | Description |
|---|---|---|---|
| children | string | — | The copy to resolve. |
| as | "span" | "div" | "p" | "h1"–"h4" | "span" | Rendered element. |
| by | "word" | "char" | "word" | Split granularity; char mode never breaks mid-word. |
| trigger / once | "inView" | "mount" / boolean | "inView" / true | When the pull runs, and whether it re-blurs out of view. |
| stagger / startDelay | number | — | Seconds between units (defaults to the cascade budget) and lead-in delay. |