The source code editor component uses the excellent [CodeMirror][1] library, hence the name of the XBL element name: <fr:code-mirror>. You can use it in situations where you want to users to be able to view or edit source code. You bind it to the node that contains the text to view or edit, just like you would with an <xforms:textarea>. If the node you bind it to is readonly, then users will be able to view the source but not edit it.