JSFiddle - React, Tailwind, and code Playground

by Sree K

HTML

<div id="result">

</div>

JavaScript

let data = {
	"toc": [
		{
			"uid": "bc158b7a-75ec-44f6-8fec-4810121a963d",
			"alias": "",
			"text": "Chapter I Preliminary",
			"parent": "",
			"indent": "1",
			"active": true
		},
		{
			"uid": "b5a7ff50-231c-4b90-b0cd-38b261c1c82d",
			"text": "Short title, extent, commencement and application",
			"parent": "bc158b7a-75ec-44f6-8fec-4810121a963d",
			"indent": "2",
			"active": true
		},
		{
			"uid": "2b09623c-7f56-466a-8a40-db9394c958f0",
			"text": "Definitions",
			"parent": "bc158b7a-75ec-44f6-8fec-4810121a963d",
			"indent": "2",
			"active": true
		},
		{
			"uid": "b98395fd-ac28-4e40-994a-9a59ad103584",
			"alias": "",
			"text": "CHAPTER II INCORPORATION OF COMPANY AND MATTERS INCIDENTAL THERETO",
			"parent": "",
			"indent": "1",
			"active": true
		},
		{
			"uid": "b4c00f9a-9418-4cca-9c01-724e50c007a3",
			"text": "Formation of company",
			"parent": "b98395fd-ac28-4e40-994a-9a59ad103584",
			"indent": "2",
			"active": true
		},
		{
			"uid": "6d5d3b27-e59a-476b-9094-d83bd0a37dd5",
			"text": "Memorandum",
			"parent": "b98395fd-ac28-4e40-994a-9a59ad103584",
			"indent": "2",
			"active": true
		},
		{
			"uid": "4585c557-07d3-45a2-91d9-50f74708cb35",
			"text": "Articles",
			"parent": "b98395fd-ac28-4e40-994a-9a59ad103584",
			"indent": "2",
			"active": true
		},
		{
			"uid": "08f6fd65-5d5d-42db-bf45-d9b057a2d2fb",
			"text": "Act to override memorandum, articles, etc",
			"parent": "b98395fd-ac28-4e40-994a-9a59ad103584",
			"indent": "2",
			"active": true
		},
		{
			"uid": "cfdd5f71-4b30-4753-9e2d-49159da6ea4f",
			"text": "Incorporation of company",
			"parent": "b98395fd-ac28-4e40-994a-9a59ad103584",
			"indent": "2",
			"active": true
		},
		{
			"uid": "0d7347bf-4515-4546-acb4-e73dac114de6",
			"text": "Formation of companies with charitable objects, etc",
			"parent": "b98395fd-ac28-4e40-994a-9a59ad103584",
			"indent": "2",
			"active": true
		},
		{
			"uid": "47fe0644-b655-44f7-8727-4f21e6719a83",
			"text": "Effect of...