<template>
	<canvas
		:canvas-id="canvasId"
		class="laser-batch-canvas"
		:style="{ width: widthPx + 'px', height: heightPx + 'px' }"
	/>
</template>

<script setup>
import { LASER_BATCH_CANVAS_SIZE } from '@/utils/laser-card/laserBatchExport.js'

defineProps({
	canvasId: {
		type: String,
		default: 'laserBatchCanvas',
	},
	widthPx: {
		type: Number,
		default: LASER_BATCH_CANVAS_SIZE.w,
	},
	heightPx: {
		type: Number,
		default: LASER_BATCH_CANVAS_SIZE.h,
	},
})
</script>

<style scoped>
.laser-batch-canvas {
	position: fixed;
	left: -9999px;
	top: -9999px;
	opacity: 0;
	pointer-events: none;
}
</style>
