JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.4.0.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/tabulator-tables@4.2.4/dist/css/tabulator.min.css">
<script src="https://unpkg.com/tabulator-tables@4.2.4/dist/js/tabulator.min.js"></script>
<!DOCTYPE html>
<html lang="en">

  <body>

    <div id="example-table"></div>
  </body>

</html>

JavaScript

var nestedData = [{
    id: 1,
    description: "Control outlet",
    room: "Work room",
    vendor: "IKEA",
    up_to_date: "Yes",
    exposes: [{
        measurement: "State",
        value: "On",
        unit: "binary"
      },
      {
        measurement: "Link quality",
        value: "63",
        unit: "lqi"
      },
    ]
  },
  {
    id: 2,
    description: "Door sensor",
    room: "Hallway",
    vendor: "Xiaomi",
    up_to_date: "Yes",
    exposes: [{
        measurement: "Battery",
        value: "100",
        unit: "%"
      },
      {
        measurement: "Contact",
        value: "True",
        unit: "binary"
      },
      {
        measurement: "Link quality",
        value: "87",
        unit: "lqi"
      },
    ]
  },
]

var hideIcon = function(cell, formatterParams, onRendered){ //plain text value
    return "<i class='fa fa-eye-slash'></i>";
};

const table = new Tabulator("#example-table", {
  height: "311px",
  layout: "fitColumns",
  resizableColumns: false,
  data: nestedData,
  selectable: true,
  columns: [{formatter:hideIcon, align:"center", title:"Hide Sub", headerSort:false, cellClick:function(e, row, formatterParams){
     const id = row.getData().id;
    $(".subTable" + id + "").toggle();      
    	}
		},
		{
      title: "Description",
      field: "description"
    },
    {
      title: "Room",
      field: "room"
    },
    {
      title: "Vendor",
      field: "vendor"
    },
    {
      title: "Up to date",
      field: "up_to_date"
    }
  ],
  rowFormatter: function(row, e) {
    //create and style holder elements
    var holderEl = document.createElement("div");
    var tableEl = document.createElement("div");

    const id = row.getData().id;

    holderEl.style.boxSizing = "border-box";
    holderEl.style.padding = "10px 10px 10px 10px";
    holderEl.style.borderTop = "1px solid #333";
    holderEl.style.borderBotom = "1px solid #333";
    holderEl.style.background = "#ddd";
    holderEl.setAttribute('class', "subTable"...