1<!--
2Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
3This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
4The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
5The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
6Code distributed by Google as part of the polymer project is also
7subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
8-->
9
10<!--
11`core-menu` is a selector which styles to looks like a menu.
12
13    <core-menu selected="0">
14      <core-item icon="settings" label="Settings"></core-item>
15      <core-item icon="dialog" label="Dialog"></core-item>
16      <core-item icon="search" label="Search"></core-item>
17    </core-menu>
18    
19When an item is selected the `core-selected` class is added to it.  The user can
20use the class to add more stylings to the selected item.
21
22    core-item.core-selected {
23      color: red;
24    }
25
26The `selectedItem` property references the selected item.
27
28    <core-menu selected="0" selectedItem="{{item}}">
29      <core-item icon="settings" label="Settings"></core-item>
30      <core-item icon="dialog" label="Dialog"></core-item>
31      <core-item icon="search" label="Search"></core-item>
32    </core-menu>
33
34    <div>selected label: {{item.label}}</div>
35
36The `core-select` event signals selection change.
37
38    <core-menu selected="0" on-core-select="{{selectAction}}">
39      <core-item icon="settings" label="Settings"></core-item>
40      <core-item icon="dialog" label="Dialog"></core-item>
41      <core-item icon="search" label="Search"></core-item>
42    </core-menu>
43
44    ...
45
46    selectAction: function(e, detail) {
47      if (detail.isSelected) {
48        var selectedItem = detail.item;
49        ...
50      }
51    }
52
53@group Polymer Core Elements
54@element core-menu
55@extends core-selector
56-->
57
58<link rel="import" href="/core-selector/core-selector.html">
59
60<link rel="stylesheet" href="core-menu.css" shim-shadowdom>
61
62<polymer-element name="core-menu" extends="core-selector" noscript></polymer-element>
63