react-native-input-select 0.23.0 → 0.25.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.
Files changed (50) hide show
  1. package/lib/commonjs/components/CheckBox/index.js +6 -2
  2. package/lib/commonjs/components/CheckBox/index.js.map +1 -1
  3. package/lib/commonjs/components/CheckBox/types.js.map +1 -1
  4. package/lib/commonjs/components/Dropdown/Dropdown.js +2 -2
  5. package/lib/commonjs/components/Dropdown/Dropdown.js.map +1 -1
  6. package/lib/commonjs/components/Dropdown/DropdownList.js +12 -16
  7. package/lib/commonjs/components/Dropdown/DropdownList.js.map +1 -1
  8. package/lib/commonjs/components/Dropdown/DropdownListItem.js +6 -6
  9. package/lib/commonjs/components/Dropdown/DropdownListItem.js.map +1 -1
  10. package/lib/commonjs/components/Dropdown/{SelectedItemsView.js → DropdownSelectedItemsView.js} +5 -4
  11. package/lib/commonjs/components/Dropdown/DropdownSelectedItemsView.js.map +1 -0
  12. package/lib/commonjs/index.js +51 -7
  13. package/lib/commonjs/index.js.map +1 -1
  14. package/lib/commonjs/styles/colors.js +3 -2
  15. package/lib/commonjs/styles/colors.js.map +1 -1
  16. package/lib/commonjs/types/index.types.js.map +1 -1
  17. package/lib/module/components/CheckBox/index.js +6 -2
  18. package/lib/module/components/CheckBox/index.js.map +1 -1
  19. package/lib/module/components/CheckBox/types.js.map +1 -1
  20. package/lib/module/components/Dropdown/Dropdown.js +2 -2
  21. package/lib/module/components/Dropdown/Dropdown.js.map +1 -1
  22. package/lib/module/components/Dropdown/DropdownList.js +13 -16
  23. package/lib/module/components/Dropdown/DropdownList.js.map +1 -1
  24. package/lib/module/components/Dropdown/DropdownListItem.js +6 -6
  25. package/lib/module/components/Dropdown/DropdownListItem.js.map +1 -1
  26. package/lib/module/components/Dropdown/{SelectedItemsView.js → DropdownSelectedItemsView.js} +5 -4
  27. package/lib/module/components/Dropdown/DropdownSelectedItemsView.js.map +1 -0
  28. package/lib/module/index.js +51 -7
  29. package/lib/module/index.js.map +1 -1
  30. package/lib/module/styles/colors.js +3 -2
  31. package/lib/module/styles/colors.js.map +1 -1
  32. package/lib/module/types/index.types.js.map +1 -1
  33. package/lib/typescript/components/CheckBox/index.d.ts +1 -1
  34. package/lib/typescript/components/CheckBox/types.d.ts +1 -0
  35. package/lib/typescript/components/Dropdown/DropdownList.d.ts +1 -1
  36. package/lib/typescript/components/Dropdown/DropdownSelectedItemsView.d.ts +3 -0
  37. package/lib/typescript/types/index.types.d.ts +1 -1
  38. package/package.json +1 -1
  39. package/src/components/CheckBox/index.tsx +10 -1
  40. package/src/components/CheckBox/types.ts +1 -0
  41. package/src/components/Dropdown/Dropdown.tsx +2 -2
  42. package/src/components/Dropdown/DropdownList.tsx +8 -11
  43. package/src/components/Dropdown/DropdownListItem.tsx +7 -5
  44. package/src/components/Dropdown/{SelectedItemsView.tsx → DropdownSelectedItemsView.tsx} +3 -2
  45. package/src/index.tsx +63 -10
  46. package/src/styles/colors.ts +2 -1
  47. package/src/types/index.types.ts +1 -1
  48. package/lib/commonjs/components/Dropdown/SelectedItemsView.js.map +0 -1
  49. package/lib/module/components/Dropdown/SelectedItemsView.js.map +0 -1
  50. package/lib/typescript/components/Dropdown/SelectedItemsView.d.ts +0 -3
@@ -1 +1 @@
1
- {"version":3,"names":["React","Pressable","Text","StyleSheet","Image","View","CHECKBOX_SIZE","CheckBox","_ref","label","value","primaryColor","checkboxSize","checkboxStyle","checkboxLabelStyle","onChange","fillColor","backgroundColor","createElement","onPress","style","styles","checkboxContainer","checkbox","source","require","height","width","labelStyle","create","flexDirection","flexWrap","alignItems","padding","borderWidth","borderStyle","borderRadius","borderColor","marginLeft"],"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 { CHECKBOX_SIZE } from '../../constants';\nimport type { CheckboxProps } from './types';\n\nconst CheckBox = ({\n label,\n value,\n primaryColor,\n checkboxSize,\n checkboxStyle,\n checkboxLabelStyle,\n onChange,\n}: CheckboxProps) => {\n const fillColor = {\n backgroundColor: value ? primaryColor || 'green' : 'white',\n };\n return (\n <Pressable\n onPress={onChange ? () => onChange(!value) : () => {}}\n style={[styles.checkboxContainer]}\n >\n <View style={[styles.checkbox, checkboxStyle, fillColor]}>\n <Image\n source={require('../../asset/check.png')}\n style={[\n {\n height: checkboxSize || CHECKBOX_SIZE,\n width: checkboxSize || CHECKBOX_SIZE,\n },\n ]}\n />\n </View>\n {label && (\n <Text style={[checkboxLabelStyle, styles.labelStyle]}>{label}</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":"AAAA;AACA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,SAAS,EAAEC,IAAI,EAAEC,UAAU,EAAEC,KAAK,EAAEC,IAAI,QAAQ,cAAc;AACvE,SAASC,aAAa,QAAQ,iBAAiB;AAG/C,MAAMC,QAAQ,GAAGC,IAAA,IAQI;EAAA,IARH;IAChBC,KAAK;IACLC,KAAK;IACLC,YAAY;IACZC,YAAY;IACZC,aAAa;IACbC,kBAAkB;IAClBC;EACa,CAAC,GAAAP,IAAA;EACd,MAAMQ,SAAS,GAAG;IAChBC,eAAe,EAAEP,KAAK,GAAGC,YAAY,IAAI,OAAO,GAAG;EACrD,CAAC;EACD,oBACEX,KAAA,CAAAkB,aAAA,CAACjB,SAAS;IACRkB,OAAO,EAAEJ,QAAQ,GAAG,MAAMA,QAAQ,CAAC,CAACL,KAAK,CAAC,GAAG,MAAM,CAAC,CAAE;IACtDU,KAAK,EAAE,CAACC,MAAM,CAACC,iBAAiB;EAAE,gBAElCtB,KAAA,CAAAkB,aAAA,CAACb,IAAI;IAACe,KAAK,EAAE,CAACC,MAAM,CAACE,QAAQ,EAAEV,aAAa,EAAEG,SAAS;EAAE,gBACvDhB,KAAA,CAAAkB,aAAA,CAACd,KAAK;IACJoB,MAAM,EAAEC,OAAO,CAAC,uBAAuB,CAAE;IACzCL,KAAK,EAAE,CACL;MACEM,MAAM,EAAEd,YAAY,IAAIN,aAAa;MACrCqB,KAAK,EAAEf,YAAY,IAAIN;IACzB,CAAC;EACD,EACF,CACG,EACNG,KAAK,iBACJT,KAAA,CAAAkB,aAAA,CAAChB,IAAI;IAACkB,KAAK,EAAE,CAACN,kBAAkB,EAAEO,MAAM,CAACO,UAAU;EAAE,GAAEnB,KAAK,CAC7D,CACS;AAEhB,CAAC;AAED,MAAMY,MAAM,GAAGlB,UAAU,CAAC0B,MAAM,CAAC;EAC/BP,iBAAiB,EAAE;IACjBQ,aAAa,EAAE,KAAK;IACpBC,QAAQ,EAAE,QAAQ;IAClBC,UAAU,EAAE;EACd,CAAC;EACDT,QAAQ,EAAE;IACRU,OAAO,EAAE,CAAC;IACVC,WAAW,EAAE,CAAC;IACdC,WAAW,EAAE,OAAO;IACpBC,YAAY,EAAE,CAAC;IACfC,WAAW,EAAE;EACf,CAAC;EACDT,UAAU,EAAE;IAAEU,UAAU,EAAE;EAAG;AAC/B,CAAC,CAAC;AAEF,eAAe/B,QAAQ"}
1
+ {"version":3,"names":["React","Pressable","Text","StyleSheet","Image","View","colors","CHECKBOX_SIZE","CheckBox","_ref","label","value","disabled","primaryColor","checkboxSize","checkboxStyle","checkboxLabelStyle","onChange","fillColor","backgroundColor","borderColor","styles","checkbox","createElement","onPress","style","checkboxContainer","source","require","height","width","labelStyle","create","flexDirection","flexWrap","alignItems","padding","borderWidth","borderStyle","borderRadius","marginLeft"],"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\nconst CheckBox = ({\n label,\n value,\n disabled,\n primaryColor,\n checkboxSize,\n checkboxStyle,\n checkboxLabelStyle,\n onChange,\n}: CheckboxProps) => {\n const fillColor = {\n backgroundColor: disabled\n ? '#d3d3d3'\n : value\n ? checkboxStyle?.backgroundColor || primaryColor || 'green'\n : 'white',\n borderColor: disabled ? colors.disabled : styles.checkbox.borderColor,\n };\n\n return (\n <Pressable\n onPress={onChange ? () => onChange(!value) : () => {}}\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: checkboxSize || CHECKBOX_SIZE,\n width: checkboxSize || CHECKBOX_SIZE,\n },\n ]}\n />\n </View>\n {label && (\n <Text style={[checkboxLabelStyle, styles.labelStyle]}>{label}</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":"AAAA;AACA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,SAAS,EAAEC,IAAI,EAAEC,UAAU,EAAEC,KAAK,EAAEC,IAAI,QAAQ,cAAc;AACvE,SAASC,MAAM,QAAQ,qBAAqB;AAC5C,SAASC,aAAa,QAAQ,iBAAiB;AAG/C,MAAMC,QAAQ,GAAGC,IAAA,IASI;EAAA,IATH;IAChBC,KAAK;IACLC,KAAK;IACLC,QAAQ;IACRC,YAAY;IACZC,YAAY;IACZC,aAAa;IACbC,kBAAkB;IAClBC;EACa,CAAC,GAAAR,IAAA;EACd,MAAMS,SAAS,GAAG;IAChBC,eAAe,EAAEP,QAAQ,GACrB,SAAS,GACTD,KAAK,GACL,CAAAI,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEI,eAAe,KAAIN,YAAY,IAAI,OAAO,GACzD,OAAO;IACXO,WAAW,EAAER,QAAQ,GAAGN,MAAM,CAACM,QAAQ,GAAGS,MAAM,CAACC,QAAQ,CAACF;EAC5D,CAAC;EAED,oBACEpB,KAAA,CAAAuB,aAAA,CAACtB,SAAS;IACRuB,OAAO,EAAEP,QAAQ,GAAG,MAAMA,QAAQ,CAAC,CAACN,KAAK,CAAC,GAAG,MAAM,CAAC,CAAE;IACtDc,KAAK,EAAE,CAACJ,MAAM,CAACK,iBAAiB,CAAE;IAClCd,QAAQ,EAAEA;EAAS,gBAEnBZ,KAAA,CAAAuB,aAAA,CAAClB,IAAI;IAACoB,KAAK,EAAE,CAACJ,MAAM,CAACC,QAAQ,EAAEP,aAAa,EAAEG,SAAS;EAAE,gBACvDlB,KAAA,CAAAuB,aAAA,CAACnB,KAAK;IACJuB,MAAM,EAAEC,OAAO,CAAC,uBAAuB,CAAE;IACzCH,KAAK,EAAE,CACL;MACEI,MAAM,EAAEf,YAAY,IAAIP,aAAa;MACrCuB,KAAK,EAAEhB,YAAY,IAAIP;IACzB,CAAC;EACD,EACF,CACG,EACNG,KAAK,iBACJV,KAAA,CAAAuB,aAAA,CAACrB,IAAI;IAACuB,KAAK,EAAE,CAACT,kBAAkB,EAAEK,MAAM,CAACU,UAAU;EAAE,GAAErB,KAAK,CAC7D,CACS;AAEhB,CAAC;AAED,MAAMW,MAAM,GAAGlB,UAAU,CAAC6B,MAAM,CAAC;EAC/BN,iBAAiB,EAAE;IACjBO,aAAa,EAAE,KAAK;IACpBC,QAAQ,EAAE,QAAQ;IAClBC,UAAU,EAAE;EACd,CAAC;EACDb,QAAQ,EAAE;IACRc,OAAO,EAAE,CAAC;IACVC,WAAW,EAAE,CAAC;IACdC,WAAW,EAAE,OAAO;IACpBC,YAAY,EAAE,CAAC;IACfnB,WAAW,EAAE;EACf,CAAC;EACDW,UAAU,EAAE;IAAES,UAAU,EAAE;EAAG;AAC/B,CAAC,CAAC;AAEF,eAAehC,QAAQ"}
@@ -1 +1 @@
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 primaryColor?: ColorValue;\n checkboxSize?: number;\n checkboxStyle?: ViewStyle;\n checkboxLabelStyle?: TextStyle;\n onChange?: (value: boolean | string | number) => void;\n};\n"],"mappings":""}
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 onChange?: (value: boolean | string | number) => void;\n};\n"],"mappings":""}
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import { View, Text, StyleSheet } from 'react-native';
3
- import SelectedItemsView from './SelectedItemsView';
3
+ import DropdownSelectedItemsView from './DropdownSelectedItemsView';
4
4
  import { colors } from '../../styles/colors';
5
5
  import { typography } from '../../styles/typography';
6
6
  const Dropdown = _ref => {
@@ -29,7 +29,7 @@ const Dropdown = _ref => {
29
29
  style: [styles.dropdownInputContainer, dropdownContainerStyle]
30
30
  }, label && label !== '' && /*#__PURE__*/React.createElement(Text, {
31
31
  style: [styles.label, labelStyle]
32
- }, label), /*#__PURE__*/React.createElement(SelectedItemsView, {
32
+ }, label), /*#__PURE__*/React.createElement(DropdownSelectedItemsView, {
33
33
  placeholder: placeholder,
34
34
  error: error,
35
35
  getSelectedItemsLabel: getSelectedItemsLabel,
@@ -1 +1 @@
1
- {"version":3,"names":["React","View","Text","StyleSheet","SelectedItemsView","colors","typography","Dropdown","_ref","label","placeholder","helperText","error","getSelectedItemsLabel","handleToggleModal","isMultiple","selectedItem","selectedItems","labelStyle","dropdownStyle","dropdownContainerStyle","selectedItemStyle","multipleSelectedItemStyle","dropdownErrorStyle","dropdownErrorTextStyle","dropdownHelperTextStyle","primaryColor","disabled","createElement","style","styles","dropdownInputContainer","helper","create","marginBottom","color","gray","caption","inputFocusErrorState","borderWidth","borderStyle","borderColor","red","marginTop","primary","width","blackText","black"],"sources":["Dropdown.tsx"],"sourcesContent":["import React from 'react';\nimport { View, Text, StyleSheet } from 'react-native';\nimport SelectedItemsView from './SelectedItemsView';\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 labelStyle,\n dropdownStyle,\n dropdownContainerStyle,\n selectedItemStyle,\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 <SelectedItemsView\n placeholder={placeholder}\n error={error}\n getSelectedItemsLabel={getSelectedItemsLabel}\n handleToggleModal={handleToggleModal}\n isMultiple={isMultiple}\n selectedItem={selectedItem}\n selectedItems={selectedItems}\n dropdownStyle={dropdownStyle}\n selectedItemStyle={selectedItemStyle}\n multipleSelectedItemStyle={multipleSelectedItemStyle}\n dropdownErrorStyle={dropdownErrorStyle}\n primaryColor={primaryColor}\n disabled={disabled}\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 inputFocusErrorState: {\n borderWidth: 2,\n borderStyle: 'solid',\n borderColor: colors.red,\n },\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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"}
1
+ {"version":3,"names":["React","View","Text","StyleSheet","DropdownSelectedItemsView","colors","typography","Dropdown","_ref","label","placeholder","helperText","error","getSelectedItemsLabel","handleToggleModal","isMultiple","selectedItem","selectedItems","labelStyle","dropdownStyle","dropdownContainerStyle","selectedItemStyle","multipleSelectedItemStyle","dropdownErrorStyle","dropdownErrorTextStyle","dropdownHelperTextStyle","primaryColor","disabled","createElement","style","styles","dropdownInputContainer","helper","create","marginBottom","color","gray","caption","inputFocusErrorState","borderWidth","borderStyle","borderColor","red","marginTop","primary","width","blackText","black"],"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 labelStyle,\n dropdownStyle,\n dropdownContainerStyle,\n selectedItemStyle,\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 dropdownStyle={dropdownStyle}\n selectedItemStyle={selectedItemStyle}\n multipleSelectedItemStyle={multipleSelectedItemStyle}\n dropdownErrorStyle={dropdownErrorStyle}\n primaryColor={primaryColor}\n disabled={disabled}\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 inputFocusErrorState: {\n borderWidth: 2,\n borderStyle: 'solid',\n borderColor: colors.red,\n },\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":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AACrD,OAAOC,yBAAyB,MAAM,6BAA6B;AACnE,SAASC,MAAM,QAAQ,qBAAqB;AAC5C,SAASC,UAAU,QAAQ,yBAAyB;AAEpD,MAAMC,QAAQ,GAAGC,IAAA,IAoBN;EAAA,IApBO;IAChBC,KAAK;IACLC,WAAW;IACXC,UAAU;IACVC,KAAK;IACLC,qBAAqB;IACrBC,iBAAiB;IACjBC,UAAU;IACVC,YAAY;IACZC,aAAa;IACbC,UAAU;IACVC,aAAa;IACbC,sBAAsB;IACtBC,iBAAiB;IACjBC,yBAAyB;IACzBC,kBAAkB;IAClBC,sBAAsB;IACtBC,uBAAuB;IACvBC,YAAY;IACZC;EACG,CAAC,GAAAnB,IAAA;EACJ,oBACER,KAAA,CAAA4B,aAAA,CAAC3B,IAAI;IAAC4B,KAAK,EAAE,CAACC,MAAM,CAACC,sBAAsB,EAAEX,sBAAsB;EAAE,GAClEX,KAAK,IAAIA,KAAK,KAAK,EAAE,iBACpBT,KAAA,CAAA4B,aAAA,CAAC1B,IAAI;IAAC2B,KAAK,EAAE,CAACC,MAAM,CAACrB,KAAK,EAAES,UAAU;EAAE,GAAET,KAAK,CAChD,eACDT,KAAA,CAAA4B,aAAA,CAACxB,yBAAyB;IACxBM,WAAW,EAAEA,WAAY;IACzBE,KAAK,EAAEA,KAAM;IACbC,qBAAqB,EAAEA,qBAAsB;IAC7CC,iBAAiB,EAAEA,iBAAkB;IACrCC,UAAU,EAAEA,UAAW;IACvBC,YAAY,EAAEA,YAAa;IAC3BC,aAAa,EAAEA,aAAc;IAC7BE,aAAa,EAAEA,aAAc;IAC7BE,iBAAiB,EAAEA,iBAAkB;IACrCC,yBAAyB,EAAEA,yBAA0B;IACrDC,kBAAkB,EAAEA,kBAAmB;IACvCG,YAAY,EAAEA,YAAa;IAC3BC,QAAQ,EAAEA;EAAS,EACnB,EAEDf,KAAK,IAAIA,KAAK,KAAK,EAAE,iBACpBZ,KAAA,CAAA4B,aAAA,CAAC1B,IAAI;IAAC2B,KAAK,EAAE,CAACC,MAAM,CAAClB,KAAK,EAAEY,sBAAsB;EAAE,GAAEZ,KAAK,CAC5D,EAEAD,UAAU,IAAIA,UAAU,KAAK,EAAE,IAAI,CAACC,KAAK,iBACxCZ,KAAA,CAAA4B,aAAA,CAAC1B,IAAI;IAAC2B,KAAK,EAAE,CAACC,MAAM,CAACE,MAAM,EAAEP,uBAAuB;EAAE,GACnDd,UAAU,CAEd,CACI;AAEX,CAAC;AAED,MAAMmB,MAAM,GAAG3B,UAAU,CAAC8B,MAAM,CAAC;EAC/BxB,KAAK,EAAE;IAAEyB,YAAY,EAAE,EAAE;IAAEC,KAAK,EAAE9B,MAAM,CAAC+B,IAAI;IAAE,GAAG9B,UAAU,CAAC+B;EAAQ,CAAC;EACtEC,oBAAoB,EAAE;IACpBC,WAAW,EAAE,CAAC;IACdC,WAAW,EAAE,OAAO;IACpBC,WAAW,EAAEpC,MAAM,CAACqC;EACtB,CAAC;EACD9B,KAAK,EAAE;IAAEuB,KAAK,EAAE9B,MAAM,CAACqC,GAAG;IAAEC,SAAS,EAAE,CAAC;IAAE,GAAGrC,UAAU,CAAC+B;EAAQ,CAAC;EACjEL,MAAM,EAAE;IAAEW,SAAS,EAAE,CAAC;IAAER,KAAK,EAAE9B,MAAM,CAACuC,OAAO;IAAE,GAAGtC,UAAU,CAAC+B;EAAQ,CAAC;EACtEN,sBAAsB,EAAE;IAAEG,YAAY,EAAE,EAAE;IAAEW,KAAK,EAAE;EAAO,CAAC;EAC3DC,SAAS,EAAE;IAAEX,KAAK,EAAE9B,MAAM,CAAC0C;EAAM;AACnC,CAAC,CAAC;AAEF,eAAexC,QAAQ"}
@@ -1,3 +1,5 @@
1
+ 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); }
2
+ /* eslint-disable react-native/no-inline-styles */
1
3
  import React from 'react';
2
4
  import { View, FlatList, StyleSheet, Text } from 'react-native';
3
5
  import DropdownListItem from './DropdownListItem';
@@ -8,6 +10,7 @@ const DropdownList = _ref => {
8
10
  optionLabel,
9
11
  optionValue,
10
12
  isMultiple,
13
+ isSearchable,
11
14
  selectedItems,
12
15
  selectedItem,
13
16
  handleMultipleSelections,
@@ -15,15 +18,19 @@ const DropdownList = _ref => {
15
18
  primaryColor,
16
19
  checkboxSize,
17
20
  checkboxStyle,
18
- checkboxLabelStyle
21
+ checkboxLabelStyle,
22
+ ...rest
19
23
  } = _ref;
20
- return /*#__PURE__*/React.createElement(FlatList, {
24
+ return /*#__PURE__*/React.createElement(FlatList, _extends({
21
25
  data: options,
22
26
  extraData: isMultiple ? selectedItems : selectedItem,
23
27
  initialNumToRender: 5,
24
28
  ListEmptyComponent: /*#__PURE__*/React.createElement(View, {
25
29
  style: styles.emptyListStyle
26
30
  }, /*#__PURE__*/React.createElement(Text, null, "No options available")),
31
+ contentContainerStyle: [isSearchable ? {
32
+ paddingTop: 0
33
+ } : styles.contentContainerStyle],
27
34
  ItemSeparatorComponent: () => /*#__PURE__*/React.createElement(View, {
28
35
  style: styles.itemSeparatorStyle
29
36
  }),
@@ -39,7 +46,7 @@ const DropdownList = _ref => {
39
46
  checkboxLabelStyle
40
47
  }),
41
48
  keyExtractor: (_item, index) => `Options${index}`
42
- });
49
+ }, rest));
43
50
  };
44
51
  const _renderItem = (_ref2, props) => {
45
52
  let {
@@ -59,19 +66,6 @@ const _renderItem = (_ref2, props) => {
59
66
  });
60
67
  };
61
68
  const styles = StyleSheet.create({
62
- modalContainer: {
63
- flex: 1,
64
- justifyContent: 'flex-end'
65
- },
66
- modalBackgroundStyle: {
67
- backgroundColor: 'rgba(0, 0, 0, 0.5)'
68
- },
69
- modalOptionsContainer: {
70
- maxHeight: '50%',
71
- backgroundColor: colors.white,
72
- borderTopLeftRadius: 16,
73
- borderTopRightRadius: 16
74
- },
75
69
  itemSeparatorStyle: {
76
70
  backgroundColor: colors.gray,
77
71
  height: 1,
@@ -81,6 +75,9 @@ const styles = StyleSheet.create({
81
75
  alignItems: 'center',
82
76
  width: '100%',
83
77
  marginVertical: 20
78
+ },
79
+ contentContainerStyle: {
80
+ paddingTop: 20
84
81
  }
85
82
  });
86
83
  export default DropdownList;
@@ -1 +1 @@
1
- {"version":3,"names":["React","View","FlatList","StyleSheet","Text","DropdownListItem","colors","DropdownList","_ref","options","optionLabel","optionValue","isMultiple","selectedItems","selectedItem","handleMultipleSelections","handleSingleSelection","primaryColor","checkboxSize","checkboxStyle","checkboxLabelStyle","createElement","data","extraData","initialNumToRender","ListEmptyComponent","style","styles","emptyListStyle","ItemSeparatorComponent","itemSeparatorStyle","renderItem","item","_renderItem","selectedOption","onChange","keyExtractor","_item","index","_ref2","props","create","modalContainer","flex","justifyContent","modalBackgroundStyle","backgroundColor","modalOptionsContainer","maxHeight","white","borderTopLeftRadius","borderTopRightRadius","gray","height","opacity","alignItems","width","marginVertical"],"sources":["DropdownList.tsx"],"sourcesContent":["import React from 'react';\nimport { View, FlatList, StyleSheet, Text } from 'react-native';\nimport DropdownListItem from './DropdownListItem';\nimport { colors } from '../../styles/colors';\n\nconst DropdownList = ({\n options,\n optionLabel,\n optionValue,\n isMultiple,\n selectedItems,\n selectedItem,\n handleMultipleSelections,\n handleSingleSelection,\n primaryColor,\n checkboxSize,\n checkboxStyle,\n checkboxLabelStyle,\n}: any) => {\n return (\n <FlatList\n data={options}\n extraData={isMultiple ? selectedItems : selectedItem}\n initialNumToRender={5}\n ListEmptyComponent={\n <View style={styles.emptyListStyle}>\n <Text>No options available</Text>\n </View>\n }\n ItemSeparatorComponent={() => <View style={styles.itemSeparatorStyle} />}\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,\n checkboxStyle,\n checkboxLabelStyle,\n })\n }\n keyExtractor={(_item, index) => `Options${index}`}\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 />\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 itemSeparatorStyle: {\n backgroundColor: colors.gray,\n height: 1,\n opacity: 0.15,\n },\n emptyListStyle: { alignItems: 'center', width: '100%', marginVertical: 20 },\n});\n\nexport default DropdownList;\n"],"mappings":"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"}
1
+ {"version":3,"names":["React","View","FlatList","StyleSheet","Text","DropdownListItem","colors","DropdownList","_ref","options","optionLabel","optionValue","isMultiple","isSearchable","selectedItems","selectedItem","handleMultipleSelections","handleSingleSelection","primaryColor","checkboxSize","checkboxStyle","checkboxLabelStyle","rest","createElement","_extends","data","extraData","initialNumToRender","ListEmptyComponent","style","styles","emptyListStyle","contentContainerStyle","paddingTop","ItemSeparatorComponent","itemSeparatorStyle","renderItem","item","_renderItem","selectedOption","onChange","keyExtractor","_item","index","_ref2","props","create","backgroundColor","gray","height","opacity","alignItems","width","marginVertical"],"sources":["DropdownList.tsx"],"sourcesContent":["/* eslint-disable react-native/no-inline-styles */\nimport React from 'react';\nimport { View, FlatList, StyleSheet, Text } from 'react-native';\nimport DropdownListItem from './DropdownListItem';\nimport { colors } from '../../styles/colors';\n\nconst DropdownList = ({\n options,\n optionLabel,\n optionValue,\n isMultiple,\n isSearchable,\n selectedItems,\n selectedItem,\n handleMultipleSelections,\n handleSingleSelection,\n primaryColor,\n checkboxSize,\n checkboxStyle,\n checkboxLabelStyle,\n ...rest\n}: any) => {\n return (\n <FlatList\n data={options}\n extraData={isMultiple ? selectedItems : selectedItem}\n initialNumToRender={5}\n ListEmptyComponent={\n <View style={styles.emptyListStyle}>\n <Text>No options available</Text>\n </View>\n }\n contentContainerStyle={[\n isSearchable ? { paddingTop: 0 } : styles.contentContainerStyle,\n ]}\n ItemSeparatorComponent={() => <View style={styles.itemSeparatorStyle} />}\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,\n checkboxStyle,\n checkboxLabelStyle,\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 />\n );\n};\n\nconst styles = StyleSheet.create({\n itemSeparatorStyle: {\n backgroundColor: colors.gray,\n height: 1,\n opacity: 0.15,\n },\n emptyListStyle: { alignItems: 'center', width: '100%', marginVertical: 20 },\n contentContainerStyle: { paddingTop: 20 },\n});\n\nexport default DropdownList;\n"],"mappings":";AAAA;AACA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,QAAQ,EAAEC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAC/D,OAAOC,gBAAgB,MAAM,oBAAoB;AACjD,SAASC,MAAM,QAAQ,qBAAqB;AAE5C,MAAMC,YAAY,GAAGC,IAAA,IAeV;EAAA,IAfW;IACpBC,OAAO;IACPC,WAAW;IACXC,WAAW;IACXC,UAAU;IACVC,YAAY;IACZC,aAAa;IACbC,YAAY;IACZC,wBAAwB;IACxBC,qBAAqB;IACrBC,YAAY;IACZC,YAAY;IACZC,aAAa;IACbC,kBAAkB;IAClB,GAAGC;EACA,CAAC,GAAAd,IAAA;EACJ,oBACER,KAAA,CAAAuB,aAAA,CAACrB,QAAQ,EAAAsB,QAAA;IACPC,IAAI,EAAEhB,OAAQ;IACdiB,SAAS,EAAEd,UAAU,GAAGE,aAAa,GAAGC,YAAa;IACrDY,kBAAkB,EAAE,CAAE;IACtBC,kBAAkB,eAChB5B,KAAA,CAAAuB,aAAA,CAACtB,IAAI;MAAC4B,KAAK,EAAEC,MAAM,CAACC;IAAe,gBACjC/B,KAAA,CAAAuB,aAAA,CAACnB,IAAI,QAAC,sBAAoB,CAAO,CAEpC;IACD4B,qBAAqB,EAAE,CACrBnB,YAAY,GAAG;MAAEoB,UAAU,EAAE;IAAE,CAAC,GAAGH,MAAM,CAACE,qBAAqB,CAC/D;IACFE,sBAAsB,EAAEA,CAAA,kBAAMlC,KAAA,CAAAuB,aAAA,CAACtB,IAAI;MAAC4B,KAAK,EAAEC,MAAM,CAACK;IAAmB,EAAI;IACzEC,UAAU,EAAGC,IAAI,IACfC,WAAW,CAACD,IAAI,EAAE;MAChB3B,WAAW;MACXC,WAAW;MACXC,UAAU;MACV2B,cAAc,EAAE3B,UAAU,GAAGE,aAAa,GAAGC,YAAY;MACzDyB,QAAQ,EAAE5B,UAAU,GAChBI,wBAAwB,GACxBC,qBAAqB;MACzBC,YAAY;MACZC,YAAY;MACZC,aAAa;MACbC;IACF,CAAC,CACF;IACDoB,YAAY,EAAEA,CAACC,KAAK,EAAEC,KAAK,KAAM,UAASA,KAAM;EAAE,GAC9CrB,IAAI,EACR;AAEN,CAAC;AAED,MAAMgB,WAAW,GAAGA,CAAAM,KAAA,EAAgBC,KAAU,KAAK;EAAA,IAA9B;IAAER;EAAU,CAAC,GAAAO,KAAA;EAChC,oBACE5C,KAAA,CAAAuB,aAAA,CAAClB,gBAAgB;IACfgC,IAAI,EAAEA,IAAK;IACX3B,WAAW,EAAEmC,KAAK,CAACnC,WAAY;IAC/BC,WAAW,EAAEkC,KAAK,CAAClC,WAAY;IAC/BC,UAAU,EAAEiC,KAAK,CAACjC,UAAW;IAC7B2B,cAAc,EAAEM,KAAK,CAACN,cAAe;IACrCC,QAAQ,EAAEK,KAAK,CAACL,QAAS;IACzBtB,YAAY,EAAE2B,KAAK,CAAC3B,YAAa;IACjCC,YAAY,EAAE0B,KAAK,CAAC1B,YAAa;IACjCC,aAAa,EAAEyB,KAAK,CAACzB,aAAc;IACnCC,kBAAkB,EAAEwB,KAAK,CAACxB;EAAmB,EAC7C;AAEN,CAAC;AAED,MAAMS,MAAM,GAAG3B,UAAU,CAAC2C,MAAM,CAAC;EAC/BX,kBAAkB,EAAE;IAClBY,eAAe,EAAEzC,MAAM,CAAC0C,IAAI;IAC5BC,MAAM,EAAE,CAAC;IACTC,OAAO,EAAE;EACX,CAAC;EACDnB,cAAc,EAAE;IAAEoB,UAAU,EAAE,QAAQ;IAAEC,KAAK,EAAE,MAAM;IAAEC,cAAc,EAAE;EAAG,CAAC;EAC3ErB,qBAAqB,EAAE;IAAEC,UAAU,EAAE;EAAG;AAC1C,CAAC,CAAC;AAEF,eAAe1B,YAAY"}
@@ -1,7 +1,6 @@
1
1
  import React, { memo } from 'react';
2
2
  import { TouchableOpacity, StyleSheet } from 'react-native';
3
3
  import CheckBox from '../CheckBox';
4
- import { colors } from '../../styles/colors';
5
4
  const DropdownListItem = _ref => {
6
5
  let {
7
6
  item,
@@ -17,20 +16,21 @@ const DropdownListItem = _ref => {
17
16
  } = _ref;
18
17
  const selectedOptionValue = optionValue ?? 'value';
19
18
  return /*#__PURE__*/React.createElement(TouchableOpacity, {
20
- style: styles.modalOptions,
21
- onPress: () => onChange(item[selectedOptionValue])
19
+ style: styles.dropdownModalOptions,
20
+ onPress: item.disabled ? () => {} : () => onChange(item[selectedOptionValue]) // intentionally didn't use the disable property
22
21
  }, /*#__PURE__*/React.createElement(CheckBox, {
23
22
  value: isMultiple ? selectedOption.includes(item[selectedOptionValue]) : [selectedOption].includes(item[selectedOptionValue]),
24
23
  label: item[optionLabel ?? ''],
25
24
  onChange: () => onChange(item[selectedOptionValue]),
26
- primaryColor: primaryColor || colors.primary,
25
+ primaryColor: primaryColor,
27
26
  checkboxSize: checkboxSize,
28
27
  checkboxStyle: checkboxStyle,
29
- checkboxLabelStyle: checkboxLabelStyle
28
+ checkboxLabelStyle: checkboxLabelStyle,
29
+ disabled: item.disabled
30
30
  }));
31
31
  };
32
32
  const styles = StyleSheet.create({
33
- modalOptions: {
33
+ dropdownModalOptions: {
34
34
  paddingHorizontal: 20,
35
35
  paddingVertical: 10,
36
36
  flexDirection: 'row',
@@ -1 +1 @@
1
- {"version":3,"names":["React","memo","TouchableOpacity","StyleSheet","CheckBox","colors","DropdownListItem","_ref","item","optionLabel","optionValue","isMultiple","selectedOption","onChange","primaryColor","checkboxSize","checkboxStyle","checkboxLabelStyle","selectedOptionValue","createElement","style","styles","modalOptions","onPress","value","includes","label","primary","create","paddingHorizontal","paddingVertical","flexDirection","alignItems"],"sources":["DropdownListItem.tsx"],"sourcesContent":["import React, { memo } from 'react';\nimport { TouchableOpacity, StyleSheet } from 'react-native';\nimport CheckBox from '../CheckBox';\nimport { colors } from '../../styles/colors';\n\nconst DropdownListItem = ({\n item,\n optionLabel,\n optionValue,\n isMultiple,\n selectedOption,\n onChange,\n primaryColor,\n checkboxSize,\n checkboxStyle,\n checkboxLabelStyle,\n}: any) => {\n const selectedOptionValue = optionValue ?? 'value';\n return (\n <TouchableOpacity\n style={styles.modalOptions}\n onPress={() => onChange(item[selectedOptionValue])}\n >\n <CheckBox\n value={\n isMultiple\n ? selectedOption.includes(item[selectedOptionValue])\n : [selectedOption].includes(item[selectedOptionValue])\n }\n label={item[optionLabel ?? '']}\n onChange={() => onChange(item[selectedOptionValue])}\n primaryColor={primaryColor || colors.primary}\n checkboxSize={checkboxSize}\n checkboxStyle={checkboxStyle}\n checkboxLabelStyle={checkboxLabelStyle}\n />\n </TouchableOpacity>\n );\n};\n\nconst styles = StyleSheet.create({\n modalOptions: {\n paddingHorizontal: 20,\n paddingVertical: 10,\n flexDirection: 'row',\n alignItems: 'center',\n },\n});\n\nexport default memo(DropdownListItem);\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,IAAI,QAAQ,OAAO;AACnC,SAASC,gBAAgB,EAAEC,UAAU,QAAQ,cAAc;AAC3D,OAAOC,QAAQ,MAAM,aAAa;AAClC,SAASC,MAAM,QAAQ,qBAAqB;AAE5C,MAAMC,gBAAgB,GAAGC,IAAA,IAWd;EAAA,IAXe;IACxBC,IAAI;IACJC,WAAW;IACXC,WAAW;IACXC,UAAU;IACVC,cAAc;IACdC,QAAQ;IACRC,YAAY;IACZC,YAAY;IACZC,aAAa;IACbC;EACG,CAAC,GAAAV,IAAA;EACJ,MAAMW,mBAAmB,GAAGR,WAAW,IAAI,OAAO;EAClD,oBACEV,KAAA,CAAAmB,aAAA,CAACjB,gBAAgB;IACfkB,KAAK,EAAEC,MAAM,CAACC,YAAa;IAC3BC,OAAO,EAAEA,CAAA,KAAMV,QAAQ,CAACL,IAAI,CAACU,mBAAmB,CAAC;EAAE,gBAEnDlB,KAAA,CAAAmB,aAAA,CAACf,QAAQ;IACPoB,KAAK,EACHb,UAAU,GACNC,cAAc,CAACa,QAAQ,CAACjB,IAAI,CAACU,mBAAmB,CAAC,CAAC,GAClD,CAACN,cAAc,CAAC,CAACa,QAAQ,CAACjB,IAAI,CAACU,mBAAmB,CAAC,CACxD;IACDQ,KAAK,EAAElB,IAAI,CAACC,WAAW,IAAI,EAAE,CAAE;IAC/BI,QAAQ,EAAEA,CAAA,KAAMA,QAAQ,CAACL,IAAI,CAACU,mBAAmB,CAAC,CAAE;IACpDJ,YAAY,EAAEA,YAAY,IAAIT,MAAM,CAACsB,OAAQ;IAC7CZ,YAAY,EAAEA,YAAa;IAC3BC,aAAa,EAAEA,aAAc;IAC7BC,kBAAkB,EAAEA;EAAmB,EACvC,CACe;AAEvB,CAAC;AAED,MAAMI,MAAM,GAAGlB,UAAU,CAACyB,MAAM,CAAC;EAC/BN,YAAY,EAAE;IACZO,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE,EAAE;IACnBC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd;AACF,CAAC,CAAC;AAEF,4BAAe/B,IAAI,CAACK,gBAAgB,CAAC"}
1
+ {"version":3,"names":["React","memo","TouchableOpacity","StyleSheet","CheckBox","DropdownListItem","_ref","item","optionLabel","optionValue","isMultiple","selectedOption","onChange","primaryColor","checkboxSize","checkboxStyle","checkboxLabelStyle","selectedOptionValue","createElement","style","styles","dropdownModalOptions","onPress","disabled","value","includes","label","create","paddingHorizontal","paddingVertical","flexDirection","alignItems"],"sources":["DropdownListItem.tsx"],"sourcesContent":["import React, { memo } from 'react';\nimport { TouchableOpacity, StyleSheet } from 'react-native';\nimport CheckBox from '../CheckBox';\n\nconst DropdownListItem = ({\n item,\n optionLabel,\n optionValue,\n isMultiple,\n selectedOption,\n onChange,\n primaryColor,\n checkboxSize,\n checkboxStyle,\n checkboxLabelStyle,\n}: any) => {\n const selectedOptionValue = optionValue ?? 'value';\n return (\n <TouchableOpacity\n style={styles.dropdownModalOptions}\n onPress={\n item.disabled ? () => {} : () => onChange(item[selectedOptionValue]) // intentionally didn't use the disable property\n }\n >\n <CheckBox\n value={\n isMultiple\n ? selectedOption.includes(item[selectedOptionValue])\n : [selectedOption].includes(item[selectedOptionValue])\n }\n label={item[optionLabel ?? '']}\n onChange={() => onChange(item[selectedOptionValue])}\n primaryColor={primaryColor}\n checkboxSize={checkboxSize}\n checkboxStyle={checkboxStyle}\n checkboxLabelStyle={checkboxLabelStyle}\n disabled={item.disabled}\n />\n </TouchableOpacity>\n );\n};\n\nconst styles = StyleSheet.create({\n dropdownModalOptions: {\n paddingHorizontal: 20,\n paddingVertical: 10,\n flexDirection: 'row',\n alignItems: 'center',\n },\n});\n\nexport default memo(DropdownListItem);\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,IAAI,QAAQ,OAAO;AACnC,SAASC,gBAAgB,EAAEC,UAAU,QAAQ,cAAc;AAC3D,OAAOC,QAAQ,MAAM,aAAa;AAElC,MAAMC,gBAAgB,GAAGC,IAAA,IAWd;EAAA,IAXe;IACxBC,IAAI;IACJC,WAAW;IACXC,WAAW;IACXC,UAAU;IACVC,cAAc;IACdC,QAAQ;IACRC,YAAY;IACZC,YAAY;IACZC,aAAa;IACbC;EACG,CAAC,GAAAV,IAAA;EACJ,MAAMW,mBAAmB,GAAGR,WAAW,IAAI,OAAO;EAClD,oBACET,KAAA,CAAAkB,aAAA,CAAChB,gBAAgB;IACfiB,KAAK,EAAEC,MAAM,CAACC,oBAAqB;IACnCC,OAAO,EACLf,IAAI,CAACgB,QAAQ,GAAG,MAAM,CAAC,CAAC,GAAG,MAAMX,QAAQ,CAACL,IAAI,CAACU,mBAAmB,CAAC,CAAC,CAAC;EACtE,gBAEDjB,KAAA,CAAAkB,aAAA,CAACd,QAAQ;IACPoB,KAAK,EACHd,UAAU,GACNC,cAAc,CAACc,QAAQ,CAAClB,IAAI,CAACU,mBAAmB,CAAC,CAAC,GAClD,CAACN,cAAc,CAAC,CAACc,QAAQ,CAAClB,IAAI,CAACU,mBAAmB,CAAC,CACxD;IACDS,KAAK,EAAEnB,IAAI,CAACC,WAAW,IAAI,EAAE,CAAE;IAC/BI,QAAQ,EAAEA,CAAA,KAAMA,QAAQ,CAACL,IAAI,CAACU,mBAAmB,CAAC,CAAE;IACpDJ,YAAY,EAAEA,YAAa;IAC3BC,YAAY,EAAEA,YAAa;IAC3BC,aAAa,EAAEA,aAAc;IAC7BC,kBAAkB,EAAEA,kBAAmB;IACvCO,QAAQ,EAAEhB,IAAI,CAACgB;EAAS,EACxB,CACe;AAEvB,CAAC;AAED,MAAMH,MAAM,GAAGjB,UAAU,CAACwB,MAAM,CAAC;EAC/BN,oBAAoB,EAAE;IACpBO,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE,EAAE;IACnBC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd;AACF,CAAC,CAAC;AAEF,4BAAe9B,IAAI,CAACI,gBAAgB,CAAC"}
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { View, Text, Pressable, ScrollView, StyleSheet, Image, TouchableOpacity } from 'react-native';
3
3
  import { colors } from '../../styles/colors';
4
4
  import { inputStyles } from '../../styles/input';
5
- const SelectedItemsView = _ref => {
5
+ const DropdownSelectedItemsView = _ref => {
6
6
  let {
7
7
  placeholder,
8
8
  error,
@@ -79,11 +79,12 @@ const styles = StyleSheet.create({
79
79
  paddingVertical: 5,
80
80
  borderRadius: 10,
81
81
  backgroundColor: colors.primary,
82
- marginRight: 10
82
+ marginRight: 10,
83
+ overflow: 'hidden'
83
84
  },
84
85
  blackText: {
85
86
  color: colors.black
86
87
  }
87
88
  });
88
- export default SelectedItemsView;
89
- //# sourceMappingURL=SelectedItemsView.js.map
89
+ export default DropdownSelectedItemsView;
90
+ //# sourceMappingURL=DropdownSelectedItemsView.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["React","View","Text","Pressable","ScrollView","StyleSheet","Image","TouchableOpacity","colors","inputStyles","DropdownSelectedItemsView","_ref","placeholder","error","getSelectedItemsLabel","handleToggleModal","isMultiple","selectedItem","selectedItems","dropdownStyle","selectedItemStyle","multipleSelectedItemStyle","dropdownErrorStyle","primaryColor","disabled","createElement","onPress","style","_ref2","pressed","inputFocusState","borderColor","input","inputFocusErrorState","horizontal","alwaysBounceHorizontal","showsHorizontalScrollIndicator","styles","selectedItemsContainer","onStartShouldSetResponder","map","item","i","key","Math","random","backgroundColor","blackText","length","iconStyle","source","require","create","position","right","top","flexDirection","flexWrap","color","white","paddingHorizontal","paddingVertical","borderRadius","primary","marginRight","overflow","black"],"sources":["DropdownSelectedItemsView.tsx"],"sourcesContent":["import React from 'react';\nimport {\n View,\n Text,\n Pressable,\n ScrollView,\n StyleSheet,\n Image,\n TouchableOpacity,\n} from 'react-native';\nimport { colors } from '../../styles/colors';\nimport { inputStyles } from '../../styles/input';\n\nconst DropdownSelectedItemsView = ({\n placeholder,\n error,\n getSelectedItemsLabel,\n handleToggleModal,\n isMultiple,\n selectedItem,\n selectedItems,\n dropdownStyle,\n selectedItemStyle,\n multipleSelectedItemStyle,\n dropdownErrorStyle,\n primaryColor,\n disabled,\n}: any) => {\n return (\n <Pressable\n onPress={() => handleToggleModal()}\n style={({ pressed }) => [\n pressed && {\n ...inputStyles.inputFocusState,\n borderColor: primaryColor,\n },\n inputStyles.input,\n dropdownStyle,\n error && //this must be last\n error !== '' &&\n !pressed && {\n ...inputStyles.inputFocusErrorState,\n ...dropdownErrorStyle,\n },\n ]}\n disabled={disabled}\n >\n <ScrollView\n horizontal\n alwaysBounceHorizontal\n showsHorizontalScrollIndicator={false}\n >\n <View\n style={styles.selectedItemsContainer}\n onStartShouldSetResponder={() => true}\n >\n {isMultiple ? (\n getSelectedItemsLabel().map((item: any, i: Number) => (\n <TouchableOpacity\n onPress={() => handleToggleModal()}\n key={`react-native-input-select-${Math.random()}-${i}`}\n disabled={disabled}\n >\n <Text\n style={[\n styles.selectedItems,\n { backgroundColor: primaryColor },\n multipleSelectedItemStyle,\n ]}\n >\n {item}\n </Text>\n </TouchableOpacity>\n ))\n ) : (\n <TouchableOpacity\n onPress={() => handleToggleModal()}\n disabled={disabled}\n >\n <Text style={[styles.blackText, selectedItemStyle]}>\n {getSelectedItemsLabel()}\n </Text>\n </TouchableOpacity>\n )}\n </View>\n\n {!selectedItem && selectedItems?.length === 0 && (\n <Text style={styles.blackText}>\n {placeholder ?? 'Select an option'}\n </Text>\n )}\n </ScrollView>\n <View style={styles.iconStyle}>\n <Image source={require('../../asset/arrow-down.png')} />\n </View>\n </Pressable>\n );\n};\n\nconst styles = StyleSheet.create({\n iconStyle: { position: 'absolute', right: 25, top: 25 },\n selectedItemsContainer: { flexDirection: 'row', flexWrap: 'nowrap' },\n selectedItems: {\n color: colors.white,\n paddingHorizontal: 10,\n paddingVertical: 5,\n borderRadius: 10,\n backgroundColor: colors.primary,\n marginRight: 10,\n overflow: 'hidden',\n },\n blackText: { color: colors.black },\n});\n\nexport default DropdownSelectedItemsView;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SACEC,IAAI,EACJC,IAAI,EACJC,SAAS,EACTC,UAAU,EACVC,UAAU,EACVC,KAAK,EACLC,gBAAgB,QACX,cAAc;AACrB,SAASC,MAAM,QAAQ,qBAAqB;AAC5C,SAASC,WAAW,QAAQ,oBAAoB;AAEhD,MAAMC,yBAAyB,GAAGC,IAAA,IAcvB;EAAA,IAdwB;IACjCC,WAAW;IACXC,KAAK;IACLC,qBAAqB;IACrBC,iBAAiB;IACjBC,UAAU;IACVC,YAAY;IACZC,aAAa;IACbC,aAAa;IACbC,iBAAiB;IACjBC,yBAAyB;IACzBC,kBAAkB;IAClBC,YAAY;IACZC;EACG,CAAC,GAAAb,IAAA;EACJ,oBACEX,KAAA,CAAAyB,aAAA,CAACtB,SAAS;IACRuB,OAAO,EAAEA,CAAA,KAAMX,iBAAiB,EAAG;IACnCY,KAAK,EAAEC,KAAA;MAAA,IAAC;QAAEC;MAAQ,CAAC,GAAAD,KAAA;MAAA,OAAK,CACtBC,OAAO,IAAI;QACT,GAAGpB,WAAW,CAACqB,eAAe;QAC9BC,WAAW,EAAER;MACf,CAAC,EACDd,WAAW,CAACuB,KAAK,EACjBb,aAAa,EACbN,KAAK;MAAI;MACPA,KAAK,KAAK,EAAE,IACZ,CAACgB,OAAO,IAAI;QACV,GAAGpB,WAAW,CAACwB,oBAAoB;QACnC,GAAGX;MACL,CAAC,CACJ;IAAA,CAAC;IACFE,QAAQ,EAAEA;EAAS,gBAEnBxB,KAAA,CAAAyB,aAAA,CAACrB,UAAU;IACT8B,UAAU;IACVC,sBAAsB;IACtBC,8BAA8B,EAAE;EAAM,gBAEtCpC,KAAA,CAAAyB,aAAA,CAACxB,IAAI;IACH0B,KAAK,EAAEU,MAAM,CAACC,sBAAuB;IACrCC,yBAAyB,EAAEA,CAAA,KAAM;EAAK,GAErCvB,UAAU,GACTF,qBAAqB,EAAE,CAAC0B,GAAG,CAAC,CAACC,IAAS,EAAEC,CAAS,kBAC/C1C,KAAA,CAAAyB,aAAA,CAAClB,gBAAgB;IACfmB,OAAO,EAAEA,CAAA,KAAMX,iBAAiB,EAAG;IACnC4B,GAAG,EAAG,6BAA4BC,IAAI,CAACC,MAAM,EAAG,IAAGH,CAAE,EAAE;IACvDlB,QAAQ,EAAEA;EAAS,gBAEnBxB,KAAA,CAAAyB,aAAA,CAACvB,IAAI;IACHyB,KAAK,EAAE,CACLU,MAAM,CAACnB,aAAa,EACpB;MAAE4B,eAAe,EAAEvB;IAAa,CAAC,EACjCF,yBAAyB;EACzB,GAEDoB,IAAI,CACA,CAEV,CAAC,gBAEFzC,KAAA,CAAAyB,aAAA,CAAClB,gBAAgB;IACfmB,OAAO,EAAEA,CAAA,KAAMX,iBAAiB,EAAG;IACnCS,QAAQ,EAAEA;EAAS,gBAEnBxB,KAAA,CAAAyB,aAAA,CAACvB,IAAI;IAACyB,KAAK,EAAE,CAACU,MAAM,CAACU,SAAS,EAAE3B,iBAAiB;EAAE,GAChDN,qBAAqB,EAAE,CACnB,CAEV,CACI,EAEN,CAACG,YAAY,IAAI,CAAAC,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAE8B,MAAM,MAAK,CAAC,iBAC3ChD,KAAA,CAAAyB,aAAA,CAACvB,IAAI;IAACyB,KAAK,EAAEU,MAAM,CAACU;EAAU,GAC3BnC,WAAW,IAAI,kBAAkB,CAErC,CACU,eACbZ,KAAA,CAAAyB,aAAA,CAACxB,IAAI;IAAC0B,KAAK,EAAEU,MAAM,CAACY;EAAU,gBAC5BjD,KAAA,CAAAyB,aAAA,CAACnB,KAAK;IAAC4C,MAAM,EAAEC,OAAO,CAAC,4BAA4B;EAAE,EAAG,CACnD,CACG;AAEhB,CAAC;AAED,MAAMd,MAAM,GAAGhC,UAAU,CAAC+C,MAAM,CAAC;EAC/BH,SAAS,EAAE;IAAEI,QAAQ,EAAE,UAAU;IAAEC,KAAK,EAAE,EAAE;IAAEC,GAAG,EAAE;EAAG,CAAC;EACvDjB,sBAAsB,EAAE;IAAEkB,aAAa,EAAE,KAAK;IAAEC,QAAQ,EAAE;EAAS,CAAC;EACpEvC,aAAa,EAAE;IACbwC,KAAK,EAAElD,MAAM,CAACmD,KAAK;IACnBC,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE,CAAC;IAClBC,YAAY,EAAE,EAAE;IAChBhB,eAAe,EAAEtC,MAAM,CAACuD,OAAO;IAC/BC,WAAW,EAAE,EAAE;IACfC,QAAQ,EAAE;EACZ,CAAC;EACDlB,SAAS,EAAE;IAAEW,KAAK,EAAElD,MAAM,CAAC0D;EAAM;AACnC,CAAC,CAAC;AAEF,eAAexD,yBAAyB"}
@@ -1,11 +1,13 @@
1
1
  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); }
2
2
  import React, { useState } from 'react';
3
+ import { TouchableOpacity, StyleSheet, View } from 'react-native';
3
4
  import Dropdown from './components/Dropdown/Dropdown';
4
5
  import DropdownList from './components/Dropdown/DropdownList';
5
6
  import CustomModal from './components/CustomModal';
6
- import { DEFAULT_OPTION_LABEL, DEFAULT_OPTION_VALUE } from './constants';
7
7
  import { Input } from './components/Input';
8
+ import CheckBox from './components/CheckBox';
8
9
  import { colors } from './styles/colors';
10
+ import { DEFAULT_OPTION_LABEL, DEFAULT_OPTION_VALUE } from './constants';
9
11
  export const DropdownSelect = _ref => {
10
12
  let {
11
13
  placeholder,
@@ -39,6 +41,7 @@ export const DropdownSelect = _ref => {
39
41
  } = _ref;
40
42
  const [newOptions, setNewOptions] = useState(options ? options : []);
41
43
  const [open, setOpen] = useState(false);
44
+ const [selectAll, setSelectAll] = useState(false);
42
45
  const [selectedItem, setSelectedItem] = useState(selectedValue); //for single selection
43
46
  const [selectedItems, setSelectedItems] = useState(Array.isArray(selectedValue) ? selectedValue : selectedValue === '' || selectedValue === undefined ? [] : [selectedValue]); //for multiple selection
44
47
  const [searchValue, setSearchValue] = useState('');
@@ -65,6 +68,26 @@ export const DropdownSelect = _ref => {
65
68
  }
66
69
  setSelectedItems(selectedValues);
67
70
  onValueChange(selectedValues); //send value to parent
71
+
72
+ if (options.length === selectedValues.length) {
73
+ setSelectAll(true);
74
+ } else {
75
+ setSelectAll(false);
76
+ }
77
+ };
78
+ const handleSelectAll = () => {
79
+ setSelectAll(prevVal => {
80
+ const selectedValues = [];
81
+ const filteredOptions = newOptions.filter(item => !item.disabled); //don't select disabled items
82
+ if (!prevVal) {
83
+ for (let i = 0; i < filteredOptions.length; i++) {
84
+ selectedValues.push(filteredOptions[i][optionValue]);
85
+ }
86
+ }
87
+ setSelectedItems(selectedValues);
88
+ onValueChange(selectedValues); //send value to parent
89
+ return !prevVal;
90
+ });
68
91
  };
69
92
 
70
93
  /*===========================================
@@ -134,16 +157,30 @@ export const DropdownSelect = _ref => {
134
157
  modalBackgroundStyle: modalBackgroundStyle,
135
158
  modalOptionsContainer: modalOptionsContainer,
136
159
  onRequestClose: () => {}
137
- }, isSearchable && /*#__PURE__*/React.createElement(Input, {
138
- value: searchValue,
139
- onChangeText: text => onSearch(text),
140
- style: searchInputStyle,
141
- primaryColor: primary
142
- }), /*#__PURE__*/React.createElement(DropdownList, {
160
+ }, /*#__PURE__*/React.createElement(DropdownList, {
161
+ ListHeaderComponent: /*#__PURE__*/React.createElement(React.Fragment, null, isSearchable && /*#__PURE__*/React.createElement(Input, {
162
+ value: searchValue,
163
+ onChangeText: text => onSearch(text),
164
+ style: searchInputStyle,
165
+ primaryColor: primary
166
+ }), isMultiple && newOptions.length > 1 && /*#__PURE__*/React.createElement(View, {
167
+ style: styles.optionsContainerStyle
168
+ }, /*#__PURE__*/React.createElement(TouchableOpacity, {
169
+ onPress: () => {}
170
+ }, /*#__PURE__*/React.createElement(CheckBox, {
171
+ value: selectAll,
172
+ label: selectAll ? 'Clear all' : 'Select all',
173
+ onChange: () => handleSelectAll(),
174
+ primaryColor: primary,
175
+ checkboxSize: checkboxSize,
176
+ checkboxStyle: checkboxStyle,
177
+ checkboxLabelStyle: checkboxLabelStyle
178
+ })))),
143
179
  options: newOptions,
144
180
  optionLabel: optionLabel,
145
181
  optionValue: optionValue,
146
182
  isMultiple: isMultiple,
183
+ isSearchable: isSearchable,
147
184
  selectedItems: selectedItems,
148
185
  selectedItem: selectedItem,
149
186
  handleMultipleSelections: handleMultipleSelections,
@@ -154,5 +191,12 @@ export const DropdownSelect = _ref => {
154
191
  checkboxLabelStyle: checkboxLabelStyle
155
192
  })));
156
193
  };
194
+ const styles = StyleSheet.create({
195
+ optionsContainerStyle: {
196
+ paddingHorizontal: 20,
197
+ paddingVertical: 10,
198
+ flexDirection: 'row'
199
+ }
200
+ });
157
201
  export default DropdownSelect;
158
202
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","useState","Dropdown","DropdownList","CustomModal","DEFAULT_OPTION_LABEL","DEFAULT_OPTION_VALUE","Input","colors","DropdownSelect","_ref","placeholder","label","error","helperText","options","optionLabel","optionValue","onValueChange","selectedValue","isMultiple","isSearchable","labelStyle","dropdownStyle","dropdownContainerStyle","dropdownErrorStyle","dropdownErrorTextStyle","dropdownHelperTextStyle","selectedItemStyle","multipleSelectedItemStyle","modalBackgroundStyle","modalOptionsContainer","searchInputStyle","primaryColor","disabled","checkboxSize","checkboxStyle","checkboxLabelStyle","rest","newOptions","setNewOptions","open","setOpen","selectedItem","setSelectedItem","selectedItems","setSelectedItems","Array","isArray","undefined","searchValue","setSearchValue","handleSingleSelection","value","handleMultipleSelections","selectedValues","includes","filter","item","push","getSelectedItemsLabel","selectedLabels","forEach","element","_options$find","selectedItemLabel","find","onSearch","searchText","toString","toLocaleLowerCase","trim","regexFilter","RegExp","searchResults","toLowerCase","search","handleToggleModal","primary","gray","createElement","Fragment","_extends","onRequestClose","onChangeText","text","style"],"sources":["index.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport Dropdown from './components/Dropdown/Dropdown';\nimport DropdownList from './components/Dropdown/DropdownList';\nimport CustomModal from './components/CustomModal';\nimport { DEFAULT_OPTION_LABEL, DEFAULT_OPTION_VALUE } from './constants';\nimport type { DropdownProps } from './types/index.types';\nimport { Input } from './components/Input';\nimport { colors } from './styles/colors';\n\nexport const DropdownSelect = ({\n placeholder,\n label,\n error,\n helperText,\n options,\n optionLabel,\n optionValue,\n onValueChange,\n selectedValue,\n isMultiple,\n isSearchable,\n labelStyle,\n dropdownStyle,\n dropdownContainerStyle,\n dropdownErrorStyle,\n dropdownErrorTextStyle,\n dropdownHelperTextStyle,\n selectedItemStyle,\n multipleSelectedItemStyle,\n modalBackgroundStyle,\n modalOptionsContainer,\n searchInputStyle,\n primaryColor,\n disabled,\n checkboxSize,\n checkboxStyle,\n checkboxLabelStyle,\n ...rest\n}: DropdownProps) => {\n const [newOptions, setNewOptions] = useState(options ? options : []);\n const [open, setOpen] = useState(false);\n const [selectedItem, setSelectedItem] = useState(selectedValue); //for single selection\n const [selectedItems, setSelectedItems] = useState(\n Array.isArray(selectedValue)\n ? selectedValue\n : selectedValue === '' || selectedValue === undefined\n ? []\n : [selectedValue]\n ); //for multiple selection\n const [searchValue, setSearchValue] = useState('');\n\n /*===========================================\n * Selection handlers\n *==========================================*/\n const handleSingleSelection = (value: any) => {\n if (selectedItem === value) {\n setSelectedItem(null);\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 let selectedValues = [...selectedItems];\n\n if (selectedValues.includes(value)) {\n selectedValues = selectedValues.filter((item) => item !== value);\n } else {\n selectedValues.push(value);\n }\n setSelectedItems(selectedValues);\n onValueChange(selectedValues); //send value to parent\n };\n\n /*===========================================\n * Get label handler\n *==========================================*/\n const getSelectedItemsLabel = () => {\n if (isMultiple) {\n let selectedLabels: Array<string> = [];\n selectedItems &&\n selectedItems.forEach((element) => {\n let selectedItemLabel =\n options &&\n options.find(\n (item: any) =>\n 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 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 dropdownStyle={dropdownStyle}\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 {...rest}\n />\n <CustomModal\n open={open}\n handleToggleModal={handleToggleModal}\n modalBackgroundStyle={modalBackgroundStyle}\n modalOptionsContainer={modalOptionsContainer}\n onRequestClose={() => {}}\n >\n {isSearchable && (\n <Input\n value={searchValue}\n onChangeText={(text: string) => onSearch(text)}\n style={searchInputStyle}\n primaryColor={primary}\n />\n )}\n <DropdownList\n options={newOptions}\n optionLabel={optionLabel}\n optionValue={optionValue}\n isMultiple={isMultiple}\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\nexport default DropdownSelect;\n"],"mappings":"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"}
1
+ {"version":3,"names":["React","useState","TouchableOpacity","StyleSheet","View","Dropdown","DropdownList","CustomModal","Input","CheckBox","colors","DEFAULT_OPTION_LABEL","DEFAULT_OPTION_VALUE","DropdownSelect","_ref","placeholder","label","error","helperText","options","optionLabel","optionValue","onValueChange","selectedValue","isMultiple","isSearchable","labelStyle","dropdownStyle","dropdownContainerStyle","dropdownErrorStyle","dropdownErrorTextStyle","dropdownHelperTextStyle","selectedItemStyle","multipleSelectedItemStyle","modalBackgroundStyle","modalOptionsContainer","searchInputStyle","primaryColor","disabled","checkboxSize","checkboxStyle","checkboxLabelStyle","rest","newOptions","setNewOptions","open","setOpen","selectAll","setSelectAll","selectedItem","setSelectedItem","selectedItems","setSelectedItems","Array","isArray","undefined","searchValue","setSearchValue","handleSingleSelection","value","handleMultipleSelections","selectedValues","includes","filter","item","push","length","handleSelectAll","prevVal","filteredOptions","i","getSelectedItemsLabel","selectedLabels","forEach","element","_options$find","selectedItemLabel","find","onSearch","searchText","toString","toLocaleLowerCase","trim","regexFilter","RegExp","searchResults","toLowerCase","search","handleToggleModal","primary","gray","createElement","Fragment","_extends","onRequestClose","ListHeaderComponent","onChangeText","text","style","styles","optionsContainerStyle","onPress","onChange","create","paddingHorizontal","paddingVertical","flexDirection"],"sources":["index.tsx"],"sourcesContent":["import React, { useState } 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 = ({\n placeholder,\n label,\n error,\n helperText,\n options,\n optionLabel,\n optionValue,\n onValueChange,\n selectedValue,\n isMultiple,\n isSearchable,\n labelStyle,\n dropdownStyle,\n dropdownContainerStyle,\n dropdownErrorStyle,\n dropdownErrorTextStyle,\n dropdownHelperTextStyle,\n selectedItemStyle,\n multipleSelectedItemStyle,\n modalBackgroundStyle,\n modalOptionsContainer,\n searchInputStyle,\n primaryColor,\n disabled,\n checkboxSize,\n checkboxStyle,\n checkboxLabelStyle,\n ...rest\n}: DropdownProps) => {\n const [newOptions, setNewOptions] = useState(options ? options : []);\n const [open, setOpen] = useState(false);\n const [selectAll, setSelectAll] = useState(false);\n const [selectedItem, setSelectedItem] = useState(selectedValue); //for single selection\n const [selectedItems, setSelectedItems] = useState(\n Array.isArray(selectedValue)\n ? selectedValue\n : selectedValue === '' || selectedValue === undefined\n ? []\n : [selectedValue]\n ); //for multiple selection\n const [searchValue, setSearchValue] = useState('');\n\n /*===========================================\n * Selection handlers\n *==========================================*/\n const handleSingleSelection = (value: any) => {\n if (selectedItem === value) {\n setSelectedItem(null);\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 let selectedValues = [...selectedItems];\n\n if (selectedValues.includes(value)) {\n selectedValues = selectedValues.filter((item) => item !== value);\n } else {\n selectedValues.push(value);\n }\n setSelectedItems(selectedValues);\n onValueChange(selectedValues); //send value to parent\n\n if (options.length === selectedValues.length) {\n setSelectAll(true);\n } else {\n setSelectAll(false);\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) {\n let selectedLabels: Array<string> = [];\n selectedItems &&\n selectedItems.forEach((element) => {\n let selectedItemLabel =\n options &&\n options.find(\n (item: any) =>\n 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 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 dropdownStyle={dropdownStyle}\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 {...rest}\n />\n <CustomModal\n open={open}\n handleToggleModal={handleToggleModal}\n modalBackgroundStyle={modalBackgroundStyle}\n modalOptionsContainer={modalOptionsContainer}\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 {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 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"],"mappings":"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"}
@@ -1,10 +1,11 @@
1
1
  export const colors = {
2
- primary: '#EF8031',
2
+ primary: 'green',
3
3
  red: '#FA4169',
4
4
  black: '#000000',
5
5
  white: '#FFFFFF',
6
6
  dark: '#11142D',
7
7
  gray: '#808191',
8
- lightGray: '#F7F7F7'
8
+ lightGray: '#F7F7F7',
9
+ disabled: '#d3d3d3'
9
10
  };
10
11
  //# sourceMappingURL=colors.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["colors","primary","red","black","white","dark","gray","lightGray"],"sources":["colors.ts"],"sourcesContent":["export const colors: any = {\n primary: '#EF8031',\n red: '#FA4169',\n black: '#000000',\n white: '#FFFFFF',\n dark: '#11142D',\n gray: '#808191',\n lightGray: '#F7F7F7',\n};\n"],"mappings":"AAAA,OAAO,MAAMA,MAAW,GAAG;EACzBC,OAAO,EAAE,SAAS;EAClBC,GAAG,EAAE,SAAS;EACdC,KAAK,EAAE,SAAS;EAChBC,KAAK,EAAE,SAAS;EAChBC,IAAI,EAAE,SAAS;EACfC,IAAI,EAAE,SAAS;EACfC,SAAS,EAAE;AACb,CAAC"}
1
+ {"version":3,"names":["colors","primary","red","black","white","dark","gray","lightGray","disabled"],"sources":["colors.ts"],"sourcesContent":["export const colors: any = {\n primary: 'green',\n red: '#FA4169',\n black: '#000000',\n white: '#FFFFFF',\n dark: '#11142D',\n gray: '#808191',\n lightGray: '#F7F7F7',\n disabled: '#d3d3d3',\n};\n"],"mappings":"AAAA,OAAO,MAAMA,MAAW,GAAG;EACzBC,OAAO,EAAE,OAAO;EAChBC,GAAG,EAAE,SAAS;EACdC,KAAK,EAAE,SAAS;EAChBC,KAAK,EAAE,SAAS;EAChBC,IAAI,EAAE,SAAS;EACfC,IAAI,EAAE,SAAS;EACfC,SAAS,EAAE,SAAS;EACpBC,QAAQ,EAAE;AACZ,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["index.types.ts"],"sourcesContent":["import type { ViewStyle, ColorValue, TextStyle } from 'react-native';\n\nexport type DropdownProps = {\n placeholder?: string;\n label?: string;\n error?: string;\n helperText?: string;\n options: any[];\n optionLabel: string;\n optionValue?: string;\n onValueChange: Function;\n selectedValue?: string | any[] | null;\n isMultiple?: boolean;\n isSearchable?: boolean;\n labelStyle?: TextStyle;\n dropdownStyle?: ViewStyle;\n dropdownContainerStyle?: ViewStyle;\n dropdownErrorStyle?: ViewStyle;\n dropdownErrorTextStyle?: TextStyle;\n dropdownHelperTextStyle?: TextStyle;\n selectedItemStyle?: ViewStyle;\n multipleSelectedItemStyle?: ViewStyle;\n modalBackgroundStyle?: ViewStyle;\n modalOptionsContainer?: ViewStyle;\n searchInputStyle?: ViewStyle;\n primaryColor?: ColorValue;\n disabled?: boolean;\n checkboxSize?: number;\n checkboxStyle?: ViewStyle;\n checkboxLabelStyle?: TextStyle;\n};\n"],"mappings":""}
1
+ {"version":3,"names":[],"sources":["index.types.ts"],"sourcesContent":["import type { ViewStyle, ColorValue, TextStyle } from 'react-native';\n\nexport type DropdownProps = {\n placeholder?: string;\n label?: string;\n error?: string;\n helperText?: string;\n options: any[];\n optionLabel: string;\n optionValue: string;\n onValueChange: Function;\n selectedValue?: string | any[] | null;\n isMultiple?: boolean;\n isSearchable?: boolean;\n labelStyle?: TextStyle;\n dropdownStyle?: ViewStyle;\n dropdownContainerStyle?: ViewStyle;\n dropdownErrorStyle?: ViewStyle;\n dropdownErrorTextStyle?: TextStyle;\n dropdownHelperTextStyle?: TextStyle;\n selectedItemStyle?: ViewStyle;\n multipleSelectedItemStyle?: ViewStyle;\n modalBackgroundStyle?: ViewStyle;\n modalOptionsContainer?: ViewStyle;\n searchInputStyle?: ViewStyle;\n primaryColor?: ColorValue;\n disabled?: boolean;\n checkboxSize?: number;\n checkboxStyle?: ViewStyle;\n checkboxLabelStyle?: TextStyle;\n};\n"],"mappings":""}
@@ -1,4 +1,4 @@
1
1
  /// <reference types="react" />
2
2
  import type { CheckboxProps } from './types';
3
- declare const CheckBox: ({ label, value, primaryColor, checkboxSize, checkboxStyle, checkboxLabelStyle, onChange, }: CheckboxProps) => JSX.Element;
3
+ declare const CheckBox: ({ label, value, disabled, primaryColor, checkboxSize, checkboxStyle, checkboxLabelStyle, onChange, }: CheckboxProps) => JSX.Element;
4
4
  export default CheckBox;
@@ -2,6 +2,7 @@ import type { ColorValue, ViewStyle, TextStyle } from 'react-native';
2
2
  export type CheckboxProps = {
3
3
  label?: string;
4
4
  value?: boolean;
5
+ disabled?: boolean;
5
6
  primaryColor?: ColorValue;
6
7
  checkboxSize?: number;
7
8
  checkboxStyle?: ViewStyle;
@@ -1,3 +1,3 @@
1
1
  /// <reference types="react" />
2
- declare const DropdownList: ({ options, optionLabel, optionValue, isMultiple, selectedItems, selectedItem, handleMultipleSelections, handleSingleSelection, primaryColor, checkboxSize, checkboxStyle, checkboxLabelStyle, }: any) => JSX.Element;
2
+ declare const DropdownList: ({ options, optionLabel, optionValue, isMultiple, isSearchable, selectedItems, selectedItem, handleMultipleSelections, handleSingleSelection, primaryColor, checkboxSize, checkboxStyle, checkboxLabelStyle, ...rest }: any) => JSX.Element;
3
3
  export default DropdownList;
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ declare const DropdownSelectedItemsView: ({ placeholder, error, getSelectedItemsLabel, handleToggleModal, isMultiple, selectedItem, selectedItems, dropdownStyle, selectedItemStyle, multipleSelectedItemStyle, dropdownErrorStyle, primaryColor, disabled, }: any) => JSX.Element;
3
+ export default DropdownSelectedItemsView;
@@ -6,7 +6,7 @@ export type DropdownProps = {
6
6
  helperText?: string;
7
7
  options: any[];
8
8
  optionLabel: string;
9
- optionValue?: string;
9
+ optionValue: string;
10
10
  onValueChange: Function;
11
11
  selectedValue?: string | any[] | null;
12
12
  isMultiple?: boolean;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-native-input-select",
3
- "version": "0.23.0",
3
+ "version": "0.25.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",
@@ -1,12 +1,14 @@
1
1
  /* eslint-disable react-native/no-inline-styles */
2
2
  import React from 'react';
3
3
  import { Pressable, Text, StyleSheet, Image, View } from 'react-native';
4
+ import { colors } from '../../styles/colors';
4
5
  import { CHECKBOX_SIZE } from '../../constants';
5
6
  import type { CheckboxProps } from './types';
6
7
 
7
8
  const CheckBox = ({
8
9
  label,
9
10
  value,
11
+ disabled,
10
12
  primaryColor,
11
13
  checkboxSize,
12
14
  checkboxStyle,
@@ -14,12 +16,19 @@ const CheckBox = ({
14
16
  onChange,
15
17
  }: CheckboxProps) => {
16
18
  const fillColor = {
17
- backgroundColor: value ? primaryColor || 'green' : 'white',
19
+ backgroundColor: disabled
20
+ ? '#d3d3d3'
21
+ : value
22
+ ? checkboxStyle?.backgroundColor || primaryColor || 'green'
23
+ : 'white',
24
+ borderColor: disabled ? colors.disabled : styles.checkbox.borderColor,
18
25
  };
26
+
19
27
  return (
20
28
  <Pressable
21
29
  onPress={onChange ? () => onChange(!value) : () => {}}
22
30
  style={[styles.checkboxContainer]}
31
+ disabled={disabled}
23
32
  >
24
33
  <View style={[styles.checkbox, checkboxStyle, fillColor]}>
25
34
  <Image
@@ -3,6 +3,7 @@ import type { ColorValue, ViewStyle, TextStyle } from 'react-native';
3
3
  export type CheckboxProps = {
4
4
  label?: string;
5
5
  value?: boolean;
6
+ disabled?: boolean;
6
7
  primaryColor?: ColorValue;
7
8
  checkboxSize?: number;
8
9
  checkboxStyle?: ViewStyle;
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import { View, Text, StyleSheet } from 'react-native';
3
- import SelectedItemsView from './SelectedItemsView';
3
+ import DropdownSelectedItemsView from './DropdownSelectedItemsView';
4
4
  import { colors } from '../../styles/colors';
5
5
  import { typography } from '../../styles/typography';
6
6
 
@@ -30,7 +30,7 @@ const Dropdown = ({
30
30
  {label && label !== '' && (
31
31
  <Text style={[styles.label, labelStyle]}>{label}</Text>
32
32
  )}
33
- <SelectedItemsView
33
+ <DropdownSelectedItemsView
34
34
  placeholder={placeholder}
35
35
  error={error}
36
36
  getSelectedItemsLabel={getSelectedItemsLabel}