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

.link {
  text-decoration: underline !important;
  cursor: pointer;
  color: #726b04 !important;
}

JavaScript

var pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  width: "100%",
  height: 430,
  toolbar: true,
  customizeCell: customizeCellFunction,
  report: {
    "dataSource": {
      "data": getData(),
      type: 'json',
      mapping: {
        member: {
          type: 'string',
        },
        book: {
          type: 'string',
        },
        review: {
          type: 'string',
        },
        uuid: {
          type: 'id',
        },
      }
    },
    "slice": {
      expands: {
        expandAll: true,
      },
      "rows": [{
          "uniqueName": "member"
        },
        {
          "uniqueName": "book"
        },
        {
          "uniqueName": "review"
        },
      ],
      "columns": [{
        "uniqueName": "[Measures]"
      }],
      "measures": [{
        "uniqueName": "book"
      }]
    },
    options: {
      grid: {
        type: 'classic',
        showHeaders: false,
        showTotals: false,
        showGrandTotals: 'off',
        showReportFiltersArea: false,
        dragging: false,
        showAutoCalculationBar: false,
      },
      configuratorButton: false,
      sorting: false,
      showAggregationLabels: false,
      drillThrough: false,
      allowBrowsersCache: false,
      showAggregations: false,
    }
  }
});

function customizeCellFunction(cell, data) {
  if (data.type !== 'value') {
    if (data.member && data.member.dimensionName === 'review') {
      cell.text = `${cell.text}  <a style="text-decoration: underline; cursor: pointer;" onclick="logCellProperties('${data.rowIndex}')">click me</a>`

      return
    }
  }
}

function getRandomArbitrary() {
  return Math.random() * (1000 - 1) + 1;
}

function logCellProperties(rowIndex) {
  console.log(pivot.getCell(rowIndex, 2).recordId[0])
}


function getData() {
  return [{
      member: 'Alex',
      book: 'Great Expectations',
      review: '4',
    },
    {
      member: 'Alex',
      book:...