react-aria - npm Package Compare versions

Comparing version 0.2.0 to 0.4.0

CHANGELOG.md

 ## CHANGELOG
+### 0.4.0
+Trying to fix yarn add
+
+### 0.3.2
+Yarn publish fix
+
+Remove bower
+
+### 0.3.1
+Update `focus-group` dependency to 0.3.1
+
+### 0.3.0
+Added `AriaTabList`, `AriaTab`, and `AriaPanel` components
+
+Cleaned up other ARIA components to be smart based on `AriaManager` `type`
+
+### 0.2.0
+Fleshed out API
+
 ### 0.1.0
 Initial release

dist/react-aria.js

@@ -0,11 +1,16 @@
+/*!
+ * React Aria 0.4.0
+ * https://github.com/souporserious/react-aria
+ * Copyright (c) 2016 React Aria Authors
+ */
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory(require("React"), require("createFocusGroup"), require("createTapListener"), require("ReactDOM"), require("focusTrap"));
+		module.exports = factory(require("react"), require("focus-group"), require("no-scroll"), require("teeny-tap"), require("react-dom"), require("focus-trap"));
 	else if(typeof define === 'function' && define.amd)
-		define(["React", "createFocusGroup", "createTapListener", "ReactDOM", "focusTrap"], factory);
+		define(["react", "focus-group", "no-scroll", "teeny-tap", "react-dom", "focus-trap"], factory);
 	else if(typeof exports === 'object')
-		exports["ReactARIA"] = factory(require("React"), require("createFocusGroup"), require("createTapListener"), require("ReactDOM"), require("focusTrap"));
+		exports["ReactARIA"] = factory(require("react"), require("focus-group"), require("no-scroll"), require("teeny-tap"), require("react-dom"), require("focus-trap"));
 	else
-		root["ReactARIA"] = factory(root["React"], root["createFocusGroup"], root["createTapListener"], root["ReactDOM"], root["focusTrap"]);
-})(this, function(__WEBPACK_EXTERNAL_MODULE_2__, __WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_5__, __WEBPACK_EXTERNAL_MODULE_8__, __WEBPACK_EXTERNAL_MODULE_10__) {
+		root["ReactARIA"] = factory(root["React"], root["createFocusGroup"], root["noScroll"], root["createTapListener"], root["ReactDOM"], root["focusTrap"]);
+})(this, function(__WEBPACK_EXTERNAL_MODULE_2__, __WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_4__, __WEBPACK_EXTERNAL_MODULE_6__, __WEBPACK_EXTERNAL_MODULE_9__, __WEBPACK_EXTERNAL_MODULE_11__) {
 return /******/ (function(modules) { // webpackBootstrap
@@ -59,8 +64,7 @@ /******/ 	// The module cache
 
-	Object.defineProperty(exports, '__esModule', {
+	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
+	exports.AriaPanel = exports.AriaTab = exports.AriaTabList = exports.AriaItem = exports.AriaPopover = exports.AriaToggle = exports.AriaManager = undefined;
 
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
 	var _AriaManager2 = __webpack_require__(1);
@@ -70,22 +74,48 @@
 
-	exports.AriaManager = _AriaManager3['default'];
+	var _AriaToggle2 = __webpack_require__(8);
 
-	var _AriaToggle2 = __webpack_require__(7);
-
 	var _AriaToggle3 = _interopRequireDefault(_AriaToggle2);
 
-	exports.AriaToggle = _AriaToggle3['default'];
+	var _AriaPopover2 = __webpack_require__(10);
 
-	var _AriaPopover2 = __webpack_require__(9);
-
 	var _AriaPopover3 = _interopRequireDefault(_AriaPopover2);
 
-	exports.AriaPopover = _AriaPopover3['default'];
+	var _AriaItem2 = __webpack_require__(12);
 
-	var _AriaItem2 = __webpack_require__(11);
-
 	var _AriaItem3 = _interopRequireDefault(_AriaItem2);
 
-	exports.AriaItem = _AriaItem3['default'];
+	var _AriaTabList2 = __webpack_require__(13);
 
+	var _AriaTabList3 = _interopRequireDefault(_AriaTabList2);
+
+	var _AriaTab2 = __webpack_require__(14);
+
+	var _AriaTab3 = _interopRequireDefault(_AriaTab2);
+
+	var _AriaPanel2 = __webpack_require__(15);
+
+	var _AriaPanel3 = _interopRequireDefault(_AriaPanel2);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	exports.AriaManager = _AriaManager3.default;
+	exports.AriaToggle = _AriaToggle3.default;
+	exports.AriaPopover = _AriaPopover3.default;
+	exports.AriaItem = _AriaItem3.default;
+	exports.AriaTabList = _AriaTabList3.default;
+	exports.AriaTab = _AriaTab3.default;
+	exports.AriaPanel = _AriaPanel3.default;
+
+	// rename
+	// export Manager from './Manager'
+	// export Toggle from './Toggle'
+	// export Popover from './Popover'
+	// export Item from './Item'
+	// export TabList from './TabList'
+	// export Tab from './Tab'
+	// export Panel from './Panel'
+
+	// usage
+	// <Aria.Manager/> || <Manager/>
+
 /***/ },
@@ -97,16 +127,8 @@ /* 1 */
 
-	Object.defineProperty(exports, '__esModule', {
+	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
 
-	var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
-	var _get = function get(_x3, _x4, _x5) { var _again = true; _function: while (_again) { var object = _x3, property = _x4, receiver = _x5; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x3 = parent; _x4 = property; _x5 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
-
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
-	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
-
-	function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
 	var _react = __webpack_require__(2);
@@ -120,10 +142,22 @@
 
-	var _eventsHandler = __webpack_require__(4);
+	var _noScroll = __webpack_require__(4);
 
+	var _noScroll2 = _interopRequireDefault(_noScroll);
+
+	var _eventsHandler = __webpack_require__(5);
+
 	var _eventsHandler2 = _interopRequireDefault(_eventsHandler);
 
-	var _specialAssign = __webpack_require__(6);
+	var _specialAssign = __webpack_require__(7);
 
 	var _specialAssign2 = _interopRequireDefault(_specialAssign);
 
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
 	var isTarget = function isTarget(node, target) {
@@ -136,4 +170,2 @@ return node === target || node.contains(target);
 	  escape: 27,
-	  enter: 13,
-	  space: 32,
 	  end: 35,
@@ -148,4 +180,7 @@ home: 36,
 	var checkedProps = {
+	  type: _react.PropTypes.oneOf(['menu', 'popover', 'modal', 'tooltip', 'alert', 'tabs', 'accordion']).isRequired,
 	  tag: _react.PropTypes.string,
 	  trapFocus: _react.PropTypes.bool,
+	  freezeScroll: _react.PropTypes.bool,
+	  activeTabId: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.number]),
 	  children: _react.PropTypes.oneOfType([_react.PropTypes.func, _react.PropTypes.node]).isRequired,
@@ -161,5 +196,7 @@ keybindings: _react.PropTypes.shape({
 	  stringSearchDelay: _react.PropTypes.number,
+	  collapsible: _react.PropTypes.bool,
 	  openPopoverOn: _react.PropTypes.oneOf(['tap', 'hover']),
 	  closeOnOutsideClick: _react.PropTypes.bool,
 	  closeOnItemSelection: _react.PropTypes.bool,
+	  accordion: _react.PropTypes.bool,
 	  onPopoverOpen: _react.PropTypes.func,
@@ -170,94 +207,87 @@ onPopoverClose: _react.PropTypes.func,
 
-	var AriaManager = (function (_Component) {
+	var AriaManager = function (_Component) {
 	  _inherits(AriaManager, _Component);
 
-	  _createClass(AriaManager, null, [{
-	    key: 'childContextTypes',
-	    value: {
-	      ariaManager: _react.PropTypes.object.isRequired
-	    },
-	    enumerable: true
-	  }, {
-	    key: 'propTypes',
-	    value: checkedProps,
-	    enumerable: true
-	  }, {
-	    key: 'defaultProps',
-	    value: {
-	      tag: 'div',
-	      trapFocus: false,
-	      keybindings: {
-	        next: [{ keyCode: KEYS.arrowDown }, { keyCode: KEYS.arrowRight }],
-	        prev: [{ keyCode: KEYS.arrowUp }, { keyCode: KEYS.arrowLeft }],
-	        first: { keyCode: KEYS.home },
-	        last: { keyCode: KEYS.end }
-	      },
-	      wrap: true,
-	      stringSearch: true,
-	      stringSearchDelay: 600,
-	      openPopoverOn: 'tap',
-	      closeOnOutsideClick: true,
-	      closeOnItemSelection: true,
-	      onPopoverOpen: function onPopoverOpen() {
-	        return null;
-	      },
-	      onPopoverClose: function onPopoverClose() {
-	        return null;
-	      },
-	      onItemSelection: function onItemSelection() {
-	        return null;
-	      }
-	    },
-	    enumerable: true
-	  }]);
-
 	  function AriaManager(props) {
-	    var _this = this;
-
 	    _classCallCheck(this, AriaManager);
 
-	    _get(Object.getPrototypeOf(AriaManager.prototype), 'constructor', this).call(this, props);
+	    var _this = _possibleConstructorReturn(this, (AriaManager.__proto__ || Object.getPrototypeOf(AriaManager)).call(this, props));
 
-	    this._setToggleNode = function (node) {
+	    _this._onItemSelection = function (item, e) {
+	      var value = item.value || item.node.innerHTML;
+
+	      if (_this.props.closeOnItemSelection) {
+	        _this.closePopover();
+	      }
+
+	      _this.props.onItemSelection(value, e);
+	    };
+
+	    _this._setToggleNode = function (node) {
 	      _this._toggle = node;
 	    };
 
-	    this._setPopoverNode = function (node) {
+	    _this._setPopoverNode = function (node) {
 	      _this._popover = node;
 	    };
 
-	    this._addItem = function (item) {
-	      _this._items.push(item);
-	      _this._focusGroup.addMember(item);
+	    _this._addMember = function (member) {
+	      var activeTabId = _this.props.activeTabId;
+	      var id = member.id;
+	      var index = member.index;
+	      var node = member.node;
+	      var text = member.text;
+
+
+	      if (index === undefined) {
+	        _this._members.push(member);
+	      } else {
+	        _this._members.splice(index, 0, member);
+	      }
+
+	      _this._focusGroup.addMember({
+	        node: node,
+	        text: text || node.innerHTML
+	      });
+
+	      if (member.type === 'tab') {
+	        if (activeTabId === id) {
+	          _this._activateTab(activeTabId, true, false);
+	        } else {
+	          _this._handleFirstTabSelection(id);
+	        }
+	      }
 	    };
 
-	    this._removeItem = function (item) {
-	      var pos = _this._items.indexOf(item);
+	    _this._removeMember = function (member) {
+	      var pos = _this._members.indexOf(member);
+
 	      if (pos > -1) {
-	        _this._items.splice(pos, 1);
+	        _this._members.splice(member, 1);
+	        _this._focusGroup.removeMember(member.node);
 	      }
-	      _this._focusGroup.removeMember(item);
 	    };
 
-	    this._clearItems = function () {
-	      _this._focusGroup.clearMembers();
-	    };
-
-	    this._focusItem = function (index) {
+	    _this._focusItem = function (index) {
 	      _this._focusGroup.focusNodeAtIndex(index);
 	    };
 
-	    this._openPopover = function () {
-	      var focusPopover = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0];
+	    _this.openPopover = function () {
+	      var focusFirstMember = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+	      var _this$props = _this.props;
+	      var freezeScroll = _this$props.freezeScroll;
+	      var onPopoverOpen = _this$props.onPopoverOpen;
 
-	      if (_this.state.isOpen) return;
 
-	      _this.setState({ isOpen: true });
+	      if (_this.state.isPopoverOpen) return;
 
-	      _this.props.onPopoverOpen();
+	      _this.setState({ isPopoverOpen: true });
 
-	      _this._focusGroup.activate();
+	      if (freezeScroll) {
+	        _noScroll2.default.on();
+	      }
 
-	      if (focusPopover) {
-	        // setTimeout allows animated popovers to still focus
+	      onPopoverOpen();
+
+	      if (focusFirstMember) {
 	        setTimeout(function () {
@@ -269,33 +299,115 @@ _this._focusItem(0);
 
-	    this._closePopover = function () {
-	      var focusToggle = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0];
+	    _this.closePopover = function () {
+	      var focusToggle = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+	      var _this$props2 = _this.props;
+	      var freezeScroll = _this$props2.freezeScroll;
+	      var onPopoverClose = _this$props2.onPopoverClose;
 
-	      if (!_this.state.isOpen) return;
 
-	      _this.setState({ isOpen: false });
+	      if (!_this.state.isPopoverOpen) return;
 
-	      _this.props.onPopoverClose();
+	      _this.setState({ isPopoverOpen: false });
 
-	      _this._focusGroup.deactivate();
+	      if (freezeScroll) {
+	        _noScroll2.default.off();
+	      }
 
+	      onPopoverClose();
+
 	      if (focusToggle) {
-	        _this._toggle.focus();
+	        setTimeout(function () {
+	          _this._toggle.focus();
+	        }, 60);
 	      }
 	    };
 
-	    this._togglePopover = function (focus) {
-	      if (!_this.state.isOpen) {
-	        _this._openPopover(focus);
+	    _this.togglePopover = function (focus) {
+	      if (!_this.state.isPopoverOpen) {
+	        _this.openPopover(focus);
 	      } else {
-	        _this._closePopover(focus);
+	        _this.closePopover(focus);
 	      }
 	    };
 
-	    this.state = {
-	      isOpen: false
+	    _this._addPanel = function (panel) {
+	      var activeTabId = _this.props.activeTabId;
+	      var controlledBy = panel.controlledBy;
+
+
+	      _this._panels.push(panel);
+
+	      if (activeTabId === controlledBy) {
+	        _this._activateTab(activeTabId, true, false);
+	      } else {
+	        _this._handleFirstTabSelection(panel.controlledBy);
+	      }
 	    };
-	    this._focusGroup = (0, _focusGroup2['default'])(props);
-	    this._toggle = null;
-	    this._popover = null;
-	    this._items = [];
+
+	    _this._focusTab = function (id) {
+	      var tabToFocus = _this._members.filter(function (tab) {
+	        return tab.id === id;
+	      });
+	      if (tabToFocus) {
+	        tabToFocus.node.focus();
+	      }
+	    };
+
+	    _this._activateTab = function (id, forceActivate) {
+	      var shouldChange = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+	      var _this$props3 = _this.props;
+	      var type = _this$props3.type;
+	      var onChange = _this$props3.onChange;
+
+
+	      if (type === 'tabs') {
+	        if (id === _this._activeTabId && !forceActivate) {
+	          return;
+	        } else {
+	          _this._activeTabId = id;
+	        }
+	      }
+
+	      // shouldChange makes sure we don't fire callbacks when we don't need to
+	      if (shouldChange && typeof onChange === 'function') {
+	        onChange(id);
+
+	        // if onChange is being used we don't need to go any farther since the
+	        // user is now controlling state
+	        return;
+	      }
+
+	      for (var i = _this._members.length; i--;) {
+	        var tab = _this._members[i];
+	        if (type === 'accordion') {
+	          if (tab.id === id) {
+	            tab.toggleActiveState();
+	          }
+	        } else {
+	          tab.setActiveState(id === tab.id);
+	        }
+	      }
+	      for (var _i = _this._panels.length; _i--;) {
+	        var panel = _this._panels[_i];
+	        if (type === 'accordion') {
+	          if (panel.controlledBy === id) {
+	            panel.toggleActiveState();
+	          }
+	        } else {
+	          panel.setActiveState(id === panel.controlledBy);
+	        }
+	      }
+	    };
+
+	    _this.state = {
+	      isPopoverOpen: false
+	    };
+
+	    _this._focusGroup = (0, _focusGroup2.default)(props);
+	    _this._toggle = null;
+	    _this._popover = null;
+	    _this._members = [];
+	    _this._panels = [];
+	    _this._activeTabId = props.activeTabId;
+	    _this._uuid = 'RA' + Math.abs(~~(Math.random() * new Date()));
+	    return _this;
 	  }
@@ -308,15 +420,18 @@
 	        ariaManager: {
+	          uuid: this._uuid,
+	          type: this.props.type,
 	          trapFocus: this.props.trapFocus,
 	          initialFocus: this.props.initialFocus,
-	          isOpen: this.state.isOpen,
+	          isPopoverOpen: this.state.isPopoverOpen,
 	          onItemSelection: this._onItemSelection,
 	          setToggleNode: this._setToggleNode,
 	          setPopoverNode: this._setPopoverNode,
-	          addItem: this._addItem,
-	          removeItem: this._removeItem,
-	          clearItems: this._clearItems,
+	          addMember: this._addMember,
+	          addPanel: this._addPanel,
+	          removeMember: this._removeMember,
+	          activateTab: this._activateTab,
 	          focusItem: this._focusItem,
-	          openPopover: this._openPopover,
-	          closePopover: this._closePopover,
-	          togglePopover: this._togglePopover
+	          openPopover: this.openPopover,
+	          closePopover: this.closePopover,
+	          togglePopover: this.togglePopover
 	        }
@@ -328,3 +443,4 @@ };
 	    value: function componentWillMount() {
-	      _eventsHandler2['default'].add(this, this.props.openPopoverOn);
+	      this._focusGroup.activate();
+	      _eventsHandler2.default.add(this);
 	    }
@@ -335,7 +451,3 @@ }, {
 	      this._focusGroup.deactivate();
-	      this._toggle = null;
-	      this._popover = null;
-	      this._items = [];
-
-	      _eventsHandler2['default'].remove(this);
+	      _eventsHandler2.default.remove(this);
 	    }
@@ -364,18 +476,28 @@ }, {
 
-	      var toggleDisabled = this._toggle.getAttribute('disabled');
 
-	      if (isTarget(this._toggle, target) && toggleDisabled === null) {
-	        if (openPopoverOn === 'tap') {
-	          this._togglePopover(false);
-	        } else {
-	          this._openPopover(false);
+	      if (this._toggle) {
+	        var toggleDisabled = this._toggle.getAttribute('disabled');
+
+	        if (isTarget(this._toggle, target) && toggleDisabled === null) {
+	          if (openPopoverOn === 'tap') {
+	            this.togglePopover(false);
+	          } else {
+	            this.openPopover(false);
+	          }
+	          return;
+	        } else if (closeOnOutsideClick && this._popover && !isTarget(this._popover, target)) {
+	          this.closePopover(false);
+	          return;
 	        }
-	      } else if (closeOnOutsideClick && this._popover && !isTarget(this._popover, target)) {
-	        this._closePopover(false);
-	      } else {
-	        for (var i = this._items.length; i--;) {
-	          var item = this._items[i];
-	          if (item.node === target) {
-	            this._onItemSelection(item, e);
+	      }
+
+	      for (var i = this._members.length; i--;) {
+	        var member = this._members[i];
+	        if (member.node === target) {
+	          if (member.type === 'item') {
+	            this._onItemSelection(member, e);
+	          } else {
+	            this._activateTab(member.id);
 	          }
+	          return;
 	        }
@@ -386,38 +508,19 @@ }
 	    key: '_onKeyDown',
-	    value: function _onKeyDown(e) {
-	      var keyCode = e.keyCode;
-	      var target = e.target;
+	    value: function _onKeyDown(_ref) {
+	      var keyCode = _ref.keyCode;
 
-	      if (this.state.isOpen) {
+	      if (this.state.isPopoverOpen) {
 	        if (!this.props.trapFocus && keyCode === KEYS.tab) {
-	          this._closePopover(false);
+	          this.closePopover(false);
 	        } else if (keyCode === KEYS.escape) {
-	          e.preventDefault();
-	          this._closePopover();
-	        } else if ([KEYS.enter, KEYS.space].indexOf(keyCode) > -1) {
-	          for (var i = this._items.length; i--;) {
-	            var item = this._items[i];
-	            if (item.node === target) {
-	              e.preventDefault();
-	              this._onItemSelection(item, e);
-	            }
-	          }
+	          this.closePopover();
 	        }
-	      } else if ([KEYS.arrowUp, KEYS.arrowDown, KEYS.enter, KEYS.space].indexOf(keyCode) > -1) {
-	        if (isTarget(this._toggle, target)) {
-	          e.preventDefault();
-	          this._openPopover();
-	        }
 	      }
 	    }
 	  }, {
-	    key: '_onItemSelection',
-	    value: function _onItemSelection(item, e) {
-	      var value = item.value || item.node.innerHTML;
-
-	      if (this.props.closeOnItemSelection) {
-	        this._closePopover();
+	    key: '_handleFirstTabSelection',
+	    value: function _handleFirstTabSelection(id) {
+	      if (this.props.type === 'tabs' && !this._activeTabId || id === this._activeTabId) {
+	        this._activateTab(id, true, false);
 	      }
-
-	      this.props.onItemSelection(value, e);
 	    }
@@ -431,6 +534,6 @@ }, {
 
-	      var props = (0, _specialAssign2['default'])({}, this.props, checkedProps);
+	      var props = (0, _specialAssign2.default)({}, this.props, checkedProps);
 
 	      if (typeof children === 'function') {
-	        return children(this.state.isOpen);
+	        return children(this.state.isPopoverOpen);
 	      }
@@ -443,5 +546,36 @@
 	  return AriaManager;
-	})(_react.Component);
+	}(_react.Component);
 
-	exports['default'] = AriaManager;
+	AriaManager.childContextTypes = {
+	  ariaManager: _react.PropTypes.object.isRequired
+	};
+	AriaManager.propTypes = checkedProps;
+	AriaManager.defaultProps = {
+	  tag: 'div',
+	  trapFocus: false,
+	  freezeScroll: false,
+	  keybindings: {
+	    next: [{ keyCode: KEYS.arrowDown }, { keyCode: KEYS.arrowRight }],
+	    prev: [{ keyCode: KEYS.arrowUp }, { keyCode: KEYS.arrowLeft }],
+	    first: { keyCode: KEYS.home },
+	    last: { keyCode: KEYS.end }
+	  },
+	  wrap: true,
+	  stringSearch: true,
+	  stringSearchDelay: 600,
+	  collapsible: false,
+	  openPopoverOn: 'tap',
+	  closeOnOutsideClick: true,
+	  closeOnItemSelection: true,
+	  onPopoverOpen: function onPopoverOpen() {
+	    return null;
+	  },
+	  onPopoverClose: function onPopoverClose() {
+	    return null;
+	  },
+	  onItemSelection: function onItemSelection() {
+	    return null;
+	  }
+	};
+	exports.default = AriaManager;
 	module.exports = exports['default'];
@@ -463,2 +597,8 @@
 /* 4 */
+/***/ function(module, exports) {
+
+	module.exports = __WEBPACK_EXTERNAL_MODULE_4__;
+
+/***/ },
+/* 5 */
 /***/ function(module, exports, __webpack_require__) {
@@ -468,13 +608,13 @@
 
-	Object.defineProperty(exports, '__esModule', {
+	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
 
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
+	var _teenyTap = __webpack_require__(6);
 
-	var _teenyTap = __webpack_require__(5);
-
 	var _teenyTap2 = _interopRequireDefault(_teenyTap);
 
-	exports['default'] = {
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	exports.default = {
 	  _queue: [],
@@ -505,3 +645,3 @@
 	  _attachListeners: function _attachListeners() {
-	    this._tapListener = (0, _teenyTap2['default'])(document.documentElement, this._documentEvent.bind(this, '_onTap'));
+	    this._tapListener = (0, _teenyTap2.default)(document.documentElement, this._documentEvent.bind(this, '_onTap'));
 	    document.addEventListener('mouseover', this._documentEvent.bind(this, '_onHover'));
@@ -526,9 +666,9 @@ document.addEventListener('keydown', this._documentEvent.bind(this, '_onKeyDown'));
 /***/ },
-/* 5 */
+/* 6 */
 /***/ function(module, exports) {
 
-	module.exports = __WEBPACK_EXTERNAL_MODULE_5__;
+	module.exports = __WEBPACK_EXTERNAL_MODULE_6__;
 
 /***/ },
-/* 6 */
+/* 7 */
 /***/ function(module, exports) {
@@ -541,4 +681,3 @@
 	});
-	exports["default"] = specialAssign;
-
+	exports.default = specialAssign;
 	function specialAssign(a, b, reserved) {
@@ -551,7 +690,6 @@ for (var x in b) {
 	}
-
 	module.exports = exports["default"];
 
 /***/ },
-/* 7 */
+/* 8 */
 /***/ function(module, exports, __webpack_require__) {
@@ -561,16 +699,8 @@
 
-	Object.defineProperty(exports, '__esModule', {
+	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
 
-	var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
-	var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
-
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
-	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
-
-	function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
 	var _react = __webpack_require__(2);
@@ -580,10 +710,18 @@
 
-	var _reactDom = __webpack_require__(8);
+	var _reactDom = __webpack_require__(9);
 
 	var _reactDom2 = _interopRequireDefault(_reactDom);
 
-	var _specialAssign = __webpack_require__(6);
+	var _specialAssign = __webpack_require__(7);
 
 	var _specialAssign2 = _interopRequireDefault(_specialAssign);
 
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
 	var checkedProps = {
@@ -594,9 +732,28 @@ tag: _react.PropTypes.string,
 
-	var AriaToggle = (function (_Component) {
+	var AriaToggle = function (_Component) {
 	  _inherits(AriaToggle, _Component);
 
 	  function AriaToggle() {
+	    var _ref;
+
+	    var _temp, _this, _ret;
+
 	    _classCallCheck(this, AriaToggle);
 
-	    _get(Object.getPrototypeOf(AriaToggle.prototype), 'constructor', this).apply(this, arguments);
+	    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+	      args[_key] = arguments[_key];
+	    }
+
+	    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = AriaToggle.__proto__ || Object.getPrototypeOf(AriaToggle)).call.apply(_ref, [this].concat(args))), _this), _this._handleKeyDown = function (e) {
+	      if (['ArrowUp', 'ArrowDown', ' '].indexOf(e.key) > -1 || _this.props.tag !== 'button' && e.key === 'Enter') {
+	        if (!_this.context.ariaManager.isPopoverOpen) {
+	          _this.context.ariaManager.openPopover();
+	        } else {
+	          _this.context.ariaManager.focusItem(0);
+	        }
+	      }
+	      if (_this.props.onKeyDown) {
+	        _this.props.onKeyDown(e);
+	      }
+	    }, _temp), _possibleConstructorReturn(_this, _ret);
 	  }
@@ -612,2 +769,6 @@
 	    value: function render() {
+	      var _context$ariaManager = this.context.ariaManager;
+	      var type = _context$ariaManager.type;
+	      var uuid = _context$ariaManager.uuid;
+	      var isPopoverOpen = _context$ariaManager.isPopoverOpen;
 	      var _props = this.props;
@@ -618,10 +779,21 @@ var tag = _props.tag;
 
-	      var props = (0, _specialAssign2['default'])({
+	      var componentProps = {
 	        role: 'button',
-	        tabIndex: disabled ? '' : '0',
+	        tabIndex: disabled ? '' : 0,
 	        'aria-haspopup': true,
-	        'aria-expanded': this.context.ariaManager.isOpen,
-	        'aria-disabled': disabled
-	      }, this.props, checkedProps);
+	        'aria-expanded': isPopoverOpen,
+	        'aria-disabled': disabled,
+	        onKeyDown: this._handleKeyDown
+	      };
 
+	      if (type === 'popover') {
+	        componentProps['id'] = uuid;
+	      }
+
+	      if (type === 'tooltip') {
+	        componentProps['aria-describedby'] = uuid;
+	      }
+
+	      var props = (0, _specialAssign2.default)(componentProps, this.props, checkedProps);
+
 	      if (typeof children === 'function') {
@@ -633,34 +805,25 @@ return children(props);
 	    }
-	  }], [{
-	    key: 'contextTypes',
-	    value: {
-	      ariaManager: _react.PropTypes.object.isRequired
-	    },
-	    enumerable: true
-	  }, {
-	    key: 'propTypes',
-	    value: checkedProps,
-	    enumerable: true
-	  }, {
-	    key: 'defaultProps',
-	    value: {
-	      tag: 'button'
-	    },
-	    enumerable: true
 	  }]);
 
 	  return AriaToggle;
-	})(_react.Component);
+	}(_react.Component);
 
-	exports['default'] = AriaToggle;
+	AriaToggle.contextTypes = {
+	  ariaManager: _react.PropTypes.object.isRequired
+	};
+	AriaToggle.propTypes = checkedProps;
+	AriaToggle.defaultProps = {
+	  tag: 'button'
+	};
+	exports.default = AriaToggle;
 	module.exports = exports['default'];
 
 /***/ },
-/* 8 */
+/* 9 */
 /***/ function(module, exports) {
 
-	module.exports = __WEBPACK_EXTERNAL_MODULE_8__;
+	module.exports = __WEBPACK_EXTERNAL_MODULE_9__;
 
 /***/ },
-/* 9 */
+/* 10 */
 /***/ function(module, exports, __webpack_require__) {
@@ -670,16 +833,8 @@
 
-	Object.defineProperty(exports, '__esModule', {
+	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
 
-	var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
-	var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
-
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
-	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
-
-	function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
 	var _react = __webpack_require__(2);
@@ -689,14 +844,22 @@
 
-	var _reactDom = __webpack_require__(8);
+	var _reactDom = __webpack_require__(9);
 
 	var _reactDom2 = _interopRequireDefault(_reactDom);
 
-	var _focusTrap = __webpack_require__(10);
+	var _focusTrap = __webpack_require__(11);
 
 	var _focusTrap2 = _interopRequireDefault(_focusTrap);
 
-	var _specialAssign = __webpack_require__(6);
+	var _specialAssign = __webpack_require__(7);
 
 	var _specialAssign2 = _interopRequireDefault(_specialAssign);
 
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
 	var checkedProps = {
@@ -707,3 +870,3 @@ tag: _react.PropTypes.string,
 
-	var AriaPopover = (function (_Component) {
+	var AriaPopover = function (_Component) {
 	  _inherits(AriaPopover, _Component);
@@ -714,3 +877,3 @@
 
-	    _get(Object.getPrototypeOf(AriaPopover.prototype), 'constructor', this).apply(this, arguments);
+	    return _possibleConstructorReturn(this, (AriaPopover.__proto__ || Object.getPrototypeOf(AriaPopover)).apply(this, arguments));
 	  }
@@ -726,6 +889,7 @@
 
+
 	      this._setPopoverNode();
 
 	      if (trapFocus) {
-	        this._focusTrap = (0, _focusTrap2['default'])((0, _reactDom.findDOMNode)(this), {
+	        this._focusTrap = (0, _focusTrap2.default)((0, _reactDom.findDOMNode)(this), {
 	          initialFocus: initialFocus,
@@ -747,3 +911,3 @@ escapeDeactivates: false,
 	    value: function componentDidUpdate(lastProps, lastState, lastContext) {
-	      if (this.context.ariaManager.isOpen !== lastContext.ariaManager.isOpen) {
+	      if (this.context.ariaManager.isPopoverOpen !== lastContext.ariaManager.isPopoverOpen) {
 	        this._setPopoverNode();
@@ -760,2 +924,6 @@ }
 	    value: function render() {
+	      var _context$ariaManager2 = this.context.ariaManager;
+	      var type = _context$ariaManager2.type;
+	      var uuid = _context$ariaManager2.uuid;
+	      var isPopoverOpen = _context$ariaManager2.isPopoverOpen;
 	      var _props = this.props;
@@ -765,4 +933,23 @@ var tag = _props.tag;
 
-	      var props = (0, _specialAssign2['default'])({}, this.props, checkedProps);
+	      var componentProps = {
+	        'aria-hidden': !isPopoverOpen
+	      };
 
+	      if (type === 'menu') {
+	        componentProps['role'] = 'menu';
+	      } else if (type === 'modal') {
+	        componentProps['role'] = 'dialog';
+	      } else if (type === 'alert') {
+	        componentProps['role'] = 'alertdialog';
+	      } else if (type === 'tooltip') {
+	        componentProps['id'] = uuid;
+	        componentProps['role'] = 'tooltip';
+	      }
+
+	      if (type === 'popover') {
+	        componentProps['aria-labelledby'] = uuid;
+	      }
+
+	      var props = (0, _specialAssign2.default)(componentProps, this.props, checkedProps);
+
 	      if (typeof children === 'function') {
@@ -774,34 +961,25 @@ return children(props);
 	    }
-	  }], [{
-	    key: 'contextTypes',
-	    value: {
-	      ariaManager: _react.PropTypes.object.isRequired
-	    },
-	    enumerable: true
-	  }, {
-	    key: 'propTypes',
-	    value: checkedProps,
-	    enumerable: true
-	  }, {
-	    key: 'defaultProps',
-	    value: {
-	      tag: 'div'
-	    },
-	    enumerable: true
 	  }]);
 
 	  return AriaPopover;
-	})(_react.Component);
+	}(_react.Component);
 
-	exports['default'] = AriaPopover;
+	AriaPopover.contextTypes = {
+	  ariaManager: _react.PropTypes.object.isRequired
+	};
+	AriaPopover.propTypes = checkedProps;
+	AriaPopover.defaultProps = {
+	  tag: 'div'
+	};
+	exports.default = AriaPopover;
 	module.exports = exports['default'];
 
 /***/ },
-/* 10 */
+/* 11 */
 /***/ function(module, exports) {
 
-	module.exports = __WEBPACK_EXTERNAL_MODULE_10__;
+	module.exports = __WEBPACK_EXTERNAL_MODULE_11__;
 
 /***/ },
-/* 11 */
+/* 12 */
 /***/ function(module, exports, __webpack_require__) {
@@ -811,16 +989,8 @@
 
-	Object.defineProperty(exports, '__esModule', {
+	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
 
-	var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
-	var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
-
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
-	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
-
-	function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
 	var _react = __webpack_require__(2);
@@ -830,10 +1000,18 @@
 
-	var _reactDom = __webpack_require__(8);
+	var _reactDom = __webpack_require__(9);
 
 	var _reactDom2 = _interopRequireDefault(_reactDom);
 
-	var _specialAssign = __webpack_require__(6);
+	var _specialAssign = __webpack_require__(7);
 
 	var _specialAssign2 = _interopRequireDefault(_specialAssign);
 
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
 	var checkedProps = {
@@ -844,9 +1022,27 @@ tag: _react.PropTypes.string,
 
-	var AriaItem = (function (_Component) {
+	var AriaItem = function (_Component) {
 	  _inherits(AriaItem, _Component);
 
 	  function AriaItem() {
+	    var _ref;
+
+	    var _temp, _this, _ret;
+
 	    _classCallCheck(this, AriaItem);
 
-	    _get(Object.getPrototypeOf(AriaItem.prototype), 'constructor', this).apply(this, arguments);
+	    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+	      args[_key] = arguments[_key];
+	    }
+
+	    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = AriaItem.__proto__ || Object.getPrototypeOf(AriaItem)).call.apply(_ref, [this].concat(args))), _this), _this._handleKeyDown = function (e) {
+	      var onKeyDown = _this.props.onKeyDown;
+
+
+	      if ([' ', 'Enter'].indexOf(e.key) > -1) {
+	        _this.context.ariaManager.onItemSelection(_this._member, e);
+	      }
+	      if (onKeyDown) {
+	        onKeyDown(e);
+	      }
+	    }, _temp), _possibleConstructorReturn(_this, _ret);
 	  }
@@ -857,8 +1053,8 @@
 	    value: function componentDidMount() {
-	      this._node = (0, _reactDom.findDOMNode)(this);
-
-	      this.context.ariaManager.addItem({
-	        node: this._node,
+	      this._member = {
+	        type: 'item',
+	        node: (0, _reactDom.findDOMNode)(this),
 	        text: this.props.text
-	      });
+	      };
+	      this.context.ariaManager.addMember(this._member);
 	    }
@@ -868,3 +1064,3 @@ }, {
 	    value: function componentWillUnmount() {
-	      this.context.ariaManager.removeItem(this._node);
+	      this.context.ariaManager.removeMember(this._member);
 	    }
@@ -878,5 +1074,6 @@ }, {
 
-	      var props = (0, _specialAssign2['default'])({
+	      var props = (0, _specialAssign2.default)({
 	        role: 'menuitem',
-	        tabIndex: -1
+	        tabIndex: -1,
+	        onKeyDown: this._handleKeyDown
 	      }, this.props, checkedProps);
@@ -890,26 +1087,385 @@
 	    }
-	  }], [{
-	    key: 'contextTypes',
-	    value: {
-	      ariaManager: _react.PropTypes.object.isRequired
-	    },
-	    enumerable: true
+	  }]);
+
+	  return AriaItem;
+	}(_react.Component);
+
+	AriaItem.contextTypes = {
+	  ariaManager: _react.PropTypes.object.isRequired
+	};
+	AriaItem.propTypes = checkedProps;
+	AriaItem.defaultProps = {
+	  tag: 'div'
+	};
+	exports.default = AriaItem;
+	module.exports = exports['default'];
+
+/***/ },
+/* 13 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	var _react = __webpack_require__(2);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _specialAssign = __webpack_require__(7);
+
+	var _specialAssign2 = _interopRequireDefault(_specialAssign);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	var checkedProps = {
+	  tag: _react.PropTypes.string,
+	  children: _react.PropTypes.oneOfType([_react.PropTypes.func, _react.PropTypes.node]).isRequired
+	};
+
+	var AriaTabList = function (_Component) {
+	  _inherits(AriaTabList, _Component);
+
+	  function AriaTabList() {
+	    _classCallCheck(this, AriaTabList);
+
+	    return _possibleConstructorReturn(this, (AriaTabList.__proto__ || Object.getPrototypeOf(AriaTabList)).apply(this, arguments));
+	  }
+
+	  _createClass(AriaTabList, [{
+	    key: 'render',
+	    value: function render() {
+	      var type = this.context.ariaManager.type;
+	      var _props = this.props;
+	      var tag = _props.tag;
+	      var children = _props.children;
+
+	      var componentProps = {
+	        role: 'tablist'
+	      };
+
+	      if (type === 'accordion') {
+	        componentProps['aria-multiselectable'] = true;
+	      }
+
+	      var props = (0, _specialAssign2.default)(componentProps, this.props, checkedProps);
+
+	      if (typeof children === 'function') {
+	        return children(props);
+	      }
+
+	      return (0, _react.createElement)(tag, props, children);
+	    }
+	  }]);
+
+	  return AriaTabList;
+	}(_react.Component);
+
+	AriaTabList.contextTypes = {
+	  ariaManager: _react.PropTypes.object.isRequired
+	};
+	AriaTabList.propTypes = checkedProps;
+	AriaTabList.defaultProps = {
+	  tag: 'div'
+	};
+	exports.default = AriaTabList;
+	module.exports = exports['default'];
+
+/***/ },
+/* 14 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	var _react = __webpack_require__(2);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _reactDom = __webpack_require__(9);
+
+	var _reactDom2 = _interopRequireDefault(_reactDom);
+
+	var _specialAssign = __webpack_require__(7);
+
+	var _specialAssign2 = _interopRequireDefault(_specialAssign);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	var checkedProps = {
+	  tag: _react.PropTypes.string,
+	  id: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.number]).isRequired,
+	  isActive: _react.PropTypes.bool,
+	  children: _react.PropTypes.oneOfType([_react.PropTypes.func, _react.PropTypes.node]).isRequired
+	};
+
+	var AriaTab = function (_Component) {
+	  _inherits(AriaTab, _Component);
+
+	  function AriaTab() {
+	    var _ref;
+
+	    var _temp, _this, _ret;
+
+	    _classCallCheck(this, AriaTab);
+
+	    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+	      args[_key] = arguments[_key];
+	    }
+
+	    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = AriaTab.__proto__ || Object.getPrototypeOf(AriaTab)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
+	      isActive: false
+	    }, _this._setActiveState = function (isActive) {
+	      _this.setState({ isActive: isActive });
+	    }, _this._toggleActiveState = function () {
+	      _this.setState({ isActive: !_this.state.isActive });
+	    }, _this._handleKeyDown = function (e) {
+	      var _this$context$ariaMan = _this.context.ariaManager;
+	      var type = _this$context$ariaMan.type;
+	      var activateTab = _this$context$ariaMan.activateTab;
+	      var _this$props = _this.props;
+	      var id = _this$props.id;
+	      var onKeyDown = _this$props.onKeyDown;
+
+
+	      if (type === 'accordion' && [' ', 'Enter'].indexOf(e.key) > -1) {
+	        activateTab(id);
+	      }
+	      if (onKeyDown) {
+	        onKeyDown(e);
+	      }
+	    }, _this._handleFocus = function (e) {
+	      var _this$context$ariaMan2 = _this.context.ariaManager;
+	      var type = _this$context$ariaMan2.type;
+	      var activateTab = _this$context$ariaMan2.activateTab;
+	      var _this$props2 = _this.props;
+	      var id = _this$props2.id;
+	      var onFocus = _this$props2.onFocus;
+
+
+	      if (type === 'tabs') {
+	        activateTab(id);
+	      }
+	      if (onFocus) {
+	        onFocus(e);
+	      }
+	    }, _temp), _possibleConstructorReturn(_this, _ret);
+	  }
+
+	  _createClass(AriaTab, [{
+	    key: 'componentDidMount',
+	    value: function componentDidMount() {
+	      this._member = {
+	        type: 'tab',
+	        id: this.props.id,
+	        node: (0, _reactDom.findDOMNode)(this),
+	        text: this.props.text,
+	        setActiveState: this._setActiveState,
+	        toggleActiveState: this._toggleActiveState
+	      };
+	      this.context.ariaManager.addMember(this._member);
+	    }
 	  }, {
-	    key: 'propTypes',
-	    value: checkedProps,
-	    enumerable: true
+	    key: 'componentWillUnmount',
+	    value: function componentWillUnmount() {
+	      this.context.ariaManager.removeMember(this._member);
+	    }
 	  }, {
-	    key: 'defaultProps',
-	    value: {
-	      tag: 'div'
-	    },
-	    enumerable: true
+	    key: 'render',
+	    value: function render() {
+	      var type = this.context.ariaManager.type;
+	      var _props = this.props;
+	      var tag = _props.tag;
+	      var id = _props.id;
+	      var disabled = _props.disabled;
+	      var children = _props.children;
+
+	      var isActive = this.props.isActive !== undefined ? this.props.isActive : this.state.isActive;
+	      var componentProps = {
+	        id: id,
+	        role: 'tab',
+	        tabIndex: type === 'accordion' ? 0 : isActive ? 0 : -1,
+	        'aria-selected': isActive,
+	        'aria-controls': id + '-panel',
+	        'aria-disabled': disabled,
+	        onKeyDown: this._handleKeyDown,
+	        onFocus: this._handleFocus
+	      };
+
+	      if (type === 'accordion') {
+	        componentProps['aria-expanded'] = isActive;
+	      }
+
+	      var props = (0, _specialAssign2.default)(componentProps, this.props, checkedProps);
+
+	      if (typeof children === 'function') {
+	        return children(props, isActive);
+	      }
+
+	      return (0, _react.createElement)(tag, props, children);
+	    }
 	  }]);
 
-	  return AriaItem;
-	})(_react.Component);
+	  return AriaTab;
+	}(_react.Component);
 
-	exports['default'] = AriaItem;
+	AriaTab.contextTypes = {
+	  ariaManager: _react.PropTypes.object.isRequired
+	};
+	AriaTab.propTypes = checkedProps;
+	AriaTab.defaultProps = {
+	  tag: 'div'
+	};
+	exports.default = AriaTab;
 	module.exports = exports['default'];
 
+/***/ },
+/* 15 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	var _react = __webpack_require__(2);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _reactDom = __webpack_require__(9);
+
+	var _reactDom2 = _interopRequireDefault(_reactDom);
+
+	var _specialAssign = __webpack_require__(7);
+
+	var _specialAssign2 = _interopRequireDefault(_specialAssign);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	var checkedProps = {
+	  tag: _react.PropTypes.string,
+	  controlledBy: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.number]).isRequired,
+	  isActive: _react.PropTypes.bool,
+	  children: _react.PropTypes.oneOfType([_react.PropTypes.func, _react.PropTypes.node]).isRequired
+	};
+
+	var AriaPanel = function (_Component) {
+	  _inherits(AriaPanel, _Component);
+
+	  function AriaPanel() {
+	    var _ref;
+
+	    var _temp, _this, _ret;
+
+	    _classCallCheck(this, AriaPanel);
+
+	    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+	      args[_key] = arguments[_key];
+	    }
+
+	    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = AriaPanel.__proto__ || Object.getPrototypeOf(AriaPanel)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
+	      isActive: false
+	    }, _this._setActiveState = function (isActive) {
+	      _this.setState({ isActive: isActive });
+	    }, _this._toggleActiveState = function () {
+	      _this.setState({ isActive: !_this.state.isActive });
+	    }, _this._handleKeyDown = function (e) {
+	      if (e.ctrlKey && e.key === 'ArrowUp') {
+	        _this.context.ariaManager.focusTab(_this.props.controlledBy);
+	      }
+	      if (_this.props.onKeyDown) {
+	        _this.props.onKeyDown(e);
+	      }
+	    }, _temp), _possibleConstructorReturn(_this, _ret);
+	  }
+
+	  _createClass(AriaPanel, [{
+	    key: 'componentDidMount',
+	    value: function componentDidMount() {
+	      this.context.ariaManager.addPanel({
+	        controlledBy: this.props.controlledBy,
+	        node: (0, _reactDom.findDOMNode)(this),
+	        setActiveState: this._setActiveState,
+	        toggleActiveState: this._toggleActiveState
+	      });
+	    }
+	  }, {
+	    key: 'render',
+	    value: function render() {
+	      var _props = this.props;
+	      var tag = _props.tag;
+	      var controlledBy = _props.controlledBy;
+	      var disabled = _props.disabled;
+	      var children = _props.children;
+
+	      var isActive = this.props.isActive !== undefined ? this.props.isActive : this.state.isActive;
+	      var componentProps = {
+	        id: controlledBy + '-panel',
+	        role: 'tabpanel',
+	        'aria-hidden': !isActive,
+	        'aria-labelledby': controlledBy,
+	        onKeyDown: this._handleKeyDown
+	      };
+
+	      if (!isActive) {
+	        componentProps['style'] = _extends({
+	          display: 'none'
+	        }, this.props.style);
+	      }
+
+	      var props = (0, _specialAssign2.default)(componentProps, this.props, checkedProps);
+
+	      if (typeof children === 'function') {
+	        return children(props, isActive);
+	      }
+
+	      return (0, _react.createElement)(tag, props, children);
+	    }
+	  }]);
+
+	  return AriaPanel;
+	}(_react.Component);
+
+	AriaPanel.contextTypes = {
+	  ariaManager: _react.PropTypes.object.isRequired
+	};
+	AriaPanel.propTypes = checkedProps;
+	AriaPanel.defaultProps = {
+	  tag: 'div'
+	};
+	exports.default = AriaPanel;
+	module.exports = exports['default'];
+
 /***/ }
@@ -916,0 +1472,0 @@ /******/ ])

dist/react-aria.min.js

@@ -1,1 +0,6 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("React"),require("createFocusGroup"),require("createTapListener"),require("ReactDOM"),require("focusTrap")):"function"==typeof define&&define.amd?define(["React","createFocusGroup","createTapListener","ReactDOM","focusTrap"],t):"object"==typeof exports?exports.ReactARIA=t(require("React"),require("createFocusGroup"),require("createTapListener"),require("ReactDOM"),require("focusTrap")):e.ReactARIA=t(e.React,e.createFocusGroup,e.createTapListener,e.ReactDOM,e.focusTrap)}(this,function(e,t,o,r,n){return function(e){function t(r){if(o[r])return o[r].exports;var n=o[r]={exports:{},id:r,loaded:!1};return e[r].call(n.exports,n,n.exports,t),n.loaded=!0,n.exports}var o={};return t.m=e,t.c=o,t.p="dist/",t(0)}([function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0});var n=o(1),i=r(n);t.AriaManager=i["default"];var u=o(7),a=r(u);t.AriaToggle=a["default"];var s=o(9),p=r(s);t.AriaPopover=p["default"];var c=o(11),l=r(c);t.AriaItem=l["default"]},function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var u=function(){function e(e,t){for(var o=0;o<t.length;o++){var r=t[o];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,o,r){return o&&e(t.prototype,o),r&&e(t,r),t}}(),a=function(e,t,o){for(var r=!0;r;){var n=e,i=t,u=o;r=!1,null===n&&(n=Function.prototype);var a=Object.getOwnPropertyDescriptor(n,i);if(void 0!==a){if("value"in a)return a.value;var s=a.get;if(void 0===s)return;return s.call(u)}var p=Object.getPrototypeOf(n);if(null===p)return;e=p,t=i,o=u,r=!0,a=p=void 0}},s=o(2),p=(r(s),o(3)),c=r(p),l=o(4),f=r(l),d=o(6),v=r(d),y=function(e,t){return e===t||e.contains(t)},h={tab:9,escape:27,enter:13,space:32,end:35,home:36,arrowLeft:37,arrowUp:38,arrowRight:39,arrowDown:40},_={tag:s.PropTypes.string,trapFocus:s.PropTypes.bool,children:s.PropTypes.oneOfType([s.PropTypes.func,s.PropTypes.node]).isRequired,keybindings:s.PropTypes.shape({next:s.PropTypes.oneOfType([s.PropTypes.object,s.PropTypes.array]),prev:s.PropTypes.oneOfType([s.PropTypes.object,s.PropTypes.array]),first:s.PropTypes.oneOfType([s.PropTypes.object,s.PropTypes.array]),last:s.PropTypes.oneOfType([s.PropTypes.object,s.PropTypes.array])}),wrap:s.PropTypes.bool,stringSearch:s.PropTypes.bool,stringSearchDelay:s.PropTypes.number,openPopoverOn:s.PropTypes.oneOf(["tap","hover"]),closeOnOutsideClick:s.PropTypes.bool,closeOnItemSelection:s.PropTypes.bool,onPopoverOpen:s.PropTypes.func,onPopoverClose:s.PropTypes.func,onItemSelection:s.PropTypes.func},m=function(e){function t(e){var o=this;n(this,t),a(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this._setToggleNode=function(e){o._toggle=e},this._setPopoverNode=function(e){o._popover=e},this._addItem=function(e){o._items.push(e),o._focusGroup.addMember(e)},this._removeItem=function(e){var t=o._items.indexOf(e);t>-1&&o._items.splice(t,1),o._focusGroup.removeMember(e)},this._clearItems=function(){o._focusGroup.clearMembers()},this._focusItem=function(e){o._focusGroup.focusNodeAtIndex(e)},this._openPopover=function(){var e=arguments.length<=0||void 0===arguments[0]||arguments[0];o.state.isOpen||(o.setState({isOpen:!0}),o.props.onPopoverOpen(),o._focusGroup.activate(),e&&setTimeout(function(){o._focusItem(0)},60))},this._closePopover=function(){var e=arguments.length<=0||void 0===arguments[0]||arguments[0];o.state.isOpen&&(o.setState({isOpen:!1}),o.props.onPopoverClose(),o._focusGroup.deactivate(),e&&o._toggle.focus())},this._togglePopover=function(e){o.state.isOpen?o._closePopover(e):o._openPopover(e)},this.state={isOpen:!1},this._focusGroup=(0,c["default"])(e),this._toggle=null,this._popover=null,this._items=[]}return i(t,e),u(t,null,[{key:"childContextTypes",value:{ariaManager:s.PropTypes.object.isRequired},enumerable:!0},{key:"propTypes",value:_,enumerable:!0},{key:"defaultProps",value:{tag:"div",trapFocus:!1,keybindings:{next:[{keyCode:h.arrowDown},{keyCode:h.arrowRight}],prev:[{keyCode:h.arrowUp},{keyCode:h.arrowLeft}],first:{keyCode:h.home},last:{keyCode:h.end}},wrap:!0,stringSearch:!0,stringSearchDelay:600,openPopoverOn:"tap",closeOnOutsideClick:!0,closeOnItemSelection:!0,onPopoverOpen:function(){return null},onPopoverClose:function(){return null},onItemSelection:function(){return null}},enumerable:!0}]),u(t,[{key:"getChildContext",value:function(){return{ariaManager:{trapFocus:this.props.trapFocus,initialFocus:this.props.initialFocus,isOpen:this.state.isOpen,onItemSelection:this._onItemSelection,setToggleNode:this._setToggleNode,setPopoverNode:this._setPopoverNode,addItem:this._addItem,removeItem:this._removeItem,clearItems:this._clearItems,focusItem:this._focusItem,openPopover:this._openPopover,closePopover:this._closePopover,togglePopover:this._togglePopover}}}},{key:"componentWillMount",value:function(){f["default"].add(this,this.props.openPopoverOn)}},{key:"componentWillUnmount",value:function(){this._focusGroup.deactivate(),this._toggle=null,this._popover=null,this._items=[],f["default"].remove(this)}},{key:"_onTap",value:function(e){"tap"===this.props.openPopoverOn&&this._handleTapOrHover(e)}},{key:"_onHover",value:function(e){"hover"===this.props.openPopoverOn&&this._handleTapOrHover(e)}},{key:"_handleTapOrHover",value:function(e){var t=this.props,o=t.openPopoverOn,r=t.closeOnOutsideClick,n=e.target,i=this._toggle.getAttribute("disabled");if(y(this._toggle,n)&&null===i)"tap"===o?this._togglePopover(!1):this._openPopover(!1);else if(r&&this._popover&&!y(this._popover,n))this._closePopover(!1);else for(var u=this._items.length;u--;){var a=this._items[u];a.node===n&&this._onItemSelection(a,e)}}},{key:"_onKeyDown",value:function(e){var t=e.keyCode,o=e.target;if(this.state.isOpen)if(this.props.trapFocus||t!==h.tab){if(t===h.escape)e.preventDefault(),this._closePopover();else if([h.enter,h.space].indexOf(t)>-1)for(var r=this._items.length;r--;){var n=this._items[r];n.node===o&&(e.preventDefault(),this._onItemSelection(n,e))}}else this._closePopover(!1);else[h.arrowUp,h.arrowDown,h.enter,h.space].indexOf(t)>-1&&y(this._toggle,o)&&(e.preventDefault(),this._openPopover())}},{key:"_onItemSelection",value:function(e,t){var o=e.value||e.node.innerHTML;this.props.closeOnItemSelection&&this._closePopover(),this.props.onItemSelection(o,t)}},{key:"render",value:function(){var e=this.props,t=e.tag,o=e.children,r=(0,v["default"])({},this.props,_);return"function"==typeof o?o(this.state.isOpen):(0,s.createElement)(t,r,o)}}]),t}(s.Component);t["default"]=m,e.exports=t["default"]},function(t,o){t.exports=e},function(e,o){e.exports=t},function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0});var n=o(5),i=r(n);t["default"]={_queue:[],add:function(e){this._queue.push(e),1===this._queue.length&&this._attachListeners()},remove:function(e){var t=this._queue.indexOf(e);t>-1&&this._queue.splice(t,1),this._queue.length<=0&&this._detachListeners()},_attachListeners:function(){this._tapListener=(0,i["default"])(document.documentElement,this._documentEvent.bind(this,"_onTap")),document.addEventListener("mouseover",this._documentEvent.bind(this,"_onHover")),document.addEventListener("keydown",this._documentEvent.bind(this,"_onKeyDown"))},_detachListeners:function(){this._tapListener.remove(),document.removeEventListener("mouseover",this._documentEvent),document.removeEventListener("keydown",this._documentEvent)},_documentEvent:function(e,t){for(var o=this._queue.length;o--;)this._queue[o][e](t)}},e.exports=t["default"]},function(e,t){e.exports=o},function(e,t){"use strict";function o(e,t,o){for(var r in t)t.hasOwnProperty(r)&&!o[r]&&(e[r]=t[r]);return e}Object.defineProperty(t,"__esModule",{value:!0}),t["default"]=o,e.exports=t["default"]},function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var u=function(){function e(e,t){for(var o=0;o<t.length;o++){var r=t[o];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,o,r){return o&&e(t.prototype,o),r&&e(t,r),t}}(),a=function(e,t,o){for(var r=!0;r;){var n=e,i=t,u=o;r=!1,null===n&&(n=Function.prototype);var a=Object.getOwnPropertyDescriptor(n,i);if(void 0!==a){if("value"in a)return a.value;var s=a.get;if(void 0===s)return;return s.call(u)}var p=Object.getPrototypeOf(n);if(null===p)return;e=p,t=i,o=u,r=!0,a=p=void 0}},s=o(2),p=(r(s),o(8)),c=(r(p),o(6)),l=r(c),f={tag:s.PropTypes.string,children:s.PropTypes.oneOfType([s.PropTypes.func,s.PropTypes.node]).isRequired},d=function(e){function t(){n(this,t),a(Object.getPrototypeOf(t.prototype),"constructor",this).apply(this,arguments)}return i(t,e),u(t,[{key:"componentDidMount",value:function(){this.context.ariaManager.setToggleNode((0,p.findDOMNode)(this))}},{key:"render",value:function(){var e=this.props,t=e.tag,o=e.disabled,r=e.children,n=(0,l["default"])({role:"button",tabIndex:o?"":"0","aria-haspopup":!0,"aria-expanded":this.context.ariaManager.isOpen,"aria-disabled":o},this.props,f);return"function"==typeof r?r(n):(0,s.createElement)(t,n,r)}}],[{key:"contextTypes",value:{ariaManager:s.PropTypes.object.isRequired},enumerable:!0},{key:"propTypes",value:f,enumerable:!0},{key:"defaultProps",value:{tag:"button"},enumerable:!0}]),t}(s.Component);t["default"]=d,e.exports=t["default"]},function(e,t){e.exports=r},function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var u=function(){function e(e,t){for(var o=0;o<t.length;o++){var r=t[o];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,o,r){return o&&e(t.prototype,o),r&&e(t,r),t}}(),a=function(e,t,o){for(var r=!0;r;){var n=e,i=t,u=o;r=!1,null===n&&(n=Function.prototype);var a=Object.getOwnPropertyDescriptor(n,i);if(void 0!==a){if("value"in a)return a.value;var s=a.get;if(void 0===s)return;return s.call(u)}var p=Object.getPrototypeOf(n);if(null===p)return;e=p,t=i,o=u,r=!0,a=p=void 0}},s=o(2),p=(r(s),o(8)),c=(r(p),o(10)),l=r(c),f=o(6),d=r(f),v={tag:s.PropTypes.string,children:s.PropTypes.oneOfType([s.PropTypes.func,s.PropTypes.node]).isRequired},y=function(e){function t(){n(this,t),a(Object.getPrototypeOf(t.prototype),"constructor",this).apply(this,arguments)}return i(t,e),u(t,[{key:"componentDidMount",value:function(){var e=this.context.ariaManager,t=e.trapFocus,o=e.initialFocus;e.onClickOutside;this._setPopoverNode(),t&&(this._focusTrap=(0,l["default"])((0,p.findDOMNode)(this),{initialFocus:o,escapeDeactivates:!1,clickOutsideDeactivates:!0}).activate())}},{key:"componentWillUnmount",value:function(){this.context.ariaManager.trapFocus&&this._focusTrap.deactivate()}},{key:"componentDidUpdate",value:function(e,t,o){this.context.ariaManager.isOpen!==o.ariaManager.isOpen&&this._setPopoverNode()}},{key:"_setPopoverNode",value:function(){this.context.ariaManager.setPopoverNode((0,p.findDOMNode)(this))}},{key:"render",value:function(){var e=this.props,t=e.tag,o=e.children,r=(0,d["default"])({},this.props,v);return"function"==typeof o?o(r):(0,s.createElement)(t,r,o)}}],[{key:"contextTypes",value:{ariaManager:s.PropTypes.object.isRequired},enumerable:!0},{key:"propTypes",value:v,enumerable:!0},{key:"defaultProps",value:{tag:"div"},enumerable:!0}]),t}(s.Component);t["default"]=y,e.exports=t["default"]},function(e,t){e.exports=n},function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var u=function(){function e(e,t){for(var o=0;o<t.length;o++){var r=t[o];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,o,r){return o&&e(t.prototype,o),r&&e(t,r),t}}(),a=function(e,t,o){for(var r=!0;r;){var n=e,i=t,u=o;r=!1,null===n&&(n=Function.prototype);var a=Object.getOwnPropertyDescriptor(n,i);if(void 0!==a){if("value"in a)return a.value;var s=a.get;if(void 0===s)return;return s.call(u)}var p=Object.getPrototypeOf(n);if(null===p)return;e=p,t=i,o=u,r=!0,a=p=void 0}},s=o(2),p=(r(s),o(8)),c=(r(p),o(6)),l=r(c),f={tag:s.PropTypes.string,children:s.PropTypes.oneOfType([s.PropTypes.func,s.PropTypes.node]).isRequired},d=function(e){function t(){n(this,t),a(Object.getPrototypeOf(t.prototype),"constructor",this).apply(this,arguments)}return i(t,e),u(t,[{key:"componentDidMount",value:function(){this._node=(0,p.findDOMNode)(this),this.context.ariaManager.addItem({node:this._node,text:this.props.text})}},{key:"componentWillUnmount",value:function(){this.context.ariaManager.removeItem(this._node)}},{key:"render",value:function(){var e=this.props,t=e.tag,o=e.children,r=(0,l["default"])({role:"menuitem",tabIndex:-1},this.props,f);return"function"==typeof o?o(r):(0,s.createElement)(t,r,o)}}],[{key:"contextTypes",value:{ariaManager:s.PropTypes.object.isRequired},enumerable:!0},{key:"propTypes",value:f,enumerable:!0},{key:"defaultProps",value:{tag:"div"},enumerable:!0}]),t}(s.Component);t["default"]=d,e.exports=t["default"]}])});
+/*!
+ * React Aria 0.4.0
+ * https://github.com/souporserious/react-aria
+ * Copyright (c) 2016 React Aria Authors
+ */
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react"),require("focus-group"),require("no-scroll"),require("teeny-tap"),require("react-dom"),require("focus-trap")):"function"==typeof define&&define.amd?define(["react","focus-group","no-scroll","teeny-tap","react-dom","focus-trap"],t):"object"==typeof exports?exports.ReactARIA=t(require("react"),require("focus-group"),require("no-scroll"),require("teeny-tap"),require("react-dom"),require("focus-trap")):e.ReactARIA=t(e.React,e.createFocusGroup,e.noScroll,e.createTapListener,e.ReactDOM,e.focusTrap)}(this,function(e,t,o,r,n,i){return function(e){function t(r){if(o[r])return o[r].exports;var n=o[r]={exports:{},id:r,loaded:!1};return e[r].call(n.exports,n,n.exports,t),n.loaded=!0,n.exports}var o={};return t.m=e,t.c=o,t.p="dist/",t(0)}([function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0}),t.AriaPanel=t.AriaTab=t.AriaTabList=t.AriaItem=t.AriaPopover=t.AriaToggle=t.AriaManager=void 0;var n=o(1),i=r(n),a=o(8),s=r(a),p=o(10),u=r(p),c=o(12),l=r(c),f=o(13),d=r(f),y=o(14),v=r(y),h=o(15),b=r(h);t.AriaManager=i["default"],t.AriaToggle=s["default"],t.AriaPopover=u["default"],t.AriaItem=l["default"],t.AriaTabList=d["default"],t.AriaTab=v["default"],t.AriaPanel=b["default"]},function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var o=0;o<t.length;o++){var r=t[o];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,o,r){return o&&e(t.prototype,o),r&&e(t,r),t}}(),p=o(2),u=(r(p),o(3)),c=r(u),l=o(4),f=r(l),d=o(5),y=r(d),v=o(7),h=r(v),b=function(e,t){return e===t||e.contains(t)},_={tab:9,escape:27,end:35,home:36,arrowLeft:37,arrowUp:38,arrowRight:39,arrowDown:40},P={type:p.PropTypes.oneOf(["menu","popover","modal","tooltip","alert","tabs","accordion"]).isRequired,tag:p.PropTypes.string,trapFocus:p.PropTypes.bool,freezeScroll:p.PropTypes.bool,activeTabId:p.PropTypes.oneOfType([p.PropTypes.string,p.PropTypes.number]),children:p.PropTypes.oneOfType([p.PropTypes.func,p.PropTypes.node]).isRequired,keybindings:p.PropTypes.shape({next:p.PropTypes.oneOfType([p.PropTypes.object,p.PropTypes.array]),prev:p.PropTypes.oneOfType([p.PropTypes.object,p.PropTypes.array]),first:p.PropTypes.oneOfType([p.PropTypes.object,p.PropTypes.array]),last:p.PropTypes.oneOfType([p.PropTypes.object,p.PropTypes.array])}),wrap:p.PropTypes.bool,stringSearch:p.PropTypes.bool,stringSearchDelay:p.PropTypes.number,collapsible:p.PropTypes.bool,openPopoverOn:p.PropTypes.oneOf(["tap","hover"]),closeOnOutsideClick:p.PropTypes.bool,closeOnItemSelection:p.PropTypes.bool,accordion:p.PropTypes.bool,onPopoverOpen:p.PropTypes.func,onPopoverClose:p.PropTypes.func,onItemSelection:p.PropTypes.func},m=function(e){function t(e){n(this,t);var o=i(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return o._onItemSelection=function(e,t){var r=e.value||e.node.innerHTML;o.props.closeOnItemSelection&&o.closePopover(),o.props.onItemSelection(r,t)},o._setToggleNode=function(e){o._toggle=e},o._setPopoverNode=function(e){o._popover=e},o._addMember=function(e){var t=o.props.activeTabId,r=e.id,n=e.index,i=e.node,a=e.text;void 0===n?o._members.push(e):o._members.splice(n,0,e),o._focusGroup.addMember({node:i,text:a||i.innerHTML}),"tab"===e.type&&(t===r?o._activateTab(t,!0,!1):o._handleFirstTabSelection(r))},o._removeMember=function(e){var t=o._members.indexOf(e);t>-1&&(o._members.splice(e,1),o._focusGroup.removeMember(e.node))},o._focusItem=function(e){o._focusGroup.focusNodeAtIndex(e)},o.openPopover=function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=o.props,r=t.freezeScroll,n=t.onPopoverOpen;o.state.isPopoverOpen||(o.setState({isPopoverOpen:!0}),r&&f["default"].on(),n(),e&&setTimeout(function(){o._focusItem(0)},60))},o.closePopover=function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=o.props,r=t.freezeScroll,n=t.onPopoverClose;o.state.isPopoverOpen&&(o.setState({isPopoverOpen:!1}),r&&f["default"].off(),n(),e&&setTimeout(function(){o._toggle.focus()},60))},o.togglePopover=function(e){o.state.isPopoverOpen?o.closePopover(e):o.openPopover(e)},o._addPanel=function(e){var t=o.props.activeTabId,r=e.controlledBy;o._panels.push(e),t===r?o._activateTab(t,!0,!1):o._handleFirstTabSelection(e.controlledBy)},o._focusTab=function(e){var t=o._members.filter(function(t){return t.id===e});t&&t.node.focus()},o._activateTab=function(e,t){var r=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],n=o.props,i=n.type,a=n.onChange;if("tabs"===i){if(e===o._activeTabId&&!t)return;o._activeTabId=e}if(r&&"function"==typeof a)return void a(e);for(var s=o._members.length;s--;){var p=o._members[s];"accordion"===i?p.id===e&&p.toggleActiveState():p.setActiveState(e===p.id)}for(var u=o._panels.length;u--;){var c=o._panels[u];"accordion"===i?c.controlledBy===e&&c.toggleActiveState():c.setActiveState(e===c.controlledBy)}},o.state={isPopoverOpen:!1},o._focusGroup=(0,c["default"])(e),o._toggle=null,o._popover=null,o._members=[],o._panels=[],o._activeTabId=e.activeTabId,o._uuid="RA"+Math.abs(~~(Math.random()*new Date)),o}return a(t,e),s(t,[{key:"getChildContext",value:function(){return{ariaManager:{uuid:this._uuid,type:this.props.type,trapFocus:this.props.trapFocus,initialFocus:this.props.initialFocus,isPopoverOpen:this.state.isPopoverOpen,onItemSelection:this._onItemSelection,setToggleNode:this._setToggleNode,setPopoverNode:this._setPopoverNode,addMember:this._addMember,addPanel:this._addPanel,removeMember:this._removeMember,activateTab:this._activateTab,focusItem:this._focusItem,openPopover:this.openPopover,closePopover:this.closePopover,togglePopover:this.togglePopover}}}},{key:"componentWillMount",value:function(){this._focusGroup.activate(),y["default"].add(this)}},{key:"componentWillUnmount",value:function(){this._focusGroup.deactivate(),y["default"].remove(this)}},{key:"_onTap",value:function(e){"tap"===this.props.openPopoverOn&&this._handleTapOrHover(e)}},{key:"_onHover",value:function(e){"hover"===this.props.openPopoverOn&&this._handleTapOrHover(e)}},{key:"_handleTapOrHover",value:function(e){var t=this.props,o=t.openPopoverOn,r=t.closeOnOutsideClick,n=e.target;if(this._toggle){var i=this._toggle.getAttribute("disabled");if(b(this._toggle,n)&&null===i)return void("tap"===o?this.togglePopover(!1):this.openPopover(!1));if(r&&this._popover&&!b(this._popover,n))return void this.closePopover(!1)}for(var a=this._members.length;a--;){var s=this._members[a];if(s.node===n)return void("item"===s.type?this._onItemSelection(s,e):this._activateTab(s.id))}}},{key:"_onKeyDown",value:function(e){var t=e.keyCode;this.state.isPopoverOpen&&(this.props.trapFocus||t!==_.tab?t===_.escape&&this.closePopover():this.closePopover(!1))}},{key:"_handleFirstTabSelection",value:function(e){("tabs"===this.props.type&&!this._activeTabId||e===this._activeTabId)&&this._activateTab(e,!0,!1)}},{key:"render",value:function(){var e=this.props,t=e.tag,o=e.children,r=(0,h["default"])({},this.props,P);return"function"==typeof o?o(this.state.isPopoverOpen):(0,p.createElement)(t,r,o)}}]),t}(p.Component);m.childContextTypes={ariaManager:p.PropTypes.object.isRequired},m.propTypes=P,m.defaultProps={tag:"div",trapFocus:!1,freezeScroll:!1,keybindings:{next:[{keyCode:_.arrowDown},{keyCode:_.arrowRight}],prev:[{keyCode:_.arrowUp},{keyCode:_.arrowLeft}],first:{keyCode:_.home},last:{keyCode:_.end}},wrap:!0,stringSearch:!0,stringSearchDelay:600,collapsible:!1,openPopoverOn:"tap",closeOnOutsideClick:!0,closeOnItemSelection:!0,onPopoverOpen:function(){return null},onPopoverClose:function(){return null},onItemSelection:function(){return null}},t["default"]=m,e.exports=t["default"]},function(t,o){t.exports=e},function(e,o){e.exports=t},function(e,t){e.exports=o},function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0});var n=o(6),i=r(n);t["default"]={_queue:[],add:function(e){this._queue.push(e),1===this._queue.length&&this._attachListeners()},remove:function(e){var t=this._queue.indexOf(e);t>-1&&this._queue.splice(t,1),this._queue.length<=0&&this._detachListeners()},_attachListeners:function(){this._tapListener=(0,i["default"])(document.documentElement,this._documentEvent.bind(this,"_onTap")),document.addEventListener("mouseover",this._documentEvent.bind(this,"_onHover")),document.addEventListener("keydown",this._documentEvent.bind(this,"_onKeyDown"))},_detachListeners:function(){this._tapListener.remove(),document.removeEventListener("mouseover",this._documentEvent),document.removeEventListener("keydown",this._documentEvent)},_documentEvent:function(e,t){for(var o=this._queue.length;o--;)this._queue[o][e](t)}},e.exports=t["default"]},function(e,t){e.exports=r},function(e,t){"use strict";function o(e,t,o){for(var r in t)t.hasOwnProperty(r)&&!o[r]&&(e[r]=t[r]);return e}Object.defineProperty(t,"__esModule",{value:!0}),t["default"]=o,e.exports=t["default"]},function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var o=0;o<t.length;o++){var r=t[o];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,o,r){return o&&e(t.prototype,o),r&&e(t,r),t}}(),p=o(2),u=(r(p),o(9)),c=(r(u),o(7)),l=r(c),f={tag:p.PropTypes.string,children:p.PropTypes.oneOfType([p.PropTypes.func,p.PropTypes.node]).isRequired},d=function(e){function t(){var e,o,r,a;n(this,t);for(var s=arguments.length,p=Array(s),u=0;u<s;u++)p[u]=arguments[u];return o=r=i(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(p))),r._handleKeyDown=function(e){(["ArrowUp","ArrowDown"," "].indexOf(e.key)>-1||"button"!==r.props.tag&&"Enter"===e.key)&&(r.context.ariaManager.isPopoverOpen?r.context.ariaManager.focusItem(0):r.context.ariaManager.openPopover()),r.props.onKeyDown&&r.props.onKeyDown(e)},a=o,i(r,a)}return a(t,e),s(t,[{key:"componentDidMount",value:function(){this.context.ariaManager.setToggleNode((0,u.findDOMNode)(this))}},{key:"render",value:function(){var e=this.context.ariaManager,t=e.type,o=e.uuid,r=e.isPopoverOpen,n=this.props,i=n.tag,a=n.disabled,s=n.children,u={role:"button",tabIndex:a?"":0,"aria-haspopup":!0,"aria-expanded":r,"aria-disabled":a,onKeyDown:this._handleKeyDown};"popover"===t&&(u.id=o),"tooltip"===t&&(u["aria-describedby"]=o);var c=(0,l["default"])(u,this.props,f);return"function"==typeof s?s(c):(0,p.createElement)(i,c,s)}}]),t}(p.Component);d.contextTypes={ariaManager:p.PropTypes.object.isRequired},d.propTypes=f,d.defaultProps={tag:"button"},t["default"]=d,e.exports=t["default"]},function(e,t){e.exports=n},function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var o=0;o<t.length;o++){var r=t[o];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,o,r){return o&&e(t.prototype,o),r&&e(t,r),t}}(),p=o(2),u=(r(p),o(9)),c=(r(u),o(11)),l=r(c),f=o(7),d=r(f),y={tag:p.PropTypes.string,children:p.PropTypes.oneOfType([p.PropTypes.func,p.PropTypes.node]).isRequired},v=function(e){function t(){return n(this,t),i(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments))}return a(t,e),s(t,[{key:"componentDidMount",value:function(){var e=this.context.ariaManager,t=e.trapFocus,o=e.initialFocus;e.onClickOutside;this._setPopoverNode(),t&&(this._focusTrap=(0,l["default"])((0,u.findDOMNode)(this),{initialFocus:o,escapeDeactivates:!1,clickOutsideDeactivates:!0}).activate())}},{key:"componentWillUnmount",value:function(){this.context.ariaManager.trapFocus&&this._focusTrap.deactivate()}},{key:"componentDidUpdate",value:function(e,t,o){this.context.ariaManager.isPopoverOpen!==o.ariaManager.isPopoverOpen&&this._setPopoverNode()}},{key:"_setPopoverNode",value:function(){this.context.ariaManager.setPopoverNode((0,u.findDOMNode)(this))}},{key:"render",value:function(){var e=this.context.ariaManager,t=e.type,o=e.uuid,r=e.isPopoverOpen,n=this.props,i=n.tag,a=n.children,s={"aria-hidden":!r};"menu"===t?s.role="menu":"modal"===t?s.role="dialog":"alert"===t?s.role="alertdialog":"tooltip"===t&&(s.id=o,s.role="tooltip"),"popover"===t&&(s["aria-labelledby"]=o);var u=(0,d["default"])(s,this.props,y);return"function"==typeof a?a(u):(0,p.createElement)(i,u,a)}}]),t}(p.Component);v.contextTypes={ariaManager:p.PropTypes.object.isRequired},v.propTypes=y,v.defaultProps={tag:"div"},t["default"]=v,e.exports=t["default"]},function(e,t){e.exports=i},function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var o=0;o<t.length;o++){var r=t[o];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,o,r){return o&&e(t.prototype,o),r&&e(t,r),t}}(),p=o(2),u=(r(p),o(9)),c=(r(u),o(7)),l=r(c),f={tag:p.PropTypes.string,children:p.PropTypes.oneOfType([p.PropTypes.func,p.PropTypes.node]).isRequired},d=function(e){function t(){var e,o,r,a;n(this,t);for(var s=arguments.length,p=Array(s),u=0;u<s;u++)p[u]=arguments[u];return o=r=i(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(p))),r._handleKeyDown=function(e){var t=r.props.onKeyDown;[" ","Enter"].indexOf(e.key)>-1&&r.context.ariaManager.onItemSelection(r._member,e),t&&t(e)},a=o,i(r,a)}return a(t,e),s(t,[{key:"componentDidMount",value:function(){this._member={type:"item",node:(0,u.findDOMNode)(this),text:this.props.text},this.context.ariaManager.addMember(this._member)}},{key:"componentWillUnmount",value:function(){this.context.ariaManager.removeMember(this._member)}},{key:"render",value:function(){var e=this.props,t=e.tag,o=e.children,r=(0,l["default"])({role:"menuitem",tabIndex:-1,onKeyDown:this._handleKeyDown},this.props,f);return"function"==typeof o?o(r):(0,p.createElement)(t,r,o)}}]),t}(p.Component);d.contextTypes={ariaManager:p.PropTypes.object.isRequired},d.propTypes=f,d.defaultProps={tag:"div"},t["default"]=d,e.exports=t["default"]},function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var o=0;o<t.length;o++){var r=t[o];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,o,r){return o&&e(t.prototype,o),r&&e(t,r),t}}(),p=o(2),u=(r(p),o(7)),c=r(u),l={tag:p.PropTypes.string,children:p.PropTypes.oneOfType([p.PropTypes.func,p.PropTypes.node]).isRequired},f=function(e){function t(){return n(this,t),i(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments))}return a(t,e),s(t,[{key:"render",value:function(){var e=this.context.ariaManager.type,t=this.props,o=t.tag,r=t.children,n={role:"tablist"};"accordion"===e&&(n["aria-multiselectable"]=!0);var i=(0,c["default"])(n,this.props,l);return"function"==typeof r?r(i):(0,p.createElement)(o,i,r)}}]),t}(p.Component);f.contextTypes={ariaManager:p.PropTypes.object.isRequired},f.propTypes=l,f.defaultProps={tag:"div"},t["default"]=f,e.exports=t["default"]},function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var o=0;o<t.length;o++){var r=t[o];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,o,r){return o&&e(t.prototype,o),r&&e(t,r),t}}(),p=o(2),u=(r(p),o(9)),c=(r(u),o(7)),l=r(c),f={tag:p.PropTypes.string,id:p.PropTypes.oneOfType([p.PropTypes.string,p.PropTypes.number]).isRequired,isActive:p.PropTypes.bool,children:p.PropTypes.oneOfType([p.PropTypes.func,p.PropTypes.node]).isRequired},d=function(e){function t(){var e,o,r,a;n(this,t);for(var s=arguments.length,p=Array(s),u=0;u<s;u++)p[u]=arguments[u];return o=r=i(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(p))),r.state={isActive:!1},r._setActiveState=function(e){r.setState({isActive:e})},r._toggleActiveState=function(){r.setState({isActive:!r.state.isActive})},r._handleKeyDown=function(e){var t=r.context.ariaManager,o=t.type,n=t.activateTab,i=r.props,a=i.id,s=i.onKeyDown;"accordion"===o&&[" ","Enter"].indexOf(e.key)>-1&&n(a),s&&s(e)},r._handleFocus=function(e){var t=r.context.ariaManager,o=t.type,n=t.activateTab,i=r.props,a=i.id,s=i.onFocus;"tabs"===o&&n(a),s&&s(e)},a=o,i(r,a)}return a(t,e),s(t,[{key:"componentDidMount",value:function(){this._member={type:"tab",id:this.props.id,node:(0,u.findDOMNode)(this),text:this.props.text,setActiveState:this._setActiveState,toggleActiveState:this._toggleActiveState},this.context.ariaManager.addMember(this._member)}},{key:"componentWillUnmount",value:function(){this.context.ariaManager.removeMember(this._member)}},{key:"render",value:function(){var e=this.context.ariaManager.type,t=this.props,o=t.tag,r=t.id,n=t.disabled,i=t.children,a=void 0!==this.props.isActive?this.props.isActive:this.state.isActive,s={id:r,role:"tab",tabIndex:"accordion"===e?0:a?0:-1,"aria-selected":a,"aria-controls":r+"-panel","aria-disabled":n,onKeyDown:this._handleKeyDown,onFocus:this._handleFocus};"accordion"===e&&(s["aria-expanded"]=a);var u=(0,l["default"])(s,this.props,f);return"function"==typeof i?i(u,a):(0,p.createElement)(o,u,i)}}]),t}(p.Component);d.contextTypes={ariaManager:p.PropTypes.object.isRequired},d.propTypes=f,d.defaultProps={tag:"div"},t["default"]=d,e.exports=t["default"]},function(e,t,o){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var r in o)Object.prototype.hasOwnProperty.call(o,r)&&(e[r]=o[r])}return e},p=function(){function e(e,t){for(var o=0;o<t.length;o++){var r=t[o];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,o,r){return o&&e(t.prototype,o),r&&e(t,r),t}}(),u=o(2),c=(r(u),o(9)),l=(r(c),o(7)),f=r(l),d={tag:u.PropTypes.string,controlledBy:u.PropTypes.oneOfType([u.PropTypes.string,u.PropTypes.number]).isRequired,isActive:u.PropTypes.bool,children:u.PropTypes.oneOfType([u.PropTypes.func,u.PropTypes.node]).isRequired},y=function(e){function t(){var e,o,r,a;n(this,t);for(var s=arguments.length,p=Array(s),u=0;u<s;u++)p[u]=arguments[u];return o=r=i(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(p))),r.state={isActive:!1},r._setActiveState=function(e){r.setState({isActive:e})},r._toggleActiveState=function(){r.setState({isActive:!r.state.isActive})},r._handleKeyDown=function(e){e.ctrlKey&&"ArrowUp"===e.key&&r.context.ariaManager.focusTab(r.props.controlledBy),r.props.onKeyDown&&r.props.onKeyDown(e)},a=o,i(r,a)}return a(t,e),p(t,[{key:"componentDidMount",value:function(){this.context.ariaManager.addPanel({controlledBy:this.props.controlledBy,node:(0,c.findDOMNode)(this),setActiveState:this._setActiveState,toggleActiveState:this._toggleActiveState})}},{key:"render",value:function(){var e=this.props,t=e.tag,o=e.controlledBy,r=(e.disabled,e.children),n=void 0!==this.props.isActive?this.props.isActive:this.state.isActive,i={id:o+"-panel",role:"tabpanel","aria-hidden":!n,"aria-labelledby":o,onKeyDown:this._handleKeyDown};n||(i.style=s({display:"none"},this.props.style));var a=(0,f["default"])(i,this.props,d);return"function"==typeof r?r(a,n):(0,u.createElement)(t,a,r)}}]),t}(u.Component);y.contextTypes={ariaManager:u.PropTypes.object.isRequired},y.propTypes=d,y.defaultProps={tag:"div"},t["default"]=y,e.exports=t["default"]}])});

lib/AriaItem.js

 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
+Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
 var _react = require('react');
@@ -29,2 +21,10 @@
 
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
 var checkedProps = {
@@ -35,9 +35,27 @@ tag: _react.PropTypes.string,
 
-var AriaItem = (function (_Component) {
+var AriaItem = function (_Component) {
   _inherits(AriaItem, _Component);
 
   function AriaItem() {
+    var _ref;
+
+    var _temp, _this, _ret;
+
     _classCallCheck(this, AriaItem);
 
-    _get(Object.getPrototypeOf(AriaItem.prototype), 'constructor', this).apply(this, arguments);
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = AriaItem.__proto__ || Object.getPrototypeOf(AriaItem)).call.apply(_ref, [this].concat(args))), _this), _this._handleKeyDown = function (e) {
+      var onKeyDown = _this.props.onKeyDown;
+
+
+      if ([' ', 'Enter'].indexOf(e.key) > -1) {
+        _this.context.ariaManager.onItemSelection(_this._member, e);
+      }
+      if (onKeyDown) {
+        onKeyDown(e);
+      }
+    }, _temp), _possibleConstructorReturn(_this, _ret);
   }
@@ -48,8 +66,8 @@
     value: function componentDidMount() {
-      this._node = (0, _reactDom.findDOMNode)(this);
-
-      this.context.ariaManager.addItem({
-        node: this._node,
+      this._member = {
+        type: 'item',
+        node: (0, _reactDom.findDOMNode)(this),
         text: this.props.text
-      });
+      };
+      this.context.ariaManager.addMember(this._member);
     }
@@ -59,3 +77,3 @@ }, {
     value: function componentWillUnmount() {
-      this.context.ariaManager.removeItem(this._node);
+      this.context.ariaManager.removeMember(this._member);
     }
@@ -69,5 +87,6 @@ }, {
 
-      var props = (0, _specialAssign2['default'])({
+      var props = (0, _specialAssign2.default)({
         role: 'menuitem',
-        tabIndex: -1
+        tabIndex: -1,
+        onKeyDown: this._handleKeyDown
       }, this.props, checkedProps);
@@ -81,24 +100,15 @@
     }
-  }], [{
-    key: 'contextTypes',
-    value: {
-      ariaManager: _react.PropTypes.object.isRequired
-    },
-    enumerable: true
-  }, {
-    key: 'propTypes',
-    value: checkedProps,
-    enumerable: true
-  }, {
-    key: 'defaultProps',
-    value: {
-      tag: 'div'
-    },
-    enumerable: true
   }]);
 
   return AriaItem;
-})(_react.Component);
+}(_react.Component);
 
-exports['default'] = AriaItem;
+AriaItem.contextTypes = {
+  ariaManager: _react.PropTypes.object.isRequired
+};
+AriaItem.propTypes = checkedProps;
+AriaItem.defaultProps = {
+  tag: 'div'
+};
+exports.default = AriaItem;
 module.exports = exports['default'];

lib/AriaManager.js

 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
+Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
-var _get = function get(_x3, _x4, _x5) { var _again = true; _function: while (_again) { var object = _x3, property = _x4, receiver = _x5; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x3 = parent; _x4 = property; _x5 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
 var _react = require('react');
@@ -25,2 +17,6 @@
 
+var _noScroll = require('no-scroll');
+
+var _noScroll2 = _interopRequireDefault(_noScroll);
+
 var _eventsHandler = require('./events-handler');
@@ -34,2 +30,10 @@
 
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
 var isTarget = function isTarget(node, target) {
@@ -42,4 +46,2 @@ return node === target || node.contains(target);
   escape: 27,
-  enter: 13,
-  space: 32,
   end: 35,
@@ -54,4 +56,7 @@ home: 36,
 var checkedProps = {
+  type: _react.PropTypes.oneOf(['menu', 'popover', 'modal', 'tooltip', 'alert', 'tabs', 'accordion']).isRequired,
   tag: _react.PropTypes.string,
   trapFocus: _react.PropTypes.bool,
+  freezeScroll: _react.PropTypes.bool,
+  activeTabId: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.number]),
   children: _react.PropTypes.oneOfType([_react.PropTypes.func, _react.PropTypes.node]).isRequired,
@@ -67,5 +72,7 @@ keybindings: _react.PropTypes.shape({
   stringSearchDelay: _react.PropTypes.number,
+  collapsible: _react.PropTypes.bool,
   openPopoverOn: _react.PropTypes.oneOf(['tap', 'hover']),
   closeOnOutsideClick: _react.PropTypes.bool,
   closeOnItemSelection: _react.PropTypes.bool,
+  accordion: _react.PropTypes.bool,
   onPopoverOpen: _react.PropTypes.func,
@@ -76,94 +83,87 @@ onPopoverClose: _react.PropTypes.func,
 
-var AriaManager = (function (_Component) {
+var AriaManager = function (_Component) {
   _inherits(AriaManager, _Component);
 
-  _createClass(AriaManager, null, [{
-    key: 'childContextTypes',
-    value: {
-      ariaManager: _react.PropTypes.object.isRequired
-    },
-    enumerable: true
-  }, {
-    key: 'propTypes',
-    value: checkedProps,
-    enumerable: true
-  }, {
-    key: 'defaultProps',
-    value: {
-      tag: 'div',
-      trapFocus: false,
-      keybindings: {
-        next: [{ keyCode: KEYS.arrowDown }, { keyCode: KEYS.arrowRight }],
-        prev: [{ keyCode: KEYS.arrowUp }, { keyCode: KEYS.arrowLeft }],
-        first: { keyCode: KEYS.home },
-        last: { keyCode: KEYS.end }
-      },
-      wrap: true,
-      stringSearch: true,
-      stringSearchDelay: 600,
-      openPopoverOn: 'tap',
-      closeOnOutsideClick: true,
-      closeOnItemSelection: true,
-      onPopoverOpen: function onPopoverOpen() {
-        return null;
-      },
-      onPopoverClose: function onPopoverClose() {
-        return null;
-      },
-      onItemSelection: function onItemSelection() {
-        return null;
-      }
-    },
-    enumerable: true
-  }]);
-
   function AriaManager(props) {
-    var _this = this;
-
     _classCallCheck(this, AriaManager);
 
-    _get(Object.getPrototypeOf(AriaManager.prototype), 'constructor', this).call(this, props);
+    var _this = _possibleConstructorReturn(this, (AriaManager.__proto__ || Object.getPrototypeOf(AriaManager)).call(this, props));
 
-    this._setToggleNode = function (node) {
+    _this._onItemSelection = function (item, e) {
+      var value = item.value || item.node.innerHTML;
+
+      if (_this.props.closeOnItemSelection) {
+        _this.closePopover();
+      }
+
+      _this.props.onItemSelection(value, e);
+    };
+
+    _this._setToggleNode = function (node) {
       _this._toggle = node;
     };
 
-    this._setPopoverNode = function (node) {
+    _this._setPopoverNode = function (node) {
       _this._popover = node;
     };
 
-    this._addItem = function (item) {
-      _this._items.push(item);
-      _this._focusGroup.addMember(item);
+    _this._addMember = function (member) {
+      var activeTabId = _this.props.activeTabId;
+      var id = member.id;
+      var index = member.index;
+      var node = member.node;
+      var text = member.text;
+
+
+      if (index === undefined) {
+        _this._members.push(member);
+      } else {
+        _this._members.splice(index, 0, member);
+      }
+
+      _this._focusGroup.addMember({
+        node: node,
+        text: text || node.innerHTML
+      });
+
+      if (member.type === 'tab') {
+        if (activeTabId === id) {
+          _this._activateTab(activeTabId, true, false);
+        } else {
+          _this._handleFirstTabSelection(id);
+        }
+      }
     };
 
-    this._removeItem = function (item) {
-      var pos = _this._items.indexOf(item);
+    _this._removeMember = function (member) {
+      var pos = _this._members.indexOf(member);
+
       if (pos > -1) {
-        _this._items.splice(pos, 1);
+        _this._members.splice(member, 1);
+        _this._focusGroup.removeMember(member.node);
       }
-      _this._focusGroup.removeMember(item);
     };
 
-    this._clearItems = function () {
-      _this._focusGroup.clearMembers();
-    };
-
-    this._focusItem = function (index) {
+    _this._focusItem = function (index) {
       _this._focusGroup.focusNodeAtIndex(index);
     };
 
-    this._openPopover = function () {
-      var focusPopover = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0];
+    _this.openPopover = function () {
+      var focusFirstMember = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+      var _this$props = _this.props;
+      var freezeScroll = _this$props.freezeScroll;
+      var onPopoverOpen = _this$props.onPopoverOpen;
 
-      if (_this.state.isOpen) return;
 
-      _this.setState({ isOpen: true });
+      if (_this.state.isPopoverOpen) return;
 
-      _this.props.onPopoverOpen();
+      _this.setState({ isPopoverOpen: true });
 
-      _this._focusGroup.activate();
+      if (freezeScroll) {
+        _noScroll2.default.on();
+      }
 
-      if (focusPopover) {
-        // setTimeout allows animated popovers to still focus
+      onPopoverOpen();
+
+      if (focusFirstMember) {
         setTimeout(function () {
@@ -175,33 +175,115 @@ _this._focusItem(0);
 
-    this._closePopover = function () {
-      var focusToggle = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0];
+    _this.closePopover = function () {
+      var focusToggle = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+      var _this$props2 = _this.props;
+      var freezeScroll = _this$props2.freezeScroll;
+      var onPopoverClose = _this$props2.onPopoverClose;
 
-      if (!_this.state.isOpen) return;
 
-      _this.setState({ isOpen: false });
+      if (!_this.state.isPopoverOpen) return;
 
-      _this.props.onPopoverClose();
+      _this.setState({ isPopoverOpen: false });
 
-      _this._focusGroup.deactivate();
+      if (freezeScroll) {
+        _noScroll2.default.off();
+      }
 
+      onPopoverClose();
+
       if (focusToggle) {
-        _this._toggle.focus();
+        setTimeout(function () {
+          _this._toggle.focus();
+        }, 60);
       }
     };
 
-    this._togglePopover = function (focus) {
-      if (!_this.state.isOpen) {
-        _this._openPopover(focus);
+    _this.togglePopover = function (focus) {
+      if (!_this.state.isPopoverOpen) {
+        _this.openPopover(focus);
       } else {
-        _this._closePopover(focus);
+        _this.closePopover(focus);
       }
     };
 
-    this.state = {
-      isOpen: false
+    _this._addPanel = function (panel) {
+      var activeTabId = _this.props.activeTabId;
+      var controlledBy = panel.controlledBy;
+
+
+      _this._panels.push(panel);
+
+      if (activeTabId === controlledBy) {
+        _this._activateTab(activeTabId, true, false);
+      } else {
+        _this._handleFirstTabSelection(panel.controlledBy);
+      }
     };
-    this._focusGroup = (0, _focusGroup2['default'])(props);
-    this._toggle = null;
-    this._popover = null;
-    this._items = [];
+
+    _this._focusTab = function (id) {
+      var tabToFocus = _this._members.filter(function (tab) {
+        return tab.id === id;
+      });
+      if (tabToFocus) {
+        tabToFocus.node.focus();
+      }
+    };
+
+    _this._activateTab = function (id, forceActivate) {
+      var shouldChange = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+      var _this$props3 = _this.props;
+      var type = _this$props3.type;
+      var onChange = _this$props3.onChange;
+
+
+      if (type === 'tabs') {
+        if (id === _this._activeTabId && !forceActivate) {
+          return;
+        } else {
+          _this._activeTabId = id;
+        }
+      }
+
+      // shouldChange makes sure we don't fire callbacks when we don't need to
+      if (shouldChange && typeof onChange === 'function') {
+        onChange(id);
+
+        // if onChange is being used we don't need to go any farther since the
+        // user is now controlling state
+        return;
+      }
+
+      for (var i = _this._members.length; i--;) {
+        var tab = _this._members[i];
+        if (type === 'accordion') {
+          if (tab.id === id) {
+            tab.toggleActiveState();
+          }
+        } else {
+          tab.setActiveState(id === tab.id);
+        }
+      }
+      for (var _i = _this._panels.length; _i--;) {
+        var panel = _this._panels[_i];
+        if (type === 'accordion') {
+          if (panel.controlledBy === id) {
+            panel.toggleActiveState();
+          }
+        } else {
+          panel.setActiveState(id === panel.controlledBy);
+        }
+      }
+    };
+
+    _this.state = {
+      isPopoverOpen: false
+    };
+
+    _this._focusGroup = (0, _focusGroup2.default)(props);
+    _this._toggle = null;
+    _this._popover = null;
+    _this._members = [];
+    _this._panels = [];
+    _this._activeTabId = props.activeTabId;
+    _this._uuid = 'RA' + Math.abs(~~(Math.random() * new Date()));
+    return _this;
   }
@@ -214,15 +296,18 @@
         ariaManager: {
+          uuid: this._uuid,
+          type: this.props.type,
           trapFocus: this.props.trapFocus,
           initialFocus: this.props.initialFocus,
-          isOpen: this.state.isOpen,
+          isPopoverOpen: this.state.isPopoverOpen,
           onItemSelection: this._onItemSelection,
           setToggleNode: this._setToggleNode,
           setPopoverNode: this._setPopoverNode,
-          addItem: this._addItem,
-          removeItem: this._removeItem,
-          clearItems: this._clearItems,
+          addMember: this._addMember,
+          addPanel: this._addPanel,
+          removeMember: this._removeMember,
+          activateTab: this._activateTab,
           focusItem: this._focusItem,
-          openPopover: this._openPopover,
-          closePopover: this._closePopover,
-          togglePopover: this._togglePopover
+          openPopover: this.openPopover,
+          closePopover: this.closePopover,
+          togglePopover: this.togglePopover
         }
@@ -234,3 +319,4 @@ };
     value: function componentWillMount() {
-      _eventsHandler2['default'].add(this, this.props.openPopoverOn);
+      this._focusGroup.activate();
+      _eventsHandler2.default.add(this);
     }
@@ -241,7 +327,3 @@ }, {
       this._focusGroup.deactivate();
-      this._toggle = null;
-      this._popover = null;
-      this._items = [];
-
-      _eventsHandler2['default'].remove(this);
+      _eventsHandler2.default.remove(this);
     }
@@ -270,18 +352,28 @@ }, {
 
-      var toggleDisabled = this._toggle.getAttribute('disabled');
 
-      if (isTarget(this._toggle, target) && toggleDisabled === null) {
-        if (openPopoverOn === 'tap') {
-          this._togglePopover(false);
-        } else {
-          this._openPopover(false);
+      if (this._toggle) {
+        var toggleDisabled = this._toggle.getAttribute('disabled');
+
+        if (isTarget(this._toggle, target) && toggleDisabled === null) {
+          if (openPopoverOn === 'tap') {
+            this.togglePopover(false);
+          } else {
+            this.openPopover(false);
+          }
+          return;
+        } else if (closeOnOutsideClick && this._popover && !isTarget(this._popover, target)) {
+          this.closePopover(false);
+          return;
         }
-      } else if (closeOnOutsideClick && this._popover && !isTarget(this._popover, target)) {
-        this._closePopover(false);
-      } else {
-        for (var i = this._items.length; i--;) {
-          var item = this._items[i];
-          if (item.node === target) {
-            this._onItemSelection(item, e);
+      }
+
+      for (var i = this._members.length; i--;) {
+        var member = this._members[i];
+        if (member.node === target) {
+          if (member.type === 'item') {
+            this._onItemSelection(member, e);
+          } else {
+            this._activateTab(member.id);
           }
+          return;
         }
@@ -292,38 +384,19 @@ }
     key: '_onKeyDown',
-    value: function _onKeyDown(e) {
-      var keyCode = e.keyCode;
-      var target = e.target;
+    value: function _onKeyDown(_ref) {
+      var keyCode = _ref.keyCode;
 
-      if (this.state.isOpen) {
+      if (this.state.isPopoverOpen) {
         if (!this.props.trapFocus && keyCode === KEYS.tab) {
-          this._closePopover(false);
+          this.closePopover(false);
         } else if (keyCode === KEYS.escape) {
-          e.preventDefault();
-          this._closePopover();
-        } else if ([KEYS.enter, KEYS.space].indexOf(keyCode) > -1) {
-          for (var i = this._items.length; i--;) {
-            var item = this._items[i];
-            if (item.node === target) {
-              e.preventDefault();
-              this._onItemSelection(item, e);
-            }
-          }
+          this.closePopover();
         }
-      } else if ([KEYS.arrowUp, KEYS.arrowDown, KEYS.enter, KEYS.space].indexOf(keyCode) > -1) {
-        if (isTarget(this._toggle, target)) {
-          e.preventDefault();
-          this._openPopover();
-        }
       }
     }
   }, {
-    key: '_onItemSelection',
-    value: function _onItemSelection(item, e) {
-      var value = item.value || item.node.innerHTML;
-
-      if (this.props.closeOnItemSelection) {
-        this._closePopover();
+    key: '_handleFirstTabSelection',
+    value: function _handleFirstTabSelection(id) {
+      if (this.props.type === 'tabs' && !this._activeTabId || id === this._activeTabId) {
+        this._activateTab(id, true, false);
       }
-
-      this.props.onItemSelection(value, e);
     }
@@ -337,6 +410,6 @@ }, {
 
-      var props = (0, _specialAssign2['default'])({}, this.props, checkedProps);
+      var props = (0, _specialAssign2.default)({}, this.props, checkedProps);
 
       if (typeof children === 'function') {
-        return children(this.state.isOpen);
+        return children(this.state.isPopoverOpen);
       }
@@ -349,5 +422,36 @@
   return AriaManager;
-})(_react.Component);
+}(_react.Component);
 
-exports['default'] = AriaManager;
+AriaManager.childContextTypes = {
+  ariaManager: _react.PropTypes.object.isRequired
+};
+AriaManager.propTypes = checkedProps;
+AriaManager.defaultProps = {
+  tag: 'div',
+  trapFocus: false,
+  freezeScroll: false,
+  keybindings: {
+    next: [{ keyCode: KEYS.arrowDown }, { keyCode: KEYS.arrowRight }],
+    prev: [{ keyCode: KEYS.arrowUp }, { keyCode: KEYS.arrowLeft }],
+    first: { keyCode: KEYS.home },
+    last: { keyCode: KEYS.end }
+  },
+  wrap: true,
+  stringSearch: true,
+  stringSearchDelay: 600,
+  collapsible: false,
+  openPopoverOn: 'tap',
+  closeOnOutsideClick: true,
+  closeOnItemSelection: true,
+  onPopoverOpen: function onPopoverOpen() {
+    return null;
+  },
+  onPopoverClose: function onPopoverClose() {
+    return null;
+  },
+  onItemSelection: function onItemSelection() {
+    return null;
+  }
+};
+exports.default = AriaManager;
 module.exports = exports['default'];

lib/AriaPopover.js

 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
+Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
 var _react = require('react');
@@ -33,2 +25,10 @@
 
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
 var checkedProps = {
@@ -39,3 +39,3 @@ tag: _react.PropTypes.string,
 
-var AriaPopover = (function (_Component) {
+var AriaPopover = function (_Component) {
   _inherits(AriaPopover, _Component);
@@ -46,3 +46,3 @@
 
-    _get(Object.getPrototypeOf(AriaPopover.prototype), 'constructor', this).apply(this, arguments);
+    return _possibleConstructorReturn(this, (AriaPopover.__proto__ || Object.getPrototypeOf(AriaPopover)).apply(this, arguments));
   }
@@ -58,6 +58,7 @@
 
+
       this._setPopoverNode();
 
       if (trapFocus) {
-        this._focusTrap = (0, _focusTrap2['default'])((0, _reactDom.findDOMNode)(this), {
+        this._focusTrap = (0, _focusTrap2.default)((0, _reactDom.findDOMNode)(this), {
           initialFocus: initialFocus,
@@ -79,3 +80,3 @@ escapeDeactivates: false,
     value: function componentDidUpdate(lastProps, lastState, lastContext) {
-      if (this.context.ariaManager.isOpen !== lastContext.ariaManager.isOpen) {
+      if (this.context.ariaManager.isPopoverOpen !== lastContext.ariaManager.isPopoverOpen) {
         this._setPopoverNode();
@@ -92,2 +93,6 @@ }
     value: function render() {
+      var _context$ariaManager2 = this.context.ariaManager;
+      var type = _context$ariaManager2.type;
+      var uuid = _context$ariaManager2.uuid;
+      var isPopoverOpen = _context$ariaManager2.isPopoverOpen;
       var _props = this.props;
@@ -97,4 +102,23 @@ var tag = _props.tag;
 
-      var props = (0, _specialAssign2['default'])({}, this.props, checkedProps);
+      var componentProps = {
+        'aria-hidden': !isPopoverOpen
+      };
 
+      if (type === 'menu') {
+        componentProps['role'] = 'menu';
+      } else if (type === 'modal') {
+        componentProps['role'] = 'dialog';
+      } else if (type === 'alert') {
+        componentProps['role'] = 'alertdialog';
+      } else if (type === 'tooltip') {
+        componentProps['id'] = uuid;
+        componentProps['role'] = 'tooltip';
+      }
+
+      if (type === 'popover') {
+        componentProps['aria-labelledby'] = uuid;
+      }
+
+      var props = (0, _specialAssign2.default)(componentProps, this.props, checkedProps);
+
       if (typeof children === 'function') {
@@ -106,24 +130,15 @@ return children(props);
     }
-  }], [{
-    key: 'contextTypes',
-    value: {
-      ariaManager: _react.PropTypes.object.isRequired
-    },
-    enumerable: true
-  }, {
-    key: 'propTypes',
-    value: checkedProps,
-    enumerable: true
-  }, {
-    key: 'defaultProps',
-    value: {
-      tag: 'div'
-    },
-    enumerable: true
   }]);
 
   return AriaPopover;
-})(_react.Component);
+}(_react.Component);
 
-exports['default'] = AriaPopover;
+AriaPopover.contextTypes = {
+  ariaManager: _react.PropTypes.object.isRequired
+};
+AriaPopover.propTypes = checkedProps;
+AriaPopover.defaultProps = {
+  tag: 'div'
+};
+exports.default = AriaPopover;
 module.exports = exports['default'];

lib/AriaToggle.js

 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
+Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
 var _react = require('react');
@@ -29,2 +21,10 @@
 
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
 var checkedProps = {
@@ -35,9 +35,28 @@ tag: _react.PropTypes.string,
 
-var AriaToggle = (function (_Component) {
+var AriaToggle = function (_Component) {
   _inherits(AriaToggle, _Component);
 
   function AriaToggle() {
+    var _ref;
+
+    var _temp, _this, _ret;
+
     _classCallCheck(this, AriaToggle);
 
-    _get(Object.getPrototypeOf(AriaToggle.prototype), 'constructor', this).apply(this, arguments);
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = AriaToggle.__proto__ || Object.getPrototypeOf(AriaToggle)).call.apply(_ref, [this].concat(args))), _this), _this._handleKeyDown = function (e) {
+      if (['ArrowUp', 'ArrowDown', ' '].indexOf(e.key) > -1 || _this.props.tag !== 'button' && e.key === 'Enter') {
+        if (!_this.context.ariaManager.isPopoverOpen) {
+          _this.context.ariaManager.openPopover();
+        } else {
+          _this.context.ariaManager.focusItem(0);
+        }
+      }
+      if (_this.props.onKeyDown) {
+        _this.props.onKeyDown(e);
+      }
+    }, _temp), _possibleConstructorReturn(_this, _ret);
   }
@@ -53,2 +72,6 @@
     value: function render() {
+      var _context$ariaManager = this.context.ariaManager;
+      var type = _context$ariaManager.type;
+      var uuid = _context$ariaManager.uuid;
+      var isPopoverOpen = _context$ariaManager.isPopoverOpen;
       var _props = this.props;
@@ -59,10 +82,21 @@ var tag = _props.tag;
 
-      var props = (0, _specialAssign2['default'])({
+      var componentProps = {
         role: 'button',
-        tabIndex: disabled ? '' : '0',
+        tabIndex: disabled ? '' : 0,
         'aria-haspopup': true,
-        'aria-expanded': this.context.ariaManager.isOpen,
-        'aria-disabled': disabled
-      }, this.props, checkedProps);
+        'aria-expanded': isPopoverOpen,
+        'aria-disabled': disabled,
+        onKeyDown: this._handleKeyDown
+      };
 
+      if (type === 'popover') {
+        componentProps['id'] = uuid;
+      }
+
+      if (type === 'tooltip') {
+        componentProps['aria-describedby'] = uuid;
+      }
+
+      var props = (0, _specialAssign2.default)(componentProps, this.props, checkedProps);
+
       if (typeof children === 'function') {
@@ -74,24 +108,15 @@ return children(props);
     }
-  }], [{
-    key: 'contextTypes',
-    value: {
-      ariaManager: _react.PropTypes.object.isRequired
-    },
-    enumerable: true
-  }, {
-    key: 'propTypes',
-    value: checkedProps,
-    enumerable: true
-  }, {
-    key: 'defaultProps',
-    value: {
-      tag: 'button'
-    },
-    enumerable: true
   }]);
 
   return AriaToggle;
-})(_react.Component);
+}(_react.Component);
 
-exports['default'] = AriaToggle;
+AriaToggle.contextTypes = {
+  ariaManager: _react.PropTypes.object.isRequired
+};
+AriaToggle.propTypes = checkedProps;
+AriaToggle.defaultProps = {
+  tag: 'button'
+};
+exports.default = AriaToggle;
 module.exports = exports['default'];

lib/events-handler.js

 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
+Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
 var _teenyTap = require('teeny-tap');
@@ -13,3 +11,5 @@
 
-exports['default'] = {
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+exports.default = {
   _queue: [],
@@ -40,3 +40,3 @@
   _attachListeners: function _attachListeners() {
-    this._tapListener = (0, _teenyTap2['default'])(document.documentElement, this._documentEvent.bind(this, '_onTap'));
+    this._tapListener = (0, _teenyTap2.default)(document.documentElement, this._documentEvent.bind(this, '_onTap'));
     document.addEventListener('mouseover', this._documentEvent.bind(this, '_onHover'));
@@ -43,0 +43,0 @@ document.addEventListener('keydown', this._documentEvent.bind(this, '_onKeyDown'));

lib/react-aria.js

 'use strict';
 
-Object.defineProperty(exports, '__esModule', {
+Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.AriaPanel = exports.AriaTab = exports.AriaTabList = exports.AriaItem = exports.AriaPopover = exports.AriaToggle = exports.AriaManager = undefined;
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
 var _AriaManager2 = require('./AriaManager');
@@ -13,4 +12,2 @@
 
-exports.AriaManager = _AriaManager3['default'];
-
 var _AriaToggle2 = require('./AriaToggle');
@@ -20,4 +17,2 @@
 
-exports.AriaToggle = _AriaToggle3['default'];
-
 var _AriaPopover2 = require('./AriaPopover');
@@ -27,4 +22,2 @@
 
-exports.AriaPopover = _AriaPopover3['default'];
-
 var _AriaItem2 = require('./AriaItem');
@@ -34,2 +27,34 @@
 
-exports.AriaItem = _AriaItem3['default'];
+var _AriaTabList2 = require('./AriaTabList');
+
+var _AriaTabList3 = _interopRequireDefault(_AriaTabList2);
+
+var _AriaTab2 = require('./AriaTab');
+
+var _AriaTab3 = _interopRequireDefault(_AriaTab2);
+
+var _AriaPanel2 = require('./AriaPanel');
+
+var _AriaPanel3 = _interopRequireDefault(_AriaPanel2);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+exports.AriaManager = _AriaManager3.default;
+exports.AriaToggle = _AriaToggle3.default;
+exports.AriaPopover = _AriaPopover3.default;
+exports.AriaItem = _AriaItem3.default;
+exports.AriaTabList = _AriaTabList3.default;
+exports.AriaTab = _AriaTab3.default;
+exports.AriaPanel = _AriaPanel3.default;
+
+// rename
+// export Manager from './Manager'
+// export Toggle from './Toggle'
+// export Popover from './Popover'
+// export Item from './Item'
+// export TabList from './TabList'
+// export Tab from './Tab'
+// export Panel from './Panel'
+
+// usage
+// <Aria.Manager/> || <Manager/>

lib/special-assign.js

@@ -6,4 +6,3 @@ "use strict";
 });
-exports["default"] = specialAssign;
-
+exports.default = specialAssign;
 function specialAssign(a, b, reserved) {
@@ -16,3 +15,2 @@ for (var x in b) {
 }
-
 module.exports = exports["default"];

package.json

 {
   "name": "react-aria",
-  "version": "0.2.0",
+  "version": "0.4.0",
   "description": "Utilities to help create React ARIA components.",
   "main": "lib/react-aria.js",
+  "files": [
+    "dist",
+    "lib"
+  ],
   "scripts": {
+    "build:lib": "babel src --out-dir lib",
     "build": "npm run build:lib && NODE_ENV=production webpack --config webpack.prod.config.js",
-    "build:lib": "babel src --out-dir lib --stage 0",
-    "dev": "webpack-dev-server --devtool eval --hot --progress --colors",
+    "dev": "webpack-dev-server --inline --hot --progress --colors --host 0.0.0.0 --devtool eval",
+    "postbuild": "NODE_ENV=production TARGET=minify webpack --config webpack.prod.config.js",
     "prebuild": "rm -rf dist && mkdir dist",
     "prepublish": "npm run build",
-    "postbuild": "NODE_ENV=production TARGET=minify webpack --config webpack.prod.config.js",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "deploy": "NODE_ENV=production TARGET=minify webpack && git-directory-deploy --directory example --branch gh-pages"
   },
@@ -26,2 +30,3 @@ "repository": {
     "accessible",
+    "accordion",
     "dialog",
@@ -32,2 +37,4 @@ "dropdown",
     "popover",
+    "tabs",
+    "tab-panel",
     "widget"
@@ -46,26 +53,35 @@ ],
   "dependencies": {
-    "focus-group": "^0.3.0",
-    "focus-trap": "^2.0.1",
+    "focus-group": "^0.3.1",
+    "focus-trap": "^2.1.0",
+    "no-scroll": "^2.0.0",
     "teeny-tap": "^0.2.0"
   },
   "devDependencies": {
-    "babel": "^5.8.23",
-    "babel-core": "^5.6.15",
-    "babel-loader": "^5.2.2",
-    "babel-plugin-object-assign": "^1.2.0",
-    "css-loader": "^0.15.1",
-    "http-server": "^0.8.0",
-    "lodash": "^3.10.0",
-    "node-libs-browser": "^0.5.2",
+    "babel-cli": "^6.16.0",
+    "babel-core": "^6.17.0",
+    "babel-loader": "^6.2.5",
+    "babel-plugin-add-module-exports": "^0.2.1",
+    "babel-preset-es2015": "^6.16.0",
+    "babel-preset-react": "^6.16.0",
+    "babel-preset-stage-0": "^6.16.0",
+    "chokidar": "^1.6.1",
+    "css-loader": "^0.25.0",
+    "git-directory-deploy": "^1.5.1",
+    "http-server": "^0.9.0",
+    "node-libs-browser": "^1.0.0",
     "node-sass": "^3.2.0",
-    "react": "15.2.1",
+    "postcss-loader": "^0.13.0",
+    "react": "15.3.2",
     "react-a11y": "^0.3.3",
-    "react-dom": "15.2.1",
-    "react-motion": "^0.4.4",
-    "react-motion-ui-pack": "^0.8.0",
-    "sass-loader": "^1.0.2",
-    "style-loader": "^0.12.3",
-    "webpack": "^1.9.12",
+    "react-dom": "15.3.2",
+    "react-hot-loader": "^1.3.1",
+    "react-motion": "^0.4.2",
+    "react-motion-ui-pack": "^0.10.2",
+    "react-travel": "^1.1.2",
+    "react-view-pager": "^0.5.0-prerelease.7",
+    "sass-loader": "^4.0.2",
+    "style-loader": "^0.13.1",
+    "webpack": "^1.13.2",
     "webpack-dev-server": "^1.9.0"
   }
 }

README.md

@@ -6,3 +6,3 @@ ## React ARIA
 
-Utilities
+Utilities to help compose ARIA compliant components.
 
@@ -13,3 +13,6 @@ ## Usage
 
-`bower install react-aria --save`
+```html
+<script src="https://unpkg.com/react-aria/dist/react-aria.js"></script>
+(UMD library exposed as `ReactARIA`)
+```
 
@@ -16,0 +19,0 @@ ### Example

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

No tests

Quality

Package does not have any tests. This is a strong signal of a poorly maintained or low quality package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

147919

increased by25.84%

Lines of code

2633

increased by9.21%

Number of low quality alerts

2

decreased by-33.33%

Number of lines in readme file

77

increased by4.05%

Number of low supply chain risk alerts

0

decreased by-100%

Worsened metrics

Dependency count

6

increased by20%

Dev dependency count

26

increased by44.44%

Number of package files

23

decreased by-32.35%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addedno-scroll@^2.0.0

• + Addedno-scroll@2.1.1(transitive)

• Updatedfocus-group@^0.3.1

• Updatedfocus-trap@^2.1.0