children: any -> children: ReactNode (#3061)

We use `children: any` in a bunch of places, but the proper type for
these is `ReactNode`. This diff fixes those.

### Change Type

- [x] `patch` — Bug fix

packages/editor/api-report.md

@@ -26,6 +26,7 @@ import { PointerEventHandler } from 'react';
 import { react } from '@tldraw/state';
 import { default as React_2 } from 'react';
 import * as React_3 from 'react';
+import { ReactNode } from 'react';
 import { SerializedSchema } from '@tldraw/store';
 import { SerializedStore } from '@tldraw/store';
 import { ShapeProps } from '@tldraw/tlschema';
@@ -968,7 +969,7 @@ export class ErrorBoundary extends React_3.Component<React_3.PropsWithRef<React_
 
 // @public (undocumented)
 export function ErrorScreen({ children }: {
-    children: any;
+    children: ReactNode;
 }): JSX_2.Element;
 
 // @public (undocumented)
@@ -1211,7 +1212,7 @@ export function linesIntersect(A: VecLike, B: VecLike, C: VecLike, D: VecLike):
 
 // @public (undocumented)
 export function LoadingScreen({ children }: {
-    children: any;
+    children: ReactNode;
 }): JSX_2.Element;
 
 // @public
@@ -2021,7 +2022,7 @@ export const TldrawEditor: React_2.NamedExoticComponent<TldrawEditorProps>;
 // @public
 export interface TldrawEditorBaseProps {
     autoFocus?: boolean;
-    children?: any;
+    children?: ReactNode;
     className?: string;
     components?: TLEditorComponents;
     inferDarkMode?: boolean;
@@ -2228,7 +2229,7 @@ export type TLHandleProps = {
 
 // @public (undocumented)
 export type TLHandlesProps = {
-    children: any;
+    children: ReactNode;
 };
 
 // @public (undocumented)

packages/editor/api/api.json

@@ -20461,7 +20461,16 @@
             },
             {
               "kind": "Content",
-              "text": "{\n    children: any;\n}"
+              "text": "{\n    children: "
+            },
+            {
+              "kind": "Reference",
+              "text": "ReactNode",
+              "canonicalReference": "@types/react!React.ReactNode:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n}"
             },
             {
               "kind": "Content",
@@ -20483,8 +20492,8 @@
           ],
           "fileUrlPath": "packages/editor/src/lib/TldrawEditor.tsx",
           "returnTypeTokenRange": {
-            "startIndex": 3,
-            "endIndex": 5
+            "startIndex": 5,
+            "endIndex": 7
           },
           "releaseTag": "Public",
           "overloadIndex": 1,
@@ -20493,7 +20502,7 @@
               "parameterName": "{ children }",
               "parameterTypeTokenRange": {
                 "startIndex": 1,
-                "endIndex": 2
+                "endIndex": 4
               },
               "isOptional": false
             }
@@ -24717,7 +24726,16 @@
             },
             {
               "kind": "Content",
-              "text": "{\n    children: any;\n}"
+              "text": "{\n    children: "
+            },
+            {
+              "kind": "Reference",
+              "text": "ReactNode",
+              "canonicalReference": "@types/react!React.ReactNode:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n}"
             },
             {
               "kind": "Content",
@@ -24739,8 +24757,8 @@
           ],
           "fileUrlPath": "packages/editor/src/lib/TldrawEditor.tsx",
           "returnTypeTokenRange": {
-            "startIndex": 3,
-            "endIndex": 5
+            "startIndex": 5,
+            "endIndex": 7
           },
           "releaseTag": "Public",
           "overloadIndex": 1,
@@ -24749,7 +24767,7 @@
               "parameterName": "{ children }",
               "parameterTypeTokenRange": {
                 "startIndex": 1,
-                "endIndex": 2
+                "endIndex": 4
               },
               "isOptional": false
             }
@@ -36359,8 +36377,9 @@
                   "text": "children?: "
                 },
                 {
-                  "kind": "Content",
-                  "text": "any"
+                  "kind": "Reference",
+                  "text": "ReactNode",
+                  "canonicalReference": "@types/react!React.ReactNode:type"
                 },
                 {
                   "kind": "Content",
@@ -38400,7 +38419,16 @@
             },
             {
               "kind": "Content",
-              "text": "{\n    children: any;\n}"
+              "text": "{\n    children: "
+            },
+            {
+              "kind": "Reference",
+              "text": "ReactNode",
+              "canonicalReference": "@types/react!React.ReactNode:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n}"
             },
             {
               "kind": "Content",
@@ -38412,7 +38440,7 @@
           "name": "TLHandlesProps",
           "typeTokenRange": {
             "startIndex": 1,
-            "endIndex": 2
+            "endIndex": 4
           }
         },
         {

packages/editor/src/lib/TldrawEditor.tsx

@@ -2,6 +2,7 @@ import { SerializedStore, Store, StoreSnapshot } from '@tldraw/store'
 import { TLRecord, TLStore } from '@tldraw/tlschema'
 import { Expand, Required, annotateError } from '@tldraw/utils'
 import React, {
+	ReactNode,
 	memo,
 	useCallback,
 	useLayoutEffect,
@@ -66,7 +67,7 @@ export interface TldrawEditorBaseProps {
 	/**
 	 * The component's children.
 	 */
-	children?: any
+	children?: ReactNode
 
 	/**
 	 * An array of shape utils to use in the editor.
@@ -345,7 +346,7 @@ function Layout({
 	onMount,
 	autoFocus,
 }: {
-	children: any
+	children: ReactNode
 	autoFocus: boolean
 	onMount?: TLOnMountHandler
 }) {
@@ -365,12 +366,12 @@ function Crash({ crashingError }: { crashingError: unknown }): null {
 }
 
 /** @public */
-export function LoadingScreen({ children }: { children: any }) {
+export function LoadingScreen({ children }: { children: ReactNode }) {
 	return <div className="tl-loading">{children}</div>
 }
 
 /** @public */
-export function ErrorScreen({ children }: { children: any }) {
+export function ErrorScreen({ children }: { children: ReactNode }) {
 	return <div className="tl-loading">{children}</div>
 }
 

packages/editor/src/lib/components/default-components/DefaultHandles.tsx

@@ -1,6 +1,8 @@
+import { ReactNode } from 'react'
+
 /** @public */
 export type TLHandlesProps = {
-	children: any
+	children: ReactNode
 }
 
 /** @public */

packages/editor/src/lib/hooks/useEditorComponents.tsx

@@ -1,4 +1,4 @@
-import { ComponentType, createContext, useContext, useMemo } from 'react'
+import { ComponentType, ReactNode, createContext, useContext, useMemo } from 'react'
 import { DefaultBackground } from '../components/default-components/DefaultBackground'
 import { DefaultBrush, TLBrushProps } from '../components/default-components/DefaultBrush'
 import {
@@ -95,7 +95,7 @@ const EditorComponentsContext = createContext({} as TLEditorComponents & ErrorCo
 
 type ComponentsContextProviderProps = {
 	overrides?: TLEditorComponents
-	children: any
+	children: ReactNode
 }
 
 export function EditorComponentsProvider({