// quill-dynamic-div.js
import { Quill } from "@vueup/vue-quill";
const Block = Quill.import("blots/block");

class DynamicDivBlot extends Block {
    // 从 DOM 节点创建 Blot 时，保留所有属性和类名
    static create(value) {
        const node = super.create();
        // 如果是从数据恢复（value 存在），还原类名
        if (value?.className) {
            node.className = value.className; // 直接设置完整类名字符串（支持多类名）
        }
        // 保留其他属性（如 id、data-* 等，按需添加）
        if (value?.attrs) {
            Object.keys(value.attrs).forEach(key => {
                node.setAttribute(key, value.attrs[key]);
            });
        }
        return node;
    }

    // 从 Blot 提取值（序列化时用），保留所有类名和属性
    static value(node) {
        return {
            className: node.className, // 保留完整类名（如 "o_detail_all big"）
            attrs: Array.from(node.attributes).reduce((attrs, attr) => {
                attrs[attr.name] = attr.value;
                return attrs;
            }, {}) // 保留所有属性
        };
    }

    // 格式化时识别所有 div 标签
    static formats(domNode) {
        // 只要是 div 标签，就返回其类名和属性（确保 Quill 不清理）
        return {
            className: domNode.className,
            attrs: Array.from(domNode.attributes).reduce((attrs, attr) => {
                attrs[attr.name] = attr.value;
                return attrs;
            }, {})
        };
    }
}

DynamicDivBlot.blotName = "dynamicDiv"; // 唯一标识
DynamicDivBlot.tagName = "div"; // 处理所有 div 标签

export default DynamicDivBlot;
