在Svelte 5中结合interact.js实现拖拽克隆元素时无法传递拖拽动作的问题求助

我现在在用interact.js搭配Svelte 5（版本是5.0.0-next.200）做一个拖拽功能：目标元素一开始放在一个可滚动的div里，必须拖到这个div外面才能完成放置。据我所知这种场景只能先克隆元素，然后拖拽克隆体，没别的办法绕过去。

之前在一个原生JS项目里，我已经成功实现过类似逻辑，但到了Svelte里就怎么都跑不通了。

下面是我的代码，我怀疑问题出在interaction.start({ name: 'drag' }, ev.interactable, clone);这一行——它好像没办法把拖拽动作传递给克隆出来的元素。

我已经卡这个问题好几天了，真心求各位帮忙看看！

<script>
    import interact from 'interactjs';

    const dragElement = (ev) => {
        const el = ev.target;
        let x = (parseFloat(el.getAttribute('data-x')) || 0) + ev.dx;
        let y = (parseFloat(el.getAttribute('data-y')) || 0) + ev.dy;

        el.style.transform = `translate(${x}px, ${y}px)`;
        el.setAttribute('data-x', x);
        el.setAttribute('data-y', y);
    };

    const dragStart = (ev) => {
        const el = ev.target;
        const clone = el.cloneNode(true);
        
        clone.style.position = 'fixed';
        clone.style.zIndex = '1000';
        clone.style.pointerEvents = 'none';
        document.body.appendChild(clone);

        // 我猜测问题出在这里
        ev.interaction.start({ name: 'drag' }, ev.interactable, clone);
    };

    interact('.draggable')
        .draggable({
            inertia: true,
            listeners: {
                start: dragStart,
                move: dragElement,
            }
        });
</script>

<div class="scrollable-container">
    <div class="draggable">拖拽我到外面</div>
</div>

备注：内容来源于stack exchange，提问作者The_Lab