react-native-input-select 0.34.0 → 1.1.0
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/README.md +103 -30
- package/lib/commonjs/components/CheckBox/index.js +16 -13
- package/lib/commonjs/components/CheckBox/index.js.map +1 -1
- package/lib/commonjs/components/CheckBox/types.js.map +1 -1
- package/lib/commonjs/components/CustomModal/index.js +1 -9
- package/lib/commonjs/components/CustomModal/index.js.map +1 -1
- package/lib/commonjs/components/Dropdown/Dropdown.js +0 -9
- package/lib/commonjs/components/Dropdown/Dropdown.js.map +1 -1
- package/lib/commonjs/components/Dropdown/{DropdownList.js → DropdownFlatList.js} +22 -32
- package/lib/commonjs/components/Dropdown/DropdownFlatList.js.map +1 -0
- package/lib/commonjs/components/Dropdown/DropdownListItem.js +11 -22
- package/lib/commonjs/components/Dropdown/DropdownListItem.js.map +1 -1
- package/lib/commonjs/components/Dropdown/DropdownSectionList.js +139 -0
- package/lib/commonjs/components/Dropdown/DropdownSectionList.js.map +1 -0
- package/lib/commonjs/components/Dropdown/DropdownSelectedItemsView.js +10 -22
- package/lib/commonjs/components/Dropdown/DropdownSelectedItemsView.js.map +1 -1
- package/lib/commonjs/components/Input/index.js +4 -11
- package/lib/commonjs/components/Input/index.js.map +1 -1
- package/lib/commonjs/components/Others/index.js +93 -0
- package/lib/commonjs/components/Others/index.js.map +1 -0
- package/lib/commonjs/constants/index.js.map +1 -1
- package/lib/commonjs/index.js +73 -59
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/styles/colors.js.map +1 -1
- package/lib/commonjs/styles/input.js +0 -4
- package/lib/commonjs/styles/input.js.map +1 -1
- package/lib/commonjs/styles/typography.js +0 -3
- package/lib/commonjs/styles/typography.js.map +1 -1
- package/lib/commonjs/types/index.types.js.map +1 -1
- package/lib/commonjs/utils/index.js +26 -0
- package/lib/commonjs/utils/index.js.map +1 -0
- package/lib/module/components/CheckBox/index.js +14 -6
- package/lib/module/components/CheckBox/index.js.map +1 -1
- package/lib/module/components/CheckBox/types.js.map +1 -1
- package/lib/module/components/CustomModal/index.js +1 -4
- package/lib/module/components/CustomModal/index.js.map +1 -1
- package/lib/module/components/Dropdown/Dropdown.js +0 -2
- package/lib/module/components/Dropdown/Dropdown.js.map +1 -1
- package/lib/module/components/Dropdown/{DropdownList.js → DropdownFlatList.js} +23 -27
- package/lib/module/components/Dropdown/DropdownFlatList.js.map +1 -0
- package/lib/module/components/Dropdown/DropdownListItem.js +11 -14
- package/lib/module/components/Dropdown/DropdownListItem.js.map +1 -1
- package/lib/module/components/Dropdown/DropdownSectionList.js +130 -0
- package/lib/module/components/Dropdown/DropdownSectionList.js.map +1 -0
- package/lib/module/components/Dropdown/DropdownSelectedItemsView.js +11 -17
- package/lib/module/components/Dropdown/DropdownSelectedItemsView.js.map +1 -1
- package/lib/module/components/Input/index.js +2 -2
- package/lib/module/components/Input/index.js.map +1 -1
- package/lib/module/components/Others/index.js +82 -0
- package/lib/module/components/Others/index.js.map +1 -0
- package/lib/module/constants/index.js.map +1 -1
- package/lib/module/index.js +72 -42
- package/lib/module/index.js.map +1 -1
- package/lib/module/styles/colors.js.map +1 -1
- package/lib/module/styles/input.js.map +1 -1
- package/lib/module/styles/typography.js.map +1 -1
- package/lib/module/types/index.types.js.map +1 -1
- package/lib/module/utils/index.js +18 -0
- package/lib/module/utils/index.js.map +1 -0
- package/lib/typescript/components/CheckBox/index.d.ts +6 -1
- package/lib/typescript/components/CheckBox/types.d.ts +6 -1
- package/lib/typescript/components/Dropdown/DropdownFlatList.d.ts +3 -0
- package/lib/typescript/components/Dropdown/DropdownListItem.d.ts +1 -1
- package/lib/typescript/components/Dropdown/DropdownSectionList.d.ts +3 -0
- package/lib/typescript/components/Input/index.d.ts +1 -0
- package/lib/typescript/components/Others/index.d.ts +14 -0
- package/lib/typescript/types/index.types.d.ts +24 -5
- package/lib/typescript/utils/index.d.ts +6 -0
- package/package.json +2 -2
- package/src/components/CheckBox/index.tsx +34 -5
- package/src/components/CheckBox/types.ts +5 -0
- package/src/components/Dropdown/{DropdownList.tsx → DropdownFlatList.tsx} +22 -20
- package/src/components/Dropdown/DropdownListItem.tsx +13 -11
- package/src/components/Dropdown/DropdownSectionList.tsx +135 -0
- package/src/components/Dropdown/DropdownSelectedItemsView.tsx +16 -28
- package/src/components/Input/index.tsx +2 -0
- package/src/components/Others/index.tsx +91 -0
- package/src/index.tsx +114 -41
- package/src/types/index.types.ts +22 -4
- package/src/utils/index.ts +25 -0
- package/lib/commonjs/components/Dropdown/DropdownList.js.map +0 -1
- package/lib/module/components/Dropdown/DropdownList.js.map +0 -1
- package/lib/typescript/components/Dropdown/DropdownList.d.ts +0 -3
package/README.md
CHANGED
|
@@ -32,18 +32,12 @@ export default function App() {
|
|
|
32
32
|
label="Country"
|
|
33
33
|
placeholder="Select an option..."
|
|
34
34
|
options={[
|
|
35
|
-
{
|
|
36
|
-
{
|
|
37
|
-
{
|
|
38
|
-
{
|
|
39
|
-
{
|
|
40
|
-
{ name: 'Angola', code: 'AO' },
|
|
41
|
-
{ name: 'Anguilla', code: 'AI' },
|
|
42
|
-
{ name: 'Antarctica', code: 'AQ' },
|
|
43
|
-
{ name: 'Antigua and Barbuda', code: 'AG' },
|
|
35
|
+
{ label: 'Nigeria', value: 'NG' },
|
|
36
|
+
{ label: 'Åland Islands', value: 'AX' },
|
|
37
|
+
{ label: 'Algeria', value: 'DZ' },
|
|
38
|
+
{ label: 'American Samoa', value: 'AS' },
|
|
39
|
+
{ label: 'Andorra', value: 'AD' },
|
|
44
40
|
]}
|
|
45
|
-
optionLabel={'name'}
|
|
46
|
-
optionValue={'code'}
|
|
47
41
|
selectedValue={country}
|
|
48
42
|
onValueChange={(value) => setCountry(value)}
|
|
49
43
|
primaryColor={'green'}
|
|
@@ -52,7 +46,7 @@ export default function App() {
|
|
|
52
46
|
}
|
|
53
47
|
```
|
|
54
48
|
|
|
55
|
-
## Advanced Usage
|
|
49
|
+
## Advanced Usage With Flat List
|
|
56
50
|
|
|
57
51
|
```js
|
|
58
52
|
import React from 'react';
|
|
@@ -66,7 +60,17 @@ export default function App() {
|
|
|
66
60
|
<Dropdown
|
|
67
61
|
label="Customized components in list"
|
|
68
62
|
placeholder="Select multiple options..."
|
|
69
|
-
options={
|
|
63
|
+
options={[
|
|
64
|
+
{ name: 'Albania', code: 'AL' },
|
|
65
|
+
{ name: 'Nigeria', code: 'NG' },
|
|
66
|
+
{ name: 'Algeria', code: 'DZ' },
|
|
67
|
+
{ name: 'American Samoa', code: 'AS' },
|
|
68
|
+
{ name: 'Andorra', code: 'AD' },
|
|
69
|
+
{ name: 'Angola', code: 'AO' },
|
|
70
|
+
{ name: 'Anguilla', code: 'AI' },
|
|
71
|
+
{ name: 'Antarctica', code: 'AQ' },
|
|
72
|
+
{ name: 'Antigua and Barbuda', code: 'AG' },
|
|
73
|
+
]}
|
|
70
74
|
optionLabel={'name'}
|
|
71
75
|
optionValue={'code'}
|
|
72
76
|
selectedValue={country}
|
|
@@ -90,13 +94,16 @@ export default function App() {
|
|
|
90
94
|
backgroundColor: 'rgba(196, 198, 246, 0.5)',
|
|
91
95
|
}}
|
|
92
96
|
helperText="The placeholder has been styled"
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
97
|
+
checkboxComponentStyles={{
|
|
98
|
+
checkboxSize: 20,
|
|
99
|
+
checkboxStyle: {
|
|
100
|
+
backgroundColor: 'purple',
|
|
101
|
+
borderRadius: 30, // To get a circle - add the checkboxSize and the padding size
|
|
102
|
+
padding: 10,
|
|
103
|
+
borderColor: 'blue',
|
|
104
|
+
},
|
|
105
|
+
checkboxLabelStyle: { color: 'red', fontSize: 20 },
|
|
98
106
|
}}
|
|
99
|
-
checkboxLabelStyle={{ color: 'red', fontSize: 30 }}
|
|
100
107
|
dropdownIcon={
|
|
101
108
|
<Image
|
|
102
109
|
style={styles.tinyLogo}
|
|
@@ -153,14 +160,61 @@ const styles = StyleSheet.create({
|
|
|
153
160
|
});
|
|
154
161
|
```
|
|
155
162
|
|
|
163
|
+
## Advanced Usage with Section List
|
|
164
|
+
|
|
165
|
+
```js
|
|
166
|
+
<DropdownSelect
|
|
167
|
+
label="Menu"
|
|
168
|
+
placeholder="Select multiple dishes..."
|
|
169
|
+
options={[
|
|
170
|
+
{
|
|
171
|
+
title: 'Main dishes',
|
|
172
|
+
data: [
|
|
173
|
+
{ label: 'Pizza', value: 'A' },
|
|
174
|
+
{ label: 'Burger', value: 'B' },
|
|
175
|
+
{ label: 'Risotto', value: 'C' },
|
|
176
|
+
],
|
|
177
|
+
},
|
|
178
|
+
{
|
|
179
|
+
title: 'Sides',
|
|
180
|
+
data: [
|
|
181
|
+
{ label: 'Ice cream', value: 'D' },
|
|
182
|
+
{ label: 'Cheesecake', value: 'E' },
|
|
183
|
+
],
|
|
184
|
+
},
|
|
185
|
+
{
|
|
186
|
+
title: 'Drinks',
|
|
187
|
+
data: [
|
|
188
|
+
{ label: 'Water', value: 'F' },
|
|
189
|
+
{ label: 'Coke', value: 'G' },
|
|
190
|
+
{ label: 'Juice', value: 'H' },
|
|
191
|
+
],
|
|
192
|
+
},
|
|
193
|
+
]}
|
|
194
|
+
selectedValue={menu}
|
|
195
|
+
onValueChange={(itemValue: any) => setMenu(itemValue)}
|
|
196
|
+
isMultiple
|
|
197
|
+
isSearchable
|
|
198
|
+
primaryColor={'deepskyblue'}
|
|
199
|
+
listComponentStyles={{
|
|
200
|
+
sectionHeaderStyle: {
|
|
201
|
+
padding: 10,
|
|
202
|
+
backgroundColor: 'green',
|
|
203
|
+
color: 'white',
|
|
204
|
+
width: '30%',
|
|
205
|
+
},
|
|
206
|
+
}}
|
|
207
|
+
/>
|
|
208
|
+
```
|
|
209
|
+
|
|
156
210
|
For more examples visit our [wiki page](https://github.com/azeezat/react-native-select/wiki)
|
|
157
211
|
|
|
158
212
|
# iOS
|
|
159
213
|
|
|
160
|
-
|
|
|
161
|
-
|
|
|
162
|
-
| <img width="529" alt="Screenshot 2023-
|
|
163
|
-
| <img width="529" alt="Screenshot 2023-
|
|
214
|
+
| | | |
|
|
215
|
+
| :-------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------: |
|
|
216
|
+
| <img width="529" alt="Screenshot 2023-07-08 at 12 34 23 AM" src="https://github.com/azeezat/react-native-select/assets/9849221/5bf518bc-573e-4db8-90ec-7ad061e4f3d7"> | <img width="499" alt="Screenshot 2023-07-08 at 12 39 51 AM" src="https://github.com/azeezat/react-native-select/assets/9849221/9d42460f-e4ec-48d0-960d-bb3bcd76331e"> | <img width="529" alt="Screenshot 2023-07-08 at 12 29 16 AM" src="https://github.com/azeezat/react-native-select/assets/9849221/81bde8f7-b88b-4c11-bd3e-33ff2dbb0628"> |
|
|
217
|
+
| <img width="529" alt="Screenshot 2023-07-08 at 12 28 57 AM" src="https://github.com/azeezat/react-native-select/assets/9849221/46627375-cb28-4ae1-827f-a0ba84817faa"> | <img width="529" alt="Screenshot 2023-07-08 at 12 20 52 AM" src="https://github.com/azeezat/react-native-select/assets/9849221/bf42254d-3c3d-4f0f-9730-a6263136f78e"> | <img width="529" alt="Screenshot 2023-07-08 at 12 21 06 AM" src="https://github.com/azeezat/react-native-select/assets/9849221/a572d625-dc65-4bf3-8b07-0e057cc8739b"> |
|
|
164
218
|
|
|
165
219
|
# Android
|
|
166
220
|
|
|
@@ -200,12 +254,31 @@ For more examples visit our [wiki page](https://github.com/azeezat/react-native-
|
|
|
200
254
|
| dropdownErrorTextStyle | `Object` | `{color: 'red', fontWeight:'500'}` |
|
|
201
255
|
| dropdownHelperTextStyle | `Object` | `{color: 'green', fontWeight:'500'}` |
|
|
202
256
|
| primaryColor | `string` | `blue` |
|
|
203
|
-
|
|
|
204
|
-
|
|
|
205
|
-
|
|
|
206
|
-
|
|
|
207
|
-
|
|
|
208
|
-
|
|
257
|
+
| listHeaderComponent | `React Component` | `<Text> You can add any component here </Text>` |
|
|
258
|
+
| listFooterComponent | `React Component` | `<Text> You can add any component here <Text>` |
|
|
259
|
+
| hideModal | `Boolean` | Use this to hide the modal as needed |
|
|
260
|
+
| listComponentStyles | `Object` | `{listEmptyComponentStyle: ViewStyle, itemSeparatorStyle: ViewStyle, sectionHeaderStyle: TextStyle}` |
|
|
261
|
+
| checkboxComponentStyles | `Object` | `{checkboxSize?: number, checkboxStyle?: ViewStyle, checkboxLabelStyle: TextStyle}` |
|
|
262
|
+
|
|
263
|
+
|
|
264
|
+
## Deprecation Notice
|
|
265
|
+
|
|
266
|
+
The following props would be removed in coming releases.
|
|
267
|
+
|
|
268
|
+
- Individual props `checkboxSize`, `checkboxStyle`, `checkboxLabelStyle` would be replaced with a single object `checkboxComponentStyles` e.g
|
|
269
|
+
|
|
270
|
+
```js
|
|
271
|
+
const checkboxComponentStyles = {
|
|
272
|
+
checkboxSize: 20,
|
|
273
|
+
checkboxStyle: {
|
|
274
|
+
backgroundColor: 'purple',
|
|
275
|
+
borderRadius: 30,
|
|
276
|
+
padding: 10,
|
|
277
|
+
borderColor: 'red',
|
|
278
|
+
},
|
|
279
|
+
checkboxLabelStyle: { color: 'red', fontSize: 20 },
|
|
280
|
+
};
|
|
281
|
+
```
|
|
209
282
|
|
|
210
283
|
## Contributing
|
|
211
284
|
|
|
@@ -223,4 +296,4 @@ MIT
|
|
|
223
296
|
|
|
224
297
|
# Video Demo
|
|
225
298
|
|
|
226
|
-
https://
|
|
299
|
+
https://github.com/azeezat/react-native-select/assets/9849221/194bf5cf-1a2d-4ca6-9585-05d6bb987aba
|
|
@@ -4,19 +4,21 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
8
|
var _reactNative = require("react-native");
|
|
11
|
-
|
|
12
9
|
var _colors = require("../../styles/colors");
|
|
13
|
-
|
|
14
10
|
var _constants = require("../../constants");
|
|
15
|
-
|
|
16
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
-
|
|
18
12
|
/* eslint-disable react-native/no-inline-styles */
|
|
13
|
+
|
|
14
|
+
/**
|
|
15
|
+
*
|
|
16
|
+
*`checkboxSize`, `checkboxStyle`,`checkboxLabelStyle` Will be deleted in version 1.0.
|
|
17
|
+
* and replaced with `checkboxComponentStyles`
|
|
18
|
+
*/
|
|
19
|
+
|
|
19
20
|
const CheckBox = _ref => {
|
|
21
|
+
var _checkboxComponentSty, _checkboxComponentSty2;
|
|
20
22
|
let {
|
|
21
23
|
label,
|
|
22
24
|
value,
|
|
@@ -25,11 +27,14 @@ const CheckBox = _ref => {
|
|
|
25
27
|
checkboxSize,
|
|
26
28
|
checkboxStyle,
|
|
27
29
|
checkboxLabelStyle,
|
|
30
|
+
checkboxComponentStyles,
|
|
28
31
|
onChange
|
|
29
32
|
} = _ref;
|
|
33
|
+
// const { checkboxSize, checkboxStyle, checkboxLabelStyle } =
|
|
34
|
+
// checkboxComponentStyles;
|
|
30
35
|
const fillColor = {
|
|
31
|
-
backgroundColor: disabled ? '#d3d3d3' : value ? (checkboxStyle === null || checkboxStyle === void 0 ? void 0 : checkboxStyle.backgroundColor) || primaryColor || 'green' : 'white',
|
|
32
|
-
borderColor: disabled ? _colors.colors.disabled : styles.checkbox.borderColor
|
|
36
|
+
backgroundColor: disabled ? '#d3d3d3' : value ? (checkboxComponentStyles === null || checkboxComponentStyles === void 0 || (_checkboxComponentSty = checkboxComponentStyles.checkboxStyle) === null || _checkboxComponentSty === void 0 ? void 0 : _checkboxComponentSty.backgroundColor) || (checkboxStyle === null || checkboxStyle === void 0 ? void 0 : checkboxStyle.backgroundColor) || primaryColor || 'green' : 'white',
|
|
37
|
+
borderColor: disabled ? _colors.colors.disabled : (checkboxComponentStyles === null || checkboxComponentStyles === void 0 || (_checkboxComponentSty2 = checkboxComponentStyles.checkboxStyle) === null || _checkboxComponentSty2 === void 0 ? void 0 : _checkboxComponentSty2.borderColor) || (checkboxStyle === null || checkboxStyle === void 0 ? void 0 : checkboxStyle.borderColor) || styles.checkbox.borderColor
|
|
33
38
|
};
|
|
34
39
|
return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, {
|
|
35
40
|
onPress: onChange ? () => onChange(!value) : null,
|
|
@@ -40,14 +45,13 @@ const CheckBox = _ref => {
|
|
|
40
45
|
}, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
|
|
41
46
|
source: require('../../asset/check.png'),
|
|
42
47
|
style: [{
|
|
43
|
-
height: checkboxSize || _constants.CHECKBOX_SIZE,
|
|
44
|
-
width: checkboxSize || _constants.CHECKBOX_SIZE
|
|
48
|
+
height: (checkboxComponentStyles === null || checkboxComponentStyles === void 0 ? void 0 : checkboxComponentStyles.checkboxSize) || checkboxSize || _constants.CHECKBOX_SIZE,
|
|
49
|
+
width: (checkboxComponentStyles === null || checkboxComponentStyles === void 0 ? void 0 : checkboxComponentStyles.checkboxSize) || checkboxSize || _constants.CHECKBOX_SIZE
|
|
45
50
|
}]
|
|
46
51
|
})), label && /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
47
|
-
style: [checkboxLabelStyle, styles.labelStyle]
|
|
52
|
+
style: [(checkboxComponentStyles === null || checkboxComponentStyles === void 0 ? void 0 : checkboxComponentStyles.checkboxLabelStyle) || checkboxLabelStyle, styles.labelStyle]
|
|
48
53
|
}, label));
|
|
49
54
|
};
|
|
50
|
-
|
|
51
55
|
const styles = _reactNative.StyleSheet.create({
|
|
52
56
|
checkboxContainer: {
|
|
53
57
|
flexDirection: 'row',
|
|
@@ -65,7 +69,6 @@ const styles = _reactNative.StyleSheet.create({
|
|
|
65
69
|
marginLeft: 10
|
|
66
70
|
}
|
|
67
71
|
});
|
|
68
|
-
|
|
69
72
|
var _default = CheckBox;
|
|
70
73
|
exports.default = _default;
|
|
71
74
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_colors","_constants","obj","__esModule","default","CheckBox","_ref","_checkboxComponentSty","_checkboxComponentSty2","label","value","disabled","primaryColor","checkboxSize","checkboxStyle","checkboxLabelStyle","checkboxComponentStyles","onChange","fillColor","backgroundColor","borderColor","colors","styles","checkbox","createElement","Pressable","onPress","style","checkboxContainer","View","Image","source","height","CHECKBOX_SIZE","width","Text","labelStyle","StyleSheet","create","flexDirection","flexWrap","alignItems","padding","borderWidth","borderStyle","borderRadius","marginLeft","_default","exports"],"sources":["index.tsx"],"sourcesContent":["/* eslint-disable react-native/no-inline-styles */\nimport React from 'react';\nimport { Pressable, Text, StyleSheet, Image, View } from 'react-native';\nimport { colors } from '../../styles/colors';\nimport { CHECKBOX_SIZE } from '../../constants';\nimport type { CheckboxProps } from './types';\n\n/**\n *\n *`checkboxSize`, `checkboxStyle`,`checkboxLabelStyle` Will be deleted in version 1.0.\n * and replaced with `checkboxComponentStyles`\n */\n\nconst CheckBox = ({\n label,\n value,\n disabled,\n primaryColor,\n checkboxSize,\n checkboxStyle,\n checkboxLabelStyle,\n checkboxComponentStyles,\n onChange,\n}: CheckboxProps) => {\n // const { checkboxSize, checkboxStyle, checkboxLabelStyle } =\n // checkboxComponentStyles;\n const fillColor = {\n backgroundColor: disabled\n ? '#d3d3d3'\n : value\n ? checkboxComponentStyles?.checkboxStyle?.backgroundColor ||\n checkboxStyle?.backgroundColor ||\n primaryColor ||\n 'green'\n : 'white',\n borderColor: disabled\n ? colors.disabled\n : checkboxComponentStyles?.checkboxStyle?.borderColor ||\n checkboxStyle?.borderColor ||\n styles.checkbox.borderColor,\n };\n\n return (\n <Pressable\n onPress={onChange ? () => onChange(!value) : null}\n style={[styles.checkboxContainer]}\n disabled={disabled}\n >\n <View style={[styles.checkbox, checkboxStyle, fillColor]}>\n <Image\n source={require('../../asset/check.png')}\n style={[\n {\n height:\n checkboxComponentStyles?.checkboxSize ||\n checkboxSize ||\n CHECKBOX_SIZE,\n width:\n checkboxComponentStyles?.checkboxSize ||\n checkboxSize ||\n CHECKBOX_SIZE,\n },\n ]}\n />\n </View>\n {label && (\n <Text\n style={[\n checkboxComponentStyles?.checkboxLabelStyle || checkboxLabelStyle,\n styles.labelStyle,\n ]}\n >\n {label}\n </Text>\n )}\n </Pressable>\n );\n};\n\nconst styles = StyleSheet.create({\n checkboxContainer: {\n flexDirection: 'row',\n flexWrap: 'nowrap',\n alignItems: 'center',\n },\n checkbox: {\n padding: 4,\n borderWidth: 1,\n borderStyle: 'solid',\n borderRadius: 4,\n borderColor: 'black',\n },\n labelStyle: { marginLeft: 10 },\n});\n\nexport default CheckBox;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type { ColorValue, ViewStyle, TextStyle } from 'react-native';\n\nexport type CheckboxProps = {\n label?: string;\n value?: boolean;\n disabled?: boolean;\n primaryColor?: ColorValue;\n checkboxSize?: number;\n checkboxStyle?: ViewStyle;\n checkboxLabelStyle?: TextStyle;\n checkboxComponentStyles?: {\n checkboxSize?: number;\n checkboxStyle?: ViewStyle;\n checkboxLabelStyle?: TextStyle;\n };\n onChange?: (value: boolean | string | number) => void;\n};\n"],"mappings":""}
|
|
@@ -4,17 +4,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
8
|
var _reactNative = require("react-native");
|
|
11
|
-
|
|
12
9
|
var _colors = require("../../styles/colors");
|
|
13
|
-
|
|
14
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
|
|
16
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
17
|
-
|
|
11
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
18
12
|
const CustomModal = _ref => {
|
|
19
13
|
let {
|
|
20
14
|
open,
|
|
@@ -37,7 +31,6 @@ const CustomModal = _ref => {
|
|
|
37
31
|
style: [styles.modalOptionsContainer, modalOptionsContainerStyle]
|
|
38
32
|
}, children)));
|
|
39
33
|
};
|
|
40
|
-
|
|
41
34
|
const styles = _reactNative.StyleSheet.create({
|
|
42
35
|
modalContainer: {
|
|
43
36
|
flex: 1,
|
|
@@ -53,7 +46,6 @@ const styles = _reactNative.StyleSheet.create({
|
|
|
53
46
|
borderTopRightRadius: 16
|
|
54
47
|
}
|
|
55
48
|
});
|
|
56
|
-
|
|
57
49
|
var _default = CustomModal;
|
|
58
50
|
exports.default = _default;
|
|
59
51
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_colors","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","CustomModal","_ref","open","handleToggleModal","onRequestClose","modalBackgroundStyle","modalOptionsContainerStyle","modalProps","children","createElement","Modal","transparent","visible","animationType","TouchableOpacity","onPress","style","styles","modalContainer","SafeAreaView","modalOptionsContainer","StyleSheet","create","flex","justifyContent","backgroundColor","maxHeight","colors","white","borderTopLeftRadius","borderTopRightRadius","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport {\n Modal,\n TouchableOpacity,\n SafeAreaView,\n StyleSheet,\n} from 'react-native';\nimport { colors } from '../../styles/colors';\n\nconst CustomModal = ({\n open,\n handleToggleModal,\n onRequestClose,\n modalBackgroundStyle,\n modalOptionsContainerStyle,\n modalProps,\n children,\n}: any) => {\n return (\n <Modal\n transparent={true}\n visible={open}\n onRequestClose={() => onRequestClose()}\n animationType=\"fade\"\n {...modalProps}\n >\n <TouchableOpacity\n onPress={() => handleToggleModal()}\n style={[\n styles.modalContainer,\n styles.modalBackgroundStyle,\n modalBackgroundStyle,\n ]}\n >\n <SafeAreaView\n style={[styles.modalOptionsContainer, modalOptionsContainerStyle]}\n >\n {children}\n </SafeAreaView>\n </TouchableOpacity>\n </Modal>\n );\n};\n\nconst styles = StyleSheet.create({\n modalContainer: {\n flex: 1,\n justifyContent: 'flex-end',\n },\n modalBackgroundStyle: { backgroundColor: 'rgba(0, 0, 0, 0.5)' },\n modalOptionsContainer: {\n maxHeight: '50%',\n backgroundColor: colors.white,\n borderTopLeftRadius: 16,\n borderTopRightRadius: 16,\n },\n});\n\nexport default CustomModal;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAMA,IAAAE,OAAA,GAAAF,OAAA;AAA6C,SAAAD,uBAAAI,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAE7C,MAAMQ,WAAW,GAAGC,IAAA,IAQT;EAAA,IARU;IACnBC,IAAI;IACJC,iBAAiB;IACjBC,cAAc;IACdC,oBAAoB;IACpBC,0BAA0B;IAC1BC,UAAU;IACVC;EACG,CAAC,GAAAP,IAAA;EACJ,oBACEvB,MAAA,CAAAO,OAAA,CAAAwB,aAAA,CAAC5B,YAAA,CAAA6B,KAAK,EAAAxB,QAAA;IACJyB,WAAW,EAAE,IAAK;IAClBC,OAAO,EAAEV,IAAK;IACdE,cAAc,EAAEA,CAAA,KAAMA,cAAc,CAAC,CAAE;IACvCS,aAAa,EAAC;EAAM,GAChBN,UAAU,gBAEd7B,MAAA,CAAAO,OAAA,CAAAwB,aAAA,CAAC5B,YAAA,CAAAiC,gBAAgB;IACfC,OAAO,EAAEA,CAAA,KAAMZ,iBAAiB,CAAC,CAAE;IACnCa,KAAK,EAAE,CACLC,MAAM,CAACC,cAAc,EACrBD,MAAM,CAACZ,oBAAoB,EAC3BA,oBAAoB;EACpB,gBAEF3B,MAAA,CAAAO,OAAA,CAAAwB,aAAA,CAAC5B,YAAA,CAAAsC,YAAY;IACXH,KAAK,EAAE,CAACC,MAAM,CAACG,qBAAqB,EAAEd,0BAA0B;EAAE,GAEjEE,QACW,CACE,CACb,CAAC;AAEZ,CAAC;AAED,MAAMS,MAAM,GAAGI,uBAAU,CAACC,MAAM,CAAC;EAC/BJ,cAAc,EAAE;IACdK,IAAI,EAAE,CAAC;IACPC,cAAc,EAAE;EAClB,CAAC;EACDnB,oBAAoB,EAAE;IAAEoB,eAAe,EAAE;EAAqB,CAAC;EAC/DL,qBAAqB,EAAE;IACrBM,SAAS,EAAE,KAAK;IAChBD,eAAe,EAAEE,cAAM,CAACC,KAAK;IAC7BC,mBAAmB,EAAE,EAAE;IACvBC,oBAAoB,EAAE;EACxB;AACF,CAAC,CAAC;AAAC,IAAAC,QAAA,GAEY/B,WAAW;AAAAgC,OAAA,CAAA/C,OAAA,GAAA8C,QAAA"}
|
|
@@ -4,19 +4,12 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
8
|
var _reactNative = require("react-native");
|
|
11
|
-
|
|
12
9
|
var _DropdownSelectedItemsView = _interopRequireDefault(require("./DropdownSelectedItemsView"));
|
|
13
|
-
|
|
14
10
|
var _colors = require("../../styles/colors");
|
|
15
|
-
|
|
16
11
|
var _typography = require("../../styles/typography");
|
|
17
|
-
|
|
18
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
|
-
|
|
20
13
|
const Dropdown = _ref => {
|
|
21
14
|
let {
|
|
22
15
|
label,
|
|
@@ -69,7 +62,6 @@ const Dropdown = _ref => {
|
|
|
69
62
|
style: [styles.helper, dropdownHelperTextStyle]
|
|
70
63
|
}, helperText));
|
|
71
64
|
};
|
|
72
|
-
|
|
73
65
|
const styles = _reactNative.StyleSheet.create({
|
|
74
66
|
label: {
|
|
75
67
|
marginBottom: 16,
|
|
@@ -94,7 +86,6 @@ const styles = _reactNative.StyleSheet.create({
|
|
|
94
86
|
color: _colors.colors.black
|
|
95
87
|
}
|
|
96
88
|
});
|
|
97
|
-
|
|
98
89
|
var _default = Dropdown;
|
|
99
90
|
exports.default = _default;
|
|
100
91
|
//# sourceMappingURL=Dropdown.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_DropdownSelectedItemsView","_colors","_typography","obj","__esModule","default","Dropdown","_ref","label","placeholder","helperText","error","getSelectedItemsLabel","handleToggleModal","isMultiple","selectedItem","selectedItems","dropdownIcon","labelStyle","dropdownStyle","dropdownIconStyle","dropdownContainerStyle","selectedItemStyle","placeholderStyle","multipleSelectedItemStyle","dropdownErrorStyle","dropdownErrorTextStyle","dropdownHelperTextStyle","primaryColor","disabled","createElement","View","style","styles","dropdownInputContainer","Text","helper","StyleSheet","create","marginBottom","color","colors","gray","typography","caption","red","marginTop","primary","width","blackText","black","_default","exports"],"sources":["Dropdown.tsx"],"sourcesContent":["import React from 'react';\nimport { View, Text, StyleSheet } from 'react-native';\nimport DropdownSelectedItemsView from './DropdownSelectedItemsView';\nimport { colors } from '../../styles/colors';\nimport { typography } from '../../styles/typography';\n\nconst Dropdown = ({\n label,\n placeholder,\n helperText,\n error,\n getSelectedItemsLabel,\n handleToggleModal,\n isMultiple,\n selectedItem,\n selectedItems,\n dropdownIcon,\n labelStyle,\n dropdownStyle,\n dropdownIconStyle,\n dropdownContainerStyle,\n selectedItemStyle,\n placeholderStyle,\n multipleSelectedItemStyle,\n dropdownErrorStyle,\n dropdownErrorTextStyle,\n dropdownHelperTextStyle,\n primaryColor,\n disabled,\n}: any) => {\n return (\n <View style={[styles.dropdownInputContainer, dropdownContainerStyle]}>\n {label && label !== '' && (\n <Text style={[styles.label, labelStyle]}>{label}</Text>\n )}\n <DropdownSelectedItemsView\n placeholder={placeholder}\n error={error}\n getSelectedItemsLabel={getSelectedItemsLabel}\n handleToggleModal={handleToggleModal}\n isMultiple={isMultiple}\n selectedItem={selectedItem}\n selectedItems={selectedItems}\n dropdownIcon={dropdownIcon}\n dropdownStyle={dropdownStyle}\n dropdownIconStyle={dropdownIconStyle}\n selectedItemStyle={selectedItemStyle}\n multipleSelectedItemStyle={multipleSelectedItemStyle}\n dropdownErrorStyle={dropdownErrorStyle}\n primaryColor={primaryColor}\n disabled={disabled}\n placeholderStyle={placeholderStyle}\n />\n\n {error && error !== '' && (\n <Text style={[styles.error, dropdownErrorTextStyle]}>{error}</Text>\n )}\n\n {helperText && helperText !== '' && !error && (\n <Text style={[styles.helper, dropdownHelperTextStyle]}>\n {helperText}\n </Text>\n )}\n </View>\n );\n};\n\nconst styles = StyleSheet.create({\n label: { marginBottom: 16, color: colors.gray, ...typography.caption },\n error: { color: colors.red, marginTop: 8, ...typography.caption },\n helper: { marginTop: 8, color: colors.primary, ...typography.caption },\n dropdownInputContainer: { marginBottom: 23, width: '100%' },\n blackText: { color: colors.black },\n});\n\nexport default Dropdown;\n"],"mappings":"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"}
|
|
@@ -4,20 +4,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
8
|
var _reactNative = require("react-native");
|
|
11
|
-
|
|
12
9
|
var _DropdownListItem = _interopRequireDefault(require("./DropdownListItem"));
|
|
13
|
-
|
|
14
|
-
var _colors = require("../../styles/colors");
|
|
15
|
-
|
|
10
|
+
var _Others = require("../Others");
|
|
16
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
const DropdownList = _ref => {
|
|
12
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } /* eslint-disable react-native/no-inline-styles */
|
|
13
|
+
const DropdownFlatList = _ref => {
|
|
21
14
|
let {
|
|
22
15
|
options,
|
|
23
16
|
optionLabel,
|
|
@@ -30,22 +23,27 @@ const DropdownList = _ref => {
|
|
|
30
23
|
handleSingleSelection,
|
|
31
24
|
primaryColor,
|
|
32
25
|
checkboxSize,
|
|
26
|
+
// kept for backwards compatibility to be removed in future release
|
|
33
27
|
checkboxStyle,
|
|
28
|
+
// kept for backwards compatibility to be removed in future release
|
|
34
29
|
checkboxLabelStyle,
|
|
30
|
+
// kept for backwards compatibility to be removed in future release
|
|
31
|
+
checkboxComponentStyles,
|
|
32
|
+
listComponentStyles,
|
|
35
33
|
...rest
|
|
36
34
|
} = _ref;
|
|
37
35
|
return /*#__PURE__*/_react.default.createElement(_reactNative.FlatList, _extends({
|
|
38
36
|
data: options,
|
|
39
37
|
extraData: isMultiple ? selectedItems : selectedItem,
|
|
40
38
|
initialNumToRender: 5,
|
|
41
|
-
ListEmptyComponent: /*#__PURE__*/_react.default.createElement(
|
|
42
|
-
|
|
43
|
-
}
|
|
39
|
+
ListEmptyComponent: /*#__PURE__*/_react.default.createElement(_Others.ListEmptyComponent, {
|
|
40
|
+
listEmptyComponentStyle: listComponentStyles === null || listComponentStyles === void 0 ? void 0 : listComponentStyles.listEmptyComponentStyle
|
|
41
|
+
}),
|
|
44
42
|
contentContainerStyle: [isSearchable ? {
|
|
45
43
|
paddingTop: 0
|
|
46
44
|
} : styles.contentContainerStyle],
|
|
47
|
-
ItemSeparatorComponent: () => /*#__PURE__*/_react.default.createElement(
|
|
48
|
-
|
|
45
|
+
ItemSeparatorComponent: () => /*#__PURE__*/_react.default.createElement(_Others.ItemSeparatorComponent, {
|
|
46
|
+
itemSeparatorStyle: listComponentStyles === null || listComponentStyles === void 0 ? void 0 : listComponentStyles.itemSeparatorStyle
|
|
49
47
|
}),
|
|
50
48
|
renderItem: item => _renderItem(item, {
|
|
51
49
|
optionLabel,
|
|
@@ -55,13 +53,16 @@ const DropdownList = _ref => {
|
|
|
55
53
|
onChange: isMultiple ? handleMultipleSelections : handleSingleSelection,
|
|
56
54
|
primaryColor,
|
|
57
55
|
checkboxSize,
|
|
56
|
+
// kept for backwards compatibility
|
|
58
57
|
checkboxStyle,
|
|
59
|
-
|
|
58
|
+
// kept for backwards compatibility
|
|
59
|
+
checkboxLabelStyle,
|
|
60
|
+
// kept for backwards compatibility
|
|
61
|
+
checkboxComponentStyles
|
|
60
62
|
}),
|
|
61
63
|
keyExtractor: (_item, index) => `Options${index}`
|
|
62
64
|
}, rest));
|
|
63
65
|
};
|
|
64
|
-
|
|
65
66
|
const _renderItem = (_ref2, props) => {
|
|
66
67
|
let {
|
|
67
68
|
item
|
|
@@ -76,26 +77,15 @@ const _renderItem = (_ref2, props) => {
|
|
|
76
77
|
primaryColor: props.primaryColor,
|
|
77
78
|
checkboxSize: props.checkboxSize,
|
|
78
79
|
checkboxStyle: props.checkboxStyle,
|
|
79
|
-
checkboxLabelStyle: props.checkboxLabelStyle
|
|
80
|
+
checkboxLabelStyle: props.checkboxLabelStyle,
|
|
81
|
+
checkboxComponentStyles: props.checkboxComponentStyles
|
|
80
82
|
});
|
|
81
83
|
};
|
|
82
|
-
|
|
83
84
|
const styles = _reactNative.StyleSheet.create({
|
|
84
|
-
itemSeparatorStyle: {
|
|
85
|
-
backgroundColor: _colors.colors.gray,
|
|
86
|
-
height: 1,
|
|
87
|
-
opacity: 0.15
|
|
88
|
-
},
|
|
89
|
-
emptyListStyle: {
|
|
90
|
-
alignItems: 'center',
|
|
91
|
-
width: '100%',
|
|
92
|
-
marginVertical: 20
|
|
93
|
-
},
|
|
94
85
|
contentContainerStyle: {
|
|
95
86
|
paddingTop: 20
|
|
96
87
|
}
|
|
97
88
|
});
|
|
98
|
-
|
|
99
|
-
var _default = DropdownList;
|
|
89
|
+
var _default = DropdownFlatList;
|
|
100
90
|
exports.default = _default;
|
|
101
|
-
//# sourceMappingURL=
|
|
91
|
+
//# sourceMappingURL=DropdownFlatList.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_DropdownListItem","_Others","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","DropdownFlatList","_ref","options","optionLabel","optionValue","isMultiple","isSearchable","selectedItems","selectedItem","handleMultipleSelections","handleSingleSelection","primaryColor","checkboxSize","checkboxStyle","checkboxLabelStyle","checkboxComponentStyles","listComponentStyles","rest","createElement","FlatList","data","extraData","initialNumToRender","ListEmptyComponent","listEmptyComponentStyle","contentContainerStyle","paddingTop","styles","ItemSeparatorComponent","itemSeparatorStyle","renderItem","item","_renderItem","selectedOption","onChange","keyExtractor","_item","index","_ref2","props","StyleSheet","create","_default","exports"],"sources":["DropdownFlatList.tsx"],"sourcesContent":["/* eslint-disable react-native/no-inline-styles */\nimport React from 'react';\nimport { FlatList, StyleSheet } from 'react-native';\nimport DropdownListItem from './DropdownListItem';\nimport { ItemSeparatorComponent, ListEmptyComponent } from '../Others';\n\nconst DropdownFlatList = ({\n options,\n optionLabel,\n optionValue,\n isMultiple,\n isSearchable,\n selectedItems,\n selectedItem,\n handleMultipleSelections,\n handleSingleSelection,\n primaryColor,\n checkboxSize, // kept for backwards compatibility to be removed in future release\n checkboxStyle, // kept for backwards compatibility to be removed in future release\n checkboxLabelStyle, // kept for backwards compatibility to be removed in future release\n checkboxComponentStyles,\n listComponentStyles,\n ...rest\n}: any) => {\n return (\n <FlatList\n data={options}\n extraData={isMultiple ? selectedItems : selectedItem}\n initialNumToRender={5}\n ListEmptyComponent={\n <ListEmptyComponent\n listEmptyComponentStyle={listComponentStyles?.listEmptyComponentStyle}\n />\n }\n contentContainerStyle={[\n isSearchable ? { paddingTop: 0 } : styles.contentContainerStyle,\n ]}\n ItemSeparatorComponent={() => (\n <ItemSeparatorComponent\n itemSeparatorStyle={listComponentStyles?.itemSeparatorStyle}\n />\n )}\n renderItem={(item) =>\n _renderItem(item, {\n optionLabel,\n optionValue,\n isMultiple,\n selectedOption: isMultiple ? selectedItems : selectedItem,\n onChange: isMultiple\n ? handleMultipleSelections\n : handleSingleSelection,\n primaryColor,\n checkboxSize, // kept for backwards compatibility\n checkboxStyle, // kept for backwards compatibility\n checkboxLabelStyle, // kept for backwards compatibility\n checkboxComponentStyles,\n })\n }\n keyExtractor={(_item, index) => `Options${index}`}\n {...rest}\n />\n );\n};\n\nconst _renderItem = ({ item }: any, props: any) => {\n return (\n <DropdownListItem\n item={item}\n optionLabel={props.optionLabel}\n optionValue={props.optionValue}\n isMultiple={props.isMultiple}\n selectedOption={props.selectedOption}\n onChange={props.onChange}\n primaryColor={props.primaryColor}\n checkboxSize={props.checkboxSize}\n checkboxStyle={props.checkboxStyle}\n checkboxLabelStyle={props.checkboxLabelStyle}\n checkboxComponentStyles={props.checkboxComponentStyles}\n />\n );\n};\n\nconst styles = StyleSheet.create({\n contentContainerStyle: { paddingTop: 20 },\n});\n\nexport default DropdownFlatList;\n"],"mappings":";;;;;;AACA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA;AAAuE,SAAAD,uBAAAK,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA,KAJvE;AAMA,MAAMQ,gBAAgB,GAAGC,IAAA,IAiBd;EAAA,IAjBe;IACxBC,OAAO;IACPC,WAAW;IACXC,WAAW;IACXC,UAAU;IACVC,YAAY;IACZC,aAAa;IACbC,YAAY;IACZC,wBAAwB;IACxBC,qBAAqB;IACrBC,YAAY;IACZC,YAAY;IAAE;IACdC,aAAa;IAAE;IACfC,kBAAkB;IAAE;IACpBC,uBAAuB;IACvBC,mBAAmB;IACnB,GAAGC;EACA,CAAC,GAAAhB,IAAA;EACJ,oBACExB,MAAA,CAAAQ,OAAA,CAAAiC,aAAA,CAACtC,YAAA,CAAAuC,QAAQ,EAAAjC,QAAA;IACPkC,IAAI,EAAElB,OAAQ;IACdmB,SAAS,EAAEhB,UAAU,GAAGE,aAAa,GAAGC,YAAa;IACrDc,kBAAkB,EAAE,CAAE;IACtBC,kBAAkB,eAChB9C,MAAA,CAAAQ,OAAA,CAAAiC,aAAA,CAACpC,OAAA,CAAAyC,kBAAkB;MACjBC,uBAAuB,EAAER,mBAAmB,aAAnBA,mBAAmB,uBAAnBA,mBAAmB,CAAEQ;IAAwB,CACvE,CACF;IACDC,qBAAqB,EAAE,CACrBnB,YAAY,GAAG;MAAEoB,UAAU,EAAE;IAAE,CAAC,GAAGC,MAAM,CAACF,qBAAqB,CAC/D;IACFG,sBAAsB,EAAEA,CAAA,kBACtBnD,MAAA,CAAAQ,OAAA,CAAAiC,aAAA,CAACpC,OAAA,CAAA8C,sBAAsB;MACrBC,kBAAkB,EAAEb,mBAAmB,aAAnBA,mBAAmB,uBAAnBA,mBAAmB,CAAEa;IAAmB,CAC7D,CACD;IACFC,UAAU,EAAGC,IAAI,IACfC,WAAW,CAACD,IAAI,EAAE;MAChB5B,WAAW;MACXC,WAAW;MACXC,UAAU;MACV4B,cAAc,EAAE5B,UAAU,GAAGE,aAAa,GAAGC,YAAY;MACzD0B,QAAQ,EAAE7B,UAAU,GAChBI,wBAAwB,GACxBC,qBAAqB;MACzBC,YAAY;MACZC,YAAY;MAAE;MACdC,aAAa;MAAE;MACfC,kBAAkB;MAAE;MACpBC;IACF,CAAC,CACF;IACDoB,YAAY,EAAEA,CAACC,KAAK,EAAEC,KAAK,KAAM,UAASA,KAAM;EAAE,GAC9CpB,IAAI,CACT,CAAC;AAEN,CAAC;AAED,MAAMe,WAAW,GAAGA,CAAAM,KAAA,EAAgBC,KAAU,KAAK;EAAA,IAA9B;IAAER;EAAU,CAAC,GAAAO,KAAA;EAChC,oBACE7D,MAAA,CAAAQ,OAAA,CAAAiC,aAAA,CAACrC,iBAAA,CAAAI,OAAgB;IACf8C,IAAI,EAAEA,IAAK;IACX5B,WAAW,EAAEoC,KAAK,CAACpC,WAAY;IAC/BC,WAAW,EAAEmC,KAAK,CAACnC,WAAY;IAC/BC,UAAU,EAAEkC,KAAK,CAAClC,UAAW;IAC7B4B,cAAc,EAAEM,KAAK,CAACN,cAAe;IACrCC,QAAQ,EAAEK,KAAK,CAACL,QAAS;IACzBvB,YAAY,EAAE4B,KAAK,CAAC5B,YAAa;IACjCC,YAAY,EAAE2B,KAAK,CAAC3B,YAAa;IACjCC,aAAa,EAAE0B,KAAK,CAAC1B,aAAc;IACnCC,kBAAkB,EAAEyB,KAAK,CAACzB,kBAAmB;IAC7CC,uBAAuB,EAAEwB,KAAK,CAACxB;EAAwB,CACxD,CAAC;AAEN,CAAC;AAED,MAAMY,MAAM,GAAGa,uBAAU,CAACC,MAAM,CAAC;EAC/BhB,qBAAqB,EAAE;IAAEC,UAAU,EAAE;EAAG;AAC1C,CAAC,CAAC;AAAC,IAAAgB,QAAA,GAEY1C,gBAAgB;AAAA2C,OAAA,CAAA1D,OAAA,GAAAyD,QAAA"}
|
|
@@ -4,19 +4,12 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
-
|
|
10
8
|
var _reactNative = require("react-native");
|
|
11
|
-
|
|
12
9
|
var _CheckBox = _interopRequireDefault(require("../CheckBox"));
|
|
13
|
-
|
|
14
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
|
|
16
11
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
17
|
-
|
|
18
12
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
19
|
-
|
|
20
13
|
const DropdownListItem = _ref => {
|
|
21
14
|
let {
|
|
22
15
|
item,
|
|
@@ -28,35 +21,31 @@ const DropdownListItem = _ref => {
|
|
|
28
21
|
primaryColor,
|
|
29
22
|
checkboxSize,
|
|
30
23
|
checkboxStyle,
|
|
31
|
-
checkboxLabelStyle
|
|
24
|
+
checkboxLabelStyle,
|
|
25
|
+
checkboxComponentStyles
|
|
32
26
|
} = _ref;
|
|
33
|
-
const selectedOptionValue = optionValue !== null && optionValue !== void 0 ? optionValue : 'value';
|
|
34
27
|
return /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
|
|
35
|
-
style: styles.
|
|
36
|
-
onPress: item.disabled ? () => {} : () => onChange(item[
|
|
37
|
-
|
|
28
|
+
style: styles.listItemContainerStyle,
|
|
29
|
+
onPress: item.disabled ? () => {} : () => onChange(item[optionValue]) // intentionally didn't use the disable property
|
|
38
30
|
}, /*#__PURE__*/_react.default.createElement(_CheckBox.default, {
|
|
39
|
-
value: isMultiple ? selectedOption.includes(item[
|
|
40
|
-
label: item[optionLabel
|
|
41
|
-
onChange: () => onChange(item[
|
|
31
|
+
value: isMultiple ? selectedOption.includes(item[optionValue]) : [selectedOption].includes(item[optionValue]),
|
|
32
|
+
label: item[optionLabel],
|
|
33
|
+
onChange: () => onChange(item[optionValue]),
|
|
42
34
|
primaryColor: primaryColor,
|
|
43
|
-
checkboxSize: checkboxSize,
|
|
44
|
-
checkboxStyle: checkboxStyle,
|
|
45
|
-
checkboxLabelStyle: checkboxLabelStyle,
|
|
35
|
+
checkboxSize: (checkboxComponentStyles === null || checkboxComponentStyles === void 0 ? void 0 : checkboxComponentStyles.checkboxSize) || checkboxSize,
|
|
36
|
+
checkboxStyle: (checkboxComponentStyles === null || checkboxComponentStyles === void 0 ? void 0 : checkboxComponentStyles.checkboxStyle) || checkboxStyle,
|
|
37
|
+
checkboxLabelStyle: (checkboxComponentStyles === null || checkboxComponentStyles === void 0 ? void 0 : checkboxComponentStyles.checkboxLabelStyle) || checkboxLabelStyle,
|
|
46
38
|
disabled: item.disabled
|
|
47
39
|
}));
|
|
48
40
|
};
|
|
49
|
-
|
|
50
41
|
const styles = _reactNative.StyleSheet.create({
|
|
51
|
-
|
|
42
|
+
listItemContainerStyle: {
|
|
52
43
|
paddingHorizontal: 20,
|
|
53
44
|
paddingVertical: 10,
|
|
54
45
|
flexDirection: 'row',
|
|
55
46
|
alignItems: 'center'
|
|
56
47
|
}
|
|
57
48
|
});
|
|
58
|
-
|
|
59
49
|
var _default = /*#__PURE__*/(0, _react.memo)(DropdownListItem);
|
|
60
|
-
|
|
61
50
|
exports.default = _default;
|
|
62
51
|
//# sourceMappingURL=DropdownListItem.js.map
|