intelicoreact 0.0.75 → 0.0.79

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.
@@ -36,7 +36,8 @@ var RC = 'dropdown';
36
36
  var Dropdown = function Dropdown(_ref) {
37
37
  var _options$find, _filteredOptions$find;
38
38
 
39
- var options = _ref.options,
39
+ var _ref$options = _ref.options,
40
+ options = _ref$options === void 0 ? [] : _ref$options,
40
41
  value = _ref.value,
41
42
  error = _ref.error,
42
43
  onChange = _ref.onChange,
@@ -19,10 +19,12 @@ var _react = _interopRequireWildcard(require("react"));
19
19
 
20
20
  var _classnames = _interopRequireDefault(require("classnames"));
21
21
 
22
- var _reactFeather = require("react-feather");
23
-
24
22
  var _reactInputMask = _interopRequireDefault(require("react-input-mask"));
25
23
 
24
+ var _index = require("../../../Constants/index.constants");
25
+
26
+ var _inputExecutor = require("../../../Functions/inputExecutor");
27
+
26
28
  require("./Input.scss");
27
29
 
28
30
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -35,30 +37,30 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
35
37
 
36
38
  var Input = function Input(_ref) {
37
39
  var onChange = _ref.onChange,
40
+ onBlur = _ref.onBlur,
41
+ onFocus = _ref.onFocus,
42
+ onKeyUp = _ref.onKeyUp,
43
+ isNotBlinkErrors = _ref.isNotBlinkErrors,
44
+ isPriceInput = _ref.isPriceInput,
45
+ isOnlyNumber = _ref.isOnlyNumber,
46
+ isOnlyString = _ref.isOnlyString,
47
+ isTwoDigitAfterDot = _ref.isTwoDigitAfterDot,
38
48
  disabled = _ref.disabled,
39
49
  withDelete = _ref.withDelete,
40
- isNumeric = _ref.isNumeric,
41
- _ref$numStep = _ref.numStep,
42
- numStep = _ref$numStep === void 0 ? 1 : _ref$numStep,
43
- _ref$min = _ref.min,
44
- min = _ref$min === void 0 ? 0 : _ref$min,
45
- max = _ref.max,
46
50
  value = _ref.value,
47
51
  placeholder = _ref.placeholder,
48
52
  className = _ref.className,
49
53
  _ref$type = _ref.type,
50
54
  type = _ref$type === void 0 ? 'text' : _ref$type,
51
- onBlur = _ref.onBlur,
52
- onFocus = _ref.onFocus,
53
- onKeyUp = _ref.onKeyUp,
54
55
  mask = _ref.mask,
55
56
  maskChar = _ref.maskChar,
56
57
  formatChars = _ref.formatChars,
57
58
  error = _ref.error,
58
59
  icon = _ref.icon,
59
- symbolsLimit = _ref.symbolsLimit;
60
+ symbolsLimit = _ref.symbolsLimit,
61
+ blinkTime = _ref.blinkTime;
62
+ var DEFAULT_BLINK_TIME = 100; // STATES
60
63
 
61
- // STATES
62
64
  var _useState = (0, _react.useState)(false),
63
65
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
64
66
  isFocused = _useState2[0],
@@ -69,20 +71,36 @@ var Input = function Input(_ref) {
69
71
  isEditing = _useState4[0],
70
72
  setEditing = _useState4[1];
71
73
 
72
- var inputRef = (0, _react.useRef)(null); // HANDLES
74
+ var inputRef = (0, _react.useRef)(null);
75
+ var previousValueRef = (0, _react.useRef)(value);
76
+
77
+ var _useState5 = (0, _react.useState)(false),
78
+ _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
79
+ isAttemptToChange = _useState6[0],
80
+ setIsAttemptToChange = _useState6[1];
81
+
82
+ var _useState7 = (0, _react.useState)(false),
83
+ _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
84
+ isToHighlightError = _useState8[0],
85
+ setIsToHighlightError = _useState8[1];
86
+
87
+ var onlyNumbers = _inputExecutor.formatInput.onlyNumbers,
88
+ onlyString = _inputExecutor.formatInput.onlyString;
89
+ var _formatInput$priceInp = _inputExecutor.formatInput.priceInput,
90
+ addCommas = _formatInput$priceInp.addCommas,
91
+ removeComma = _formatInput$priceInp.removeComma; // HANDLES
73
92
 
74
93
  var handle = {
75
94
  change: function change(e) {
76
95
  var inputValue = e.target ? e.target.value : e;
77
96
 
78
- if (isNumeric || type === 'number' && inputValue !== '') {
79
- inputValue = parseFloat(inputValue) || '';
80
-
81
- if (min && +min > inputValue) {
82
- inputValue = min;
83
- } else if (max && +max < inputValue) inputValue = max;
84
- } else if (symbolsLimit && inputValue.length > +symbolsLimit) inputValue = inputValue.substring(0, +symbolsLimit);
97
+ if (symbolsLimit && inputValue.length > +symbolsLimit) {
98
+ inputValue = inputValue.substring(0, +symbolsLimit);
99
+ }
85
100
 
101
+ if (isOnlyNumber && !isTwoDigitAfterDot) inputValue = onlyNumbers(inputValue);
102
+ if (isTwoDigitAfterDot) inputValue = onlyNumbers(inputValue, true);
103
+ if (isOnlyString) inputValue = onlyString(inputValue);
86
104
  onChange(inputValue.toString());
87
105
  },
88
106
  toggleEdit: function toggleEdit() {
@@ -91,17 +109,47 @@ var Input = function Input(_ref) {
91
109
  },
92
110
  focus: function focus(e) {
93
111
  setIsFocused(true);
112
+ if (isPriceInput && isOnlyNumber && !isTwoDigitAfterDot) onChange(removeComma(value));
94
113
  if (onFocus) onFocus(e);
95
114
  },
96
115
  blur: function blur(e) {
97
116
  setIsFocused(false);
98
117
  setEditing(false);
118
+
119
+ if (isPriceInput && isOnlyNumber && !isTwoDigitAfterDot) {
120
+ onChange(addCommas(value));
121
+ }
122
+
123
+ if (isTwoDigitAfterDot && !isPriceInput) {
124
+ onChange(cutOffsingleDot(value));
125
+ }
126
+
99
127
  if (onBlur) onBlur(e);
100
128
  },
101
129
  keyUp: function keyUp(e) {
102
- return onKeyUp ? onKeyUp(e.keyCode, event) : null;
130
+ if (!isNotBlinkErrors) {
131
+ var _previousValueRef$cur;
132
+
133
+ var changedValue = '' + (value !== null && value !== void 0 ? value : '');
134
+ var previousValue = '' + ((_previousValueRef$cur = previousValueRef.current) !== null && _previousValueRef$cur !== void 0 ? _previousValueRef$cur : '');
135
+
136
+ var currentSet = function () {
137
+ if (previousValue.length < changedValue.length) return value.slice(previousValue.length - changedValue.length);else return changedValue.includes(e.key) ? e.key : '';
138
+ }();
139
+
140
+ if (!_index.KEYBOARD_SERVICE_KEYS.includes(e.key) && changedValue === previousValue) setIsAttemptToChange(true);
141
+ console.log(changedValue, previousValue);
142
+ if (_index.KEYBOARD_SERVICE_KEYS.includes(e.key) || !currentSet) previousValueRef.current = value;else previousValueRef.current = previousValue + currentSet[0];
143
+ }
144
+
145
+ if (onKeyUp) onKeyUp(e.keyCode, e);
103
146
  }
104
147
  };
148
+
149
+ function cutOffsingleDot(value) {
150
+ return value.slice(-1) === '.' ? value.slice(0, -1) : value;
151
+ }
152
+
105
153
  (0, _react.useEffect)(function () {
106
154
  if (isEditing) inputRef.current.focus();
107
155
  }, [isEditing, isFocused]);
@@ -114,9 +162,7 @@ var Input = function Input(_ref) {
114
162
  onChange: handle.change,
115
163
  onFocus: handle.focus,
116
164
  onBlur: handle.blur,
117
- onKeyUp: handle.keyUp,
118
- min: min,
119
- max: max
165
+ onKeyUp: handle.keyUp
120
166
  }, maskChar ? {
121
167
  maskChar: maskChar
122
168
  } : {}), formatChars ? {
@@ -131,31 +177,24 @@ var Input = function Input(_ref) {
131
177
  }));
132
178
  }
133
179
 
134
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({}, uniProps, {
180
+ return /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({}, uniProps, {
135
181
  ref: inputRef,
136
- type: isNumeric ? 'number' : type
137
- })), isNumeric && /*#__PURE__*/_react.default.createElement("div", {
138
- className: "input__nums"
139
- }, /*#__PURE__*/_react.default.createElement("button", {
140
- onClick: function onClick() {
141
- return handle.change(value - numStep);
142
- },
143
- className: (0, _classnames.default)("input__num-btn", {
144
- disabled: value <= min
145
- })
146
- }, /*#__PURE__*/_react.default.createElement(_reactFeather.Minus, null)), /*#__PURE__*/_react.default.createElement("button", {
147
- onClick: function onClick() {
148
- return handle.change(+value + +numStep);
149
- },
150
- className: (0, _classnames.default)("input__num-btn", {
151
- disabled: value >= max
152
- })
153
- }, /*#__PURE__*/_react.default.createElement(_reactFeather.Plus, null))));
182
+ type: isPriceInput ? 'text' : type
183
+ }));
154
184
  }
155
185
 
186
+ (0, _react.useEffect)(function () {
187
+ if (!isNotBlinkErrors && isAttemptToChange) {
188
+ setIsAttemptToChange(null);
189
+ setIsToHighlightError(true);
190
+ setTimeout(function () {
191
+ setIsToHighlightError(false);
192
+ }, blinkTime || DEFAULT_BLINK_TIME);
193
+ }
194
+ }, [isAttemptToChange]);
156
195
  return /*#__PURE__*/_react.default.createElement("div", {
157
- className: (0, _classnames.default)("input__wrap", (0, _defineProperty2.default)({}, "input__wrap_focus", isFocused), (0, _defineProperty2.default)({}, "input__wrap_error", error), (0, _defineProperty2.default)({}, "input__wrap_disabled", disabled))
158
- }, renderInput(), icon, withDelete && !isNumeric && /*#__PURE__*/_react.default.createElement("span", {
196
+ className: (0, _classnames.default)("input__wrap", (0, _defineProperty2.default)({}, "input__wrap_focus", isFocused), (0, _defineProperty2.default)({}, "input__wrap_error", error || isToHighlightError), (0, _defineProperty2.default)({}, "input__wrap_disabled", disabled))
197
+ }, renderInput(), icon, withDelete && /*#__PURE__*/_react.default.createElement("span", {
159
198
  className: (0, _classnames.default)("input__close", {
160
199
  hidden: !value
161
200
  }),
@@ -34,20 +34,20 @@ var _default = {
34
34
  error: {
35
35
  description: 'text - coloring input if is errored'
36
36
  },
37
+ isPriceInput: {
38
+ description: 'boolean - if true, the input will be styled as PriceInput'
39
+ },
37
40
  withDelete: {
38
41
  description: 'boolean - add clear-cross by hover'
39
42
  },
40
- isNumeric: {
41
- description: 'boolean - add plus/minus buttons, force input to numeric type'
42
- },
43
- numStep: {
44
- description: 'number/text - plus/minus buttons factor (default: 1)'
43
+ isOnlyNumber: {
44
+ description: 'boolean - only numbers'
45
45
  },
46
- min: {
47
- description: 'number/text - minimal number for numeric input'
46
+ isOnlyString: {
47
+ description: 'boolean - only strings'
48
48
  },
49
- max: {
50
- description: 'number/text - maximal number for numeric input'
49
+ isTwoDigitAfterDot: {
50
+ description: 'boolean - only two digits after dot'
51
51
  },
52
52
  placeholder: {
53
53
  description: 'text'
@@ -103,21 +103,15 @@ var InputTemplate = Template.bind({});
103
103
  exports.InputTemplate = InputTemplate;
104
104
  InputTemplate.args = {
105
105
  type: 'text',
106
+ isOnlyNumber: false,
107
+ isOnlyString: false,
108
+ isPriceInput: false,
109
+ isTwoDigitAfterDot: false,
106
110
  disabled: false,
107
111
  error: '',
112
+ mask: '',
108
113
  withDelete: true,
109
- isNumeric: false,
110
- numStep: 1,
111
- min: '0',
112
- max: '5',
114
+ symbolsLimit: 255,
113
115
  placeholder: 'Placeholder',
114
- // mask: 'nnnnn0129',
115
- // maskChar: '_',
116
- // formatChars: {
117
- // 'n': '[0-9]',
118
- // 's': '[A-Za-z]',
119
- // '*': '[A-Za-z0-9]'
120
- // },
121
- icon: /*#__PURE__*/_react.default.createElement(_reactFeather.User, null),
122
- symbolsLimit: 225
116
+ icon: /*#__PURE__*/_react.default.createElement(_reactFeather.User, null)
123
117
  };
@@ -1,3 +1,5 @@
1
+ @import "~anme/scss/anme-mixins-media";
2
+
1
3
  :root {
2
4
  --input-height: 28px;
3
5
  --label-line-height: 16px;
@@ -205,7 +207,7 @@
205
207
  border: 1px solid var(--border-color);
206
208
  border-radius: var(--border-radius);
207
209
  background: #FFFFFF;
208
-
210
+ box-shadow: 0 4px 25px rgba(0, 0, 0, 0.25);
209
211
  &_right-position-once-element {
210
212
  justify-content: flex-end;
211
213
  }
@@ -222,15 +224,15 @@
222
224
  position: relative;
223
225
 
224
226
  width: 100%;
225
- padding: 4px 8px 4px 32px;
227
+ padding: 0 20px 0 30px;
226
228
 
227
229
  text-transform: capitalize;
228
230
  white-space: nowrap;
229
231
  font-style: normal;
230
232
  font-weight: 300;
231
233
  font-family: var(--font-family);
232
- font-size: var(--font-size);
233
- line-height: var(--line-height);
234
+ font-size: 12px;
235
+ line-height: 24px;
234
236
  cursor: pointer;
235
237
 
236
238
  display: flex;
@@ -242,6 +244,9 @@
242
244
  // background-color: rgba(128, 128, 128, 0.1);
243
245
  background-color: #F2F2F8;
244
246
  }
247
+ &_active {
248
+ background: #f2f2f8;
249
+ }
245
250
 
246
251
  &-icon-active {
247
252
  position: absolute;
@@ -293,7 +298,7 @@
293
298
 
294
299
  &>div:not(.date-picker__inputs-separator) {
295
300
  width: 110px;
296
- height: 100%;
301
+ min-height: 100%;
297
302
  margin-right: 9px;
298
303
 
299
304
  border: 1px solid var(--border-color);
@@ -323,6 +328,9 @@
323
328
  .date-picker__inputs-separator {
324
329
  margin-right: 9px;
325
330
  }
331
+ input {
332
+ font-weight: 300;
333
+ }
326
334
  }
327
335
 
328
336
  &__date-input {
@@ -348,7 +356,7 @@
348
356
 
349
357
  &>.dropdown__trigger {
350
358
  width: 100%;
351
- height: 100%;
359
+ height: 28px;
352
360
  padding-left: 10px;
353
361
  padding-right: 15px;
354
362
 
@@ -592,3 +600,27 @@
592
600
  height: 100%;
593
601
  }
594
602
  }
603
+
604
+ @include lgDown {
605
+ .opened-part__intervals-list {
606
+ display: none;
607
+ }
608
+ }
609
+
610
+ @include mdDown {
611
+ .date-picker__inputs-block {
612
+ flex-flow: wrap;
613
+ }
614
+
615
+ .date-picker__header {
616
+ flex-flow: row wrap
617
+ }
618
+ .date-picker__calendars-wrapper {
619
+ display: block;
620
+ margin: auto;
621
+ }
622
+ .date-picker__calendars .range-calendar {
623
+ margin: 0!important;
624
+ width: 100%;
625
+ }
626
+ }
@@ -0,0 +1,254 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ var _typeof = require("@babel/runtime/helpers/typeof");
6
+
7
+ Object.defineProperty(exports, "__esModule", {
8
+ value: true
9
+ });
10
+ exports.default = void 0;
11
+
12
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
13
+
14
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
15
+
16
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
17
+
18
+ var _react = _interopRequireWildcard(require("react"));
19
+
20
+ var _classnames = _interopRequireDefault(require("classnames"));
21
+
22
+ var _reactFeather = require("react-feather");
23
+
24
+ var _reactInputMask = _interopRequireDefault(require("react-input-mask"));
25
+
26
+ var _index = require("../../../Constants/index.constants");
27
+
28
+ var _inputExecutor = require("../../../Functions/inputExecutor");
29
+
30
+ require("./NumericInput.scss");
31
+
32
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
33
+
34
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
35
+
36
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
37
+
38
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
39
+
40
+ var NumericInput = function NumericInput(_ref) {
41
+ var onChange = _ref.onChange,
42
+ disabled = _ref.disabled,
43
+ withDelete = _ref.withDelete,
44
+ _ref$numStep = _ref.numStep,
45
+ numStep = _ref$numStep === void 0 ? 1 : _ref$numStep,
46
+ _ref$min = _ref.min,
47
+ min = _ref$min === void 0 ? 0 : _ref$min,
48
+ max = _ref.max,
49
+ value = _ref.value,
50
+ placeholder = _ref.placeholder,
51
+ className = _ref.className,
52
+ _ref$type = _ref.type,
53
+ type = _ref$type === void 0 ? 'number' : _ref$type,
54
+ onBlur = _ref.onBlur,
55
+ onFocus = _ref.onFocus,
56
+ onKeyUp = _ref.onKeyUp,
57
+ mask = _ref.mask,
58
+ maskChar = _ref.maskChar,
59
+ formatChars = _ref.formatChars,
60
+ error = _ref.error,
61
+ icon = _ref.icon,
62
+ symbolsLimit = _ref.symbolsLimit,
63
+ isNotBlinkErrors = _ref.isNotBlinkErrors,
64
+ blinkTime = _ref.blinkTime,
65
+ isPriceInput = _ref.isPriceInput;
66
+ var DEFAULT_BLINK_TIME = 200; // STATES
67
+
68
+ var _useState = (0, _react.useState)(false),
69
+ _useState2 = (0, _slicedToArray2.default)(_useState, 2),
70
+ isFocused = _useState2[0],
71
+ setIsFocused = _useState2[1];
72
+
73
+ var _useState3 = (0, _react.useState)(false),
74
+ _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
75
+ isEditing = _useState4[0],
76
+ setEditing = _useState4[1];
77
+
78
+ var inputRef = (0, _react.useRef)(null);
79
+ var decRef = (0, _react.useRef)(null);
80
+ var incRef = (0, _react.useRef)(null);
81
+ var previousValueRef = (0, _react.useRef)(value);
82
+
83
+ var _useState5 = (0, _react.useState)(false),
84
+ _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
85
+ isAttemptToChange = _useState6[0],
86
+ setIsAttemptToChange = _useState6[1];
87
+
88
+ var _useState7 = (0, _react.useState)(false),
89
+ _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
90
+ isToHighlightError = _useState8[0],
91
+ setIsToHighlightError = _useState8[1];
92
+
93
+ var _useState9 = (0, _react.useState)(0),
94
+ _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
95
+ intMemoVal = _useState10[0],
96
+ setIntMemoVal = _useState10[1];
97
+
98
+ var onlyNumbers = _inputExecutor.formatInput.onlyNumbers;
99
+ var _formatInput$priceInp = _inputExecutor.formatInput.priceInput,
100
+ addCommas = _formatInput$priceInp.addCommas,
101
+ removeComma = _formatInput$priceInp.removeComma; // HANDLES
102
+
103
+ var handle = {
104
+ change: function change(e) {
105
+ var inputValue = e.target ? onlyNumbers(e.target.value) : e;
106
+
107
+ if (inputValue !== '') {
108
+ inputValue = parseFloat(inputValue) || '';
109
+
110
+ if (min && +min > inputValue) {
111
+ inputValue = min;
112
+ } else if (max && +max < inputValue) inputValue = max;
113
+ }
114
+
115
+ if (symbolsLimit) {
116
+ inputValue = inputValue.toString().substring(0, +symbolsLimit);
117
+ }
118
+
119
+ setIntMemoVal(parseFloat(inputValue));
120
+ onChange(inputValue.toString());
121
+ },
122
+ toggleEdit: function toggleEdit() {
123
+ setEditing(!isEditing);
124
+ onChange('');
125
+ },
126
+ focus: function focus(e) {
127
+ setIsFocused(true);
128
+ if (isPriceInput) onChange(removeComma(value));
129
+ if (onFocus) onFocus(e);
130
+ },
131
+ blur: function blur(e) {
132
+ setIsFocused(false);
133
+ setEditing(false);
134
+
135
+ if (isPriceInput) {
136
+ if (!isFinite(value)) {
137
+ value = intMemoVal;
138
+ }
139
+
140
+ onChange(addCommas(value));
141
+ }
142
+
143
+ if (onBlur) onBlur(e);
144
+ },
145
+ keyUp: function keyUp(e) {
146
+ if (!isNotBlinkErrors) {
147
+ var _value, _previousValueRef$cur;
148
+
149
+ var changedValue = '' + ((_value = value) !== null && _value !== void 0 ? _value : '');
150
+ var previousValue = '' + ((_previousValueRef$cur = previousValueRef.current) !== null && _previousValueRef$cur !== void 0 ? _previousValueRef$cur : '');
151
+
152
+ var currentSet = function () {
153
+ if (previousValue.length < changedValue.length) return value.toString().slice(previousValue.length - changedValue.length);else return changedValue.toString().includes(e.key) ? e.key : '';
154
+ }();
155
+
156
+ if (!_index.KEYBOARD_SERVICE_KEYS.includes(e.key) && changedValue === previousValue) setIsAttemptToChange(true);
157
+ if (_index.KEYBOARD_SERVICE_KEYS.includes(e.key) || !currentSet) previousValueRef.current = value;else previousValueRef.current = previousValue + currentSet[0];
158
+ }
159
+
160
+ if (onKeyUp) onKeyUp(e.keyCode, e.target.value);
161
+ },
162
+ decrement: function decrement() {
163
+ handle.change(intMemoVal - +numStep);
164
+ },
165
+ increment: function increment() {
166
+ handle.change(intMemoVal + +numStep);
167
+ }
168
+ };
169
+
170
+ var handleClickOutside = function handleClickOutside(event) {
171
+ if (inputRef.current && !inputRef.current.contains(event.target) && !decRef.current.contains(event.target) && !incRef.current.contains(event.target)) {
172
+ setTimeout(function () {
173
+ inputRef.current.focus();
174
+ inputRef.current.blur();
175
+ }, 0);
176
+ }
177
+ };
178
+
179
+ (0, _react.useEffect)(function () {
180
+ if (!isNotBlinkErrors && isAttemptToChange) {
181
+ setIsAttemptToChange(false);
182
+ setIsToHighlightError(true);
183
+ setTimeout(function () {
184
+ setIsToHighlightError(false);
185
+ }, blinkTime || DEFAULT_BLINK_TIME);
186
+ }
187
+ }, [isAttemptToChange]);
188
+ (0, _react.useEffect)(function () {
189
+ document.addEventListener('click', handleClickOutside, true);
190
+ return function () {
191
+ return document.removeEventListener('click', handleClickOutside, true);
192
+ };
193
+ }, []);
194
+ (0, _react.useEffect)(function () {
195
+ if (isNaN(intMemoVal)) setIntMemoVal(min || '');
196
+ }, [intMemoVal]);
197
+ (0, _react.useEffect)(function () {
198
+ if (isEditing || isFocused) inputRef.current.focus();
199
+ }, [isEditing, isFocused]);
200
+
201
+ var uniProps = _objectSpread(_objectSpread({
202
+ className: "input ".concat(className),
203
+ placeholder: placeholder,
204
+ value: value || '',
205
+ disabled: disabled,
206
+ onChange: handle.change,
207
+ onFocus: handle.focus,
208
+ onBlur: handle.blur,
209
+ onKeyUp: handle.keyUp,
210
+ min: min,
211
+ max: max
212
+ }, maskChar ? {
213
+ maskChar: maskChar
214
+ } : {}), formatChars ? {
215
+ formatChars: formatChars
216
+ } : {});
217
+
218
+ function renderInput() {
219
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({}, uniProps, {
220
+ ref: inputRef,
221
+ type: type
222
+ })), /*#__PURE__*/_react.default.createElement("div", {
223
+ className: "input__nums"
224
+ }, /*#__PURE__*/_react.default.createElement("button", {
225
+ ref: decRef,
226
+ onClick: function onClick() {
227
+ return handle.decrement();
228
+ },
229
+ className: (0, _classnames.default)("input__num-btn", {
230
+ disabled: +value <= min
231
+ })
232
+ }, /*#__PURE__*/_react.default.createElement(_reactFeather.Minus, null)), /*#__PURE__*/_react.default.createElement("button", {
233
+ ref: incRef,
234
+ onClick: function onClick() {
235
+ return handle.increment();
236
+ },
237
+ className: (0, _classnames.default)("input__num-btn", {
238
+ disabled: +value >= max
239
+ })
240
+ }, /*#__PURE__*/_react.default.createElement(_reactFeather.Plus, null))));
241
+ }
242
+
243
+ return /*#__PURE__*/_react.default.createElement("div", {
244
+ className: (0, _classnames.default)("input__wrap", (0, _defineProperty2.default)({}, "input__wrap_focus", isFocused), (0, _defineProperty2.default)({}, "input__wrap_error", error || isToHighlightError), (0, _defineProperty2.default)({}, "input__wrap_disabled", disabled))
245
+ }, renderInput(), icon, withDelete && /*#__PURE__*/_react.default.createElement("span", {
246
+ className: (0, _classnames.default)("input__close", {
247
+ hidden: !value
248
+ }),
249
+ onClick: handle.toggleEdit
250
+ }));
251
+ };
252
+
253
+ var _default = NumericInput;
254
+ exports.default = _default;