fix makeCanvas() flush problem

src/kaboom.ts

@@ -1482,7 +1482,21 @@ export default (gopt: KaboomOpt = {}): KaboomCtx => {
 	}
 
 	function makeCanvas(w: number, h: number) {
-		return new FrameBuffer(ggl, w, h)
+		const fb = new FrameBuffer(ggl, w, h)
+		return {
+			clear: () => fb.clear(),
+			free: () => fb.free(),
+			toDataURL: () => fb.toDataURL(),
+			toImageData: () => fb.toImageData(),
+			width: fb.width,
+			height: fb.height,
+			draw: (action) => {
+				fb.bind()
+				action()
+				flush()
+				fb.unbind()
+			},
+		}
 	}
 
 	function makeShader(

src/types.ts

@@ -2286,7 +2286,7 @@ export interface KaboomCtx {
 	 *
 	 * @since v3000.2
 	 */
-	makeCanvas(w: number, h: number): FrameBuffer
+	makeCanvas(w: number, h: number): Canvas
 	/**
 	 * @section Debug
 	 *
@@ -3226,6 +3226,16 @@ export declare class FrameBuffer {
 	free(): void
 }
 
+export type Canvas = {
+	width: number
+	height: number
+	toImageData(): ImageData
+	toDataURL(): string
+	clear(): void
+	draw(action: () => void): void
+	free(): void
+}
+
 export interface GfxFont {
 	tex: Texture,
 	map: Record<string, Quad>,