material_design_lite-sass 1.0.6.3 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. checksums.yaml +4 -4
  2. data/.travis.yml +5 -2
  3. data/CHANGELOG.md +9 -0
  4. data/README.md +41 -32
  5. data/lib/material_design_lite/sass/version.rb +1 -1
  6. data/vendor/assets/javascripts/material.js +377 -301
  7. data/vendor/assets/javascripts/material/button.js +0 -24
  8. data/vendor/assets/javascripts/material/checkbox.js +0 -26
  9. data/vendor/assets/javascripts/material/data-table.js +18 -10
  10. data/vendor/assets/javascripts/material/icon-toggle.js +0 -26
  11. data/vendor/assets/javascripts/material/layout.js +104 -6
  12. data/vendor/assets/javascripts/material/mdlComponentHandler.js +15 -36
  13. data/vendor/assets/javascripts/material/menu.js +16 -36
  14. data/vendor/assets/javascripts/material/progress.js +0 -22
  15. data/vendor/assets/javascripts/material/radio.js +0 -28
  16. data/vendor/assets/javascripts/material/ripple.js +6 -35
  17. data/vendor/assets/javascripts/material/slider.js +0 -23
  18. data/vendor/assets/javascripts/material/snackbar.js +189 -0
  19. data/vendor/assets/javascripts/material/switch.js +0 -26
  20. data/vendor/assets/javascripts/material/tabs.js +2 -2
  21. data/vendor/assets/javascripts/material/textfield.js +32 -25
  22. data/vendor/assets/javascripts/material/tooltip.js +39 -49
  23. data/vendor/assets/stylesheets/_material.scss +3 -0
  24. data/vendor/assets/stylesheets/material/_badge.scss +6 -0
  25. data/vendor/assets/stylesheets/material/_button.scss +3 -3
  26. data/vendor/assets/stylesheets/material/_checkbox.scss +5 -0
  27. data/vendor/assets/stylesheets/material/_data-table.scss +17 -9
  28. data/vendor/assets/stylesheets/material/_dialog.scss +57 -0
  29. data/vendor/assets/stylesheets/material/_grid.scss +60 -0
  30. data/vendor/assets/stylesheets/material/_layout.scss +77 -3
  31. data/vendor/assets/stylesheets/material/_list.scss +103 -0
  32. data/vendor/assets/stylesheets/material/_mega_footer.scss +1 -1
  33. data/vendor/assets/stylesheets/material/_menu.scss +5 -1
  34. data/vendor/assets/stylesheets/material/_mixins.scss +33 -0
  35. data/vendor/assets/stylesheets/material/_progress.scss +5 -0
  36. data/vendor/assets/stylesheets/material/_radio.scss +5 -0
  37. data/vendor/assets/stylesheets/material/_shadow.scss +4 -0
  38. data/vendor/assets/stylesheets/material/_snackbar.scss +81 -0
  39. data/vendor/assets/stylesheets/material/_switch.scss +5 -1
  40. data/vendor/assets/stylesheets/material/_tabs.scss +0 -1
  41. data/vendor/assets/stylesheets/material/_textfield.scss +13 -3
  42. data/vendor/assets/stylesheets/material/_typography.scss +4 -0
  43. data/vendor/assets/stylesheets/material/_variables.scss +102 -81
  44. metadata +7 -3
@@ -112,30 +112,6 @@
112
112
  }
113
113
  };
114
114
 
115
- /**
116
- * Downgrade the element.
117
- *
118
- * @private
119
- */
120
- MaterialButton.prototype.mdlDowngrade_ = function() {
121
- if (this.rippleElement_) {
122
- this.rippleElement_.removeEventListener('mouseup', this.boundRippleBlurHandler);
123
- }
124
- this.element_.removeEventListener('mouseup', this.boundButtonBlurHandler);
125
- this.element_.removeEventListener('mouseleave', this.boundButtonBlurHandler);
126
- };
127
-
128
- /**
129
- * Public alias for the downgrade method.
130
- *
131
- * @public
132
- */
133
- MaterialButton.prototype.mdlDowngrade =
134
- MaterialButton.prototype.mdlDowngrade_;
135
-
136
- MaterialButton.prototype['mdlDowngrade'] =
137
- MaterialButton.prototype.mdlDowngrade;
138
-
139
115
  // The component registers itself. It can assume componentHandler is available
140
116
  // in the global scope.
141
117
  componentHandler.register({
@@ -258,32 +258,6 @@
258
258
  }
259
259
  };
260
260
 
261
- /**
262
- * Downgrade the component.
263
- *
264
- * @private
265
- */
266
- MaterialCheckbox.prototype.mdlDowngrade_ = function() {
267
- if (this.rippleContainerElement_) {
268
- this.rippleContainerElement_.removeEventListener('mouseup', this.boundRippleMouseUp);
269
- }
270
- this.inputElement_.removeEventListener('change', this.boundInputOnChange);
271
- this.inputElement_.removeEventListener('focus', this.boundInputOnFocus);
272
- this.inputElement_.removeEventListener('blur', this.boundInputOnBlur);
273
- this.element_.removeEventListener('mouseup', this.boundElementMouseUp);
274
- };
275
-
276
- /**
277
- * Public alias for the downgrade method.
278
- *
279
- * @public
280
- */
281
- MaterialCheckbox.prototype.mdlDowngrade =
282
- MaterialCheckbox.prototype.mdlDowngrade_;
283
-
284
- MaterialCheckbox.prototype['mdlDowngrade'] =
285
- MaterialCheckbox.prototype.mdlDowngrade;
286
-
287
261
  // The component registers itself. It can assume componentHandler is available
288
262
  // in the global scope.
289
263
  componentHandler.register({
@@ -24,7 +24,7 @@
24
24
  * https://github.com/jasonmayes/mdl-component-design-pattern
25
25
  *
26
26
  * @constructor
27
- * @param {HTMLElement} element The element that will be upgraded.
27
+ * @param {Element} element The element that will be upgraded.
28
28
  */
29
29
  var MaterialDataTable = function MaterialDataTable(element) {
30
30
  this.element_ = element;
@@ -66,7 +66,7 @@
66
66
  * single row (or multiple rows).
67
67
  *
68
68
  * @param {Element} checkbox Checkbox that toggles the selection state.
69
- * @param {HTMLElement} row Row to toggle when checkbox changes.
69
+ * @param {Element} row Row to toggle when checkbox changes.
70
70
  * @param {(Array<Object>|NodeList)=} opt_rows Rows to toggle when checkbox changes.
71
71
  * @private
72
72
  */
@@ -106,7 +106,7 @@
106
106
  * Creates a checkbox for a single or or multiple rows and hooks up the
107
107
  * event handling.
108
108
  *
109
- * @param {HTMLElement} row Row to toggle when checkbox changes.
109
+ * @param {Element} row Row to toggle when checkbox changes.
110
110
  * @param {(Array<Object>|NodeList)=} opt_rows Rows to toggle when checkbox changes.
111
111
  * @private
112
112
  */
@@ -122,8 +122,13 @@
122
122
  var checkbox = document.createElement('input');
123
123
  checkbox.type = 'checkbox';
124
124
  checkbox.classList.add('mdl-checkbox__input');
125
- checkbox.addEventListener('change',
126
- this.selectRow_(checkbox, row, opt_rows));
125
+
126
+ if (row) {
127
+ checkbox.checked = row.classList.contains(this.CssClasses_.IS_SELECTED);
128
+ checkbox.addEventListener('change', this.selectRow_(checkbox, row));
129
+ } else if (opt_rows) {
130
+ checkbox.addEventListener('change', this.selectRow_(checkbox, null, opt_rows));
131
+ }
127
132
 
128
133
  label.appendChild(checkbox);
129
134
  componentHandler.upgradeElement(label, 'MaterialCheckbox');
@@ -136,7 +141,9 @@
136
141
  MaterialDataTable.prototype.init = function() {
137
142
  if (this.element_) {
138
143
  var firstHeader = this.element_.querySelector('th');
139
- var rows = this.element_.querySelector('tbody').querySelectorAll('tr');
144
+ var bodyRows = Array.prototype.slice.call(this.element_.querySelectorAll('tbody tr'));
145
+ var footRows = Array.prototype.slice.call(this.element_.querySelectorAll('tfoot tr'));
146
+ var rows = bodyRows.concat(footRows);
140
147
 
141
148
  if (this.element_.classList.contains(this.CssClasses_.SELECTABLE)) {
142
149
  var th = document.createElement('th');
@@ -148,14 +155,15 @@
148
155
  var firstCell = rows[i].querySelector('td');
149
156
  if (firstCell) {
150
157
  var td = document.createElement('td');
151
- var rowCheckbox = this.createCheckbox_(rows[i]);
152
- td.appendChild(rowCheckbox);
158
+ if (rows[i].parentNode.nodeName.toUpperCase() === 'TBODY') {
159
+ var rowCheckbox = this.createCheckbox_(rows[i]);
160
+ td.appendChild(rowCheckbox);
161
+ }
153
162
  rows[i].insertBefore(td, firstCell);
154
163
  }
155
164
  }
165
+ this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
156
166
  }
157
-
158
- this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
159
167
  }
160
168
  };
161
169
 
@@ -244,32 +244,6 @@
244
244
  }
245
245
  };
246
246
 
247
- /**
248
- * Downgrade the component
249
- *
250
- * @private
251
- */
252
- MaterialIconToggle.prototype.mdlDowngrade_ = function() {
253
- if (this.rippleContainerElement_) {
254
- this.rippleContainerElement_.removeEventListener('mouseup', this.boundRippleMouseUp);
255
- }
256
- this.inputElement_.removeEventListener('change', this.boundInputOnChange);
257
- this.inputElement_.removeEventListener('focus', this.boundInputOnFocus);
258
- this.inputElement_.removeEventListener('blur', this.boundInputOnBlur);
259
- this.element_.removeEventListener('mouseup', this.boundElementOnMouseUp);
260
- };
261
-
262
- /**
263
- * Public alias for the downgrade method.
264
- *
265
- * @public
266
- */
267
- MaterialIconToggle.prototype.mdlDowngrade =
268
- MaterialIconToggle.prototype.mdlDowngrade_;
269
-
270
- MaterialIconToggle.prototype['mdlDowngrade'] =
271
- MaterialIconToggle.prototype.mdlDowngrade;
272
-
273
247
  // The component registers itself. It can assume componentHandler is available
274
248
  // in the global scope.
275
249
  componentHandler.register({
@@ -44,11 +44,23 @@
44
44
  MAX_WIDTH: '(max-width: 1024px)',
45
45
  TAB_SCROLL_PIXELS: 100,
46
46
 
47
- MENU_ICON: 'menu',
47
+ MENU_ICON: '&#xE5D2;',
48
48
  CHEVRON_LEFT: 'chevron_left',
49
49
  CHEVRON_RIGHT: 'chevron_right'
50
50
  };
51
51
 
52
+ /**
53
+ * Keycodes, for code readability.
54
+ *
55
+ * @enum {number}
56
+ * @private
57
+ */
58
+ MaterialLayout.prototype.Keycodes_ = {
59
+ ENTER: 13,
60
+ ESCAPE: 27,
61
+ SPACE: 32
62
+ };
63
+
52
64
  /**
53
65
  * Modes.
54
66
  *
@@ -138,6 +150,18 @@
138
150
  }
139
151
  };
140
152
 
153
+ /**
154
+ * Handles a keyboard event on the drawer.
155
+ *
156
+ * @param {Event} evt The event that fired.
157
+ * @private
158
+ */
159
+ MaterialLayout.prototype.keyboardEventHandler_ = function(evt) {
160
+ if (evt.keyCode === this.Keycodes_.ESCAPE) {
161
+ this.toggleDrawer();
162
+ }
163
+ };
164
+
141
165
  /**
142
166
  * Handles changes in screen size.
143
167
  *
@@ -157,13 +181,23 @@
157
181
  };
158
182
 
159
183
  /**
160
- * Handles toggling of the drawer.
184
+ * Handles events of drawer button.
161
185
  *
186
+ * @param {Event} evt The event that fired.
162
187
  * @private
163
188
  */
164
- MaterialLayout.prototype.drawerToggleHandler_ = function() {
165
- this.drawer_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN);
166
- this.obfuscator_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN);
189
+ MaterialLayout.prototype.drawerToggleHandler_ = function(evt) {
190
+ if (evt && (evt.type === 'keydown')) {
191
+ if (evt.keyCode === this.Keycodes_.SPACE || evt.keyCode === this.Keycodes_.ENTER) {
192
+ // prevent scrolling in drawer nav
193
+ evt.preventDefault();
194
+ } else {
195
+ // prevent other keys
196
+ return;
197
+ }
198
+ }
199
+
200
+ this.toggleDrawer();
167
201
  };
168
202
 
169
203
  /**
@@ -209,6 +243,28 @@
209
243
  }
210
244
  };
211
245
 
246
+ /**
247
+ * Toggle drawer state
248
+ *
249
+ * @public
250
+ */
251
+ MaterialLayout.prototype.toggleDrawer = function() {
252
+ var drawerButton = this.element_.querySelector('.' + this.CssClasses_.DRAWER_BTN);
253
+ this.drawer_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN);
254
+ this.obfuscator_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN);
255
+
256
+ // Set accessibility properties.
257
+ if (this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)) {
258
+ this.drawer_.setAttribute('aria-hidden', 'false');
259
+ drawerButton.setAttribute('aria-expanded', 'true');
260
+ } else {
261
+ this.drawer_.setAttribute('aria-hidden', 'true');
262
+ drawerButton.setAttribute('aria-expanded', 'false');
263
+ }
264
+ };
265
+ MaterialLayout.prototype['toggleDrawer'] =
266
+ MaterialLayout.prototype.toggleDrawer;
267
+
212
268
  /**
213
269
  * Initialize element.
214
270
  */
@@ -240,6 +296,16 @@
240
296
  }
241
297
  }
242
298
 
299
+ window.addEventListener('pageshow', function(e) {
300
+ if (e.persisted) { // when page is loaded from back/forward cache
301
+ // trigger repaint to let layout scroll in safari
302
+ this.element_.style.overflowY = 'hidden';
303
+ requestAnimationFrame(function() {
304
+ this.element_.style.overflowY = '';
305
+ }.bind(this));
306
+ }
307
+ }.bind(this), false);
308
+
243
309
  if (this.header_) {
244
310
  this.tabBar_ = this.header_.querySelector('.' + this.CssClasses_.TAB_BAR);
245
311
  }
@@ -288,11 +354,14 @@
288
354
  this.CssClasses_.DRAWER_BTN);
289
355
  if (!drawerButton) {
290
356
  drawerButton = document.createElement('div');
357
+ drawerButton.setAttribute('aria-expanded', 'false');
358
+ drawerButton.setAttribute('role', 'button');
359
+ drawerButton.setAttribute('tabindex', '0');
291
360
  drawerButton.classList.add(this.CssClasses_.DRAWER_BTN);
292
361
 
293
362
  var drawerButtonIcon = document.createElement('i');
294
363
  drawerButtonIcon.classList.add(this.CssClasses_.ICON);
295
- drawerButtonIcon.textContent = this.Constant_.MENU_ICON;
364
+ drawerButtonIcon.innerHTML = this.Constant_.MENU_ICON;
296
365
  drawerButton.appendChild(drawerButtonIcon);
297
366
  }
298
367
 
@@ -307,6 +376,9 @@
307
376
  drawerButton.addEventListener('click',
308
377
  this.drawerToggleHandler_.bind(this));
309
378
 
379
+ drawerButton.addEventListener('keydown',
380
+ this.drawerToggleHandler_.bind(this));
381
+
310
382
  // Add a class if the layout has a drawer, for altering the left padding.
311
383
  // Adds the HAS_DRAWER to the elements since this.header_ may or may
312
384
  // not be present.
@@ -326,6 +398,9 @@
326
398
  obfuscator.addEventListener('click',
327
399
  this.drawerToggleHandler_.bind(this));
328
400
  this.obfuscator_ = obfuscator;
401
+
402
+ this.drawer_.addEventListener('keydown', this.keyboardEventHandler_.bind(this));
403
+ this.drawer_.setAttribute('aria-hidden', 'true');
329
404
  }
330
405
 
331
406
  // Keep an eye on screen size, and add/remove auxiliary class for styling
@@ -417,6 +492,19 @@
417
492
  * @param {MaterialLayout} layout The MaterialLayout object that owns the tab.
418
493
  */
419
494
  function MaterialLayoutTab(tab, tabs, panels, layout) {
495
+
496
+ /**
497
+ * Auxiliary method to programmatically select a tab in the UI.
498
+ */
499
+ function selectTab() {
500
+ var href = tab.href.split('#')[1];
501
+ var panel = layout.content_.querySelector('#' + href);
502
+ layout.resetTabState_(tabs);
503
+ layout.resetPanelState_(panels);
504
+ tab.classList.add(layout.CssClasses_.IS_ACTIVE);
505
+ panel.classList.add(layout.CssClasses_.IS_ACTIVE);
506
+ }
507
+
420
508
  if (layout.tabBar_.classList.contains(
421
509
  layout.CssClasses_.JS_RIPPLE_EFFECT)) {
422
510
  var rippleContainer = document.createElement('span');
@@ -428,6 +516,15 @@
428
516
  tab.appendChild(rippleContainer);
429
517
  }
430
518
 
519
+ tab.addEventListener('click', function(e) {
520
+ if (tab.getAttribute('href').charAt(0) === '#') {
521
+ e.preventDefault();
522
+ selectTab();
523
+ }
524
+ });
525
+
526
+ tab.show = selectTab;
527
+
431
528
  tab.addEventListener('click', function(e) {
432
529
  e.preventDefault();
433
530
  var href = tab.href.split('#')[1];
@@ -438,6 +535,7 @@
438
535
  panel.classList.add(layout.CssClasses_.IS_ACTIVE);
439
536
  });
440
537
  }
538
+ window['MaterialLayoutTab'] = MaterialLayoutTab;
441
539
 
442
540
  // The component registers itself. It can assume componentHandler is available
443
541
  // in the global scope.
@@ -91,7 +91,6 @@ componentHandler = (function() {
91
91
  /** @type {!Array<componentHandler.Component>} */
92
92
  var createdComponents_ = [];
93
93
 
94
- var downgradeMethod_ = 'mdlDowngrade';
95
94
  var componentConfigProperty_ = 'mdlComponentConfigInternal_';
96
95
 
97
96
  /**
@@ -225,7 +224,7 @@ componentHandler = (function() {
225
224
  }
226
225
  } else {
227
226
  throw new Error(
228
- 'Unable to find a registered component for the given class.');
227
+ 'Unable to find a registered component for the given class.');
229
228
  }
230
229
 
231
230
  var ev = document.createEvent('Events');
@@ -335,47 +334,25 @@ componentHandler = (function() {
335
334
  }
336
335
  }
337
336
 
338
- /**
339
- * Finds a created component by a given DOM node.
340
- *
341
- * @param {!Node} node
342
- * @return {*}
343
- */
344
- function findCreatedComponentByNodeInternal(node) {
345
- for (var n = 0; n < createdComponents_.length; n++) {
346
- var component = createdComponents_[n];
347
- if (component.element_ === node) {
348
- return component;
349
- }
350
- }
351
- }
352
-
353
337
  /**
354
338
  * Check the component for the downgrade method.
355
339
  * Execute if found.
356
340
  * Remove component from createdComponents list.
357
341
  *
358
- * @param {*} component
342
+ * @param {?componentHandler.Component} component
359
343
  */
360
344
  function deconstructComponentInternal(component) {
361
- if (component &&
362
- component[componentConfigProperty_]
363
- .classConstructor.prototype
364
- .hasOwnProperty(downgradeMethod_)) {
365
- component[downgradeMethod_]();
366
- var componentIndex = createdComponents_.indexOf(component);
367
- createdComponents_.splice(componentIndex, 1);
368
-
369
- var upgrades = component.element_.getAttribute('data-upgraded').split(',');
370
- var componentPlace = upgrades.indexOf(
371
- component[componentConfigProperty_].classAsString);
372
- upgrades.splice(componentPlace, 1);
373
- component.element_.setAttribute('data-upgraded', upgrades.join(','));
345
+ var componentIndex = createdComponents_.indexOf(component);
346
+ createdComponents_.splice(componentIndex, 1);
374
347
 
375
- var ev = document.createEvent('Events');
376
- ev.initEvent('mdl-componentdowngraded', true, true);
377
- component.element_.dispatchEvent(ev);
378
- }
348
+ var upgrades = component.element_.getAttribute('data-upgraded').split(',');
349
+ var componentPlace = upgrades.indexOf(component[componentConfigProperty_].classAsString);
350
+ upgrades.splice(componentPlace, 1);
351
+ component.element_.setAttribute('data-upgraded', upgrades.join(','));
352
+
353
+ var ev = document.createEvent('Events');
354
+ ev.initEvent('mdl-componentdowngraded', true, true);
355
+ component.element_.dispatchEvent(ev);
379
356
  }
380
357
 
381
358
  /**
@@ -389,7 +366,9 @@ componentHandler = (function() {
389
366
  * @param {!Node} node the node to be downgraded
390
367
  */
391
368
  var downgradeNode = function(node) {
392
- deconstructComponentInternal(findCreatedComponentByNodeInternal(node));
369
+ createdComponents_.filter(function(item) {
370
+ return item.element_ === node;
371
+ }).forEach(deconstructComponentInternal);
393
372
  };
394
373
  if (nodes instanceof Array || nodes instanceof NodeList) {
395
374
  for (var n = 0; n < nodes.length; n++) {
@@ -112,7 +112,8 @@
112
112
  container.insertBefore(outline, this.element_);
113
113
 
114
114
  // Find the "for" element and bind events to it.
115
- var forElId = this.element_.getAttribute('for');
115
+ var forElId = this.element_.getAttribute('for') ||
116
+ this.element_.getAttribute('data-mdl-for');
116
117
  var forEl = null;
117
118
  if (forElId) {
118
119
  forEl = document.getElementById(forElId);
@@ -337,21 +338,25 @@
337
338
  }
338
339
  };
339
340
 
341
+ /**
342
+ * Cleanup function to remove animation listeners.
343
+ *
344
+ * @param {Event} evt
345
+ * @private
346
+ */
347
+
348
+ MaterialMenu.prototype.removeAnimationEndListener_ = function(evt) {
349
+ evt.target.classList.remove(MaterialMenu.prototype.CssClasses_.IS_ANIMATING);
350
+ };
351
+
340
352
  /**
341
353
  * Adds an event listener to clean up after the animation ends.
342
354
  *
343
355
  * @private
344
356
  */
345
357
  MaterialMenu.prototype.addAnimationEndListener_ = function() {
346
- var cleanup = function() {
347
- this.element_.removeEventListener('transitionend', cleanup);
348
- this.element_.removeEventListener('webkitTransitionEnd', cleanup);
349
- this.element_.classList.remove(this.CssClasses_.IS_ANIMATING);
350
- }.bind(this);
351
-
352
- // Remove animation class once the transition is done.
353
- this.element_.addEventListener('transitionend', cleanup);
354
- this.element_.addEventListener('webkitTransitionEnd', cleanup);
358
+ this.element_.addEventListener('transitionend', this.removeAnimationEndListener_);
359
+ this.element_.addEventListener('webkitTransitionEnd', this.removeAnimationEndListener_);
355
360
  };
356
361
 
357
362
  /**
@@ -432,7 +437,7 @@
432
437
 
433
438
  // Remove all transition delays; menu items fade out concurrently.
434
439
  for (var i = 0; i < items.length; i++) {
435
- items[i].style.transitionDelay = null;
440
+ items[i].style.removeProperty('transition-delay');
436
441
  }
437
442
 
438
443
  // Measure the inner element.
@@ -466,31 +471,6 @@
466
471
  };
467
472
  MaterialMenu.prototype['toggle'] = MaterialMenu.prototype.toggle;
468
473
 
469
- /**
470
- * Downgrade the component.
471
- *
472
- * @private
473
- */
474
- MaterialMenu.prototype.mdlDowngrade_ = function() {
475
- var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM);
476
-
477
- for (var i = 0; i < items.length; i++) {
478
- items[i].removeEventListener('click', this.boundItemClick_);
479
- items[i].removeEventListener('keydown', this.boundItemKeydown_);
480
- }
481
- };
482
-
483
- /**
484
- * Public alias for the downgrade method.
485
- *
486
- * @public
487
- */
488
- MaterialMenu.prototype.mdlDowngrade =
489
- MaterialMenu.prototype.mdlDowngrade_;
490
-
491
- MaterialMenu.prototype['mdlDowngrade'] =
492
- MaterialMenu.prototype.mdlDowngrade;
493
-
494
474
  // The component registers itself. It can assume componentHandler is available
495
475
  // in the global scope.
496
476
  componentHandler.register({