title: How do you provide default props for nested shape in React?
body: <p>Is there a way in React to provide default props to a nested array of items of a certain shape? </p>
  
  <p>Given the example below, my first attempt can be seen, however this doesn't work as expected. </p>
  
  <pre><code>static propTypes = {
      heading: PT.string,
      items: PT.arrayOf(PT.shape({
          href: PT.string,
          label: PT.string,
      })).isRequired,
  };
  
  static defaultProps = {
      heading: 'this works',
      items: [{
          href: '/',
          label: ' - this does not - ',
      }],
  };
  </code></pre>
  
  <p>In this example, I would expect the following:</p>
  
  <pre><code>// Given these props
  const passedInProps = {
      items: [{ href: 'foo' }, { href: 'bar' }]
  };
  
  // Would resolve to:
  const props = {
      heading: 'this works',
      items: [
        { href: 'foo', label: ' - this does not - ' },
        { href: 'bar', label: ' - this does not - ' },
      ]
  };
  </code></pre>