react-native-input-select 0.33.0 → 0.34.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 +42 -34
- package/lib/commonjs/components/CustomModal/index.js +5 -2
- package/lib/commonjs/components/CustomModal/index.js.map +1 -1
- package/lib/commonjs/index.js +3 -1
- package/lib/commonjs/index.js.map +1 -1
- package/lib/module/components/CustomModal/index.js +5 -2
- package/lib/module/components/CustomModal/index.js.map +1 -1
- package/lib/module/index.js +3 -1
- package/lib/module/index.js.map +1 -1
- package/lib/typescript/components/CustomModal/index.d.ts +1 -1
- package/lib/typescript/types/index.types.d.ts +2 -1
- package/package.json +1 -1
- package/src/components/CustomModal/index.tsx +2 -0
- package/src/index.tsx +2 -0
- package/src/types/index.types.ts +7 -1
package/README.md
CHANGED
|
@@ -170,45 +170,53 @@ For more examples visit our [wiki page](https://github.com/azeezat/react-native-
|
|
|
170
170
|
|
|
171
171
|
## Props
|
|
172
172
|
|
|
173
|
-
| Proptypes | Datatype
|
|
174
|
-
| -------------------------- |
|
|
175
|
-
| label | `string`
|
|
176
|
-
| placeholder | `string`
|
|
177
|
-
| options | `Array`
|
|
178
|
-
| optionLabel | `string`
|
|
179
|
-
| optionValue | `string`
|
|
180
|
-
| error | `string`
|
|
181
|
-
| helperText | `string`
|
|
182
|
-
| selectedValue | `string` or `Array`
|
|
183
|
-
| onValueChange | `function`
|
|
184
|
-
| isMultiple | `Boolean`
|
|
185
|
-
| isSearchable | `Boolean`
|
|
186
|
-
| disabled | `Boolean`
|
|
187
|
-
| dropdownIcon | `React Component`
|
|
188
|
-
| labelStyle | `Object`
|
|
189
|
-
| placeholderStyle | `Object`
|
|
190
|
-
| dropdownStyle | `Object`
|
|
191
|
-
| dropdownContainerStyle | `Object`
|
|
192
|
-
| dropdownIconStyle | `Object`
|
|
193
|
-
| searchInputStyle | `Object`
|
|
194
|
-
| selectedItemStyle | `Object`
|
|
195
|
-
| multipleSelectedItemStyle | `Object`
|
|
196
|
-
| modalBackgroundStyle | `Object`
|
|
197
|
-
| modalOptionsContainerStyle | `Object`
|
|
198
|
-
|
|
|
199
|
-
|
|
|
200
|
-
|
|
|
201
|
-
|
|
|
202
|
-
|
|
|
203
|
-
|
|
|
204
|
-
|
|
|
205
|
-
|
|
|
206
|
-
|
|
|
173
|
+
| Proptypes | Datatype | Example |
|
|
174
|
+
| -------------------------- | ------------------------ | -------------------------------------------------------------------- |
|
|
175
|
+
| label | `string` | `Countries` |
|
|
176
|
+
| placeholder | `string` | `Select a country` |
|
|
177
|
+
| options | `Array` | `[{ name: 'Nigeria', code: 'NG' }, { name: 'Albania', code: 'AL' }]` |
|
|
178
|
+
| optionLabel | `string` | `name` |
|
|
179
|
+
| optionValue | `string` | `code` |
|
|
180
|
+
| error | `string` | `This is a requiredfield` |
|
|
181
|
+
| helperText | `string` | `Only few countries are listed` |
|
|
182
|
+
| selectedValue | `string` or `Array` | `AL` or `[AL, AX]` |
|
|
183
|
+
| onValueChange | `function` | `()=>{}` |
|
|
184
|
+
| isMultiple | `Boolean` | `true` |
|
|
185
|
+
| isSearchable | `Boolean` | `true` |
|
|
186
|
+
| disabled | `Boolean` | `true` |
|
|
187
|
+
| dropdownIcon | `React Component` | `Image` or `<Text> Show <Text>` |
|
|
188
|
+
| labelStyle | `Object` | `{color: 'red', fontSize: 15, fontWeight: '500'}` |
|
|
189
|
+
| placeholderStyle | `Object` | `{color: 'blue', fontSize: 15, fontWeight: '500'}` |
|
|
190
|
+
| dropdownStyle | `Object` | `{borderColor: 'blue', margin: 5, borderWidth:0 ...}` |
|
|
191
|
+
| dropdownContainerStyle | `Object` | `{backgroundColor: 'red', width: '30%', ...}` |
|
|
192
|
+
| dropdownIconStyle | `Object` | `{top: 10 , right: 10, ...}` |
|
|
193
|
+
| searchInputStyle | `Object` | `{backgroundColor: 'red', borderRadius: 0, ...}` |
|
|
194
|
+
| selectedItemStyle | `Object` | `{fontWeight: '600', color: 'yellow', ...}` |
|
|
195
|
+
| multipleSelectedItemStyle | `Object` | `{backgroundColor: 'red', color: 'yellow', ...}` |
|
|
196
|
+
| modalBackgroundStyle | `Object` | `{backgroundColor: 'rgba(196, 198, 246, 0.5)'}` |
|
|
197
|
+
| modalOptionsContainerStyle | `Object` | `{padding: 10, backgroundColor: 'cyan',}` |
|
|
198
|
+
| modalProps | `ReactNative.ModalProps` | `{supportedOrientations:{['landscape-left', landscape-right']}` |
|
|
199
|
+
| dropdownErrorStyle | `Object` | `{borderWidth: 2, borderStyle: 'solid'}` |
|
|
200
|
+
| dropdownErrorTextStyle | `Object` | `{color: 'red', fontWeight:'500'}` |
|
|
201
|
+
| dropdownHelperTextStyle | `Object` | `{color: 'green', fontWeight:'500'}` |
|
|
202
|
+
| primaryColor | `string` | `blue` |
|
|
203
|
+
| checkboxSize | `number` | `20` |
|
|
204
|
+
| checkboxStyle | `Object` | `{backgroundColor: 'blue', borderRadius: 30, padding: 10}` |
|
|
205
|
+
| checkboxLabelStyle | `Object` | `{color: 'red', fontWeight:'500'}` |
|
|
206
|
+
| listHeaderComponent | `React Component` | `<Text> You can add any component here` |
|
|
207
|
+
| listFooterComponent | `React Component` | `<Text> You can add any component here` |
|
|
208
|
+
| hideModal | `Boolean` | Use this to hide the modal as needed |
|
|
207
209
|
|
|
208
210
|
## Contributing
|
|
209
211
|
|
|
210
212
|
See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
|
|
211
213
|
|
|
214
|
+
<a href="https://github.com/azeezat/react-native-select/graphs/contributors">
|
|
215
|
+
<img src="https://contrib.rocks/image?repo=azeezat/react-native-select" />
|
|
216
|
+
</a>
|
|
217
|
+
|
|
218
|
+
Made with [contrib.rocks](https://contrib.rocks).
|
|
219
|
+
|
|
212
220
|
## License
|
|
213
221
|
|
|
214
222
|
MIT
|
|
@@ -13,6 +13,8 @@ var _colors = require("../../styles/colors");
|
|
|
13
13
|
|
|
14
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
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
|
+
|
|
16
18
|
const CustomModal = _ref => {
|
|
17
19
|
let {
|
|
18
20
|
open,
|
|
@@ -20,14 +22,15 @@ const CustomModal = _ref => {
|
|
|
20
22
|
onRequestClose,
|
|
21
23
|
modalBackgroundStyle,
|
|
22
24
|
modalOptionsContainerStyle,
|
|
25
|
+
modalProps,
|
|
23
26
|
children
|
|
24
27
|
} = _ref;
|
|
25
|
-
return /*#__PURE__*/_react.default.createElement(_reactNative.Modal, {
|
|
28
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.Modal, _extends({
|
|
26
29
|
transparent: true,
|
|
27
30
|
visible: open,
|
|
28
31
|
onRequestClose: () => onRequestClose(),
|
|
29
32
|
animationType: "fade"
|
|
30
|
-
}, /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
|
|
33
|
+
}, modalProps), /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
|
|
31
34
|
onPress: () => handleToggleModal(),
|
|
32
35
|
style: [styles.modalContainer, styles.modalBackgroundStyle, modalBackgroundStyle]
|
|
33
36
|
}, /*#__PURE__*/_react.default.createElement(_reactNative.SafeAreaView, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.tsx"],"names":["CustomModal","open","handleToggleModal","onRequestClose","modalBackgroundStyle","modalOptionsContainerStyle","children","styles","modalContainer","modalOptionsContainer","StyleSheet","create","flex","justifyContent","backgroundColor","maxHeight","colors","white","borderTopLeftRadius","borderTopRightRadius"],"mappings":";;;;;;;AAAA;;AACA;;AAMA
|
|
1
|
+
{"version":3,"sources":["index.tsx"],"names":["CustomModal","open","handleToggleModal","onRequestClose","modalBackgroundStyle","modalOptionsContainerStyle","modalProps","children","styles","modalContainer","modalOptionsContainer","StyleSheet","create","flex","justifyContent","backgroundColor","maxHeight","colors","white","borderTopLeftRadius","borderTopRightRadius"],"mappings":";;;;;;;AAAA;;AACA;;AAMA;;;;;;AAEA,MAAMA,WAAW,GAAG,QAQT;AAAA,MARU;AACnBC,IAAAA,IADmB;AAEnBC,IAAAA,iBAFmB;AAGnBC,IAAAA,cAHmB;AAInBC,IAAAA,oBAJmB;AAKnBC,IAAAA,0BALmB;AAMnBC,IAAAA,UANmB;AAOnBC,IAAAA;AAPmB,GAQV;AACT,sBACE,6BAAC,kBAAD;AACE,IAAA,WAAW,EAAE,IADf;AAEE,IAAA,OAAO,EAAEN,IAFX;AAGE,IAAA,cAAc,EAAE,MAAME,cAAc,EAHtC;AAIE,IAAA,aAAa,EAAC;AAJhB,KAKMG,UALN,gBAOE,6BAAC,6BAAD;AACE,IAAA,OAAO,EAAE,MAAMJ,iBAAiB,EADlC;AAEE,IAAA,KAAK,EAAE,CACLM,MAAM,CAACC,cADF,EAELD,MAAM,CAACJ,oBAFF,EAGLA,oBAHK;AAFT,kBAQE,6BAAC,yBAAD;AACE,IAAA,KAAK,EAAE,CAACI,MAAM,CAACE,qBAAR,EAA+BL,0BAA/B;AADT,KAGGE,QAHH,CARF,CAPF,CADF;AAwBD,CAjCD;;AAmCA,MAAMC,MAAM,GAAGG,wBAAWC,MAAX,CAAkB;AAC/BH,EAAAA,cAAc,EAAE;AACdI,IAAAA,IAAI,EAAE,CADQ;AAEdC,IAAAA,cAAc,EAAE;AAFF,GADe;AAK/BV,EAAAA,oBAAoB,EAAE;AAAEW,IAAAA,eAAe,EAAE;AAAnB,GALS;AAM/BL,EAAAA,qBAAqB,EAAE;AACrBM,IAAAA,SAAS,EAAE,KADU;AAErBD,IAAAA,eAAe,EAAEE,eAAOC,KAFH;AAGrBC,IAAAA,mBAAmB,EAAE,EAHA;AAIrBC,IAAAA,oBAAoB,EAAE;AAJD;AANQ,CAAlB,CAAf;;eAcepB,W","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"]}
|
package/lib/commonjs/index.js
CHANGED
|
@@ -65,6 +65,7 @@ const DropdownSelect = _ref => {
|
|
|
65
65
|
checkboxLabelStyle,
|
|
66
66
|
listHeaderComponent,
|
|
67
67
|
listFooterComponent,
|
|
68
|
+
modalProps,
|
|
68
69
|
hideModal = false,
|
|
69
70
|
...rest
|
|
70
71
|
} = _ref;
|
|
@@ -224,7 +225,8 @@ const DropdownSelect = _ref => {
|
|
|
224
225
|
handleToggleModal: handleToggleModal,
|
|
225
226
|
modalBackgroundStyle: modalBackgroundStyle,
|
|
226
227
|
modalOptionsContainerStyle: modalOptionsContainerStyle,
|
|
227
|
-
onRequestClose: () => {}
|
|
228
|
+
onRequestClose: () => {},
|
|
229
|
+
modalProps: modalProps
|
|
228
230
|
}, /*#__PURE__*/_react.default.createElement(_DropdownList.default, {
|
|
229
231
|
ListHeaderComponent: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isSearchable && /*#__PURE__*/_react.default.createElement(_Input.Input, {
|
|
230
232
|
value: searchValue,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.tsx"],"names":["DropdownSelect","placeholder","label","error","helperText","options","optionLabel","optionValue","onValueChange","selectedValue","isMultiple","isSearchable","dropdownIcon","labelStyle","placeholderStyle","dropdownStyle","dropdownIconStyle","dropdownContainerStyle","dropdownErrorStyle","dropdownErrorTextStyle","dropdownHelperTextStyle","selectedItemStyle","multipleSelectedItemStyle","modalBackgroundStyle","modalOptionsContainerStyle","searchInputStyle","primaryColor","disabled","checkboxSize","checkboxStyle","checkboxLabelStyle","listHeaderComponent","listFooterComponent","hideModal","rest","newOptions","setNewOptions","open","setOpen","selectAll","setSelectAll","selectedItem","setSelectedItem","selectedItems","setSelectedItems","searchValue","setSearchValue","Array","isArray","handleSingleSelection","value","handleMultipleSelections","prevVal","selectedValues","includes","filter","item","push","length","handleSelectAll","filteredOptions","i","getSelectedItemsLabel","selectedLabels","forEach","element","selectedItemLabel","find","DEFAULT_OPTION_VALUE","DEFAULT_OPTION_LABEL","onSearch","searchText","toString","toLocaleLowerCase","trim","regexFilter","RegExp","searchResults","toLowerCase","search","handleToggleModal","primary","colors","gray","text","styles","optionsContainerStyle","StyleSheet","create","paddingHorizontal","paddingVertical","flexDirection"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAGO,MAAMA,cAAuC,GAAG,QAmCjD;AAAA,MAnCkD;AACtDC,IAAAA,WADsD;AAEtDC,IAAAA,KAFsD;AAGtDC,IAAAA,KAHsD;AAItDC,IAAAA,UAJsD;AAKtDC,IAAAA,OALsD;AAMtDC,IAAAA,WANsD;AAOtDC,IAAAA,WAPsD;AAQtDC,IAAAA,aARsD;AAStDC,IAAAA,aATsD;AAUtDC,IAAAA,UAVsD;AAWtDC,IAAAA,YAXsD;AAYtDC,IAAAA,YAZsD;AAatDC,IAAAA,UAbsD;AActDC,IAAAA,gBAdsD;AAetDC,IAAAA,aAfsD;AAgBtDC,IAAAA,iBAhBsD;AAiBtDC,IAAAA,sBAjBsD;AAkBtDC,IAAAA,kBAlBsD;AAmBtDC,IAAAA,sBAnBsD;AAoBtDC,IAAAA,uBApBsD;AAqBtDC,IAAAA,iBArBsD;AAsBtDC,IAAAA,yBAtBsD;AAuBtDC,IAAAA,oBAvBsD;AAwBtDC,IAAAA,0BAxBsD;AAyBtDC,IAAAA,gBAzBsD;AA0BtDC,IAAAA,YA1BsD;AA2BtDC,IAAAA,QA3BsD;AA4BtDC,IAAAA,YA5BsD;AA6BtDC,IAAAA,aA7BsD;AA8BtDC,IAAAA,kBA9BsD;AA+BtDC,IAAAA,mBA/BsD;AAgCtDC,IAAAA,mBAhCsD;AAiCtDC,IAAAA,SAAS,GAAG,KAjC0C;AAkCtD,OAAGC;AAlCmD,GAmClD;AACJ,QAAM,CAACC,UAAD,EAAaC,aAAb,IAA8B,qBAAgB,EAAhB,CAApC;AACA,QAAM,CAACC,IAAD,EAAOC,OAAP,IAAkB,qBAAkB,KAAlB,CAAxB;AACA,QAAM,CAACC,SAAD,EAAYC,YAAZ,IAA4B,qBAAkB,KAAlB,CAAlC;AACA,QAAM,CAACC,YAAD,EAAeC,eAAf,IAAkC,qBAAc,EAAd,CAAxC,CAJI,CAIuD;;AAC3D,QAAM,CAACC,aAAD,EAAgBC,gBAAhB,IAAoC,qBAAgB,EAAhB,CAA1C,CALI,CAK2D;;AAC/D,QAAM,CAACC,WAAD,EAAcC,cAAd,IAAgC,qBAAiB,EAAjB,CAAtC;AAEA,wBAAU,MAAM;AACd,QAAIzC,OAAJ,EAAa;AACX+B,MAAAA,aAAa,CAAC/B,OAAD,CAAb;AACD;AACF,GAJD,EAIG,CAACA,OAAD,CAJH;AAMA,wBAAU,MAAM;AACdK,IAAAA,UAAU,GACNkC,gBAAgB,CAACG,KAAK,CAACC,OAAN,CAAcvC,aAAd,IAA+BA,aAA/B,GAA+C,EAAhD,CADV,GAENiC,eAAe,CAACjC,aAAD,CAFnB;AAGD,GAJD,EAIG,CAACA,aAAD,EAAgBC,UAAhB,EAA4BF,aAA5B,CAJH;AAMA;AACF;AACA;;AACE,QAAMyC,qBAAqB,GAAIC,KAAD,IAAgB;AAC5C,QAAIT,YAAY,KAAKS,KAArB,EAA4B;AAC1BR,MAAAA,eAAe,CAAC,IAAD,CAAf;AACAlC,MAAAA,aAAa,CAAC,IAAD,CAAb,CAF0B,CAEL;AACtB,KAHD,MAGO;AACLkC,MAAAA,eAAe,CAACQ,KAAD,CAAf;AACA1C,MAAAA,aAAa,CAAC0C,KAAD,CAAb,CAFK,CAEiB;;AACtBZ,MAAAA,OAAO,CAAC,KAAD,CAAP,CAHK,CAGW;AACjB;AACF,GATD;;AAWA,QAAMa,wBAAwB,GAAID,KAAD,IAAgB;AAC/CN,IAAAA,gBAAgB,CAAEQ,OAAD,IAAa;AAAA;;AAC5B,UAAIC,cAAc,GAAG,CAAC,GAAGD,OAAJ,CAArB;;AAEA,6BAAIC,cAAJ,4CAAI,gBAAgBC,QAAhB,CAAyBJ,KAAzB,CAAJ,EAAqC;AACnCG,QAAAA,cAAc,GAAGA,cAAc,CAACE,MAAf,CAAuBC,IAAD,IAAUA,IAAI,KAAKN,KAAzC,CAAjB;AACD,OAFD,MAEO;AACLG,QAAAA,cAAc,CAACI,IAAf,CAAoBP,KAApB;AACD;;AAEDN,MAAAA,gBAAgB,CAACS,cAAD,CAAhB;AACA7C,MAAAA,aAAa,CAAC6C,cAAD,CAAb,CAV4B,CAUG;AAE/B;;AACA,UACEhD,OAAO,CAACkD,MAAR,CAAgBC,IAAD,IAAU,CAACA,IAAI,CAAC7B,QAA/B,EAAyC+B,MAAzC,KACAL,cAAc,CAACK,MAFjB,EAGE;AACAlB,QAAAA,YAAY,CAAC,IAAD,CAAZ;AACD,OALD,MAKO;AACLA,QAAAA,YAAY,CAAC,KAAD,CAAZ;AACD;;AACD,aAAOa,cAAP;AACD,KAtBe,CAAhB;AAuBD,GAxBD;;AA0BA,QAAMM,eAAe,GAAG,MAAM;AAC5BnB,IAAAA,YAAY,CAAEY,OAAD,IAAa;AACxB,YAAMC,cAAc,GAAG,EAAvB;AACA,YAAMO,eAAe,GAAGzB,UAAU,CAACoB,MAAX,CAAmBC,IAAD,IAAU,CAACA,IAAI,CAAC7B,QAAlC,CAAxB,CAFwB,CAE6C;;AACrE,UAAI,CAACyB,OAAL,EAAc;AACZ,aAAK,IAAIS,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGD,eAAe,CAACF,MAApC,EAA4CG,CAAC,EAA7C,EAAiD;AAC/CR,UAAAA,cAAc,CAACI,IAAf,CAAoBG,eAAe,CAACC,CAAD,CAAf,CAAmBtD,WAAnB,CAApB;AACD;AACF;;AAEDqC,MAAAA,gBAAgB,CAACS,cAAD,CAAhB;AACA7C,MAAAA,aAAa,CAAC6C,cAAD,CAAb,CAVwB,CAUO;;AAC/B,aAAO,CAACD,OAAR;AACD,KAZW,CAAZ;AAaD,GAdD;AAgBA;AACF;AACA;;;AACE,QAAMU,qBAAqB,GAAG,MAAM;AAClC,QAAIpD,UAAU,IAAIqC,KAAK,CAACC,OAAN,CAAcL,aAAd,CAAlB,EAAgD;AAC9C,UAAIoB,cAA6B,GAAG,EAApC;AACApB,MAAAA,aAAa,SAAb,IAAAA,aAAa,WAAb,YAAAA,aAAa,CAAEqB,OAAf,CAAwBC,OAAD,IAAkB;AAAA;;AACvC,YAAIC,iBAAiB,GACnB7D,OAAO,sBACPA,OAAO,CAAC8D,IAAR,CACGX,IAAD,IAAeA,IAAI,CAACjD,WAAD,aAACA,WAAD,cAACA,WAAD,GAAgB6D,+BAAhB,CAAJ,KAA8CH,OAD/D,CADO,kDACP,cAEI3D,WAFJ,CADO,CADT;AAKAyD,QAAAA,cAAc,CAACN,IAAf,CAAoBS,iBAApB;AACD,OAPD;AAQA,aAAOH,cAAP;AACD;;AAED,QAAIG,iBAAiB,GACnB7D,OAAO,IACPA,OAAO,CAAC8D,IAAR,CACGX,IAAD,IACEA,IAAI,CAACjD,WAAD,aAACA,WAAD,cAACA,WAAD,GAAgB6D,+BAAhB,CAAJ,KAA8C3B,YAFlD,CAFF;AAMA,WAAOyB,iBAAP,aAAOA,iBAAP,uBAAOA,iBAAiB,CAAG5D,WAAH,aAAGA,WAAH,cAAGA,WAAH,GAAkB+D,+BAAlB,CAAxB;AACD,GArBD;AAuBA;AACF;AACA;;;AACE,QAAMC,QAAQ,GAAIpB,KAAD,IAAmB;AAClCJ,IAAAA,cAAc,CAACI,KAAD,CAAd;AAEA,QAAIqB,UAAU,GAAGrB,KAAK,CAACsB,QAAN,GAAiBC,iBAAjB,GAAqCC,IAArC,EAAjB;AAEA,UAAMC,WAAW,GAAG,IAAIC,MAAJ,CAAWL,UAAX,EAAuB,GAAvB,CAApB;AAEA,UAAMM,aAAa,GAAGxE,OAAO,CAACkD,MAAR,CAAgBC,IAAD,IAAe;AAClD,UACEA,IAAI,CAAClD,WAAD,aAACA,WAAD,cAACA,WAAD,GAAgB+D,+BAAhB,CAAJ,CACGG,QADH,GAEGM,WAFH,GAGGC,MAHH,CAGUJ,WAHV,MAG2B,CAAC,CAH5B,IAIAnB,IAAI,CAACjD,WAAD,aAACA,WAAD,cAACA,WAAD,GAAgB6D,+BAAhB,CAAJ,CACGI,QADH,CACYG,WADZ,EAEGG,WAFH,GAGGC,MAHH,CAGUJ,WAHV,MAG2B,CAAC,CAR9B,EASE;AACA,eAAOnB,IAAP;AACD;AACF,KAbqB,CAAtB;AAeApB,IAAAA,aAAa,CAACyC,aAAD,CAAb;AACD,GAvBD;AAyBA;AACF;AACA;;;AACE,QAAMG,iBAAiB,GAAG,MAAM;AAC9B1C,IAAAA,OAAO,CAAC,CAACD,IAAF,CAAP;AACAS,IAAAA,cAAc,CAAC,EAAD,CAAd;AACAV,IAAAA,aAAa,CAAC/B,OAAD,CAAb;AACD,GAJD;;AAMA,wBAAU,MAAM;AACd,QAAI4B,SAAJ,EAAe;AACbK,MAAAA,OAAO,CAAC,KAAD,CAAP;AACD;AACF,GAJD,EAIG,CAACL,SAAD,CAJH;AAMA,MAAIgD,OAAO,GAAGvD,YAAY,IAAIwD,eAAOC,IAArC;AACA,sBACE,yEACE,6BAAC,iBAAD;AACE,IAAA,KAAK,EAAEjF,KADT;AAEE,IAAA,WAAW,EAAED,WAFf;AAGE,IAAA,UAAU,EAAEG,UAHd;AAIE,IAAA,KAAK,EAAED,KAJT;AAKE,IAAA,qBAAqB,EAAE2D,qBALzB;AAME,IAAA,YAAY,EAAErB,YANhB;AAOE,IAAA,aAAa,EAAEE,aAPjB;AAQE,IAAA,iBAAiB,EAAEqC,iBARrB;AASE,IAAA,UAAU,EAAEnE,UATd;AAUE,IAAA,YAAY,EAAED,YAVhB;AAWE,IAAA,aAAa,EAAEG,aAXjB;AAYE,IAAA,iBAAiB,EAAEC,iBAZrB;AAaE,IAAA,sBAAsB,EAAEC,sBAb1B;AAcE,IAAA,kBAAkB,EAAEC,kBAdtB;AAeE,IAAA,sBAAsB,EAAEC,sBAf1B;AAgBE,IAAA,uBAAuB,EAAEC,uBAhB3B;AAiBE,IAAA,iBAAiB,EAAEC,iBAjBrB;AAkBE,IAAA,yBAAyB,EAAEC,yBAlB7B;AAmBE,IAAA,UAAU,EAAEZ,UAnBd;AAoBE,IAAA,YAAY,EAAEuE,OApBhB;AAqBE,IAAA,QAAQ,EAAEtD,QArBZ;AAsBE,IAAA,gBAAgB,EAAEb;AAtBpB,KAuBMoB,IAvBN,EADF,eA0BE,6BAAC,oBAAD;AACE,IAAA,IAAI,EAAEG,IADR;AAEE,IAAA,iBAAiB,EAAE2C,iBAFrB;AAGE,IAAA,oBAAoB,EAAEzD,oBAHxB;AAIE,IAAA,0BAA0B,EAAEC,0BAJ9B;AAKE,IAAA,cAAc,EAAE,MAAM,CAAE;AAL1B,kBAOE,6BAAC,qBAAD;AACE,IAAA,mBAAmB,eACjB,4DACGb,YAAY,iBACX,6BAAC,YAAD;AACE,MAAA,KAAK,EAAEkC,WADT;AAEE,MAAA,YAAY,EAAGuC,IAAD,IAAkBd,QAAQ,CAACc,IAAD,CAF1C;AAGE,MAAA,KAAK,EAAE3D,gBAHT;AAIE,MAAA,YAAY,EAAEwD;AAJhB,MAFJ,EASGlD,mBATH,EAUGrB,UAAU,IAAIyB,UAAU,CAACuB,MAAX,GAAoB,CAAlC,iBACC,6BAAC,iBAAD;AAAM,MAAA,KAAK,EAAE2B,MAAM,CAACC;AAApB,oBACE,6BAAC,6BAAD;AAAkB,MAAA,OAAO,EAAE,MAAM,CAAE;AAAnC,oBACE,6BAAC,iBAAD;AACE,MAAA,KAAK,EAAE/C,SADT;AAEE,MAAA,KAAK,EAAEA,SAAS,GAAG,WAAH,GAAiB,YAFnC;AAGE,MAAA,QAAQ,EAAE,MAAMoB,eAAe,EAHjC;AAIE,MAAA,YAAY,EAAEsB,OAJhB;AAKE,MAAA,YAAY,EAAErD,YALhB;AAME,MAAA,aAAa,EAAEC,aANjB;AAOE,MAAA,kBAAkB,EAAEC;AAPtB,MADF,CADF,CAXJ,CAFJ;AA6BE,IAAA,mBAAmB,EAAEE,mBA7BvB;AA8BE,IAAA,OAAO,EAAEG,UA9BX;AA+BE,IAAA,WAAW,EAAE7B,WA/Bf;AAgCE,IAAA,WAAW,EAAEC,WAhCf;AAiCE,IAAA,UAAU,EAAEG,UAjCd;AAkCE,IAAA,YAAY,EAAEC,YAlChB;AAmCE,IAAA,aAAa,EAAEgC,aAnCjB;AAoCE,IAAA,YAAY,EAAEF,YApChB;AAqCE,IAAA,wBAAwB,EAAEU,wBArC5B;AAsCE,IAAA,qBAAqB,EAAEF,qBAtCzB;AAuCE,IAAA,YAAY,EAAEgC,OAvChB;AAwCE,IAAA,YAAY,EAAErD,YAxChB;AAyCE,IAAA,aAAa,EAAEC,aAzCjB;AA0CE,IAAA,kBAAkB,EAAEC;AA1CtB,IAPF,CA1BF,CADF;AAiFD,CAtQM;;;;AAwQP,MAAMuD,MAAM,GAAGE,wBAAWC,MAAX,CAAkB;AAC/BF,EAAAA,qBAAqB,EAAE;AACrBG,IAAAA,iBAAiB,EAAE,EADE;AAErBC,IAAAA,eAAe,EAAE,EAFI;AAGrBC,IAAAA,aAAa,EAAE;AAHM;AADQ,CAAlB,CAAf;;eAQe3F,c","sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { TouchableOpacity, StyleSheet, View } from 'react-native';\nimport Dropdown from './components/Dropdown/Dropdown';\nimport DropdownList from './components/Dropdown/DropdownList';\nimport CustomModal from './components/CustomModal';\nimport { Input } from './components/Input';\nimport CheckBox from './components/CheckBox';\nimport { colors } from './styles/colors';\nimport { DEFAULT_OPTION_LABEL, DEFAULT_OPTION_VALUE } from './constants';\nimport type { DropdownProps } from './types/index.types';\n\nexport const DropdownSelect: React.FC<DropdownProps> = ({\n placeholder,\n label,\n error,\n helperText,\n options,\n optionLabel,\n optionValue,\n onValueChange,\n selectedValue,\n isMultiple,\n isSearchable,\n dropdownIcon,\n labelStyle,\n placeholderStyle,\n dropdownStyle,\n dropdownIconStyle,\n dropdownContainerStyle,\n dropdownErrorStyle,\n dropdownErrorTextStyle,\n dropdownHelperTextStyle,\n selectedItemStyle,\n multipleSelectedItemStyle,\n modalBackgroundStyle,\n modalOptionsContainerStyle,\n searchInputStyle,\n primaryColor,\n disabled,\n checkboxSize,\n checkboxStyle,\n checkboxLabelStyle,\n listHeaderComponent,\n listFooterComponent,\n hideModal = false,\n ...rest\n}) => {\n const [newOptions, setNewOptions] = useState<any[]>([]);\n const [open, setOpen] = useState<boolean>(false);\n const [selectAll, setSelectAll] = useState<boolean>(false);\n const [selectedItem, setSelectedItem] = useState<any>(''); //for single selection\n const [selectedItems, setSelectedItems] = useState<any[]>([]); //for multiple selection\n const [searchValue, setSearchValue] = useState<string>('');\n\n useEffect(() => {\n if (options) {\n setNewOptions(options);\n }\n }, [options]);\n\n useEffect(() => {\n isMultiple\n ? setSelectedItems(Array.isArray(selectedValue) ? selectedValue : [])\n : setSelectedItem(selectedValue);\n }, [selectedValue, isMultiple, onValueChange]);\n\n /*===========================================\n * Selection handlers\n *==========================================*/\n const handleSingleSelection = (value: any) => {\n if (selectedItem === value) {\n setSelectedItem(null);\n onValueChange(null); //send value to parent\n } else {\n setSelectedItem(value);\n onValueChange(value); //send value to parent\n setOpen(false); //close modal upon selection\n }\n };\n\n const handleMultipleSelections = (value: any) => {\n setSelectedItems((prevVal) => {\n let selectedValues = [...prevVal];\n\n if (selectedValues?.includes(value)) {\n selectedValues = selectedValues.filter((item) => item !== value);\n } else {\n selectedValues.push(value);\n }\n\n setSelectedItems(selectedValues);\n onValueChange(selectedValues); //send value to parent\n\n //select all checkbox should not be checked if the list contains disabled values\n if (\n options.filter((item) => !item.disabled).length ===\n selectedValues.length\n ) {\n setSelectAll(true);\n } else {\n setSelectAll(false);\n }\n return selectedValues;\n });\n };\n\n const handleSelectAll = () => {\n setSelectAll((prevVal) => {\n const selectedValues = [];\n const filteredOptions = newOptions.filter((item) => !item.disabled); //don't select disabled items\n if (!prevVal) {\n for (let i = 0; i < filteredOptions.length; i++) {\n selectedValues.push(filteredOptions[i][optionValue]);\n }\n }\n\n setSelectedItems(selectedValues);\n onValueChange(selectedValues); //send value to parent\n return !prevVal;\n });\n };\n\n /*===========================================\n * Get label handler\n *==========================================*/\n const getSelectedItemsLabel = () => {\n if (isMultiple && Array.isArray(selectedItems)) {\n let selectedLabels: Array<string> = [];\n selectedItems?.forEach((element: any) => {\n let selectedItemLabel =\n options &&\n options.find(\n (item: any) => item[optionValue ?? DEFAULT_OPTION_VALUE] === element\n )?.[optionLabel];\n selectedLabels.push(selectedItemLabel);\n });\n return selectedLabels;\n }\n\n let selectedItemLabel =\n options &&\n options.find(\n (item: any) =>\n item[optionValue ?? DEFAULT_OPTION_VALUE] === selectedItem\n );\n return selectedItemLabel?.[optionLabel ?? DEFAULT_OPTION_LABEL];\n };\n\n /*===========================================\n * Search\n *==========================================*/\n const onSearch = (value: string) => {\n setSearchValue(value);\n\n let searchText = value.toString().toLocaleLowerCase().trim();\n\n const regexFilter = new RegExp(searchText, 'i');\n\n const searchResults = options.filter((item: any) => {\n if (\n item[optionLabel ?? DEFAULT_OPTION_LABEL]\n .toString()\n .toLowerCase()\n .search(regexFilter) !== -1 ||\n item[optionValue ?? DEFAULT_OPTION_VALUE]\n .toString(regexFilter)\n .toLowerCase()\n .search(regexFilter) !== -1\n ) {\n return item;\n }\n });\n\n setNewOptions(searchResults);\n };\n\n /*===========================================\n * Modal\n *==========================================*/\n const handleToggleModal = () => {\n setOpen(!open);\n setSearchValue('');\n setNewOptions(options);\n };\n\n useEffect(() => {\n if (hideModal) {\n setOpen(false);\n }\n }, [hideModal]);\n\n let primary = primaryColor || colors.gray;\n return (\n <>\n <Dropdown\n label={label}\n placeholder={placeholder}\n helperText={helperText}\n error={error}\n getSelectedItemsLabel={getSelectedItemsLabel}\n selectedItem={selectedItem}\n selectedItems={selectedItems}\n handleToggleModal={handleToggleModal}\n labelStyle={labelStyle}\n dropdownIcon={dropdownIcon}\n dropdownStyle={dropdownStyle}\n dropdownIconStyle={dropdownIconStyle}\n dropdownContainerStyle={dropdownContainerStyle}\n dropdownErrorStyle={dropdownErrorStyle}\n dropdownErrorTextStyle={dropdownErrorTextStyle}\n dropdownHelperTextStyle={dropdownHelperTextStyle}\n selectedItemStyle={selectedItemStyle}\n multipleSelectedItemStyle={multipleSelectedItemStyle}\n isMultiple={isMultiple}\n primaryColor={primary}\n disabled={disabled}\n placeholderStyle={placeholderStyle}\n {...rest}\n />\n <CustomModal\n open={open}\n handleToggleModal={handleToggleModal}\n modalBackgroundStyle={modalBackgroundStyle}\n modalOptionsContainerStyle={modalOptionsContainerStyle}\n onRequestClose={() => {}}\n >\n <DropdownList\n ListHeaderComponent={\n <>\n {isSearchable && (\n <Input\n value={searchValue}\n onChangeText={(text: string) => onSearch(text)}\n style={searchInputStyle}\n primaryColor={primary}\n />\n )}\n {listHeaderComponent}\n {isMultiple && newOptions.length > 1 && (\n <View style={styles.optionsContainerStyle}>\n <TouchableOpacity onPress={() => {}}>\n <CheckBox\n value={selectAll}\n label={selectAll ? 'Clear all' : 'Select all'}\n onChange={() => handleSelectAll()}\n primaryColor={primary}\n checkboxSize={checkboxSize}\n checkboxStyle={checkboxStyle}\n checkboxLabelStyle={checkboxLabelStyle}\n />\n </TouchableOpacity>\n </View>\n )}\n </>\n }\n ListFooterComponent={listFooterComponent}\n options={newOptions}\n optionLabel={optionLabel}\n optionValue={optionValue}\n isMultiple={isMultiple}\n isSearchable={isSearchable}\n selectedItems={selectedItems}\n selectedItem={selectedItem}\n handleMultipleSelections={handleMultipleSelections}\n handleSingleSelection={handleSingleSelection}\n primaryColor={primary}\n checkboxSize={checkboxSize}\n checkboxStyle={checkboxStyle}\n checkboxLabelStyle={checkboxLabelStyle}\n />\n </CustomModal>\n </>\n );\n};\n\nconst styles = StyleSheet.create({\n optionsContainerStyle: {\n paddingHorizontal: 20,\n paddingVertical: 10,\n flexDirection: 'row',\n },\n});\n\nexport default DropdownSelect;\n"]}
|
|
1
|
+
{"version":3,"sources":["index.tsx"],"names":["DropdownSelect","placeholder","label","error","helperText","options","optionLabel","optionValue","onValueChange","selectedValue","isMultiple","isSearchable","dropdownIcon","labelStyle","placeholderStyle","dropdownStyle","dropdownIconStyle","dropdownContainerStyle","dropdownErrorStyle","dropdownErrorTextStyle","dropdownHelperTextStyle","selectedItemStyle","multipleSelectedItemStyle","modalBackgroundStyle","modalOptionsContainerStyle","searchInputStyle","primaryColor","disabled","checkboxSize","checkboxStyle","checkboxLabelStyle","listHeaderComponent","listFooterComponent","modalProps","hideModal","rest","newOptions","setNewOptions","open","setOpen","selectAll","setSelectAll","selectedItem","setSelectedItem","selectedItems","setSelectedItems","searchValue","setSearchValue","Array","isArray","handleSingleSelection","value","handleMultipleSelections","prevVal","selectedValues","includes","filter","item","push","length","handleSelectAll","filteredOptions","i","getSelectedItemsLabel","selectedLabels","forEach","element","selectedItemLabel","find","DEFAULT_OPTION_VALUE","DEFAULT_OPTION_LABEL","onSearch","searchText","toString","toLocaleLowerCase","trim","regexFilter","RegExp","searchResults","toLowerCase","search","handleToggleModal","primary","colors","gray","text","styles","optionsContainerStyle","StyleSheet","create","paddingHorizontal","paddingVertical","flexDirection"],"mappings":"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","sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { TouchableOpacity, StyleSheet, View } from 'react-native';\nimport Dropdown from './components/Dropdown/Dropdown';\nimport DropdownList from './components/Dropdown/DropdownList';\nimport CustomModal from './components/CustomModal';\nimport { Input } from './components/Input';\nimport CheckBox from './components/CheckBox';\nimport { colors } from './styles/colors';\nimport { DEFAULT_OPTION_LABEL, DEFAULT_OPTION_VALUE } from './constants';\nimport type { DropdownProps } from './types/index.types';\n\nexport const DropdownSelect: React.FC<DropdownProps> = ({\n placeholder,\n label,\n error,\n helperText,\n options,\n optionLabel,\n optionValue,\n onValueChange,\n selectedValue,\n isMultiple,\n isSearchable,\n dropdownIcon,\n labelStyle,\n placeholderStyle,\n dropdownStyle,\n dropdownIconStyle,\n dropdownContainerStyle,\n dropdownErrorStyle,\n dropdownErrorTextStyle,\n dropdownHelperTextStyle,\n selectedItemStyle,\n multipleSelectedItemStyle,\n modalBackgroundStyle,\n modalOptionsContainerStyle,\n searchInputStyle,\n primaryColor,\n disabled,\n checkboxSize,\n checkboxStyle,\n checkboxLabelStyle,\n listHeaderComponent,\n listFooterComponent,\n modalProps,\n hideModal = false,\n ...rest\n}) => {\n const [newOptions, setNewOptions] = useState<any[]>([]);\n const [open, setOpen] = useState<boolean>(false);\n const [selectAll, setSelectAll] = useState<boolean>(false);\n const [selectedItem, setSelectedItem] = useState<any>(''); //for single selection\n const [selectedItems, setSelectedItems] = useState<any[]>([]); //for multiple selection\n const [searchValue, setSearchValue] = useState<string>('');\n\n useEffect(() => {\n if (options) {\n setNewOptions(options);\n }\n }, [options]);\n\n useEffect(() => {\n isMultiple\n ? setSelectedItems(Array.isArray(selectedValue) ? selectedValue : [])\n : setSelectedItem(selectedValue);\n }, [selectedValue, isMultiple, onValueChange]);\n\n /*===========================================\n * Selection handlers\n *==========================================*/\n const handleSingleSelection = (value: any) => {\n if (selectedItem === value) {\n setSelectedItem(null);\n onValueChange(null); //send value to parent\n } else {\n setSelectedItem(value);\n onValueChange(value); //send value to parent\n setOpen(false); //close modal upon selection\n }\n };\n\n const handleMultipleSelections = (value: any) => {\n setSelectedItems((prevVal) => {\n let selectedValues = [...prevVal];\n\n if (selectedValues?.includes(value)) {\n selectedValues = selectedValues.filter((item) => item !== value);\n } else {\n selectedValues.push(value);\n }\n\n setSelectedItems(selectedValues);\n onValueChange(selectedValues); //send value to parent\n\n //select all checkbox should not be checked if the list contains disabled values\n if (\n options.filter((item) => !item.disabled).length ===\n selectedValues.length\n ) {\n setSelectAll(true);\n } else {\n setSelectAll(false);\n }\n return selectedValues;\n });\n };\n\n const handleSelectAll = () => {\n setSelectAll((prevVal) => {\n const selectedValues = [];\n const filteredOptions = newOptions.filter((item) => !item.disabled); //don't select disabled items\n if (!prevVal) {\n for (let i = 0; i < filteredOptions.length; i++) {\n selectedValues.push(filteredOptions[i][optionValue]);\n }\n }\n\n setSelectedItems(selectedValues);\n onValueChange(selectedValues); //send value to parent\n return !prevVal;\n });\n };\n\n /*===========================================\n * Get label handler\n *==========================================*/\n const getSelectedItemsLabel = () => {\n if (isMultiple && Array.isArray(selectedItems)) {\n let selectedLabels: Array<string> = [];\n selectedItems?.forEach((element: any) => {\n let selectedItemLabel =\n options &&\n options.find(\n (item: any) => item[optionValue ?? DEFAULT_OPTION_VALUE] === element\n )?.[optionLabel];\n selectedLabels.push(selectedItemLabel);\n });\n return selectedLabels;\n }\n\n let selectedItemLabel =\n options &&\n options.find(\n (item: any) =>\n item[optionValue ?? DEFAULT_OPTION_VALUE] === selectedItem\n );\n return selectedItemLabel?.[optionLabel ?? DEFAULT_OPTION_LABEL];\n };\n\n /*===========================================\n * Search\n *==========================================*/\n const onSearch = (value: string) => {\n setSearchValue(value);\n\n let searchText = value.toString().toLocaleLowerCase().trim();\n\n const regexFilter = new RegExp(searchText, 'i');\n\n const searchResults = options.filter((item: any) => {\n if (\n item[optionLabel ?? DEFAULT_OPTION_LABEL]\n .toString()\n .toLowerCase()\n .search(regexFilter) !== -1 ||\n item[optionValue ?? DEFAULT_OPTION_VALUE]\n .toString(regexFilter)\n .toLowerCase()\n .search(regexFilter) !== -1\n ) {\n return item;\n }\n });\n\n setNewOptions(searchResults);\n };\n\n /*===========================================\n * Modal\n *==========================================*/\n const handleToggleModal = () => {\n setOpen(!open);\n setSearchValue('');\n setNewOptions(options);\n };\n\n useEffect(() => {\n if (hideModal) {\n setOpen(false);\n }\n }, [hideModal]);\n\n let primary = primaryColor || colors.gray;\n return (\n <>\n <Dropdown\n label={label}\n placeholder={placeholder}\n helperText={helperText}\n error={error}\n getSelectedItemsLabel={getSelectedItemsLabel}\n selectedItem={selectedItem}\n selectedItems={selectedItems}\n handleToggleModal={handleToggleModal}\n labelStyle={labelStyle}\n dropdownIcon={dropdownIcon}\n dropdownStyle={dropdownStyle}\n dropdownIconStyle={dropdownIconStyle}\n dropdownContainerStyle={dropdownContainerStyle}\n dropdownErrorStyle={dropdownErrorStyle}\n dropdownErrorTextStyle={dropdownErrorTextStyle}\n dropdownHelperTextStyle={dropdownHelperTextStyle}\n selectedItemStyle={selectedItemStyle}\n multipleSelectedItemStyle={multipleSelectedItemStyle}\n isMultiple={isMultiple}\n primaryColor={primary}\n disabled={disabled}\n placeholderStyle={placeholderStyle}\n {...rest}\n />\n <CustomModal\n open={open}\n handleToggleModal={handleToggleModal}\n modalBackgroundStyle={modalBackgroundStyle}\n modalOptionsContainerStyle={modalOptionsContainerStyle}\n onRequestClose={() => {}}\n modalProps={modalProps}\n >\n <DropdownList\n ListHeaderComponent={\n <>\n {isSearchable && (\n <Input\n value={searchValue}\n onChangeText={(text: string) => onSearch(text)}\n style={searchInputStyle}\n primaryColor={primary}\n />\n )}\n {listHeaderComponent}\n {isMultiple && newOptions.length > 1 && (\n <View style={styles.optionsContainerStyle}>\n <TouchableOpacity onPress={() => {}}>\n <CheckBox\n value={selectAll}\n label={selectAll ? 'Clear all' : 'Select all'}\n onChange={() => handleSelectAll()}\n primaryColor={primary}\n checkboxSize={checkboxSize}\n checkboxStyle={checkboxStyle}\n checkboxLabelStyle={checkboxLabelStyle}\n />\n </TouchableOpacity>\n </View>\n )}\n </>\n }\n ListFooterComponent={listFooterComponent}\n options={newOptions}\n optionLabel={optionLabel}\n optionValue={optionValue}\n isMultiple={isMultiple}\n isSearchable={isSearchable}\n selectedItems={selectedItems}\n selectedItem={selectedItem}\n handleMultipleSelections={handleMultipleSelections}\n handleSingleSelection={handleSingleSelection}\n primaryColor={primary}\n checkboxSize={checkboxSize}\n checkboxStyle={checkboxStyle}\n checkboxLabelStyle={checkboxLabelStyle}\n />\n </CustomModal>\n </>\n );\n};\n\nconst styles = StyleSheet.create({\n optionsContainerStyle: {\n paddingHorizontal: 20,\n paddingVertical: 10,\n flexDirection: 'row',\n },\n});\n\nexport default DropdownSelect;\n"]}
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
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); }
|
|
2
|
+
|
|
1
3
|
import React from 'react';
|
|
2
4
|
import { Modal, TouchableOpacity, SafeAreaView, StyleSheet } from 'react-native';
|
|
3
5
|
import { colors } from '../../styles/colors';
|
|
@@ -9,14 +11,15 @@ const CustomModal = _ref => {
|
|
|
9
11
|
onRequestClose,
|
|
10
12
|
modalBackgroundStyle,
|
|
11
13
|
modalOptionsContainerStyle,
|
|
14
|
+
modalProps,
|
|
12
15
|
children
|
|
13
16
|
} = _ref;
|
|
14
|
-
return /*#__PURE__*/React.createElement(Modal, {
|
|
17
|
+
return /*#__PURE__*/React.createElement(Modal, _extends({
|
|
15
18
|
transparent: true,
|
|
16
19
|
visible: open,
|
|
17
20
|
onRequestClose: () => onRequestClose(),
|
|
18
21
|
animationType: "fade"
|
|
19
|
-
}, /*#__PURE__*/React.createElement(TouchableOpacity, {
|
|
22
|
+
}, modalProps), /*#__PURE__*/React.createElement(TouchableOpacity, {
|
|
20
23
|
onPress: () => handleToggleModal(),
|
|
21
24
|
style: [styles.modalContainer, styles.modalBackgroundStyle, modalBackgroundStyle]
|
|
22
25
|
}, /*#__PURE__*/React.createElement(SafeAreaView, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.tsx"],"names":["React","Modal","TouchableOpacity","SafeAreaView","StyleSheet","colors","CustomModal","open","handleToggleModal","onRequestClose","modalBackgroundStyle","modalOptionsContainerStyle","children","styles","modalContainer","modalOptionsContainer","create","flex","justifyContent","backgroundColor","maxHeight","white","borderTopLeftRadius","borderTopRightRadius"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SACEC,KADF,EAEEC,gBAFF,EAGEC,YAHF,EAIEC,UAJF,QAKO,cALP;AAMA,SAASC,MAAT,QAAuB,qBAAvB;;AAEA,MAAMC,WAAW,GAAG,
|
|
1
|
+
{"version":3,"sources":["index.tsx"],"names":["React","Modal","TouchableOpacity","SafeAreaView","StyleSheet","colors","CustomModal","open","handleToggleModal","onRequestClose","modalBackgroundStyle","modalOptionsContainerStyle","modalProps","children","styles","modalContainer","modalOptionsContainer","create","flex","justifyContent","backgroundColor","maxHeight","white","borderTopLeftRadius","borderTopRightRadius"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SACEC,KADF,EAEEC,gBAFF,EAGEC,YAHF,EAIEC,UAJF,QAKO,cALP;AAMA,SAASC,MAAT,QAAuB,qBAAvB;;AAEA,MAAMC,WAAW,GAAG,QAQT;AAAA,MARU;AACnBC,IAAAA,IADmB;AAEnBC,IAAAA,iBAFmB;AAGnBC,IAAAA,cAHmB;AAInBC,IAAAA,oBAJmB;AAKnBC,IAAAA,0BALmB;AAMnBC,IAAAA,UANmB;AAOnBC,IAAAA;AAPmB,GAQV;AACT,sBACE,oBAAC,KAAD;AACE,IAAA,WAAW,EAAE,IADf;AAEE,IAAA,OAAO,EAAEN,IAFX;AAGE,IAAA,cAAc,EAAE,MAAME,cAAc,EAHtC;AAIE,IAAA,aAAa,EAAC;AAJhB,KAKMG,UALN,gBAOE,oBAAC,gBAAD;AACE,IAAA,OAAO,EAAE,MAAMJ,iBAAiB,EADlC;AAEE,IAAA,KAAK,EAAE,CACLM,MAAM,CAACC,cADF,EAELD,MAAM,CAACJ,oBAFF,EAGLA,oBAHK;AAFT,kBAQE,oBAAC,YAAD;AACE,IAAA,KAAK,EAAE,CAACI,MAAM,CAACE,qBAAR,EAA+BL,0BAA/B;AADT,KAGGE,QAHH,CARF,CAPF,CADF;AAwBD,CAjCD;;AAmCA,MAAMC,MAAM,GAAGV,UAAU,CAACa,MAAX,CAAkB;AAC/BF,EAAAA,cAAc,EAAE;AACdG,IAAAA,IAAI,EAAE,CADQ;AAEdC,IAAAA,cAAc,EAAE;AAFF,GADe;AAK/BT,EAAAA,oBAAoB,EAAE;AAAEU,IAAAA,eAAe,EAAE;AAAnB,GALS;AAM/BJ,EAAAA,qBAAqB,EAAE;AACrBK,IAAAA,SAAS,EAAE,KADU;AAErBD,IAAAA,eAAe,EAAEf,MAAM,CAACiB,KAFH;AAGrBC,IAAAA,mBAAmB,EAAE,EAHA;AAIrBC,IAAAA,oBAAoB,EAAE;AAJD;AANQ,CAAlB,CAAf;AAcA,eAAelB,WAAf","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"]}
|
package/lib/module/index.js
CHANGED
|
@@ -43,6 +43,7 @@ export const DropdownSelect = _ref => {
|
|
|
43
43
|
checkboxLabelStyle,
|
|
44
44
|
listHeaderComponent,
|
|
45
45
|
listFooterComponent,
|
|
46
|
+
modalProps,
|
|
46
47
|
hideModal = false,
|
|
47
48
|
...rest
|
|
48
49
|
} = _ref;
|
|
@@ -202,7 +203,8 @@ export const DropdownSelect = _ref => {
|
|
|
202
203
|
handleToggleModal: handleToggleModal,
|
|
203
204
|
modalBackgroundStyle: modalBackgroundStyle,
|
|
204
205
|
modalOptionsContainerStyle: modalOptionsContainerStyle,
|
|
205
|
-
onRequestClose: () => {}
|
|
206
|
+
onRequestClose: () => {},
|
|
207
|
+
modalProps: modalProps
|
|
206
208
|
}, /*#__PURE__*/React.createElement(DropdownList, {
|
|
207
209
|
ListHeaderComponent: /*#__PURE__*/React.createElement(React.Fragment, null, isSearchable && /*#__PURE__*/React.createElement(Input, {
|
|
208
210
|
value: searchValue,
|
package/lib/module/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.tsx"],"names":["React","useState","useEffect","TouchableOpacity","StyleSheet","View","Dropdown","DropdownList","CustomModal","Input","CheckBox","colors","DEFAULT_OPTION_LABEL","DEFAULT_OPTION_VALUE","DropdownSelect","placeholder","label","error","helperText","options","optionLabel","optionValue","onValueChange","selectedValue","isMultiple","isSearchable","dropdownIcon","labelStyle","placeholderStyle","dropdownStyle","dropdownIconStyle","dropdownContainerStyle","dropdownErrorStyle","dropdownErrorTextStyle","dropdownHelperTextStyle","selectedItemStyle","multipleSelectedItemStyle","modalBackgroundStyle","modalOptionsContainerStyle","searchInputStyle","primaryColor","disabled","checkboxSize","checkboxStyle","checkboxLabelStyle","listHeaderComponent","listFooterComponent","hideModal","rest","newOptions","setNewOptions","open","setOpen","selectAll","setSelectAll","selectedItem","setSelectedItem","selectedItems","setSelectedItems","searchValue","setSearchValue","Array","isArray","handleSingleSelection","value","handleMultipleSelections","prevVal","selectedValues","includes","filter","item","push","length","handleSelectAll","filteredOptions","i","getSelectedItemsLabel","selectedLabels","forEach","element","selectedItemLabel","find","onSearch","searchText","toString","toLocaleLowerCase","trim","regexFilter","RegExp","searchResults","toLowerCase","search","handleToggleModal","primary","gray","text","styles","optionsContainerStyle","create","paddingHorizontal","paddingVertical","flexDirection"],"mappings":"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","sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { TouchableOpacity, StyleSheet, View } from 'react-native';\nimport Dropdown from './components/Dropdown/Dropdown';\nimport DropdownList from './components/Dropdown/DropdownList';\nimport CustomModal from './components/CustomModal';\nimport { Input } from './components/Input';\nimport CheckBox from './components/CheckBox';\nimport { colors } from './styles/colors';\nimport { DEFAULT_OPTION_LABEL, DEFAULT_OPTION_VALUE } from './constants';\nimport type { DropdownProps } from './types/index.types';\n\nexport const DropdownSelect: React.FC<DropdownProps> = ({\n placeholder,\n label,\n error,\n helperText,\n options,\n optionLabel,\n optionValue,\n onValueChange,\n selectedValue,\n isMultiple,\n isSearchable,\n dropdownIcon,\n labelStyle,\n placeholderStyle,\n dropdownStyle,\n dropdownIconStyle,\n dropdownContainerStyle,\n dropdownErrorStyle,\n dropdownErrorTextStyle,\n dropdownHelperTextStyle,\n selectedItemStyle,\n multipleSelectedItemStyle,\n modalBackgroundStyle,\n modalOptionsContainerStyle,\n searchInputStyle,\n primaryColor,\n disabled,\n checkboxSize,\n checkboxStyle,\n checkboxLabelStyle,\n listHeaderComponent,\n listFooterComponent,\n hideModal = false,\n ...rest\n}) => {\n const [newOptions, setNewOptions] = useState<any[]>([]);\n const [open, setOpen] = useState<boolean>(false);\n const [selectAll, setSelectAll] = useState<boolean>(false);\n const [selectedItem, setSelectedItem] = useState<any>(''); //for single selection\n const [selectedItems, setSelectedItems] = useState<any[]>([]); //for multiple selection\n const [searchValue, setSearchValue] = useState<string>('');\n\n useEffect(() => {\n if (options) {\n setNewOptions(options);\n }\n }, [options]);\n\n useEffect(() => {\n isMultiple\n ? setSelectedItems(Array.isArray(selectedValue) ? selectedValue : [])\n : setSelectedItem(selectedValue);\n }, [selectedValue, isMultiple, onValueChange]);\n\n /*===========================================\n * Selection handlers\n *==========================================*/\n const handleSingleSelection = (value: any) => {\n if (selectedItem === value) {\n setSelectedItem(null);\n onValueChange(null); //send value to parent\n } else {\n setSelectedItem(value);\n onValueChange(value); //send value to parent\n setOpen(false); //close modal upon selection\n }\n };\n\n const handleMultipleSelections = (value: any) => {\n setSelectedItems((prevVal) => {\n let selectedValues = [...prevVal];\n\n if (selectedValues?.includes(value)) {\n selectedValues = selectedValues.filter((item) => item !== value);\n } else {\n selectedValues.push(value);\n }\n\n setSelectedItems(selectedValues);\n onValueChange(selectedValues); //send value to parent\n\n //select all checkbox should not be checked if the list contains disabled values\n if (\n options.filter((item) => !item.disabled).length ===\n selectedValues.length\n ) {\n setSelectAll(true);\n } else {\n setSelectAll(false);\n }\n return selectedValues;\n });\n };\n\n const handleSelectAll = () => {\n setSelectAll((prevVal) => {\n const selectedValues = [];\n const filteredOptions = newOptions.filter((item) => !item.disabled); //don't select disabled items\n if (!prevVal) {\n for (let i = 0; i < filteredOptions.length; i++) {\n selectedValues.push(filteredOptions[i][optionValue]);\n }\n }\n\n setSelectedItems(selectedValues);\n onValueChange(selectedValues); //send value to parent\n return !prevVal;\n });\n };\n\n /*===========================================\n * Get label handler\n *==========================================*/\n const getSelectedItemsLabel = () => {\n if (isMultiple && Array.isArray(selectedItems)) {\n let selectedLabels: Array<string> = [];\n selectedItems?.forEach((element: any) => {\n let selectedItemLabel =\n options &&\n options.find(\n (item: any) => item[optionValue ?? DEFAULT_OPTION_VALUE] === element\n )?.[optionLabel];\n selectedLabels.push(selectedItemLabel);\n });\n return selectedLabels;\n }\n\n let selectedItemLabel =\n options &&\n options.find(\n (item: any) =>\n item[optionValue ?? DEFAULT_OPTION_VALUE] === selectedItem\n );\n return selectedItemLabel?.[optionLabel ?? DEFAULT_OPTION_LABEL];\n };\n\n /*===========================================\n * Search\n *==========================================*/\n const onSearch = (value: string) => {\n setSearchValue(value);\n\n let searchText = value.toString().toLocaleLowerCase().trim();\n\n const regexFilter = new RegExp(searchText, 'i');\n\n const searchResults = options.filter((item: any) => {\n if (\n item[optionLabel ?? DEFAULT_OPTION_LABEL]\n .toString()\n .toLowerCase()\n .search(regexFilter) !== -1 ||\n item[optionValue ?? DEFAULT_OPTION_VALUE]\n .toString(regexFilter)\n .toLowerCase()\n .search(regexFilter) !== -1\n ) {\n return item;\n }\n });\n\n setNewOptions(searchResults);\n };\n\n /*===========================================\n * Modal\n *==========================================*/\n const handleToggleModal = () => {\n setOpen(!open);\n setSearchValue('');\n setNewOptions(options);\n };\n\n useEffect(() => {\n if (hideModal) {\n setOpen(false);\n }\n }, [hideModal]);\n\n let primary = primaryColor || colors.gray;\n return (\n <>\n <Dropdown\n label={label}\n placeholder={placeholder}\n helperText={helperText}\n error={error}\n getSelectedItemsLabel={getSelectedItemsLabel}\n selectedItem={selectedItem}\n selectedItems={selectedItems}\n handleToggleModal={handleToggleModal}\n labelStyle={labelStyle}\n dropdownIcon={dropdownIcon}\n dropdownStyle={dropdownStyle}\n dropdownIconStyle={dropdownIconStyle}\n dropdownContainerStyle={dropdownContainerStyle}\n dropdownErrorStyle={dropdownErrorStyle}\n dropdownErrorTextStyle={dropdownErrorTextStyle}\n dropdownHelperTextStyle={dropdownHelperTextStyle}\n selectedItemStyle={selectedItemStyle}\n multipleSelectedItemStyle={multipleSelectedItemStyle}\n isMultiple={isMultiple}\n primaryColor={primary}\n disabled={disabled}\n placeholderStyle={placeholderStyle}\n {...rest}\n />\n <CustomModal\n open={open}\n handleToggleModal={handleToggleModal}\n modalBackgroundStyle={modalBackgroundStyle}\n modalOptionsContainerStyle={modalOptionsContainerStyle}\n onRequestClose={() => {}}\n >\n <DropdownList\n ListHeaderComponent={\n <>\n {isSearchable && (\n <Input\n value={searchValue}\n onChangeText={(text: string) => onSearch(text)}\n style={searchInputStyle}\n primaryColor={primary}\n />\n )}\n {listHeaderComponent}\n {isMultiple && newOptions.length > 1 && (\n <View style={styles.optionsContainerStyle}>\n <TouchableOpacity onPress={() => {}}>\n <CheckBox\n value={selectAll}\n label={selectAll ? 'Clear all' : 'Select all'}\n onChange={() => handleSelectAll()}\n primaryColor={primary}\n checkboxSize={checkboxSize}\n checkboxStyle={checkboxStyle}\n checkboxLabelStyle={checkboxLabelStyle}\n />\n </TouchableOpacity>\n </View>\n )}\n </>\n }\n ListFooterComponent={listFooterComponent}\n options={newOptions}\n optionLabel={optionLabel}\n optionValue={optionValue}\n isMultiple={isMultiple}\n isSearchable={isSearchable}\n selectedItems={selectedItems}\n selectedItem={selectedItem}\n handleMultipleSelections={handleMultipleSelections}\n handleSingleSelection={handleSingleSelection}\n primaryColor={primary}\n checkboxSize={checkboxSize}\n checkboxStyle={checkboxStyle}\n checkboxLabelStyle={checkboxLabelStyle}\n />\n </CustomModal>\n </>\n );\n};\n\nconst styles = StyleSheet.create({\n optionsContainerStyle: {\n paddingHorizontal: 20,\n paddingVertical: 10,\n flexDirection: 'row',\n },\n});\n\nexport default DropdownSelect;\n"]}
|
|
1
|
+
{"version":3,"sources":["index.tsx"],"names":["React","useState","useEffect","TouchableOpacity","StyleSheet","View","Dropdown","DropdownList","CustomModal","Input","CheckBox","colors","DEFAULT_OPTION_LABEL","DEFAULT_OPTION_VALUE","DropdownSelect","placeholder","label","error","helperText","options","optionLabel","optionValue","onValueChange","selectedValue","isMultiple","isSearchable","dropdownIcon","labelStyle","placeholderStyle","dropdownStyle","dropdownIconStyle","dropdownContainerStyle","dropdownErrorStyle","dropdownErrorTextStyle","dropdownHelperTextStyle","selectedItemStyle","multipleSelectedItemStyle","modalBackgroundStyle","modalOptionsContainerStyle","searchInputStyle","primaryColor","disabled","checkboxSize","checkboxStyle","checkboxLabelStyle","listHeaderComponent","listFooterComponent","modalProps","hideModal","rest","newOptions","setNewOptions","open","setOpen","selectAll","setSelectAll","selectedItem","setSelectedItem","selectedItems","setSelectedItems","searchValue","setSearchValue","Array","isArray","handleSingleSelection","value","handleMultipleSelections","prevVal","selectedValues","includes","filter","item","push","length","handleSelectAll","filteredOptions","i","getSelectedItemsLabel","selectedLabels","forEach","element","selectedItemLabel","find","onSearch","searchText","toString","toLocaleLowerCase","trim","regexFilter","RegExp","searchResults","toLowerCase","search","handleToggleModal","primary","gray","text","styles","optionsContainerStyle","create","paddingHorizontal","paddingVertical","flexDirection"],"mappings":"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","sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { TouchableOpacity, StyleSheet, View } from 'react-native';\nimport Dropdown from './components/Dropdown/Dropdown';\nimport DropdownList from './components/Dropdown/DropdownList';\nimport CustomModal from './components/CustomModal';\nimport { Input } from './components/Input';\nimport CheckBox from './components/CheckBox';\nimport { colors } from './styles/colors';\nimport { DEFAULT_OPTION_LABEL, DEFAULT_OPTION_VALUE } from './constants';\nimport type { DropdownProps } from './types/index.types';\n\nexport const DropdownSelect: React.FC<DropdownProps> = ({\n placeholder,\n label,\n error,\n helperText,\n options,\n optionLabel,\n optionValue,\n onValueChange,\n selectedValue,\n isMultiple,\n isSearchable,\n dropdownIcon,\n labelStyle,\n placeholderStyle,\n dropdownStyle,\n dropdownIconStyle,\n dropdownContainerStyle,\n dropdownErrorStyle,\n dropdownErrorTextStyle,\n dropdownHelperTextStyle,\n selectedItemStyle,\n multipleSelectedItemStyle,\n modalBackgroundStyle,\n modalOptionsContainerStyle,\n searchInputStyle,\n primaryColor,\n disabled,\n checkboxSize,\n checkboxStyle,\n checkboxLabelStyle,\n listHeaderComponent,\n listFooterComponent,\n modalProps,\n hideModal = false,\n ...rest\n}) => {\n const [newOptions, setNewOptions] = useState<any[]>([]);\n const [open, setOpen] = useState<boolean>(false);\n const [selectAll, setSelectAll] = useState<boolean>(false);\n const [selectedItem, setSelectedItem] = useState<any>(''); //for single selection\n const [selectedItems, setSelectedItems] = useState<any[]>([]); //for multiple selection\n const [searchValue, setSearchValue] = useState<string>('');\n\n useEffect(() => {\n if (options) {\n setNewOptions(options);\n }\n }, [options]);\n\n useEffect(() => {\n isMultiple\n ? setSelectedItems(Array.isArray(selectedValue) ? selectedValue : [])\n : setSelectedItem(selectedValue);\n }, [selectedValue, isMultiple, onValueChange]);\n\n /*===========================================\n * Selection handlers\n *==========================================*/\n const handleSingleSelection = (value: any) => {\n if (selectedItem === value) {\n setSelectedItem(null);\n onValueChange(null); //send value to parent\n } else {\n setSelectedItem(value);\n onValueChange(value); //send value to parent\n setOpen(false); //close modal upon selection\n }\n };\n\n const handleMultipleSelections = (value: any) => {\n setSelectedItems((prevVal) => {\n let selectedValues = [...prevVal];\n\n if (selectedValues?.includes(value)) {\n selectedValues = selectedValues.filter((item) => item !== value);\n } else {\n selectedValues.push(value);\n }\n\n setSelectedItems(selectedValues);\n onValueChange(selectedValues); //send value to parent\n\n //select all checkbox should not be checked if the list contains disabled values\n if (\n options.filter((item) => !item.disabled).length ===\n selectedValues.length\n ) {\n setSelectAll(true);\n } else {\n setSelectAll(false);\n }\n return selectedValues;\n });\n };\n\n const handleSelectAll = () => {\n setSelectAll((prevVal) => {\n const selectedValues = [];\n const filteredOptions = newOptions.filter((item) => !item.disabled); //don't select disabled items\n if (!prevVal) {\n for (let i = 0; i < filteredOptions.length; i++) {\n selectedValues.push(filteredOptions[i][optionValue]);\n }\n }\n\n setSelectedItems(selectedValues);\n onValueChange(selectedValues); //send value to parent\n return !prevVal;\n });\n };\n\n /*===========================================\n * Get label handler\n *==========================================*/\n const getSelectedItemsLabel = () => {\n if (isMultiple && Array.isArray(selectedItems)) {\n let selectedLabels: Array<string> = [];\n selectedItems?.forEach((element: any) => {\n let selectedItemLabel =\n options &&\n options.find(\n (item: any) => item[optionValue ?? DEFAULT_OPTION_VALUE] === element\n )?.[optionLabel];\n selectedLabels.push(selectedItemLabel);\n });\n return selectedLabels;\n }\n\n let selectedItemLabel =\n options &&\n options.find(\n (item: any) =>\n item[optionValue ?? DEFAULT_OPTION_VALUE] === selectedItem\n );\n return selectedItemLabel?.[optionLabel ?? DEFAULT_OPTION_LABEL];\n };\n\n /*===========================================\n * Search\n *==========================================*/\n const onSearch = (value: string) => {\n setSearchValue(value);\n\n let searchText = value.toString().toLocaleLowerCase().trim();\n\n const regexFilter = new RegExp(searchText, 'i');\n\n const searchResults = options.filter((item: any) => {\n if (\n item[optionLabel ?? DEFAULT_OPTION_LABEL]\n .toString()\n .toLowerCase()\n .search(regexFilter) !== -1 ||\n item[optionValue ?? DEFAULT_OPTION_VALUE]\n .toString(regexFilter)\n .toLowerCase()\n .search(regexFilter) !== -1\n ) {\n return item;\n }\n });\n\n setNewOptions(searchResults);\n };\n\n /*===========================================\n * Modal\n *==========================================*/\n const handleToggleModal = () => {\n setOpen(!open);\n setSearchValue('');\n setNewOptions(options);\n };\n\n useEffect(() => {\n if (hideModal) {\n setOpen(false);\n }\n }, [hideModal]);\n\n let primary = primaryColor || colors.gray;\n return (\n <>\n <Dropdown\n label={label}\n placeholder={placeholder}\n helperText={helperText}\n error={error}\n getSelectedItemsLabel={getSelectedItemsLabel}\n selectedItem={selectedItem}\n selectedItems={selectedItems}\n handleToggleModal={handleToggleModal}\n labelStyle={labelStyle}\n dropdownIcon={dropdownIcon}\n dropdownStyle={dropdownStyle}\n dropdownIconStyle={dropdownIconStyle}\n dropdownContainerStyle={dropdownContainerStyle}\n dropdownErrorStyle={dropdownErrorStyle}\n dropdownErrorTextStyle={dropdownErrorTextStyle}\n dropdownHelperTextStyle={dropdownHelperTextStyle}\n selectedItemStyle={selectedItemStyle}\n multipleSelectedItemStyle={multipleSelectedItemStyle}\n isMultiple={isMultiple}\n primaryColor={primary}\n disabled={disabled}\n placeholderStyle={placeholderStyle}\n {...rest}\n />\n <CustomModal\n open={open}\n handleToggleModal={handleToggleModal}\n modalBackgroundStyle={modalBackgroundStyle}\n modalOptionsContainerStyle={modalOptionsContainerStyle}\n onRequestClose={() => {}}\n modalProps={modalProps}\n >\n <DropdownList\n ListHeaderComponent={\n <>\n {isSearchable && (\n <Input\n value={searchValue}\n onChangeText={(text: string) => onSearch(text)}\n style={searchInputStyle}\n primaryColor={primary}\n />\n )}\n {listHeaderComponent}\n {isMultiple && newOptions.length > 1 && (\n <View style={styles.optionsContainerStyle}>\n <TouchableOpacity onPress={() => {}}>\n <CheckBox\n value={selectAll}\n label={selectAll ? 'Clear all' : 'Select all'}\n onChange={() => handleSelectAll()}\n primaryColor={primary}\n checkboxSize={checkboxSize}\n checkboxStyle={checkboxStyle}\n checkboxLabelStyle={checkboxLabelStyle}\n />\n </TouchableOpacity>\n </View>\n )}\n </>\n }\n ListFooterComponent={listFooterComponent}\n options={newOptions}\n optionLabel={optionLabel}\n optionValue={optionValue}\n isMultiple={isMultiple}\n isSearchable={isSearchable}\n selectedItems={selectedItems}\n selectedItem={selectedItem}\n handleMultipleSelections={handleMultipleSelections}\n handleSingleSelection={handleSingleSelection}\n primaryColor={primary}\n checkboxSize={checkboxSize}\n checkboxStyle={checkboxStyle}\n checkboxLabelStyle={checkboxLabelStyle}\n />\n </CustomModal>\n </>\n );\n};\n\nconst styles = StyleSheet.create({\n optionsContainerStyle: {\n paddingHorizontal: 20,\n paddingVertical: 10,\n flexDirection: 'row',\n },\n});\n\nexport default DropdownSelect;\n"]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
declare const CustomModal: ({ open, handleToggleModal, onRequestClose, modalBackgroundStyle, modalOptionsContainerStyle, children, }: any) => JSX.Element;
|
|
2
|
+
declare const CustomModal: ({ open, handleToggleModal, onRequestClose, modalBackgroundStyle, modalOptionsContainerStyle, modalProps, children, }: any) => JSX.Element;
|
|
3
3
|
export default CustomModal;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import type { ViewStyle, ColorValue, TextStyle } from 'react-native';
|
|
2
|
+
import type { ViewStyle, ColorValue, TextStyle, ModalProps } from 'react-native';
|
|
3
3
|
export declare type DropdownProps = {
|
|
4
4
|
placeholder?: string;
|
|
5
5
|
label?: string;
|
|
@@ -34,4 +34,5 @@ export declare type DropdownProps = {
|
|
|
34
34
|
listHeaderComponent?: React.ReactNode;
|
|
35
35
|
listFooterComponent?: React.ReactNode;
|
|
36
36
|
hideModal?: boolean;
|
|
37
|
+
modalProps?: ModalProps;
|
|
37
38
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-native-input-select",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.34.0",
|
|
4
4
|
"description": "A customizable dropdown selection package for react-native for android and iOS with multiple select and search capabilities.",
|
|
5
5
|
"main": "lib/commonjs/index",
|
|
6
6
|
"module": "lib/module/index",
|
|
@@ -13,6 +13,7 @@ const CustomModal = ({
|
|
|
13
13
|
onRequestClose,
|
|
14
14
|
modalBackgroundStyle,
|
|
15
15
|
modalOptionsContainerStyle,
|
|
16
|
+
modalProps,
|
|
16
17
|
children,
|
|
17
18
|
}: any) => {
|
|
18
19
|
return (
|
|
@@ -21,6 +22,7 @@ const CustomModal = ({
|
|
|
21
22
|
visible={open}
|
|
22
23
|
onRequestClose={() => onRequestClose()}
|
|
23
24
|
animationType="fade"
|
|
25
|
+
{...modalProps}
|
|
24
26
|
>
|
|
25
27
|
<TouchableOpacity
|
|
26
28
|
onPress={() => handleToggleModal()}
|
package/src/index.tsx
CHANGED
|
@@ -42,6 +42,7 @@ export const DropdownSelect: React.FC<DropdownProps> = ({
|
|
|
42
42
|
checkboxLabelStyle,
|
|
43
43
|
listHeaderComponent,
|
|
44
44
|
listFooterComponent,
|
|
45
|
+
modalProps,
|
|
45
46
|
hideModal = false,
|
|
46
47
|
...rest
|
|
47
48
|
}) => {
|
|
@@ -223,6 +224,7 @@ export const DropdownSelect: React.FC<DropdownProps> = ({
|
|
|
223
224
|
modalBackgroundStyle={modalBackgroundStyle}
|
|
224
225
|
modalOptionsContainerStyle={modalOptionsContainerStyle}
|
|
225
226
|
onRequestClose={() => {}}
|
|
227
|
+
modalProps={modalProps}
|
|
226
228
|
>
|
|
227
229
|
<DropdownList
|
|
228
230
|
ListHeaderComponent={
|
package/src/types/index.types.ts
CHANGED
|
@@ -1,4 +1,9 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type {
|
|
2
|
+
ViewStyle,
|
|
3
|
+
ColorValue,
|
|
4
|
+
TextStyle,
|
|
5
|
+
ModalProps,
|
|
6
|
+
} from 'react-native';
|
|
2
7
|
|
|
3
8
|
export type DropdownProps = {
|
|
4
9
|
placeholder?: string;
|
|
@@ -41,4 +46,5 @@ export type DropdownProps = {
|
|
|
41
46
|
listHeaderComponent?: React.ReactNode;
|
|
42
47
|
listFooterComponent?: React.ReactNode;
|
|
43
48
|
hideModal?: boolean;
|
|
49
|
+
modalProps?: ModalProps;
|
|
44
50
|
};
|