Message Highlight Chat Block for Svelte

Everything. The thread and the two starting notes are typed, replies to what you send come from a short script and notes live in this page's state only. A real version saves a note as the message id, the start and end offsets and the text, and reads them back into notes; the marks, the pane and Jump are all drawn from that list.

As character offsets into the message text, never as positions in the page. A message is cut into plain pieces and marked pieces by one helper, each piece carries its start offset, and a selection is turned back into offsets by reading those. A re-render, a new note or a removed one cannot move a mark. Two notes cannot overlap, and the status line says so if you try.

Each teammate's message has a Highlight a sentence button in its footer. It lists the message's sentences, and choosing one opens the note field for it. In the field, Enter saves and Escape cancels, and on saving focus moves to the Notes heading. Edit and Remove are buttons on each card.

It scrolls the log, never the page, so the message sits about a third from the top, rings it for a moment and focuses it. On a phone it switches to Chat first. With reduced motion the ring stays until the next jump.

A selection that spans two messages, or starts in your own message, is ignored: the button only appears for words inside one teammate's message, and the status line states the phrase. Words that already have a note say "Those words already have a note."

Below the medium breakpoint a Chat and Notes switch sits under the top bar and one view shows at a time. Selecting words works with a long press, and the footer button appears the same way. The window keeps its height and only the log scrolls, even at 320 px wide.