JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/twbschema@1/dist/twbschema.min.js"></script>

<div id="el">
</div>

JavaScript

var json = {
    "$schema": "http://json-schema.org/draft-06/schema#",
    "title": "Products",
    "description": "Product object model",
    "type": "object",
    "required": [
        "sku",
        "name"
    ],
    "additionalProperties": false,
    "properties": {
        "authorized_stores": {
            "type": "array",
            "uniqueItems": true,
            "maxItems": 1000,
            "items": {
                "type": "integer",
                "minimum": 1000,
                "maximum": 16777215,
                "description": "Store ID"
            },
            "description": "IDs from other stores authorized to sell this product"
        },
        "sku": {
            "type": "string",
            "minLength": 2,
            "maxLength": 100,
            "pattern": "^[A-Za-z0-9-_.]+$",
            "description": "Product unique reference code"
        },
        "commodity_type": {
            "type": "string",
            "enum": [
                "physical",
                "digital"
            ],
            "default": "physical",
            "description": "Product type"
        },
        "name": {
            "type": "string",
            "maxLength": 255,
            "description": "Product full name"
        },
        "i18n": {
            "type": "object",
            "additionalProperties": false,
            "maxProperties": 10,
            "patternProperties": {
                "^[a-z]{2}(_[a-z]{2})?$": {
                    "type": "string",
                    "maxLength": 255,
                    "description": "Translated full product name"
                }
            },
            "description": "Product name translations"
        },
        "subtitle": {
            "type": "string",
            "maxLength": 255,
            "description": "Optional subtitle intended to be used for SEO or layout purposes"
        },
        "slug": {
            "type": "string",
            "maxLength": 255,
            "pattern":...