<widget xmlns="http://openajax.org/metadata" spec="1.0" id="http://microsoft.com/appmagic/htmlViewer" name="htmlViewer" jsClass="AppMagic.Controls.HtmlViewer" version="2.1.0" styleable="true" runtimeCost="1" xmlns:appMagic="http://schemas.microsoft.com/appMagic">
  <author name="Microsoft AppMagic" />
  <license type="text/html"><![CDATA[<p>TODO:  Need license text here.</p>]]></license>
  <description><![CDATA[HtmlViewer
      Control description here.]]></description>
  <requires>
    <require type="css" src="css/htmlViewer.css" />
    <require type="javascript" src="js/htmlViewer.js" />
  </requires>
  <appMagic:capabilities contextualViewsEnabled="true" autoBorders="true" autoPointerViewState="true" autoDisabledViewState="true" screenActiveAware="true" isVersionFlexible="true" />
  <content><![CDATA[
   <div class="appmagic-htmlviewer-container">
   <div class="appmagic-htmlviewer"
       data-bind="
         disabled: viewState.displayMode() === AppMagic.Constants.DisplayMode.Disabled,
         style: {
           backgroundColor: fill,
           paddingTop: properties.PaddingTop,
           paddingRight: properties.PaddingRight,
           paddingBottom: properties.PaddingBottom,
           paddingLeft: properties.PaddingLeft,
           webkitOverflowScrolling: controlWidget.isReplicable ? 'auto' : 'touch',
      }">
    <div class="appmagic-htmlviewer-div" data-bind="style: {
      overflowY: properties.AutoHeight() ? 'hidden' : 'auto'
    }">
      <div class="appmagic-htmlviewer-content"></div>
    </div>
  </div>
     <div class="appmagic-htmlviewer-disabled-overlay"
       data-bind="
         visible: viewState.displayMode() === AppMagic.Constants.DisplayMode.Disabled,
         style: { backgroundColor: properties.DisabledFill }">
     </div>
  </div>
  ]]></content>
  <properties>
    <property name="HtmlText" localizedName="##htmlViewer_HtmlText##" datatype="String" defaultValue="##HTMLViewer_DefaultValue_HtmlText##" isPrimaryInputProperty="true">
      <title>HtmlViewer contents</title>
      <appMagic:category>data</appMagic:category>
      <appMagic:displayName>##htmlViewer_HtmlText_DisplayName##</appMagic:displayName>
      <appMagic:tooltip>##htmlViewer_HtmlText_Tooltip##</appMagic:tooltip>
    </property>
    <!-- This is not an 'Auto' property. This is for allowing the label to grow vertically to display the content -->
    <property name="AutoHeight" localizedName="##CommonProperties_AutoHeight##" datatype="Boolean" defaultValue="false">
      <title>AutoHeight</title>
      <appMagic:category>design</appMagic:category>
      <appMagic:displayName>##CommonProperties_AutoHeight_DisplayName##</appMagic:displayName>
      <appMagic:tooltip>##CommonProperties_AutoHeight_Tooltip##</appMagic:tooltip>
    </property>
  </properties>
  <appMagic:includeProperties>
    <!-- Data -->
    <appMagic:includeProperty name="Tooltip" />
    <appMagic:includeProperty name="ContentLanguage" />
    <!-- Design -->
    <appMagic:includeProperty name="DisplayMode" />
    <appMagic:includeProperty name="DisabledFill" defaultValue="RGBA(119, 119, 119, .4)" />
    <appMagic:includeProperty name="Font" />
    <appMagic:includeProperty name="Color" />
    <appMagic:includeProperty name="Size" phoneDefaultValue="24" />
    <appMagic:includeProperty name="Fill" defaultValue="RGBA(255, 255, 255, 0)" />
    <appMagic:includeProperty name="BorderColor" />
    <appMagic:includeProperty name="DisabledBorderColor" defaultValue="RGBA(56, 56, 56, 1)" />
    <appMagic:includeProperty name="PressedBorderColor" defaultValue="Self.BorderColor" hidden="true" />
    <appMagic:includeProperty name="HoverBorderColor" defaultValue="Self.BorderColor" />
    <appMagic:includeProperty name="BorderStyle" defaultValue="%BorderStyle.RESERVED%.None" />
    <appMagic:includeProperty name="BorderThickness" />
    <appMagic:includeProperty name="Visible" />
    <appMagic:includeProperty name="Width" defaultValue="200" phoneDefaultValue="560" />
    <appMagic:includeProperty name="Height" defaultValue="40" phoneDefaultValue="70" />
    <appMagic:includeProperty name="PaddingTop" defaultValue="5" />
    <appMagic:includeProperty name="PaddingRight" defaultValue="5" />
    <appMagic:includeProperty name="PaddingBottom" defaultValue="5" />
    <appMagic:includeProperty name="PaddingLeft" defaultValue="5" />
    <appMagic:includeProperty name="X" />
    <appMagic:includeProperty name="Y" />
    <!-- Behavior Properties -->
    <appMagic:includeProperty name="OnSelect" direction="in" />
    <!-- Hidden properties -->
    <appMagic:includeProperty name="minimumWidth" defaultValue="35" />
    <appMagic:includeProperty name="minimumHeight" defaultValue="35" />
    <appMagic:includeProperty name="maximumWidth" defaultValue="1366" />
    <appMagic:includeProperty name="maximumHeight" defaultValue="7680" />
  </appMagic:includeProperties>
  <appMagic:propertyDependencies>
    <appMagic:propertyDependency input="AutoHeight" output="Height" />
  </appMagic:propertyDependencies>
  <appMagic:insertMetadata>
    <appMagic:category name="Display" priority="20" />
  </appMagic:insertMetadata>
  <!-- Display metadata providing property visibility, order, sections, and grouping in UI (e.g. properties panel) -->
  <appMagic:displayMetadata>
    <appMagic:section>
      <appMagic:property name="HtmlText" />
      <appMagic:property name="Font" displayType="FontEnum" showInFloatie="true" />
      <appMagic:property name="Size" labelOverride="##FontSize_Property##" showInFloatie="true" />
      <appMagic:property name="AutoHeight" />
      <appMagic:property name="DisplayMode" />
    </appMagic:section>
    <appMagic:section>
      <appMagic:property name="Visible" />
      <appMagic:propertyGroup name="Position">
        <appMagic:property name="X" />
        <appMagic:property name="Y" />
      </appMagic:propertyGroup>
      <appMagic:propertyGroup name="Size">
        <appMagic:property name="Width" />
        <appMagic:property name="Height" />
      </appMagic:propertyGroup>
      <appMagic:propertyGroup name="Padding">
        <appMagic:property name="PaddingTop" labelOverride="##Padding_Top_Title##" />
        <appMagic:property name="PaddingBottom" labelOverride="##Padding_Bottom_Title##" />
        <appMagic:property name="PaddingLeft" labelOverride="##Padding_Left_Title##" />
        <appMagic:property name="PaddingRight" labelOverride="##Padding_Right_Title##" />
      </appMagic:propertyGroup>
    </appMagic:section>
    <appMagic:section>
      <appMagic:propertyGroup name="Color">
        <appMagic:property name="Color" showInFloatie="true" />
        <appMagic:property name="Fill" showInFloatie="true" />
      </appMagic:propertyGroup>
      <appMagic:propertyGroup name="Border">
        <appMagic:property name="BorderStyle" />
        <appMagic:property name="BorderThickness" />
        <appMagic:property name="BorderColor" />
      </appMagic:propertyGroup>
    </appMagic:section>
    <appMagic:section>
      <appMagic:propertyGroup name="DisabledColor">
        <appMagic:property name="DisabledFill" />
        <appMagic:property name="DisabledBorderColor" />
      </appMagic:propertyGroup>
      <appMagic:propertyGroup name="HoverColor">
        <appMagic:property name="HoverBorderColor" />
      </appMagic:propertyGroup>
      <appMagic:property name="Tooltip" />
    </appMagic:section>
  </appMagic:displayMetadata>
  <appMagic:conversion from="2.0.0" to="2.1.0">
    <appMagic:conversionAction type="add" name="ContentLanguage" />
  </appMagic:conversion>
</widget>