JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
  <title>Untitled</title>

  <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.common.min.css">
  <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.rtl.min.css">
  <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.default.min.css">
  <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.dataviz.min.css">
  <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.dataviz.default.min.css">
  <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.mobile.all.min.css">

  <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
  <script src="http://cdn.kendostatic.com/2014.1.416/js/kendo.all.min.js"></script>
  <script id="div-template" type="x-kendo-template">
        <div style="height:500px" >
            <div class="k-edit-label">
                <label for="ViewName">Name</label>
            </div>    
            <div data-container-for="ViewName" class="k-edit-field">
                <input type="text" class="k-input k-textbox" name="ViewName" data-bind="value: ViewName">
            </div>                 
        </div>
		
    </script>
</head>
<body>
  <div id="bodyDiv" >                
      <div id="visDiv" data-template="popupSummaryEditor" data-bind="source: summaryDef" >                        
      </div>       
    </div>
</body>
  
  <script>
        var datasetMetaModel = kendo.observable({
            summaryDef: {            
                "ViewName": "TestValue"                 
            }
        });
      
      kendo.bind($("#bodyDiv"), datasetMetaModel);
  </script>