title: Chip Component doesn't show up
body: <pre><code>const ResultsAccordion = ({projects, projectStatus}) =&gt; 
  {
      return (
          &lt;Accordion&gt;
              &lt;AccordionSummary expandIcon={&lt;ExpandMoreIcon /&gt;} aria-controls=&quot;panel1a-content&quot; id=&quot;panel1a-header&quot;&gt;
                  &lt;Typography&gt;{projectStatus}&lt;/Typography&gt;
              &lt;/AccordionSummary&gt;
              &lt;AccordionDetails&gt;
                  &lt;TableContainer component={Paper} sx={{my:2 }}&gt;
                      &lt;Table&gt;
                          &lt;TableHead&gt;
                              &lt;TableRow style={{ width:&quot;100%&quot; }}&gt;
                                  &lt;TableCell align=&quot;center&quot;&gt;Team Name&lt;/TableCell&gt;
                                  &lt;TableCell align=&quot;center&quot;&gt;Project Link&lt;/TableCell&gt;
                                  &lt;TableCell align=&quot;center&quot;&gt;Team Members&lt;/TableCell&gt;
                              &lt;/TableRow&gt;
                          &lt;/TableHead&gt;
                          &lt;TableBody&gt;
                              {
                                  projects.map((value) =&gt;
                                  {
                                      return (
                                          &lt;TableRow key={value.name}&gt;
                                              &lt;TableCell align=&quot;center&quot;&gt;
                                                  {value.name}
                                              &lt;/TableCell&gt;
                                              &lt;TableCell align=&quot;center&quot;&gt;
                                                  &lt;Link href={value.repo}&gt;Project Repo&lt;/Link&gt;
                                              &lt;/TableCell&gt;
                                              &lt;TableCell align=&quot;center&quot;&gt;
                                                  &lt;Stack direction=&quot;row&quot; spacing={1} alignContent=&quot;center&quot;&gt;
                                                      {
                                                          (value.members).map((item, key) =&gt;
                                                          {
                                                              return (
                                                                  &lt;Chip key={key} component=&quot;a&quot; href={`https://github.com/${item.github}`} clickable label={item.github} avatar={&lt;Avatar alt={item.github} src={item.avatar}/&gt; } /&gt;
                                                              );
                                                          })
                                                      }
                                                  &lt;/Stack&gt;
                                              &lt;/TableCell&gt;
                                          &lt;/TableRow&gt;
                                      );
                                  })
                              }
                          &lt;/TableBody&gt;
                      &lt;/Table&gt;
                  &lt;/TableContainer&gt;
              &lt;/AccordionDetails&gt;
          &lt;/Accordion&gt;
      );
  };
  
  
  </code></pre>
  <p>Chips are supposed to be returned in the Table Cell with Stack..
  But there is no one.</p>
  <p>I used the react Developers tools and there is no childrens in Stack.
  The chips are rendered if i made any changes in the prop using ReactDevTools
  I checked, the value.members array &amp; it is also not empty.</p>