  *  to display the drop-down.  
  *
  *  @eventType spark.events.DropDownEvent.OPEN
- */
-[Event(name="open", type="spark.events.DropDownEvent")]
-
-/**
- *  TODO (jasonsj): write class description
  *  
  *  @langversion 3.0
  *  @playerversion AIR 3
  *  @productversion Flex 4.5.2
  */
-public class CalloutButton extends SkinnableContainer
+[Event(name="open", type="spark.events.DropDownEvent")]
+
+[DefaultProperty("calloutContent")]
+
+/**
+ *  The CalloutButton class is a drop down component that defines a button to
+ *  open and close a pop-up Callout component. CalloutButton is a component
+ *  whose layout and contents are proxied to the Callout when opened.
+ *
+ *  <p>When the callout list is open:</p>
+ *  <ul>
+ *    <li>Clicking the button closes the callout</li>
+ *    <li>Clicking outside of the callout closes the callout.</li>
+ *  </ul>
+ *
+ *  <p>The CalloutButton component has the following default characteristics:</p>
+ *     <table class="innertable">
+ *        <tr>
+ *           <th>Characteristic</th>
+ *           <th>Description</th>
+ *        </tr>
+ *        <tr>
+ *           <td>Default size</td>
+ *           <td>Wide enough to display the text label of the control</td>
+ *        </tr>
+ *        <tr>
+ *           <td>Minimum size</td>
+ *           <td>32 pixels wide and 43 pixels high</td>
+ *        </tr>
+ *        <tr>
+ *           <td>Maximum size</td>
+ *           <td>10000 pixels wide and 10000 pixels high</td>
+ *        </tr>
+ *        <tr>
+ *           <td>Default skin class</td>
+ *           <td>spark.skins.mobile.CalloutButtonSkin</td>
+ *        </tr>
+ *     </table>
+ *
+ *  @mxml
+ *  
+ *  <p>The <code>&lt;s:CalloutButton&gt;</code> tag inherits all of the tag 
+ *  attributes of its superclass and adds the following tag attributes:</p>
+ *  
+ *  <pre>
+ *  &lt;s:CalloutButton
+ *   <strong>Properties</strong>
+ *    horizontalPosition="auto"
+ *    verticalPosition="auto
+ *    label=""
+ *    calloutDestructionPolicy="auto"
+ * 
+ *   <strong>Events</strong>
+ *    open="<i>No default</i>"
+ *    close="<i>No default</i>"
+ *      ...
+ *      <i>child tags</i>
+ *      ...
+ *  &lt;/s:CalloutButton&gt;
+ *  </pre>
+ * 
+ *  @see spark.components.Callout
+ *  @see spark.components.Button
+ *  @see spark.skins.mobile.CalloutButtonSkin
+ *  @see spark.components.supportClasses.DropDownController
+ *  
+ *  @langversion 3.0
+ *  @playerversion AIR 3
+ *  @productversion Flex 4.5.2
+ */
+public class CalloutButton extends Button
 {
-    
     //--------------------------------------------------------------------------
     //
     //  Class constants


package spark.components
{
import mx.core.IFactory;
import mx.core.mx_internal;
import mx.events.FlexEvent;
import mx.utils.BitFlagUtil;

import spark.components.supportClasses.ButtonBase;
import spark.components.supportClasses.DropDownController;
import spark.events.DropDownEvent;
import spark.events.PopUpEvent;

use namespace mx_internal;


     *  stores those values.  If callout is around, the values are stored 
     *  on the callout directly.  However, we need to know what values 
     *  have been set by the developer on the CalloutButton (versus set on 
     *  the callout or defaults of the callout) as those are values 
     *  we want to carry around if the callout changes (via a new skin). 
     *  In order to store this info effeciently, calloutProperties becomes 
     *  a uint to store a series of BitFlags.  These bits represent whether a 
     *  property has been explicitely set on this CalloutButton.  When the 
