title: Can I make a Material-Table column render data like this?
body: <p>I am using a standard Material-Table.  I would like to render the column <code>status</code> like in the image down below.  I could use ANT Design to do this, but Material-Table requires a lot less code to allow for searching and filtering.</p>
  <p>Here is a very simple example of my table.  I am using some <code>options</code> to set the header color, font etc.  I am also using <code>rowStyle</code> to alternate colors on each row.</p>
  <pre><code>const [intakes, setIntakes] = useState([]);
  const columns = [
          { title: &quot;Status&quot;, field: &quot;Status&quot; },
      ];
  
  function Table() {
    return (
      &lt;MaterialTable data={intakes.intakes} columns={columns} /&gt;
    );
  }
  </code></pre>
  <p><a href="https://i.stack.imgur.com/LRYoD.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/LRYoD.png" alt="enter image description here" /></a></p>