JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://dev.sencha.com/deploy/ext-4.0.0/resources/css/ext-all.css">
JavaScript
(function() {
var overrides = {
// //For Ext 4.0.7 only
// labelableRenderTpl: [
// '<tpl if="!hideLabel && !(!fieldLabel && hideEmptyLabel)">',
// '<label id="{id}-labelEl"<tpl if="inputId"> for="{inputId}"</tpl> class="{labelCls}"',
// '<tpl if="labelStyle"> style="{labelStyle}"</tpl>>',
// '<tpl if="fieldLabel">{fieldLabel}{labelSeparator}</tpl>',
// '<tpl if="!allowBlank"><span style="color:red">*</span></tpl>',
// '</label>',
// '</tpl>',
// '<div class="{baseBodyCls} {fieldBodyCls}" id="{id}-bodyEl" role="presentation">{subTplMarkup}</div>',
// '<div id="{id}-errorEl" class="{errorMsgCls}" style="display:none"></div>',
// '<div class="{clearCls}" role="presentation"><!-- --></div>',
// {
// compiled: true,
// disableFormats: true
// }
// ],
//For Ext 4.0.2a only
labelableRenderTpl: [
'<tpl if="!hideLabel && !(!fieldLabel && hideEmptyLabel)">',
'<label<tpl if="inputId"> for="{inputId}"</tpl> class="{labelCls}"<tpl if="labelStyle"> style="{labelStyle}"</tpl>>',
'<tpl if="fieldLabel">{fieldLabel}{labelSeparator}</tpl>',
'<tpl if="!allowBlank"><span style="color:red">*</span></tpl>',
'</label>',
'</tpl>',
'<div class="{baseBodyCls} {fieldBodyCls}"<tpl if="inputId"> id="{baseBodyCls}-{inputId}"</tpl> role="presentation">{subTplMarkup}</div>',
'<div class="{errorMsgCls}" style="display:none"></div>',
'<div class="{clearCls}" role="presentation"><!-- --></div>',
{
compiled: true,
disableFormats: true
}
],
/**
* @protected
* Generates the arguments for the field decorations...