Lyrics editorPro
Structured verse, chorus and bridge sections with syllable hints and a rewrite per section.
On this page
ProVerses and choruses with syllable counts; rewrite one section.
Installation
Usage
import { LyricsEditor } from "@/components/ui/chatcn/pro/lyrics-editor"
<LyricsEditor sections={sections} onSectionsChange={setSections} onRegenerate={rewrite} />Sections number themselves the way songwriters count them. Each line shows an English syllable estimate; a line four or more syllables off its section's usual length is marked, so the meter holds. Enter adds a line, Backspace on an empty line removes it. Rewrite replaces one section and leaves the rest alone.
Examples
States
ProA rewrite that fails, and an empty song.
Props
| Prop | Type | Notes |
|---|---|---|
sections, onSectionsChange | { id, kind, lines }[] | kind: intro, verse, pre-chorus, chorus, bridge, outro |
onRegenerate | (section) => Promise<string[]> | Reject with a message to show it |
Accessibility
- Each section is a fieldset named by its label; every line is named by section and number.
- The meter flag has an icon and a hidden explanation.