JSFiddle - React, Tailwind, and code Playground

by Bryan McIntosh

HTML

<div id="myTreePlaceholder">
  asdf
  <div id="tree">
  
  </div>
  
</div>

JavaScript

let toc = [
{"label":"Land Base","checked":false,"id":1,"checkbox":false,"radio":false,"icon":"folder","inode":true,"open":false,"branch":[
    {"label":"Jurisdictions","checked":false,"id":2,"checkbox":false,"radio":false,"icon":"folder","inode":true,"open":false,"branch":[
    {"label":"Staff Coverage","checked":false,"id":3,"checkbox":true,"radio":false,"icon":"folder","inode":true,"open":false,"branch":[
    {"label":"Staff - Resource Planning (a)","_sid":"lyrDynamic","_layerid":164,"_metadataurl":2445,"_identify":true,"_legend":false,"checked":true,"id":4,"checkbox":false,"radio":true},
    {"label":"Staff - Engineering (b)","_sid":"lyrDynamic","_layerid":163,"_metadataurl":2444,"_identify":true,"_legend":false,"checked":false,"id":5,"checkbox":false,"radio":true},
    {"label":"Staff - Conservation Services (c)","_sid":"lyrDynamic","_layerid":165,"_metadataurl":2443,"_identify":true,"_legend":false,"checked":false,"id":6,"checkbox":false,"radio":true}
    ]},
    {"label":"Watershed Boundary (d)","_sid":"lyrDynamic","_layerid":53,"_metadataurl":2468,"_identify":false,"_legend":false,"checked":true,"id":8,"checkbox":true,"radio":false},
    {"label":"Municipal Boundary (d)","_sid":"lyrDynamic","_layerid":73,"_metadataurl":2418,"_identify":false,"_legend":true,"checked":false,"id":9,"checkbox":true,"radio":false},
    {"label":"Named Places (e)","_sid":"lyrDynamic","_layerid":9,"_layertype":"group","_metadataurl":2553,"_identify":false,"_legend":false,"checked":true,"id":10,"checkbox":true,"radio":false},
    {"label":"Electoral Districts (ON)","_sid":"lyrDynamic","_layerid":60,"_metadataurl":2479,"_identify":true,"_legend":true,"checked":false,"id":11,"checkbox":true,"radio":false},
    {"label":"Electoral Districts (GC)","_sid":"lyrDynamic","_layerid":59,"_metadataurl":2749,"_identify":true,"_legend":true,"checked":false,"id":12,"checkbox":true,"radio":false},
    {"label":"MNRF District...