@synerise/ds-input-number 0.8.16 → 0.8.18

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,28 @@
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
+ ## [0.8.18](https://github.com/Synerise/synerise-design/compare/@synerise/ds-input-number@0.8.17...@synerise/ds-input-number@0.8.18) (2023-08-03)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **input-number:** extend formatNumber for value type null ([812cc1c](https://github.com/Synerise/synerise-design/commit/812cc1c22e72a22e9617c34a69071dc416d7af31))
12
+
13
+
14
+
15
+
16
+
17
+ ## [0.8.17](https://github.com/Synerise/synerise-design/compare/@synerise/ds-input-number@0.8.16...@synerise/ds-input-number@0.8.17) (2023-07-27)
18
+
19
+
20
+ ### Bug Fixes
21
+
22
+ * **input-number:** pass formatted and parsed (validated) val to onchange ([6caa1bf](https://github.com/Synerise/synerise-design/commit/6caa1bf5d7e4ab3fd52861d8252e4c33ae950232))
23
+
24
+
25
+
26
+
27
+
6
28
  ## [0.8.16](https://github.com/Synerise/synerise-design/compare/@synerise/ds-input-number@0.8.15...@synerise/ds-input-number@0.8.16) (2023-07-26)
7
29
 
8
30
 
package/README.md CHANGED
@@ -25,7 +25,7 @@ Input-Number UI Component
25
25
  | label | Input label | string | - |
26
26
  | max | Max value | number | Infinity |
27
27
  | min | Min value | number | -Infinity |
28
- | onChange | The callback triggered when the value is changed. | (value: number / string) => void |
28
+ | onChange | The callback triggered when the value is changed. The return value is either a number or empty string '' if NaN | (value: number / string) => void |
29
29
  | onPressEnter | The callback function that is triggered when Enter key is pressed. | (e:Event) => void |
30
30
  | parser | Specifies the value extracted from formatter | (val: number / string) => string | - |
31
31
  | precision | Precision of input value | number | - |
@@ -1,4 +1,4 @@
1
- var _excluded = ["label", "description", "errorText", "raw", "error", "prefixel", "suffixel", "style", "tooltip", "tooltipConfig", "valueFormatOptions"];
1
+ var _excluded = ["label", "description", "errorText", "raw", "error", "prefixel", "suffixel", "style", "tooltip", "tooltipConfig", "valueFormatOptions", "onChange"];
2
2
 
3
3
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
4
4
 
@@ -26,6 +26,7 @@ var InputNumber = function InputNumber(_ref) {
26
26
  tooltip = _ref.tooltip,
27
27
  tooltipConfig = _ref.tooltipConfig,
28
28
  valueFormatOptions = _ref.valueFormatOptions,
29
+ onChange = _ref.onChange,
29
30
  antdProps = _objectWithoutPropertiesLoose(_ref, _excluded);
30
31
 
31
32
  var _useDataFormat = useDataFormat(),
@@ -33,7 +34,6 @@ var InputNumber = function InputNumber(_ref) {
33
34
  thousandDelimiter = _useDataFormat.thousandDelimiter,
34
35
  decimalDelimiter = _useDataFormat.decimalDelimiter;
35
36
 
36
- formatValue(new Date(), {});
37
37
  var id = React.useMemo(function () {
38
38
  return uuid();
39
39
  }, []);
@@ -44,6 +44,13 @@ var InputNumber = function InputNumber(_ref) {
44
44
  var parser = React.useCallback(function (value) {
45
45
  return parseFormattedNumber(value, formatValue, thousandDelimiter, decimalDelimiter);
46
46
  }, [formatValue, thousandDelimiter, decimalDelimiter]);
47
+ var handleOnChange = React.useCallback(function (value) {
48
+ var formattedValue = formatter(value);
49
+ var parsedFormattedValue = parser(formattedValue);
50
+ var valueAsNumber = typeof parsedFormattedValue === 'string' ? parseFloat(parsedFormattedValue) : parsedFormattedValue;
51
+ var resultValue = Number.isNaN(valueAsNumber) ? '' : valueAsNumber;
52
+ onChange && onChange(resultValue);
53
+ }, [onChange, formatter, parser]);
47
54
  return /*#__PURE__*/React.createElement(S.InputNumberContainer, null, label && !raw && /*#__PURE__*/React.createElement(S.ContentAbove, null, /*#__PURE__*/React.createElement(S.Label, {
48
55
  htmlFor: id
49
56
  }, label, (tooltip || tooltipConfig) && /*#__PURE__*/React.createElement(Tooltip, _extends({
@@ -59,6 +66,7 @@ var InputNumber = function InputNumber(_ref) {
59
66
  suffixel: !!suffixel,
60
67
  style: style
61
68
  }, !!prefixel && /*#__PURE__*/React.createElement(S.Prefixel, null, prefixel), /*#__PURE__*/React.createElement(S.AntdInputNumber, _extends({}, antdProps, {
69
+ onChange: handleOnChange,
62
70
  id: id,
63
71
  error: showError,
64
72
  className: showError ? 'error' : undefined,
@@ -1,4 +1,4 @@
1
1
  import { ReactText } from 'react';
2
2
  import { NumberToFormatOptions, Delimiter } from '@synerise/ds-data-format';
3
- export declare const formatNumber: (value: string | number | undefined, formatValue: (value: number, options: NumberToFormatOptions) => string, notationThousandDelimiter: Delimiter, notationDecimalDelimiter: Delimiter, valueFormatOptions?: NumberToFormatOptions | undefined) => string;
3
+ export declare const formatNumber: (value: string | number | undefined | null, formatValue: (value: number, options: NumberToFormatOptions) => string, notationThousandDelimiter: Delimiter, notationDecimalDelimiter: Delimiter, valueFormatOptions?: NumberToFormatOptions | undefined) => string;
4
4
  export declare const parseFormattedNumber: (value: string | undefined, formatValue: (value: number, options: NumberToFormatOptions) => string, notationThousandDelimiter: Delimiter, notationDecimalDelimiter: Delimiter) => ReactText;
@@ -11,7 +11,7 @@ import { MAXIMUM_FRACTION_DIGITS, MAXIMUM_NUMBER_DIGITS, NUMBER_DELIMITER } from
11
11
  export var formatNumber = function formatNumber(value, formatValue, notationThousandDelimiter, notationDecimalDelimiter, valueFormatOptions) {
12
12
  var _value$match, _value$match2;
13
13
 
14
- if (value === undefined || value === '') return '';
14
+ if (value === undefined || value === '' || value === null) return '';
15
15
  if (value === '-') return '-';
16
16
 
17
17
  var formatOptions = _objectSpread({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@synerise/ds-input-number",
3
- "version": "0.8.16",
3
+ "version": "0.8.18",
4
4
  "description": "Input-Number UI Component for the Synerise Design System",
5
5
  "license": "ISC",
6
6
  "repository": "Synerise/synerise-design",
@@ -45,5 +45,5 @@
45
45
  "devDependencies": {
46
46
  "@types/uuid": "7.0.0"
47
47
  },
48
- "gitHead": "283730ca9bb63422391388fbc020906edf942b57"
48
+ "gitHead": "3879c41ef7a22df15d5cd80ceaa41ec56e551429"
49
49
  }