react-autocomplete - npm Package Compare versions

Comparing version 1.3.1 to 1.4.0

build/lib/Autocomplete.js

@@ -329,5 +329,9 @@ 'use strict';
 
+  composeEventHandlers: function composeEventHandlers(internal, external) {
+    return external ? function (e) {
+      internal(e);external(e);
+    } : internal;
+  },
+
   render: function render() {
-    var _this5 = this;
-
     if (this.props.debug) {
@@ -341,6 +345,8 @@ // you don't like it, you love it
 
+    var inputProps = this.props.inputProps;
+
     return React.createElement(
       'div',
       _extends({ style: _extends({}, this.props.wrapperStyle) }, this.props.wrapperProps),
-      React.createElement('input', _extends({}, this.props.inputProps, {
+      React.createElement('input', _extends({}, inputProps, {
         role: 'combobox',
@@ -350,14 +356,8 @@ 'aria-autocomplete': 'list',
         ref: 'input',
-        onFocus: this.handleInputFocus,
-        onBlur: this.handleInputBlur,
-        onChange: function (event) {
-          return _this5.handleChange(event);
-        },
-        onKeyDown: function (event) {
-          return _this5.handleKeyDown(event);
-        },
-        onKeyUp: function (event) {
-          return _this5.handleKeyUp(event);
-        },
-        onClick: this.handleInputClick,
+        onFocus: this.composeEventHandlers(this.handleInputFocus, inputProps.onFocus),
+        onBlur: this.composeEventHandlers(this.handleInputBlur, inputProps.onBlur),
+        onChange: this.handleChange,
+        onKeyDown: this.composeEventHandlers(this.handleKeyDown, inputProps.onKeyDown),
+        onKeyUp: this.composeEventHandlers(this.handleKeyUp, inputProps.onKeyUp),
+        onClick: this.composeEventHandlers(this.handleInputClick, inputProps.onClick),
         value: this.props.value
@@ -364,0 +364,0 @@ })),

build/package.json

 {
   "name": "react-autocomplete",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "description": "Accessible, extensible, Autocomplete for React.js",
@@ -5,0 +5,0 @@ "main": "./build/lib/index.js",

CHANGELOG.md

@@ -7,2 +7,6 @@ # CHANGELOG
 
+## [1.4.0] - 2016-11-07
+### Added
+- Add all event handlers specified in `props.inputProps` to `<input>`
+
 ## [1.3.1] - 2016-08-01
@@ -139,3 +143,4 @@ ### Changed
 
-[Unreleased]: https://github.com/reactjs/react-autocomplete/compare/v1.3.1...HEAD
+[Unreleased]: https://github.com/reactjs/react-autocomplete/compare/v1.4.0...HEAD
+[1.4.0]: https://github.com/reactjs/react-autocomplete/compare/v1.3.1...v1.4.0
 [1.3.1]: https://github.com/reactjs/react-autocomplete/compare/v1.3.0...v1.3.1
@@ -142,0 +147,0 @@ [1.3.0]: https://github.com/reactjs/react-autocomplete/compare/v1.2.1...v1.3.0

dist/react-autocomplete.js

 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory(require("React"), require("ReactDOM"));
+		module.exports = factory(require("react"), require("react-dom"));
 	else if(typeof define === 'function' && define.amd)
-		define(["React", "ReactDOM"], factory);
+		define(["react", "react-dom"], factory);
 	else if(typeof exports === 'object')
-		exports["ReactAutocomplete"] = factory(require("React"), require("ReactDOM"));
+		exports["ReactAutocomplete"] = factory(require("react"), require("react-dom"));
 	else
@@ -401,5 +401,9 @@ root["ReactAutocomplete"] = factory(root["React"], root["ReactDOM"]);
 	
+	  composeEventHandlers: function composeEventHandlers(internal, external) {
+	    return external ? function (e) {
+	      internal(e);external(e);
+	    } : internal;
+	  },
+	
 	  render: function render() {
-	    var _this5 = this;
-	
 	    if (this.props.debug) {
@@ -413,3 +417,5 @@ // you don't like it, you love it
 	
-	    return React.createElement('div', _extends({ style: _extends({}, this.props.wrapperStyle) }, this.props.wrapperProps), React.createElement('input', _extends({}, this.props.inputProps, {
+	    var inputProps = this.props.inputProps;
+	
+	    return React.createElement('div', _extends({ style: _extends({}, this.props.wrapperStyle) }, this.props.wrapperProps), React.createElement('input', _extends({}, inputProps, {
 	      role: 'combobox',
@@ -419,14 +425,8 @@ 'aria-autocomplete': 'list',
 	      ref: 'input',
-	      onFocus: this.handleInputFocus,
-	      onBlur: this.handleInputBlur,
-	      onChange: function onChange(event) {
-	        return _this5.handleChange(event);
-	      },
-	      onKeyDown: function onKeyDown(event) {
-	        return _this5.handleKeyDown(event);
-	      },
-	      onKeyUp: function onKeyUp(event) {
-	        return _this5.handleKeyUp(event);
-	      },
-	      onClick: this.handleInputClick,
+	      onFocus: this.composeEventHandlers(this.handleInputFocus, inputProps.onFocus),
+	      onBlur: this.composeEventHandlers(this.handleInputBlur, inputProps.onBlur),
+	      onChange: this.handleChange,
+	      onKeyDown: this.composeEventHandlers(this.handleKeyDown, inputProps.onKeyDown),
+	      onKeyUp: this.composeEventHandlers(this.handleKeyUp, inputProps.onKeyUp),
+	      onClick: this.composeEventHandlers(this.handleInputClick, inputProps.onClick),
 	      value: this.props.value
@@ -433,0 +433,0 @@ })), ('open' in this.props ? this.props.open : this.state.isOpen) && this.renderMenu(), this.props.debug && React.createElement('pre', { style: { marginLeft: 300 } }, JSON.stringify(_debugStates.slice(_debugStates.length - 5, _debugStates.length), null, 2)));

dist/react-autocomplete.min.js

@@ -1,2 +0,2 @@
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("React"),require("ReactDOM")):"function"==typeof define&&define.amd?define(["React","ReactDOM"],e):"object"==typeof exports?exports.ReactAutocomplete=e(require("React"),require("ReactDOM")):t.ReactAutocomplete=e(t.React,t.ReactDOM)}(this,function(t,e){return function(t){function e(o){if(n[o])return n[o].exports;var i=n[o]={exports:{},id:o,loaded:!1};return t[o].call(i.exports,i,i.exports,e),i.loaded=!0,i.exports}var n={};return e.m=t,e.c=n,e.p="",e(0)}([function(t,e,n){"use strict";t.exports=n(1)},function(t,e,n){(function(e){"use strict";var o=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},i=n(2),r=n(3),s=r.findDOMNode,l=n(4),p=[],u=i.createClass({displayName:"Autocomplete",propTypes:{value:i.PropTypes.any,onChange:i.PropTypes.func,onSelect:i.PropTypes.func,shouldItemRender:i.PropTypes.func,sortItems:i.PropTypes.func,getItemValue:i.PropTypes.func.isRequired,renderItem:i.PropTypes.func.isRequired,renderMenu:i.PropTypes.func,menuStyle:i.PropTypes.object,inputProps:i.PropTypes.object,wrapperProps:i.PropTypes.object,wrapperStyle:i.PropTypes.object,autoHighlight:i.PropTypes.bool,onMenuVisibilityChange:i.PropTypes.func,open:i.PropTypes.bool,debug:i.PropTypes.bool},getDefaultProps:function(){return{value:"",wrapperProps:{},wrapperStyle:{display:"inline-block"},inputProps:{},onChange:function(){},onSelect:function(t,e){},renderMenu:function(t,e,n){return i.createElement("div",{style:o({},n,this.menuStyle),children:t})},shouldItemRender:function(){return!0},menuStyle:{borderRadius:"3px",boxShadow:"0 2px 12px rgba(0, 0, 0, 0.1)",background:"rgba(255, 255, 255, 0.9)",padding:"2px 0",fontSize:"90%",position:"fixed",overflow:"auto",maxHeight:"50%"},autoHighlight:!0,onMenuVisibilityChange:function(){}}},getInitialState:function(){return{isOpen:!1,highlightedIndex:null}},componentWillMount:function(){this._ignoreBlur=!1,this._performAutoCompleteOnUpdate=!1,this._performAutoCompleteOnKeyUp=!1},componentWillReceiveProps:function(t){this._performAutoCompleteOnUpdate=!0,(this.props.items!==t.items||this.state.highlightedIndex>=t.items.length)&&this.setState({highlightedIndex:null})},componentDidUpdate:function(t,e){this.state.isOpen===!0&&e.isOpen===!1&&this.setMenuPositions(),this.state.isOpen&&this._performAutoCompleteOnUpdate&&(this._performAutoCompleteOnUpdate=!1,this.maybeAutoCompleteText()),this.maybeScrollItemIntoView(),e.isOpen!==this.state.isOpen&&this.props.onMenuVisibilityChange(this.state.isOpen)},maybeScrollItemIntoView:function(){if(this.state.isOpen===!0&&null!==this.state.highlightedIndex){var t=this.refs["item-"+this.state.highlightedIndex],e=this.refs.menu;l(s(t),s(e),{onlyScrollIfNeeded:!0})}},handleKeyDown:function(t){this.keyDownHandlers[t.key]?this.keyDownHandlers[t.key].call(this,t):this.setState({highlightedIndex:null,isOpen:!0})},handleChange:function(t){this._performAutoCompleteOnKeyUp=!0,this.props.onChange(t,t.target.value)},handleKeyUp:function(){this._performAutoCompleteOnKeyUp&&(this._performAutoCompleteOnKeyUp=!1,this.maybeAutoCompleteText())},keyDownHandlers:{ArrowDown:function(t){t.preventDefault();var e=this.getFilteredItems().length;if(e){var n=this.state.highlightedIndex,o=null===n||n===e-1?0:n+1;this._performAutoCompleteOnKeyUp=!0,this.setState({highlightedIndex:o,isOpen:!0})}},ArrowUp:function(t){t.preventDefault();var e=this.getFilteredItems().length;if(e){var n=this.state.highlightedIndex,o=0===n||null===n?e-1:n-1;this._performAutoCompleteOnKeyUp=!0,this.setState({highlightedIndex:o,isOpen:!0})}},Enter:function(t){var e=this;if(this.state.isOpen!==!1)if(null==this.state.highlightedIndex)this.setState({isOpen:!1},function(){e.refs.input.select()});else{t.preventDefault();var n=this.getFilteredItems()[this.state.highlightedIndex],o=this.props.getItemValue(n);this.setState({isOpen:!1,highlightedIndex:null},function(){e.refs.input.setSelectionRange(o.length,o.length),e.props.onSelect(o,n)})}},Escape:function(t){this.setState({highlightedIndex:null,isOpen:!1})}},getFilteredItems:function(){var t=this,e=this.props.items;return this.props.shouldItemRender&&(e=e.filter(function(e){return t.props.shouldItemRender(e,t.props.value)})),this.props.sortItems&&e.sort(function(e,n){return t.props.sortItems(e,n,t.props.value)}),e},maybeAutoCompleteText:function(){if(this.props.autoHighlight&&""!==this.props.value){var t=this.state.highlightedIndex,e=this.getFilteredItems();if(0!==e.length){var n=null!==t?e[t]:e[0],o=this.props.getItemValue(n),i=0===o.toLowerCase().indexOf(this.props.value.toLowerCase());i&&null===t&&this.setState({highlightedIndex:0})}}},setMenuPositions:function(){var t=this.refs.input,n=t.getBoundingClientRect(),o=e.window.getComputedStyle(t),i=parseInt(o.marginBottom,10)||0,r=parseInt(o.marginLeft,10)||0,s=parseInt(o.marginRight,10)||0;this.setState({menuTop:n.bottom+i,menuLeft:n.left+r,menuWidth:n.width+r+s})},highlightItemFromMouse:function(t){this.setState({highlightedIndex:t})},selectItemFromMouse:function(t){var e=this,n=this.props.getItemValue(t);this.setState({isOpen:!1,highlightedIndex:null},function(){e.props.onSelect(n,t),e.refs.input.focus()})},setIgnoreBlur:function(t){this._ignoreBlur=t},renderMenu:function(){var t=this,e=this.getFilteredItems().map(function(e,n){var o=t.props.renderItem(e,t.state.highlightedIndex===n,{cursor:"default"});return i.cloneElement(o,{onMouseDown:function(){return t.setIgnoreBlur(!0)},onMouseEnter:function(){return t.highlightItemFromMouse(n)},onClick:function(){return t.selectItemFromMouse(e)},ref:"item-"+n})}),n={left:this.state.menuLeft,top:this.state.menuTop,minWidth:this.state.menuWidth},o=this.props.renderMenu(e,this.props.value,n);return i.cloneElement(o,{ref:"menu"})},handleInputBlur:function(){this._ignoreBlur||this.setState({isOpen:!1,highlightedIndex:null})},handleInputFocus:function(){return this._ignoreBlur?void this.setIgnoreBlur(!1):(this._ignoreClick=!0,void this.setState({isOpen:!0}))},isInputFocused:function(){var t=this.refs.input;return t.ownerDocument&&t===t.ownerDocument.activeElement},handleInputClick:function(){this.isInputFocused()&&this.state.isOpen===!1?this.setState({isOpen:!0}):null===this.state.highlightedIndex||this._ignoreClick||this.selectItemFromMouse(this.getFilteredItems()[this.state.highlightedIndex]),this._ignoreClick=!1},render:function(){var t=this;return this.props.debug&&p.push({id:p.length,state:this.state}),i.createElement("div",o({style:o({},this.props.wrapperStyle)},this.props.wrapperProps),i.createElement("input",o({},this.props.inputProps,{role:"combobox","aria-autocomplete":"list",autoComplete:"off",ref:"input",onFocus:this.handleInputFocus,onBlur:this.handleInputBlur,onChange:function(e){return t.handleChange(e)},onKeyDown:function(e){return t.handleKeyDown(e)},onKeyUp:function(e){return t.handleKeyUp(e)},onClick:this.handleInputClick,value:this.props.value})),("open"in this.props?this.props.open:this.state.isOpen)&&this.renderMenu(),this.props.debug&&i.createElement("pre",{style:{marginLeft:300}},JSON.stringify(p.slice(p.length-5,p.length),null,2)))}});t.exports=u}).call(e,function(){return this}())},function(e,n){e.exports=t},function(t,n){t.exports=e},function(t,e,n){t.exports=n(5)},function(t,e,n){function o(t,e,n){n=n||{},9===e.nodeType&&(e=i.getWindow(e));var o=n.allowHorizontalScroll,r=n.onlyScrollIfNeeded,s=n.alignWithTop,l=n.alignWithLeft;o=void 0===o?!0:o;var p,u,h,f,a,c,d,g,m,v,y=i.isWindow(e),w=i.offset(t),I=i.outerHeight(t),x=i.outerWidth(t);y?(d=e,v=i.height(d),m=i.width(d),g={left:i.scrollLeft(d),top:i.scrollTop(d)},a={left:w.left-g.left,top:w.top-g.top},c={left:w.left+x-(g.left+m),top:w.top+I-(g.top+v)},f=g):(p=i.offset(e),u=e.clientHeight,h=e.clientWidth,f={left:e.scrollLeft,top:e.scrollTop},a={left:w.left-(p.left+(parseFloat(i.css(e,"borderLeftWidth"))||0)),top:w.top-(p.top+(parseFloat(i.css(e,"borderTopWidth"))||0))},c={left:w.left+x-(p.left+h+(parseFloat(i.css(e,"borderRightWidth"))||0)),top:w.top+I-(p.top+u+(parseFloat(i.css(e,"borderBottomWidth"))||0))}),a.top<0||c.top>0?s===!0?i.scrollTop(e,f.top+a.top):s===!1?i.scrollTop(e,f.top+c.top):a.top<0?i.scrollTop(e,f.top+a.top):i.scrollTop(e,f.top+c.top):r||(s=void 0===s?!0:!!s,s?i.scrollTop(e,f.top+a.top):i.scrollTop(e,f.top+c.top)),o&&(a.left<0||c.left>0?l===!0?i.scrollLeft(e,f.left+a.left):l===!1?i.scrollLeft(e,f.left+c.left):a.left<0?i.scrollLeft(e,f.left+a.left):i.scrollLeft(e,f.left+c.left):r||(l=void 0===l?!0:!!l,l?i.scrollLeft(e,f.left+a.left):i.scrollLeft(e,f.left+c.left)))}var i=n(6);t.exports=o},function(t,e){function n(t){var e,n,o,i=t.ownerDocument,r=i.body,s=i&&i.documentElement;return e=t.getBoundingClientRect(),n=e.left,o=e.top,n-=s.clientLeft||r.clientLeft||0,o-=s.clientTop||r.clientTop||0,{left:n,top:o}}function o(t,e){var n=t["page"+(e?"Y":"X")+"Offset"],o="scroll"+(e?"Top":"Left");if("number"!=typeof n){var i=t.document;n=i.documentElement[o],"number"!=typeof n&&(n=i.body[o])}return n}function i(t){return o(t)}function r(t){return o(t,!0)}function s(t){var e=n(t),o=t.ownerDocument,s=o.defaultView||o.parentWindow;return e.left+=i(s),e.top+=r(s),e}function l(t,e,n){var o="",i=t.ownerDocument;return(n=n||i.defaultView.getComputedStyle(t,null))&&(o=n.getPropertyValue(e)||n[e]),o}function p(t,e){var n=t[T]&&t[T][e];if(x.test(n)&&!b.test(e)){var o=t.style,i=o[O],r=t[S][O];t[S][O]=t[T][O],o[O]="fontSize"===e?"1em":n||0,n=o.pixelLeft+C,o[O]=i,t[S][O]=r}return""===n?"auto":n}function u(t,e){"static"===v(t,"position")&&(t.style.position="relative");var n,o,i=s(t),r={};for(o in e)n=parseFloat(v(t,o))||0,r[o]=n+e[o]-i[o];v(t,r)}function h(t,e){for(var n=0;n<t.length;n++)e(t[n])}function f(t){return"border-box"===w(t,"boxSizing")}function a(t,e,n){var o,i={},r=t.style;for(o in e)i[o]=r[o],r[o]=e[o];n.call(t);for(o in e)r[o]=i[o]}function c(t,e,n){var o,i,r,s=0;for(i=0;i<e.length;i++)if(o=e[i])for(r=0;r<n.length;r++){var l;l="border"===o?o+n[r]+"Width":o+n[r],s+=parseFloat(w(t,l))||0}return s}function d(t){return null!=t&&t==t.window}function g(t,e,n){if(d(t))return"width"===e?D.viewportWidth(t):D.viewportHeight(t);if(9===t.nodeType)return"width"===e?D.docWidth(t):D.docHeight(t);var o="width"===e?["Left","Right"]:["Top","Bottom"],i="width"===e?t.offsetWidth:t.offsetHeight,r=w(t),s=f(t,r),l=0;(null==i||0>=i)&&(i=void 0,l=w(t,e),(null==l||Number(l)<0)&&(l=t.style[e]||0),l=parseFloat(l)||0),void 0===n&&(n=s?L:R);var p=void 0!==i||s,u=i||l;return n===R?p?u-c(t,["border","padding"],o,r):l:p?u+(n===L?0:n===W?-c(t,["border"],o,r):c(t,["margin"],o,r)):l+c(t,P.slice(n),o,r)}function m(t){var e,n=arguments;return 0!==t.offsetWidth?e=g.apply(void 0,n):a(t,F,function(){e=g.apply(void 0,n)}),e}function v(t,e,n){if("object"!=typeof e)return"undefined"==typeof n?w(t,e):("number"==typeof n&&(n+="px"),void(t.style[e]=n));for(var o in e)v(t,o,e[o])}function y(t,e){for(var n in e)t[n]=e[n];return t}var w,I=/[\-+]?(?:\d*\.|)\d+(?:[eE][\-+]?\d+|)/.source,x=new RegExp("^("+I+")(?!px)[a-z%]+$","i"),b=/^(top|right|bottom|left)$/,T="currentStyle",S="runtimeStyle",O="left",C="px";"undefined"!=typeof window&&(w=window.getComputedStyle?l:p);var P=["margin","border","padding"],R=-1,W=2,L=1,M=0,D={};h(["Width","Height"],function(t){D["doc"+t]=function(e){var n=e.document;return Math.max(n.documentElement["scroll"+t],n.body["scroll"+t],D["viewport"+t](n))},D["viewport"+t]=function(e){var n="client"+t,o=e.document,i=o.body,r=o.documentElement,s=r[n];return"CSS1Compat"===o.compatMode&&s||i&&i[n]||s}});var F={position:"absolute",visibility:"hidden",display:"block"};h(["width","height"],function(t){var e=t.charAt(0).toUpperCase()+t.slice(1);D["outer"+e]=function(e,n){return e&&m(e,t,n?M:L)};var n="width"===t?["Left","Right"]:["Top","Bottom"];D[t]=function(e,o){if(void 0===o)return e&&m(e,t,R);if(e){var i=w(e),r=f(e);return r&&(o+=c(e,["padding","border"],n,i)),v(e,t,o)}}});var A=t.exports={getWindow:function(t){var e=t.ownerDocument||t;return e.defaultView||e.parentWindow},offset:function(t,e){return"undefined"==typeof e?s(t):void u(t,e)},isWindow:d,each:h,css:v,clone:function(t){var e={};for(var n in t)e[n]=t[n];var o=t.overflow;if(o)for(n in t)e.overflow[n]=t.overflow[n];return e},mix:y,scrollLeft:function(t,e){if(d(t)){if(void 0===e)return i(t);window.scrollTo(e,r(t))}else{if(void 0===e)return t.scrollLeft;t.scrollLeft=e}},scrollTop:function(t,e){if(d(t)){if(void 0===e)return r(t);window.scrollTo(i(t),e)}else{if(void 0===e)return t.scrollTop;t.scrollTop=e}},merge:function(){for(var t={},e=0;e<arguments.length;e++)A.mix(t,arguments[e]);return t},viewportWidth:0,viewportHeight:0};y(A,D)}])});
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["react","react-dom"],e):"object"==typeof exports?exports.ReactAutocomplete=e(require("react"),require("react-dom")):t.ReactAutocomplete=e(t.React,t.ReactDOM)}(this,function(t,e){return function(t){function e(n){if(o[n])return o[n].exports;var i=o[n]={exports:{},id:n,loaded:!1};return t[n].call(i.exports,i,i.exports,e),i.loaded=!0,i.exports}var o={};return e.m=t,e.c=o,e.p="",e(0)}([function(t,e,o){"use strict";t.exports=o(1)},function(t,e,o){(function(e){"use strict";var n=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var o=arguments[e];for(var n in o)Object.prototype.hasOwnProperty.call(o,n)&&(t[n]=o[n])}return t},i=o(2),r=o(3),s=r.findDOMNode,l=o(4),p=[],u=i.createClass({displayName:"Autocomplete",propTypes:{value:i.PropTypes.any,onChange:i.PropTypes.func,onSelect:i.PropTypes.func,shouldItemRender:i.PropTypes.func,sortItems:i.PropTypes.func,getItemValue:i.PropTypes.func.isRequired,renderItem:i.PropTypes.func.isRequired,renderMenu:i.PropTypes.func,menuStyle:i.PropTypes.object,inputProps:i.PropTypes.object,wrapperProps:i.PropTypes.object,wrapperStyle:i.PropTypes.object,autoHighlight:i.PropTypes.bool,onMenuVisibilityChange:i.PropTypes.func,open:i.PropTypes.bool,debug:i.PropTypes.bool},getDefaultProps:function(){return{value:"",wrapperProps:{},wrapperStyle:{display:"inline-block"},inputProps:{},onChange:function(){},onSelect:function(t,e){},renderMenu:function(t,e,o){return i.createElement("div",{style:n({},o,this.menuStyle),children:t})},shouldItemRender:function(){return!0},menuStyle:{borderRadius:"3px",boxShadow:"0 2px 12px rgba(0, 0, 0, 0.1)",background:"rgba(255, 255, 255, 0.9)",padding:"2px 0",fontSize:"90%",position:"fixed",overflow:"auto",maxHeight:"50%"},autoHighlight:!0,onMenuVisibilityChange:function(){}}},getInitialState:function(){return{isOpen:!1,highlightedIndex:null}},componentWillMount:function(){this._ignoreBlur=!1,this._performAutoCompleteOnUpdate=!1,this._performAutoCompleteOnKeyUp=!1},componentWillReceiveProps:function(t){this._performAutoCompleteOnUpdate=!0,(this.props.items!==t.items||this.state.highlightedIndex>=t.items.length)&&this.setState({highlightedIndex:null})},componentDidUpdate:function(t,e){this.state.isOpen===!0&&e.isOpen===!1&&this.setMenuPositions(),this.state.isOpen&&this._performAutoCompleteOnUpdate&&(this._performAutoCompleteOnUpdate=!1,this.maybeAutoCompleteText()),this.maybeScrollItemIntoView(),e.isOpen!==this.state.isOpen&&this.props.onMenuVisibilityChange(this.state.isOpen)},maybeScrollItemIntoView:function(){if(this.state.isOpen===!0&&null!==this.state.highlightedIndex){var t=this.refs["item-"+this.state.highlightedIndex],e=this.refs.menu;l(s(t),s(e),{onlyScrollIfNeeded:!0})}},handleKeyDown:function(t){this.keyDownHandlers[t.key]?this.keyDownHandlers[t.key].call(this,t):this.setState({highlightedIndex:null,isOpen:!0})},handleChange:function(t){this._performAutoCompleteOnKeyUp=!0,this.props.onChange(t,t.target.value)},handleKeyUp:function(){this._performAutoCompleteOnKeyUp&&(this._performAutoCompleteOnKeyUp=!1,this.maybeAutoCompleteText())},keyDownHandlers:{ArrowDown:function(t){t.preventDefault();var e=this.getFilteredItems().length;if(e){var o=this.state.highlightedIndex,n=null===o||o===e-1?0:o+1;this._performAutoCompleteOnKeyUp=!0,this.setState({highlightedIndex:n,isOpen:!0})}},ArrowUp:function(t){t.preventDefault();var e=this.getFilteredItems().length;if(e){var o=this.state.highlightedIndex,n=0===o||null===o?e-1:o-1;this._performAutoCompleteOnKeyUp=!0,this.setState({highlightedIndex:n,isOpen:!0})}},Enter:function(t){var e=this;if(this.state.isOpen!==!1)if(null==this.state.highlightedIndex)this.setState({isOpen:!1},function(){e.refs.input.select()});else{t.preventDefault();var o=this.getFilteredItems()[this.state.highlightedIndex],n=this.props.getItemValue(o);this.setState({isOpen:!1,highlightedIndex:null},function(){e.refs.input.setSelectionRange(n.length,n.length),e.props.onSelect(n,o)})}},Escape:function(t){this.setState({highlightedIndex:null,isOpen:!1})}},getFilteredItems:function(){var t=this,e=this.props.items;return this.props.shouldItemRender&&(e=e.filter(function(e){return t.props.shouldItemRender(e,t.props.value)})),this.props.sortItems&&e.sort(function(e,o){return t.props.sortItems(e,o,t.props.value)}),e},maybeAutoCompleteText:function(){if(this.props.autoHighlight&&""!==this.props.value){var t=this.state.highlightedIndex,e=this.getFilteredItems();if(0!==e.length){var o=null!==t?e[t]:e[0],n=this.props.getItemValue(o),i=0===n.toLowerCase().indexOf(this.props.value.toLowerCase());i&&null===t&&this.setState({highlightedIndex:0})}}},setMenuPositions:function(){var t=this.refs.input,o=t.getBoundingClientRect(),n=e.window.getComputedStyle(t),i=parseInt(n.marginBottom,10)||0,r=parseInt(n.marginLeft,10)||0,s=parseInt(n.marginRight,10)||0;this.setState({menuTop:o.bottom+i,menuLeft:o.left+r,menuWidth:o.width+r+s})},highlightItemFromMouse:function(t){this.setState({highlightedIndex:t})},selectItemFromMouse:function(t){var e=this,o=this.props.getItemValue(t);this.setState({isOpen:!1,highlightedIndex:null},function(){e.props.onSelect(o,t),e.refs.input.focus()})},setIgnoreBlur:function(t){this._ignoreBlur=t},renderMenu:function(){var t=this,e=this.getFilteredItems().map(function(e,o){var n=t.props.renderItem(e,t.state.highlightedIndex===o,{cursor:"default"});return i.cloneElement(n,{onMouseDown:function(){return t.setIgnoreBlur(!0)},onMouseEnter:function(){return t.highlightItemFromMouse(o)},onClick:function(){return t.selectItemFromMouse(e)},ref:"item-"+o})}),o={left:this.state.menuLeft,top:this.state.menuTop,minWidth:this.state.menuWidth},n=this.props.renderMenu(e,this.props.value,o);return i.cloneElement(n,{ref:"menu"})},handleInputBlur:function(){this._ignoreBlur||this.setState({isOpen:!1,highlightedIndex:null})},handleInputFocus:function(){return this._ignoreBlur?void this.setIgnoreBlur(!1):(this._ignoreClick=!0,void this.setState({isOpen:!0}))},isInputFocused:function(){var t=this.refs.input;return t.ownerDocument&&t===t.ownerDocument.activeElement},handleInputClick:function(){this.isInputFocused()&&this.state.isOpen===!1?this.setState({isOpen:!0}):null===this.state.highlightedIndex||this._ignoreClick||this.selectItemFromMouse(this.getFilteredItems()[this.state.highlightedIndex]),this._ignoreClick=!1},composeEventHandlers:function(t,e){return e?function(o){t(o),e(o)}:t},render:function(){this.props.debug&&p.push({id:p.length,state:this.state});var t=this.props.inputProps;return i.createElement("div",n({style:n({},this.props.wrapperStyle)},this.props.wrapperProps),i.createElement("input",n({},t,{role:"combobox","aria-autocomplete":"list",autoComplete:"off",ref:"input",onFocus:this.composeEventHandlers(this.handleInputFocus,t.onFocus),onBlur:this.composeEventHandlers(this.handleInputBlur,t.onBlur),onChange:this.handleChange,onKeyDown:this.composeEventHandlers(this.handleKeyDown,t.onKeyDown),onKeyUp:this.composeEventHandlers(this.handleKeyUp,t.onKeyUp),onClick:this.composeEventHandlers(this.handleInputClick,t.onClick),value:this.props.value})),("open"in this.props?this.props.open:this.state.isOpen)&&this.renderMenu(),this.props.debug&&i.createElement("pre",{style:{marginLeft:300}},JSON.stringify(p.slice(p.length-5,p.length),null,2)))}});t.exports=u}).call(e,function(){return this}())},function(e,o){e.exports=t},function(t,o){t.exports=e},function(t,e,o){t.exports=o(5)},function(t,e,o){function n(t,e,o){o=o||{},9===e.nodeType&&(e=i.getWindow(e));var n=o.allowHorizontalScroll,r=o.onlyScrollIfNeeded,s=o.alignWithTop,l=o.alignWithLeft;n=void 0===n?!0:n;var p,u,h,a,f,c,d,m,g,v,y=i.isWindow(e),w=i.offset(t),I=i.outerHeight(t),x=i.outerWidth(t);y?(d=e,v=i.height(d),g=i.width(d),m={left:i.scrollLeft(d),top:i.scrollTop(d)},f={left:w.left-m.left,top:w.top-m.top},c={left:w.left+x-(m.left+g),top:w.top+I-(m.top+v)},a=m):(p=i.offset(e),u=e.clientHeight,h=e.clientWidth,a={left:e.scrollLeft,top:e.scrollTop},f={left:w.left-(p.left+(parseFloat(i.css(e,"borderLeftWidth"))||0)),top:w.top-(p.top+(parseFloat(i.css(e,"borderTopWidth"))||0))},c={left:w.left+x-(p.left+h+(parseFloat(i.css(e,"borderRightWidth"))||0)),top:w.top+I-(p.top+u+(parseFloat(i.css(e,"borderBottomWidth"))||0))}),f.top<0||c.top>0?s===!0?i.scrollTop(e,a.top+f.top):s===!1?i.scrollTop(e,a.top+c.top):f.top<0?i.scrollTop(e,a.top+f.top):i.scrollTop(e,a.top+c.top):r||(s=void 0===s?!0:!!s,s?i.scrollTop(e,a.top+f.top):i.scrollTop(e,a.top+c.top)),n&&(f.left<0||c.left>0?l===!0?i.scrollLeft(e,a.left+f.left):l===!1?i.scrollLeft(e,a.left+c.left):f.left<0?i.scrollLeft(e,a.left+f.left):i.scrollLeft(e,a.left+c.left):r||(l=void 0===l?!0:!!l,l?i.scrollLeft(e,a.left+f.left):i.scrollLeft(e,a.left+c.left)))}var i=o(6);t.exports=n},function(t,e){function o(t){var e,o,n,i=t.ownerDocument,r=i.body,s=i&&i.documentElement;return e=t.getBoundingClientRect(),o=e.left,n=e.top,o-=s.clientLeft||r.clientLeft||0,n-=s.clientTop||r.clientTop||0,{left:o,top:n}}function n(t,e){var o=t["page"+(e?"Y":"X")+"Offset"],n="scroll"+(e?"Top":"Left");if("number"!=typeof o){var i=t.document;o=i.documentElement[n],"number"!=typeof o&&(o=i.body[n])}return o}function i(t){return n(t)}function r(t){return n(t,!0)}function s(t){var e=o(t),n=t.ownerDocument,s=n.defaultView||n.parentWindow;return e.left+=i(s),e.top+=r(s),e}function l(t,e,o){var n="",i=t.ownerDocument;return(o=o||i.defaultView.getComputedStyle(t,null))&&(n=o.getPropertyValue(e)||o[e]),n}function p(t,e){var o=t[T]&&t[T][e];if(x.test(o)&&!b.test(e)){var n=t.style,i=n[C],r=t[S][C];t[S][C]=t[T][C],n[C]="fontSize"===e?"1em":o||0,o=n.pixelLeft+O,n[C]=i,t[S][C]=r}return""===o?"auto":o}function u(t,e){"static"===v(t,"position")&&(t.style.position="relative");var o,n,i=s(t),r={};for(n in e)o=parseFloat(v(t,n))||0,r[n]=o+e[n]-i[n];v(t,r)}function h(t,e){for(var o=0;o<t.length;o++)e(t[o])}function a(t){return"border-box"===w(t,"boxSizing")}function f(t,e,o){var n,i={},r=t.style;for(n in e)i[n]=r[n],r[n]=e[n];o.call(t);for(n in e)r[n]=i[n]}function c(t,e,o){var n,i,r,s=0;for(i=0;i<e.length;i++)if(n=e[i])for(r=0;r<o.length;r++){var l;l="border"===n?n+o[r]+"Width":n+o[r],s+=parseFloat(w(t,l))||0}return s}function d(t){return null!=t&&t==t.window}function m(t,e,o){if(d(t))return"width"===e?E.viewportWidth(t):E.viewportHeight(t);if(9===t.nodeType)return"width"===e?E.docWidth(t):E.docHeight(t);var n="width"===e?["Left","Right"]:["Top","Bottom"],i="width"===e?t.offsetWidth:t.offsetHeight,r=w(t),s=a(t,r),l=0;(null==i||0>=i)&&(i=void 0,l=w(t,e),(null==l||Number(l)<0)&&(l=t.style[e]||0),l=parseFloat(l)||0),void 0===o&&(o=s?L:W);var p=void 0!==i||s,u=i||l;return o===W?p?u-c(t,["border","padding"],n,r):l:p?u+(o===L?0:o===F?-c(t,["border"],n,r):c(t,["margin"],n,r)):l+c(t,P.slice(o),n,r)}function g(t){var e,o=arguments;return 0!==t.offsetWidth?e=m.apply(void 0,o):f(t,M,function(){e=m.apply(void 0,o)}),e}function v(t,e,o){if("object"!=typeof e)return"undefined"==typeof o?w(t,e):("number"==typeof o&&(o+="px"),void(t.style[e]=o));for(var n in e)v(t,n,e[n])}function y(t,e){for(var o in e)t[o]=e[o];return t}var w,I=/[\-+]?(?:\d*\.|)\d+(?:[eE][\-+]?\d+|)/.source,x=new RegExp("^("+I+")(?!px)[a-z%]+$","i"),b=/^(top|right|bottom|left)$/,T="currentStyle",S="runtimeStyle",C="left",O="px";"undefined"!=typeof window&&(w=window.getComputedStyle?l:p);var P=["margin","border","padding"],W=-1,F=2,L=1,D=0,E={};h(["Width","Height"],function(t){E["doc"+t]=function(e){var o=e.document;return Math.max(o.documentElement["scroll"+t],o.body["scroll"+t],E["viewport"+t](o))},E["viewport"+t]=function(e){var o="client"+t,n=e.document,i=n.body,r=n.documentElement,s=r[o];return"CSS1Compat"===n.compatMode&&s||i&&i[o]||s}});var M={position:"absolute",visibility:"hidden",display:"block"};h(["width","height"],function(t){var e=t.charAt(0).toUpperCase()+t.slice(1);E["outer"+e]=function(e,o){return e&&g(e,t,o?D:L)};var o="width"===t?["Left","Right"]:["Top","Bottom"];E[t]=function(e,n){if(void 0===n)return e&&g(e,t,W);if(e){var i=w(e),r=a(e);return r&&(n+=c(e,["padding","border"],o,i)),v(e,t,n)}}});var H=t.exports={getWindow:function(t){var e=t.ownerDocument||t;return e.defaultView||e.parentWindow},offset:function(t,e){return"undefined"==typeof e?s(t):void u(t,e)},isWindow:d,each:h,css:v,clone:function(t){var e={};for(var o in t)e[o]=t[o];var n=t.overflow;if(n)for(o in t)e.overflow[o]=t.overflow[o];return e},mix:y,scrollLeft:function(t,e){if(d(t)){if(void 0===e)return i(t);window.scrollTo(e,r(t))}else{if(void 0===e)return t.scrollLeft;t.scrollLeft=e}},scrollTop:function(t,e){if(d(t)){if(void 0===e)return r(t);window.scrollTo(i(t),e)}else{if(void 0===e)return t.scrollTop;t.scrollTop=e}},merge:function(){for(var t={},e=0;e<arguments.length;e++)H.mix(t,arguments[e]);return t},viewportWidth:0,viewportHeight:0};y(H,E)}])});
 //# sourceMappingURL=react-autocomplete.min.js.map

lib/Autocomplete.js

@@ -333,2 +333,8 @@ const React = require('react')
 
+  composeEventHandlers (internal, external) {
+    return external
+      ? e => { internal(e); external(e); }
+      : internal
+  },
+
   render () {
@@ -342,6 +348,7 @@ if (this.props.debug) { // you don't like it, you love it
 
+    const { inputProps } = this.props
     return (
       <div style={{...this.props.wrapperStyle}} {...this.props.wrapperProps}>
         <input
-          {...this.props.inputProps}
+          {...inputProps}
           role="combobox"
@@ -351,8 +358,8 @@ aria-autocomplete="list"
           ref="input"
-          onFocus={this.handleInputFocus}
-          onBlur={this.handleInputBlur}
-          onChange={(event) => this.handleChange(event)}
-          onKeyDown={(event) => this.handleKeyDown(event)}
-          onKeyUp={(event) => this.handleKeyUp(event)}
-          onClick={this.handleInputClick}
+          onFocus={this.composeEventHandlers(this.handleInputFocus, inputProps.onFocus)}
+          onBlur={this.composeEventHandlers(this.handleInputBlur, inputProps.onBlur)}
+          onChange={this.handleChange}
+          onKeyDown={this.composeEventHandlers(this.handleKeyDown, inputProps.onKeyDown)}
+          onKeyUp={this.composeEventHandlers(this.handleKeyUp, inputProps.onKeyUp)}
+          onClick={this.composeEventHandlers(this.handleInputClick, inputProps.onClick)}
           value={this.props.value}
@@ -359,0 +366,0 @@ />

package.json

 {
   "name": "react-autocomplete",
-  "version": "1.3.1",
+  "version": "1.4.0",
   "description": "Accessible, extensible, Autocomplete for React.js",
@@ -5,0 +5,0 @@ "main": "./build/lib/index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

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

Improved metrics

Total package byte prevSize

222304

increased by1.39%

Lines of code

1752

increased by0.29%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes