"use strict";
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var cell_node_view_exports = {};
__export(cell_node_view_exports, {
  cellNodeView: () => cellNodeView
});
module.exports = __toCommonJS(cell_node_view_exports);
var import_classnames = __toESM(require("classnames"));
var import_drag_handle_icons = require("./../../_shared/drag-handle-icons.js");
var import_data_hooks = require("./data-hooks.js");
var import_idempotent_dom = require("./idempotent-dom.js");
var import_is_editor_or_modal_active = require("./is-editor-or-modal-active.js");
var import_layouts_scss = __toESM(require("./layouts-scss.js"));
const cellNodeView = ({ modals }) => ({ node, getPos, editor }) => {
  const cellElement = document.createElement("div");
  const cellHandleWrapper = document.createElement("div");
  cellHandleWrapper.setAttribute("contenteditable", "false");
  const cellHandle = document.createElement("button");
  cellHandle.classList.add(import_layouts_scss.default.columnHandlerContainer);
  cellHandle.setAttribute("type", "button");
  cellHandle.innerHTML = (0, import_drag_handle_icons.getHorizontalHandleIcon)();
  cellHandleWrapper.append(cellHandle);
  const resizeHandleWrapper = document.createElement("div");
  resizeHandleWrapper.setAttribute("contenteditable", "false");
  const resizeHandle = document.createElement("div");
  resizeHandle.classList.add(import_layouts_scss.default.resizeHandler);
  resizeHandleWrapper.append(resizeHandle);
  const contentElement = document.createElement("div");
  contentElement.setAttribute("data-layout-cell-content", "");
  contentElement.classList.add(import_layouts_scss.default.cellContent);
  cellElement.append(cellHandleWrapper, contentElement);
  updateCellView({
    cellElement,
    cellHandle,
    resizeHandle,
    resizeHandleWrapper,
    node,
    getPos,
    editor,
    modals
  });
  cellHandle.addEventListener("click", (event) => {
    const cell = event.target?.closest(`[data-layout-cell]`);
    const cellId = cell?.getAttribute("data-layout-cell");
    if (cellId) {
      editor.chain().selectCell(cellId).focus().run();
    }
  });
  const runCellUpdate = () => updateCellView({
    cellElement,
    cellHandle,
    resizeHandle,
    resizeHandleWrapper,
    node,
    getPos,
    editor,
    modals
  });
  const onFocus = () => {
    runCellUpdate();
  };
  const onBlur = ({ event }) => {
    if (event.relatedTarget && cellElement.contains(event.relatedTarget)) {
      return;
    }
    runCellUpdate();
  };
  editor.on("selectionUpdate", runCellUpdate);
  editor.on("focus", onFocus);
  editor.on("blur", onBlur);
  let modalSubsCancelled = false;
  let modalSubs = [];
  queueMicrotask(() => {
    if (modalSubsCancelled || !modals) {
      return;
    }
    modalSubs = [modals.onModalOpened(runCellUpdate), modals.onModalClosed(runCellUpdate)];
  });
  return {
    dom: cellElement,
    contentDOM: contentElement,
    ignoreMutation: (mutation) => {
      const isMutatingCellAttribute = mutation.target === cellElement && mutation.type === "attributes";
      const isMutatingCellHandleWrapper = mutation.target === cellHandleWrapper || mutation.target === cellHandle;
      const isMutatingResizeHandle = mutation.target === resizeHandleWrapper || mutation.target === resizeHandle;
      const isMutatingCellChildren = mutation.target === cellElement && mutation.type === "childList";
      return isMutatingCellAttribute || isMutatingCellHandleWrapper || isMutatingResizeHandle || isMutatingCellChildren;
    },
    update: (newNode) => {
      if (newNode.type !== node.type) {
        return false;
      }
      node = newNode;
      updateCellView({
        cellElement,
        cellHandle,
        resizeHandle,
        resizeHandleWrapper,
        node: newNode,
        getPos,
        editor,
        modals
      });
      return true;
    },
    destroy: () => {
      editor.off("selectionUpdate", runCellUpdate);
      editor.off("focus", onFocus);
      editor.off("blur", onBlur);
      modalSubsCancelled = true;
      modalSubs.forEach((s) => s.cancel());
    }
  };
};
const updateCellView = ({
  cellElement,
  resizeHandle,
  resizeHandleWrapper,
  cellHandle,
  node,
  getPos,
  editor,
  modals
}) => {
  const { $to, $from } = editor.state.selection;
  const pos = getPos();
  if (pos === void 0) {
    return;
  }
  const isSelected = (0, import_is_editor_or_modal_active.isEditorOrModalActive)(editor.view, modals) && pos === $from.pos && pos + node.nodeSize === $to.pos;
  const isFirst = !editor.state.doc.resolve(pos).nodeBefore;
  (0, import_idempotent_dom.setAttr)(cellElement, "data-layout-cell", node.attrs.id);
  (0, import_idempotent_dom.setClass)(
    cellElement,
    (0, import_classnames.default)({
      [import_layouts_scss.default.cell]: true,
      [import_layouts_scss.default.cellSelected]: isSelected
    })
  );
  (0, import_idempotent_dom.setAttr)(cellHandle, "data-layout-cell-handle", node.attrs.id);
  (0, import_idempotent_dom.setAttr)(cellHandle, "data-hook", `${import_data_hooks.LAYOUT_CELL_HANDLE}-${node.attrs.id}`);
  (0, import_idempotent_dom.setAttr)(resizeHandle, "data-layout-cell-resize-handle", node.attrs.id);
  (0, import_idempotent_dom.setChild)(cellElement, resizeHandleWrapper, !isFirst);
};
//# sourceMappingURL=cell-node-view.js.map
