


  <!-- App -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/app/IonicApp/" class="api-section">
       App
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/app/IonicApp/">
          IonicApp
        </a>
      </li>

      <li>
        <a href="{{ page.versionHref }}/api/components/app/ionicBootStrap/">
          ionicBootstrap
        </a>
      </li>

      <li>
        <a href="{{ page.versionHref }}/api/components/app/IdRef/">
          IdRef
        </a>
      </li>
    </ul>
  </li>

  <!-- ActionSheet -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/action-sheet/ActionSheet/" class="api-section">
       ActionSheet
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/action-sheet/ActionSheet/">
          ActionSheet
        </a>
      </li>
    </ul>
  </li>

  <!-- Button -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/button/Button/" class="api-section">
      Button
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/button/Button/">
          Button
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/button/TapDisabled/">
          TapDisabled
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/button/TapClick/">
          TapClick
        </a>
      </li>
    </ul>
  </li>

  <!-- Card -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/card/Card/" class="api-section">
      Card
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/card/Card/">
          Card
        </a>
      </li>
    </ul>
  </li>

  <!-- Checkbox -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/checkbox/Checkbox/" class="api-section">
      Checkbox
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/checkbox/Checkbox/">
          Checkbox
        </a>
      </li>
    </ul>
  </li>

  <!-- Content -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/content/Content/" class="api-section">
      Content
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/content/Content/">
          Content
        </a>
      </li>
    </ul>
  </li>

  <!-- Icon -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/icon/Icon/" class="api-section">
      Icon
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/icon/Icon/">
          Icon
        </a>
      </li>
    </ul>
  </li>

  <!-- IonItem -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/item/IonItem/" class="api-section">
      IonItem
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/item/IonItem/">
          IonItem
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/item/ItemGroup/">
          ItemGroup
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/item/ItemGroupTitle/">
          ItemGroupTitle
        </a>
      </li>
    </ul>
  </li>

  <!-- IonInput -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/form/IonInput/" class="api-section">
      IonInput
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/form/IonInput/">
          IonInput
        </a>
      </li>
    </ul>
  </li>

  <!-- TextInput -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/text-input/TextInput/" class="api-section">
      TextInput
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/text-input/TextInput/">
          TextInput
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/text-input/TextInputElement/">
          TextInputElement
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/label/label/">
          Label
        </a>
      </li>
    </ul>
  </li>

  <!-- IonList -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/list/IonList/" class="api-section">
      IonList
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/list/IonList/">
          IonList
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/list/ListHeader/">
          ListHeader
        </a>
      </li>
    </ul>
  </li>

  <!-- ShowWhen -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/show-hide-when/ShowWhen/" class="api-section">
      ShowWhen
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/show-hide-when/ShowWhen/">
          ShowWhen
        </a>
      </li>
    </ul>
  </li>

  <!-- HideWhen -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/show-hide-when/HideWhen/" class="api-section">
      HideWhen
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/show-hide-when/HideWhen/">
          HideWhen
        </a>
      </li>
    </ul>
  </li>

  <!-- MaterialButton -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/material/MaterialButton/" class="api-section">
      MaterialButton
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/material/MaterialButton/">
          MaterialButton
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/material/MaterialRippleEffect/">
          MaterialRippleEffect
        </a>
      </li>
    </ul>
  </li>

  <!-- Menu -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/menu/Menu/" class="api-section">
       Menu
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/menu/Menu/">
          Menu
        </a>
      </li>

      <li>
        <a href="{{ page.versionHref }}/api/components/menu/MenuToggle/">
          MenuToggle
        </a>
      </li>

      <li>
        <a href="{{ page.versionHref }}/api/components/menu/MenuType/">
          MenuType
        </a>
      </li>
    </ul>
  </li>

  <!-- Modal -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/modal/ionModal/" class="api-section">
      Modal
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/modal/ionModal/">
          Modal
        </a>
      </li>
    </ul>
  </li>

   <!-- Nav -->
   <li class="menu-section">
     <a href="{{ page.versionHref }}/api/components/nav/Nav/" class="api-section">
       Nav
     </a>
     <ul>
       <li>
         <a href="{{ page.versionHref }}/api/components/nav/Nav/">
           Nav
         </a>
       </li>
       <li>
         <a href="{{ page.versionHref }}/api/components/nav/NavController/">
           NavController
         </a>
       </li>
       <li>
         <a href="{{ page.versionHref }}/api/components/nav/NavParams/">
           NavParams
         </a>
       </li>
       <li>
         <a href="{{ page.versionHref }}/api/components/nav/NavPush/">
           NavPush
         </a>
       </li>
       <li>
         <a href="{{ page.versionHref }}/api/components/nav/NavPop/">
           NavPop
         </a>
       </li>
       <li>
         <a href="{{ page.versionHref }}/api/components/nav/NavRouter/">
           NavRouter
         </a>
       </li>
     </ul>
   </li>

  <!-- NavBar -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/navbar/NavBar/" class="api-section">
      NavBar
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/navbar/NavBar/">
          NavBar
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/navbar/NavbarTemplate/">
          NavbarTemplate
        </a>
      </li>
    </ul>
  </li>

  <!-- Popup -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/popup/ionPopup/" class="api-section">
      Popup
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/popup/ionPopup/">
          Popup
        </a>
      </li>
    </ul>
  </li>

  <!-- Slides -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/slides/Slides/" class="api-section">
      Slides
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/slides/Slides/">
          Slides
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/slides/Slide/">
          Slide
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/slides/SlideLazy/">
          SlideLazy
        </a>
      </li>
    </ul>
  </li>

  <!-- Radio -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/radio/RadioGroup/" class="api-section">
      Radio
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/radio/RadioGroup/">
          RadioGroup
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/radio/RadioButton/">
          RadioButton
        </a>
      </li>
    </ul>
  </li>

  <!-- Scroll -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/scroll/Scroll/" class="api-section">
      Scroll
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/scroll/Scroll/">
          Scroll
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/scroll/Refresher/">
          Refresher
        </a>
      </li>
    </ul>
  </li>

  <!-- SearchBar -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/searchbar/SearchBar/" class="api-section">
      SearchBar
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/searchbar/SearchBar/">
          SearchBar
        </a>
      </li>
    </ul>
  </li>

  <!-- Segment -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/segment/Segment/" class="api-section">
      Segment
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/segment/Segment/">
          Segment
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/segment/SegmentControlValueAccessor/">
          SegmentControlValueAccessor
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/segment/SegmentButton/">
          SegmentButton
        </a>
      </li>
    </ul>
  </li>

  <!-- Switch -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/switch/Switch/" class="api-section">
      Switch
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/switch/Switch/">
          Switch
        </a>
      </li>
    </ul>
  </li>

  <!-- IonTabs -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/tabs/IonTabs/" class="api-section">
      IonTabs
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/tabs/IonTabs/">
          IonTabs
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/tabs/IonTab/">
          IonTab
        </a>
      </li>
    </ul>
  </li>

  <!-- Toolbar -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/toolbar/Toolbar/" class="api-section">
      Toolbar
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/toolbar/Toolbar/">
          Toolbar
        </a>
      </li>
      <li>
        <a href="{{ page.versionHref }}/api/components/toolbar/ToolbarBase/">
          ToolbarBase
        </a>
      </li>
    </ul>
  </li>

  <!-- View -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/components/view/View/" class="api-section">
      View
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/components/view/ViewItem/">
          ViewItem
        </a>
      </li>
    </ul>
  </li>


  <!-- Animations -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/animations/Animation/" class="api-section">
      Animations
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/animations/Animation/">
          Animation
        </a>
      </li>
    </ul>
  </li>


  <!-- Transitions -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/transitions/Transition/" class="api-section">
       Transitions
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/transitions/Transition/">
           Transition
        </a>
      </li>
    </ul>
  </li>


  <!-- Config -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/config/Config/" class="api-section">
       Config
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/config/Config/">
           Config
        </a>
      </li>

      <li>
        <a href="{{ page.versionHref }}/api/config/IonicDirectives/">
           IonicDirectives
        </a>
      </li>

      <li>
        <a href="{{ page.versionHref }}/api/config/IonicView/">
           IonicDirectives
        </a>
      </li>

      <li>
        <a href="{{ page.versionHref }}/api/config/IonicComponent/">
           IonicDirectives
        </a>
      </li>

      <li>
        <a href="{{ page.versionHref }}/api/config/App/">
           App
        </a>
      </li>
    </ul>
  </li>


  <!-- Net -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/net/Http/" class="api-section">
      Net
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/net/Http/">
           HTTP
        </a>
      </li>
    </ul>
  </li>


  <!-- Platform -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/platform/Platform/" class="api-section">
      Platform
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/platform/Platform/">
          Platform
        </a>
      </li>

      <li>
        <a href="{{ page.versionHref }}/api/platform/PlatformCtrl/">
          PlatformCtrl
        </a>
      </li>

    </ul>
  </li>


  <!-- Util -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/util/ClickBlock/" class="api-section">
      Util
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/util/ClickBlock/">
          Click Block
        </a>
      </li>
    </ul>
  </li>

  <!-- Storage -->
  <li class="menu-section">
    <a href="{{ page.versionHref }}/api/storage/Storage/" class="api-section">
      Storage
    </a>
    <ul>
      <li>
        <a href="{{ page.versionHref }}/api/storage/Storage/">
          Storage
        </a>
      </li>

      <li>
        <a href="{{ page.versionHref }}/api/storage/StorageEngine/">
          StorageEngine
        </a>
      </li>

      <li>
        <a href="{{ page.versionHref }}/api/storage/SqlStorage/">
          SqlStorage
        </a>
      </li>

      <li>
        <a href="{{ page.versionHref }}/api/storage/LocalStorage">
          LocalStorage
        </a>
      </li>
    </ul>
  </li>
