Canvas[size] prop -- manual size

Author: abernier

packages/fiber/src/web/Canvas.tsx

@@ -15,9 +15,7 @@ import { ReconcilerRoot, extend, createRoot, unmountComponentAtNode, RenderProps
 import { createPointerEvents } from './events'
 import { DomEvent } from '../core/events'
 
-export interface CanvasProps
-  extends Omit<RenderProps<HTMLCanvasElement>, 'size'>,
-    React.HTMLAttributes<HTMLDivElement> {
+export interface CanvasProps extends RenderProps<HTMLCanvasElement>, React.HTMLAttributes<HTMLDivElement> {
   children?: React.ReactNode
   ref?: React.Ref<HTMLCanvasElement>
   /** Canvas fallback content, similar to img's alt prop */
@@ -37,6 +35,7 @@ function CanvasImpl({
   ref,
   children,
   fallback,
+  size: manualSize,
   resize,
   style,
   gl,
@@ -83,7 +82,8 @@ function CanvasImpl({
 
   useIsomorphicLayoutEffect(() => {
     const canvas = canvasRef.current
-    if (containerRect.width > 0 && containerRect.height > 0 && canvas) {
+    const size = manualSize ?? containerRect
+    if (size.width > 0 && size.height > 0 && canvas) {
       if (!root.current) root.current = createRoot<HTMLCanvasElement>(canvas)
 
       async function run() {
@@ -101,7 +101,7 @@ function CanvasImpl({
           performance,
           raycaster,
           camera,
-          size: containerRect,
+          size,
           // Pass mutable reference to onPointerMissed so it's free to update
           onPointerMissed: (...args) => handlePointerMissed.current?.(...args),
           onCreated: (state) => {