Which of these do you prefer for a component-wrapping API? please comment below!

routing.js

// The hypothetical <Routing /> component would pass extra props to <App /> to say which route is active

// 1. Wrapped component accepts component class and passes on props plus extras
<Routing
  rootComponent={App}
  propForApp="abc"
  propForApp2="def"
/>
    
// 2. Wrapped component takes children and uses cloneElement to pass extra props
<Routing>
    <App propForApp="abc" propForApp2="def" />
</Routing>

// 3. Wrapped component takes component class and extra props as an object
<Routing
  rootComponent={App}
  rootProps={{
    propForApp: "abc",
    propForApp2: "def"
  }}
/>