Disabilitare il text-wrapping

Uno dei componenti più diffusi e utilizzati di ExtJS è sicuramente il GridPanel.
Questo pannello in automatico utilizza il text-wrapping per evitare cambiamenti a livello grafico del componente. Per disattivarlo e permettere al testo di occupare pià di una riga all'interno della tabella dobbiamo intervenire direttamente via CSS sull'elemento in quanto non esiste una configurazione gestita da ExtJS.
Gli interventi da fare sono principalmente due.
Innanzitutto è necessario dare una particolare classe alla colonna sul quale disabilitare il text-wrapping utilizzando l'opzione id nella definizione del column model:

var gridPanel = new Ext.data.GridPanel({
    [...],
    columns = [{ 
        dataIndex: 'label', 
        header: 'Proprietà',
        width: 100 
    },{ 
        dataIndex: 'value', 
        header: 'Valore',
        id:'detail-data' //assegno un particolare id alla colonna
    }]
});

Successivamente è necessario personalizzare, via CSS, il comportamento della colonna precedentemente nominata detail_data:

.x-grid3-col-detail-data { 
	white-space: normal !important; 
	overflow: hidden !important;
}