Migration v0.3.0 → v0.3.1

Patch release. No breaking changes. Bug fixes for mention styling, dropdown positioning, and single-line mode.

Mention Text Color

Mention <mark> elements now include color: var(--mention-color, inherit). Previously, mention text was browser-default black, making it unreadable on dark backgrounds.

No action needed — inherit means mention text automatically matches your editor's text color. To customize:

[data-mentions-editor] {
  --mention-color: #1a1a2e;
}

Trigger Color Reactivity

Changing trigger colors at runtime (e.g., via a color picker) now updates existing mentions in the editor. Previously, only new mentions used the updated color.

Dropdown Scroll Positioning

The suggestion dropdown now repositions when the page scrolls. Previously, the dropdown stayed at its original viewport position, appearing detached from the editor after scrolling.

Single-Line Toggle

Toggling singleLine at runtime now properly strips existing newlines while preserving mention highlights. Previously, switching to single-line mode could destroy mention <mark> elements.

Vue: Scoped Slot Data

MentionsItem scoped slot now correctly passes { item, highlighted }:

<MentionsItem v-slot="{ item, highlighted }">
  <div :style="{ fontWeight: highlighted ? 600 : 400 }">
    {{ item.label }}
  </div>
</MentionsItem>

Vue: Reactive Single-Line

The singleLine / single-line prop is now fully reactive. Toggling it at runtime correctly adds/removes the beforeinput guard, strips existing newlines, and updates CSS.

New Core Export

restoreCursor(el, offset) — restores cursor to a plain-text character offset after innerHTML replacement. Useful for building custom adapters.