From c48a56b997cc7f393df8d49ac199562cb3596878 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Thu, 28 Oct 2021 15:52:07 +0100
Subject: [PATCH] Fix issue editing components in the preview when nested
 inside another draggable component

---
 packages/client/src/components/Component.svelte | 3 ++-
 packages/client/src/utils/styleable.js          | 2 +-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/client/src/components/Component.svelte b/packages/client/src/components/Component.svelte
index 8200812477..04c62b56f4 100644
--- a/packages/client/src/components/Component.svelte
+++ b/packages/client/src/components/Component.svelte
@@ -67,7 +67,8 @@
   $: renderKey = `${propsHash}-${emptyState}`
   $: editable = definition.editable
   $: editing = editable && selected && $builderStore.editMode
-  $: draggable = interactive && !isLayout && !isScreen && !editing
+  $: draggable =
+    interactive && !isLayout && !isScreen && !$builderStore.editMode
   $: droppable = interactive && !isLayout && !isScreen
 
   // Update component context
diff --git a/packages/client/src/utils/styleable.js b/packages/client/src/utils/styleable.js
index 00500aab4a..040da0abbf 100644
--- a/packages/client/src/utils/styleable.js
+++ b/packages/client/src/utils/styleable.js
@@ -42,7 +42,7 @@ export const styleable = (node, styles = {}) => {
     }
 
     // Allow dragging if required
-    node.setAttribute("draggable", !!styles.draggable)
+    node.setAttribute("draggable", !!newStyles.draggable)
 
     // Applies a style string to a DOM node
     const applyStyles = styleString => {