You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@flex.apache.org by ah...@apache.org on 2017/05/01 03:48:09 UTC

[10/50] [abbrv] git commit: [flex-asjs] [refs/heads/develop] - Merge branch 'develop' into dual. Clean build. Now to get it to run

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/ImageButton.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/ImageButton.as
index b439483,f61f5ee..4b89037
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/ImageButton.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/ImageButton.as
@@@ -19,6 -19,6 +19,9 @@@
  package org.apache.flex.html
  {
      import org.apache.flex.core.SimpleCSSStyles;
++	import org.apache.flex.events.Event;
++    import org.apache.flex.html.beads.models.ImageModel;
++
      COMPILE::JS
      {
          import org.apache.flex.core.WrappedHTMLElement;
@@@ -27,6 -27,6 +30,7 @@@
      /**
       *  The ImageButton class presents an image as a button.
       *
++     *  @toplevel
       *  @langversion 3.0
       *  @playerversion Flash 10.2
       *  @playerversion AIR 2.6
@@@ -52,39 -52,38 +56,48 @@@
           * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
           */
  		COMPILE::JS
--		override protected function createElement():WrappedHTMLElement
--		{
--			element = document.createElement("input") as WrappedHTMLElement;
--			positioner = element;
--			element.flexjs_wrapper = this;
++        override protected function createElement():WrappedHTMLElement
++        {
++            element = document.createElement('button') as WrappedHTMLElement;
++            element.setAttribute('type', 'button');
  
--			var inputElement:HTMLInputElement = element as HTMLInputElement;
--			inputElement.type = "image";
-             inputElement.setAttribute("value", " ");
-             
- 			return element;
- 		}
++            positioner = element;
++            //positioner.style.position = 'relative';
++            element.flexjs_wrapper = this;
  
 -			return element;
 -		}
++            return element;
++        }
+ 
++		[Bindable("srcChanged")]
  		/**
  		 * Sets the image for the button. This is a URL.
  		 * TODO: figure out how to set the source in the style, rather than using
  		 * backgroundImage behind the scenes.
  		 */
-         public function get source():String
+         public function get src():String
          {
--            return style.backgroundImage;
++            return ImageModel(model).url;
          }
  
-         public function set source(url:String):void
+         public function set src(url:String):void
          {
--            if (!style)
--                style = new SimpleCSSStyles();
--            style.backgroundImage = url;
++            ImageModel(model).url = url;
++            COMPILE::SWF
++            {
++                if (!style)
++                    style = new SimpleCSSStyles();
++                style.backgroundImage = url;
++            }
  
--            COMPILE::JS {
--            	var inputElement:HTMLInputElement = element as HTMLInputElement;
--				inputElement.src = url;
++            COMPILE::JS
++            {
++                var inner:String = '';
++                if (url)
++                    inner = "<img src='" + url + "'/>";
++                element.innerHTML = inner;
              }
++
++			dispatchEvent(new Event("srcChanged"));
          }
  	}
  }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/List.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/List.as
index 617b186,17c8b3f..fb2481f
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/List.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/List.as
@@@ -18,52 -18,52 +18,39 @@@
  ////////////////////////////////////////////////////////////////////////////////
  package org.apache.flex.html
  {
--	import org.apache.flex.core.ContainerBaseStrandChildren;
--	import org.apache.flex.core.IContentViewHost;
--	import org.apache.flex.core.IDataProviderItemRendererMapper;
--	import org.apache.flex.core.IFactory;
--	import org.apache.flex.core.IItemRendererClassFactory;
--	import org.apache.flex.core.IItemRendererProvider;
--	import org.apache.flex.core.IListPresentationModel;
  	import org.apache.flex.core.IRollOverModel;
  	import org.apache.flex.core.ISelectionModel;
--	import org.apache.flex.core.ListBase;
--	import org.apache.flex.core.UIBase;
--	import org.apache.flex.core.ValuesManager;
--    COMPILE::JS
--    {
--        import org.apache.flex.core.WrappedHTMLElement;
--        import org.apache.flex.html.beads.ListView;
--        import org.apache.flex.html.supportClasses.DataGroup;
--    }
--	import org.apache.flex.events.Event;
--	import org.apache.flex.events.IEventDispatcher;
--	import org.apache.flex.html.beads.models.ListPresentationModel;
--	
++
++	COMPILE::JS
++	{
++		import org.apache.flex.core.WrappedHTMLElement;
++	}
++
  	/**
  	 *  Indicates that the initialization of the list is complete.
--	 *  
++	 *
++     *  @toplevel
  	 *  @langversion 3.0
  	 *  @playerversion Flash 10.2
  	 *  @playerversion AIR 2.6
  	 *  @productversion FlexJS 0.0
  	 */
  	[Event(name="initComplete", type="org.apache.flex.events.Event")]
--	
++
  	/**
  	 * The change event is dispatched whenever the list's selection changes.
--	 *  
++	 *
  	 *  @langversion 3.0
  	 *  @playerversion Flash 10.2
  	 *  @playerversion AIR 2.6
  	 *  @productversion FlexJS 0.0
  	 */
      [Event(name="change", type="org.apache.flex.events.Event")]
--    
++
  	/**
  	 *  The List class is a component that displays multiple data items. The List uses
  	 *  the following bead types:
--	 * 
++	 *
  	 *  org.apache.flex.core.IBeadModel: the data model, which includes the dataProvider, selectedItem, and
  	 *  so forth.
  	 *  org.apache.flex.core.IBeadView:  the bead that constructs the visual parts of the list.
@@@ -71,13 -71,13 +58,13 @@@
  	 *  org.apache.flex.core.IBeadLayout: the bead responsible for the size and position of the itemRenderers.
  	 *  org.apache.flex.core.IDataProviderItemRendererMapper: the bead responsible for creating the itemRenders.
  	 *  org.apache.flex.core.IItemRenderer: the class or factory used to display an item in the list.
--	 *  
++	 *
  	 *  @langversion 3.0
  	 *  @playerversion Flash 10.2
  	 *  @playerversion AIR 2.6
  	 *  @productversion FlexJS 0.0
  	 */
--	public class List extends ListBase implements IItemRendererProvider
++	public class List extends DataContainer
  	{
  		/**
  		 *  constructor.
@@@ -90,43 -90,42 +77,7 @@@
  		public function List()
  		{
  			super();
-             addEventListener("beadsAdded", beadsAddedHandler);
-         }
- 		
- 		/**
- 		 *  The name of field within the data used for display. Each item of the
- 		 *  data should have a property with this name.
- 		 *
- 		 *  @langversion 3.0
- 		 *  @playerversion Flash 10.2
- 		 *  @playerversion AIR 2.6
- 		 *  @productversion FlexJS 0.0
- 		 */
- 		public function get labelField():String
- 		{
- 			return ISelectionModel(model).labelField;
  		}
 -		
 -		/**
 -		 *  The name of field within the data used for display. Each item of the
 -		 *  data should have a property with this name.
 -		 *
 -		 *  @langversion 3.0
 -		 *  @playerversion Flash 10.2
 -		 *  @playerversion AIR 2.6
 -		 *  @productversion FlexJS 0.0
 -		 */
 -		public function get labelField():String
 -		{
 -			return ISelectionModel(model).labelField;
 -		}
--		public function set labelField(value:String):void
--		{
--			ISelectionModel(model).labelField = value;
--		}
--		
--		/**
--		 *  The data being display by the List.
--		 *
--		 *  @langversion 3.0
--		 *  @playerversion Flash 10.2
--		 *  @playerversion AIR 2.6
--		 *  @productversion FlexJS 0.0
--		 */
--        public function get dataProvider():Object
--        {
--            return ISelectionModel(model).dataProvider;
--        }
--        public function set dataProvider(value:Object):void
--        {
--            ISelectionModel(model).dataProvider = value;
--        }
  
  		/**
  		 *  The index of the currently selected item. Changing this value
@@@ -162,25 -161,25 +113,7 @@@
  		{
  			IRollOverModel(model).rollOverIndex = value;
  		}
--			
--		/**
--		 *  The presentation model for the list.
--		 *
--		 *  @langversion 3.0
--		 *  @playerversion Flash 10.2
--		 *  @playerversion AIR 2.6
--		 *  @productversion FlexJS 0.0
--		 */
--		public function get presentationModel():IListPresentationModel
--		{
--			var presModel:IListPresentationModel = getBeadByType(IListPresentationModel) as IListPresentationModel;
--			if (presModel == null) {
--				presModel = new ListPresentationModel();
--				addBead(presModel);
--			}
--			return presModel;
--		}
--		
++
  		/**
  		 *  The default height of each cell in every column
  		 *
@@@ -197,9 -196,9 +130,9 @@@
  		{
  			presentationModel.rowHeight = value;
  		}
--		
++
  		/**
--		 *  The item currently selected. Changing this value also 
++		 *  The item currently selected. Changing this value also
  		 *  changes the selectedIndex property.
  		 *
  		 *  @langversion 3.0
@@@ -215,82 -214,76 +148,12 @@@
  		{
  			ISelectionModel(model).selectedItem = value;
  		}
--		
--		private var _itemRenderer:IFactory;
--		
--		/**
--		 *  The class or factory used to display each item.
--		 *
--		 *  @langversion 3.0
--		 *  @playerversion Flash 10.2
--		 *  @playerversion AIR 2.6
--		 *  @productversion FlexJS 0.0
--		 */
--		public function get itemRenderer():IFactory
--		{
--			return _itemRenderer;
--		}
--		public function set itemRenderer(value:IFactory):void
--		{
--			_itemRenderer = value;
--		}
--		
--		/**
--		 * Returns whether or not the itemRenderer property has been set.
--		 *
--		 *  @see org.apache.flex.core.IItemRendererProvider
--		 *
--		 *  @langversion 3.0
--		 *  @playerversion Flash 10.2
--		 *  @playerversion AIR 2.6
--		 *  @productversion FlexJS 0.0
--		 */
--		public function get hasItemRenderer():Boolean
--		{
--			var result:Boolean = false;
--			
--			COMPILE::SWF {
--				result = _itemRenderer != null;
--			}
--			
--			COMPILE::JS {
--				var test:* = _itemRenderer;
--				result = _itemRenderer !== null && test !== undefined;
--			}
--			
--			return result;
--		}
--		
--		
--		/**
--		 * @private
++
++		/*
++		 * UIBase
  		 */
--		override public function addedToParent():void
--		{
--            super.addedToParent();
--            
-             dispatchEvent(new Event("initComplete"));
-         }
 -            if (getBeadByType(IDataProviderItemRendererMapper) == null)
 -            {
 -                var mapper:IDataProviderItemRendererMapper = new (ValuesManager.valuesImpl.getValue(this, "iDataProviderItemRendererMapper")) as IDataProviderItemRendererMapper;
 -                addBead(mapper);
 -            }
 -			var itemRendererFactory:IItemRendererClassFactory = getBeadByType(IItemRendererClassFactory) as IItemRendererClassFactory;
 -			if (!itemRendererFactory)
 -			{
 -				itemRendererFactory = new (ValuesManager.valuesImpl.getValue(this, "iItemRendererClassFactory")) as IItemRendererClassFactory;
 -				addBead(itemRendererFactory);
 -			}
 -			
 -			dispatchEvent(new Event("initComplete"));
 -		}
 -        
 +
          /**
-          * @private
-          */
-         private function beadsAddedHandler(e:Event):void
-         {
-             if (getBeadByType(IDataProviderItemRendererMapper) == null)
-             {
-                 var mapper:IDataProviderItemRendererMapper = new (ValuesManager.valuesImpl.getValue(this, "iDataProviderItemRendererMapper")) as IDataProviderItemRendererMapper;
-                 addBead(mapper);
-             }
-             var itemRendererFactory:IItemRendererClassFactory = getBeadByType(IItemRendererClassFactory) as IItemRendererClassFactory;
-             if (!itemRendererFactory)
-             {
-                 itemRendererFactory = new (ValuesManager.valuesImpl.getValue(this, "iItemRendererClassFactory")) as IItemRendererClassFactory;
-                 addBead(itemRendererFactory);
-             }
-         }
-             
-         /**
           * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
           */
          COMPILE::JS
@@@ -298,21 -291,21 +161,8 @@@
          {
              super.createElement();
              className = 'List';
--            
--            return element;
--        }        
  
--        /**
--         * @flexjsignorecoercion org.apache.flex.html.beads.ListView 
--         * @flexjsignorecoercion org.apache.flex.html.supportClasses.DataGroup 
--         */
--        COMPILE::JS
--        override public function internalChildren():Array
--        {
--            var listView:ListView = getBeadByType(ListView) as ListView;
--            var dg:DataGroup = listView.dataGroup as DataGroup;
--            var renderers:Array = dg.internalChildren();
--            return renderers;
--        };
++            return element;
++        }
     	}
  }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/MXMLBeadView.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/MXMLBeadView.as
index 1807381,1807381..4bfa105
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/MXMLBeadView.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/MXMLBeadView.as
@@@ -19,7 -19,7 +19,7 @@@
  package org.apache.flex.html
  {
  	import org.apache.flex.states.State;
--	
++
  	import org.apache.flex.core.IBead;
      import org.apache.flex.core.ILayoutHost;
      import org.apache.flex.core.IParent;
@@@ -27,28 -27,28 +27,28 @@@
  	import org.apache.flex.core.IStrand;
      import org.apache.flex.core.IStatesImpl;
  	import org.apache.flex.core.ValuesManager;
--    import org.apache.flex.html.beads.ContainerView;
++    import org.apache.flex.html.beads.GroupView;
  	import org.apache.flex.events.Event;
  	import org.apache.flex.events.ValueChangeEvent;
  	import org.apache.flex.utils.MXMLDataInterpreter;
  
      [DefaultProperty("mxmlContent")]
--    
++
      /**
       *  The MXMLBeadView class extends ContainerView
       *  and adds support for databinding and specification
       *  of children in MXML.
--     *  
++     *
       *  @langversion 3.0
       *  @playerversion Flash 10.2
       *  @playerversion AIR 2.6
       *  @productversion FlexJS 0.0
       */
--	public class MXMLBeadView extends ContainerView implements IStrand, ILayoutHost
++	public class MXMLBeadView extends GroupView implements IStrand, ILayoutHost
  	{
          /**
           *  Constructor.
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -58,12 -58,12 +58,12 @@@
  		{
  			super();
  		}
--		
++
          [Bindable("strandChanged")]
          /**
           *  An MXMLBeadView doesn't create its children until it is added to
           *  the strand.
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -74,21 -74,21 +74,21 @@@
              super.strand = value;
              // each MXML file can also have styles in fx:Style block
              ValuesManager.valuesImpl.init(this);
--            
--            dispatchEvent(new Event("strandChanged"));  
--            
++
++            dispatchEvent(new Event("strandChanged"));
++
              for each (var bead:IBead in beads)
                  addBead(bead);
--            
++
              dispatchEvent(new org.apache.flex.events.Event("beadsAdded"));
  
              MXMLDataInterpreter.generateMXMLInstances(this, IParent(value), MXMLDescriptor);
--            
--            dispatchEvent(new Event("initBindings"))
--            dispatchEvent(new Event("initComplete"))
++
              dispatchEvent(new Event("childrenAdded"));
++            dispatchEvent(new Event("initBindings"));
++            dispatchEvent(new Event("initComplete"));
          }
--        
++
          [Bindable("__NoChangeEvent__")]
          /**
           *  The model object.
@@@ -97,10 -97,10 +97,10 @@@
          {
              return _strand["model"];
          }
--        
++
          /**
           *  @copy org.apache.flex.core.Application#MXMLDescriptor
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -110,10 -110,10 +110,10 @@@
          {
              return null;
          }
--        
++
          /**
           *  @copy org.apache.flex.core.Application#generateMXMLAttributes()
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -123,23 -123,23 +123,23 @@@
          {
              MXMLDataInterpreter.generateMXMLProperties(this, data);
          }
--        
++
          /**
           *  @copy org.apache.flex.core.ItemRendererClassFactory#mxmlContent
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
           *  @productversion FlexJS 0.0
           */
          public var mxmlContent:Array;
--        
++
          private var _states:Array;
--        
++
          /**
           *  The array of view states. These should
           *  be instances of org.apache.flex.states.State.
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -149,7 -149,7 +149,7 @@@
          {
              return _states;
          }
--        
++
          /**
           *  @private
           */
@@@ -157,7 -157,7 +157,7 @@@
          {
              _states = value;
              _currentState = _states[0].name;
--            
++
              try{
                  if (getBeadByType(IStatesImpl) == null)
                      addBead(new (ValuesManager.valuesImpl.getValue(this, "iStatesImpl")) as IBead);
@@@ -167,19 -167,19 +167,19 @@@
              {
                  COMPILE::SWF
                  {
--                    trace(e.message);                        
++                    trace(e.message);
                  }
              }
--            
++
          }
--        
++
          /**
           *  <code>true</code> if the array of states
           *  contains a state with this name.
--         * 
++         *
           *  @param state The state namem.
           *  @return True if state in state array
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -194,13 -194,13 +194,13 @@@
              }
              return false;
          }
--        
++
          private var _currentState:String;
--        
++
          [Bindable("currentStateChange")]
          /**
           *  The name of the current state.
--         * 
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -208,9 -208,9 +208,9 @@@
           */
          public function get currentState():String
          {
--            return _currentState;   
++            return _currentState;
          }
--        
++
          /**
           *  @private
           */
@@@ -220,12 -220,12 +220,12 @@@
              _currentState = value;
              dispatchEvent(event);
          }
--        
++
          private var _transitions:Array;
--        
++
          /**
           *  The array of transitions.
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -233,48 -233,48 +233,48 @@@
           */
          public function get transitions():Array
          {
--            return _transitions;   
++            return _transitions;
          }
--        
++
          /**
           *  @private
           */
          public function set transitions(value:Array):void
          {
--            _transitions = value;   
++            _transitions = value;
          }
  
          /**
           *  @copy org.apache.flex.core.Application#beads
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
           *  @productversion FlexJS 0.0
           */
          public var beads:Array;
--        
++
          private var _beads:Array;
--        
++
          /**
           *  @copy org.apache.flex.core.IStrand#addBead()
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
           *  @productversion FlexJS 0.0
--         */        
++         */
          public function addBead(bead:IBead):void
          {
              if (!_beads)
                  _beads = [];
              _beads.push(bead);
--            bead.strand = this;            
++            bead.strand = this;
          }
--        
++
          /**
           *  @copy org.apache.flex.core.IStrand#getBeadByType()
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -289,16 -289,16 +289,16 @@@
              }
              return null;
          }
--        
++
          /**
           *  @copy org.apache.flex.core.IStrand#removeBead()
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
           *  @productversion FlexJS 0.0
           */
--        public function removeBead(value:IBead):IBead	
++        public function removeBead(value:IBead):IBead
          {
              var n:int = _beads.length;
              for (var i:int = 0; i < n; i++)

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/NumericStepper.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/NumericStepper.as
index e919295,e919295..984fda9
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/NumericStepper.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/NumericStepper.as
@@@ -37,6 -37,6 +37,7 @@@ package org.apache.flex.htm
  	 *  org.apache.flex.core.IBeadView: constructs the parts of the component.
  	 *  org.apache.flex.core.IBeadController: handles the input events.
  	 *
++     *  @toplevel
  	 *  @langversion 3.0
  	 *  @playerversion Flash 10.2
  	 *  @playerversion AIR 2.6
@@@ -160,7 -160,7 +161,7 @@@
          {
              element = document.createElement('div') as WrappedHTMLElement;
              positioner = element;
--            positioner.style.position = 'relative';
++            //positioner.style.position = 'relative';
  
              input = new TextInput();
              input.className = "NumericStepperInput";

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/Panel.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/Panel.as
index e9c5986,e9c5986..ab3b114
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/Panel.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/Panel.as
@@@ -19,6 -19,6 +19,9 @@@
  package org.apache.flex.html
  {
  	import org.apache.flex.core.IPanelModel;
++	import org.apache.flex.core.IChild;
++	import org.apache.flex.html.beads.PanelView;
++	import org.apache.flex.events.Event;
  
      COMPILE::JS
      {
@@@ -40,6 -40,6 +43,7 @@@
  	 *  org.apache.flex.core.IBorderBead: if present, draws a border around the Panel.
  	 *  org.apache.flex.core.IBackgroundBead: if present, provides a colored background for the Panel.
  	 *  
++     *  @toplevel
  	 *  @see PanelWithControlBar
  	 *  @see ControlBar
  	 *  @see TitleBar
@@@ -48,7 -48,7 +52,7 @@@
  	 *  @playerversion AIR 2.6
  	 *  @productversion FlexJS 0.0
  	 */
--	public class Panel extends Container
++	public class Panel extends Group
  	{
  		/**
  		 *  constructor.
@@@ -61,6 -61,6 +65,23 @@@
  		public function Panel()
  		{
  			super();
++			
++			className = "Panel";
++		}
++		
++		public function $addElement(c:IChild, dispatchEvent:Boolean = true):void
++		{
++			super.addElement(c, dispatchEvent);
++		}
++		
++		public function get $numElements():Number
++		{
++			return super.numElements;
++		}
++		
++		public function $getElementAt(index:Number):IChild
++		{
++			return super.getElementAt(index);
  		}
  		
  		/**
@@@ -109,13 -109,13 +130,67 @@@
  			IPanelModel(model).showCloseButton = value;
  		}
  		
--        COMPILE::JS
--        override protected function createElement():WrappedHTMLElement
--        {
--            super.createElement();
--            element.className = "Panel";
--            typeNames = "Panel";
--            return element;
--        }
++		
++		/**
++		 * @private
++		 * @flexjsignorecoercion org.apache.flex.html.beads.PanelView
++		 */
++		override public function addElement(c:IChild, dispatchEvent:Boolean = true):void
++		{
++			var panelView:PanelView = view as PanelView;
++			panelView.contentArea.addElement(c, dispatchEvent);
++			panelView.contentArea.dispatchEvent(new Event("layoutNeeded"));
++		}
++		
++		/**
++		 * @private
++		 * @flexjsignorecoercion org.apache.flex.html.beads.PanelView
++		 */
++		override public function addElementAt(c:IChild, index:int, dispatchEvent:Boolean = true):void
++		{
++			var panelView:PanelView = view as PanelView;
++			panelView.contentArea.addElementAt(c, index, dispatchEvent);
++			panelView.contentArea.dispatchEvent(new Event("layoutNeeded"));
++		}
++		
++		/**
++		 * @private
++		 * @flexjsignorecoercion org.apache.flex.html.beads.PanelView
++		 */
++		override public function getElementIndex(c:IChild):int
++		{
++			var panelView:PanelView = view as PanelView;
++			return panelView.contentArea.getElementIndex(c);
++		}
++		
++		/**
++		 * @private
++		 * @flexjsignorecoercion org.apache.flex.html.beads.PanelView
++		 */
++		override public function removeElement(c:IChild, dispatchEvent:Boolean = true):void
++		{
++			var panelView:PanelView = view as PanelView;
++			panelView.contentArea.removeElement(c, dispatchEvent);
++		}
++		
++		/**
++		 * @private
++		 * @flexjsignorecoercion org.apache.flex.html.beads.PanelView
++		 */
++		override public function get numElements():int
++		{
++			var panelView:PanelView = view as PanelView;
++			return panelView.contentArea.numElements;
++		}
++		
++		/**
++		 * @private
++		 * @flexjsignorecoercion org.apache.flex.html.beads.PanelView
++		 */
++		override public function getElementAt(index:int):IChild
++		{
++			var panelView:PanelView = view as PanelView;
++			return panelView.contentArea.getElementAt(index);
++		}
  	}
  }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/PanelWithControlBar.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/PanelWithControlBar.as
index 7659d9d,7659d9d..d5ff4b1
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/PanelWithControlBar.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/PanelWithControlBar.as
@@@ -33,12 -33,12 +33,13 @@@ package org.apache.flex.htm
  	 *  org.apache.flex.core.IBorderBead: if present, draws a border around the Panel.
  	 *  org.apache.flex.core.IBackgroundBead: if present, provides a colored background for the Panel.
  	 *  
++     *  @toplevel
  	 *  @langversion 3.0
  	 *  @playerversion Flash 10.2
  	 *  @playerversion AIR 2.6
  	 *  @productversion FlexJS 0.0
  	 */
--	public class PanelWithControlBar extends Container
++	public class PanelWithControlBar extends Panel
  	{
  		/**
  		 *  constructor.
@@@ -54,52 -54,52 +55,6 @@@
  		}
  		
  		/**
--		 *  The string to display in the org.apache.flex.html.TitleBar.
--		 *
--		 *  @langversion 3.0
--		 *  @playerversion Flash 10.2
--		 *  @playerversion AIR 2.6
--		 *  @productversion FlexJS 0.0
--		 */
--		public function get title():String
--		{
--			return IPanelModel(model).title;
--		}
--		public function set title(value:String):void
--		{
--			IPanelModel(model).title = value;
--		}
--		
--		/**
--		 *  The HTML string to display in the org.apache.flex.html.TitleBar.
--		 *
--		 *  @langversion 3.0
--		 *  @playerversion Flash 10.2
--		 *  @playerversion AIR 2.6
--		 *  @productversion FlexJS 0.0
--		 */
--		public function get htmlTitle():String
--		{
--			return IPanelModel(model).htmlTitle;
--		}
--		public function set htmlTitle(value:String):void
--		{
--			IPanelModel(model).htmlTitle = value;
--		}
--		
--		/**
--		 * Whether or not to show a Close button in the org.apache.flex.html.TitleBar.
--		 */
--		public function get showCloseButton():Boolean
--		{
--			return IPanelModel(model).showCloseButton;
--		}
--		public function set showCloseButton(value:Boolean):void
--		{
--			IPanelModel(model).showCloseButton = value;
--		}
--		
--		/**
  		 *  The items in the org.apache.flex.html.ControlBar. Setting this property automatically
  		 *  causes the ControlBar to display.
  		 *

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/RadioButton.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/RadioButton.as
index 282a9b7,9aa2254..a7dd387
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/RadioButton.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/RadioButton.as
@@@ -51,6 -51,6 +51,7 @@@ package org.apache.flex.htm
  	 *  org.apache.flex.core.IBeadModel: the data model, which includes the groupName.
  	 *  org.apache.flex.core.IBeadView:  the bead that constructs the visual parts of the RadioButton..
  	 *
++	 *  @toplevel
  	 *  @langversion 3.0
  	 *  @playerversion Flash 10.2
  	 *  @playerversion AIR 2.6
@@@ -252,7 -250,7 +253,7 @@@
              element = labelFor as WrappedHTMLElement;
  
              positioner = element;
--            positioner.style.position = 'relative';
++            //positioner.style.position = 'relative';
  
              (element as WrappedHTMLElement).flexjs_wrapper = this;
              (textNode as WrappedHTMLElement).flexjs_wrapper = this;

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/SimpleList.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/SimpleList.as
index 9dcb348,9dcb348..0d254e5
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/SimpleList.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/SimpleList.as
@@@ -21,14 -21,14 +21,15 @@@ package org.apache.flex.htm
      COMPILE::JS
      {
          import goog.events;
--        import org.apache.flex.core.WrappedHTMLElement;            
++        import org.apache.flex.core.WrappedHTMLElement;
      }
--        
++
  	/**
  	 *  The SimpleList class is a component that displays data in a vertical column. This
--	 *  component differs from org.apache.flex.html.List in that it displays 
++	 *  component differs from org.apache.flex.html.List in that it displays
  	 *  only string values and maps to the &lt;select&gt; HTML element.
--	 *  
++	 *
++     *  @toplevel
  	 *  @langversion 3.0
  	 *  @playerversion Flash 10.2
  	 *  @playerversion AIR 2.6
@@@ -48,7 -48,7 +49,7 @@@
  		{
  			super();
  		}
--        
++
          /**
           * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
           * @flexjsignorecoercion HTMLSelectElement
@@@ -61,12 -61,12 +62,12 @@@
              goog.events.listen(element, 'change',
                  changeHandler);
              positioner = element;
--            positioner.style.position = 'relative';
++            //positioner.style.position = 'relative';
              className = 'SimpleList';
--            
++
              return element;
--        }   
--        
++        }
++
          /**
           * @flexjsignorecoercion HTMLSelectElement
           */

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/Slider.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/Slider.as
index 151587c,d10891c..fc2889b
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/Slider.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/Slider.as
@@@ -23,22 -23,24 +23,23 @@@ package org.apache.flex.htm
  
      COMPILE::JS
      {
 -        import org.apache.flex.html.beads.SliderTrackView;
 -        import org.apache.flex.html.beads.SliderThumbView;
          import org.apache.flex.html.beads.controllers.SliderMouseController;
--        import org.apache.flex.core.WrappedHTMLElement;            
++        import org.apache.flex.core.WrappedHTMLElement;
      }
  
  	[Event(name="valueChange", type="org.apache.flex.events.Event")]
--	
++
  	/**
  	 *  The Slider class is a component that displays a range of values using a
  	 *  track and a thumb control. The Slider uses the following bead types:
--	 * 
++	 *
  	 *  org.apache.flex.core.IBeadModel: the data model, typically an IRangeModel, that holds the Slider values.
  	 *  org.apache.flex.core.IBeadView:  the bead that constructs the visual parts of the Slider.
  	 *  org.apache.flex.core.IBeadController: the bead that handles input.
  	 *  org.apache.flex.core.IThumbValue: the bead responsible for the display of the thumb control.
  	 *  org.apache.flex.core.ITrackView: the bead responsible for the display of the track.
--	 *  
++	 *
++     *  @toplevel
  	 *  @langversion 3.0
  	 *  @playerversion Flash 10.2
  	 *  @playerversion AIR 2.6
@@@ -57,16 -59,16 +58,16 @@@
  		public function Slider()
  		{
  			super();
--			
++
  			className = "Slider";
--			
++
  			IRangeModel(model).value = 0;
  			IRangeModel(model).minimum = 0;
  			IRangeModel(model).maximum = 100;
  			IRangeModel(model).stepSize = 1;
  			IRangeModel(model).snapInterval = 1;
  		}
--		
++
  		/**
  		 *  The current value of the Slider.
  		 *
@@@ -83,7 -85,7 +84,7 @@@
  		{
  			IRangeModel(model).value = newValue;
  		}
--		
++
  		/**
  		 *  The minimum value of the Slider.
  		 *
@@@ -100,7 -102,7 +101,7 @@@
  		{
  			IRangeModel(model).minimum = value;
  		}
--		
++
  		/**
  		 *  The maximum value of the Slider.
  		 *
@@@ -117,7 -119,7 +118,7 @@@
  		{
  			IRangeModel(model).maximum = value;
  		}
--		
++
  		/**
  		 *  The modulus of the Slider value. The thumb will be positioned
  		 *  at the nearest multiple of this value.
@@@ -135,7 -137,7 +136,7 @@@
  		{
  			IRangeModel(model).snapInterval = value;
  		}
--        
++
  		/**
  		 *  The amount to move the thumb when the track is selected. This value is
  		 *  adjusted to fit the nearest snapInterval.
@@@ -161,19 -172,28 +162,22 @@@
          override protected function createElement():WrappedHTMLElement
          {
              element = document.createElement('div') as WrappedHTMLElement;
 -            element.style.width = '200px';
++
++			// just to give it some default values
 +            element.style.width = '100px';
              element.style.height = '30px';
 -            
 -            track = new SliderTrackView();
 -            addBead(track);
 -            
 -            thumb = new SliderThumbView();
 -            addBead(thumb);
 -            
 -            controller = new SliderMouseController();
 -            addBead(controller);
--            
++
              positioner = element;
--            positioner.style.position = 'relative';
++            //positioner.style.position = 'relative';
              element.flexjs_wrapper = this;
--            
++
              className = 'Slider';
--            
++
              return element;
--        } 
--        
++        }
++
          /**
++		 * @private
           */
          COMPILE::JS
          public function snap(value:Number):Number
@@@ -191,6 -211,23 +195,5 @@@
                  return n + si;
              return n;
          }
 -        
 -        
 -        /**
 -         * @param {number} value The value used to calculate new position of the thumb.
 -         * @return {void} Moves the thumb to the corresponding position.
 -         */
 -        COMPILE::JS
 -        public function setThumbFromValue(value:Number):void
 -        {
 -            var min:Number = model.minimum;
 -            var max:Number = model.maximum;
 -            var p:Number = (value - min) / (max - min);
 -            var xloc:Number = p * (parseInt(track.element.style.width, 10) -
 -                parseInt(thumb.element.style.width, 10));
 -            
 -            thumb.element.style.left = "" + xloc + 'px';
 -        }        
--
      }
  }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/Spinner.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/Spinner.as
index 65b5290,65b5290..2cc160e
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/Spinner.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/Spinner.as
@@@ -37,6 -37,6 +37,7 @@@ package org.apache.flex.htm
  	 *  org.apache.flex.core.IBeadView:  the bead that constructs the visual parts of the Spinner.
  	 *  org.apache.flex.core.IBeadController: a bead that handles the input events.
  	 *
++     *  @toplevel
  	 *  @langversion 3.0
  	 *  @playerversion Flash 10.2
  	 *  @playerversion AIR 2.6
@@@ -155,7 -155,7 +156,7 @@@
          {
              element = document.createElement('div') as WrappedHTMLElement;
              positioner = element;
--            positioner.style.position = 'relative';
++            //positioner.style.position = 'relative';
  
              element.style.verticalAlign = 'middle';
              element.flexjs_wrapper = this;

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/SubAppLoader.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/SubAppLoader.as
index 0000000,0000000..6fc5d67
new file mode 100644
--- /dev/null
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/SubAppLoader.as
@@@ -1,0 -1,0 +1,137 @@@
++////////////////////////////////////////////////////////////////////////////////
++//
++//  Licensed to the Apache Software Foundation (ASF) under one or more
++//  contributor license agreements.  See the NOTICE file distributed with
++//  this work for additional information regarding copyright ownership.
++//  The ASF licenses this file to You under the Apache License, Version 2.0
++//  (the "License"); you may not use this file except in compliance with
++//  the License.  You may obtain a copy of the License at
++//
++//      http://www.apache.org/licenses/LICENSE-2.0
++//
++//  Unless required by applicable law or agreed to in writing, software
++//  distributed under the License is distributed on an "AS IS" BASIS,
++//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
++//  See the License for the specific language governing permissions and
++//  limitations under the License.
++//
++////////////////////////////////////////////////////////////////////////////////
++package org.apache.flex.html
++{
++	import org.apache.flex.core.IUIBase;
++	import org.apache.flex.core.UIBase;
++	import org.apache.flex.utils.PointUtils;
++	import org.apache.flex.geom.Point;
++	import org.apache.flex.events.Event;
++	
++	COMPILE::SWF
++	{
++		import flash.display.Loader;
++		import flash.display.DisplayObjectContainer;
++		import flash.system.LoaderContext;
++		import flash.system.ApplicationDomain;
++		import flash.net.URLRequest;
++		import flash.events.Event;
++	}
++	
++    COMPILE::JS
++    {
++        import org.apache.flex.core.WrappedHTMLElement;            
++    }
++    
++    /**
++     *  The SubAppLoader class can load Flash or HTML content into a space within an application. 
++	 *  Use SubAppLoader to identify where the application should appear, then use its loadApplication() 
++	 *  function to load the application dynamically.
++	 * 
++     *  @toplevel
++     *  @see org.apache.flex.html.beads.layout
++     *  @see org.apache.flex.html.supportClasses.ScrollingViewport
++     *  @langversion 3.0
++     *  @playerversion Flash 10.2
++     *  @playerversion AIR 2.6
++     *  @productversion FlexJS 0.0
++     */    
++	public class SubAppLoader extends UIBase
++	{
++        /**
++         *  Constructor.
++         *  
++         *  @langversion 3.0
++         *  @playerversion Flash 10.2
++         *  @playerversion AIR 2.6
++         *  @productversion FlexJS 0.0
++         */
++		public function SubAppLoader()
++		{
++			super();
++		}
++		
++		COMPILE::SWF
++		private var swfLoader:Loader;
++		
++		COMPILE::JS
++		private var htmlLoader:WrappedHTMLElement;
++		
++		/**
++		 * @private
++		 * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
++		 */
++		private function createLoader():void
++		{
++			COMPILE::SWF {				
++				if (swfLoader != null) {
++					removeChild(swfLoader);
++				}
++				
++				swfLoader = new Loader();
++				swfLoader.x = 0;
++				swfLoader.y = 0;
++			}
++				
++			COMPILE::JS {
++				var origin:Point = new Point(0,0);
++				var xlated:Point = PointUtils.localToGlobal(origin, parent);
++				
++				if (htmlLoader == null) {
++					htmlLoader = document.createElement('iframe') as WrappedHTMLElement;
++					htmlLoader["width"] = String(this.width);
++					htmlLoader["height"] = String(this.height);
++					htmlLoader.style.position = "absolute";
++					htmlLoader.style.left = String(xlated.x) + "px";
++					htmlLoader.style.top = String(xlated.y) + "px";
++					htmlLoader.style.backgroundColor = String("white");
++					htmlLoader.style.border = "none";
++					document.body.appendChild(htmlLoader);
++				}
++			}
++		}
++		
++		/**
++		 * Specifies the URL to load, depending on the runtime platform. Pass null for
++		 * whichever URL is not being used.
++         *  
++         *  @langversion 3.0
++         *  @playerversion Flash 10.2
++         *  @playerversion AIR 2.6
++         *  @productversion FlexJS 0.0
++		 */
++		public function loadApplication(swfURL:String, htmlURL:String):void
++		{
++			createLoader();
++			
++			COMPILE::SWF {
++				var url:URLRequest = new URLRequest(swfURL);
++				var loaderContext:LoaderContext = new LoaderContext(false, ApplicationDomain.currentDomain, null);
++				swfLoader.load(url, loaderContext);
++				if (swfLoader.parent == null) {
++					addChild(swfLoader);
++				}
++			}
++				
++			COMPILE::JS {
++				htmlLoader.setAttribute("src", htmlURL);
++			}
++		}
++	}
++}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/TextArea.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/TextArea.as
index 10b7555,c912dd4..2eb9c72
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/TextArea.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/TextArea.as
@@@ -20,25 -20,39 +20,39 @@@ package org.apache.flex.htm
  {
  	import org.apache.flex.core.ITextModel;
  	import org.apache.flex.core.UIBase;
+     import org.apache.flex.events.Event;
+ 
      COMPILE::JS
      {
-         import org.apache.flex.core.WrappedHTMLElement;            
+         import goog.events;
 -        import org.apache.flex.core.WrappedHTMLElement;            
++        import org.apache.flex.core.WrappedHTMLElement;
      }
- 	
+ 
+     /**
+      *  Dispatched when the user changes the text.
+      *
+      *  @langversion 3.0
+      *  @playerversion Flash 10.2
+      *  @playerversion AIR 2.6
+      *  @productversion FlexJS 0.8.0
+      */
+     [Event(name="change", type="org.apache.flex.events.Event")]
+ 
      /**
       *  The TextArea class implements the basic control for
       *  multi-line text input.
--     *  
++     *
+      *  @toplevel
       *  @langversion 3.0
       *  @playerversion Flash 10.2
       *  @playerversion AIR 2.6
       *  @productversion FlexJS 0.0
--     */    
++     */
  	public class TextArea extends UIBase
  	{
          /**
           *  Constructor.
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -47,11 -61,16 +61,16 @@@
  		public function TextArea()
  		{
  			super();
+ 
+             COMPILE::SWF
+             {
+                 model.addEventListener("textChange", textChangeHandler);
+             }
  		}
--		
++
          /**
           *  @copy org.apache.flex.html.Label#text
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -62,7 -82,7 +82,7 @@@
  		{
              COMPILE::SWF
              {
--                return ITextModel(model).text;                    
++                return ITextModel(model).text;
              }
              COMPILE::JS
              {
@@@ -83,12 -105,13 +105,13 @@@
              COMPILE::JS
              {
                  (element as HTMLInputElement).value = value;
+                 dispatchEvent(new Event('textChange'));
              }
  		}
--		
++
          /**
           *  @copy org.apache.flex.html.Label#html
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -104,9 -135,17 +135,17 @@@
           */
  		public function set html(value:String):void
  		{
- 			ITextModel(model).html = value;
+             COMPILE::SWF
+             {
+                 ITextModel(model).html = value;
+             }
+             COMPILE::JS
+             {
+                 (element as HTMLInputElement).value = value;
+                 dispatchEvent(new Event('textChange'));
+             }
  		}
--		
++
          /**
           * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
           */
@@@ -115,12 -154,33 +154,33 @@@
          {
              element = document.createElement('textarea') as WrappedHTMLElement;
              positioner = element;
--            positioner.style.position = 'relative';
++            //positioner.style.position = 'relative';
+ 
+             goog.events.listen(element, 'input', textChangeHandler);
 -            
++
              element.flexjs_wrapper = this;
              element.className = 'TextArea';
              typeNames = 'TextArea';
--            
++
              return element;
-         }        
+         }
+ 
+         private var inSetter:Boolean;
+ 
+         /**
+          *  dispatch change event in response to a textChange event
+          *
+          *  @langversion 3.0
+          *  @playerversion Flash 10.2
+          *  @playerversion AIR 2.6
+          *  @productversion FlexJS 0.8.0
+          */
+         public function textChangeHandler(event:Event):void
+         {
+             if (!inSetter)
+             {
+                 dispatchEvent(new Event(Event.CHANGE));
+             }
+         }
  	}
  }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/TextInput.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/TextInput.as
index c8df45d,c8df45d..0a63c95
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/TextInput.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/TextInput.as
@@@ -23,7 -23,7 +23,7 @@@ package org.apache.flex.htm
      COMPILE::JS
      {
          import goog.events;
--        import org.apache.flex.core.WrappedHTMLElement;            
++        import org.apache.flex.core.WrappedHTMLElement;
      }
  
  	/**
@@@ -39,17 -39,17 +39,18 @@@
      /**
       *  The TextInput class implements the basic control for
       *  single-line text input.
--     *  
++     *
++     *  @toplevel
       *  @langversion 3.0
       *  @playerversion Flash 10.2
       *  @playerversion AIR 2.6
       *  @productversion FlexJS 0.0
--     */    
++     */
  	public class TextInput extends UIBase
  	{
          /**
           *  Constructor.
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -61,13 -61,13 +62,13 @@@
  
              COMPILE::SWF
              {
--                model.addEventListener("textChange", textChangeHandler);                    
++                model.addEventListener("textChange", textChangeHandler);
              }
  		}
--		
++
          /**
           *  @copy org.apache.flex.html.Label#text
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -79,7 -79,7 +80,7 @@@
  		{
              COMPILE::SWF
              {
--                return ITextModel(model).text;                    
++                return ITextModel(model).text;
              }
              COMPILE::JS
              {
@@@ -97,7 -97,7 +98,7 @@@
              {
                  inSetter = true;
                  ITextModel(model).text = value;
--                inSetter = false;                    
++                inSetter = false;
              }
              COMPILE::JS
              {
@@@ -105,22 -105,22 +106,22 @@@
                  dispatchEvent(new Event('textChange'));
              }
  		}
--		
++
          /**
           *  @copy org.apache.flex.html.Label#html
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
           *  @productversion FlexJS 0.0
           *  @flexjsignorecoercion HTMLInputElement
           */
--		[Bindable(event="change")] 
++		[Bindable(event="change")]
  		public function get html():String
  		{
              COMPILE::SWF
              {
--                return ITextModel(model).html;                    
++                return ITextModel(model).html;
              }
              COMPILE::JS
              {
@@@ -136,7 -136,7 +137,7 @@@
  		{
              COMPILE::SWF
              {
--                ITextModel(model).html = value;                    
++                ITextModel(model).html = value;
              }
              COMPILE::JS
              {
@@@ -146,7 -146,7 +147,7 @@@
  		}
  
          private var inSetter:Boolean;
--        
++
  		/**
  		 *  dispatch change event in response to a textChange event
  		 *
@@@ -160,7 -160,7 +161,7 @@@
              if (!inSetter)
                  dispatchEvent(new Event(Event.CHANGE));
  		}
--        
++
          /**
           * @flexjsignorecoercion org.apache.flex.core.WrappedHTMLElement
           */
@@@ -168,20 -168,20 +169,20 @@@
          override protected function createElement():WrappedHTMLElement
          {
              element = document.createElement('input') as WrappedHTMLElement;
--            element.setAttribute('type', 'input');
++            element.setAttribute('type', 'text');
              element.className = 'TextInput';
              typeNames = 'TextInput';
--            
++
              //attach input handler to dispatch flexjs change event when user write in textinput
              //goog.events.listen(element, 'change', killChangeHandler);
              goog.events.listen(element, 'input', textChangeHandler);
--            
++
              positioner = element;
--            positioner.style.position = 'relative';
++            //positioner.style.position = 'relative';
              element.flexjs_wrapper = this;
--            
++
              return element;
--        }        
--        
++        }
++
  	}
  }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/TitleBar.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/TitleBar.as
index 3902330,3902330..2764731
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/TitleBar.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/TitleBar.as
@@@ -41,12 -41,12 +41,13 @@@ package org.apache.flex.htm
  	 *  org.apache.flex.core.IMeasurementBead: a bead that helps determine the size of the 
  	 *  org.apache.flex.html.TitleBar for layout.
  	 * 
++     *  @toplevel
  	 *  @langversion 3.0
  	 *  @playerversion Flash 10.2
  	 *  @playerversion AIR 2.6
  	 *  @productversion FlexJS 0.0
  	 */
--	public class TitleBar extends Container implements IChrome
++	public class TitleBar extends Group implements IChrome
  	{
  		/**
  		 *  constructor.
@@@ -135,11 -135,11 +136,8 @@@
              element = document.createElement('div') as WrappedHTMLElement;
              
              positioner = element;
--            positioner.style.position = 'relative';
              element.flexjs_wrapper = this;
              
--            className = 'TitleBar';
--            
              return element;
          }        
  	}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/VContainer.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/VContainer.as
index 92ebdca,92ebdca..13df0e8
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/VContainer.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/VContainer.as
@@@ -38,12 -38,12 +38,13 @@@ package org.apache.flex.htm
       *  </basic:Container>
       *  </code>
       *  
++     *  @toplevel
       *  @langversion 3.0
       *  @playerversion Flash 10.2
       *  @playerversion AIR 2.6
       *  @productversion FlexJS 0.0
       */    
--	public class VContainer extends Container implements IContainer
++	public class VContainer extends Container
  	{
          /**
           *  Constructor.

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/VRule.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/VRule.as
index d727f2a,89e372d..bdf05eb
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/VRule.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/VRule.as
@@@ -27,6 -27,6 +27,7 @@@ package org.apache.flex.htm
      /**
       *  The VRule class displays a vertical line
       *
++     *  @toplevel
       *  @langversion 3.0
       *  @playerversion Flash 10.2
       *  @playerversion AIR 2.6
@@@ -60,9 -60,9 +61,9 @@@
              element.style.borderBottom = 'none';
              element.style.borderRight = 'none';
              positioner = element;
-             positioner.style.position = 'relative';
 -           // positioner.style.position = 'relative';
++            //positioner.style.position = 'relative';
              element.flexjs_wrapper = this;
              return element;
-         }        
+         }
  	}
  }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/AccordionItemRendererView.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/AccordionItemRendererView.as
index 2656b3a,0000000..bc9f89d
mode 100644,000000..100644
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/AccordionItemRendererView.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/AccordionItemRendererView.as
@@@ -1,64 -1,0 +1,66 @@@
 +////////////////////////////////////////////////////////////////////////////////
 +//
 +//  Licensed to the Apache Software Foundation (ASF) under one or more
 +//  contributor license agreements.  See the NOTICE file distributed with
 +//  this work for additional information regarding copyright ownership.
 +//  The ASF licenses this file to You under the Apache License, Version 2.0
 +//  (the "License"); you may not use this file except in compliance with
 +//  the License.  You may obtain a copy of the License at
 +//
 +//      http://www.apache.org/licenses/LICENSE-2.0
 +//
 +//  Unless required by applicable law or agreed to in writing, software
 +//  distributed under the License is distributed on an "AS IS" BASIS,
 +//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 +//  See the License for the specific language governing permissions and
 +//  limitations under the License.
 +//
 +////////////////////////////////////////////////////////////////////////////////
 +package org.apache.flex.html.beads
 +{		
 +	import org.apache.flex.events.Event;
 +	import org.apache.flex.html.supportClasses.ICollapsible;
 +    
 +	/**
 +	 * This class creates and manages the contents of an AccordionItemItemRenderer
 +     *  
 +	 *  @viewbead
 +     *  @langversion 3.0
 +     *  @playerversion Flash 10.2
 +     *  @playerversion AIR 2.6
 +     *  @productversion FlexJS 0.0
 +	 */
 +	public class AccordionItemRendererView extends PanelView
 +	{
 +		/**
 +     	 *  The AccordionItemRendererView class is the default view for
 +         *  the org.apache.flex.html.supportClasses.AccordionItemRenderer classes.
 +         *  It provides some layout optimizations that can be attained by assuming
 +		 *  the strand to be an org.apache.flex.html.supportClasses.ICollapsible.
 +         *  
 +         *  @langversion 3.0
 +         *  @playerversion Flash 10.2
 +         *  @playerversion AIR 2.6
 +         *  @productversion FlexJS 0.0
 +         */
 +		public function AccordionItemRendererView()
 +		{
 +			super();
 +		}
 +		
 +		override protected function performLayout(event:Event):void
 +		{
 +			var collapsibleStrand:ICollapsible = _strand as ICollapsible;
 +			if (!collapsibleStrand.collapsed)
 +			{
 +				super.performLayout(event);
 +			} else // skip layout for viewport children
 +			{
- 				layoutViewBeforeContentLayout();
++				COMPILE::SWF {
++				// no longer needed layoutViewBeforeContentLayout();
 +				layoutViewAfterContentLayout();
++				}
 +			}
 +		}
 +	}
 +}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/AccordionView.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/AccordionView.as
index 282eb67,0000000..947da98
mode 100644,000000..100644
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/AccordionView.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/AccordionView.as
@@@ -1,90 -1,0 +1,91 @@@
 +////////////////////////////////////////////////////////////////////////////////
 +//
 +//  Licensed to the Apache Software Foundation (ASF) under one or more
 +//  contributor license agreements.  See the NOTICE file distributed with
 +//  this work for additional information regarding copyright ownership.
 +//  The ASF licenses this file to You under the Apache License, Version 2.0
 +//  (the "License"); you may not use this file except in compliance with
 +//  the License.  You may obtain a copy of the License at
 +//
 +//      http://www.apache.org/licenses/LICENSE-2.0
 +//
 +//  Unless required by applicable law or agreed to in writing, software
 +//  distributed under the License is distributed on an "AS IS" BASIS,
 +//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 +//  See the License for the specific language governing permissions and
 +//  limitations under the License.
 +//
 +////////////////////////////////////////////////////////////////////////////////
 +package org.apache.flex.html.beads
 +{
 +	import org.apache.flex.core.ISelectionModel;
 +	import org.apache.flex.core.IStyleableObject;
 +	import org.apache.flex.core.ValuesManager;
 +	import org.apache.flex.events.Event;
 +	import org.apache.flex.html.beads.layouts.IOneFlexibleChildLayout;
 +	import org.apache.flex.html.supportClasses.ICollapsible;
 +	import org.apache.flex.utils.StrandUtils;
 +	
 +	public class AccordionView extends ListView
 +	{
 +		private var _layout:IOneFlexibleChildLayout;
 +		public function AccordionView()
 +		{
 +			super();
 +		}
 +		
 +		override protected function selectionChangeHandler(event:Event):void
 +		{
 +			super.selectionChangeHandler(event);
 +			var renderer:IStyleableObject = dataGroup.getItemRendererForIndex(listModel.selectedIndex) as IStyleableObject;
 +			layout.flexibleChild = renderer.id;
 +		}
 +		
 +		public function get layout():IOneFlexibleChildLayout
 +		{
 +			if (!_layout)
 +			{
 +				_layout = _strand.getBeadByType(IOneFlexibleChildLayout) as IOneFlexibleChildLayout;
 +				if (!_layout) {
 +					var c:Class = ValuesManager.valuesImpl.getValue(host, "iBeadLayout");
 +					if (c) {
 +						_layout = new c() as IOneFlexibleChildLayout;
 +					}
 +				}
 +				if (_layout)
 +				{
 +					_strand.addBead(_layout);
 +				}
 +			}
 +			return _layout;
 +		}
 +		
 +		override protected function performLayout(event:Event):void
 +		{
 +			if (layout)
 +			{
 +				if (!layout.flexibleChild)
 +				{
 +					var model:ISelectionModel = StrandUtils.loadBead(ISelectionModel, "iBeadModel", host) as ISelectionModel;
 +					if (model.selectedIndex > -1)
 +					{
 +						layout.flexibleChild = (dataGroup.getItemRendererForIndex(model.selectedIndex) as IStyleableObject).id;
 +					}
 +				}
 +				super.performLayout(event);
 +			}
 +		}
 +		
++		COMPILE::SWF
 +		override protected function itemsCreatedHandler(event:Event):void
 +		{
 +			var n:int = dataGroup.numElements;
 +			for (var i:int = 0; i < n; i++)
 +			{
 +				var child:ICollapsible = dataGroup.getItemRendererForIndex(i) as ICollapsible;
 +				child.collapse();
 +			}
 +			super.itemsCreatedHandler(event);
 +		}
 +	}
 +}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/CenterElement.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/CenterElement.as
index 0000000,0000000..163679b
new file mode 100644
--- /dev/null
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/CenterElement.as
@@@ -1,0 -1,0 +1,84 @@@
++////////////////////////////////////////////////////////////////////////////////
++//
++//  Licensed to the Apache Software Foundation (ASF) under one or more
++//  contributor license agreements.  See the NOTICE file distributed with
++//  this work for additional information regarding copyright ownership.
++//  The ASF licenses this file to You under the Apache License, Version 2.0
++//  (the "License"); you may not use this file except in compliance with
++//  the License.  You may obtain a copy of the License at
++//
++//      http://www.apache.org/licenses/LICENSE-2.0
++//
++//  Unless required by applicable law or agreed to in writing, software
++//  distributed under the License is distributed on an "AS IS" BASIS,
++//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
++//  See the License for the specific language governing permissions and
++//  limitations under the License.
++//
++////////////////////////////////////////////////////////////////////////////////
++package org.apache.flex.html.beads
++{
++	import org.apache.flex.core.IBead;
++	import org.apache.flex.core.IChild;
++	import org.apache.flex.core.ILayoutChild;
++	import org.apache.flex.core.ILayoutParent;
++	import org.apache.flex.core.IParent;
++	import org.apache.flex.core.IStrand;
++	import org.apache.flex.events.Event;
++	import org.apache.flex.events.IEventDispatcher;
++	
++	/**
++	 *  The CenterElement bead breaks the normal layout flow and forces
++	 *  a particlular element to stay centered.
++	 * 	  
++	 *  @viewbead
++	 *  @langversion 3.0
++	 *  @playerversion Flash 10.2
++	 *  @playerversion AIR 2.6
++	 *  @productversion FlexJS 0.0
++	 */
++	
++	public class CenterElement implements IBead
++	{
++		private var _strand:IStrand;
++		public function CenterElement()
++		{
++		}
++		
++		public function set strand(value:IStrand):void
++		{
++			_strand = value;
++			var layoutParent:ILayoutParent = getLayoutParent((value as IChild).parent);
++			IEventDispatcher(layoutParent).addEventListener('layoutComplete', layoutCompleteHandler);
++		}
++		
++		private function layoutCompleteHandler(e:Event):void
++		{
++			var childWidth:Number = host.width;
++			var parentWidth:Number = (host.parent as ILayoutChild).width;
++			var childHeight:Number = host.height;
++			var parentHeight:Number = (host.parent as ILayoutChild).height;
++			host.x = (parentWidth - childWidth) / 2;
++			host.y = (parentHeight - childHeight) / 2;
++		}
++		
++		private function get host():ILayoutChild
++		{
++			return _strand as ILayoutChild;
++		}
++		
++		private function getLayoutParent(value:IParent):ILayoutParent
++		{
++			while (value)
++			{
++				if (value is ILayoutParent)
++				{
++					return value as ILayoutParent;
++				}
++				value = IChild(value).parent;
++			}
++			return null;
++		}
++
++	}
++}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/ComboBoxView.as
----------------------------------------------------------------------
diff --cc frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/ComboBoxView.as
index 990c3ab,83c261a..3adb9de
--- a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/ComboBoxView.as
+++ b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/ComboBoxView.as
@@@ -111,35 -116,82 +111,40 @@@ package org.apache.flex.html.bead
  		override public function set strand(value:IStrand):void
  		{
  			super.strand = value;
 -        
 -			selectionModel = value.getBeadByType(IComboBoxModel) as IComboBoxModel;
 -			selectionModel.addEventListener("selectedIndexChanged", selectionChangeHandler);
 -            
 -			textInput = new TextInput();
 -			IParent(strand).addElement(textInput);
 -			textInput.width = 100;
 -			textInput.height = 18;
  			
 -			upSprite = new Sprite();
 -			drawButton( upSprite, "up", 18, 18 );
 -			overSprite = new Sprite();
 -			drawButton( overSprite, "over", 18, 18 );
 -			downSprite = new Sprite();
 -			drawButton( downSprite, "down", 18, 18 );
++			var host:UIBase = value as UIBase;
+ 			
 -			button = new Button();
 -            button.upState = upSprite;
 -            button.overState = overSprite;
 -            button.downState = downSprite;
 -			DisplayObjectContainer(strand).addChild(button);
 -			button.width = 18;
 -			button.height = 18;
 -			button.x = textInput.width;
 -			button.y = textInput.y;
 +			input = new TextInput();
- 			input.className = "ComboBoxTextInput";
- 			UIBase(host).addElement(input);
++			input.className = "ComboBoxTextInput";			
  			
 -			// listen for events on the text input and modify the list and selection
 -			textInput.addEventListener("change", textChangeHandler,false,0,true);
 -		}
 -		
 -		private var upSprite:Sprite;
 -		private var overSprite:Sprite;
 -		private var downSprite:Sprite;
 -		
 -		/**
 -		 * @private
 -		 */
 -		private function drawButton( sprite:Sprite, mode:String, width:Number, height:Number ) : void
 -		{
 -			sprite.graphics.clear();
 -			sprite.graphics.lineStyle(1,0xFFFFFF);
 -			sprite.graphics.drawRect(0, 0, width-1, height-1);
 -			sprite.graphics.lineStyle(-1);
 +			button = new TextButton();
 +			button.className = "ComboBoxButton";
 +			button.text = '\u25BC';
- 			UIBase(host).addElement(button);
+ 			
 -			if( mode == "over" ) sprite.graphics.beginFill(0xCCCCCC);
 -			else if( mode == "down" ) sprite.graphics.beginFill(0x888888);
 -			sprite.graphics.drawRect(0, 0, width-1, height-1);
 -			sprite.graphics.endFill();
++			if (isNaN(host.width)) input.width = 100;
+ 			
 -			sprite.graphics.beginFill(0x333333);
 -			sprite.graphics.moveTo(4,4);
 -			sprite.graphics.lineTo(width-4,4);
 -			sprite.graphics.lineTo(int(width/2),height-4);
 -			sprite.graphics.lineTo(4,4);
 -			sprite.graphics.endFill();
 -		}
 -		
 -		private var _popUp:IStrand;
 -		
 -		/**
 -		 *  The pop-up component that holds the selection list.
 -		 *
 -		 *  @langversion 3.0
 -		 *  @playerversion Flash 10.2
 -		 *  @playerversion AIR 2.6
 -		 *  @productversion FlexJS 0.0
 -		 */
 -		public function get popUp():IStrand
 -		{
 -			return _popUp;
++			host.addElement(input);
++			host.addElement(button);
 +			
 +			var popUpClass:Class = ValuesManager.valuesImpl.getValue(_strand, "iPopUp") as Class;
 +			list = new popUpClass() as UIBase;
 +			list.visible = false;
 +			
 +			var model:IComboBoxModel = _strand.getBeadByType(IComboBoxModel) as IComboBoxModel;
 +			model.addEventListener("selectedIndexChanged", handleItemChange);
 +			model.addEventListener("selectedItemChanged", handleItemChange);
 +			
 +			IEventDispatcher(_strand).addEventListener("sizeChanged", handleSizeChange);
 +			
 +			// set initial value and positions using default sizes
 +			handleItemChange(null);
 +			handleSizeChange(null);
  		}
  		
 -		private var _popUpVisible:Boolean;
 -		
  		/**
 -		 *  This property is true if the pop-up selection list is currently visible.
 +		 *  Returns whether or not the pop-up is visible.
 +		 * 
 +		 *  @copy org.apache.flex.html.beads.IComboBoxView#text
  		 *
  		 *  @langversion 3.0
  		 *  @playerversion Flash 10.2
@@@ -153,46 -204,36 +158,61 @@@
  		}
  		public function set popUpVisible(value:Boolean):void
  		{
 -			if (value != _popUpVisible)
 -			{
 -				_popUpVisible = value;
 -				if (value)
 -				{
 -					if (!_popUp)
 -					{
 -						var popUpClass:Class = ValuesManager.valuesImpl.getValue(_strand, "iPopUp") as Class;
 -						_popUp = new popUpClass() as IStrand;
 -					}
 -					var root:Object = DisplayObject(_strand).root;
 -					var host:DisplayObjectContainer = DisplayObject(_strand).parent;
 -					while (host && !(host is IPopUpHost))
 -						host = host.parent;
 -                    if (host)
 -    					IPopUpHost(host).addElement(popUp as IChild);
 -				}
 -				else
 -				{
 -					DisplayObject(_popUp).parent.removeChild(_popUp as DisplayObject);                    
 +			if (value && !list.visible) {
 +				var model:IComboBoxModel = _strand.getBeadByType(IComboBoxModel) as IComboBoxModel;
 +				list.model = model;
 +				list.width = input.width;
++				list.height = 200;
 +				list.visible = true;
 +				
 +				var origin:Point = new Point(0, button.y+button.height);
 +				var relocated:Point = PointUtils.localToGlobal(origin,_strand);
 +				list.x = relocated.x
 +				list.y = relocated.y;
++				COMPILE::JS {
++					list.element.style.position = "absolute";
+ 				}
 +				
 +				var popupHost:IPopUpHost = UIUtils.findPopUpHost(_strand as IUIBase);
 +				popupHost.addElement(list);
 +			}
 +			else if (list.visible) {
 +				UIUtils.removePopUp(list);
 +				list.visible = false;
  			}
  		}
  		
  		/**
  		 * @private
  		 */
 -		private function selectionChangeHandler(event:Event):void
 +		private function handleSizeChange(event:Event):void
  		{
 -			text = selectionModel.selectedItem.toString();
++			var host:UIBase = UIBase(_strand);
++			
 +			input.x = 0;
 +			input.y = 0;
- 			input.width = host.width - 20;
++			if (host.isWidthSizedToContent()) {
++				input.width = 100;
++			} else {
++				input.width = host.width - 20;
++			}
 +			
 +			button.x = input.width;
 +			button.y = 0;
 +			button.width = 20;
 +			button.height = input.height;
 +			
 +			COMPILE::JS {
- 				// because the strand is a <div> it does not have a size so one is
- 				// assigned here based on the max height of the two components.
- 				var element:Object = UIBase(_strand).element;
- 				element["style"]["height"] = String(Math.max(input.height,button.height)) + "px";
++				input.element.style.position = "absolute";
++				button.element.style.position = "absolute";
++			}
++				
++			if (host.isHeightSizedToContent()) {
++				host.height = input.height;
++			}
++			if (host.isWidthSizedToContent()) {
++				host.width = input.width + button.width;
 +			}
  		}
  		
  		/**