UNPKG

90.3 kBJavaScriptView Raw
1(function (global, factory) {
2 typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react-input-autosize'), require('classnames'), require('prop-types'), require('react'), require('react-dom')) :
3 typeof define === 'function' && define.amd ? define(['react-input-autosize', 'classnames', 'prop-types', 'react', 'react-dom'], factory) :
4 (global.Select = factory(global.AutosizeInput,global.classNames,global.PropTypes,global.React,global.ReactDOM));
5}(this, (function (AutosizeInput,classNames,PropTypes,React,reactDom) { 'use strict';
6
7AutosizeInput = AutosizeInput && AutosizeInput.hasOwnProperty('default') ? AutosizeInput['default'] : AutosizeInput;
8classNames = classNames && classNames.hasOwnProperty('default') ? classNames['default'] : classNames;
9PropTypes = PropTypes && PropTypes.hasOwnProperty('default') ? PropTypes['default'] : PropTypes;
10var React__default = 'default' in React ? React['default'] : React;
11
12var arrowRenderer = function arrowRenderer(_ref) {
13 var onMouseDown = _ref.onMouseDown;
14
15 return React__default.createElement('span', {
16 className: 'Select-arrow',
17 onMouseDown: onMouseDown
18 });
19};
20
21arrowRenderer.propTypes = {
22 onMouseDown: PropTypes.func
23};
24
25var clearRenderer = function clearRenderer() {
26 return React__default.createElement('span', {
27 className: 'Select-clear',
28 dangerouslySetInnerHTML: { __html: '×' }
29 });
30};
31
32var map = [{ 'base': 'A', 'letters': /[\u0041\u24B6\uFF21\u00C0\u00C1\u00C2\u1EA6\u1EA4\u1EAA\u1EA8\u00C3\u0100\u0102\u1EB0\u1EAE\u1EB4\u1EB2\u0226\u01E0\u00C4\u01DE\u1EA2\u00C5\u01FA\u01CD\u0200\u0202\u1EA0\u1EAC\u1EB6\u1E00\u0104\u023A\u2C6F]/g }, { 'base': 'AA', 'letters': /[\uA732]/g }, { 'base': 'AE', 'letters': /[\u00C6\u01FC\u01E2]/g }, { 'base': 'AO', 'letters': /[\uA734]/g }, { 'base': 'AU', 'letters': /[\uA736]/g }, { 'base': 'AV', 'letters': /[\uA738\uA73A]/g }, { 'base': 'AY', 'letters': /[\uA73C]/g }, { 'base': 'B', 'letters': /[\u0042\u24B7\uFF22\u1E02\u1E04\u1E06\u0243\u0182\u0181]/g }, { 'base': 'C', 'letters': /[\u0043\u24B8\uFF23\u0106\u0108\u010A\u010C\u00C7\u1E08\u0187\u023B\uA73E]/g }, { 'base': 'D', 'letters': /[\u0044\u24B9\uFF24\u1E0A\u010E\u1E0C\u1E10\u1E12\u1E0E\u0110\u018B\u018A\u0189\uA779]/g }, { 'base': 'DZ', 'letters': /[\u01F1\u01C4]/g }, { 'base': 'Dz', 'letters': /[\u01F2\u01C5]/g }, { 'base': 'E', 'letters': /[\u0045\u24BA\uFF25\u00C8\u00C9\u00CA\u1EC0\u1EBE\u1EC4\u1EC2\u1EBC\u0112\u1E14\u1E16\u0114\u0116\u00CB\u1EBA\u011A\u0204\u0206\u1EB8\u1EC6\u0228\u1E1C\u0118\u1E18\u1E1A\u0190\u018E]/g }, { 'base': 'F', 'letters': /[\u0046\u24BB\uFF26\u1E1E\u0191\uA77B]/g }, { 'base': 'G', 'letters': /[\u0047\u24BC\uFF27\u01F4\u011C\u1E20\u011E\u0120\u01E6\u0122\u01E4\u0193\uA7A0\uA77D\uA77E]/g }, { 'base': 'H', 'letters': /[\u0048\u24BD\uFF28\u0124\u1E22\u1E26\u021E\u1E24\u1E28\u1E2A\u0126\u2C67\u2C75\uA78D]/g }, { 'base': 'I', 'letters': /[\u0049\u24BE\uFF29\u00CC\u00CD\u00CE\u0128\u012A\u012C\u0130\u00CF\u1E2E\u1EC8\u01CF\u0208\u020A\u1ECA\u012E\u1E2C\u0197]/g }, { 'base': 'J', 'letters': /[\u004A\u24BF\uFF2A\u0134\u0248]/g }, { 'base': 'K', 'letters': /[\u004B\u24C0\uFF2B\u1E30\u01E8\u1E32\u0136\u1E34\u0198\u2C69\uA740\uA742\uA744\uA7A2]/g }, { 'base': 'L', 'letters': /[\u004C\u24C1\uFF2C\u013F\u0139\u013D\u1E36\u1E38\u013B\u1E3C\u1E3A\u0141\u023D\u2C62\u2C60\uA748\uA746\uA780]/g }, { 'base': 'LJ', 'letters': /[\u01C7]/g }, { 'base': 'Lj', 'letters': /[\u01C8]/g }, { 'base': 'M', 'letters': /[\u004D\u24C2\uFF2D\u1E3E\u1E40\u1E42\u2C6E\u019C]/g }, { 'base': 'N', 'letters': /[\u004E\u24C3\uFF2E\u01F8\u0143\u00D1\u1E44\u0147\u1E46\u0145\u1E4A\u1E48\u0220\u019D\uA790\uA7A4]/g }, { 'base': 'NJ', 'letters': /[\u01CA]/g }, { 'base': 'Nj', 'letters': /[\u01CB]/g }, { 'base': 'O', 'letters': /[\u004F\u24C4\uFF2F\u00D2\u00D3\u00D4\u1ED2\u1ED0\u1ED6\u1ED4\u00D5\u1E4C\u022C\u1E4E\u014C\u1E50\u1E52\u014E\u022E\u0230\u00D6\u022A\u1ECE\u0150\u01D1\u020C\u020E\u01A0\u1EDC\u1EDA\u1EE0\u1EDE\u1EE2\u1ECC\u1ED8\u01EA\u01EC\u00D8\u01FE\u0186\u019F\uA74A\uA74C]/g }, { 'base': 'OI', 'letters': /[\u01A2]/g }, { 'base': 'OO', 'letters': /[\uA74E]/g }, { 'base': 'OU', 'letters': /[\u0222]/g }, { 'base': 'P', 'letters': /[\u0050\u24C5\uFF30\u1E54\u1E56\u01A4\u2C63\uA750\uA752\uA754]/g }, { 'base': 'Q', 'letters': /[\u0051\u24C6\uFF31\uA756\uA758\u024A]/g }, { 'base': 'R', 'letters': /[\u0052\u24C7\uFF32\u0154\u1E58\u0158\u0210\u0212\u1E5A\u1E5C\u0156\u1E5E\u024C\u2C64\uA75A\uA7A6\uA782]/g }, { 'base': 'S', 'letters': /[\u0053\u24C8\uFF33\u1E9E\u015A\u1E64\u015C\u1E60\u0160\u1E66\u1E62\u1E68\u0218\u015E\u2C7E\uA7A8\uA784]/g }, { 'base': 'T', 'letters': /[\u0054\u24C9\uFF34\u1E6A\u0164\u1E6C\u021A\u0162\u1E70\u1E6E\u0166\u01AC\u01AE\u023E\uA786]/g }, { 'base': 'TZ', 'letters': /[\uA728]/g }, { 'base': 'U', 'letters': /[\u0055\u24CA\uFF35\u00D9\u00DA\u00DB\u0168\u1E78\u016A\u1E7A\u016C\u00DC\u01DB\u01D7\u01D5\u01D9\u1EE6\u016E\u0170\u01D3\u0214\u0216\u01AF\u1EEA\u1EE8\u1EEE\u1EEC\u1EF0\u1EE4\u1E72\u0172\u1E76\u1E74\u0244]/g }, { 'base': 'V', 'letters': /[\u0056\u24CB\uFF36\u1E7C\u1E7E\u01B2\uA75E\u0245]/g }, { 'base': 'VY', 'letters': /[\uA760]/g }, { 'base': 'W', 'letters': /[\u0057\u24CC\uFF37\u1E80\u1E82\u0174\u1E86\u1E84\u1E88\u2C72]/g }, { 'base': 'X', 'letters': /[\u0058\u24CD\uFF38\u1E8A\u1E8C]/g }, { 'base': 'Y', 'letters': /[\u0059\u24CE\uFF39\u1EF2\u00DD\u0176\u1EF8\u0232\u1E8E\u0178\u1EF6\u1EF4\u01B3\u024E\u1EFE]/g }, { 'base': 'Z', 'letters': /[\u005A\u24CF\uFF3A\u0179\u1E90\u017B\u017D\u1E92\u1E94\u01B5\u0224\u2C7F\u2C6B\uA762]/g }, { 'base': 'a', 'letters': /[\u0061\u24D0\uFF41\u1E9A\u00E0\u00E1\u00E2\u1EA7\u1EA5\u1EAB\u1EA9\u00E3\u0101\u0103\u1EB1\u1EAF\u1EB5\u1EB3\u0227\u01E1\u00E4\u01DF\u1EA3\u00E5\u01FB\u01CE\u0201\u0203\u1EA1\u1EAD\u1EB7\u1E01\u0105\u2C65\u0250]/g }, { 'base': 'aa', 'letters': /[\uA733]/g }, { 'base': 'ae', 'letters': /[\u00E6\u01FD\u01E3]/g }, { 'base': 'ao', 'letters': /[\uA735]/g }, { 'base': 'au', 'letters': /[\uA737]/g }, { 'base': 'av', 'letters': /[\uA739\uA73B]/g }, { 'base': 'ay', 'letters': /[\uA73D]/g }, { 'base': 'b', 'letters': /[\u0062\u24D1\uFF42\u1E03\u1E05\u1E07\u0180\u0183\u0253]/g }, { 'base': 'c', 'letters': /[\u0063\u24D2\uFF43\u0107\u0109\u010B\u010D\u00E7\u1E09\u0188\u023C\uA73F\u2184]/g }, { 'base': 'd', 'letters': /[\u0064\u24D3\uFF44\u1E0B\u010F\u1E0D\u1E11\u1E13\u1E0F\u0111\u018C\u0256\u0257\uA77A]/g }, { 'base': 'dz', 'letters': /[\u01F3\u01C6]/g }, { 'base': 'e', 'letters': /[\u0065\u24D4\uFF45\u00E8\u00E9\u00EA\u1EC1\u1EBF\u1EC5\u1EC3\u1EBD\u0113\u1E15\u1E17\u0115\u0117\u00EB\u1EBB\u011B\u0205\u0207\u1EB9\u1EC7\u0229\u1E1D\u0119\u1E19\u1E1B\u0247\u025B\u01DD]/g }, { 'base': 'f', 'letters': /[\u0066\u24D5\uFF46\u1E1F\u0192\uA77C]/g }, { 'base': 'g', 'letters': /[\u0067\u24D6\uFF47\u01F5\u011D\u1E21\u011F\u0121\u01E7\u0123\u01E5\u0260\uA7A1\u1D79\uA77F]/g }, { 'base': 'h', 'letters': /[\u0068\u24D7\uFF48\u0125\u1E23\u1E27\u021F\u1E25\u1E29\u1E2B\u1E96\u0127\u2C68\u2C76\u0265]/g }, { 'base': 'hv', 'letters': /[\u0195]/g }, { 'base': 'i', 'letters': /[\u0069\u24D8\uFF49\u00EC\u00ED\u00EE\u0129\u012B\u012D\u00EF\u1E2F\u1EC9\u01D0\u0209\u020B\u1ECB\u012F\u1E2D\u0268\u0131]/g }, { 'base': 'j', 'letters': /[\u006A\u24D9\uFF4A\u0135\u01F0\u0249]/g }, { 'base': 'k', 'letters': /[\u006B\u24DA\uFF4B\u1E31\u01E9\u1E33\u0137\u1E35\u0199\u2C6A\uA741\uA743\uA745\uA7A3]/g }, { 'base': 'l', 'letters': /[\u006C\u24DB\uFF4C\u0140\u013A\u013E\u1E37\u1E39\u013C\u1E3D\u1E3B\u017F\u0142\u019A\u026B\u2C61\uA749\uA781\uA747]/g }, { 'base': 'lj', 'letters': /[\u01C9]/g }, { 'base': 'm', 'letters': /[\u006D\u24DC\uFF4D\u1E3F\u1E41\u1E43\u0271\u026F]/g }, { 'base': 'n', 'letters': /[\u006E\u24DD\uFF4E\u01F9\u0144\u00F1\u1E45\u0148\u1E47\u0146\u1E4B\u1E49\u019E\u0272\u0149\uA791\uA7A5]/g }, { 'base': 'nj', 'letters': /[\u01CC]/g }, { 'base': 'o', 'letters': /[\u006F\u24DE\uFF4F\u00F2\u00F3\u00F4\u1ED3\u1ED1\u1ED7\u1ED5\u00F5\u1E4D\u022D\u1E4F\u014D\u1E51\u1E53\u014F\u022F\u0231\u00F6\u022B\u1ECF\u0151\u01D2\u020D\u020F\u01A1\u1EDD\u1EDB\u1EE1\u1EDF\u1EE3\u1ECD\u1ED9\u01EB\u01ED\u00F8\u01FF\u0254\uA74B\uA74D\u0275]/g }, { 'base': 'oi', 'letters': /[\u01A3]/g }, { 'base': 'ou', 'letters': /[\u0223]/g }, { 'base': 'oo', 'letters': /[\uA74F]/g }, { 'base': 'p', 'letters': /[\u0070\u24DF\uFF50\u1E55\u1E57\u01A5\u1D7D\uA751\uA753\uA755]/g }, { 'base': 'q', 'letters': /[\u0071\u24E0\uFF51\u024B\uA757\uA759]/g }, { 'base': 'r', 'letters': /[\u0072\u24E1\uFF52\u0155\u1E59\u0159\u0211\u0213\u1E5B\u1E5D\u0157\u1E5F\u024D\u027D\uA75B\uA7A7\uA783]/g }, { 'base': 's', 'letters': /[\u0073\u24E2\uFF53\u00DF\u015B\u1E65\u015D\u1E61\u0161\u1E67\u1E63\u1E69\u0219\u015F\u023F\uA7A9\uA785\u1E9B]/g }, { 'base': 't', 'letters': /[\u0074\u24E3\uFF54\u1E6B\u1E97\u0165\u1E6D\u021B\u0163\u1E71\u1E6F\u0167\u01AD\u0288\u2C66\uA787]/g }, { 'base': 'tz', 'letters': /[\uA729]/g }, { 'base': 'u', 'letters': /[\u0075\u24E4\uFF55\u00F9\u00FA\u00FB\u0169\u1E79\u016B\u1E7B\u016D\u00FC\u01DC\u01D8\u01D6\u01DA\u1EE7\u016F\u0171\u01D4\u0215\u0217\u01B0\u1EEB\u1EE9\u1EEF\u1EED\u1EF1\u1EE5\u1E73\u0173\u1E77\u1E75\u0289]/g }, { 'base': 'v', 'letters': /[\u0076\u24E5\uFF56\u1E7D\u1E7F\u028B\uA75F\u028C]/g }, { 'base': 'vy', 'letters': /[\uA761]/g }, { 'base': 'w', 'letters': /[\u0077\u24E6\uFF57\u1E81\u1E83\u0175\u1E87\u1E85\u1E98\u1E89\u2C73]/g }, { 'base': 'x', 'letters': /[\u0078\u24E7\uFF58\u1E8B\u1E8D]/g }, { 'base': 'y', 'letters': /[\u0079\u24E8\uFF59\u1EF3\u00FD\u0177\u1EF9\u0233\u1E8F\u00FF\u1EF7\u1E99\u1EF5\u01B4\u024F\u1EFF]/g }, { 'base': 'z', 'letters': /[\u007A\u24E9\uFF5A\u017A\u1E91\u017C\u017E\u1E93\u1E95\u01B6\u0225\u0240\u2C6C\uA763]/g }];
33
34var stripDiacritics = function stripDiacritics(str) {
35 for (var i = 0; i < map.length; i++) {
36 str = str.replace(map[i].letters, map[i].base);
37 }
38 return str;
39};
40
41var trim = function trim(str) {
42 return str.replace(/^\s+|\s+$/g, '');
43};
44
45var isValid = function isValid(value) {
46 return typeof value !== 'undefined' && value !== null && value !== '';
47};
48
49var filterOptions = function filterOptions(options, filterValue, excludeOptions, props) {
50 if (props.ignoreAccents) {
51 filterValue = stripDiacritics(filterValue);
52 }
53
54 if (props.ignoreCase) {
55 filterValue = filterValue.toLowerCase();
56 }
57
58 if (props.trimFilter) {
59 filterValue = trim(filterValue);
60 }
61
62 if (excludeOptions) excludeOptions = excludeOptions.map(function (i) {
63 return i[props.valueKey];
64 });
65
66 return options.filter(function (option) {
67 if (excludeOptions && excludeOptions.indexOf(option[props.valueKey]) > -1) return false;
68 if (props.filterOption) return props.filterOption.call(undefined, option, filterValue);
69 if (!filterValue) return true;
70
71 var value = option[props.valueKey];
72 var label = option[props.labelKey];
73 var hasValue = isValid(value);
74 var hasLabel = isValid(label);
75
76 if (!hasValue && !hasLabel) {
77 return false;
78 }
79
80 var valueTest = hasValue ? String(value) : null;
81 var labelTest = hasLabel ? String(label) : null;
82
83 if (props.ignoreAccents) {
84 if (valueTest && props.matchProp !== 'label') valueTest = stripDiacritics(valueTest);
85 if (labelTest && props.matchProp !== 'value') labelTest = stripDiacritics(labelTest);
86 }
87
88 if (props.ignoreCase) {
89 if (valueTest && props.matchProp !== 'label') valueTest = valueTest.toLowerCase();
90 if (labelTest && props.matchProp !== 'value') labelTest = labelTest.toLowerCase();
91 }
92
93 return props.matchPos === 'start' ? valueTest && props.matchProp !== 'label' && valueTest.substr(0, filterValue.length) === filterValue || labelTest && props.matchProp !== 'value' && labelTest.substr(0, filterValue.length) === filterValue : valueTest && props.matchProp !== 'label' && valueTest.indexOf(filterValue) >= 0 || labelTest && props.matchProp !== 'value' && labelTest.indexOf(filterValue) >= 0;
94 });
95};
96
97var menuRenderer = function menuRenderer(_ref) {
98 var focusedOption = _ref.focusedOption,
99 focusOption = _ref.focusOption,
100 inputValue = _ref.inputValue,
101 instancePrefix = _ref.instancePrefix,
102 onFocus = _ref.onFocus,
103 onOptionRef = _ref.onOptionRef,
104 onSelect = _ref.onSelect,
105 optionClassName = _ref.optionClassName,
106 optionComponent = _ref.optionComponent,
107 optionRenderer = _ref.optionRenderer,
108 options = _ref.options,
109 removeValue = _ref.removeValue,
110 selectValue = _ref.selectValue,
111 valueArray = _ref.valueArray,
112 valueKey = _ref.valueKey;
113
114 var Option = optionComponent;
115
116 return options.map(function (option, i) {
117 var isSelected = valueArray && valueArray.some(function (x) {
118 return x[valueKey] === option[valueKey];
119 });
120 var isFocused = option === focusedOption;
121 var optionClass = classNames(optionClassName, {
122 'Select-option': true,
123 'is-selected': isSelected,
124 'is-focused': isFocused,
125 'is-disabled': option.disabled
126 });
127
128 return React__default.createElement(
129 Option,
130 {
131 className: optionClass,
132 focusOption: focusOption,
133 inputValue: inputValue,
134 instancePrefix: instancePrefix,
135 isDisabled: option.disabled,
136 isFocused: isFocused,
137 isSelected: isSelected,
138 key: 'option-' + i + '-' + option[valueKey],
139 onFocus: onFocus,
140 onSelect: onSelect,
141 option: option,
142 optionIndex: i,
143 ref: function ref(_ref2) {
144 onOptionRef(_ref2, isFocused);
145 },
146 removeValue: removeValue,
147 selectValue: selectValue
148 },
149 optionRenderer(option, i, inputValue)
150 );
151 });
152};
153
154menuRenderer.propTypes = {
155 focusOption: PropTypes.func,
156 focusedOption: PropTypes.object,
157 inputValue: PropTypes.string,
158 instancePrefix: PropTypes.string,
159 onFocus: PropTypes.func,
160 onOptionRef: PropTypes.func,
161 onSelect: PropTypes.func,
162 optionClassName: PropTypes.string,
163 optionComponent: PropTypes.func,
164 optionRenderer: PropTypes.func,
165 options: PropTypes.array,
166 removeValue: PropTypes.func,
167 selectValue: PropTypes.func,
168 valueArray: PropTypes.array,
169 valueKey: PropTypes.string
170};
171
172var blockEvent = (function (event) {
173 event.preventDefault();
174 event.stopPropagation();
175 if (event.target.tagName !== 'A' || !('href' in event.target)) {
176 return;
177 }
178 if (event.target.target) {
179 window.open(event.target.href, event.target.target);
180 } else {
181 window.location.href = event.target.href;
182 }
183});
184
185var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
186 return typeof obj;
187} : function (obj) {
188 return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
189};
190
191
192
193
194
195var asyncGenerator = function () {
196 function AwaitValue(value) {
197 this.value = value;
198 }
199
200 function AsyncGenerator(gen) {
201 var front, back;
202
203 function send(key, arg) {
204 return new Promise(function (resolve, reject) {
205 var request = {
206 key: key,
207 arg: arg,
208 resolve: resolve,
209 reject: reject,
210 next: null
211 };
212
213 if (back) {
214 back = back.next = request;
215 } else {
216 front = back = request;
217 resume(key, arg);
218 }
219 });
220 }
221
222 function resume(key, arg) {
223 try {
224 var result = gen[key](arg);
225 var value = result.value;
226
227 if (value instanceof AwaitValue) {
228 Promise.resolve(value.value).then(function (arg) {
229 resume("next", arg);
230 }, function (arg) {
231 resume("throw", arg);
232 });
233 } else {
234 settle(result.done ? "return" : "normal", result.value);
235 }
236 } catch (err) {
237 settle("throw", err);
238 }
239 }
240
241 function settle(type, value) {
242 switch (type) {
243 case "return":
244 front.resolve({
245 value: value,
246 done: true
247 });
248 break;
249
250 case "throw":
251 front.reject(value);
252 break;
253
254 default:
255 front.resolve({
256 value: value,
257 done: false
258 });
259 break;
260 }
261
262 front = front.next;
263
264 if (front) {
265 resume(front.key, front.arg);
266 } else {
267 back = null;
268 }
269 }
270
271 this._invoke = send;
272
273 if (typeof gen.return !== "function") {
274 this.return = undefined;
275 }
276 }
277
278 if (typeof Symbol === "function" && Symbol.asyncIterator) {
279 AsyncGenerator.prototype[Symbol.asyncIterator] = function () {
280 return this;
281 };
282 }
283
284 AsyncGenerator.prototype.next = function (arg) {
285 return this._invoke("next", arg);
286 };
287
288 AsyncGenerator.prototype.throw = function (arg) {
289 return this._invoke("throw", arg);
290 };
291
292 AsyncGenerator.prototype.return = function (arg) {
293 return this._invoke("return", arg);
294 };
295
296 return {
297 wrap: function (fn) {
298 return function () {
299 return new AsyncGenerator(fn.apply(this, arguments));
300 };
301 },
302 await: function (value) {
303 return new AwaitValue(value);
304 }
305 };
306}();
307
308
309
310
311
312var classCallCheck = function (instance, Constructor) {
313 if (!(instance instanceof Constructor)) {
314 throw new TypeError("Cannot call a class as a function");
315 }
316};
317
318var createClass = function () {
319 function defineProperties(target, props) {
320 for (var i = 0; i < props.length; i++) {
321 var descriptor = props[i];
322 descriptor.enumerable = descriptor.enumerable || false;
323 descriptor.configurable = true;
324 if ("value" in descriptor) descriptor.writable = true;
325 Object.defineProperty(target, descriptor.key, descriptor);
326 }
327 }
328
329 return function (Constructor, protoProps, staticProps) {
330 if (protoProps) defineProperties(Constructor.prototype, protoProps);
331 if (staticProps) defineProperties(Constructor, staticProps);
332 return Constructor;
333 };
334}();
335
336
337
338
339
340var defineProperty = function (obj, key, value) {
341 if (key in obj) {
342 Object.defineProperty(obj, key, {
343 value: value,
344 enumerable: true,
345 configurable: true,
346 writable: true
347 });
348 } else {
349 obj[key] = value;
350 }
351
352 return obj;
353};
354
355var _extends = Object.assign || function (target) {
356 for (var i = 1; i < arguments.length; i++) {
357 var source = arguments[i];
358
359 for (var key in source) {
360 if (Object.prototype.hasOwnProperty.call(source, key)) {
361 target[key] = source[key];
362 }
363 }
364 }
365
366 return target;
367};
368
369
370
371var inherits = function (subClass, superClass) {
372 if (typeof superClass !== "function" && superClass !== null) {
373 throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
374 }
375
376 subClass.prototype = Object.create(superClass && superClass.prototype, {
377 constructor: {
378 value: subClass,
379 enumerable: false,
380 writable: true,
381 configurable: true
382 }
383 });
384 if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
385};
386
387
388
389
390
391
392
393
394
395var objectWithoutProperties = function (obj, keys) {
396 var target = {};
397
398 for (var i in obj) {
399 if (keys.indexOf(i) >= 0) continue;
400 if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;
401 target[i] = obj[i];
402 }
403
404 return target;
405};
406
407var possibleConstructorReturn = function (self, call) {
408 if (!self) {
409 throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
410 }
411
412 return call && (typeof call === "object" || typeof call === "function") ? call : self;
413};
414
415var Option = function (_React$Component) {
416 inherits(Option, _React$Component);
417
418 function Option(props) {
419 classCallCheck(this, Option);
420
421 var _this = possibleConstructorReturn(this, (Option.__proto__ || Object.getPrototypeOf(Option)).call(this, props));
422
423 _this.handleMouseDown = _this.handleMouseDown.bind(_this);
424 _this.handleMouseEnter = _this.handleMouseEnter.bind(_this);
425 _this.handleMouseMove = _this.handleMouseMove.bind(_this);
426 _this.handleTouchStart = _this.handleTouchStart.bind(_this);
427 _this.handleTouchEnd = _this.handleTouchEnd.bind(_this);
428 _this.handleTouchMove = _this.handleTouchMove.bind(_this);
429 _this.onFocus = _this.onFocus.bind(_this);
430 return _this;
431 }
432
433 createClass(Option, [{
434 key: 'handleMouseDown',
435 value: function handleMouseDown(event) {
436 event.preventDefault();
437 event.stopPropagation();
438 this.props.onSelect(this.props.option, event);
439 }
440 }, {
441 key: 'handleMouseEnter',
442 value: function handleMouseEnter(event) {
443 this.onFocus(event);
444 }
445 }, {
446 key: 'handleMouseMove',
447 value: function handleMouseMove(event) {
448 this.onFocus(event);
449 }
450 }, {
451 key: 'handleTouchEnd',
452 value: function handleTouchEnd(event) {
453 // Check if the view is being dragged, In this case
454 // we don't want to fire the click event (because the user only wants to scroll)
455 if (this.dragging) return;
456
457 this.handleMouseDown(event);
458 }
459 }, {
460 key: 'handleTouchMove',
461 value: function handleTouchMove() {
462 // Set a flag that the view is being dragged
463 this.dragging = true;
464 }
465 }, {
466 key: 'handleTouchStart',
467 value: function handleTouchStart() {
468 // Set a flag that the view is not being dragged
469 this.dragging = false;
470 }
471 }, {
472 key: 'onFocus',
473 value: function onFocus(event) {
474 if (!this.props.isFocused) {
475 this.props.onFocus(this.props.option, event);
476 }
477 }
478 }, {
479 key: 'render',
480 value: function render() {
481 var _props = this.props,
482 option = _props.option,
483 instancePrefix = _props.instancePrefix,
484 optionIndex = _props.optionIndex;
485
486 var className = classNames(this.props.className, option.className);
487
488 return option.disabled ? React__default.createElement(
489 'div',
490 { className: className,
491 onMouseDown: blockEvent,
492 onClick: blockEvent },
493 this.props.children
494 ) : React__default.createElement(
495 'div',
496 { className: className,
497 style: option.style,
498 role: 'option',
499 'aria-label': option.label,
500 onMouseDown: this.handleMouseDown,
501 onMouseEnter: this.handleMouseEnter,
502 onMouseMove: this.handleMouseMove,
503 onTouchStart: this.handleTouchStart,
504 onTouchMove: this.handleTouchMove,
505 onTouchEnd: this.handleTouchEnd,
506 id: instancePrefix + '-option-' + optionIndex,
507 title: option.title },
508 this.props.children
509 );
510 }
511 }]);
512 return Option;
513}(React__default.Component);
514
515Option.propTypes = {
516 children: PropTypes.node,
517 className: PropTypes.string, // className (based on mouse position)
518 instancePrefix: PropTypes.string.isRequired, // unique prefix for the ids (used for aria)
519 isDisabled: PropTypes.bool, // the option is disabled
520 isFocused: PropTypes.bool, // the option is focused
521 isSelected: PropTypes.bool, // the option is selected
522 onFocus: PropTypes.func, // method to handle mouseEnter on option element
523 onSelect: PropTypes.func, // method to handle click on option element
524 onUnfocus: PropTypes.func, // method to handle mouseLeave on option element
525 option: PropTypes.object.isRequired, // object that is base for that option
526 optionIndex: PropTypes.number // index of the option, used to generate unique ids for aria
527};
528
529var Value = function (_React$Component) {
530 inherits(Value, _React$Component);
531
532 function Value(props) {
533 classCallCheck(this, Value);
534
535 var _this = possibleConstructorReturn(this, (Value.__proto__ || Object.getPrototypeOf(Value)).call(this, props));
536
537 _this.handleMouseDown = _this.handleMouseDown.bind(_this);
538 _this.onRemove = _this.onRemove.bind(_this);
539 _this.handleTouchEndRemove = _this.handleTouchEndRemove.bind(_this);
540 _this.handleTouchMove = _this.handleTouchMove.bind(_this);
541 _this.handleTouchStart = _this.handleTouchStart.bind(_this);
542 return _this;
543 }
544
545 createClass(Value, [{
546 key: 'handleMouseDown',
547 value: function handleMouseDown(event) {
548 if (event.type === 'mousedown' && event.button !== 0) {
549 return;
550 }
551 if (this.props.onClick) {
552 event.stopPropagation();
553 this.props.onClick(this.props.value, event);
554 return;
555 }
556 if (this.props.value.href) {
557 event.stopPropagation();
558 }
559 }
560 }, {
561 key: 'onRemove',
562 value: function onRemove(event) {
563 event.preventDefault();
564 event.stopPropagation();
565 this.props.onRemove(this.props.value);
566 }
567 }, {
568 key: 'handleTouchEndRemove',
569 value: function handleTouchEndRemove(event) {
570 // Check if the view is being dragged, In this case
571 // we don't want to fire the click event (because the user only wants to scroll)
572 if (this.dragging) return;
573
574 // Fire the mouse events
575 this.onRemove(event);
576 }
577 }, {
578 key: 'handleTouchMove',
579 value: function handleTouchMove() {
580 // Set a flag that the view is being dragged
581 this.dragging = true;
582 }
583 }, {
584 key: 'handleTouchStart',
585 value: function handleTouchStart() {
586 // Set a flag that the view is not being dragged
587 this.dragging = false;
588 }
589 }, {
590 key: 'renderRemoveIcon',
591 value: function renderRemoveIcon() {
592 if (this.props.disabled || !this.props.onRemove) return;
593 return React__default.createElement(
594 'span',
595 { className: 'Select-value-icon',
596 'aria-hidden': 'true',
597 onMouseDown: this.onRemove,
598 onTouchEnd: this.handleTouchEndRemove,
599 onTouchStart: this.handleTouchStart,
600 onTouchMove: this.handleTouchMove },
601 '\xD7'
602 );
603 }
604 }, {
605 key: 'renderLabel',
606 value: function renderLabel() {
607 var className = 'Select-value-label';
608 return this.props.onClick || this.props.value.href ? React__default.createElement(
609 'a',
610 { className: className, href: this.props.value.href, target: this.props.value.target, onMouseDown: this.handleMouseDown, onTouchEnd: this.handleMouseDown },
611 this.props.children
612 ) : React__default.createElement(
613 'span',
614 { className: className, role: 'option', 'aria-selected': 'true', id: this.props.id },
615 this.props.children
616 );
617 }
618 }, {
619 key: 'render',
620 value: function render() {
621 return React__default.createElement(
622 'div',
623 { className: classNames('Select-value', this.props.value.className),
624 style: this.props.value.style,
625 title: this.props.value.title
626 },
627 this.renderRemoveIcon(),
628 this.renderLabel()
629 );
630 }
631 }]);
632 return Value;
633}(React__default.Component);
634
635Value.propTypes = {
636 children: PropTypes.node,
637 disabled: PropTypes.bool, // disabled prop passed to ReactSelect
638 id: PropTypes.string, // Unique id for the value - used for aria
639 onClick: PropTypes.func, // method to handle click on value label
640 onRemove: PropTypes.func, // method to handle removal of the value
641 value: PropTypes.object.isRequired // the option object for this value
642};
643
644/*!
645 Copyright (c) 2018 Jed Watson.
646 Licensed under the MIT License (MIT), see
647 http://jedwatson.github.io/react-select
648*/
649var stringifyValue = function stringifyValue(value) {
650 return typeof value === 'string' ? value : value !== null && JSON.stringify(value) || '';
651};
652
653var stringOrNode = PropTypes.oneOfType([PropTypes.string, PropTypes.node]);
654var stringOrNumber = PropTypes.oneOfType([PropTypes.string, PropTypes.number]);
655
656var instanceId = 1;
657
658var shouldShowValue = function shouldShowValue(state, props) {
659 var inputValue = state.inputValue,
660 isPseudoFocused = state.isPseudoFocused,
661 isFocused = state.isFocused;
662 var onSelectResetsInput = props.onSelectResetsInput;
663
664
665 if (!inputValue) return true;
666
667 if (!onSelectResetsInput) {
668 return !(!isFocused && isPseudoFocused || isFocused && !isPseudoFocused);
669 }
670
671 return false;
672};
673
674var shouldShowPlaceholder = function shouldShowPlaceholder(state, props, isOpen) {
675 var inputValue = state.inputValue,
676 isPseudoFocused = state.isPseudoFocused,
677 isFocused = state.isFocused;
678 var onSelectResetsInput = props.onSelectResetsInput;
679
680
681 return !inputValue || !onSelectResetsInput && !isOpen && !isPseudoFocused && !isFocused;
682};
683
684/**
685 * Retrieve a value from the given options and valueKey
686 * @param {String|Number|Array} value - the selected value(s)
687 * @param {Object} props - the Select component's props (or nextProps)
688 */
689var expandValue = function expandValue(value, props) {
690 var valueType = typeof value === 'undefined' ? 'undefined' : _typeof(value);
691 if (valueType !== 'string' && valueType !== 'number' && valueType !== 'boolean') return value;
692 var options = props.options,
693 valueKey = props.valueKey;
694
695 if (!options) return;
696 for (var i = 0; i < options.length; i++) {
697 if (String(options[i][valueKey]) === String(value)) return options[i];
698 }
699};
700
701var handleRequired = function handleRequired(value, multi) {
702 if (!value) return true;
703 return multi ? value.length === 0 : Object.keys(value).length === 0;
704};
705
706var Select$1 = function (_React$Component) {
707 inherits(Select, _React$Component);
708
709 function Select(props) {
710 classCallCheck(this, Select);
711
712 var _this = possibleConstructorReturn(this, (Select.__proto__ || Object.getPrototypeOf(Select)).call(this, props));
713
714 ['clearValue', 'focusOption', 'getOptionLabel', 'handleInputBlur', 'handleInputChange', 'handleInputFocus', 'handleInputValueChange', 'handleKeyDown', 'handleMenuScroll', 'handleMouseDown', 'handleMouseDownOnArrow', 'handleMouseDownOnMenu', 'handleTouchEnd', 'handleTouchEndClearValue', 'handleTouchMove', 'handleTouchOutside', 'handleTouchStart', 'handleValueClick', 'onOptionRef', 'removeValue', 'selectValue'].forEach(function (fn) {
715 return _this[fn] = _this[fn].bind(_this);
716 });
717
718 _this.state = {
719 inputValue: '',
720 isFocused: false,
721 isOpen: false,
722 isPseudoFocused: false,
723 required: false
724 };
725 return _this;
726 }
727
728 createClass(Select, [{
729 key: 'componentWillMount',
730 value: function componentWillMount() {
731 this._instancePrefix = 'react-select-' + (this.props.instanceId || ++instanceId) + '-';
732 var valueArray = this.getValueArray(this.props.value);
733
734 if (this.props.required) {
735 this.setState({
736 required: handleRequired(valueArray[0], this.props.multi)
737 });
738 }
739 }
740 }, {
741 key: 'componentDidMount',
742 value: function componentDidMount() {
743 if (typeof this.props.autofocus !== 'undefined' && typeof console !== 'undefined') {
744 console.warn('Warning: The autofocus prop has changed to autoFocus, support will be removed after react-select@1.0');
745 }
746 if (this.props.autoFocus || this.props.autofocus) {
747 this.focus();
748 }
749 }
750 }, {
751 key: 'componentWillReceiveProps',
752 value: function componentWillReceiveProps(nextProps) {
753 var valueArray = this.getValueArray(nextProps.value, nextProps);
754
755 if (nextProps.required) {
756 this.setState({
757 required: handleRequired(valueArray[0], nextProps.multi)
758 });
759 } else if (this.props.required) {
760 // Used to be required but it's not any more
761 this.setState({ required: false });
762 }
763
764 if (this.state.inputValue && this.props.value !== nextProps.value && nextProps.onSelectResetsInput) {
765 this.setState({ inputValue: this.handleInputValueChange('') });
766 }
767 }
768 }, {
769 key: 'componentDidUpdate',
770 value: function componentDidUpdate(prevProps, prevState) {
771 // focus to the selected option
772 if (this.menu && this.focused && this.state.isOpen && !this.hasScrolledToOption) {
773 var focusedOptionNode = reactDom.findDOMNode(this.focused);
774 var menuNode = reactDom.findDOMNode(this.menu);
775
776 var scrollTop = menuNode.scrollTop;
777 var scrollBottom = scrollTop + menuNode.offsetHeight;
778 var optionTop = focusedOptionNode.offsetTop;
779 var optionBottom = optionTop + focusedOptionNode.offsetHeight;
780
781 if (scrollTop > optionTop || scrollBottom < optionBottom) {
782 menuNode.scrollTop = focusedOptionNode.offsetTop;
783 }
784
785 // We still set hasScrolledToOption to true even if we didn't
786 // actually need to scroll, as we've still confirmed that the
787 // option is in view.
788 this.hasScrolledToOption = true;
789 } else if (!this.state.isOpen) {
790 this.hasScrolledToOption = false;
791 }
792
793 if (this._scrollToFocusedOptionOnUpdate && this.focused && this.menu) {
794 this._scrollToFocusedOptionOnUpdate = false;
795 var focusedDOM = reactDom.findDOMNode(this.focused);
796 var menuDOM = reactDom.findDOMNode(this.menu);
797 var focusedRect = focusedDOM.getBoundingClientRect();
798 var menuRect = menuDOM.getBoundingClientRect();
799 if (focusedRect.bottom > menuRect.bottom) {
800 menuDOM.scrollTop = focusedDOM.offsetTop + focusedDOM.clientHeight - menuDOM.offsetHeight;
801 } else if (focusedRect.top < menuRect.top) {
802 menuDOM.scrollTop = focusedDOM.offsetTop;
803 }
804 }
805 if (this.props.scrollMenuIntoView && this.menuContainer) {
806 var menuContainerRect = this.menuContainer.getBoundingClientRect();
807 if (window.innerHeight < menuContainerRect.bottom + this.props.menuBuffer) {
808 window.scrollBy(0, menuContainerRect.bottom + this.props.menuBuffer - window.innerHeight);
809 }
810 }
811 if (prevProps.disabled !== this.props.disabled) {
812 this.setState({ isFocused: false }); // eslint-disable-line react/no-did-update-set-state
813 this.closeMenu();
814 }
815 if (prevState.isOpen !== this.state.isOpen) {
816 this.toggleTouchOutsideEvent(this.state.isOpen);
817 var handler = this.state.isOpen ? this.props.onOpen : this.props.onClose;
818 handler && handler();
819 }
820 }
821 }, {
822 key: 'componentWillUnmount',
823 value: function componentWillUnmount() {
824 this.toggleTouchOutsideEvent(false);
825 }
826 }, {
827 key: 'toggleTouchOutsideEvent',
828 value: function toggleTouchOutsideEvent(enabled) {
829 if (enabled) {
830 if (!document.addEventListener && document.attachEvent) {
831 document.attachEvent('ontouchstart', this.handleTouchOutside);
832 } else {
833 document.addEventListener('touchstart', this.handleTouchOutside);
834 }
835 } else {
836 if (!document.removeEventListener && document.detachEvent) {
837 document.detachEvent('ontouchstart', this.handleTouchOutside);
838 } else {
839 document.removeEventListener('touchstart', this.handleTouchOutside);
840 }
841 }
842 }
843 }, {
844 key: 'handleTouchOutside',
845 value: function handleTouchOutside(event) {
846 // handle touch outside on ios to dismiss menu
847 if (this.wrapper && !this.wrapper.contains(event.target)) {
848 this.closeMenu();
849 }
850 }
851 }, {
852 key: 'focus',
853 value: function focus() {
854 if (!this.input) return;
855 this.input.focus();
856 }
857 }, {
858 key: 'blurInput',
859 value: function blurInput() {
860 if (!this.input) return;
861 this.input.blur();
862 }
863 }, {
864 key: 'handleTouchMove',
865 value: function handleTouchMove() {
866 // Set a flag that the view is being dragged
867 this.dragging = true;
868 }
869 }, {
870 key: 'handleTouchStart',
871 value: function handleTouchStart() {
872 // Set a flag that the view is not being dragged
873 this.dragging = false;
874 }
875 }, {
876 key: 'handleTouchEnd',
877 value: function handleTouchEnd(event) {
878 // Check if the view is being dragged, In this case
879 // we don't want to fire the click event (because the user only wants to scroll)
880 if (this.dragging) return;
881
882 // Fire the mouse events
883 this.handleMouseDown(event);
884 }
885 }, {
886 key: 'handleTouchEndClearValue',
887 value: function handleTouchEndClearValue(event) {
888 // Check if the view is being dragged, In this case
889 // we don't want to fire the click event (because the user only wants to scroll)
890 if (this.dragging) return;
891
892 // Clear the value
893 this.clearValue(event);
894 }
895 }, {
896 key: 'handleMouseDown',
897 value: function handleMouseDown(event) {
898 // if the event was triggered by a mousedown and not the primary
899 // button, or if the component is disabled, ignore it.
900 if (this.props.disabled || event.type === 'mousedown' && event.button !== 0) {
901 return;
902 }
903
904 if (event.target.tagName === 'INPUT') {
905 if (!this.state.isFocused) {
906 this._openAfterFocus = this.props.openOnClick;
907 this.focus();
908 } else if (!this.state.isOpen) {
909 this.setState({
910 isOpen: true,
911 isPseudoFocused: false
912 });
913 }
914
915 return;
916 }
917
918 // prevent default event handlers
919 event.preventDefault();
920
921 // for the non-searchable select, toggle the menu
922 if (!this.props.searchable) {
923 // This code means that if a select is searchable, onClick the options menu will not appear, only on subsequent click will it open.
924 this.focus();
925 return this.setState({
926 isOpen: !this.state.isOpen
927 });
928 }
929
930 if (this.state.isFocused) {
931 // On iOS, we can get into a state where we think the input is focused but it isn't really,
932 // since iOS ignores programmatic calls to input.focus() that weren't triggered by a click event.
933 // Call focus() again here to be safe.
934 this.focus();
935
936 var input = this.input;
937 var toOpen = true;
938
939 if (typeof input.getInput === 'function') {
940 // Get the actual DOM input if the ref is an <AutosizeInput /> component
941 input = input.getInput();
942 }
943
944 // clears the value so that the cursor will be at the end of input when the component re-renders
945 input.value = '';
946
947 if (this._focusAfterClear) {
948 toOpen = false;
949 this._focusAfterClear = false;
950 }
951
952 // if the input is focused, ensure the menu is open
953 this.setState({
954 isOpen: toOpen,
955 isPseudoFocused: false,
956 focusedOption: null
957 });
958 } else {
959 // otherwise, focus the input and open the menu
960 this._openAfterFocus = this.props.openOnClick;
961 this.focus();
962 this.setState({ focusedOption: null });
963 }
964 }
965 }, {
966 key: 'handleMouseDownOnArrow',
967 value: function handleMouseDownOnArrow(event) {
968 // if the event was triggered by a mousedown and not the primary
969 // button, or if the component is disabled, ignore it.
970 if (this.props.disabled || event.type === 'mousedown' && event.button !== 0) {
971 return;
972 }
973
974 if (this.state.isOpen) {
975 // prevent default event handlers
976 event.stopPropagation();
977 event.preventDefault();
978 // close the menu
979 this.closeMenu();
980 } else {
981 // If the menu isn't open, let the event bubble to the main handleMouseDown
982 this.setState({
983 isOpen: true
984 });
985 }
986 }
987 }, {
988 key: 'handleMouseDownOnMenu',
989 value: function handleMouseDownOnMenu(event) {
990 // if the event was triggered by a mousedown and not the primary
991 // button, or if the component is disabled, ignore it.
992 if (this.props.disabled || event.type === 'mousedown' && event.button !== 0) {
993 return;
994 }
995
996 event.stopPropagation();
997 event.preventDefault();
998
999 this._openAfterFocus = true;
1000 this.focus();
1001 }
1002 }, {
1003 key: 'closeMenu',
1004 value: function closeMenu() {
1005 if (this.props.onCloseResetsInput) {
1006 this.setState({
1007 inputValue: this.handleInputValueChange(''),
1008 isOpen: false,
1009 isPseudoFocused: this.state.isFocused && !this.props.multi
1010 });
1011 } else {
1012 this.setState({
1013 isOpen: false,
1014 isPseudoFocused: this.state.isFocused && !this.props.multi
1015 });
1016 }
1017 this.hasScrolledToOption = false;
1018 }
1019 }, {
1020 key: 'handleInputFocus',
1021 value: function handleInputFocus(event) {
1022 if (this.props.disabled) return;
1023
1024 var toOpen = this.state.isOpen || this._openAfterFocus || this.props.openOnFocus;
1025 toOpen = this._focusAfterClear ? false : toOpen; //if focus happens after clear values, don't open dropdown yet.
1026
1027 if (this.props.onFocus) {
1028 this.props.onFocus(event);
1029 }
1030
1031 this.setState({
1032 isFocused: true,
1033 isOpen: !!toOpen
1034 });
1035
1036 this._focusAfterClear = false;
1037 this._openAfterFocus = false;
1038 }
1039 }, {
1040 key: 'handleInputBlur',
1041 value: function handleInputBlur(event) {
1042 // The check for menu.contains(activeElement) is necessary to prevent IE11's scrollbar from closing the menu in certain contexts.
1043 if (this.menu && (this.menu === document.activeElement || this.menu.contains(document.activeElement))) {
1044 this.focus();
1045 return;
1046 }
1047
1048 if (this.props.onBlur) {
1049 this.props.onBlur(event);
1050 }
1051 var onBlurredState = {
1052 isFocused: false,
1053 isOpen: false,
1054 isPseudoFocused: false
1055 };
1056 if (this.props.onBlurResetsInput) {
1057 onBlurredState.inputValue = this.handleInputValueChange('');
1058 }
1059 this.setState(onBlurredState);
1060 }
1061 }, {
1062 key: 'handleInputChange',
1063 value: function handleInputChange(event) {
1064 var newInputValue = event.target.value;
1065
1066 if (this.state.inputValue !== event.target.value) {
1067 newInputValue = this.handleInputValueChange(newInputValue);
1068 }
1069
1070 this.setState({
1071 inputValue: newInputValue,
1072 isOpen: true,
1073 isPseudoFocused: false
1074 });
1075 }
1076 }, {
1077 key: 'setInputValue',
1078 value: function setInputValue(newValue) {
1079 if (this.props.onInputChange) {
1080 var nextState = this.props.onInputChange(newValue);
1081 if (nextState != null && (typeof nextState === 'undefined' ? 'undefined' : _typeof(nextState)) !== 'object') {
1082 newValue = '' + nextState;
1083 }
1084 }
1085 this.setState({
1086 inputValue: newValue
1087 });
1088 }
1089 }, {
1090 key: 'handleInputValueChange',
1091 value: function handleInputValueChange(newValue) {
1092 if (this.props.onInputChange) {
1093 var nextState = this.props.onInputChange(newValue);
1094 // Note: != used deliberately here to catch undefined and null
1095 if (nextState != null && (typeof nextState === 'undefined' ? 'undefined' : _typeof(nextState)) !== 'object') {
1096 newValue = '' + nextState;
1097 }
1098 }
1099 return newValue;
1100 }
1101 }, {
1102 key: 'handleKeyDown',
1103 value: function handleKeyDown(event) {
1104 if (this.props.disabled) return;
1105
1106 if (typeof this.props.onInputKeyDown === 'function') {
1107 this.props.onInputKeyDown(event);
1108 if (event.defaultPrevented) {
1109 return;
1110 }
1111 }
1112
1113 switch (event.keyCode) {
1114 case 8:
1115 // backspace
1116 if (!this.state.inputValue && this.props.backspaceRemoves) {
1117 event.preventDefault();
1118 this.popValue();
1119 }
1120 break;
1121 case 9:
1122 // tab
1123 if (event.shiftKey || !this.state.isOpen || !this.props.tabSelectsValue) {
1124 break;
1125 }
1126 event.preventDefault();
1127 this.selectFocusedOption();
1128 break;
1129 case 13:
1130 // enter
1131 event.preventDefault();
1132 event.stopPropagation();
1133 if (this.state.isOpen) {
1134 this.selectFocusedOption();
1135 } else {
1136 this.focusNextOption();
1137 }
1138 break;
1139 case 27:
1140 // escape
1141 event.preventDefault();
1142 if (this.state.isOpen) {
1143 this.closeMenu();
1144 event.stopPropagation();
1145 } else if (this.props.clearable && this.props.escapeClearsValue) {
1146 this.clearValue(event);
1147 event.stopPropagation();
1148 }
1149 break;
1150 case 32:
1151 // space
1152 if (this.props.searchable) {
1153 break;
1154 }
1155 event.preventDefault();
1156 if (!this.state.isOpen) {
1157 this.focusNextOption();
1158 break;
1159 }
1160 event.stopPropagation();
1161 this.selectFocusedOption();
1162 break;
1163 case 38:
1164 // up
1165 event.preventDefault();
1166 this.focusPreviousOption();
1167 break;
1168 case 40:
1169 // down
1170 event.preventDefault();
1171 this.focusNextOption();
1172 break;
1173 case 33:
1174 // page up
1175 event.preventDefault();
1176 this.focusPageUpOption();
1177 break;
1178 case 34:
1179 // page down
1180 event.preventDefault();
1181 this.focusPageDownOption();
1182 break;
1183 case 35:
1184 // end key
1185 if (event.shiftKey) {
1186 break;
1187 }
1188 event.preventDefault();
1189 this.focusEndOption();
1190 break;
1191 case 36:
1192 // home key
1193 if (event.shiftKey) {
1194 break;
1195 }
1196 event.preventDefault();
1197 this.focusStartOption();
1198 break;
1199 case 46:
1200 // delete
1201 if (!this.state.inputValue && this.props.deleteRemoves) {
1202 event.preventDefault();
1203 this.popValue();
1204 }
1205 break;
1206 }
1207 }
1208 }, {
1209 key: 'handleValueClick',
1210 value: function handleValueClick(option, event) {
1211 if (!this.props.onValueClick) return;
1212 this.props.onValueClick(option, event);
1213 }
1214 }, {
1215 key: 'handleMenuScroll',
1216 value: function handleMenuScroll(event) {
1217 if (!this.props.onMenuScrollToBottom) return;
1218 var target = event.target;
1219
1220 if (target.scrollHeight > target.offsetHeight && target.scrollHeight - target.offsetHeight - target.scrollTop <= 0) {
1221 this.props.onMenuScrollToBottom();
1222 }
1223 }
1224 }, {
1225 key: 'getOptionLabel',
1226 value: function getOptionLabel(op) {
1227 return op[this.props.labelKey];
1228 }
1229
1230 /**
1231 * Turns a value into an array from the given options
1232 * @param {String|Number|Array} value - the value of the select input
1233 * @param {Object} nextProps - optionally specify the nextProps so the returned array uses the latest configuration
1234 * @returns {Array} the value of the select represented in an array
1235 */
1236
1237 }, {
1238 key: 'getValueArray',
1239 value: function getValueArray(value) {
1240 var nextProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
1241
1242 /** support optionally passing in the `nextProps` so `componentWillReceiveProps` updates will function as expected */
1243 var props = (typeof nextProps === 'undefined' ? 'undefined' : _typeof(nextProps)) === 'object' ? nextProps : this.props;
1244 if (props.multi) {
1245 if (typeof value === 'string') {
1246 value = value.split(props.delimiter);
1247 }
1248 if (!Array.isArray(value)) {
1249 if (value === null || value === undefined) return [];
1250 value = [value];
1251 }
1252 return value.map(function (value) {
1253 return expandValue(value, props);
1254 }).filter(function (i) {
1255 return i;
1256 });
1257 }
1258 var expandedValue = expandValue(value, props);
1259 return expandedValue ? [expandedValue] : [];
1260 }
1261 }, {
1262 key: 'setValue',
1263 value: function setValue(value) {
1264 var _this2 = this;
1265
1266 if (this.props.autoBlur) {
1267 this.blurInput();
1268 }
1269 if (this.props.required) {
1270 var required = handleRequired(value, this.props.multi);
1271 this.setState({ required: required });
1272 }
1273 if (this.props.simpleValue && value) {
1274 value = this.props.multi ? value.map(function (i) {
1275 return i[_this2.props.valueKey];
1276 }).join(this.props.delimiter) : value[this.props.valueKey];
1277 }
1278 if (this.props.onChange) {
1279 this.props.onChange(value);
1280 }
1281 }
1282 }, {
1283 key: 'selectValue',
1284 value: function selectValue(value) {
1285 var _this3 = this;
1286
1287 // NOTE: we actually add/set the value in a callback to make sure the
1288 // input value is empty to avoid styling issues in Chrome
1289 if (this.props.closeOnSelect) {
1290 this.hasScrolledToOption = false;
1291 }
1292 var updatedValue = this.props.onSelectResetsInput ? '' : this.state.inputValue;
1293 if (this.props.multi) {
1294 this.setState({
1295 focusedIndex: null,
1296 inputValue: this.handleInputValueChange(updatedValue),
1297 isOpen: !this.props.closeOnSelect
1298 }, function () {
1299 var valueArray = _this3.getValueArray(_this3.props.value);
1300 if (valueArray.some(function (i) {
1301 return i[_this3.props.valueKey] === value[_this3.props.valueKey];
1302 })) {
1303 _this3.removeValue(value);
1304 } else {
1305 _this3.addValue(value);
1306 }
1307 });
1308 } else {
1309 this.setState({
1310 inputValue: this.handleInputValueChange(updatedValue),
1311 isOpen: !this.props.closeOnSelect,
1312 isPseudoFocused: this.state.isFocused
1313 }, function () {
1314 _this3.setValue(value);
1315 });
1316 }
1317 }
1318 }, {
1319 key: 'addValue',
1320 value: function addValue(value) {
1321 var valueArray = this.getValueArray(this.props.value);
1322 var visibleOptions = this._visibleOptions.filter(function (val) {
1323 return !val.disabled;
1324 });
1325 var lastValueIndex = visibleOptions.indexOf(value);
1326 this.setValue(valueArray.concat(value));
1327 if (visibleOptions.length - 1 === lastValueIndex) {
1328 // the last option was selected; focus the second-last one
1329 this.focusOption(visibleOptions[lastValueIndex - 1]);
1330 } else if (visibleOptions.length > lastValueIndex) {
1331 // focus the option below the selected one
1332 this.focusOption(visibleOptions[lastValueIndex + 1]);
1333 }
1334 }
1335 }, {
1336 key: 'popValue',
1337 value: function popValue() {
1338 var valueArray = this.getValueArray(this.props.value);
1339 if (!valueArray.length) return;
1340 if (valueArray[valueArray.length - 1].clearableValue === false) return;
1341 this.setValue(this.props.multi ? valueArray.slice(0, valueArray.length - 1) : null);
1342 }
1343 }, {
1344 key: 'removeValue',
1345 value: function removeValue(value) {
1346 var _this4 = this;
1347
1348 var valueArray = this.getValueArray(this.props.value);
1349 this.setValue(valueArray.filter(function (i) {
1350 return i[_this4.props.valueKey] !== value[_this4.props.valueKey];
1351 }));
1352 this.focus();
1353 }
1354 }, {
1355 key: 'clearValue',
1356 value: function clearValue(event) {
1357 // if the event was triggered by a mousedown and not the primary
1358 // button, ignore it.
1359 if (event && event.type === 'mousedown' && event.button !== 0) {
1360 return;
1361 }
1362
1363 event.preventDefault();
1364
1365 this.setValue(this.getResetValue());
1366 this.setState({
1367 inputValue: this.handleInputValueChange(''),
1368 isOpen: false
1369 }, this.focus);
1370
1371 this._focusAfterClear = true;
1372 }
1373 }, {
1374 key: 'getResetValue',
1375 value: function getResetValue() {
1376 if (this.props.resetValue !== undefined) {
1377 return this.props.resetValue;
1378 } else if (this.props.multi) {
1379 return [];
1380 } else {
1381 return null;
1382 }
1383 }
1384 }, {
1385 key: 'focusOption',
1386 value: function focusOption(option) {
1387 this.setState({
1388 focusedOption: option
1389 });
1390 }
1391 }, {
1392 key: 'focusNextOption',
1393 value: function focusNextOption() {
1394 this.focusAdjacentOption('next');
1395 }
1396 }, {
1397 key: 'focusPreviousOption',
1398 value: function focusPreviousOption() {
1399 this.focusAdjacentOption('previous');
1400 }
1401 }, {
1402 key: 'focusPageUpOption',
1403 value: function focusPageUpOption() {
1404 this.focusAdjacentOption('page_up');
1405 }
1406 }, {
1407 key: 'focusPageDownOption',
1408 value: function focusPageDownOption() {
1409 this.focusAdjacentOption('page_down');
1410 }
1411 }, {
1412 key: 'focusStartOption',
1413 value: function focusStartOption() {
1414 this.focusAdjacentOption('start');
1415 }
1416 }, {
1417 key: 'focusEndOption',
1418 value: function focusEndOption() {
1419 this.focusAdjacentOption('end');
1420 }
1421 }, {
1422 key: 'focusAdjacentOption',
1423 value: function focusAdjacentOption(dir) {
1424 var options = this._visibleOptions.map(function (option, index) {
1425 return { option: option, index: index };
1426 }).filter(function (option) {
1427 return !option.option.disabled;
1428 });
1429 this._scrollToFocusedOptionOnUpdate = true;
1430 if (!this.state.isOpen) {
1431 var newState = {
1432 focusedOption: this._focusedOption || (options.length ? options[dir === 'next' ? 0 : options.length - 1].option : null),
1433 isOpen: true
1434 };
1435 if (this.props.onSelectResetsInput) {
1436 newState.inputValue = '';
1437 }
1438 this.setState(newState);
1439 return;
1440 }
1441 if (!options.length) return;
1442 var focusedIndex = -1;
1443 for (var i = 0; i < options.length; i++) {
1444 if (this._focusedOption === options[i].option) {
1445 focusedIndex = i;
1446 break;
1447 }
1448 }
1449 if (dir === 'next' && focusedIndex !== -1) {
1450 focusedIndex = (focusedIndex + 1) % options.length;
1451 } else if (dir === 'previous') {
1452 if (focusedIndex > 0) {
1453 focusedIndex = focusedIndex - 1;
1454 } else {
1455 focusedIndex = options.length - 1;
1456 }
1457 } else if (dir === 'start') {
1458 focusedIndex = 0;
1459 } else if (dir === 'end') {
1460 focusedIndex = options.length - 1;
1461 } else if (dir === 'page_up') {
1462 var potentialIndex = focusedIndex - this.props.pageSize;
1463 if (potentialIndex < 0) {
1464 focusedIndex = 0;
1465 } else {
1466 focusedIndex = potentialIndex;
1467 }
1468 } else if (dir === 'page_down') {
1469 var _potentialIndex = focusedIndex + this.props.pageSize;
1470 if (_potentialIndex > options.length - 1) {
1471 focusedIndex = options.length - 1;
1472 } else {
1473 focusedIndex = _potentialIndex;
1474 }
1475 }
1476
1477 if (focusedIndex === -1) {
1478 focusedIndex = 0;
1479 }
1480
1481 this.setState({
1482 focusedIndex: options[focusedIndex].index,
1483 focusedOption: options[focusedIndex].option
1484 });
1485 }
1486 }, {
1487 key: 'getFocusedOption',
1488 value: function getFocusedOption() {
1489 return this._focusedOption;
1490 }
1491 }, {
1492 key: 'selectFocusedOption',
1493 value: function selectFocusedOption() {
1494 if (this._focusedOption) {
1495 return this.selectValue(this._focusedOption);
1496 }
1497 }
1498 }, {
1499 key: 'renderLoading',
1500 value: function renderLoading() {
1501 if (!this.props.isLoading) return;
1502 return React__default.createElement(
1503 'span',
1504 { className: 'Select-loading-zone', 'aria-hidden': 'true' },
1505 React__default.createElement('span', { className: 'Select-loading' })
1506 );
1507 }
1508 }, {
1509 key: 'renderValue',
1510 value: function renderValue(valueArray, isOpen) {
1511 var _this5 = this;
1512
1513 var renderLabel = this.props.valueRenderer || this.getOptionLabel;
1514 var ValueComponent = this.props.valueComponent;
1515 if (!valueArray.length) {
1516 var showPlaceholder = shouldShowPlaceholder(this.state, this.props, isOpen);
1517 return showPlaceholder ? React__default.createElement(
1518 'div',
1519 { className: 'Select-placeholder' },
1520 this.props.placeholder
1521 ) : null;
1522 }
1523 var onClick = this.props.onValueClick ? this.handleValueClick : null;
1524 if (this.props.multi) {
1525 return valueArray.map(function (value, i) {
1526 return React__default.createElement(
1527 ValueComponent,
1528 {
1529 disabled: _this5.props.disabled || value.clearableValue === false,
1530 id: _this5._instancePrefix + '-value-' + i,
1531 instancePrefix: _this5._instancePrefix,
1532 key: 'value-' + i + '-' + value[_this5.props.valueKey],
1533 onClick: onClick,
1534 onRemove: _this5.removeValue,
1535 placeholder: _this5.props.placeholder,
1536 value: value
1537 },
1538 renderLabel(value, i),
1539 React__default.createElement(
1540 'span',
1541 { className: 'Select-aria-only' },
1542 '\xA0'
1543 )
1544 );
1545 });
1546 } else if (shouldShowValue(this.state, this.props)) {
1547 if (isOpen) onClick = null;
1548 return React__default.createElement(
1549 ValueComponent,
1550 {
1551 disabled: this.props.disabled,
1552 id: this._instancePrefix + '-value-item',
1553 instancePrefix: this._instancePrefix,
1554 onClick: onClick,
1555 placeholder: this.props.placeholder,
1556 value: valueArray[0]
1557 },
1558 renderLabel(valueArray[0])
1559 );
1560 }
1561 }
1562 }, {
1563 key: 'renderInput',
1564 value: function renderInput(valueArray, focusedOptionIndex) {
1565 var _classNames,
1566 _this6 = this;
1567
1568 var className = classNames('Select-input', this.props.inputProps.className);
1569 var isOpen = this.state.isOpen;
1570
1571 var ariaOwns = classNames((_classNames = {}, defineProperty(_classNames, this._instancePrefix + '-list', isOpen), defineProperty(_classNames, this._instancePrefix + '-backspace-remove-message', this.props.multi && !this.props.disabled && this.state.isFocused && !this.state.inputValue), _classNames));
1572
1573 var value = this.state.inputValue;
1574 if (value && !this.props.onSelectResetsInput && !this.state.isFocused) {
1575 // it hides input value when it is not focused and was not reset on select
1576 value = '';
1577 }
1578
1579 var inputProps = _extends({}, this.props.inputProps, {
1580 'aria-activedescendant': isOpen ? this._instancePrefix + '-option-' + focusedOptionIndex : this._instancePrefix + '-value',
1581 'aria-describedby': this.props['aria-describedby'],
1582 'aria-expanded': '' + isOpen,
1583 'aria-haspopup': '' + isOpen,
1584 'aria-label': this.props['aria-label'],
1585 'aria-labelledby': this.props['aria-labelledby'],
1586 'aria-owns': ariaOwns,
1587 className: className,
1588 onBlur: this.handleInputBlur,
1589 onChange: this.handleInputChange,
1590 onFocus: this.handleInputFocus,
1591 ref: function ref(_ref) {
1592 return _this6.input = _ref;
1593 },
1594 role: 'combobox',
1595 required: this.state.required,
1596 tabIndex: this.props.tabIndex,
1597 value: value
1598 });
1599
1600 if (this.props.inputRenderer) {
1601 return this.props.inputRenderer(inputProps);
1602 }
1603
1604 if (this.props.disabled || !this.props.searchable) {
1605 var divProps = objectWithoutProperties(this.props.inputProps, []);
1606
1607
1608 var _ariaOwns = classNames(defineProperty({}, this._instancePrefix + '-list', isOpen));
1609 return React__default.createElement('div', _extends({}, divProps, {
1610 'aria-expanded': isOpen,
1611 'aria-owns': _ariaOwns,
1612 'aria-activedescendant': isOpen ? this._instancePrefix + '-option-' + focusedOptionIndex : this._instancePrefix + '-value',
1613 'aria-disabled': '' + this.props.disabled,
1614 'aria-label': this.props['aria-label'],
1615 'aria-labelledby': this.props['aria-labelledby'],
1616 className: className,
1617 onBlur: this.handleInputBlur,
1618 onFocus: this.handleInputFocus,
1619 ref: function ref(_ref2) {
1620 return _this6.input = _ref2;
1621 },
1622 role: 'combobox',
1623 style: { border: 0, width: 1, display: 'inline-block' },
1624 tabIndex: this.props.tabIndex || 0
1625 }));
1626 }
1627
1628 if (this.props.autosize) {
1629 return React__default.createElement(AutosizeInput, _extends({ id: this.props.id }, inputProps, { minWidth: '5' }));
1630 }
1631 return React__default.createElement(
1632 'div',
1633 { className: className, key: 'input-wrap', style: { display: 'inline-block' } },
1634 React__default.createElement('input', _extends({ id: this.props.id }, inputProps))
1635 );
1636 }
1637 }, {
1638 key: 'renderClear',
1639 value: function renderClear() {
1640 var valueArray = this.getValueArray(this.props.value);
1641 if (!this.props.clearable || !valueArray.length || this.props.disabled || this.props.isLoading) return;
1642 var ariaLabel = this.props.multi ? this.props.clearAllText : this.props.clearValueText;
1643 var clear = this.props.clearRenderer();
1644
1645 return React__default.createElement(
1646 'span',
1647 {
1648 'aria-label': ariaLabel,
1649 className: 'Select-clear-zone',
1650 onMouseDown: this.clearValue,
1651 onTouchEnd: this.handleTouchEndClearValue,
1652 onTouchMove: this.handleTouchMove,
1653 onTouchStart: this.handleTouchStart,
1654 title: ariaLabel
1655 },
1656 clear
1657 );
1658 }
1659 }, {
1660 key: 'renderArrow',
1661 value: function renderArrow() {
1662 if (!this.props.arrowRenderer) return;
1663
1664 var onMouseDown = this.handleMouseDownOnArrow;
1665 var isOpen = this.state.isOpen;
1666 var arrow = this.props.arrowRenderer({ onMouseDown: onMouseDown, isOpen: isOpen });
1667
1668 if (!arrow) {
1669 return null;
1670 }
1671
1672 return React__default.createElement(
1673 'span',
1674 {
1675 className: 'Select-arrow-zone',
1676 onMouseDown: onMouseDown
1677 },
1678 arrow
1679 );
1680 }
1681 }, {
1682 key: 'filterOptions',
1683 value: function filterOptions$$1(excludeOptions) {
1684 var filterValue = this.state.inputValue;
1685 var options = this.props.options || [];
1686 if (this.props.filterOptions) {
1687 // Maintain backwards compatibility with boolean attribute
1688 var filterOptions$$1 = typeof this.props.filterOptions === 'function' ? this.props.filterOptions : filterOptions;
1689
1690 return filterOptions$$1(options, filterValue, excludeOptions, {
1691 filterOption: this.props.filterOption,
1692 ignoreAccents: this.props.ignoreAccents,
1693 ignoreCase: this.props.ignoreCase,
1694 labelKey: this.props.labelKey,
1695 matchPos: this.props.matchPos,
1696 matchProp: this.props.matchProp,
1697 trimFilter: this.props.trimFilter,
1698 valueKey: this.props.valueKey
1699 });
1700 } else {
1701 return options;
1702 }
1703 }
1704 }, {
1705 key: 'onOptionRef',
1706 value: function onOptionRef(ref, isFocused) {
1707 if (isFocused) {
1708 this.focused = ref;
1709 }
1710 }
1711 }, {
1712 key: 'renderMenu',
1713 value: function renderMenu(options, valueArray, focusedOption) {
1714 if (options && options.length) {
1715 return this.props.menuRenderer({
1716 focusedOption: focusedOption,
1717 focusOption: this.focusOption,
1718 inputValue: this.state.inputValue,
1719 instancePrefix: this._instancePrefix,
1720 labelKey: this.props.labelKey,
1721 onFocus: this.focusOption,
1722 onOptionRef: this.onOptionRef,
1723 onSelect: this.selectValue,
1724 optionClassName: this.props.optionClassName,
1725 optionComponent: this.props.optionComponent,
1726 optionRenderer: this.props.optionRenderer || this.getOptionLabel,
1727 options: options,
1728 removeValue: this.removeValue,
1729 selectValue: this.selectValue,
1730 valueArray: valueArray,
1731 valueKey: this.props.valueKey
1732 });
1733 } else if (this.props.noResultsText) {
1734 return React__default.createElement(
1735 'div',
1736 { className: 'Select-noresults' },
1737 this.props.noResultsText
1738 );
1739 } else {
1740 return null;
1741 }
1742 }
1743 }, {
1744 key: 'renderHiddenField',
1745 value: function renderHiddenField(valueArray) {
1746 var _this7 = this;
1747
1748 if (!this.props.name) return;
1749 if (this.props.joinValues) {
1750 var value = valueArray.map(function (i) {
1751 return stringifyValue(i[_this7.props.valueKey]);
1752 }).join(this.props.delimiter);
1753 return React__default.createElement('input', {
1754 disabled: this.props.disabled,
1755 name: this.props.name,
1756 ref: function ref(_ref3) {
1757 return _this7.value = _ref3;
1758 },
1759 type: 'hidden',
1760 value: value
1761 });
1762 }
1763 return valueArray.map(function (item, index) {
1764 return React__default.createElement('input', {
1765 disabled: _this7.props.disabled,
1766 key: 'hidden.' + index,
1767 name: _this7.props.name,
1768 ref: 'value' + index,
1769 type: 'hidden',
1770 value: stringifyValue(item[_this7.props.valueKey])
1771 });
1772 });
1773 }
1774 }, {
1775 key: 'getFocusableOptionIndex',
1776 value: function getFocusableOptionIndex(selectedOption) {
1777 var options = this._visibleOptions;
1778 if (!options.length) return null;
1779
1780 var valueKey = this.props.valueKey;
1781 var focusedOption = this.state.focusedOption || selectedOption;
1782 if (focusedOption && !focusedOption.disabled) {
1783 var focusedOptionIndex = -1;
1784 options.some(function (option, index) {
1785 var isOptionEqual = option[valueKey] === focusedOption[valueKey];
1786 if (isOptionEqual) {
1787 focusedOptionIndex = index;
1788 }
1789 return isOptionEqual;
1790 });
1791 if (focusedOptionIndex !== -1) {
1792 return focusedOptionIndex;
1793 }
1794 }
1795
1796 for (var i = 0; i < options.length; i++) {
1797 if (!options[i].disabled) return i;
1798 }
1799 return null;
1800 }
1801 }, {
1802 key: 'renderOuter',
1803 value: function renderOuter(options, valueArray, focusedOption) {
1804 var _this8 = this;
1805
1806 var menu = this.renderMenu(options, valueArray, focusedOption);
1807 if (!menu) {
1808 return null;
1809 }
1810
1811 return React__default.createElement(
1812 'div',
1813 { ref: function ref(_ref5) {
1814 return _this8.menuContainer = _ref5;
1815 }, className: 'Select-menu-outer', style: this.props.menuContainerStyle },
1816 React__default.createElement(
1817 'div',
1818 {
1819 className: 'Select-menu',
1820 id: this._instancePrefix + '-list',
1821 onMouseDown: this.handleMouseDownOnMenu,
1822 onScroll: this.handleMenuScroll,
1823 ref: function ref(_ref4) {
1824 return _this8.menu = _ref4;
1825 },
1826 role: 'listbox',
1827 style: this.props.menuStyle,
1828 tabIndex: -1
1829 },
1830 menu
1831 )
1832 );
1833 }
1834 }, {
1835 key: 'render',
1836 value: function render() {
1837 var _this9 = this;
1838
1839 var valueArray = this.getValueArray(this.props.value);
1840 var options = this._visibleOptions = this.filterOptions(this.props.multi && this.props.removeSelected ? valueArray : null);
1841 var isOpen = this.state.isOpen;
1842 if (this.props.multi && !options.length && valueArray.length && !this.state.inputValue) isOpen = false;
1843 var focusedOptionIndex = this.getFocusableOptionIndex(valueArray[0]);
1844
1845 var focusedOption = null;
1846 if (focusedOptionIndex !== null) {
1847 focusedOption = this._focusedOption = options[focusedOptionIndex];
1848 } else {
1849 focusedOption = this._focusedOption = null;
1850 }
1851 var className = classNames('Select', this.props.className, {
1852 'has-value': valueArray.length,
1853 'is-clearable': this.props.clearable,
1854 'is-disabled': this.props.disabled,
1855 'is-focused': this.state.isFocused,
1856 'is-loading': this.props.isLoading,
1857 'is-open': isOpen,
1858 'is-pseudo-focused': this.state.isPseudoFocused,
1859 'is-searchable': this.props.searchable,
1860 'Select--multi': this.props.multi,
1861 'Select--rtl': this.props.rtl,
1862 'Select--single': !this.props.multi
1863 });
1864
1865 var removeMessage = null;
1866 if (this.props.multi && !this.props.disabled && valueArray.length && !this.state.inputValue && this.state.isFocused && this.props.backspaceRemoves) {
1867 removeMessage = React__default.createElement(
1868 'span',
1869 { id: this._instancePrefix + '-backspace-remove-message', className: 'Select-aria-only', 'aria-live': 'assertive' },
1870 this.props.backspaceToRemoveMessage.replace('{label}', valueArray[valueArray.length - 1][this.props.labelKey])
1871 );
1872 }
1873
1874 return React__default.createElement(
1875 'div',
1876 { ref: function ref(_ref7) {
1877 return _this9.wrapper = _ref7;
1878 },
1879 className: className,
1880 style: this.props.wrapperStyle },
1881 this.renderHiddenField(valueArray),
1882 React__default.createElement(
1883 'div',
1884 { ref: function ref(_ref6) {
1885 return _this9.control = _ref6;
1886 },
1887 className: 'Select-control',
1888 onKeyDown: this.handleKeyDown,
1889 onMouseDown: this.handleMouseDown,
1890 onTouchEnd: this.handleTouchEnd,
1891 onTouchMove: this.handleTouchMove,
1892 onTouchStart: this.handleTouchStart,
1893 style: this.props.style
1894 },
1895 React__default.createElement(
1896 'span',
1897 { className: 'Select-multi-value-wrapper', id: this._instancePrefix + '-value' },
1898 this.renderValue(valueArray, isOpen),
1899 this.renderInput(valueArray, focusedOptionIndex)
1900 ),
1901 removeMessage,
1902 this.renderLoading(),
1903 this.renderClear(),
1904 this.renderArrow()
1905 ),
1906 isOpen ? this.renderOuter(options, valueArray, focusedOption) : null
1907 );
1908 }
1909 }]);
1910 return Select;
1911}(React__default.Component);
1912
1913Select$1.propTypes = {
1914 'aria-describedby': PropTypes.string, // html id(s) of element(s) that should be used to describe this input (for assistive tech)
1915 'aria-label': PropTypes.string, // aria label (for assistive tech)
1916 'aria-labelledby': PropTypes.string, // html id of an element that should be used as the label (for assistive tech)
1917 arrowRenderer: PropTypes.func, // create the drop-down caret element
1918 autoBlur: PropTypes.bool, // automatically blur the component when an option is selected
1919 autoFocus: PropTypes.bool, // autofocus the component on mount
1920 autofocus: PropTypes.bool, // deprecated; use autoFocus instead
1921 autosize: PropTypes.bool, // whether to enable autosizing or not
1922 backspaceRemoves: PropTypes.bool, // whether backspace removes an item if there is no text input
1923 backspaceToRemoveMessage: PropTypes.string, // message to use for screenreaders to press backspace to remove the current item - {label} is replaced with the item label
1924 className: PropTypes.string, // className for the outer element
1925 clearAllText: stringOrNode, // title for the "clear" control when multi: true
1926 clearRenderer: PropTypes.func, // create clearable x element
1927 clearValueText: stringOrNode, // title for the "clear" control
1928 clearable: PropTypes.bool, // should it be possible to reset value
1929 closeOnSelect: PropTypes.bool, // whether to close the menu when a value is selected
1930 deleteRemoves: PropTypes.bool, // whether delete removes an item if there is no text input
1931 delimiter: PropTypes.string, // delimiter to use to join multiple values for the hidden field value
1932 disabled: PropTypes.bool, // whether the Select is disabled or not
1933 escapeClearsValue: PropTypes.bool, // whether escape clears the value when the menu is closed
1934 filterOption: PropTypes.func, // method to filter a single option (option, filterString)
1935 filterOptions: PropTypes.any, // boolean to enable default filtering or function to filter the options array ([options], filterString, [values])
1936 id: PropTypes.string, // html id to set on the input element for accessibility or tests
1937 ignoreAccents: PropTypes.bool, // whether to strip diacritics when filtering
1938 ignoreCase: PropTypes.bool, // whether to perform case-insensitive filtering
1939 inputProps: PropTypes.object, // custom attributes for the Input
1940 inputRenderer: PropTypes.func, // returns a custom input component
1941 instanceId: PropTypes.string, // set the components instanceId
1942 isLoading: PropTypes.bool, // whether the Select is loading externally or not (such as options being loaded)
1943 joinValues: PropTypes.bool, // joins multiple values into a single form field with the delimiter (legacy mode)
1944 labelKey: PropTypes.string, // path of the label value in option objects
1945 matchPos: PropTypes.string, // (any|start) match the start or entire string when filtering
1946 matchProp: PropTypes.string, // (any|label|value) which option property to filter on
1947 menuBuffer: PropTypes.number, // optional buffer (in px) between the bottom of the viewport and the bottom of the menu
1948 menuContainerStyle: PropTypes.object, // optional style to apply to the menu container
1949 menuRenderer: PropTypes.func, // renders a custom menu with options
1950 menuStyle: PropTypes.object, // optional style to apply to the menu
1951 multi: PropTypes.bool, // multi-value input
1952 name: PropTypes.string, // generates a hidden <input /> tag with this field name for html forms
1953 noResultsText: stringOrNode, // placeholder displayed when there are no matching search results
1954 onBlur: PropTypes.func, // onBlur handler: function (event) {}
1955 onBlurResetsInput: PropTypes.bool, // whether input is cleared on blur
1956 onChange: PropTypes.func, // onChange handler: function (newValue) {}
1957 onClose: PropTypes.func, // fires when the menu is closed
1958 onCloseResetsInput: PropTypes.bool, // whether input is cleared when menu is closed through the arrow
1959 onFocus: PropTypes.func, // onFocus handler: function (event) {}
1960 onInputChange: PropTypes.func, // onInputChange handler: function (inputValue) {}
1961 onInputKeyDown: PropTypes.func, // input keyDown handler: function (event) {}
1962 onMenuScrollToBottom: PropTypes.func, // fires when the menu is scrolled to the bottom; can be used to paginate options
1963 onOpen: PropTypes.func, // fires when the menu is opened
1964 onSelectResetsInput: PropTypes.bool, // whether input is cleared on select (works only for multiselect)
1965 onValueClick: PropTypes.func, // onClick handler for value labels: function (value, event) {}
1966 openOnClick: PropTypes.bool, // boolean to control opening the menu when the control is clicked
1967 openOnFocus: PropTypes.bool, // always open options menu on focus
1968 optionClassName: PropTypes.string, // additional class(es) to apply to the <Option /> elements
1969 optionComponent: PropTypes.func, // option component to render in dropdown
1970 optionRenderer: PropTypes.func, // optionRenderer: function (option) {}
1971 options: PropTypes.array, // array of options
1972 pageSize: PropTypes.number, // number of entries to page when using page up/down keys
1973 placeholder: stringOrNode, // field placeholder, displayed when there's no value
1974 removeSelected: PropTypes.bool, // whether the selected option is removed from the dropdown on multi selects
1975 required: PropTypes.bool, // applies HTML5 required attribute when needed
1976 resetValue: PropTypes.any, // value to use when you clear the control
1977 rtl: PropTypes.bool, // set to true in order to use react-select in right-to-left direction
1978 scrollMenuIntoView: PropTypes.bool, // boolean to enable the viewport to shift so that the full menu fully visible when engaged
1979 searchable: PropTypes.bool, // whether to enable searching feature or not
1980 simpleValue: PropTypes.bool, // pass the value to onChange as a simple value (legacy pre 1.0 mode), defaults to false
1981 style: PropTypes.object, // optional style to apply to the control
1982 tabIndex: stringOrNumber, // optional tab index of the control
1983 tabSelectsValue: PropTypes.bool, // whether to treat tabbing out while focused to be value selection
1984 trimFilter: PropTypes.bool, // whether to trim whitespace around filter value
1985 value: PropTypes.any, // initial field value
1986 valueComponent: PropTypes.func, // value component to render
1987 valueKey: PropTypes.string, // path of the label value in option objects
1988 valueRenderer: PropTypes.func, // valueRenderer: function (option) {}
1989 wrapperStyle: PropTypes.object // optional style to apply to the component wrapper
1990};
1991
1992Select$1.defaultProps = {
1993 arrowRenderer: arrowRenderer,
1994 autosize: true,
1995 backspaceRemoves: true,
1996 backspaceToRemoveMessage: 'Press backspace to remove {label}',
1997 clearable: true,
1998 clearAllText: 'Clear all',
1999 clearRenderer: clearRenderer,
2000 clearValueText: 'Clear value',
2001 closeOnSelect: true,
2002 deleteRemoves: true,
2003 delimiter: ',',
2004 disabled: false,
2005 escapeClearsValue: true,
2006 filterOptions: filterOptions,
2007 ignoreAccents: true,
2008 ignoreCase: true,
2009 inputProps: {},
2010 isLoading: false,
2011 joinValues: false,
2012 labelKey: 'label',
2013 matchPos: 'any',
2014 matchProp: 'any',
2015 menuBuffer: 0,
2016 menuRenderer: menuRenderer,
2017 multi: false,
2018 noResultsText: 'No results found',
2019 onBlurResetsInput: true,
2020 onCloseResetsInput: true,
2021 onSelectResetsInput: true,
2022 openOnClick: true,
2023 optionComponent: Option,
2024 pageSize: 5,
2025 placeholder: 'Select...',
2026 removeSelected: true,
2027 required: false,
2028 rtl: false,
2029 scrollMenuIntoView: true,
2030 searchable: true,
2031 simpleValue: false,
2032 tabSelectsValue: true,
2033 trimFilter: true,
2034 valueComponent: Value,
2035 valueKey: 'value'
2036};
2037
2038var propTypes = {
2039 autoload: PropTypes.bool.isRequired, // automatically call the `loadOptions` prop on-mount; defaults to true
2040 cache: PropTypes.any, // object to use to cache results; set to null/false to disable caching
2041 children: PropTypes.func.isRequired, // Child function responsible for creating the inner Select component; (props: Object): PropTypes.element
2042 ignoreAccents: PropTypes.bool, // strip diacritics when filtering; defaults to true
2043 ignoreCase: PropTypes.bool, // perform case-insensitive filtering; defaults to true
2044 loadOptions: PropTypes.func.isRequired, // callback to load options asynchronously; (inputValue: string, callback: Function): ?Promise
2045 loadingPlaceholder: PropTypes.oneOfType([// replaces the placeholder while options are loading
2046 PropTypes.string, PropTypes.node]),
2047 multi: PropTypes.bool, // multi-value input
2048 noResultsText: PropTypes.oneOfType([// field noResultsText, displayed when no options come back from the server
2049 PropTypes.string, PropTypes.node]),
2050 onChange: PropTypes.func, // onChange handler: function (newValue) {}
2051 onInputChange: PropTypes.func, // optional for keeping track of what is being typed
2052 options: PropTypes.array.isRequired, // array of options
2053 placeholder: PropTypes.oneOfType([// field placeholder, displayed when there's no value (shared with Select)
2054 PropTypes.string, PropTypes.node]),
2055 searchPromptText: PropTypes.oneOfType([// label to prompt for search input
2056 PropTypes.string, PropTypes.node]),
2057 value: PropTypes.any // initial field value
2058};
2059
2060var defaultCache = {};
2061
2062var defaultChildren = function defaultChildren(props) {
2063 return React__default.createElement(Select$1, props);
2064};
2065
2066var defaultProps = {
2067 autoload: true,
2068 cache: defaultCache,
2069 children: defaultChildren,
2070 ignoreAccents: true,
2071 ignoreCase: true,
2072 loadingPlaceholder: 'Loading...',
2073 options: [],
2074 searchPromptText: 'Type to search'
2075};
2076
2077var Async = function (_Component) {
2078 inherits(Async, _Component);
2079
2080 function Async(props, context) {
2081 classCallCheck(this, Async);
2082
2083 var _this = possibleConstructorReturn(this, (Async.__proto__ || Object.getPrototypeOf(Async)).call(this, props, context));
2084
2085 _this._cache = props.cache === defaultCache ? {} : props.cache;
2086
2087 _this.state = {
2088 inputValue: '',
2089 isLoading: false,
2090 options: props.options
2091 };
2092
2093 _this.onInputChange = _this.onInputChange.bind(_this);
2094 return _this;
2095 }
2096
2097 createClass(Async, [{
2098 key: 'componentDidMount',
2099 value: function componentDidMount() {
2100 var autoload = this.props.autoload;
2101
2102
2103 if (autoload) {
2104 this.loadOptions('');
2105 }
2106 }
2107 }, {
2108 key: 'componentWillReceiveProps',
2109 value: function componentWillReceiveProps(nextProps) {
2110 if (nextProps.options !== this.props.options) {
2111 this.setState({
2112 options: nextProps.options
2113 });
2114 }
2115 }
2116 }, {
2117 key: 'componentWillUnmount',
2118 value: function componentWillUnmount() {
2119 this._callback = null;
2120 }
2121 }, {
2122 key: 'loadOptions',
2123 value: function loadOptions(inputValue) {
2124 var _this2 = this;
2125
2126 var loadOptions = this.props.loadOptions;
2127
2128 var cache = this._cache;
2129
2130 if (cache && Object.prototype.hasOwnProperty.call(cache, inputValue)) {
2131 this._callback = null;
2132
2133 this.setState({
2134 isLoading: false,
2135 options: cache[inputValue]
2136 });
2137
2138 return;
2139 }
2140
2141 var callback = function callback(error, data) {
2142 var options = data && data.options || [];
2143
2144 if (cache) {
2145 cache[inputValue] = options;
2146 }
2147
2148 if (callback === _this2._callback) {
2149 _this2._callback = null;
2150
2151 _this2.setState({
2152 isLoading: false,
2153 options: options
2154 });
2155 }
2156 };
2157
2158 // Ignore all but the most recent request
2159 this._callback = callback;
2160
2161 var promise = loadOptions(inputValue, callback);
2162 if (promise) {
2163 promise.then(function (data) {
2164 return callback(null, data);
2165 }, function (error) {
2166 return callback(error);
2167 });
2168 }
2169
2170 if (this._callback && !this.state.isLoading) {
2171 this.setState({
2172 isLoading: true
2173 });
2174 }
2175 }
2176 }, {
2177 key: 'onInputChange',
2178 value: function onInputChange(inputValue) {
2179 var _props = this.props,
2180 ignoreAccents = _props.ignoreAccents,
2181 ignoreCase = _props.ignoreCase,
2182 onInputChange = _props.onInputChange;
2183
2184 var newInputValue = inputValue;
2185
2186 if (onInputChange) {
2187 var value = onInputChange(newInputValue);
2188 // Note: != used deliberately here to catch undefined and null
2189 if (value != null && (typeof value === 'undefined' ? 'undefined' : _typeof(value)) !== 'object') {
2190 newInputValue = '' + value;
2191 }
2192 }
2193
2194 var transformedInputValue = newInputValue;
2195
2196 if (ignoreAccents) {
2197 transformedInputValue = stripDiacritics(transformedInputValue);
2198 }
2199
2200 if (ignoreCase) {
2201 transformedInputValue = transformedInputValue.toLowerCase();
2202 }
2203
2204 this.setState({ inputValue: newInputValue });
2205 this.loadOptions(transformedInputValue);
2206
2207 // Return new input value, but without applying toLowerCase() to avoid modifying the user's view case of the input while typing.
2208 return newInputValue;
2209 }
2210 }, {
2211 key: 'noResultsText',
2212 value: function noResultsText() {
2213 var _props2 = this.props,
2214 loadingPlaceholder = _props2.loadingPlaceholder,
2215 noResultsText = _props2.noResultsText,
2216 searchPromptText = _props2.searchPromptText;
2217 var _state = this.state,
2218 inputValue = _state.inputValue,
2219 isLoading = _state.isLoading;
2220
2221
2222 if (isLoading) {
2223 return loadingPlaceholder;
2224 }
2225 if (inputValue && noResultsText) {
2226 return noResultsText;
2227 }
2228 return searchPromptText;
2229 }
2230 }, {
2231 key: 'focus',
2232 value: function focus() {
2233 this.select.focus();
2234 }
2235 }, {
2236 key: 'render',
2237 value: function render() {
2238 var _this3 = this;
2239
2240 var _props3 = this.props,
2241 children = _props3.children,
2242 loadingPlaceholder = _props3.loadingPlaceholder,
2243 placeholder = _props3.placeholder;
2244 var _state2 = this.state,
2245 isLoading = _state2.isLoading,
2246 options = _state2.options;
2247
2248
2249 var props = {
2250 noResultsText: this.noResultsText(),
2251 placeholder: isLoading ? loadingPlaceholder : placeholder,
2252 options: isLoading && loadingPlaceholder ? [] : options,
2253 ref: function ref(_ref) {
2254 return _this3.select = _ref;
2255 }
2256 };
2257
2258 return children(_extends({}, this.props, props, {
2259 isLoading: isLoading,
2260 onInputChange: this.onInputChange
2261 }));
2262 }
2263 }]);
2264 return Async;
2265}(React.Component);
2266
2267Async.propTypes = propTypes;
2268Async.defaultProps = defaultProps;
2269
2270var CreatableSelect = function (_React$Component) {
2271 inherits(CreatableSelect, _React$Component);
2272
2273 function CreatableSelect(props, context) {
2274 classCallCheck(this, CreatableSelect);
2275
2276 var _this = possibleConstructorReturn(this, (CreatableSelect.__proto__ || Object.getPrototypeOf(CreatableSelect)).call(this, props, context));
2277
2278 _this.filterOptions = _this.filterOptions.bind(_this);
2279 _this.menuRenderer = _this.menuRenderer.bind(_this);
2280 _this.onInputKeyDown = _this.onInputKeyDown.bind(_this);
2281 _this.onInputChange = _this.onInputChange.bind(_this);
2282 _this.onOptionSelect = _this.onOptionSelect.bind(_this);
2283 return _this;
2284 }
2285
2286 createClass(CreatableSelect, [{
2287 key: 'createNewOption',
2288 value: function createNewOption() {
2289 var _props = this.props,
2290 isValidNewOption = _props.isValidNewOption,
2291 newOptionCreator = _props.newOptionCreator,
2292 onNewOptionClick = _props.onNewOptionClick,
2293 _props$options = _props.options,
2294 options = _props$options === undefined ? [] : _props$options;
2295
2296
2297 if (isValidNewOption({ label: this.inputValue })) {
2298 var option = newOptionCreator({ label: this.inputValue, labelKey: this.labelKey, valueKey: this.valueKey });
2299 var _isOptionUnique = this.isOptionUnique({ option: option, options: options });
2300
2301 // Don't add the same option twice.
2302 if (_isOptionUnique) {
2303 if (onNewOptionClick) {
2304 onNewOptionClick(option);
2305 } else {
2306 options.unshift(option);
2307
2308 this.select.selectValue(option);
2309 }
2310 }
2311 }
2312 }
2313 }, {
2314 key: 'filterOptions',
2315 value: function filterOptions$$1() {
2316 var _props2 = this.props,
2317 filterOptions$$1 = _props2.filterOptions,
2318 isValidNewOption = _props2.isValidNewOption,
2319 promptTextCreator = _props2.promptTextCreator;
2320
2321 // TRICKY Check currently selected options as well.
2322 // Don't display a create-prompt for a value that's selected.
2323 // This covers async edge-cases where a newly-created Option isn't yet in the async-loaded array.
2324
2325 var excludeOptions = (arguments.length <= 2 ? undefined : arguments[2]) || [];
2326
2327 var filteredOptions = filterOptions$$1.apply(undefined, arguments) || [];
2328
2329 if (isValidNewOption({ label: this.inputValue })) {
2330 var _newOptionCreator = this.props.newOptionCreator;
2331
2332
2333 var option = _newOptionCreator({
2334 label: this.inputValue,
2335 labelKey: this.labelKey,
2336 valueKey: this.valueKey
2337 });
2338
2339 // TRICKY Compare to all options (not just filtered options) in case option has already been selected).
2340 // For multi-selects, this would remove it from the filtered list.
2341 var _isOptionUnique2 = this.isOptionUnique({
2342 option: option,
2343 options: excludeOptions.concat(filteredOptions)
2344 });
2345
2346 if (_isOptionUnique2) {
2347 var prompt = promptTextCreator(this.inputValue);
2348
2349 this._createPlaceholderOption = _newOptionCreator({
2350 label: prompt,
2351 labelKey: this.labelKey,
2352 valueKey: this.valueKey
2353 });
2354
2355 filteredOptions.unshift(this._createPlaceholderOption);
2356 }
2357 }
2358
2359 return filteredOptions;
2360 }
2361 }, {
2362 key: 'isOptionUnique',
2363 value: function isOptionUnique(_ref) {
2364 var option = _ref.option,
2365 options = _ref.options;
2366 var isOptionUnique = this.props.isOptionUnique;
2367
2368
2369 options = options || this.props.options;
2370
2371 return isOptionUnique({
2372 labelKey: this.labelKey,
2373 option: option,
2374 options: options,
2375 valueKey: this.valueKey
2376 });
2377 }
2378 }, {
2379 key: 'menuRenderer',
2380 value: function menuRenderer$$1(params) {
2381 var menuRenderer$$1 = this.props.menuRenderer;
2382
2383
2384 return menuRenderer$$1(_extends({}, params, {
2385 onSelect: this.onOptionSelect,
2386 selectValue: this.onOptionSelect
2387 }));
2388 }
2389 }, {
2390 key: 'onInputChange',
2391 value: function onInputChange(input) {
2392 var onInputChange = this.props.onInputChange;
2393
2394 // This value may be needed in between Select mounts (when this.select is null)
2395
2396 this.inputValue = input;
2397
2398 if (onInputChange) {
2399 this.inputValue = onInputChange(input);
2400 }
2401
2402 return this.inputValue;
2403 }
2404 }, {
2405 key: 'onInputKeyDown',
2406 value: function onInputKeyDown(event) {
2407 var _props3 = this.props,
2408 shouldKeyDownEventCreateNewOption = _props3.shouldKeyDownEventCreateNewOption,
2409 onInputKeyDown = _props3.onInputKeyDown;
2410
2411 var focusedOption = this.select.getFocusedOption();
2412
2413 if (focusedOption && focusedOption === this._createPlaceholderOption && shouldKeyDownEventCreateNewOption({ keyCode: event.keyCode })) {
2414 this.createNewOption();
2415
2416 // Prevent decorated Select from doing anything additional with this keyDown event
2417 event.preventDefault();
2418 } else if (onInputKeyDown) {
2419 onInputKeyDown(event);
2420 }
2421 }
2422 }, {
2423 key: 'onOptionSelect',
2424 value: function onOptionSelect(option) {
2425 if (option === this._createPlaceholderOption) {
2426 this.createNewOption();
2427 } else {
2428 this.select.selectValue(option);
2429 }
2430 }
2431 }, {
2432 key: 'focus',
2433 value: function focus() {
2434 this.select.focus();
2435 }
2436 }, {
2437 key: 'render',
2438 value: function render() {
2439 var _this2 = this;
2440
2441 var _props4 = this.props,
2442 refProp = _props4.ref,
2443 restProps = objectWithoutProperties(_props4, ['ref']);
2444 var children = this.props.children;
2445
2446 // We can't use destructuring default values to set the children,
2447 // because it won't apply work if `children` is null. A falsy check is
2448 // more reliable in real world use-cases.
2449
2450 if (!children) {
2451 children = defaultChildren$2;
2452 }
2453
2454 var props = _extends({}, restProps, {
2455 allowCreate: true,
2456 filterOptions: this.filterOptions,
2457 menuRenderer: this.menuRenderer,
2458 onInputChange: this.onInputChange,
2459 onInputKeyDown: this.onInputKeyDown,
2460 ref: function ref(_ref2) {
2461 _this2.select = _ref2;
2462
2463 // These values may be needed in between Select mounts (when this.select is null)
2464 if (_ref2) {
2465 _this2.labelKey = _ref2.props.labelKey;
2466 _this2.valueKey = _ref2.props.valueKey;
2467 }
2468 if (refProp) {
2469 refProp(_ref2);
2470 }
2471 }
2472 });
2473
2474 return children(props);
2475 }
2476 }]);
2477 return CreatableSelect;
2478}(React__default.Component);
2479
2480var defaultChildren$2 = function defaultChildren(props) {
2481 return React__default.createElement(Select$1, props);
2482};
2483
2484var isOptionUnique = function isOptionUnique(_ref3) {
2485 var option = _ref3.option,
2486 options = _ref3.options,
2487 labelKey = _ref3.labelKey,
2488 valueKey = _ref3.valueKey;
2489
2490 if (!options || !options.length) {
2491 return true;
2492 }
2493
2494 return options.filter(function (existingOption) {
2495 return existingOption[labelKey] === option[labelKey] || existingOption[valueKey] === option[valueKey];
2496 }).length === 0;
2497};
2498
2499var isValidNewOption = function isValidNewOption(_ref4) {
2500 var label = _ref4.label;
2501 return !!label;
2502};
2503
2504var newOptionCreator = function newOptionCreator(_ref5) {
2505 var label = _ref5.label,
2506 labelKey = _ref5.labelKey,
2507 valueKey = _ref5.valueKey;
2508
2509 var option = {};
2510 option[valueKey] = label;
2511 option[labelKey] = label;
2512 option.className = 'Select-create-option-placeholder';
2513
2514 return option;
2515};
2516
2517var promptTextCreator = function promptTextCreator(label) {
2518 return 'Create option "' + label + '"';
2519};
2520
2521var shouldKeyDownEventCreateNewOption = function shouldKeyDownEventCreateNewOption(_ref6) {
2522 var keyCode = _ref6.keyCode;
2523
2524 switch (keyCode) {
2525 case 9: // TAB
2526 case 13: // ENTER
2527 case 188:
2528 // COMMA
2529 return true;
2530 default:
2531 return false;
2532 }
2533};
2534
2535// Default prop methods
2536CreatableSelect.isOptionUnique = isOptionUnique;
2537CreatableSelect.isValidNewOption = isValidNewOption;
2538CreatableSelect.newOptionCreator = newOptionCreator;
2539CreatableSelect.promptTextCreator = promptTextCreator;
2540CreatableSelect.shouldKeyDownEventCreateNewOption = shouldKeyDownEventCreateNewOption;
2541
2542CreatableSelect.defaultProps = {
2543 filterOptions: filterOptions,
2544 isOptionUnique: isOptionUnique,
2545 isValidNewOption: isValidNewOption,
2546 menuRenderer: menuRenderer,
2547 newOptionCreator: newOptionCreator,
2548 promptTextCreator: promptTextCreator,
2549 shouldKeyDownEventCreateNewOption: shouldKeyDownEventCreateNewOption
2550};
2551
2552CreatableSelect.propTypes = {
2553 // Child function responsible for creating the inner Select component
2554 // This component can be used to compose HOCs (eg Creatable and Async)
2555 // (props: Object): PropTypes.element
2556 children: PropTypes.func,
2557
2558 // See Select.propTypes.filterOptions
2559 filterOptions: PropTypes.any,
2560
2561 // Searches for any matching option within the set of options.
2562 // This function prevents duplicate options from being created.
2563 // ({ option: Object, options: Array, labelKey: string, valueKey: string }): boolean
2564 isOptionUnique: PropTypes.func,
2565
2566 // Determines if the current input text represents a valid option.
2567 // ({ label: string }): boolean
2568 isValidNewOption: PropTypes.func,
2569
2570 // See Select.propTypes.menuRenderer
2571 menuRenderer: PropTypes.any,
2572
2573 // Factory to create new option.
2574 // ({ label: string, labelKey: string, valueKey: string }): Object
2575 newOptionCreator: PropTypes.func,
2576
2577 // input change handler: function (inputValue) {}
2578 onInputChange: PropTypes.func,
2579
2580 // input keyDown handler: function (event) {}
2581 onInputKeyDown: PropTypes.func,
2582
2583 // new option click handler: function (option) {}
2584 onNewOptionClick: PropTypes.func,
2585
2586 // See Select.propTypes.options
2587 options: PropTypes.array,
2588
2589 // Creates prompt/placeholder option text.
2590 // (filterText: string): string
2591 promptTextCreator: PropTypes.func,
2592
2593 ref: PropTypes.func,
2594
2595 // Decides if a keyDown event (eg its `keyCode`) should result in the creation of a new option.
2596 shouldKeyDownEventCreateNewOption: PropTypes.func
2597};
2598
2599var AsyncCreatableSelect = function (_React$Component) {
2600 inherits(AsyncCreatableSelect, _React$Component);
2601
2602 function AsyncCreatableSelect() {
2603 classCallCheck(this, AsyncCreatableSelect);
2604 return possibleConstructorReturn(this, (AsyncCreatableSelect.__proto__ || Object.getPrototypeOf(AsyncCreatableSelect)).apply(this, arguments));
2605 }
2606
2607 createClass(AsyncCreatableSelect, [{
2608 key: 'focus',
2609 value: function focus() {
2610 this.select.focus();
2611 }
2612 }, {
2613 key: 'render',
2614 value: function render() {
2615 var _this2 = this;
2616
2617 return React__default.createElement(
2618 Async,
2619 this.props,
2620 function (_ref) {
2621 var ref = _ref.ref,
2622 asyncProps = objectWithoutProperties(_ref, ['ref']);
2623
2624 var asyncRef = ref;
2625 return React__default.createElement(
2626 CreatableSelect,
2627 asyncProps,
2628 function (_ref2) {
2629 var ref = _ref2.ref,
2630 creatableProps = objectWithoutProperties(_ref2, ['ref']);
2631
2632 var creatableRef = ref;
2633 return _this2.props.children(_extends({}, creatableProps, {
2634 ref: function ref(select) {
2635 creatableRef(select);
2636 asyncRef(select);
2637 _this2.select = select;
2638 }
2639 }));
2640 }
2641 );
2642 }
2643 );
2644 }
2645 }]);
2646 return AsyncCreatableSelect;
2647}(React__default.Component);
2648
2649var defaultChildren$1 = function defaultChildren(props) {
2650 return React__default.createElement(Select$1, props);
2651};
2652
2653AsyncCreatableSelect.propTypes = {
2654 children: PropTypes.func.isRequired // Child function responsible for creating the inner Select component; (props: Object): PropTypes.element
2655};
2656
2657AsyncCreatableSelect.defaultProps = {
2658 children: defaultChildren$1
2659};
2660
2661// This file exists as an entry point for bundling our umd builds.
2662// Both in rollup and in webpack, umd builds built from es6 modules are not
2663// compatible with mixed imports (which exist in index.js)
2664// This file does away with named imports in favor of a single export default.
2665
2666Select$1.Async = Async;
2667Select$1.AsyncCreatable = AsyncCreatableSelect;
2668Select$1.Creatable = CreatableSelect;
2669Select$1.Value = Value;
2670Select$1.Option = Option;
2671
2672return Select$1;
2673
2674})));