Show:
                            /**
                             * The Form Builder Component
                             *
                             * @module aui-form-builder
                             * @submodule aui-form-builder-field-checkbox
                             */
                            
                            var L = A.Lang,
                            
                                AArray = A.Array,
                                AEscape = A.Escape,
                            
                                getCN = A.getClassName,
                            
                                CSS_CHECKBOX = getCN('checkbox'),
                                CSS_FIELD = getCN('field'),
                                CSS_FIELD_CHECKBOX = getCN('field', 'checkbox'),
                                CSS_FIELD_CHECKBOX_TEXT = getCN('field', 'checkbox', 'text'),
                                CSS_FIELD_CHOICE = getCN('field', 'choice'),
                                CSS_FORM_BUILDER_FIELD = getCN('form-builder-field'),
                                CSS_FORM_BUILDER_FIELD_NODE = getCN('form-builder-field', 'node'),
                            
                                TPL_CHECKBOX = '<input id="{id}" class="' + [CSS_FORM_BUILDER_FIELD_NODE, CSS_FIELD, CSS_FIELD_CHECKBOX,
                                    CSS_FIELD_CHOICE].join(' ') + '" name="{name}" type="checkbox" value="{value}" {checked} />';
                            
                            /**
                             * A base class for `A.FormBuilderCheckBoxField`.
                             *
                             * @class A.FormBuilderCheckBoxField
                             * @extends A.FormBuilderField
                             * @param {Object} config Object literal specifying widget configuration
                             *     properties.
                             * @constructor
                             */
                            var FormBuilderCheckBoxField = A.Component.create({
                            
                                /**
                                 * Static property used to define the default attribute
                                 * configuration for the `A.FormBuilderCheckBoxField`.
                                 *
                                 * @property ATTRS
                                 * @type Object
                                 * @static
                                 */
                                ATTRS: {
                            
                                    /**
                                     * Indicates which is the type of data for the input field.
                                     *
                                     * @attribute dataType
                                     * @default 'boolean'
                                     * @type String
                                     */
                                    dataType: {
                                        value: 'boolean'
                                    },
                            
                                    /**
                                     * Specifies a predefined value for the checkbox field.
                                     *
                                     * @attribute predefinedValue
                                     * @default false
                                     * @type Boolean
                                     */
                                    predefinedValue: {
                                        setter: A.DataType.Boolean.parse,
                                        value: false
                                    },
                            
                                    /**
                                     * Reusable block of markup used to generate the field.
                                     *
                                     * @attribute template
                                     */
                                    template: {
                                        valueFn: function() {
                                            return TPL_CHECKBOX;
                                        }
                                    }
                            
                                },
                            
                                /**
                                 * Static property provides a string to identify the CSS prefix.
                                 *
                                 * @property CSS_PREFIX
                                 * @type String
                                 * @static
                                 */
                                CSS_PREFIX: CSS_FORM_BUILDER_FIELD,
                            
                                /**
                                 * Static property used to define which component it extends.
                                 *
                                 * @property EXTENDS
                                 * @type Object
                                 * @static
                                 */
                                EXTENDS: A.FormBuilderField,
                            
                                /**
                                 * Static property provides a string to identify the class.
                                 *
                                 * @property NAME
                                 * @type String
                                 * @static
                                 */
                                NAME: 'form-builder-checkbox-field',
                            
                                prototype: {
                            
                                    /**
                                     * Render the `A.FormBuilderCheckBoxField` component instance.
                                     * Lifecycle.
                                     *
                                     * @method renderUI
                                     * @protected
                                     */
                                    renderUI: function() {
                                        var instance = this,
                                            contentBox = instance.get('contentBox');
                            
                                        A.FormBuilderCheckBoxField.superclass.renderUI.apply(instance, arguments);
                            
                                        contentBox.addClass(CSS_CHECKBOX);
                                    },
                            
                                    /**
                                     * Returns a list of property models including the `A.RadioCellEditor`
                                     * model.
                                     *
                                     * @method getPropertyModel
                                     */
                                    getPropertyModel: function() {
                                        var instance = this,
                                            strings = instance.getStrings();
                            
                                        var model = A.FormBuilderCheckBoxField.superclass.getPropertyModel.apply(instance, arguments);
                            
                                        AArray.each(model, function(item, index, collection) {
                                            if (item.attributeName === 'predefinedValue') {
                                                collection[index] = {
                                                    attributeName: 'predefinedValue',
                                                    editor: new A.RadioCellEditor({
                                                        options: {
                                                            'false': strings.no,
                                                            'true': strings.yes
                                                        }
                                                    }),
                                                    formatter: A.bind(instance._booleanFormatter, instance),
                                                    name: strings.predefinedValue
                                                };
                                            }
                                        });
                            
                                        return model;
                                    },
                            
                                    /**
                                     * Injects data into the template and returns the HTML result.
                                     *
                                     * @method getHTML
                                     * @return {String}
                                     */
                                    getHTML: function() {
                                        var instance = this,
                                            checked = instance.get('checked');
                            
                                        return L.sub(
                                            instance.get('template'), {
                                                checked: checked ? 'checked="checked"' : '',
                                                id: AEscape.html(instance.get('id')),
                                                label: AEscape.html(instance.get('label')),
                                                name: AEscape.html(instance.get('name')),
                                                value: AEscape.html(instance.get('predefinedValue'))
                                            }
                                        );
                                    },
                            
                                    /**
                                     * Set the `label` attribute on the UI.
                                     *
                                     * @method _uiSetLabel
                                     * @param val
                                     * @protected
                                     */
                                    _uiSetLabel: function(val) {
                                        var instance = this,
                                            labelNode = instance.get('labelNode'),
                                            showLabel = instance.get('showLabel'),
                                            templateNode = instance.get('templateNode');
                            
                                        labelNode.setContent('<span class="' + CSS_FIELD_CHECKBOX_TEXT + '">' + AEscape.html(val) + '</span>');
                            
                                        instance._uiSetShowLabel(showLabel);
                            
                                        labelNode.prepend(templateNode);
                                    },
                            
                                    /**
                                     * Set the `predefinedValue` attribute on the UI.
                                     *
                                     * @method _uiSetPredefinedValue
                                     * @param val
                                     * @protected
                                     */
                                    _uiSetPredefinedValue: function(val) {
                                        var instance = this,
                                            templateNode = instance.get('templateNode');
                            
                                        if (val) {
                                            templateNode.setAttribute('checked', val);
                                        }
                                        else {
                                            templateNode.removeAttribute('checked');
                                        }
                                    },
                            
                                    /**
                                     * Set the `showLabel` attribute on the UI.
                                     *
                                     * @method _uiSetShowLabel
                                     * @param val
                                     * @protected
                                     */
                                    _uiSetShowLabel: function(val) {
                                        var instance = this,
                                            labelNode = instance.get('labelNode'),
                                            labelTextNode = labelNode.one('.' + CSS_FIELD_CHECKBOX_TEXT);
                            
                                        if (labelTextNode) {
                                            labelTextNode.toggle(val);
                                        }
                                    }
                                }
                            
                            });
                            
                            A.FormBuilderCheckBoxField = FormBuilderCheckBoxField;
                            
                            A.FormBuilderField.types.checkbox = A.FormBuilderCheckBoxField;