@commercetools-uikit/number-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.
package/README.md
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
|
|
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
|
|
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 Stack = require('@commercetools-uikit/spacings-stack');
|
|
|
21
29
|
var FieldLabel = require('@commercetools-uikit/field-label');
|
|
22
30
|
var FieldErrors = require('@commercetools-uikit/field-errors');
|
|
23
31
|
var NumberInput = require('@commercetools-uikit/number-input');
|
|
24
|
-
var
|
|
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 FieldErrors__default = /*#__PURE__*/_interopDefault(FieldErrors);
|
|
39
54
|
var NumberInput__default = /*#__PURE__*/_interopDefault(NumberInput);
|
|
40
55
|
|
|
41
|
-
function
|
|
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
|
|
58
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context3; _forEachInstanceProperty__default["default"](_context3 = ownKeys(Object(source), true)).call(_context3, 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 _context4; _forEachInstanceProperty__default["default"](_context4 = ownKeys(Object(source))).call(_context4, 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('number-field-');
|
|
45
64
|
|
|
46
65
|
var hasErrors = function hasErrors(errors) {
|
|
47
66
|
var _context;
|
|
48
67
|
|
|
49
|
-
return errors && _someInstanceProperty__default[
|
|
68
|
+
return errors && _someInstanceProperty__default["default"](_context = _Object$values__default["default"](errors)).call(_context, Boolean);
|
|
50
69
|
};
|
|
51
70
|
|
|
52
|
-
var NumberField = /*#__PURE__*/function (
|
|
53
|
-
_inherits(NumberField,
|
|
71
|
+
var NumberField = /*#__PURE__*/function (_Component) {
|
|
72
|
+
_inherits(NumberField, _Component);
|
|
54
73
|
|
|
55
74
|
var _super = _createSuper(NumberField);
|
|
56
75
|
|
|
@@ -65,7 +84,7 @@ var NumberField = /*#__PURE__*/function (_React$Component) {
|
|
|
65
84
|
args[_key] = arguments[_key];
|
|
66
85
|
}
|
|
67
86
|
|
|
68
|
-
_this = _super.call.apply(_super, _concatInstanceProperty__default[
|
|
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.
|
|
@@ -78,46 +97,48 @@ var NumberField = /*#__PURE__*/function (_React$Component) {
|
|
|
78
97
|
key: "render",
|
|
79
98
|
value: function render() {
|
|
80
99
|
var hasError = this.props.touched && hasErrors(this.props.errors);
|
|
81
|
-
return
|
|
82
|
-
max: this.props.horizontalConstraint
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
100
|
+
return jsxRuntime.jsx(Constraints__default["default"].Horizontal, {
|
|
101
|
+
max: this.props.horizontalConstraint,
|
|
102
|
+
children: jsxRuntime.jsxs(Stack__default["default"], {
|
|
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(NumberInput__default["default"], _objectSpread({
|
|
114
|
+
id: this.state.id,
|
|
115
|
+
name: this.props.name,
|
|
116
|
+
autoComplete: this.props.autoComplete,
|
|
117
|
+
value: this.props.value,
|
|
118
|
+
onChange: this.props.onChange,
|
|
119
|
+
onBlur: this.props.onBlur,
|
|
120
|
+
onFocus: this.props.onFocus,
|
|
121
|
+
isAutofocussed: this.props.isAutofocussed,
|
|
122
|
+
isDisabled: this.props.isDisabled,
|
|
123
|
+
isReadOnly: this.props.isReadOnly,
|
|
124
|
+
hasError: hasError,
|
|
125
|
+
placeholder: this.props.placeholder,
|
|
126
|
+
horizontalConstraint: "scale",
|
|
127
|
+
min: this.props.min,
|
|
128
|
+
max: this.props.max,
|
|
129
|
+
step: this.props.step
|
|
130
|
+
}, utils.filterDataAttributes(this.props))), jsxRuntime.jsx(FieldErrors__default["default"], {
|
|
131
|
+
errors: this.props.errors,
|
|
132
|
+
isVisible: hasError,
|
|
133
|
+
renderError: this.props.renderError
|
|
134
|
+
})]
|
|
135
|
+
})
|
|
136
|
+
});
|
|
116
137
|
}
|
|
117
138
|
}]);
|
|
118
139
|
|
|
119
140
|
return NumberField;
|
|
120
|
-
}(
|
|
141
|
+
}(react.Component);
|
|
121
142
|
|
|
122
143
|
NumberField.displayName = 'NumberField';
|
|
123
144
|
NumberField.defaultProps = {
|
|
@@ -136,20 +157,20 @@ NumberField.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
136
157
|
/**
|
|
137
158
|
* Used as HTML id property. An id is auto-generated when it is not specified.
|
|
138
159
|
*/
|
|
139
|
-
id: PropTypes__default[
|
|
160
|
+
id: PropTypes__default["default"].string,
|
|
140
161
|
|
|
141
162
|
/**
|
|
142
163
|
* Horizontal size limit of the input fields.
|
|
143
164
|
*/
|
|
144
|
-
horizontalConstraint: PropTypes__default[
|
|
165
|
+
horizontalConstraint: PropTypes__default["default"].oneOf([3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 'scale', 'auto']),
|
|
145
166
|
|
|
146
167
|
/**
|
|
147
168
|
* A map of errors. Error messages for known errors are rendered automatically.
|
|
148
169
|
* <br />
|
|
149
170
|
* Unknown errors will be forwarded to `renderError`
|
|
150
171
|
*/
|
|
151
|
-
errors: PropTypes__default[
|
|
152
|
-
missing: PropTypes__default[
|
|
172
|
+
errors: PropTypes__default["default"].shape({
|
|
173
|
+
missing: PropTypes__default["default"].bool
|
|
153
174
|
}),
|
|
154
175
|
|
|
155
176
|
/**
|
|
@@ -157,40 +178,40 @@ NumberField.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
157
178
|
* <br />
|
|
158
179
|
* Signature: `(key, error) => React.node`
|
|
159
180
|
*/
|
|
160
|
-
renderError: PropTypes__default[
|
|
181
|
+
renderError: PropTypes__default["default"].func,
|
|
161
182
|
|
|
162
183
|
/**
|
|
163
184
|
* Indicates if the value is required. Shows an the "required asterisk" if so.
|
|
164
185
|
*/
|
|
165
|
-
isRequired: PropTypes__default[
|
|
186
|
+
isRequired: PropTypes__default["default"].bool,
|
|
166
187
|
|
|
167
188
|
/**
|
|
168
189
|
* Indicates whether the field was touched. Errors will only be shown when the field was touched.
|
|
169
190
|
*/
|
|
170
|
-
touched: PropTypes__default[
|
|
191
|
+
touched: PropTypes__default["default"].bool,
|
|
171
192
|
// NumberInput
|
|
172
193
|
|
|
173
194
|
/**
|
|
174
195
|
* Used as HTML name of the input component. property
|
|
175
196
|
*/
|
|
176
|
-
name: PropTypes__default[
|
|
197
|
+
name: PropTypes__default["default"].string,
|
|
177
198
|
|
|
178
199
|
/**
|
|
179
200
|
* Value of the input component.
|
|
180
201
|
*/
|
|
181
|
-
value: PropTypes__default[
|
|
202
|
+
value: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]).isRequired,
|
|
182
203
|
|
|
183
204
|
/**
|
|
184
205
|
* Used as HTML `autocomplete` of the input component. property
|
|
185
206
|
*/
|
|
186
|
-
autoComplete: PropTypes__default[
|
|
207
|
+
autoComplete: PropTypes__default["default"].string,
|
|
187
208
|
|
|
188
209
|
/**
|
|
189
210
|
* Called with an event containing the new value. Required when input is not read only. Parent should pass it back as value.
|
|
190
211
|
* <br />
|
|
191
212
|
* Signature: `(event) => void`
|
|
192
213
|
*/
|
|
193
|
-
onChange: requiredIf__default[
|
|
214
|
+
onChange: requiredIf__default["default"](PropTypes__default["default"].func, function (props) {
|
|
194
215
|
return !props.isReadOnly;
|
|
195
216
|
}),
|
|
196
217
|
|
|
@@ -199,69 +220,69 @@ NumberField.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
199
220
|
* <br />
|
|
200
221
|
* Signature: `(event) => void`
|
|
201
222
|
*/
|
|
202
|
-
onBlur: PropTypes__default[
|
|
223
|
+
onBlur: PropTypes__default["default"].func,
|
|
203
224
|
|
|
204
225
|
/**
|
|
205
226
|
* Called when input is focused
|
|
206
227
|
* <br />
|
|
207
228
|
* Signature: `(event) => void`
|
|
208
229
|
*/
|
|
209
|
-
onFocus: PropTypes__default[
|
|
230
|
+
onFocus: PropTypes__default["default"].func,
|
|
210
231
|
|
|
211
232
|
/**
|
|
212
233
|
* Focus the input on initial render
|
|
213
234
|
*/
|
|
214
|
-
isAutofocussed: PropTypes__default[
|
|
235
|
+
isAutofocussed: PropTypes__default["default"].bool,
|
|
215
236
|
|
|
216
237
|
/**
|
|
217
238
|
* Indicates that the input cannot be modified (e.g not authorized, or changes currently saving).
|
|
218
239
|
*/
|
|
219
|
-
isDisabled: PropTypes__default[
|
|
240
|
+
isDisabled: PropTypes__default["default"].bool,
|
|
220
241
|
|
|
221
242
|
/**
|
|
222
243
|
* Indicates that the field is displaying read-only content
|
|
223
244
|
*/
|
|
224
|
-
isReadOnly: PropTypes__default[
|
|
245
|
+
isReadOnly: PropTypes__default["default"].bool,
|
|
225
246
|
|
|
226
247
|
/**
|
|
227
248
|
* Placeholder text for the input
|
|
228
249
|
*/
|
|
229
|
-
placeholder: PropTypes__default[
|
|
250
|
+
placeholder: PropTypes__default["default"].string,
|
|
230
251
|
|
|
231
252
|
/**
|
|
232
253
|
* Value is used as `min` property on input field
|
|
233
254
|
*/
|
|
234
|
-
min: PropTypes__default[
|
|
255
|
+
min: PropTypes__default["default"].number,
|
|
235
256
|
|
|
236
257
|
/**
|
|
237
258
|
* Value is used as `max` property on input field
|
|
238
259
|
*/
|
|
239
|
-
max: PropTypes__default[
|
|
260
|
+
max: PropTypes__default["default"].number,
|
|
240
261
|
|
|
241
262
|
/**
|
|
242
263
|
* Value is used as `step` property on input field.
|
|
243
264
|
* <br />
|
|
244
265
|
* Use the value `any` for inputs which accept an unpredictable amount of decimals.
|
|
245
266
|
*/
|
|
246
|
-
step: PropTypes__default[
|
|
267
|
+
step: PropTypes__default["default"].oneOfType([PropTypes__default["default"].number, PropTypes__default["default"].oneOf(['any'])]),
|
|
247
268
|
// LabelField
|
|
248
269
|
|
|
249
270
|
/**
|
|
250
271
|
* Title of the label
|
|
251
272
|
*/
|
|
252
|
-
title: PropTypes__default[
|
|
273
|
+
title: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].node]).isRequired,
|
|
253
274
|
|
|
254
275
|
/**
|
|
255
276
|
* 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`.
|
|
256
277
|
*/
|
|
257
|
-
hint: requiredIf__default[
|
|
278
|
+
hint: requiredIf__default["default"](PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].node]), function (props) {
|
|
258
279
|
return props.hintIcon;
|
|
259
280
|
}),
|
|
260
281
|
|
|
261
282
|
/**
|
|
262
283
|
* Provides a description for the title.
|
|
263
284
|
*/
|
|
264
|
-
description: PropTypes__default[
|
|
285
|
+
description: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].node]),
|
|
265
286
|
|
|
266
287
|
/**
|
|
267
288
|
* Function called when info button is pressed.
|
|
@@ -270,26 +291,26 @@ NumberField.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
270
291
|
* <br />
|
|
271
292
|
* Signature: `(event) => void`
|
|
272
293
|
*/
|
|
273
|
-
onInfoButtonClick: PropTypes__default[
|
|
294
|
+
onInfoButtonClick: PropTypes__default["default"].func,
|
|
274
295
|
|
|
275
296
|
/**
|
|
276
297
|
* Icon to be displayed beside the hint text.
|
|
277
298
|
* <br />
|
|
278
299
|
* Will only get rendered when `hint` is passed as well.
|
|
279
300
|
*/
|
|
280
|
-
hintIcon: PropTypes__default[
|
|
301
|
+
hintIcon: PropTypes__default["default"].node,
|
|
281
302
|
|
|
282
303
|
/**
|
|
283
304
|
* Badge to be displayed beside the label.
|
|
284
305
|
* <br />
|
|
285
306
|
* Might be used to display additional information about the content of the field (E.g verified email)
|
|
286
307
|
*/
|
|
287
|
-
badge: PropTypes__default[
|
|
308
|
+
badge: PropTypes__default["default"].node
|
|
288
309
|
} : {};
|
|
289
310
|
var NumberField$1 = NumberField;
|
|
290
311
|
|
|
291
|
-
// NOTE: This string will be replaced
|
|
292
|
-
var version =
|
|
312
|
+
// NOTE: This string will be replaced on build time with the package version.
|
|
313
|
+
var version = "12.2.6";
|
|
293
314
|
|
|
294
|
-
exports[
|
|
315
|
+
exports["default"] = NumberField$1;
|
|
295
316
|
exports.version = version;
|
|
@@ -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
|
|
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
|
|
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 Stack = require('@commercetools-uikit/spacings-stack');
|
|
|
21
29
|
var FieldLabel = require('@commercetools-uikit/field-label');
|
|
22
30
|
var FieldErrors = require('@commercetools-uikit/field-errors');
|
|
23
31
|
var NumberInput = require('@commercetools-uikit/number-input');
|
|
24
|
-
var
|
|
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 Stack__default = /*#__PURE__*/_interopDefault(Stack);
|
|
35
50
|
var FieldLabel__default = /*#__PURE__*/_interopDefault(FieldLabel);
|
|
36
51
|
var FieldErrors__default = /*#__PURE__*/_interopDefault(FieldErrors);
|
|
37
52
|
var NumberInput__default = /*#__PURE__*/_interopDefault(NumberInput);
|
|
38
53
|
|
|
39
|
-
function
|
|
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
|
|
56
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context3; _forEachInstanceProperty__default["default"](_context3 = ownKeys(Object(source), true)).call(_context3, 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 _context4; _forEachInstanceProperty__default["default"](_context4 = ownKeys(Object(source))).call(_context4, 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('number-field-');
|
|
43
62
|
|
|
44
63
|
var hasErrors = function hasErrors(errors) {
|
|
45
64
|
var _context;
|
|
46
65
|
|
|
47
|
-
return errors && _someInstanceProperty__default[
|
|
66
|
+
return errors && _someInstanceProperty__default["default"](_context = _Object$values__default["default"](errors)).call(_context, Boolean);
|
|
48
67
|
};
|
|
49
68
|
|
|
50
|
-
var NumberField = /*#__PURE__*/function (
|
|
51
|
-
_inherits(NumberField,
|
|
69
|
+
var NumberField = /*#__PURE__*/function (_Component) {
|
|
70
|
+
_inherits(NumberField, _Component);
|
|
52
71
|
|
|
53
72
|
var _super = _createSuper(NumberField);
|
|
54
73
|
|
|
@@ -63,7 +82,7 @@ var NumberField = /*#__PURE__*/function (_React$Component) {
|
|
|
63
82
|
args[_key] = arguments[_key];
|
|
64
83
|
}
|
|
65
84
|
|
|
66
|
-
_this = _super.call.apply(_super, _concatInstanceProperty__default[
|
|
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.
|
|
@@ -76,46 +95,48 @@ var NumberField = /*#__PURE__*/function (_React$Component) {
|
|
|
76
95
|
key: "render",
|
|
77
96
|
value: function render() {
|
|
78
97
|
var hasError = this.props.touched && hasErrors(this.props.errors);
|
|
79
|
-
return
|
|
80
|
-
max: this.props.horizontalConstraint
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
98
|
+
return jsxRuntime.jsx(Constraints__default["default"].Horizontal, {
|
|
99
|
+
max: this.props.horizontalConstraint,
|
|
100
|
+
children: jsxRuntime.jsxs(Stack__default["default"], {
|
|
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(NumberInput__default["default"], _objectSpread({
|
|
112
|
+
id: this.state.id,
|
|
113
|
+
name: this.props.name,
|
|
114
|
+
autoComplete: this.props.autoComplete,
|
|
115
|
+
value: this.props.value,
|
|
116
|
+
onChange: this.props.onChange,
|
|
117
|
+
onBlur: this.props.onBlur,
|
|
118
|
+
onFocus: this.props.onFocus,
|
|
119
|
+
isAutofocussed: this.props.isAutofocussed,
|
|
120
|
+
isDisabled: this.props.isDisabled,
|
|
121
|
+
isReadOnly: this.props.isReadOnly,
|
|
122
|
+
hasError: hasError,
|
|
123
|
+
placeholder: this.props.placeholder,
|
|
124
|
+
horizontalConstraint: "scale",
|
|
125
|
+
min: this.props.min,
|
|
126
|
+
max: this.props.max,
|
|
127
|
+
step: this.props.step
|
|
128
|
+
}, utils.filterDataAttributes(this.props))), jsxRuntime.jsx(FieldErrors__default["default"], {
|
|
129
|
+
errors: this.props.errors,
|
|
130
|
+
isVisible: hasError,
|
|
131
|
+
renderError: this.props.renderError
|
|
132
|
+
})]
|
|
133
|
+
})
|
|
134
|
+
});
|
|
114
135
|
}
|
|
115
136
|
}]);
|
|
116
137
|
|
|
117
138
|
return NumberField;
|
|
118
|
-
}(
|
|
139
|
+
}(react.Component);
|
|
119
140
|
|
|
120
141
|
NumberField.displayName = 'NumberField';
|
|
121
142
|
NumberField.defaultProps = {
|
|
@@ -131,8 +152,8 @@ NumberField.getDerivedStateFromProps = function (props, state) {
|
|
|
131
152
|
NumberField.propTypes = {};
|
|
132
153
|
var NumberField$1 = NumberField;
|
|
133
154
|
|
|
134
|
-
// NOTE: This string will be replaced
|
|
135
|
-
var version =
|
|
155
|
+
// NOTE: This string will be replaced on build time with the package version.
|
|
156
|
+
var version = "12.2.6";
|
|
136
157
|
|
|
137
|
-
exports[
|
|
158
|
+
exports["default"] = NumberField$1;
|
|
138
159
|
exports.version = version;
|
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
import _Reflect$construct from '@babel/runtime-corejs3/core-js-stable/reflect/construct';
|
|
2
|
-
import
|
|
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
|
|
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 } from '@commercetools-uikit/utils';
|
|
@@ -17,7 +25,11 @@ import Stack from '@commercetools-uikit/spacings-stack';
|
|
|
17
25
|
import FieldLabel from '@commercetools-uikit/field-label';
|
|
18
26
|
import FieldErrors from '@commercetools-uikit/field-errors';
|
|
19
27
|
import NumberInput from '@commercetools-uikit/number-input';
|
|
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 _context3; _forEachInstanceProperty(_context3 = ownKeys(Object(source), true)).call(_context3, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors) { _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)); } else { var _context4; _forEachInstanceProperty(_context4 = ownKeys(Object(source))).call(_context4, 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 NumberField = /*#__PURE__*/function (
|
|
34
|
-
_inherits(NumberField,
|
|
45
|
+
var NumberField = /*#__PURE__*/function (_Component) {
|
|
46
|
+
_inherits(NumberField, _Component);
|
|
35
47
|
|
|
36
48
|
var _super = _createSuper(NumberField);
|
|
37
49
|
|
|
@@ -60,45 +72,47 @@ var NumberField = /*#__PURE__*/function (_React$Component) {
|
|
|
60
72
|
value: function render() {
|
|
61
73
|
var hasError = this.props.touched && hasErrors(this.props.errors);
|
|
62
74
|
return jsx(Constraints.Horizontal, {
|
|
63
|
-
max: this.props.horizontalConstraint
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
75
|
+
max: this.props.horizontalConstraint,
|
|
76
|
+
children: jsxs(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(NumberInput, _objectSpread({
|
|
88
|
+
id: this.state.id,
|
|
89
|
+
name: this.props.name,
|
|
90
|
+
autoComplete: this.props.autoComplete,
|
|
91
|
+
value: this.props.value,
|
|
92
|
+
onChange: this.props.onChange,
|
|
93
|
+
onBlur: this.props.onBlur,
|
|
94
|
+
onFocus: this.props.onFocus,
|
|
95
|
+
isAutofocussed: this.props.isAutofocussed,
|
|
96
|
+
isDisabled: this.props.isDisabled,
|
|
97
|
+
isReadOnly: this.props.isReadOnly,
|
|
98
|
+
hasError: hasError,
|
|
99
|
+
placeholder: this.props.placeholder,
|
|
100
|
+
horizontalConstraint: "scale",
|
|
101
|
+
min: this.props.min,
|
|
102
|
+
max: this.props.max,
|
|
103
|
+
step: this.props.step
|
|
104
|
+
}, filterDataAttributes(this.props))), jsx(FieldErrors, {
|
|
105
|
+
errors: this.props.errors,
|
|
106
|
+
isVisible: hasError,
|
|
107
|
+
renderError: this.props.renderError
|
|
108
|
+
})]
|
|
109
|
+
})
|
|
110
|
+
});
|
|
97
111
|
}
|
|
98
112
|
}]);
|
|
99
113
|
|
|
100
114
|
return NumberField;
|
|
101
|
-
}(
|
|
115
|
+
}(Component);
|
|
102
116
|
|
|
103
117
|
NumberField.displayName = 'NumberField';
|
|
104
118
|
NumberField.defaultProps = {
|
|
@@ -269,7 +283,7 @@ NumberField.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
269
283
|
} : {};
|
|
270
284
|
var NumberField$1 = NumberField;
|
|
271
285
|
|
|
272
|
-
// NOTE: This string will be replaced
|
|
273
|
-
var version =
|
|
286
|
+
// NOTE: This string will be replaced on build time with the package version.
|
|
287
|
+
var version = "12.2.6";
|
|
274
288
|
|
|
275
289
|
export { NumberField$1 as default, version };
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@commercetools-uikit/number-field",
|
|
3
3
|
"description": "A controlled input component for numbers with validation states and a label.",
|
|
4
|
-
"version": "12.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-number-field.cjs.js",
|
|
20
19
|
"module": "dist/commercetools-uikit-number-field.esm.js",
|
|
21
20
|
"files": ["dist"],
|
|
22
|
-
"scripts": {
|
|
23
|
-
"prepare": "../../../../scripts/version.js replace"
|
|
24
|
-
},
|
|
25
21
|
"dependencies": {
|
|
26
|
-
"@babel/runtime": "7.
|
|
27
|
-
"@babel/runtime-corejs3": "7.
|
|
28
|
-
"@commercetools-uikit/constraints": "12.2.
|
|
29
|
-
"@commercetools-uikit/design-system": "12.2.
|
|
30
|
-
"@commercetools-uikit/field-errors": "12.2.
|
|
31
|
-
"@commercetools-uikit/field-label": "12.2.
|
|
32
|
-
"@commercetools-uikit/number-input": "12.2.
|
|
33
|
-
"@commercetools-uikit/spacings-stack": "12.2.
|
|
34
|
-
"@commercetools-uikit/utils": "12.2.
|
|
22
|
+
"@babel/runtime": "7.16.3",
|
|
23
|
+
"@babel/runtime-corejs3": "7.16.3",
|
|
24
|
+
"@commercetools-uikit/constraints": "12.2.5",
|
|
25
|
+
"@commercetools-uikit/design-system": "12.2.5",
|
|
26
|
+
"@commercetools-uikit/field-errors": "12.2.5",
|
|
27
|
+
"@commercetools-uikit/field-label": "12.2.6",
|
|
28
|
+
"@commercetools-uikit/number-input": "12.2.6",
|
|
29
|
+
"@commercetools-uikit/spacings-stack": "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",
|