@fovestta2/mobile-react-native 1.1.0 → 1.2.1
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/dist/components/AddUpdateForm.d.ts +30 -0
- package/dist/components/AddUpdateForm.d.ts.map +1 -0
- package/dist/components/AddUpdateForm.js +183 -0
- package/dist/components/AddUpdateForm.js.map +1 -0
- package/dist/components/FvCheckbox.js +12 -19
- package/dist/components/FvCheckbox.js.map +1 -1
- package/dist/components/FvDateField.js +18 -45
- package/dist/components/FvDateField.js.map +1 -1
- package/dist/components/FvDropdown.d.ts.map +1 -1
- package/dist/components/FvDropdown.js +145 -96
- package/dist/components/FvDropdown.js.map +1 -1
- package/dist/components/FvEntryField.d.ts +2 -0
- package/dist/components/FvEntryField.d.ts.map +1 -1
- package/dist/components/FvEntryField.js +24 -47
- package/dist/components/FvEntryField.js.map +1 -1
- package/dist/components/FvEsiField.d.ts +15 -0
- package/dist/components/FvEsiField.d.ts.map +1 -0
- package/dist/components/FvEsiField.js +82 -0
- package/dist/components/FvEsiField.js.map +1 -0
- package/dist/components/FvFileSelector.js +35 -62
- package/dist/components/FvFileSelector.js.map +1 -1
- package/dist/components/FvIbanField.d.ts +15 -0
- package/dist/components/FvIbanField.d.ts.map +1 -0
- package/dist/components/FvIbanField.js +82 -0
- package/dist/components/FvIbanField.js.map +1 -0
- package/dist/components/FvIfscField.d.ts +15 -0
- package/dist/components/FvIfscField.d.ts.map +1 -0
- package/dist/components/FvIfscField.js +82 -0
- package/dist/components/FvIfscField.js.map +1 -0
- package/dist/components/FvImageSelector.js +39 -66
- package/dist/components/FvImageSelector.js.map +1 -1
- package/dist/components/FvMicrField.d.ts +15 -0
- package/dist/components/FvMicrField.d.ts.map +1 -0
- package/dist/components/FvMicrField.js +82 -0
- package/dist/components/FvMicrField.js.map +1 -0
- package/dist/components/FvMonthYearField.js +18 -45
- package/dist/components/FvMonthYearField.js.map +1 -1
- package/dist/components/FvNameCode.d.ts +21 -0
- package/dist/components/FvNameCode.d.ts.map +1 -0
- package/dist/components/FvNameCode.js +218 -0
- package/dist/components/FvNameCode.js.map +1 -0
- package/dist/components/FvNumberField.d.ts.map +1 -1
- package/dist/components/FvNumberField.js +21 -45
- package/dist/components/FvNumberField.js.map +1 -1
- package/dist/components/FvPfField.d.ts +15 -0
- package/dist/components/FvPfField.d.ts.map +1 -0
- package/dist/components/FvPfField.js +81 -0
- package/dist/components/FvPfField.js.map +1 -0
- package/dist/components/FvPhoneField.d.ts +16 -0
- package/dist/components/FvPhoneField.d.ts.map +1 -0
- package/dist/components/FvPhoneField.js +127 -0
- package/dist/components/FvPhoneField.js.map +1 -0
- package/dist/components/FvRadioGroup.js +18 -25
- package/dist/components/FvRadioGroup.js.map +1 -1
- package/dist/components/FvRichTextEditor.js +52 -79
- package/dist/components/FvRichTextEditor.js.map +1 -1
- package/dist/components/FvUanField.d.ts +15 -0
- package/dist/components/FvUanField.d.ts.map +1 -0
- package/dist/components/FvUanField.js +82 -0
- package/dist/components/FvUanField.js.map +1 -0
- package/dist/components/QueryForm.d.ts +6 -0
- package/dist/components/QueryForm.d.ts.map +1 -0
- package/dist/components/QueryForm.js +168 -0
- package/dist/components/QueryForm.js.map +1 -0
- package/dist/index.d.ts +10 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +20 -26
- package/dist/index.js.map +1 -1
- package/dist/utils/DropdownManager.d.ts +9 -0
- package/dist/utils/DropdownManager.d.ts.map +1 -0
- package/dist/utils/DropdownManager.js +14 -0
- package/dist/utils/DropdownManager.js.map +1 -0
- package/package.json +3 -3
|
@@ -1,60 +1,106 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
-
exports.FvDropdown = void 0;
|
|
27
|
-
const react_1 = __importStar(require("react"));
|
|
28
|
-
const react_native_1 = require("react-native");
|
|
29
|
-
const validation_engine_1 = require("@fovestta2/validation-engine");
|
|
30
|
-
const FvDropdown = ({ label, placeholder = "Select an option", value, options, schema, disabled = false, onChange, onBlur, containerStyle, dropdownStyle, labelStyle, errorStyle, optionStyle, optionTextStyle, }) => {
|
|
31
|
-
const [errorMessage, setErrorMessage] = (0, react_1.useState)(null);
|
|
32
|
-
const [isOpen, setIsOpen] = (0, react_1.useState)(false);
|
|
33
|
-
const [dropdownLayout, setDropdownLayout] = (0, react_1.useState)({ x: 0, y: 0, width: 0, height: 0 });
|
|
34
|
-
const buttonRef = (0, react_1.useRef)(null);
|
|
35
|
-
(0, react_1.useEffect)(() => {
|
|
1
|
+
import React, { useState, useEffect, useRef } from "react";
|
|
2
|
+
import { View, Text, StyleSheet, TouchableOpacity, TextInput, ScrollView, } from "react-native";
|
|
3
|
+
import { Validator } from "@fovestta2/validation-engine";
|
|
4
|
+
import { DropdownManager } from "../utils/DropdownManager";
|
|
5
|
+
export const FvDropdown = ({ label, placeholder = "Select an option", value, options, schema, disabled = false, onChange, onBlur, containerStyle, dropdownStyle, labelStyle, errorStyle, optionStyle, optionTextStyle, }) => {
|
|
6
|
+
const [errorMessage, setErrorMessage] = useState(null);
|
|
7
|
+
const [isOpen, setIsOpen] = useState(false);
|
|
8
|
+
const [dropdownLayout, setDropdownLayout] = useState({ x: 0, y: 0, width: 0, height: 0 });
|
|
9
|
+
const [searchText, setSearchText] = useState("");
|
|
10
|
+
const [filteredOptions, setFilteredOptions] = useState(options);
|
|
11
|
+
const buttonRef = useRef(null);
|
|
12
|
+
const dropdownId = useRef(Math.random().toString()).current;
|
|
13
|
+
useEffect(() => {
|
|
14
|
+
const unsubscribe = DropdownManager.subscribe((activeId) => {
|
|
15
|
+
if (activeId !== dropdownId) {
|
|
16
|
+
setIsOpen(false);
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
return unsubscribe;
|
|
20
|
+
}, []);
|
|
21
|
+
// Sync validation
|
|
22
|
+
useEffect(() => {
|
|
36
23
|
if (schema) {
|
|
37
|
-
const result =
|
|
24
|
+
const result = Validator.validate(value, schema);
|
|
38
25
|
setErrorMessage(result.errorKey);
|
|
39
26
|
}
|
|
40
27
|
}, [value, schema]);
|
|
28
|
+
// Sync input text with selected value
|
|
29
|
+
useEffect(() => {
|
|
30
|
+
const selectedOption = options.find((opt) => opt.value === value);
|
|
31
|
+
if (selectedOption) {
|
|
32
|
+
setSearchText(selectedOption.label);
|
|
33
|
+
}
|
|
34
|
+
}, [value, options]);
|
|
35
|
+
// Filter options based on search text
|
|
36
|
+
useEffect(() => {
|
|
37
|
+
if (isOpen) {
|
|
38
|
+
if (!searchText) {
|
|
39
|
+
setFilteredOptions(options);
|
|
40
|
+
}
|
|
41
|
+
else {
|
|
42
|
+
// If the text matches exactly the selected value label, show all options (user just opened it)
|
|
43
|
+
// Or if user is typing, filter.
|
|
44
|
+
// Simple logic: filter if text is present.
|
|
45
|
+
// However, detailed UX: if "United States" is selected, clicking it opens with "United States" in text.
|
|
46
|
+
// The list should probably show all options initially, or filtered options?
|
|
47
|
+
// Usually standard behavior: show all if text matches value, filter if user modifies text.
|
|
48
|
+
// For simplicity: always filter.
|
|
49
|
+
const lower = searchText.toLowerCase();
|
|
50
|
+
const filtered = options.filter(opt => opt.label.toLowerCase().includes(lower));
|
|
51
|
+
setFilteredOptions(filtered);
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
else {
|
|
55
|
+
// Reset to valid options when closed
|
|
56
|
+
setFilteredOptions(options);
|
|
57
|
+
}
|
|
58
|
+
}, [searchText, options, isOpen]);
|
|
41
59
|
const toggleDropdown = () => {
|
|
42
60
|
if (disabled)
|
|
43
61
|
return;
|
|
44
62
|
if (!isOpen) {
|
|
45
|
-
|
|
46
|
-
setDropdownLayout({ x: pageX, y: pageY, width, height });
|
|
47
|
-
setIsOpen(true);
|
|
48
|
-
});
|
|
63
|
+
openDropdown();
|
|
49
64
|
}
|
|
50
65
|
else {
|
|
51
|
-
|
|
66
|
+
closeDropdown();
|
|
67
|
+
}
|
|
68
|
+
};
|
|
69
|
+
const openDropdown = () => {
|
|
70
|
+
DropdownManager.notify(dropdownId);
|
|
71
|
+
setIsOpen(true);
|
|
72
|
+
setFilteredOptions(options);
|
|
73
|
+
};
|
|
74
|
+
const closeDropdown = () => {
|
|
75
|
+
setIsOpen(false);
|
|
76
|
+
onBlur?.();
|
|
77
|
+
// Restore label of selected value if user typed something invalid but didn't select
|
|
78
|
+
const selectedOption = options.find((opt) => opt.value === value);
|
|
79
|
+
if (selectedOption) {
|
|
80
|
+
setSearchText(selectedOption.label);
|
|
81
|
+
}
|
|
82
|
+
else {
|
|
83
|
+
// If nothing selected, clear text? or keep partial?
|
|
84
|
+
// If value is empty, text should be empty.
|
|
85
|
+
if (!value)
|
|
86
|
+
setSearchText("");
|
|
52
87
|
}
|
|
53
88
|
};
|
|
54
89
|
const handleSelect = (selectedValue) => {
|
|
55
90
|
onChange(selectedValue);
|
|
56
91
|
setIsOpen(false);
|
|
57
92
|
onBlur?.();
|
|
93
|
+
// text update handled by useEffect [value]
|
|
94
|
+
};
|
|
95
|
+
const handleTextChange = (text) => {
|
|
96
|
+
setSearchText(text);
|
|
97
|
+
if (!isOpen) {
|
|
98
|
+
openDropdown();
|
|
99
|
+
}
|
|
100
|
+
// If user clears text, allow clearing value?
|
|
101
|
+
if (text === "") {
|
|
102
|
+
// optional: onChange(""); // if allowed to clear
|
|
103
|
+
}
|
|
58
104
|
};
|
|
59
105
|
const getErrorMessage = () => {
|
|
60
106
|
if (!errorMessage)
|
|
@@ -66,66 +112,62 @@ const FvDropdown = ({ label, placeholder = "Select an option", value, options, s
|
|
|
66
112
|
return errorMessages[errorMessage] || errorMessage;
|
|
67
113
|
};
|
|
68
114
|
const isRequired = schema?.rules?.some((r) => r.name === "required" && r.params?.enabled);
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
{label && (<react_native_1.View style={styles.labelContainer}>
|
|
73
|
-
<react_native_1.Text style={[styles.label, labelStyle]}>
|
|
115
|
+
return (<View style={[styles.container, containerStyle, { zIndex: isOpen ? 1000 : 1 }]}>
|
|
116
|
+
{label && (<View style={styles.labelContainer}>
|
|
117
|
+
<Text style={[styles.label, labelStyle]}>
|
|
74
118
|
{label}
|
|
75
|
-
{isRequired && <
|
|
76
|
-
</
|
|
77
|
-
</
|
|
119
|
+
{isRequired && <Text style={styles.requiredAsterisk}> *</Text>}
|
|
120
|
+
</Text>
|
|
121
|
+
</View>)}
|
|
78
122
|
|
|
79
|
-
<
|
|
123
|
+
<View ref={buttonRef} style={[
|
|
80
124
|
styles.dropdown,
|
|
81
|
-
errorMessage
|
|
82
|
-
disabled
|
|
125
|
+
errorMessage ? styles.dropdownError : null,
|
|
126
|
+
disabled ? styles.dropdownDisabled : null,
|
|
83
127
|
dropdownStyle,
|
|
84
|
-
]} onPress={toggleDropdown} disabled={disabled}>
|
|
85
|
-
<react_native_1.Text style={[styles.dropdownText, !selectedOption && styles.placeholderText]}>
|
|
86
|
-
{displayText}
|
|
87
|
-
</react_native_1.Text>
|
|
88
|
-
<react_native_1.Text style={styles.arrow}>{isOpen ? "▲" : "▼"}</react_native_1.Text>
|
|
89
|
-
</react_native_1.TouchableOpacity>
|
|
90
|
-
|
|
91
|
-
<react_native_1.Modal visible={isOpen} transparent animationType="none" onRequestClose={() => setIsOpen(false)}>
|
|
92
|
-
<react_native_1.TouchableOpacity style={styles.modalOverlay} activeOpacity={1} onPress={() => setIsOpen(false)}>
|
|
93
|
-
<react_native_1.View style={[
|
|
94
|
-
styles.dropdownList,
|
|
95
|
-
{
|
|
96
|
-
position: 'absolute',
|
|
97
|
-
top: dropdownLayout.y + dropdownLayout.height,
|
|
98
|
-
left: dropdownLayout.x,
|
|
99
|
-
width: dropdownLayout.width,
|
|
100
|
-
}
|
|
101
128
|
]}>
|
|
102
|
-
|
|
103
|
-
styles.
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
129
|
+
<TextInput style={styles.input} value={searchText} onChangeText={handleTextChange} onFocus={openDropdown} placeholder={placeholder} placeholderTextColor="#999999" editable={!disabled}/>
|
|
130
|
+
<TouchableOpacity onPress={toggleDropdown} style={styles.iconButton}>
|
|
131
|
+
<Text style={styles.arrow}>{isOpen ? "▲" : "▼"}</Text>
|
|
132
|
+
</TouchableOpacity>
|
|
133
|
+
</View>
|
|
134
|
+
|
|
135
|
+
{isOpen && (<View style={[
|
|
136
|
+
styles.dropdownList,
|
|
137
|
+
{
|
|
138
|
+
position: 'absolute',
|
|
139
|
+
top: '100%',
|
|
140
|
+
left: 0,
|
|
141
|
+
right: 0,
|
|
142
|
+
}
|
|
111
143
|
]}>
|
|
144
|
+
<ScrollView keyboardShouldPersistTaps="handled" nestedScrollEnabled={true} style={{ maxHeight: 200 }}>
|
|
145
|
+
{filteredOptions.length === 0 ? (<Text style={styles.noResults}>No options found</Text>) : (filteredOptions.map((item) => (<TouchableOpacity key={item.value.toString()} style={[
|
|
146
|
+
styles.option,
|
|
147
|
+
item.value === value && styles.selectedOption,
|
|
148
|
+
optionStyle,
|
|
149
|
+
]} onPress={() => handleSelect(item.value)}>
|
|
150
|
+
<Text style={[
|
|
151
|
+
styles.optionText,
|
|
152
|
+
item.value === value && styles.selectedOptionText,
|
|
153
|
+
optionTextStyle,
|
|
154
|
+
]}>
|
|
112
155
|
{item.label}
|
|
113
|
-
</
|
|
114
|
-
</
|
|
115
|
-
</
|
|
116
|
-
</
|
|
117
|
-
</react_native_1.Modal>
|
|
156
|
+
</Text>
|
|
157
|
+
</TouchableOpacity>)))}
|
|
158
|
+
</ScrollView>
|
|
159
|
+
</View>)}
|
|
118
160
|
|
|
119
|
-
{errorMessage && (<
|
|
161
|
+
{errorMessage && (<Text style={[styles.errorText, errorStyle]}>
|
|
120
162
|
⚠ {getErrorMessage()}
|
|
121
|
-
</
|
|
122
|
-
</
|
|
163
|
+
</Text>)}
|
|
164
|
+
</View>);
|
|
123
165
|
};
|
|
124
|
-
|
|
125
|
-
const styles = react_native_1.StyleSheet.create({
|
|
166
|
+
const styles = StyleSheet.create({
|
|
126
167
|
container: {
|
|
127
168
|
marginBottom: 16,
|
|
128
169
|
width: "100%",
|
|
170
|
+
// zIndex managed dynamically
|
|
129
171
|
},
|
|
130
172
|
labelContainer: {
|
|
131
173
|
marginBottom: 6,
|
|
@@ -140,13 +182,11 @@ const styles = react_native_1.StyleSheet.create({
|
|
|
140
182
|
fontWeight: "bold",
|
|
141
183
|
},
|
|
142
184
|
dropdown: {
|
|
143
|
-
padding: 10,
|
|
144
185
|
borderWidth: 1,
|
|
145
186
|
borderColor: "#cccccc",
|
|
146
187
|
borderRadius: 4,
|
|
147
188
|
backgroundColor: "#ffffff",
|
|
148
189
|
flexDirection: "row",
|
|
149
|
-
justifyContent: "space-between",
|
|
150
190
|
alignItems: "center",
|
|
151
191
|
minHeight: 45,
|
|
152
192
|
},
|
|
@@ -157,18 +197,21 @@ const styles = react_native_1.StyleSheet.create({
|
|
|
157
197
|
backgroundColor: "#f5f5f5",
|
|
158
198
|
opacity: 0.6,
|
|
159
199
|
},
|
|
160
|
-
|
|
200
|
+
input: {
|
|
201
|
+
flex: 1,
|
|
202
|
+
paddingHorizontal: 10,
|
|
203
|
+
paddingVertical: 10,
|
|
161
204
|
fontSize: 14,
|
|
162
205
|
color: "#333333",
|
|
163
|
-
flex: 1,
|
|
164
206
|
},
|
|
165
|
-
|
|
166
|
-
|
|
207
|
+
iconButton: {
|
|
208
|
+
padding: 10,
|
|
209
|
+
justifyContent: 'center',
|
|
210
|
+
alignItems: 'center',
|
|
167
211
|
},
|
|
168
212
|
arrow: {
|
|
169
213
|
fontSize: 10,
|
|
170
214
|
color: "#666666",
|
|
171
|
-
marginLeft: 8,
|
|
172
215
|
},
|
|
173
216
|
errorText: {
|
|
174
217
|
marginTop: 4,
|
|
@@ -186,7 +229,8 @@ const styles = react_native_1.StyleSheet.create({
|
|
|
186
229
|
borderRadius: 4,
|
|
187
230
|
marginTop: 2,
|
|
188
231
|
maxHeight: 250,
|
|
189
|
-
elevation:
|
|
232
|
+
elevation: 50, // Increased elevation
|
|
233
|
+
zIndex: 5000, // Explicit zIndex for list
|
|
190
234
|
shadowColor: "#000",
|
|
191
235
|
shadowOffset: { width: 0, height: 4 },
|
|
192
236
|
shadowOpacity: 0.3,
|
|
@@ -209,5 +253,10 @@ const styles = react_native_1.StyleSheet.create({
|
|
|
209
253
|
fontWeight: "600",
|
|
210
254
|
color: "#007bff",
|
|
211
255
|
},
|
|
256
|
+
noResults: {
|
|
257
|
+
padding: 15,
|
|
258
|
+
textAlign: 'center',
|
|
259
|
+
color: '#999',
|
|
260
|
+
},
|
|
212
261
|
});
|
|
213
262
|
//# sourceMappingURL=FvDropdown.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FvDropdown.js","sourceRoot":"","sources":["../../src/components/FvDropdown.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"FvDropdown.js","sourceRoot":"","sources":["../../src/components/FvDropdown.tsx"],"names":[],"mappings":"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"}
|
|
@@ -9,6 +9,8 @@ export interface FvEntryFieldProps {
|
|
|
9
9
|
disabled?: boolean;
|
|
10
10
|
readonly?: boolean;
|
|
11
11
|
type?: "text" | "password" | "email";
|
|
12
|
+
allowAlphabetsOnly?: boolean;
|
|
13
|
+
maxLength?: number;
|
|
12
14
|
onChange: (value: string) => void;
|
|
13
15
|
onBlur?: () => void;
|
|
14
16
|
onFocus?: () => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FvEntryField.d.ts","sourceRoot":"","sources":["../../src/components/FvEntryField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AACnD,OAAO,EAML,SAAS,EACT,SAAS,EACV,MAAM,cAAc,CAAC;AACtB,OAAO,EAAa,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAE3E,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,OAAO,CAAC;IACrC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,
|
|
1
|
+
{"version":3,"file":"FvEntryField.d.ts","sourceRoot":"","sources":["../../src/components/FvEntryField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AACnD,OAAO,EAML,SAAS,EACT,SAAS,EACV,MAAM,cAAc,CAAC;AACtB,OAAO,EAAa,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAE3E,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,OAAO,CAAC;IACrC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAsGpD,CAAC"}
|
|
@@ -1,42 +1,20 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
-
exports.FvEntryField = void 0;
|
|
27
|
-
const react_1 = __importStar(require("react"));
|
|
28
|
-
const react_native_1 = require("react-native");
|
|
29
|
-
const validation_engine_1 = require("@fovestta2/validation-engine");
|
|
30
|
-
const FvEntryField = ({ label, placeholder, value, schema, disabled = false, readonly = false, type = "text", onChange, onBlur, onFocus, containerStyle, inputStyle, labelStyle, errorStyle, }) => {
|
|
31
|
-
const [errorMessage, setErrorMessage] = (0, react_1.useState)(null);
|
|
32
|
-
(0, react_1.useEffect)(() => {
|
|
1
|
+
import React, { useState, useEffect } from "react";
|
|
2
|
+
import { TextInput, View, Text, StyleSheet, } from "react-native";
|
|
3
|
+
import { Validator } from "@fovestta2/validation-engine";
|
|
4
|
+
export const FvEntryField = ({ label, placeholder, value, schema, disabled = false, readonly = false, type = "text", onChange, onBlur, onFocus, containerStyle, inputStyle, labelStyle, errorStyle, allowAlphabetsOnly = false, maxLength, }) => {
|
|
5
|
+
const [errorMessage, setErrorMessage] = useState(null);
|
|
6
|
+
useEffect(() => {
|
|
33
7
|
if (schema) {
|
|
34
|
-
const result =
|
|
8
|
+
const result = Validator.validate(value, schema);
|
|
35
9
|
setErrorMessage(result.errorKey);
|
|
36
10
|
}
|
|
37
11
|
}, [value, schema]);
|
|
38
12
|
const handleChange = (text) => {
|
|
39
|
-
|
|
13
|
+
let newText = text;
|
|
14
|
+
if (allowAlphabetsOnly) {
|
|
15
|
+
newText = newText.replace(/[^a-zA-Z ]/g, '');
|
|
16
|
+
}
|
|
17
|
+
onChange(newText);
|
|
40
18
|
};
|
|
41
19
|
const handleBlur = () => {
|
|
42
20
|
onBlur?.();
|
|
@@ -61,28 +39,27 @@ const FvEntryField = ({ label, placeholder, value, schema, disabled = false, rea
|
|
|
61
39
|
return "email-address";
|
|
62
40
|
return "default";
|
|
63
41
|
};
|
|
64
|
-
return (<
|
|
65
|
-
{label && (<
|
|
66
|
-
<
|
|
42
|
+
return (<View style={[styles.container, containerStyle]}>
|
|
43
|
+
{label && (<View style={styles.labelContainer}>
|
|
44
|
+
<Text style={[styles.label, labelStyle]}>
|
|
67
45
|
{label}
|
|
68
|
-
{isRequired && <
|
|
69
|
-
</
|
|
70
|
-
</
|
|
46
|
+
{isRequired && <Text style={styles.requiredAsterisk}> *</Text>}
|
|
47
|
+
</Text>
|
|
48
|
+
</View>)}
|
|
71
49
|
|
|
72
|
-
<
|
|
50
|
+
<TextInput style={[
|
|
73
51
|
styles.input,
|
|
74
52
|
errorMessage && styles.inputError,
|
|
75
53
|
disabled && styles.inputDisabled,
|
|
76
54
|
inputStyle,
|
|
77
|
-
]} value={value} placeholder={placeholder} onChangeText={handleChange} onBlur={handleBlur} onFocus={onFocus} editable={!disabled && !readonly} secureTextEntry={secureTextEntry} keyboardType={getKeyboardType()} placeholderTextColor="#999999"/>
|
|
55
|
+
]} value={value} placeholder={placeholder} onChangeText={handleChange} onBlur={handleBlur} onFocus={onFocus} editable={!disabled && !readonly} maxLength={maxLength} secureTextEntry={secureTextEntry} keyboardType={getKeyboardType()} placeholderTextColor="#999999"/>
|
|
78
56
|
|
|
79
|
-
{errorMessage && (<
|
|
57
|
+
{errorMessage && (<Text style={[styles.errorText, errorStyle]}>
|
|
80
58
|
⚠ {getErrorMessage()}
|
|
81
|
-
</
|
|
82
|
-
</
|
|
59
|
+
</Text>)}
|
|
60
|
+
</View>);
|
|
83
61
|
};
|
|
84
|
-
|
|
85
|
-
const styles = react_native_1.StyleSheet.create({
|
|
62
|
+
const styles = StyleSheet.create({
|
|
86
63
|
container: {
|
|
87
64
|
marginBottom: 16,
|
|
88
65
|
width: "100%",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FvEntryField.js","sourceRoot":"","sources":["../../src/components/FvEntryField.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"FvEntryField.js","sourceRoot":"","sources":["../../src/components/FvEntryField.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { ViewStyle } from "react-native";
|
|
3
|
+
import { ValidationSchema } from "@fovestta2/validation-engine";
|
|
4
|
+
export interface FvEsiFieldProps {
|
|
5
|
+
label?: string;
|
|
6
|
+
value: string;
|
|
7
|
+
schema?: ValidationSchema;
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
onChange: (value: string) => void;
|
|
10
|
+
onBlur?: () => void;
|
|
11
|
+
onFocus?: () => void;
|
|
12
|
+
containerStyle?: ViewStyle;
|
|
13
|
+
}
|
|
14
|
+
export declare const FvEsiField: React.FC<FvEsiFieldProps>;
|
|
15
|
+
//# sourceMappingURL=FvEsiField.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FvEsiField.d.ts","sourceRoot":"","sources":["../../src/components/FvEsiField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AACnD,OAAO,EAKH,SAAS,EAEZ,MAAM,cAAc,CAAC;AACtB,OAAO,EAAa,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAE3E,MAAM,WAAW,eAAe;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,cAAc,CAAC,EAAE,SAAS,CAAC;CAC9B;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAsEhD,CAAC"}
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import React, { useState, useEffect } from "react";
|
|
2
|
+
import { TextInput, View, Text, StyleSheet, } from "react-native";
|
|
3
|
+
import { Validator } from "@fovestta2/validation-engine";
|
|
4
|
+
export const FvEsiField = ({ label = "ESI Number", value, schema, disabled = false, onChange, onBlur, onFocus, containerStyle }) => {
|
|
5
|
+
const [errorMessage, setErrorMessage] = useState(null);
|
|
6
|
+
useEffect(() => {
|
|
7
|
+
if (schema) {
|
|
8
|
+
const result = Validator.validate(value, schema);
|
|
9
|
+
setErrorMessage(result.errorKey);
|
|
10
|
+
}
|
|
11
|
+
}, [value, schema]);
|
|
12
|
+
const handleChange = (text) => {
|
|
13
|
+
// Numbers only, 17 digits
|
|
14
|
+
const numericValue = text.replace(/[^0-9]/g, '');
|
|
15
|
+
const truncatedValue = numericValue.substring(0, 17);
|
|
16
|
+
onChange(truncatedValue);
|
|
17
|
+
};
|
|
18
|
+
const getErrorMessage = () => {
|
|
19
|
+
if (!errorMessage)
|
|
20
|
+
return "";
|
|
21
|
+
return errorMessage;
|
|
22
|
+
};
|
|
23
|
+
const isRequired = schema?.rules?.some((r) => r.name === "required" && r.params.enabled);
|
|
24
|
+
return (<View style={[styles.container, containerStyle]}>
|
|
25
|
+
{label && (<View style={styles.labelContainer}>
|
|
26
|
+
<Text style={styles.label}>
|
|
27
|
+
{label}
|
|
28
|
+
{isRequired && <Text style={styles.requiredAsterisk}> *</Text>}
|
|
29
|
+
</Text>
|
|
30
|
+
</View>)}
|
|
31
|
+
|
|
32
|
+
<TextInput style={[
|
|
33
|
+
styles.input,
|
|
34
|
+
errorMessage && styles.inputError,
|
|
35
|
+
disabled && styles.inputDisabled,
|
|
36
|
+
]} value={value} placeholder="17 digit ESI" onChangeText={handleChange} onBlur={onBlur} onFocus={onFocus} editable={!disabled} keyboardType="numeric" placeholderTextColor="#999999" maxLength={17}/>
|
|
37
|
+
|
|
38
|
+
{errorMessage && (<Text style={styles.errorText}>
|
|
39
|
+
⚠ {getErrorMessage()}
|
|
40
|
+
</Text>)}
|
|
41
|
+
</View>);
|
|
42
|
+
};
|
|
43
|
+
const styles = StyleSheet.create({
|
|
44
|
+
container: {
|
|
45
|
+
marginBottom: 16,
|
|
46
|
+
width: "100%",
|
|
47
|
+
},
|
|
48
|
+
labelContainer: {
|
|
49
|
+
marginBottom: 6,
|
|
50
|
+
},
|
|
51
|
+
label: {
|
|
52
|
+
fontSize: 14,
|
|
53
|
+
fontWeight: "500",
|
|
54
|
+
color: "#333333",
|
|
55
|
+
},
|
|
56
|
+
requiredAsterisk: {
|
|
57
|
+
color: "#dc3545",
|
|
58
|
+
fontWeight: "bold",
|
|
59
|
+
},
|
|
60
|
+
input: {
|
|
61
|
+
padding: 10,
|
|
62
|
+
borderWidth: 1,
|
|
63
|
+
borderColor: "#cccccc",
|
|
64
|
+
borderRadius: 4,
|
|
65
|
+
fontSize: 14,
|
|
66
|
+
backgroundColor: "#ffffff",
|
|
67
|
+
color: "#333333",
|
|
68
|
+
},
|
|
69
|
+
inputError: {
|
|
70
|
+
borderColor: "#dc3545",
|
|
71
|
+
},
|
|
72
|
+
inputDisabled: {
|
|
73
|
+
backgroundColor: "#f5f5f5",
|
|
74
|
+
opacity: 0.6,
|
|
75
|
+
},
|
|
76
|
+
errorText: {
|
|
77
|
+
marginTop: 4,
|
|
78
|
+
fontSize: 12,
|
|
79
|
+
color: "#dc3545",
|
|
80
|
+
},
|
|
81
|
+
});
|
|
82
|
+
//# sourceMappingURL=FvEsiField.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FvEsiField.js","sourceRoot":"","sources":["../../src/components/FvEsiField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EACH,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,UAAU,GAGb,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,SAAS,EAAoB,MAAM,8BAA8B,CAAC;AAa3E,MAAM,CAAC,MAAM,UAAU,GAA8B,CAAC,EAClD,KAAK,GAAG,YAAY,EACpB,KAAK,EACL,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,QAAQ,EACR,MAAM,EACN,OAAO,EACP,cAAc,EACjB,EAAE,EAAE;IACD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAEtE,SAAS,CAAC,GAAG,EAAE;QACX,IAAI,MAAM,EAAE,CAAC;YACT,MAAM,MAAM,GAAG,SAAS,CAAC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;YACjD,eAAe,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;QACrC,CAAC;IACL,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC;IAEpB,MAAM,YAAY,GAAG,CAAC,IAAY,EAAE,EAAE;QAClC,0BAA0B;QAC1B,MAAM,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;QACjD,MAAM,cAAc,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;QACrD,QAAQ,CAAC,cAAc,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,GAAW,EAAE;QACjC,IAAI,CAAC,YAAY;YAAE,OAAO,EAAE,CAAC;QAC7B,OAAO,YAAY,CAAC;IACxB,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,MAAM,EAAE,KAAK,EAAE,IAAI,CAClC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,UAAU,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,CACnD,CAAC;IAEF,OAAO,CACH,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC,CAC5C;YAAA,CAAC,KAAK,IAAI,CACN,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,cAAc,CAAC,CAC/B;oBAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CACtB;wBAAA,CAAC,KAAK,CACN;wBAAA,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAE,EAAC,EAAE,IAAI,CAAC,CAClE;oBAAA,EAAE,IAAI,CACV;gBAAA,EAAE,IAAI,CAAC,CACV,CAED;;YAAA,CAAC,SAAS,CACN,KAAK,CAAC,CAAC;YACH,MAAM,CAAC,KAAK;YACZ,YAAY,IAAI,MAAM,CAAC,UAAU;YACjC,QAAQ,IAAI,MAAM,CAAC,aAAa;SACnC,CAAC,CACF,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,WAAW,CAAC,cAAc,CAC1B,YAAY,CAAC,CAAC,YAAY,CAAC,CAC3B,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CACpB,YAAY,CAAC,SAAS,CACtB,oBAAoB,CAAC,SAAS,CAC9B,SAAS,CAAC,CAAC,EAAE,CAAC,EAGlB;;YAAA,CAAC,YAAY,IAAI,CACb,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAC1B;sBAAE,CAAC,eAAe,EAAE,CACxB;gBAAA,EAAE,IAAI,CAAC,CACV,CACL;QAAA,EAAE,IAAI,CAAC,CACV,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC7B,SAAS,EAAE;QACP,YAAY,EAAE,EAAE;QAChB,KAAK,EAAE,MAAM;KAChB;IACD,cAAc,EAAE;QACZ,YAAY,EAAE,CAAC;KAClB;IACD,KAAK,EAAE;QACH,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,KAAK;QACjB,KAAK,EAAE,SAAS;KACnB;IACD,gBAAgB,EAAE;QACd,KAAK,EAAE,SAAS;QAChB,UAAU,EAAE,MAAM;KACrB;IACD,KAAK,EAAE;QACH,OAAO,EAAE,EAAE;QACX,WAAW,EAAE,CAAC;QACd,WAAW,EAAE,SAAS;QACtB,YAAY,EAAE,CAAC;QACf,QAAQ,EAAE,EAAE;QACZ,eAAe,EAAE,SAAS;QAC1B,KAAK,EAAE,SAAS;KACnB;IACD,UAAU,EAAE;QACR,WAAW,EAAE,SAAS;KACzB;IACD,aAAa,EAAE;QACX,eAAe,EAAE,SAAS;QAC1B,OAAO,EAAE,GAAG;KACf;IACD,SAAS,EAAE;QACP,SAAS,EAAE,CAAC;QACZ,QAAQ,EAAE,EAAE;QACZ,KAAK,EAAE,SAAS;KACnB;CACJ,CAAC,CAAC"}
|