<!--
Copyright 2013 The Polymer Authors. All rights reserved.
Use of this source code is governed by a BSD-style
license that can be found in the LICENSE file.
-->
<!--
/**
 * @module Polymer Elements
 */

/**
 * g-menu-item is intended for use in a g-menu.
 *
 * @class g-menu-item
 */
-->
<link rel="import" href="g-icon.html">
<polymer-element name="g-menu-item" attributes="src label iconsize">
  <template>
    <style>
      .label {
        margin: 0 15px;
      }

      g-icon, .label, .label > * {
        display: inline-block;
        vertical-align: middle;
      }
    </style>
    <g-icon src="{{src}}" size="{{iconsize}}"></g-icon>
    <div class="label">
      <span>{{label}}</span>
      <content></content>
    </div>
  </template>
  <script>
    Polymer('g-menu-item', {
      /**
       * The URL of an image for the icon.
       *
       * @attribute src
       * @type string
       * @default ''
       */
      src: '',
      /**
       * Specifies the label for the menu item.
       *
       * @attribute label
       * @type string
       * @default ''
       */
      label: '',
      /**
       * Specifies the size of the icon.
       *
       * @attribute size
       * @type string
       * @default 24
       */
      iconsize: 24
    });
  </script>
</polymer-element>
