TableExtension.jsx

import { Table } from '@tiptap/extension-table';

const CustomTableView = ({ node }) => {
    const dom = document.createElement('div');
    dom.classList.add('tableWrapper');

    const content = document.createElement('table');

    // выставляем data-no-border при инициализации
    if (node.attrs.bordered === false) {
        dom.setAttribute('data-no-border', 'true');
    }

    dom.appendChild(content);

    return {
        dom,
        contentDOM: content,
        update(updatedNode) {
            const bordered = updatedNode.attrs.bordered !== false;
            if (!bordered) {
                dom.setAttribute('data-no-border', 'true');
            } else {
                dom.removeAttribute('data-no-border');
            }
            return true;
        }
    };
};

const TableExtension = Table.extend({
    addAttributes() {
        return {
            bordered: {
                default: true,
                parseHTML: element => element.getAttribute('data-bordered') !== 'false',
                renderHTML: attributes => ({
                    'data-bordered': attributes.bordered ? 'true' : 'false',
                    class: attributes.bordered ? '' : 'no-border',
                }),
            },
        };
    },

    addNodeView() {
        return CustomTableView;
    },
}).configure({
    resizable: true,
    allowTableNodeSelection: true,
});

export default TableExtension;