Element Guideline Problem of Moveables when using Selecto

[thomaslic]

Environments

• Framework name: Vanilla JS
• Component name: Moveable and Selecto
• Component version: Moveable: 0.40.1; Selecto: 1.20.3

Description

Hello

I am using Selecto in combination with Moveable and I wondered if there is a way to only show Element Guidelines of other Moveables and not the "selected" moveable?

Example: when you look at the use case below, I dragged the selected element from position "1" to position "2" and I don't want to see the Element Guidelines to position "1" since there is no element on that position anymore.

I got it to work when using Moveable alone by removing the dragged Moveable Target HTML-element from the Moveables elementGuideline array. In combination with Selecto, this approach does not seem to work, since the Target of a Moveable can be "undefined".

I also tried it in the example you provided in the Storybook, but i didnt manage to do it.

I wondered if you could take a look into that and maybe provide a simple example for it. Thanks for your help!

[daybrush]

@thomaslic

When setting elementGuidelines, I made sure to exclude only targets.

https://github.com/daybrush/scena/blob/4bcb4f9ff58b711df22f9673da4e352270baf51e/packages/react-editor/src/Editor/components/MoveableManager.tsx#L56-L60

const flattenSelectedLayers = layerManager.toFlatten(selectedLayers);
const elementGuidelines: Array<ElementGuidelineValueOption | MoveableRefType<Element>> = [
    ".scena-viewport",
    ...layers.filter(layer => !flattenSelectedLayers.includes(layer)).map(layer => layer.ref),
];