/**
 * Custom emoji/sticker node for TipTap.
 * Supports inserting image-based stickers into the editor.
 */

import { Node, mergeAttributes } from '@tiptap/core';

export const CustomEmojiNode = Node.create({
  name: 'emoji',
  group: 'inline',
  inline: true,
  selectable: false,
  atom: true,

  addAttributes() {
    return {
      name: { default: '' },
      url: { default: '' },
    };
  },

  parseHTML() {
    return [{ tag: 'img[data-emoji]' }];
  },

  renderHTML({ HTMLAttributes }) {
    return [
      'img',
      mergeAttributes(HTMLAttributes, {
        'data-emoji': '',
        class: 'inline-block w-6 h-6 align-middle mx-0.5 select-none',
      }),
    ];
  },
});
