I am working on a drop down tree-style navigation menu for my application and I'm having some trouble determining the best layout/sizing to use for a Ext.menu.Menu container and a Ext.tree.Panel child component. The basic idea is similar to a Ext.ux.TreePicker except I don't want to have a selector for an input, but rather use the href config on tree nodes to navigate away from the current page.

My goal is to have a drop down button menu that has a width determined by the dynamically desired content width (changes on node expand and collapse). With the code below I am able to have the treepanel content determine the height but the width fills the screen.

Code:
Ext.define('MyApp.toolbar.NavigationToolbar',
    {
    // Class Properties
    extend:'Ext.toolbar.Toolbar',
    requires:
        ['MyApp.model.Page'],

    items:
        [{
        text:'Root',
        menu:
            {
            xtype:'menu',
            layout:'auto',
            plain:true,
            items:
                [{
                xtype:'treepanel',
                header:false,
                border:false,
                //maxWidth:450,
                maxHeight:450,
                shrinkWrapDock:2,
                store:
                    {
                    autoLoad:true,
                    model:'MyApp.model.Page',
                    root:
                        {
                        text:'Root',
                        id:'/my/path/',
                        href:'/my/path/',
                        expanded:true,
                        allowDrag:false,
                        allowDrop:false
                        }
                    }
                }]
            }
        }],
    // User Defined Methods
    toString:function()
        {
        return('['+Ext.getClassName(this)+']');
        }
    });
I would think that changing the treepanel config to have shrinkWrapDock set to 3 or true and setting a maxWidth would resolve this in the same way that it does for the height. Instead, the width is always fixed to the maxWidth that I specify. How can I have a floating treepanel width size to the content?

I am using ext-4.2.2.1144 in Firefox (needs to work in IE9 as well)