@measured/puck 0.18.0-canary.e2139f5 → 0.18.0-canary.f1dec0e

package/dist/index.js

@@ -3588,9 +3588,20 @@ var useContentWithPreview = (content, zoneCompound) => {
       };
     }
   );
+  const {
+    state: {
+      ui: { isDragging }
+    }
+  } = useAppContext();
   const [contentWithPreview, setContentWithPreview] = (0, import_react27.useState)(content);
+  const [localPreview, setLocalPreview] = (0, import_react27.useState)(
+    preview
+  );
   const updateContent = useRenderedCallback(
-    (content2, preview2) => {
+    (content2, preview2, isDragging2) => {
+      if (isDragging2 && !previewExists) {
+        return;
+      }
       if (preview2) {
         if (preview2.type === "insert") {
           setContentWithPreview(
@@ -3620,13 +3631,14 @@ var useContentWithPreview = (content, zoneCompound) => {
           previewExists ? content2.filter((item) => item.props.id !== draggedItemId) : content2
         );
       }
+      setLocalPreview(preview2);
     },
     [draggedItemId, previewExists]
   );
   (0, import_react27.useEffect)(() => {
-    updateContent(content, preview);
-  }, [content, preview]);
-  return contentWithPreview;
+    updateContent(content, preview, isDragging);
+  }, [content, preview, isDragging]);
+  return [contentWithPreview, localPreview];
 };
 
 // components/DropZone/lib/use-drag-axis.ts
@@ -3706,8 +3718,7 @@ var DropZoneEdit = (0, import_react29.forwardRef)(
       isDeepestZone,
       inNextDeepestArea,
       draggedComponentType,
-      userIsDragging,
-      preview
+      userIsDragging
     } = useContextStore(ZoneStoreContext, (s) => {
       var _a, _b, _c;
       return {
@@ -3715,8 +3726,7 @@ var DropZoneEdit = (0, import_react29.forwardRef)(
         inNextDeepestArea: s.nextAreaDepthIndex[areaId || ""],
         draggedItemId: (_b = s.draggedItem) == null ? void 0 : _b.id,
         draggedComponentType: (_c = s.draggedItem) == null ? void 0 : _c.data.componentType,
-        userIsDragging: !!s.draggedItem,
-        preview: s.previewIndex[zoneCompound]
+        userIsDragging: !!s.draggedItem
       };
     });
     const { itemSelector } = appContext2.state.ui;
@@ -3782,7 +3792,10 @@ var DropZoneEdit = (0, import_react29.forwardRef)(
     if (isEnabled) {
       isEnabled = acceptsTarget(draggedComponentType);
     }
-    const contentWithPreview = useContentWithPreview(content, zoneCompound);
+    const [contentWithPreview, preview] = useContentWithPreview(
+      content,
+      zoneCompound
+    );
     const isDropEnabled = isEnabled && (preview ? contentWithPreview.length === 1 : contentWithPreview.length === 0);
     const droppableConfig = {
       id: zoneCompound,

package/dist/index.mjs

@@ -3431,9 +3431,20 @@ var useContentWithPreview = (content, zoneCompound) => {
       };
     }
   );
+  const {
+    state: {
+      ui: { isDragging }
+    }
+  } = useAppContext();
   const [contentWithPreview, setContentWithPreview] = useState15(content);
+  const [localPreview, setLocalPreview] = useState15(
+    preview
+  );
   const updateContent = useRenderedCallback(
-    (content2, preview2) => {
+    (content2, preview2, isDragging2) => {
+      if (isDragging2 && !previewExists) {
+        return;
+      }
       if (preview2) {
         if (preview2.type === "insert") {
           setContentWithPreview(
@@ -3463,13 +3474,14 @@ var useContentWithPreview = (content, zoneCompound) => {
           previewExists ? content2.filter((item) => item.props.id !== draggedItemId) : content2
         );
       }
+      setLocalPreview(preview2);
     },
     [draggedItemId, previewExists]
   );
   useEffect12(() => {
-    updateContent(content, preview);
-  }, [content, preview]);
-  return contentWithPreview;
+    updateContent(content, preview, isDragging);
+  }, [content, preview, isDragging]);
+  return [contentWithPreview, localPreview];
 };
 
 // components/DropZone/lib/use-drag-axis.ts
@@ -3549,8 +3561,7 @@ var DropZoneEdit = forwardRef3(
       isDeepestZone,
       inNextDeepestArea,
       draggedComponentType,
-      userIsDragging,
-      preview
+      userIsDragging
     } = useContextStore(ZoneStoreContext, (s) => {
       var _a, _b, _c;
       return {
@@ -3558,8 +3569,7 @@ var DropZoneEdit = forwardRef3(
         inNextDeepestArea: s.nextAreaDepthIndex[areaId || ""],
         draggedItemId: (_b = s.draggedItem) == null ? void 0 : _b.id,
         draggedComponentType: (_c = s.draggedItem) == null ? void 0 : _c.data.componentType,
-        userIsDragging: !!s.draggedItem,
-        preview: s.previewIndex[zoneCompound]
+        userIsDragging: !!s.draggedItem
       };
     });
     const { itemSelector } = appContext2.state.ui;
@@ -3625,7 +3635,10 @@ var DropZoneEdit = forwardRef3(
     if (isEnabled) {
       isEnabled = acceptsTarget(draggedComponentType);
     }
-    const contentWithPreview = useContentWithPreview(content, zoneCompound);
+    const [contentWithPreview, preview] = useContentWithPreview(
+      content,
+      zoneCompound
+    );
     const isDropEnabled = isEnabled && (preview ? contentWithPreview.length === 1 : contentWithPreview.length === 0);
     const droppableConfig = {
       id: zoneCompound,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@measured/puck",
-  "version": "0.18.0-canary.e2139f5",
+  "version": "0.18.0-canary.f1dec0e",
   "author": "Measured Corporation Ltd <hello@measured.co>",
   "repository": "measuredco/puck",
   "bugs": "https://github.com/measuredco/puck/issues",