@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.
- package/LICENSE +1 -1
- package/README.md +1 -1
- package/dist/legacy/cslp/cslpdata.cjs.map +1 -1
- package/dist/legacy/cslp/cslpdata.js.map +1 -1
- package/dist/legacy/livePreview/editButton/editButton.cjs +2 -2
- package/dist/legacy/livePreview/editButton/editButton.cjs.map +1 -1
- package/dist/legacy/livePreview/editButton/editButton.js +2 -2
- package/dist/legacy/livePreview/editButton/editButton.js.map +1 -1
- package/dist/legacy/livePreview/editButton/editButton.style.cjs +0 -1
- package/dist/legacy/livePreview/editButton/editButton.style.cjs.map +1 -1
- package/dist/legacy/livePreview/editButton/editButton.style.js +0 -1
- package/dist/legacy/livePreview/editButton/editButton.style.js.map +1 -1
- package/dist/legacy/livePreview/eventManager/postMessageEvent.hooks.cjs +1 -1
- package/dist/legacy/livePreview/eventManager/postMessageEvent.hooks.js +1 -1
- package/dist/legacy/preview/contentstack-live-preview-HOC.cjs +1 -1
- package/dist/legacy/preview/contentstack-live-preview-HOC.js +1 -1
- package/dist/legacy/timeline/compare/compare.cjs +2 -1
- package/dist/legacy/timeline/compare/compare.cjs.map +1 -1
- package/dist/legacy/timeline/compare/compare.js +2 -1
- package/dist/legacy/timeline/compare/compare.js.map +1 -1
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs +2 -2
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs.map +1 -1
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.d.cts +1 -1
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.d.ts +1 -1
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.js +2 -2
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.js.map +1 -1
- package/dist/legacy/visualBuilder/components/FieldToolbar.cjs +37 -29
- package/dist/legacy/visualBuilder/components/FieldToolbar.cjs.map +1 -1
- package/dist/legacy/visualBuilder/components/FieldToolbar.d.cts +1 -0
- package/dist/legacy/visualBuilder/components/FieldToolbar.d.ts +1 -0
- package/dist/legacy/visualBuilder/components/FieldToolbar.js +37 -29
- package/dist/legacy/visualBuilder/components/FieldToolbar.js.map +1 -1
- package/dist/legacy/visualBuilder/components/emptyBlock.cjs +1 -0
- package/dist/legacy/visualBuilder/components/emptyBlock.cjs.map +1 -1
- package/dist/legacy/visualBuilder/components/emptyBlock.js +1 -0
- package/dist/legacy/visualBuilder/components/emptyBlock.js.map +1 -1
- package/dist/legacy/visualBuilder/components/pseudoEditableField.cjs +6 -13
- package/dist/legacy/visualBuilder/components/pseudoEditableField.cjs.map +1 -1
- package/dist/legacy/visualBuilder/components/pseudoEditableField.js +6 -13
- package/dist/legacy/visualBuilder/components/pseudoEditableField.js.map +1 -1
- package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.cjs +25 -13
- package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.cjs.map +1 -1
- package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.js +25 -13
- package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.js.map +1 -1
- package/dist/legacy/visualBuilder/generators/generateToolbar.cjs +6 -5
- package/dist/legacy/visualBuilder/generators/generateToolbar.cjs.map +1 -1
- package/dist/legacy/visualBuilder/generators/generateToolbar.d.cts +2 -2
- package/dist/legacy/visualBuilder/generators/generateToolbar.d.ts +2 -2
- package/dist/legacy/visualBuilder/generators/generateToolbar.js +6 -5
- package/dist/legacy/visualBuilder/generators/generateToolbar.js.map +1 -1
- package/dist/legacy/visualBuilder/index.cjs +2 -1
- package/dist/legacy/visualBuilder/index.cjs.map +1 -1
- package/dist/legacy/visualBuilder/index.js +2 -1
- package/dist/legacy/visualBuilder/index.js.map +1 -1
- package/dist/legacy/visualBuilder/listeners/index.cjs +8 -2
- package/dist/legacy/visualBuilder/listeners/index.cjs.map +1 -1
- package/dist/legacy/visualBuilder/listeners/index.js +8 -2
- package/dist/legacy/visualBuilder/listeners/index.js.map +1 -1
- package/dist/legacy/visualBuilder/listeners/mouseClick.cjs +10 -2
- package/dist/legacy/visualBuilder/listeners/mouseClick.cjs.map +1 -1
- package/dist/legacy/visualBuilder/listeners/mouseClick.d.cts +3 -1
- package/dist/legacy/visualBuilder/listeners/mouseClick.d.ts +3 -1
- package/dist/legacy/visualBuilder/listeners/mouseClick.js +11 -3
- package/dist/legacy/visualBuilder/listeners/mouseClick.js.map +1 -1
- package/dist/legacy/visualBuilder/utils/constants.cjs +5 -2
- package/dist/legacy/visualBuilder/utils/constants.cjs.map +1 -1
- package/dist/legacy/visualBuilder/utils/constants.d.cts +2 -1
- package/dist/legacy/visualBuilder/utils/constants.d.ts +2 -1
- package/dist/legacy/visualBuilder/utils/constants.js +3 -1
- package/dist/legacy/visualBuilder/utils/constants.js.map +1 -1
- package/dist/legacy/visualBuilder/utils/getFieldType.cjs +6 -5
- package/dist/legacy/visualBuilder/utils/getFieldType.cjs.map +1 -1
- package/dist/legacy/visualBuilder/utils/getFieldType.js +6 -5
- package/dist/legacy/visualBuilder/utils/getFieldType.js.map +1 -1
- package/dist/legacy/visualBuilder/utils/getPsuedoEditableStylesElement.cjs +56 -0
- package/dist/legacy/visualBuilder/utils/getPsuedoEditableStylesElement.cjs.map +1 -0
- package/dist/legacy/visualBuilder/utils/getPsuedoEditableStylesElement.d.cts +5 -0
- package/dist/legacy/visualBuilder/utils/getPsuedoEditableStylesElement.d.ts +5 -0
- package/dist/legacy/visualBuilder/utils/getPsuedoEditableStylesElement.js +23 -0
- package/dist/legacy/visualBuilder/utils/getPsuedoEditableStylesElement.js.map +1 -0
- package/dist/legacy/visualBuilder/utils/getStyleOfAnElement.cjs +2 -0
- package/dist/legacy/visualBuilder/utils/getStyleOfAnElement.cjs.map +1 -1
- package/dist/legacy/visualBuilder/utils/getStyleOfAnElement.js +2 -0
- package/dist/legacy/visualBuilder/utils/getStyleOfAnElement.js.map +1 -1
- package/dist/legacy/visualBuilder/utils/handleFieldMouseDown.cjs +10 -0
- package/dist/legacy/visualBuilder/utils/handleFieldMouseDown.cjs.map +1 -1
- package/dist/legacy/visualBuilder/utils/handleFieldMouseDown.js +10 -0
- package/dist/legacy/visualBuilder/utils/handleFieldMouseDown.js.map +1 -1
- package/dist/legacy/visualBuilder/utils/handleIndividualFields.cjs +65 -41
- package/dist/legacy/visualBuilder/utils/handleIndividualFields.cjs.map +1 -1
- package/dist/legacy/visualBuilder/utils/handleIndividualFields.js +55 -41
- package/dist/legacy/visualBuilder/utils/handleIndividualFields.js.map +1 -1
- package/dist/legacy/visualBuilder/utils/insertSpaceAtCursor.cjs +44 -0
- package/dist/legacy/visualBuilder/utils/insertSpaceAtCursor.cjs.map +1 -0
- package/dist/legacy/visualBuilder/utils/insertSpaceAtCursor.d.cts +3 -0
- package/dist/legacy/visualBuilder/utils/insertSpaceAtCursor.d.ts +3 -0
- package/dist/legacy/visualBuilder/utils/insertSpaceAtCursor.js +21 -0
- package/dist/legacy/visualBuilder/utils/insertSpaceAtCursor.js.map +1 -0
- package/dist/legacy/visualBuilder/utils/multipleElementAddButton.cjs +1 -1
- package/dist/legacy/visualBuilder/utils/multipleElementAddButton.cjs.map +1 -1
- package/dist/legacy/visualBuilder/utils/multipleElementAddButton.js +1 -1
- package/dist/legacy/visualBuilder/utils/multipleElementAddButton.js.map +1 -1
- package/dist/legacy/visualBuilder/utils/updateFocussedState.cjs +48 -17
- package/dist/legacy/visualBuilder/utils/updateFocussedState.cjs.map +1 -1
- package/dist/legacy/visualBuilder/utils/updateFocussedState.d.cts +2 -2
- package/dist/legacy/visualBuilder/utils/updateFocussedState.d.ts +2 -2
- package/dist/legacy/visualBuilder/utils/updateFocussedState.js +58 -19
- package/dist/legacy/visualBuilder/utils/updateFocussedState.js.map +1 -1
- package/dist/modern/cslp/cslpdata.cjs.map +1 -1
- package/dist/modern/cslp/cslpdata.js.map +1 -1
- package/dist/modern/livePreview/editButton/editButton.cjs +1 -1
- package/dist/modern/livePreview/editButton/editButton.cjs.map +1 -1
- package/dist/modern/livePreview/editButton/editButton.js +1 -1
- package/dist/modern/livePreview/editButton/editButton.js.map +1 -1
- package/dist/modern/livePreview/editButton/editButton.style.cjs +0 -1
- package/dist/modern/livePreview/editButton/editButton.style.cjs.map +1 -1
- package/dist/modern/livePreview/editButton/editButton.style.js +0 -1
- package/dist/modern/livePreview/editButton/editButton.style.js.map +1 -1
- package/dist/modern/livePreview/eventManager/postMessageEvent.hooks.cjs +1 -1
- package/dist/modern/livePreview/eventManager/postMessageEvent.hooks.js +1 -1
- package/dist/modern/preview/contentstack-live-preview-HOC.cjs +1 -1
- package/dist/modern/preview/contentstack-live-preview-HOC.js +1 -1
- package/dist/modern/timeline/compare/compare.cjs +2 -1
- package/dist/modern/timeline/compare/compare.cjs.map +1 -1
- package/dist/modern/timeline/compare/compare.js +2 -1
- package/dist/modern/timeline/compare/compare.js.map +1 -1
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs +2 -2
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs.map +1 -1
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.d.cts +1 -1
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.d.ts +1 -1
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.js +2 -2
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.js.map +1 -1
- package/dist/modern/visualBuilder/components/FieldToolbar.cjs +35 -29
- package/dist/modern/visualBuilder/components/FieldToolbar.cjs.map +1 -1
- package/dist/modern/visualBuilder/components/FieldToolbar.d.cts +1 -0
- package/dist/modern/visualBuilder/components/FieldToolbar.d.ts +1 -0
- package/dist/modern/visualBuilder/components/FieldToolbar.js +35 -29
- package/dist/modern/visualBuilder/components/FieldToolbar.js.map +1 -1
- package/dist/modern/visualBuilder/components/emptyBlock.cjs +1 -0
- package/dist/modern/visualBuilder/components/emptyBlock.cjs.map +1 -1
- package/dist/modern/visualBuilder/components/emptyBlock.js +1 -0
- package/dist/modern/visualBuilder/components/emptyBlock.js.map +1 -1
- package/dist/modern/visualBuilder/components/pseudoEditableField.cjs +6 -13
- package/dist/modern/visualBuilder/components/pseudoEditableField.cjs.map +1 -1
- package/dist/modern/visualBuilder/components/pseudoEditableField.js +6 -13
- package/dist/modern/visualBuilder/components/pseudoEditableField.js.map +1 -1
- package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.cjs +24 -13
- package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.cjs.map +1 -1
- package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.js +24 -13
- package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.js.map +1 -1
- package/dist/modern/visualBuilder/generators/generateToolbar.cjs +6 -5
- package/dist/modern/visualBuilder/generators/generateToolbar.cjs.map +1 -1
- package/dist/modern/visualBuilder/generators/generateToolbar.d.cts +2 -2
- package/dist/modern/visualBuilder/generators/generateToolbar.d.ts +2 -2
- package/dist/modern/visualBuilder/generators/generateToolbar.js +6 -5
- package/dist/modern/visualBuilder/generators/generateToolbar.js.map +1 -1
- package/dist/modern/visualBuilder/index.cjs +2 -1
- package/dist/modern/visualBuilder/index.cjs.map +1 -1
- package/dist/modern/visualBuilder/index.js +2 -1
- package/dist/modern/visualBuilder/index.js.map +1 -1
- package/dist/modern/visualBuilder/listeners/index.cjs +8 -2
- package/dist/modern/visualBuilder/listeners/index.cjs.map +1 -1
- package/dist/modern/visualBuilder/listeners/index.js +8 -2
- package/dist/modern/visualBuilder/listeners/index.js.map +1 -1
- package/dist/modern/visualBuilder/listeners/mouseClick.cjs +10 -2
- package/dist/modern/visualBuilder/listeners/mouseClick.cjs.map +1 -1
- package/dist/modern/visualBuilder/listeners/mouseClick.d.cts +3 -1
- package/dist/modern/visualBuilder/listeners/mouseClick.d.ts +3 -1
- package/dist/modern/visualBuilder/listeners/mouseClick.js +11 -3
- package/dist/modern/visualBuilder/listeners/mouseClick.js.map +1 -1
- package/dist/modern/visualBuilder/utils/constants.cjs +5 -2
- package/dist/modern/visualBuilder/utils/constants.cjs.map +1 -1
- package/dist/modern/visualBuilder/utils/constants.d.cts +2 -1
- package/dist/modern/visualBuilder/utils/constants.d.ts +2 -1
- package/dist/modern/visualBuilder/utils/constants.js +3 -1
- package/dist/modern/visualBuilder/utils/constants.js.map +1 -1
- package/dist/modern/visualBuilder/utils/getFieldType.cjs +5 -5
- package/dist/modern/visualBuilder/utils/getFieldType.cjs.map +1 -1
- package/dist/modern/visualBuilder/utils/getFieldType.js +5 -5
- package/dist/modern/visualBuilder/utils/getFieldType.js.map +1 -1
- package/dist/modern/visualBuilder/utils/getPsuedoEditableStylesElement.cjs +56 -0
- package/dist/modern/visualBuilder/utils/getPsuedoEditableStylesElement.cjs.map +1 -0
- package/dist/modern/visualBuilder/utils/getPsuedoEditableStylesElement.d.cts +5 -0
- package/dist/modern/visualBuilder/utils/getPsuedoEditableStylesElement.d.ts +5 -0
- package/dist/modern/visualBuilder/utils/getPsuedoEditableStylesElement.js +23 -0
- package/dist/modern/visualBuilder/utils/getPsuedoEditableStylesElement.js.map +1 -0
- package/dist/modern/visualBuilder/utils/getStyleOfAnElement.cjs +2 -0
- package/dist/modern/visualBuilder/utils/getStyleOfAnElement.cjs.map +1 -1
- package/dist/modern/visualBuilder/utils/getStyleOfAnElement.js +2 -0
- package/dist/modern/visualBuilder/utils/getStyleOfAnElement.js.map +1 -1
- package/dist/modern/visualBuilder/utils/handleFieldMouseDown.cjs +10 -0
- package/dist/modern/visualBuilder/utils/handleFieldMouseDown.cjs.map +1 -1
- package/dist/modern/visualBuilder/utils/handleFieldMouseDown.js +10 -0
- package/dist/modern/visualBuilder/utils/handleFieldMouseDown.js.map +1 -1
- package/dist/modern/visualBuilder/utils/handleIndividualFields.cjs +64 -41
- package/dist/modern/visualBuilder/utils/handleIndividualFields.cjs.map +1 -1
- package/dist/modern/visualBuilder/utils/handleIndividualFields.js +54 -41
- package/dist/modern/visualBuilder/utils/handleIndividualFields.js.map +1 -1
- package/dist/modern/visualBuilder/utils/insertSpaceAtCursor.cjs +44 -0
- package/dist/modern/visualBuilder/utils/insertSpaceAtCursor.cjs.map +1 -0
- package/dist/modern/visualBuilder/utils/insertSpaceAtCursor.d.cts +3 -0
- package/dist/modern/visualBuilder/utils/insertSpaceAtCursor.d.ts +3 -0
- package/dist/modern/visualBuilder/utils/insertSpaceAtCursor.js +21 -0
- package/dist/modern/visualBuilder/utils/insertSpaceAtCursor.js.map +1 -0
- package/dist/modern/visualBuilder/utils/multipleElementAddButton.cjs +1 -1
- package/dist/modern/visualBuilder/utils/multipleElementAddButton.cjs.map +1 -1
- package/dist/modern/visualBuilder/utils/multipleElementAddButton.js +1 -1
- package/dist/modern/visualBuilder/utils/multipleElementAddButton.js.map +1 -1
- package/dist/modern/visualBuilder/utils/updateFocussedState.cjs +48 -17
- package/dist/modern/visualBuilder/utils/updateFocussedState.cjs.map +1 -1
- package/dist/modern/visualBuilder/utils/updateFocussedState.d.cts +2 -2
- package/dist/modern/visualBuilder/utils/updateFocussedState.d.ts +2 -2
- package/dist/modern/visualBuilder/utils/updateFocussedState.js +58 -19
- package/dist/modern/visualBuilder/utils/updateFocussedState.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/visualBuilder/generators/generateToolbar.tsx"],"sourcesContent":["import { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport {\n DATA_CSLP_ATTR_SELECTOR,\n LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX,\n RIGHT_EDGE_BUFFER,\n TOOLBAR_EDGE_BUFFER,\n TOP_EDGE_BUFFER,\n} from \"../utils/constants\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\n\nimport FieldToolbarComponent from \"../components/FieldToolbar\";\nimport { render } from \"preact\";\nimport FieldLabelWrapperComponent from \"../components/fieldLabelWrapper\";\n\nexport function appendFocusedToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement\n): void {\n appendFieldPathDropdown(eventDetails, focusedToolbarElement);\n appendFieldToolbar(eventDetails, focusedToolbarElement);\n}\n\nexport function appendFieldToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement\n): void {\n if (\n focusedToolbarElement.querySelector(\n \".visual-builder__focused-toolbar__multiple-field-toolbar\"\n )\n )\n return;\n const wrapper = document.createDocumentFragment();\n render(\n <FieldToolbarComponent\n eventDetails={eventDetails}\n />,\n wrapper\n );\n\n focusedToolbarElement.append(wrapper);\n}\n\nexport function appendFieldPathDropdown(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement\n): void {\n if(document.querySelector(\"visual-builder__focused-toolbar__field-label-wrapper\"))\n return;\n const { editableElement: targetElement, fieldMetadata } = eventDetails;\n const targetElementDimension = targetElement.getBoundingClientRect();\n\n const distanceFromTop =\n targetElementDimension.top + window.scrollY - TOOLBAR_EDGE_BUFFER;\n // Position the toolbar at the top unless there's insufficient space or scrolling up is not possible (topmost element targetted).\n const adjustedDistanceFromTop =\n targetElementDimension.top + window.scrollY < TOP_EDGE_BUFFER\n ? distanceFromTop + targetElementDimension.height + TOP_EDGE_BUFFER\n : distanceFromTop;\n\n const distanceFromLeft =\n targetElementDimension.left - LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX;\n const adjustedDistanceFromLeft = Math.max(\n distanceFromLeft,\n TOOLBAR_EDGE_BUFFER\n );\n\n const targetElementRightEdgeOffset =\n window.scrollX + window.innerWidth - targetElementDimension.left;\n\n if (targetElementRightEdgeOffset < RIGHT_EDGE_BUFFER) {\n // Overflow / Cutoff on right edge\n focusedToolbarElement.style.justifyContent = \"flex-end\";\n focusedToolbarElement.style.left = `${\n targetElementDimension.right + LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX\n }px`;\n } else {\n focusedToolbarElement.style.justifyContent = \"flex-start\"; // default\n focusedToolbarElement.style.left = `${adjustedDistanceFromLeft}px`;\n }\n\n focusedToolbarElement.style.top = `${adjustedDistanceFromTop}px`;\n\n const parentPaths = collectParentCSLPPaths(targetElement, 2);\n\n const wrapper = document.createDocumentFragment();\n render(\n <FieldLabelWrapperComponent\n fieldMetadata={fieldMetadata}\n eventDetails={eventDetails}\n parentPaths={parentPaths}\n getParentEditableElement={(cslp: string) => {\n const parentElement = targetElement.closest(\n `[${DATA_CSLP_ATTR_SELECTOR}=\"${cslp}\"]`\n ) as HTMLElement | null;\n return parentElement;\n }}\n />,\n wrapper\n );\n\n focusedToolbarElement.appendChild(wrapper);\n}\n\nfunction collectParentCSLPPaths(\n targetElement: Element,\n count: number\n): Array<string> {\n const cslpPaths: Array<string> = [];\n let currentElement = targetElement.parentElement;\n\n while (count > 0 || currentElement === window.document.body) {\n if (!currentElement) {\n return cslpPaths;\n }\n\n if (currentElement.hasAttribute(DATA_CSLP_ATTR_SELECTOR)) {\n cslpPaths.push(\n currentElement.getAttribute(DATA_CSLP_ATTR_SELECTOR) as string\n );\n count--;\n }\n currentElement = currentElement.parentElement;\n }\n\n return cslpPaths;\n}\n"],"mappings":";;;AACA;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AAIP,OAAO,2BAA2B;AAClC,SAAS,cAAc;AACvB,OAAO,gCAAgC;
|
|
1
|
+
{"version":3,"sources":["../../../../src/visualBuilder/generators/generateToolbar.tsx"],"sourcesContent":["import { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport {\n DATA_CSLP_ATTR_SELECTOR,\n LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX,\n RIGHT_EDGE_BUFFER,\n TOOLBAR_EDGE_BUFFER,\n TOP_EDGE_BUFFER,\n} from \"../utils/constants\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\n\nimport FieldToolbarComponent from \"../components/FieldToolbar\";\nimport { render } from \"preact\";\nimport FieldLabelWrapperComponent from \"../components/fieldLabelWrapper\";\n\nexport function appendFocusedToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void\n): void {\n appendFieldPathDropdown(eventDetails, focusedToolbarElement);\n appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay);\n}\n\nexport function appendFieldToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void\n): void {\n if (\n focusedToolbarElement.querySelector(\n \".visual-builder__focused-toolbar__multiple-field-toolbar\"\n )\n )\n return;\n const wrapper = document.createDocumentFragment();\n render(\n <FieldToolbarComponent\n eventDetails={eventDetails}\n hideOverlay={hideOverlay}\n />,\n wrapper\n );\n\n focusedToolbarElement.append(wrapper);\n}\n\nexport function appendFieldPathDropdown(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement\n): void {\n if(document.querySelector(\".visual-builder__focused-toolbar__field-label-wrapper\"))\n return;\n const { editableElement: targetElement, fieldMetadata } = eventDetails;\n const targetElementDimension = targetElement.getBoundingClientRect();\n\n const distanceFromTop =\n targetElementDimension.top + window.scrollY - TOOLBAR_EDGE_BUFFER;\n // Position the toolbar at the top unless there's insufficient space or scrolling up is not possible (topmost element targetted).\n const adjustedDistanceFromTop =\n targetElementDimension.top + window.scrollY < TOP_EDGE_BUFFER\n ? distanceFromTop + targetElementDimension.height + TOP_EDGE_BUFFER\n : distanceFromTop;\n\n const distanceFromLeft =\n targetElementDimension.left - LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX;\n const adjustedDistanceFromLeft = Math.max(\n distanceFromLeft,\n TOOLBAR_EDGE_BUFFER\n );\n\n const targetElementRightEdgeOffset =\n window.scrollX + window.innerWidth - targetElementDimension.left;\n\n if (targetElementRightEdgeOffset < RIGHT_EDGE_BUFFER) {\n // Overflow / Cutoff on right edge\n focusedToolbarElement.style.justifyContent = \"flex-end\";\n focusedToolbarElement.style.left = `${\n targetElementDimension.right + LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX\n }px`;\n } else {\n focusedToolbarElement.style.justifyContent = \"flex-start\"; // default\n focusedToolbarElement.style.left = `${adjustedDistanceFromLeft}px`;\n }\n\n focusedToolbarElement.style.top = `${adjustedDistanceFromTop}px`;\n\n const parentPaths = collectParentCSLPPaths(targetElement, 2);\n\n const wrapper = document.createDocumentFragment();\n render(\n <FieldLabelWrapperComponent\n fieldMetadata={fieldMetadata}\n eventDetails={eventDetails}\n parentPaths={parentPaths}\n getParentEditableElement={(cslp: string) => {\n const parentElement = targetElement.closest(\n `[${DATA_CSLP_ATTR_SELECTOR}=\"${cslp}\"]`\n ) as HTMLElement | null;\n return parentElement;\n }}\n />,\n wrapper\n );\n\n focusedToolbarElement.appendChild(wrapper);\n}\n\nfunction collectParentCSLPPaths(\n targetElement: Element,\n count: number\n): Array<string> {\n const cslpPaths: Array<string> = [];\n let currentElement = targetElement.parentElement;\n\n while (count > 0 || currentElement === window.document.body) {\n if (!currentElement) {\n return cslpPaths;\n }\n\n if (currentElement.hasAttribute(DATA_CSLP_ATTR_SELECTOR)) {\n cslpPaths.push(\n currentElement.getAttribute(DATA_CSLP_ATTR_SELECTOR) as string\n );\n count--;\n }\n currentElement = currentElement.parentElement;\n }\n\n return cslpPaths;\n}\n"],"mappings":";;;AACA;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AAIP,OAAO,2BAA2B;AAClC,SAAS,cAAc;AACvB,OAAO,gCAAgC;AAwB/B;AAtBD,SAAS,qBACZ,cACA,uBACA,aACI;AACJ,0BAAwB,cAAc,qBAAqB;AAC3D,qBAAmB,cAAc,uBAAuB,WAAW;AACvE;AAEO,SAAS,mBACZ,cACA,uBACA,aACI;AACJ,MACI,sBAAsB;AAAA,IAClB;AAAA,EACJ;AAEA;AACJ,QAAM,UAAU,SAAS,uBAAuB;AAChD;AAAA,IACI;AAAA,MAAC;AAAA;AAAA,QACG;AAAA,QACA;AAAA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;AAEA,wBAAsB,OAAO,OAAO;AACxC;AAEO,SAAS,wBACZ,cACA,uBACI;AACJ,MAAG,SAAS,cAAc,uDAAuD;AAC7E;AACJ,QAAM,EAAE,iBAAiB,eAAe,cAAc,IAAI;AAC1D,QAAM,yBAAyB,cAAc,sBAAsB;AAEnE,QAAM,kBACF,uBAAuB,MAAM,OAAO,UAAU;AAElD,QAAM,0BACF,uBAAuB,MAAM,OAAO,UAAU,kBACxC,kBAAkB,uBAAuB,SAAS,kBAClD;AAEV,QAAM,mBACF,uBAAuB,OAAO;AAClC,QAAM,2BAA2B,KAAK;AAAA,IAClC;AAAA,IACA;AAAA,EACJ;AAEA,QAAM,+BACF,OAAO,UAAU,OAAO,aAAa,uBAAuB;AAEhE,MAAI,+BAA+B,mBAAmB;AAElD,0BAAsB,MAAM,iBAAiB;AAC7C,0BAAsB,MAAM,OAAO,GAC/B,uBAAuB,QAAQ,gCACnC;AAAA,EACJ,OAAO;AACH,0BAAsB,MAAM,iBAAiB;AAC7C,0BAAsB,MAAM,OAAO,GAAG,wBAAwB;AAAA,EAClE;AAEA,wBAAsB,MAAM,MAAM,GAAG,uBAAuB;AAE5D,QAAM,cAAc,uBAAuB,eAAe,CAAC;AAE3D,QAAM,UAAU,SAAS,uBAAuB;AAChD;AAAA,IACI;AAAA,MAAC;AAAA;AAAA,QACG;AAAA,QACA;AAAA,QACA;AAAA,QACA,0BAA0B,CAAC,SAAiB;AACxC,gBAAM,gBAAgB,cAAc;AAAA,YAChC,IAAI,uBAAuB,KAAK,IAAI;AAAA,UACxC;AACA,iBAAO;AAAA,QACX;AAAA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;AAEA,wBAAsB,YAAY,OAAO;AAC7C;AAEA,SAAS,uBACL,eACA,OACa;AACb,QAAM,YAA2B,CAAC;AAClC,MAAI,iBAAiB,cAAc;AAEnC,SAAO,QAAQ,KAAK,mBAAmB,OAAO,SAAS,MAAM;AACzD,QAAI,CAAC,gBAAgB;AACjB,aAAO;AAAA,IACX;AAEA,QAAI,eAAe,aAAa,uBAAuB,GAAG;AACtD,gBAAU;AAAA,QACN,eAAe,aAAa,uBAAuB;AAAA,MACvD;AACA;AAAA,IACJ;AACA,qBAAiB,eAAe;AAAA,EACpC;AAEA,SAAO;AACX;","names":[]}
|
|
@@ -129,7 +129,8 @@ var _VisualBuilder = class _VisualBuilder {
|
|
|
129
129
|
(0, import_updateFocussedState.updateFocussedStateOnMutation)(
|
|
130
130
|
this.overlayWrapper,
|
|
131
131
|
this.focusedToolbar,
|
|
132
|
-
this.visualBuilderContainer
|
|
132
|
+
this.visualBuilderContainer,
|
|
133
|
+
this.resizeObserver
|
|
133
134
|
);
|
|
134
135
|
const emptyBlockParents = Array.from(
|
|
135
136
|
document.querySelectorAll(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/visualBuilder/index.ts"],"sourcesContent":["import { Signal, signal } from \"@preact/signals\";\n\nimport { inIframe } from \"../common/inIframe\";\nimport Config from \"../configManager/configManager\";\nimport {\n useHistoryPostMessageEvent,\n useOnEntryUpdatePostMessageEvent,\n} from \"../livePreview/eventManager/postMessageEvent.hooks\";\nimport {\n ILivePreviewModeConfig,\n ILivePreviewWindowType,\n IVisualBuilderInitEvent,\n} from \"../types/types\";\nimport { generateStartEditingButton } from \"./generators/generateStartEditingButton\";\n\nimport { addFocusOverlay } from \"./generators/generateOverlay\";\nimport { getEntryIdentifiersInCurrentPage } from \"./utils/getEntryIdentifiersInCurrentPage\";\nimport visualBuilderPostMessage from \"./utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"./utils/types/postMessage.types\";\n\nimport { setup } from \"goober\";\nimport { debounce, isEqual } from \"lodash-es\";\nimport { h } from \"preact\";\nimport { extractDetailsFromCslp } from \"../cslp\";\nimport initUI from \"./components\";\nimport { useDraftFieldsPostMessageEvent } from \"./eventManager/useDraftFieldsPostMessageEvent\";\nimport { useHideFocusOverlayPostMessageEvent } from \"./eventManager/useHideFocusOverlayPostMessageEvent\";\nimport { useScrollToField } from \"./eventManager/useScrollToField\";\nimport { useVariantFieldsPostMessageEvent } from \"./eventManager/useVariantsPostMessageEvent\";\nimport {\n generateEmptyBlocks,\n removeEmptyBlocks,\n} from \"./generators/generateEmptyBlock\";\nimport { addEventListeners, removeEventListeners } from \"./listeners\";\nimport { addKeyboardShortcuts } from \"./listeners/keyboardShortcuts\";\nimport { FieldSchemaMap } from \"./utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"./utils/isFieldDisabled\";\nimport {\n updateFocussedState,\n updateFocussedStateOnMutation,\n} from \"./utils/updateFocussedState\";\nimport { useHighlightCommentIcon } from \"./eventManager/useHighlightCommentIcon\";\nimport { updateHighlightedCommentIconPosition } from \"./generators/generateHighlightedComment\";\nimport { useRecalculateVariantDataCSLPValues } from \"./eventManager/useRecalculateVariantDataCSLPValues\";\n\ninterface VisualBuilderGlobalStateImpl {\n previousSelectedEditableDOM: HTMLElement | Element | null;\n previousHoveredTargetDOM: Element | null;\n previousEmptyBlockParents: Element[] | [];\n focusFieldValue: string | null;\n audienceMode: boolean;\n locale: string;\n variant: string | null;\n}\n\nexport class VisualBuilder {\n private customCursor: HTMLDivElement | null = null;\n private overlayWrapper: HTMLDivElement | null = null;\n private visualBuilderContainer: HTMLDivElement | null = null;\n private focusedToolbar: HTMLDivElement | null = null;\n\n static VisualBuilderGlobalState: Signal<VisualBuilderGlobalStateImpl> =\n signal({\n previousSelectedEditableDOM: null,\n previousHoveredTargetDOM: null,\n previousEmptyBlockParents: [],\n focusFieldValue: null,\n audienceMode: false,\n locale: Config.get().stackDetails.masterLocale || \"en-us\",\n variant: null,\n });\n\n private handlePositionChange(editableElement: HTMLElement) {\n updateFocussedState({\n editableElement,\n visualBuilderContainer: this.visualBuilderContainer,\n overlayWrapper: this.overlayWrapper,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n }\n\n private scrollEventHandler = () => {\n updateHighlightedCommentIconPosition(); // Update icons position\n };\n\n private resizeEventHandler = () => {\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n updateHighlightedCommentIconPosition();\n if (previousSelectedEditableDOM) {\n this.handlePositionChange(\n previousSelectedEditableDOM as HTMLElement\n );\n }\n };\n\n private resizeObserver = new ResizeObserver(([entry]) => {\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n\n if (!this.overlayWrapper || !previousSelectedEditableDOM) {\n return;\n }\n\n // if previous selected editable element is not same as the current\n // target and the target is also not psuedo-editable then return\n if (\n !entry.target.isSameNode(previousSelectedEditableDOM) &&\n !entry.target.classList.contains(\n \"visual-builder__pseudo-editable-element\"\n )\n ) {\n return;\n }\n\n const isPsuedoEditableElement = entry.target.classList.contains(\n \"visual-builder__pseudo-editable-element\"\n );\n\n // the \"actual\" editable element when the current target is psuedo-editable\n // is the previous selected editable element instead of the closest data-cslp element\n // (cant use closest because the psuedo editable is absolute positioned)\n // (Note - why do we even need the closest? we do an early exit if entry.target\n // is not the previous selected editable element, needs more investigation)\n const editableElement = (\n isPsuedoEditableElement\n ? previousSelectedEditableDOM\n : entry.target.closest(\"[data-cslp]\")\n ) as HTMLElement | null;\n\n if (isPsuedoEditableElement) {\n // if the current target is psuedo-editable, then the resizing occurred by typing\n // into the psuedo editable, simply update the focus overlay\n addFocusOverlay(entry.target, this.overlayWrapper);\n\n // TODO check if we can now resize the actual editable element\n // when psuedo editable element is resized, avoid infinite loops\n } else if (editableElement) {\n this.handlePositionChange(editableElement);\n }\n\n // update the overlay if field is disabled\n const cslpData =\n editableElement && editableElement.getAttribute(\"data-cslp\");\n\n if (!editableElement || !cslpData) {\n return;\n }\n\n const fieldMetadata = extractDetailsFromCslp(cslpData);\n\n FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n ).then((fieldSchema) => {\n if (!fieldSchema) {\n return;\n }\n const { isDisabled } = isFieldDisabled(fieldSchema, {\n editableElement,\n fieldMetadata,\n });\n if (isDisabled) {\n addFocusOverlay(\n editableElement,\n this.overlayWrapper as HTMLDivElement,\n isDisabled\n );\n }\n });\n });\n\n private mutationObserver = new MutationObserver(\n debounce(\n async () => {\n updateFocussedStateOnMutation(\n this.overlayWrapper,\n this.focusedToolbar,\n this.visualBuilderContainer\n );\n const emptyBlockParents = Array.from(\n document.querySelectorAll(\n \".visual-builder__empty-block-parent\"\n )\n );\n\n const previousEmptyBlockParents = VisualBuilder\n .VisualBuilderGlobalState.value\n .previousEmptyBlockParents as Element[];\n\n if (!isEqual(emptyBlockParents, previousEmptyBlockParents)) {\n const noMoreEmptyBlockParent =\n previousEmptyBlockParents.filter(\n (x) => !emptyBlockParents.includes(x)\n );\n const newEmptyBlockParent = emptyBlockParents.filter(\n (x) => !previousEmptyBlockParents.includes(x)\n );\n\n removeEmptyBlocks(noMoreEmptyBlockParent);\n await generateEmptyBlocks(newEmptyBlockParent);\n\n VisualBuilder.VisualBuilderGlobalState.value = {\n ...VisualBuilder.VisualBuilderGlobalState.value,\n previousEmptyBlockParents: emptyBlockParents,\n };\n }\n },\n 100,\n { trailing: true }\n )\n );\n\n constructor() {\n // Handles changes in element positions due to sidebar toggling or window resizing,\n // triggering a redraw of the visual builder\n window.addEventListener(\"resize\", this.resizeEventHandler);\n window.addEventListener(\"scroll\", this.scrollEventHandler);\n initUI({\n resizeObserver: this.resizeObserver,\n });\n\n // Initializing goober for css-in-js\n setup(h);\n\n this.visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n );\n this.overlayWrapper = document.querySelector(\n \".visual-builder__overlay__wrapper\"\n );\n this.customCursor = document.querySelector(\".visual-builder__cursor\");\n this.focusedToolbar = document.querySelector(\n \".visual-builder__focused-toolbar\"\n );\n\n const config = Config.get();\n\n if (!config.enable || config.mode < ILivePreviewModeConfig.BUILDER) {\n return;\n }\n visualBuilderPostMessage\n ?.send<IVisualBuilderInitEvent>(\"init\", {\n isSSR: config.ssr,\n href: window.location.href,\n })\n .then((data) => {\n const {\n windowType = ILivePreviewWindowType.BUILDER,\n stackDetails,\n } = data || {};\n Config.set(\"windowType\", windowType);\n Config.set(\n \"stackDetails.masterLocale\",\n stackDetails?.masterLocale || \"en-us\"\n );\n\n addEventListeners({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n previousSelectedEditableDOM:\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n customCursor: this.customCursor,\n });\n\n addKeyboardShortcuts({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n useScrollToField();\n useHighlightCommentIcon();\n this.mutationObserver.observe(document.body, {\n childList: true,\n subtree: true,\n });\n\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.GET_ALL_ENTRIES_IN_CURRENT_PAGE,\n getEntryIdentifiersInCurrentPage\n );\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.SEND_VARIANT_AND_LOCALE\n );\n\n useHideFocusOverlayPostMessageEvent({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n\n // These events are used to sync the data when we made some changes in the entry without invoking live preview module.\n useHistoryPostMessageEvent();\n useOnEntryUpdatePostMessageEvent();\n useRecalculateVariantDataCSLPValues();\n useDraftFieldsPostMessageEvent();\n useVariantFieldsPostMessageEvent();\n })\n .catch(() => {\n if (!inIframe()) {\n generateStartEditingButton(this.visualBuilderContainer);\n }\n });\n }\n\n // TODO: write test cases\n destroy = (): void => {\n // Remove event listeners\n window.removeEventListener(\"resize\", this.resizeEventHandler);\n window.removeEventListener(\"scroll\", this.scrollEventHandler);\n\n // Remove custom event listeners\n removeEventListeners({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n previousSelectedEditableDOM:\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n customCursor: this.customCursor,\n });\n\n // Disconnect observers\n this.resizeObserver.disconnect();\n this.mutationObserver.disconnect();\n\n // Clear global state\n VisualBuilder.VisualBuilderGlobalState.value = {\n previousSelectedEditableDOM: null,\n previousHoveredTargetDOM: null,\n previousEmptyBlockParents: [],\n focusFieldValue: null,\n audienceMode: false,\n locale: \"en-us\",\n variant: null,\n };\n\n // Remove DOM elements\n if (this.visualBuilderContainer) {\n window.document.body.removeChild(this.visualBuilderContainer);\n }\n if (this.customCursor) {\n this.customCursor.remove();\n }\n if (this.overlayWrapper) {\n this.overlayWrapper.remove();\n }\n if (this.focusedToolbar) {\n this.focusedToolbar.remove();\n }\n\n // Nullify references\n this.customCursor = null;\n this.overlayWrapper = null;\n this.visualBuilderContainer = null;\n this.focusedToolbar = null;\n };\n}\n"],"mappings":"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","names":["initUI","Config","visualBuilderPostMessage","_a"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/visualBuilder/index.ts"],"sourcesContent":["import { Signal, signal } from \"@preact/signals\";\n\nimport { inIframe } from \"../common/inIframe\";\nimport Config from \"../configManager/configManager\";\nimport {\n useHistoryPostMessageEvent,\n useOnEntryUpdatePostMessageEvent,\n} from \"../livePreview/eventManager/postMessageEvent.hooks\";\nimport {\n ILivePreviewModeConfig,\n ILivePreviewWindowType,\n IVisualBuilderInitEvent,\n} from \"../types/types\";\nimport { generateStartEditingButton } from \"./generators/generateStartEditingButton\";\n\nimport { addFocusOverlay } from \"./generators/generateOverlay\";\nimport { getEntryIdentifiersInCurrentPage } from \"./utils/getEntryIdentifiersInCurrentPage\";\nimport visualBuilderPostMessage from \"./utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"./utils/types/postMessage.types\";\n\nimport { setup } from \"goober\";\nimport { debounce, isEqual } from \"lodash-es\";\nimport { h } from \"preact\";\nimport { extractDetailsFromCslp } from \"../cslp\";\nimport initUI from \"./components\";\nimport { useDraftFieldsPostMessageEvent } from \"./eventManager/useDraftFieldsPostMessageEvent\";\nimport { useHideFocusOverlayPostMessageEvent } from \"./eventManager/useHideFocusOverlayPostMessageEvent\";\nimport { useScrollToField } from \"./eventManager/useScrollToField\";\nimport { useVariantFieldsPostMessageEvent } from \"./eventManager/useVariantsPostMessageEvent\";\nimport {\n generateEmptyBlocks,\n removeEmptyBlocks,\n} from \"./generators/generateEmptyBlock\";\nimport { addEventListeners, removeEventListeners } from \"./listeners\";\nimport { addKeyboardShortcuts } from \"./listeners/keyboardShortcuts\";\nimport { FieldSchemaMap } from \"./utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"./utils/isFieldDisabled\";\nimport {\n updateFocussedState,\n updateFocussedStateOnMutation,\n} from \"./utils/updateFocussedState\";\nimport { useHighlightCommentIcon } from \"./eventManager/useHighlightCommentIcon\";\nimport { updateHighlightedCommentIconPosition } from \"./generators/generateHighlightedComment\";\nimport { useRecalculateVariantDataCSLPValues } from \"./eventManager/useRecalculateVariantDataCSLPValues\";\n\ninterface VisualBuilderGlobalStateImpl {\n previousSelectedEditableDOM: HTMLElement | Element | null;\n previousHoveredTargetDOM: Element | null;\n previousEmptyBlockParents: Element[] | [];\n focusFieldValue: string | null;\n audienceMode: boolean;\n locale: string;\n variant: string | null;\n}\n\nexport class VisualBuilder {\n private customCursor: HTMLDivElement | null = null;\n private overlayWrapper: HTMLDivElement | null = null;\n private visualBuilderContainer: HTMLDivElement | null = null;\n private focusedToolbar: HTMLDivElement | null = null;\n\n static VisualBuilderGlobalState: Signal<VisualBuilderGlobalStateImpl> =\n signal({\n previousSelectedEditableDOM: null,\n previousHoveredTargetDOM: null,\n previousEmptyBlockParents: [],\n focusFieldValue: null,\n audienceMode: false,\n locale: Config.get().stackDetails.masterLocale || \"en-us\",\n variant: null,\n });\n\n private handlePositionChange(editableElement: HTMLElement) {\n updateFocussedState({\n editableElement,\n visualBuilderContainer: this.visualBuilderContainer,\n overlayWrapper: this.overlayWrapper,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n }\n\n private scrollEventHandler = () => {\n updateHighlightedCommentIconPosition(); // Update icons position\n };\n\n private resizeEventHandler = () => {\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n updateHighlightedCommentIconPosition();\n if (previousSelectedEditableDOM) {\n this.handlePositionChange(\n previousSelectedEditableDOM as HTMLElement\n );\n }\n };\n\n private resizeObserver = new ResizeObserver(([entry]) => {\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n\n if (!this.overlayWrapper || !previousSelectedEditableDOM) {\n return;\n }\n\n // if previous selected editable element is not same as the current\n // target and the target is also not psuedo-editable then return\n if (\n !entry.target.isSameNode(previousSelectedEditableDOM) &&\n !entry.target.classList.contains(\n \"visual-builder__pseudo-editable-element\"\n )\n ) {\n return;\n }\n\n const isPsuedoEditableElement = entry.target.classList.contains(\n \"visual-builder__pseudo-editable-element\"\n );\n\n // the \"actual\" editable element when the current target is psuedo-editable\n // is the previous selected editable element instead of the closest data-cslp element\n // (cant use closest because the psuedo editable is absolute positioned)\n // (Note - why do we even need the closest? we do an early exit if entry.target\n // is not the previous selected editable element, needs more investigation)\n const editableElement = (\n isPsuedoEditableElement\n ? previousSelectedEditableDOM\n : entry.target.closest(\"[data-cslp]\")\n ) as HTMLElement | null;\n\n if (isPsuedoEditableElement) {\n // if the current target is psuedo-editable, then the resizing occurred by typing\n // into the psuedo editable, simply update the focus overlay\n addFocusOverlay(entry.target, this.overlayWrapper);\n\n // TODO check if we can now resize the actual editable element\n // when psuedo editable element is resized, avoid infinite loops\n } else if (editableElement) {\n this.handlePositionChange(editableElement);\n }\n\n // update the overlay if field is disabled\n const cslpData =\n editableElement && editableElement.getAttribute(\"data-cslp\");\n\n if (!editableElement || !cslpData) {\n return;\n }\n\n const fieldMetadata = extractDetailsFromCslp(cslpData);\n\n FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n ).then((fieldSchema) => {\n if (!fieldSchema) {\n return;\n }\n const { isDisabled } = isFieldDisabled(fieldSchema, {\n editableElement,\n fieldMetadata,\n });\n if (isDisabled) {\n addFocusOverlay(\n editableElement,\n this.overlayWrapper as HTMLDivElement,\n isDisabled\n );\n }\n });\n });\n\n private mutationObserver = new MutationObserver(\n debounce(\n async () => {\n updateFocussedStateOnMutation(\n this.overlayWrapper,\n this.focusedToolbar,\n this.visualBuilderContainer,\n this.resizeObserver\n );\n const emptyBlockParents = Array.from(\n document.querySelectorAll(\n \".visual-builder__empty-block-parent\"\n )\n );\n\n const previousEmptyBlockParents = VisualBuilder\n .VisualBuilderGlobalState.value\n .previousEmptyBlockParents as Element[];\n\n if (!isEqual(emptyBlockParents, previousEmptyBlockParents)) {\n const noMoreEmptyBlockParent =\n previousEmptyBlockParents.filter(\n (x) => !emptyBlockParents.includes(x)\n );\n const newEmptyBlockParent = emptyBlockParents.filter(\n (x) => !previousEmptyBlockParents.includes(x)\n );\n\n removeEmptyBlocks(noMoreEmptyBlockParent);\n await generateEmptyBlocks(newEmptyBlockParent);\n\n VisualBuilder.VisualBuilderGlobalState.value = {\n ...VisualBuilder.VisualBuilderGlobalState.value,\n previousEmptyBlockParents: emptyBlockParents,\n };\n }\n },\n 100,\n { trailing: true }\n )\n );\n\n constructor() {\n // Handles changes in element positions due to sidebar toggling or window resizing,\n // triggering a redraw of the visual builder\n window.addEventListener(\"resize\", this.resizeEventHandler);\n window.addEventListener(\"scroll\", this.scrollEventHandler);\n initUI({\n resizeObserver: this.resizeObserver,\n });\n\n // Initializing goober for css-in-js\n setup(h);\n\n this.visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n );\n this.overlayWrapper = document.querySelector(\n \".visual-builder__overlay__wrapper\"\n );\n this.customCursor = document.querySelector(\".visual-builder__cursor\");\n this.focusedToolbar = document.querySelector(\n \".visual-builder__focused-toolbar\"\n );\n\n const config = Config.get();\n\n if (!config.enable || config.mode < ILivePreviewModeConfig.BUILDER) {\n return;\n }\n visualBuilderPostMessage\n ?.send<IVisualBuilderInitEvent>(\"init\", {\n isSSR: config.ssr,\n href: window.location.href,\n })\n .then((data) => {\n const {\n windowType = ILivePreviewWindowType.BUILDER,\n stackDetails,\n } = data || {};\n Config.set(\"windowType\", windowType);\n Config.set(\n \"stackDetails.masterLocale\",\n stackDetails?.masterLocale || \"en-us\"\n );\n\n addEventListeners({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n previousSelectedEditableDOM:\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n customCursor: this.customCursor,\n });\n\n addKeyboardShortcuts({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n useScrollToField();\n useHighlightCommentIcon();\n this.mutationObserver.observe(document.body, {\n childList: true,\n subtree: true,\n });\n\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.GET_ALL_ENTRIES_IN_CURRENT_PAGE,\n getEntryIdentifiersInCurrentPage\n );\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.SEND_VARIANT_AND_LOCALE\n );\n\n useHideFocusOverlayPostMessageEvent({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n\n // These events are used to sync the data when we made some changes in the entry without invoking live preview module.\n useHistoryPostMessageEvent();\n useOnEntryUpdatePostMessageEvent();\n useRecalculateVariantDataCSLPValues();\n useDraftFieldsPostMessageEvent();\n useVariantFieldsPostMessageEvent();\n })\n .catch(() => {\n if (!inIframe()) {\n generateStartEditingButton(this.visualBuilderContainer);\n }\n });\n }\n\n // TODO: write test cases\n destroy = (): void => {\n // Remove event listeners\n window.removeEventListener(\"resize\", this.resizeEventHandler);\n window.removeEventListener(\"scroll\", this.scrollEventHandler);\n\n // Remove custom event listeners\n removeEventListeners({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n previousSelectedEditableDOM:\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n customCursor: this.customCursor,\n });\n\n // Disconnect observers\n this.resizeObserver.disconnect();\n this.mutationObserver.disconnect();\n\n // Clear global state\n VisualBuilder.VisualBuilderGlobalState.value = {\n previousSelectedEditableDOM: null,\n previousHoveredTargetDOM: null,\n previousEmptyBlockParents: [],\n focusFieldValue: null,\n audienceMode: false,\n locale: \"en-us\",\n variant: null,\n };\n\n // Remove DOM elements\n if (this.visualBuilderContainer) {\n window.document.body.removeChild(this.visualBuilderContainer);\n }\n if (this.customCursor) {\n this.customCursor.remove();\n }\n if (this.overlayWrapper) {\n this.overlayWrapper.remove();\n }\n if (this.focusedToolbar) {\n this.focusedToolbar.remove();\n }\n\n // Nullify references\n this.customCursor = null;\n this.overlayWrapper = null;\n this.visualBuilderContainer = null;\n this.focusedToolbar = null;\n };\n}\n"],"mappings":"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","names":["initUI","Config","visualBuilderPostMessage","_a"]}
|
|
@@ -109,7 +109,8 @@ var _VisualBuilder = class _VisualBuilder {
|
|
|
109
109
|
updateFocussedStateOnMutation(
|
|
110
110
|
this.overlayWrapper,
|
|
111
111
|
this.focusedToolbar,
|
|
112
|
-
this.visualBuilderContainer
|
|
112
|
+
this.visualBuilderContainer,
|
|
113
|
+
this.resizeObserver
|
|
113
114
|
);
|
|
114
115
|
const emptyBlockParents = Array.from(
|
|
115
116
|
document.querySelectorAll(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/visualBuilder/index.ts"],"sourcesContent":["import { Signal, signal } from \"@preact/signals\";\n\nimport { inIframe } from \"../common/inIframe\";\nimport Config from \"../configManager/configManager\";\nimport {\n useHistoryPostMessageEvent,\n useOnEntryUpdatePostMessageEvent,\n} from \"../livePreview/eventManager/postMessageEvent.hooks\";\nimport {\n ILivePreviewModeConfig,\n ILivePreviewWindowType,\n IVisualBuilderInitEvent,\n} from \"../types/types\";\nimport { generateStartEditingButton } from \"./generators/generateStartEditingButton\";\n\nimport { addFocusOverlay } from \"./generators/generateOverlay\";\nimport { getEntryIdentifiersInCurrentPage } from \"./utils/getEntryIdentifiersInCurrentPage\";\nimport visualBuilderPostMessage from \"./utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"./utils/types/postMessage.types\";\n\nimport { setup } from \"goober\";\nimport { debounce, isEqual } from \"lodash-es\";\nimport { h } from \"preact\";\nimport { extractDetailsFromCslp } from \"../cslp\";\nimport initUI from \"./components\";\nimport { useDraftFieldsPostMessageEvent } from \"./eventManager/useDraftFieldsPostMessageEvent\";\nimport { useHideFocusOverlayPostMessageEvent } from \"./eventManager/useHideFocusOverlayPostMessageEvent\";\nimport { useScrollToField } from \"./eventManager/useScrollToField\";\nimport { useVariantFieldsPostMessageEvent } from \"./eventManager/useVariantsPostMessageEvent\";\nimport {\n generateEmptyBlocks,\n removeEmptyBlocks,\n} from \"./generators/generateEmptyBlock\";\nimport { addEventListeners, removeEventListeners } from \"./listeners\";\nimport { addKeyboardShortcuts } from \"./listeners/keyboardShortcuts\";\nimport { FieldSchemaMap } from \"./utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"./utils/isFieldDisabled\";\nimport {\n updateFocussedState,\n updateFocussedStateOnMutation,\n} from \"./utils/updateFocussedState\";\nimport { useHighlightCommentIcon } from \"./eventManager/useHighlightCommentIcon\";\nimport { updateHighlightedCommentIconPosition } from \"./generators/generateHighlightedComment\";\nimport { useRecalculateVariantDataCSLPValues } from \"./eventManager/useRecalculateVariantDataCSLPValues\";\n\ninterface VisualBuilderGlobalStateImpl {\n previousSelectedEditableDOM: HTMLElement | Element | null;\n previousHoveredTargetDOM: Element | null;\n previousEmptyBlockParents: Element[] | [];\n focusFieldValue: string | null;\n audienceMode: boolean;\n locale: string;\n variant: string | null;\n}\n\nexport class VisualBuilder {\n private customCursor: HTMLDivElement | null = null;\n private overlayWrapper: HTMLDivElement | null = null;\n private visualBuilderContainer: HTMLDivElement | null = null;\n private focusedToolbar: HTMLDivElement | null = null;\n\n static VisualBuilderGlobalState: Signal<VisualBuilderGlobalStateImpl> =\n signal({\n previousSelectedEditableDOM: null,\n previousHoveredTargetDOM: null,\n previousEmptyBlockParents: [],\n focusFieldValue: null,\n audienceMode: false,\n locale: Config.get().stackDetails.masterLocale || \"en-us\",\n variant: null,\n });\n\n private handlePositionChange(editableElement: HTMLElement) {\n updateFocussedState({\n editableElement,\n visualBuilderContainer: this.visualBuilderContainer,\n overlayWrapper: this.overlayWrapper,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n }\n\n private scrollEventHandler = () => {\n updateHighlightedCommentIconPosition(); // Update icons position\n };\n\n private resizeEventHandler = () => {\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n updateHighlightedCommentIconPosition();\n if (previousSelectedEditableDOM) {\n this.handlePositionChange(\n previousSelectedEditableDOM as HTMLElement\n );\n }\n };\n\n private resizeObserver = new ResizeObserver(([entry]) => {\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n\n if (!this.overlayWrapper || !previousSelectedEditableDOM) {\n return;\n }\n\n // if previous selected editable element is not same as the current\n // target and the target is also not psuedo-editable then return\n if (\n !entry.target.isSameNode(previousSelectedEditableDOM) &&\n !entry.target.classList.contains(\n \"visual-builder__pseudo-editable-element\"\n )\n ) {\n return;\n }\n\n const isPsuedoEditableElement = entry.target.classList.contains(\n \"visual-builder__pseudo-editable-element\"\n );\n\n // the \"actual\" editable element when the current target is psuedo-editable\n // is the previous selected editable element instead of the closest data-cslp element\n // (cant use closest because the psuedo editable is absolute positioned)\n // (Note - why do we even need the closest? we do an early exit if entry.target\n // is not the previous selected editable element, needs more investigation)\n const editableElement = (\n isPsuedoEditableElement\n ? previousSelectedEditableDOM\n : entry.target.closest(\"[data-cslp]\")\n ) as HTMLElement | null;\n\n if (isPsuedoEditableElement) {\n // if the current target is psuedo-editable, then the resizing occurred by typing\n // into the psuedo editable, simply update the focus overlay\n addFocusOverlay(entry.target, this.overlayWrapper);\n\n // TODO check if we can now resize the actual editable element\n // when psuedo editable element is resized, avoid infinite loops\n } else if (editableElement) {\n this.handlePositionChange(editableElement);\n }\n\n // update the overlay if field is disabled\n const cslpData =\n editableElement && editableElement.getAttribute(\"data-cslp\");\n\n if (!editableElement || !cslpData) {\n return;\n }\n\n const fieldMetadata = extractDetailsFromCslp(cslpData);\n\n FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n ).then((fieldSchema) => {\n if (!fieldSchema) {\n return;\n }\n const { isDisabled } = isFieldDisabled(fieldSchema, {\n editableElement,\n fieldMetadata,\n });\n if (isDisabled) {\n addFocusOverlay(\n editableElement,\n this.overlayWrapper as HTMLDivElement,\n isDisabled\n );\n }\n });\n });\n\n private mutationObserver = new MutationObserver(\n debounce(\n async () => {\n updateFocussedStateOnMutation(\n this.overlayWrapper,\n this.focusedToolbar,\n this.visualBuilderContainer\n );\n const emptyBlockParents = Array.from(\n document.querySelectorAll(\n \".visual-builder__empty-block-parent\"\n )\n );\n\n const previousEmptyBlockParents = VisualBuilder\n .VisualBuilderGlobalState.value\n .previousEmptyBlockParents as Element[];\n\n if (!isEqual(emptyBlockParents, previousEmptyBlockParents)) {\n const noMoreEmptyBlockParent =\n previousEmptyBlockParents.filter(\n (x) => !emptyBlockParents.includes(x)\n );\n const newEmptyBlockParent = emptyBlockParents.filter(\n (x) => !previousEmptyBlockParents.includes(x)\n );\n\n removeEmptyBlocks(noMoreEmptyBlockParent);\n await generateEmptyBlocks(newEmptyBlockParent);\n\n VisualBuilder.VisualBuilderGlobalState.value = {\n ...VisualBuilder.VisualBuilderGlobalState.value,\n previousEmptyBlockParents: emptyBlockParents,\n };\n }\n },\n 100,\n { trailing: true }\n )\n );\n\n constructor() {\n // Handles changes in element positions due to sidebar toggling or window resizing,\n // triggering a redraw of the visual builder\n window.addEventListener(\"resize\", this.resizeEventHandler);\n window.addEventListener(\"scroll\", this.scrollEventHandler);\n initUI({\n resizeObserver: this.resizeObserver,\n });\n\n // Initializing goober for css-in-js\n setup(h);\n\n this.visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n );\n this.overlayWrapper = document.querySelector(\n \".visual-builder__overlay__wrapper\"\n );\n this.customCursor = document.querySelector(\".visual-builder__cursor\");\n this.focusedToolbar = document.querySelector(\n \".visual-builder__focused-toolbar\"\n );\n\n const config = Config.get();\n\n if (!config.enable || config.mode < ILivePreviewModeConfig.BUILDER) {\n return;\n }\n visualBuilderPostMessage\n ?.send<IVisualBuilderInitEvent>(\"init\", {\n isSSR: config.ssr,\n href: window.location.href,\n })\n .then((data) => {\n const {\n windowType = ILivePreviewWindowType.BUILDER,\n stackDetails,\n } = data || {};\n Config.set(\"windowType\", windowType);\n Config.set(\n \"stackDetails.masterLocale\",\n stackDetails?.masterLocale || \"en-us\"\n );\n\n addEventListeners({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n previousSelectedEditableDOM:\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n customCursor: this.customCursor,\n });\n\n addKeyboardShortcuts({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n useScrollToField();\n useHighlightCommentIcon();\n this.mutationObserver.observe(document.body, {\n childList: true,\n subtree: true,\n });\n\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.GET_ALL_ENTRIES_IN_CURRENT_PAGE,\n getEntryIdentifiersInCurrentPage\n );\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.SEND_VARIANT_AND_LOCALE\n );\n\n useHideFocusOverlayPostMessageEvent({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n\n // These events are used to sync the data when we made some changes in the entry without invoking live preview module.\n useHistoryPostMessageEvent();\n useOnEntryUpdatePostMessageEvent();\n useRecalculateVariantDataCSLPValues();\n useDraftFieldsPostMessageEvent();\n useVariantFieldsPostMessageEvent();\n })\n .catch(() => {\n if (!inIframe()) {\n generateStartEditingButton(this.visualBuilderContainer);\n }\n });\n }\n\n // TODO: write test cases\n destroy = (): void => {\n // Remove event listeners\n window.removeEventListener(\"resize\", this.resizeEventHandler);\n window.removeEventListener(\"scroll\", this.scrollEventHandler);\n\n // Remove custom event listeners\n removeEventListeners({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n previousSelectedEditableDOM:\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n customCursor: this.customCursor,\n });\n\n // Disconnect observers\n this.resizeObserver.disconnect();\n this.mutationObserver.disconnect();\n\n // Clear global state\n VisualBuilder.VisualBuilderGlobalState.value = {\n previousSelectedEditableDOM: null,\n previousHoveredTargetDOM: null,\n previousEmptyBlockParents: [],\n focusFieldValue: null,\n audienceMode: false,\n locale: \"en-us\",\n variant: null,\n };\n\n // Remove DOM elements\n if (this.visualBuilderContainer) {\n window.document.body.removeChild(this.visualBuilderContainer);\n }\n if (this.customCursor) {\n this.customCursor.remove();\n }\n if (this.overlayWrapper) {\n this.overlayWrapper.remove();\n }\n if (this.focusedToolbar) {\n this.focusedToolbar.remove();\n }\n\n // Nullify references\n this.customCursor = null;\n this.overlayWrapper = null;\n this.visualBuilderContainer = null;\n this.focusedToolbar = null;\n };\n}\n"],"mappings":"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","names":["_a"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/visualBuilder/index.ts"],"sourcesContent":["import { Signal, signal } from \"@preact/signals\";\n\nimport { inIframe } from \"../common/inIframe\";\nimport Config from \"../configManager/configManager\";\nimport {\n useHistoryPostMessageEvent,\n useOnEntryUpdatePostMessageEvent,\n} from \"../livePreview/eventManager/postMessageEvent.hooks\";\nimport {\n ILivePreviewModeConfig,\n ILivePreviewWindowType,\n IVisualBuilderInitEvent,\n} from \"../types/types\";\nimport { generateStartEditingButton } from \"./generators/generateStartEditingButton\";\n\nimport { addFocusOverlay } from \"./generators/generateOverlay\";\nimport { getEntryIdentifiersInCurrentPage } from \"./utils/getEntryIdentifiersInCurrentPage\";\nimport visualBuilderPostMessage from \"./utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"./utils/types/postMessage.types\";\n\nimport { setup } from \"goober\";\nimport { debounce, isEqual } from \"lodash-es\";\nimport { h } from \"preact\";\nimport { extractDetailsFromCslp } from \"../cslp\";\nimport initUI from \"./components\";\nimport { useDraftFieldsPostMessageEvent } from \"./eventManager/useDraftFieldsPostMessageEvent\";\nimport { useHideFocusOverlayPostMessageEvent } from \"./eventManager/useHideFocusOverlayPostMessageEvent\";\nimport { useScrollToField } from \"./eventManager/useScrollToField\";\nimport { useVariantFieldsPostMessageEvent } from \"./eventManager/useVariantsPostMessageEvent\";\nimport {\n generateEmptyBlocks,\n removeEmptyBlocks,\n} from \"./generators/generateEmptyBlock\";\nimport { addEventListeners, removeEventListeners } from \"./listeners\";\nimport { addKeyboardShortcuts } from \"./listeners/keyboardShortcuts\";\nimport { FieldSchemaMap } from \"./utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"./utils/isFieldDisabled\";\nimport {\n updateFocussedState,\n updateFocussedStateOnMutation,\n} from \"./utils/updateFocussedState\";\nimport { useHighlightCommentIcon } from \"./eventManager/useHighlightCommentIcon\";\nimport { updateHighlightedCommentIconPosition } from \"./generators/generateHighlightedComment\";\nimport { useRecalculateVariantDataCSLPValues } from \"./eventManager/useRecalculateVariantDataCSLPValues\";\n\ninterface VisualBuilderGlobalStateImpl {\n previousSelectedEditableDOM: HTMLElement | Element | null;\n previousHoveredTargetDOM: Element | null;\n previousEmptyBlockParents: Element[] | [];\n focusFieldValue: string | null;\n audienceMode: boolean;\n locale: string;\n variant: string | null;\n}\n\nexport class VisualBuilder {\n private customCursor: HTMLDivElement | null = null;\n private overlayWrapper: HTMLDivElement | null = null;\n private visualBuilderContainer: HTMLDivElement | null = null;\n private focusedToolbar: HTMLDivElement | null = null;\n\n static VisualBuilderGlobalState: Signal<VisualBuilderGlobalStateImpl> =\n signal({\n previousSelectedEditableDOM: null,\n previousHoveredTargetDOM: null,\n previousEmptyBlockParents: [],\n focusFieldValue: null,\n audienceMode: false,\n locale: Config.get().stackDetails.masterLocale || \"en-us\",\n variant: null,\n });\n\n private handlePositionChange(editableElement: HTMLElement) {\n updateFocussedState({\n editableElement,\n visualBuilderContainer: this.visualBuilderContainer,\n overlayWrapper: this.overlayWrapper,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n }\n\n private scrollEventHandler = () => {\n updateHighlightedCommentIconPosition(); // Update icons position\n };\n\n private resizeEventHandler = () => {\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n updateHighlightedCommentIconPosition();\n if (previousSelectedEditableDOM) {\n this.handlePositionChange(\n previousSelectedEditableDOM as HTMLElement\n );\n }\n };\n\n private resizeObserver = new ResizeObserver(([entry]) => {\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n\n if (!this.overlayWrapper || !previousSelectedEditableDOM) {\n return;\n }\n\n // if previous selected editable element is not same as the current\n // target and the target is also not psuedo-editable then return\n if (\n !entry.target.isSameNode(previousSelectedEditableDOM) &&\n !entry.target.classList.contains(\n \"visual-builder__pseudo-editable-element\"\n )\n ) {\n return;\n }\n\n const isPsuedoEditableElement = entry.target.classList.contains(\n \"visual-builder__pseudo-editable-element\"\n );\n\n // the \"actual\" editable element when the current target is psuedo-editable\n // is the previous selected editable element instead of the closest data-cslp element\n // (cant use closest because the psuedo editable is absolute positioned)\n // (Note - why do we even need the closest? we do an early exit if entry.target\n // is not the previous selected editable element, needs more investigation)\n const editableElement = (\n isPsuedoEditableElement\n ? previousSelectedEditableDOM\n : entry.target.closest(\"[data-cslp]\")\n ) as HTMLElement | null;\n\n if (isPsuedoEditableElement) {\n // if the current target is psuedo-editable, then the resizing occurred by typing\n // into the psuedo editable, simply update the focus overlay\n addFocusOverlay(entry.target, this.overlayWrapper);\n\n // TODO check if we can now resize the actual editable element\n // when psuedo editable element is resized, avoid infinite loops\n } else if (editableElement) {\n this.handlePositionChange(editableElement);\n }\n\n // update the overlay if field is disabled\n const cslpData =\n editableElement && editableElement.getAttribute(\"data-cslp\");\n\n if (!editableElement || !cslpData) {\n return;\n }\n\n const fieldMetadata = extractDetailsFromCslp(cslpData);\n\n FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n ).then((fieldSchema) => {\n if (!fieldSchema) {\n return;\n }\n const { isDisabled } = isFieldDisabled(fieldSchema, {\n editableElement,\n fieldMetadata,\n });\n if (isDisabled) {\n addFocusOverlay(\n editableElement,\n this.overlayWrapper as HTMLDivElement,\n isDisabled\n );\n }\n });\n });\n\n private mutationObserver = new MutationObserver(\n debounce(\n async () => {\n updateFocussedStateOnMutation(\n this.overlayWrapper,\n this.focusedToolbar,\n this.visualBuilderContainer,\n this.resizeObserver\n );\n const emptyBlockParents = Array.from(\n document.querySelectorAll(\n \".visual-builder__empty-block-parent\"\n )\n );\n\n const previousEmptyBlockParents = VisualBuilder\n .VisualBuilderGlobalState.value\n .previousEmptyBlockParents as Element[];\n\n if (!isEqual(emptyBlockParents, previousEmptyBlockParents)) {\n const noMoreEmptyBlockParent =\n previousEmptyBlockParents.filter(\n (x) => !emptyBlockParents.includes(x)\n );\n const newEmptyBlockParent = emptyBlockParents.filter(\n (x) => !previousEmptyBlockParents.includes(x)\n );\n\n removeEmptyBlocks(noMoreEmptyBlockParent);\n await generateEmptyBlocks(newEmptyBlockParent);\n\n VisualBuilder.VisualBuilderGlobalState.value = {\n ...VisualBuilder.VisualBuilderGlobalState.value,\n previousEmptyBlockParents: emptyBlockParents,\n };\n }\n },\n 100,\n { trailing: true }\n )\n );\n\n constructor() {\n // Handles changes in element positions due to sidebar toggling or window resizing,\n // triggering a redraw of the visual builder\n window.addEventListener(\"resize\", this.resizeEventHandler);\n window.addEventListener(\"scroll\", this.scrollEventHandler);\n initUI({\n resizeObserver: this.resizeObserver,\n });\n\n // Initializing goober for css-in-js\n setup(h);\n\n this.visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n );\n this.overlayWrapper = document.querySelector(\n \".visual-builder__overlay__wrapper\"\n );\n this.customCursor = document.querySelector(\".visual-builder__cursor\");\n this.focusedToolbar = document.querySelector(\n \".visual-builder__focused-toolbar\"\n );\n\n const config = Config.get();\n\n if (!config.enable || config.mode < ILivePreviewModeConfig.BUILDER) {\n return;\n }\n visualBuilderPostMessage\n ?.send<IVisualBuilderInitEvent>(\"init\", {\n isSSR: config.ssr,\n href: window.location.href,\n })\n .then((data) => {\n const {\n windowType = ILivePreviewWindowType.BUILDER,\n stackDetails,\n } = data || {};\n Config.set(\"windowType\", windowType);\n Config.set(\n \"stackDetails.masterLocale\",\n stackDetails?.masterLocale || \"en-us\"\n );\n\n addEventListeners({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n previousSelectedEditableDOM:\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n customCursor: this.customCursor,\n });\n\n addKeyboardShortcuts({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n useScrollToField();\n useHighlightCommentIcon();\n this.mutationObserver.observe(document.body, {\n childList: true,\n subtree: true,\n });\n\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.GET_ALL_ENTRIES_IN_CURRENT_PAGE,\n getEntryIdentifiersInCurrentPage\n );\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.SEND_VARIANT_AND_LOCALE\n );\n\n useHideFocusOverlayPostMessageEvent({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n\n // These events are used to sync the data when we made some changes in the entry without invoking live preview module.\n useHistoryPostMessageEvent();\n useOnEntryUpdatePostMessageEvent();\n useRecalculateVariantDataCSLPValues();\n useDraftFieldsPostMessageEvent();\n useVariantFieldsPostMessageEvent();\n })\n .catch(() => {\n if (!inIframe()) {\n generateStartEditingButton(this.visualBuilderContainer);\n }\n });\n }\n\n // TODO: write test cases\n destroy = (): void => {\n // Remove event listeners\n window.removeEventListener(\"resize\", this.resizeEventHandler);\n window.removeEventListener(\"scroll\", this.scrollEventHandler);\n\n // Remove custom event listeners\n removeEventListeners({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n previousSelectedEditableDOM:\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n customCursor: this.customCursor,\n });\n\n // Disconnect observers\n this.resizeObserver.disconnect();\n this.mutationObserver.disconnect();\n\n // Clear global state\n VisualBuilder.VisualBuilderGlobalState.value = {\n previousSelectedEditableDOM: null,\n previousHoveredTargetDOM: null,\n previousEmptyBlockParents: [],\n focusFieldValue: null,\n audienceMode: false,\n locale: \"en-us\",\n variant: null,\n };\n\n // Remove DOM elements\n if (this.visualBuilderContainer) {\n window.document.body.removeChild(this.visualBuilderContainer);\n }\n if (this.customCursor) {\n this.customCursor.remove();\n }\n if (this.overlayWrapper) {\n this.overlayWrapper.remove();\n }\n if (this.focusedToolbar) {\n this.focusedToolbar.remove();\n }\n\n // Nullify references\n this.customCursor = null;\n this.overlayWrapper = null;\n this.visualBuilderContainer = null;\n this.focusedToolbar = null;\n };\n}\n"],"mappings":"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","names":["_a"]}
|
|
@@ -91,10 +91,16 @@ function removeEventListeners(params) {
|
|
|
91
91
|
window.removeEventListener("mousemove", mousemoveHandler);
|
|
92
92
|
}
|
|
93
93
|
if (mouseleaveHandler) {
|
|
94
|
-
document.documentElement.removeEventListener(
|
|
94
|
+
document.documentElement.removeEventListener(
|
|
95
|
+
"mouseleave",
|
|
96
|
+
mouseleaveHandler
|
|
97
|
+
);
|
|
95
98
|
}
|
|
96
99
|
if (mouseenterHandler) {
|
|
97
|
-
document.documentElement.removeEventListener(
|
|
100
|
+
document.documentElement.removeEventListener(
|
|
101
|
+
"mouseenter",
|
|
102
|
+
mouseenterHandler
|
|
103
|
+
);
|
|
98
104
|
}
|
|
99
105
|
eventListenersMap.clear();
|
|
100
106
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/visualBuilder/listeners/index.ts"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"sources":["../../../../src/visualBuilder/listeners/index.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport handleBuilderInteraction from \"./mouseClick\";\nimport handleMouseHover, {\n hideCustomCursor,\n hideHoverOutline,\n showCustomCursor,\n} from \"./mouseHover\";\nimport EventListenerHandlerParams from \"./types\";\n\ntype AddEventListenersParams = Omit<\n EventListenerHandlerParams,\n \"event\" | \"eventDetails\"\n>;\n\ntype RemoveEventListenersParams = Omit<\n EventListenerHandlerParams,\n \"event\" | \"eventDetails\"\n>;\nconst eventHandlers = {\n click: (params: AddEventListenersParams) => (event: MouseEvent) => {\n handleBuilderInteraction({\n event: event,\n overlayWrapper: params.overlayWrapper,\n visualBuilderContainer: params.visualBuilderContainer,\n previousSelectedEditableDOM:\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n });\n },\n mousemove: (params: AddEventListenersParams) => (event: MouseEvent) => {\n handleMouseHover({\n event: event,\n overlayWrapper: params.overlayWrapper,\n visualBuilderContainer: params.visualBuilderContainer,\n customCursor: params.customCursor,\n });\n },\n mouseleave: (params: AddEventListenersParams) => () => {\n hideCustomCursor(params.customCursor);\n hideHoverOutline(params.visualBuilderContainer);\n },\n mouseenter: (params: AddEventListenersParams) => () => {\n showCustomCursor(params.customCursor);\n },\n};\nconst eventListenersMap = new Map<string, EventListener>();\nexport function addEventListeners(params: AddEventListenersParams): void {\n const clickHandler = eventHandlers.click(params);\n const mousemoveHandler = eventHandlers.mousemove(params);\n const mouseleaveHandler = eventHandlers.mouseleave(params);\n const mouseenterHandler = eventHandlers.mouseenter(params);\n\n eventListenersMap.set(\"click\", clickHandler as EventListener);\n eventListenersMap.set(\"mousemove\", mousemoveHandler as EventListener);\n eventListenersMap.set(\"mouseleave\", mouseleaveHandler);\n eventListenersMap.set(\"mouseenter\", mouseenterHandler);\n\n window.addEventListener(\"click\", clickHandler, { capture: true });\n window.addEventListener(\"mousemove\", mousemoveHandler);\n document.documentElement.addEventListener(\"mouseleave\", mouseleaveHandler);\n document.documentElement.addEventListener(\"mouseenter\", mouseenterHandler);\n}\n\nexport function removeEventListeners(params: RemoveEventListenersParams): void {\n const clickHandler = eventListenersMap.get(\"click\");\n const mousemoveHandler = eventListenersMap.get(\"mousemove\");\n const mouseleaveHandler = eventListenersMap.get(\"mouseleave\");\n const mouseenterHandler = eventListenersMap.get(\"mouseenter\");\n\n if (clickHandler) {\n window.removeEventListener(\"click\", clickHandler, { capture: true });\n }\n if (mousemoveHandler) {\n window.removeEventListener(\"mousemove\", mousemoveHandler);\n }\n if (mouseleaveHandler) {\n document.documentElement.removeEventListener(\n \"mouseleave\",\n mouseleaveHandler\n );\n }\n if (mouseenterHandler) {\n document.documentElement.removeEventListener(\n \"mouseenter\",\n mouseenterHandler\n );\n }\n\n eventListenersMap.clear();\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAA8B;AAC9B,wBAAqC;AACrC,wBAIO;AAYP,IAAM,gBAAgB;AAAA,EAClB,OAAO,CAAC,WAAoC,CAAC,UAAsB;AAC/D,0BAAAA,SAAyB;AAAA,MACrB;AAAA,MACA,gBAAgB,OAAO;AAAA,MACvB,wBAAwB,OAAO;AAAA,MAC/B,6BACI,uBAAc,yBAAyB,MAClC;AAAA,MACT,gBAAgB,OAAO;AAAA,MACvB,gBAAgB,OAAO;AAAA,IAC3B,CAAC;AAAA,EACL;AAAA,EACA,WAAW,CAAC,WAAoC,CAAC,UAAsB;AACnE,0BAAAC,SAAiB;AAAA,MACb;AAAA,MACA,gBAAgB,OAAO;AAAA,MACvB,wBAAwB,OAAO;AAAA,MAC/B,cAAc,OAAO;AAAA,IACzB,CAAC;AAAA,EACL;AAAA,EACA,YAAY,CAAC,WAAoC,MAAM;AACnD,4CAAiB,OAAO,YAAY;AACpC,4CAAiB,OAAO,sBAAsB;AAAA,EAClD;AAAA,EACA,YAAY,CAAC,WAAoC,MAAM;AACnD,4CAAiB,OAAO,YAAY;AAAA,EACxC;AACJ;AACA,IAAM,oBAAoB,oBAAI,IAA2B;AAClD,SAAS,kBAAkB,QAAuC;AACrE,QAAM,eAAe,cAAc,MAAM,MAAM;AAC/C,QAAM,mBAAmB,cAAc,UAAU,MAAM;AACvD,QAAM,oBAAoB,cAAc,WAAW,MAAM;AACzD,QAAM,oBAAoB,cAAc,WAAW,MAAM;AAEzD,oBAAkB,IAAI,SAAS,YAA6B;AAC5D,oBAAkB,IAAI,aAAa,gBAAiC;AACpE,oBAAkB,IAAI,cAAc,iBAAiB;AACrD,oBAAkB,IAAI,cAAc,iBAAiB;AAErD,SAAO,iBAAiB,SAAS,cAAc,EAAE,SAAS,KAAK,CAAC;AAChE,SAAO,iBAAiB,aAAa,gBAAgB;AACrD,WAAS,gBAAgB,iBAAiB,cAAc,iBAAiB;AACzE,WAAS,gBAAgB,iBAAiB,cAAc,iBAAiB;AAC7E;AAEO,SAAS,qBAAqB,QAA0C;AAC3E,QAAM,eAAe,kBAAkB,IAAI,OAAO;AAClD,QAAM,mBAAmB,kBAAkB,IAAI,WAAW;AAC1D,QAAM,oBAAoB,kBAAkB,IAAI,YAAY;AAC5D,QAAM,oBAAoB,kBAAkB,IAAI,YAAY;AAE5D,MAAI,cAAc;AACd,WAAO,oBAAoB,SAAS,cAAc,EAAE,SAAS,KAAK,CAAC;AAAA,EACvE;AACA,MAAI,kBAAkB;AAClB,WAAO,oBAAoB,aAAa,gBAAgB;AAAA,EAC5D;AACA,MAAI,mBAAmB;AACnB,aAAS,gBAAgB;AAAA,MACrB;AAAA,MACA;AAAA,IACJ;AAAA,EACJ;AACA,MAAI,mBAAmB;AACnB,aAAS,gBAAgB;AAAA,MACrB;AAAA,MACA;AAAA,IACJ;AAAA,EACJ;AAEA,oBAAkB,MAAM;AAC5B;","names":["handleBuilderInteraction","handleMouseHover"]}
|
|
@@ -62,10 +62,16 @@ function removeEventListeners(params) {
|
|
|
62
62
|
window.removeEventListener("mousemove", mousemoveHandler);
|
|
63
63
|
}
|
|
64
64
|
if (mouseleaveHandler) {
|
|
65
|
-
document.documentElement.removeEventListener(
|
|
65
|
+
document.documentElement.removeEventListener(
|
|
66
|
+
"mouseleave",
|
|
67
|
+
mouseleaveHandler
|
|
68
|
+
);
|
|
66
69
|
}
|
|
67
70
|
if (mouseenterHandler) {
|
|
68
|
-
document.documentElement.removeEventListener(
|
|
71
|
+
document.documentElement.removeEventListener(
|
|
72
|
+
"mouseenter",
|
|
73
|
+
mouseenterHandler
|
|
74
|
+
);
|
|
69
75
|
}
|
|
70
76
|
eventListenersMap.clear();
|
|
71
77
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/visualBuilder/listeners/index.ts"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"sources":["../../../../src/visualBuilder/listeners/index.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport handleBuilderInteraction from \"./mouseClick\";\nimport handleMouseHover, {\n hideCustomCursor,\n hideHoverOutline,\n showCustomCursor,\n} from \"./mouseHover\";\nimport EventListenerHandlerParams from \"./types\";\n\ntype AddEventListenersParams = Omit<\n EventListenerHandlerParams,\n \"event\" | \"eventDetails\"\n>;\n\ntype RemoveEventListenersParams = Omit<\n EventListenerHandlerParams,\n \"event\" | \"eventDetails\"\n>;\nconst eventHandlers = {\n click: (params: AddEventListenersParams) => (event: MouseEvent) => {\n handleBuilderInteraction({\n event: event,\n overlayWrapper: params.overlayWrapper,\n visualBuilderContainer: params.visualBuilderContainer,\n previousSelectedEditableDOM:\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n });\n },\n mousemove: (params: AddEventListenersParams) => (event: MouseEvent) => {\n handleMouseHover({\n event: event,\n overlayWrapper: params.overlayWrapper,\n visualBuilderContainer: params.visualBuilderContainer,\n customCursor: params.customCursor,\n });\n },\n mouseleave: (params: AddEventListenersParams) => () => {\n hideCustomCursor(params.customCursor);\n hideHoverOutline(params.visualBuilderContainer);\n },\n mouseenter: (params: AddEventListenersParams) => () => {\n showCustomCursor(params.customCursor);\n },\n};\nconst eventListenersMap = new Map<string, EventListener>();\nexport function addEventListeners(params: AddEventListenersParams): void {\n const clickHandler = eventHandlers.click(params);\n const mousemoveHandler = eventHandlers.mousemove(params);\n const mouseleaveHandler = eventHandlers.mouseleave(params);\n const mouseenterHandler = eventHandlers.mouseenter(params);\n\n eventListenersMap.set(\"click\", clickHandler as EventListener);\n eventListenersMap.set(\"mousemove\", mousemoveHandler as EventListener);\n eventListenersMap.set(\"mouseleave\", mouseleaveHandler);\n eventListenersMap.set(\"mouseenter\", mouseenterHandler);\n\n window.addEventListener(\"click\", clickHandler, { capture: true });\n window.addEventListener(\"mousemove\", mousemoveHandler);\n document.documentElement.addEventListener(\"mouseleave\", mouseleaveHandler);\n document.documentElement.addEventListener(\"mouseenter\", mouseenterHandler);\n}\n\nexport function removeEventListeners(params: RemoveEventListenersParams): void {\n const clickHandler = eventListenersMap.get(\"click\");\n const mousemoveHandler = eventListenersMap.get(\"mousemove\");\n const mouseleaveHandler = eventListenersMap.get(\"mouseleave\");\n const mouseenterHandler = eventListenersMap.get(\"mouseenter\");\n\n if (clickHandler) {\n window.removeEventListener(\"click\", clickHandler, { capture: true });\n }\n if (mousemoveHandler) {\n window.removeEventListener(\"mousemove\", mousemoveHandler);\n }\n if (mouseleaveHandler) {\n document.documentElement.removeEventListener(\n \"mouseleave\",\n mouseleaveHandler\n );\n }\n if (mouseenterHandler) {\n document.documentElement.removeEventListener(\n \"mouseenter\",\n mouseenterHandler\n );\n }\n\n eventListenersMap.clear();\n}\n"],"mappings":";;;AAAA,SAAS,qBAAqB;AAC9B,OAAO,8BAA8B;AACrC,OAAO;AAAA,EACH;AAAA,EACA;AAAA,EACA;AAAA,OACG;AAYP,IAAM,gBAAgB;AAAA,EAClB,OAAO,CAAC,WAAoC,CAAC,UAAsB;AAC/D,6BAAyB;AAAA,MACrB;AAAA,MACA,gBAAgB,OAAO;AAAA,MACvB,wBAAwB,OAAO;AAAA,MAC/B,6BACI,cAAc,yBAAyB,MAClC;AAAA,MACT,gBAAgB,OAAO;AAAA,MACvB,gBAAgB,OAAO;AAAA,IAC3B,CAAC;AAAA,EACL;AAAA,EACA,WAAW,CAAC,WAAoC,CAAC,UAAsB;AACnE,qBAAiB;AAAA,MACb;AAAA,MACA,gBAAgB,OAAO;AAAA,MACvB,wBAAwB,OAAO;AAAA,MAC/B,cAAc,OAAO;AAAA,IACzB,CAAC;AAAA,EACL;AAAA,EACA,YAAY,CAAC,WAAoC,MAAM;AACnD,qBAAiB,OAAO,YAAY;AACpC,qBAAiB,OAAO,sBAAsB;AAAA,EAClD;AAAA,EACA,YAAY,CAAC,WAAoC,MAAM;AACnD,qBAAiB,OAAO,YAAY;AAAA,EACxC;AACJ;AACA,IAAM,oBAAoB,oBAAI,IAA2B;AAClD,SAAS,kBAAkB,QAAuC;AACrE,QAAM,eAAe,cAAc,MAAM,MAAM;AAC/C,QAAM,mBAAmB,cAAc,UAAU,MAAM;AACvD,QAAM,oBAAoB,cAAc,WAAW,MAAM;AACzD,QAAM,oBAAoB,cAAc,WAAW,MAAM;AAEzD,oBAAkB,IAAI,SAAS,YAA6B;AAC5D,oBAAkB,IAAI,aAAa,gBAAiC;AACpE,oBAAkB,IAAI,cAAc,iBAAiB;AACrD,oBAAkB,IAAI,cAAc,iBAAiB;AAErD,SAAO,iBAAiB,SAAS,cAAc,EAAE,SAAS,KAAK,CAAC;AAChE,SAAO,iBAAiB,aAAa,gBAAgB;AACrD,WAAS,gBAAgB,iBAAiB,cAAc,iBAAiB;AACzE,WAAS,gBAAgB,iBAAiB,cAAc,iBAAiB;AAC7E;AAEO,SAAS,qBAAqB,QAA0C;AAC3E,QAAM,eAAe,kBAAkB,IAAI,OAAO;AAClD,QAAM,mBAAmB,kBAAkB,IAAI,WAAW;AAC1D,QAAM,oBAAoB,kBAAkB,IAAI,YAAY;AAC5D,QAAM,oBAAoB,kBAAkB,IAAI,YAAY;AAE5D,MAAI,cAAc;AACd,WAAO,oBAAoB,SAAS,cAAc,EAAE,SAAS,KAAK,CAAC;AAAA,EACvE;AACA,MAAI,kBAAkB;AAClB,WAAO,oBAAoB,aAAa,gBAAgB;AAAA,EAC5D;AACA,MAAI,mBAAmB;AACnB,aAAS,gBAAgB;AAAA,MACrB;AAAA,MACA;AAAA,IACJ;AAAA,EACJ;AACA,MAAI,mBAAmB;AACnB,aAAS,gBAAgB;AAAA,MACrB;AAAA,MACA;AAAA,IACJ;AAAA,EACJ;AAEA,oBAAkB,MAAM;AAC5B;","names":[]}
|
|
@@ -56,7 +56,7 @@ function addOverlay(params) {
|
|
|
56
56
|
function addFocusedToolbar(params) {
|
|
57
57
|
const { editableElement } = params.eventDetails;
|
|
58
58
|
if (!editableElement || !params.focusedToolbar) return;
|
|
59
|
-
(0, import_generateToolbar.appendFocusedToolbar)(params.eventDetails, params.focusedToolbar);
|
|
59
|
+
(0, import_generateToolbar.appendFocusedToolbar)(params.eventDetails, params.focusedToolbar, params.hideOverlay);
|
|
60
60
|
}
|
|
61
61
|
async function handleBuilderInteraction(params) {
|
|
62
62
|
var _a, _b;
|
|
@@ -103,7 +103,15 @@ async function handleBuilderInteraction(params) {
|
|
|
103
103
|
});
|
|
104
104
|
addFocusedToolbar({
|
|
105
105
|
eventDetails,
|
|
106
|
-
focusedToolbar: params.focusedToolbar
|
|
106
|
+
focusedToolbar: params.focusedToolbar,
|
|
107
|
+
hideOverlay: () => {
|
|
108
|
+
(0, import_generateOverlay.hideOverlay)({
|
|
109
|
+
visualBuilderContainer: params.visualBuilderContainer,
|
|
110
|
+
visualBuilderOverlayWrapper: params.overlayWrapper,
|
|
111
|
+
focusedToolbar: params.focusedToolbar,
|
|
112
|
+
resizeObserver: params.resizeObserver
|
|
113
|
+
});
|
|
114
|
+
}
|
|
107
115
|
});
|
|
108
116
|
const { content_type_uid, fieldPath, cslpValue } = fieldMetadata;
|
|
109
117
|
(0, import_generateHighlightedComment.toggleHighlightedCommentIconDisplay)(cslpValue, false);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/visualBuilder/listeners/mouseClick.ts"],"sourcesContent":["import {\n cleanIndividualFieldResidual,\n handleIndividualFields,\n} from \"../utils/handleIndividualFields\";\n\nimport {\n getCsDataOfElement,\n getDOMEditStack,\n} from \"../utils/getCsDataOfElement\";\n\nimport { appendFocusedToolbar } from \"../generators/generateToolbar\";\n\nimport { addFocusOverlay, hideOverlay } from \"../generators/generateOverlay\";\n\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\n\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\nimport { VisualBuilder } from \"..\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\nimport EventListenerHandlerParams from \"./types\";\nimport { toggleHighlightedCommentIconDisplay } from \"../generators/generateHighlightedComment\";\n\ntype HandleBuilderInteractionParams = Omit<\n EventListenerHandlerParams,\n \"eventDetails\" | \"customCursor\"\n>;\n\ntype AddFocusOverlayParams = Pick<\n EventListenerHandlerParams,\n \"overlayWrapper\" | \"resizeObserver\"\n> & { editableElement: Element; isFieldDisabled?: boolean };\n\ntype AddFocusedToolbarParams = Pick<\n EventListenerHandlerParams,\n \"eventDetails\" | \"focusedToolbar\"\n
|
|
1
|
+
{"version":3,"sources":["../../../../src/visualBuilder/listeners/mouseClick.ts"],"sourcesContent":["import {\n cleanIndividualFieldResidual,\n handleIndividualFields,\n} from \"../utils/handleIndividualFields\";\n\nimport {\n getCsDataOfElement,\n getDOMEditStack,\n} from \"../utils/getCsDataOfElement\";\n\nimport { appendFocusedToolbar } from \"../generators/generateToolbar\";\n\nimport { addFocusOverlay, hideOverlay } from \"../generators/generateOverlay\";\n\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\n\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\nimport { VisualBuilder } from \"..\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\nimport EventListenerHandlerParams from \"./types\";\nimport { toggleHighlightedCommentIconDisplay } from \"../generators/generateHighlightedComment\";\n\ntype HandleBuilderInteractionParams = Omit<\n EventListenerHandlerParams,\n \"eventDetails\" | \"customCursor\"\n>;\n\ntype AddFocusOverlayParams = Pick<\n EventListenerHandlerParams,\n \"overlayWrapper\" | \"resizeObserver\"\n> & { editableElement: Element; isFieldDisabled?: boolean };\n\ntype AddFocusedToolbarParams = Pick<\n EventListenerHandlerParams,\n \"eventDetails\" | \"focusedToolbar\"\n> & { hideOverlay: () => void };\n\nfunction addOverlay(params: AddFocusOverlayParams) {\n if (!params.overlayWrapper || !params.editableElement) return;\n\n addFocusOverlay(\n params.editableElement,\n params.overlayWrapper,\n params.isFieldDisabled\n );\n params.resizeObserver.observe(params.editableElement);\n}\n\nexport function addFocusedToolbar(params: AddFocusedToolbarParams): void {\n const { editableElement } = params.eventDetails;\n\n if (!editableElement || !params.focusedToolbar) return;\n\n appendFocusedToolbar(params.eventDetails, params.focusedToolbar, params.hideOverlay);\n}\n\nasync function handleBuilderInteraction(\n params: HandleBuilderInteractionParams\n): Promise<void> {\n const eventTarget = params.event.target as HTMLElement | null;\n const isAnchorElement = eventTarget instanceof HTMLAnchorElement;\n const elementHasCslp =\n eventTarget &&\n (eventTarget.hasAttribute(\"data-cslp\") ||\n eventTarget.closest(\"[data-cslp]\"));\n\n // prevent default behavior for anchor elements and elements with cslp attribute\n if (\n isAnchorElement ||\n (elementHasCslp && !eventTarget.closest(\".visual-builder__empty-block\"))\n ) {\n params.event.preventDefault();\n params.event.stopPropagation();\n }\n\n const eventDetails = getCsDataOfElement(params.event);\n visualBuilderPostMessage\n ?.send(VisualBuilderPostMessageEvents.MOUSE_CLICK, {\n cslpData: eventDetails?.cslpData,\n fieldMetadata: eventDetails?.fieldMetadata,\n })\n .catch((err) => {\n console.warn(\"Error while sending post message\", err);\n });\n if (\n !eventDetails ||\n !params.overlayWrapper ||\n !params.visualBuilderContainer\n ) {\n return;\n }\n const { editableElement, fieldMetadata } = eventDetails;\n\n if (\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM &&\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM !== editableElement\n ) {\n cleanIndividualFieldResidual({\n overlayWrapper: params.overlayWrapper,\n visualBuilderContainer: params.visualBuilderContainer,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n });\n }\n\n // if the selected element is our empty block element, return\n if (\n editableElement.classList.contains(\n \"visual-builder__empty-block-parent\"\n ) ||\n editableElement.classList.contains(\"visual-builder__empty-block\")\n ) {\n return;\n }\n\n // when previous and current selected element is same, return.\n // this also avoids inserting psuedo-editable field (field data is\n // not equal to text content in DOM) when performing mouse\n // selections in the content editable\n const previousSelectedElement =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n if (\n previousSelectedElement &&\n previousSelectedElement === editableElement\n ) {\n return;\n }\n\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n editableElement;\n\n addOverlay({\n overlayWrapper: params.overlayWrapper,\n resizeObserver: params.resizeObserver,\n editableElement: editableElement,\n });\n\n addFocusedToolbar({\n eventDetails: eventDetails,\n focusedToolbar: params.focusedToolbar,\n hideOverlay: () => {\n hideOverlay({\n visualBuilderContainer: params.visualBuilderContainer,\n visualBuilderOverlayWrapper: params.overlayWrapper,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n });\n }\n });\n\n const { content_type_uid, fieldPath, cslpValue } = fieldMetadata;\n\n toggleHighlightedCommentIconDisplay(cslpValue, false);\n\n const fieldSchema = await FieldSchemaMap.getFieldSchema(\n content_type_uid,\n fieldPath\n );\n\n if (fieldSchema) {\n // after field schema is available re-add disabled overlay\n const { isDisabled } = isFieldDisabled(fieldSchema, eventDetails);\n if (isDisabled) {\n addOverlay({\n overlayWrapper: params.overlayWrapper,\n resizeObserver: params.resizeObserver,\n editableElement: editableElement,\n isFieldDisabled: true,\n });\n }\n }\n\n // This is most probably redundant code, as the handleIndividualFields function\n // takes care of this\n // TODO: Remove this\n // if (\n // fieldSchema.data_type === \"block\" ||\n // fieldSchema.multiple ||\n // (fieldSchema.data_type === \"reference\" &&\n // // @ts-ignore\n // fieldSchema.field_metadata.ref_multiple)\n // ) {\n // handleAddButtonsForMultiple(eventDetails, {\n // editableElement: editableElement,\n // visualBuilderContainer: params.visualBuilderContainer,\n // resizeObserver: params.resizeObserver,\n // });\n // } else {\n // removeAddInstanceButtons({\n // eventTarget: params.event.target,\n // visualBuilderContainer: params.visualBuilderContainer,\n // overlayWrapper: params.overlayWrapper,\n // });\n // }\n visualBuilderPostMessage?.send(VisualBuilderPostMessageEvents.FOCUS_FIELD, {\n DOMEditStack: getDOMEditStack(editableElement),\n });\n\n await handleIndividualFields(eventDetails, {\n visualBuilderContainer: params.visualBuilderContainer,\n resizeObserver: params.resizeObserver,\n lastEditedField: previousSelectedElement,\n });\n}\n\nexport default handleBuilderInteraction;\n"],"mappings":"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","names":["visualBuilderPostMessage"]}
|
|
@@ -3,7 +3,9 @@ import '../types/visualBuilder.types.cjs';
|
|
|
3
3
|
import '../../cslp/types/cslp.types.cjs';
|
|
4
4
|
|
|
5
5
|
type HandleBuilderInteractionParams = Omit<EventListenerHandlerParams, "eventDetails" | "customCursor">;
|
|
6
|
-
type AddFocusedToolbarParams = Pick<EventListenerHandlerParams, "eventDetails" | "focusedToolbar"
|
|
6
|
+
type AddFocusedToolbarParams = Pick<EventListenerHandlerParams, "eventDetails" | "focusedToolbar"> & {
|
|
7
|
+
hideOverlay: () => void;
|
|
8
|
+
};
|
|
7
9
|
declare function addFocusedToolbar(params: AddFocusedToolbarParams): void;
|
|
8
10
|
declare function handleBuilderInteraction(params: HandleBuilderInteractionParams): Promise<void>;
|
|
9
11
|
|
|
@@ -3,7 +3,9 @@ import '../types/visualBuilder.types.js';
|
|
|
3
3
|
import '../../cslp/types/cslp.types.js';
|
|
4
4
|
|
|
5
5
|
type HandleBuilderInteractionParams = Omit<EventListenerHandlerParams, "eventDetails" | "customCursor">;
|
|
6
|
-
type AddFocusedToolbarParams = Pick<EventListenerHandlerParams, "eventDetails" | "focusedToolbar"
|
|
6
|
+
type AddFocusedToolbarParams = Pick<EventListenerHandlerParams, "eventDetails" | "focusedToolbar"> & {
|
|
7
|
+
hideOverlay: () => void;
|
|
8
|
+
};
|
|
7
9
|
declare function addFocusedToolbar(params: AddFocusedToolbarParams): void;
|
|
8
10
|
declare function handleBuilderInteraction(params: HandleBuilderInteractionParams): Promise<void>;
|
|
9
11
|
|
|
@@ -10,7 +10,7 @@ import {
|
|
|
10
10
|
getDOMEditStack
|
|
11
11
|
} from "../utils/getCsDataOfElement.js";
|
|
12
12
|
import { appendFocusedToolbar } from "../generators/generateToolbar.js";
|
|
13
|
-
import { addFocusOverlay } from "../generators/generateOverlay.js";
|
|
13
|
+
import { addFocusOverlay, hideOverlay } from "../generators/generateOverlay.js";
|
|
14
14
|
import visualBuilderPostMessage from "../utils/visualBuilderPostMessage.js";
|
|
15
15
|
import { VisualBuilderPostMessageEvents } from "../utils/types/postMessage.types.js";
|
|
16
16
|
import { VisualBuilder } from "../index.js";
|
|
@@ -29,7 +29,7 @@ function addOverlay(params) {
|
|
|
29
29
|
function addFocusedToolbar(params) {
|
|
30
30
|
const { editableElement } = params.eventDetails;
|
|
31
31
|
if (!editableElement || !params.focusedToolbar) return;
|
|
32
|
-
appendFocusedToolbar(params.eventDetails, params.focusedToolbar);
|
|
32
|
+
appendFocusedToolbar(params.eventDetails, params.focusedToolbar, params.hideOverlay);
|
|
33
33
|
}
|
|
34
34
|
async function handleBuilderInteraction(params) {
|
|
35
35
|
var _a, _b;
|
|
@@ -76,7 +76,15 @@ async function handleBuilderInteraction(params) {
|
|
|
76
76
|
});
|
|
77
77
|
addFocusedToolbar({
|
|
78
78
|
eventDetails,
|
|
79
|
-
focusedToolbar: params.focusedToolbar
|
|
79
|
+
focusedToolbar: params.focusedToolbar,
|
|
80
|
+
hideOverlay: () => {
|
|
81
|
+
hideOverlay({
|
|
82
|
+
visualBuilderContainer: params.visualBuilderContainer,
|
|
83
|
+
visualBuilderOverlayWrapper: params.overlayWrapper,
|
|
84
|
+
focusedToolbar: params.focusedToolbar,
|
|
85
|
+
resizeObserver: params.resizeObserver
|
|
86
|
+
});
|
|
87
|
+
}
|
|
80
88
|
});
|
|
81
89
|
const { content_type_uid, fieldPath, cslpValue } = fieldMetadata;
|
|
82
90
|
toggleHighlightedCommentIconDisplay(cslpValue, false);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/visualBuilder/listeners/mouseClick.ts"],"sourcesContent":["import {\n cleanIndividualFieldResidual,\n handleIndividualFields,\n} from \"../utils/handleIndividualFields\";\n\nimport {\n getCsDataOfElement,\n getDOMEditStack,\n} from \"../utils/getCsDataOfElement\";\n\nimport { appendFocusedToolbar } from \"../generators/generateToolbar\";\n\nimport { addFocusOverlay, hideOverlay } from \"../generators/generateOverlay\";\n\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\n\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\nimport { VisualBuilder } from \"..\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\nimport EventListenerHandlerParams from \"./types\";\nimport { toggleHighlightedCommentIconDisplay } from \"../generators/generateHighlightedComment\";\n\ntype HandleBuilderInteractionParams = Omit<\n EventListenerHandlerParams,\n \"eventDetails\" | \"customCursor\"\n>;\n\ntype AddFocusOverlayParams = Pick<\n EventListenerHandlerParams,\n \"overlayWrapper\" | \"resizeObserver\"\n> & { editableElement: Element; isFieldDisabled?: boolean };\n\ntype AddFocusedToolbarParams = Pick<\n EventListenerHandlerParams,\n \"eventDetails\" | \"focusedToolbar\"\n
|
|
1
|
+
{"version":3,"sources":["../../../../src/visualBuilder/listeners/mouseClick.ts"],"sourcesContent":["import {\n cleanIndividualFieldResidual,\n handleIndividualFields,\n} from \"../utils/handleIndividualFields\";\n\nimport {\n getCsDataOfElement,\n getDOMEditStack,\n} from \"../utils/getCsDataOfElement\";\n\nimport { appendFocusedToolbar } from \"../generators/generateToolbar\";\n\nimport { addFocusOverlay, hideOverlay } from \"../generators/generateOverlay\";\n\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\n\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\nimport { VisualBuilder } from \"..\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\nimport EventListenerHandlerParams from \"./types\";\nimport { toggleHighlightedCommentIconDisplay } from \"../generators/generateHighlightedComment\";\n\ntype HandleBuilderInteractionParams = Omit<\n EventListenerHandlerParams,\n \"eventDetails\" | \"customCursor\"\n>;\n\ntype AddFocusOverlayParams = Pick<\n EventListenerHandlerParams,\n \"overlayWrapper\" | \"resizeObserver\"\n> & { editableElement: Element; isFieldDisabled?: boolean };\n\ntype AddFocusedToolbarParams = Pick<\n EventListenerHandlerParams,\n \"eventDetails\" | \"focusedToolbar\"\n> & { hideOverlay: () => void };\n\nfunction addOverlay(params: AddFocusOverlayParams) {\n if (!params.overlayWrapper || !params.editableElement) return;\n\n addFocusOverlay(\n params.editableElement,\n params.overlayWrapper,\n params.isFieldDisabled\n );\n params.resizeObserver.observe(params.editableElement);\n}\n\nexport function addFocusedToolbar(params: AddFocusedToolbarParams): void {\n const { editableElement } = params.eventDetails;\n\n if (!editableElement || !params.focusedToolbar) return;\n\n appendFocusedToolbar(params.eventDetails, params.focusedToolbar, params.hideOverlay);\n}\n\nasync function handleBuilderInteraction(\n params: HandleBuilderInteractionParams\n): Promise<void> {\n const eventTarget = params.event.target as HTMLElement | null;\n const isAnchorElement = eventTarget instanceof HTMLAnchorElement;\n const elementHasCslp =\n eventTarget &&\n (eventTarget.hasAttribute(\"data-cslp\") ||\n eventTarget.closest(\"[data-cslp]\"));\n\n // prevent default behavior for anchor elements and elements with cslp attribute\n if (\n isAnchorElement ||\n (elementHasCslp && !eventTarget.closest(\".visual-builder__empty-block\"))\n ) {\n params.event.preventDefault();\n params.event.stopPropagation();\n }\n\n const eventDetails = getCsDataOfElement(params.event);\n visualBuilderPostMessage\n ?.send(VisualBuilderPostMessageEvents.MOUSE_CLICK, {\n cslpData: eventDetails?.cslpData,\n fieldMetadata: eventDetails?.fieldMetadata,\n })\n .catch((err) => {\n console.warn(\"Error while sending post message\", err);\n });\n if (\n !eventDetails ||\n !params.overlayWrapper ||\n !params.visualBuilderContainer\n ) {\n return;\n }\n const { editableElement, fieldMetadata } = eventDetails;\n\n if (\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM &&\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM !== editableElement\n ) {\n cleanIndividualFieldResidual({\n overlayWrapper: params.overlayWrapper,\n visualBuilderContainer: params.visualBuilderContainer,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n });\n }\n\n // if the selected element is our empty block element, return\n if (\n editableElement.classList.contains(\n \"visual-builder__empty-block-parent\"\n ) ||\n editableElement.classList.contains(\"visual-builder__empty-block\")\n ) {\n return;\n }\n\n // when previous and current selected element is same, return.\n // this also avoids inserting psuedo-editable field (field data is\n // not equal to text content in DOM) when performing mouse\n // selections in the content editable\n const previousSelectedElement =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n if (\n previousSelectedElement &&\n previousSelectedElement === editableElement\n ) {\n return;\n }\n\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n editableElement;\n\n addOverlay({\n overlayWrapper: params.overlayWrapper,\n resizeObserver: params.resizeObserver,\n editableElement: editableElement,\n });\n\n addFocusedToolbar({\n eventDetails: eventDetails,\n focusedToolbar: params.focusedToolbar,\n hideOverlay: () => {\n hideOverlay({\n visualBuilderContainer: params.visualBuilderContainer,\n visualBuilderOverlayWrapper: params.overlayWrapper,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n });\n }\n });\n\n const { content_type_uid, fieldPath, cslpValue } = fieldMetadata;\n\n toggleHighlightedCommentIconDisplay(cslpValue, false);\n\n const fieldSchema = await FieldSchemaMap.getFieldSchema(\n content_type_uid,\n fieldPath\n );\n\n if (fieldSchema) {\n // after field schema is available re-add disabled overlay\n const { isDisabled } = isFieldDisabled(fieldSchema, eventDetails);\n if (isDisabled) {\n addOverlay({\n overlayWrapper: params.overlayWrapper,\n resizeObserver: params.resizeObserver,\n editableElement: editableElement,\n isFieldDisabled: true,\n });\n }\n }\n\n // This is most probably redundant code, as the handleIndividualFields function\n // takes care of this\n // TODO: Remove this\n // if (\n // fieldSchema.data_type === \"block\" ||\n // fieldSchema.multiple ||\n // (fieldSchema.data_type === \"reference\" &&\n // // @ts-ignore\n // fieldSchema.field_metadata.ref_multiple)\n // ) {\n // handleAddButtonsForMultiple(eventDetails, {\n // editableElement: editableElement,\n // visualBuilderContainer: params.visualBuilderContainer,\n // resizeObserver: params.resizeObserver,\n // });\n // } else {\n // removeAddInstanceButtons({\n // eventTarget: params.event.target,\n // visualBuilderContainer: params.visualBuilderContainer,\n // overlayWrapper: params.overlayWrapper,\n // });\n // }\n visualBuilderPostMessage?.send(VisualBuilderPostMessageEvents.FOCUS_FIELD, {\n DOMEditStack: getDOMEditStack(editableElement),\n });\n\n await handleIndividualFields(eventDetails, {\n visualBuilderContainer: params.visualBuilderContainer,\n resizeObserver: params.resizeObserver,\n lastEditedField: previousSelectedElement,\n });\n}\n\nexport default handleBuilderInteraction;\n"],"mappings":"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","names":[]}
|
|
@@ -31,7 +31,8 @@ __export(constants_exports, {
|
|
|
31
31
|
TOP_EDGE_BUFFER: () => TOP_EDGE_BUFFER,
|
|
32
32
|
VISUAL_BUILDER_CHANNEL_ID: () => VISUAL_BUILDER_CHANNEL_ID,
|
|
33
33
|
VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY: () => VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
|
|
34
|
-
numericInputRegex: () => numericInputRegex
|
|
34
|
+
numericInputRegex: () => numericInputRegex,
|
|
35
|
+
unicodeNonBreakingSpace: () => unicodeNonBreakingSpace
|
|
35
36
|
});
|
|
36
37
|
module.exports = __toCommonJS(constants_exports);
|
|
37
38
|
var import_types = require("./types/index.types.cjs");
|
|
@@ -66,6 +67,7 @@ var DEFAULT_MULTIPLE_FIELDS = [
|
|
|
66
67
|
import_types.FieldDataType.GROUP,
|
|
67
68
|
import_types.FieldDataType.BLOCK
|
|
68
69
|
];
|
|
70
|
+
var unicodeNonBreakingSpace = "\xA0";
|
|
69
71
|
// Annotate the CommonJS export names for ESM import in node:
|
|
70
72
|
0 && (module.exports = {
|
|
71
73
|
ALLOWED_INLINE_EDITABLE_FIELD,
|
|
@@ -79,6 +81,7 @@ var DEFAULT_MULTIPLE_FIELDS = [
|
|
|
79
81
|
TOP_EDGE_BUFFER,
|
|
80
82
|
VISUAL_BUILDER_CHANNEL_ID,
|
|
81
83
|
VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
|
|
82
|
-
numericInputRegex
|
|
84
|
+
numericInputRegex,
|
|
85
|
+
unicodeNonBreakingSpace
|
|
83
86
|
});
|
|
84
87
|
//# sourceMappingURL=constants.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/visualBuilder/utils/constants.ts"],"sourcesContent":["import { FieldDataType } from \"./types/index.types\";\n\nexport const numericInputRegex = /^-?\\d*(\\.\\d*)?([eE][-+]?\\d*)?$/;\n\nexport const VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY = \"data-cslp-field-type\";\n\nexport const VISUAL_BUILDER_CHANNEL_ID = \"visual-builder\";\n\nexport const LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX = 2;\n\n// Minimum distance from top edge to prevent toolbar from being hidden\nexport const TOP_EDGE_BUFFER = 42;\nexport const RIGHT_EDGE_BUFFER = 180;\n\nexport const TOOLBAR_EDGE_BUFFER = 8;\n\nexport const DATA_CSLP_ATTR_SELECTOR = \"data-cslp\";\n\n/**\n * The field that can be directly modified using contenteditable=true.\n * This includes all text fields like title and numbers.\n */\nexport const ALLOWED_INLINE_EDITABLE_FIELD: FieldDataType[] = [\n FieldDataType.SINGLELINE,\n FieldDataType.MULTILINE,\n FieldDataType.NUMBER,\n];\n\nexport const ALLOWED_MODAL_EDITABLE_FIELD: FieldDataType[] = [\n FieldDataType.HTML_RTE,\n FieldDataType.MARKDOWN_RTE,\n FieldDataType.JSON_RTE,\n FieldDataType.CUSTOM_FIELD,\n FieldDataType.LINK,\n FieldDataType.ISODATE,\n FieldDataType.URL,\n];\n\nexport const ALLOWED_REPLACE_FIELDS: FieldDataType[] = [\n FieldDataType.REFERENCE,\n FieldDataType.FILE,\n];\n\nexport const DEFAULT_MULTIPLE_FIELDS: FieldDataType[] = [\n FieldDataType.GLOBAL_FIELD,\n FieldDataType.GROUP,\n FieldDataType.BLOCK,\n];\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA8B;AAEvB,IAAM,oBAAoB;AAE1B,IAAM,0CAA0C;AAEhD,IAAM,4BAA4B;AAElC,IAAM,mCAAmC;AAGzC,IAAM,kBAAkB;AACxB,IAAM,oBAAoB;AAE1B,IAAM,sBAAsB;AAE5B,IAAM,0BAA0B;AAMhC,IAAM,gCAAiD;AAAA,EAC1D,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAClB;AAEO,IAAM,+BAAgD;AAAA,EACzD,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAClB;AAEO,IAAM,yBAA0C;AAAA,EACnD,2BAAc;AAAA,EACd,2BAAc;AAClB;AAEO,IAAM,0BAA2C;AAAA,EACpD,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAClB;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../../src/visualBuilder/utils/constants.ts"],"sourcesContent":["import { FieldDataType } from \"./types/index.types\";\n\nexport const numericInputRegex = /^-?\\d*(\\.\\d*)?([eE][-+]?\\d*)?$/;\n\nexport const VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY = \"data-cslp-field-type\";\n\nexport const VISUAL_BUILDER_CHANNEL_ID = \"visual-builder\";\n\nexport const LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX = 2;\n\n// Minimum distance from top edge to prevent toolbar from being hidden\nexport const TOP_EDGE_BUFFER = 42;\nexport const RIGHT_EDGE_BUFFER = 180;\n\nexport const TOOLBAR_EDGE_BUFFER = 8;\n\nexport const DATA_CSLP_ATTR_SELECTOR = \"data-cslp\";\n\n/**\n * The field that can be directly modified using contenteditable=true.\n * This includes all text fields like title and numbers.\n */\nexport const ALLOWED_INLINE_EDITABLE_FIELD: FieldDataType[] = [\n FieldDataType.SINGLELINE,\n FieldDataType.MULTILINE,\n FieldDataType.NUMBER,\n];\n\nexport const ALLOWED_MODAL_EDITABLE_FIELD: FieldDataType[] = [\n FieldDataType.HTML_RTE,\n FieldDataType.MARKDOWN_RTE,\n FieldDataType.JSON_RTE,\n FieldDataType.CUSTOM_FIELD,\n FieldDataType.LINK,\n FieldDataType.ISODATE,\n FieldDataType.URL,\n];\n\nexport const ALLOWED_REPLACE_FIELDS: FieldDataType[] = [\n FieldDataType.REFERENCE,\n FieldDataType.FILE,\n];\n\nexport const DEFAULT_MULTIPLE_FIELDS: FieldDataType[] = [\n FieldDataType.GLOBAL_FIELD,\n FieldDataType.GROUP,\n FieldDataType.BLOCK,\n];\n\nexport const unicodeNonBreakingSpace = \"\\u00A0\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA8B;AAEvB,IAAM,oBAAoB;AAE1B,IAAM,0CAA0C;AAEhD,IAAM,4BAA4B;AAElC,IAAM,mCAAmC;AAGzC,IAAM,kBAAkB;AACxB,IAAM,oBAAoB;AAE1B,IAAM,sBAAsB;AAE5B,IAAM,0BAA0B;AAMhC,IAAM,gCAAiD;AAAA,EAC1D,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAClB;AAEO,IAAM,+BAAgD;AAAA,EACzD,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAClB;AAEO,IAAM,yBAA0C;AAAA,EACnD,2BAAc;AAAA,EACd,2BAAc;AAClB;AAEO,IAAM,0BAA2C;AAAA,EACpD,2BAAc;AAAA,EACd,2BAAc;AAAA,EACd,2BAAc;AAClB;AAEO,IAAM,0BAA0B;","names":[]}
|
|
@@ -17,5 +17,6 @@ declare const ALLOWED_INLINE_EDITABLE_FIELD: FieldDataType[];
|
|
|
17
17
|
declare const ALLOWED_MODAL_EDITABLE_FIELD: FieldDataType[];
|
|
18
18
|
declare const ALLOWED_REPLACE_FIELDS: FieldDataType[];
|
|
19
19
|
declare const DEFAULT_MULTIPLE_FIELDS: FieldDataType[];
|
|
20
|
+
declare const unicodeNonBreakingSpace = "\u00A0";
|
|
20
21
|
|
|
21
|
-
export { ALLOWED_INLINE_EDITABLE_FIELD, ALLOWED_MODAL_EDITABLE_FIELD, ALLOWED_REPLACE_FIELDS, DATA_CSLP_ATTR_SELECTOR, DEFAULT_MULTIPLE_FIELDS, LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX, RIGHT_EDGE_BUFFER, TOOLBAR_EDGE_BUFFER, TOP_EDGE_BUFFER, VISUAL_BUILDER_CHANNEL_ID, VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY, numericInputRegex };
|
|
22
|
+
export { ALLOWED_INLINE_EDITABLE_FIELD, ALLOWED_MODAL_EDITABLE_FIELD, ALLOWED_REPLACE_FIELDS, DATA_CSLP_ATTR_SELECTOR, DEFAULT_MULTIPLE_FIELDS, LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX, RIGHT_EDGE_BUFFER, TOOLBAR_EDGE_BUFFER, TOP_EDGE_BUFFER, VISUAL_BUILDER_CHANNEL_ID, VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY, numericInputRegex, unicodeNonBreakingSpace };
|
|
@@ -17,5 +17,6 @@ declare const ALLOWED_INLINE_EDITABLE_FIELD: FieldDataType[];
|
|
|
17
17
|
declare const ALLOWED_MODAL_EDITABLE_FIELD: FieldDataType[];
|
|
18
18
|
declare const ALLOWED_REPLACE_FIELDS: FieldDataType[];
|
|
19
19
|
declare const DEFAULT_MULTIPLE_FIELDS: FieldDataType[];
|
|
20
|
+
declare const unicodeNonBreakingSpace = "\u00A0";
|
|
20
21
|
|
|
21
|
-
export { ALLOWED_INLINE_EDITABLE_FIELD, ALLOWED_MODAL_EDITABLE_FIELD, ALLOWED_REPLACE_FIELDS, DATA_CSLP_ATTR_SELECTOR, DEFAULT_MULTIPLE_FIELDS, LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX, RIGHT_EDGE_BUFFER, TOOLBAR_EDGE_BUFFER, TOP_EDGE_BUFFER, VISUAL_BUILDER_CHANNEL_ID, VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY, numericInputRegex };
|
|
22
|
+
export { ALLOWED_INLINE_EDITABLE_FIELD, ALLOWED_MODAL_EDITABLE_FIELD, ALLOWED_REPLACE_FIELDS, DATA_CSLP_ATTR_SELECTOR, DEFAULT_MULTIPLE_FIELDS, LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX, RIGHT_EDGE_BUFFER, TOOLBAR_EDGE_BUFFER, TOP_EDGE_BUFFER, VISUAL_BUILDER_CHANNEL_ID, VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY, numericInputRegex, unicodeNonBreakingSpace };
|