transfer-out: transfer out

packages/ui/src/lib/hooks/useHighDpiCanvas.ts

@@ -0,0 +1,14 @@
+import { useLayoutEffect } from 'react'
+
+/** @public */
+export function useHighDpiCanvas(ref: React.RefObject<HTMLCanvasElement>, dpr: number) {
+	// Match the resolution of the client
+	useLayoutEffect(() => {
+		const canvas = ref.current
+		if (!canvas) return
+
+		const rect = canvas.getBoundingClientRect()
+		canvas.width = rect.width * dpr
+		canvas.height = rect.height * dpr
+	}, [ref, dpr])
+}