@towsila/expo-ui-library 3.3.9 → 3.3.11

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@towsila/expo-ui-library",
3
- "version": "3.3.9",
3
+ "version": "3.3.11",
4
4
  "description": "",
5
5
  "main": "src/index.ts",
6
6
  "types": "src/index.ts",
@@ -28,8 +28,12 @@ export default function OtpInput({ length = 6, onComplete, onChange, style, size
28
28
  const code = newDigits.join("");
29
29
  onChange?.(code);
30
30
 
31
- if (text && index < length - 1) {
32
- refs.current[index + 1]?.focus();
31
+ if (text.length > 0 && index < length - 1) {
32
+ const nextIndex = index + 1;
33
+
34
+ requestAnimationFrame(() => {
35
+ refs.current[nextIndex]?.focus();
36
+ });
33
37
  }
34
38
 
35
39
  if (code.length === length && newDigits.every((d) => d !== "")) {
@@ -38,14 +42,14 @@ export default function OtpInput({ length = 6, onComplete, onChange, style, size
38
42
  };
39
43
 
40
44
  return (
41
- <View style={{ flexDirection: "row", justifyContent: "center", gap: 12, marginHorizontal: 20 }}>
45
+ <View style={{ flexDirection: "row", justifyContent: "center", gap: 12, marginHorizontal: 20, direction: "ltr",}}>
42
46
  {digits.map((digit, index) => (
43
47
  <TextInput
44
48
  key={index}
45
49
  ref={(r) => { if (r) refs.current[index] = r; }}
46
50
  style={[
47
51
  styles.otpInput,
48
- { borderColor: focusedIndex === index ? colors.primary : colors.semantic.border, width: size, height: size, borderRadius: borderRadius, fontFamily:fontFamily },
52
+ { borderColor: focusedIndex === index ? colors.primary : colors.text.primary, width: size, height: size, borderRadius: borderRadius, fontFamily:fontFamily },
49
53
  style
50
54
  ]}
51
55
  keyboardType="number-pad"
@@ -103,7 +103,7 @@ export default function Input({
103
103
  ? colors.semantic.error
104
104
  : focused
105
105
  ? colors.primary
106
- : colors.semantic.border,
106
+ : colors.text.primary,
107
107
  borderWidth: error ? 1.5 : focused ? 1.5 : 1,
108
108
  }}
109
109
  {...rest}