core-api: pass ReactNode as parent to collectors

packages/core-api/src/extensions/traversal.ts

@@ -23,7 +23,7 @@ export type Collector<Result, Context> = () => {
   visit(
     accumulator: Result,
     element: ReactElement,
-    parent: ReactElement,
+    parent: ReactElement | undefined,
     context: Context,
   ): Context;
 };
@@ -33,7 +33,7 @@ export type Collector<Result, Context> = () => {
  * varying methods to discover child nodes and collect data along the way.
  */
 export function traverseElementTree<Results>(options: {
-  root: ReactElement;
+  root: ReactNode;
   discoverers: Discoverer[];
   collectors: { [name in keyof Results]: Collector<Results[name], any> };
 }): Results {
@@ -52,14 +52,14 @@ export function traverseElementTree<Results>(options: {
   // Internal representation of an element in the tree that we're iterating over
   type QueueItem = {
     node: ReactNode;
-    parent: ReactElement;
+    parent: ReactElement | undefined;
     contexts: { [name in string]: unknown };
   };
 
   const queue = [
     {
       node: Children.toArray(options.root),
-      parent: options.root,
+      parent: undefined,
       contexts: {},
     } as QueueItem,
   ];

packages/core-api/src/routing/collectors.tsx

@@ -33,7 +33,7 @@ function getMountPoint(node: ReactElement): RouteRef | undefined {
 export const routePathCollector = createCollector(
   () => new Map<RouteRef, string>(),
   (acc, node, parent) => {
-    if (parent.props.element === node) {
+    if (parent?.props.element === node) {
       return;
     }
 
@@ -51,7 +51,7 @@ export const routePathCollector = createCollector(
 export const routeParentCollector = createCollector(
   () => new Map<RouteRef, RouteRef | undefined>(),
   (acc, node, parent, parentRouteRef?: RouteRef) => {
-    if (parent.props.element === node) {
+    if (parent?.props.element === node) {
       return parentRouteRef;
     }
 
@@ -70,7 +70,7 @@ export const routeParentCollector = createCollector(
 export const routeObjectCollector = createCollector(
   () => Array<BackstageRouteObject>(),
   (acc, node, parent, parentChildArr: BackstageRouteObject[] = acc) => {
-    if (parent.props.element === node) {
+    if (parent?.props.element === node) {
       return parentChildArr;
     }