JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://s3.amazonaws.com/flexmonster/2.3/demo.css">
<script src="https://cdn.flexmonster.com/flexmonster.js"></script>
<button onclick="setReport()">Set report</button>
<button onclick="updateData()">Update data</button>

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

JavaScript

var pivot = new Flexmonster({
  container: "#pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  toolbar: true,
  report: {
    dataSource: {
      type: "json",
      data: getDataObj()
    },
    "slice": {
      "measures": [{
        "uniqueName": "property_1",
        "caption": "Property 1",
        "active": false
      },
      {
        "uniqueName": "property_2",
        "caption": "Property 2",
        "active": false
      },
      {
        "uniqueName": "property_3",
        "caption": "Property 3",
        "active": false
      },
      {
        "uniqueName": "property_4",
        "caption": "Property 4",
        "active": false
      }]
    },
    options: {
    	showDefaultSlice: false,
    }
  },
});

function getDataObj() {
  return [
    {
        "property_1": "RyanWatson",
        "property_2": "-",
        "property_3": "0",
        "property_4": "09/01/2019"
    },
    {
        "property_1": "RyanWatson",
        "property_2": "-",
        "property_3": "0",
        "property_4": "09/22/2019"
    },
    {
        "property_1": "Demo 7",
        "property_2": "-",
        "property_3": "0",
        "property_4": "09/15/2019"
    },
    {
        "property_1": "Demo 7",
        "property_2": "-",
        "property_3": "0",
        "property_4": "09/27/2019"
    },
    {
        "property_1": "Demo 7",
        "property_2": "-",
        "property_3": "0",
        "property_4": "09/22/2019"
    },
    {
        "property_1": "Demo 7",
        "property_2": "-",
        "property_3": "0",
        "property_4": "09/21/2019"
    },
    {
        "property_1": "Demo 7",
        "property_2": "-",
        "property_3": "0",
        "property_4": "09/19/2019"
    },
    {
        "property_1": "Demo 7",
        "property_2": "-",
        "property_3": "0",
        "property_4": "09/17/2019"
    },
    {
        "property_1": "Demo 7",
        "property_2": "-",
        "property_3": "0",
        "property_4": "09/08/2019"
   ...