JSFiddle - React, Tailwind, and code Playground

by Jon-Carlos Rivera

CSS

.pretty-print {
    list-style-type: none;
    padding-left: 1em;
    font-family:sans-serif;
}

.pretty-print ul {
    border-left: 1px solid lightgrey;
}

.pretty-print li {
    padding-top: 0.2em;
}

.pretty-key {
    color: #555;
}

.pretty-value {
    margin-left: 1em;
}

.pretty-depth-1>li>.pretty-key {
    color: black;
    font-size:22px;
}

.pretty-depth-1>li>ul {
    border-left: 0px;
    border-top: 1px solid black;
}

JavaScript

var obj1 = {
    "assessment": {
        "other_pmh": "",
        "moi": "n/a",
        "pt_status_on_arrival": "alert x 3",
        "vitals": [
            {
                "date_time": "2013-07-08T18:18:57.880Z",
                "bp": "120/86",
                "pulse": 86,
                "resp": 16,
                "o2_sat": 97,
                "ekg": "n/a",
                "_id": "51db00b0576762183900000d"
            },
            {
                "date_time": "2013-07-08T18:09:57.000Z",
                "bp": "120/88",
                "pulse": 82,
                "resp": 12,
                "o2_sat": 98,
                "ekg": "n/a",
                "_id": "51db00b0576762183900000c"
            }
        ],
        "physical": {
            "cap_refill": "normal",
            "head": "normal",
            "chest": "muscular",
            "abdomen": "6 pack",
            "pelvis": "elvis",
            "extremeties": "extreme",
            "back_spine": "normal",
            "eyes": {
                "left": 2,
                "right": 2,
                "status": [
                    "PERL"
                ]
            },
            "skin": [
                "pale",
                "cool"
            ],
            "lungs": [
                "clear"
            ],
            "breathing": [
                "normal"
            ]
        },
        "pt_meds": [
            "vitamins",
            "bp medicine",
            "awesome pills",
            "codone",
            "xanax",
            "valium",
            "thorazine",
            "paxil",
            "prozac",
            "welbutrin",
            "effexor",
            "levaflaxin"
        ],
        "trauma_alert": false,
        "pmh": [
            "HTN",
            "Awesomness"
        ]
    }
};

var toString = Function.call.bind(Object.prototype.toString);
function typeOf (a) { return toString(a).toLowerCase().slice(8, -1); }

function deCamelCase (str) { 
    return str.replace(/_/g, '...