Only explode components when dragging over them
This commit is contained in:
parent
bb8388133a
commit
c4bb3ac014
|
@ -98,8 +98,8 @@
|
||||||
$: selected =
|
$: selected =
|
||||||
$builderStore.inBuilder && $builderStore.selectedComponentId === id
|
$builderStore.inBuilder && $builderStore.selectedComponentId === id
|
||||||
$: inSelectedPath = $componentStore.selectedComponentPath?.includes(id)
|
$: inSelectedPath = $componentStore.selectedComponentPath?.includes(id)
|
||||||
$: isDndParent = $componentStore.dndParent === id
|
|
||||||
$: inDragPath = inSelectedPath && $builderStore.editMode
|
$: inDragPath = inSelectedPath && $builderStore.editMode
|
||||||
|
$: inDndPath = $componentStore.dndPath?.includes(id)
|
||||||
|
|
||||||
// Derive definition properties which can all be optional, so need to be
|
// Derive definition properties which can all be optional, so need to be
|
||||||
// coerced to booleans
|
// coerced to booleans
|
||||||
|
@ -457,7 +457,7 @@
|
||||||
class:interactive
|
class:interactive
|
||||||
class:editing
|
class:editing
|
||||||
class:block={isBlock}
|
class:block={isBlock}
|
||||||
class:explode={interactive && hasChildren && $builderStore.isDragging}
|
class:explode={interactive && hasChildren && inDndPath}
|
||||||
class:placeholder={id === "placeholder"}
|
class:placeholder={id === "placeholder"}
|
||||||
data-id={id}
|
data-id={id}
|
||||||
data-name={name}
|
data-name={name}
|
||||||
|
|
|
@ -39,6 +39,8 @@ const createComponentStore = () => {
|
||||||
// Derive the selected component path
|
// Derive the selected component path
|
||||||
const selectedPath =
|
const selectedPath =
|
||||||
findComponentPathById(asset?.props, selectedComponentId) || []
|
findComponentPathById(asset?.props, selectedComponentId) || []
|
||||||
|
const dndPath =
|
||||||
|
findComponentPathById(asset?.props, $builderState.dndParent) || []
|
||||||
|
|
||||||
return {
|
return {
|
||||||
customComponentManifest: $store.customComponentManifest,
|
customComponentManifest: $store.customComponentManifest,
|
||||||
|
@ -49,6 +51,7 @@ const createComponentStore = () => {
|
||||||
selectedComponentPath: selectedPath?.map(component => component._id),
|
selectedComponentPath: selectedPath?.map(component => component._id),
|
||||||
mountedComponentCount: Object.keys($store.mountedComponents).length,
|
mountedComponentCount: Object.keys($store.mountedComponents).length,
|
||||||
currentAsset: asset,
|
currentAsset: asset,
|
||||||
|
dndPath: dndPath?.map(component => component._id),
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
Loading…
Reference in New Issue