npm - @contentstack/live-preview-utils - Versions diffs - 3.0.0 → 3.0.2 - Mend

@contentstack/live-preview-utils 3.0.0 → 3.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (215) hide show

package/dist/modern/visualBuilder/utils/getPsuedoEditableStylesElement.cjs ADDED Viewed

@@ -0,0 +1,56 @@
+"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);
+// src/visualBuilder/utils/getPsuedoEditableStylesElement.ts
+var getPsuedoEditableStylesElement_exports = {};
+__export(getPsuedoEditableStylesElement_exports, {
+  getPsuedoEditableElementStyles: () => getPsuedoEditableElementStyles
+});
+module.exports = __toCommonJS(getPsuedoEditableStylesElement_exports);
+var import_getCamelCaseStyles = __toESM(require("./getCamelCaseStyles.cjs"), 1);
+var import_getStyleOfAnElement = __toESM(require("./getStyleOfAnElement.cjs"), 1);
+function getPsuedoEditableElementStyles(psuedoEditableElement, camelCase) {
+  let styles = (0, import_getStyleOfAnElement.default)(psuedoEditableElement);
+  if (camelCase) {
+    styles = (0, import_getCamelCaseStyles.default)(styles);
+  }
+  const rect = psuedoEditableElement.getBoundingClientRect();
+  styles.position = "absolute";
+  styles.top = `${rect.top + window.scrollY}px`;
+  styles.left = `${rect.left + window.scrollX}px`;
+  styles.height = "auto";
+  styles.whiteSpace = "pre-line";
+  styles.textTransform = "none";
+  return styles;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  getPsuedoEditableElementStyles
+});
+//# sourceMappingURL=getPsuedoEditableStylesElement.cjs.map

package/dist/modern/visualBuilder/utils/getPsuedoEditableStylesElement.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../src/visualBuilder/utils/getPsuedoEditableStylesElement.ts"],"sourcesContent":["import getCamelCaseStyles from \"./getCamelCaseStyles\";\nimport getStyleOfAnElement from \"./getStyleOfAnElement\";\n\nexport function getPsuedoEditableElementStyles(\n psuedoEditableElement: HTMLElement,\n camelCase?: boolean\n): { [key: string]: string } {\n let styles = getStyleOfAnElement(psuedoEditableElement);\n if (camelCase) {\n styles = getCamelCaseStyles(styles);\n }\n // Get the offsetTop and offsetLeft of the editable element and set the position of the pseudo editable element\n // The pseudo editable element is positioned absolutely at the same location as the editable element\n const rect = psuedoEditableElement.getBoundingClientRect();\n\n styles.position = \"absolute\";\n styles.top = `${rect.top + window.scrollY}px`;\n styles.left = `${rect.left + window.scrollX}px`;\n // setting height to auto so that the element can grow based on the content\n // and the resize observer can detect the change in height\n styles.height = \"auto\";\n styles.whiteSpace = \"pre-line\";\n styles.textTransform = \"none\";\n\n return styles;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gCAA+B;AAC/B,iCAAgC;AAEzB,SAAS,+BACZ,uBACA,WACyB;AACzB,MAAI,aAAS,2BAAAA,SAAoB,qBAAqB;AACtD,MAAI,WAAW;AACX,iBAAS,0BAAAC,SAAmB,MAAM;AAAA,EACtC;AAGA,QAAM,OAAO,sBAAsB,sBAAsB;AAEzD,SAAO,WAAW;AAClB,SAAO,MAAM,GAAG,KAAK,MAAM,OAAO,OAAO;AACzC,SAAO,OAAO,GAAG,KAAK,OAAO,OAAO,OAAO;AAG3C,SAAO,SAAS;AAChB,SAAO,aAAa;AACpB,SAAO,gBAAgB;AAEvB,SAAO;AACX;","names":["getStyleOfAnElement","getCamelCaseStyles"]}

package/dist/modern/visualBuilder/utils/getPsuedoEditableStylesElement.d.cts ADDED Viewed

@@ -0,0 +1,5 @@
+declare function getPsuedoEditableElementStyles(psuedoEditableElement: HTMLElement, camelCase?: boolean): {
+    [key: string]: string;
+};
+export { getPsuedoEditableElementStyles };

package/dist/modern/visualBuilder/utils/getPsuedoEditableStylesElement.d.ts ADDED Viewed

@@ -0,0 +1,5 @@
+declare function getPsuedoEditableElementStyles(psuedoEditableElement: HTMLElement, camelCase?: boolean): {
+    [key: string]: string;
+};
+export { getPsuedoEditableElementStyles };

package/dist/modern/visualBuilder/utils/getPsuedoEditableStylesElement.js ADDED Viewed

@@ -0,0 +1,23 @@
+import "../../chunk-5WRI5ZAA.js";
+// src/visualBuilder/utils/getPsuedoEditableStylesElement.ts
+import getCamelCaseStyles from "./getCamelCaseStyles.js";
+import getStyleOfAnElement from "./getStyleOfAnElement.js";
+function getPsuedoEditableElementStyles(psuedoEditableElement, camelCase) {
+  let styles = getStyleOfAnElement(psuedoEditableElement);
+  if (camelCase) {
+    styles = getCamelCaseStyles(styles);
+  }
+  const rect = psuedoEditableElement.getBoundingClientRect();
+  styles.position = "absolute";
+  styles.top = `${rect.top + window.scrollY}px`;
+  styles.left = `${rect.left + window.scrollX}px`;
+  styles.height = "auto";
+  styles.whiteSpace = "pre-line";
+  styles.textTransform = "none";
+  return styles;
+}
+export {
+  getPsuedoEditableElementStyles
+};
+//# sourceMappingURL=getPsuedoEditableStylesElement.js.map

package/dist/modern/visualBuilder/utils/getPsuedoEditableStylesElement.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../src/visualBuilder/utils/getPsuedoEditableStylesElement.ts"],"sourcesContent":["import getCamelCaseStyles from \"./getCamelCaseStyles\";\nimport getStyleOfAnElement from \"./getStyleOfAnElement\";\n\nexport function getPsuedoEditableElementStyles(\n psuedoEditableElement: HTMLElement,\n camelCase?: boolean\n): { [key: string]: string } {\n let styles = getStyleOfAnElement(psuedoEditableElement);\n if (camelCase) {\n styles = getCamelCaseStyles(styles);\n }\n // Get the offsetTop and offsetLeft of the editable element and set the position of the pseudo editable element\n // The pseudo editable element is positioned absolutely at the same location as the editable element\n const rect = psuedoEditableElement.getBoundingClientRect();\n\n styles.position = \"absolute\";\n styles.top = `${rect.top + window.scrollY}px`;\n styles.left = `${rect.left + window.scrollX}px`;\n // setting height to auto so that the element can grow based on the content\n // and the resize observer can detect the change in height\n styles.height = \"auto\";\n styles.whiteSpace = \"pre-line\";\n styles.textTransform = \"none\";\n\n return styles;\n}\n"],"mappings":";;;AAAA,OAAO,wBAAwB;AAC/B,OAAO,yBAAyB;AAEzB,SAAS,+BACZ,uBACA,WACyB;AACzB,MAAI,SAAS,oBAAoB,qBAAqB;AACtD,MAAI,WAAW;AACX,aAAS,mBAAmB,MAAM;AAAA,EACtC;AAGA,QAAM,OAAO,sBAAsB,sBAAsB;AAEzD,SAAO,WAAW;AAClB,SAAO,MAAM,GAAG,KAAK,MAAM,OAAO,OAAO;AACzC,SAAO,OAAO,GAAG,KAAK,OAAO,OAAO,OAAO;AAG3C,SAAO,SAAS;AAChB,SAAO,aAAa;AACpB,SAAO,gBAAgB;AAEvB,SAAO;AACX;","names":[]}

package/dist/modern/visualBuilder/utils/getStyleOfAnElement.cjs CHANGED Viewed

@@ -33,6 +33,8 @@ function getStyleOfAnElement(element) {
     "right",
     "bottom",
     "text-overflow",
+    // allows seeing the text from CMS field as-is
+    "text-transform",
     "margin",
     "margin-block-end",
     "margin-block-start",

package/dist/modern/visualBuilder/utils/getStyleOfAnElement.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/visualBuilder/utils/getStyleOfAnElement.ts"],"sourcesContent":["/*\n Retrieves the computed style of an HTML element.\n \n @param element - The HTML element to retrieve the style from.\n * @returns An object representing the computed style of the element.\n */\nexport default function getStyleOfAnElement(element: HTMLElement): {\n [key: string]: string;\n} {\n const styleSheetDeclaration = window.getComputedStyle(element);\n const styleSheetArray = Array.from(styleSheetDeclaration);\n\n const FILTER_STYLES = [\n \"position\",\n \"left\",\n \"top\",\n \"right\",\n \"bottom\",\n \"text-overflow\",\n \"margin\",\n \"margin-block-end\",\n \"margin-block-start\",\n \"margin-inline-end\",\n \"margin-inline-start\",\n \"margin-left\",\n \"margin-right\",\n \"margin-top\",\n \"margin-bottom\",\n \"-webkit-user-modify\",\n \"cursor\",\n ];\n\n const styles: { [key: string]: string } = {};\n styleSheetArray.forEach((style: string) => {\n if (!FILTER_STYLES.includes(style)) {\n const styleValue = styleSheetDeclaration.getPropertyValue(style);\n styles[style] = styleValue;\n }\n });\n\n return styles;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAMe,SAAR,oBAAqC,SAE1C;AACE,QAAM,wBAAwB,OAAO,iBAAiB,OAAO;AAC7D,QAAM,kBAAkB,MAAM,KAAK,qBAAqB;AAExD,QAAM,gBAAgB;AAAA,IAClB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AAEA,QAAM,SAAoC,CAAC;AAC3C,kBAAgB,QAAQ,CAAC,UAAkB;AACvC,QAAI,CAAC,cAAc,SAAS,KAAK,GAAG;AAChC,YAAM,aAAa,sBAAsB,iBAAiB,KAAK;AAC/D,aAAO,KAAK,IAAI;AAAA,IACpB;AAAA,EACJ,CAAC;AAED,SAAO;AACX;","names":[]}
1	+ {"version":3,"sources":["../../../../src/visualBuilder/utils/getStyleOfAnElement.ts"],"sourcesContent":["/*\n Retrieves the computed style of an HTML element.\n \n @param element - The HTML element to retrieve the style from.\n * @returns An object representing the computed style of the element.\n */\nexport default function getStyleOfAnElement(element: HTMLElement): {\n [key: string]: string;\n} {\n const styleSheetDeclaration = window.getComputedStyle(element);\n const styleSheetArray = Array.from(styleSheetDeclaration);\n\n const FILTER_STYLES = [\n \"position\",\n \"left\",\n \"top\",\n \"right\",\n \"bottom\",\n \"text-overflow\",\n // allows seeing the text from CMS field as-is\n \"text-transform\",\n \"margin\",\n \"margin-block-end\",\n \"margin-block-start\",\n \"margin-inline-end\",\n \"margin-inline-start\",\n \"margin-left\",\n \"margin-right\",\n \"margin-top\",\n \"margin-bottom\",\n \"-webkit-user-modify\",\n \"cursor\",\n ];\n\n const styles: { [key: string]: string } = {};\n styleSheetArray.forEach((style: string) => {\n if (!FILTER_STYLES.includes(style)) {\n const styleValue = styleSheetDeclaration.getPropertyValue(style);\n styles[style] = styleValue;\n }\n });\n\n return styles;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAMe,SAAR,oBAAqC,SAE1C;AACE,QAAM,wBAAwB,OAAO,iBAAiB,OAAO;AAC7D,QAAM,kBAAkB,MAAM,KAAK,qBAAqB;AAExD,QAAM,gBAAgB;AAAA,IAClB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AAEA,QAAM,SAAoC,CAAC;AAC3C,kBAAgB,QAAQ,CAAC,UAAkB;AACvC,QAAI,CAAC,cAAc,SAAS,KAAK,GAAG;AAChC,YAAM,aAAa,sBAAsB,iBAAiB,KAAK;AAC/D,aAAO,KAAK,IAAI;AAAA,IACpB;AAAA,EACJ,CAAC;AAED,SAAO;AACX;","names":[]}

package/dist/modern/visualBuilder/utils/getStyleOfAnElement.js CHANGED Viewed

@@ -11,6 +11,8 @@ function getStyleOfAnElement(element) {
     "right",
     "bottom",
     "text-overflow",
+    // allows seeing the text from CMS field as-is
+    "text-transform",
     "margin",
     "margin-block-end",
     "margin-block-start",

package/dist/modern/visualBuilder/utils/getStyleOfAnElement.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/visualBuilder/utils/getStyleOfAnElement.ts"],"sourcesContent":["/*\n Retrieves the computed style of an HTML element.\n \n @param element - The HTML element to retrieve the style from.\n * @returns An object representing the computed style of the element.\n */\nexport default function getStyleOfAnElement(element: HTMLElement): {\n [key: string]: string;\n} {\n const styleSheetDeclaration = window.getComputedStyle(element);\n const styleSheetArray = Array.from(styleSheetDeclaration);\n\n const FILTER_STYLES = [\n \"position\",\n \"left\",\n \"top\",\n \"right\",\n \"bottom\",\n \"text-overflow\",\n \"margin\",\n \"margin-block-end\",\n \"margin-block-start\",\n \"margin-inline-end\",\n \"margin-inline-start\",\n \"margin-left\",\n \"margin-right\",\n \"margin-top\",\n \"margin-bottom\",\n \"-webkit-user-modify\",\n \"cursor\",\n ];\n\n const styles: { [key: string]: string } = {};\n styleSheetArray.forEach((style: string) => {\n if (!FILTER_STYLES.includes(style)) {\n const styleValue = styleSheetDeclaration.getPropertyValue(style);\n styles[style] = styleValue;\n }\n });\n\n return styles;\n}\n"],"mappings":";;;AAMe,SAAR,oBAAqC,SAE1C;AACE,QAAM,wBAAwB,OAAO,iBAAiB,OAAO;AAC7D,QAAM,kBAAkB,MAAM,KAAK,qBAAqB;AAExD,QAAM,gBAAgB;AAAA,IAClB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AAEA,QAAM,SAAoC,CAAC;AAC3C,kBAAgB,QAAQ,CAAC,UAAkB;AACvC,QAAI,CAAC,cAAc,SAAS,KAAK,GAAG;AAChC,YAAM,aAAa,sBAAsB,iBAAiB,KAAK;AAC/D,aAAO,KAAK,IAAI;AAAA,IACpB;AAAA,EACJ,CAAC;AAED,SAAO;AACX;","names":[]}
1	+ {"version":3,"sources":["../../../../src/visualBuilder/utils/getStyleOfAnElement.ts"],"sourcesContent":["/*\n Retrieves the computed style of an HTML element.\n \n @param element - The HTML element to retrieve the style from.\n * @returns An object representing the computed style of the element.\n */\nexport default function getStyleOfAnElement(element: HTMLElement): {\n [key: string]: string;\n} {\n const styleSheetDeclaration = window.getComputedStyle(element);\n const styleSheetArray = Array.from(styleSheetDeclaration);\n\n const FILTER_STYLES = [\n \"position\",\n \"left\",\n \"top\",\n \"right\",\n \"bottom\",\n \"text-overflow\",\n // allows seeing the text from CMS field as-is\n \"text-transform\",\n \"margin\",\n \"margin-block-end\",\n \"margin-block-start\",\n \"margin-inline-end\",\n \"margin-inline-start\",\n \"margin-left\",\n \"margin-right\",\n \"margin-top\",\n \"margin-bottom\",\n \"-webkit-user-modify\",\n \"cursor\",\n ];\n\n const styles: { [key: string]: string } = {};\n styleSheetArray.forEach((style: string) => {\n if (!FILTER_STYLES.includes(style)) {\n const styleValue = styleSheetDeclaration.getPropertyValue(style);\n styles[style] = styleValue;\n }\n });\n\n return styles;\n}\n"],"mappings":";;;AAMe,SAAR,oBAAqC,SAE1C;AACE,QAAM,wBAAwB,OAAO,iBAAiB,OAAO;AAC7D,QAAM,kBAAkB,MAAM,KAAK,qBAAqB;AAExD,QAAM,gBAAgB;AAAA,IAClB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AAEA,QAAM,SAAoC,CAAC;AAC3C,kBAAgB,QAAQ,CAAC,UAAkB;AACvC,QAAI,CAAC,cAAc,SAAS,KAAK,GAAG;AAChC,YAAM,aAAa,sBAAsB,iBAAiB,KAAK;AAC/D,aAAO,KAAK,IAAI;AAAA,IACpB;AAAA,EACJ,CAAC;AAED,SAAO;AACX;","names":[]}

package/dist/modern/visualBuilder/utils/handleFieldMouseDown.cjs CHANGED Viewed

@@ -29,6 +29,7 @@ var import_generateOverlay = require("../generators/generateOverlay.cjs");
 var import_constants = require("./constants.cjs");
 var import_types = require("./types/index.types.cjs");
 var import_postMessage = require("./types/postMessage.types.cjs");
+var import_insertSpaceAtCursor = require("./insertSpaceAtCursor.cjs");
 function handleFieldInput(e) {
   const event = e;
   const targetElement = event.target;
@@ -59,12 +60,21 @@ function handleFieldKeyDown(e) {
   const fieldType = targetElement.getAttribute(
     import_constants.VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY
   );
+  if (targetElement.tagName === "BUTTON") {
+    handleKeyDownOnButton(event);
+  }
   if (fieldType === import_types.FieldDataType.NUMBER) {
     handleNumericFieldKeyDown(event);
   } else if (fieldType === import_types.FieldDataType.SINGLELINE) {
     handleSingleLineFieldKeyDown(event);
   }
 }
+function handleKeyDownOnButton(e) {
+  if (e.code === "Space" && e.target) {
+    e.preventDefault();
+    (0, import_insertSpaceAtCursor.insertSpaceAtCursor)(e.target);
+  }
+}
 function handleSingleLineFieldKeyDown(e) {
   if (e.code === "Enter") {
     e.preventDefault();

package/dist/modern/visualBuilder/utils/handleFieldMouseDown.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/visualBuilder/utils/handleFieldMouseDown.ts"],"sourcesContent":["import { throttle } from \"lodash-es\";\nimport { sendFieldEvent } from \"../generators/generateOverlay\";\nimport {\n ALLOWED_INLINE_EDITABLE_FIELD,\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n numericInputRegex,\n} from \"./constants\";\nimport { FieldDataType } from \"./types/index.types\";\nimport { VisualBuilderPostMessageEvents } from \"./types/postMessage.types\";\n\nexport function handleFieldInput(e: Event): void {\n const event = e as InputEvent;\n const targetElement = event.target as HTMLElement;\n const fieldType = targetElement.getAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY\n ) as FieldDataType \| null;\n if (event.type === \"input\" && ALLOWED_INLINE_EDITABLE_FIELD.includes(fieldType as FieldDataType)) {\n throttledFieldSync();\n }\n}\nconst throttledFieldSync = throttle(() => {\n try {\n const visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n ) as HTMLElement;\n if(!visualBuilderContainer) return;\n sendFieldEvent({\n visualBuilderContainer,\n eventType: VisualBuilderPostMessageEvents.SYNC_FIELD,\n }) \n } catch (error) {\n console.error(\"Error in throttledFieldSync\", error)\n }\n}, 300);\n\nexport function handleFieldKeyDown(e: Event): void {\n const event = e as KeyboardEvent;\n const targetElement = event.target as HTMLElement;\n const fieldType = targetElement.getAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY\n ) as FieldDataType \| null;\n\n if (fieldType === FieldDataType.NUMBER) {\n handleNumericFieldKeyDown(event);\n } else if (fieldType === FieldDataType.SINGLELINE) {\n handleSingleLineFieldKeyDown(event);\n }\n}\n\nfunction handleSingleLineFieldKeyDown(e: KeyboardEvent) {\n if (e.code === \"Enter\") {\n e.preventDefault();\n }\n}\n\nfunction handleNumericFieldKeyDown(event: KeyboardEvent): void {\n const targetElement = event.target as HTMLElement;\n\n const allowedKeys = [\n \"Backspace\",\n \"Tab\",\n \"Enter\",\n \"End\",\n \"Home\",\n \"ArrowLeft\",\n \"ArrowRight\",\n \"Delete\",\n ];\n\n if (\n event.ctrlKey \|\|\n event.metaKey \|\|\n event.altKey \|\|\n allowedKeys.includes(event.code)\n ) {\n // Allow Ctrl, Cmd, Alt, and special keys\n return;\n }\n\n if (event.code.includes(\"Digit\")) {\n return;\n }\n\n const nonNumericAllowedCharacters = [\"-\", \".\", \"e\", \"E\"];\n\n if (!nonNumericAllowedCharacters.includes(event.key)) {\n event.preventDefault();\n return;\n }\n\n const selection = {\n startOffset: window.getSelection()?.getRangeAt(0).startOffset \|\| 0,\n endOffset: window.getSelection()?.getRangeAt(0).endOffset \|\| 0,\n };\n\n const existingInput = targetElement.textContent \|\| \"\";\n const currentOutputArr = existingInput.split(\"\");\n currentOutputArr.splice(\n selection.startOffset,\n selection.endOffset - selection.startOffset,\n event.key\n );\n const currentInput = currentOutputArr.join(\"\");\n\n if (!numericInputRegex.test(currentInput)) {\n event.preventDefault();\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAyB;AACzB,6BAA+B;AAC/B,uBAIO;AACP,mBAA8B;AAC9B,yBAA+C;~~AAExC~~,SAAS,iBAAiB,GAAgB;AAC7C,QAAM,QAAQ;AACd,QAAM,gBAAgB,MAAM;AAC5B,QAAM,YAAY,cAAc;AAAA,IAC5B;AAAA,EACJ;AACA,~~MAAI~~,MAAM,SAAS,~~WAAW~~,+CAA8B,SAAS,SAA0B,~~GAAG~~;~~AAC9F~~,uBAAmB;AAAA,EACvB;AACJ;AACA,IAAM,yBAAqB,2BAAS,MAAM;AACtC,MAAI;AACA,UAAM,yBAAyB,SAAS;AAAA,MACpC;AAAA,IACJ;AACA,~~QAAG~~,CAAC,uBAAwB;~~AAC5B~~,+CAAe;AAAA,MACX;AAAA,MACA,WAAW,kDAA+B;AAAA,IAC9C,CAAC;AAAA,EACL,SAAS,OAAO;AACZ,YAAQ,MAAM,+BAA+B,KAAK;AAAA,EACtD;AACJ,GAAG,GAAG;AAEC,SAAS,mBAAmB,GAAgB;AAC/C,QAAM,QAAQ;AACd,QAAM,gBAAgB,MAAM;AAC5B,QAAM,YAAY,cAAc;AAAA,IAC5B;AAAA,EACJ;AAEA,MAAI,cAAc,2BAAc,QAAQ;AACpC,8BAA0B,KAAK;AAAA,EACnC,WAAW,cAAc,2BAAc,YAAY;AAC/C,iCAA6B,KAAK;AAAA,EACtC;AACJ;AAEA,SAAS,6BAA6B,GAAkB;AACpD,MAAI,EAAE,SAAS,SAAS;AACpB,MAAE,eAAe;AAAA,EACrB;AACJ;AAEA,SAAS,0BAA0B,OAA4B;AAC3D,QAAM,gBAAgB,MAAM;AAE5B,QAAM,cAAc;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AAEA,MACI,MAAM,WACN,MAAM,WACN,MAAM,UACN,YAAY,SAAS,MAAM,IAAI,GACjC;AAEE;AAAA,EACJ;AAEA,MAAI,MAAM,KAAK,SAAS,OAAO,GAAG;AAC9B;AAAA,EACJ;AAEA,QAAM,8BAA8B,CAAC,KAAK,KAAK,KAAK,GAAG;AAEvD,MAAI,CAAC,4BAA4B,SAAS,MAAM,GAAG,GAAG;AAClD,UAAM,eAAe;AACrB;AAAA,EACJ;AAEA,QAAM,YAAY;AAAA,IACd,aAAa,OAAO,aAAa,GAAG,WAAW,CAAC,EAAE,eAAe;AAAA,IACjE,WAAW,OAAO,aAAa,GAAG,WAAW,CAAC,EAAE,aAAa;AAAA,EACjE;AAEA,QAAM,gBAAgB,cAAc,eAAe;AACnD,QAAM,mBAAmB,cAAc,MAAM,EAAE;AAC/C,mBAAiB;AAAA,IACb,UAAU;AAAA,IACV,UAAU,YAAY,UAAU;AAAA,IAChC,MAAM;AAAA,EACV;AACA,QAAM,eAAe,iBAAiB,KAAK,EAAE;AAE7C,MAAI,CAAC,mCAAkB,KAAK,YAAY,GAAG;AACvC,UAAM,eAAe;AAAA,EACzB;AACJ;","names":[]}
1	+ {"version":3,"sources":["../../../../src/visualBuilder/utils/handleFieldMouseDown.ts"],"sourcesContent":["import { throttle } from \"lodash-es\";\nimport { sendFieldEvent } from \"../generators/generateOverlay\";\nimport {\n ALLOWED_INLINE_EDITABLE_FIELD,\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n numericInputRegex,\n} from \"./constants\";\nimport { FieldDataType } from \"./types/index.types\";\nimport { VisualBuilderPostMessageEvents } from \"./types/postMessage.types\";\nimport { insertSpaceAtCursor } from \"./insertSpaceAtCursor\";\n\nexport function handleFieldInput(e: Event): void {\n const event = e as InputEvent;\n const targetElement = event.target as HTMLElement;\n const fieldType = targetElement.getAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY\n ) as FieldDataType \| null;\n if (\n event.type === \"input\" &&\n ALLOWED_INLINE_EDITABLE_FIELD.includes(fieldType as FieldDataType)\n ) {\n throttledFieldSync();\n }\n}\nconst throttledFieldSync = throttle(() => {\n try {\n const visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n ) as HTMLElement;\n if (!visualBuilderContainer) return;\n sendFieldEvent({\n visualBuilderContainer,\n eventType: VisualBuilderPostMessageEvents.SYNC_FIELD,\n });\n } catch (error) {\n console.error(\"Error in throttledFieldSync\", error);\n }\n}, 300);\n\nexport function handleFieldKeyDown(e: Event): void {\n const event = e as KeyboardEvent;\n const targetElement = event.target as HTMLElement;\n const fieldType = targetElement.getAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY\n ) as FieldDataType \| null;\n\n if (targetElement.tagName === \"BUTTON\") {\n handleKeyDownOnButton(event);\n }\n if (fieldType === FieldDataType.NUMBER) {\n handleNumericFieldKeyDown(event);\n } else if (fieldType === FieldDataType.SINGLELINE) {\n handleSingleLineFieldKeyDown(event);\n }\n}\n\n// spaces do not work inside a button content-editable\n// this adds a space and moves the cursor ahead, the\n// button press event is also prevented\nfunction handleKeyDownOnButton(e: KeyboardEvent) {\n if (e.code === \"Space\" && e.target) {\n e.preventDefault();\n insertSpaceAtCursor(e.target as HTMLElement);\n }\n}\n\nfunction handleSingleLineFieldKeyDown(e: KeyboardEvent) {\n if (e.code === \"Enter\") {\n e.preventDefault();\n }\n}\n\nfunction handleNumericFieldKeyDown(event: KeyboardEvent): void {\n const targetElement = event.target as HTMLElement;\n\n const allowedKeys = [\n \"Backspace\",\n \"Tab\",\n \"Enter\",\n \"End\",\n \"Home\",\n \"ArrowLeft\",\n \"ArrowRight\",\n \"Delete\",\n ];\n\n if (\n event.ctrlKey \|\|\n event.metaKey \|\|\n event.altKey \|\|\n allowedKeys.includes(event.code)\n ) {\n // Allow Ctrl, Cmd, Alt, and special keys\n return;\n }\n\n if (event.code.includes(\"Digit\")) {\n return;\n }\n\n const nonNumericAllowedCharacters = [\"-\", \".\", \"e\", \"E\"];\n\n if (!nonNumericAllowedCharacters.includes(event.key)) {\n event.preventDefault();\n return;\n }\n\n const selection = {\n startOffset: window.getSelection()?.getRangeAt(0).startOffset \|\| 0,\n endOffset: window.getSelection()?.getRangeAt(0).endOffset \|\| 0,\n };\n\n const existingInput = targetElement.textContent \|\| \"\";\n const currentOutputArr = existingInput.split(\"\");\n currentOutputArr.splice(\n selection.startOffset,\n selection.endOffset - selection.startOffset,\n event.key\n );\n const currentInput = currentOutputArr.join(\"\");\n\n if (!numericInputRegex.test(currentInput)) {\n event.preventDefault();\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAyB;AACzB,6BAA+B;AAC/B,uBAIO;AACP,mBAA8B;AAC9B,yBAA+C;AAC/C,iCAAoC;AAE7B,SAAS,iBAAiB,GAAgB;AAC7C,QAAM,QAAQ;AACd,QAAM,gBAAgB,MAAM;AAC5B,QAAM,YAAY,cAAc;AAAA,IAC5B;AAAA,EACJ;AACA,MACI,MAAM,SAAS,WACf,+CAA8B,SAAS,SAA0B,GACnE;AACE,uBAAmB;AAAA,EACvB;AACJ;AACA,IAAM,yBAAqB,2BAAS,MAAM;AACtC,MAAI;AACA,UAAM,yBAAyB,SAAS;AAAA,MACpC;AAAA,IACJ;AACA,QAAI,CAAC,uBAAwB;AAC7B,+CAAe;AAAA,MACX;AAAA,MACA,WAAW,kDAA+B;AAAA,IAC9C,CAAC;AAAA,EACL,SAAS,OAAO;AACZ,YAAQ,MAAM,+BAA+B,KAAK;AAAA,EACtD;AACJ,GAAG,GAAG;AAEC,SAAS,mBAAmB,GAAgB;AAC/C,QAAM,QAAQ;AACd,QAAM,gBAAgB,MAAM;AAC5B,QAAM,YAAY,cAAc;AAAA,IAC5B;AAAA,EACJ;AAEA,MAAI,cAAc,YAAY,UAAU;AACpC,0BAAsB,KAAK;AAAA,EAC/B;AACA,MAAI,cAAc,2BAAc,QAAQ;AACpC,8BAA0B,KAAK;AAAA,EACnC,WAAW,cAAc,2BAAc,YAAY;AAC/C,iCAA6B,KAAK;AAAA,EACtC;AACJ;AAKA,SAAS,sBAAsB,GAAkB;AAC7C,MAAI,EAAE,SAAS,WAAW,EAAE,QAAQ;AAChC,MAAE,eAAe;AACjB,wDAAoB,EAAE,MAAqB;AAAA,EAC/C;AACJ;AAEA,SAAS,6BAA6B,GAAkB;AACpD,MAAI,EAAE,SAAS,SAAS;AACpB,MAAE,eAAe;AAAA,EACrB;AACJ;AAEA,SAAS,0BAA0B,OAA4B;AAC3D,QAAM,gBAAgB,MAAM;AAE5B,QAAM,cAAc;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AAEA,MACI,MAAM,WACN,MAAM,WACN,MAAM,UACN,YAAY,SAAS,MAAM,IAAI,GACjC;AAEE;AAAA,EACJ;AAEA,MAAI,MAAM,KAAK,SAAS,OAAO,GAAG;AAC9B;AAAA,EACJ;AAEA,QAAM,8BAA8B,CAAC,KAAK,KAAK,KAAK,GAAG;AAEvD,MAAI,CAAC,4BAA4B,SAAS,MAAM,GAAG,GAAG;AAClD,UAAM,eAAe;AACrB;AAAA,EACJ;AAEA,QAAM,YAAY;AAAA,IACd,aAAa,OAAO,aAAa,GAAG,WAAW,CAAC,EAAE,eAAe;AAAA,IACjE,WAAW,OAAO,aAAa,GAAG,WAAW,CAAC,EAAE,aAAa;AAAA,EACjE;AAEA,QAAM,gBAAgB,cAAc,eAAe;AACnD,QAAM,mBAAmB,cAAc,MAAM,EAAE;AAC/C,mBAAiB;AAAA,IACb,UAAU;AAAA,IACV,UAAU,YAAY,UAAU;AAAA,IAChC,MAAM;AAAA,EACV;AACA,QAAM,eAAe,iBAAiB,KAAK,EAAE;AAE7C,MAAI,CAAC,mCAAkB,KAAK,YAAY,GAAG;AACvC,UAAM,eAAe;AAAA,EACzB;AACJ;","names":[]}

package/dist/modern/visualBuilder/utils/handleFieldMouseDown.js CHANGED Viewed

@@ -10,6 +10,7 @@ import {
 } from "./constants.js";
 import { FieldDataType } from "./types/index.types.js";
 import { VisualBuilderPostMessageEvents } from "./types/postMessage.types.js";
+import { insertSpaceAtCursor } from "./insertSpaceAtCursor.js";
 function handleFieldInput(e) {
   const event = e;
   const targetElement = event.target;
@@ -40,12 +41,21 @@ function handleFieldKeyDown(e) {
   const fieldType = targetElement.getAttribute(
     VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY
   );
+  if (targetElement.tagName === "BUTTON") {
+    handleKeyDownOnButton(event);
+  }
   if (fieldType === FieldDataType.NUMBER) {
     handleNumericFieldKeyDown(event);
   } else if (fieldType === FieldDataType.SINGLELINE) {
     handleSingleLineFieldKeyDown(event);
   }
 }
+function handleKeyDownOnButton(e) {
+  if (e.code === "Space" && e.target) {
+    e.preventDefault();
+    insertSpaceAtCursor(e.target);
+  }
+}
 function handleSingleLineFieldKeyDown(e) {
   if (e.code === "Enter") {
     e.preventDefault();

package/dist/modern/visualBuilder/utils/handleFieldMouseDown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/visualBuilder/utils/handleFieldMouseDown.ts"],"sourcesContent":["import { throttle } from \"lodash-es\";\nimport { sendFieldEvent } from \"../generators/generateOverlay\";\nimport {\n ALLOWED_INLINE_EDITABLE_FIELD,\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n numericInputRegex,\n} from \"./constants\";\nimport { FieldDataType } from \"./types/index.types\";\nimport { VisualBuilderPostMessageEvents } from \"./types/postMessage.types\";\n\nexport function handleFieldInput(e: Event): void {\n const event = e as InputEvent;\n const targetElement = event.target as HTMLElement;\n const fieldType = targetElement.getAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY\n ) as FieldDataType \| null;\n if (event.type === \"input\" && ALLOWED_INLINE_EDITABLE_FIELD.includes(fieldType as FieldDataType)) {\n throttledFieldSync();\n }\n}\nconst throttledFieldSync = throttle(() => {\n try {\n const visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n ) as HTMLElement;\n if(!visualBuilderContainer) return;\n sendFieldEvent({\n visualBuilderContainer,\n eventType: VisualBuilderPostMessageEvents.SYNC_FIELD,\n }) \n } catch (error) {\n console.error(\"Error in throttledFieldSync\", error)\n }\n}, 300);\n\nexport function handleFieldKeyDown(e: Event): void {\n const event = e as KeyboardEvent;\n const targetElement = event.target as HTMLElement;\n const fieldType = targetElement.getAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY\n ) as FieldDataType \| null;\n\n if (fieldType === FieldDataType.NUMBER) {\n handleNumericFieldKeyDown(event);\n } else if (fieldType === FieldDataType.SINGLELINE) {\n handleSingleLineFieldKeyDown(event);\n }\n}\n\nfunction handleSingleLineFieldKeyDown(e: KeyboardEvent) {\n if (e.code === \"Enter\") {\n e.preventDefault();\n }\n}\n\nfunction handleNumericFieldKeyDown(event: KeyboardEvent): void {\n const targetElement = event.target as HTMLElement;\n\n const allowedKeys = [\n \"Backspace\",\n \"Tab\",\n \"Enter\",\n \"End\",\n \"Home\",\n \"ArrowLeft\",\n \"ArrowRight\",\n \"Delete\",\n ];\n\n if (\n event.ctrlKey \|\|\n event.metaKey \|\|\n event.altKey \|\|\n allowedKeys.includes(event.code)\n ) {\n // Allow Ctrl, Cmd, Alt, and special keys\n return;\n }\n\n if (event.code.includes(\"Digit\")) {\n return;\n }\n\n const nonNumericAllowedCharacters = [\"-\", \".\", \"e\", \"E\"];\n\n if (!nonNumericAllowedCharacters.includes(event.key)) {\n event.preventDefault();\n return;\n }\n\n const selection = {\n startOffset: window.getSelection()?.getRangeAt(0).startOffset \|\| 0,\n endOffset: window.getSelection()?.getRangeAt(0).endOffset \|\| 0,\n };\n\n const existingInput = targetElement.textContent \|\| \"\";\n const currentOutputArr = existingInput.split(\"\");\n currentOutputArr.splice(\n selection.startOffset,\n selection.endOffset - selection.startOffset,\n event.key\n );\n const currentInput = currentOutputArr.join(\"\");\n\n if (!numericInputRegex.test(currentInput)) {\n event.preventDefault();\n }\n}\n"],"mappings":";;;AAAA,SAAS,gBAAgB;AACzB,SAAS,sBAAsB;AAC/B;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,OACG;AACP,SAAS,qBAAqB;AAC9B,SAAS,sCAAsC;~~AAExC~~,SAAS,iBAAiB,GAAgB;AAC7C,QAAM,QAAQ;AACd,QAAM,gBAAgB,MAAM;AAC5B,QAAM,YAAY,cAAc;AAAA,IAC5B;AAAA,EACJ;AACA,~~MAAI~~,MAAM,SAAS,~~WAAW~~,8BAA8B,SAAS,SAA0B,~~GAAG~~;~~AAC9F~~,uBAAmB;AAAA,EACvB;AACJ;AACA,IAAM,qBAAqB,SAAS,MAAM;AACtC,MAAI;AACA,UAAM,yBAAyB,SAAS;AAAA,MACpC;AAAA,IACJ;AACA,~~QAAG~~,CAAC,uBAAwB;~~AAC5B~~,mBAAe;AAAA,MACX;AAAA,MACA,WAAW,+BAA+B;AAAA,IAC9C,CAAC;AAAA,EACL,SAAS,OAAO;AACZ,YAAQ,MAAM,+BAA+B,KAAK;AAAA,EACtD;AACJ,GAAG,GAAG;AAEC,SAAS,mBAAmB,GAAgB;AAC/C,QAAM,QAAQ;AACd,QAAM,gBAAgB,MAAM;AAC5B,QAAM,YAAY,cAAc;AAAA,IAC5B;AAAA,EACJ;AAEA,MAAI,cAAc,cAAc,QAAQ;AACpC,8BAA0B,KAAK;AAAA,EACnC,WAAW,cAAc,cAAc,YAAY;AAC/C,iCAA6B,KAAK;AAAA,EACtC;AACJ;AAEA,SAAS,6BAA6B,GAAkB;AACpD,MAAI,EAAE,SAAS,SAAS;AACpB,MAAE,eAAe;AAAA,EACrB;AACJ;AAEA,SAAS,0BAA0B,OAA4B;AAC3D,QAAM,gBAAgB,MAAM;AAE5B,QAAM,cAAc;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AAEA,MACI,MAAM,WACN,MAAM,WACN,MAAM,UACN,YAAY,SAAS,MAAM,IAAI,GACjC;AAEE;AAAA,EACJ;AAEA,MAAI,MAAM,KAAK,SAAS,OAAO,GAAG;AAC9B;AAAA,EACJ;AAEA,QAAM,8BAA8B,CAAC,KAAK,KAAK,KAAK,GAAG;AAEvD,MAAI,CAAC,4BAA4B,SAAS,MAAM,GAAG,GAAG;AAClD,UAAM,eAAe;AACrB;AAAA,EACJ;AAEA,QAAM,YAAY;AAAA,IACd,aAAa,OAAO,aAAa,GAAG,WAAW,CAAC,EAAE,eAAe;AAAA,IACjE,WAAW,OAAO,aAAa,GAAG,WAAW,CAAC,EAAE,aAAa;AAAA,EACjE;AAEA,QAAM,gBAAgB,cAAc,eAAe;AACnD,QAAM,mBAAmB,cAAc,MAAM,EAAE;AAC/C,mBAAiB;AAAA,IACb,UAAU;AAAA,IACV,UAAU,YAAY,UAAU;AAAA,IAChC,MAAM;AAAA,EACV;AACA,QAAM,eAAe,iBAAiB,KAAK,EAAE;AAE7C,MAAI,CAAC,kBAAkB,KAAK,YAAY,GAAG;AACvC,UAAM,eAAe;AAAA,EACzB;AACJ;","names":[]}
1	+ {"version":3,"sources":["../../../../src/visualBuilder/utils/handleFieldMouseDown.ts"],"sourcesContent":["import { throttle } from \"lodash-es\";\nimport { sendFieldEvent } from \"../generators/generateOverlay\";\nimport {\n ALLOWED_INLINE_EDITABLE_FIELD,\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n numericInputRegex,\n} from \"./constants\";\nimport { FieldDataType } from \"./types/index.types\";\nimport { VisualBuilderPostMessageEvents } from \"./types/postMessage.types\";\nimport { insertSpaceAtCursor } from \"./insertSpaceAtCursor\";\n\nexport function handleFieldInput(e: Event): void {\n const event = e as InputEvent;\n const targetElement = event.target as HTMLElement;\n const fieldType = targetElement.getAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY\n ) as FieldDataType \| null;\n if (\n event.type === \"input\" &&\n ALLOWED_INLINE_EDITABLE_FIELD.includes(fieldType as FieldDataType)\n ) {\n throttledFieldSync();\n }\n}\nconst throttledFieldSync = throttle(() => {\n try {\n const visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n ) as HTMLElement;\n if (!visualBuilderContainer) return;\n sendFieldEvent({\n visualBuilderContainer,\n eventType: VisualBuilderPostMessageEvents.SYNC_FIELD,\n });\n } catch (error) {\n console.error(\"Error in throttledFieldSync\", error);\n }\n}, 300);\n\nexport function handleFieldKeyDown(e: Event): void {\n const event = e as KeyboardEvent;\n const targetElement = event.target as HTMLElement;\n const fieldType = targetElement.getAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY\n ) as FieldDataType \| null;\n\n if (targetElement.tagName === \"BUTTON\") {\n handleKeyDownOnButton(event);\n }\n if (fieldType === FieldDataType.NUMBER) {\n handleNumericFieldKeyDown(event);\n } else if (fieldType === FieldDataType.SINGLELINE) {\n handleSingleLineFieldKeyDown(event);\n }\n}\n\n// spaces do not work inside a button content-editable\n// this adds a space and moves the cursor ahead, the\n// button press event is also prevented\nfunction handleKeyDownOnButton(e: KeyboardEvent) {\n if (e.code === \"Space\" && e.target) {\n e.preventDefault();\n insertSpaceAtCursor(e.target as HTMLElement);\n }\n}\n\nfunction handleSingleLineFieldKeyDown(e: KeyboardEvent) {\n if (e.code === \"Enter\") {\n e.preventDefault();\n }\n}\n\nfunction handleNumericFieldKeyDown(event: KeyboardEvent): void {\n const targetElement = event.target as HTMLElement;\n\n const allowedKeys = [\n \"Backspace\",\n \"Tab\",\n \"Enter\",\n \"End\",\n \"Home\",\n \"ArrowLeft\",\n \"ArrowRight\",\n \"Delete\",\n ];\n\n if (\n event.ctrlKey \|\|\n event.metaKey \|\|\n event.altKey \|\|\n allowedKeys.includes(event.code)\n ) {\n // Allow Ctrl, Cmd, Alt, and special keys\n return;\n }\n\n if (event.code.includes(\"Digit\")) {\n return;\n }\n\n const nonNumericAllowedCharacters = [\"-\", \".\", \"e\", \"E\"];\n\n if (!nonNumericAllowedCharacters.includes(event.key)) {\n event.preventDefault();\n return;\n }\n\n const selection = {\n startOffset: window.getSelection()?.getRangeAt(0).startOffset \|\| 0,\n endOffset: window.getSelection()?.getRangeAt(0).endOffset \|\| 0,\n };\n\n const existingInput = targetElement.textContent \|\| \"\";\n const currentOutputArr = existingInput.split(\"\");\n currentOutputArr.splice(\n selection.startOffset,\n selection.endOffset - selection.startOffset,\n event.key\n );\n const currentInput = currentOutputArr.join(\"\");\n\n if (!numericInputRegex.test(currentInput)) {\n event.preventDefault();\n }\n}\n"],"mappings":";;;AAAA,SAAS,gBAAgB;AACzB,SAAS,sBAAsB;AAC/B;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,OACG;AACP,SAAS,qBAAqB;AAC9B,SAAS,sCAAsC;AAC/C,SAAS,2BAA2B;AAE7B,SAAS,iBAAiB,GAAgB;AAC7C,QAAM,QAAQ;AACd,QAAM,gBAAgB,MAAM;AAC5B,QAAM,YAAY,cAAc;AAAA,IAC5B;AAAA,EACJ;AACA,MACI,MAAM,SAAS,WACf,8BAA8B,SAAS,SAA0B,GACnE;AACE,uBAAmB;AAAA,EACvB;AACJ;AACA,IAAM,qBAAqB,SAAS,MAAM;AACtC,MAAI;AACA,UAAM,yBAAyB,SAAS;AAAA,MACpC;AAAA,IACJ;AACA,QAAI,CAAC,uBAAwB;AAC7B,mBAAe;AAAA,MACX;AAAA,MACA,WAAW,+BAA+B;AAAA,IAC9C,CAAC;AAAA,EACL,SAAS,OAAO;AACZ,YAAQ,MAAM,+BAA+B,KAAK;AAAA,EACtD;AACJ,GAAG,GAAG;AAEC,SAAS,mBAAmB,GAAgB;AAC/C,QAAM,QAAQ;AACd,QAAM,gBAAgB,MAAM;AAC5B,QAAM,YAAY,cAAc;AAAA,IAC5B;AAAA,EACJ;AAEA,MAAI,cAAc,YAAY,UAAU;AACpC,0BAAsB,KAAK;AAAA,EAC/B;AACA,MAAI,cAAc,cAAc,QAAQ;AACpC,8BAA0B,KAAK;AAAA,EACnC,WAAW,cAAc,cAAc,YAAY;AAC/C,iCAA6B,KAAK;AAAA,EACtC;AACJ;AAKA,SAAS,sBAAsB,GAAkB;AAC7C,MAAI,EAAE,SAAS,WAAW,EAAE,QAAQ;AAChC,MAAE,eAAe;AACjB,wBAAoB,EAAE,MAAqB;AAAA,EAC/C;AACJ;AAEA,SAAS,6BAA6B,GAAkB;AACpD,MAAI,EAAE,SAAS,SAAS;AACpB,MAAE,eAAe;AAAA,EACrB;AACJ;AAEA,SAAS,0BAA0B,OAA4B;AAC3D,QAAM,gBAAgB,MAAM;AAE5B,QAAM,cAAc;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AAEA,MACI,MAAM,WACN,MAAM,WACN,MAAM,UACN,YAAY,SAAS,MAAM,IAAI,GACjC;AAEE;AAAA,EACJ;AAEA,MAAI,MAAM,KAAK,SAAS,OAAO,GAAG;AAC9B;AAAA,EACJ;AAEA,QAAM,8BAA8B,CAAC,KAAK,KAAK,KAAK,GAAG;AAEvD,MAAI,CAAC,4BAA4B,SAAS,MAAM,GAAG,GAAG;AAClD,UAAM,eAAe;AACrB;AAAA,EACJ;AAEA,QAAM,YAAY;AAAA,IACd,aAAa,OAAO,aAAa,GAAG,WAAW,CAAC,EAAE,eAAe;AAAA,IACjE,WAAW,OAAO,aAAa,GAAG,WAAW,CAAC,EAAE,aAAa;AAAA,EACjE;AAEA,QAAM,gBAAgB,cAAc,eAAe;AACnD,QAAM,mBAAmB,cAAc,MAAM,EAAE;AAC/C,mBAAiB;AAAA,IACb,UAAU;AAAA,IACV,UAAU,YAAY,UAAU;AAAA,IAChC,MAAM;AAAA,EACV;AACA,QAAM,eAAe,iBAAiB,KAAK,EAAE;AAE7C,MAAI,CAAC,kBAAkB,KAAK,YAAY,GAAG;AACvC,UAAM,eAAe;AAAA,EACzB;AACJ;","names":[]}

package/dist/modern/visualBuilder/utils/handleIndividualFields.cjs CHANGED Viewed

@@ -1,7 +1,9 @@
 "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)
@@ -15,6 +17,14 @@ var __copyProps = (to, from, except, desc) => {
   }
   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);
 // src/visualBuilder/utils/handleIndividualFields.ts
@@ -37,6 +47,8 @@ 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);
 async function handleIndividualFields(eventDetails, elements) {
   const { fieldMetadata, editableElement } = eventDetails;
   const { visualBuilderContainer, lastEditedField, resizeObserver } = elements;
@@ -54,15 +66,13 @@ async function handleIndividualFields(eventDetails, elements) {
       fieldPathWithIndex
     )
   ]);
-  const expectedFieldInstanceData = Array.isArray(expectedFieldData) ? expectedFieldData.at(fieldMetadata.multipleFieldMetadata.index) : void 0;
   const fieldType = (0, import_getFieldType.getFieldType)(fieldSchema);
   const { isDisabled: disabled } = (0, import_isFieldDisabled.isFieldDisabled)(fieldSchema, eventDetails);
   editableElement.setAttribute(
     import_constants.VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
     fieldType
   );
-  if (fieldSchema && (fieldSchema?.multiple || fieldSchema?.data_type === "reference" && // @ts-ignore
-  fieldSchema?.field_metadata.ref_multiple)) {
+  if (isFieldMultiple(fieldSchema)) {
     if (lastEditedField !== editableElement) {
       const addButtonLabel = fieldSchema.data_type === "blocks" ? (
         // ? `Add ${fieldSchema.display_name ?? "Modular Block"}`
@@ -83,73 +93,78 @@ async function handleIndividualFields(eventDetails, elements) {
         }
       );
     }
-    if (eventDetails.fieldMetadata.multipleFieldMetadata.index > -1) {
-      handleSingleField(
-        {
-          editableElement,
-          visualBuilderContainer,
-          resizeObserver: elements.resizeObserver
-        },
-        { expectedFieldData: expectedFieldInstanceData, disabled }
-      );
-    }
-  } else {
-    handleSingleField(
-      {
-        editableElement,
-        visualBuilderContainer,
-        resizeObserver: elements.resizeObserver
-      },
-      { expectedFieldData, disabled }
-    );
   }
-  function handleSingleField(elements2, config) {
-    const { editableElement: editableElement2, visualBuilderContainer: visualBuilderContainer2 } = elements2;
-    if (config.disabled) {
-      return;
+  !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);
     }
-    if (import_constants.ALLOWED_INLINE_EDITABLE_FIELD.includes(fieldType)) {
-      let actualEditableField = editableElement2;
+    function enableInlineEditing(expectedFieldData2) {
+      let actualEditableField = editableElement;
       import__.VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = actualEditableField?.innerText;
       const elementComputedDisplay = window.getComputedStyle(actualEditableField).display;
-      let textContent = editableElement2.innerText || editableElement2.textContent || "";
+      let textContent = editableElement.innerText || editableElement.textContent || "";
       if (fieldType === import_types.FieldDataType.MULTILINE) {
         textContent = (0, import_getMultilinePlaintext.getMultilinePlaintext)(actualEditableField);
         actualEditableField.addEventListener("paste", pasteAsPlainText);
       }
-      const expectedTextContent = config.expectedFieldData;
-      if (textContent !== expectedTextContent || (0, import_generatePseudoEditableField.isEllipsisActive)(editableElement2)) {
+      const expectedTextContent = expectedFieldData2;
+      if (expectedTextContent && textContent !== expectedTextContent || (0, import_generatePseudoEditableField.isEllipsisActive)(editableElement)) {
         const pseudoEditableField = (0, import_generatePseudoEditableField.generatePseudoEditableElement)(
-          { editableElement: editableElement2 },
-          { textContent: config.expectedFieldData }
+          { editableElement },
+          { textContent: expectedFieldData2 }
         );
-        editableElement2.style.visibility = "hidden";
+        editableElement.style.visibility = "hidden";
         pseudoEditableField.setAttribute(
           import_constants.VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
           fieldType
         );
-        visualBuilderContainer2.appendChild(pseudoEditableField);
+        visualBuilderContainer.appendChild(pseudoEditableField);
         actualEditableField = pseudoEditableField;
         if (fieldType === import_types.FieldDataType.MULTILINE)
           actualEditableField.addEventListener(
             "paste",
             pasteAsPlainText
           );
-        elements2.resizeObserver.observe(pseudoEditableField);
+        elements.resizeObserver.observe(pseudoEditableField);
       } else if (elementComputedDisplay === "inline") {
         const onInlineElementInput = (0, import_lodash_es.throttle)(() => {
-          const overlayWrapper = visualBuilderContainer2.querySelector(
+          const overlayWrapper = visualBuilderContainer.querySelector(
             ".visual-builder__overlay__wrapper"
           );
-          const focusedToolbar = visualBuilderContainer2.querySelector(
+          const focusedToolbar = visualBuilderContainer.querySelector(
             ".visual-builder__focused-toolbar"
           );
           (0, import_updateFocussedState.updateFocussedState)({
             editableElement: actualEditableField,
-            visualBuilderContainer: visualBuilderContainer2,
+            visualBuilderContainer,
             overlayWrapper,
-            resizeObserver,
-            focusedToolbar
+            focusedToolbar,
+            resizeObserver
           });
         }, 200);
         actualEditableField.addEventListener(
@@ -165,6 +180,10 @@ async function handleIndividualFields(eventDetails, elements) {
     }
   }
 }
+function isFieldMultiple(fieldSchema) {
+  return fieldSchema && (fieldSchema.multiple || fieldSchema.data_type === "reference" && // @ts-ignore
+  fieldSchema.field_metadata.ref_multiple);
+}
 function cleanIndividualFieldResidual(elements) {
   const { overlayWrapper, visualBuilderContainer, focusedToolbar } = elements;
   (0, import_multipleElementAddButton.removeAddInstanceButtons)(
@@ -210,6 +229,10 @@ function cleanIndividualFieldResidual(elements) {
   }
   if (focusedToolbar) {
     focusedToolbar.innerHTML = "";
+    const toolbarEvents = [import_postMessage.VisualBuilderPostMessageEvents.DELETE_INSTANCE, import_postMessage.VisualBuilderPostMessageEvents.UPDATE_DISCUSSION_ID];
+    toolbarEvents.forEach((event) => {
+      import_visualBuilderPostMessage.default?.unregisterEvent?.(event);
+    });
   }
 }
 var pasteAsPlainText = (0, import_lodash_es.debounce)(

package/dist/modern/visualBuilder/utils/handleIndividualFields.cjs.map CHANGED Viewed

	@@ -1 +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 visualBuilderPostMessage from \"./visualBuilderPostMessage\";\nimport {\n handleAddButtonsForMultiple,\n removeAddInstanceButtons,\n} from \"./multipleElementAddButton\";\nimport { VisualBuilderPostMessageEvents } from \"./types/postMessage.types\";\nimport { updateFocussedState } from \"./updateFocussedState\";\nimport { FieldDataType } from \"./types/index.types\";\nimport { getMultilinePlaintext } from \"./getMultilinePlaintext\";\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 // if value is an array, get the value for the instance\n const expectedFieldInstanceData = Array.isArray(expectedFieldData)\n ? expectedFieldData.at(fieldMetadata.multipleFieldMetadata.index)\n : undefined;\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 (\n fieldSchema &&\n (fieldSchema?.multiple \|\|\n (fieldSchema?.data_type === \"reference\" &&\n // @ts-ignore\n fieldSchema?.field_metadata.ref_multiple))\n ) {\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 // fields could be handled as they are in a single instance\n if (eventDetails.fieldMetadata.multipleFieldMetadata.index > -1) {\n handleSingleField(\n {\n editableElement,\n visualBuilderContainer,\n resizeObserver: elements.resizeObserver,\n },\n { expectedFieldData: expectedFieldInstanceData, disabled }\n );\n }\n } else {\n handleSingleField(\n {\n editableElement,\n visualBuilderContainer,\n resizeObserver: elements.resizeObserver,\n },\n { expectedFieldData, disabled }\n );\n }\n\n /*\n Handles all the fields based on their data type.\n /\n function handleSingleField(\n elements: {\n editableElement: Element;\n visualBuilderContainer: HTMLDivElement;\n resizeObserver: ResizeObserver;\n },\n config: { expectedFieldData: string; disabled?: boolean }\n ) {\n const { editableElement, visualBuilderContainer } = elements;\n\n if (config.disabled) {\n return;\n }\n\n // title, single single_line, single multi_line, single number\n if (ALLOWED_INLINE_EDITABLE_FIELD.includes(fieldType)) {\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 = config.expectedFieldData;\n if (\n textContent !== expectedTextContent \|\|\n isEllipsisActive(editableElement as HTMLElement)\n ) {\n // TODO: Testing will be don in the E2E.\n const pseudoEditableField = generatePseudoEditableElement(\n { editableElement: editableElement as HTMLElement },\n { textContent: config.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 resizeObserver,\n focusedToolbar,\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\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 }\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":["elements","editableElement","visualBuilderContainer"]}
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"]}