Vps.Component.ComponentPanel = Ext.extend(Vps.Binding.AbstractPanel, {
    layout: 'card',
    mainComponentClass: 'Vpc_Paragraphs_Component',
    mainType: 'content',
    mainComponentId: '{0}',
    mainComponentText: null,
    mainComponentIcon: null,
    //mainEditComponents
    //componentConfigs

    initComponent: function() {
        if (!this.componentConfigs) this.componentConfigs = {};
        if (!this.mainEditComponents) this.mainEditComponents = {};

        if (this.autoLoad !== false) {
            this.autoLoad = true;
        } else {
            delete this.autoLoad;
        }
        this.contentPanel = new Ext.Panel();
        Ext.apply(this, {
            tbar        : new Ext.Toolbar({ height: 25 }),
            items       : this.contentPanel,
            currentItem : this.contentPanel
        });
        this.componentsStack = [];

        Vps.Component.ComponentPanel.superclass.initComponent.call(this);
    },
    doAutoLoad : function()
    {
        //autoLoad kann in der zwischenzeit abgeschaltet werden, zB wenn
        //wir in einem Binding sind
        if (!this.autoLoad) return;

        this.load();
    },

    loadComponent: function(data) {
        var componentConfig = this.componentConfigs[data.componentClass+'-'+data.type];
        if (!componentConfig) throw new Error("couldn't find componentConfig "+data.componentClass+'-'+data.type);
        var params;
        if (data.componentId) {
            params = { componentId: data.componentId };
            if (componentConfig.componentIdSuffix) {
                params.componentId += componentConfig.componentIdSuffix;
            }
        } else {
            params = this.getBaseParams();
        }
        var item;
        this.items.each(function(i) {
            if (i.componentClass == data.componentClass && i.type == data.type) {
                item = i;
                return false; //break each
            }
        }, this);

        this.componentsStack.push(data);
        this.updateToolbar();

        if (item) {
            item.applyBaseParams(params);
            item.load();
            if (item.getAction && item.getAction('saveBack')) {
                if (this.getTopToolbar().items.getCount() > 3) {
                    item.getAction('saveBack').show();
                } else {
                    item.getAction('saveBack').hide();
                }
            }
        } else {
            var config = {
                autoScroll : true,
                componentClass: data.componentClass,
                type: data.type,
                baseParams: params,
                listeners: {
                    scope: this,
                    gotComponentConfigs: function(componentConfigs) {
                        Ext.applyIf(this.componentConfigs, componentConfigs);
                    },
                    editcomponent: this.loadComponent
                }
            };
            Ext.apply(config, componentConfig);
            if (config.title) delete config.title;

            var item = Ext.ComponentMgr.create(config);
            item.on('savebackaction', function() {
                this.componentsStack.pop();
                var data = this.componentsStack.pop();
                this.loadComponent(data);
            }, this);
            item.on('loaded', function() {
                //muss hier auch nochmal gemacht werden
                if (item.getAction && item.getAction('saveBack')) {
                    if (this.getTopToolbar().items.getCount() > 3) {
                        item.getAction('saveBack').show();
                    } else {
                        item.getAction('saveBack').hide();
                    }
                }
            }, this);
            this.add(item);
            this.doLayout();
        }
        this.getLayout().setActiveItem(item);
    },

    updateToolbar: function() {
        this.clearToolbar();
        var toolbar = this.getTopToolbar();
        for (var i=0; i < this.componentsStack.length; i++) {
            var data = this.componentsStack[i];
            var b = {};
            if (i > 0) {
                b.xtype = 'splitbutton';
                var cfg = this.componentConfigs[this.componentsStack[i-1].componentClass
                                                +'-'+this.componentsStack[i-1].type];
                b.text = cfg.title;
                b.icon = cfg.icon;
                b.scope = this;
                b.stackIndex = i-1;
                b.handler = function(o) {
                    var data = this.componentsStack[o.stackIndex];
                    this.componentsStack = this.componentsStack.slice(0, o.stackIndex);
                    this.loadComponent(data);
                };
            } else {
                if (!this.mainComponentText) {
                    //zB bei news wenn als eigener controller angezeigt
                    continue;
                }
                b.xtype = 'button';
                b.text = this.mainComponentText;
                b.icon = this.mainComponentIcon;
            }
            b.cls = 'x-btn-text-icon';
            b.menu = [];
            data.editComponents.each(function(ec) {
                var cfg = this.componentConfigs[ec.componentClass+'-'+ec.type];
                b.menu.push({
                    text: cfg.title,
                    icon: cfg.icon,
                    stackIndex: i,
                    componentClass: ec.componentClass,
                    type: ec.type,
                    componentId: ec.componentId, //gesetzt wenn aus Pages - weil da gibts unterschiedliche
                    handler: function(o) {
                        var data = Vps.clone(this.componentsStack[o.stackIndex]);
                        if (o.componentId) {
                            data.componentId = o.componentId;
                        }
                        data.componentClass = o.componentClass;
                        data.type = o.type;
                        this.componentsStack = this.componentsStack.slice(0, o.stackIndex);
                        this.loadComponent(data);
                    },
                    scope: this
                });
            }, this);

            toolbar.add(b);
            toolbar.add('»');
        }

        var data = this.componentsStack[this.componentsStack.length-1]
        var cfg = this.componentConfigs[data.componentClass+'-'+data.type];
        toolbar.add({
            cls: 'x-btn-text-icon',
            text: cfg.title,
            icon: cfg.icon,
            scope: this,
            handler: function() {
                this.getLayout().activeItem.reload();
            }
        });
    },

    clearToolbar: function() {
        var toolbar = this.getTopToolbar();
        toolbar.items.each(function(i) {
            toolbar.items.remove(i);
            i.destroy();
        });
    },

    load: function(data) {
        this.componentsStack = [];
        if (!data) { data = {}; }
        Ext.applyIf(data, {
            componentClass: this.mainComponentClass,
            type: this.mainType,
            text: this.mainComponentText,
            icon: this.mainComponentIcon,
            editComponents: this.mainEditComponents
        });
        this.loadComponent(data);
    },

    isDirty: function() {
        return this.contentPanel.isDirty();
    },
    mabySubmit : function(cb, options)
    {
        return this.contentPanel.mabySubmit.apply(this.contentPanel, arguments);
    },
    applyBaseParams : function(baseParams) {
        if (baseParams.id) {
            baseParams.componentId = String.format(this.mainComponentId, baseParams.id);
            delete baseParams.id;
        }
        Ext.apply(this.baseParams, baseParams);
    },
    hasBaseParams : function(params) {
        var baseParams = this.getBaseParams();
        for (var i in params) {
            if (i == 'id') {
                if (baseParams.componentId != String.format(this.mainComponentId, params[i])) {
                    return false;
                }
            } else {
                if (params[i] != baseParams[i]) return false;
            }
        }
        return true;
    }
});

Ext.reg('vps.component', Vps.Component.ComponentPanel);

@@ -1691,32 +1691,83 @@
 etBaseParams();%0A
+            data.componentId = params.componentId;%0A
         %7D%0A      

Fix Brotkruemel fuer ersten eintrag