Commit dbcc99df authored by michaelpg's avatar michaelpg Committed by Commit bot

Add paper-item#^0.8.0 and run reproduce.sh

This brings paper-item v0.8.2 into third_party/polymer/v0_8.

I got a presubmit warning about not updating README.chromium.
Will that actually be a problem in the CQ?

BUG=485381

Review URL: https://codereview.chromium.org/1124133004

Cr-Commit-Position: refs/heads/master@{#329464}
parent f15ce16d
...@@ -15,6 +15,7 @@ ...@@ -15,6 +15,7 @@
"paper-checkbox": "PolymerElements/paper-checkbox#^0.8.0", "paper-checkbox": "PolymerElements/paper-checkbox#^0.8.0",
"paper-drawer-panel": "PolymerElements/paper-drawer-panel#^0.8.0", "paper-drawer-panel": "PolymerElements/paper-drawer-panel#^0.8.0",
"paper-input": "PolymerElements/paper-input#^0.8.0", "paper-input": "PolymerElements/paper-input#^0.8.0",
"paper-item": "PolymerElements/paper-item#^0.8.0",
"paper-menu": "PolymerElements/paper-menu#^0.8.0", "paper-menu": "PolymerElements/paper-menu#^0.8.0",
"paper-ripple": "PolymerElements/paper-ripple#^0.8.0", "paper-ripple": "PolymerElements/paper-ripple#^0.8.0",
"paper-styles": "PolymerElements/paper-styles#^0.8.0", "paper-styles": "PolymerElements/paper-styles#^0.8.0",
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.6.0", "webcomponentsjs": "webcomponents/webcomponentsjs#^0.6.0",
"web-component-tester": "~2.2.6" "web-component-tester": "~2.2.6"
}, },
"homepage": "https://github.com/polymerelements/iron-meta", "homepage": "https://github.com/PolymerElements/iron-meta",
"version": "0.8.2", "version": "0.8.2",
"_release": "0.8.2", "_release": "0.8.2",
"_resolution": { "_resolution": {
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
"tag": "v0.8.2", "tag": "v0.8.2",
"commit": "c67091ccb5cca75ea4d103b5ce6ae9703676aa98" "commit": "c67091ccb5cca75ea4d103b5ce6ae9703676aa98"
}, },
"_source": "git://github.com/polymerelements/iron-meta.git", "_source": "git://github.com/PolymerElements/iron-meta.git",
"_target": "^0.8.0", "_target": "^0.8.0",
"_originalSource": "polymerelements/iron-meta" "_originalSource": "PolymerElements/iron-meta"
} }
\ No newline at end of file
...@@ -18,14 +18,14 @@ ...@@ -18,14 +18,14 @@
"web-component-tester": "Polymer/web-component-tester#^2.2.3", "web-component-tester": "Polymer/web-component-tester#^2.2.3",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.6.0" "webcomponentsjs": "webcomponents/webcomponentsjs#^0.6.0"
}, },
"homepage": "https://github.com/PolymerElements/iron-selector", "homepage": "https://github.com/polymerelements/iron-selector",
"_release": "0.8.5", "_release": "0.8.5",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v0.8.5", "tag": "v0.8.5",
"commit": "6b56de55e3e7f8ed108c9c227c85bc2a2f360d0d" "commit": "6b56de55e3e7f8ed108c9c227c85bc2a2f360d0d"
}, },
"_source": "git://github.com/PolymerElements/iron-selector.git", "_source": "git://github.com/polymerelements/iron-selector.git",
"_target": "^0.8.0", "_target": "^0.8.0",
"_originalSource": "PolymerElements/iron-selector" "_originalSource": "polymerelements/iron-selector"
} }
\ No newline at end of file
paper-item
=========
\ No newline at end of file
{
"name": "paper-item",
"version": "0.8.0",
"authors": [
"Yvonne Yip <ykyyip@google.com>"
],
"keywords": [
"web-components",
"web-component",
"polymer"
],
"main": "index.html",
"private": true,
"repository": {
"type": "git",
"url": "git://github.com/PolymerElements/paper-item"
},
"license": "MIT",
"homepage": "https://github.com/PolymerElements/paper-item",
"ignore": [
],
"dependencies": {
"polymer": "Polymer/polymer#v0.8.0-rc.7",
"paper-styles": "PolymerElements/paper-styles#^0.8.0"
},
"devDependencies": {
"iron-icon": "PolymerElements/iron-icon#^0.8.0",
"iron-icons": "PolymerElements/iron-icons#^0.8.0",
"iron-doc-viewer": "PolymerElements/iron-doc-viewer#^0.8.0",
"test-fixture": "PolymerElements/test-fixture#^0.8.0",
"web-component-tester": "Polymer/web-component-tester#^2.2.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.6.0"
}
}
<!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<title>paper-item</title>
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../iron-doc-viewer/iron-doc-viewer.html">
<style>
body {
margin: 16px;
}
</style>
</head>
<body>
<iron-doc-viewer src="paper-item.html"></iron-doc-viewer>
</body>
</html>
(function() {
Polymer({
is: 'paper-icon-item',
enableCustomStyleProperties: true,
hostAttributes: {
'role': 'listitem'
},
properties: {
/**
* The width of the icon area.
*
* @attribute iconWidth
* @type String
* @default '56px'
*/
iconWidth: {
type: String,
value: '56px'
}
},
ready: function() {
this.$.contentIcon.style.width = this.iconWidth;
}
});
})();
<!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--><html><head><link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../paper-styles/paper-styles.html">
<!--
`paper-icon-item` is a list item with a fixed-width icon area.
@element paper-icon-item
-->
</head><body><dom-module id="paper-icon-item">
<link rel="import" type="css" href="paper-item-shared.css">
<style>
:host {
mixin(--layout-horizontal);
mixin(--layout-center);
mixin(--paper-font-subhead);
mixin(--paper-item);
mixin(--paper-icon-item);
}
</style>
<template>
<div id="contentIcon" class="content-icon layout horizontal center">
<content select="[item-icon]"></content>
</div>
<content></content>
</template>
</dom-module>
<script src="paper-icon-item-extracted.js"></script></body></html>
\ No newline at end of file
(function() {
Polymer({
is: 'paper-item-body',
enableCustomStyleProperties: true
});
})();
<!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--><html><head><link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../paper-styles/paper-styles.html">
<!--
@element paper-item-body
-->
</head><body><dom-module id="paper-item-body">
<style>
:host {
--mixin(--layout-vertical);
--mixin(--layout-center-justified);
--mixin(--layout-flex);
}
:host([two-line]) {
min-height: 72px;
}
:host([three-line]) {
min-height: 88px;
}
:host > ::content > * {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
:host > ::content [secondary] {
color: var(--secondary-text-color);
mixin(--paper-font-body1);
mixin(--paper-item-body-secondary);
}
</style>
<template>
<content></content>
</template>
</dom-module>
<script src="paper-item-body-extracted.js"></script></body></html>
\ No newline at end of file
(function() {
Polymer({
is: 'paper-item',
enableCustomStyleProperties: true,
hostAttributes: {
role: 'listitem'
}
});
})();
/*
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
*/
:host {
display: block;
min-height: 48px;
padding: 0px 16px;
}
:host > ::content > *:not(:first-child):not(:last-child) {
margin-right: 16px;
}
<!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--><html><head><link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../paper-styles/paper-styles.html">
<!--
`paper-item` is a non-interactive list item.
@element paper-item
-->
</head><body><dom-module id="paper-item">
<link rel="import" type="css" href="paper-item-shared.css">
<style>
:host {
mixin(--layout-horizontal);
mixin(--layout-center);
mixin(--paper-font-subhead);
mixin(--paper-item);
}
</style>
<template>
<content></content>
</template>
</dom-module>
<script src="paper-item-extracted.js"></script></body></html>
\ No newline at end of file
{ {
"name": "paper-menu", "name": "paper-menu",
"version": "0.8.2", "version": "0.8.3",
"authors": "The Polymer Authors", "authors": "The Polymer Authors",
"keywords": [ "keywords": [
"web-components", "web-components",
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
"ignore": [], "ignore": [],
"dependencies": { "dependencies": {
"polymer": "Polymer/polymer#v0.8.0-rc.7", "polymer": "Polymer/polymer#v0.8.0-rc.7",
"iron-selector": "PolymerElements/iron-selector#^0.8.0", "iron-menu-behavior": "PolymerElements/iron-menu-behavior#^0.8.0",
"paper-styles": "PolymerElements/paper-styles#^0.8.0" "paper-styles": "PolymerElements/paper-styles#^0.8.0"
}, },
"devDependencies": { "devDependencies": {
...@@ -28,11 +28,11 @@ ...@@ -28,11 +28,11 @@
"web-component-tester": "Polymer/web-component-tester#^2.2.0", "web-component-tester": "Polymer/web-component-tester#^2.2.0",
"webcomponentsjs": "Polymer/webcomponentsjs#^0.6.0" "webcomponentsjs": "Polymer/webcomponentsjs#^0.6.0"
}, },
"_release": "0.8.2", "_release": "0.8.3",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v0.8.2", "tag": "v0.8.3",
"commit": "a10381891339cb021d1215bd3bcf0eb96251acd9" "commit": "23566fd8054fe8a162972ba98dd2a6fcb58e8e2d"
}, },
"_source": "git://github.com/PolymerElements/paper-menu.git", "_source": "git://github.com/PolymerElements/paper-menu.git",
"_target": "^0.8.0", "_target": "^0.8.0",
......
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
"ignore": [], "ignore": [],
"dependencies": { "dependencies": {
"polymer": "Polymer/polymer#v0.8.0-rc.7", "polymer": "Polymer/polymer#v0.8.0-rc.7",
"iron-selector": "PolymerElements/iron-selector#^0.8.0", "iron-menu-behavior": "PolymerElements/iron-menu-behavior#^0.8.0",
"paper-styles": "PolymerElements/paper-styles#^0.8.0" "paper-styles": "PolymerElements/paper-styles#^0.8.0"
}, },
"devDependencies": { "devDependencies": {
......
...@@ -2,259 +2,15 @@ ...@@ -2,259 +2,15 @@
(function() { (function() {
// FIXME menu control should be refactored to a more general element
Polymer({ Polymer({
is: 'paper-menu', is: 'paper-menu',
enableCustomStyleProperties: true, enableCustomStyleProperties: true,
mixins: [ behaviors: [
Polymer.Core.Selectable Polymer.IronMenuBehavior
], ]
properties: {
/**
* Returns the currently focused item.
*
* @attribute focusedItem
* @type Object
*/
focusedItem: {
observer: 'focusedItemChanged',
readOnly: true,
type: Object
},
/**
* The attribute to use on menu items to look up the item title. Typing the first
* letter of an item when the menu is open focuses that item. If unset, `textContent`
* will be used.
*
* @attribute attrForItemTitle
* @type String
*/
attrForItemTitle: {
type: String
},
/***********************************************************************/
/* Polymer.Core.Selectable */
/***********************************************************************/
/**
* If you want to use the attribute value of an element for `selected` instead of the index,
* set this to the name of the attribute.
*
* @attribute attrForSelected
* @type String
*/
attrForSelected: {
type: String
},
/**
* If true, multiple selections are allowed.
*
* @attribute multi
* @type Boolean
* @default false
*/
multi: {
observer: 'multiChanged',
type: Boolean,
value: false
},
/**
* Gets or sets the selected element. The default is to use the index of the item. In
* multi-selection this should be an array of values.
*
* @attribute selected
* @type String|Array
*/
selected: {
notify: true,
observer: 'selectedChanged',
type: String
},
/**
* Returns the currently selected item. In multi-selection this returns an array of
* selected items.
*
* @attribute selectedItem
* @type Object|Array
*/
selectedItem: {
notify: true,
observer: 'selectedItemChanged',
readOnly: true,
type: Object
},
/**
* The event that would be fired from the item to indicate it is being selected. Set this
* to empty string or null if you don't want to listen for any events.
*
* @attribute activateEvent
* @type String
* @default 'click'
*/
activateEvent: {
observer: 'activateEventChanged',
type: String,
value: 'click'
},
/**
* If this is set, only items with local name that matches the `selectable` are selectable.
*
* @attribute selectable
* @type String
*/
selectable: {
type: String
}
},
hostAttributes: {
'role': 'menu',
'tabindex': '0'
},
listeners: {
'focus': 'onFocus',
'keydown': 'onKeydown'
},
created: function() {
this._bindActivateHandler = this.activateHandler.bind(this);
},
attached: function() {
this.selectableAttached();
},
detached: function() {
this.selectableDetached();
this.removeListener(this.activateEvent);
},
addListener: function(eventName) {
if (eventName) {
this.addEventListener(eventName, this._bindActivateHandler);
}
},
removeListener: function(eventName) {
if (eventName) {
this.removeEventListener(eventName, this._bindActivateHandler);
}
},
activateEventChanged: function(eventName, old) {
this.removeListener(old);
this.addListener(eventName);
},
focusedItemChanged: function(focusedItem, old) {
old && old.setAttribute('tabindex', '-1');
if (focusedItem) {
focusedItem.setAttribute('tabindex', '0');
focusedItem.focus();
}
},
multiChanged: function(multi) {
this.selection.multi = multi;
this.selectedChanged(this.selected);
},
selectedChanged: function(selected, old) {
this._selectedChanged(selected, old);
},
selectedItemChanged: function(selectedItem) {
this._setFocusedItem(Array.isArray(selectedItem) ? selectedItem[0] : selectedItem);
},
activateHandler: function(e) {
var t = e.target;
var items = this.items;
while (t && t != this) {
var i = items.indexOf(t);
if (i >= 0) {
if (t.hasAttribute('disabled')) {
return;
}
var value = this.indexToValue(i);
if (!this.fire('iron-activate', {selected: value, item: t}).defaultPrevented) {
this.select(value);
}
return;
}
t = t.parentNode;
}
},
onFocus: function(event) {
// clear the cached focus item
this._setFocusedItem(null);
// focus the selected item when the menu receives focus, or the first item
// if no item is selected
var selectedItem = this.selectedItem;
selectedItem = Array.isArray(selectedItem) ? selectedItem[0] : selectedItem;
if (selectedItem) {
this._setFocusedItem(selectedItem);
} else {
this._setFocusedItem(this.items[0]);
}
},
onKeydown: function(event) {
// FIXME want to define these somewhere, core-a11y-keys?
var DOWN = 40;
var UP = 38;
var ESC = 27;
var ENTER = 13;
if (event.keyCode === DOWN) {
// up and down arrows moves the focus
this.focusNext();
} else if (event.keyCode === UP) {
this.focusPrevious();
} else if (event.keyCode === ESC) {
// esc blurs the control
this.focusedItem.blur();
} else if (event.keyCode === ENTER) {
// enter activates the item
this.activateHandler(event);
} else {
// all other keys focus the menu item starting with that character
for (var i = 0, item; item = this.items[i]; i++) {
var attr = this.attrForItemTitle || 'textContent';
var title = item[attr] || item.getAttribute(attr);
if (title && title.charAt(0).toLowerCase() === String.fromCharCode(event.keyCode).toLowerCase()) {
this._setFocusedItem(item);
break;
}
}
}
},
focusPrevious: function() {
var length = this.items.length;
var index = (Number(this.indexOf(this.focusedItem)) - 1 + length) % length;
this._setFocusedItem(this.items[index]);
},
focusNext: function() {
var index = (Number(this.indexOf(this.focusedItem)) + 1) % this.items.length;
this._setFocusedItem(this.items[index]);
}
}); });
......
...@@ -7,7 +7,7 @@ The complete set of contributors may be found at http://polymer.github.io/CONTRI ...@@ -7,7 +7,7 @@ The complete set of contributors may be found at http://polymer.github.io/CONTRI
Code distributed by Google as part of the polymer project is also Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--><html><head><link rel="import" href="../polymer/polymer.html"> --><html><head><link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../iron-selector/iron-selectable.html"> <link rel="import" href="../iron-menu-behavior/iron-menu-behavior.html">
<link rel="import" href="../paper-styles/paper-styles.html"> <link rel="import" href="../paper-styles/paper-styles.html">
<!-- <!--
...@@ -19,6 +19,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN ...@@ -19,6 +19,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<style> <style>
:host { :host {
display: block;
padding: 8px 0; padding: 8px 0;
background: var(--primary-background-color); background: var(--primary-background-color);
...@@ -36,7 +37,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN ...@@ -36,7 +37,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
} }
:host > ::content > .iron-selected::after { :host > ::content > .iron-selected::after {
mixin(--fit); mixin(--layout-fit);
background: currentColor; background: currentColor;
/* FIXME move to paper-styles for next widget */ /* FIXME move to paper-styles for next widget */
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.6.0", "webcomponentsjs": "webcomponents/webcomponentsjs#^0.6.0",
"web-component-tester": "~2.2.6" "web-component-tester": "~2.2.6"
}, },
"homepage": "https://github.com/polymerelements/iron-meta", "homepage": "https://github.com/PolymerElements/iron-meta",
"version": "0.8.2", "version": "0.8.2",
"_release": "0.8.2", "_release": "0.8.2",
"_resolution": { "_resolution": {
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
"tag": "v0.8.2", "tag": "v0.8.2",
"commit": "c67091ccb5cca75ea4d103b5ce6ae9703676aa98" "commit": "c67091ccb5cca75ea4d103b5ce6ae9703676aa98"
}, },
"_source": "git://github.com/polymerelements/iron-meta.git", "_source": "git://github.com/PolymerElements/iron-meta.git",
"_target": "^0.8.0", "_target": "^0.8.0",
"_originalSource": "polymerelements/iron-meta" "_originalSource": "PolymerElements/iron-meta"
} }
\ No newline at end of file
...@@ -18,14 +18,14 @@ ...@@ -18,14 +18,14 @@
"web-component-tester": "Polymer/web-component-tester#^2.2.3", "web-component-tester": "Polymer/web-component-tester#^2.2.3",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.6.0" "webcomponentsjs": "webcomponents/webcomponentsjs#^0.6.0"
}, },
"homepage": "https://github.com/PolymerElements/iron-selector", "homepage": "https://github.com/polymerelements/iron-selector",
"_release": "0.8.5", "_release": "0.8.5",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v0.8.5", "tag": "v0.8.5",
"commit": "6b56de55e3e7f8ed108c9c227c85bc2a2f360d0d" "commit": "6b56de55e3e7f8ed108c9c227c85bc2a2f360d0d"
}, },
"_source": "git://github.com/PolymerElements/iron-selector.git", "_source": "git://github.com/polymerelements/iron-selector.git",
"_target": "^0.8.0", "_target": "^0.8.0",
"_originalSource": "PolymerElements/iron-selector" "_originalSource": "polymerelements/iron-selector"
} }
\ No newline at end of file
{
"name": "paper-item",
"version": "0.8.2",
"authors": [
"Yvonne Yip <ykyyip@google.com>"
],
"keywords": [
"web-components",
"web-component",
"polymer"
],
"main": "index.html",
"private": true,
"repository": {
"type": "git",
"url": "git://github.com/PolymerElements/paper-item"
},
"license": "MIT",
"homepage": "https://github.com/PolymerElements/paper-item",
"ignore": [],
"dependencies": {
"polymer": "Polymer/polymer#v0.8.0-rc.7",
"paper-styles": "PolymerElements/paper-styles#^0.8.0"
},
"devDependencies": {
"iron-icon": "PolymerElements/iron-icon#^0.8.0",
"iron-icons": "PolymerElements/iron-icons#^0.8.0",
"iron-doc-viewer": "PolymerElements/iron-doc-viewer#^0.8.0",
"test-fixture": "PolymerElements/test-fixture#^0.8.0",
"web-component-tester": "Polymer/web-component-tester#^2.2.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.6.0"
},
"_release": "0.8.2",
"_resolution": {
"type": "version",
"tag": "v0.8.2",
"commit": "0fb9b2b2fa033088a09896d721833bcd27ee164e"
},
"_source": "git://github.com/PolymerElements/paper-item.git",
"_target": "^0.8.0",
"_originalSource": "PolymerElements/paper-item"
}
\ No newline at end of file
paper-item
=========
\ No newline at end of file
{
"name": "paper-item",
"version": "0.8.0",
"authors": [
"Yvonne Yip <ykyyip@google.com>"
],
"keywords": [
"web-components",
"web-component",
"polymer"
],
"main": "index.html",
"private": true,
"repository": {
"type": "git",
"url": "git://github.com/PolymerElements/paper-item"
},
"license": "MIT",
"homepage": "https://github.com/PolymerElements/paper-item",
"ignore": [
],
"dependencies": {
"polymer": "Polymer/polymer#v0.8.0-rc.7",
"paper-styles": "PolymerElements/paper-styles#^0.8.0"
},
"devDependencies": {
"iron-icon": "PolymerElements/iron-icon#^0.8.0",
"iron-icons": "PolymerElements/iron-icons#^0.8.0",
"iron-doc-viewer": "PolymerElements/iron-doc-viewer#^0.8.0",
"test-fixture": "PolymerElements/test-fixture#^0.8.0",
"web-component-tester": "Polymer/web-component-tester#^2.2.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.6.0"
}
}
<!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<title>paper-item</title>
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../iron-doc-viewer/iron-doc-viewer.html">
<style>
body {
margin: 16px;
}
</style>
</head>
<body>
<iron-doc-viewer src="paper-item.html"></iron-doc-viewer>
</body>
</html>
<!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../paper-styles/paper-styles.html">
<!--
`paper-icon-item` is a list item with a fixed-width icon area.
@element paper-icon-item
-->
<dom-module id="paper-icon-item">
<link rel="import" type="css" href="paper-item-shared.css">
<style>
:host {
mixin(--layout-horizontal);
mixin(--layout-center);
mixin(--paper-font-subhead);
mixin(--paper-item);
mixin(--paper-icon-item);
}
</style>
<template>
<div id="contentIcon" class="content-icon layout horizontal center">
<content select="[item-icon]"></content>
</div>
<content></content>
</template>
</dom-module>
<script>
(function() {
Polymer({
is: 'paper-icon-item',
enableCustomStyleProperties: true,
hostAttributes: {
'role': 'listitem'
},
properties: {
/**
* The width of the icon area.
*
* @attribute iconWidth
* @type String
* @default '56px'
*/
iconWidth: {
type: String,
value: '56px'
}
},
ready: function() {
this.$.contentIcon.style.width = this.iconWidth;
}
});
})();
</script>
<!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../paper-styles/paper-styles.html">
<!--
@element paper-item-body
-->
<dom-module id="paper-item-body">
<style>
:host {
--mixin(--layout-vertical);
--mixin(--layout-center-justified);
--mixin(--layout-flex);
}
:host([two-line]) {
min-height: 72px;
}
:host([three-line]) {
min-height: 88px;
}
:host > ::content > * {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
:host > ::content [secondary] {
color: var(--secondary-text-color);
mixin(--paper-font-body1);
mixin(--paper-item-body-secondary);
}
</style>
<template>
<content></content>
</template>
</dom-module>
<script>
(function() {
Polymer({
is: 'paper-item-body',
enableCustomStyleProperties: true
});
})();
</script>
/*
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
*/
:host {
display: block;
min-height: 48px;
padding: 0px 16px;
}
:host > ::content > *:not(:first-child):not(:last-child) {
margin-right: 16px;
}
<!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../paper-styles/paper-styles.html">
<!--
`paper-item` is a non-interactive list item.
@element paper-item
-->
<dom-module id="paper-item">
<link rel="import" type="css" href="paper-item-shared.css">
<style>
:host {
mixin(--layout-horizontal);
mixin(--layout-center);
mixin(--paper-font-subhead);
mixin(--paper-item);
}
</style>
<template>
<content></content>
</template>
</dom-module>
<script>
(function() {
Polymer({
is: 'paper-item',
enableCustomStyleProperties: true,
hostAttributes: {
role: 'listitem'
}
});
})();
</script>
{ {
"name": "paper-menu", "name": "paper-menu",
"version": "0.8.2", "version": "0.8.3",
"authors": "The Polymer Authors", "authors": "The Polymer Authors",
"keywords": [ "keywords": [
"web-components", "web-components",
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
"ignore": [], "ignore": [],
"dependencies": { "dependencies": {
"polymer": "Polymer/polymer#v0.8.0-rc.7", "polymer": "Polymer/polymer#v0.8.0-rc.7",
"iron-selector": "PolymerElements/iron-selector#^0.8.0", "iron-menu-behavior": "PolymerElements/iron-menu-behavior#^0.8.0",
"paper-styles": "PolymerElements/paper-styles#^0.8.0" "paper-styles": "PolymerElements/paper-styles#^0.8.0"
}, },
"devDependencies": { "devDependencies": {
...@@ -28,11 +28,11 @@ ...@@ -28,11 +28,11 @@
"web-component-tester": "Polymer/web-component-tester#^2.2.0", "web-component-tester": "Polymer/web-component-tester#^2.2.0",
"webcomponentsjs": "Polymer/webcomponentsjs#^0.6.0" "webcomponentsjs": "Polymer/webcomponentsjs#^0.6.0"
}, },
"_release": "0.8.2", "_release": "0.8.3",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v0.8.2", "tag": "v0.8.3",
"commit": "a10381891339cb021d1215bd3bcf0eb96251acd9" "commit": "23566fd8054fe8a162972ba98dd2a6fcb58e8e2d"
}, },
"_source": "git://github.com/PolymerElements/paper-menu.git", "_source": "git://github.com/PolymerElements/paper-menu.git",
"_target": "^0.8.0", "_target": "^0.8.0",
......
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
"ignore": [], "ignore": [],
"dependencies": { "dependencies": {
"polymer": "Polymer/polymer#v0.8.0-rc.7", "polymer": "Polymer/polymer#v0.8.0-rc.7",
"iron-selector": "PolymerElements/iron-selector#^0.8.0", "iron-menu-behavior": "PolymerElements/iron-menu-behavior#^0.8.0",
"paper-styles": "PolymerElements/paper-styles#^0.8.0" "paper-styles": "PolymerElements/paper-styles#^0.8.0"
}, },
"devDependencies": { "devDependencies": {
......
...@@ -9,7 +9,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN ...@@ -9,7 +9,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
--> -->
<link rel="import" href="../polymer/polymer.html"> <link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../iron-selector/iron-selectable.html"> <link rel="import" href="../iron-menu-behavior/iron-menu-behavior.html">
<link rel="import" href="../paper-styles/paper-styles.html"> <link rel="import" href="../paper-styles/paper-styles.html">
<!-- <!--
...@@ -21,6 +21,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN ...@@ -21,6 +21,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<style> <style>
:host { :host {
display: block;
padding: 8px 0; padding: 8px 0;
background: var(--primary-background-color); background: var(--primary-background-color);
...@@ -38,7 +39,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN ...@@ -38,7 +39,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
} }
:host > ::content > .iron-selected::after { :host > ::content > .iron-selected::after {
mixin(--fit); mixin(--layout-fit);
background: currentColor; background: currentColor;
/* FIXME move to paper-styles for next widget */ /* FIXME move to paper-styles for next widget */
...@@ -68,259 +69,15 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN ...@@ -68,259 +69,15 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
(function() { (function() {
// FIXME menu control should be refactored to a more general element
Polymer({ Polymer({
is: 'paper-menu', is: 'paper-menu',
enableCustomStyleProperties: true, enableCustomStyleProperties: true,
mixins: [ behaviors: [
Polymer.Core.Selectable Polymer.IronMenuBehavior
], ]
properties: {
/**
* Returns the currently focused item.
*
* @attribute focusedItem
* @type Object
*/
focusedItem: {
observer: 'focusedItemChanged',
readOnly: true,
type: Object
},
/**
* The attribute to use on menu items to look up the item title. Typing the first
* letter of an item when the menu is open focuses that item. If unset, `textContent`
* will be used.
*
* @attribute attrForItemTitle
* @type String
*/
attrForItemTitle: {
type: String
},
/***********************************************************************/
/* Polymer.Core.Selectable */
/***********************************************************************/
/**
* If you want to use the attribute value of an element for `selected` instead of the index,
* set this to the name of the attribute.
*
* @attribute attrForSelected
* @type String
*/
attrForSelected: {
type: String
},
/**
* If true, multiple selections are allowed.
*
* @attribute multi
* @type Boolean
* @default false
*/
multi: {
observer: 'multiChanged',
type: Boolean,
value: false
},
/**
* Gets or sets the selected element. The default is to use the index of the item. In
* multi-selection this should be an array of values.
*
* @attribute selected
* @type String|Array
*/
selected: {
notify: true,
observer: 'selectedChanged',
type: String
},
/**
* Returns the currently selected item. In multi-selection this returns an array of
* selected items.
*
* @attribute selectedItem
* @type Object|Array
*/
selectedItem: {
notify: true,
observer: 'selectedItemChanged',
readOnly: true,
type: Object
},
/**
* The event that would be fired from the item to indicate it is being selected. Set this
* to empty string or null if you don't want to listen for any events.
*
* @attribute activateEvent
* @type String
* @default 'click'
*/
activateEvent: {
observer: 'activateEventChanged',
type: String,
value: 'click'
},
/**
* If this is set, only items with local name that matches the `selectable` are selectable.
*
* @attribute selectable
* @type String
*/
selectable: {
type: String
}
},
hostAttributes: {
'role': 'menu',
'tabindex': '0'
},
listeners: {
'focus': 'onFocus',
'keydown': 'onKeydown'
},
created: function() {
this._bindActivateHandler = this.activateHandler.bind(this);
},
attached: function() {
this.selectableAttached();
},
detached: function() {
this.selectableDetached();
this.removeListener(this.activateEvent);
},
addListener: function(eventName) {
if (eventName) {
this.addEventListener(eventName, this._bindActivateHandler);
}
},
removeListener: function(eventName) {
if (eventName) {
this.removeEventListener(eventName, this._bindActivateHandler);
}
},
activateEventChanged: function(eventName, old) {
this.removeListener(old);
this.addListener(eventName);
},
focusedItemChanged: function(focusedItem, old) {
old && old.setAttribute('tabindex', '-1');
if (focusedItem) {
focusedItem.setAttribute('tabindex', '0');
focusedItem.focus();
}
},
multiChanged: function(multi) {
this.selection.multi = multi;
this.selectedChanged(this.selected);
},
selectedChanged: function(selected, old) {
this._selectedChanged(selected, old);
},
selectedItemChanged: function(selectedItem) {
this._setFocusedItem(Array.isArray(selectedItem) ? selectedItem[0] : selectedItem);
},
activateHandler: function(e) {
var t = e.target;
var items = this.items;
while (t && t != this) {
var i = items.indexOf(t);
if (i >= 0) {
if (t.hasAttribute('disabled')) {
return;
}
var value = this.indexToValue(i);
if (!this.fire('iron-activate', {selected: value, item: t}).defaultPrevented) {
this.select(value);
}
return;
}
t = t.parentNode;
}
},
onFocus: function(event) {
// clear the cached focus item
this._setFocusedItem(null);
// focus the selected item when the menu receives focus, or the first item
// if no item is selected
var selectedItem = this.selectedItem;
selectedItem = Array.isArray(selectedItem) ? selectedItem[0] : selectedItem;
if (selectedItem) {
this._setFocusedItem(selectedItem);
} else {
this._setFocusedItem(this.items[0]);
}
},
onKeydown: function(event) {
// FIXME want to define these somewhere, core-a11y-keys?
var DOWN = 40;
var UP = 38;
var ESC = 27;
var ENTER = 13;
if (event.keyCode === DOWN) {
// up and down arrows moves the focus
this.focusNext();
} else if (event.keyCode === UP) {
this.focusPrevious();
} else if (event.keyCode === ESC) {
// esc blurs the control
this.focusedItem.blur();
} else if (event.keyCode === ENTER) {
// enter activates the item
this.activateHandler(event);
} else {
// all other keys focus the menu item starting with that character
for (var i = 0, item; item = this.items[i]; i++) {
var attr = this.attrForItemTitle || 'textContent';
var title = item[attr] || item.getAttribute(attr);
if (title && title.charAt(0).toLowerCase() === String.fromCharCode(event.keyCode).toLowerCase()) {
this._setFocusedItem(item);
break;
}
}
}
},
focusPrevious: function() {
var length = this.items.length;
var index = (Number(this.indexOf(this.focusedItem)) - 1 + length) % length;
this._setFocusedItem(this.items[index]);
},
focusNext: function() {
var index = (Number(this.indexOf(this.focusedItem)) + 1) % this.items.length;
this._setFocusedItem(this.items[index]);
}
}); });
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment