@commercetools-uikit/async-creatable-select-field 12.2.2 → 12.2.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/README.md +0 -1
  2. package/dist/commercetools-uikit-async-creatable-select-field.cjs.dev.js +162 -141
  3. package/dist/commercetools-uikit-async-creatable-select-field.cjs.prod.js +100 -79
  4. package/dist/commercetools-uikit-async-creatable-select-field.esm.js +85 -71
  5. package/package.json +10 -14
package/README.md CHANGED
@@ -30,7 +30,6 @@ npm --save install react
30
30
  ## Usage
31
31
 
32
32
  ```jsx
33
- import React from 'react';
34
33
  import AsyncCreatableSelectField from '@commercetools-uikit/async-creatable-select-field';
35
34
 
36
35
  const Example = () => (
package/dist/commercetools-uikit-async-creatable-select-field.cjs.dev.js CHANGED
@@ -3,7 +3,15 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var _Reflect$construct = require('@babel/runtime-corejs3/core-js-stable/reflect/construct');
6
- var _extends = require('@babel/runtime-corejs3/helpers/extends');
6
+ var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
7
+ var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
8
+ var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
9
+ var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
10
+ var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
11
+ var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
12
+ var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
13
+ var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
14
+ var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
7
15
  var _classCallCheck = require('@babel/runtime-corejs3/helpers/classCallCheck');
8
16
  var _createClass = require('@babel/runtime-corejs3/helpers/createClass');
9
17
  var _inherits = require('@babel/runtime-corejs3/helpers/inherits');
@@ -12,7 +20,7 @@ var _getPrototypeOf = require('@babel/runtime-corejs3/helpers/getPrototypeOf');
12
20
  var _someInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/some');
13
21
  var _Object$values = require('@babel/runtime-corejs3/core-js-stable/object/values');
14
22
  var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
15
- var React = require('react');
23
+ var react = require('react');
16
24
  var PropTypes = require('prop-types');
17
25
  var requiredIf = require('react-required-if');
18
26
  var utils = require('@commercetools-uikit/utils');
@@ -21,15 +29,22 @@ var Spacings = require('@commercetools-uikit/spacings');
21
29
  var FieldLabel = require('@commercetools-uikit/field-label');
22
30
  var AsyncCreatableSelectInput = require('@commercetools-uikit/async-creatable-select-input');
23
31
  var FieldErrors = require('@commercetools-uikit/field-errors');
24
- var react = require('@emotion/react');
32
+ var jsxRuntime = require('@emotion/react/jsx-runtime');
25
33
 
26
34
  function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
27
35
 
28
36
  var _Reflect$construct__default = /*#__PURE__*/_interopDefault(_Reflect$construct);
37
+ var _Object$keys__default = /*#__PURE__*/_interopDefault(_Object$keys);
38
+ var _Object$getOwnPropertySymbols__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertySymbols);
39
+ var _filterInstanceProperty__default = /*#__PURE__*/_interopDefault(_filterInstanceProperty);
40
+ var _Object$getOwnPropertyDescriptor__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptor);
41
+ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachInstanceProperty);
42
+ var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptors);
43
+ var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
44
+ var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
29
45
  var _someInstanceProperty__default = /*#__PURE__*/_interopDefault(_someInstanceProperty);
30
46
  var _Object$values__default = /*#__PURE__*/_interopDefault(_Object$values);
31
47
  var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
32
- var React__default = /*#__PURE__*/_interopDefault(React);
33
48
  var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
34
49
  var requiredIf__default = /*#__PURE__*/_interopDefault(requiredIf);
35
50
  var Constraints__default = /*#__PURE__*/_interopDefault(Constraints);
@@ -38,19 +53,23 @@ var FieldLabel__default = /*#__PURE__*/_interopDefault(FieldLabel);
38
53
  var AsyncCreatableSelectInput__default = /*#__PURE__*/_interopDefault(AsyncCreatableSelectInput);
39
54
  var FieldErrors__default = /*#__PURE__*/_interopDefault(FieldErrors);
40
55
 
41
- function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct__default['default'](Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
56
+ function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
42
57
 
43
- function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct__default['default']) return false; if (_Reflect$construct__default['default'].sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(_Reflect$construct__default['default'](Boolean, [], function () {})); return true; } catch (e) { return false; } }
58
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context8; _forEachInstanceProperty__default["default"](_context8 = ownKeys(Object(source), true)).call(_context8, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context9; _forEachInstanceProperty__default["default"](_context9 = ownKeys(Object(source))).call(_context9, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
59
+
60
+ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct__default["default"](Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
61
+
62
+ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct__default["default"]) return false; if (_Reflect$construct__default["default"].sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(_Reflect$construct__default["default"](Boolean, [], function () {})); return true; } catch (e) { return false; } }
44
63
  var sequentialId = utils.createSequentialId('async-creatable-select-field-');
45
64
 
46
65
  var hasErrors = function hasErrors(errors) {
47
66
  var _context;
48
67
 
49
- return errors && _someInstanceProperty__default['default'](_context = _Object$values__default['default'](errors)).call(_context, Boolean);
68
+ return errors && _someInstanceProperty__default["default"](_context = _Object$values__default["default"](errors)).call(_context, Boolean);
50
69
  };
51
70
 
52
- var AsyncCreatableSelectField = /*#__PURE__*/function (_React$Component) {
53
- _inherits(AsyncCreatableSelectField, _React$Component);
71
+ var AsyncCreatableSelectField = /*#__PURE__*/function (_Component) {
72
+ _inherits(AsyncCreatableSelectField, _Component);
54
73
 
55
74
  var _super = _createSuper(AsyncCreatableSelectField);
56
75
 
@@ -65,7 +84,7 @@ var AsyncCreatableSelectField = /*#__PURE__*/function (_React$Component) {
65
84
  args[_key] = arguments[_key];
66
85
  }
67
86
 
68
- _this = _super.call.apply(_super, _concatInstanceProperty__default['default'](_context2 = [this]).call(_context2, args));
87
+ _this = _super.call.apply(_super, _concatInstanceProperty__default["default"](_context2 = [this]).call(_context2, args));
69
88
  _this.state = {
70
89
  // We generate an id in case no id is provided by the parent to attach the
71
90
  // label to the input component.
@@ -77,76 +96,78 @@ var AsyncCreatableSelectField = /*#__PURE__*/function (_React$Component) {
77
96
  _createClass(AsyncCreatableSelectField, [{
78
97
  key: "render",
79
98
  value: function render() {
80
- var hasError = AsyncCreatableSelectInput__default['default'].isTouched(this.props.touched) && hasErrors(this.props.errors);
81
- return react.jsx(Constraints__default['default'].Horizontal, {
82
- max: this.props.horizontalConstraint
83
- }, react.jsx(Spacings__default['default'].Stack, {
84
- scale: "xs"
85
- }, react.jsx(FieldLabel__default['default'], {
86
- title: this.props.title,
87
- hint: this.props.hint,
88
- description: this.props.description,
89
- onInfoButtonClick: this.props.onInfoButtonClick,
90
- hintIcon: this.props.hintIcon,
91
- badge: this.props.badge,
92
- hasRequiredIndicator: this.props.isRequired,
93
- htmlFor: this.state.id
94
- }), react.jsx(AsyncCreatableSelectInput__default['default'], _extends({
95
- horizontalConstraint: "scale",
96
- hasError: hasError,
97
- "aria-label": this.props['aria-label'],
98
- "aria-labelledby": this.props['aria-labelledby'],
99
- isAutofocussed: this.props.isAutofocussed,
100
- backspaceRemovesValue: this.props.backspaceRemovesValue,
101
- components: this.props.components,
102
- filterOption: this.props.filterOption,
103
- id: this.state.id,
104
- containerId: this.props.containerId,
105
- isClearable: this.props.isClearable,
106
- isDisabled: this.props.isDisabled,
107
- isReadOnly: this.props.isReadOnly,
108
- isOptionDisabled: this.props.isOptionDisabled,
109
- isMulti: this.props.isMulti,
110
- isSearchable: this.props.isSearchable,
111
- hasWarning: this.props.hasWarning,
112
- maxMenuHeight: this.props.maxMenuHeight,
113
- menuPortalTarget: this.props.menuPortalTarget,
114
- menuPortalZIndex: this.props.menuPortalZIndex,
115
- menuShouldBlockSroll: this.props.menuShouldBlockScroll,
116
- name: this.props.name,
117
- noOptionsMessage: this.props.noOptionsMessage,
118
- onBlur: this.props.onBlur,
119
- onChange: this.props.onChange,
120
- onFocus: this.props.onFocus,
121
- onInputChange: this.props.onInputChange,
122
- options: this.props.options,
123
- placeholder: this.props.placeholder,
124
- tabIndex: this.props.tabIndex,
125
- tabSelectsValue: this.props.tabSelectsValue,
126
- value: this.props.value // Async react-select props
127
- ,
128
- defaultOptions: this.props.defaultOptions,
129
- loadOptions: this.props.loadOptions,
130
- cacheOptions: this.props.cacheOptions // Creatable props
131
- ,
132
- allowCreateWhileLoading: this.props.allowCreateWhileLoading,
133
- formatCreateLabel: this.props.formatCreateLabel,
134
- isValidNewOption: this.props.isValidNewOption,
135
- getNewOptionData: this.props.getNewOptionData,
136
- onCreateOption: this.props.onCreateOption,
137
- createOptionPosition: this.props.createOptionPosition,
138
- showOptionGroupDivider: this.props.showOptionGroupDivider,
139
- iconLeft: this.props.iconLeft
140
- }, utils.filterDataAttributes(this.props))), react.jsx(FieldErrors__default['default'], {
141
- errors: this.props.errors,
142
- isVisible: hasError,
143
- renderError: this.props.renderError
144
- })));
99
+ var hasError = AsyncCreatableSelectInput__default["default"].isTouched(this.props.touched) && hasErrors(this.props.errors);
100
+ return jsxRuntime.jsx(Constraints__default["default"].Horizontal, {
101
+ max: this.props.horizontalConstraint,
102
+ children: jsxRuntime.jsxs(Spacings__default["default"].Stack, {
103
+ scale: "xs",
104
+ children: [jsxRuntime.jsx(FieldLabel__default["default"], {
105
+ title: this.props.title,
106
+ hint: this.props.hint,
107
+ description: this.props.description,
108
+ onInfoButtonClick: this.props.onInfoButtonClick,
109
+ hintIcon: this.props.hintIcon,
110
+ badge: this.props.badge,
111
+ hasRequiredIndicator: this.props.isRequired,
112
+ htmlFor: this.state.id
113
+ }), jsxRuntime.jsx(AsyncCreatableSelectInput__default["default"], _objectSpread({
114
+ horizontalConstraint: "scale",
115
+ hasError: hasError,
116
+ "aria-label": this.props['aria-label'],
117
+ "aria-labelledby": this.props['aria-labelledby'],
118
+ isAutofocussed: this.props.isAutofocussed,
119
+ backspaceRemovesValue: this.props.backspaceRemovesValue,
120
+ components: this.props.components,
121
+ filterOption: this.props.filterOption,
122
+ id: this.state.id,
123
+ containerId: this.props.containerId,
124
+ isClearable: this.props.isClearable,
125
+ isDisabled: this.props.isDisabled,
126
+ isReadOnly: this.props.isReadOnly,
127
+ isOptionDisabled: this.props.isOptionDisabled,
128
+ isMulti: this.props.isMulti,
129
+ isSearchable: this.props.isSearchable,
130
+ hasWarning: this.props.hasWarning,
131
+ maxMenuHeight: this.props.maxMenuHeight,
132
+ menuPortalTarget: this.props.menuPortalTarget,
133
+ menuPortalZIndex: this.props.menuPortalZIndex,
134
+ menuShouldBlockSroll: this.props.menuShouldBlockScroll,
135
+ name: this.props.name,
136
+ noOptionsMessage: this.props.noOptionsMessage,
137
+ onBlur: this.props.onBlur,
138
+ onChange: this.props.onChange,
139
+ onFocus: this.props.onFocus,
140
+ onInputChange: this.props.onInputChange,
141
+ options: this.props.options,
142
+ placeholder: this.props.placeholder,
143
+ tabIndex: this.props.tabIndex,
144
+ tabSelectsValue: this.props.tabSelectsValue,
145
+ value: this.props.value // Async react-select props
146
+ ,
147
+ defaultOptions: this.props.defaultOptions,
148
+ loadOptions: this.props.loadOptions,
149
+ cacheOptions: this.props.cacheOptions // Creatable props
150
+ ,
151
+ allowCreateWhileLoading: this.props.allowCreateWhileLoading,
152
+ formatCreateLabel: this.props.formatCreateLabel,
153
+ isValidNewOption: this.props.isValidNewOption,
154
+ getNewOptionData: this.props.getNewOptionData,
155
+ onCreateOption: this.props.onCreateOption,
156
+ createOptionPosition: this.props.createOptionPosition,
157
+ showOptionGroupDivider: this.props.showOptionGroupDivider,
158
+ iconLeft: this.props.iconLeft
159
+ }, utils.filterDataAttributes(this.props))), jsxRuntime.jsx(FieldErrors__default["default"], {
160
+ errors: this.props.errors,
161
+ isVisible: hasError,
162
+ renderError: this.props.renderError
163
+ })]
164
+ })
165
+ });
145
166
  }
146
167
  }]);
147
168
 
148
169
  return AsyncCreatableSelectField;
149
- }(React__default['default'].Component);
170
+ }(react.Component);
150
171
 
151
172
  AsyncCreatableSelectField.displayName = 'AsyncCreatableSelectField';
152
173
  AsyncCreatableSelectField.defaultProps = {
@@ -164,20 +185,20 @@ AsyncCreatableSelectField.propTypes = process.env.NODE_ENV !== "production" ? {
164
185
  /**
165
186
  * Used as HTML id property. An id is auto-generated when it is not specified.
166
187
  */
167
- id: PropTypes__default['default'].string,
188
+ id: PropTypes__default["default"].string,
168
189
 
169
190
  /**
170
191
  * Horizontal size limit of the input fields.
171
192
  */
172
- horizontalConstraint: PropTypes__default['default'].oneOf([3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 'scale', 'auto']),
193
+ horizontalConstraint: PropTypes__default["default"].oneOf([3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 'scale', 'auto']),
173
194
 
174
195
  /**
175
196
  * A map of errors. Error messages for known errors are rendered automatically.
176
197
  * <br />
177
198
  * Unknown errors will be forwarded to `renderError`
178
199
  */
179
- errors: PropTypes__default['default'].shape({
180
- missing: PropTypes__default['default'].bool
200
+ errors: PropTypes__default["default"].shape({
201
+ missing: PropTypes__default["default"].bool
181
202
  }),
182
203
 
183
204
  /**
@@ -185,12 +206,12 @@ AsyncCreatableSelectField.propTypes = process.env.NODE_ENV !== "production" ? {
185
206
  * <br />
186
207
  * Signature: `(key, error) => React.node`
187
208
  */
188
- renderError: PropTypes__default['default'].func,
209
+ renderError: PropTypes__default["default"].func,
189
210
 
190
211
  /**
191
212
  * Indicates if the value is required. Shows an the "required asterisk" if so.
192
213
  */
193
- isRequired: PropTypes__default['default'].bool,
214
+ isRequired: PropTypes__default["default"].bool,
194
215
 
195
216
  /**
196
217
  * Indicates whether the field was touched. Errors will only be shown when the field was touched.
@@ -202,102 +223,102 @@ AsyncCreatableSelectField.propTypes = process.env.NODE_ENV !== "production" ? {
202
223
  rest[_key2 - 1] = arguments[_key2];
203
224
  }
204
225
 
205
- return props.isMulti ? PropTypes__default['default'].arrayOf.apply(PropTypes__default['default'], _concatInstanceProperty__default['default'](_context3 = [PropTypes__default['default'].bool]).call(_context3, rest)).apply(void 0, _concatInstanceProperty__default['default'](_context4 = [props]).call(_context4, rest)) : PropTypes__default['default'].bool.apply(PropTypes__default['default'], _concatInstanceProperty__default['default'](_context5 = [props]).call(_context5, rest));
226
+ return props.isMulti ? PropTypes__default["default"].arrayOf.apply(PropTypes__default["default"], _concatInstanceProperty__default["default"](_context3 = [PropTypes__default["default"].bool]).call(_context3, rest)).apply(void 0, _concatInstanceProperty__default["default"](_context4 = [props]).call(_context4, rest)) : PropTypes__default["default"].bool.apply(PropTypes__default["default"], _concatInstanceProperty__default["default"](_context5 = [props]).call(_context5, rest));
206
227
  },
207
228
  // AsyncCreatableSelectInput
208
229
 
209
230
  /**
210
231
  * Aria label (for assistive tech)
211
232
  */
212
- 'aria-label': PropTypes__default['default'].string,
233
+ 'aria-label': PropTypes__default["default"].string,
213
234
 
214
235
  /**
215
236
  * HTML ID of an element that should be used as the label (for assistive tech)
216
237
  */
217
- 'aria-labelledby': PropTypes__default['default'].string,
238
+ 'aria-labelledby': PropTypes__default["default"].string,
218
239
 
219
240
  /**
220
241
  * Focus the control when it is mounted
221
242
  */
222
- isAutofocussed: PropTypes__default['default'].bool,
243
+ isAutofocussed: PropTypes__default["default"].bool,
223
244
 
224
245
  /**
225
246
  * Remove the currently focused option when the user presses backspace
226
247
  */
227
- backspaceRemovesValue: PropTypes__default['default'].bool,
248
+ backspaceRemovesValue: PropTypes__default["default"].bool,
228
249
 
229
250
  /**
230
251
  * Map of components to overwrite the default ones, see [what components you can override](https://react-select.com/components)
231
252
  */
232
- components: PropTypes__default['default'].objectOf(PropTypes__default['default'].func),
253
+ components: PropTypes__default["default"].objectOf(PropTypes__default["default"].func),
233
254
 
234
255
  /**
235
256
  * Custom method to filter whether an option should be displayed in the menu
236
257
  */
237
- filterOption: PropTypes__default['default'].func,
258
+ filterOption: PropTypes__default["default"].func,
238
259
 
239
260
  /**
240
261
  * The id to set on the SelectContainer component
241
262
  */
242
- containerId: PropTypes__default['default'].string,
263
+ containerId: PropTypes__default["default"].string,
243
264
 
244
265
  /**
245
266
  * Is the select value clearable
246
267
  */
247
- isClearable: PropTypes__default['default'].bool,
268
+ isClearable: PropTypes__default["default"].bool,
248
269
 
249
270
  /**
250
271
  * Is the select disabled
251
272
  */
252
- isDisabled: PropTypes__default['default'].bool,
273
+ isDisabled: PropTypes__default["default"].bool,
253
274
 
254
275
  /**
255
276
  * Is the select read-only
256
277
  */
257
- isReadOnly: PropTypes__default['default'].bool,
278
+ isReadOnly: PropTypes__default["default"].bool,
258
279
 
259
280
  /**
260
281
  * Override the built-in logic to detect whether an option is disabled
261
282
  * <br />
262
283
  * Signature: `(option, options) => boolean`
263
284
  */
264
- isOptionDisabled: PropTypes__default['default'].func,
285
+ isOptionDisabled: PropTypes__default["default"].func,
265
286
 
266
287
  /**
267
288
  * Support multiple selected options
268
289
  */
269
- isMulti: PropTypes__default['default'].bool,
290
+ isMulti: PropTypes__default["default"].bool,
270
291
 
271
292
  /**
272
293
  * Whether to enable search functionality
273
294
  */
274
- isSearchable: PropTypes__default['default'].bool,
275
- hasWarning: PropTypes__default['default'].bool,
295
+ isSearchable: PropTypes__default["default"].bool,
296
+ hasWarning: PropTypes__default["default"].bool,
276
297
 
277
298
  /**
278
299
  * Maximum height of the menu before scrolling
279
300
  */
280
- maxMenuHeight: PropTypes__default['default'].number,
301
+ maxMenuHeight: PropTypes__default["default"].number,
281
302
 
282
303
  /**
283
304
  * Dom element to portal the select menu to
284
305
  */
285
- menuPortalTarget: PropTypes__default['default'].instanceOf(utils.SafeHTMLElement),
306
+ menuPortalTarget: PropTypes__default["default"].instanceOf(utils.SafeHTMLElement),
286
307
 
287
308
  /**
288
309
  * z-index value for the menu portal
289
310
  */
290
- menuPortalZIndex: PropTypes__default['default'].number,
311
+ menuPortalZIndex: PropTypes__default["default"].number,
291
312
 
292
313
  /**
293
314
  * whether the menu should block scroll while open
294
315
  */
295
- menuShouldBlockScroll: PropTypes__default['default'].bool,
316
+ menuShouldBlockScroll: PropTypes__default["default"].bool,
296
317
 
297
318
  /**
298
319
  * Name of the HTML Input (optional - without this, no input will be rendered)
299
320
  */
300
- name: PropTypes__default['default'].string,
321
+ name: PropTypes__default["default"].string,
301
322
 
302
323
  /**
303
324
  * Can be used to render a custom value when there are no options (either because of no search results, or all options have been used, or there were none in the first place).
@@ -306,12 +327,12 @@ AsyncCreatableSelectField.propTypes = process.env.NODE_ENV !== "production" ? {
306
327
  * <br />
307
328
  * Signature: `({ inputValue }) => string`
308
329
  */
309
- noOptionsMessage: PropTypes__default['default'].func,
330
+ noOptionsMessage: PropTypes__default["default"].func,
310
331
 
311
332
  /**
312
333
  * Handle blur events on the control
313
334
  */
314
- onBlur: PropTypes__default['default'].func,
335
+ onBlur: PropTypes__default["default"].func,
315
336
 
316
337
  /**
317
338
  * Called with a fake event when value changes.
@@ -320,43 +341,43 @@ AsyncCreatableSelectField.propTypes = process.env.NODE_ENV !== "production" ? {
320
341
  * <br />
321
342
  * Signature: `(event) => void`
322
343
  */
323
- onChange: PropTypes__default['default'].func,
344
+ onChange: PropTypes__default["default"].func,
324
345
 
325
346
  /**
326
347
  * Handle focus events on the control
327
348
  */
328
- onFocus: PropTypes__default['default'].func,
349
+ onFocus: PropTypes__default["default"].func,
329
350
 
330
351
  /**
331
352
  * Handle change events on the input
332
353
  */
333
- onInputChange: PropTypes__default['default'].func,
354
+ onInputChange: PropTypes__default["default"].func,
334
355
 
335
356
  /**
336
357
  * Array of options that populate the select menu
337
358
  */
338
- options: PropTypes__default['default'].arrayOf(PropTypes__default['default'].oneOfType([PropTypes__default['default'].shape({
339
- value: PropTypes__default['default'].string.isRequired
340
- }), PropTypes__default['default'].shape({
341
- options: PropTypes__default['default'].arrayOf(PropTypes__default['default'].shape({
342
- value: PropTypes__default['default'].string.isRequired
359
+ options: PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOfType([PropTypes__default["default"].shape({
360
+ value: PropTypes__default["default"].string.isRequired
361
+ }), PropTypes__default["default"].shape({
362
+ options: PropTypes__default["default"].arrayOf(PropTypes__default["default"].shape({
363
+ value: PropTypes__default["default"].string.isRequired
343
364
  }))
344
365
  })])),
345
366
 
346
367
  /**
347
368
  * Placeholder text for the select value
348
369
  */
349
- placeholder: PropTypes__default['default'].string,
370
+ placeholder: PropTypes__default["default"].string,
350
371
 
351
372
  /**
352
373
  * Sets the tabIndex attribute on the input
353
374
  */
354
- tabIndex: PropTypes__default['default'].string,
375
+ tabIndex: PropTypes__default["default"].string,
355
376
 
356
377
  /**
357
378
  * Select the currently focused option when the user presses tab
358
379
  */
359
- tabSelectsValue: PropTypes__default['default'].bool,
380
+ tabSelectsValue: PropTypes__default["default"].bool,
360
381
 
361
382
  /**
362
383
  * The value of the select; reflected by the selected option
@@ -368,13 +389,13 @@ AsyncCreatableSelectField.propTypes = process.env.NODE_ENV !== "production" ? {
368
389
  rest[_key3 - 1] = arguments[_key3];
369
390
  }
370
391
 
371
- return props.isMulti ? PropTypes__default['default'].arrayOf(PropTypes__default['default'].shape({
372
- value: PropTypes__default['default'].string.isRequired
373
- })).apply(void 0, _concatInstanceProperty__default['default'](_context6 = [props]).call(_context6, rest)) : PropTypes__default['default'].shape({
374
- value: PropTypes__default['default'].string.isRequired
375
- }).apply(void 0, _concatInstanceProperty__default['default'](_context7 = [props]).call(_context7, rest));
392
+ return props.isMulti ? PropTypes__default["default"].arrayOf(PropTypes__default["default"].shape({
393
+ value: PropTypes__default["default"].string.isRequired
394
+ })).apply(void 0, _concatInstanceProperty__default["default"](_context6 = [props]).call(_context6, rest)) : PropTypes__default["default"].shape({
395
+ value: PropTypes__default["default"].string.isRequired
396
+ }).apply(void 0, _concatInstanceProperty__default["default"](_context7 = [props]).call(_context7, rest));
376
397
  },
377
- showOptionGroupDivider: PropTypes__default['default'].bool,
398
+ showOptionGroupDivider: PropTypes__default["default"].bool,
378
399
  // Async props
379
400
 
380
401
  /**
@@ -382,8 +403,8 @@ AsyncCreatableSelectField.propTypes = process.env.NODE_ENV !== "production" ? {
382
403
  * <br/>
383
404
  * When set to `true`, the results for `loadOptions('')` will be autoloaded.
384
405
  */
385
- defaultOptions: PropTypes__default['default'].oneOfType([PropTypes__default['default'].bool, PropTypes__default['default'].arrayOf(PropTypes__default['default'].shape({
386
- value: PropTypes__default['default'].string.isRequired
406
+ defaultOptions: PropTypes__default["default"].oneOfType([PropTypes__default["default"].bool, PropTypes__default["default"].arrayOf(PropTypes__default["default"].shape({
407
+ value: PropTypes__default["default"].string.isRequired
387
408
  }))]),
388
409
 
389
410
  /**
@@ -393,61 +414,61 @@ AsyncCreatableSelectField.propTypes = process.env.NODE_ENV !== "production" ? {
393
414
  * <br />
394
415
  * `callback` can be called with `options`
395
416
  */
396
- loadOptions: PropTypes__default['default'].func.isRequired,
417
+ loadOptions: PropTypes__default["default"].func.isRequired,
397
418
 
398
419
  /**
399
420
  * If cacheOptions is truthy, then the loaded data will be cached. The cache will remain until cacheOptions changes value.
400
421
  */
401
- cacheOptions: PropTypes__default['default'].any,
422
+ cacheOptions: PropTypes__default["default"].any,
402
423
  // Creatable props
403
424
 
404
425
  /**
405
426
  * Allow options to be created while the isLoading prop is true. Useful to prevent the "create new ..." option being displayed while async results are still being loaded.
406
427
  */
407
- allowCreateWhileLoading: PropTypes__default['default'].bool,
428
+ allowCreateWhileLoading: PropTypes__default["default"].bool,
408
429
 
409
430
  /**
410
431
  * Gets the label for the "create new ..." option in the menu. Is given the current input value.
411
432
  */
412
- formatCreateLabel: PropTypes__default['default'].func,
433
+ formatCreateLabel: PropTypes__default["default"].func,
413
434
 
414
435
  /**
415
436
  * Determines whether the "create new ..." option should be displayed based on the current input value, select value and options array.
416
437
  */
417
- isValidNewOption: PropTypes__default['default'].func,
438
+ isValidNewOption: PropTypes__default["default"].func,
418
439
 
419
440
  /**
420
441
  * Returns the data for the new option when it is created. Used to display the value, and is passed to onChange.
421
442
  */
422
- getNewOptionData: PropTypes__default['default'].func,
443
+ getNewOptionData: PropTypes__default["default"].func,
423
444
 
424
445
  /**
425
446
  * If provided, this will be called with the input value when a new option is created, and onChange will not be called. Use this when you need more control over what happens when new options are created.
426
447
  */
427
- onCreateOption: PropTypes__default['default'].func,
448
+ onCreateOption: PropTypes__default["default"].func,
428
449
 
429
450
  /**
430
451
  * Sets the position of the createOption element in your options list.
431
452
  */
432
- createOptionPosition: PropTypes__default['default'].string,
453
+ createOptionPosition: PropTypes__default["default"].string,
433
454
  // LabelField
434
455
 
435
456
  /**
436
457
  * Title of the label
437
458
  */
438
- title: PropTypes__default['default'].oneOfType([PropTypes__default['default'].string, PropTypes__default['default'].node]).isRequired,
459
+ title: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].node]).isRequired,
439
460
 
440
461
  /**
441
462
  * Hint for the label. Provides a supplementary but important information regarding the behaviour of the input (e.g warn about uniqueness of a field, when it can only be set once), whereas `description` can describe it in more depth. Can also receive a `hintIcon`.
442
463
  */
443
- hint: requiredIf__default['default'](PropTypes__default['default'].oneOfType([PropTypes__default['default'].string, PropTypes__default['default'].node]), function (props) {
464
+ hint: requiredIf__default["default"](PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].node]), function (props) {
444
465
  return props.hintIcon;
445
466
  }),
446
467
 
447
468
  /**
448
469
  * Provides a description for the title.
449
470
  */
450
- description: PropTypes__default['default'].oneOfType([PropTypes__default['default'].string, PropTypes__default['default'].node]),
471
+ description: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].node]),
451
472
 
452
473
  /**
453
474
  * Function called when info button is pressed.
@@ -456,30 +477,30 @@ AsyncCreatableSelectField.propTypes = process.env.NODE_ENV !== "production" ? {
456
477
  * <br />
457
478
  * Signature: `(event) => void`
458
479
  */
459
- onInfoButtonClick: PropTypes__default['default'].func,
480
+ onInfoButtonClick: PropTypes__default["default"].func,
460
481
 
461
482
  /**
462
483
  * Icon to be displayed beside the hint text.
463
484
  * <br />
464
485
  * Will only get rendered when `hint` is passed as well.
465
486
  */
466
- hintIcon: PropTypes__default['default'].node,
487
+ hintIcon: PropTypes__default["default"].node,
467
488
 
468
489
  /**
469
490
  * Badge to be displayed beside the label.
470
491
  * <br />
471
492
  * Might be used to display additional information about the content of the field (E.g verified email)
472
493
  */
473
- badge: PropTypes__default['default'].node,
494
+ badge: PropTypes__default["default"].node,
474
495
 
475
496
  /**
476
497
  * Icon to display on the left of the placeholder text and selected value. Has no effect when isMulti is enabled.
477
498
  */
478
- iconLeft: PropTypes__default['default'].node
499
+ iconLeft: PropTypes__default["default"].node
479
500
  } : {};
480
501
 
481
- // NOTE: This string will be replaced in the `prepare` script by the `scripts/version.js` file.
482
- var version = '12.2.2';
502
+ // NOTE: This string will be replaced on build time with the package version.
503
+ var version = "12.2.6";
483
504
 
484
- exports['default'] = AsyncCreatableSelectField;
505
+ exports["default"] = AsyncCreatableSelectField;
485
506
  exports.version = version;
package/dist/commercetools-uikit-async-creatable-select-field.cjs.prod.js CHANGED
@@ -3,7 +3,15 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var _Reflect$construct = require('@babel/runtime-corejs3/core-js-stable/reflect/construct');
6
- var _extends = require('@babel/runtime-corejs3/helpers/extends');
6
+ var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
7
+ var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
8
+ var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
9
+ var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
10
+ var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
11
+ var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
12
+ var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
13
+ var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
14
+ var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
7
15
  var _classCallCheck = require('@babel/runtime-corejs3/helpers/classCallCheck');
8
16
  var _createClass = require('@babel/runtime-corejs3/helpers/createClass');
9
17
  var _inherits = require('@babel/runtime-corejs3/helpers/inherits');
@@ -12,7 +20,7 @@ var _getPrototypeOf = require('@babel/runtime-corejs3/helpers/getPrototypeOf');
12
20
  var _someInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/some');
13
21
  var _Object$values = require('@babel/runtime-corejs3/core-js-stable/object/values');
14
22
  var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
15
- var React = require('react');
23
+ var react = require('react');
16
24
  require('prop-types');
17
25
  require('react-required-if');
18
26
  var utils = require('@commercetools-uikit/utils');
@@ -21,34 +29,45 @@ var Spacings = require('@commercetools-uikit/spacings');
21
29
  var FieldLabel = require('@commercetools-uikit/field-label');
22
30
  var AsyncCreatableSelectInput = require('@commercetools-uikit/async-creatable-select-input');
23
31
  var FieldErrors = require('@commercetools-uikit/field-errors');
24
- var react = require('@emotion/react');
32
+ var jsxRuntime = require('@emotion/react/jsx-runtime');
25
33
 
26
34
  function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
27
35
 
28
36
  var _Reflect$construct__default = /*#__PURE__*/_interopDefault(_Reflect$construct);
37
+ var _Object$keys__default = /*#__PURE__*/_interopDefault(_Object$keys);
38
+ var _Object$getOwnPropertySymbols__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertySymbols);
39
+ var _filterInstanceProperty__default = /*#__PURE__*/_interopDefault(_filterInstanceProperty);
40
+ var _Object$getOwnPropertyDescriptor__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptor);
41
+ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachInstanceProperty);
42
+ var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptors);
43
+ var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
44
+ var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
29
45
  var _someInstanceProperty__default = /*#__PURE__*/_interopDefault(_someInstanceProperty);
30
46
  var _Object$values__default = /*#__PURE__*/_interopDefault(_Object$values);
31
47
  var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
32
- var React__default = /*#__PURE__*/_interopDefault(React);
33
48
  var Constraints__default = /*#__PURE__*/_interopDefault(Constraints);
34
49
  var Spacings__default = /*#__PURE__*/_interopDefault(Spacings);
35
50
  var FieldLabel__default = /*#__PURE__*/_interopDefault(FieldLabel);
36
51
  var AsyncCreatableSelectInput__default = /*#__PURE__*/_interopDefault(AsyncCreatableSelectInput);
37
52
  var FieldErrors__default = /*#__PURE__*/_interopDefault(FieldErrors);
38
53
 
39
- function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct__default['default'](Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
54
+ function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
40
55
 
41
- function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct__default['default']) return false; if (_Reflect$construct__default['default'].sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(_Reflect$construct__default['default'](Boolean, [], function () {})); return true; } catch (e) { return false; } }
56
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context8; _forEachInstanceProperty__default["default"](_context8 = ownKeys(Object(source), true)).call(_context8, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context9; _forEachInstanceProperty__default["default"](_context9 = ownKeys(Object(source))).call(_context9, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
57
+
58
+ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct__default["default"](Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
59
+
60
+ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct__default["default"]) return false; if (_Reflect$construct__default["default"].sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(_Reflect$construct__default["default"](Boolean, [], function () {})); return true; } catch (e) { return false; } }
42
61
  var sequentialId = utils.createSequentialId('async-creatable-select-field-');
43
62
 
44
63
  var hasErrors = function hasErrors(errors) {
45
64
  var _context;
46
65
 
47
- return errors && _someInstanceProperty__default['default'](_context = _Object$values__default['default'](errors)).call(_context, Boolean);
66
+ return errors && _someInstanceProperty__default["default"](_context = _Object$values__default["default"](errors)).call(_context, Boolean);
48
67
  };
49
68
 
50
- var AsyncCreatableSelectField = /*#__PURE__*/function (_React$Component) {
51
- _inherits(AsyncCreatableSelectField, _React$Component);
69
+ var AsyncCreatableSelectField = /*#__PURE__*/function (_Component) {
70
+ _inherits(AsyncCreatableSelectField, _Component);
52
71
 
53
72
  var _super = _createSuper(AsyncCreatableSelectField);
54
73
 
@@ -63,7 +82,7 @@ var AsyncCreatableSelectField = /*#__PURE__*/function (_React$Component) {
63
82
  args[_key] = arguments[_key];
64
83
  }
65
84
 
66
- _this = _super.call.apply(_super, _concatInstanceProperty__default['default'](_context2 = [this]).call(_context2, args));
85
+ _this = _super.call.apply(_super, _concatInstanceProperty__default["default"](_context2 = [this]).call(_context2, args));
67
86
  _this.state = {
68
87
  // We generate an id in case no id is provided by the parent to attach the
69
88
  // label to the input component.
@@ -75,76 +94,78 @@ var AsyncCreatableSelectField = /*#__PURE__*/function (_React$Component) {
75
94
  _createClass(AsyncCreatableSelectField, [{
76
95
  key: "render",
77
96
  value: function render() {
78
- var hasError = AsyncCreatableSelectInput__default['default'].isTouched(this.props.touched) && hasErrors(this.props.errors);
79
- return react.jsx(Constraints__default['default'].Horizontal, {
80
- max: this.props.horizontalConstraint
81
- }, react.jsx(Spacings__default['default'].Stack, {
82
- scale: "xs"
83
- }, react.jsx(FieldLabel__default['default'], {
84
- title: this.props.title,
85
- hint: this.props.hint,
86
- description: this.props.description,
87
- onInfoButtonClick: this.props.onInfoButtonClick,
88
- hintIcon: this.props.hintIcon,
89
- badge: this.props.badge,
90
- hasRequiredIndicator: this.props.isRequired,
91
- htmlFor: this.state.id
92
- }), react.jsx(AsyncCreatableSelectInput__default['default'], _extends({
93
- horizontalConstraint: "scale",
94
- hasError: hasError,
95
- "aria-label": this.props['aria-label'],
96
- "aria-labelledby": this.props['aria-labelledby'],
97
- isAutofocussed: this.props.isAutofocussed,
98
- backspaceRemovesValue: this.props.backspaceRemovesValue,
99
- components: this.props.components,
100
- filterOption: this.props.filterOption,
101
- id: this.state.id,
102
- containerId: this.props.containerId,
103
- isClearable: this.props.isClearable,
104
- isDisabled: this.props.isDisabled,
105
- isReadOnly: this.props.isReadOnly,
106
- isOptionDisabled: this.props.isOptionDisabled,
107
- isMulti: this.props.isMulti,
108
- isSearchable: this.props.isSearchable,
109
- hasWarning: this.props.hasWarning,
110
- maxMenuHeight: this.props.maxMenuHeight,
111
- menuPortalTarget: this.props.menuPortalTarget,
112
- menuPortalZIndex: this.props.menuPortalZIndex,
113
- menuShouldBlockSroll: this.props.menuShouldBlockScroll,
114
- name: this.props.name,
115
- noOptionsMessage: this.props.noOptionsMessage,
116
- onBlur: this.props.onBlur,
117
- onChange: this.props.onChange,
118
- onFocus: this.props.onFocus,
119
- onInputChange: this.props.onInputChange,
120
- options: this.props.options,
121
- placeholder: this.props.placeholder,
122
- tabIndex: this.props.tabIndex,
123
- tabSelectsValue: this.props.tabSelectsValue,
124
- value: this.props.value // Async react-select props
125
- ,
126
- defaultOptions: this.props.defaultOptions,
127
- loadOptions: this.props.loadOptions,
128
- cacheOptions: this.props.cacheOptions // Creatable props
129
- ,
130
- allowCreateWhileLoading: this.props.allowCreateWhileLoading,
131
- formatCreateLabel: this.props.formatCreateLabel,
132
- isValidNewOption: this.props.isValidNewOption,
133
- getNewOptionData: this.props.getNewOptionData,
134
- onCreateOption: this.props.onCreateOption,
135
- createOptionPosition: this.props.createOptionPosition,
136
- showOptionGroupDivider: this.props.showOptionGroupDivider,
137
- iconLeft: this.props.iconLeft
138
- }, utils.filterDataAttributes(this.props))), react.jsx(FieldErrors__default['default'], {
139
- errors: this.props.errors,
140
- isVisible: hasError,
141
- renderError: this.props.renderError
142
- })));
97
+ var hasError = AsyncCreatableSelectInput__default["default"].isTouched(this.props.touched) && hasErrors(this.props.errors);
98
+ return jsxRuntime.jsx(Constraints__default["default"].Horizontal, {
99
+ max: this.props.horizontalConstraint,
100
+ children: jsxRuntime.jsxs(Spacings__default["default"].Stack, {
101
+ scale: "xs",
102
+ children: [jsxRuntime.jsx(FieldLabel__default["default"], {
103
+ title: this.props.title,
104
+ hint: this.props.hint,
105
+ description: this.props.description,
106
+ onInfoButtonClick: this.props.onInfoButtonClick,
107
+ hintIcon: this.props.hintIcon,
108
+ badge: this.props.badge,
109
+ hasRequiredIndicator: this.props.isRequired,
110
+ htmlFor: this.state.id
111
+ }), jsxRuntime.jsx(AsyncCreatableSelectInput__default["default"], _objectSpread({
112
+ horizontalConstraint: "scale",
113
+ hasError: hasError,
114
+ "aria-label": this.props['aria-label'],
115
+ "aria-labelledby": this.props['aria-labelledby'],
116
+ isAutofocussed: this.props.isAutofocussed,
117
+ backspaceRemovesValue: this.props.backspaceRemovesValue,
118
+ components: this.props.components,
119
+ filterOption: this.props.filterOption,
120
+ id: this.state.id,
121
+ containerId: this.props.containerId,
122
+ isClearable: this.props.isClearable,
123
+ isDisabled: this.props.isDisabled,
124
+ isReadOnly: this.props.isReadOnly,
125
+ isOptionDisabled: this.props.isOptionDisabled,
126
+ isMulti: this.props.isMulti,
127
+ isSearchable: this.props.isSearchable,
128
+ hasWarning: this.props.hasWarning,
129
+ maxMenuHeight: this.props.maxMenuHeight,
130
+ menuPortalTarget: this.props.menuPortalTarget,
131
+ menuPortalZIndex: this.props.menuPortalZIndex,
132
+ menuShouldBlockSroll: this.props.menuShouldBlockScroll,
133
+ name: this.props.name,
134
+ noOptionsMessage: this.props.noOptionsMessage,
135
+ onBlur: this.props.onBlur,
136
+ onChange: this.props.onChange,
137
+ onFocus: this.props.onFocus,
138
+ onInputChange: this.props.onInputChange,
139
+ options: this.props.options,
140
+ placeholder: this.props.placeholder,
141
+ tabIndex: this.props.tabIndex,
142
+ tabSelectsValue: this.props.tabSelectsValue,
143
+ value: this.props.value // Async react-select props
144
+ ,
145
+ defaultOptions: this.props.defaultOptions,
146
+ loadOptions: this.props.loadOptions,
147
+ cacheOptions: this.props.cacheOptions // Creatable props
148
+ ,
149
+ allowCreateWhileLoading: this.props.allowCreateWhileLoading,
150
+ formatCreateLabel: this.props.formatCreateLabel,
151
+ isValidNewOption: this.props.isValidNewOption,
152
+ getNewOptionData: this.props.getNewOptionData,
153
+ onCreateOption: this.props.onCreateOption,
154
+ createOptionPosition: this.props.createOptionPosition,
155
+ showOptionGroupDivider: this.props.showOptionGroupDivider,
156
+ iconLeft: this.props.iconLeft
157
+ }, utils.filterDataAttributes(this.props))), jsxRuntime.jsx(FieldErrors__default["default"], {
158
+ errors: this.props.errors,
159
+ isVisible: hasError,
160
+ renderError: this.props.renderError
161
+ })]
162
+ })
163
+ });
143
164
  }
144
165
  }]);
145
166
 
146
167
  return AsyncCreatableSelectField;
147
- }(React__default['default'].Component);
168
+ }(react.Component);
148
169
 
149
170
  AsyncCreatableSelectField.displayName = 'AsyncCreatableSelectField';
150
171
  AsyncCreatableSelectField.defaultProps = {
@@ -158,8 +179,8 @@ AsyncCreatableSelectField.getDerivedStateFromProps = function (props, state) {
158
179
  };
159
180
  AsyncCreatableSelectField.propTypes = {};
160
181
 
161
- // NOTE: This string will be replaced in the `prepare` script by the `scripts/version.js` file.
162
- var version = '12.2.2';
182
+ // NOTE: This string will be replaced on build time with the package version.
183
+ var version = "12.2.6";
163
184
 
164
- exports['default'] = AsyncCreatableSelectField;
185
+ exports["default"] = AsyncCreatableSelectField;
165
186
  exports.version = version;
package/dist/commercetools-uikit-async-creatable-select-field.esm.js CHANGED
@@ -1,5 +1,13 @@
1
1
  import _Reflect$construct from '@babel/runtime-corejs3/core-js-stable/reflect/construct';
2
- import _extends from '@babel/runtime-corejs3/helpers/esm/extends';
2
+ import _Object$keys from '@babel/runtime-corejs3/core-js-stable/object/keys';
3
+ import _Object$getOwnPropertySymbols from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols';
4
+ import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
5
+ import _Object$getOwnPropertyDescriptor from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor';
6
+ import _forEachInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/for-each';
7
+ import _Object$getOwnPropertyDescriptors from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors';
8
+ import _Object$defineProperties from '@babel/runtime-corejs3/core-js-stable/object/define-properties';
9
+ import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object/define-property';
10
+ import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
3
11
  import _classCallCheck from '@babel/runtime-corejs3/helpers/esm/classCallCheck';
4
12
  import _createClass from '@babel/runtime-corejs3/helpers/esm/createClass';
5
13
  import _inherits from '@babel/runtime-corejs3/helpers/esm/inherits';
@@ -8,7 +16,7 @@ import _getPrototypeOf from '@babel/runtime-corejs3/helpers/esm/getPrototypeOf';
8
16
  import _someInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/some';
9
17
  import _Object$values from '@babel/runtime-corejs3/core-js-stable/object/values';
10
18
  import _concatInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/concat';
11
- import React from 'react';
19
+ import { Component } from 'react';
12
20
  import PropTypes from 'prop-types';
13
21
  import requiredIf from 'react-required-if';
14
22
  import { createSequentialId, filterDataAttributes, getFieldId, SafeHTMLElement } from '@commercetools-uikit/utils';
@@ -17,7 +25,11 @@ import Spacings from '@commercetools-uikit/spacings';
17
25
  import FieldLabel from '@commercetools-uikit/field-label';
18
26
  import AsyncCreatableSelectInput from '@commercetools-uikit/async-creatable-select-input';
19
27
  import FieldErrors from '@commercetools-uikit/field-errors';
20
- import { jsx } from '@emotion/react';
28
+ import { jsx, jsxs } from '@emotion/react/jsx-runtime';
29
+
30
+ function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); if (enumerableOnly) { symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
31
+
32
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context8; _forEachInstanceProperty(_context8 = ownKeys(Object(source), true)).call(_context8, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors) { _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)); } else { var _context9; _forEachInstanceProperty(_context9 = ownKeys(Object(source))).call(_context9, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } } return target; }
21
33
 
22
34
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
23
35
 
@@ -30,8 +42,8 @@ var hasErrors = function hasErrors(errors) {
30
42
  return errors && _someInstanceProperty(_context = _Object$values(errors)).call(_context, Boolean);
31
43
  };
32
44
 
33
- var AsyncCreatableSelectField = /*#__PURE__*/function (_React$Component) {
34
- _inherits(AsyncCreatableSelectField, _React$Component);
45
+ var AsyncCreatableSelectField = /*#__PURE__*/function (_Component) {
46
+ _inherits(AsyncCreatableSelectField, _Component);
35
47
 
36
48
  var _super = _createSuper(AsyncCreatableSelectField);
37
49
 
@@ -60,74 +72,76 @@ var AsyncCreatableSelectField = /*#__PURE__*/function (_React$Component) {
60
72
  value: function render() {
61
73
  var hasError = AsyncCreatableSelectInput.isTouched(this.props.touched) && hasErrors(this.props.errors);
62
74
  return jsx(Constraints.Horizontal, {
63
- max: this.props.horizontalConstraint
64
- }, jsx(Spacings.Stack, {
65
- scale: "xs"
66
- }, jsx(FieldLabel, {
67
- title: this.props.title,
68
- hint: this.props.hint,
69
- description: this.props.description,
70
- onInfoButtonClick: this.props.onInfoButtonClick,
71
- hintIcon: this.props.hintIcon,
72
- badge: this.props.badge,
73
- hasRequiredIndicator: this.props.isRequired,
74
- htmlFor: this.state.id
75
- }), jsx(AsyncCreatableSelectInput, _extends({
76
- horizontalConstraint: "scale",
77
- hasError: hasError,
78
- "aria-label": this.props['aria-label'],
79
- "aria-labelledby": this.props['aria-labelledby'],
80
- isAutofocussed: this.props.isAutofocussed,
81
- backspaceRemovesValue: this.props.backspaceRemovesValue,
82
- components: this.props.components,
83
- filterOption: this.props.filterOption,
84
- id: this.state.id,
85
- containerId: this.props.containerId,
86
- isClearable: this.props.isClearable,
87
- isDisabled: this.props.isDisabled,
88
- isReadOnly: this.props.isReadOnly,
89
- isOptionDisabled: this.props.isOptionDisabled,
90
- isMulti: this.props.isMulti,
91
- isSearchable: this.props.isSearchable,
92
- hasWarning: this.props.hasWarning,
93
- maxMenuHeight: this.props.maxMenuHeight,
94
- menuPortalTarget: this.props.menuPortalTarget,
95
- menuPortalZIndex: this.props.menuPortalZIndex,
96
- menuShouldBlockSroll: this.props.menuShouldBlockScroll,
97
- name: this.props.name,
98
- noOptionsMessage: this.props.noOptionsMessage,
99
- onBlur: this.props.onBlur,
100
- onChange: this.props.onChange,
101
- onFocus: this.props.onFocus,
102
- onInputChange: this.props.onInputChange,
103
- options: this.props.options,
104
- placeholder: this.props.placeholder,
105
- tabIndex: this.props.tabIndex,
106
- tabSelectsValue: this.props.tabSelectsValue,
107
- value: this.props.value // Async react-select props
108
- ,
109
- defaultOptions: this.props.defaultOptions,
110
- loadOptions: this.props.loadOptions,
111
- cacheOptions: this.props.cacheOptions // Creatable props
112
- ,
113
- allowCreateWhileLoading: this.props.allowCreateWhileLoading,
114
- formatCreateLabel: this.props.formatCreateLabel,
115
- isValidNewOption: this.props.isValidNewOption,
116
- getNewOptionData: this.props.getNewOptionData,
117
- onCreateOption: this.props.onCreateOption,
118
- createOptionPosition: this.props.createOptionPosition,
119
- showOptionGroupDivider: this.props.showOptionGroupDivider,
120
- iconLeft: this.props.iconLeft
121
- }, filterDataAttributes(this.props))), jsx(FieldErrors, {
122
- errors: this.props.errors,
123
- isVisible: hasError,
124
- renderError: this.props.renderError
125
- })));
75
+ max: this.props.horizontalConstraint,
76
+ children: jsxs(Spacings.Stack, {
77
+ scale: "xs",
78
+ children: [jsx(FieldLabel, {
79
+ title: this.props.title,
80
+ hint: this.props.hint,
81
+ description: this.props.description,
82
+ onInfoButtonClick: this.props.onInfoButtonClick,
83
+ hintIcon: this.props.hintIcon,
84
+ badge: this.props.badge,
85
+ hasRequiredIndicator: this.props.isRequired,
86
+ htmlFor: this.state.id
87
+ }), jsx(AsyncCreatableSelectInput, _objectSpread({
88
+ horizontalConstraint: "scale",
89
+ hasError: hasError,
90
+ "aria-label": this.props['aria-label'],
91
+ "aria-labelledby": this.props['aria-labelledby'],
92
+ isAutofocussed: this.props.isAutofocussed,
93
+ backspaceRemovesValue: this.props.backspaceRemovesValue,
94
+ components: this.props.components,
95
+ filterOption: this.props.filterOption,
96
+ id: this.state.id,
97
+ containerId: this.props.containerId,
98
+ isClearable: this.props.isClearable,
99
+ isDisabled: this.props.isDisabled,
100
+ isReadOnly: this.props.isReadOnly,
101
+ isOptionDisabled: this.props.isOptionDisabled,
102
+ isMulti: this.props.isMulti,
103
+ isSearchable: this.props.isSearchable,
104
+ hasWarning: this.props.hasWarning,
105
+ maxMenuHeight: this.props.maxMenuHeight,
106
+ menuPortalTarget: this.props.menuPortalTarget,
107
+ menuPortalZIndex: this.props.menuPortalZIndex,
108
+ menuShouldBlockSroll: this.props.menuShouldBlockScroll,
109
+ name: this.props.name,
110
+ noOptionsMessage: this.props.noOptionsMessage,
111
+ onBlur: this.props.onBlur,
112
+ onChange: this.props.onChange,
113
+ onFocus: this.props.onFocus,
114
+ onInputChange: this.props.onInputChange,
115
+ options: this.props.options,
116
+ placeholder: this.props.placeholder,
117
+ tabIndex: this.props.tabIndex,
118
+ tabSelectsValue: this.props.tabSelectsValue,
119
+ value: this.props.value // Async react-select props
120
+ ,
121
+ defaultOptions: this.props.defaultOptions,
122
+ loadOptions: this.props.loadOptions,
123
+ cacheOptions: this.props.cacheOptions // Creatable props
124
+ ,
125
+ allowCreateWhileLoading: this.props.allowCreateWhileLoading,
126
+ formatCreateLabel: this.props.formatCreateLabel,
127
+ isValidNewOption: this.props.isValidNewOption,
128
+ getNewOptionData: this.props.getNewOptionData,
129
+ onCreateOption: this.props.onCreateOption,
130
+ createOptionPosition: this.props.createOptionPosition,
131
+ showOptionGroupDivider: this.props.showOptionGroupDivider,
132
+ iconLeft: this.props.iconLeft
133
+ }, filterDataAttributes(this.props))), jsx(FieldErrors, {
134
+ errors: this.props.errors,
135
+ isVisible: hasError,
136
+ renderError: this.props.renderError
137
+ })]
138
+ })
139
+ });
126
140
  }
127
141
  }]);
128
142
 
129
143
  return AsyncCreatableSelectField;
130
- }(React.Component);
144
+ }(Component);
131
145
 
132
146
  AsyncCreatableSelectField.displayName = 'AsyncCreatableSelectField';
133
147
  AsyncCreatableSelectField.defaultProps = {
@@ -459,7 +473,7 @@ AsyncCreatableSelectField.propTypes = process.env.NODE_ENV !== "production" ? {
459
473
  iconLeft: PropTypes.node
460
474
  } : {};
461
475
 
462
- // NOTE: This string will be replaced in the `prepare` script by the `scripts/version.js` file.
463
- var version = '12.2.2';
476
+ // NOTE: This string will be replaced on build time with the package version.
477
+ var version = "12.2.6";
464
478
 
465
479
  export { AsyncCreatableSelectField as default, version };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@commercetools-uikit/async-creatable-select-field",
3
3
  "description": "An input component with validation states and a label getting a selection from an asynchronously loaded list from the user, and where options can be created by the user.",
4
- "version": "12.2.2",
4
+ "version": "12.2.6",
5
5
  "bugs": "https://github.com/commercetools/ui-kit/issues",
6
6
  "repository": {
7
7
  "type": "git",
@@ -11,7 +11,6 @@
11
11
  "homepage": "https://uikit.commercetools.com",
12
12
  "keywords": ["javascript", "design system", "react", "uikit"],
13
13
  "license": "MIT",
14
- "private": false,
15
14
  "publishConfig": {
16
15
  "access": "public"
17
16
  },
@@ -19,19 +18,16 @@
19
18
  "main": "dist/commercetools-uikit-async-creatable-select-field.cjs.js",
20
19
  "module": "dist/commercetools-uikit-async-creatable-select-field.esm.js",
21
20
  "files": ["dist"],
22
- "scripts": {
23
- "prepare": "../../../../scripts/version.js replace"
24
- },
25
21
  "dependencies": {
26
- "@babel/runtime": "7.14.8",
27
- "@babel/runtime-corejs3": "7.14.8",
28
- "@commercetools-uikit/async-creatable-select-input": "12.2.2",
29
- "@commercetools-uikit/constraints": "12.2.2",
30
- "@commercetools-uikit/design-system": "12.2.2",
31
- "@commercetools-uikit/field-errors": "12.2.2",
32
- "@commercetools-uikit/field-label": "12.2.2",
33
- "@commercetools-uikit/spacings": "12.2.2",
34
- "@commercetools-uikit/utils": "12.2.0",
22
+ "@babel/runtime": "7.16.3",
23
+ "@babel/runtime-corejs3": "7.16.3",
24
+ "@commercetools-uikit/async-creatable-select-input": "12.2.6",
25
+ "@commercetools-uikit/constraints": "12.2.5",
26
+ "@commercetools-uikit/design-system": "12.2.5",
27
+ "@commercetools-uikit/field-errors": "12.2.5",
28
+ "@commercetools-uikit/field-label": "12.2.6",
29
+ "@commercetools-uikit/spacings": "12.2.5",
30
+ "@commercetools-uikit/utils": "12.2.5",
35
31
  "@emotion/react": "^11.4.0",
36
32
  "@emotion/styled": "^11.3.0",
37
33
  "prop-types": "15.7.2",