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>
<div id="pivot-container"></div>

SCSS

.editable {
    padding: 0 !important;

    input {
        width: 96px;
        height: 100%;
        font-size: inherit !important;
        font-family: inherit !important;
        background-color: transparent !important;
        border: 0px solid;
        box-sizing: border-box !important;
        padding-left: 4px !important;
        padding-right: 8px !important;
        text-align: right !important;
    }
    }

JavaScript

var pivot = new Flexmonster({
  container: "#pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  toolbar: false,
  report: {
    "dataSource": {
        "type": "json",
        "data": getData(),
        "mapping": {
            "Org_key_name": {
                "type": "string"
            },
            "month": {
                "type": "number"
            },
            "monthSelectionId54bdcffc-ba5a-48f7-99a3-18d20ca9b1b1": {
                "type": "property",
                "hierarchy": "month"
            },
            "Amount": {
                "type": "number"
            },
            "Year": {
                "type": "number"
            },
            "ScenarioName": {
                "type": "string"
            },
            "Firstlevel": {
                "type": "string",
                "hierarchy": "Firstlevel"
            },
            "FirstlevelSelectionId54bdcffc-ba5a-48f7-99a3-18d20ca9b1b1": {
                "type": "property",
                "hierarchy": "Firstlevel"
            },
            "SecondLevel": {
                "type": "string",
                "hierarchy": "Firstlevel",
                "parent": "Firstlevel"
            },
            "SecondLevelSelectionId54bdcffc-ba5a-48f7-99a3-18d20ca9b1b1": {
                "type": "property",
                "hierarchy": "SecondLevel"
            },
            "ThirdLevel": {
                "type": "string",
                "hierarchy": "Firstlevel",
                "parent": "SecondLevel"
            },
            "ThirdLevelSelectionId54bdcffc-ba5a-48f7-99a3-18d20ca9b1b1": {
                "type": "property",
                "hierarchy": "ThirdLevel"
            },
            "FourthLevel": {
                "type": "string",
                "hierarchy": "Firstlevel",
                "parent": "ThirdLevel"
            },
            "FourthLevelSelectionId54bdcffc-ba5a-48f7-99a3-18d20ca9b1b1": {
                "type": "property",
               ...