@contentful/experiences-visual-editor-react 3.1.0-dev-20250807T0841-78e6af6.0 → 3.1.1-beta.0
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/dist/index.d.ts +3 -1
- package/dist/index.js +21 -10
- package/dist/index.js.map +1 -1
- package/dist/renderApp.js +21 -10
- package/dist/renderApp.js.map +1 -1
- package/package.json +4 -5
package/dist/renderApp.js
CHANGED
|
@@ -49768,8 +49768,13 @@ function useEditorSubscriber(inMemoryEntitiesStore) {
|
|
|
49768
49768
|
case INCOMING_EVENTS.RequestEditorMode: {
|
|
49769
49769
|
break;
|
|
49770
49770
|
}
|
|
49771
|
-
default:
|
|
49772
|
-
|
|
49771
|
+
default: {
|
|
49772
|
+
const knownEvents = Object.values(INCOMING_EVENTS);
|
|
49773
|
+
const isDeprecatedMessage = knownEvents.includes(eventData.eventType);
|
|
49774
|
+
if (!isDeprecatedMessage) {
|
|
49775
|
+
console.error(`[experiences-sdk-react::onMessage] Logic error, unsupported eventType: [${eventData.eventType}]`);
|
|
49776
|
+
}
|
|
49777
|
+
}
|
|
49773
49778
|
}
|
|
49774
49779
|
};
|
|
49775
49780
|
window.addEventListener('message', onMessage);
|
|
@@ -50185,10 +50190,14 @@ const EmptyCanvasMessage = () => {
|
|
|
50185
50190
|
const sendCanvasGeometryUpdatedMessage = async (tree, sourceEvent) => {
|
|
50186
50191
|
const nodeToCoordinatesMap = {};
|
|
50187
50192
|
collectNodeCoordinates(tree.root, nodeToCoordinatesMap);
|
|
50193
|
+
const rootRect = document.documentElement.getBoundingClientRect();
|
|
50194
|
+
const bodyRect = document.body.getBoundingClientRect();
|
|
50195
|
+
const width = Math.max(document.documentElement.offsetWidth, rootRect.width, bodyRect.width);
|
|
50196
|
+
const height = Math.max(document.documentElement.offsetHeight, rootRect.height, bodyRect.height);
|
|
50188
50197
|
sendMessage(OUTGOING_EVENTS.CanvasGeometryUpdated, {
|
|
50189
50198
|
size: {
|
|
50190
|
-
width
|
|
50191
|
-
height
|
|
50199
|
+
width,
|
|
50200
|
+
height,
|
|
50192
50201
|
},
|
|
50193
50202
|
nodes: nodeToCoordinatesMap,
|
|
50194
50203
|
sourceEvent,
|
|
@@ -50233,7 +50242,7 @@ function waitForImageToBeLoaded(imageNode) {
|
|
|
50233
50242
|
});
|
|
50234
50243
|
}
|
|
50235
50244
|
|
|
50236
|
-
const useCanvasGeometryUpdates = ({ tree }) => {
|
|
50245
|
+
const useCanvasGeometryUpdates = ({ tree, canvasMode }) => {
|
|
50237
50246
|
const debouncedUpdateGeometry = reactExports.useMemo(() => debounce((tree, sourceEvent) => {
|
|
50238
50247
|
// When the DOM changed, we still need to wait for the next frame to ensure that
|
|
50239
50248
|
// rendering is complete (e.g. this is required when deleting a node).
|
|
@@ -50304,6 +50313,8 @@ const useCanvasGeometryUpdates = ({ tree }) => {
|
|
|
50304
50313
|
}, [allImages, loadedImages, debouncedUpdateGeometry]);
|
|
50305
50314
|
// Delegate scrolling to the canvas
|
|
50306
50315
|
reactExports.useEffect(() => {
|
|
50316
|
+
if (canvasMode !== StudioCanvasMode$2.EDITOR)
|
|
50317
|
+
return;
|
|
50307
50318
|
const onWheel = (e) => {
|
|
50308
50319
|
e.preventDefault();
|
|
50309
50320
|
sendMessage(OUTGOING_EVENTS.CanvasPan, {
|
|
@@ -50317,13 +50328,13 @@ const useCanvasGeometryUpdates = ({ tree }) => {
|
|
|
50317
50328
|
};
|
|
50318
50329
|
document.addEventListener('wheel', onWheel, { passive: false });
|
|
50319
50330
|
return () => document.removeEventListener('wheel', onWheel);
|
|
50320
|
-
}, []);
|
|
50331
|
+
}, [canvasMode]);
|
|
50321
50332
|
};
|
|
50322
50333
|
|
|
50323
|
-
const RootRenderer = ({ inMemoryEntitiesStore }) => {
|
|
50334
|
+
const RootRenderer = ({ inMemoryEntitiesStore, canvasMode }) => {
|
|
50324
50335
|
useEditorSubscriber(inMemoryEntitiesStore);
|
|
50325
50336
|
const tree = useTreeStore((state) => state.tree);
|
|
50326
|
-
useCanvasGeometryUpdates({ tree });
|
|
50337
|
+
useCanvasGeometryUpdates({ tree, canvasMode });
|
|
50327
50338
|
const breakpoints = useTreeStore((state) => state.breakpoints);
|
|
50328
50339
|
const { resolveDesignValue } = useBreakpoints(breakpoints);
|
|
50329
50340
|
// If the root blockId is defined but not the default string, it is the entry ID
|
|
@@ -50372,7 +50383,7 @@ const useInitializeEditor = (inMemoryEntitiesStore) => {
|
|
|
50372
50383
|
return initialized;
|
|
50373
50384
|
};
|
|
50374
50385
|
|
|
50375
|
-
const VisualEditorRoot = ({ experience, inMemoryEntitiesStore: inMemoryEntitiesStore$1 = inMemoryEntitiesStore, }) => {
|
|
50386
|
+
const VisualEditorRoot = ({ experience, inMemoryEntitiesStore: inMemoryEntitiesStore$1 = inMemoryEntitiesStore, canvasMode, }) => {
|
|
50376
50387
|
const initialized = useInitializeEditor(inMemoryEntitiesStore$1);
|
|
50377
50388
|
const setHyperLinkPattern = useEditorStore((state) => state.setHyperLinkPattern);
|
|
50378
50389
|
reactExports.useEffect(() => {
|
|
@@ -50382,7 +50393,7 @@ const VisualEditorRoot = ({ experience, inMemoryEntitiesStore: inMemoryEntitiesS
|
|
|
50382
50393
|
}, [experience?.hyperlinkPattern, setHyperLinkPattern]);
|
|
50383
50394
|
if (!initialized)
|
|
50384
50395
|
return null;
|
|
50385
|
-
return React$1.createElement(RootRenderer, { inMemoryEntitiesStore: inMemoryEntitiesStore$1 });
|
|
50396
|
+
return React$1.createElement(RootRenderer, { inMemoryEntitiesStore: inMemoryEntitiesStore$1, canvasMode: canvasMode });
|
|
50386
50397
|
};
|
|
50387
50398
|
|
|
50388
50399
|
client.createRoot(document.getElementById(VISUAL_EDITOR_CONTAINER_ID)).render(React$1.createElement(React$1.StrictMode, null,
|