@particle-network/ui-native 0.4.2-beta.11 → 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 -37
  2. package/package.json +5 -4
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,16 +68,7 @@ const UXNumberInput = /*#__PURE__*/ forwardRef((props, ref)=>{
58
68
  defaultValue,
59
69
  controlledValue
60
70
  ]);
61
- const numberFormatter = useMemo(()=>{
62
- if (formatOptions) {
63
- const restFormatOptions = {
64
- ...formatOptions
65
- };
66
- delete restFormatOptions.signDisplay;
67
- return new Intl.NumberFormat(void 0, restFormatOptions);
68
- }
69
- return null;
70
- }, [
71
+ const numberFormatter = useMemo(()=>new Intl.NumberFormat(void 0, formatOptions), [
71
72
  formatOptions
72
73
  ]);
73
74
  const validationResult = useMemo(()=>{
@@ -94,19 +95,15 @@ const UXNumberInput = /*#__PURE__*/ forwardRef((props, ref)=>{
94
95
  maxValue
95
96
  ]);
96
97
  const adjustValueToRange = useCallback((num)=>{
97
- const numValue = isNaN(num) ? 0 : num;
98
- if (void 0 !== minValue && numValue < minValue) return minValue;
99
- if (void 0 !== maxValue && numValue > maxValue) return maxValue;
100
- 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;
101
102
  }, [
102
103
  minValue,
103
104
  maxValue
104
105
  ]);
105
- const adjustValueToFractionDigits = useCallback((numValue)=>{
106
- if (formatOptions?.minimumFractionDigits !== void 0 || formatOptions?.maximumFractionDigits !== void 0) return Number(numberFormatter?.format(numValue).replaceAll(',', ''));
107
- return numValue;
108
- }, [
109
- formatOptions,
106
+ const adjustValueToFractionDigits = useCallback((numValue)=>Number(numberFormatter?.format(numValue).replaceAll(',', '')), [
110
107
  numberFormatter
111
108
  ]);
112
109
  const handleChangeText = useCallback((text)=>{
@@ -117,17 +114,10 @@ const UXNumberInput = /*#__PURE__*/ forwardRef((props, ref)=>{
117
114
  if (cleanedText.includes('-') && !cleanedText.startsWith('-')) return;
118
115
  setDisplayText(cleanedText);
119
116
  onChangeText?.(cleanedText);
120
- const numValue = parseFloat(cleanedText);
121
- if (isNaN(numValue)) {
122
- setInternalValue(NaN);
123
- onValueChange?.(NaN);
124
- } else {
125
- setInternalValue(numValue);
126
- onValueChange?.(numValue);
127
- }
117
+ const numValue = Number(cleanedText);
118
+ isNaN(numValue) ? setInternalValue(NaN) : setInternalValue(numValue);
128
119
  }, [
129
- onChangeText,
130
- onValueChange
120
+ onChangeText
131
121
  ]);
132
122
  const handleFocus = useCallback((e)=>{
133
123
  setIsFocused(true);
@@ -137,13 +127,15 @@ const UXNumberInput = /*#__PURE__*/ forwardRef((props, ref)=>{
137
127
  ]);
138
128
  const handleBlur = useCallback((e)=>{
139
129
  setIsFocused(false);
140
- const adjustedValue = adjustValueToFractionDigits(adjustValueToRange(internalValue));
141
- if (adjustedValue !== internalValue) {
142
- const adjustedText = adjustedValue?.toString();
143
- setDisplayText(adjustedText);
144
- setInternalValue(adjustedValue);
145
- onChangeText?.(adjustedText);
146
- 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
+ }
147
139
  }
148
140
  onBlur?.(e);
149
141
  }, [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@particle-network/ui-native",
3
- "version": "0.4.2-beta.11",
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
  },
@@ -79,7 +80,7 @@
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",
@@ -89,8 +90,8 @@
89
90
  "vite": "^6.3.5",
90
91
  "zustand": "^5.0.8",
91
92
  "@particle-network/eslint-config": "0.3.0",
92
- "@particle-network/icons": "0.4.2-beta.7",
93
- "@particle-network/lintstaged-config": "0.1.0"
93
+ "@particle-network/lintstaged-config": "0.1.0",
94
+ "@particle-network/icons": "0.4.2-beta.7"
94
95
  },
95
96
  "overrides": {
96
97
  "react-docgen-typescript": "2.2.2",