JSFiddle - React, Tailwind, and code Playground

by Flexmonster Pivot Table

HTML

<script src="https://cdn.flexmonster.com/flexmonster.js"></script>

<div id="pivot-container"></div>

CSS

.tooltip {
  z-index: 2;
  width: 100% !important;
  height: 100% !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;

  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: pre-wrap !important;
}

JavaScript

let pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  customizeCell: customizeCellFunction,
  toolbar: true,
  report: {
    dataSource: {
      filename: "data/data.csv"
    }
  }
});

function customizeCellFunction(cell, data) {
  if (data) {
    cell.text = cell.text + `<div class='tooltip' title='${data.label}'></div>`;
  }
}