@contentstack/live-preview-utils
Version:
Contentstack provides the Live Preview SDK to establish a communication channel between the various Contentstack SDKs and your website, transmitting live changes to the preview pane.
1 lines • 25.2 kB
Source Map (JSON)
{"version":3,"sources":["../../../../src/visualBuilder/utils/updateFocussedState.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport { extractDetailsFromCslp } from \"../../cslp\";\nimport { getAddInstanceButtons } from \"../generators/generateAddInstanceButtons\";\nimport {\n addFocusOverlay,\n hideFocusOverlay,\n} from \"../generators/generateOverlay\";\nimport { hideHoverOutline } from \"../listeners/mouseHover\";\nimport { getEntryPermissionsCached } from \"./getEntryPermissionsCached\";\nimport {\n LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX,\n RIGHT_EDGE_BUFFER,\n TOOLBAR_EDGE_BUFFER,\n TOP_EDGE_BUFFER,\n} from \"./constants\";\nimport { FieldSchemaMap } from \"./fieldSchemaMap\";\nimport getChildrenDirection from \"./getChildrenDirection\";\nimport { getPsuedoEditableElementStyles } from \"./getPsuedoEditableStylesElement\";\nimport { isFieldDisabled } from \"./isFieldDisabled\";\n\ninterface ToolbarPositionParams {\n focusedToolbar: HTMLElement | null;\n selectedElementDimension: DOMRect;\n}\n/**\n * Adjust the position of the field toolbar instead of clearing the innerhtml fo the focused toolbar.\n * By doing this, can avoid the re-rendering of the focus field toolbar.\n */\nfunction positionToolbar({\n focusedToolbar,\n selectedElementDimension,\n}: ToolbarPositionParams): void {\n if (focusedToolbar) {\n const targetElementRightEdgeOffset =\n window.scrollX + window.innerWidth - selectedElementDimension.left;\n const distanceFromTop =\n selectedElementDimension.top + window.scrollY - TOOLBAR_EDGE_BUFFER;\n\n // Adjust top position based on the available space\n const adjustedDistanceFromTop =\n selectedElementDimension.top + window.scrollY < TOP_EDGE_BUFFER\n ? distanceFromTop +\n selectedElementDimension.height +\n TOP_EDGE_BUFFER\n : distanceFromTop;\n\n const distanceFromLeft =\n selectedElementDimension.left - LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX;\n const adjustedDistanceFromLeft = Math.max(\n distanceFromLeft,\n TOOLBAR_EDGE_BUFFER\n );\n\n // Handle right-edge overflow\n if (\n targetElementRightEdgeOffset < RIGHT_EDGE_BUFFER &&\n (focusedToolbar.style.justifyContent !== \"flex-end\" ||\n focusedToolbar.style.left !==\n `${selectedElementDimension.right + LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX}px`)\n ) {\n focusedToolbar.style.justifyContent = \"flex-end\";\n focusedToolbar.style.left = `${selectedElementDimension.right + LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX}px`;\n } else if (\n focusedToolbar.style.justifyContent !== \"flex-start\" ||\n focusedToolbar.style.left !== `${adjustedDistanceFromLeft}px`\n ) {\n focusedToolbar.style.justifyContent = \"flex-start\"; // Default\n focusedToolbar.style.left = `${adjustedDistanceFromLeft}px`;\n }\n\n // Adjust top position if necessary\n if (focusedToolbar.style.top !== `${adjustedDistanceFromTop}px`) {\n focusedToolbar.style.top = `${adjustedDistanceFromTop}px`;\n }\n }\n}\n\n/**\n * This function can be used to re-draw/update the focussed state of an element.\n * The focussed state includes the overlay, psuedo-editable, toolbar, and multiple\n * instance add buttons. It is similar to handleBuilderInteraction but it does not\n * create new elements, it just updates the existing ones whenever possible.\n * NOTE: breakdown this function into multiple functions when the need arises\n */\nexport async function updateFocussedState({\n editableElement,\n visualBuilderContainer,\n overlayWrapper,\n focusedToolbar,\n resizeObserver,\n}: {\n editableElement: HTMLElement | null;\n visualBuilderContainer: HTMLDivElement | null;\n overlayWrapper: HTMLDivElement | null;\n focusedToolbar: HTMLDivElement | null;\n resizeObserver: ResizeObserver | null;\n}): Promise<void> {\n let previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n if (\n !visualBuilderContainer ||\n !editableElement ||\n !previousSelectedEditableDOM ||\n !overlayWrapper\n ) {\n return;\n }\n\n // prefer data-cslp-unique-id when available else use data-cslp.\n // unique ID is added on click when multiple elements with same\n // data-cslp are found.\n const previousSelectedElementCslp =\n editableElement?.getAttribute(\"data-cslp\") || \"\";\n const previousSelectedElementCslpUniqueId =\n previousSelectedEditableDOM?.getAttribute(\"data-cslp-unique-id\");\n const newPreviousSelectedElement =\n document.querySelector(\n `[data-cslp-unique-id=\"${previousSelectedElementCslpUniqueId}\"]`\n ) ||\n document.querySelector(`[data-cslp=\"${previousSelectedElementCslp}\"]`);\n if (!newPreviousSelectedElement && resizeObserver) {\n hideFocusOverlay({\n visualBuilderOverlayWrapper: overlayWrapper,\n focusedToolbar,\n visualBuilderContainer,\n resizeObserver,\n noTrigger: true,\n });\n return;\n }\n if (newPreviousSelectedElement !== previousSelectedEditableDOM) {\n previousSelectedEditableDOM = newPreviousSelectedElement as HTMLElement;\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n previousSelectedEditableDOM;\n }\n\n const cslp = editableElement?.getAttribute(\"data-cslp\") || \"\";\n const fieldMetadata = extractDetailsFromCslp(cslp);\n\n hideHoverOutline(visualBuilderContainer);\n\n // in every case, this function will bring cached values\n // and this should be quick\n const fieldSchema = await FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n );\n const entryAcl = await getEntryPermissionsCached({\n entryUid: fieldMetadata.entry_uid,\n contentTypeUid: fieldMetadata.content_type_uid,\n locale: fieldMetadata.locale,\n });\n const { isDisabled } = isFieldDisabled(\n fieldSchema,\n { editableElement, fieldMetadata },\n entryAcl\n );\n addFocusOverlay(previousSelectedEditableDOM, overlayWrapper, isDisabled);\n\n // update psuedo editable element if present\n const psuedoEditableElement = visualBuilderContainer.querySelector(\n \".visual-builder__pseudo-editable-element\"\n ) as HTMLElement;\n if (psuedoEditableElement) {\n const styles = getPsuedoEditableElementStyles(editableElement);\n const styleString = Object.entries(styles).reduce(\n (acc, [key, value]) => {\n return `${acc}${key}:${value};`;\n },\n \"\"\n );\n psuedoEditableElement.style.cssText = styleString;\n // since we are copying styles from the editableEl\n // it will now have a visibility of hidden, which we added\n // when creating the pseudo editable element, so make the psuedo visible\n psuedoEditableElement.style.visibility = \"visible\";\n }\n\n const targetElementDimension = editableElement.getBoundingClientRect();\n if (targetElementDimension.width && targetElementDimension.height) {\n const selectedElement =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n\n if (!selectedElement) return;\n // position the focused tool bar\n positionToolbar({\n focusedToolbar: focusedToolbar,\n selectedElementDimension: selectedElement.getBoundingClientRect(),\n });\n }\n\n // re-add multiple instance add buttons\n const buttons = getAddInstanceButtons(visualBuilderContainer);\n const parentCslpValue =\n fieldMetadata.multipleFieldMetadata?.parentDetails?.parentCslpValue;\n if (\n buttons &&\n parentCslpValue &&\n buttons.length > 1 &&\n buttons[0] &&\n buttons[1]\n ) {\n const [previousButton, nextButton] = buttons;\n const direction = getChildrenDirection(\n editableElement,\n parentCslpValue\n );\n const targetDOMDimension = editableElement.getBoundingClientRect();\n\n if (direction === \"horizontal\") {\n const middleHeight =\n targetDOMDimension.top +\n (targetDOMDimension.bottom - targetDOMDimension.top) / 2 +\n window.scrollY;\n previousButton.style.left = `${targetDOMDimension.left}px`;\n previousButton.style.top = `${middleHeight}px`;\n\n nextButton.style.left = `${targetDOMDimension.right}px`;\n nextButton.style.top = `${middleHeight}px`;\n } else if (direction === \"vertical\") {\n const middleWidth =\n targetDOMDimension.left +\n (targetDOMDimension.right - targetDOMDimension.left) / 2;\n previousButton.style.left = `${middleWidth}px`;\n previousButton.style.top = `${\n targetDOMDimension.top + window.scrollY\n }px`;\n\n nextButton.style.left = `${middleWidth}px`;\n nextButton.style.top = `${\n targetDOMDimension.bottom + window.scrollY\n }px`;\n }\n }\n}\n\n/**\n * This function is used to resize/reposition focus overlay and toolbar due to a\n * mutation in the DOM or due to changes in a different field (other than the focussed field).\n */\nexport function updateFocussedStateOnMutation(\n focusOverlayWrapper: HTMLDivElement | null,\n focusedToolbar: HTMLDivElement | null,\n visualBuilderContainer: HTMLDivElement | null,\n resizeObserver: ResizeObserver | null\n) {\n if (!focusOverlayWrapper) return;\n\n let selectedElement =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n if (!selectedElement) return;\n\n const selectedElementCslp = selectedElement?.getAttribute(\"data-cslp\");\n const selectedElementCslpUniqueId = selectedElement?.getAttribute(\n \"data-cslp-unique-id\"\n );\n const newSelectedElement =\n document.querySelector(\n `[data-cslp-unique-id=\"${selectedElementCslpUniqueId}\"]`\n ) || document.querySelector(`[data-cslp=\"${selectedElementCslp}\"]`);\n if (!newSelectedElement && resizeObserver) {\n hideFocusOverlay({\n visualBuilderOverlayWrapper: focusOverlayWrapper,\n focusedToolbar,\n visualBuilderContainer,\n resizeObserver,\n noTrigger: true,\n });\n return;\n }\n\n if (newSelectedElement !== selectedElement) {\n selectedElement = newSelectedElement as HTMLElement;\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n selectedElement;\n }\n\n const selectedElementDimension = selectedElement.getBoundingClientRect();\n\n /**\n * Update the focus outline if it exists.\n */\n const focusOutline = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--outline\"\n );\n\n if (focusOutline) {\n const focusOutlineDimension = focusOutline.getBoundingClientRect();\n if (!isSameRect(selectedElementDimension, focusOutlineDimension)) {\n focusOutline.style.top = `${selectedElementDimension.top + window.scrollY}px`;\n focusOutline.style.left = `${selectedElementDimension.left}px`;\n focusOutline.style.width = `${selectedElementDimension.width}px`;\n focusOutline.style.height = `${selectedElementDimension.height}px`;\n }\n }\n\n /**\n * Update the focus overlays if they exists.\n */\n\n const focusedOverlayTop = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--top\"\n );\n const focusedOverlayBottom =\n focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--bottom\"\n );\n const focusedOverlayLeft =\n focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--left\"\n );\n const focusedOverlayRight =\n focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--right\"\n );\n\n const distanceFromTop = selectedElementDimension.top + window.scrollY;\n\n if (focusedOverlayTop) {\n const dimension = focusedOverlayTop.getBoundingClientRect();\n if (dimension.height !== distanceFromTop) {\n focusedOverlayTop.style.height = `calc(${distanceFromTop}px)`;\n }\n }\n\n if (focusedOverlayBottom) {\n const dimension = focusedOverlayBottom.getBoundingClientRect();\n if (\n dimension.top !== selectedElementDimension.bottom ||\n dimension.height !==\n window.document.body.scrollHeight -\n selectedElementDimension.bottom -\n window.scrollY\n ) {\n focusedOverlayBottom.style.top = `${\n selectedElementDimension.bottom + window.scrollY\n }px`;\n focusedOverlayBottom.style.height = `${\n window.document.body.scrollHeight -\n selectedElementDimension.bottom -\n window.scrollY\n }px`;\n }\n }\n\n if (focusedOverlayLeft) {\n const dimension = focusedOverlayLeft.getBoundingClientRect();\n if (\n dimension.top + window.scrollY !== distanceFromTop ||\n dimension.height !== selectedElementDimension.height ||\n dimension.width !== selectedElementDimension.left\n ) {\n focusedOverlayLeft.style.top = `${distanceFromTop}px`;\n focusedOverlayLeft.style.height = `${selectedElementDimension.height}px`;\n focusedOverlayLeft.style.width = `${selectedElementDimension.left}px`;\n }\n }\n\n if (focusedOverlayRight) {\n const dimension = focusedOverlayRight.getBoundingClientRect();\n if (\n dimension.left !== selectedElementDimension.right ||\n dimension.top + window.scrollY !== distanceFromTop ||\n dimension.height !== selectedElementDimension.height ||\n dimension.width !==\n document.documentElement.clientWidth -\n selectedElementDimension.right\n ) {\n focusedOverlayRight.style.left = `${selectedElementDimension.right}px`;\n focusedOverlayRight.style.top = `${distanceFromTop}px`;\n focusedOverlayRight.style.height = `${selectedElementDimension.height}px`;\n focusedOverlayRight.style.width = `${\n document.documentElement.clientWidth -\n selectedElementDimension.right\n }px`;\n }\n }\n\n /**\n * Update the focus toolbar if it exists.\n */\n\n if (focusedToolbar) {\n const targetElementRightEdgeOffset =\n window.scrollX + window.innerWidth - selectedElementDimension.left;\n const distanceFromTop =\n selectedElementDimension.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 selectedElementDimension.top + window.scrollY < TOP_EDGE_BUFFER\n ? distanceFromTop +\n selectedElementDimension.height +\n TOP_EDGE_BUFFER\n : distanceFromTop;\n\n const distanceFromLeft =\n selectedElementDimension.left - LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX;\n const adjustedDistanceFromLeft = Math.max(\n distanceFromLeft,\n TOOLBAR_EDGE_BUFFER\n );\n\n if (\n targetElementRightEdgeOffset < RIGHT_EDGE_BUFFER &&\n (focusedToolbar.style.justifyContent !== \"flex-end\" ||\n focusedToolbar.style.left !==\n `${\n selectedElementDimension.right +\n LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX\n }px`)\n ) {\n // Overflow / Cutoff on right edge\n focusedToolbar.style.justifyContent = \"flex-end\";\n focusedToolbar.style.left = `${\n selectedElementDimension.right +\n LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX\n }px`;\n } else if (\n focusedToolbar.style.justifyContent !== \"flex-start\" ||\n focusedToolbar.style.left !== `${adjustedDistanceFromLeft}px`\n ) {\n focusedToolbar.style.justifyContent = \"flex-start\"; // default\n focusedToolbar.style.left = `${adjustedDistanceFromLeft}px`;\n }\n\n if (focusedToolbar.style.top !== `${adjustedDistanceFromTop}px`) {\n focusedToolbar.style.top = `${adjustedDistanceFromTop}px`;\n }\n }\n\n /**\n * Update the pseudo-editable if it exists.\n */\n\n if (visualBuilderContainer) {\n const psuedoEditableElement = visualBuilderContainer.querySelector(\n \".visual-builder__pseudo-editable-element\"\n ) as HTMLElement;\n const editableElement = selectedElement as HTMLElement;\n const styles = getPsuedoEditableElementStyles(editableElement);\n const styleString = Object.entries(styles).reduce(\n (acc, [key, value]) => {\n return `${acc}${key}:${value};`;\n },\n \"\"\n );\n if (\n psuedoEditableElement &&\n (psuedoEditableElement.style.cssText !== styleString ||\n psuedoEditableElement.style.visibility !== \"visible\")\n ) {\n psuedoEditableElement.style.cssText = styleString;\n // since we are copying styles from the editableEl\n // it will now have a visibility of hidden, which we added\n // when creating the pseudo editable element, so make the psuedo visible\n psuedoEditableElement.style.visibility = \"visible\";\n }\n }\n}\n\nfunction isSameRect(rect1: DOMRect, rect2: DOMRect) {\n return (\n rect1.top === rect2.top &&\n rect1.left === rect2.left &&\n rect1.width === rect2.width &&\n rect1.height === rect2.height\n );\n}\n"],"mappings":"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","names":["getChildrenDirection","distanceFromTop"]}