@miliastry/quasar 1.0.0 → 1.0.2

package/dist/Visuals/lyne.css

@@ -52,6 +52,13 @@
   border-bottom-color: var(--color-accent, #2EE6E2) !important;
 }
 
+/* Forum @mentions — inherit the accent link look, slightly bolder so they
+   read as handles rather than plain links. */
+.bbcode-preview-lyne a.bb-mention,
+.bbcode-preview.theme-lyne a.bb-mention {
+  font-weight: 600 !important;
+}
+
 /* ─── 45° Cut Panels ────────────────────────────────────────────────────── */
 
 .bb-cut-panel {

package/dist/index.d.mts

@@ -2298,6 +2298,15 @@ interface HTMLRendererOptions {
         href: string;
         external?: boolean;
     } | null;
+    /**
+     * Forum-style `@mention` linkifier. Called with the bare name (no `@`);
+     * return null to leave the mention as plain text. Used by forum hosts that
+     * linkify `@username` to a profile route.
+     */
+    mentionResolver?: (name: string) => {
+        href: string;
+        external?: boolean;
+    } | null;
 }
 declare class HTMLRenderer extends Visitor<string> {
     private options;
@@ -2389,6 +2398,13 @@ declare class HTMLRenderer extends Visitor<string> {
      * mantenga vivos los nodos del árbol.
      */
     static idMode: 'blocks' | 'all' | 'none';
+    /**
+     * Nesting depth of `[tables]` while rendering. `[col]`/`[row]`/`[th]` are
+     * table cells only INSIDE a `[tables]`; orphaned ones (e.g. `[col]` inside
+     * `[columns]`, or stray cells) render as plain inline spans — the same rule
+     * LYNE's forum renderer applies.
+     */
+    private tableDepth;
     private idAttr;
     /**
      * Kinds that carry `data-node-id`.
@@ -2523,6 +2539,24 @@ declare class HTMLRenderer extends Visitor<string> {
      * returns the input untouched in that common case, then does a single pass
      * when there is actually something to escape.
      */
+    /** Resolver configured at construction (read through a getter for brevity). */
+    private get mentionResolver();
+    /**
+     * `@mention` shape used by forum hosts: 3-15 word chars, boundaries that
+     * exclude longer usernames (same rule LYNE's forum uses). Non-global so
+     * `lastIndex` never leaks between calls.
+     */
+    private static readonly MENTION_RE;
+    /**
+     * Linkify `@username` runs in a plain-text leaf. Runs through the resolver;
+     * null leaves the run as text. Every interpolated string is HTML-escaped,
+     * and hrefs with dangerous protocols (javascript:, data:, vbscript:) are
+     * rejected — the mention stays as plain text even if the resolver returns
+     * one (defence in depth; the resolver itself should never produce it).
+     */
+    private linkifyMentions;
+    /** Root-relative, http(s), mailto and line:// hrefs are the only safe shapes. */
+    private isSafeMentionHref;
     private escapeHtml;
 }
 

package/dist/index.d.ts

@@ -2298,6 +2298,15 @@ interface HTMLRendererOptions {
         href: string;
         external?: boolean;
     } | null;
+    /**
+     * Forum-style `@mention` linkifier. Called with the bare name (no `@`);
+     * return null to leave the mention as plain text. Used by forum hosts that
+     * linkify `@username` to a profile route.
+     */
+    mentionResolver?: (name: string) => {
+        href: string;
+        external?: boolean;
+    } | null;
 }
 declare class HTMLRenderer extends Visitor<string> {
     private options;
@@ -2389,6 +2398,13 @@ declare class HTMLRenderer extends Visitor<string> {
      * mantenga vivos los nodos del árbol.
      */
     static idMode: 'blocks' | 'all' | 'none';
+    /**
+     * Nesting depth of `[tables]` while rendering. `[col]`/`[row]`/`[th]` are
+     * table cells only INSIDE a `[tables]`; orphaned ones (e.g. `[col]` inside
+     * `[columns]`, or stray cells) render as plain inline spans — the same rule
+     * LYNE's forum renderer applies.
+     */
+    private tableDepth;
     private idAttr;
     /**
      * Kinds that carry `data-node-id`.
@@ -2523,6 +2539,24 @@ declare class HTMLRenderer extends Visitor<string> {
      * returns the input untouched in that common case, then does a single pass
      * when there is actually something to escape.
      */
+    /** Resolver configured at construction (read through a getter for brevity). */
+    private get mentionResolver();
+    /**
+     * `@mention` shape used by forum hosts: 3-15 word chars, boundaries that
+     * exclude longer usernames (same rule LYNE's forum uses). Non-global so
+     * `lastIndex` never leaks between calls.
+     */
+    private static readonly MENTION_RE;
+    /**
+     * Linkify `@username` runs in a plain-text leaf. Runs through the resolver;
+     * null leaves the run as text. Every interpolated string is HTML-escaped,
+     * and hrefs with dangerous protocols (javascript:, data:, vbscript:) are
+     * rejected — the mention stays as plain text even if the resolver returns
+     * one (defence in depth; the resolver itself should never produce it).
+     */
+    private linkifyMentions;
+    /** Root-relative, http(s), mailto and line:// hrefs are the only safe shapes. */
+    private isSafeMentionHref;
     private escapeHtml;
 }
 

package/dist/index.js

@@ -4816,7 +4816,8 @@ var HTMLRenderer = class _HTMLRenderer extends Visitor {
       dialect: options.dialect ?? (options.theme === "lyne" ? "lyne" : "miliastry"),
       theme: options.theme ?? (options.dialect === "lyne" ? "lyne" : "osu"),
       mediaProxy: options.mediaProxy,
-      entityLinkResolver: options.entityLinkResolver
+      entityLinkResolver: options.entityLinkResolver,
+      mentionResolver: options.mentionResolver
     };
   }
   // ─── Tag → HTML Element Map ─────────────────────────────
@@ -4966,6 +4967,13 @@ var HTMLRenderer = class _HTMLRenderer extends Visitor {
    * mantenga vivos los nodos del árbol.
    */
   static idMode = "all";
+  /**
+   * Nesting depth of `[tables]` while rendering. `[col]`/`[row]`/`[th]` are
+   * table cells only INSIDE a `[tables]`; orphaned ones (e.g. `[col]` inside
+   * `[columns]`, or stray cells) render as plain inline spans — the same rule
+   * LYNE's forum renderer applies.
+   */
+  tableDepth = 0;
   idAttr(node) {
     if (_HTMLRenderer.idMode === "none") return "";
     if (_HTMLRenderer.idMode === "all") return ` data-node-id="${node.id}"`;
@@ -5038,7 +5046,7 @@ var HTMLRenderer = class _HTMLRenderer extends Visitor {
   // ─── Node Rendering ─────────────────────────────────────
   renderNode(node) {
     if (node.children.length === 0 && node.kind === "text") {
-      let out = this.escapeHtml(node.text);
+      let out = this.mentionResolver ? this.linkifyMentions(node.text) : this.escapeHtml(node.text);
       const style = node.metadata?.style;
       if (style) {
         const inlineStyles = [];
@@ -5123,12 +5131,12 @@ var HTMLRenderer = class _HTMLRenderer extends Visitor {
       case "tables":
         return this.renderTables(node);
       case "table_row":
-        return this.wrapBlock("tr", node);
+        return this.tableDepth > 0 ? this.wrapBlock("tr", node) : this.wrapInline("span", node);
       case "table_col":
-        return this.wrapInline("td", node);
+        return this.tableDepth > 0 ? this.wrapInline("td", node) : this.wrapInline("span", node);
       case "table_th": {
         const content = this.renderChildren(node);
-        return `<th${this.idAttr(node)} class="bb-th"><span class="bb-table-badge">${content}</span></th>`;
+        return this.tableDepth > 0 ? `<th${this.idAttr(node)} class="bb-th"><span class="bb-table-badge">${content}</span></th>` : this.wrapInline("span", node);
       }
       case "gallery":
         return this.renderGallery(node);
@@ -5467,7 +5475,9 @@ var HTMLRenderer = class _HTMLRenderer extends Visitor {
       variants.has("striped") ? "bb-table-striped" : "",
       variants.has("borders") ? "bb-table-borders" : ""
     ].filter(Boolean).join(" ");
+    this.tableDepth++;
     const content = this.renderChildren(node);
+    this.tableDepth--;
     const accent = this.boxAccentStyle(node, "table");
     return `<div${this.idAttr(node)} class="bb-table-frame"${accent}><table class="${tableClasses}"><tbody>${content}</tbody></table></div>`;
   }
@@ -5834,6 +5844,51 @@ var HTMLRenderer = class _HTMLRenderer extends Visitor {
    * returns the input untouched in that common case, then does a single pass
    * when there is actually something to escape.
    */
+  /** Resolver configured at construction (read through a getter for brevity). */
+  get mentionResolver() {
+    return this.options.mentionResolver;
+  }
+  /**
+   * `@mention` shape used by forum hosts: 3-15 word chars, boundaries that
+   * exclude longer usernames (same rule LYNE's forum uses). Non-global so
+   * `lastIndex` never leaks between calls.
+   */
+  static MENTION_RE = /(?<![A-Za-z0-9_-])@([A-Za-z0-9_-]{3,15})(?![A-Za-z0-9_-])/g;
+  /**
+   * Linkify `@username` runs in a plain-text leaf. Runs through the resolver;
+   * null leaves the run as text. Every interpolated string is HTML-escaped,
+   * and hrefs with dangerous protocols (javascript:, data:, vbscript:) are
+   * rejected — the mention stays as plain text even if the resolver returns
+   * one (defence in depth; the resolver itself should never produce it).
+   */
+  linkifyMentions(text) {
+    const resolver = this.options.mentionResolver;
+    if (!resolver) return this.escapeHtml(text);
+    let out = "";
+    let last = 0;
+    _HTMLRenderer.MENTION_RE.lastIndex = 0;
+    let m;
+    while ((m = _HTMLRenderer.MENTION_RE.exec(text)) !== null) {
+      if (m.index > last) out += this.escapeHtml(text.slice(last, m.index));
+      const name = m[1];
+      const link = resolver(name);
+      if (link && this.isSafeMentionHref(link.href)) {
+        const ext = link.external ? ' target="_blank" rel="noopener"' : "";
+        out += `<a class="bb-mention" href="${this.escapeHtml(link.href)}"${ext}>@${this.escapeHtml(name)}</a>`;
+      } else {
+        out += this.escapeHtml(m[0]);
+      }
+      last = m.index + m[0].length;
+    }
+    if (last < text.length) out += this.escapeHtml(text.slice(last));
+    return out;
+  }
+  /** Root-relative, http(s), mailto and line:// hrefs are the only safe shapes. */
+  isSafeMentionHref(href) {
+    const h = href.trim();
+    if (h.startsWith("/") && !h.startsWith("//")) return true;
+    return /^(https?:|mailto:|line:)/i.test(h);
+  }
   escapeHtml(text) {
     if (!_HTMLRenderer.HTML_ESCAPE_RE.test(text)) return text;
     let out = "";

package/dist/index.mjs

@@ -4814,7 +4814,8 @@ var HTMLRenderer = class _HTMLRenderer extends Visitor {
       dialect: options.dialect ?? (options.theme === "lyne" ? "lyne" : "miliastry"),
       theme: options.theme ?? (options.dialect === "lyne" ? "lyne" : "osu"),
       mediaProxy: options.mediaProxy,
-      entityLinkResolver: options.entityLinkResolver
+      entityLinkResolver: options.entityLinkResolver,
+      mentionResolver: options.mentionResolver
     };
   }
   // ─── Tag → HTML Element Map ─────────────────────────────
@@ -4964,6 +4965,13 @@ var HTMLRenderer = class _HTMLRenderer extends Visitor {
    * mantenga vivos los nodos del árbol.
    */
   static idMode = "all";
+  /**
+   * Nesting depth of `[tables]` while rendering. `[col]`/`[row]`/`[th]` are
+   * table cells only INSIDE a `[tables]`; orphaned ones (e.g. `[col]` inside
+   * `[columns]`, or stray cells) render as plain inline spans — the same rule
+   * LYNE's forum renderer applies.
+   */
+  tableDepth = 0;
   idAttr(node) {
     if (_HTMLRenderer.idMode === "none") return "";
     if (_HTMLRenderer.idMode === "all") return ` data-node-id="${node.id}"`;
@@ -5036,7 +5044,7 @@ var HTMLRenderer = class _HTMLRenderer extends Visitor {
   // ─── Node Rendering ─────────────────────────────────────
   renderNode(node) {
     if (node.children.length === 0 && node.kind === "text") {
-      let out = this.escapeHtml(node.text);
+      let out = this.mentionResolver ? this.linkifyMentions(node.text) : this.escapeHtml(node.text);
       const style = node.metadata?.style;
       if (style) {
         const inlineStyles = [];
@@ -5121,12 +5129,12 @@ var HTMLRenderer = class _HTMLRenderer extends Visitor {
       case "tables":
         return this.renderTables(node);
       case "table_row":
-        return this.wrapBlock("tr", node);
+        return this.tableDepth > 0 ? this.wrapBlock("tr", node) : this.wrapInline("span", node);
       case "table_col":
-        return this.wrapInline("td", node);
+        return this.tableDepth > 0 ? this.wrapInline("td", node) : this.wrapInline("span", node);
       case "table_th": {
         const content = this.renderChildren(node);
-        return `<th${this.idAttr(node)} class="bb-th"><span class="bb-table-badge">${content}</span></th>`;
+        return this.tableDepth > 0 ? `<th${this.idAttr(node)} class="bb-th"><span class="bb-table-badge">${content}</span></th>` : this.wrapInline("span", node);
       }
       case "gallery":
         return this.renderGallery(node);
@@ -5465,7 +5473,9 @@ var HTMLRenderer = class _HTMLRenderer extends Visitor {
       variants.has("striped") ? "bb-table-striped" : "",
       variants.has("borders") ? "bb-table-borders" : ""
     ].filter(Boolean).join(" ");
+    this.tableDepth++;
     const content = this.renderChildren(node);
+    this.tableDepth--;
     const accent = this.boxAccentStyle(node, "table");
     return `<div${this.idAttr(node)} class="bb-table-frame"${accent}><table class="${tableClasses}"><tbody>${content}</tbody></table></div>`;
   }
@@ -5832,6 +5842,51 @@ var HTMLRenderer = class _HTMLRenderer extends Visitor {
    * returns the input untouched in that common case, then does a single pass
    * when there is actually something to escape.
    */
+  /** Resolver configured at construction (read through a getter for brevity). */
+  get mentionResolver() {
+    return this.options.mentionResolver;
+  }
+  /**
+   * `@mention` shape used by forum hosts: 3-15 word chars, boundaries that
+   * exclude longer usernames (same rule LYNE's forum uses). Non-global so
+   * `lastIndex` never leaks between calls.
+   */
+  static MENTION_RE = /(?<![A-Za-z0-9_-])@([A-Za-z0-9_-]{3,15})(?![A-Za-z0-9_-])/g;
+  /**
+   * Linkify `@username` runs in a plain-text leaf. Runs through the resolver;
+   * null leaves the run as text. Every interpolated string is HTML-escaped,
+   * and hrefs with dangerous protocols (javascript:, data:, vbscript:) are
+   * rejected — the mention stays as plain text even if the resolver returns
+   * one (defence in depth; the resolver itself should never produce it).
+   */
+  linkifyMentions(text) {
+    const resolver = this.options.mentionResolver;
+    if (!resolver) return this.escapeHtml(text);
+    let out = "";
+    let last = 0;
+    _HTMLRenderer.MENTION_RE.lastIndex = 0;
+    let m;
+    while ((m = _HTMLRenderer.MENTION_RE.exec(text)) !== null) {
+      if (m.index > last) out += this.escapeHtml(text.slice(last, m.index));
+      const name = m[1];
+      const link = resolver(name);
+      if (link && this.isSafeMentionHref(link.href)) {
+        const ext = link.external ? ' target="_blank" rel="noopener"' : "";
+        out += `<a class="bb-mention" href="${this.escapeHtml(link.href)}"${ext}>@${this.escapeHtml(name)}</a>`;
+      } else {
+        out += this.escapeHtml(m[0]);
+      }
+      last = m.index + m[0].length;
+    }
+    if (last < text.length) out += this.escapeHtml(text.slice(last));
+    return out;
+  }
+  /** Root-relative, http(s), mailto and line:// hrefs are the only safe shapes. */
+  isSafeMentionHref(href) {
+    const h = href.trim();
+    if (h.startsWith("/") && !h.startsWith("//")) return true;
+    return /^(https?:|mailto:|line:)/i.test(h);
+  }
   escapeHtml(text) {
     if (!_HTMLRenderer.HTML_ESCAPE_RE.test(text)) return text;
     let out = "";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@miliastry/quasar",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "description": "Quasar Document Engine - Advanced BBCode/Markdown/HTML AST Engine",
   "main": "src/index.ts",
   "types": "src/index.ts",

package/src/Tests/LyneMode.test.ts

@@ -183,5 +183,78 @@ describe('Lyne Mode & Dialect Isolation', () => {
       const exported = exporter.export(doc.root!)
       expect(exported).toBe('[wnotice=#ff0000]Be careful[/wnotice]')
     })
+
+    it('linkifies @mentions via mentionResolver and keeps unresolved ones as text', () => {
+      const doc = new BBCodeDocumentModel({
+        source: '[b]Hey @airi and @ghost[/b] tail',
+        mode: 'lyne',
+      })
+      const renderer = new HTMLRenderer({
+        registry: doc.tagRegistry,
+        dialect: 'lyne',
+        theme: 'lyne',
+        mentionResolver: (name) => (name === 'airi' ? { href: `/u/${name}`, external: false } : null),
+      })
+      const html = renderer.render(doc.root!)
+      expect(html).toContain('<a class="bb-mention" href="/u/airi">@airi</a>')
+      expect(html).toContain('@ghost')
+      expect(html).toContain('tail')
+    })
+
+    it('escapes mention names and rejects dangerous mention hrefs', () => {
+      const doc = new BBCodeDocumentModel({
+        source: 'Hi @evil"onclick="alert(1)',
+        mode: 'lyne',
+      })
+      const renderer = new HTMLRenderer({
+        registry: doc.tagRegistry,
+        dialect: 'lyne',
+        theme: 'lyne',
+        mentionResolver: () => ({ href: 'javascript:alert(1)', external: false }),
+      })
+      const html = renderer.render(doc.root!)
+      // Dangerous protocol → mention stays plain text, escaped
+      expect(html).not.toContain('javascript:')
+      expect(html).not.toContain('<a class="bb-mention"')
+      expect(html).toContain('&quot;')
+    })
+
+    it('allows safe mention hrefs (root-relative and http)', () => {
+      const doc = new BBCodeDocumentModel({
+        source: '@airi @jane',
+        mode: 'lyne',
+      })
+      const renderer = new HTMLRenderer({
+        registry: doc.tagRegistry,
+        dialect: 'lyne',
+        theme: 'lyne',
+        mentionResolver: (name) => ({
+          href: name === 'airi' ? `/u/${name}` : `https://example.com/u/${name}`,
+          external: name !== 'airi',
+        }),
+      })
+      const html = renderer.render(doc.root!)
+      expect(html).toContain('<a class="bb-mention" href="/u/airi">@airi</a>')
+      expect(html).toContain('<a class="bb-mention" href="https://example.com/u/jane" target="_blank" rel="noopener">@jane</a>')
+    })
+
+    it('renders [col] outside [tables] as a plain span, inside as td', () => {
+      const doc = new BBCodeDocumentModel({
+        source: `[columns=2][col]Left[/col][col]Right[/col][/columns]
+[tables][row][col]Cell[/col][/row][/tables]`,
+        mode: 'lyne',
+      })
+      const prev = HTMLRenderer.idMode
+      HTMLRenderer.idMode = 'none'
+      try {
+        const html = doc.toHTML()
+        // Orphaned [col] inside [columns] → span, not td
+        expect(html).toContain('<div class="bb-columns" style="column-count:2;"><span>Left</span><span>Right</span></div>')
+        // [col] inside [tables] stays a real cell
+        expect(html).toContain('<td>Cell</td>')
+      } finally {
+        HTMLRenderer.idMode = prev
+      }
+    })
   })
 })

package/src/Visitors/HTMLRenderer.ts

@@ -32,13 +32,20 @@ export interface HTMLRendererOptions {
   mediaProxy?: (url: string) => string
   /** Resolver for entity links like profile, guild, map */
   entityLinkResolver?: (kind: string, value: string) => { href: string; external?: boolean } | null
+  /**
+   * Forum-style `@mention` linkifier. Called with the bare name (no `@`);
+   * return null to leave the mention as plain text. Used by forum hosts that
+   * linkify `@username` to a profile route.
+   */
+  mentionResolver?: (name: string) => { href: string; external?: boolean } | null
 }
 
 export class HTMLRenderer extends Visitor<string> {
-  private options: Required<Omit<HTMLRendererOptions, 'registry' | 'mediaProxy' | 'entityLinkResolver'>> & {
+  private options: Required<Omit<HTMLRendererOptions, 'registry' | 'mediaProxy' | 'entityLinkResolver' | 'mentionResolver'>> & {
     registry?: TagRegistry
     mediaProxy?: (url: string) => string
     entityLinkResolver?: (kind: string, value: string) => { href: string; external?: boolean } | null
+    mentionResolver?: (name: string) => { href: string; external?: boolean } | null
   }
 
   constructor(options: HTMLRendererOptions = {}) {
@@ -50,6 +57,7 @@ export class HTMLRenderer extends Visitor<string> {
       theme: options.theme ?? (options.dialect === 'lyne' ? 'lyne' : 'osu'),
       mediaProxy: options.mediaProxy,
       entityLinkResolver: options.entityLinkResolver,
+      mentionResolver: options.mentionResolver,
     }
   }
 
@@ -160,6 +168,14 @@ export class HTMLRenderer extends Visitor<string> {
    */
   static idMode: 'blocks' | 'all' | 'none' = 'all'
 
+  /**
+   * Nesting depth of `[tables]` while rendering. `[col]`/`[row]`/`[th]` are
+   * table cells only INSIDE a `[tables]`; orphaned ones (e.g. `[col]` inside
+   * `[columns]`, or stray cells) render as plain inline spans — the same rule
+   * LYNE's forum renderer applies.
+   */
+  private tableDepth = 0
+
   private idAttr(node: RedNode): string {
     if (HTMLRenderer.idMode === 'none') return ''
     if (HTMLRenderer.idMode === 'all') return ` data-node-id="${node.id}"`
@@ -219,7 +235,9 @@ export class HTMLRenderer extends Visitor<string> {
   private renderNode(node: RedNode): string {
     // Leaf nodes
     if (node.children.length === 0 && node.kind === 'text') {
-      let out = this.escapeHtml(node.text)
+      let out = this.mentionResolver
+        ? this.linkifyMentions(node.text)
+        : this.escapeHtml(node.text)
       const style = node.metadata?.style as Record<string, string> | undefined
       if (style) {
         const inlineStyles = []
@@ -277,11 +295,13 @@ export class HTMLRenderer extends Visitor<string> {
       case 'imagemap': return this.renderImagemap(node)
       case 'align': return this.renderAlign(node)
       case 'tables': return this.renderTables(node)
-      case 'table_row': return this.wrapBlock('tr', node)
-      case 'table_col': return this.wrapInline('td', node)
+      case 'table_row': return this.tableDepth > 0 ? this.wrapBlock('tr', node) : this.wrapInline('span', node)
+      case 'table_col': return this.tableDepth > 0 ? this.wrapInline('td', node) : this.wrapInline('span', node)
       case 'table_th': {
         const content = this.renderChildren(node)
-        return `<th${this.idAttr(node)} class="bb-th"><span class="bb-table-badge">${content}</span></th>`
+        return this.tableDepth > 0
+          ? `<th${this.idAttr(node)} class="bb-th"><span class="bb-table-badge">${content}</span></th>`
+          : this.wrapInline('span', node)
       }
       case 'gallery': return this.renderGallery(node)
       case 'columns': return this.renderColumns(node)
@@ -642,7 +662,9 @@ export class HTMLRenderer extends Visitor<string> {
       variants.has('striped') ? 'bb-table-striped' : '',
       variants.has('borders') ? 'bb-table-borders' : '',
     ].filter(Boolean).join(' ')
+    this.tableDepth++
     const content = this.renderChildren(node)
+    this.tableDepth--
     // `[tables=striped:#hex]`: de `--table-accent` se deriva toda la paleta
     // de la tabla (gradiente del frame, hover de filas, encabezado, bordes).
     const accent = this.boxAccentStyle(node, 'table')
@@ -1054,6 +1076,56 @@ export class HTMLRenderer extends Visitor<string> {
    * returns the input untouched in that common case, then does a single pass
    * when there is actually something to escape.
    */
+  /** Resolver configured at construction (read through a getter for brevity). */
+  private get mentionResolver(): ((name: string) => { href: string; external?: boolean } | null) | undefined {
+    return this.options.mentionResolver
+  }
+
+  /**
+   * `@mention` shape used by forum hosts: 3-15 word chars, boundaries that
+   * exclude longer usernames (same rule LYNE's forum uses). Non-global so
+   * `lastIndex` never leaks between calls.
+   */
+  private static readonly MENTION_RE = /(?<![A-Za-z0-9_-])@([A-Za-z0-9_-]{3,15})(?![A-Za-z0-9_-])/g
+
+  /**
+   * Linkify `@username` runs in a plain-text leaf. Runs through the resolver;
+   * null leaves the run as text. Every interpolated string is HTML-escaped,
+   * and hrefs with dangerous protocols (javascript:, data:, vbscript:) are
+   * rejected — the mention stays as plain text even if the resolver returns
+   * one (defence in depth; the resolver itself should never produce it).
+   */
+  private linkifyMentions(text: string): string {
+    const resolver = this.options.mentionResolver
+    if (!resolver) return this.escapeHtml(text)
+
+    let out = ''
+    let last = 0
+    HTMLRenderer.MENTION_RE.lastIndex = 0
+    let m: RegExpExecArray | null
+    while ((m = HTMLRenderer.MENTION_RE.exec(text)) !== null) {
+      if (m.index > last) out += this.escapeHtml(text.slice(last, m.index))
+      const name = m[1]
+      const link = resolver(name)
+      if (link && this.isSafeMentionHref(link.href)) {
+        const ext = link.external ? ' target="_blank" rel="noopener"' : ''
+        out += `<a class="bb-mention" href="${this.escapeHtml(link.href)}"${ext}>@${this.escapeHtml(name)}</a>`
+      } else {
+        out += this.escapeHtml(m[0])
+      }
+      last = m.index + m[0].length
+    }
+    if (last < text.length) out += this.escapeHtml(text.slice(last))
+    return out
+  }
+
+  /** Root-relative, http(s), mailto and line:// hrefs are the only safe shapes. */
+  private isSafeMentionHref(href: string): boolean {
+    const h = href.trim()
+    if (h.startsWith('/') && !h.startsWith('//')) return true
+    return /^(https?:|mailto:|line:)/i.test(h)
+  }
+
   private escapeHtml(text: string): string {
     if (!HTMLRenderer.HTML_ESCAPE_RE.test(text)) return text
 

package/src/Visuals/lyne.css

@@ -52,6 +52,13 @@
   border-bottom-color: var(--color-accent, #2EE6E2) !important;
 }
 
+/* Forum @mentions — inherit the accent link look, slightly bolder so they
+   read as handles rather than plain links. */
+.bbcode-preview-lyne a.bb-mention,
+.bbcode-preview.theme-lyne a.bb-mention {
+  font-weight: 600 !important;
+}
+
 /* ─── 45° Cut Panels ────────────────────────────────────────────────────── */
 
 .bb-cut-panel {