@contentstack/live-preview-utils 3.2.1 → 3.2.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/README.md +2 -2
- package/dist/legacy/index.cjs +1 -1
- package/dist/legacy/index.js +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/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs +4 -1
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs.map +1 -1
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.js +4 -1
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.js.map +1 -1
- package/dist/legacy/visualBuilder/components/FieldToolbar.cjs +24 -13
- package/dist/legacy/visualBuilder/components/FieldToolbar.cjs.map +1 -1
- package/dist/legacy/visualBuilder/components/FieldToolbar.d.cts +2 -0
- package/dist/legacy/visualBuilder/components/FieldToolbar.d.ts +2 -0
- package/dist/legacy/visualBuilder/components/FieldToolbar.js +24 -13
- package/dist/legacy/visualBuilder/components/FieldToolbar.js.map +1 -1
- package/dist/legacy/visualBuilder/components/fieldLabelWrapper.cjs +8 -1
- package/dist/legacy/visualBuilder/components/fieldLabelWrapper.cjs.map +1 -1
- package/dist/legacy/visualBuilder/components/fieldLabelWrapper.js +8 -1
- package/dist/legacy/visualBuilder/components/fieldLabelWrapper.js.map +1 -1
- package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.cjs +12 -0
- package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.cjs.map +1 -1
- package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.d.cts +6 -1
- package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.d.ts +6 -1
- package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.js +7 -0
- package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.js.map +1 -1
- package/dist/legacy/visualBuilder/generators/generateOverlay.cjs +4 -2
- package/dist/legacy/visualBuilder/generators/generateOverlay.cjs.map +1 -1
- package/dist/legacy/visualBuilder/generators/generateOverlay.js +4 -2
- package/dist/legacy/visualBuilder/generators/generateOverlay.js.map +1 -1
- package/dist/legacy/visualBuilder/generators/generateToolbar.cjs +9 -2
- package/dist/legacy/visualBuilder/generators/generateToolbar.cjs.map +1 -1
- package/dist/legacy/visualBuilder/generators/generateToolbar.d.cts +1 -1
- package/dist/legacy/visualBuilder/generators/generateToolbar.d.ts +1 -1
- package/dist/legacy/visualBuilder/generators/generateToolbar.js +9 -2
- package/dist/legacy/visualBuilder/generators/generateToolbar.js.map +1 -1
- package/dist/legacy/visualBuilder/index.cjs +3 -3
- package/dist/legacy/visualBuilder/index.cjs.map +1 -1
- package/dist/legacy/visualBuilder/index.d.cts +1 -0
- package/dist/legacy/visualBuilder/index.d.ts +1 -0
- package/dist/legacy/visualBuilder/index.js +3 -3
- package/dist/legacy/visualBuilder/index.js.map +1 -1
- package/dist/legacy/visualBuilder/listeners/mouseClick.cjs +21 -2
- package/dist/legacy/visualBuilder/listeners/mouseClick.cjs.map +1 -1
- package/dist/legacy/visualBuilder/listeners/mouseClick.js +21 -2
- package/dist/legacy/visualBuilder/listeners/mouseClick.js.map +1 -1
- package/dist/legacy/visualBuilder/listeners/mouseHover.cjs +46 -12
- package/dist/legacy/visualBuilder/listeners/mouseHover.cjs.map +1 -1
- package/dist/legacy/visualBuilder/listeners/mouseHover.js +46 -12
- package/dist/legacy/visualBuilder/listeners/mouseHover.js.map +1 -1
- package/dist/legacy/visualBuilder/utils/createCachedFetch.cjs +58 -0
- package/dist/legacy/visualBuilder/utils/createCachedFetch.cjs.map +1 -0
- package/dist/legacy/visualBuilder/utils/createCachedFetch.d.cts +12 -0
- package/dist/legacy/visualBuilder/utils/createCachedFetch.d.ts +12 -0
- package/dist/legacy/visualBuilder/utils/createCachedFetch.js +35 -0
- package/dist/legacy/visualBuilder/utils/createCachedFetch.js.map +1 -0
- package/dist/legacy/visualBuilder/utils/fieldSchemaMap.cjs +1 -0
- package/dist/legacy/visualBuilder/utils/fieldSchemaMap.cjs.map +1 -1
- package/dist/legacy/visualBuilder/utils/fieldSchemaMap.js +1 -0
- package/dist/legacy/visualBuilder/utils/fieldSchemaMap.js.map +1 -1
- package/dist/legacy/visualBuilder/utils/getEntryPermissions.cjs +71 -0
- package/dist/legacy/visualBuilder/utils/getEntryPermissions.cjs.map +1 -0
- package/dist/legacy/visualBuilder/utils/getEntryPermissions.d.cts +14 -0
- package/dist/legacy/visualBuilder/utils/getEntryPermissions.d.ts +14 -0
- package/dist/legacy/visualBuilder/utils/getEntryPermissions.js +38 -0
- package/dist/legacy/visualBuilder/utils/getEntryPermissions.js.map +1 -0
- package/dist/legacy/visualBuilder/utils/getEntryPermissionsCached.cjs +36 -0
- package/dist/legacy/visualBuilder/utils/getEntryPermissionsCached.cjs.map +1 -0
- package/dist/legacy/visualBuilder/utils/getEntryPermissionsCached.d.cts +12 -0
- package/dist/legacy/visualBuilder/utils/getEntryPermissionsCached.d.ts +12 -0
- package/dist/legacy/visualBuilder/utils/getEntryPermissionsCached.js +13 -0
- package/dist/legacy/visualBuilder/utils/getEntryPermissionsCached.js.map +1 -0
- package/dist/legacy/visualBuilder/utils/handleFieldMouseDown.cjs +4 -0
- package/dist/legacy/visualBuilder/utils/handleFieldMouseDown.cjs.map +1 -1
- package/dist/legacy/visualBuilder/utils/handleFieldMouseDown.js +4 -0
- package/dist/legacy/visualBuilder/utils/handleFieldMouseDown.js.map +1 -1
- package/dist/legacy/visualBuilder/utils/handleIndividualFields.cjs +11 -1
- package/dist/legacy/visualBuilder/utils/handleIndividualFields.cjs.map +1 -1
- package/dist/legacy/visualBuilder/utils/handleIndividualFields.js +11 -1
- package/dist/legacy/visualBuilder/utils/handleIndividualFields.js.map +1 -1
- package/dist/legacy/visualBuilder/utils/isFieldDisabled.cjs +7 -1
- package/dist/legacy/visualBuilder/utils/isFieldDisabled.cjs.map +1 -1
- package/dist/legacy/visualBuilder/utils/isFieldDisabled.d.cts +4 -2
- package/dist/legacy/visualBuilder/utils/isFieldDisabled.d.ts +4 -2
- package/dist/legacy/visualBuilder/utils/isFieldDisabled.js +7 -1
- package/dist/legacy/visualBuilder/utils/isFieldDisabled.js.map +1 -1
- package/dist/legacy/visualBuilder/utils/updateFocussedState.cjs +21 -3
- package/dist/legacy/visualBuilder/utils/updateFocussedState.cjs.map +1 -1
- package/dist/legacy/visualBuilder/utils/updateFocussedState.d.cts +1 -1
- package/dist/legacy/visualBuilder/utils/updateFocussedState.d.ts +1 -1
- package/dist/legacy/visualBuilder/utils/updateFocussedState.js +21 -3
- package/dist/legacy/visualBuilder/utils/updateFocussedState.js.map +1 -1
- package/dist/legacy/visualBuilder/visualBuilder.style.cjs +10 -1
- package/dist/legacy/visualBuilder/visualBuilder.style.cjs.map +1 -1
- package/dist/legacy/visualBuilder/visualBuilder.style.js +10 -1
- package/dist/legacy/visualBuilder/visualBuilder.style.js.map +1 -1
- package/dist/modern/index.cjs +1 -1
- package/dist/modern/index.js +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/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs +4 -1
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs.map +1 -1
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.js +4 -1
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.js.map +1 -1
- package/dist/modern/visualBuilder/components/FieldToolbar.cjs +24 -13
- package/dist/modern/visualBuilder/components/FieldToolbar.cjs.map +1 -1
- package/dist/modern/visualBuilder/components/FieldToolbar.d.cts +2 -0
- package/dist/modern/visualBuilder/components/FieldToolbar.d.ts +2 -0
- package/dist/modern/visualBuilder/components/FieldToolbar.js +24 -13
- package/dist/modern/visualBuilder/components/FieldToolbar.js.map +1 -1
- package/dist/modern/visualBuilder/components/fieldLabelWrapper.cjs +8 -1
- package/dist/modern/visualBuilder/components/fieldLabelWrapper.cjs.map +1 -1
- package/dist/modern/visualBuilder/components/fieldLabelWrapper.js +8 -1
- package/dist/modern/visualBuilder/components/fieldLabelWrapper.js.map +1 -1
- package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.cjs +12 -0
- package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.cjs.map +1 -1
- package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.d.cts +6 -1
- package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.d.ts +6 -1
- package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.js +7 -0
- package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.js.map +1 -1
- package/dist/modern/visualBuilder/generators/generateOverlay.cjs +4 -2
- package/dist/modern/visualBuilder/generators/generateOverlay.cjs.map +1 -1
- package/dist/modern/visualBuilder/generators/generateOverlay.js +4 -2
- package/dist/modern/visualBuilder/generators/generateOverlay.js.map +1 -1
- package/dist/modern/visualBuilder/generators/generateToolbar.cjs +9 -2
- package/dist/modern/visualBuilder/generators/generateToolbar.cjs.map +1 -1
- package/dist/modern/visualBuilder/generators/generateToolbar.d.cts +1 -1
- package/dist/modern/visualBuilder/generators/generateToolbar.d.ts +1 -1
- package/dist/modern/visualBuilder/generators/generateToolbar.js +9 -2
- package/dist/modern/visualBuilder/generators/generateToolbar.js.map +1 -1
- package/dist/modern/visualBuilder/index.cjs +3 -3
- package/dist/modern/visualBuilder/index.cjs.map +1 -1
- package/dist/modern/visualBuilder/index.d.cts +1 -0
- package/dist/modern/visualBuilder/index.d.ts +1 -0
- package/dist/modern/visualBuilder/index.js +3 -3
- package/dist/modern/visualBuilder/index.js.map +1 -1
- package/dist/modern/visualBuilder/listeners/mouseClick.cjs +21 -2
- package/dist/modern/visualBuilder/listeners/mouseClick.cjs.map +1 -1
- package/dist/modern/visualBuilder/listeners/mouseClick.js +21 -2
- package/dist/modern/visualBuilder/listeners/mouseClick.js.map +1 -1
- package/dist/modern/visualBuilder/listeners/mouseHover.cjs +46 -12
- package/dist/modern/visualBuilder/listeners/mouseHover.cjs.map +1 -1
- package/dist/modern/visualBuilder/listeners/mouseHover.js +46 -12
- package/dist/modern/visualBuilder/listeners/mouseHover.js.map +1 -1
- package/dist/modern/visualBuilder/utils/createCachedFetch.cjs +58 -0
- package/dist/modern/visualBuilder/utils/createCachedFetch.cjs.map +1 -0
- package/dist/modern/visualBuilder/utils/createCachedFetch.d.cts +12 -0
- package/dist/modern/visualBuilder/utils/createCachedFetch.d.ts +12 -0
- package/dist/modern/visualBuilder/utils/createCachedFetch.js +35 -0
- package/dist/modern/visualBuilder/utils/createCachedFetch.js.map +1 -0
- package/dist/modern/visualBuilder/utils/fieldSchemaMap.cjs +1 -0
- package/dist/modern/visualBuilder/utils/fieldSchemaMap.cjs.map +1 -1
- package/dist/modern/visualBuilder/utils/fieldSchemaMap.js +1 -0
- package/dist/modern/visualBuilder/utils/fieldSchemaMap.js.map +1 -1
- package/dist/modern/visualBuilder/utils/getEntryPermissions.cjs +70 -0
- package/dist/modern/visualBuilder/utils/getEntryPermissions.cjs.map +1 -0
- package/dist/modern/visualBuilder/utils/getEntryPermissions.d.cts +14 -0
- package/dist/modern/visualBuilder/utils/getEntryPermissions.d.ts +14 -0
- package/dist/modern/visualBuilder/utils/getEntryPermissions.js +37 -0
- package/dist/modern/visualBuilder/utils/getEntryPermissions.js.map +1 -0
- package/dist/modern/visualBuilder/utils/getEntryPermissionsCached.cjs +36 -0
- package/dist/modern/visualBuilder/utils/getEntryPermissionsCached.cjs.map +1 -0
- package/dist/modern/visualBuilder/utils/getEntryPermissionsCached.d.cts +12 -0
- package/dist/modern/visualBuilder/utils/getEntryPermissionsCached.d.ts +12 -0
- package/dist/modern/visualBuilder/utils/getEntryPermissionsCached.js +13 -0
- package/dist/modern/visualBuilder/utils/getEntryPermissionsCached.js.map +1 -0
- package/dist/modern/visualBuilder/utils/handleFieldMouseDown.cjs +4 -0
- package/dist/modern/visualBuilder/utils/handleFieldMouseDown.cjs.map +1 -1
- package/dist/modern/visualBuilder/utils/handleFieldMouseDown.js +4 -0
- package/dist/modern/visualBuilder/utils/handleFieldMouseDown.js.map +1 -1
- package/dist/modern/visualBuilder/utils/handleIndividualFields.cjs +11 -1
- package/dist/modern/visualBuilder/utils/handleIndividualFields.cjs.map +1 -1
- package/dist/modern/visualBuilder/utils/handleIndividualFields.js +11 -1
- package/dist/modern/visualBuilder/utils/handleIndividualFields.js.map +1 -1
- package/dist/modern/visualBuilder/utils/isFieldDisabled.cjs +7 -1
- package/dist/modern/visualBuilder/utils/isFieldDisabled.cjs.map +1 -1
- package/dist/modern/visualBuilder/utils/isFieldDisabled.d.cts +4 -2
- package/dist/modern/visualBuilder/utils/isFieldDisabled.d.ts +4 -2
- package/dist/modern/visualBuilder/utils/isFieldDisabled.js +7 -1
- package/dist/modern/visualBuilder/utils/isFieldDisabled.js.map +1 -1
- package/dist/modern/visualBuilder/utils/updateFocussedState.cjs +21 -3
- package/dist/modern/visualBuilder/utils/updateFocussedState.cjs.map +1 -1
- package/dist/modern/visualBuilder/utils/updateFocussedState.d.cts +1 -1
- package/dist/modern/visualBuilder/utils/updateFocussedState.d.ts +1 -1
- package/dist/modern/visualBuilder/utils/updateFocussedState.js +21 -3
- package/dist/modern/visualBuilder/utils/updateFocussedState.js.map +1 -1
- package/dist/modern/visualBuilder/visualBuilder.style.cjs +10 -1
- package/dist/modern/visualBuilder/visualBuilder.style.cjs.map +1 -1
- package/dist/modern/visualBuilder/visualBuilder.style.js +10 -1
- package/dist/modern/visualBuilder/visualBuilder.style.js.map +1 -1
- package/package.json +1 -1
|
@@ -114,18 +114,20 @@ function hideFocusOverlay(elements) {
|
|
|
114
114
|
childNode.removeAttribute("style");
|
|
115
115
|
}
|
|
116
116
|
});
|
|
117
|
-
if (!noTrigger
|
|
117
|
+
if (!noTrigger && // send update when focussed field has received input
|
|
118
|
+
import__.VisualBuilder.VisualBuilderGlobalState.value.focusFieldReceivedInput) {
|
|
118
119
|
sendFieldEvent({
|
|
119
120
|
visualBuilderContainer,
|
|
120
121
|
eventType: import_postMessage.VisualBuilderPostMessageEvents.UPDATE_FIELD
|
|
121
122
|
});
|
|
122
|
-
} else {
|
|
123
|
+
} else if (noTrigger) {
|
|
123
124
|
const { previousSelectedEditableDOM, focusFieldValue } = import__.VisualBuilder.VisualBuilderGlobalState.value || {};
|
|
124
125
|
if (previousSelectedEditableDOM && "innerText" in previousSelectedEditableDOM && focusFieldValue != null) {
|
|
125
126
|
previousSelectedEditableDOM.innerText = focusFieldValue;
|
|
126
127
|
}
|
|
127
128
|
}
|
|
128
129
|
import__.VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = null;
|
|
130
|
+
import__.VisualBuilder.VisualBuilderGlobalState.value.focusFieldReceivedInput = false;
|
|
129
131
|
(0, import_handleIndividualFields.cleanIndividualFieldResidual)({
|
|
130
132
|
overlayWrapper: visualBuilderOverlayWrapper,
|
|
131
133
|
visualBuilderContainer,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/visualBuilder/generators/generateOverlay.tsx"],"sourcesContent":["import { extractDetailsFromCslp } from \"../../cslp/cslpdata\";\nimport { cleanIndividualFieldResidual } from \"../utils/handleIndividualFields\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\nimport { VisualBuilder } from \"..\";\nimport EventListenerHandlerParams from \"../listeners/types\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { FieldDataType } from \"../utils/types/index.types\";\nimport { getFieldType } from \"../utils/getFieldType\";\nimport { CslpData } from \"../../cslp/types/cslp.types\";\nimport { getMultilinePlaintext } from \"../utils/getMultilinePlaintext\";\nimport { showAllHiddenHighlightedCommentIcons } from \"./generateHighlightedComment\";\n\n/**\n * Adds a focus overlay to the target element.\n * @param targetElement - The element to add the focus overlay to.\n * @param focusOverlayWrapper - The HTMLDivElement that contains the focus overlay.\n * @returns void\n */\nexport function addFocusOverlay(\n targetElement: Element,\n focusOverlayWrapper: HTMLDivElement,\n disabled?: boolean\n): void {\n const targetElementDimension = targetElement.getBoundingClientRect();\n if (\n targetElementDimension.width === 0 ||\n targetElementDimension.height === 0\n )\n return;\n focusOverlayWrapper.classList.add(\"visible\");\n\n const distanceFromTop = targetElementDimension.top + window.scrollY;\n const topOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--top\"\n );\n\n if (topOverlayDOM) {\n topOverlayDOM.style.top = \"0\";\n topOverlayDOM.style.left = \"0\";\n topOverlayDOM.style.width = \"100%\";\n topOverlayDOM.style.height = `calc(${distanceFromTop}px)`;\n }\n\n const bottomOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--bottom\"\n );\n if (bottomOverlayDOM) {\n bottomOverlayDOM.style.top = `${\n targetElementDimension.bottom + window.scrollY\n }px`;\n bottomOverlayDOM.style.height = `${\n window.document.body.scrollHeight -\n targetElementDimension.bottom -\n window.scrollY\n }px`;\n bottomOverlayDOM.style.left = \"0\";\n bottomOverlayDOM.style.width = \"100%\";\n }\n\n const leftOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--left\"\n );\n if (leftOverlayDOM) {\n leftOverlayDOM.style.left = \"0\";\n leftOverlayDOM.style.top = `${distanceFromTop}px`;\n leftOverlayDOM.style.height = `${targetElementDimension.height}px`;\n leftOverlayDOM.style.width = `${targetElementDimension.left}px`;\n }\n\n const rightOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--right\"\n );\n if (rightOverlayDOM) {\n rightOverlayDOM.style.left = `${targetElementDimension.right}px`;\n rightOverlayDOM.style.top = `${distanceFromTop}px`;\n rightOverlayDOM.style.height = `${targetElementDimension.height}px`;\n rightOverlayDOM.style.width = `${\n document.documentElement.clientWidth - targetElementDimension.right\n }px`;\n }\n\n const outlineDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--outline\"\n );\n if (outlineDOM) {\n outlineDOM.style.top = `${\n targetElementDimension.top + window.scrollY\n }px`;\n outlineDOM.style.height = `${targetElementDimension.height}px`;\n outlineDOM.style.width = `${targetElementDimension.width}px`;\n outlineDOM.style.left = `${targetElementDimension.left}px`;\n outlineDOM.style.outlineColor = disabled ? \"#909090\" : \"#715cdd\";\n }\n}\n\n/**\n * Hides the focus overlay and performs necessary cleanup actions when the user clicks outside of the focused element.\n * @param event - The mouse event that triggered the function.\n * @param elements - An object containing references to the focus overlay wrapper, the previously selected editable DOM element, and the visual builder wrapper.\n */\nexport function hideFocusOverlay(elements: HideOverlayParams): void {\n const {\n visualBuilderContainer,\n visualBuilderOverlayWrapper,\n focusedToolbar,\n resizeObserver,\n noTrigger,\n } = elements;\n\n if (visualBuilderOverlayWrapper) {\n visualBuilderOverlayWrapper.classList.remove(\"visible\");\n\n // Cleanup overlay styles: Top, Right, Bottom, Left & Outline\n visualBuilderOverlayWrapper.childNodes.forEach((childNode) => {\n if (childNode instanceof Element) {\n childNode.removeAttribute(\"style\");\n }\n });\n\n if (!noTrigger) {\n sendFieldEvent({\n visualBuilderContainer,\n eventType: VisualBuilderPostMessageEvents.UPDATE_FIELD,\n });\n } else {\n const { previousSelectedEditableDOM, focusFieldValue } =\n VisualBuilder.VisualBuilderGlobalState.value || {};\n if (\n previousSelectedEditableDOM &&\n \"innerText\" in previousSelectedEditableDOM &&\n focusFieldValue != null\n ) {\n previousSelectedEditableDOM.innerText = focusFieldValue;\n }\n }\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = null;\n cleanIndividualFieldResidual({\n overlayWrapper: visualBuilderOverlayWrapper,\n visualBuilderContainer: visualBuilderContainer,\n focusedToolbar: focusedToolbar,\n resizeObserver: resizeObserver,\n });\n }\n}\ninterface ISendFieldEventParams {\n visualBuilderContainer: HTMLElement | null;\n eventType:\n | VisualBuilderPostMessageEvents.UPDATE_FIELD\n | VisualBuilderPostMessageEvents.SYNC_FIELD;\n}\nexport function sendFieldEvent(options: ISendFieldEventParams): void {\n const { visualBuilderContainer, eventType } = options;\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n const pseudoEditableElement = visualBuilderContainer?.querySelector(\n \"div.visual-builder__pseudo-editable-element\"\n );\n if (\n previousSelectedEditableDOM &&\n (previousSelectedEditableDOM.hasAttribute(\"contenteditable\") ||\n pseudoEditableElement)\n ) {\n const actualEditedElement =\n pseudoEditableElement ||\n (previousSelectedEditableDOM as HTMLElement);\n\n let data =\n \"innerText\" in actualEditedElement\n ? actualEditedElement.innerText\n : actualEditedElement.textContent;\n\n const fieldMetadata = extractDetailsFromCslp(\n previousSelectedEditableDOM.getAttribute(\"data-cslp\") as string\n );\n\n FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n )\n .then((fieldSchema) => {\n if (\n fieldSchema &&\n eventType === VisualBuilderPostMessageEvents.UPDATE_FIELD\n ) {\n const fieldType = getFieldType(fieldSchema);\n if (fieldType && fieldType === FieldDataType.MULTILINE) {\n data = getMultilinePlaintext(actualEditedElement);\n (actualEditedElement as HTMLElement).innerText =\n data as string;\n }\n }\n })\n .finally(() => {\n visualBuilderPostMessage?.send(eventType, {\n data,\n fieldMetadata,\n });\n });\n }\n}\ninterface HideOverlayParams\n extends Pick<\n EventListenerHandlerParams,\n \"visualBuilderContainer\" | \"focusedToolbar\" | \"resizeObserver\"\n > {\n visualBuilderOverlayWrapper: HTMLDivElement | null;\n noTrigger?: boolean;\n}\n\nexport function hideOverlay(params: HideOverlayParams): void {\n const focusElementObserver =\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver;\n if (focusElementObserver) {\n focusElementObserver.disconnect();\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver =\n null;\n }\n hideFocusOverlay({\n visualBuilderContainer: params.visualBuilderContainer,\n visualBuilderOverlayWrapper: params.visualBuilderOverlayWrapper,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n noTrigger: Boolean(params.noTrigger),\n });\n showAllHiddenHighlightedCommentIcons();\n if (\n !VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM\n )\n return;\n params.resizeObserver.unobserve(\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM\n );\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n null;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAAuC;AACvC,oCAA6C;AAC7C,sCAAqC;AACrC,yBAA+C;AAE/C,eAA8B;AAE9B,4BAA+B;AAC/B,mBAA8B;AAC9B,0BAA6B;AAE7B,mCAAsC;AACtC,wCAAqD;AAQ9C,SAAS,gBACZ,eACA,qBACA,UACI;AACJ,QAAM,yBAAyB,cAAc,sBAAsB;AACnE,MACI,uBAAuB,UAAU,KACjC,uBAAuB,WAAW;AAElC;AACJ,sBAAoB,UAAU,IAAI,SAAS;AAE3C,QAAM,kBAAkB,uBAAuB,MAAM,OAAO;AAC5D,QAAM,gBAAgB,oBAAoB;AAAA,IACtC;AAAA,EACJ;AAEA,MAAI,eAAe;AACf,kBAAc,MAAM,MAAM;AAC1B,kBAAc,MAAM,OAAO;AAC3B,kBAAc,MAAM,QAAQ;AAC5B,kBAAc,MAAM,SAAS,QAAQ,eAAe;AAAA,EACxD;AAEA,QAAM,mBAAmB,oBAAoB;AAAA,IACzC;AAAA,EACJ;AACA,MAAI,kBAAkB;AAClB,qBAAiB,MAAM,MAAM,GACzB,uBAAuB,SAAS,OAAO,OAC3C;AACA,qBAAiB,MAAM,SAAS,GAC5B,OAAO,SAAS,KAAK,eACrB,uBAAuB,SACvB,OAAO,OACX;AACA,qBAAiB,MAAM,OAAO;AAC9B,qBAAiB,MAAM,QAAQ;AAAA,EACnC;AAEA,QAAM,iBAAiB,oBAAoB;AAAA,IACvC;AAAA,EACJ;AACA,MAAI,gBAAgB;AAChB,mBAAe,MAAM,OAAO;AAC5B,mBAAe,MAAM,MAAM,GAAG,eAAe;AAC7C,mBAAe,MAAM,SAAS,GAAG,uBAAuB,MAAM;AAC9D,mBAAe,MAAM,QAAQ,GAAG,uBAAuB,IAAI;AAAA,EAC/D;AAEA,QAAM,kBAAkB,oBAAoB;AAAA,IACxC;AAAA,EACJ;AACA,MAAI,iBAAiB;AACjB,oBAAgB,MAAM,OAAO,GAAG,uBAAuB,KAAK;AAC5D,oBAAgB,MAAM,MAAM,GAAG,eAAe;AAC9C,oBAAgB,MAAM,SAAS,GAAG,uBAAuB,MAAM;AAC/D,oBAAgB,MAAM,QAAQ,GAC1B,SAAS,gBAAgB,cAAc,uBAAuB,KAClE;AAAA,EACJ;AAEA,QAAM,aAAa,oBAAoB;AAAA,IACnC;AAAA,EACJ;AACA,MAAI,YAAY;AACZ,eAAW,MAAM,MAAM,GACnB,uBAAuB,MAAM,OAAO,OACxC;AACA,eAAW,MAAM,SAAS,GAAG,uBAAuB,MAAM;AAC1D,eAAW,MAAM,QAAQ,GAAG,uBAAuB,KAAK;AACxD,eAAW,MAAM,OAAO,GAAG,uBAAuB,IAAI;AACtD,eAAW,MAAM,eAAe,WAAW,YAAY;AAAA,EAC3D;AACJ;AAOO,SAAS,iBAAiB,UAAmC;AAChE,QAAM;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ,IAAI;AAEJ,MAAI,6BAA6B;AAC7B,gCAA4B,UAAU,OAAO,SAAS;AAGtD,gCAA4B,WAAW,QAAQ,CAAC,cAAc;AAC1D,UAAI,qBAAqB,SAAS;AAC9B,kBAAU,gBAAgB,OAAO;AAAA,MACrC;AAAA,IACJ,CAAC;AAED,QAAI,CAAC,WAAW;AACZ,qBAAe;AAAA,QACX;AAAA,QACA,WAAW,kDAA+B;AAAA,MAC9C,CAAC;AAAA,IACL,OAAO;AACH,YAAM,EAAE,6BAA6B,gBAAgB,IACjD,uBAAc,yBAAyB,SAAS,CAAC;AACrD,UACI,+BACA,eAAe,+BACf,mBAAmB,MACrB;AACE,oCAA4B,YAAY;AAAA,MAC5C;AAAA,IACJ;AACA,2BAAc,yBAAyB,MAAM,kBAAkB;AAC/D,oEAA6B;AAAA,MACzB,gBAAgB;AAAA,MAChB;AAAA,MACA;AAAA,MACA;AAAA,IACJ,CAAC;AAAA,EACL;AACJ;AAOO,SAAS,eAAe,SAAsC;AACjE,QAAM,EAAE,wBAAwB,UAAU,IAAI;AAC9C,QAAM,8BACF,uBAAc,yBAAyB,MAClC;AACT,QAAM,wBAAwB,iEAAwB;AAAA,IAClD;AAAA;AAEJ,MACI,gCACC,4BAA4B,aAAa,iBAAiB,KACvD,wBACN;AACE,UAAM,sBACF,yBACC;AAEL,QAAI,OACA,eAAe,sBACT,oBAAoB,YACpB,oBAAoB;AAE9B,UAAM,oBAAgB;AAAA,MAClB,4BAA4B,aAAa,WAAW;AAAA,IACxD;AAEA,yCAAe;AAAA,MACX,cAAc;AAAA,MACd,cAAc;AAAA,IAClB,EACK,KAAK,CAAC,gBAAgB;AACnB,UACI,eACA,cAAc,kDAA+B,cAC/C;AACE,cAAM,gBAAY,kCAAa,WAAW;AAC1C,YAAI,aAAa,cAAc,2BAAc,WAAW;AACpD,qBAAO,oDAAsB,mBAAmB;AAChD,UAAC,oBAAoC,YACjC;AAAA,QACR;AAAA,MACJ;AAAA,IACJ,CAAC,EACA,QAAQ,MAAM;AAnM3B;AAoMgB,4CAAAA,YAAA,mBAA0B,KAAK,WAAW;AAAA,QACtC;AAAA,QACA;AAAA,MACJ;AAAA,IACJ,CAAC;AAAA,EACT;AACJ;AAUO,SAAS,YAAY,QAAiC;AACzD,QAAM,uBACF,uBAAc,yBAAyB,MAAM;AACjD,MAAI,sBAAsB;AACtB,yBAAqB,WAAW;AAChC,2BAAc,yBAAyB,MAAM,uBACzC;AAAA,EACR;AACA,mBAAiB;AAAA,IACb,wBAAwB,OAAO;AAAA,IAC/B,6BAA6B,OAAO;AAAA,IACpC,gBAAgB,OAAO;AAAA,IACvB,gBAAgB,OAAO;AAAA,IACvB,WAAW,QAAQ,OAAO,SAAS;AAAA,EACvC,CAAC;AACD,8EAAqC;AACrC,MACI,CAAC,uBAAc,yBAAyB,MACnC;AAEL;AACJ,SAAO,eAAe;AAAA,IAClB,uBAAc,yBAAyB,MAAM;AAAA,EACjD;AACA,yBAAc,yBAAyB,MAAM,8BACzC;AACR;","names":["visualBuilderPostMessage"]}
|
|
1
|
+
{"version":3,"sources":["../../../../src/visualBuilder/generators/generateOverlay.tsx"],"sourcesContent":["import { extractDetailsFromCslp } from \"../../cslp/cslpdata\";\nimport { cleanIndividualFieldResidual } from \"../utils/handleIndividualFields\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\nimport { VisualBuilder } from \"..\";\nimport EventListenerHandlerParams from \"../listeners/types\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { FieldDataType } from \"../utils/types/index.types\";\nimport { getFieldType } from \"../utils/getFieldType\";\nimport { getMultilinePlaintext } from \"../utils/getMultilinePlaintext\";\nimport { showAllHiddenHighlightedCommentIcons } from \"./generateHighlightedComment\";\n\n/**\n * Adds a focus overlay to the target element.\n * @param targetElement - The element to add the focus overlay to.\n * @param focusOverlayWrapper - The HTMLDivElement that contains the focus overlay.\n * @returns void\n */\nexport function addFocusOverlay(\n targetElement: Element,\n focusOverlayWrapper: HTMLDivElement,\n disabled?: boolean\n): void {\n const targetElementDimension = targetElement.getBoundingClientRect();\n if (\n targetElementDimension.width === 0 ||\n targetElementDimension.height === 0\n )\n return;\n focusOverlayWrapper.classList.add(\"visible\");\n\n const distanceFromTop = targetElementDimension.top + window.scrollY;\n const topOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--top\"\n );\n\n if (topOverlayDOM) {\n topOverlayDOM.style.top = \"0\";\n topOverlayDOM.style.left = \"0\";\n topOverlayDOM.style.width = \"100%\";\n topOverlayDOM.style.height = `calc(${distanceFromTop}px)`;\n }\n\n const bottomOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--bottom\"\n );\n if (bottomOverlayDOM) {\n bottomOverlayDOM.style.top = `${\n targetElementDimension.bottom + window.scrollY\n }px`;\n bottomOverlayDOM.style.height = `${\n window.document.body.scrollHeight -\n targetElementDimension.bottom -\n window.scrollY\n }px`;\n bottomOverlayDOM.style.left = \"0\";\n bottomOverlayDOM.style.width = \"100%\";\n }\n\n const leftOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--left\"\n );\n if (leftOverlayDOM) {\n leftOverlayDOM.style.left = \"0\";\n leftOverlayDOM.style.top = `${distanceFromTop}px`;\n leftOverlayDOM.style.height = `${targetElementDimension.height}px`;\n leftOverlayDOM.style.width = `${targetElementDimension.left}px`;\n }\n\n const rightOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--right\"\n );\n if (rightOverlayDOM) {\n rightOverlayDOM.style.left = `${targetElementDimension.right}px`;\n rightOverlayDOM.style.top = `${distanceFromTop}px`;\n rightOverlayDOM.style.height = `${targetElementDimension.height}px`;\n rightOverlayDOM.style.width = `${\n document.documentElement.clientWidth - targetElementDimension.right\n }px`;\n }\n\n const outlineDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--outline\"\n );\n if (outlineDOM) {\n outlineDOM.style.top = `${\n targetElementDimension.top + window.scrollY\n }px`;\n outlineDOM.style.height = `${targetElementDimension.height}px`;\n outlineDOM.style.width = `${targetElementDimension.width}px`;\n outlineDOM.style.left = `${targetElementDimension.left}px`;\n outlineDOM.style.outlineColor = disabled ? \"#909090\" : \"#715cdd\";\n }\n}\n\n/**\n * Hides the focus overlay and performs necessary cleanup actions when the user clicks outside of the focused element.\n * @param event - The mouse event that triggered the function.\n * @param elements - An object containing references to the focus overlay wrapper, the previously selected editable DOM element, and the visual builder wrapper.\n */\nexport function hideFocusOverlay(elements: HideOverlayParams): void {\n const {\n visualBuilderContainer,\n visualBuilderOverlayWrapper,\n focusedToolbar,\n resizeObserver,\n noTrigger,\n } = elements;\n\n if (visualBuilderOverlayWrapper) {\n visualBuilderOverlayWrapper.classList.remove(\"visible\");\n\n // Cleanup overlay styles: Top, Right, Bottom, Left & Outline\n visualBuilderOverlayWrapper.childNodes.forEach((childNode) => {\n if (childNode instanceof Element) {\n childNode.removeAttribute(\"style\");\n }\n });\n\n if (\n !noTrigger &&\n // send update when focussed field has received input\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldReceivedInput\n ) {\n sendFieldEvent({\n visualBuilderContainer,\n eventType: VisualBuilderPostMessageEvents.UPDATE_FIELD,\n });\n } else if (noTrigger) {\n const { previousSelectedEditableDOM, focusFieldValue } =\n VisualBuilder.VisualBuilderGlobalState.value || {};\n if (\n previousSelectedEditableDOM &&\n \"innerText\" in previousSelectedEditableDOM &&\n focusFieldValue != null\n ) {\n previousSelectedEditableDOM.innerText = focusFieldValue;\n }\n }\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = null;\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldReceivedInput =\n false;\n cleanIndividualFieldResidual({\n overlayWrapper: visualBuilderOverlayWrapper,\n visualBuilderContainer: visualBuilderContainer,\n focusedToolbar: focusedToolbar,\n resizeObserver: resizeObserver,\n });\n }\n}\ninterface ISendFieldEventParams {\n visualBuilderContainer: HTMLElement | null;\n eventType:\n | VisualBuilderPostMessageEvents.UPDATE_FIELD\n | VisualBuilderPostMessageEvents.SYNC_FIELD;\n}\nexport function sendFieldEvent(options: ISendFieldEventParams): void {\n const { visualBuilderContainer, eventType } = options;\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n const pseudoEditableElement = visualBuilderContainer?.querySelector(\n \"div.visual-builder__pseudo-editable-element\"\n );\n if (\n previousSelectedEditableDOM &&\n (previousSelectedEditableDOM.hasAttribute(\"contenteditable\") ||\n pseudoEditableElement)\n ) {\n const actualEditedElement =\n pseudoEditableElement ||\n (previousSelectedEditableDOM as HTMLElement);\n\n let data =\n \"innerText\" in actualEditedElement\n ? actualEditedElement.innerText\n : actualEditedElement.textContent;\n\n const fieldMetadata = extractDetailsFromCslp(\n previousSelectedEditableDOM.getAttribute(\"data-cslp\") as string\n );\n\n FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n )\n .then((fieldSchema) => {\n if (\n fieldSchema &&\n eventType === VisualBuilderPostMessageEvents.UPDATE_FIELD\n ) {\n const fieldType = getFieldType(fieldSchema);\n if (fieldType && fieldType === FieldDataType.MULTILINE) {\n data = getMultilinePlaintext(actualEditedElement);\n (actualEditedElement as HTMLElement).innerText =\n data as string;\n }\n }\n })\n .finally(() => {\n visualBuilderPostMessage?.send(eventType, {\n data,\n fieldMetadata,\n });\n });\n }\n}\ninterface HideOverlayParams\n extends Pick<\n EventListenerHandlerParams,\n \"visualBuilderContainer\" | \"focusedToolbar\" | \"resizeObserver\"\n > {\n visualBuilderOverlayWrapper: HTMLDivElement | null;\n noTrigger?: boolean;\n}\n\nexport function hideOverlay(params: HideOverlayParams): void {\n const focusElementObserver =\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver;\n if (focusElementObserver) {\n focusElementObserver.disconnect();\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver =\n null;\n }\n hideFocusOverlay({\n visualBuilderContainer: params.visualBuilderContainer,\n visualBuilderOverlayWrapper: params.visualBuilderOverlayWrapper,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n noTrigger: Boolean(params.noTrigger),\n });\n showAllHiddenHighlightedCommentIcons();\n if (\n !VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM\n )\n return;\n params.resizeObserver.unobserve(\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM\n );\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n null;\n}\n"],"mappings":"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","names":["visualBuilderPostMessage"]}
|
|
@@ -79,18 +79,20 @@ function hideFocusOverlay(elements) {
|
|
|
79
79
|
childNode.removeAttribute("style");
|
|
80
80
|
}
|
|
81
81
|
});
|
|
82
|
-
if (!noTrigger
|
|
82
|
+
if (!noTrigger && // send update when focussed field has received input
|
|
83
|
+
VisualBuilder.VisualBuilderGlobalState.value.focusFieldReceivedInput) {
|
|
83
84
|
sendFieldEvent({
|
|
84
85
|
visualBuilderContainer,
|
|
85
86
|
eventType: VisualBuilderPostMessageEvents.UPDATE_FIELD
|
|
86
87
|
});
|
|
87
|
-
} else {
|
|
88
|
+
} else if (noTrigger) {
|
|
88
89
|
const { previousSelectedEditableDOM, focusFieldValue } = VisualBuilder.VisualBuilderGlobalState.value || {};
|
|
89
90
|
if (previousSelectedEditableDOM && "innerText" in previousSelectedEditableDOM && focusFieldValue != null) {
|
|
90
91
|
previousSelectedEditableDOM.innerText = focusFieldValue;
|
|
91
92
|
}
|
|
92
93
|
}
|
|
93
94
|
VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = null;
|
|
95
|
+
VisualBuilder.VisualBuilderGlobalState.value.focusFieldReceivedInput = false;
|
|
94
96
|
cleanIndividualFieldResidual({
|
|
95
97
|
overlayWrapper: visualBuilderOverlayWrapper,
|
|
96
98
|
visualBuilderContainer,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/visualBuilder/generators/generateOverlay.tsx"],"sourcesContent":["import { extractDetailsFromCslp } from \"../../cslp/cslpdata\";\nimport { cleanIndividualFieldResidual } from \"../utils/handleIndividualFields\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\nimport { VisualBuilder } from \"..\";\nimport EventListenerHandlerParams from \"../listeners/types\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { FieldDataType } from \"../utils/types/index.types\";\nimport { getFieldType } from \"../utils/getFieldType\";\nimport { CslpData } from \"../../cslp/types/cslp.types\";\nimport { getMultilinePlaintext } from \"../utils/getMultilinePlaintext\";\nimport { showAllHiddenHighlightedCommentIcons } from \"./generateHighlightedComment\";\n\n/**\n * Adds a focus overlay to the target element.\n * @param targetElement - The element to add the focus overlay to.\n * @param focusOverlayWrapper - The HTMLDivElement that contains the focus overlay.\n * @returns void\n */\nexport function addFocusOverlay(\n targetElement: Element,\n focusOverlayWrapper: HTMLDivElement,\n disabled?: boolean\n): void {\n const targetElementDimension = targetElement.getBoundingClientRect();\n if (\n targetElementDimension.width === 0 ||\n targetElementDimension.height === 0\n )\n return;\n focusOverlayWrapper.classList.add(\"visible\");\n\n const distanceFromTop = targetElementDimension.top + window.scrollY;\n const topOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--top\"\n );\n\n if (topOverlayDOM) {\n topOverlayDOM.style.top = \"0\";\n topOverlayDOM.style.left = \"0\";\n topOverlayDOM.style.width = \"100%\";\n topOverlayDOM.style.height = `calc(${distanceFromTop}px)`;\n }\n\n const bottomOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--bottom\"\n );\n if (bottomOverlayDOM) {\n bottomOverlayDOM.style.top = `${\n targetElementDimension.bottom + window.scrollY\n }px`;\n bottomOverlayDOM.style.height = `${\n window.document.body.scrollHeight -\n targetElementDimension.bottom -\n window.scrollY\n }px`;\n bottomOverlayDOM.style.left = \"0\";\n bottomOverlayDOM.style.width = \"100%\";\n }\n\n const leftOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--left\"\n );\n if (leftOverlayDOM) {\n leftOverlayDOM.style.left = \"0\";\n leftOverlayDOM.style.top = `${distanceFromTop}px`;\n leftOverlayDOM.style.height = `${targetElementDimension.height}px`;\n leftOverlayDOM.style.width = `${targetElementDimension.left}px`;\n }\n\n const rightOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--right\"\n );\n if (rightOverlayDOM) {\n rightOverlayDOM.style.left = `${targetElementDimension.right}px`;\n rightOverlayDOM.style.top = `${distanceFromTop}px`;\n rightOverlayDOM.style.height = `${targetElementDimension.height}px`;\n rightOverlayDOM.style.width = `${\n document.documentElement.clientWidth - targetElementDimension.right\n }px`;\n }\n\n const outlineDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--outline\"\n );\n if (outlineDOM) {\n outlineDOM.style.top = `${\n targetElementDimension.top + window.scrollY\n }px`;\n outlineDOM.style.height = `${targetElementDimension.height}px`;\n outlineDOM.style.width = `${targetElementDimension.width}px`;\n outlineDOM.style.left = `${targetElementDimension.left}px`;\n outlineDOM.style.outlineColor = disabled ? \"#909090\" : \"#715cdd\";\n }\n}\n\n/**\n * Hides the focus overlay and performs necessary cleanup actions when the user clicks outside of the focused element.\n * @param event - The mouse event that triggered the function.\n * @param elements - An object containing references to the focus overlay wrapper, the previously selected editable DOM element, and the visual builder wrapper.\n */\nexport function hideFocusOverlay(elements: HideOverlayParams): void {\n const {\n visualBuilderContainer,\n visualBuilderOverlayWrapper,\n focusedToolbar,\n resizeObserver,\n noTrigger,\n } = elements;\n\n if (visualBuilderOverlayWrapper) {\n visualBuilderOverlayWrapper.classList.remove(\"visible\");\n\n // Cleanup overlay styles: Top, Right, Bottom, Left & Outline\n visualBuilderOverlayWrapper.childNodes.forEach((childNode) => {\n if (childNode instanceof Element) {\n childNode.removeAttribute(\"style\");\n }\n });\n\n if (!noTrigger) {\n sendFieldEvent({\n visualBuilderContainer,\n eventType: VisualBuilderPostMessageEvents.UPDATE_FIELD,\n });\n } else {\n const { previousSelectedEditableDOM, focusFieldValue } =\n VisualBuilder.VisualBuilderGlobalState.value || {};\n if (\n previousSelectedEditableDOM &&\n \"innerText\" in previousSelectedEditableDOM &&\n focusFieldValue != null\n ) {\n previousSelectedEditableDOM.innerText = focusFieldValue;\n }\n }\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = null;\n cleanIndividualFieldResidual({\n overlayWrapper: visualBuilderOverlayWrapper,\n visualBuilderContainer: visualBuilderContainer,\n focusedToolbar: focusedToolbar,\n resizeObserver: resizeObserver,\n });\n }\n}\ninterface ISendFieldEventParams {\n visualBuilderContainer: HTMLElement | null;\n eventType:\n | VisualBuilderPostMessageEvents.UPDATE_FIELD\n | VisualBuilderPostMessageEvents.SYNC_FIELD;\n}\nexport function sendFieldEvent(options: ISendFieldEventParams): void {\n const { visualBuilderContainer, eventType } = options;\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n const pseudoEditableElement = visualBuilderContainer?.querySelector(\n \"div.visual-builder__pseudo-editable-element\"\n );\n if (\n previousSelectedEditableDOM &&\n (previousSelectedEditableDOM.hasAttribute(\"contenteditable\") ||\n pseudoEditableElement)\n ) {\n const actualEditedElement =\n pseudoEditableElement ||\n (previousSelectedEditableDOM as HTMLElement);\n\n let data =\n \"innerText\" in actualEditedElement\n ? actualEditedElement.innerText\n : actualEditedElement.textContent;\n\n const fieldMetadata = extractDetailsFromCslp(\n previousSelectedEditableDOM.getAttribute(\"data-cslp\") as string\n );\n\n FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n )\n .then((fieldSchema) => {\n if (\n fieldSchema &&\n eventType === VisualBuilderPostMessageEvents.UPDATE_FIELD\n ) {\n const fieldType = getFieldType(fieldSchema);\n if (fieldType && fieldType === FieldDataType.MULTILINE) {\n data = getMultilinePlaintext(actualEditedElement);\n (actualEditedElement as HTMLElement).innerText =\n data as string;\n }\n }\n })\n .finally(() => {\n visualBuilderPostMessage?.send(eventType, {\n data,\n fieldMetadata,\n });\n });\n }\n}\ninterface HideOverlayParams\n extends Pick<\n EventListenerHandlerParams,\n \"visualBuilderContainer\" | \"focusedToolbar\" | \"resizeObserver\"\n > {\n visualBuilderOverlayWrapper: HTMLDivElement | null;\n noTrigger?: boolean;\n}\n\nexport function hideOverlay(params: HideOverlayParams): void {\n const focusElementObserver =\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver;\n if (focusElementObserver) {\n focusElementObserver.disconnect();\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver =\n null;\n }\n hideFocusOverlay({\n visualBuilderContainer: params.visualBuilderContainer,\n visualBuilderOverlayWrapper: params.visualBuilderOverlayWrapper,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n noTrigger: Boolean(params.noTrigger),\n });\n showAllHiddenHighlightedCommentIcons();\n if (\n !VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM\n )\n return;\n params.resizeObserver.unobserve(\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM\n );\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n null;\n}\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../../src/visualBuilder/generators/generateOverlay.tsx"],"sourcesContent":["import { extractDetailsFromCslp } from \"../../cslp/cslpdata\";\nimport { cleanIndividualFieldResidual } from \"../utils/handleIndividualFields\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\nimport { VisualBuilder } from \"..\";\nimport EventListenerHandlerParams from \"../listeners/types\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { FieldDataType } from \"../utils/types/index.types\";\nimport { getFieldType } from \"../utils/getFieldType\";\nimport { getMultilinePlaintext } from \"../utils/getMultilinePlaintext\";\nimport { showAllHiddenHighlightedCommentIcons } from \"./generateHighlightedComment\";\n\n/**\n * Adds a focus overlay to the target element.\n * @param targetElement - The element to add the focus overlay to.\n * @param focusOverlayWrapper - The HTMLDivElement that contains the focus overlay.\n * @returns void\n */\nexport function addFocusOverlay(\n targetElement: Element,\n focusOverlayWrapper: HTMLDivElement,\n disabled?: boolean\n): void {\n const targetElementDimension = targetElement.getBoundingClientRect();\n if (\n targetElementDimension.width === 0 ||\n targetElementDimension.height === 0\n )\n return;\n focusOverlayWrapper.classList.add(\"visible\");\n\n const distanceFromTop = targetElementDimension.top + window.scrollY;\n const topOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--top\"\n );\n\n if (topOverlayDOM) {\n topOverlayDOM.style.top = \"0\";\n topOverlayDOM.style.left = \"0\";\n topOverlayDOM.style.width = \"100%\";\n topOverlayDOM.style.height = `calc(${distanceFromTop}px)`;\n }\n\n const bottomOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--bottom\"\n );\n if (bottomOverlayDOM) {\n bottomOverlayDOM.style.top = `${\n targetElementDimension.bottom + window.scrollY\n }px`;\n bottomOverlayDOM.style.height = `${\n window.document.body.scrollHeight -\n targetElementDimension.bottom -\n window.scrollY\n }px`;\n bottomOverlayDOM.style.left = \"0\";\n bottomOverlayDOM.style.width = \"100%\";\n }\n\n const leftOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--left\"\n );\n if (leftOverlayDOM) {\n leftOverlayDOM.style.left = \"0\";\n leftOverlayDOM.style.top = `${distanceFromTop}px`;\n leftOverlayDOM.style.height = `${targetElementDimension.height}px`;\n leftOverlayDOM.style.width = `${targetElementDimension.left}px`;\n }\n\n const rightOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--right\"\n );\n if (rightOverlayDOM) {\n rightOverlayDOM.style.left = `${targetElementDimension.right}px`;\n rightOverlayDOM.style.top = `${distanceFromTop}px`;\n rightOverlayDOM.style.height = `${targetElementDimension.height}px`;\n rightOverlayDOM.style.width = `${\n document.documentElement.clientWidth - targetElementDimension.right\n }px`;\n }\n\n const outlineDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--outline\"\n );\n if (outlineDOM) {\n outlineDOM.style.top = `${\n targetElementDimension.top + window.scrollY\n }px`;\n outlineDOM.style.height = `${targetElementDimension.height}px`;\n outlineDOM.style.width = `${targetElementDimension.width}px`;\n outlineDOM.style.left = `${targetElementDimension.left}px`;\n outlineDOM.style.outlineColor = disabled ? \"#909090\" : \"#715cdd\";\n }\n}\n\n/**\n * Hides the focus overlay and performs necessary cleanup actions when the user clicks outside of the focused element.\n * @param event - The mouse event that triggered the function.\n * @param elements - An object containing references to the focus overlay wrapper, the previously selected editable DOM element, and the visual builder wrapper.\n */\nexport function hideFocusOverlay(elements: HideOverlayParams): void {\n const {\n visualBuilderContainer,\n visualBuilderOverlayWrapper,\n focusedToolbar,\n resizeObserver,\n noTrigger,\n } = elements;\n\n if (visualBuilderOverlayWrapper) {\n visualBuilderOverlayWrapper.classList.remove(\"visible\");\n\n // Cleanup overlay styles: Top, Right, Bottom, Left & Outline\n visualBuilderOverlayWrapper.childNodes.forEach((childNode) => {\n if (childNode instanceof Element) {\n childNode.removeAttribute(\"style\");\n }\n });\n\n if (\n !noTrigger &&\n // send update when focussed field has received input\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldReceivedInput\n ) {\n sendFieldEvent({\n visualBuilderContainer,\n eventType: VisualBuilderPostMessageEvents.UPDATE_FIELD,\n });\n } else if (noTrigger) {\n const { previousSelectedEditableDOM, focusFieldValue } =\n VisualBuilder.VisualBuilderGlobalState.value || {};\n if (\n previousSelectedEditableDOM &&\n \"innerText\" in previousSelectedEditableDOM &&\n focusFieldValue != null\n ) {\n previousSelectedEditableDOM.innerText = focusFieldValue;\n }\n }\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = null;\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldReceivedInput =\n false;\n cleanIndividualFieldResidual({\n overlayWrapper: visualBuilderOverlayWrapper,\n visualBuilderContainer: visualBuilderContainer,\n focusedToolbar: focusedToolbar,\n resizeObserver: resizeObserver,\n });\n }\n}\ninterface ISendFieldEventParams {\n visualBuilderContainer: HTMLElement | null;\n eventType:\n | VisualBuilderPostMessageEvents.UPDATE_FIELD\n | VisualBuilderPostMessageEvents.SYNC_FIELD;\n}\nexport function sendFieldEvent(options: ISendFieldEventParams): void {\n const { visualBuilderContainer, eventType } = options;\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n const pseudoEditableElement = visualBuilderContainer?.querySelector(\n \"div.visual-builder__pseudo-editable-element\"\n );\n if (\n previousSelectedEditableDOM &&\n (previousSelectedEditableDOM.hasAttribute(\"contenteditable\") ||\n pseudoEditableElement)\n ) {\n const actualEditedElement =\n pseudoEditableElement ||\n (previousSelectedEditableDOM as HTMLElement);\n\n let data =\n \"innerText\" in actualEditedElement\n ? actualEditedElement.innerText\n : actualEditedElement.textContent;\n\n const fieldMetadata = extractDetailsFromCslp(\n previousSelectedEditableDOM.getAttribute(\"data-cslp\") as string\n );\n\n FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n )\n .then((fieldSchema) => {\n if (\n fieldSchema &&\n eventType === VisualBuilderPostMessageEvents.UPDATE_FIELD\n ) {\n const fieldType = getFieldType(fieldSchema);\n if (fieldType && fieldType === FieldDataType.MULTILINE) {\n data = getMultilinePlaintext(actualEditedElement);\n (actualEditedElement as HTMLElement).innerText =\n data as string;\n }\n }\n })\n .finally(() => {\n visualBuilderPostMessage?.send(eventType, {\n data,\n fieldMetadata,\n });\n });\n }\n}\ninterface HideOverlayParams\n extends Pick<\n EventListenerHandlerParams,\n \"visualBuilderContainer\" | \"focusedToolbar\" | \"resizeObserver\"\n > {\n visualBuilderOverlayWrapper: HTMLDivElement | null;\n noTrigger?: boolean;\n}\n\nexport function hideOverlay(params: HideOverlayParams): void {\n const focusElementObserver =\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver;\n if (focusElementObserver) {\n focusElementObserver.disconnect();\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver =\n null;\n }\n hideFocusOverlay({\n visualBuilderContainer: params.visualBuilderContainer,\n visualBuilderOverlayWrapper: params.visualBuilderOverlayWrapper,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n noTrigger: Boolean(params.noTrigger),\n });\n showAllHiddenHighlightedCommentIcons();\n if (\n !VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM\n )\n return;\n params.resizeObserver.unobserve(\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM\n );\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n null;\n}\n"],"mappings":"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","names":[]}
|
|
@@ -39,6 +39,7 @@ var import_constants = require("../utils/constants.cjs");
|
|
|
39
39
|
var import_FieldToolbar = __toESM(require("../components/FieldToolbar.cjs"), 1);
|
|
40
40
|
var import_preact = require("preact");
|
|
41
41
|
var import_fieldLabelWrapper = __toESM(require("../components/fieldLabelWrapper.cjs"), 1);
|
|
42
|
+
var import_getEntryPermissionsCached = require("../utils/getEntryPermissionsCached.cjs");
|
|
42
43
|
var import_jsx_runtime = require("preact/jsx-runtime");
|
|
43
44
|
function appendFocusedToolbar(eventDetails, focusedToolbarElement, hideOverlay, isVariant = false) {
|
|
44
45
|
appendFieldPathDropdown(eventDetails, focusedToolbarElement);
|
|
@@ -49,11 +50,16 @@ function appendFocusedToolbar(eventDetails, focusedToolbarElement, hideOverlay,
|
|
|
49
50
|
isVariant
|
|
50
51
|
);
|
|
51
52
|
}
|
|
52
|
-
function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay, isVariant = false) {
|
|
53
|
+
async function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay, isVariant = false) {
|
|
53
54
|
if (focusedToolbarElement.querySelector(
|
|
54
55
|
".visual-builder__focused-toolbar__multiple-field-toolbar"
|
|
55
56
|
))
|
|
56
57
|
return;
|
|
58
|
+
const entryPermissions = await (0, import_getEntryPermissionsCached.getEntryPermissionsCached)({
|
|
59
|
+
entryUid: eventDetails.fieldMetadata.entry_uid,
|
|
60
|
+
contentTypeUid: eventDetails.fieldMetadata.content_type_uid,
|
|
61
|
+
locale: eventDetails.fieldMetadata.locale
|
|
62
|
+
});
|
|
57
63
|
const wrapper = document.createDocumentFragment();
|
|
58
64
|
(0, import_preact.render)(
|
|
59
65
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -61,7 +67,8 @@ function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay, is
|
|
|
61
67
|
{
|
|
62
68
|
eventDetails,
|
|
63
69
|
hideOverlay,
|
|
64
|
-
isVariant
|
|
70
|
+
isVariant,
|
|
71
|
+
entryPermissions
|
|
65
72
|
}
|
|
66
73
|
),
|
|
67
74
|
wrapper
|
|
@@ -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 hideOverlay: () => void,\n isVariant: boolean = false\n): void {\n appendFieldPathDropdown(eventDetails, focusedToolbarElement);\n appendFieldToolbar(\n eventDetails,\n focusedToolbarElement,\n hideOverlay,\n isVariant\n );\n}\n\nexport function appendFieldToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void,\n isVariant: boolean = false\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 isVariant={isVariant}\n />,\n wrapper\n );\n focusedToolbarElement.append(wrapper);\n}\n\nexport function appendFieldPathDropdown(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement\n): void {\n if (\n document.querySelector(\n \".visual-builder__focused-toolbar__field-label-wrapper\"\n )\n )\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
1
|
+
{"version":3,"sources":["../../../../src/visualBuilder/generators/generateToolbar.tsx"],"sourcesContent":["import React from \"preact/compat\";\nimport { 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\";\nimport { getEntryPermissionsCached } from \"../utils/getEntryPermissionsCached\";\n\nexport function appendFocusedToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void,\n isVariant: boolean = false\n): void {\n appendFieldPathDropdown(eventDetails, focusedToolbarElement);\n appendFieldToolbar(\n eventDetails,\n focusedToolbarElement,\n hideOverlay,\n isVariant\n );\n}\n\nexport async function appendFieldToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void,\n isVariant: boolean = false\n): Promise<void> {\n if (\n focusedToolbarElement.querySelector(\n \".visual-builder__focused-toolbar__multiple-field-toolbar\"\n )\n )\n return;\n const entryPermissions = await getEntryPermissionsCached({\n entryUid: eventDetails.fieldMetadata.entry_uid,\n contentTypeUid: eventDetails.fieldMetadata.content_type_uid,\n locale: eventDetails.fieldMetadata.locale,\n });\n const wrapper = document.createDocumentFragment();\n render(\n <FieldToolbarComponent\n eventDetails={eventDetails}\n hideOverlay={hideOverlay}\n isVariant={isVariant}\n entryPermissions={entryPermissions}\n />,\n wrapper\n );\n focusedToolbarElement.append(wrapper);\n}\n\nexport function appendFieldPathDropdown(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement\n): void {\n if (\n document.querySelector(\n \".visual-builder__focused-toolbar__field-label-wrapper\"\n )\n )\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,uBAMO;AAIP,0BAAkC;AAClC,oBAAuB;AACvB,+BAAuC;AACvC,uCAA0C;AAoClC;AAlCD,SAAS,qBACZ,cACA,uBACA,aACA,YAAqB,OACjB;AACJ,0BAAwB,cAAc,qBAAqB;AAC3D;AAAA,IACI;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AACJ;AAEA,eAAsB,mBAClB,cACA,uBACA,aACA,YAAqB,OACR;AACb,MACI,sBAAsB;AAAA,IAClB;AAAA,EACJ;AAEA;AACJ,QAAM,mBAAmB,UAAM,4DAA0B;AAAA,IACrD,UAAU,aAAa,cAAc;AAAA,IACrC,gBAAgB,aAAa,cAAc;AAAA,IAC3C,QAAQ,aAAa,cAAc;AAAA,EACvC,CAAC;AACD,QAAM,UAAU,SAAS,uBAAuB;AAChD;AAAA,IACI;AAAA,MAAC,oBAAAA;AAAA,MAAA;AAAA,QACG;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;AACA,wBAAsB,OAAO,OAAO;AACxC;AAEO,SAAS,wBACZ,cACA,uBACI;AACJ,MACI,SAAS;AAAA,IACL;AAAA,EACJ;AAEA;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,mCACxC,kBAAkB,uBAAuB,SAAS,mCAClD;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,oCAAmB;AAElD,0BAAsB,MAAM,iBAAiB;AAC7C,0BAAsB,MAAM,OAAO,GAC/B,uBAAuB,QAAQ,iDACnC;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,yBAAAC;AAAA,MAAA;AAAA,QACG;AAAA,QACA;AAAA,QACA;AAAA,QACA,0BAA0B,CAAC,SAAiB;AACxC,gBAAM,gBAAgB,cAAc;AAAA,YAChC,IAAI,wCAAuB,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,wCAAuB,GAAG;AACtD,gBAAU;AAAA,QACN,eAAe,aAAa,wCAAuB;AAAA,MACvD;AACA;AAAA,IACJ;AACA,qBAAiB,eAAe;AAAA,EACpC;AAEA,SAAO;AACX;","names":["FieldToolbarComponent","FieldLabelWrapperComponent"]}
|
|
@@ -2,7 +2,7 @@ import { VisualBuilderCslpEventDetails } from '../types/visualBuilder.types.cjs'
|
|
|
2
2
|
import '../../cslp/types/cslp.types.cjs';
|
|
3
3
|
|
|
4
4
|
declare function appendFocusedToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void, isVariant?: boolean): void;
|
|
5
|
-
declare function appendFieldToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void, isVariant?: boolean): void
|
|
5
|
+
declare function appendFieldToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void, isVariant?: boolean): Promise<void>;
|
|
6
6
|
declare function appendFieldPathDropdown(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement): void;
|
|
7
7
|
|
|
8
8
|
export { appendFieldPathDropdown, appendFieldToolbar, appendFocusedToolbar };
|
|
@@ -2,7 +2,7 @@ import { VisualBuilderCslpEventDetails } from '../types/visualBuilder.types.js';
|
|
|
2
2
|
import '../../cslp/types/cslp.types.js';
|
|
3
3
|
|
|
4
4
|
declare function appendFocusedToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void, isVariant?: boolean): void;
|
|
5
|
-
declare function appendFieldToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void, isVariant?: boolean): void
|
|
5
|
+
declare function appendFieldToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void, isVariant?: boolean): Promise<void>;
|
|
6
6
|
declare function appendFieldPathDropdown(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement): void;
|
|
7
7
|
|
|
8
8
|
export { appendFieldPathDropdown, appendFieldToolbar, appendFocusedToolbar };
|
|
@@ -11,6 +11,7 @@ import {
|
|
|
11
11
|
import FieldToolbarComponent from "../components/FieldToolbar.js";
|
|
12
12
|
import { render } from "preact";
|
|
13
13
|
import FieldLabelWrapperComponent from "../components/fieldLabelWrapper.js";
|
|
14
|
+
import { getEntryPermissionsCached } from "../utils/getEntryPermissionsCached.js";
|
|
14
15
|
import { jsx } from "preact/jsx-runtime";
|
|
15
16
|
function appendFocusedToolbar(eventDetails, focusedToolbarElement, hideOverlay, isVariant = false) {
|
|
16
17
|
appendFieldPathDropdown(eventDetails, focusedToolbarElement);
|
|
@@ -21,11 +22,16 @@ function appendFocusedToolbar(eventDetails, focusedToolbarElement, hideOverlay,
|
|
|
21
22
|
isVariant
|
|
22
23
|
);
|
|
23
24
|
}
|
|
24
|
-
function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay, isVariant = false) {
|
|
25
|
+
async function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay, isVariant = false) {
|
|
25
26
|
if (focusedToolbarElement.querySelector(
|
|
26
27
|
".visual-builder__focused-toolbar__multiple-field-toolbar"
|
|
27
28
|
))
|
|
28
29
|
return;
|
|
30
|
+
const entryPermissions = await getEntryPermissionsCached({
|
|
31
|
+
entryUid: eventDetails.fieldMetadata.entry_uid,
|
|
32
|
+
contentTypeUid: eventDetails.fieldMetadata.content_type_uid,
|
|
33
|
+
locale: eventDetails.fieldMetadata.locale
|
|
34
|
+
});
|
|
29
35
|
const wrapper = document.createDocumentFragment();
|
|
30
36
|
render(
|
|
31
37
|
/* @__PURE__ */ jsx(
|
|
@@ -33,7 +39,8 @@ function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay, is
|
|
|
33
39
|
{
|
|
34
40
|
eventDetails,
|
|
35
41
|
hideOverlay,
|
|
36
|
-
isVariant
|
|
42
|
+
isVariant,
|
|
43
|
+
entryPermissions
|
|
37
44
|
}
|
|
38
45
|
),
|
|
39
46
|
wrapper
|
|
@@ -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 hideOverlay: () => void,\n isVariant: boolean = false\n): void {\n appendFieldPathDropdown(eventDetails, focusedToolbarElement);\n appendFieldToolbar(\n eventDetails,\n focusedToolbarElement,\n hideOverlay,\n isVariant\n );\n}\n\nexport function appendFieldToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void,\n isVariant: boolean = false\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 isVariant={isVariant}\n />,\n wrapper\n );\n focusedToolbarElement.append(wrapper);\n}\n\nexport function appendFieldPathDropdown(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement\n): void {\n if (\n document.querySelector(\n \".visual-builder__focused-toolbar__field-label-wrapper\"\n )\n )\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":";;;
|
|
1
|
+
{"version":3,"sources":["../../../../src/visualBuilder/generators/generateToolbar.tsx"],"sourcesContent":["import React from \"preact/compat\";\nimport { 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\";\nimport { getEntryPermissionsCached } from \"../utils/getEntryPermissionsCached\";\n\nexport function appendFocusedToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void,\n isVariant: boolean = false\n): void {\n appendFieldPathDropdown(eventDetails, focusedToolbarElement);\n appendFieldToolbar(\n eventDetails,\n focusedToolbarElement,\n hideOverlay,\n isVariant\n );\n}\n\nexport async function appendFieldToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void,\n isVariant: boolean = false\n): Promise<void> {\n if (\n focusedToolbarElement.querySelector(\n \".visual-builder__focused-toolbar__multiple-field-toolbar\"\n )\n )\n return;\n const entryPermissions = await getEntryPermissionsCached({\n entryUid: eventDetails.fieldMetadata.entry_uid,\n contentTypeUid: eventDetails.fieldMetadata.content_type_uid,\n locale: eventDetails.fieldMetadata.locale,\n });\n const wrapper = document.createDocumentFragment();\n render(\n <FieldToolbarComponent\n eventDetails={eventDetails}\n hideOverlay={hideOverlay}\n isVariant={isVariant}\n entryPermissions={entryPermissions}\n />,\n wrapper\n );\n focusedToolbarElement.append(wrapper);\n}\n\nexport function appendFieldPathDropdown(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement\n): void {\n if (\n document.querySelector(\n \".visual-builder__focused-toolbar__field-label-wrapper\"\n )\n )\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":";;;AAEA;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AAIP,OAAO,2BAA2B;AAClC,SAAS,cAAc;AACvB,OAAO,gCAAgC;AACvC,SAAS,iCAAiC;AAoClC;AAlCD,SAAS,qBACZ,cACA,uBACA,aACA,YAAqB,OACjB;AACJ,0BAAwB,cAAc,qBAAqB;AAC3D;AAAA,IACI;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AACJ;AAEA,eAAsB,mBAClB,cACA,uBACA,aACA,YAAqB,OACR;AACb,MACI,sBAAsB;AAAA,IAClB;AAAA,EACJ;AAEA;AACJ,QAAM,mBAAmB,MAAM,0BAA0B;AAAA,IACrD,UAAU,aAAa,cAAc;AAAA,IACrC,gBAAgB,aAAa,cAAc;AAAA,IAC3C,QAAQ,aAAa,cAAc;AAAA,EACvC,CAAC;AACD,QAAM,UAAU,SAAS,uBAAuB;AAChD;AAAA,IACI;AAAA,MAAC;AAAA;AAAA,QACG;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;AACA,wBAAsB,OAAO,OAAO;AACxC;AAEO,SAAS,wBACZ,cACA,uBACI;AACJ,MACI,SAAS;AAAA,IACL;AAAA,EACJ;AAEA;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":[]}
|
|
@@ -144,9 +144,7 @@ var _VisualBuilder = class _VisualBuilder {
|
|
|
144
144
|
this.resizeObserver
|
|
145
145
|
);
|
|
146
146
|
const emptyBlockParents = Array.from(
|
|
147
|
-
document.querySelectorAll(
|
|
148
|
-
`.${import__.VB_EmptyBlockParentClass}`
|
|
149
|
-
)
|
|
147
|
+
document.querySelectorAll(`.${import__.VB_EmptyBlockParentClass}`)
|
|
150
148
|
);
|
|
151
149
|
const previousEmptyBlockParents = _VisualBuilder.VisualBuilderGlobalState.value.previousEmptyBlockParents;
|
|
152
150
|
if (!(0, import_lodash_es.isEqual)(emptyBlockParents, previousEmptyBlockParents)) {
|
|
@@ -212,6 +210,7 @@ var _VisualBuilder = class _VisualBuilder {
|
|
|
212
210
|
previousHoveredTargetDOM: null,
|
|
213
211
|
previousEmptyBlockParents: [],
|
|
214
212
|
focusFieldValue: null,
|
|
213
|
+
focusFieldReceivedInput: false,
|
|
215
214
|
audienceMode: false,
|
|
216
215
|
locale: "en-us",
|
|
217
216
|
variant: null,
|
|
@@ -345,6 +344,7 @@ _VisualBuilder.VisualBuilderGlobalState = (0, import_signals.signal)({
|
|
|
345
344
|
previousHoveredTargetDOM: null,
|
|
346
345
|
previousEmptyBlockParents: [],
|
|
347
346
|
focusFieldValue: null,
|
|
347
|
+
focusFieldReceivedInput: false,
|
|
348
348
|
audienceMode: false,
|
|
349
349
|
locale: import_configManager.default.get().stackDetails.masterLocale || "en-us",
|
|
350
350
|
variant: null,
|
|
@@ -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 {\n updateCollabIconPosition,\n updatePopupPositions,\n updateSuggestionListPosition,\n} from \"./generators/generateThread\";\nimport { useRecalculateVariantDataCSLPValues } from \"./eventManager/useRecalculateVariantDataCSLPValues\";\nimport { VB_EmptyBlockParentClass } from \"..\";\nimport { useCollab } from \"./eventManager/useCollab\";\nimport {\n handleMissingThreads,\n processThreadsBatch,\n filterUnrenderedThreads,\n clearThreadStatus,\n} from \"./generators/generateThread\";\nimport { IThreadDTO } from \"./types/collab.types\";\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 focusElementObserver: MutationObserver | null;\n}\n\nlet threadsPayload: IThreadDTO[] = [];\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 focusElementObserver: 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 updateCollabIconPosition();\n updatePopupPositions();\n updateSuggestionListPosition();\n updateHighlightedCommentIconPosition(); // Update icons position\n };\n\n private resizeEventHandler = () => {\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n updateHighlightedCommentIconPosition();\n updateCollabIconPosition();\n updatePopupPositions();\n updateSuggestionListPosition();\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\n const emptyBlockParents = Array.from(\n document.querySelectorAll(\n `.${VB_EmptyBlockParentClass}`\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 private threadMutationObserver = new MutationObserver(\n debounce(() => {\n const container = document.querySelector(\n \".visual-builder__container\"\n );\n if (container && threadsPayload) {\n const unrenderedThreads =\n filterUnrenderedThreads(threadsPayload);\n\n if (unrenderedThreads.length > 0) {\n processThreadsBatch(threadsPayload).then(\n (missingThreadIds) => {\n missingThreadIds.forEach(clearThreadStatus);\n if (missingThreadIds.length > 0) {\n handleMissingThreads({\n payload: { isElementPresent: false },\n threadUids: missingThreadIds,\n });\n }\n }\n );\n }\n\n threadsPayload = [];\n }\n }, 1000)\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\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 collab,\n } = data || {};\n Config.set(\"windowType\", windowType);\n Config.set(\n \"stackDetails.masterLocale\",\n stackDetails?.masterLocale || \"en-us\"\n );\n\n if (collab) {\n Config.set(\"collab.enable\", collab.enable);\n Config.set(\"collab.isFeedbackMode\", collab.isFeedbackMode);\n Config.set(\"collab.inviteMetadata\", collab.inviteMetadata);\n }\n\n if (collab?.payload) {\n threadsPayload = collab?.payload;\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 this.threadMutationObserver.observe(document.body, {\n childList: true,\n subtree: true,\n attributes: false,\n });\n\n useHistoryPostMessageEvent();\n useCollab();\n\n if (windowType === ILivePreviewWindowType.BUILDER) {\n addKeyboardShortcuts({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n useScrollToField();\n useHighlightCommentIcon();\n\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 useOnEntryUpdatePostMessageEvent();\n useRecalculateVariantDataCSLPValues();\n useDraftFieldsPostMessageEvent();\n useVariantFieldsPostMessageEvent();\n }\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 this.threadMutationObserver.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 focusElementObserver: 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":["import_generateThread","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 {\n updateCollabIconPosition,\n updatePopupPositions,\n updateSuggestionListPosition,\n} from \"./generators/generateThread\";\nimport { useRecalculateVariantDataCSLPValues } from \"./eventManager/useRecalculateVariantDataCSLPValues\";\nimport { VB_EmptyBlockParentClass } from \"..\";\nimport { useCollab } from \"./eventManager/useCollab\";\nimport {\n handleMissingThreads,\n processThreadsBatch,\n filterUnrenderedThreads,\n clearThreadStatus,\n} from \"./generators/generateThread\";\nimport { IThreadDTO } from \"./types/collab.types\";\n\ninterface VisualBuilderGlobalStateImpl {\n previousSelectedEditableDOM: HTMLElement | Element | null;\n previousHoveredTargetDOM: Element | null;\n previousEmptyBlockParents: Element[] | [];\n focusFieldValue: string | null;\n focusFieldReceivedInput: boolean;\n audienceMode: boolean;\n locale: string;\n variant: string | null;\n focusElementObserver: MutationObserver | null;\n}\n\nlet threadsPayload: IThreadDTO[] = [];\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 focusFieldReceivedInput: false,\n audienceMode: false,\n locale: Config.get().stackDetails.masterLocale || \"en-us\",\n variant: null,\n focusElementObserver: 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 updateCollabIconPosition();\n updatePopupPositions();\n updateSuggestionListPosition();\n updateHighlightedCommentIconPosition(); // Update icons position\n };\n\n private resizeEventHandler = () => {\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n updateHighlightedCommentIconPosition();\n updateCollabIconPosition();\n updatePopupPositions();\n updateSuggestionListPosition();\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\n const emptyBlockParents = Array.from(\n document.querySelectorAll(`.${VB_EmptyBlockParentClass}`)\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 private threadMutationObserver = new MutationObserver(\n debounce(() => {\n const container = document.querySelector(\n \".visual-builder__container\"\n );\n if (container && threadsPayload) {\n const unrenderedThreads =\n filterUnrenderedThreads(threadsPayload);\n\n if (unrenderedThreads.length > 0) {\n processThreadsBatch(threadsPayload).then(\n (missingThreadIds) => {\n missingThreadIds.forEach(clearThreadStatus);\n if (missingThreadIds.length > 0) {\n handleMissingThreads({\n payload: { isElementPresent: false },\n threadUids: missingThreadIds,\n });\n }\n }\n );\n }\n\n threadsPayload = [];\n }\n }, 1000)\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\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 collab,\n } = data || {};\n Config.set(\"windowType\", windowType);\n Config.set(\n \"stackDetails.masterLocale\",\n stackDetails?.masterLocale || \"en-us\"\n );\n\n if (collab) {\n Config.set(\"collab.enable\", collab.enable);\n Config.set(\"collab.isFeedbackMode\", collab.isFeedbackMode);\n Config.set(\"collab.inviteMetadata\", collab.inviteMetadata);\n }\n\n if (collab?.payload) {\n threadsPayload = collab?.payload;\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 this.threadMutationObserver.observe(document.body, {\n childList: true,\n subtree: true,\n attributes: false,\n });\n\n useHistoryPostMessageEvent();\n useCollab();\n\n if (windowType === ILivePreviewWindowType.BUILDER) {\n addKeyboardShortcuts({\n overlayWrapper: this.overlayWrapper,\n visualBuilderContainer: this.visualBuilderContainer,\n focusedToolbar: this.focusedToolbar,\n resizeObserver: this.resizeObserver,\n });\n useScrollToField();\n useHighlightCommentIcon();\n\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 useOnEntryUpdatePostMessageEvent();\n useRecalculateVariantDataCSLPValues();\n useDraftFieldsPostMessageEvent();\n useVariantFieldsPostMessageEvent();\n }\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 this.threadMutationObserver.disconnect();\n\n // Clear global state\n VisualBuilder.VisualBuilderGlobalState.value = {\n previousSelectedEditableDOM: null,\n previousHoveredTargetDOM: null,\n previousEmptyBlockParents: [],\n focusFieldValue: null,\n focusFieldReceivedInput: false,\n audienceMode: false,\n locale: \"en-us\",\n variant: null,\n focusElementObserver: 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":["import_generateThread","initUI","Config","visualBuilderPostMessage","_a"]}
|
|
@@ -5,6 +5,7 @@ interface VisualBuilderGlobalStateImpl {
|
|
|
5
5
|
previousHoveredTargetDOM: Element | null;
|
|
6
6
|
previousEmptyBlockParents: Element[] | [];
|
|
7
7
|
focusFieldValue: string | null;
|
|
8
|
+
focusFieldReceivedInput: boolean;
|
|
8
9
|
audienceMode: boolean;
|
|
9
10
|
locale: string;
|
|
10
11
|
variant: string | null;
|
|
@@ -5,6 +5,7 @@ interface VisualBuilderGlobalStateImpl {
|
|
|
5
5
|
previousHoveredTargetDOM: Element | null;
|
|
6
6
|
previousEmptyBlockParents: Element[] | [];
|
|
7
7
|
focusFieldValue: string | null;
|
|
8
|
+
focusFieldReceivedInput: boolean;
|
|
8
9
|
audienceMode: boolean;
|
|
9
10
|
locale: string;
|
|
10
11
|
variant: string | null;
|
|
@@ -133,9 +133,7 @@ var _VisualBuilder = class _VisualBuilder {
|
|
|
133
133
|
this.resizeObserver
|
|
134
134
|
);
|
|
135
135
|
const emptyBlockParents = Array.from(
|
|
136
|
-
document.querySelectorAll(
|
|
137
|
-
`.${VB_EmptyBlockParentClass}`
|
|
138
|
-
)
|
|
136
|
+
document.querySelectorAll(`.${VB_EmptyBlockParentClass}`)
|
|
139
137
|
);
|
|
140
138
|
const previousEmptyBlockParents = _VisualBuilder.VisualBuilderGlobalState.value.previousEmptyBlockParents;
|
|
141
139
|
if (!isEqual(emptyBlockParents, previousEmptyBlockParents)) {
|
|
@@ -201,6 +199,7 @@ var _VisualBuilder = class _VisualBuilder {
|
|
|
201
199
|
previousHoveredTargetDOM: null,
|
|
202
200
|
previousEmptyBlockParents: [],
|
|
203
201
|
focusFieldValue: null,
|
|
202
|
+
focusFieldReceivedInput: false,
|
|
204
203
|
audienceMode: false,
|
|
205
204
|
locale: "en-us",
|
|
206
205
|
variant: null,
|
|
@@ -334,6 +333,7 @@ _VisualBuilder.VisualBuilderGlobalState = signal({
|
|
|
334
333
|
previousHoveredTargetDOM: null,
|
|
335
334
|
previousEmptyBlockParents: [],
|
|
336
335
|
focusFieldValue: null,
|
|
336
|
+
focusFieldReceivedInput: false,
|
|
337
337
|
audienceMode: false,
|
|
338
338
|
locale: Config.get().stackDetails.masterLocale || "en-us",
|
|
339
339
|
variant: null,
|