@particle-network/ui-native 0.4.2-beta.10 → 0.4.2-beta.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/components/input/number-input.js +29 -31
  2. package/package.json +13 -12
package/dist/components/input/number-input.js CHANGED
@@ -9,7 +9,7 @@ import { Text } from "../Text/index.js";
9
9
  import { UXPressable } from "../UXPressable/index.js";
10
10
  import { useStyles } from "./styles.js";
11
11
  const UXNumberInput = /*#__PURE__*/ forwardRef((props, ref)=>{
12
- const { containerStyle, wrapperStyle, inputStyle, value: controlledValue, defaultValue, errorMessage, minValue, maxValue, formatOptions, startContent, endContent, isRequired, isReadOnly, isDisabled, isClearable, isInvalid: isInvalidProp, autoErrorMessage, allowNegative, label, onChangeText, onValueChange, onFocus, onBlur, blurOnKeyboardHide = true, ...restProps } = props;
12
+ const { containerStyle, wrapperStyle, inputStyle, value: controlledValue, defaultValue, errorMessage, minValue, maxValue, startContent, endContent, isRequired, isReadOnly, isDisabled, isClearable, isInvalid: isInvalidProp, autoErrorMessage, allowNegative, label, onChangeText, onValueChange, onFocus, onBlur, blurOnKeyboardHide = true, ...restProps } = props;
13
13
  const { getColor } = useColors();
14
14
  const inputRef = useRef(null);
15
15
  const [internalValue, setInternalValue] = useState(defaultValue ?? NaN);
@@ -17,6 +17,16 @@ const UXNumberInput = /*#__PURE__*/ forwardRef((props, ref)=>{
17
17
  const [isFocused, setIsFocused] = useState(false);
18
18
  const [isInvalid, setIsInvalid] = useState(isInvalidProp);
19
19
  const { isKeyboardVisible } = useKeyboard();
20
+ const formatOptions = useMemo(()=>{
21
+ const restFormatOptions = {
22
+ maximumFractionDigits: 3,
23
+ ...restProps.formatOptions ?? {}
24
+ };
25
+ delete restFormatOptions.signDisplay;
26
+ return restFormatOptions;
27
+ }, [
28
+ restProps.formatOptions
29
+ ]);
20
30
  useEffect(()=>{
21
31
  if (!isKeyboardVisible && blurOnKeyboardHide) inputRef.current?.blur();
22
32
  }, [
@@ -58,10 +68,7 @@ const UXNumberInput = /*#__PURE__*/ forwardRef((props, ref)=>{
58
68
  defaultValue,
59
69
  controlledValue
60
70
  ]);
61
- const numberFormatter = useMemo(()=>{
62
- if (formatOptions) return new Intl.NumberFormat(void 0, formatOptions);
63
- return null;
64
- }, [
71
+ const numberFormatter = useMemo(()=>new Intl.NumberFormat(void 0, formatOptions), [
65
72
  formatOptions
66
73
  ]);
67
74
  const validationResult = useMemo(()=>{
@@ -88,19 +95,15 @@ const UXNumberInput = /*#__PURE__*/ forwardRef((props, ref)=>{
88
95
  maxValue
89
96
  ]);
90
97
  const adjustValueToRange = useCallback((num)=>{
91
- const numValue = isNaN(num) ? 0 : num;
92
- if (void 0 !== minValue && numValue < minValue) return minValue;
93
- if (void 0 !== maxValue && numValue > maxValue) return maxValue;
94
- return numValue;
98
+ if (isNaN(num)) return NaN;
99
+ if (void 0 !== minValue && num < minValue) return minValue;
100
+ if (void 0 !== maxValue && num > maxValue) return maxValue;
101
+ return num;
95
102
  }, [
96
103
  minValue,
97
104
  maxValue
98
105
  ]);
99
- const adjustValueToFractionDigits = useCallback((numValue)=>{
100
- if (formatOptions?.minimumFractionDigits !== void 0 || formatOptions?.maximumFractionDigits !== void 0) return Number(numberFormatter?.format(numValue).replaceAll(',', ''));
101
- return numValue;
102
- }, [
103
- formatOptions,
106
+ const adjustValueToFractionDigits = useCallback((numValue)=>Number(numberFormatter?.format(numValue).replaceAll(',', '')), [
104
107
  numberFormatter
105
108
  ]);
106
109
  const handleChangeText = useCallback((text)=>{
@@ -111,17 +114,10 @@ const UXNumberInput = /*#__PURE__*/ forwardRef((props, ref)=>{
111
114
  if (cleanedText.includes('-') && !cleanedText.startsWith('-')) return;
112
115
  setDisplayText(cleanedText);
113
116
  onChangeText?.(cleanedText);
114
- const numValue = parseFloat(cleanedText);
115
- if (isNaN(numValue)) {
116
- setInternalValue(NaN);
117
- onValueChange?.(NaN);
118
- } else {
119
- setInternalValue(numValue);
120
- onValueChange?.(numValue);
121
- }
117
+ const numValue = Number(cleanedText);
118
+ isNaN(numValue) ? setInternalValue(NaN) : setInternalValue(numValue);
122
119
  }, [
123
- onChangeText,
124
- onValueChange
120
+ onChangeText
125
121
  ]);
126
122
  const handleFocus = useCallback((e)=>{
127
123
  setIsFocused(true);
@@ -131,13 +127,15 @@ const UXNumberInput = /*#__PURE__*/ forwardRef((props, ref)=>{
131
127
  ]);
132
128
  const handleBlur = useCallback((e)=>{
133
129
  setIsFocused(false);
134
- const adjustedValue = adjustValueToFractionDigits(adjustValueToRange(internalValue));
135
- if (adjustedValue !== internalValue) {
136
- const adjustedText = adjustedValue?.toString();
137
- setDisplayText(adjustedText);
138
- setInternalValue(adjustedValue);
139
- onChangeText?.(adjustedText);
140
- onValueChange?.(adjustedValue);
130
+ if (!isNaN(internalValue)) {
131
+ const adjustedValue = adjustValueToFractionDigits(adjustValueToRange(internalValue));
132
+ if (adjustedValue !== internalValue) {
133
+ const adjustedText = adjustedValue?.toString();
134
+ setDisplayText(adjustedText);
135
+ setInternalValue(adjustedValue);
136
+ onChangeText?.(adjustedText);
137
+ onValueChange?.(adjustedValue);
138
+ }
141
139
  }
142
140
  onBlur?.(e);
143
141
  }, [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@particle-network/ui-native",
3
- "version": "0.4.2-beta.10",
3
+ "version": "0.4.2-beta.12",
4
4
  "main": "./entry.js",
5
5
  "react-native": "./dist/index.js",
6
6
  "module": "./dist/index.js",
@@ -44,6 +44,7 @@
44
44
  "react-native-paper": "^5.14.5",
45
45
  "react-native-size-matters": "^0.4.2",
46
46
  "react-native-toast-message": "^2.3.3",
47
+ "react-native-worklets": "0.5.1",
47
48
  "@particle-network/icons": "0.4.2-beta.7",
48
49
  "@particle-network/ui-shared": "0.3.2-beta.3"
49
50
  },
@@ -59,13 +60,13 @@
59
60
  "@rsbuild/core": "^1.5.0",
60
61
  "@rsbuild/plugin-react": "^1.3.5",
61
62
  "@rslib/core": "^0.12.2",
62
- "@storybook/addon-docs": "^9.1.6",
63
- "@storybook/addon-ondevice-actions": "^9.1.2",
64
- "@storybook/addon-ondevice-backgrounds": "^9.1.2",
65
- "@storybook/addon-ondevice-controls": "^9.1.2",
66
- "@storybook/addon-ondevice-notes": "^9.1.2",
67
- "@storybook/react-native": "^9.1.2",
68
- "@storybook/react-native-web-vite": "^9.1.6",
63
+ "@storybook/addon-docs": "^10.0.0",
64
+ "@storybook/addon-ondevice-actions": "^10.0.0",
65
+ "@storybook/addon-ondevice-backgrounds": "^10.0.0",
66
+ "@storybook/addon-ondevice-controls": "^10.0.0",
67
+ "@storybook/addon-ondevice-notes": "^10.0.0",
68
+ "@storybook/react-native": "^10.0.0",
69
+ "@storybook/react-native-web-vite": "^10.0.0",
69
70
  "@types/react": "^19.1.10",
70
71
  "babel-plugin-module-resolver": "^5.0.2",
71
72
  "babel-plugin-react-docgen-typescript": "^1.5.1",
@@ -79,18 +80,18 @@
79
80
  "react-dom": "19.1.0",
80
81
  "react-native": "0.81.5",
81
82
  "react-native-gesture-handler": "~2.28.0",
82
- "react-native-reanimated": "~4.1.0",
83
+ "react-native-reanimated": "4.1.6",
83
84
  "react-native-safe-area-context": "5.6.1",
84
85
  "react-native-svg": "15.12.1",
85
86
  "react-native-web": "^0.21.1",
86
87
  "serve": "^14.2.5",
87
- "storybook": "^9.1.6",
88
+ "storybook": "^10.0.0",
88
89
  "unfetch": "^4.2.0",
89
90
  "vite": "^6.3.5",
90
91
  "zustand": "^5.0.8",
91
- "@particle-network/icons": "0.4.2-beta.7",
92
+ "@particle-network/eslint-config": "0.3.0",
92
93
  "@particle-network/lintstaged-config": "0.1.0",
93
- "@particle-network/eslint-config": "0.3.0"
94
+ "@particle-network/icons": "0.4.2-beta.7"
94
95
  },
95
96
  "overrides": {
96
97
  "react-docgen-typescript": "2.2.2",