react-select - npm Package Compare versions

Comparing version 0.4.3 to 0.4.4

dist/react-select.js

@@ -109,2 +109,5 @@ (function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.Select = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
 		this._closeMenuIfClickedOutside = (function (event) {
+			if (!this.state.isOpen) {
+				return;
+			}
 			var menuElem = this.refs.selectMenuContainer.getDOMNode();
@@ -143,5 +146,2 @@ var controlElem = this.refs.control.getDOMNode();
 	componentWillReceiveProps: function componentWillReceiveProps(newProps) {
-		if (newProps.value !== this.state.value) {
-			this.setState(this.getStateFromValue(newProps.value, newProps.options));
-		}
 		if (JSON.stringify(newProps.options) !== JSON.stringify(this.props.options)) {
@@ -153,2 +153,5 @@ this.setState({
 		}
+		if (newProps.value !== this.state.value) {
+			this.setState(this.getStateFromValue(newProps.value, newProps.options));
+		}
 	},
@@ -155,0 +158,0 @@

dist/react-select.min.js

@@ -1,1 +0,1 @@
-!function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var t;t="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,t.Select=e()}}(function(){return function e(t,s,i){function n(a,l){if(!s[a]){if(!t[a]){var r="function"==typeof require&&require;if(!l&&r)return r(a,!0);if(o)return o(a,!0);var u=new Error("Cannot find module '"+a+"'");throw u.code="MODULE_NOT_FOUND",u}var p=s[a]={exports:{}};t[a][0].call(p.exports,function(e){var s=t[a][1][e];return n(s?s:e)},p,p.exports,e,t,s,i)}return s[a].exports}for(var o="function"==typeof require&&require,a=0;a<i.length;a++)n(i[a]);return n}({1:[function(e,t){(function(s){"use strict";var i=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var s=arguments[t];for(var i in s)Object.prototype.hasOwnProperty.call(s,i)&&(e[i]=s[i])}return e},n="undefined"!=typeof window?window._:"undefined"!=typeof s?s._:null,o="undefined"!=typeof window?window.React:"undefined"!=typeof s?s.React:null,a="undefined"!=typeof window?window.AutosizeInput:"undefined"!=typeof s?s.AutosizeInput:null,l="undefined"!=typeof window?window.classNames:"undefined"!=typeof s?s.classNames:null,r=e("./Value"),u=0,p=o.createClass({displayName:"Select",propTypes:{value:o.PropTypes.any,multi:o.PropTypes.bool,disabled:o.PropTypes.bool,options:o.PropTypes.array,delimiter:o.PropTypes.string,asyncOptions:o.PropTypes.func,autoload:o.PropTypes.bool,placeholder:o.PropTypes.string,noResultsText:o.PropTypes.string,clearable:o.PropTypes.bool,clearValueText:o.PropTypes.string,clearAllText:o.PropTypes.string,searchable:o.PropTypes.bool,searchPromptText:o.PropTypes.string,name:o.PropTypes.string,onChange:o.PropTypes.func,onFocus:o.PropTypes.func,onBlur:o.PropTypes.func,className:o.PropTypes.string,filterOption:o.PropTypes.func,filterOptions:o.PropTypes.func,matchPos:o.PropTypes.string,matchProp:o.PropTypes.string,inputProps:o.PropTypes.object,onOptionLabelClick:o.PropTypes.func},getDefaultProps:function(){return{value:void 0,options:[],disabled:!1,delimiter:",",asyncOptions:void 0,autoload:!0,placeholder:"Select...",noResultsText:"No results found",clearable:!0,clearValueText:"Clear value",clearAllText:"Clear all",searchable:!0,searchPromptText:"Type to search",name:void 0,onChange:void 0,className:void 0,matchPos:"any",matchProp:"any",inputProps:{},onOptionLabelClick:void 0}},getInitialState:function(){return{options:this.props.options,isFocused:!1,isOpen:!1,isLoading:!1}},componentWillMount:function(){this._optionsCache={},this._optionsFilterString="",this.setState(this.getStateFromValue(this.props.value)),this.props.asyncOptions&&this.props.autoload&&this.autoloadAsyncOptions(),this._closeMenuIfClickedOutside=function(e){var t=this.refs.selectMenuContainer.getDOMNode(),s=this.refs.control.getDOMNode(),i=this.clickedOutsideElement(t,e),n=this.clickedOutsideElement(s,e);i&&n&&this.setState({isOpen:!1},this._unbindCloseMenuIfClickedOutside)}.bind(this),this._bindCloseMenuIfClickedOutside=function(){document.addEventListener("click",this._closeMenuIfClickedOutside)},this._unbindCloseMenuIfClickedOutside=function(){document.removeEventListener("click",this._closeMenuIfClickedOutside)}},componentWillUnmount:function(){clearTimeout(this._blurTimeout),clearTimeout(this._focusTimeout),this.state.isOpen&&this._unbindCloseMenuIfClickedOutside()},componentWillReceiveProps:function(e){e.value!==this.state.value&&this.setState(this.getStateFromValue(e.value,e.options)),JSON.stringify(e.options)!==JSON.stringify(this.props.options)&&this.setState({options:e.options,filteredOptions:this.filterOptions(e.options)})},componentDidUpdate:function(){if(this._focusAfterUpdate&&(clearTimeout(this._blurTimeout),this._focusTimeout=setTimeout(function(){this.getInputNode().focus(),this._focusAfterUpdate=!1}.bind(this),50)),this._focusedOptionReveal){if(this.refs.focused&&this.refs.menu){var e=this.refs.focused.getDOMNode(),t=this.refs.menu.getDOMNode(),s=e.getBoundingClientRect(),i=t.getBoundingClientRect();(s.bottom>i.bottom||s.top<i.top)&&(t.scrollTop=e.offsetTop+e.clientHeight-t.offsetHeight)}this._focusedOptionReveal=!1}},clickedOutsideElement:function(e,t){for(var s=t.target?t.target:t.srcElement;null!=s;){if(s===e)return!1;s=s.offsetParent}return!0},getStateFromValue:function(e,t){t||(t=this.state.options),this._optionsFilterString="";var s=this.initValuesArray(e,t),i=this.filterOptions(t,s);return{value:s.map(function(e){return e.value}).join(this.props.delimiter),values:s,inputValue:"",filteredOptions:i,placeholder:!this.props.multi&&s.length?s[0].label:this.props.placeholder,focusedOption:!this.props.multi&&s.length?s[0]:i[0]}},initValuesArray:function(e,t){return Array.isArray(e)||(e="string"==typeof e?e.split(this.props.delimiter):e?[e]:[]),e.map(function(e){return"string"==typeof e?e=n.findWhere(t,{value:e})||{value:e,label:e}:e})},setValue:function(e){this._focusAfterUpdate=!0;var t=this.getStateFromValue(e);t.isOpen=!1,this.fireChangeEvent(t),this.setState(t)},selectValue:function(e){this.props.multi?e&&this.addValue(e):this.setValue(e),this._unbindCloseMenuIfClickedOutside()},addValue:function(e){this.setValue(this.state.values.concat(e))},popValue:function(){this.setValue(n.initial(this.state.values))},removeValue:function(e){this.setValue(n.without(this.state.values,e))},clearValue:function(e){e&&"mousedown"===e.type&&0!==e.button||this.setValue(null)},resetValue:function(){this.setValue(this.state.value)},getInputNode:function(){var e=this.refs.input;return this.props.searchable?e:e.getDOMNode()},fireChangeEvent:function(e){e.value!==this.state.value&&this.props.onChange&&this.props.onChange(e.value,e.values)},handleMouseDown:function(e){this.props.disabled||"mousedown"===e.type&&0!==e.button||(e.stopPropagation(),e.preventDefault(),this.state.isFocused?this.setState({isOpen:!0},this._bindCloseMenuIfClickedOutside):(this._openAfterFocus=!0,this.getInputNode().focus()))},handleInputFocus:function(e){var t=this.state.isOpen||this._openAfterFocus;this.setState({isFocused:!0,isOpen:t},function(){t?this._bindCloseMenuIfClickedOutside():this._unbindCloseMenuIfClickedOutside()}),this._openAfterFocus=!1,this.props.onFocus&&this.props.onFocus(e)},handleInputBlur:function(e){this._blurTimeout=setTimeout(function(){this._focusAfterUpdate||this.setState({isFocused:!1})}.bind(this),50),this.props.onBlur&&this.props.onBlur(e)},handleKeyDown:function(e){if(!this.state.disabled){switch(e.keyCode){case 8:return void(this.state.inputValue||this.popValue());case 9:if(e.shiftKey||!this.state.isOpen||!this.state.focusedOption)return;this.selectFocusedOption();break;case 13:this.selectFocusedOption();break;case 27:this.state.isOpen?this.resetValue():this.clearValue();break;case 38:this.focusPreviousOption();break;case 40:this.focusNextOption();break;default:return}e.preventDefault()}},handleInputChange:function(e){if(this._optionsFilterString=e.target.value,this.props.asyncOptions)this.setState({isLoading:!0,inputValue:e.target.value}),this.loadAsyncOptions(e.target.value,{isLoading:!1,isOpen:!0},this._bindCloseMenuIfClickedOutside);else{var t=this.filterOptions(this.state.options);this.setState({isOpen:!0,inputValue:e.target.value,filteredOptions:t,focusedOption:n.contains(t,this.state.focusedOption)?this.state.focusedOption:t[0]},this._bindCloseMenuIfClickedOutside)}},autoloadAsyncOptions:function(){this.loadAsyncOptions("",{},function(){})},loadAsyncOptions:function(e,t){for(var s=this._currentRequestId=u++,i=0;i<=e.length;i++){var o=e.slice(0,i);if(this._optionsCache[o]&&(e===o||this._optionsCache[o].complete)){var a=this._optionsCache[o].options,l=this.filterOptions(a);return void this.setState(n.extend({options:a,filteredOptions:l,focusedOption:n.contains(l,this.state.focusedOption)?this.state.focusedOption:l[0]},t))}}this.props.asyncOptions(e,function(i,o){if(i)throw i;if(this._optionsCache[e]=o,s===this._currentRequestId){var a=this.filterOptions(o.options);this.setState(n.extend({options:o.options,filteredOptions:a,focusedOption:n.contains(a,this.state.focusedOption)?this.state.focusedOption:a[0]},t))}}.bind(this))},filterOptions:function(e,t){if(!this.props.searchable)return e;var s=this._optionsFilterString,i=(t||this.state.values).map(function(e){return e.value});if(this.props.filterOptions)return this.props.filterOptions.call(this,e,s,i);var o=function(e){if(this.props.multi&&n.contains(i,e.value))return!1;if(this.props.filterOption)return this.props.filterOption.call(this,e,s);var t=String(e.value),o=String(e.label);return s&&"start"!==this.props.matchPos?"label"!==this.props.matchProp&&t.toLowerCase().indexOf(s.toLowerCase())>=0||"value"!==this.props.matchProp&&o.toLowerCase().indexOf(s.toLowerCase())>=0:"label"!==this.props.matchProp&&t.toLowerCase().substr(0,s.length)===s||"value"!==this.props.matchProp&&o.toLowerCase().substr(0,s.length)===s};return n.filter(e,o,this)},selectFocusedOption:function(){return this.selectValue(this.state.focusedOption)},focusOption:function(e){this.setState({focusedOption:e})},focusNextOption:function(){this.focusAdjacentOption("next")},focusPreviousOption:function(){this.focusAdjacentOption("previous")},focusAdjacentOption:function(e){this._focusedOptionReveal=!0;var t=this.state.filteredOptions;if(!this.state.isOpen)return void this.setState({isOpen:!0,inputValue:"",focusedOption:this.state.focusedOption||t["next"===e?0:t.length-1]},this._bindCloseMenuIfClickedOutside);if(t.length){for(var s=-1,i=0;i<t.length;i++)if(this.state.focusedOption===t[i]){s=i;break}var n=t[0];"next"===e&&s>-1&&s<t.length-1?n=t[s+1]:"previous"===e&&(n=s>0?t[s-1]:t[t.length-1]),this.setState({focusedOption:n})}},unfocusOption:function(e){this.state.focusedOption===e&&this.setState({focusedOption:null})},buildMenu:function(){var e=this.state.focusedOption?this.state.focusedOption.value:null;this.state.filteredOptions.length>0&&(e=null==e?this.state.filteredOptions[0]:e);var t=n.map(this.state.filteredOptions,function(t){var s=e===t.value,i=l({"Select-option":!0,"is-focused":s}),n=s?"focused":null,a=this.focusOption.bind(this,t),r=this.unfocusOption.bind(this,t),u=this.selectValue.bind(this,t);return o.createElement("div",{ref:n,key:"option-"+t.value,className:i,onMouseEnter:a,onMouseLeave:r,onMouseDown:u,onClick:u},t.label)},this);return t.length?t:o.createElement("div",{className:"Select-noresults"},this.props.asyncOptions&&!this.state.inputValue?this.props.searchPromptText:this.props.noResultsText)},handleOptionLabelClick:function(e,t){var s=this.props.onOptionLabelClick;s&&s(e,t)},render:function(){var e=l("Select",this.props.className,{"is-multi":this.props.multi,"is-searchable":this.props.searchable,"is-open":this.state.isOpen,"is-focused":this.state.isFocused,"is-loading":this.state.isLoading,"is-disabled":this.props.disabled,"has-value":this.state.value}),t=[];this.props.multi&&this.state.values.forEach(function(e){var s=n.extend({key:e.value,optionLabelClick:!!this.props.onOptionLabelClick,onOptionLabelClick:this.handleOptionLabelClick.bind(this,e),onRemove:this.removeValue.bind(this,e)},e);t.push(o.createElement(r,s))},this),!this.props.disabled&&(this.state.inputValue||this.props.multi&&t.length)||t.push(o.createElement("div",{className:"Select-placeholder",key:"placeholder"},this.state.placeholder));var s,u,p=this.state.isLoading?o.createElement("span",{className:"Select-loading","aria-hidden":"true"}):null,c=this.props.clearable&&this.state.value&&!this.props.disabled?o.createElement("span",{className:"Select-clear",title:this.props.multi?this.props.clearAllText:this.props.clearValueText,"aria-label":this.props.multi?this.props.clearAllText:this.props.clearValueText,onMouseDown:this.clearValue,onClick:this.clearValue,dangerouslySetInnerHTML:{__html:"&times;"}}):null;this.state.isOpen&&(u={ref:"menu",className:"Select-menu"},this.props.multi&&(u.onMouseDown=this.handleMouseDown),s=o.createElement("div",{ref:"selectMenuContainer",className:"Select-menu-outer"},o.createElement("div",u,this.buildMenu())));var h,d=n.extend({ref:"input",className:"Select-input",tabIndex:this.props.tabIndex||0,onFocus:this.handleInputFocus,onBlur:this.handleInputBlur},this.props.inputProps);return h=this.props.searchable&&!this.props.disabled?o.createElement(a,i({value:this.state.inputValue,onChange:this.handleInputChange,minWidth:"5"},d)):o.createElement("div",d," "),o.createElement("div",{ref:"wrapper",className:e},o.createElement("input",{type:"hidden",ref:"value",name:this.props.name,value:this.state.value,disabled:this.props.disabled}),o.createElement("div",{className:"Select-control",ref:"control",onKeyDown:this.handleKeyDown,onMouseDown:this.handleMouseDown,onTouchEnd:this.handleMouseDown},t,h,o.createElement("span",{className:"Select-arrow"}),p,c),s)}});t.exports=p}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./Value":2}],2:[function(e,t){(function(e){"use strict";var s="undefined"!=typeof window?window.React:"undefined"!=typeof e?e.React:null,i=s.createClass({displayName:"Value",propTypes:{label:s.PropTypes.string.isRequired},blockEvent:function(e){e.stopPropagation()},render:function(){var e=this.props.label;return this.props.optionLabelClick&&(e=s.createElement("a",{className:"Select-item-label__a",onMouseDown:this.blockEvent,onTouchEnd:this.props.onOptionLabelClick,onClick:this.props.onOptionLabelClick},e)),s.createElement("div",{className:"Select-item"},s.createElement("span",{className:"Select-item-icon",onMouseDown:this.blockEvent,onClick:this.props.onRemove,onTouchEnd:this.props.onRemove},"×"),s.createElement("span",{className:"Select-item-label"},e))}});t.exports=i}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}]},{},[1])(1)});
+!function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var t;t="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,t.Select=e()}}(function(){return function e(t,s,i){function n(a,l){if(!s[a]){if(!t[a]){var r="function"==typeof require&&require;if(!l&&r)return r(a,!0);if(o)return o(a,!0);var u=new Error("Cannot find module '"+a+"'");throw u.code="MODULE_NOT_FOUND",u}var p=s[a]={exports:{}};t[a][0].call(p.exports,function(e){var s=t[a][1][e];return n(s?s:e)},p,p.exports,e,t,s,i)}return s[a].exports}for(var o="function"==typeof require&&require,a=0;a<i.length;a++)n(i[a]);return n}({1:[function(e,t){(function(s){"use strict";var i=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var s=arguments[t];for(var i in s)Object.prototype.hasOwnProperty.call(s,i)&&(e[i]=s[i])}return e},n="undefined"!=typeof window?window._:"undefined"!=typeof s?s._:null,o="undefined"!=typeof window?window.React:"undefined"!=typeof s?s.React:null,a="undefined"!=typeof window?window.AutosizeInput:"undefined"!=typeof s?s.AutosizeInput:null,l="undefined"!=typeof window?window.classNames:"undefined"!=typeof s?s.classNames:null,r=e("./Value"),u=0,p=o.createClass({displayName:"Select",propTypes:{value:o.PropTypes.any,multi:o.PropTypes.bool,disabled:o.PropTypes.bool,options:o.PropTypes.array,delimiter:o.PropTypes.string,asyncOptions:o.PropTypes.func,autoload:o.PropTypes.bool,placeholder:o.PropTypes.string,noResultsText:o.PropTypes.string,clearable:o.PropTypes.bool,clearValueText:o.PropTypes.string,clearAllText:o.PropTypes.string,searchable:o.PropTypes.bool,searchPromptText:o.PropTypes.string,name:o.PropTypes.string,onChange:o.PropTypes.func,onFocus:o.PropTypes.func,onBlur:o.PropTypes.func,className:o.PropTypes.string,filterOption:o.PropTypes.func,filterOptions:o.PropTypes.func,matchPos:o.PropTypes.string,matchProp:o.PropTypes.string,inputProps:o.PropTypes.object,onOptionLabelClick:o.PropTypes.func},getDefaultProps:function(){return{value:void 0,options:[],disabled:!1,delimiter:",",asyncOptions:void 0,autoload:!0,placeholder:"Select...",noResultsText:"No results found",clearable:!0,clearValueText:"Clear value",clearAllText:"Clear all",searchable:!0,searchPromptText:"Type to search",name:void 0,onChange:void 0,className:void 0,matchPos:"any",matchProp:"any",inputProps:{},onOptionLabelClick:void 0}},getInitialState:function(){return{options:this.props.options,isFocused:!1,isOpen:!1,isLoading:!1}},componentWillMount:function(){this._optionsCache={},this._optionsFilterString="",this.setState(this.getStateFromValue(this.props.value)),this.props.asyncOptions&&this.props.autoload&&this.autoloadAsyncOptions(),this._closeMenuIfClickedOutside=function(e){if(this.state.isOpen){var t=this.refs.selectMenuContainer.getDOMNode(),s=this.refs.control.getDOMNode(),i=this.clickedOutsideElement(t,e),n=this.clickedOutsideElement(s,e);i&&n&&this.setState({isOpen:!1},this._unbindCloseMenuIfClickedOutside)}}.bind(this),this._bindCloseMenuIfClickedOutside=function(){document.addEventListener("click",this._closeMenuIfClickedOutside)},this._unbindCloseMenuIfClickedOutside=function(){document.removeEventListener("click",this._closeMenuIfClickedOutside)}},componentWillUnmount:function(){clearTimeout(this._blurTimeout),clearTimeout(this._focusTimeout),this.state.isOpen&&this._unbindCloseMenuIfClickedOutside()},componentWillReceiveProps:function(e){JSON.stringify(e.options)!==JSON.stringify(this.props.options)&&this.setState({options:e.options,filteredOptions:this.filterOptions(e.options)}),e.value!==this.state.value&&this.setState(this.getStateFromValue(e.value,e.options))},componentDidUpdate:function(){if(this._focusAfterUpdate&&(clearTimeout(this._blurTimeout),this._focusTimeout=setTimeout(function(){this.getInputNode().focus(),this._focusAfterUpdate=!1}.bind(this),50)),this._focusedOptionReveal){if(this.refs.focused&&this.refs.menu){var e=this.refs.focused.getDOMNode(),t=this.refs.menu.getDOMNode(),s=e.getBoundingClientRect(),i=t.getBoundingClientRect();(s.bottom>i.bottom||s.top<i.top)&&(t.scrollTop=e.offsetTop+e.clientHeight-t.offsetHeight)}this._focusedOptionReveal=!1}},clickedOutsideElement:function(e,t){for(var s=t.target?t.target:t.srcElement;null!=s;){if(s===e)return!1;s=s.offsetParent}return!0},getStateFromValue:function(e,t){t||(t=this.state.options),this._optionsFilterString="";var s=this.initValuesArray(e,t),i=this.filterOptions(t,s);return{value:s.map(function(e){return e.value}).join(this.props.delimiter),values:s,inputValue:"",filteredOptions:i,placeholder:!this.props.multi&&s.length?s[0].label:this.props.placeholder,focusedOption:!this.props.multi&&s.length?s[0]:i[0]}},initValuesArray:function(e,t){return Array.isArray(e)||(e="string"==typeof e?e.split(this.props.delimiter):e?[e]:[]),e.map(function(e){return"string"==typeof e?e=n.findWhere(t,{value:e})||{value:e,label:e}:e})},setValue:function(e){this._focusAfterUpdate=!0;var t=this.getStateFromValue(e);t.isOpen=!1,this.fireChangeEvent(t),this.setState(t)},selectValue:function(e){this.props.multi?e&&this.addValue(e):this.setValue(e),this._unbindCloseMenuIfClickedOutside()},addValue:function(e){this.setValue(this.state.values.concat(e))},popValue:function(){this.setValue(n.initial(this.state.values))},removeValue:function(e){this.setValue(n.without(this.state.values,e))},clearValue:function(e){e&&"mousedown"===e.type&&0!==e.button||this.setValue(null)},resetValue:function(){this.setValue(this.state.value)},getInputNode:function(){var e=this.refs.input;return this.props.searchable?e:e.getDOMNode()},fireChangeEvent:function(e){e.value!==this.state.value&&this.props.onChange&&this.props.onChange(e.value,e.values)},handleMouseDown:function(e){this.props.disabled||"mousedown"===e.type&&0!==e.button||(e.stopPropagation(),e.preventDefault(),this.state.isFocused?this.setState({isOpen:!0},this._bindCloseMenuIfClickedOutside):(this._openAfterFocus=!0,this.getInputNode().focus()))},handleInputFocus:function(e){var t=this.state.isOpen||this._openAfterFocus;this.setState({isFocused:!0,isOpen:t},function(){t?this._bindCloseMenuIfClickedOutside():this._unbindCloseMenuIfClickedOutside()}),this._openAfterFocus=!1,this.props.onFocus&&this.props.onFocus(e)},handleInputBlur:function(e){this._blurTimeout=setTimeout(function(){this._focusAfterUpdate||this.setState({isFocused:!1})}.bind(this),50),this.props.onBlur&&this.props.onBlur(e)},handleKeyDown:function(e){if(!this.state.disabled){switch(e.keyCode){case 8:return void(this.state.inputValue||this.popValue());case 9:if(e.shiftKey||!this.state.isOpen||!this.state.focusedOption)return;this.selectFocusedOption();break;case 13:this.selectFocusedOption();break;case 27:this.state.isOpen?this.resetValue():this.clearValue();break;case 38:this.focusPreviousOption();break;case 40:this.focusNextOption();break;default:return}e.preventDefault()}},handleInputChange:function(e){if(this._optionsFilterString=e.target.value,this.props.asyncOptions)this.setState({isLoading:!0,inputValue:e.target.value}),this.loadAsyncOptions(e.target.value,{isLoading:!1,isOpen:!0},this._bindCloseMenuIfClickedOutside);else{var t=this.filterOptions(this.state.options);this.setState({isOpen:!0,inputValue:e.target.value,filteredOptions:t,focusedOption:n.contains(t,this.state.focusedOption)?this.state.focusedOption:t[0]},this._bindCloseMenuIfClickedOutside)}},autoloadAsyncOptions:function(){this.loadAsyncOptions("",{},function(){})},loadAsyncOptions:function(e,t){for(var s=this._currentRequestId=u++,i=0;i<=e.length;i++){var o=e.slice(0,i);if(this._optionsCache[o]&&(e===o||this._optionsCache[o].complete)){var a=this._optionsCache[o].options,l=this.filterOptions(a);return void this.setState(n.extend({options:a,filteredOptions:l,focusedOption:n.contains(l,this.state.focusedOption)?this.state.focusedOption:l[0]},t))}}this.props.asyncOptions(e,function(i,o){if(i)throw i;if(this._optionsCache[e]=o,s===this._currentRequestId){var a=this.filterOptions(o.options);this.setState(n.extend({options:o.options,filteredOptions:a,focusedOption:n.contains(a,this.state.focusedOption)?this.state.focusedOption:a[0]},t))}}.bind(this))},filterOptions:function(e,t){if(!this.props.searchable)return e;var s=this._optionsFilterString,i=(t||this.state.values).map(function(e){return e.value});if(this.props.filterOptions)return this.props.filterOptions.call(this,e,s,i);var o=function(e){if(this.props.multi&&n.contains(i,e.value))return!1;if(this.props.filterOption)return this.props.filterOption.call(this,e,s);var t=String(e.value),o=String(e.label);return s&&"start"!==this.props.matchPos?"label"!==this.props.matchProp&&t.toLowerCase().indexOf(s.toLowerCase())>=0||"value"!==this.props.matchProp&&o.toLowerCase().indexOf(s.toLowerCase())>=0:"label"!==this.props.matchProp&&t.toLowerCase().substr(0,s.length)===s||"value"!==this.props.matchProp&&o.toLowerCase().substr(0,s.length)===s};return n.filter(e,o,this)},selectFocusedOption:function(){return this.selectValue(this.state.focusedOption)},focusOption:function(e){this.setState({focusedOption:e})},focusNextOption:function(){this.focusAdjacentOption("next")},focusPreviousOption:function(){this.focusAdjacentOption("previous")},focusAdjacentOption:function(e){this._focusedOptionReveal=!0;var t=this.state.filteredOptions;if(!this.state.isOpen)return void this.setState({isOpen:!0,inputValue:"",focusedOption:this.state.focusedOption||t["next"===e?0:t.length-1]},this._bindCloseMenuIfClickedOutside);if(t.length){for(var s=-1,i=0;i<t.length;i++)if(this.state.focusedOption===t[i]){s=i;break}var n=t[0];"next"===e&&s>-1&&s<t.length-1?n=t[s+1]:"previous"===e&&(n=s>0?t[s-1]:t[t.length-1]),this.setState({focusedOption:n})}},unfocusOption:function(e){this.state.focusedOption===e&&this.setState({focusedOption:null})},buildMenu:function(){var e=this.state.focusedOption?this.state.focusedOption.value:null;this.state.filteredOptions.length>0&&(e=null==e?this.state.filteredOptions[0]:e);var t=n.map(this.state.filteredOptions,function(t){var s=e===t.value,i=l({"Select-option":!0,"is-focused":s}),n=s?"focused":null,a=this.focusOption.bind(this,t),r=this.unfocusOption.bind(this,t),u=this.selectValue.bind(this,t);return o.createElement("div",{ref:n,key:"option-"+t.value,className:i,onMouseEnter:a,onMouseLeave:r,onMouseDown:u,onClick:u},t.label)},this);return t.length?t:o.createElement("div",{className:"Select-noresults"},this.props.asyncOptions&&!this.state.inputValue?this.props.searchPromptText:this.props.noResultsText)},handleOptionLabelClick:function(e,t){var s=this.props.onOptionLabelClick;s&&s(e,t)},render:function(){var e=l("Select",this.props.className,{"is-multi":this.props.multi,"is-searchable":this.props.searchable,"is-open":this.state.isOpen,"is-focused":this.state.isFocused,"is-loading":this.state.isLoading,"is-disabled":this.props.disabled,"has-value":this.state.value}),t=[];this.props.multi&&this.state.values.forEach(function(e){var s=n.extend({key:e.value,optionLabelClick:!!this.props.onOptionLabelClick,onOptionLabelClick:this.handleOptionLabelClick.bind(this,e),onRemove:this.removeValue.bind(this,e)},e);t.push(o.createElement(r,s))},this),!this.props.disabled&&(this.state.inputValue||this.props.multi&&t.length)||t.push(o.createElement("div",{className:"Select-placeholder",key:"placeholder"},this.state.placeholder));var s,u,p=this.state.isLoading?o.createElement("span",{className:"Select-loading","aria-hidden":"true"}):null,c=this.props.clearable&&this.state.value&&!this.props.disabled?o.createElement("span",{className:"Select-clear",title:this.props.multi?this.props.clearAllText:this.props.clearValueText,"aria-label":this.props.multi?this.props.clearAllText:this.props.clearValueText,onMouseDown:this.clearValue,onClick:this.clearValue,dangerouslySetInnerHTML:{__html:"&times;"}}):null;this.state.isOpen&&(u={ref:"menu",className:"Select-menu"},this.props.multi&&(u.onMouseDown=this.handleMouseDown),s=o.createElement("div",{ref:"selectMenuContainer",className:"Select-menu-outer"},o.createElement("div",u,this.buildMenu())));var h,d=n.extend({ref:"input",className:"Select-input",tabIndex:this.props.tabIndex||0,onFocus:this.handleInputFocus,onBlur:this.handleInputBlur},this.props.inputProps);return h=this.props.searchable&&!this.props.disabled?o.createElement(a,i({value:this.state.inputValue,onChange:this.handleInputChange,minWidth:"5"},d)):o.createElement("div",d," "),o.createElement("div",{ref:"wrapper",className:e},o.createElement("input",{type:"hidden",ref:"value",name:this.props.name,value:this.state.value,disabled:this.props.disabled}),o.createElement("div",{className:"Select-control",ref:"control",onKeyDown:this.handleKeyDown,onMouseDown:this.handleMouseDown,onTouchEnd:this.handleMouseDown},t,h,o.createElement("span",{className:"Select-arrow"}),p,c),s)}});t.exports=p}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./Value":2}],2:[function(e,t){(function(e){"use strict";var s="undefined"!=typeof window?window.React:"undefined"!=typeof e?e.React:null,i=s.createClass({displayName:"Value",propTypes:{label:s.PropTypes.string.isRequired},blockEvent:function(e){e.stopPropagation()},render:function(){var e=this.props.label;return this.props.optionLabelClick&&(e=s.createElement("a",{className:"Select-item-label__a",onMouseDown:this.blockEvent,onTouchEnd:this.props.onOptionLabelClick,onClick:this.props.onOptionLabelClick},e)),s.createElement("div",{className:"Select-item"},s.createElement("span",{className:"Select-item-icon",onMouseDown:this.blockEvent,onClick:this.props.onRemove,onTouchEnd:this.props.onRemove},"×"),s.createElement("span",{className:"Select-item-label"},e))}});t.exports=i}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}]},{},[1])(1)});

HISTORY.md

 # React-Select
 
+## v0.4.4 / 2015-03-26
+
+* fixed; error handling click events when the menu is closed, thanks [Ilya Petrov](https://github.com/muromec)
+* fixed; issue where options will not be filtered in certain conditions, thanks [G. Kay Lee](https://github.com/gsklee)
+
+## v0.4.3 / 2015-03-25
+
+* added tests and updated dependencies
+
 ## v0.4.2 / 2015-03-23
@@ -4,0 +13,0 @@

lib/Select.js

@@ -107,2 +107,5 @@ "use strict";
 		this._closeMenuIfClickedOutside = (function (event) {
+			if (!this.state.isOpen) {
+				return;
+			}
 			var menuElem = this.refs.selectMenuContainer.getDOMNode();
@@ -141,5 +144,2 @@ var controlElem = this.refs.control.getDOMNode();
 	componentWillReceiveProps: function componentWillReceiveProps(newProps) {
-		if (newProps.value !== this.state.value) {
-			this.setState(this.getStateFromValue(newProps.value, newProps.options));
-		}
 		if (JSON.stringify(newProps.options) !== JSON.stringify(this.props.options)) {
@@ -151,2 +151,5 @@ this.setState({
 		}
+		if (newProps.value !== this.state.value) {
+			this.setState(this.getStateFromValue(newProps.value, newProps.options));
+		}
 	},
@@ -153,0 +156,0 @@

package.json

 {
   "name": "react-select",
-  "version": "0.4.3",
+  "version": "0.4.4",
   "description": "A Select control built with and for ReactJS",
@@ -5,0 +5,0 @@ "main": "lib/Select.js",

README.md

 React-Select
 ============
 
-A Select control built with and for [React](http://facebook.github.io/react/index.html), initially being developed for use in [KeystoneJS](http://www.keystonejs.com).
+A Select control built with and for [React](http://facebook.github.io/react/index.html). Initially built for use in [KeystoneJS](http://www.keystonejs.com).
 
@@ -23,8 +23,4 @@
 
-This is currently a work in progress.
+This project is quite stable and ready for production use, however there are plans to improve it including:
 
-It's loosely based on [Selectize](http://brianreavis.github.io/selectize.js/) (in terms of behaviour and user expereience) and [React-Autocomplete](https://github.com/rackt/react-autocomplete) (as a native React Combobox implemenation), as well as other select controls including [Chosen](http://harvesthq.github.io/chosen/) and [Select2](http://ivaynberg.github.io/select2/).
-
-TODO:
-
 - CSS Styles and theme support (working, could be improved)
@@ -34,3 +30,5 @@ - Documentation website (currently just examples)
 
+It's loosely based on [Selectize](http://brianreavis.github.io/selectize.js/) (in terms of behaviour and user expereience) and [React-Autocomplete](https://github.com/rackt/react-autocomplete) (as a native React Combobox implemenation), as well as other select controls including [Chosen](http://harvesthq.github.io/chosen/) and [Select2](http://ivaynberg.github.io/select2/).
 
+
 ## Installation
@@ -141,2 +139,2 @@
 
-MIT Licensed. Copyright (c) Jed Watson 2014.
+MIT Licensed. Copyright (c) Jed Watson 2015.

src/Select.js

@@ -103,2 +103,5 @@ var _ = require('lodash'),
 		this._closeMenuIfClickedOutside = function(event) {
+			if (!this.state.isOpen) {
+				return;
+			}
 			var menuElem = this.refs.selectMenuContainer.getDOMNode();
@@ -111,3 +114,3 @@ var controlElem = this.refs.control.getDOMNode();
 			// Hide dropdown menu if click occurred outside of menu
-			if(eventOccuredOutsideMenu && eventOccuredOutsideControl) {
+			if (eventOccuredOutsideMenu && eventOccuredOutsideControl) {
 				this.setState({
@@ -138,5 +141,2 @@ isOpen: false
 	componentWillReceiveProps: function(newProps) {
-		if (newProps.value !== this.state.value) {
-			this.setState(this.getStateFromValue(newProps.value, newProps.options));
-		}
 		if (JSON.stringify(newProps.options) !== JSON.stringify(this.props.options)) {
@@ -148,2 +148,5 @@ this.setState({
 		}
+		if (newProps.value !== this.state.value) {
+			this.setState(this.getStateFromValue(newProps.value, newProps.options));
+		}
 	},
@@ -150,0 +153,0 @@

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

Improved metrics

Total package byte prevSize

123930

increased by0.43%

Lines of code

2344

increased by0.39%

Worsened metrics

Number of lines in readme file

138

decreased by-1.43%

No dependency changes