/**
 * TipTap Mention Node — inline atom for @mentions, #channels, /commands.
 * Renders via MentionView React NodeView with type-specific coloring.
 */

import { Node, mergeAttributes } from '@tiptap/core';
import { ReactNodeViewRenderer } from '@tiptap/react';
import MentionView from './MentionView';

export const MentionNodeType = Node.create({
  name: 'mention',
  group: 'inline',
  inline: true,
  selectable: true,
  atom: true,

  addAttributes() {
    return {
      id: { default: null },
      label: { default: null },
      type: { default: 'user' },
    };
  },

  parseHTML() {
    return [{ tag: 'span[data-mention]' }];
  },

  renderHTML({ HTMLAttributes }) {
    return ['span', mergeAttributes({ 'data-mention': '' }, HTMLAttributes)];
  },

  addNodeView() {
    return ReactNodeViewRenderer(MentionView);
  },
});