<div id="root"></div>
function Person(props) {
  const {name,age,status} = props;
  return <h1>Hello, {name} is {age} years old,ohhhh so {status}</h1>;
}

const Warpper = (child) => (props)=>{
  props = {...props, status: props.age>18?'old':'young'};
  return (
    child({...props})
  )
}

const person1 = {name:'ian',age:28};
const element = Warpper(Person)(person1);

ReactDOM.render(element, document.getElementById('root'));
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://unpkg.com/react/umd/react.development.js
  2. https://unpkg.com/react-dom/umd/react-dom.development.js