Custom Component not editable and also after traits update canvas does not update

below is code i used for traits and custom section but after adding component via block, cannot edit text or trait update does not update canvas. I have extended 'text', Also I do not get html back when I use editor.html(), Also when I click on image it does not open asset manager. I am sure I must be missing something here.

var defaultType = comps.getType('text');
var defaultModel = defaultType.model;
var defaultView = defaultType.view;
createSectionComp(comps, defaultModel, defaultView)

function createSectionComp(comps, defaultModel, defaultView) {

    comps.addType('section', {
        // Define the Model
        model: defaultModel.extend({
            // Extend default properties
            defaults: Object.assign({}, defaultModel.prototype.defaults, {

                type: 'section',
                tagName: 'section',
                title: 'Sample Title',
                attributes: {
                    'data-gjs-type': 'cust-section',
                },
                traits: [{
                    type: 'text',
                    label: 'Title',
                    name: 'title',
                    placeholder: 'eg. Leadership Development',
                    changeProp: 1,
                }],
            }),
            initialize(o, opt) {
                defaultModel.prototype.initialize.apply(this, arguments);
                this.listenTo(this, 'change:title', this.updateModelProps);
            },

            updateModelProps() {
                var md = this;
                this.set('title', md.get('title'));

            },
        }, {
            isComponent(el) {
                if ((el.getAttribute &&
                        el.getAttribute('data-gjs-type') == 'cust-section') || el.className === 'cust-section') {
                    return {
                        type: 'cust-section'
                    };
                }
            }
        }),

        // Define the View
        view: defaultView.extend({

            tagName: 'div',
            events: {},
            initialize(o) {
                defaultView.prototype.initialize.apply(this, arguments);
                this.listenTo(this.model, 'change:title', this.updateView);
            },

            updateView() {
                var rowDiv = document.createElement('section');
                rowDiv.className = "row";
                rowDiv.innerHTML = "Sample Text Please change here";
                this.custTextRightHandImage = rowDiv;

                return this.custTextRightHandImage;
            },

            render(...args) {
                defaultView.prototype.render.apply(this, args);
                this.el.appendChild(this.updateView());
                return this;
            }
        })
    });
};