@contentstack/live-preview-utils 2.0.4 → 3.0.0

package/dist/modern/visualBuilder/utils/handleIndividualFields.js

@@ -0,0 +1,218 @@
+import "../../chunk-5WRI5ZAA.js";
+
+// src/visualBuilder/utils/handleIndividualFields.ts
+import { debounce, throttle } from "lodash-es";
+import { VisualBuilder } from "../index.js";
+import {
+  generatePseudoEditableElement,
+  isEllipsisActive
+} from "../generators/generatePseudoEditableField.js";
+import {
+  ALLOWED_INLINE_EDITABLE_FIELD,
+  VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY
+} from "./constants.js";
+import { FieldSchemaMap } from "./fieldSchemaMap.js";
+import { getFieldData } from "./getFieldData.js";
+import { getFieldType } from "./getFieldType.js";
+import { handleFieldInput, handleFieldKeyDown } from "./handleFieldMouseDown.js";
+import { isFieldDisabled } from "./isFieldDisabled.js";
+import {
+  handleAddButtonsForMultiple,
+  removeAddInstanceButtons
+} from "./multipleElementAddButton.js";
+import { updateFocussedState } from "./updateFocussedState.js";
+import { FieldDataType } from "./types/index.types.js";
+import { getMultilinePlaintext } from "./getMultilinePlaintext.js";
+async function handleIndividualFields(eventDetails, elements) {
+  const { fieldMetadata, editableElement } = eventDetails;
+  const { visualBuilderContainer, lastEditedField, resizeObserver } = elements;
+  const {
+    content_type_uid,
+    entry_uid,
+    locale,
+    fieldPath,
+    fieldPathWithIndex
+  } = fieldMetadata;
+  const [fieldSchema, expectedFieldData] = await Promise.all([
+    FieldSchemaMap.getFieldSchema(content_type_uid, fieldPath),
+    getFieldData(
+      { content_type_uid, entry_uid, locale },
+      fieldPathWithIndex
+    )
+  ]);
+  const expectedFieldInstanceData = Array.isArray(expectedFieldData) ? expectedFieldData.at(fieldMetadata.multipleFieldMetadata.index) : void 0;
+  const fieldType = getFieldType(fieldSchema);
+  const { isDisabled: disabled } = isFieldDisabled(fieldSchema, eventDetails);
+  editableElement.setAttribute(
+    VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
+    fieldType
+  );
+  if (fieldSchema && (fieldSchema?.multiple || fieldSchema?.data_type === "reference" && // @ts-ignore
+  fieldSchema?.field_metadata.ref_multiple)) {
+    if (lastEditedField !== editableElement) {
+      const addButtonLabel = fieldSchema.data_type === "blocks" ? (
+        // ? `Add ${fieldSchema.display_name ?? "Modular Block"}`
+        "Add Section"
+      ) : void 0;
+      handleAddButtonsForMultiple(
+        eventDetails,
+        {
+          editableElement: eventDetails.editableElement,
+          visualBuilderContainer,
+          resizeObserver
+        },
+        {
+          fieldSchema,
+          expectedFieldData,
+          disabled,
+          label: addButtonLabel
+        }
+      );
+    }
+    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;
+    }
+    if (ALLOWED_INLINE_EDITABLE_FIELD.includes(fieldType)) {
+      let actualEditableField = editableElement2;
+      VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = actualEditableField?.innerText;
+      const elementComputedDisplay = window.getComputedStyle(actualEditableField).display;
+      let textContent = editableElement2.innerText || editableElement2.textContent || "";
+      if (fieldType === FieldDataType.MULTILINE) {
+        textContent = getMultilinePlaintext(actualEditableField);
+        actualEditableField.addEventListener("paste", pasteAsPlainText);
+      }
+      const expectedTextContent = config.expectedFieldData;
+      if (textContent !== expectedTextContent || isEllipsisActive(editableElement2)) {
+        const pseudoEditableField = generatePseudoEditableElement(
+          { editableElement: editableElement2 },
+          { textContent: config.expectedFieldData }
+        );
+        editableElement2.style.visibility = "hidden";
+        pseudoEditableField.setAttribute(
+          VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
+          fieldType
+        );
+        visualBuilderContainer2.appendChild(pseudoEditableField);
+        actualEditableField = pseudoEditableField;
+        if (fieldType === FieldDataType.MULTILINE)
+          actualEditableField.addEventListener(
+            "paste",
+            pasteAsPlainText
+          );
+        elements2.resizeObserver.observe(pseudoEditableField);
+      } else if (elementComputedDisplay === "inline") {
+        const onInlineElementInput = throttle(() => {
+          const overlayWrapper = visualBuilderContainer2.querySelector(
+            ".visual-builder__overlay__wrapper"
+          );
+          const focusedToolbar = visualBuilderContainer2.querySelector(
+            ".visual-builder__focused-toolbar"
+          );
+          updateFocussedState({
+            editableElement: actualEditableField,
+            visualBuilderContainer: visualBuilderContainer2,
+            overlayWrapper,
+            resizeObserver,
+            focusedToolbar
+          });
+        }, 200);
+        actualEditableField.addEventListener(
+          "input",
+          onInlineElementInput
+        );
+      }
+      actualEditableField.setAttribute("contenteditable", "true");
+      actualEditableField.addEventListener("input", handleFieldInput);
+      actualEditableField.addEventListener("keydown", handleFieldKeyDown);
+      actualEditableField.focus();
+      return;
+    }
+  }
+}
+function cleanIndividualFieldResidual(elements) {
+  const { overlayWrapper, visualBuilderContainer, focusedToolbar } = elements;
+  removeAddInstanceButtons(
+    {
+      eventTarget: null,
+      visualBuilderContainer,
+      overlayWrapper
+    },
+    true
+  );
+  const previousSelectedEditableDOM = VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM;
+  if (previousSelectedEditableDOM) {
+    previousSelectedEditableDOM.removeAttribute(
+      VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY
+    );
+    previousSelectedEditableDOM.removeAttribute("contenteditable");
+    previousSelectedEditableDOM.removeEventListener(
+      "input",
+      handleFieldInput
+    );
+    previousSelectedEditableDOM.removeEventListener(
+      "keydown",
+      handleFieldKeyDown
+    );
+    previousSelectedEditableDOM.removeEventListener(
+      "paste",
+      pasteAsPlainText
+    );
+    elements.resizeObserver.unobserve(previousSelectedEditableDOM);
+  }
+  const pseudoEditableElement = visualBuilderContainer?.querySelector(
+    ".visual-builder__pseudo-editable-element"
+  );
+  if (pseudoEditableElement) {
+    elements.resizeObserver.unobserve(pseudoEditableElement);
+    pseudoEditableElement.removeEventListener("paste", pasteAsPlainText);
+    pseudoEditableElement.remove();
+    if (previousSelectedEditableDOM) {
+      previousSelectedEditableDOM.style.removeProperty(
+        "visibility"
+      );
+    }
+  }
+  if (focusedToolbar) {
+    focusedToolbar.innerHTML = "";
+  }
+}
+var pasteAsPlainText = debounce(
+  (e) => {
+    e.preventDefault();
+    const clipboardData = e.clipboardData;
+    document.execCommand(
+      "inserttext",
+      false,
+      clipboardData?.getData("text/plain")
+    );
+  },
+  100,
+  { leading: true }
+);
+export {
+  cleanIndividualFieldResidual,
+  handleIndividualFields
+};
+//# sourceMappingURL=handleIndividualFields.js.map

package/dist/modern/visualBuilder/utils/handleIndividualFields.js.map

@@ -0,0 +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"]}

package/dist/modern/visualBuilder/utils/instanceHandlers.cjs

@@ -0,0 +1,60 @@
+"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/instanceHandlers.ts
+var instanceHandlers_exports = {};
+__export(instanceHandlers_exports, {
+  handleDeleteInstance: () => handleDeleteInstance,
+  handleMoveInstance: () => handleMoveInstance
+});
+module.exports = __toCommonJS(instanceHandlers_exports);
+var import_visualBuilderPostMessage = __toESM(require("./visualBuilderPostMessage.cjs"), 1);
+var import_postMessage = require("./../utils/types/postMessage.types.cjs");
+function handleDeleteInstance(fieldMetadata) {
+  import_visualBuilderPostMessage.default?.send(import_postMessage.VisualBuilderPostMessageEvents.DELETE_INSTANCE, {
+    data: fieldMetadata.fieldPathWithIndex + "." + fieldMetadata.multipleFieldMetadata.index,
+    fieldMetadata
+  }).finally(closeOverlay);
+}
+function handleMoveInstance(fieldMetadata, direction) {
+  import_visualBuilderPostMessage.default?.send(import_postMessage.VisualBuilderPostMessageEvents.MOVE_INSTANCE, {
+    data: fieldMetadata.fieldPathWithIndex + "." + fieldMetadata.multipleFieldMetadata.index,
+    direction,
+    fieldMetadata
+  }).finally(closeOverlay);
+}
+function closeOverlay() {
+  document.querySelector(".visual-builder__overlay--top")?.click();
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  handleDeleteInstance,
+  handleMoveInstance
+});
+//# sourceMappingURL=instanceHandlers.cjs.map

package/dist/modern/visualBuilder/utils/instanceHandlers.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/visualBuilder/utils/instanceHandlers.ts"],"sourcesContent":["import visualBuilderPostMessage from \"./visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"./../utils/types/postMessage.types\";\nimport { CslpData } from \"../../cslp/types/cslp.types\";\n\nexport function handleDeleteInstance(fieldMetadata: CslpData): void {\n    visualBuilderPostMessage\n        ?.send(VisualBuilderPostMessageEvents.DELETE_INSTANCE, {\n            data:\n                fieldMetadata.fieldPathWithIndex +\n                \".\" +\n                fieldMetadata.multipleFieldMetadata.index,\n            fieldMetadata: fieldMetadata,\n        })\n        .finally(closeOverlay);\n}\n\nexport function handleMoveInstance(\n    fieldMetadata: CslpData,\n    direction: \"previous\" | \"next\"\n): void {\n    //TODO: Disable first and last instance move\n    visualBuilderPostMessage\n        ?.send(VisualBuilderPostMessageEvents.MOVE_INSTANCE, {\n            data:\n                fieldMetadata.fieldPathWithIndex +\n                \".\" +\n                fieldMetadata.multipleFieldMetadata.index,\n            direction: direction,\n            fieldMetadata: fieldMetadata,\n        })\n        .finally(closeOverlay);\n}\n\nfunction closeOverlay(): void {\n    document\n        .querySelector<HTMLDivElement>(\".visual-builder__overlay--top\")\n        ?.click();\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sCAAqC;AACrC,yBAA+C;AAGxC,SAAS,qBAAqB,eAA+B;AAChE,kCAAAA,SACM,KAAK,kDAA+B,iBAAiB;AAAA,IACnD,MACI,cAAc,qBACd,MACA,cAAc,sBAAsB;AAAA,IACxC;AAAA,EACJ,CAAC,EACA,QAAQ,YAAY;AAC7B;AAEO,SAAS,mBACZ,eACA,WACI;AAEJ,kCAAAA,SACM,KAAK,kDAA+B,eAAe;AAAA,IACjD,MACI,cAAc,qBACd,MACA,cAAc,sBAAsB;AAAA,IACxC;AAAA,IACA;AAAA,EACJ,CAAC,EACA,QAAQ,YAAY;AAC7B;AAEA,SAAS,eAAqB;AAC1B,WACK,cAA8B,+BAA+B,GAC5D,MAAM;AAChB;","names":["visualBuilderPostMessage"]}

package/dist/modern/visualBuilder/utils/instanceHandlers.d.cts

@@ -0,0 +1,6 @@
+import { CslpData } from '../../cslp/types/cslp.types.cjs';
+
+declare function handleDeleteInstance(fieldMetadata: CslpData): void;
+declare function handleMoveInstance(fieldMetadata: CslpData, direction: "previous" | "next"): void;
+
+export { handleDeleteInstance, handleMoveInstance };

package/dist/modern/visualBuilder/utils/instanceHandlers.d.ts

@@ -0,0 +1,6 @@
+import { CslpData } from '../../cslp/types/cslp.types.js';
+
+declare function handleDeleteInstance(fieldMetadata: CslpData): void;
+declare function handleMoveInstance(fieldMetadata: CslpData, direction: "previous" | "next"): void;
+
+export { handleDeleteInstance, handleMoveInstance };

package/dist/modern/visualBuilder/utils/instanceHandlers.js

@@ -0,0 +1,26 @@
+import "../../chunk-5WRI5ZAA.js";
+
+// src/visualBuilder/utils/instanceHandlers.ts
+import visualBuilderPostMessage from "./visualBuilderPostMessage.js";
+import { VisualBuilderPostMessageEvents } from "./../utils/types/postMessage.types.js";
+function handleDeleteInstance(fieldMetadata) {
+  visualBuilderPostMessage?.send(VisualBuilderPostMessageEvents.DELETE_INSTANCE, {
+    data: fieldMetadata.fieldPathWithIndex + "." + fieldMetadata.multipleFieldMetadata.index,
+    fieldMetadata
+  }).finally(closeOverlay);
+}
+function handleMoveInstance(fieldMetadata, direction) {
+  visualBuilderPostMessage?.send(VisualBuilderPostMessageEvents.MOVE_INSTANCE, {
+    data: fieldMetadata.fieldPathWithIndex + "." + fieldMetadata.multipleFieldMetadata.index,
+    direction,
+    fieldMetadata
+  }).finally(closeOverlay);
+}
+function closeOverlay() {
+  document.querySelector(".visual-builder__overlay--top")?.click();
+}
+export {
+  handleDeleteInstance,
+  handleMoveInstance
+};
+//# sourceMappingURL=instanceHandlers.js.map

package/dist/modern/visualBuilder/utils/instanceHandlers.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/visualBuilder/utils/instanceHandlers.ts"],"sourcesContent":["import visualBuilderPostMessage from \"./visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"./../utils/types/postMessage.types\";\nimport { CslpData } from \"../../cslp/types/cslp.types\";\n\nexport function handleDeleteInstance(fieldMetadata: CslpData): void {\n    visualBuilderPostMessage\n        ?.send(VisualBuilderPostMessageEvents.DELETE_INSTANCE, {\n            data:\n                fieldMetadata.fieldPathWithIndex +\n                \".\" +\n                fieldMetadata.multipleFieldMetadata.index,\n            fieldMetadata: fieldMetadata,\n        })\n        .finally(closeOverlay);\n}\n\nexport function handleMoveInstance(\n    fieldMetadata: CslpData,\n    direction: \"previous\" | \"next\"\n): void {\n    //TODO: Disable first and last instance move\n    visualBuilderPostMessage\n        ?.send(VisualBuilderPostMessageEvents.MOVE_INSTANCE, {\n            data:\n                fieldMetadata.fieldPathWithIndex +\n                \".\" +\n                fieldMetadata.multipleFieldMetadata.index,\n            direction: direction,\n            fieldMetadata: fieldMetadata,\n        })\n        .finally(closeOverlay);\n}\n\nfunction closeOverlay(): void {\n    document\n        .querySelector<HTMLDivElement>(\".visual-builder__overlay--top\")\n        ?.click();\n}\n"],"mappings":";;;AAAA,OAAO,8BAA8B;AACrC,SAAS,sCAAsC;AAGxC,SAAS,qBAAqB,eAA+B;AAChE,4BACM,KAAK,+BAA+B,iBAAiB;AAAA,IACnD,MACI,cAAc,qBACd,MACA,cAAc,sBAAsB;AAAA,IACxC;AAAA,EACJ,CAAC,EACA,QAAQ,YAAY;AAC7B;AAEO,SAAS,mBACZ,eACA,WACI;AAEJ,4BACM,KAAK,+BAA+B,eAAe;AAAA,IACjD,MACI,cAAc,qBACd,MACA,cAAc,sBAAsB;AAAA,IACxC;AAAA,IACA;AAAA,EACJ,CAAC,EACA,QAAQ,YAAY;AAC7B;AAEA,SAAS,eAAqB;AAC1B,WACK,cAA8B,+BAA+B,GAC5D,MAAM;AAChB;","names":[]}

package/dist/modern/visualBuilder/utils/isFieldDisabled.cjs

@@ -0,0 +1,89 @@
+"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/isFieldDisabled.ts
+var isFieldDisabled_exports = {};
+__export(isFieldDisabled_exports, {
+  isFieldDisabled: () => isFieldDisabled
+});
+module.exports = __toCommonJS(isFieldDisabled_exports);
+var import_configManager = __toESM(require("../../configManager/configManager.cjs"), 1);
+var import__ = require("../index.cjs");
+var getDisableReason = (flags) => {
+  if (flags.updateRestrictDueToRole) return "You have only read access to this field" /* ReadOnly */;
+  if (flags.updateRestrictDueToNonLocalizableFields)
+    return "Editing this field is restricted in localized entries" /* LocalizedEntry */;
+  if (flags.updateRestrictDueToUnlocalizedVariant)
+    return "This field is not editable as it is not localized" /* UnlocalizedVariant */;
+  if (flags.updateRestrictDueToUnlinkVariant)
+    return "This field is not editable as it is not linked to the selected variant" /* UnlinkedVariant */;
+  if (flags.updateRestrictDueToAudienceMode)
+    return "Open an Experience from Audience widget to start editing" /* AudienceMode */;
+  if (flags.updateRestrictDueToDisabledVariant)
+    return "This field is not editable as it doesn't match the selected variant" /* DisabledVariant */;
+  return "" /* None */;
+};
+var isFieldDisabled = (fieldSchemaMap, eventFieldDetails) => {
+  const { editableElement, fieldMetadata } = eventFieldDetails;
+  const masterLocale = import_configManager.default.get().stackDetails.masterLocale || "en-us";
+  const { locale: cmsLocale, variant } = import__.VisualBuilder.VisualBuilderGlobalState.value;
+  const flags = {
+    updateRestrictDueToRole: Boolean(
+      fieldSchemaMap?.field_metadata?.updateRestrict
+    ),
+    updateRestrictDueToUnlinkVariant: Boolean(
+      fieldSchemaMap?.field_metadata?.isUnlinkedVariant
+    ),
+    updateRestrictDueToUnlocalizedVariant: Boolean(
+      variant && fieldMetadata.locale !== cmsLocale
+    ),
+    updateRestrictDueToNonLocalizableFields: Boolean(
+      fieldSchemaMap?.non_localizable && masterLocale !== fieldMetadata.locale
+    ),
+    updateRestrictDueToAudienceMode: false,
+    updateRestrictDueToDisabledVariant: false
+  };
+  if (import__.VisualBuilder.VisualBuilderGlobalState.value.audienceMode && !editableElement.classList.contains("visual-builder__variant-field") && !editableElement.classList.contains("visual-builder__base-field")) {
+    if (editableElement.classList.contains(
+      "visual-builder__disabled-variant-field"
+    )) {
+      flags.updateRestrictDueToDisabledVariant = true;
+    } else {
+      flags.updateRestrictDueToAudienceMode = true;
+    }
+  }
+  const isDisabled = Object.values(flags).some(Boolean);
+  const reason = getDisableReason(flags);
+  return { isDisabled, reason };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  isFieldDisabled
+});
+//# sourceMappingURL=isFieldDisabled.cjs.map

package/dist/modern/visualBuilder/utils/isFieldDisabled.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/visualBuilder/utils/isFieldDisabled.ts"],"sourcesContent":["import { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport Config from \"../../configManager/configManager\";\nimport { ISchemaFieldMap } from \"./types/index.types\";\nimport { VisualBuilder } from \"..\";\nimport { FieldDetails } from \"../components/FieldToolbar\";\n\nenum DisableReason {\n    ReadOnly = \"You have only read access to this field\",\n    LocalizedEntry = \"Editing this field is restricted in localized entries\",\n    UnlinkedVariant = \"This field is not editable as it is not linked to the selected variant\",\n    AudienceMode = \"Open an Experience from Audience widget to start editing\",\n    DisabledVariant = \"This field is not editable as it doesn't match the selected variant\",\n    UnlocalizedVariant = \"This field is not editable as it is not localized\",\n    None = \"\",\n}\n\ninterface FieldDisableState {\n    isDisabled: boolean;\n    reason: DisableReason;\n}\n\nconst getDisableReason = (flags: Record<string, boolean>): DisableReason => {\n    if (flags.updateRestrictDueToRole) return DisableReason.ReadOnly;\n    if (flags.updateRestrictDueToNonLocalizableFields)\n        return DisableReason.LocalizedEntry;\n    if (flags.updateRestrictDueToUnlocalizedVariant)\n        return DisableReason.UnlocalizedVariant;\n    if (flags.updateRestrictDueToUnlinkVariant)\n        return DisableReason.UnlinkedVariant;\n    if (flags.updateRestrictDueToAudienceMode)\n        return DisableReason.AudienceMode;\n    if (flags.updateRestrictDueToDisabledVariant)\n        return DisableReason.DisabledVariant;\n    return DisableReason.None;\n};\n\nexport const isFieldDisabled = (\n    fieldSchemaMap: ISchemaFieldMap,\n    eventFieldDetails: FieldDetails\n): FieldDisableState => {\n    const { editableElement, fieldMetadata } = eventFieldDetails;\n    const masterLocale = Config.get().stackDetails.masterLocale || \"en-us\";\n    const { locale: cmsLocale, variant } =\n        VisualBuilder.VisualBuilderGlobalState.value;\n\n    const flags = {\n        updateRestrictDueToRole: Boolean(\n            fieldSchemaMap?.field_metadata?.updateRestrict\n        ),\n        updateRestrictDueToUnlinkVariant: Boolean(\n            fieldSchemaMap?.field_metadata?.isUnlinkedVariant\n        ),\n        updateRestrictDueToUnlocalizedVariant: Boolean(\n            variant && fieldMetadata.locale !== cmsLocale\n        ),\n        updateRestrictDueToNonLocalizableFields: Boolean(\n            fieldSchemaMap?.non_localizable &&\n                masterLocale !== fieldMetadata.locale\n        ),\n        updateRestrictDueToAudienceMode: false,\n        updateRestrictDueToDisabledVariant: false,\n    };\n\n    if (\n        VisualBuilder.VisualBuilderGlobalState.value.audienceMode &&\n        !editableElement.classList.contains(\"visual-builder__variant-field\") &&\n        !editableElement.classList.contains(\"visual-builder__base-field\")\n    ) {\n        if (\n            editableElement.classList.contains(\n                \"visual-builder__disabled-variant-field\"\n            )\n        ) {\n            flags.updateRestrictDueToDisabledVariant = true;\n        } else {\n            flags.updateRestrictDueToAudienceMode = true;\n        }\n    }\n\n    const isDisabled = Object.values(flags).some(Boolean);\n    const reason = getDisableReason(flags);\n\n    return { isDisabled, reason };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,2BAAmB;AAEnB,eAA8B;AAkB9B,IAAM,mBAAmB,CAAC,UAAkD;AACxE,MAAI,MAAM,wBAAyB,QAAO;AAC1C,MAAI,MAAM;AACN,WAAO;AACX,MAAI,MAAM;AACN,WAAO;AACX,MAAI,MAAM;AACN,WAAO;AACX,MAAI,MAAM;AACN,WAAO;AACX,MAAI,MAAM;AACN,WAAO;AACX,SAAO;AACX;AAEO,IAAM,kBAAkB,CAC3B,gBACA,sBACoB;AACpB,QAAM,EAAE,iBAAiB,cAAc,IAAI;AAC3C,QAAM,eAAe,qBAAAA,QAAO,IAAI,EAAE,aAAa,gBAAgB;AAC/D,QAAM,EAAE,QAAQ,WAAW,QAAQ,IAC/B,uBAAc,yBAAyB;AAE3C,QAAM,QAAQ;AAAA,IACV,yBAAyB;AAAA,MACrB,gBAAgB,gBAAgB;AAAA,IACpC;AAAA,IACA,kCAAkC;AAAA,MAC9B,gBAAgB,gBAAgB;AAAA,IACpC;AAAA,IACA,uCAAuC;AAAA,MACnC,WAAW,cAAc,WAAW;AAAA,IACxC;AAAA,IACA,yCAAyC;AAAA,MACrC,gBAAgB,mBACZ,iBAAiB,cAAc;AAAA,IACvC;AAAA,IACA,iCAAiC;AAAA,IACjC,oCAAoC;AAAA,EACxC;AAEA,MACI,uBAAc,yBAAyB,MAAM,gBAC7C,CAAC,gBAAgB,UAAU,SAAS,+BAA+B,KACnE,CAAC,gBAAgB,UAAU,SAAS,4BAA4B,GAClE;AACE,QACI,gBAAgB,UAAU;AAAA,MACtB;AAAA,IACJ,GACF;AACE,YAAM,qCAAqC;AAAA,IAC/C,OAAO;AACH,YAAM,kCAAkC;AAAA,IAC5C;AAAA,EACJ;AAEA,QAAM,aAAa,OAAO,OAAO,KAAK,EAAE,KAAK,OAAO;AACpD,QAAM,SAAS,iBAAiB,KAAK;AAErC,SAAO,EAAE,YAAY,OAAO;AAChC;","names":["Config"]}

package/dist/modern/visualBuilder/utils/isFieldDisabled.d.cts

@@ -0,0 +1,22 @@
+import { ISchemaFieldMap } from './types/index.types.cjs';
+import { FieldDetails } from '../components/FieldToolbar.cjs';
+import '../../cms/types/contentTypeSchema.types.cjs';
+import '../types/visualBuilder.types.cjs';
+import '../../cslp/types/cslp.types.cjs';
+
+declare enum DisableReason {
+    ReadOnly = "You have only read access to this field",
+    LocalizedEntry = "Editing this field is restricted in localized entries",
+    UnlinkedVariant = "This field is not editable as it is not linked to the selected variant",
+    AudienceMode = "Open an Experience from Audience widget to start editing",
+    DisabledVariant = "This field is not editable as it doesn't match the selected variant",
+    UnlocalizedVariant = "This field is not editable as it is not localized",
+    None = ""
+}
+interface FieldDisableState {
+    isDisabled: boolean;
+    reason: DisableReason;
+}
+declare const isFieldDisabled: (fieldSchemaMap: ISchemaFieldMap, eventFieldDetails: FieldDetails) => FieldDisableState;
+
+export { isFieldDisabled };

package/dist/modern/visualBuilder/utils/isFieldDisabled.d.ts

@@ -0,0 +1,22 @@
+import { ISchemaFieldMap } from './types/index.types.js';
+import { FieldDetails } from '../components/FieldToolbar.js';
+import '../../cms/types/contentTypeSchema.types.js';
+import '../types/visualBuilder.types.js';
+import '../../cslp/types/cslp.types.js';
+
+declare enum DisableReason {
+    ReadOnly = "You have only read access to this field",
+    LocalizedEntry = "Editing this field is restricted in localized entries",
+    UnlinkedVariant = "This field is not editable as it is not linked to the selected variant",
+    AudienceMode = "Open an Experience from Audience widget to start editing",
+    DisabledVariant = "This field is not editable as it doesn't match the selected variant",
+    UnlocalizedVariant = "This field is not editable as it is not localized",
+    None = ""
+}
+interface FieldDisableState {
+    isDisabled: boolean;
+    reason: DisableReason;
+}
+declare const isFieldDisabled: (fieldSchemaMap: ISchemaFieldMap, eventFieldDetails: FieldDetails) => FieldDisableState;
+
+export { isFieldDisabled };

package/dist/modern/visualBuilder/utils/isFieldDisabled.js

@@ -0,0 +1,56 @@
+import "../../chunk-5WRI5ZAA.js";
+
+// src/visualBuilder/utils/isFieldDisabled.ts
+import Config from "../../configManager/configManager.js";
+import { VisualBuilder } from "../index.js";
+var getDisableReason = (flags) => {
+  if (flags.updateRestrictDueToRole) return "You have only read access to this field" /* ReadOnly */;
+  if (flags.updateRestrictDueToNonLocalizableFields)
+    return "Editing this field is restricted in localized entries" /* LocalizedEntry */;
+  if (flags.updateRestrictDueToUnlocalizedVariant)
+    return "This field is not editable as it is not localized" /* UnlocalizedVariant */;
+  if (flags.updateRestrictDueToUnlinkVariant)
+    return "This field is not editable as it is not linked to the selected variant" /* UnlinkedVariant */;
+  if (flags.updateRestrictDueToAudienceMode)
+    return "Open an Experience from Audience widget to start editing" /* AudienceMode */;
+  if (flags.updateRestrictDueToDisabledVariant)
+    return "This field is not editable as it doesn't match the selected variant" /* DisabledVariant */;
+  return "" /* None */;
+};
+var isFieldDisabled = (fieldSchemaMap, eventFieldDetails) => {
+  const { editableElement, fieldMetadata } = eventFieldDetails;
+  const masterLocale = Config.get().stackDetails.masterLocale || "en-us";
+  const { locale: cmsLocale, variant } = VisualBuilder.VisualBuilderGlobalState.value;
+  const flags = {
+    updateRestrictDueToRole: Boolean(
+      fieldSchemaMap?.field_metadata?.updateRestrict
+    ),
+    updateRestrictDueToUnlinkVariant: Boolean(
+      fieldSchemaMap?.field_metadata?.isUnlinkedVariant
+    ),
+    updateRestrictDueToUnlocalizedVariant: Boolean(
+      variant && fieldMetadata.locale !== cmsLocale
+    ),
+    updateRestrictDueToNonLocalizableFields: Boolean(
+      fieldSchemaMap?.non_localizable && masterLocale !== fieldMetadata.locale
+    ),
+    updateRestrictDueToAudienceMode: false,
+    updateRestrictDueToDisabledVariant: false
+  };
+  if (VisualBuilder.VisualBuilderGlobalState.value.audienceMode && !editableElement.classList.contains("visual-builder__variant-field") && !editableElement.classList.contains("visual-builder__base-field")) {
+    if (editableElement.classList.contains(
+      "visual-builder__disabled-variant-field"
+    )) {
+      flags.updateRestrictDueToDisabledVariant = true;
+    } else {
+      flags.updateRestrictDueToAudienceMode = true;
+    }
+  }
+  const isDisabled = Object.values(flags).some(Boolean);
+  const reason = getDisableReason(flags);
+  return { isDisabled, reason };
+};
+export {
+  isFieldDisabled
+};
+//# sourceMappingURL=isFieldDisabled.js.map

package/dist/modern/visualBuilder/utils/isFieldDisabled.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/visualBuilder/utils/isFieldDisabled.ts"],"sourcesContent":["import { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport Config from \"../../configManager/configManager\";\nimport { ISchemaFieldMap } from \"./types/index.types\";\nimport { VisualBuilder } from \"..\";\nimport { FieldDetails } from \"../components/FieldToolbar\";\n\nenum DisableReason {\n    ReadOnly = \"You have only read access to this field\",\n    LocalizedEntry = \"Editing this field is restricted in localized entries\",\n    UnlinkedVariant = \"This field is not editable as it is not linked to the selected variant\",\n    AudienceMode = \"Open an Experience from Audience widget to start editing\",\n    DisabledVariant = \"This field is not editable as it doesn't match the selected variant\",\n    UnlocalizedVariant = \"This field is not editable as it is not localized\",\n    None = \"\",\n}\n\ninterface FieldDisableState {\n    isDisabled: boolean;\n    reason: DisableReason;\n}\n\nconst getDisableReason = (flags: Record<string, boolean>): DisableReason => {\n    if (flags.updateRestrictDueToRole) return DisableReason.ReadOnly;\n    if (flags.updateRestrictDueToNonLocalizableFields)\n        return DisableReason.LocalizedEntry;\n    if (flags.updateRestrictDueToUnlocalizedVariant)\n        return DisableReason.UnlocalizedVariant;\n    if (flags.updateRestrictDueToUnlinkVariant)\n        return DisableReason.UnlinkedVariant;\n    if (flags.updateRestrictDueToAudienceMode)\n        return DisableReason.AudienceMode;\n    if (flags.updateRestrictDueToDisabledVariant)\n        return DisableReason.DisabledVariant;\n    return DisableReason.None;\n};\n\nexport const isFieldDisabled = (\n    fieldSchemaMap: ISchemaFieldMap,\n    eventFieldDetails: FieldDetails\n): FieldDisableState => {\n    const { editableElement, fieldMetadata } = eventFieldDetails;\n    const masterLocale = Config.get().stackDetails.masterLocale || \"en-us\";\n    const { locale: cmsLocale, variant } =\n        VisualBuilder.VisualBuilderGlobalState.value;\n\n    const flags = {\n        updateRestrictDueToRole: Boolean(\n            fieldSchemaMap?.field_metadata?.updateRestrict\n        ),\n        updateRestrictDueToUnlinkVariant: Boolean(\n            fieldSchemaMap?.field_metadata?.isUnlinkedVariant\n        ),\n        updateRestrictDueToUnlocalizedVariant: Boolean(\n            variant && fieldMetadata.locale !== cmsLocale\n        ),\n        updateRestrictDueToNonLocalizableFields: Boolean(\n            fieldSchemaMap?.non_localizable &&\n                masterLocale !== fieldMetadata.locale\n        ),\n        updateRestrictDueToAudienceMode: false,\n        updateRestrictDueToDisabledVariant: false,\n    };\n\n    if (\n        VisualBuilder.VisualBuilderGlobalState.value.audienceMode &&\n        !editableElement.classList.contains(\"visual-builder__variant-field\") &&\n        !editableElement.classList.contains(\"visual-builder__base-field\")\n    ) {\n        if (\n            editableElement.classList.contains(\n                \"visual-builder__disabled-variant-field\"\n            )\n        ) {\n            flags.updateRestrictDueToDisabledVariant = true;\n        } else {\n            flags.updateRestrictDueToAudienceMode = true;\n        }\n    }\n\n    const isDisabled = Object.values(flags).some(Boolean);\n    const reason = getDisableReason(flags);\n\n    return { isDisabled, reason };\n};\n"],"mappings":";;;AACA,OAAO,YAAY;AAEnB,SAAS,qBAAqB;AAkB9B,IAAM,mBAAmB,CAAC,UAAkD;AACxE,MAAI,MAAM,wBAAyB,QAAO;AAC1C,MAAI,MAAM;AACN,WAAO;AACX,MAAI,MAAM;AACN,WAAO;AACX,MAAI,MAAM;AACN,WAAO;AACX,MAAI,MAAM;AACN,WAAO;AACX,MAAI,MAAM;AACN,WAAO;AACX,SAAO;AACX;AAEO,IAAM,kBAAkB,CAC3B,gBACA,sBACoB;AACpB,QAAM,EAAE,iBAAiB,cAAc,IAAI;AAC3C,QAAM,eAAe,OAAO,IAAI,EAAE,aAAa,gBAAgB;AAC/D,QAAM,EAAE,QAAQ,WAAW,QAAQ,IAC/B,cAAc,yBAAyB;AAE3C,QAAM,QAAQ;AAAA,IACV,yBAAyB;AAAA,MACrB,gBAAgB,gBAAgB;AAAA,IACpC;AAAA,IACA,kCAAkC;AAAA,MAC9B,gBAAgB,gBAAgB;AAAA,IACpC;AAAA,IACA,uCAAuC;AAAA,MACnC,WAAW,cAAc,WAAW;AAAA,IACxC;AAAA,IACA,yCAAyC;AAAA,MACrC,gBAAgB,mBACZ,iBAAiB,cAAc;AAAA,IACvC;AAAA,IACA,iCAAiC;AAAA,IACjC,oCAAoC;AAAA,EACxC;AAEA,MACI,cAAc,yBAAyB,MAAM,gBAC7C,CAAC,gBAAgB,UAAU,SAAS,+BAA+B,KACnE,CAAC,gBAAgB,UAAU,SAAS,4BAA4B,GAClE;AACE,QACI,gBAAgB,UAAU;AAAA,MACtB;AAAA,IACJ,GACF;AACE,YAAM,qCAAqC;AAAA,IAC/C,OAAO;AACH,YAAM,kCAAkC;AAAA,IAC5C;AAAA,EACJ;AAEA,QAAM,aAAa,OAAO,OAAO,KAAK,EAAE,KAAK,OAAO;AACpD,QAAM,SAAS,iBAAiB,KAAK;AAErC,SAAO,EAAE,YAAY,OAAO;AAChC;","names":[]}