<script setup lang="ts">
const rect = useSelectionRect();
const left = computed(() => Math.min(rect.a.x, rect.b.x));
const top = computed(() => Math.min(rect.a.y, rect.b.y));
const width = computed(() => Math.abs(rect.a.x - rect.b.x));
const height = computed(() => Math.abs(rect.a.y - rect.b.y));
</script>

<template>
    <div
        v-if="rect.enabled && rect.isMinSize()"
        class="bg-primary/20 pointer-events-none absolute z-50"
        :style="`left: ${left}px; top: ${top}px; width: ${width}px; height: ${height}px;`"
    ></div>
</template>
