@contentstack/live-preview-utils 3.1.1 → 3.1.3

package/dist/legacy/visualBuilder/utils/enableInlineEditing.cjs

@@ -0,0 +1,94 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/visualBuilder/utils/enableInlineEditing.ts
+var enableInlineEditing_exports = {};
+__export(enableInlineEditing_exports, {
+  enableInlineEditing: () => enableInlineEditing
+});
+module.exports = __toCommonJS(enableInlineEditing_exports);
+var import_lodash_es = require("lodash-es");
+var import__ = require("../index.cjs");
+var import_generatePseudoEditableField = require("../generators/generatePseudoEditableField.cjs");
+var import_constants = require("./constants.cjs");
+var import_getMultilinePlaintext = require("./getMultilinePlaintext.cjs");
+var import_handleFieldMouseDown = require("./handleFieldMouseDown.cjs");
+var import_types = require("./types/index.types.cjs");
+var import_updateFocussedState = require("./updateFocussedState.cjs");
+var import_pasteAsPlainText = require("./pasteAsPlainText.cjs");
+function enableInlineEditing({
+  expectedFieldData,
+  editableElement,
+  fieldType,
+  elements
+}) {
+  const { visualBuilderContainer, resizeObserver } = elements;
+  let actualEditableField = editableElement;
+  import__.VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = actualEditableField == null ? void 0 : actualEditableField.innerText;
+  const elementComputedDisplay = window.getComputedStyle(actualEditableField).display;
+  let textContent = editableElement.innerText || editableElement.textContent || "";
+  if (fieldType === import_types.FieldDataType.MULTILINE) {
+    textContent = (0, import_getMultilinePlaintext.getMultilinePlaintext)(actualEditableField);
+    actualEditableField.addEventListener("paste", import_pasteAsPlainText.pasteAsPlainText);
+  }
+  const expectedTextContent = expectedFieldData;
+  if (expectedTextContent && textContent !== expectedTextContent || (0, import_generatePseudoEditableField.isEllipsisActive)(editableElement)) {
+    const pseudoEditableField = (0, import_generatePseudoEditableField.generatePseudoEditableElement)(
+      { editableElement },
+      { textContent: expectedFieldData }
+    );
+    editableElement.style.visibility = "hidden";
+    pseudoEditableField.setAttribute(
+      import_constants.VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
+      fieldType
+    );
+    visualBuilderContainer.appendChild(pseudoEditableField);
+    actualEditableField = pseudoEditableField;
+    if (fieldType === import_types.FieldDataType.MULTILINE)
+      actualEditableField.addEventListener("paste", import_pasteAsPlainText.pasteAsPlainText);
+    elements.resizeObserver.observe(pseudoEditableField);
+  } else if (elementComputedDisplay === "inline") {
+    const onInlineElementInput = (0, import_lodash_es.throttle)(() => {
+      const overlayWrapper = visualBuilderContainer.querySelector(
+        ".visual-builder__overlay__wrapper"
+      );
+      const focusedToolbar = visualBuilderContainer.querySelector(
+        ".visual-builder__focused-toolbar"
+      );
+      (0, import_updateFocussedState.updateFocussedState)({
+        editableElement: actualEditableField,
+        visualBuilderContainer,
+        overlayWrapper,
+        focusedToolbar,
+        resizeObserver
+      });
+    }, 200);
+    actualEditableField.addEventListener("input", onInlineElementInput);
+  }
+  actualEditableField.setAttribute("contenteditable", "true");
+  actualEditableField.addEventListener("input", import_handleFieldMouseDown.handleFieldInput);
+  actualEditableField.addEventListener("keydown", import_handleFieldMouseDown.handleFieldKeyDown);
+  actualEditableField.focus();
+  return;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  enableInlineEditing
+});
+//# sourceMappingURL=enableInlineEditing.cjs.map

package/dist/legacy/visualBuilder/utils/enableInlineEditing.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/visualBuilder/utils/enableInlineEditing.ts"],"sourcesContent":["import { throttle } from \"lodash-es\";\nimport { VisualBuilder } from \"../index\";\nimport {\n    isEllipsisActive,\n    generatePseudoEditableElement,\n} from \"../generators/generatePseudoEditableField\";\nimport { VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY } from \"./constants\";\nimport { getMultilinePlaintext } from \"./getMultilinePlaintext\";\nimport { handleFieldInput, handleFieldKeyDown } from \"./handleFieldMouseDown\";\nimport { FieldDataType, VisualBuilderEditContext } from \"./types/index.types\";\nimport { updateFocussedState } from \"./updateFocussedState\";\nimport { pasteAsPlainText } from \"./pasteAsPlainText\";\n\nexport function enableInlineEditing({\n    expectedFieldData,\n    editableElement,\n    fieldType,\n    elements,\n}: {\n    expectedFieldData: any;\n    editableElement: HTMLElement;\n    fieldType: FieldDataType;\n    elements: VisualBuilderEditContext;\n}) {\n    const { visualBuilderContainer, resizeObserver } = elements;\n    let actualEditableField = editableElement as HTMLElement;\n\n    VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue =\n        actualEditableField?.innerText;\n\n    const elementComputedDisplay =\n        window.getComputedStyle(actualEditableField).display;\n\n    let textContent =\n        (editableElement as HTMLElement).innerText ||\n        editableElement.textContent ||\n        \"\";\n\n    if (fieldType === FieldDataType.MULTILINE) {\n        textContent = getMultilinePlaintext(actualEditableField);\n        actualEditableField.addEventListener(\"paste\", pasteAsPlainText);\n    }\n    const expectedTextContent = expectedFieldData;\n    if (\n        (expectedTextContent && textContent !== expectedTextContent) ||\n        isEllipsisActive(editableElement as HTMLElement)\n    ) {\n        // TODO: Testing will be done in the E2E.\n        const pseudoEditableField = generatePseudoEditableElement(\n            { editableElement: editableElement as HTMLElement },\n            { textContent: expectedFieldData }\n        );\n\n        (editableElement as HTMLElement).style.visibility = \"hidden\";\n\n        // set field type attribute to the pseudo editable field\n        // ensures proper keydown handling similar to the actual editable field\n        pseudoEditableField.setAttribute(\n            VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n            fieldType\n        );\n        visualBuilderContainer.appendChild(pseudoEditableField);\n        actualEditableField = pseudoEditableField;\n\n        if (fieldType === FieldDataType.MULTILINE)\n            actualEditableField.addEventListener(\"paste\", pasteAsPlainText);\n\n        // we will unobserve this in hideOverlay\n        elements.resizeObserver.observe(pseudoEditableField);\n    } else if (elementComputedDisplay === \"inline\") {\n        // if the editable field is inline\n        const onInlineElementInput = throttle(() => {\n            const overlayWrapper = visualBuilderContainer.querySelector(\n                \".visual-builder__overlay__wrapper\"\n            ) as HTMLDivElement;\n            const focusedToolbar = visualBuilderContainer.querySelector(\n                \".visual-builder__focused-toolbar\"\n            ) as HTMLDivElement;\n            updateFocussedState({\n                editableElement: actualEditableField,\n                visualBuilderContainer,\n                overlayWrapper,\n                focusedToolbar,\n                resizeObserver,\n            });\n        }, 200);\n        actualEditableField.addEventListener(\"input\", onInlineElementInput);\n    }\n\n    actualEditableField.setAttribute(\"contenteditable\", \"true\");\n    actualEditableField.addEventListener(\"input\", handleFieldInput);\n    actualEditableField.addEventListener(\"keydown\", handleFieldKeyDown);\n    // focus on the contenteditable element to start accepting input\n    actualEditableField.focus();\n\n    return;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAyB;AACzB,eAA8B;AAC9B,yCAGO;AACP,uBAAwD;AACxD,mCAAsC;AACtC,kCAAqD;AACrD,mBAAwD;AACxD,iCAAoC;AACpC,8BAAiC;AAE1B,SAAS,oBAAoB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ,GAKG;AACC,QAAM,EAAE,wBAAwB,eAAe,IAAI;AACnD,MAAI,sBAAsB;AAE1B,yBAAc,yBAAyB,MAAM,kBACzC,2DAAqB;AAEzB,QAAM,yBACF,OAAO,iBAAiB,mBAAmB,EAAE;AAEjD,MAAI,cACC,gBAAgC,aACjC,gBAAgB,eAChB;AAEJ,MAAI,cAAc,2BAAc,WAAW;AACvC,sBAAc,oDAAsB,mBAAmB;AACvD,wBAAoB,iBAAiB,SAAS,wCAAgB;AAAA,EAClE;AACA,QAAM,sBAAsB;AAC5B,MACK,uBAAuB,gBAAgB,2BACxC,qDAAiB,eAA8B,GACjD;AAEE,UAAM,0BAAsB;AAAA,MACxB,EAAE,gBAAgD;AAAA,MAClD,EAAE,aAAa,kBAAkB;AAAA,IACrC;AAEA,IAAC,gBAAgC,MAAM,aAAa;AAIpD,wBAAoB;AAAA,MAChB;AAAA,MACA;AAAA,IACJ;AACA,2BAAuB,YAAY,mBAAmB;AACtD,0BAAsB;AAEtB,QAAI,cAAc,2BAAc;AAC5B,0BAAoB,iBAAiB,SAAS,wCAAgB;AAGlE,aAAS,eAAe,QAAQ,mBAAmB;AAAA,EACvD,WAAW,2BAA2B,UAAU;AAE5C,UAAM,2BAAuB,2BAAS,MAAM;AACxC,YAAM,iBAAiB,uBAAuB;AAAA,QAC1C;AAAA,MACJ;AACA,YAAM,iBAAiB,uBAAuB;AAAA,QAC1C;AAAA,MACJ;AACA,0DAAoB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACJ,CAAC;AAAA,IACL,GAAG,GAAG;AACN,wBAAoB,iBAAiB,SAAS,oBAAoB;AAAA,EACtE;AAEA,sBAAoB,aAAa,mBAAmB,MAAM;AAC1D,sBAAoB,iBAAiB,SAAS,4CAAgB;AAC9D,sBAAoB,iBAAiB,WAAW,8CAAkB;AAElE,sBAAoB,MAAM;AAE1B;AACJ;","names":[]}

package/dist/legacy/visualBuilder/utils/enableInlineEditing.d.cts

@@ -0,0 +1,11 @@
+import { FieldDataType, VisualBuilderEditContext } from './types/index.types.cjs';
+import '../../cms/types/contentTypeSchema.types.cjs';
+
+declare function enableInlineEditing({ expectedFieldData, editableElement, fieldType, elements, }: {
+    expectedFieldData: any;
+    editableElement: HTMLElement;
+    fieldType: FieldDataType;
+    elements: VisualBuilderEditContext;
+}): void;
+
+export { enableInlineEditing };

package/dist/legacy/visualBuilder/utils/enableInlineEditing.d.ts

@@ -0,0 +1,11 @@
+import { FieldDataType, VisualBuilderEditContext } from './types/index.types.js';
+import '../../cms/types/contentTypeSchema.types.js';
+
+declare function enableInlineEditing({ expectedFieldData, editableElement, fieldType, elements, }: {
+    expectedFieldData: any;
+    editableElement: HTMLElement;
+    fieldType: FieldDataType;
+    elements: VisualBuilderEditContext;
+}): void;
+
+export { enableInlineEditing };

package/dist/legacy/visualBuilder/utils/enableInlineEditing.js

@@ -0,0 +1,74 @@
+import "../../chunk-5WRI5ZAA.js";
+
+// src/visualBuilder/utils/enableInlineEditing.ts
+import { throttle } from "lodash-es";
+import { VisualBuilder } from "../index.js";
+import {
+  isEllipsisActive,
+  generatePseudoEditableElement
+} from "../generators/generatePseudoEditableField.js";
+import { VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY } from "./constants.js";
+import { getMultilinePlaintext } from "./getMultilinePlaintext.js";
+import { handleFieldInput, handleFieldKeyDown } from "./handleFieldMouseDown.js";
+import { FieldDataType } from "./types/index.types.js";
+import { updateFocussedState } from "./updateFocussedState.js";
+import { pasteAsPlainText } from "./pasteAsPlainText.js";
+function enableInlineEditing({
+  expectedFieldData,
+  editableElement,
+  fieldType,
+  elements
+}) {
+  const { visualBuilderContainer, resizeObserver } = elements;
+  let actualEditableField = editableElement;
+  VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = actualEditableField == null ? void 0 : actualEditableField.innerText;
+  const elementComputedDisplay = window.getComputedStyle(actualEditableField).display;
+  let textContent = editableElement.innerText || editableElement.textContent || "";
+  if (fieldType === FieldDataType.MULTILINE) {
+    textContent = getMultilinePlaintext(actualEditableField);
+    actualEditableField.addEventListener("paste", pasteAsPlainText);
+  }
+  const expectedTextContent = expectedFieldData;
+  if (expectedTextContent && textContent !== expectedTextContent || isEllipsisActive(editableElement)) {
+    const pseudoEditableField = generatePseudoEditableElement(
+      { editableElement },
+      { textContent: expectedFieldData }
+    );
+    editableElement.style.visibility = "hidden";
+    pseudoEditableField.setAttribute(
+      VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
+      fieldType
+    );
+    visualBuilderContainer.appendChild(pseudoEditableField);
+    actualEditableField = pseudoEditableField;
+    if (fieldType === FieldDataType.MULTILINE)
+      actualEditableField.addEventListener("paste", pasteAsPlainText);
+    elements.resizeObserver.observe(pseudoEditableField);
+  } else if (elementComputedDisplay === "inline") {
+    const onInlineElementInput = throttle(() => {
+      const overlayWrapper = visualBuilderContainer.querySelector(
+        ".visual-builder__overlay__wrapper"
+      );
+      const focusedToolbar = visualBuilderContainer.querySelector(
+        ".visual-builder__focused-toolbar"
+      );
+      updateFocussedState({
+        editableElement: actualEditableField,
+        visualBuilderContainer,
+        overlayWrapper,
+        focusedToolbar,
+        resizeObserver
+      });
+    }, 200);
+    actualEditableField.addEventListener("input", onInlineElementInput);
+  }
+  actualEditableField.setAttribute("contenteditable", "true");
+  actualEditableField.addEventListener("input", handleFieldInput);
+  actualEditableField.addEventListener("keydown", handleFieldKeyDown);
+  actualEditableField.focus();
+  return;
+}
+export {
+  enableInlineEditing
+};
+//# sourceMappingURL=enableInlineEditing.js.map

package/dist/legacy/visualBuilder/utils/enableInlineEditing.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/visualBuilder/utils/enableInlineEditing.ts"],"sourcesContent":["import { throttle } from \"lodash-es\";\nimport { VisualBuilder } from \"../index\";\nimport {\n    isEllipsisActive,\n    generatePseudoEditableElement,\n} from \"../generators/generatePseudoEditableField\";\nimport { VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY } from \"./constants\";\nimport { getMultilinePlaintext } from \"./getMultilinePlaintext\";\nimport { handleFieldInput, handleFieldKeyDown } from \"./handleFieldMouseDown\";\nimport { FieldDataType, VisualBuilderEditContext } from \"./types/index.types\";\nimport { updateFocussedState } from \"./updateFocussedState\";\nimport { pasteAsPlainText } from \"./pasteAsPlainText\";\n\nexport function enableInlineEditing({\n    expectedFieldData,\n    editableElement,\n    fieldType,\n    elements,\n}: {\n    expectedFieldData: any;\n    editableElement: HTMLElement;\n    fieldType: FieldDataType;\n    elements: VisualBuilderEditContext;\n}) {\n    const { visualBuilderContainer, resizeObserver } = elements;\n    let actualEditableField = editableElement as HTMLElement;\n\n    VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue =\n        actualEditableField?.innerText;\n\n    const elementComputedDisplay =\n        window.getComputedStyle(actualEditableField).display;\n\n    let textContent =\n        (editableElement as HTMLElement).innerText ||\n        editableElement.textContent ||\n        \"\";\n\n    if (fieldType === FieldDataType.MULTILINE) {\n        textContent = getMultilinePlaintext(actualEditableField);\n        actualEditableField.addEventListener(\"paste\", pasteAsPlainText);\n    }\n    const expectedTextContent = expectedFieldData;\n    if (\n        (expectedTextContent && textContent !== expectedTextContent) ||\n        isEllipsisActive(editableElement as HTMLElement)\n    ) {\n        // TODO: Testing will be done in the E2E.\n        const pseudoEditableField = generatePseudoEditableElement(\n            { editableElement: editableElement as HTMLElement },\n            { textContent: expectedFieldData }\n        );\n\n        (editableElement as HTMLElement).style.visibility = \"hidden\";\n\n        // set field type attribute to the pseudo editable field\n        // ensures proper keydown handling similar to the actual editable field\n        pseudoEditableField.setAttribute(\n            VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n            fieldType\n        );\n        visualBuilderContainer.appendChild(pseudoEditableField);\n        actualEditableField = pseudoEditableField;\n\n        if (fieldType === FieldDataType.MULTILINE)\n            actualEditableField.addEventListener(\"paste\", pasteAsPlainText);\n\n        // we will unobserve this in hideOverlay\n        elements.resizeObserver.observe(pseudoEditableField);\n    } else if (elementComputedDisplay === \"inline\") {\n        // if the editable field is inline\n        const onInlineElementInput = throttle(() => {\n            const overlayWrapper = visualBuilderContainer.querySelector(\n                \".visual-builder__overlay__wrapper\"\n            ) as HTMLDivElement;\n            const focusedToolbar = visualBuilderContainer.querySelector(\n                \".visual-builder__focused-toolbar\"\n            ) as HTMLDivElement;\n            updateFocussedState({\n                editableElement: actualEditableField,\n                visualBuilderContainer,\n                overlayWrapper,\n                focusedToolbar,\n                resizeObserver,\n            });\n        }, 200);\n        actualEditableField.addEventListener(\"input\", onInlineElementInput);\n    }\n\n    actualEditableField.setAttribute(\"contenteditable\", \"true\");\n    actualEditableField.addEventListener(\"input\", handleFieldInput);\n    actualEditableField.addEventListener(\"keydown\", handleFieldKeyDown);\n    // focus on the contenteditable element to start accepting input\n    actualEditableField.focus();\n\n    return;\n}\n"],"mappings":";;;AAAA,SAAS,gBAAgB;AACzB,SAAS,qBAAqB;AAC9B;AAAA,EACI;AAAA,EACA;AAAA,OACG;AACP,SAAS,+CAA+C;AACxD,SAAS,6BAA6B;AACtC,SAAS,kBAAkB,0BAA0B;AACrD,SAAS,qBAA+C;AACxD,SAAS,2BAA2B;AACpC,SAAS,wBAAwB;AAE1B,SAAS,oBAAoB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ,GAKG;AACC,QAAM,EAAE,wBAAwB,eAAe,IAAI;AACnD,MAAI,sBAAsB;AAE1B,gBAAc,yBAAyB,MAAM,kBACzC,2DAAqB;AAEzB,QAAM,yBACF,OAAO,iBAAiB,mBAAmB,EAAE;AAEjD,MAAI,cACC,gBAAgC,aACjC,gBAAgB,eAChB;AAEJ,MAAI,cAAc,cAAc,WAAW;AACvC,kBAAc,sBAAsB,mBAAmB;AACvD,wBAAoB,iBAAiB,SAAS,gBAAgB;AAAA,EAClE;AACA,QAAM,sBAAsB;AAC5B,MACK,uBAAuB,gBAAgB,uBACxC,iBAAiB,eAA8B,GACjD;AAEE,UAAM,sBAAsB;AAAA,MACxB,EAAE,gBAAgD;AAAA,MAClD,EAAE,aAAa,kBAAkB;AAAA,IACrC;AAEA,IAAC,gBAAgC,MAAM,aAAa;AAIpD,wBAAoB;AAAA,MAChB;AAAA,MACA;AAAA,IACJ;AACA,2BAAuB,YAAY,mBAAmB;AACtD,0BAAsB;AAEtB,QAAI,cAAc,cAAc;AAC5B,0BAAoB,iBAAiB,SAAS,gBAAgB;AAGlE,aAAS,eAAe,QAAQ,mBAAmB;AAAA,EACvD,WAAW,2BAA2B,UAAU;AAE5C,UAAM,uBAAuB,SAAS,MAAM;AACxC,YAAM,iBAAiB,uBAAuB;AAAA,QAC1C;AAAA,MACJ;AACA,YAAM,iBAAiB,uBAAuB;AAAA,QAC1C;AAAA,MACJ;AACA,0BAAoB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACJ,CAAC;AAAA,IACL,GAAG,GAAG;AACN,wBAAoB,iBAAiB,SAAS,oBAAoB;AAAA,EACtE;AAEA,sBAAoB,aAAa,mBAAmB,MAAM;AAC1D,sBAAoB,iBAAiB,SAAS,gBAAgB;AAC9D,sBAAoB,iBAAiB,WAAW,kBAAkB;AAElE,sBAAoB,MAAM;AAE1B;AACJ;","names":[]}

package/dist/legacy/visualBuilder/utils/getChildrenDirection.cjs

@@ -34,6 +34,7 @@ __export(getChildrenDirection_exports, {
 });
 module.exports = __toCommonJS(getChildrenDirection_exports);
 var import_getChildElements = __toESM(require("./getChildElements.cjs"), 1);
+var validPositions = ["vertical", "horizontal", "none"];
 function getChildrenDirection(editableElement, parentCslpValue) {
   if (!editableElement) {
     return "none";
@@ -44,6 +45,13 @@ function getChildrenDirection(editableElement, parentCslpValue) {
   if (!parentElement) {
     return "none";
   }
+  const directionFromParentElement = parentElement.getAttribute("data-add-direction");
+  const isValidParentDirection = validPositions.includes(
+    directionFromParentElement
+  );
+  if (directionFromParentElement && isValidParentDirection) {
+    return directionFromParentElement;
+  }
   const [firstChildElement, secondChildElement, removeClone] = (0, import_getChildElements.default)(parentElement, parentCslpValue);
   if (!firstChildElement) return "none";
   const firstChildBounds = firstChildElement.getBoundingClientRect();

package/dist/legacy/visualBuilder/utils/getChildrenDirection.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/visualBuilder/utils/getChildrenDirection.ts"],"sourcesContent":["import getChildElements from \"./getChildElements\";\n\nexport default function getChildrenDirection(\n    editableElement: Element,\n    parentCslpValue: string\n): \"none\" | \"horizontal\" | \"vertical\" {\n    if (!editableElement) {\n        return \"none\";\n    }\n\n    const parentElement = editableElement.closest(\n        `[data-cslp=\"${parentCslpValue}\"]`\n    );\n\n    if (!parentElement) {\n        return \"none\";\n    }\n\n    const [firstChildElement, secondChildElement, removeClone] =\n        getChildElements(parentElement, parentCslpValue);\n\n    if (!firstChildElement) return \"none\";\n\n    // get horizontal and vertical position differences\n    const firstChildBounds = firstChildElement.getBoundingClientRect();\n    const secondChildBounds = secondChildElement.getBoundingClientRect();\n\n    const deltaX = Math.abs(firstChildBounds.left - secondChildBounds.left);\n    const deltaY = Math.abs(firstChildBounds.top - secondChildBounds.top);\n\n    const dir = deltaX > deltaY ? \"horizontal\" : \"vertical\";\n\n    // remove the clone that was created in case there was only one child\n    removeClone();\n\n    return dir;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,8BAA6B;AAEd,SAAR,qBACH,iBACA,iBACkC;AAClC,MAAI,CAAC,iBAAiB;AAClB,WAAO;AAAA,EACX;AAEA,QAAM,gBAAgB,gBAAgB;AAAA,IAClC,eAAe,eAAe;AAAA,EAClC;AAEA,MAAI,CAAC,eAAe;AAChB,WAAO;AAAA,EACX;AAEA,QAAM,CAAC,mBAAmB,oBAAoB,WAAW,QACrD,wBAAAA,SAAiB,eAAe,eAAe;AAEnD,MAAI,CAAC,kBAAmB,QAAO;AAG/B,QAAM,mBAAmB,kBAAkB,sBAAsB;AACjE,QAAM,oBAAoB,mBAAmB,sBAAsB;AAEnE,QAAM,SAAS,KAAK,IAAI,iBAAiB,OAAO,kBAAkB,IAAI;AACtE,QAAM,SAAS,KAAK,IAAI,iBAAiB,MAAM,kBAAkB,GAAG;AAEpE,QAAM,MAAM,SAAS,SAAS,eAAe;AAG7C,cAAY;AAEZ,SAAO;AACX;","names":["getChildElements"]}
+{"version":3,"sources":["../../../../src/visualBuilder/utils/getChildrenDirection.ts"],"sourcesContent":["import getChildElements from \"./getChildElements\";\n\n\nconst validPositions = [\"vertical\", \"horizontal\", \"none\"] as const;\ntype ValidPositions = typeof validPositions[number];\n\nexport default function getChildrenDirection(\n    editableElement: Element,\n    parentCslpValue: string\n): ValidPositions {\n    if (!editableElement) {\n        return \"none\";\n    }\n\n    const parentElement = editableElement.closest(\n        `[data-cslp=\"${parentCslpValue}\"]`\n    );\n\n    if (!parentElement) {\n        return \"none\";\n    }\n\n    const directionFromParentElement =\n        parentElement.getAttribute(\"data-add-direction\");\n\n    const isValidParentDirection = validPositions.includes(\n        directionFromParentElement as ValidPositions\n    );\n\n\n    if (directionFromParentElement && isValidParentDirection) {\n        return directionFromParentElement as ValidPositions;\n    }\n    const [firstChildElement, secondChildElement, removeClone] =\n        getChildElements(parentElement, parentCslpValue);\n\n    if (!firstChildElement) return \"none\";\n\n    // get horizontal and vertical position differences\n    const firstChildBounds = firstChildElement.getBoundingClientRect();\n    const secondChildBounds = secondChildElement.getBoundingClientRect();\n\n    const deltaX = Math.abs(firstChildBounds.left - secondChildBounds.left);\n    const deltaY = Math.abs(firstChildBounds.top - secondChildBounds.top);\n\n    const dir = deltaX > deltaY ? \"horizontal\" : \"vertical\";\n\n    // remove the clone that was created in case there was only one child\n    removeClone();\n\n    return dir;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,8BAA6B;AAG7B,IAAM,iBAAiB,CAAC,YAAY,cAAc,MAAM;AAGzC,SAAR,qBACH,iBACA,iBACc;AACd,MAAI,CAAC,iBAAiB;AAClB,WAAO;AAAA,EACX;AAEA,QAAM,gBAAgB,gBAAgB;AAAA,IAClC,eAAe,eAAe;AAAA,EAClC;AAEA,MAAI,CAAC,eAAe;AAChB,WAAO;AAAA,EACX;AAEA,QAAM,6BACF,cAAc,aAAa,oBAAoB;AAEnD,QAAM,yBAAyB,eAAe;AAAA,IAC1C;AAAA,EACJ;AAGA,MAAI,8BAA8B,wBAAwB;AACtD,WAAO;AAAA,EACX;AACA,QAAM,CAAC,mBAAmB,oBAAoB,WAAW,QACrD,wBAAAA,SAAiB,eAAe,eAAe;AAEnD,MAAI,CAAC,kBAAmB,QAAO;AAG/B,QAAM,mBAAmB,kBAAkB,sBAAsB;AACjE,QAAM,oBAAoB,mBAAmB,sBAAsB;AAEnE,QAAM,SAAS,KAAK,IAAI,iBAAiB,OAAO,kBAAkB,IAAI;AACtE,QAAM,SAAS,KAAK,IAAI,iBAAiB,MAAM,kBAAkB,GAAG;AAEpE,QAAM,MAAM,SAAS,SAAS,eAAe;AAG7C,cAAY;AAEZ,SAAO;AACX;","names":["getChildElements"]}

package/dist/legacy/visualBuilder/utils/getChildrenDirection.d.cts

@@ -1,3 +1,5 @@
-declare function getChildrenDirection(editableElement: Element, parentCslpValue: string): "none" | "horizontal" | "vertical";
+declare const validPositions: readonly ["vertical", "horizontal", "none"];
+type ValidPositions = typeof validPositions[number];
+declare function getChildrenDirection(editableElement: Element, parentCslpValue: string): ValidPositions;
 
 export { getChildrenDirection as default };

package/dist/legacy/visualBuilder/utils/getChildrenDirection.d.ts

@@ -1,3 +1,5 @@
-declare function getChildrenDirection(editableElement: Element, parentCslpValue: string): "none" | "horizontal" | "vertical";
+declare const validPositions: readonly ["vertical", "horizontal", "none"];
+type ValidPositions = typeof validPositions[number];
+declare function getChildrenDirection(editableElement: Element, parentCslpValue: string): ValidPositions;
 
 export { getChildrenDirection as default };

package/dist/legacy/visualBuilder/utils/getChildrenDirection.js

@@ -2,6 +2,7 @@ import "../../chunk-5WRI5ZAA.js";
 
 // src/visualBuilder/utils/getChildrenDirection.ts
 import getChildElements from "./getChildElements.js";
+var validPositions = ["vertical", "horizontal", "none"];
 function getChildrenDirection(editableElement, parentCslpValue) {
   if (!editableElement) {
     return "none";
@@ -12,6 +13,13 @@ function getChildrenDirection(editableElement, parentCslpValue) {
   if (!parentElement) {
     return "none";
   }
+  const directionFromParentElement = parentElement.getAttribute("data-add-direction");
+  const isValidParentDirection = validPositions.includes(
+    directionFromParentElement
+  );
+  if (directionFromParentElement && isValidParentDirection) {
+    return directionFromParentElement;
+  }
   const [firstChildElement, secondChildElement, removeClone] = getChildElements(parentElement, parentCslpValue);
   if (!firstChildElement) return "none";
   const firstChildBounds = firstChildElement.getBoundingClientRect();

package/dist/legacy/visualBuilder/utils/getChildrenDirection.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/visualBuilder/utils/getChildrenDirection.ts"],"sourcesContent":["import getChildElements from \"./getChildElements\";\n\nexport default function getChildrenDirection(\n    editableElement: Element,\n    parentCslpValue: string\n): \"none\" | \"horizontal\" | \"vertical\" {\n    if (!editableElement) {\n        return \"none\";\n    }\n\n    const parentElement = editableElement.closest(\n        `[data-cslp=\"${parentCslpValue}\"]`\n    );\n\n    if (!parentElement) {\n        return \"none\";\n    }\n\n    const [firstChildElement, secondChildElement, removeClone] =\n        getChildElements(parentElement, parentCslpValue);\n\n    if (!firstChildElement) return \"none\";\n\n    // get horizontal and vertical position differences\n    const firstChildBounds = firstChildElement.getBoundingClientRect();\n    const secondChildBounds = secondChildElement.getBoundingClientRect();\n\n    const deltaX = Math.abs(firstChildBounds.left - secondChildBounds.left);\n    const deltaY = Math.abs(firstChildBounds.top - secondChildBounds.top);\n\n    const dir = deltaX > deltaY ? \"horizontal\" : \"vertical\";\n\n    // remove the clone that was created in case there was only one child\n    removeClone();\n\n    return dir;\n}\n"],"mappings":";;;AAAA,OAAO,sBAAsB;AAEd,SAAR,qBACH,iBACA,iBACkC;AAClC,MAAI,CAAC,iBAAiB;AAClB,WAAO;AAAA,EACX;AAEA,QAAM,gBAAgB,gBAAgB;AAAA,IAClC,eAAe,eAAe;AAAA,EAClC;AAEA,MAAI,CAAC,eAAe;AAChB,WAAO;AAAA,EACX;AAEA,QAAM,CAAC,mBAAmB,oBAAoB,WAAW,IACrD,iBAAiB,eAAe,eAAe;AAEnD,MAAI,CAAC,kBAAmB,QAAO;AAG/B,QAAM,mBAAmB,kBAAkB,sBAAsB;AACjE,QAAM,oBAAoB,mBAAmB,sBAAsB;AAEnE,QAAM,SAAS,KAAK,IAAI,iBAAiB,OAAO,kBAAkB,IAAI;AACtE,QAAM,SAAS,KAAK,IAAI,iBAAiB,MAAM,kBAAkB,GAAG;AAEpE,QAAM,MAAM,SAAS,SAAS,eAAe;AAG7C,cAAY;AAEZ,SAAO;AACX;","names":[]}
+{"version":3,"sources":["../../../../src/visualBuilder/utils/getChildrenDirection.ts"],"sourcesContent":["import getChildElements from \"./getChildElements\";\n\n\nconst validPositions = [\"vertical\", \"horizontal\", \"none\"] as const;\ntype ValidPositions = typeof validPositions[number];\n\nexport default function getChildrenDirection(\n    editableElement: Element,\n    parentCslpValue: string\n): ValidPositions {\n    if (!editableElement) {\n        return \"none\";\n    }\n\n    const parentElement = editableElement.closest(\n        `[data-cslp=\"${parentCslpValue}\"]`\n    );\n\n    if (!parentElement) {\n        return \"none\";\n    }\n\n    const directionFromParentElement =\n        parentElement.getAttribute(\"data-add-direction\");\n\n    const isValidParentDirection = validPositions.includes(\n        directionFromParentElement as ValidPositions\n    );\n\n\n    if (directionFromParentElement && isValidParentDirection) {\n        return directionFromParentElement as ValidPositions;\n    }\n    const [firstChildElement, secondChildElement, removeClone] =\n        getChildElements(parentElement, parentCslpValue);\n\n    if (!firstChildElement) return \"none\";\n\n    // get horizontal and vertical position differences\n    const firstChildBounds = firstChildElement.getBoundingClientRect();\n    const secondChildBounds = secondChildElement.getBoundingClientRect();\n\n    const deltaX = Math.abs(firstChildBounds.left - secondChildBounds.left);\n    const deltaY = Math.abs(firstChildBounds.top - secondChildBounds.top);\n\n    const dir = deltaX > deltaY ? \"horizontal\" : \"vertical\";\n\n    // remove the clone that was created in case there was only one child\n    removeClone();\n\n    return dir;\n}\n"],"mappings":";;;AAAA,OAAO,sBAAsB;AAG7B,IAAM,iBAAiB,CAAC,YAAY,cAAc,MAAM;AAGzC,SAAR,qBACH,iBACA,iBACc;AACd,MAAI,CAAC,iBAAiB;AAClB,WAAO;AAAA,EACX;AAEA,QAAM,gBAAgB,gBAAgB;AAAA,IAClC,eAAe,eAAe;AAAA,EAClC;AAEA,MAAI,CAAC,eAAe;AAChB,WAAO;AAAA,EACX;AAEA,QAAM,6BACF,cAAc,aAAa,oBAAoB;AAEnD,QAAM,yBAAyB,eAAe;AAAA,IAC1C;AAAA,EACJ;AAGA,MAAI,8BAA8B,wBAAwB;AACtD,WAAO;AAAA,EACX;AACA,QAAM,CAAC,mBAAmB,oBAAoB,WAAW,IACrD,iBAAiB,eAAe,eAAe;AAEnD,MAAI,CAAC,kBAAmB,QAAO;AAG/B,QAAM,mBAAmB,kBAAkB,sBAAsB;AACjE,QAAM,oBAAoB,mBAAmB,sBAAsB;AAEnE,QAAM,SAAS,KAAK,IAAI,iBAAiB,OAAO,kBAAkB,IAAI;AACtE,QAAM,SAAS,KAAK,IAAI,iBAAiB,MAAM,kBAAkB,GAAG;AAEpE,QAAM,MAAM,SAAS,SAAS,eAAe;AAG7C,cAAY;AAEZ,SAAO;AACX;","names":[]}

package/dist/legacy/visualBuilder/utils/handleIndividualFields.cjs

@@ -34,9 +34,7 @@ __export(handleIndividualFields_exports, {
   handleIndividualFields: () => handleIndividualFields
 });
 module.exports = __toCommonJS(handleIndividualFields_exports);
-var import_lodash_es = require("lodash-es");
 var import__ = require("../index.cjs");
-var import_generatePseudoEditableField = require("../generators/generatePseudoEditableField.cjs");
 var import_constants = require("./constants.cjs");
 var import_fieldSchemaMap = require("./fieldSchemaMap.cjs");
 var import_getFieldData = require("./getFieldData.cjs");
@@ -44,11 +42,11 @@ var import_getFieldType = require("./getFieldType.cjs");
 var import_handleFieldMouseDown = require("./handleFieldMouseDown.cjs");
 var import_isFieldDisabled = require("./isFieldDisabled.cjs");
 var import_multipleElementAddButton = require("./multipleElementAddButton.cjs");
-var import_updateFocussedState = require("./updateFocussedState.cjs");
-var import_types = require("./types/index.types.cjs");
-var import_getMultilinePlaintext = require("./getMultilinePlaintext.cjs");
 var import_postMessage = require("./types/postMessage.types.cjs");
 var import_visualBuilderPostMessage = __toESM(require("./visualBuilderPostMessage.cjs"), 1);
+var import_isFieldMultiple = require("./isFieldMultiple.cjs");
+var import_handleInlineEditableField = require("./handleInlineEditableField.cjs");
+var import_pasteAsPlainText = require("./pasteAsPlainText.cjs");
 async function handleIndividualFields(eventDetails, elements) {
   const { fieldMetadata, editableElement } = eventDetails;
   const { visualBuilderContainer, lastEditedField, resizeObserver } = elements;
@@ -72,7 +70,7 @@ async function handleIndividualFields(eventDetails, elements) {
     import_constants.VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
     fieldType
   );
-  if (isFieldMultiple(fieldSchema)) {
+  if ((0, import_isFieldMultiple.isFieldMultiple)(fieldSchema)) {
     if (lastEditedField !== editableElement) {
       const addButtonLabel = fieldSchema.data_type === "blocks" ? (
         // ? `Add ${fieldSchema.display_name ?? "Modular Block"}`
@@ -94,95 +92,17 @@ async function handleIndividualFields(eventDetails, elements) {
       );
     }
   }
-  !disabled && handleInlineEditing();
-  function handleInlineEditing() {
-    if (!import_constants.ALLOWED_INLINE_EDITABLE_FIELD.includes(fieldType)) return;
-    const index = Number(fieldMetadata.instance.fieldPathWithIndex.split(".").at(-1));
-    const isInstance = Number.isFinite(index);
-    if (isFieldMultiple(fieldSchema)) {
-      let expectedFieldInstanceData = null;
-      if (Array.isArray(expectedFieldData)) {
-        if (!isInstance) {
-          return;
-        }
-        if (index >= expectedFieldData.length) {
-        } else {
-          expectedFieldInstanceData = expectedFieldData.at(index);
-        }
-      } else {
-        expectedFieldInstanceData = expectedFieldData;
-      }
-      enableInlineEditing(expectedFieldInstanceData);
-    } else {
-      let expectedFieldInstanceData = null;
-      if (isInstance) {
-        if (index !== 0) {
-          return;
-        }
-        expectedFieldInstanceData = Array.isArray(expectedFieldData) ? expectedFieldData.at(0) : expectedFieldData;
-      }
-      enableInlineEditing(expectedFieldInstanceData ?? expectedFieldData);
-    }
-    function enableInlineEditing(expectedFieldData2) {
-      let actualEditableField = editableElement;
-      import__.VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = actualEditableField == null ? void 0 : actualEditableField.innerText;
-      const elementComputedDisplay = window.getComputedStyle(actualEditableField).display;
-      let textContent = editableElement.innerText || editableElement.textContent || "";
-      if (fieldType === import_types.FieldDataType.MULTILINE) {
-        textContent = (0, import_getMultilinePlaintext.getMultilinePlaintext)(actualEditableField);
-        actualEditableField.addEventListener("paste", pasteAsPlainText);
-      }
-      const expectedTextContent = expectedFieldData2;
-      if (expectedTextContent && textContent !== expectedTextContent || (0, import_generatePseudoEditableField.isEllipsisActive)(editableElement)) {
-        const pseudoEditableField = (0, import_generatePseudoEditableField.generatePseudoEditableElement)(
-          { editableElement },
-          { textContent: expectedFieldData2 }
-        );
-        editableElement.style.visibility = "hidden";
-        pseudoEditableField.setAttribute(
-          import_constants.VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
-          fieldType
-        );
-        visualBuilderContainer.appendChild(pseudoEditableField);
-        actualEditableField = pseudoEditableField;
-        if (fieldType === import_types.FieldDataType.MULTILINE)
-          actualEditableField.addEventListener(
-            "paste",
-            pasteAsPlainText
-          );
-        elements.resizeObserver.observe(pseudoEditableField);
-      } else if (elementComputedDisplay === "inline") {
-        const onInlineElementInput = (0, import_lodash_es.throttle)(() => {
-          const overlayWrapper = visualBuilderContainer.querySelector(
-            ".visual-builder__overlay__wrapper"
-          );
-          const focusedToolbar = visualBuilderContainer.querySelector(
-            ".visual-builder__focused-toolbar"
-          );
-          (0, import_updateFocussedState.updateFocussedState)({
-            editableElement: actualEditableField,
-            visualBuilderContainer,
-            overlayWrapper,
-            focusedToolbar,
-            resizeObserver
-          });
-        }, 200);
-        actualEditableField.addEventListener(
-          "input",
-          onInlineElementInput
-        );
-      }
-      actualEditableField.setAttribute("contenteditable", "true");
-      actualEditableField.addEventListener("input", import_handleFieldMouseDown.handleFieldInput);
-      actualEditableField.addEventListener("keydown", import_handleFieldMouseDown.handleFieldKeyDown);
-      actualEditableField.focus();
-      return;
-    }
+  if (disabled) {
+    return;
   }
-}
-function isFieldMultiple(fieldSchema) {
-  return fieldSchema && (fieldSchema.multiple || fieldSchema.data_type === "reference" && // @ts-ignore
-  fieldSchema.field_metadata.ref_multiple);
+  (0, import_handleInlineEditableField.handleInlineEditableField)({
+    fieldType,
+    fieldSchema,
+    fieldMetadata,
+    expectedFieldData,
+    editableElement,
+    elements
+  });
 }
 function cleanIndividualFieldResidual(elements) {
   const { overlayWrapper, visualBuilderContainer, focusedToolbar } = elements;
@@ -210,7 +130,7 @@ function cleanIndividualFieldResidual(elements) {
     );
     previousSelectedEditableDOM.removeEventListener(
       "paste",
-      pasteAsPlainText
+      import_pasteAsPlainText.pasteAsPlainText
     );
     elements.resizeObserver.unobserve(previousSelectedEditableDOM);
   }
@@ -219,7 +139,7 @@ function cleanIndividualFieldResidual(elements) {
   );
   if (pseudoEditableElement) {
     elements.resizeObserver.unobserve(pseudoEditableElement);
-    pseudoEditableElement.removeEventListener("paste", pasteAsPlainText);
+    pseudoEditableElement.removeEventListener("paste", import_pasteAsPlainText.pasteAsPlainText);
     pseudoEditableElement.remove();
     if (previousSelectedEditableDOM) {
       previousSelectedEditableDOM.style.removeProperty(
@@ -229,26 +149,18 @@ function cleanIndividualFieldResidual(elements) {
   }
   if (focusedToolbar) {
     focusedToolbar.innerHTML = "";
-    const toolbarEvents = [import_postMessage.VisualBuilderPostMessageEvents.DELETE_INSTANCE, import_postMessage.VisualBuilderPostMessageEvents.UPDATE_DISCUSSION_ID];
+    const toolbarEvents = [
+      import_postMessage.VisualBuilderPostMessageEvents.DELETE_INSTANCE,
+      import_postMessage.VisualBuilderPostMessageEvents.UPDATE_DISCUSSION_ID
+    ];
     toolbarEvents.forEach((event) => {
-      var _a, _b;
-      (_b = (_a = import_visualBuilderPostMessage.default) == null ? void 0 : _a.unregisterEvent) == null ? void 0 : _b.call(_a, event);
+      var _a, _b, _c, _d;
+      if ((_b = (_a = import_visualBuilderPostMessage.default) == null ? void 0 : _a.requestMessageHandlers) == null ? void 0 : _b.has(event)) {
+        (_d = (_c = import_visualBuilderPostMessage.default) == null ? void 0 : _c.unregisterEvent) == null ? void 0 : _d.call(_c, event);
+      }
     });
   }
 }
-var pasteAsPlainText = (0, import_lodash_es.debounce)(
-  (e) => {
-    e.preventDefault();
-    const clipboardData = e.clipboardData;
-    document.execCommand(
-      "inserttext",
-      false,
-      clipboardData == null ? void 0 : clipboardData.getData("text/plain")
-    );
-  },
-  100,
-  { leading: true }
-);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   cleanIndividualFieldResidual,

package/dist/legacy/visualBuilder/utils/handleIndividualFields.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/visualBuilder/utils/handleIndividualFields.ts"],"sourcesContent":["import { debounce, throttle } from \"lodash-es\";\nimport { VisualBuilder } from \"..\";\nimport {\n    generatePseudoEditableElement,\n    isEllipsisActive,\n} from \"../generators/generatePseudoEditableField\";\nimport { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport {\n    ALLOWED_INLINE_EDITABLE_FIELD,\n    VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n} from \"./constants\";\nimport { FieldSchemaMap } from \"./fieldSchemaMap\";\nimport { getFieldData } from \"./getFieldData\";\nimport { getFieldType } from \"./getFieldType\";\nimport { handleFieldInput, handleFieldKeyDown } from \"./handleFieldMouseDown\";\nimport { isFieldDisabled } from \"./isFieldDisabled\";\nimport {\n    handleAddButtonsForMultiple,\n    removeAddInstanceButtons,\n} from \"./multipleElementAddButton\";\nimport { updateFocussedState } from \"./updateFocussedState\";\nimport { FieldDataType, ISchemaFieldMap } from \"./types/index.types\";\nimport { getMultilinePlaintext } from \"./getMultilinePlaintext\";\nimport { VisualBuilderPostMessageEvents } from \"./types/postMessage.types\";\nimport visualBuilderPostMessage from \"./visualBuilderPostMessage\";\n\n/**\n * It handles all the fields based on their data type and its \"multiple\" property.\n * @param eventDetails The event details object that contain cslp and field metadata.\n * @param elements The elements object that contain the visual builder wrapper.\n */\nexport async function handleIndividualFields(\n    eventDetails: VisualBuilderCslpEventDetails,\n    elements: {\n        visualBuilderContainer: HTMLDivElement;\n        resizeObserver: ResizeObserver;\n        lastEditedField: Element | null;\n    }\n): Promise<void> {\n    const { fieldMetadata, editableElement } = eventDetails;\n    const { visualBuilderContainer, lastEditedField, resizeObserver } =\n        elements;\n    const {\n        content_type_uid,\n        entry_uid,\n        locale,\n        fieldPath,\n        fieldPathWithIndex,\n    } = fieldMetadata;\n\n    const [fieldSchema, expectedFieldData] = await Promise.all([\n        FieldSchemaMap.getFieldSchema(content_type_uid, fieldPath),\n        getFieldData(\n            { content_type_uid, entry_uid, locale },\n            fieldPathWithIndex\n        ),\n    ]);\n\n    const fieldType = getFieldType(fieldSchema);\n\n    const { isDisabled: disabled } = isFieldDisabled(fieldSchema, eventDetails);\n\n    editableElement.setAttribute(\n        VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n        fieldType\n    );\n\n    if (isFieldMultiple(fieldSchema)) {\n        if (lastEditedField !== editableElement) {\n            const addButtonLabel =\n                fieldSchema.data_type === \"blocks\"\n                    ? // ? `Add ${fieldSchema.display_name ?? \"Modular Block\"}`\n                      \"Add Section\"\n                    : undefined;\n\n            handleAddButtonsForMultiple(\n                eventDetails,\n                {\n                    editableElement: eventDetails.editableElement,\n                    visualBuilderContainer: visualBuilderContainer,\n                    resizeObserver: resizeObserver,\n                },\n                {\n                    fieldSchema,\n                    expectedFieldData,\n                    disabled,\n                    label: addButtonLabel,\n                }\n            );\n        }\n    } \n\n    !disabled && handleInlineEditing();\n\n    /**\n     * Handles inline editing for supported fields.\n     */\n    function handleInlineEditing() {\n\n        if (!ALLOWED_INLINE_EDITABLE_FIELD.includes(fieldType)) return;\n\n        // Instances of ALLOWED_INLINE_EDITABLE_FIELD will always have index at last\n        const index = Number(fieldMetadata.instance.fieldPathWithIndex.split('.').at(-1));\n        const isInstance = Number.isFinite(index);\n\n        // CASE 1: Handle inline editing for multiple field\n        if(isFieldMultiple(fieldSchema)) {\n            let expectedFieldInstanceData = null;\n            if(Array.isArray(expectedFieldData)) {\n                // CASE: Selected element is the multiple field itself.\n                // Inline Editing not allowed on field, only allowed on instance.\n                // (We recieve unreliable `multipleFieldMetadata` in this case)\n                if(!isInstance) {\n                    return;\n                }\n\n                // CASE: Value does not exist for the provided instance's index\n                if(index >= expectedFieldData.length) {\n                    // TODO: What should be the behavior here?\n                }\n                else {\n                    expectedFieldInstanceData = expectedFieldData.at(index);\n                }\n            }\n            // CASE: ContentType's Field changed from single to multiple, while Entry's Field still single.\n            else {\n                expectedFieldInstanceData = expectedFieldData;\n            }\n\n            enableInlineEditing(expectedFieldInstanceData);     \n        }\n        // CASE 2: Handle inline editing for a single field\n        else {\n            let expectedFieldInstanceData = null;\n            // CASE: ContentType's Field changed from multiple to single, while Entry's Field still multiple.\n            if(isInstance) {\n                if(index !== 0) {\n                    // TODO: Handle this with UX\n                    // Let user know, CSLP is invalid due to change in Content Type\n                    return;\n                }\n                expectedFieldInstanceData = Array.isArray(expectedFieldData) ? expectedFieldData.at(0) : expectedFieldData;\n            }\n            enableInlineEditing(expectedFieldInstanceData ?? expectedFieldData);\n        }\n\n        function enableInlineEditing(expectedFieldData: any) {\n\n            let actualEditableField = editableElement as HTMLElement;\n\n            VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue =\n                actualEditableField?.innerText;\n\n            const elementComputedDisplay =\n                window.getComputedStyle(actualEditableField).display;\n\n            let textContent =\n                (editableElement as HTMLElement).innerText ||\n                editableElement.textContent ||\n                \"\";\n\n            if (fieldType === FieldDataType.MULTILINE) {\n                textContent = getMultilinePlaintext(actualEditableField);\n                actualEditableField.addEventListener(\"paste\", pasteAsPlainText);\n            }\n            const expectedTextContent = expectedFieldData;\n            if (\n                (expectedTextContent && textContent !== expectedTextContent) ||\n                isEllipsisActive(editableElement as HTMLElement)\n            ) {\n                \n                // TODO: Testing will be done in the E2E.\n                const pseudoEditableField = generatePseudoEditableElement(\n                    { editableElement: editableElement as HTMLElement },\n                    { textContent: expectedFieldData }\n                );\n\n                (editableElement as HTMLElement).style.visibility = \"hidden\";\n\n                // set field type attribute to the pseudo editable field\n                // ensures proper keydown handling similar to the actual editable field\n                pseudoEditableField.setAttribute(\n                    VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n                    fieldType\n                );\n                visualBuilderContainer.appendChild(pseudoEditableField);\n                actualEditableField = pseudoEditableField;\n\n                if (fieldType === FieldDataType.MULTILINE)\n                    actualEditableField.addEventListener(\n                        \"paste\",\n                        pasteAsPlainText\n                    );\n\n                // we will unobserve this in hideOverlay\n                elements.resizeObserver.observe(pseudoEditableField);\n            } else if (elementComputedDisplay === \"inline\") {\n                // if the editable field is inline\n                const onInlineElementInput = throttle(() => {\n                    const overlayWrapper = visualBuilderContainer.querySelector(\n                        \".visual-builder__overlay__wrapper\"\n                    ) as HTMLDivElement;\n                    const focusedToolbar = visualBuilderContainer.querySelector(\n                        \".visual-builder__focused-toolbar\"\n                    ) as HTMLDivElement;\n                    updateFocussedState({\n                        editableElement: actualEditableField,\n                        visualBuilderContainer,\n                        overlayWrapper,\n                        focusedToolbar,\n                        resizeObserver,\n                    });\n                }, 200);\n                actualEditableField.addEventListener(\n                    \"input\",\n                    onInlineElementInput\n                );\n            }\n\n            actualEditableField.setAttribute(\"contenteditable\", \"true\");\n            actualEditableField.addEventListener(\"input\", handleFieldInput);\n            actualEditableField.addEventListener(\"keydown\", handleFieldKeyDown);\n            // focus on the contenteditable element to start accepting input\n            actualEditableField.focus();\n\n            return;\n        }\n    }\n}\n\nfunction isFieldMultiple(fieldSchema: ISchemaFieldMap): boolean {\n    return fieldSchema &&\n    (fieldSchema.multiple ||\n        (fieldSchema.data_type === \"reference\" &&\n            // @ts-ignore\n            fieldSchema.field_metadata.ref_multiple));\n}\n\nexport function cleanIndividualFieldResidual(elements: {\n    overlayWrapper: HTMLDivElement;\n    visualBuilderContainer: HTMLDivElement | null;\n    focusedToolbar: HTMLDivElement | null;\n    resizeObserver: ResizeObserver;\n}): void {\n    const { overlayWrapper, visualBuilderContainer, focusedToolbar } = elements;\n\n    removeAddInstanceButtons(\n        {\n            eventTarget: null,\n            visualBuilderContainer: visualBuilderContainer,\n            overlayWrapper: overlayWrapper,\n        },\n        true\n    );\n\n    const previousSelectedEditableDOM =\n        VisualBuilder.VisualBuilderGlobalState.value\n            .previousSelectedEditableDOM;\n    if (previousSelectedEditableDOM) {\n        previousSelectedEditableDOM.removeAttribute(\n            VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY\n        );\n        previousSelectedEditableDOM.removeAttribute(\"contenteditable\");\n        previousSelectedEditableDOM.removeEventListener(\n            \"input\",\n            handleFieldInput\n        );\n        previousSelectedEditableDOM.removeEventListener(\n            \"keydown\",\n            handleFieldKeyDown\n        );\n\n        previousSelectedEditableDOM.removeEventListener(\n            \"paste\",\n            pasteAsPlainText\n        );\n        // Note - this happens in two places, 1. hideOverlay and 2. here\n        // TODO maybe see all usages of both functions and try to do it in one place\n        elements.resizeObserver.unobserve(previousSelectedEditableDOM);\n    }\n\n    const pseudoEditableElement = visualBuilderContainer?.querySelector(\n        \".visual-builder__pseudo-editable-element\"\n    );\n    if (pseudoEditableElement) {\n        elements.resizeObserver.unobserve(pseudoEditableElement);\n        pseudoEditableElement.removeEventListener(\"paste\", pasteAsPlainText);\n        pseudoEditableElement.remove();\n        if (previousSelectedEditableDOM) {\n            (previousSelectedEditableDOM as HTMLElement).style.removeProperty(\n                \"visibility\"\n            );\n        }\n    }\n\n    if (focusedToolbar) {\n        focusedToolbar.innerHTML = \"\";\n        const toolbarEvents = [VisualBuilderPostMessageEvents.DELETE_INSTANCE, VisualBuilderPostMessageEvents.UPDATE_DISCUSSION_ID]\n        toolbarEvents.forEach((event) => {\n            //@ts-expect-error - We are accessing private method here, but it is necessary to clean up the event listeners.\n            visualBuilderPostMessage?.unregisterEvent?.(event);\n        });\n    }\n}\n\nconst pasteAsPlainText = debounce(\n    (e: Event) => {\n        e.preventDefault();\n        const clipboardData = (e as ClipboardEvent).clipboardData;\n        document.execCommand(\n            \"inserttext\",\n            false,\n            clipboardData?.getData(\"text/plain\")\n        );\n    },\n    100,\n    { leading: true }\n);\n"],"mappings":"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","names":["expectedFieldData","visualBuilderPostMessage"]}
+{"version":3,"sources":["../../../../src/visualBuilder/utils/handleIndividualFields.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport { VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY } from \"./constants\";\nimport { FieldSchemaMap } from \"./fieldSchemaMap\";\nimport { getFieldData } from \"./getFieldData\";\nimport { getFieldType } from \"./getFieldType\";\nimport { handleFieldInput, handleFieldKeyDown } from \"./handleFieldMouseDown\";\nimport { isFieldDisabled } from \"./isFieldDisabled\";\nimport {\n    handleAddButtonsForMultiple,\n    removeAddInstanceButtons,\n} from \"./multipleElementAddButton\";\nimport { VisualBuilderPostMessageEvents } from \"./types/postMessage.types\";\nimport visualBuilderPostMessage from \"./visualBuilderPostMessage\";\nimport { isFieldMultiple } from \"./isFieldMultiple\";\nimport { handleInlineEditableField } from \"./handleInlineEditableField\";\nimport { VisualBuilderEditContext } from \"./types/index.types\";\nimport { pasteAsPlainText } from \"./pasteAsPlainText\";\n\n/**\n * It handles all the fields based on their data type and its \"multiple\" property.\n * @param eventDetails The event details object that contain cslp and field metadata.\n * @param elements The elements object that contain the visual builder wrapper.\n */\nexport async function handleIndividualFields(\n    eventDetails: VisualBuilderCslpEventDetails,\n    elements: VisualBuilderEditContext\n): Promise<void> {\n    const { fieldMetadata, editableElement } = eventDetails;\n    const { visualBuilderContainer, lastEditedField, resizeObserver } =\n        elements;\n    const {\n        content_type_uid,\n        entry_uid,\n        locale,\n        fieldPath,\n        fieldPathWithIndex,\n    } = fieldMetadata;\n\n    const [fieldSchema, expectedFieldData] = await Promise.all([\n        FieldSchemaMap.getFieldSchema(content_type_uid, fieldPath),\n        getFieldData(\n            { content_type_uid, entry_uid, locale },\n            fieldPathWithIndex\n        ),\n    ]);\n\n    const fieldType = getFieldType(fieldSchema);\n\n    const { isDisabled: disabled } = isFieldDisabled(fieldSchema, eventDetails);\n\n    editableElement.setAttribute(\n        VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n        fieldType\n    );\n\n    if (isFieldMultiple(fieldSchema)) {\n        if (lastEditedField !== editableElement) {\n            const addButtonLabel =\n                fieldSchema.data_type === \"blocks\"\n                    ? // ? `Add ${fieldSchema.display_name ?? \"Modular Block\"}`\n                      \"Add Section\"\n                    : undefined;\n\n            handleAddButtonsForMultiple(\n                eventDetails,\n                {\n                    editableElement: eventDetails.editableElement,\n                    visualBuilderContainer: visualBuilderContainer,\n                    resizeObserver: resizeObserver,\n                },\n                {\n                    fieldSchema,\n                    expectedFieldData,\n                    disabled,\n                    label: addButtonLabel,\n                }\n            );\n        }\n    }\n\n    if (disabled) {\n        return;\n    }\n    handleInlineEditableField({\n        fieldType,\n        fieldSchema,\n        fieldMetadata,\n        expectedFieldData,\n        editableElement: editableElement as HTMLElement,\n        elements,\n    });\n}\n\nexport function cleanIndividualFieldResidual(elements: {\n    overlayWrapper: HTMLDivElement;\n    visualBuilderContainer: HTMLDivElement | null;\n    focusedToolbar: HTMLDivElement | null;\n    resizeObserver: ResizeObserver;\n}): void {\n    const { overlayWrapper, visualBuilderContainer, focusedToolbar } = elements;\n\n    removeAddInstanceButtons(\n        {\n            eventTarget: null,\n            visualBuilderContainer: visualBuilderContainer,\n            overlayWrapper: overlayWrapper,\n        },\n        true\n    );\n\n    const previousSelectedEditableDOM =\n        VisualBuilder.VisualBuilderGlobalState.value\n            .previousSelectedEditableDOM;\n    if (previousSelectedEditableDOM) {\n        previousSelectedEditableDOM.removeAttribute(\n            VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY\n        );\n        previousSelectedEditableDOM.removeAttribute(\"contenteditable\");\n        previousSelectedEditableDOM.removeEventListener(\n            \"input\",\n            handleFieldInput\n        );\n        previousSelectedEditableDOM.removeEventListener(\n            \"keydown\",\n            handleFieldKeyDown\n        );\n\n        previousSelectedEditableDOM.removeEventListener(\n            \"paste\",\n            pasteAsPlainText\n        );\n        // Note - this happens in two places, 1. hideOverlay and 2. here\n        // TODO maybe see all usages of both functions and try to do it in one place\n        elements.resizeObserver.unobserve(previousSelectedEditableDOM);\n    }\n\n    const pseudoEditableElement = visualBuilderContainer?.querySelector(\n        \".visual-builder__pseudo-editable-element\"\n    );\n    if (pseudoEditableElement) {\n        elements.resizeObserver.unobserve(pseudoEditableElement);\n        pseudoEditableElement.removeEventListener(\"paste\", pasteAsPlainText);\n        pseudoEditableElement.remove();\n        if (previousSelectedEditableDOM) {\n            (previousSelectedEditableDOM as HTMLElement).style.removeProperty(\n                \"visibility\"\n            );\n        }\n    }\n\n    if (focusedToolbar) {\n        focusedToolbar.innerHTML = \"\";\n        const toolbarEvents = [\n            VisualBuilderPostMessageEvents.DELETE_INSTANCE,\n            VisualBuilderPostMessageEvents.UPDATE_DISCUSSION_ID,\n        ];\n        toolbarEvents.forEach((event) => {\n            //@ts-expect-error - We are accessing private method here, but it is necessary to clean up the event listeners.\n            if (visualBuilderPostMessage?.requestMessageHandlers?.has(event)) {\n                //@ts-expect-error - We are accessing private method here, but it is necessary to clean up the event listeners.\n                visualBuilderPostMessage?.unregisterEvent?.(event);\n            }\n        });\n    }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAA8B;AAE9B,uBAAwD;AACxD,4BAA+B;AAC/B,0BAA6B;AAC7B,0BAA6B;AAC7B,kCAAqD;AACrD,6BAAgC;AAChC,sCAGO;AACP,yBAA+C;AAC/C,sCAAqC;AACrC,6BAAgC;AAChC,uCAA0C;AAE1C,8BAAiC;AAOjC,eAAsB,uBAClB,cACA,UACa;AACb,QAAM,EAAE,eAAe,gBAAgB,IAAI;AAC3C,QAAM,EAAE,wBAAwB,iBAAiB,eAAe,IAC5D;AACJ,QAAM;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ,IAAI;AAEJ,QAAM,CAAC,aAAa,iBAAiB,IAAI,MAAM,QAAQ,IAAI;AAAA,IACvD,qCAAe,eAAe,kBAAkB,SAAS;AAAA,QACzD;AAAA,MACI,EAAE,kBAAkB,WAAW,OAAO;AAAA,MACtC;AAAA,IACJ;AAAA,EACJ,CAAC;AAED,QAAM,gBAAY,kCAAa,WAAW;AAE1C,QAAM,EAAE,YAAY,SAAS,QAAI,wCAAgB,aAAa,YAAY;AAE1E,kBAAgB;AAAA,IACZ;AAAA,IACA;AAAA,EACJ;AAEA,UAAI,wCAAgB,WAAW,GAAG;AAC9B,QAAI,oBAAoB,iBAAiB;AACrC,YAAM,iBACF,YAAY,cAAc;AAAA;AAAA,QAEpB;AAAA,UACA;AAEV;AAAA,QACI;AAAA,QACA;AAAA,UACI,iBAAiB,aAAa;AAAA,UAC9B;AAAA,UACA;AAAA,QACJ;AAAA,QACA;AAAA,UACI;AAAA,UACA;AAAA,UACA;AAAA,UACA,OAAO;AAAA,QACX;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AAEA,MAAI,UAAU;AACV;AAAA,EACJ;AACA,kEAA0B;AAAA,IACtB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ,CAAC;AACL;AAEO,SAAS,6BAA6B,UAKpC;AACL,QAAM,EAAE,gBAAgB,wBAAwB,eAAe,IAAI;AAEnE;AAAA,IACI;AAAA,MACI,aAAa;AAAA,MACb;AAAA,MACA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;AAEA,QAAM,8BACF,uBAAc,yBAAyB,MAClC;AACT,MAAI,6BAA6B;AAC7B,gCAA4B;AAAA,MACxB;AAAA,IACJ;AACA,gCAA4B,gBAAgB,iBAAiB;AAC7D,gCAA4B;AAAA,MACxB;AAAA,MACA;AAAA,IACJ;AACA,gCAA4B;AAAA,MACxB;AAAA,MACA;AAAA,IACJ;AAEA,gCAA4B;AAAA,MACxB;AAAA,MACA;AAAA,IACJ;AAGA,aAAS,eAAe,UAAU,2BAA2B;AAAA,EACjE;AAEA,QAAM,wBAAwB,iEAAwB;AAAA,IAClD;AAAA;AAEJ,MAAI,uBAAuB;AACvB,aAAS,eAAe,UAAU,qBAAqB;AACvD,0BAAsB,oBAAoB,SAAS,wCAAgB;AACnE,0BAAsB,OAAO;AAC7B,QAAI,6BAA6B;AAC7B,MAAC,4BAA4C,MAAM;AAAA,QAC/C;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AAEA,MAAI,gBAAgB;AAChB,mBAAe,YAAY;AAC3B,UAAM,gBAAgB;AAAA,MAClB,kDAA+B;AAAA,MAC/B,kDAA+B;AAAA,IACnC;AACA,kBAAc,QAAQ,CAAC,UAAU;AA7JzC;AA+JY,WAAI,2CAAAA,YAAA,mBAA0B,2BAA1B,mBAAkD,IAAI,QAAQ;AAE9D,oDAAAA,YAAA,mBAA0B,oBAA1B,4BAA4C;AAAA,MAChD;AAAA,IACJ,CAAC;AAAA,EACL;AACJ;","names":["visualBuilderPostMessage"]}

package/dist/legacy/visualBuilder/utils/handleIndividualFields.d.cts

@@ -1,16 +1,14 @@
 import { VisualBuilderCslpEventDetails } from '../types/visualBuilder.types.cjs';
+import { VisualBuilderEditContext } from './types/index.types.cjs';
 import '../../cslp/types/cslp.types.cjs';
+import '../../cms/types/contentTypeSchema.types.cjs';
 
 /**
  * It handles all the fields based on their data type and its "multiple" property.
  * @param eventDetails The event details object that contain cslp and field metadata.
  * @param elements The elements object that contain the visual builder wrapper.
  */
-declare function handleIndividualFields(eventDetails: VisualBuilderCslpEventDetails, elements: {
-    visualBuilderContainer: HTMLDivElement;
-    resizeObserver: ResizeObserver;
-    lastEditedField: Element | null;
-}): Promise<void>;
+declare function handleIndividualFields(eventDetails: VisualBuilderCslpEventDetails, elements: VisualBuilderEditContext): Promise<void>;
 declare function cleanIndividualFieldResidual(elements: {
     overlayWrapper: HTMLDivElement;
     visualBuilderContainer: HTMLDivElement | null;

package/dist/legacy/visualBuilder/utils/handleIndividualFields.d.ts

@@ -1,16 +1,14 @@
 import { VisualBuilderCslpEventDetails } from '../types/visualBuilder.types.js';
+import { VisualBuilderEditContext } from './types/index.types.js';
 import '../../cslp/types/cslp.types.js';
+import '../../cms/types/contentTypeSchema.types.js';
 
 /**
  * It handles all the fields based on their data type and its "multiple" property.
  * @param eventDetails The event details object that contain cslp and field metadata.
  * @param elements The elements object that contain the visual builder wrapper.
  */
-declare function handleIndividualFields(eventDetails: VisualBuilderCslpEventDetails, elements: {
-    visualBuilderContainer: HTMLDivElement;
-    resizeObserver: ResizeObserver;
-    lastEditedField: Element | null;
-}): Promise<void>;
+declare function handleIndividualFields(eventDetails: VisualBuilderCslpEventDetails, elements: VisualBuilderEditContext): Promise<void>;
 declare function cleanIndividualFieldResidual(elements: {
     overlayWrapper: HTMLDivElement;
     visualBuilderContainer: HTMLDivElement | null;