Socket
Socket
Sign inDemoInstall

react-aria-menubutton

Package Overview
Dependencies
34
Maintainers
1
Versions
44
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 0.5.0 to 0.5.1

3

CHANGELOG.md
# Changelog
## 0.5.1
- Update build.
## 0.5.0

@@ -4,0 +7,0 @@ - Make class names a little more explicit (change `menuWrapper--trans` to `menuWrapper--transition` and `li` to `menuItemWrapper`).

105

dist-modules/createAriaMenuButton.js

@@ -14,5 +14,5 @@ 'use strict';

var _React = require('react');
var _React$Component$PropTypes = require('react');
var _React2 = _interopRequireWildcard(_React);
var _React$Component$PropTypes2 = _interopRequireWildcard(_React$Component$PropTypes);

@@ -38,10 +38,17 @@ var _import = require('./keys');

var CSSTransitionGroup = opts.reactAddons ? opts.reactAddons.CSSTransitionGroup : false;
_cssClassnamer2['default'].init(opts.componentName, opts.namespace);
var AriaMenuButton = (function (_React$Component) {
function AriaMenuButton(props) {
_classCallCheck(this, AriaMenuButton);
var TransitionGroup = false;
if (opts.transition) {
if (opts.transition.displayName !== 'ReactCSSTransitionGroup') {
throw new Error('createAriaMenuButtons `transition` option expects a ReactCSSTransitionGroup');
}
TransitionGroup = opts.transition;
}
_React$Component.call(this, props);
var MenuButton = (function (_Component) {
function MenuButton(props) {
_classCallCheck(this, MenuButton);
_Component.call(this, props);
this.state = { isOpen: !!props.startOpen };

@@ -51,19 +58,13 @@ this.focusManager = _focusManager2['default']();

_inherits(AriaMenuButton, _React$Component);
_inherits(MenuButton, _Component);
AriaMenuButton.prototype.shouldComponentUpdate = function shouldComponentUpdate(newProps, newState) {
MenuButton.prototype.shouldComponentUpdate = function shouldComponentUpdate(newProps, newState) {
return this.state.isOpen !== newState.isOpen || this.props.selectedValue !== newProps.selectedValue;
};
AriaMenuButton.prototype.componentWillMount = function componentWillMount() {
if (this.props.transition && !CSSTransitionGroup) {
throw new Error('If you want to use transitions with ariaMenuButton, you need to pass it ' + 'React with addons');
}
MenuButton.prototype.componentDidMount = function componentDidMount() {
this.focusManager.trigger = _React$Component$PropTypes2['default'].findDOMNode(this.refs.trigger);
};
AriaMenuButton.prototype.componentDidMount = function componentDidMount() {
this.focusManager.trigger = _React2['default'].findDOMNode(this.refs.trigger);
};
AriaMenuButton.prototype.openMenu = function openMenu() {
MenuButton.prototype.openMenu = function openMenu() {
var innerFocus = arguments[0] === undefined ? false : arguments[0];

@@ -74,3 +75,3 @@

AriaMenuButton.prototype.closeMenu = function closeMenu() {
MenuButton.prototype.closeMenu = function closeMenu() {
var _this = this;

@@ -86,7 +87,7 @@

AriaMenuButton.prototype.toggleMenu = function toggleMenu() {
MenuButton.prototype.toggleMenu = function toggleMenu() {
if (this.state.isOpen) this.closeMenu();else this.openMenu();
};
AriaMenuButton.prototype.handleAnywhereKey = function handleAnywhereKey(e) {
MenuButton.prototype.handleAnywhereKey = function handleAnywhereKey(e) {
var key = e.key;

@@ -117,3 +118,3 @@ var isLetterKey = isLetterKeyEvent(e);

AriaMenuButton.prototype.handleTriggerKey = function handleTriggerKey(e) {
MenuButton.prototype.handleTriggerKey = function handleTriggerKey(e) {
var key = e.key;

@@ -126,3 +127,3 @@ if (key !== keys.ENTER && key !== keys.SPACE) {

AriaMenuButton.prototype.handleMenuKey = function handleMenuKey(e) {
MenuButton.prototype.handleMenuKey = function handleMenuKey(e) {
// "With focus on the drop-down menu, pressing Escape closes

@@ -140,3 +141,3 @@ // the menu and returns focus to the button.

AriaMenuButton.prototype.checkLetterKeys = function checkLetterKeys(kc) {
MenuButton.prototype.checkLetterKeys = function checkLetterKeys(kc) {
// "Typing a letter (printable character) key moves focus to the next

@@ -147,6 +148,6 @@ // instance of a visible node whose title begins with that printable letter."

AriaMenuButton.prototype.handleBlur = function handleBlur() {
MenuButton.prototype.handleBlur = function handleBlur() {
var _this2 = this;
this.blurTimeout = setTimeout(function () {
setTimeout(function () {
var activeEl = document.activeElement;

@@ -161,3 +162,3 @@ if (activeEl === _this2.focusManager.trigger) return;

AriaMenuButton.prototype.handleSelection = function handleSelection(v) {
MenuButton.prototype.handleSelection = function handleSelection(v) {
if (this.props.closeOnSelection) this.closeMenu();

@@ -167,8 +168,7 @@ this.props.handleSelection(v);

AriaMenuButton.prototype.handleOverlayClick = function handleOverlayClick() {
console.log('overlay click triggered');
MenuButton.prototype.handleOverlayClick = function handleOverlayClick() {
this.closeMenu(false);
};
AriaMenuButton.prototype.render = function render() {
MenuButton.prototype.render = function render() {
var props = this.props;

@@ -182,3 +182,3 @@ var isOpen = this.state.isOpen;

var menu = isOpen ? _React2['default'].createElement(_Menu2['default'], _extends({}, props, {
var menu = isOpen ? _React$Component$PropTypes2['default'].createElement(_Menu2['default'], _extends({}, props, {
handleSelection: this.handleSelection.bind(this),

@@ -188,10 +188,10 @@ receiveFocus: this.state.innerFocus,

var menuWrapper = props.transition ? _React2['default'].createElement(
CSSTransitionGroup,
var menuWrapper = TransitionGroup ? _React$Component$PropTypes2['default'].createElement(
TransitionGroup,
{ transitionName: _cssClassnamer2['default'].applyNamespace('is'),
component: 'div',
className: [_cssClassnamer2['default'].componentPart('menuWrapper'), _cssClassnamer2['default'].componentPart('menuWrapper--trans')].join(' '),
className: [_cssClassnamer2['default'].componentPart('menuWrapper'), _cssClassnamer2['default'].componentPart('menuWrapper--transition')].join(' '),
onKeyDown: this.handleMenuKey.bind(this) },
menu
) : _React2['default'].createElement(
) : _React$Component$PropTypes2['default'].createElement(
'div',

@@ -215,3 +215,3 @@ { className: _cssClassnamer2['default'].componentPart('menuWrapper'),

var outsideOverlay = !isOpen ? false : _React2['default'].createElement('div', { id: outsideId,
var outsideOverlay = !isOpen ? false : _React$Component$PropTypes2['default'].createElement('div', { id: outsideId,
onClick: this.handleOverlayClick.bind(this),

@@ -227,3 +227,3 @@ ref: 'overlay',

return _React2['default'].createElement(
return _React$Component$PropTypes2['default'].createElement(
'div',

@@ -235,6 +235,6 @@ { id: props.id,

outsideOverlay,
_React2['default'].createElement(
_React$Component$PropTypes2['default'].createElement(
'div',
{ style: innerStyle },
_React2['default'].createElement(
_React$Component$PropTypes2['default'].createElement(
'div',

@@ -257,20 +257,17 @@ { id: triggerId,

return AriaMenuButton;
})(_React2['default'].Component);
return MenuButton;
})(_React$Component$PropTypes.Component);
var pt = _React2['default'].PropTypes;
AriaMenuButton.propTypes = {
handleSelection: pt.func.isRequired,
items: pt.arrayOf(pt.object).isRequired,
triggerContent: pt.oneOfType([pt.string, pt.element]).isRequired,
closeOnSelection: pt.bool,
flushRight: pt.bool,
id: pt.string,
startOpen: pt.bool,
selectedValue: pt.oneOfType([pt.string, pt.number, pt.bool]),
transition: pt.bool
MenuButton.propTypes = {
handleSelection: _React$Component$PropTypes.PropTypes.func.isRequired,
items: _React$Component$PropTypes.PropTypes.arrayOf(_React$Component$PropTypes.PropTypes.object).isRequired,
triggerContent: _React$Component$PropTypes.PropTypes.oneOfType([_React$Component$PropTypes.PropTypes.string, _React$Component$PropTypes.PropTypes.element]).isRequired,
closeOnSelection: _React$Component$PropTypes.PropTypes.bool,
flushRight: _React$Component$PropTypes.PropTypes.bool,
id: _React$Component$PropTypes.PropTypes.string,
startOpen: _React$Component$PropTypes.PropTypes.bool,
selectedValue: _React$Component$PropTypes.PropTypes.oneOfType([_React$Component$PropTypes.PropTypes.string, _React$Component$PropTypes.PropTypes.number, _React$Component$PropTypes.PropTypes.bool])
};
return AriaMenuButton;
return MenuButton;
}

@@ -277,0 +274,0 @@

@@ -24,3 +24,4 @@ 'use strict';

}
};
module.exports = exports['default'];

@@ -13,5 +13,5 @@ 'use strict';

var _React = require('react');
var _React$Component$PropTypes = require('react');
var _React2 = _interopRequireWildcard(_React);
var _React$Component$PropTypes2 = _interopRequireWildcard(_React$Component$PropTypes);

@@ -26,12 +26,12 @@ var _MenuItem = require('./MenuItem');

var Menu = (function (_React$Component) {
var Menu = (function (_Component) {
function Menu() {
_classCallCheck(this, Menu);
if (_React$Component != null) {
_React$Component.apply(this, arguments);
if (_Component != null) {
_Component.apply(this, arguments);
}
}
_inherits(Menu, _React$Component);
_inherits(Menu, _Component);

@@ -55,8 +55,8 @@ Menu.prototype.shouldComponentUpdate = function shouldComponentUpdate(newProps) {

var items = props.items.map(function (item, i) {
return _React2['default'].createElement(
return _React$Component$PropTypes2['default'].createElement(
'li',
{ key: i,
className: _cssClassnamer2['default'].componentPart('li'),
className: _cssClassnamer2['default'].componentPart('menuItemWrapper'),
role: 'presentation' },
_React2['default'].createElement(_MenuItem2['default'], _extends({}, item, {
_React$Component$PropTypes2['default'].createElement(_MenuItem2['default'], _extends({}, item, {
focusManager: props.focusManager,

@@ -71,3 +71,3 @@ handleSelection: props.handleSelection,

return _React2['default'].createElement(
return _React$Component$PropTypes2['default'].createElement(
'ol',

@@ -81,16 +81,14 @@ { className: menuClasses.join(' '),

return Menu;
})(_React2['default'].Component);
})(_React$Component$PropTypes.Component);
exports['default'] = Menu;
var pt = _React2['default'].PropTypes;
Menu.propTypes = {
focusManager: pt.object.isRequired,
items: pt.arrayOf(pt.object).isRequired,
flushRight: pt.bool,
handleSelection: pt.func,
receiveFocus: pt.bool,
selectedValue: pt.any
focusManager: _React$Component$PropTypes.PropTypes.object.isRequired,
items: _React$Component$PropTypes.PropTypes.arrayOf(_React$Component$PropTypes.PropTypes.object).isRequired,
flushRight: _React$Component$PropTypes.PropTypes.bool,
handleSelection: _React$Component$PropTypes.PropTypes.func,
receiveFocus: _React$Component$PropTypes.PropTypes.bool,
selectedValue: _React$Component$PropTypes.PropTypes.oneOfType([_React$Component$PropTypes.PropTypes.string, _React$Component$PropTypes.PropTypes.number, _React$Component$PropTypes.PropTypes.bool])
};
module.exports = exports['default'];

@@ -11,5 +11,5 @@ 'use strict';

var _React = require('react');
var _React$PropTypes$Component = require('react');
var _React2 = _interopRequireWildcard(_React);
var _React$PropTypes$Component2 = _interopRequireWildcard(_React$PropTypes$Component);

@@ -22,12 +22,12 @@ var _ENTER$SPACE = require('./keys');

var MenuItem = (function (_React$Component) {
var MenuItem = (function (_Component) {
function MenuItem() {
_classCallCheck(this, MenuItem);
if (_React$Component != null) {
_React$Component.apply(this, arguments);
if (_Component != null) {
_Component.apply(this, arguments);
}
}
_inherits(MenuItem, _React$Component);
_inherits(MenuItem, _Component);

@@ -42,3 +42,3 @@ MenuItem.prototype.shouldComponentUpdate = function shouldComponentUpdate(newProps) {

text: this.props.text,
node: _React2['default'].findDOMNode(this)
node: _React$PropTypes$Component2['default'].findDOMNode(this)
});

@@ -75,3 +75,3 @@ };

// ... so not in tab order, but programatically focusable
return _React2['default'].createElement(
return _React$PropTypes$Component2['default'].createElement(
'div',

@@ -90,17 +90,15 @@ { id: props.id,

return MenuItem;
})(_React2['default'].Component);
})(_React$PropTypes$Component.Component);
exports['default'] = MenuItem;
var pt = _React2['default'].PropTypes;
MenuItem.propTypes = {
focusManager: pt.object.isRequired,
handleSelection: pt.func.isRequired,
content: pt.oneOfType([pt.string, pt.element]).isRequired,
id: pt.string,
isSelected: pt.bool,
text: pt.string,
value: pt.oneOfType([pt.string, pt.number, pt.bool])
focusManager: _React$PropTypes$Component.PropTypes.object.isRequired,
handleSelection: _React$PropTypes$Component.PropTypes.func.isRequired,
content: _React$PropTypes$Component.PropTypes.oneOfType([_React$PropTypes$Component.PropTypes.string, _React$PropTypes$Component.PropTypes.element]).isRequired,
id: _React$PropTypes$Component.PropTypes.string,
isSelected: _React$PropTypes$Component.PropTypes.bool,
text: _React$PropTypes$Component.PropTypes.string,
value: _React$PropTypes$Component.PropTypes.oneOfType([_React$PropTypes$Component.PropTypes.string, _React$PropTypes$Component.PropTypes.number, _React$PropTypes$Component.PropTypes.bool])
};
module.exports = exports['default'];

@@ -70,5 +70,5 @@ (function webpackUniversalModuleDefinition(root, factory) {

var _React = __webpack_require__(1);
var _React$Component$PropTypes = __webpack_require__(1);
var _React2 = _interopRequireWildcard(_React);
var _React$Component$PropTypes2 = _interopRequireWildcard(_React$Component$PropTypes);

@@ -94,10 +94,17 @@ var _import = __webpack_require__(2);

var CSSTransitionGroup = opts.reactAddons ? opts.reactAddons.CSSTransitionGroup : false;
_cssClassnamer2['default'].init(opts.componentName, opts.namespace);
var AriaMenuButton = (function (_React$Component) {
function AriaMenuButton(props) {
_classCallCheck(this, AriaMenuButton);
var TransitionGroup = false;
if (opts.transition) {
if (opts.transition.displayName !== 'ReactCSSTransitionGroup') {
throw new Error('createAriaMenuButtons `transition` option expects a ReactCSSTransitionGroup');
}
TransitionGroup = opts.transition;
}
_React$Component.call(this, props);
var MenuButton = (function (_Component) {
function MenuButton(props) {
_classCallCheck(this, MenuButton);
_Component.call(this, props);
this.state = { isOpen: !!props.startOpen };

@@ -107,19 +114,13 @@ this.focusManager = _focusManager2['default']();

_inherits(AriaMenuButton, _React$Component);
_inherits(MenuButton, _Component);
AriaMenuButton.prototype.shouldComponentUpdate = function shouldComponentUpdate(newProps, newState) {
MenuButton.prototype.shouldComponentUpdate = function shouldComponentUpdate(newProps, newState) {
return this.state.isOpen !== newState.isOpen || this.props.selectedValue !== newProps.selectedValue;
};
AriaMenuButton.prototype.componentWillMount = function componentWillMount() {
if (this.props.transition && !CSSTransitionGroup) {
throw new Error('If you want to use transitions with ariaMenuButton, you need to pass it ' + 'React with addons');
}
MenuButton.prototype.componentDidMount = function componentDidMount() {
this.focusManager.trigger = _React$Component$PropTypes2['default'].findDOMNode(this.refs.trigger);
};
AriaMenuButton.prototype.componentDidMount = function componentDidMount() {
this.focusManager.trigger = _React2['default'].findDOMNode(this.refs.trigger);
};
AriaMenuButton.prototype.openMenu = function openMenu() {
MenuButton.prototype.openMenu = function openMenu() {
var innerFocus = arguments[0] === undefined ? false : arguments[0];

@@ -130,3 +131,3 @@

AriaMenuButton.prototype.closeMenu = function closeMenu() {
MenuButton.prototype.closeMenu = function closeMenu() {
var _this = this;

@@ -142,7 +143,7 @@

AriaMenuButton.prototype.toggleMenu = function toggleMenu() {
MenuButton.prototype.toggleMenu = function toggleMenu() {
if (this.state.isOpen) this.closeMenu();else this.openMenu();
};
AriaMenuButton.prototype.handleAnywhereKey = function handleAnywhereKey(e) {
MenuButton.prototype.handleAnywhereKey = function handleAnywhereKey(e) {
var key = e.key;

@@ -173,3 +174,3 @@ var isLetterKey = isLetterKeyEvent(e);

AriaMenuButton.prototype.handleTriggerKey = function handleTriggerKey(e) {
MenuButton.prototype.handleTriggerKey = function handleTriggerKey(e) {
var key = e.key;

@@ -182,3 +183,3 @@ if (key !== keys.ENTER && key !== keys.SPACE) {

AriaMenuButton.prototype.handleMenuKey = function handleMenuKey(e) {
MenuButton.prototype.handleMenuKey = function handleMenuKey(e) {
// "With focus on the drop-down menu, pressing Escape closes

@@ -196,3 +197,3 @@ // the menu and returns focus to the button.

AriaMenuButton.prototype.checkLetterKeys = function checkLetterKeys(kc) {
MenuButton.prototype.checkLetterKeys = function checkLetterKeys(kc) {
// "Typing a letter (printable character) key moves focus to the next

@@ -203,6 +204,6 @@ // instance of a visible node whose title begins with that printable letter."

AriaMenuButton.prototype.handleBlur = function handleBlur() {
MenuButton.prototype.handleBlur = function handleBlur() {
var _this2 = this;
this.blurTimeout = setTimeout(function () {
setTimeout(function () {
var activeEl = document.activeElement;

@@ -217,3 +218,3 @@ if (activeEl === _this2.focusManager.trigger) return;

AriaMenuButton.prototype.handleSelection = function handleSelection(v) {
MenuButton.prototype.handleSelection = function handleSelection(v) {
if (this.props.closeOnSelection) this.closeMenu();

@@ -223,8 +224,7 @@ this.props.handleSelection(v);

AriaMenuButton.prototype.handleOverlayClick = function handleOverlayClick() {
console.log('overlay click triggered');
MenuButton.prototype.handleOverlayClick = function handleOverlayClick() {
this.closeMenu(false);
};
AriaMenuButton.prototype.render = function render() {
MenuButton.prototype.render = function render() {
var props = this.props;

@@ -238,3 +238,3 @@ var isOpen = this.state.isOpen;

var menu = isOpen ? _React2['default'].createElement(_Menu2['default'], _extends({}, props, {
var menu = isOpen ? _React$Component$PropTypes2['default'].createElement(_Menu2['default'], _extends({}, props, {
handleSelection: this.handleSelection.bind(this),

@@ -244,10 +244,10 @@ receiveFocus: this.state.innerFocus,

var menuWrapper = props.transition ? _React2['default'].createElement(
CSSTransitionGroup,
var menuWrapper = TransitionGroup ? _React$Component$PropTypes2['default'].createElement(
TransitionGroup,
{ transitionName: _cssClassnamer2['default'].applyNamespace('is'),
component: 'div',
className: [_cssClassnamer2['default'].componentPart('menuWrapper'), _cssClassnamer2['default'].componentPart('menuWrapper--trans')].join(' '),
className: [_cssClassnamer2['default'].componentPart('menuWrapper'), _cssClassnamer2['default'].componentPart('menuWrapper--transition')].join(' '),
onKeyDown: this.handleMenuKey.bind(this) },
menu
) : _React2['default'].createElement(
) : _React$Component$PropTypes2['default'].createElement(
'div',

@@ -271,3 +271,3 @@ { className: _cssClassnamer2['default'].componentPart('menuWrapper'),

var outsideOverlay = !isOpen ? false : _React2['default'].createElement('div', { id: outsideId,
var outsideOverlay = !isOpen ? false : _React$Component$PropTypes2['default'].createElement('div', { id: outsideId,
onClick: this.handleOverlayClick.bind(this),

@@ -283,3 +283,3 @@ ref: 'overlay',

return _React2['default'].createElement(
return _React$Component$PropTypes2['default'].createElement(
'div',

@@ -291,6 +291,6 @@ { id: props.id,

outsideOverlay,
_React2['default'].createElement(
_React$Component$PropTypes2['default'].createElement(
'div',
{ style: innerStyle },
_React2['default'].createElement(
_React$Component$PropTypes2['default'].createElement(
'div',

@@ -313,20 +313,17 @@ { id: triggerId,

return AriaMenuButton;
})(_React2['default'].Component);
return MenuButton;
})(_React$Component$PropTypes.Component);
var pt = _React2['default'].PropTypes;
AriaMenuButton.propTypes = {
handleSelection: pt.func.isRequired,
items: pt.arrayOf(pt.object).isRequired,
triggerContent: pt.oneOfType([pt.string, pt.element]).isRequired,
closeOnSelection: pt.bool,
flushRight: pt.bool,
id: pt.string,
startOpen: pt.bool,
selectedValue: pt.oneOfType([pt.string, pt.number, pt.bool]),
transition: pt.bool
MenuButton.propTypes = {
handleSelection: _React$Component$PropTypes.PropTypes.func.isRequired,
items: _React$Component$PropTypes.PropTypes.arrayOf(_React$Component$PropTypes.PropTypes.object).isRequired,
triggerContent: _React$Component$PropTypes.PropTypes.oneOfType([_React$Component$PropTypes.PropTypes.string, _React$Component$PropTypes.PropTypes.element]).isRequired,
closeOnSelection: _React$Component$PropTypes.PropTypes.bool,
flushRight: _React$Component$PropTypes.PropTypes.bool,
id: _React$Component$PropTypes.PropTypes.string,
startOpen: _React$Component$PropTypes.PropTypes.bool,
selectedValue: _React$Component$PropTypes.PropTypes.oneOfType([_React$Component$PropTypes.PropTypes.string, _React$Component$PropTypes.PropTypes.number, _React$Component$PropTypes.PropTypes.bool])
};
return AriaMenuButton;
return MenuButton;
}

@@ -386,5 +383,5 @@

var _React = __webpack_require__(1);
var _React$Component$PropTypes = __webpack_require__(1);
var _React2 = _interopRequireWildcard(_React);
var _React$Component$PropTypes2 = _interopRequireWildcard(_React$Component$PropTypes);

@@ -399,12 +396,12 @@ var _MenuItem = __webpack_require__(6);

var Menu = (function (_React$Component) {
var Menu = (function (_Component) {
function Menu() {
_classCallCheck(this, Menu);
if (_React$Component != null) {
_React$Component.apply(this, arguments);
if (_Component != null) {
_Component.apply(this, arguments);
}
}
_inherits(Menu, _React$Component);
_inherits(Menu, _Component);

@@ -428,8 +425,8 @@ Menu.prototype.shouldComponentUpdate = function shouldComponentUpdate(newProps) {

var items = props.items.map(function (item, i) {
return _React2['default'].createElement(
return _React$Component$PropTypes2['default'].createElement(
'li',
{ key: i,
className: _cssClassnamer2['default'].componentPart('li'),
className: _cssClassnamer2['default'].componentPart('menuItemWrapper'),
role: 'presentation' },
_React2['default'].createElement(_MenuItem2['default'], _extends({}, item, {
_React$Component$PropTypes2['default'].createElement(_MenuItem2['default'], _extends({}, item, {
focusManager: props.focusManager,

@@ -444,3 +441,3 @@ handleSelection: props.handleSelection,

return _React2['default'].createElement(
return _React$Component$PropTypes2['default'].createElement(
'ol',

@@ -454,15 +451,13 @@ { className: menuClasses.join(' '),

return Menu;
})(_React2['default'].Component);
})(_React$Component$PropTypes.Component);
exports['default'] = Menu;
var pt = _React2['default'].PropTypes;
Menu.propTypes = {
focusManager: pt.object.isRequired,
items: pt.arrayOf(pt.object).isRequired,
flushRight: pt.bool,
handleSelection: pt.func,
receiveFocus: pt.bool,
selectedValue: pt.any
focusManager: _React$Component$PropTypes.PropTypes.object.isRequired,
items: _React$Component$PropTypes.PropTypes.arrayOf(_React$Component$PropTypes.PropTypes.object).isRequired,
flushRight: _React$Component$PropTypes.PropTypes.bool,
handleSelection: _React$Component$PropTypes.PropTypes.func,
receiveFocus: _React$Component$PropTypes.PropTypes.bool,
selectedValue: _React$Component$PropTypes.PropTypes.oneOfType([_React$Component$PropTypes.PropTypes.string, _React$Component$PropTypes.PropTypes.number, _React$Component$PropTypes.PropTypes.bool])
};

@@ -557,2 +552,3 @@ module.exports = exports['default'];

}
};

@@ -575,5 +571,5 @@ module.exports = exports['default'];

var _React = __webpack_require__(1);
var _React$PropTypes$Component = __webpack_require__(1);
var _React2 = _interopRequireWildcard(_React);
var _React$PropTypes$Component2 = _interopRequireWildcard(_React$PropTypes$Component);

@@ -586,12 +582,12 @@ var _ENTER$SPACE = __webpack_require__(2);

var MenuItem = (function (_React$Component) {
var MenuItem = (function (_Component) {
function MenuItem() {
_classCallCheck(this, MenuItem);
if (_React$Component != null) {
_React$Component.apply(this, arguments);
if (_Component != null) {
_Component.apply(this, arguments);
}
}
_inherits(MenuItem, _React$Component);
_inherits(MenuItem, _Component);

@@ -606,3 +602,3 @@ MenuItem.prototype.shouldComponentUpdate = function shouldComponentUpdate(newProps) {

text: this.props.text,
node: _React2['default'].findDOMNode(this)
node: _React$PropTypes$Component2['default'].findDOMNode(this)
});

@@ -639,3 +635,3 @@ };

// ... so not in tab order, but programatically focusable
return _React2['default'].createElement(
return _React$PropTypes$Component2['default'].createElement(
'div',

@@ -654,16 +650,14 @@ { id: props.id,

return MenuItem;
})(_React2['default'].Component);
})(_React$PropTypes$Component.Component);
exports['default'] = MenuItem;
var pt = _React2['default'].PropTypes;
MenuItem.propTypes = {
focusManager: pt.object.isRequired,
handleSelection: pt.func.isRequired,
content: pt.oneOfType([pt.string, pt.element]).isRequired,
id: pt.string,
isSelected: pt.bool,
text: pt.string,
value: pt.oneOfType([pt.string, pt.number, pt.bool])
focusManager: _React$PropTypes$Component.PropTypes.object.isRequired,
handleSelection: _React$PropTypes$Component.PropTypes.func.isRequired,
content: _React$PropTypes$Component.PropTypes.oneOfType([_React$PropTypes$Component.PropTypes.string, _React$PropTypes$Component.PropTypes.element]).isRequired,
id: _React$PropTypes$Component.PropTypes.string,
isSelected: _React$PropTypes$Component.PropTypes.bool,
text: _React$PropTypes$Component.PropTypes.string,
value: _React$PropTypes$Component.PropTypes.oneOfType([_React$PropTypes$Component.PropTypes.string, _React$PropTypes$Component.PropTypes.number, _React$PropTypes$Component.PropTypes.bool])
};

@@ -670,0 +664,0 @@ module.exports = exports['default'];

@@ -1,1 +0,1 @@

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.AriaMenuButton=t(require("react")):e.AriaMenuButton=t(e.react)}(this,function(e){return function(e){function t(o){if(n[o])return n[o].exports;var r=n[o]={exports:{},id:o,loaded:!1};return e[o].call(r.exports,r,r.exports,t),r.loaded=!0,r.exports}var n={};return t.m=e,t.c=n,t.p="",t(0)}([function(e,t,n){"use strict";function o(){var e=void 0===arguments[0]?{}:arguments[0],t=e.reactAddons?e.reactAddons.CSSTransitionGroup:!1;v["default"].init(e.componentName,e.namespace);var n=function(e){function n(t){s(this,n),e.call(this,t),this.state={isOpen:!!t.startOpen},this.focusManager=y["default"]()}return a(n,e),n.prototype.shouldComponentUpdate=function(e,t){return this.state.isOpen!==t.isOpen||this.props.selectedValue!==e.selectedValue},n.prototype.componentWillMount=function(){if(this.props.transition&&!t)throw new Error("If you want to use transitions with ariaMenuButton, you need to pass it React with addons")},n.prototype.componentDidMount=function(){this.focusManager.trigger=l["default"].findDOMNode(this.refs.trigger)},n.prototype.openMenu=function(){var e=void 0===arguments[0]?!1:arguments[0];this.setState({isOpen:!0,innerFocus:e})},n.prototype.closeMenu=function(){var e=this,t=void 0===arguments[0]?!0:arguments[0];this.setState({isOpen:!1,innerFocus:!1},function(){t&&e.focusManager.focusTrigger(),e.focusManager.currentFocus=-1})},n.prototype.toggleMenu=function(){this.state.isOpen?this.closeMenu():this.openMenu()},n.prototype.handleAnywhereKey=function(e){var t=e.key,n=r(e);(t===f.DOWN||n)&&(e.preventDefault(),t===f.DOWN?this.state.isOpen?this.focusManager.moveDown():this.openMenu(!0):n&&this.state.isOpen&&this.checkLetterKeys(e.keyCode))},n.prototype.handleTriggerKey=function(e){var t=e.key;(t===f.ENTER||t===f.SPACE)&&(e.preventDefault(),this.toggleMenu())},n.prototype.handleMenuKey=function(e){e.key===f.ESCAPE?this.closeMenu():e.key===f.UP&&this.state.isOpen&&(e.preventDefault(),this.focusManager.moveUp())},n.prototype.checkLetterKeys=function(e){this.focusManager.moveToLetter(String.fromCharCode(e))},n.prototype.handleBlur=function(){var e=this;this.blurTimeout=setTimeout(function(){var t=document.activeElement;t!==e.focusManager.trigger&&(e.focusManager.focusables.some(function(e){return e.node===t})||e.state.isOpen&&e.closeMenu(!1))},0)},n.prototype.handleSelection=function(e){this.props.closeOnSelection&&this.closeMenu(),this.props.handleSelection(e)},n.prototype.handleOverlayClick=function(){console.log("overlay click triggered"),this.closeMenu(!1)},n.prototype.render=function(){var e=this.props,n=this.state.isOpen,o=e.id?""+e.id+"-trigger":void 0,r=e.id?""+e.id+"-outside":void 0,i=[v["default"].componentPart("trigger")];n&&i.push(v["default"].applyNamespace("is-open"));var s=n?l["default"].createElement(h["default"],u({},e,{handleSelection:this.handleSelection.bind(this),receiveFocus:this.state.innerFocus,focusManager:this.focusManager})):!1,a=e.transition?l["default"].createElement(t,{transitionName:v["default"].applyNamespace("is"),component:"div",className:[v["default"].componentPart("menuWrapper"),v["default"].componentPart("menuWrapper--trans")].join(" "),onKeyDown:this.handleMenuKey.bind(this)},s):l["default"].createElement("div",{className:v["default"].componentPart("menuWrapper"),onKeyDown:this.handleMenuKey.bind(this)},s),c=n?{display:"inline-block",position:"relative",zIndex:"100"}:{},p=n?l["default"].createElement("div",{id:r,onClick:this.handleOverlayClick.bind(this),ref:"overlay",style:{cursor:"pointer",position:"fixed",top:0,bottom:0,left:0,right:0,zIndex:"99",WebkitTapHighlightColor:"rgba(0,0,0,0)"}}):!1;return l["default"].createElement("div",{id:e.id,className:v["default"].componentPart(),onKeyDown:this.handleAnywhereKey.bind(this),onBlur:this.handleBlur.bind(this)},p,l["default"].createElement("div",{style:c},l["default"].createElement("div",{id:o,className:i.join(" "),onClick:this.toggleMenu.bind(this),onKeyDown:this.handleTriggerKey.bind(this),ref:"trigger","aria-haspopup":!0,"aria-expanded":n,role:"button",tabIndex:"0"},e.triggerContent),a))},n}(l["default"].Component),o=l["default"].PropTypes;return n.propTypes={handleSelection:o.func.isRequired,items:o.arrayOf(o.object).isRequired,triggerContent:o.oneOfType([o.string,o.element]).isRequired,closeOnSelection:o.bool,flushRight:o.bool,id:o.string,startOpen:o.bool,selectedValue:o.oneOfType([o.string,o.number,o.bool]),transition:o.bool},n}function r(e){return e.keyCode>=f.LOWEST_LETTER_CODE&&e.keyCode<=f.HIGHEST_LETTER_CODE}var i=function(e){return e&&e.__esModule?e:{"default":e}},s=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},a=function(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&&(e.__proto__=t)},u=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e};t.__esModule=!0,t["default"]=o;var c=n(1),l=i(c),p=n(2),f=i(p),d=n(3),h=i(d),m=n(4),y=i(m),g=n(5),v=i(g);e.exports=t["default"]},function(t,n,o){t.exports=e},function(e,t,n){"use strict";t.__esModule=!0;var o="Enter";t.ENTER=o;var r=" ";t.SPACE=r;var i="Escape";t.ESCAPE=i;var s="ArrowUp";t.UP=s;var a="ArrowDown";t.DOWN=a;var u=65;t.LOWEST_LETTER_CODE=u;var c=91;t.HIGHEST_LETTER_CODE=c},function(e,t,n){"use strict";var o=function(e){return e&&e.__esModule?e:{"default":e}},r=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},i=function(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&&(e.__proto__=t)},s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e};t.__esModule=!0;var a=n(1),u=o(a),c=n(6),l=o(c),p=n(5),f=o(p),d=function(e){function t(){r(this,t),null!=e&&e.apply(this,arguments)}return i(t,e),t.prototype.shouldComponentUpdate=function(e){return this.props.selectedValue!==e.selectedValue},t.prototype.componentWillMount=function(){this.props.focusManager.focusables=[]},t.prototype.componentDidMount=function(){this.props.receiveFocus&&this.props.focusManager.move(0)},t.prototype.render=function(){var e=this.props,t=e.selectedValue,n=e.items.map(function(n,o){return u["default"].createElement("li",{key:o,className:f["default"].componentPart("li"),role:"presentation"},u["default"].createElement(l["default"],s({},n,{focusManager:e.focusManager,handleSelection:e.handleSelection,isSelected:n.value===t})))}),o=[f["default"].componentPart("menu")];return e.flushRight&&o.push(f["default"].componentPart("menu--flushRight")),u["default"].createElement("ol",{className:o.join(" "),role:"menu"},n)},t}(u["default"].Component);t["default"]=d;var h=u["default"].PropTypes;d.propTypes={focusManager:h.object.isRequired,items:h.arrayOf(h.object).isRequired,flushRight:h.bool,handleSelection:h.func,receiveFocus:h.bool,selectedValue:h.any},e.exports=t["default"]},function(e,t,n){"use strict";function o(){return Object.create(r)}t.__esModule=!0,t["default"]=o;var r={focusables:[],trigger:null,currentFocus:-1,move:function(e){this.focusables[e].node.focus(),this.currentFocus=e},moveUp:function(){var e=-1===this.currentFocus||0===this.currentFocus?this.focusables.length-1:this.currentFocus-1;this.move(e)},moveDown:function(){var e=-1===this.currentFocus||this.currentFocus===this.focusables.length-1?0:this.currentFocus+1;this.move(e)},moveToLetter:function(e){for(var t=this.focusables.slice(this.currentFocus+1).concat(this.focusables.slice(0,this.currentFocus+1)),n=0,o=t.length;o>n;n++){var r=t[n];if(!r.text&&!r.content.charAt)throw new Error("AriaMenuButton items must have textual `content` or a `text` prop");if(r.text){if(r.text.charAt(0).toLowerCase()!==e.toLowerCase())continue}else if(r.content.charAt(0).toLowerCase()!==e.toLowerCase())continue;return r.node.focus(),void(this.currentFocus=this.focusables.indexOf(r))}},focusTrigger:function(){this.trigger.focus()}};e.exports=t["default"]},function(e,t,n){"use strict";t.__esModule=!0,t["default"]={init:function(e,t){var n=void 0===arguments[0]?"AriaMenuButton":arguments[0];this.namespace=t,this.componentName=this.applyNamespace(n)},componentPart:function(e){return e?""+this.componentName+"-"+e:this.componentName},applyNamespace:function(e){return this.namespace?""+this.namespace+"-"+e:e}},e.exports=t["default"]},function(e,t,n){"use strict";var o=function(e){return e&&e.__esModule?e:{"default":e}},r=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},i=function(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&&(e.__proto__=t)};t.__esModule=!0;var s=n(1),a=o(s),u=n(2),c=n(5),l=o(c),p=function(e){function t(){r(this,t),null!=e&&e.apply(this,arguments)}return i(t,e),t.prototype.shouldComponentUpdate=function(e){return this.props.isSelected!==e.isSelected},t.prototype.componentDidMount=function(){this.props.focusManager.focusables.push({content:this.props.content,text:this.props.text,node:a["default"].findDOMNode(this)})},t.prototype.handleClick=function(e){var t=this.props;if(!t.isSelected){var n="undefined"!=typeof t.value?t.value:t.content;t.handleSelection(n,e)}},t.prototype.handleKey=function(e){(e.key===u.ENTER||e.key===u.SPACE)&&(e.preventDefault(),this.handleClick(e))},t.prototype.render=function(){var e=this.props,t=[l["default"].componentPart("menuItem")];return e.isSelected&&t.push(l["default"].applyNamespace("is-selected")),a["default"].createElement("div",{id:e.id,className:t.join(" "),onClick:this.handleClick.bind(this),onKeyDown:this.handleKey.bind(this),role:"menuitem",tabIndex:"-1","data-value":e.value},e.content)},t}(a["default"].Component);t["default"]=p;var f=a["default"].PropTypes;p.propTypes={focusManager:f.object.isRequired,handleSelection:f.func.isRequired,content:f.oneOfType([f.string,f.element]).isRequired,id:f.string,isSelected:f.bool,text:f.string,value:f.oneOfType([f.string,f.number,f.bool])},e.exports=t["default"]}])});
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.AriaMenuButton=t(require("react")):e.AriaMenuButton=t(e.react)}(this,function(e){return function(e){function t(o){if(n[o])return n[o].exports;var r=n[o]={exports:{},id:o,loaded:!1};return e[o].call(r.exports,r,r.exports,t),r.loaded=!0,r.exports}var n={};return t.m=e,t.c=n,t.p="",t(0)}([function(e,t,n){"use strict";function o(){var e=void 0===arguments[0]?{}:arguments[0];v["default"].init(e.componentName,e.namespace);var t=!1;if(e.transition){if("ReactCSSTransitionGroup"!==e.transition.displayName)throw new Error("createAriaMenuButtons `transition` option expects a ReactCSSTransitionGroup");t=e.transition}var n=function(e){function n(t){i(this,n),e.call(this,t),this.state={isOpen:!!t.startOpen},this.focusManager=m["default"]()}return a(n,e),n.prototype.shouldComponentUpdate=function(e,t){return this.state.isOpen!==t.isOpen||this.props.selectedValue!==e.selectedValue},n.prototype.componentDidMount=function(){this.focusManager.trigger=c["default"].findDOMNode(this.refs.trigger)},n.prototype.openMenu=function(){var e=void 0===arguments[0]?!1:arguments[0];this.setState({isOpen:!0,innerFocus:e})},n.prototype.closeMenu=function(){var e=this,t=void 0===arguments[0]?!0:arguments[0];this.setState({isOpen:!1,innerFocus:!1},function(){t&&e.focusManager.focusTrigger(),e.focusManager.currentFocus=-1})},n.prototype.toggleMenu=function(){this.state.isOpen?this.closeMenu():this.openMenu()},n.prototype.handleAnywhereKey=function(e){var t=e.key,n=r(e);(t===f.DOWN||n)&&(e.preventDefault(),t===f.DOWN?this.state.isOpen?this.focusManager.moveDown():this.openMenu(!0):n&&this.state.isOpen&&this.checkLetterKeys(e.keyCode))},n.prototype.handleTriggerKey=function(e){var t=e.key;(t===f.ENTER||t===f.SPACE)&&(e.preventDefault(),this.toggleMenu())},n.prototype.handleMenuKey=function(e){e.key===f.ESCAPE?this.closeMenu():e.key===f.UP&&this.state.isOpen&&(e.preventDefault(),this.focusManager.moveUp())},n.prototype.checkLetterKeys=function(e){this.focusManager.moveToLetter(String.fromCharCode(e))},n.prototype.handleBlur=function(){var e=this;setTimeout(function(){var t=document.activeElement;t!==e.focusManager.trigger&&(e.focusManager.focusables.some(function(e){return e.node===t})||e.state.isOpen&&e.closeMenu(!1))},0)},n.prototype.handleSelection=function(e){this.props.closeOnSelection&&this.closeMenu(),this.props.handleSelection(e)},n.prototype.handleOverlayClick=function(){this.closeMenu(!1)},n.prototype.render=function(){var e=this.props,n=this.state.isOpen,o=e.id?""+e.id+"-trigger":void 0,r=e.id?""+e.id+"-outside":void 0,s=[v["default"].componentPart("trigger")];n&&s.push(v["default"].applyNamespace("is-open"));var i=n?c["default"].createElement(h["default"],u({},e,{handleSelection:this.handleSelection.bind(this),receiveFocus:this.state.innerFocus,focusManager:this.focusManager})):!1,a=t?c["default"].createElement(t,{transitionName:v["default"].applyNamespace("is"),component:"div",className:[v["default"].componentPart("menuWrapper"),v["default"].componentPart("menuWrapper--transition")].join(" "),onKeyDown:this.handleMenuKey.bind(this)},i):c["default"].createElement("div",{className:v["default"].componentPart("menuWrapper"),onKeyDown:this.handleMenuKey.bind(this)},i),p=n?{display:"inline-block",position:"relative",zIndex:"100"}:{},l=n?c["default"].createElement("div",{id:r,onClick:this.handleOverlayClick.bind(this),ref:"overlay",style:{cursor:"pointer",position:"fixed",top:0,bottom:0,left:0,right:0,zIndex:"99",WebkitTapHighlightColor:"rgba(0,0,0,0)"}}):!1;return c["default"].createElement("div",{id:e.id,className:v["default"].componentPart(),onKeyDown:this.handleAnywhereKey.bind(this),onBlur:this.handleBlur.bind(this)},l,c["default"].createElement("div",{style:p},c["default"].createElement("div",{id:o,className:s.join(" "),onClick:this.toggleMenu.bind(this),onKeyDown:this.handleTriggerKey.bind(this),ref:"trigger","aria-haspopup":!0,"aria-expanded":n,role:"button",tabIndex:"0"},e.triggerContent),a))},n}(p.Component);return n.propTypes={handleSelection:p.PropTypes.func.isRequired,items:p.PropTypes.arrayOf(p.PropTypes.object).isRequired,triggerContent:p.PropTypes.oneOfType([p.PropTypes.string,p.PropTypes.element]).isRequired,closeOnSelection:p.PropTypes.bool,flushRight:p.PropTypes.bool,id:p.PropTypes.string,startOpen:p.PropTypes.bool,selectedValue:p.PropTypes.oneOfType([p.PropTypes.string,p.PropTypes.number,p.PropTypes.bool])},n}function r(e){return e.keyCode>=f.LOWEST_LETTER_CODE&&e.keyCode<=f.HIGHEST_LETTER_CODE}var s=function(e){return e&&e.__esModule?e:{"default":e}},i=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},a=function(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&&(e.__proto__=t)},u=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e};t.__esModule=!0,t["default"]=o;var p=n(1),c=s(p),l=n(2),f=s(l),d=n(3),h=s(d),y=n(4),m=s(y),g=n(5),v=s(g);e.exports=t["default"]},function(t,n,o){t.exports=e},function(e,t,n){"use strict";t.__esModule=!0;var o="Enter";t.ENTER=o;var r=" ";t.SPACE=r;var s="Escape";t.ESCAPE=s;var i="ArrowUp";t.UP=i;var a="ArrowDown";t.DOWN=a;var u=65;t.LOWEST_LETTER_CODE=u;var p=91;t.HIGHEST_LETTER_CODE=p},function(e,t,n){"use strict";var o=function(e){return e&&e.__esModule?e:{"default":e}},r=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},s=function(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&&(e.__proto__=t)},i=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e};t.__esModule=!0;var a=n(1),u=o(a),p=n(6),c=o(p),l=n(5),f=o(l),d=function(e){function t(){r(this,t),null!=e&&e.apply(this,arguments)}return s(t,e),t.prototype.shouldComponentUpdate=function(e){return this.props.selectedValue!==e.selectedValue},t.prototype.componentWillMount=function(){this.props.focusManager.focusables=[]},t.prototype.componentDidMount=function(){this.props.receiveFocus&&this.props.focusManager.move(0)},t.prototype.render=function(){var e=this.props,t=e.selectedValue,n=e.items.map(function(n,o){return u["default"].createElement("li",{key:o,className:f["default"].componentPart("menuItemWrapper"),role:"presentation"},u["default"].createElement(c["default"],i({},n,{focusManager:e.focusManager,handleSelection:e.handleSelection,isSelected:n.value===t})))}),o=[f["default"].componentPart("menu")];return e.flushRight&&o.push(f["default"].componentPart("menu--flushRight")),u["default"].createElement("ol",{className:o.join(" "),role:"menu"},n)},t}(a.Component);t["default"]=d,d.propTypes={focusManager:a.PropTypes.object.isRequired,items:a.PropTypes.arrayOf(a.PropTypes.object).isRequired,flushRight:a.PropTypes.bool,handleSelection:a.PropTypes.func,receiveFocus:a.PropTypes.bool,selectedValue:a.PropTypes.oneOfType([a.PropTypes.string,a.PropTypes.number,a.PropTypes.bool])},e.exports=t["default"]},function(e,t,n){"use strict";function o(){return Object.create(r)}t.__esModule=!0,t["default"]=o;var r={focusables:[],trigger:null,currentFocus:-1,move:function(e){this.focusables[e].node.focus(),this.currentFocus=e},moveUp:function(){var e=-1===this.currentFocus||0===this.currentFocus?this.focusables.length-1:this.currentFocus-1;this.move(e)},moveDown:function(){var e=-1===this.currentFocus||this.currentFocus===this.focusables.length-1?0:this.currentFocus+1;this.move(e)},moveToLetter:function(e){for(var t=this.focusables.slice(this.currentFocus+1).concat(this.focusables.slice(0,this.currentFocus+1)),n=0,o=t.length;o>n;n++){var r=t[n];if(!r.text&&!r.content.charAt)throw new Error("AriaMenuButton items must have textual `content` or a `text` prop");if(r.text){if(r.text.charAt(0).toLowerCase()!==e.toLowerCase())continue}else if(r.content.charAt(0).toLowerCase()!==e.toLowerCase())continue;return r.node.focus(),void(this.currentFocus=this.focusables.indexOf(r))}},focusTrigger:function(){this.trigger.focus()}};e.exports=t["default"]},function(e,t,n){"use strict";t.__esModule=!0,t["default"]={init:function(e,t){var n=void 0===arguments[0]?"AriaMenuButton":arguments[0];this.namespace=t,this.componentName=this.applyNamespace(n)},componentPart:function(e){return e?""+this.componentName+"-"+e:this.componentName},applyNamespace:function(e){return this.namespace?""+this.namespace+"-"+e:e}},e.exports=t["default"]},function(e,t,n){"use strict";var o=function(e){return e&&e.__esModule?e:{"default":e}},r=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},s=function(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&&(e.__proto__=t)};t.__esModule=!0;var i=n(1),a=o(i),u=n(2),p=n(5),c=o(p),l=function(e){function t(){r(this,t),null!=e&&e.apply(this,arguments)}return s(t,e),t.prototype.shouldComponentUpdate=function(e){return this.props.isSelected!==e.isSelected},t.prototype.componentDidMount=function(){this.props.focusManager.focusables.push({content:this.props.content,text:this.props.text,node:a["default"].findDOMNode(this)})},t.prototype.handleClick=function(e){var t=this.props;if(!t.isSelected){var n="undefined"!=typeof t.value?t.value:t.content;t.handleSelection(n,e)}},t.prototype.handleKey=function(e){(e.key===u.ENTER||e.key===u.SPACE)&&(e.preventDefault(),this.handleClick(e))},t.prototype.render=function(){var e=this.props,t=[c["default"].componentPart("menuItem")];return e.isSelected&&t.push(c["default"].applyNamespace("is-selected")),a["default"].createElement("div",{id:e.id,className:t.join(" "),onClick:this.handleClick.bind(this),onKeyDown:this.handleKey.bind(this),role:"menuitem",tabIndex:"-1","data-value":e.value},e.content)},t}(i.Component);t["default"]=l,l.propTypes={focusManager:i.PropTypes.object.isRequired,handleSelection:i.PropTypes.func.isRequired,content:i.PropTypes.oneOfType([i.PropTypes.string,i.PropTypes.element]).isRequired,id:i.PropTypes.string,isSelected:i.PropTypes.bool,text:i.PropTypes.string,value:i.PropTypes.oneOfType([i.PropTypes.string,i.PropTypes.number,i.PropTypes.bool])},e.exports=t["default"]}])});
{
"name": "react-aria-menubutton",
"version": "0.5.0",
"version": "0.5.1",
"description": "A fully accessible, easily themeable, React-powered menu button",

@@ -5,0 +5,0 @@ "main": "index.js",

@@ -162,12 +162,4 @@ # react-aria-menubutton [![Build Status](https://travis-ci.org/davidtheclark/react-aria-menubutton.svg?branch=master)](https://travis-ci.org/davidtheclark/react-aria-menubutton)

- **namespace**: Specify a namespace for css classes. [See above](#specify-your-own-namespace).
- **transition**: If you want to animate the opening & closing of the menu, pass in [React's CSSTransitionGroup](https://facebook.github.io/react/docs/animation.html) here. For example,
- **transition**: If you want to animate the opening & closing of the menu, pass in [React's CSSTransitionGroup](https://facebook.github.io/react/docs/animation.html) here. (See example above.) Make sure you read React's docs on the component and setup your CSS to properly work with it.
```js
var React = require('react/addons');
var createAriaMenuButton = require('react-aria-menubutton');
var AriaMenuButton = createAriaMenuButton({ transition: React.addons.CSSTransitionGroup });
```
Make sure you read React's docs on the component and setup your CSS to properly work with it.
### AriaMenuButton

@@ -174,0 +166,0 @@

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc