<script>
import Moveable from "vue3-moveable";

export default {
    components: { Moveable },
    setup() {
        const onRender = e => {
            e.target.style.cssText += e.cssText;
        };
        return { document, onRender };
    }
};
</script>
<template>
    <div
        class="root"
        style="transform-origin: 0 0;transform: scale(0.5);"
    >
        <div class="container">
            <div
                style="position: relative;transform: translate3d(0px, 0px, 100px);"
            >
                <div
                    class="target"
                    style="transform: translate(0px, 0px);"
                >Target</div>
                <Moveable
                    :target="'.target'"
                    :draggable="true"
                    :rotatable="true"
                    :rootContainer="document.body"
                    @render="onRender"
                ></Moveable>
            </div>
        </div>
    </div>
</template>