<?xml version="1.0" encoding="utf-8"?>
<s:SkinnableContainer xmlns:fx="http://ns.adobe.com/mxml/2009" 
          xmlns:s="library://ns.adobe.com/flex/spark" 
          xmlns:mx="library://ns.adobe.com/flex/mx" >
    
    <fx:Metadata>
        [DefaultProperty("children")]
    </fx:Metadata>
    
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    
    <fx:Script>
        <![CDATA[
            import com.afi.estimator.model.PagesModel;
            import com.afi.estimator.views.View;
            import com.afi.estimator.views.paging.FormScroller;
            import com.afi.estimator.views.shell.background;
            import com.afi.estimator.views.ui.PrintPage;
            
            import mx.collections.ArrayCollection;
            import mx.core.IVisualElement;
            import mx.printing.FlexPrintJob;
            import mx.printing.FlexPrintJobScaleType;
            
            import spark.components.TextInput;
            
            private var _children:Array = [];
            
            private var _childrenChanged:Boolean = false;
            
            
            
            public function get children():Array {
                return _children;
            }
            
            public function set children(value:*):void {
                if(value is DisplayObject)
                    _children = [value];
                else
                    _children = value;
                
                _childrenChanged = true;
                invalidateProperties();
            }
            
            protected override function commitProperties():void {
                super.commitProperties();
                
                if(_childrenChanged) {
                    _children.map(function(child:IVisualElement,...rest):void {
                        content.addElement(child);
                    });
                    _childrenChanged = false;
                }
            }
            
            
            public function next():void
            {
                FormScroller.instance.next();
            }
            
            public function previous():void
            {
                FormScroller.instance.previous();
            }
            
        ]]>
    </fx:Script>
    
    <s:VGroup id="content" width="100%" horizontalAlign="center" />
    
</s:SkinnableContainer>