@pie-lib/config-ui 10.13.0 → 10.13.3

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/CHANGELOG.md CHANGED
@@ -3,6 +3,33 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [10.13.3](https://github.com/pie-framework/pie-lib/compare/@pie-lib/config-ui@10.13.2...@pie-lib/config-ui@10.13.3) (2022-06-13)
7
+
8
+ **Note:** Version bump only for package @pie-lib/config-ui
9
+
10
+
11
+
12
+
13
+
14
+ ## [10.13.2](https://github.com/pie-framework/pie-lib/compare/@pie-lib/config-ui@10.13.1...@pie-lib/config-ui@10.13.2) (2022-05-30)
15
+
16
+
17
+ ### Bug Fixes
18
+
19
+ * unable to load items locally ([17ab686](https://github.com/pie-framework/pie-lib/commit/17ab6864557288aef6ec1d9a130cb508e2591562))
20
+
21
+
22
+
23
+
24
+
25
+ ## [10.13.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/config-ui@10.13.0...@pie-lib/config-ui@10.13.1) (2022-05-24)
26
+
27
+ **Note:** Version bump only for package @pie-lib/config-ui
28
+
29
+
30
+
31
+
32
+
6
33
  # [10.13.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/config-ui@10.12.3...@pie-lib/config-ui@10.13.0) (2022-05-16)
7
34
 
8
35
 
@@ -98,26 +98,68 @@ var NumberTextFieldCustom = /*#__PURE__*/function (_React$Component) {
98
98
 
99
99
  _this = _super.call(this, props);
100
100
 
101
+ _defineProperty(_assertThisInitialized(_this), "normalizeValueAndIndex", function (customValues, number) {
102
+ var value = _this.clamp(number);
103
+
104
+ var currentIndex = (customValues || []).findIndex(function (val) {
105
+ return val === value;
106
+ });
107
+
108
+ if ((customValues || []).length > 0 && currentIndex === -1) {
109
+ var closestValue = _this.getClosestValue(customValues, value);
110
+
111
+ return {
112
+ value: closestValue.value,
113
+ currentIndex: closestValue.index
114
+ };
115
+ }
116
+
117
+ return {
118
+ value: value,
119
+ currentIndex: currentIndex
120
+ };
121
+ });
122
+
123
+ _defineProperty(_assertThisInitialized(_this), "getClosestValue", function (customValues, number) {
124
+ return customValues.reduce(function (closest, value, index) {
125
+ return Math.abs(value - number) < Math.abs(closest.value - number) ? {
126
+ value: value,
127
+ index: index
128
+ } : closest;
129
+ }, {
130
+ value: customValues[0],
131
+ index: 0
132
+ });
133
+ });
134
+
101
135
  _defineProperty(_assertThisInitialized(_this), "onBlur", function (event) {
102
- var onlyIntegersAllowed = _this.props.onlyIntegersAllowed;
136
+ var _this$props = _this.props,
137
+ customValues = _this$props.customValues,
138
+ onlyIntegersAllowed = _this$props.onlyIntegersAllowed;
103
139
  var value = event.target.value;
104
140
  var rawNumber = onlyIntegersAllowed ? parseInt(value) : parseFloat(value);
105
141
 
106
- var number = _this.clamp(rawNumber);
142
+ var _this$normalizeValueA = _this.normalizeValueAndIndex(customValues, rawNumber),
143
+ number = _this$normalizeValueA.value,
144
+ currentIndex = _this$normalizeValueA.currentIndex;
107
145
 
108
146
  if (number !== _this.state.value) {
109
147
  _this.setState({
110
- value: number.toString()
148
+ value: number.toString(),
149
+ currentIndex: currentIndex
111
150
  }, function () {
112
151
  return _this.props.onChange(event, number);
113
152
  });
114
153
  }
115
154
  });
116
155
 
117
- var _value = _this.clamp(props.value);
156
+ var _this$normalizeValueA2 = _this.normalizeValueAndIndex(props.customValues, props.value),
157
+ _value = _this$normalizeValueA2.value,
158
+ _currentIndex = _this$normalizeValueA2.currentIndex;
118
159
 
119
160
  _this.state = {
120
- value: _value
161
+ value: _value,
162
+ currentIndex: _currentIndex
121
163
  };
122
164
 
123
165
  if (_value !== props.value) {
@@ -131,17 +173,26 @@ var NumberTextFieldCustom = /*#__PURE__*/function (_React$Component) {
131
173
  _createClass(NumberTextFieldCustom, [{
132
174
  key: "UNSAFE_componentWillReceiveProps",
133
175
  value: function UNSAFE_componentWillReceiveProps(props) {
134
- var value = this.clamp(props.value);
176
+ var _this$normalizeValueA3 = this.normalizeValueAndIndex(props.customValues, props.value),
177
+ value = _this$normalizeValueA3.value,
178
+ currentIndex = _this$normalizeValueA3.currentIndex;
179
+
135
180
  this.setState({
136
- value: value
181
+ value: value,
182
+ currentIndex: currentIndex
137
183
  });
138
184
  }
139
185
  }, {
140
186
  key: "clamp",
141
187
  value: function clamp(value) {
142
- var _this$props = this.props,
143
- min = _this$props.min,
144
- max = _this$props.max;
188
+ var _this$props2 = this.props,
189
+ min = _this$props2.min,
190
+ max = _this$props2.max,
191
+ customValues = _this$props2.customValues;
192
+
193
+ if ((customValues || []).length > 0) {
194
+ return value;
195
+ }
145
196
 
146
197
  if (!(0, _isFinite["default"])(value)) {
147
198
  return fallbackNumber(min, max);
@@ -171,16 +222,32 @@ var NumberTextFieldCustom = /*#__PURE__*/function (_React$Component) {
171
222
  var sign = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
172
223
  var shouldUpdate = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
173
224
  event.preventDefault();
174
- var _this$props2 = this.props,
175
- step = _this$props2.step,
176
- onlyIntegersAllowed = _this$props2.onlyIntegersAllowed,
177
- onChange = _this$props2.onChange;
178
- var value = this.state.value;
179
- var rawNumber = onlyIntegersAllowed ? parseInt(value) : parseFloat(value);
180
- var updatedValue = (rawNumber * 10000 + step * sign * 10000) / 10000;
181
- var number = this.clamp(updatedValue);
225
+ var _this$props3 = this.props,
226
+ customValues = _this$props3.customValues,
227
+ step = _this$props3.step,
228
+ onlyIntegersAllowed = _this$props3.onlyIntegersAllowed,
229
+ onChange = _this$props3.onChange;
230
+ var _this$state = this.state,
231
+ currentIndex = _this$state.currentIndex,
232
+ value = _this$state.value;
233
+ var updatedIndex = currentIndex + sign * 1;
234
+ var number;
235
+
236
+ if (customValues.length > 0) {
237
+ if (updatedIndex < 0 || updatedIndex >= customValues.length) {
238
+ return;
239
+ }
240
+
241
+ number = customValues[updatedIndex];
242
+ } else {
243
+ var rawNumber = onlyIntegersAllowed ? parseInt(value) : parseFloat(value);
244
+ var updatedValue = (rawNumber * 10000 + step * sign * 10000) / 10000;
245
+ number = this.clamp(updatedValue);
246
+ }
247
+
182
248
  this.setState({
183
- value: number.toString()
249
+ value: number.toString(),
250
+ currentIndex: updatedIndex
184
251
  }, function () {
185
252
  if (shouldUpdate) {
186
253
  onChange(event, number);
@@ -192,19 +259,19 @@ var NumberTextFieldCustom = /*#__PURE__*/function (_React$Component) {
192
259
  value: function render() {
193
260
  var _this2 = this;
194
261
 
195
- var _this$props3 = this.props,
196
- className = _this$props3.className,
197
- classes = _this$props3.classes,
198
- label = _this$props3.label,
199
- disabled = _this$props3.disabled,
200
- error = _this$props3.error,
201
- min = _this$props3.min,
202
- max = _this$props3.max,
203
- inputClassName = _this$props3.inputClassName,
204
- disableUnderline = _this$props3.disableUnderline,
205
- helperText = _this$props3.helperText,
206
- variant = _this$props3.variant,
207
- textAlign = _this$props3.textAlign;
262
+ var _this$props4 = this.props,
263
+ className = _this$props4.className,
264
+ classes = _this$props4.classes,
265
+ label = _this$props4.label,
266
+ disabled = _this$props4.disabled,
267
+ error = _this$props4.error,
268
+ min = _this$props4.min,
269
+ max = _this$props4.max,
270
+ inputClassName = _this$props4.inputClassName,
271
+ disableUnderline = _this$props4.disableUnderline,
272
+ helperText = _this$props4.helperText,
273
+ variant = _this$props4.variant,
274
+ textAlign = _this$props4.textAlign;
208
275
  var value = this.state.value;
209
276
  var names = (0, _classnames["default"])(className, classes.input);
210
277
  return /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
@@ -281,6 +348,7 @@ exports.NumberTextFieldCustom = NumberTextFieldCustom;
281
348
  _defineProperty(NumberTextFieldCustom, "propTypes", {
282
349
  classes: _propTypes["default"].object.isRequired,
283
350
  className: _propTypes["default"].string,
351
+ customValues: _propTypes["default"].array,
284
352
  disabled: _propTypes["default"].bool,
285
353
  error: _propTypes["default"].bool,
286
354
  inputClassName: _propTypes["default"].string,
@@ -297,6 +365,7 @@ _defineProperty(NumberTextFieldCustom, "propTypes", {
297
365
 
298
366
  _defineProperty(NumberTextFieldCustom, "defaultProps", {
299
367
  step: 1,
368
+ customValues: [],
300
369
  textAlign: 'center',
301
370
  variant: 'standard',
302
371
  onlyIntegersAllowed: false
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/number-text-field-custom.jsx"],"names":["styles","theme","input","margin","iconButton","padding","fallbackNumber","min","max","NumberTextFieldCustom","props","event","onlyIntegersAllowed","value","target","rawNumber","parseInt","parseFloat","number","clamp","state","setState","toString","onChange","bind","Math","sign","shouldUpdate","preventDefault","step","updatedValue","className","classes","label","disabled","error","inputClassName","disableUnderline","helperText","variant","textAlign","names","ref","inputRef","onBlur","e","key","blur","changeValue","startAdornment","endAdornment","style","React","Component","PropTypes","object","isRequired","string","bool","func"],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\nimport TextField from '@material-ui/core/TextField';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport isFinite from 'lodash/isFinite';\nimport IconButton from '@material-ui/core/IconButton';\nimport InputAdornment from '@material-ui/core/InputAdornment';\nimport Remove from '@material-ui/icons/Remove';\nimport Add from '@material-ui/icons/Add';\n\nconst styles = theme => ({\n input: {\n '& input[type=number]': {\n '-moz-appearance': 'textfield'\n },\n '& input[type=number]::-webkit-outer-spin-button': {\n '-webkit-appearance': 'none',\n margin: 0\n },\n '& input[type=number]::-webkit-inner-spin-button': {\n '-webkit-appearance': 'none',\n margin: 0\n }\n },\n iconButton: {\n padding: '2px'\n }\n});\n\nconst fallbackNumber = (min, max) => {\n if (!isFinite(min) && !isFinite(max)) {\n return 0;\n }\n\n if (!isFinite(min) && isFinite(max)) {\n return max;\n }\n\n if (isFinite(min)) {\n return min;\n }\n};\n\nexport class NumberTextFieldCustom extends React.Component {\n static propTypes = {\n classes: PropTypes.object.isRequired,\n className: PropTypes.string,\n disabled: PropTypes.bool,\n error: PropTypes.bool,\n inputClassName: PropTypes.string,\n onChange: PropTypes.func.isRequired,\n onlyIntegersAllowed: PropTypes.bool,\n value: PropTypes.number,\n min: PropTypes.number,\n max: PropTypes.number,\n step: PropTypes.number,\n label: PropTypes.string,\n disableUnderline: PropTypes.bool,\n variant: PropTypes.string\n };\n\n static defaultProps = {\n step: 1,\n textAlign: 'center',\n variant: 'standard',\n onlyIntegersAllowed: false\n };\n\n constructor(props) {\n super(props);\n\n const value = this.clamp(props.value);\n\n this.state = {\n value\n };\n\n if (value !== props.value) {\n this.props.onChange({}, value);\n }\n\n this.onChange = this.onChange.bind(this);\n }\n\n UNSAFE_componentWillReceiveProps(props) {\n const value = this.clamp(props.value);\n\n this.setState({ value });\n }\n\n clamp(value) {\n const { min, max } = this.props;\n\n if (!isFinite(value)) {\n return fallbackNumber(min, max);\n }\n\n if (isFinite(max)) {\n value = Math.min(value, max);\n }\n\n if (isFinite(min)) {\n value = Math.max(value, min);\n }\n\n return value;\n }\n\n onBlur = event => {\n const { onlyIntegersAllowed } = this.props;\n const { value } = event.target;\n const rawNumber = onlyIntegersAllowed ? parseInt(value) : parseFloat(value);\n const number = this.clamp(rawNumber);\n\n if (number !== this.state.value) {\n this.setState({ value: number.toString() }, () => this.props.onChange(event, number));\n }\n };\n\n onChange(event) {\n const { value } = event.target;\n\n this.setState({ value });\n }\n\n changeValue(event, sign = 1, shouldUpdate = false) {\n event.preventDefault();\n\n const { step, onlyIntegersAllowed, onChange } = this.props;\n const { value } = this.state;\n const rawNumber = onlyIntegersAllowed ? parseInt(value) : parseFloat(value);\n const updatedValue = (rawNumber * 10000 + step * sign * 10000) / 10000;\n const number = this.clamp(updatedValue);\n\n this.setState({ value: number.toString() }, () => {\n if (shouldUpdate) {\n onChange(event, number);\n }\n });\n }\n\n render() {\n const {\n className,\n classes,\n label,\n disabled,\n error,\n min,\n max,\n inputClassName,\n disableUnderline,\n helperText,\n variant,\n textAlign\n } = this.props;\n const { value } = this.state;\n const names = classNames(className, classes.input);\n\n return (\n <TextField\n variant={variant}\n inputRef={ref => (this.inputRef = ref)}\n disabled={disabled}\n label={label}\n value={value}\n error={error}\n helperText={helperText}\n onChange={this.onChange}\n onBlur={this.onBlur}\n onKeyPress={e => {\n // once the Enter key is pressed, we force input blur\n if (e.key === 'Enter' && this.inputRef) {\n this.inputRef.blur();\n }\n }}\n onKeyDown={e => {\n if (e.key === 'ArrowUp') {\n this.changeValue(e);\n }\n\n if (e.key === 'ArrowDown') {\n this.changeValue(e, -1);\n }\n }}\n type=\"number\"\n className={names}\n InputProps={{\n className: inputClassName,\n disableUnderline: disableUnderline,\n startAdornment: (\n <InputAdornment position=\"start\">\n <IconButton\n className={classes.iconButton}\n disabled={disabled}\n onClick={e => this.changeValue(e, -1, true)}\n >\n <Remove fontSize=\"small\" />\n </IconButton>\n </InputAdornment>\n ),\n endAdornment: (\n <InputAdornment position=\"end\">\n <IconButton\n className={classes.iconButton}\n disabled={disabled}\n onClick={e => this.changeValue(e, 1, true)}\n >\n <Add fontSize=\"small\" />\n </IconButton>\n </InputAdornment>\n )\n }}\n inputProps={{\n style: { textAlign },\n min,\n max\n }}\n />\n );\n }\n}\n\nexport default withStyles(styles)(NumberTextFieldCustom);\n"],"file":"number-text-field-custom.js"}
1
+ {"version":3,"sources":["../src/number-text-field-custom.jsx"],"names":["styles","theme","input","margin","iconButton","padding","fallbackNumber","min","max","NumberTextFieldCustom","props","customValues","number","value","clamp","currentIndex","findIndex","val","length","closestValue","getClosestValue","index","reduce","closest","Math","abs","event","onlyIntegersAllowed","target","rawNumber","parseInt","parseFloat","normalizeValueAndIndex","state","setState","toString","onChange","bind","sign","shouldUpdate","preventDefault","step","updatedIndex","updatedValue","className","classes","label","disabled","error","inputClassName","disableUnderline","helperText","variant","textAlign","names","ref","inputRef","onBlur","e","key","blur","changeValue","startAdornment","endAdornment","style","React","Component","PropTypes","object","isRequired","string","array","bool","func"],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\nimport TextField from '@material-ui/core/TextField';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport isFinite from 'lodash/isFinite';\nimport IconButton from '@material-ui/core/IconButton';\nimport InputAdornment from '@material-ui/core/InputAdornment';\nimport Remove from '@material-ui/icons/Remove';\nimport Add from '@material-ui/icons/Add';\n\nconst styles = theme => ({\n input: {\n '& input[type=number]': {\n '-moz-appearance': 'textfield'\n },\n '& input[type=number]::-webkit-outer-spin-button': {\n '-webkit-appearance': 'none',\n margin: 0\n },\n '& input[type=number]::-webkit-inner-spin-button': {\n '-webkit-appearance': 'none',\n margin: 0\n }\n },\n iconButton: {\n padding: '2px'\n }\n});\n\nconst fallbackNumber = (min, max) => {\n if (!isFinite(min) && !isFinite(max)) {\n return 0;\n }\n\n if (!isFinite(min) && isFinite(max)) {\n return max;\n }\n\n if (isFinite(min)) {\n return min;\n }\n};\n\nexport class NumberTextFieldCustom extends React.Component {\n static propTypes = {\n classes: PropTypes.object.isRequired,\n className: PropTypes.string,\n customValues: PropTypes.array,\n disabled: PropTypes.bool,\n error: PropTypes.bool,\n inputClassName: PropTypes.string,\n onChange: PropTypes.func.isRequired,\n onlyIntegersAllowed: PropTypes.bool,\n value: PropTypes.number,\n min: PropTypes.number,\n max: PropTypes.number,\n step: PropTypes.number,\n label: PropTypes.string,\n disableUnderline: PropTypes.bool,\n variant: PropTypes.string\n };\n\n static defaultProps = {\n step: 1,\n customValues: [],\n textAlign: 'center',\n variant: 'standard',\n onlyIntegersAllowed: false\n };\n\n constructor(props) {\n super(props);\n\n const { value, currentIndex } = this.normalizeValueAndIndex(props.customValues, props.value);\n\n this.state = {\n value,\n currentIndex\n };\n\n if (value !== props.value) {\n this.props.onChange({}, value);\n }\n\n this.onChange = this.onChange.bind(this);\n }\n\n UNSAFE_componentWillReceiveProps(props) {\n const { value, currentIndex } = this.normalizeValueAndIndex(props.customValues, props.value);\n\n this.setState({ value, currentIndex });\n }\n\n clamp(value) {\n const { min, max, customValues } = this.props;\n\n if ((customValues || []).length > 0) {\n return value;\n }\n\n if (!isFinite(value)) {\n return fallbackNumber(min, max);\n }\n\n if (isFinite(max)) {\n value = Math.min(value, max);\n }\n\n if (isFinite(min)) {\n value = Math.max(value, min);\n }\n\n return value;\n }\n\n normalizeValueAndIndex = (customValues, number) => {\n const value = this.clamp(number);\n const currentIndex = (customValues || []).findIndex(val => val === value);\n\n if ((customValues || []).length > 0 && currentIndex === -1) {\n const closestValue = this.getClosestValue(customValues, value);\n\n return { value: closestValue.value, currentIndex: closestValue.index };\n }\n\n return { value, currentIndex };\n };\n\n getClosestValue = (customValues, number) =>\n customValues.reduce(\n (closest, value, index) =>\n Math.abs(value - number) < Math.abs(closest.value - number) ? { value, index } : closest,\n { value: customValues[0], index: 0 }\n );\n\n onBlur = event => {\n const { customValues, onlyIntegersAllowed } = this.props;\n const { value } = event.target;\n const rawNumber = onlyIntegersAllowed ? parseInt(value) : parseFloat(value);\n\n const { value: number, currentIndex } = this.normalizeValueAndIndex(customValues, rawNumber);\n\n if (number !== this.state.value) {\n this.setState(\n {\n value: number.toString(),\n currentIndex\n },\n () => this.props.onChange(event, number)\n );\n }\n };\n\n onChange(event) {\n const { value } = event.target;\n\n this.setState({ value });\n }\n\n changeValue(event, sign = 1, shouldUpdate = false) {\n event.preventDefault();\n\n const { customValues, step, onlyIntegersAllowed, onChange } = this.props;\n const { currentIndex, value } = this.state;\n const updatedIndex = currentIndex + sign * 1;\n let number;\n\n if (customValues.length > 0) {\n if (updatedIndex < 0 || updatedIndex >= customValues.length) {\n return;\n }\n\n number = customValues[updatedIndex];\n } else {\n const rawNumber = onlyIntegersAllowed ? parseInt(value) : parseFloat(value);\n const updatedValue = (rawNumber * 10000 + step * sign * 10000) / 10000;\n number = this.clamp(updatedValue);\n }\n\n this.setState(\n {\n value: number.toString(),\n currentIndex: updatedIndex\n },\n () => {\n if (shouldUpdate) {\n onChange(event, number);\n }\n }\n );\n }\n\n render() {\n const {\n className,\n classes,\n label,\n disabled,\n error,\n min,\n max,\n inputClassName,\n disableUnderline,\n helperText,\n variant,\n textAlign\n } = this.props;\n const { value } = this.state;\n const names = classNames(className, classes.input);\n\n return (\n <TextField\n variant={variant}\n inputRef={ref => (this.inputRef = ref)}\n disabled={disabled}\n label={label}\n value={value}\n error={error}\n helperText={helperText}\n onChange={this.onChange}\n onBlur={this.onBlur}\n onKeyPress={e => {\n // once the Enter key is pressed, we force input blur\n if (e.key === 'Enter' && this.inputRef) {\n this.inputRef.blur();\n }\n }}\n onKeyDown={e => {\n if (e.key === 'ArrowUp') {\n this.changeValue(e);\n }\n\n if (e.key === 'ArrowDown') {\n this.changeValue(e, -1);\n }\n }}\n type=\"number\"\n className={names}\n InputProps={{\n className: inputClassName,\n disableUnderline: disableUnderline,\n startAdornment: (\n <InputAdornment position=\"start\">\n <IconButton\n className={classes.iconButton}\n disabled={disabled}\n onClick={e => this.changeValue(e, -1, true)}\n >\n <Remove fontSize=\"small\" />\n </IconButton>\n </InputAdornment>\n ),\n endAdornment: (\n <InputAdornment position=\"end\">\n <IconButton\n className={classes.iconButton}\n disabled={disabled}\n onClick={e => this.changeValue(e, 1, true)}\n >\n <Add fontSize=\"small\" />\n </IconButton>\n </InputAdornment>\n )\n }}\n inputProps={{\n style: { textAlign },\n min,\n max\n }}\n />\n );\n }\n}\n\nexport default withStyles(styles)(NumberTextFieldCustom);\n"],"file":"number-text-field-custom.js"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pie-lib/config-ui",
3
- "version": "10.13.0",
3
+ "version": "10.13.3",
4
4
  "main": "lib/index.js",
5
5
  "module": "src/index.js",
6
6
  "publishConfig": {
@@ -10,9 +10,9 @@
10
10
  "dependencies": {
11
11
  "@material-ui/core": "^3.8.3",
12
12
  "@material-ui/icons": "^3.0.2",
13
- "@pie-lib/editable-html": "^7.22.3",
13
+ "@pie-lib/editable-html": "^7.22.6",
14
14
  "@pie-lib/icons": "^2.4.25",
15
- "@pie-lib/render-ui": "^4.12.6",
15
+ "@pie-lib/render-ui": "^4.12.9",
16
16
  "classnames": "^2.2.6",
17
17
  "debug": "^4.1.1",
18
18
  "lodash": "^4.17.11",
@@ -26,5 +26,5 @@
26
26
  "peerDependencies": {
27
27
  "react": "^16.8.1"
28
28
  },
29
- "gitHead": "401c59be0bf26f2fc336637007721b8265efe0dd"
29
+ "gitHead": "531a7f4895323a9d524cfb96f7e26a5f1ab9f7c1"
30
30
  }
@@ -46,6 +46,7 @@ export class NumberTextFieldCustom extends React.Component {
46
46
  static propTypes = {
47
47
  classes: PropTypes.object.isRequired,
48
48
  className: PropTypes.string,
49
+ customValues: PropTypes.array,
49
50
  disabled: PropTypes.bool,
50
51
  error: PropTypes.bool,
51
52
  inputClassName: PropTypes.string,
@@ -62,6 +63,7 @@ export class NumberTextFieldCustom extends React.Component {
62
63
 
63
64
  static defaultProps = {
64
65
  step: 1,
66
+ customValues: [],
65
67
  textAlign: 'center',
66
68
  variant: 'standard',
67
69
  onlyIntegersAllowed: false
@@ -70,10 +72,11 @@ export class NumberTextFieldCustom extends React.Component {
70
72
  constructor(props) {
71
73
  super(props);
72
74
 
73
- const value = this.clamp(props.value);
75
+ const { value, currentIndex } = this.normalizeValueAndIndex(props.customValues, props.value);
74
76
 
75
77
  this.state = {
76
- value
78
+ value,
79
+ currentIndex
77
80
  };
78
81
 
79
82
  if (value !== props.value) {
@@ -84,13 +87,17 @@ export class NumberTextFieldCustom extends React.Component {
84
87
  }
85
88
 
86
89
  UNSAFE_componentWillReceiveProps(props) {
87
- const value = this.clamp(props.value);
90
+ const { value, currentIndex } = this.normalizeValueAndIndex(props.customValues, props.value);
88
91
 
89
- this.setState({ value });
92
+ this.setState({ value, currentIndex });
90
93
  }
91
94
 
92
95
  clamp(value) {
93
- const { min, max } = this.props;
96
+ const { min, max, customValues } = this.props;
97
+
98
+ if ((customValues || []).length > 0) {
99
+ return value;
100
+ }
94
101
 
95
102
  if (!isFinite(value)) {
96
103
  return fallbackNumber(min, max);
@@ -107,14 +114,41 @@ export class NumberTextFieldCustom extends React.Component {
107
114
  return value;
108
115
  }
109
116
 
117
+ normalizeValueAndIndex = (customValues, number) => {
118
+ const value = this.clamp(number);
119
+ const currentIndex = (customValues || []).findIndex(val => val === value);
120
+
121
+ if ((customValues || []).length > 0 && currentIndex === -1) {
122
+ const closestValue = this.getClosestValue(customValues, value);
123
+
124
+ return { value: closestValue.value, currentIndex: closestValue.index };
125
+ }
126
+
127
+ return { value, currentIndex };
128
+ };
129
+
130
+ getClosestValue = (customValues, number) =>
131
+ customValues.reduce(
132
+ (closest, value, index) =>
133
+ Math.abs(value - number) < Math.abs(closest.value - number) ? { value, index } : closest,
134
+ { value: customValues[0], index: 0 }
135
+ );
136
+
110
137
  onBlur = event => {
111
- const { onlyIntegersAllowed } = this.props;
138
+ const { customValues, onlyIntegersAllowed } = this.props;
112
139
  const { value } = event.target;
113
140
  const rawNumber = onlyIntegersAllowed ? parseInt(value) : parseFloat(value);
114
- const number = this.clamp(rawNumber);
141
+
142
+ const { value: number, currentIndex } = this.normalizeValueAndIndex(customValues, rawNumber);
115
143
 
116
144
  if (number !== this.state.value) {
117
- this.setState({ value: number.toString() }, () => this.props.onChange(event, number));
145
+ this.setState(
146
+ {
147
+ value: number.toString(),
148
+ currentIndex
149
+ },
150
+ () => this.props.onChange(event, number)
151
+ );
118
152
  }
119
153
  };
120
154
 
@@ -127,17 +161,34 @@ export class NumberTextFieldCustom extends React.Component {
127
161
  changeValue(event, sign = 1, shouldUpdate = false) {
128
162
  event.preventDefault();
129
163
 
130
- const { step, onlyIntegersAllowed, onChange } = this.props;
131
- const { value } = this.state;
132
- const rawNumber = onlyIntegersAllowed ? parseInt(value) : parseFloat(value);
133
- const updatedValue = (rawNumber * 10000 + step * sign * 10000) / 10000;
134
- const number = this.clamp(updatedValue);
164
+ const { customValues, step, onlyIntegersAllowed, onChange } = this.props;
165
+ const { currentIndex, value } = this.state;
166
+ const updatedIndex = currentIndex + sign * 1;
167
+ let number;
135
168
 
136
- this.setState({ value: number.toString() }, () => {
137
- if (shouldUpdate) {
138
- onChange(event, number);
169
+ if (customValues.length > 0) {
170
+ if (updatedIndex < 0 || updatedIndex >= customValues.length) {
171
+ return;
139
172
  }
140
- });
173
+
174
+ number = customValues[updatedIndex];
175
+ } else {
176
+ const rawNumber = onlyIntegersAllowed ? parseInt(value) : parseFloat(value);
177
+ const updatedValue = (rawNumber * 10000 + step * sign * 10000) / 10000;
178
+ number = this.clamp(updatedValue);
179
+ }
180
+
181
+ this.setState(
182
+ {
183
+ value: number.toString(),
184
+ currentIndex: updatedIndex
185
+ },
186
+ () => {
187
+ if (shouldUpdate) {
188
+ onChange(event, number);
189
+ }
190
+ }
191
+ );
141
192
  }
142
193
 
143
194
  render() {