Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

react-aria-menubutton

Package Overview
Dependencies
Maintainers
1
Versions
44
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-aria-menubutton - npm Package Compare versions

Comparing version 4.1.3 to 4.2.0

lib/__tests__/__snapshots__/Button.test.js.snap

7

CHANGELOG.md
# Changelog
# 4.2.0
- Use `ownerDocument` instead of `document.documentElement` in case this is used in an iframe.
- Rewrite test suite using Jest.
# 4.1.3

@@ -33,3 +38,3 @@

- Switch from `tap.js` to `teeny-tap`.
- Move UMD build to `umd/` directory that is only distributed with the npm package (available on npmcdn).
- Move UMD build to `umd/` directory that is only distributed with the npm package (available on unpkg).

@@ -36,0 +41,0 @@ ## 3.1.0

2

lib/createManager.js

@@ -108,5 +108,5 @@ var ReactDOM = require('react-dom');

self.blurTimer = setTimeout(function() {
var activeEl = document.activeElement;
var buttonNode = ReactDOM.findDOMNode(self.button);
var menuNode = ReactDOM.findDOMNode(self.menu);
var activeEl = buttonNode.ownerDocument.activeElement;
if (buttonNode && activeEl === buttonNode) return;

@@ -113,0 +113,0 @@ if (menuNode && menuNode.contains(activeEl)) return;

@@ -31,3 +31,3 @@ var React = require('react');

componentWillUpdate: function() {
componentDidUpdate: function() {
var ambManager = this.context.ambManager;

@@ -54,4 +54,7 @@ if (ambManager.isOpen && !this.tapListener) {

addTapListener: function() {
if (!window || !window.document) return;
this.tapListener = createTapListener(document.documentElement, this.handleTap);
var el = ReactDOM.findDOMNode(this);
if (!el) return;
var doc = el.ownerDocument;
if (!doc) return;
this.tapListener = createTapListener(doc.documentElement, this.handleTap);
},

@@ -58,0 +61,0 @@

{
"name": "react-aria-menubutton",
"version": "4.1.3",
"version": "4.2.0",
"description": "A fully accessible and flexible React-powered menu button",

@@ -11,5 +11,4 @@ "main": "index.js",

"demo-dev": "npm run demo-watch & http-server demo",
"test-dev": "zuul --local 8080 --open -- test",
"pretest": "npm run lint",
"test": "zuul -- test",
"jest": "jest",
"test": "npm run lint && npm run jest",
"umd-unminified": "webpack --config ./webpack-umd.config.js",

@@ -20,8 +19,2 @@ "umd-minified": "MINIFY=true webpack --config ./webpack-umd.config.js",

},
"babel": {
"presets": [
"es2015",
"react"
]
},
"repository": {

@@ -60,17 +53,26 @@ "type": "git",

"devDependencies": {
"babel-loader": "6.2.4",
"babel-preset-es2015": "6.9.0",
"babel-preset-react": "6.11.1",
"eslint": "2.7.0",
"babel-loader": "6.2.7",
"babel-preset-es2015": "6.18.0",
"babel-preset-react": "6.16.0",
"enzyme": "^2.5.1",
"enzyme-to-json": "^1.1.5",
"eslint": "3.9.0",
"http-server": "0.9.0",
"react": "15.2.0",
"react-addons-css-transition-group": "15.2.0",
"react-addons-test-utils": "15.2.0",
"react-dom": "15.2.0",
"sinon": "1.17.4",
"tape": "4.6.0",
"webpack": "1.13.1",
"zuul": "3.10.1",
"zuul-ngrok": "^4.0.0"
"jest": "^16.0.2",
"react": "15.3.2",
"react-addons-css-transition-group": "15.3.2",
"react-addons-test-utils": "^15.3.2",
"react-dom": "15.3.2",
"webpack": "1.13.3"
},
"babel": {
"presets": [
"es2015",
"react"
]
},
"jest": {
"testRegex": "/__tests__/.*\\.test.js$",
"clearMocks": true
}
}

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

But if you need a UMD version (which will include `focus-group` and `teeny-tap` in the bundle, but of course not `React` or `ReactDOM`), you can get it via npmcdm at `https://npmcdn.com/react-aria-menubutton@[version-of-choice]/umd/ReactAriaMenuButton.js`.
If you don't know about npmcdn, [read about it here](https://npmcdn.com).
But if you need a UMD version (which will include `focus-group` and `teeny-tap` in the bundle, but of course not `React` or `ReactDOM`), you can get it via npmcdm at `https://unpkg.com/react-aria-menubutton@[version-of-choice]/umd/ReactAriaMenuButton.js`.
If you don't know about unpkg, [read about it here](https://unpkg.com).
Versions <3.0 are compatible with React 0.13.x.
## Tested Browser Support
## Browser Support
Basically IE9+. See `.zuul.yml` for more details.
Basically IE9+.
Automated testing is done with [zuul](https://github.com/defunctzombie/zuul) and [Open Suace](https://saucelabs.com/opensauce/).
## Usage

@@ -82,0 +80,0 @@

@@ -255,3 +255,3 @@ (function webpackUniversalModuleDefinition(root, factory) {

componentWillUpdate: function() {
componentDidUpdate: function() {
var ambManager = this.context.ambManager;

@@ -278,4 +278,7 @@ if (ambManager.isOpen && !this.tapListener) {

addTapListener: function() {
if (!window || !window.document) return;
this.tapListener = createTapListener(document.documentElement, this.handleTap);
var el = ReactDOM.findDOMNode(this);
if (!el) return;
var doc = el.ownerDocument;
if (!doc) return;
this.tapListener = createTapListener(doc.documentElement, this.handleTap);
},

@@ -548,5 +551,5 @@

self.blurTimer = setTimeout(function() {
var activeEl = document.activeElement;
var buttonNode = ReactDOM.findDOMNode(self.button);
var menuNode = ReactDOM.findDOMNode(self.menu);
var activeEl = buttonNode.ownerDocument.activeElement;
if (buttonNode && activeEl === buttonNode) return;

@@ -553,0 +556,0 @@ if (menuNode && menuNode.contains(activeEl)) return;

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

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["react","react-dom"],t):"object"==typeof exports?exports.ReactAriaMenuButton=t(require("react"),require("react-dom")):e.ReactAriaMenuButton=t(e.React,e.ReactDOM)}(this,function(e,t){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){var o=n(3);e.exports={Wrapper:n(8),Button:n(5),Menu:n(6),MenuItem:n(7),openMenu:o.openMenu,closeMenu:o.closeMenu}},function(e,t){e.exports=function(e,t,n){for(var o in t)t.hasOwnProperty(o)&&(n[o]||(e[o]=t[o]))}},function(t,n){t.exports=e},function(e,t){function n(e,t){s[e]=t}function o(e){delete s[e]}function r(e,t){var n=s[e];if(!n)throw new Error("Cannot open "+a);n.openMenu(t)}function i(e,t){var n=s[e];if(!n)throw new Error("Cannot close "+a);n.closeMenu(t)}var s={},a="a menu outside a mounted Wrapper with an id, or a menu that does not exist";e.exports={registerManager:n,unregisterManager:o,openMenu:r,closeMenu:i}},function(e,n){e.exports=t},function(e,t,n){var o=n(2),r=n(1),i={children:o.PropTypes.node.isRequired,disabled:o.PropTypes.bool,tag:o.PropTypes.string};e.exports=o.createClass({displayName:"AriaMenuButton-Button",propTypes:i,contextTypes:{ambManager:o.PropTypes.object.isRequired},getDefaultProps:function(){return{tag:"span"}},componentWillMount:function(){this.context.ambManager.button=this},componentWillUnmount:function(){this.context.ambManager.destroy()},handleKeyDown:function(e){if(!this.props.disabled){var t=this.context.ambManager;switch(e.key){case"ArrowDown":e.preventDefault(),t.isOpen?t.focusItem(0):t.openMenu({focusMenu:!0});break;case"Enter":case" ":e.preventDefault(),t.toggleMenu();break;case"Escape":t.handleMenuKey(e);break;default:t.handleButtonNonArrowKey(e)}}},handleClick:function(){this.props.disabled||this.context.ambManager.toggleMenu()},render:function(){var e=this.props,t={role:"button",tabIndex:e.disabled?"":"0","aria-haspopup":!0,"aria-expanded":this.context.ambManager.isOpen,"aria-disabled":e.disabled,onKeyDown:this.handleKeyDown,onClick:this.handleClick,onBlur:this.context.ambManager.handleBlur};return r(t,e,i),o.createElement(e.tag,t,e.children)}})},function(e,t,n){var o=n(2),r=n(4),i=n(11),s=n(1),a={children:o.PropTypes.oneOfType([o.PropTypes.func,o.PropTypes.node]).isRequired,tag:o.PropTypes.string};e.exports=o.createClass({displayName:"AriaMenuButton-Menu",propTypes:a,getDefaultProps:function(){return{tag:"div"}},contextTypes:{ambManager:o.PropTypes.object.isRequired},componentWillMount:function(){this.context.ambManager.menu=this},componentWillUpdate:function(){var e=this.context.ambManager;e.isOpen&&!this.tapListener?this.addTapListener():!e.isOpen&&this.tapListener&&(this.tapListener.remove(),delete this.tapListener),e.isOpen||e.clearItems()},componentWillUnmount:function(){this.tapListener&&this.tapListener.remove(),this.context.ambManager.destroy()},addTapListener:function(){window&&window.document&&(this.tapListener=i(document.documentElement,this.handleTap))},handleTap:function(e){r.findDOMNode(this).contains(e.target)||r.findDOMNode(this.context.ambManager.button).contains(e.target)||this.context.ambManager.closeMenu()},render:function(){var e=this.props,t=this.context.ambManager,n=function(){return"function"==typeof e.children?e.children({isOpen:t.isOpen}):!!t.isOpen&&e.children}();if(!n)return!1;var r={onKeyDown:t.handleMenuKey,role:"menu",onBlur:t.handleBlur};return s(r,e,a),o.createElement(e.tag,r,n)}})},function(e,t,n){var o=n(2),r=n(1),i={children:o.PropTypes.node.isRequired,tag:o.PropTypes.string,text:o.PropTypes.string,value:o.PropTypes.any};e.exports=o.createClass({displayName:"AriaMenuButton-MenuItem",propTypes:i,getDefaultProps:function(){return{tag:"div"}},contextTypes:{ambManager:o.PropTypes.object.isRequired},componentDidMount:function(){this.context.ambManager.addItem({node:this.node,text:this.props.text})},handleKeyDown:function(e){"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.selectItem(e))},selectItem:function(e){var t="undefined"!=typeof this.props.value?this.props.value:this.props.children;this.context.ambManager.handleSelection(t,e)},registerNode:function(e){this.node=e},render:function(){var e=this.props,t={onClick:this.selectItem,onKeyDown:this.handleKeyDown,role:"menuitem",tabIndex:"-1",ref:this.registerNode};return r(t,e,i),o.createElement(e.tag,t,e.children)}})},function(e,t,n){var o=n(2),r=n(9),i=n(1),s={children:o.PropTypes.node.isRequired,onSelection:o.PropTypes.func.isRequired,closeOnSelection:o.PropTypes.bool,tag:o.PropTypes.string};e.exports=o.createClass({displayName:"AriaMenuButton-Wrapper",propTypes:s,getDefaultProps:function(){return{tag:"div"}},childContextTypes:{ambManager:o.PropTypes.object},getChildContext:function(){return{ambManager:this.manager}},componentWillMount:function(){this.manager=r({onSelection:this.props.onSelection,closeOnSelection:this.props.closeOnSelection,id:this.props.id})},render:function(){var e=this.props,t={};return i(t,e,s),o.createElement(e.tag,t,e.children)}})},function(e,t,n){function o(){var e=this;e.blurTimer=setTimeout(function(){var t=document.activeElement,n=s.findDOMNode(e.button),o=s.findDOMNode(e.menu);n&&t===n||o&&o.contains(t)||e.isOpen&&e.closeMenu({focusButton:!1})},0)}function r(e,t){this.options.closeOnSelection&&this.closeMenu({focusButton:!0}),this.options.onSelection(e,t)}function i(e){this.isOpen&&"Escape"===e.key&&(e.preventDefault(),this.closeMenu({focusButton:!0}))}var s=n(4),a=n(10),u=n(3),c={wrap:!0,stringSearch:!0},p={init:function(e){this.options=e||{},"undefined"==typeof this.options.closeOnSelection&&(this.options.closeOnSelection=!0),this.options.id&&u.registerManager(this.options.id,this),this.handleBlur=o.bind(this),this.handleSelection=r.bind(this),this.handleMenuKey=i.bind(this),this.focusGroup=a(c),this.button=null,this.menu=null,this.isOpen=!1},focusItem:function(e){this.focusGroup.focusNodeAtIndex(e)},addItem:function(e){this.focusGroup.addMember(e)},clearItems:function(){this.focusGroup.clearMembers()},handleButtonNonArrowKey:function(e){this.focusGroup._handleNonArrowKey(e)},destroy:function(){this.button=null,this.menu=null,this.focusGroup.deactivate(),clearTimeout(this.blurTimer),clearTimeout(this.moveFocusTimer)},update:function(){this.menu.setState({isOpen:this.isOpen}),this.button.setState({menuOpen:this.isOpen})},openMenu:function(e){if(!this.isOpen&&(e=e||{},this.isOpen=!0,this.update(),this.focusGroup.activate(),e.focusMenu)){var t=this;this.moveFocusTimer=setTimeout(function(){t.focusItem(0)},0)}},closeMenu:function(e){this.isOpen&&(e=e||{},this.isOpen=!1,this.update(),e.focusButton&&s.findDOMNode(this.button).focus())},toggleMenu:function(){this.isOpen?this.closeMenu():this.openMenu()}};e.exports=function(e){var t=Object.create(p);return t.init(e),t}},function(e,t){function n(e){e=e||{},this._settings={forwardArrows:e.forwardArrows||["down"],backArrows:e.backArrows||["up"],wrap:e.wrap,stringSearch:e.stringSearch,stringSearchDelay:800},this._searchString="",this._members=[],e.members&&this.setMembers(e.members),this._boundHandleKeydownEvent=this._handleKeydownEvent.bind(this)}function o(e){return"ArrowUp"===e.key||38===e.keyCode?"up":"ArrowDown"===e.key||40===e.keyCode?"down":"ArrowLeft"===e.key||37===e.keyCode?"left":"ArrowRight"===e.key||39===e.keyCode?"right":null}function r(e){return e>=65&&e<=90}function i(e){e&&e.focus&&(e.focus(),"input"===e.tagName.toLowerCase()&&e.select())}n.prototype.activate=function(){return document.addEventListener("keydown",this._boundHandleKeydownEvent,!0),this},n.prototype.deactivate=function(){return document.removeEventListener("keydown",this._boundHandleKeydownEvent,!0),this._clearSearchStringRefreshTimer(),this},n.prototype._handleKeydownEvent=function(e){var t=this._getActiveElementIndex();if(t!==-1){var n=o(e);return n?this._settings.forwardArrows.indexOf(n)!==-1?(e.preventDefault(),void this.moveFocusForward()):this._settings.backArrows.indexOf(n)!==-1?(e.preventDefault(),void this.moveFocusBack()):void 0:void this._handleNonArrowKey(e)}},n.prototype.moveFocusForward=function(){var e,t=this._getActiveElementIndex();return e=t<this._members.length-1?t+1:this._settings.wrap?0:t,this.focusNodeAtIndex(e),e},n.prototype.moveFocusBack=function(){var e,t=this._getActiveElementIndex();return e=t>0?t-1:this._settings.wrap?this._members.length-1:t,this.focusNodeAtIndex(e),e},n.prototype._handleNonArrowKey=function(e){if(this._settings.stringSearch){if(""!==this._searchString&&(" "===e.key||32===e.keyCode))return e.preventDefault(),-1;if(!r(e.keyCode))return-1;if(e.ctrlKey||e.metaKey||e.altKey)return-1;e.preventDefault(),this._addToSearchString(String.fromCharCode(e.keyCode)),this._runStringSearch()}},n.prototype._clearSearchString=function(){this._searchString=""},n.prototype._addToSearchString=function(e){this._searchString+=e.toLowerCase()},n.prototype._startSearchStringRefreshTimer=function(){var e=this;this._clearSearchStringRefreshTimer(),this._stringSearchTimer=setTimeout(function(){e._clearSearchString()},this._settings.stringSearchDelay)},n.prototype._clearSearchStringRefreshTimer=function(){clearTimeout(this._stringSearchTimer)},n.prototype._runStringSearch=function(){this._startSearchStringRefreshTimer(),this.moveFocusByString(this._searchString)},n.prototype.moveFocusByString=function(e){for(var t,n=0,o=this._members.length;n<o;n++)if(t=this._members[n],t.text&&0===t.text.indexOf(e))return i(t.node)},n.prototype._findIndexOfNode=function(e){for(var t=0,n=this._members.length;t<n;t++)if(this._members[t].node===e)return t;return-1},n.prototype._getActiveElementIndex=function(){return this._findIndexOfNode(document.activeElement)},n.prototype.focusNodeAtIndex=function(e){var t=this._members[e];return t&&i(t.node),this},n.prototype.addMember=function(e,t){var n=e.node||e,o=e.text||n.getAttribute("data-focus-group-text")||n.textContent||"";this._checkNode(n);var r=o.replace(/[\W_]/g,"").toLowerCase(),e={node:n,text:r};return null!==t&&void 0!==t?this._members.splice(t,0,e):this._members.push(e),this},n.prototype.removeMember=function(e){var t="number"==typeof e?e:this._findIndexOfNode(e);if(t!==-1)return this._members.splice(t,1),this},n.prototype.clearMembers=function(){return this._members=[],this},n.prototype.setMembers=function(e){this.clearMembers();for(var t=0,n=e.length;t<n;t++)this.addMember(e[t]);return this},n.prototype.getMembers=function(){return this._members},n.prototype._checkNode=function(e){if(!e.nodeType||e.nodeType!==window.Node.ELEMENT_NODE)throw new Error("focus-group: only DOM nodes allowed");return e},e.exports=function(e){return new n(e)}},function(e,t){e.exports=function(e,t,n){function o(e){f||t(e)}function r(t){f=!0,d||(d=!0,e.addEventListener("touchmove",i,n),e.addEventListener("touchend",s,n),e.addEventListener("touchcancel",a,n),l=!1,p=t.touches[0].clientX,h=t.touches[0].clientY)}function i(e){l||Math.abs(e.touches[0].clientX-p)<=10&&Math.abs(e.touches[0].clientY-h)<=10||(l=!0)}function s(e){d=!1,u(),l||t(e)}function a(){d=!1,l=!1,p=0,h=0}function u(){e.removeEventListener("touchmove",i,n),e.removeEventListener("touchend",s,n),e.removeEventListener("touchcancel",a,n)}function c(){e.removeEventListener("click",o,n),e.removeEventListener("touchstart",r,n),u()}var p=0,h=0,d=!1,l=!1,f=!1;return e.addEventListener("click",o,n),e.addEventListener("touchstart",r,n),{remove:c}}}])});
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["react","react-dom"],t):"object"==typeof exports?exports.ReactAriaMenuButton=t(require("react"),require("react-dom")):e.ReactAriaMenuButton=t(e.React,e.ReactDOM)}(this,function(e,t){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){var o=n(3);e.exports={Wrapper:n(8),Button:n(5),Menu:n(6),MenuItem:n(7),openMenu:o.openMenu,closeMenu:o.closeMenu}},function(e,t){e.exports=function(e,t,n){for(var o in t)t.hasOwnProperty(o)&&(n[o]||(e[o]=t[o]))}},function(t,n){t.exports=e},function(e,t){function n(e,t){s[e]=t}function o(e){delete s[e]}function r(e,t){var n=s[e];if(!n)throw new Error("Cannot open "+a);n.openMenu(t)}function i(e,t){var n=s[e];if(!n)throw new Error("Cannot close "+a);n.closeMenu(t)}var s={},a="a menu outside a mounted Wrapper with an id, or a menu that does not exist";e.exports={registerManager:n,unregisterManager:o,openMenu:r,closeMenu:i}},function(e,n){e.exports=t},function(e,t,n){var o=n(2),r=n(1),i={children:o.PropTypes.node.isRequired,disabled:o.PropTypes.bool,tag:o.PropTypes.string};e.exports=o.createClass({displayName:"AriaMenuButton-Button",propTypes:i,contextTypes:{ambManager:o.PropTypes.object.isRequired},getDefaultProps:function(){return{tag:"span"}},componentWillMount:function(){this.context.ambManager.button=this},componentWillUnmount:function(){this.context.ambManager.destroy()},handleKeyDown:function(e){if(!this.props.disabled){var t=this.context.ambManager;switch(e.key){case"ArrowDown":e.preventDefault(),t.isOpen?t.focusItem(0):t.openMenu({focusMenu:!0});break;case"Enter":case" ":e.preventDefault(),t.toggleMenu();break;case"Escape":t.handleMenuKey(e);break;default:t.handleButtonNonArrowKey(e)}}},handleClick:function(){this.props.disabled||this.context.ambManager.toggleMenu()},render:function(){var e=this.props,t={role:"button",tabIndex:e.disabled?"":"0","aria-haspopup":!0,"aria-expanded":this.context.ambManager.isOpen,"aria-disabled":e.disabled,onKeyDown:this.handleKeyDown,onClick:this.handleClick,onBlur:this.context.ambManager.handleBlur};return r(t,e,i),o.createElement(e.tag,t,e.children)}})},function(e,t,n){var o=n(2),r=n(4),i=n(11),s=n(1),a={children:o.PropTypes.oneOfType([o.PropTypes.func,o.PropTypes.node]).isRequired,tag:o.PropTypes.string};e.exports=o.createClass({displayName:"AriaMenuButton-Menu",propTypes:a,getDefaultProps:function(){return{tag:"div"}},contextTypes:{ambManager:o.PropTypes.object.isRequired},componentWillMount:function(){this.context.ambManager.menu=this},componentDidUpdate:function(){var e=this.context.ambManager;e.isOpen&&!this.tapListener?this.addTapListener():!e.isOpen&&this.tapListener&&(this.tapListener.remove(),delete this.tapListener),e.isOpen||e.clearItems()},componentWillUnmount:function(){this.tapListener&&this.tapListener.remove(),this.context.ambManager.destroy()},addTapListener:function(){var e=r.findDOMNode(this);if(e){var t=e.ownerDocument;t&&(this.tapListener=i(t.documentElement,this.handleTap))}},handleTap:function(e){r.findDOMNode(this).contains(e.target)||r.findDOMNode(this.context.ambManager.button).contains(e.target)||this.context.ambManager.closeMenu()},render:function(){var e=this.props,t=this.context.ambManager,n=function(){return"function"==typeof e.children?e.children({isOpen:t.isOpen}):!!t.isOpen&&e.children}();if(!n)return!1;var r={onKeyDown:t.handleMenuKey,role:"menu",onBlur:t.handleBlur};return s(r,e,a),o.createElement(e.tag,r,n)}})},function(e,t,n){var o=n(2),r=n(1),i={children:o.PropTypes.node.isRequired,tag:o.PropTypes.string,text:o.PropTypes.string,value:o.PropTypes.any};e.exports=o.createClass({displayName:"AriaMenuButton-MenuItem",propTypes:i,getDefaultProps:function(){return{tag:"div"}},contextTypes:{ambManager:o.PropTypes.object.isRequired},componentDidMount:function(){this.context.ambManager.addItem({node:this.node,text:this.props.text})},handleKeyDown:function(e){"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.selectItem(e))},selectItem:function(e){var t="undefined"!=typeof this.props.value?this.props.value:this.props.children;this.context.ambManager.handleSelection(t,e)},registerNode:function(e){this.node=e},render:function(){var e=this.props,t={onClick:this.selectItem,onKeyDown:this.handleKeyDown,role:"menuitem",tabIndex:"-1",ref:this.registerNode};return r(t,e,i),o.createElement(e.tag,t,e.children)}})},function(e,t,n){var o=n(2),r=n(9),i=n(1),s={children:o.PropTypes.node.isRequired,onSelection:o.PropTypes.func.isRequired,closeOnSelection:o.PropTypes.bool,tag:o.PropTypes.string};e.exports=o.createClass({displayName:"AriaMenuButton-Wrapper",propTypes:s,getDefaultProps:function(){return{tag:"div"}},childContextTypes:{ambManager:o.PropTypes.object},getChildContext:function(){return{ambManager:this.manager}},componentWillMount:function(){this.manager=r({onSelection:this.props.onSelection,closeOnSelection:this.props.closeOnSelection,id:this.props.id})},render:function(){var e=this.props,t={};return i(t,e,s),o.createElement(e.tag,t,e.children)}})},function(e,t,n){function o(){var e=this;e.blurTimer=setTimeout(function(){var t=s.findDOMNode(e.button),n=s.findDOMNode(e.menu),o=t.ownerDocument.activeElement;t&&o===t||n&&n.contains(o)||e.isOpen&&e.closeMenu({focusButton:!1})},0)}function r(e,t){this.options.closeOnSelection&&this.closeMenu({focusButton:!0}),this.options.onSelection(e,t)}function i(e){this.isOpen&&"Escape"===e.key&&(e.preventDefault(),this.closeMenu({focusButton:!0}))}var s=n(4),a=n(10),u=n(3),c={wrap:!0,stringSearch:!0},p={init:function(e){this.options=e||{},"undefined"==typeof this.options.closeOnSelection&&(this.options.closeOnSelection=!0),this.options.id&&u.registerManager(this.options.id,this),this.handleBlur=o.bind(this),this.handleSelection=r.bind(this),this.handleMenuKey=i.bind(this),this.focusGroup=a(c),this.button=null,this.menu=null,this.isOpen=!1},focusItem:function(e){this.focusGroup.focusNodeAtIndex(e)},addItem:function(e){this.focusGroup.addMember(e)},clearItems:function(){this.focusGroup.clearMembers()},handleButtonNonArrowKey:function(e){this.focusGroup._handleNonArrowKey(e)},destroy:function(){this.button=null,this.menu=null,this.focusGroup.deactivate(),clearTimeout(this.blurTimer),clearTimeout(this.moveFocusTimer)},update:function(){this.menu.setState({isOpen:this.isOpen}),this.button.setState({menuOpen:this.isOpen})},openMenu:function(e){if(!this.isOpen&&(e=e||{},this.isOpen=!0,this.update(),this.focusGroup.activate(),e.focusMenu)){var t=this;this.moveFocusTimer=setTimeout(function(){t.focusItem(0)},0)}},closeMenu:function(e){this.isOpen&&(e=e||{},this.isOpen=!1,this.update(),e.focusButton&&s.findDOMNode(this.button).focus())},toggleMenu:function(){this.isOpen?this.closeMenu():this.openMenu()}};e.exports=function(e){var t=Object.create(p);return t.init(e),t}},function(e,t){function n(e){e=e||{},this._settings={forwardArrows:e.forwardArrows||["down"],backArrows:e.backArrows||["up"],wrap:e.wrap,stringSearch:e.stringSearch,stringSearchDelay:800},this._searchString="",this._members=[],e.members&&this.setMembers(e.members),this._boundHandleKeydownEvent=this._handleKeydownEvent.bind(this)}function o(e){return"ArrowUp"===e.key||38===e.keyCode?"up":"ArrowDown"===e.key||40===e.keyCode?"down":"ArrowLeft"===e.key||37===e.keyCode?"left":"ArrowRight"===e.key||39===e.keyCode?"right":null}function r(e){return e>=65&&e<=90}function i(e){e&&e.focus&&(e.focus(),"input"===e.tagName.toLowerCase()&&e.select())}n.prototype.activate=function(){return document.addEventListener("keydown",this._boundHandleKeydownEvent,!0),this},n.prototype.deactivate=function(){return document.removeEventListener("keydown",this._boundHandleKeydownEvent,!0),this._clearSearchStringRefreshTimer(),this},n.prototype._handleKeydownEvent=function(e){var t=this._getActiveElementIndex();if(t!==-1){var n=o(e);return n?this._settings.forwardArrows.indexOf(n)!==-1?(e.preventDefault(),void this.moveFocusForward()):this._settings.backArrows.indexOf(n)!==-1?(e.preventDefault(),void this.moveFocusBack()):void 0:void this._handleNonArrowKey(e)}},n.prototype.moveFocusForward=function(){var e,t=this._getActiveElementIndex();return e=t<this._members.length-1?t+1:this._settings.wrap?0:t,this.focusNodeAtIndex(e),e},n.prototype.moveFocusBack=function(){var e,t=this._getActiveElementIndex();return e=t>0?t-1:this._settings.wrap?this._members.length-1:t,this.focusNodeAtIndex(e),e},n.prototype._handleNonArrowKey=function(e){if(this._settings.stringSearch){if(""!==this._searchString&&(" "===e.key||32===e.keyCode))return e.preventDefault(),-1;if(!r(e.keyCode))return-1;if(e.ctrlKey||e.metaKey||e.altKey)return-1;e.preventDefault(),this._addToSearchString(String.fromCharCode(e.keyCode)),this._runStringSearch()}},n.prototype._clearSearchString=function(){this._searchString=""},n.prototype._addToSearchString=function(e){this._searchString+=e.toLowerCase()},n.prototype._startSearchStringRefreshTimer=function(){var e=this;this._clearSearchStringRefreshTimer(),this._stringSearchTimer=setTimeout(function(){e._clearSearchString()},this._settings.stringSearchDelay)},n.prototype._clearSearchStringRefreshTimer=function(){clearTimeout(this._stringSearchTimer)},n.prototype._runStringSearch=function(){this._startSearchStringRefreshTimer(),this.moveFocusByString(this._searchString)},n.prototype.moveFocusByString=function(e){for(var t,n=0,o=this._members.length;n<o;n++)if(t=this._members[n],t.text&&0===t.text.indexOf(e))return i(t.node)},n.prototype._findIndexOfNode=function(e){for(var t=0,n=this._members.length;t<n;t++)if(this._members[t].node===e)return t;return-1},n.prototype._getActiveElementIndex=function(){return this._findIndexOfNode(document.activeElement)},n.prototype.focusNodeAtIndex=function(e){var t=this._members[e];return t&&i(t.node),this},n.prototype.addMember=function(e,t){var n=e.node||e,o=e.text||n.getAttribute("data-focus-group-text")||n.textContent||"";this._checkNode(n);var r=o.replace(/[\W_]/g,"").toLowerCase(),e={node:n,text:r};return null!==t&&void 0!==t?this._members.splice(t,0,e):this._members.push(e),this},n.prototype.removeMember=function(e){var t="number"==typeof e?e:this._findIndexOfNode(e);if(t!==-1)return this._members.splice(t,1),this},n.prototype.clearMembers=function(){return this._members=[],this},n.prototype.setMembers=function(e){this.clearMembers();for(var t=0,n=e.length;t<n;t++)this.addMember(e[t]);return this},n.prototype.getMembers=function(){return this._members},n.prototype._checkNode=function(e){if(!e.nodeType||e.nodeType!==window.Node.ELEMENT_NODE)throw new Error("focus-group: only DOM nodes allowed");return e},e.exports=function(e){return new n(e)}},function(e,t){e.exports=function(e,t,n){function o(e){l||t(e)}function r(t){l=!0,d||(d=!0,e.addEventListener("touchmove",i,n),e.addEventListener("touchend",s,n),e.addEventListener("touchcancel",a,n),f=!1,p=t.touches[0].clientX,h=t.touches[0].clientY)}function i(e){f||Math.abs(e.touches[0].clientX-p)<=10&&Math.abs(e.touches[0].clientY-h)<=10||(f=!0)}function s(e){d=!1,u(),f||t(e)}function a(){d=!1,f=!1,p=0,h=0}function u(){e.removeEventListener("touchmove",i,n),e.removeEventListener("touchend",s,n),e.removeEventListener("touchcancel",a,n)}function c(){e.removeEventListener("click",o,n),e.removeEventListener("touchstart",r,n),u()}var p=0,h=0,d=!1,f=!1,l=!1;return e.addEventListener("click",o,n),e.addEventListener("touchstart",r,n),{remove:c}}}])});
SocketSocket SOC 2 Logo

Product

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

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc