@skyastrall/mentions-core

Framework-agnostic engine for trigger detection, markup parsing, and mention state management. Zero dependencies. Runs in Node.js, browser, or any JS runtime.

Docs · Playground · GitHub

Most users should install a framework adapter instead: @skyastrall/mentions-react or @skyastrall/mentions-vue. This package is for building custom adapters or server-side usage.

Install

npm install @skyastrall/mentions-core

What's Inside

• MentionController — subscribe/getState pattern for framework-agnostic state management
• State machine — pure reducer for mention lifecycle (idle → suggesting → navigating → loading)
• Markup parser — parseMarkup(), extractMentions(), markupToPlainText()
• Trigger detection — O(n) backward scan, no regex backtracking
• ARIA props — connect() generates combobox/listbox attributes
• DOM utilities — buildMentionHTML(), performMentionInsertion(), getCaretRect(), restoreCursor()
• CSS variables — --mention-bg, --mention-color, --mention-radius for theming
• ~9KB gzipped, zero dependencies

Server-Side Usage

import { extractMentions, markupToPlainText } from "@skyastrall/mentions-core";

const markup = "@[Alice](1) said #[urgent](t1)";
const triggers = [{ char: "@", data: [] }, { char: "#", data: [] }];

const mentions = extractMentions(markup, triggers);
const plain = markupToPlainText(markup, triggers);

License

MIT — Built by SkyAstrall