All files / src/components/modal/layouts WebGLClipPathRect.vue

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
<template>
  <rect
    :x="layout.x"
    :y="layout.y"
    :width="layout.width"
    :height="layout.height"
    :rx="radius"
    :ry="radius"
  />
</template>
 
<script setup lang="ts">
import { AnchorPoint } from '@3cr/types-ts';
import { toRefs } from 'vue';
import { useActiveLayout } from '@/components/modal/layouts/composables/useActiveLayout';
 
interface Props {
  anchor: AnchorPoint;
  canvas: HTMLCanvasElement;
  padding?: number;
  radius?: number;
}
 
const props = withDefaults(defineProps<Props>(), {
  padding: 8,
  radius: 8,
});
 
const { anchor, canvas, padding } = toRefs(props);
const { layout } = useActiveLayout(anchor, canvas, padding);
</script>