init

public/static/libs/element-ui/lib/utils/menu/aria-menubar.js

@@ -0,0 +1,24 @@
+'use strict';
+
+exports.__esModule = true;
+
+var _ariaMenuitem = require('./aria-menuitem');
+
+var _ariaMenuitem2 = _interopRequireDefault(_ariaMenuitem);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var Menu = function Menu(domNode) {
+  this.domNode = domNode;
+  this.init();
+};
+
+Menu.prototype.init = function () {
+  var menuChildren = this.domNode.childNodes;
+  [].filter.call(menuChildren, function (child) {
+    return child.nodeType === 1;
+  }).forEach(function (child) {
+    new _ariaMenuitem2.default(child); // eslint-disable-line
+  });
+};
+exports.default = Menu;

public/static/libs/element-ui/lib/utils/menu/aria-menuitem.js

@@ -0,0 +1,62 @@
+'use strict';
+
+exports.__esModule = true;
+
+var _ariaUtils = require('../aria-utils');
+
+var _ariaUtils2 = _interopRequireDefault(_ariaUtils);
+
+var _ariaSubmenu = require('./aria-submenu');
+
+var _ariaSubmenu2 = _interopRequireDefault(_ariaSubmenu);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var MenuItem = function MenuItem(domNode) {
+  this.domNode = domNode;
+  this.submenu = null;
+  this.init();
+};
+
+MenuItem.prototype.init = function () {
+  this.domNode.setAttribute('tabindex', '0');
+  var menuChild = this.domNode.querySelector('.el-menu');
+  if (menuChild) {
+    this.submenu = new _ariaSubmenu2.default(this, menuChild);
+  }
+  this.addListeners();
+};
+
+MenuItem.prototype.addListeners = function () {
+  var _this = this;
+
+  var keys = _ariaUtils2.default.keys;
+  this.domNode.addEventListener('keydown', function (event) {
+    var prevDef = false;
+    switch (event.keyCode) {
+      case keys.down:
+        _ariaUtils2.default.triggerEvent(event.currentTarget, 'mouseenter');
+        _this.submenu && _this.submenu.gotoSubIndex(0);
+        prevDef = true;
+        break;
+      case keys.up:
+        _ariaUtils2.default.triggerEvent(event.currentTarget, 'mouseenter');
+        _this.submenu && _this.submenu.gotoSubIndex(_this.submenu.subMenuItems.length - 1);
+        prevDef = true;
+        break;
+      case keys.tab:
+        _ariaUtils2.default.triggerEvent(event.currentTarget, 'mouseleave');
+        break;
+      case keys.enter:
+      case keys.space:
+        prevDef = true;
+        event.currentTarget.click();
+        break;
+    }
+    if (prevDef) {
+      event.preventDefault();
+    }
+  });
+};
+
+exports.default = MenuItem;

public/static/libs/element-ui/lib/utils/menu/aria-submenu.js

@@ -0,0 +1,69 @@
+'use strict';
+
+exports.__esModule = true;
+
+var _ariaUtils = require('../aria-utils');
+
+var _ariaUtils2 = _interopRequireDefault(_ariaUtils);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var SubMenu = function SubMenu(parent, domNode) {
+  this.domNode = domNode;
+  this.parent = parent;
+  this.subMenuItems = [];
+  this.subIndex = 0;
+  this.init();
+};
+
+SubMenu.prototype.init = function () {
+  this.subMenuItems = this.domNode.querySelectorAll('li');
+  this.addListeners();
+};
+
+SubMenu.prototype.gotoSubIndex = function (idx) {
+  if (idx === this.subMenuItems.length) {
+    idx = 0;
+  } else if (idx < 0) {
+    idx = this.subMenuItems.length - 1;
+  }
+  this.subMenuItems[idx].focus();
+  this.subIndex = idx;
+};
+
+SubMenu.prototype.addListeners = function () {
+  var _this = this;
+
+  var keys = _ariaUtils2.default.keys;
+  var parentNode = this.parent.domNode;
+  Array.prototype.forEach.call(this.subMenuItems, function (el) {
+    el.addEventListener('keydown', function (event) {
+      var prevDef = false;
+      switch (event.keyCode) {
+        case keys.down:
+          _this.gotoSubIndex(_this.subIndex + 1);
+          prevDef = true;
+          break;
+        case keys.up:
+          _this.gotoSubIndex(_this.subIndex - 1);
+          prevDef = true;
+          break;
+        case keys.tab:
+          _ariaUtils2.default.triggerEvent(parentNode, 'mouseleave');
+          break;
+        case keys.enter:
+        case keys.space:
+          prevDef = true;
+          event.currentTarget.click();
+          break;
+      }
+      if (prevDef) {
+        event.preventDefault();
+        event.stopPropagation();
+      }
+      return false;
+    });
+  });
+};
+
+exports.default = SubMenu;