"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.vtabInputView = exports.vtabView = exports.tabPanelView = exports.tabView = void 0;
const prosemirror_state_1 = require("prosemirror-state");
// @ts-ignore // TODO: fix cjs build
const prosemirror_utils_1 = require("prosemirror-utils");
const classname_1 = require("../../../classname.js");
const const_1 = require("./const.js");
const icons_1 = require("./icons.js");
const plugins_1 = require("./plugins.js");
const utils_1 = require("./utils.js");
require("./index.css");
const cnYfmTab = (0, classname_1.cn)('yfm-tab');
const ignoreMutation = (_node, _view, _getPos) => (mutation) => {
    if (mutation instanceof MutationRecord &&
        mutation.type === 'attributes' &&
        mutation.attributeName) {
        return true;
    }
    return false;
};
const getTabNodes = (state, getPos) => {
    const currentTab = (0, prosemirror_utils_1.findParentNodeOfTypeClosestToPos)(state.tr.doc.resolve(getPos() + 1), (0, const_1.tabType)(state.schema));
    const tabsParentNode = (0, prosemirror_utils_1.findParentNodeOfTypeClosestToPos)(state.tr.doc.resolve(getPos()), (0, const_1.tabsType)(state.schema));
    return { currentTab, tabsParentNode };
};
const tabView = (node, view, getPos) => {
    const tabElem = document.createElement('div');
    const wrapperElem = document.createElement('div');
    wrapperElem.setAttribute('class', cnYfmTab('wrapper'));
    const viewElem = document.createElement('div');
    viewElem.setAttribute('class', cnYfmTab('view'));
    wrapperElem.addEventListener('click', () => {
        // Click on parent node to trigger event listener that selects current tab
        tabElem.click();
        {
            /**
             * Hack for empty tabs
             *
             * Problem: when clicking on an empty tab (without text content) it focuses, and selection doesn't move to beginning of tab
             *
             * Temporary fix: manually return focus to pm-view, move text selection to beginning of tab
             */
            view.focus();
            // tab is empty
            if (node.nodeSize < 3) {
                (0, utils_1.execAfterPaint)(() => {
                    const pos = getPos();
                    if (pos !== undefined) {
                        const { tr } = view.state;
                        view.dispatch(tr.setSelection(prosemirror_state_1.TextSelection.create(tr.doc, pos + 1)).scrollIntoView());
                    }
                });
            }
        }
    });
    const removeTabButton = document.createElement('div');
    removeTabButton.setAttribute('class', cnYfmTab('remove-button'));
    removeTabButton.innerHTML = icons_1.crossSvg;
    removeTabButton.contentEditable = 'false';
    removeTabButton.addEventListener('click', () => {
        const { state, dispatch } = view;
        const { currentTab, tabsParentNode } = getTabNodes(state, getPos);
        if (currentTab && tabsParentNode)
            (0, plugins_1.removeTab)(currentTab, tabsParentNode)(state, dispatch, view);
    });
    const createTabButton = document.createElement('div');
    createTabButton.setAttribute('class', cnYfmTab('create-button'));
    createTabButton.innerHTML = icons_1.plusSvg;
    createTabButton.contentEditable = 'false';
    createTabButton.addEventListener('click', () => {
        const { state, dispatch } = view;
        const { currentTab, tabsParentNode } = getTabNodes(state, getPos);
        if (currentTab && tabsParentNode)
            (0, plugins_1.createTab)(currentTab, tabsParentNode)(state, dispatch, view);
    });
    for (const attr in node.attrs) {
        if (Object.prototype.hasOwnProperty.call(node.attrs, attr)) {
            tabElem.setAttribute(attr, node.attrs[attr]);
        }
    }
    wrapperElem.appendChild(viewElem);
    wrapperElem.appendChild(removeTabButton);
    tabElem.appendChild(wrapperElem);
    tabElem.appendChild(createTabButton);
    return {
        dom: tabElem,
        contentDOM: viewElem,
        destroy() {
            tabElem.remove();
        },
        // FIX: ignore mutation and don't rerender node when yfm.js switch tab
        ignoreMutation: ignoreMutation(node, view, getPos),
    };
};
exports.tabView = tabView;
// @ts-expect-error
const tabPanelView = (node, view, getPos) => ({
    // FIXME: ignore mutation and don't rerender node when yfm.js switch tab
    ignoreMutation: ignoreMutation(node, view, getPos),
});
exports.tabPanelView = tabPanelView;
// @ts-expect-error
const vtabView = (node, view, getPos) => ({
    // FIXME: ignore mutation and don't rerender node when yfm.js switch tab
    ignoreMutation: ignoreMutation(node, view, getPos),
});
exports.vtabView = vtabView;
// @ts-expect-error
const vtabInputView = (node, view, getPos) => ({
    // FIXME: ignore mutation and don't rerender node when yfm.js switch tab
    ignoreMutation: ignoreMutation(node, view, getPos),
});
exports.vtabInputView = vtabInputView;
//# sourceMappingURL=views.js.map
