Issue with Custom Block Blot Affecting Default <p> Tag Behavior

[mignxu]

Hi, I'm facing an issue while working with a custom Blot that extends the Block blot. The problem is that it affects the behavior of the default <'p'> tag.

Specifically, when I try to insert a new line, it triggers the format method of my custom Blot. Also, since I added requiredContainer, the default <'p'> tag no longer behaves as expected. Instead, it wraps the line inside a blockquote, even when it's just a normal paragraph.

Can someone please help me understand how to fix this or provide guidance on preventing this unintended behavior?

Thanks in advance!

import Quill from "quill";

const Block = Quill.import("blots/block");
const TextBlot = Quill.import("blots/text");
const Cursor = Quill.import("blots/cursor");
const Break = Quill.import("blots/break");
const Container = Quill.import("blots/container");
const LinkBlot = Quill.import("formats/link");

// -------- container <blockquote /> --------
class QuoteContainerBlot extends Container {
  static create(value) {
    console.log('QuoteContainerBlot create =>', value);
    const domNode = super.create(value);
    return domNode;
  }

}

// -------- quote line <p /> --------
class CustomQuoteBlot extends Block {
  static blotName = "custom-quote";
  static register() {
    Quill.register(QuoteContainerBlot);
  }

  static create(value) {
    if (!value) {
      const domNode = super.create();
      return domNode;
    }
    console.log('create =>', value);
    const domNode = super.create();
    domNode.setAttribute("data-blockquote", "true");
    domNode.setAttribute("data-quote-type", value);
    Array.from(domNode.classList).forEach((item) => {
      domNode.classList.remove(item);
    });
    if (value !== 'default') {
      domNode.classList.add('md-alert', `md-alert-${value}`);
    }
    console.log(domNode);
    return domNode;
  }

  static formats(node) {
    if (node.getAttribute("data-blockquote") === "true") {
      return node.getAttribute("data-quote-type") || 'default';
    }
    return false;
  }

  format(name, value) {

    console.log('format =>', name, value);
    console.log(this.domNode.getAttribute('data-quote-type'));
    if (name !== this.statics.blotName || !value || value === this.domNode.getAttribute('data-quote-type')) {
      value = false
      super.format(name, value);
    } else {
      this.domNode.setAttribute("data-blockquote", "true");
      this.domNode.setAttribute("data-quote-type", value);
      Array.from(this.domNode.classList).forEach((item) => {
        this.domNode.classList.remove(item);
      });
      if (value !== 'default') {
        this.domNode.classList.add('md-alert', `md-alert-${value}`);
      }
    }
  }
}

QuoteContainerBlot.blotName = "custom-quote-container";
QuoteContainerBlot.tagName = "blockquote";
QuoteContainerBlot.className = "custom-block";
QuoteContainerBlot.allowedChildren = [CustomQuoteBlot];

CustomQuoteBlot.tagName = "p";
// -------- list all the children types you want to support inside a quote block --------
CustomQuoteBlot.allowedChildren = [TextBlot, Break, Cursor, LinkBlot];
CustomQuoteBlot.requiredContainer = QuoteContainerBlot;

export default CustomQuoteBlot;