/**
 * A visitor that renders AppNodes as React elements.
 * 
 * Unlike other visitors in render-tree/visitors/, this visitor is
 * React-specific and located in components/ to maintain dependency
 * boundaries.
 * 
 * This visitor accumulates React elements in a mutable array and tracks
 * rendered element IDs to prevent duplicate rendering of widgets.
 * 
 * Usage:
 * ```typescript
 * const elements = RenderNodeVisitor.collectReactElements(props, disableFullscreen)
 * return <>{elements}</>
 * ```
 */

private getCurrentKey(elementId?: string): string {
  const key = elementId || this.index.toString()
  // Increment this.index to be used for the next key
  this.index += 1
  // return the current key
  return key
}

visitBlockNode(node: BlockNode): OptionalReactElement {
  // ...
  const key = this.getCurrentKey()  // Block has no element ID
  // ...
}

visitElementNode(node: ElementNode): OptionalReactElement {
  // ...
  const key = this.getCurrentKey(getElementId(node.element))  // With element ID
  // ...
}

/**
 * Convenience method to render all children of a block as React elements.
 * 
 * This is the primary entry point for rendering - it creates a visitor,
 * traverses all children, and returns the accumulated React elements.
 * 
 * @param props - Block props containing the node to render
 * @param disableFullscreenMode - Whether to disable fullscreen mode for elements
 * @returns Array of React elements ready to render (may include nulls for duplicates)
 * 
 * @example
 * const ChildRenderer = (props) => {
 *   return <>{RenderNodeVisitor.collectReactElements(props, false)}</>
 * }
 */