@hitesh0009/react-native-basic-form 1.2.1 → 1.2.3

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 (5) hide show
  1. package/dist/Form.js +11 -5
  2. package/dist/types.d.ts +4 -0
  3. package/package.json +1 -1
  4. package/src/Form.tsx +20 -6
  5. package/src/types.ts +4 -0
package/dist/Form.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { FlatList, Image, StyleSheet, Text, TextInput, TouchableOpacity, View, } from "react-native";
2
- export const Form = ({ data, gap_bwt_keyValue = 10, gap_bwt_keys = 12, lableStyle, inputTextStyle, buttonContainerStyle, buttonTextStyle, headerIcon, headerIconStyle, headerTextStyle, imageProps, flatlistProps, textInputProps, textProp, headerText, headerContainerStyle, containerStyle, imageContainerStyle, touchableOpacityProp, inputTextContainerStyle, inputTextGroupContainerStyle, ButtonContainerStyle, buttonGroupContainerStyle, buttonGroupStyle, inputButtonGroupContainerStyle, }) => {
2
+ export const Form = ({ data, gap_bwt_keyValue = 10, gap_bwt_keys = 12, lableStyle, inputTextStyle, buttonContainerStyle, buttonTextStyle, headerIcon, headerIconStyle, headerTextStyle, imageProps, flatlistProps, textInputProps, textProp, headerText, headerContainerStyle, containerStyle, imageContainerStyle, touchableOpacityProp, inputTextContainerStyle, inputTextGroupContainerStyle, ButtonContainerStyle, buttonGroupContainerStyle, buttonGroupStyle, buttonGroupTextStyle, inputButtonGroupContainerStyle, inputButtonGroupInputStyle, inputButtonGroupButtonStyle, inputButtonGroupButtonTextStyle, }) => {
3
3
  return (<View style={[{ gap: 20 }, containerStyle]}>
4
4
  {(headerIcon || headerText) && (<View style={[{ flexDirection: "row", gap: 10 }, headerContainerStyle]}>
5
5
  {headerIcon && (<View style={imageContainerStyle}>
@@ -35,7 +35,7 @@ export const Form = ({ data, gap_bwt_keyValue = 10, gap_bwt_keys = 12, lableStyl
35
35
  buttonGroupContainerStyle,
36
36
  ]}>
37
37
  {item.buttonGroup.map((btn, index) => (<TouchableOpacity key={index} onPress={btn.onPress} style={[styles.button_container, buttonGroupStyle]}>
38
- <Text style={[styles.button_text, buttonTextStyle]}>
38
+ <Text style={[styles.button_text, buttonGroupTextStyle]}>
39
39
  {btn.label}
40
40
  </Text>
41
41
  </TouchableOpacity>))}
@@ -50,7 +50,7 @@ export const Form = ({ data, gap_bwt_keyValue = 10, gap_bwt_keys = 12, lableStyl
50
50
  {item.inputButtonGroup.input.header}
51
51
  </Text>
52
52
 
53
- <TextInput {...textInputProps} style={[styles.inputtext, inputTextStyle]} placeholder={item.inputButtonGroup.input.placeholder} value={item.inputButtonGroup.input.value} onChangeText={item.inputButtonGroup.input.onChangeText} keyboardType={item.inputButtonGroup.input.keyboardType}/>
53
+ <TextInput {...textInputProps} style={[styles.inputtext, inputButtonGroupInputStyle]} placeholder={item.inputButtonGroup.input.placeholder} value={item.inputButtonGroup.input.value} onChangeText={item.inputButtonGroup.input.onChangeText} keyboardType={item.inputButtonGroup.input.keyboardType}/>
54
54
  </View>
55
55
 
56
56
  <View style={{ gap: gap_bwt_keyValue }}>
@@ -58,8 +58,14 @@ export const Form = ({ data, gap_bwt_keyValue = 10, gap_bwt_keys = 12, lableStyl
58
58
  {item.inputButtonGroup.button.header}
59
59
  </Text>
60
60
 
61
- <TouchableOpacity onPress={item.inputButtonGroup.button.onPress} style={[styles.button_container, buttonGroupStyle]}>
62
- <Text style={[styles.button_text, buttonTextStyle]}>
61
+ <TouchableOpacity onPress={item.inputButtonGroup.button.onPress} style={[
62
+ styles.button_container,
63
+ inputButtonGroupButtonStyle,
64
+ ]}>
65
+ <Text style={[
66
+ styles.button_text,
67
+ inputButtonGroupButtonTextStyle,
68
+ ]}>
63
69
  {item.inputButtonGroup.button.label}
64
70
  </Text>
65
71
  </TouchableOpacity>
package/dist/types.d.ts CHANGED
@@ -65,4 +65,8 @@ export type FormProps = {
65
65
  buttonGroupStyle?: ViewStyle;
66
66
  inputTextGroupContainerStyle?: ViewStyle;
67
67
  inputButtonGroupContainerStyle?: ViewStyle;
68
+ inputButtonGroupInputStyle?: ViewStyle;
69
+ inputButtonGroupButtonStyle?: ViewStyle;
70
+ inputButtonGroupButtonTextStyle?: ViewStyle;
71
+ buttonGroupTextStyle?: ViewStyle;
68
72
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hitesh0009/react-native-basic-form",
3
- "version": "1.2.1",
3
+ "version": "1.2.3",
4
4
  "description": "A lightweight, data-driven form renderer for React Native with fully controlled inputs and flexible styling.",
5
5
  "keywords": [
6
6
  "react-native",
package/src/Form.tsx CHANGED
@@ -39,8 +39,12 @@ export const Form: React.FC<FormProps> = ({
39
39
 
40
40
  buttonGroupContainerStyle,
41
41
  buttonGroupStyle,
42
+ buttonGroupTextStyle,
42
43
 
43
44
  inputButtonGroupContainerStyle,
45
+ inputButtonGroupInputStyle,
46
+ inputButtonGroupButtonStyle,
47
+ inputButtonGroupButtonTextStyle,
44
48
  }) => {
45
49
  return (
46
50
  <View style={[{ gap: 20 }, containerStyle]}>
@@ -127,7 +131,7 @@ export const Form: React.FC<FormProps> = ({
127
131
  onPress={btn.onPress}
128
132
  style={[styles.button_container, buttonGroupStyle]}
129
133
  >
130
- <Text style={[styles.button_text, buttonTextStyle]}>
134
+ <Text style={[styles.button_text, buttonGroupTextStyle]}>
131
135
  {btn.label}
132
136
  </Text>
133
137
  </TouchableOpacity>
@@ -142,14 +146,16 @@ export const Form: React.FC<FormProps> = ({
142
146
  inputButtonGroupContainerStyle,
143
147
  ]}
144
148
  >
145
- <View style={[inputTextContainerStyle,{gap:gap_bwt_keyValue}]}>
149
+ <View
150
+ style={[inputTextContainerStyle, { gap: gap_bwt_keyValue }]}
151
+ >
146
152
  <Text style={[styles.lable, lableStyle]}>
147
153
  {item.inputButtonGroup.input.header}
148
154
  </Text>
149
155
 
150
156
  <TextInput
151
157
  {...textInputProps}
152
- style={[styles.inputtext, inputTextStyle]}
158
+ style={[styles.inputtext, inputButtonGroupInputStyle]}
153
159
  placeholder={item.inputButtonGroup.input.placeholder}
154
160
  value={item.inputButtonGroup.input.value}
155
161
  onChangeText={item.inputButtonGroup.input.onChangeText}
@@ -157,16 +163,24 @@ export const Form: React.FC<FormProps> = ({
157
163
  />
158
164
  </View>
159
165
 
160
- <View style={{gap:gap_bwt_keyValue}}>
166
+ <View style={{ gap: gap_bwt_keyValue }}>
161
167
  <Text style={[styles.lable, lableStyle]}>
162
168
  {item.inputButtonGroup.button.header}
163
169
  </Text>
164
170
 
165
171
  <TouchableOpacity
166
172
  onPress={item.inputButtonGroup.button.onPress}
167
- style={[styles.button_container, buttonGroupStyle]}
173
+ style={[
174
+ styles.button_container,
175
+ inputButtonGroupButtonStyle,
176
+ ]}
168
177
  >
169
- <Text style={[styles.button_text, buttonTextStyle]}>
178
+ <Text
179
+ style={[
180
+ styles.button_text,
181
+ inputButtonGroupButtonTextStyle,
182
+ ]}
183
+ >
170
184
  {item.inputButtonGroup.button.label}
171
185
  </Text>
172
186
  </TouchableOpacity>
package/src/types.ts CHANGED
@@ -88,4 +88,8 @@ export type FormProps = {
88
88
  buttonGroupStyle?: ViewStyle;
89
89
  inputTextGroupContainerStyle?: ViewStyle;
90
90
  inputButtonGroupContainerStyle?: ViewStyle;
91
+ inputButtonGroupInputStyle?:ViewStyle,
92
+ inputButtonGroupButtonStyle?:ViewStyle,
93
+ inputButtonGroupButtonTextStyle?:ViewStyle
94
+ buttonGroupTextStyle?:ViewStyle
91
95
  };