cdslibrary 1.2.79 → 1.2.80
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/components/CDSInput.jsx +18 -17
- package/package.json +1 -1
package/components/CDSInput.jsx
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import React, { useState, useEffect, useRef } from "react";
|
|
2
2
|
import { View, Text, TextInput, StyleSheet, Platform } from "react-native";
|
|
3
|
-
import Animated, {
|
|
4
|
-
useAnimatedStyle,
|
|
5
|
-
useSharedValue,
|
|
6
|
-
withSequence,
|
|
7
|
-
withTiming,
|
|
8
|
-
interpolateColor
|
|
3
|
+
import Animated, {
|
|
4
|
+
useAnimatedStyle,
|
|
5
|
+
useSharedValue,
|
|
6
|
+
withSequence,
|
|
7
|
+
withTiming,
|
|
8
|
+
interpolateColor
|
|
9
9
|
} from "react-native-reanimated";
|
|
10
10
|
import { useTheme } from "../context/CDSThemeContext";
|
|
11
11
|
|
|
12
12
|
export const CDSInput = ({ label, type, keyboard, placeholder, value, onChangeText, animationTrigger, returnKeyType, onFocus }) => {
|
|
13
13
|
const { theme } = useTheme();
|
|
14
14
|
const [isFocused, setIsFocused] = useState(false);
|
|
15
|
-
|
|
15
|
+
|
|
16
16
|
const flashValue = useSharedValue(0);
|
|
17
17
|
const isInternalChange = useRef(false);
|
|
18
18
|
|
|
@@ -28,7 +28,7 @@ export const CDSInput = ({ label, type, keyboard, placeholder, value, onChangeTe
|
|
|
28
28
|
|
|
29
29
|
const handleTextChange = (inputText) => {
|
|
30
30
|
isInternalChange.current = true;
|
|
31
|
-
|
|
31
|
+
|
|
32
32
|
if (keyboard === "numeric" || keyboard === "decimal-pad") {
|
|
33
33
|
let cleaned = inputText.replace(',', '.').replace(/[^0-9.]/g, "");
|
|
34
34
|
const parts = cleaned.split('.');
|
|
@@ -56,12 +56,12 @@ export const CDSInput = ({ label, type, keyboard, placeholder, value, onChangeTe
|
|
|
56
56
|
borderWidth: 1 + (flashValue.value * 1),
|
|
57
57
|
};
|
|
58
58
|
});
|
|
59
|
-
|
|
59
|
+
|
|
60
60
|
return (
|
|
61
61
|
<View style={styles.container}>
|
|
62
62
|
{label && (
|
|
63
63
|
<Text style={[
|
|
64
|
-
theme.typography.label,
|
|
64
|
+
theme.typography.label,
|
|
65
65
|
{ color: theme.text.neutral.primary, marginBottom: theme.space.xs }
|
|
66
66
|
]}>
|
|
67
67
|
{label}
|
|
@@ -69,18 +69,18 @@ export const CDSInput = ({ label, type, keyboard, placeholder, value, onChangeTe
|
|
|
69
69
|
)}
|
|
70
70
|
|
|
71
71
|
<Animated.View style={[
|
|
72
|
-
styles.wrapper,
|
|
72
|
+
styles.wrapper,
|
|
73
73
|
animatedBoxStyle,
|
|
74
74
|
{
|
|
75
|
-
|
|
76
|
-
|
|
75
|
+
backgroundColor: type === 'readOnly' ? theme.surface.neutral.primaryVariant : theme.surface.neutral.primary,
|
|
76
|
+
borderRadius: theme.radius.sm,
|
|
77
77
|
}
|
|
78
78
|
]}>
|
|
79
79
|
<TextInput
|
|
80
80
|
style={[
|
|
81
81
|
styles.textBox,
|
|
82
82
|
theme.typography.inputText.value,
|
|
83
|
-
{
|
|
83
|
+
{
|
|
84
84
|
paddingHorizontal: theme.space.sm,
|
|
85
85
|
color: type === 'readOnly' ? theme.text.neutral.secondary : theme.text.neutral.primary,
|
|
86
86
|
// Fix para web:
|
|
@@ -96,10 +96,11 @@ export const CDSInput = ({ label, type, keyboard, placeholder, value, onChangeTe
|
|
|
96
96
|
value={value}
|
|
97
97
|
editable={type !== 'readOnly'}
|
|
98
98
|
secureTextEntry={type === "password"}
|
|
99
|
-
onFocus={() => {setIsFocused(true); onFocus}}
|
|
99
|
+
onFocus={() => { setIsFocused(true); onFocus }}
|
|
100
100
|
onBlur={() => setIsFocused(false)}
|
|
101
101
|
underlineColorAndroid="transparent"
|
|
102
102
|
returnKeyType={returnKeyType}
|
|
103
|
+
dataSet={{ lpignore: "true" }}
|
|
103
104
|
/>
|
|
104
105
|
</Animated.View>
|
|
105
106
|
</View>
|
|
@@ -107,8 +108,8 @@ export const CDSInput = ({ label, type, keyboard, placeholder, value, onChangeTe
|
|
|
107
108
|
};
|
|
108
109
|
|
|
109
110
|
const styles = StyleSheet.create({
|
|
110
|
-
container: {
|
|
111
|
-
width: "100%",
|
|
111
|
+
container: {
|
|
112
|
+
width: "100%",
|
|
112
113
|
alignSelf: 'stretch',
|
|
113
114
|
},
|
|
114
115
|
wrapper: {
|