[OPEN]Component config property 'margin' issues

[jan.harmsen]

Applies to Ext JS 4 Preview 1

It looks like ExtJS 3 'margins' config property has become 'margin' in ExtJS4. This is not documented properly.
'margins' can still be used as it seems, but when provided as object, it does not get rendered properly, see testcase below (margin left becomes margin right when rendered, margin top becomes margin bottom when rendered).

Ext.onReady(function(){


    // ---- Create Viewport with border layout ----------------------
    Ext.create('Ext.Viewport',{
        layout: 'border',
        padding:20,
        defaults: {
                padding: 5,
                frame: true
        },
        items:[
            {
                region: 'north',
                title: 'Panel North',
                html: '<h2>I am North with a left margin of 150 and top and bottom margin of 5</h2>',
                //
                // ExtJS 3 'margins' config property as defined in BoxComponent is now
                // ExtJS 4 'margin' as defined in Ext.Component
                //
                // margin config works when provided as String
                //margin: '5 0 5 150',
                //
                // margin config also works when provided as Object
                //margin: {top:5, right:0, bottom:5,left:150},
                //
                // outdated margins config works NOT correctly in Ext4 preview 1 when provided as Object
                margins: {top:5, right:0, bottom:5,left:150},
                //
                // outdated margins config works correctly when provided as String
                //margins: '5 0 5 150',
                flex: 0.5
            },
            {
                region: 'west',
                title: 'Panel West',
                html: '<h2>I am West</h2>',
                flex: 0.75
            },
            {
                region: 'center',
                title: 'Panel Center',
                html: '<h2>I am Center</h2>',
                margins: '0 5 0 5'
            },
            {
                region: 'east',
                title: 'Panel East',
                html: '<h2>I am East</h2>',
                flex: 0.75
            }
        ]
    });
// END of onReady    
});

[Animal]

There's no change in config names.

What has changed is that you must now use the string form of the configuration.

I'll look into this.

[jan.harmsen]

Strange...
Why then do the Ext4 docs for Component use 'margin' and it works with 'margin' as string and object?

I currently do not have the time to further investigate, just wanted to point this out.

Thanks for looking into this!

[Animal]

Yes, the way it is processed has been changed. I have just fixed this to accept margin and margins as configuration.