From 6e8635d9ee0850d24dd2350970aee83adf7ebbf9 Mon Sep 17 00:00:00 2001 From: Jordan Heigle Date: Sun, 14 May 2023 22:25:06 -0500 Subject: [PATCH 1/4] [feat] add customItemValueDelimiter --- src/components/Picker.js | 35 ++++++++++++++++++----------------- 1 file changed, 18 insertions(+), 17 deletions(-) diff --git a/src/components/Picker.js b/src/components/Picker.js index 4dffc0a..a243349 100644 --- a/src/components/Picker.js +++ b/src/components/Picker.js @@ -163,6 +163,7 @@ function Picker({ closeOnBackPressed = false, extendableBadgeContainer = false, onSelectItem = (item) => {} + customItemValueDelimiter = '-', }) { const [necessaryItems, setNecessaryItems] = useState([]); const [searchText, setSearchText] = useState(''); @@ -233,11 +234,11 @@ function Picker({ setNecessaryItems(state => { return [...state].map(item => { const _item = items.find(x => x[_schema.value] === item[_schema.value]); - + if (_item) { return {...item, ..._item}; } - + return item; }); }); @@ -251,7 +252,7 @@ function Picker({ setNecessaryItems(state => { if (value === null || (Array.isArray(value) && value.length === 0)) return []; - + let _state = [...state].filter(item => value.includes(item[_schema.value])); const newItems = value.reduce((accumulator, currentValue) => { @@ -259,7 +260,7 @@ function Picker({ if (index === -1) { const item = items.find(item => item[_schema.value] === currentValue); - + if (item) { return [...accumulator, item]; } @@ -282,7 +283,7 @@ function Picker({ state.push(item); } } - + setNecessaryItems(state); } @@ -405,7 +406,7 @@ function Picker({ }); } else { const index = sortedItems.findIndex(item => item[_schema["value"]] === value); - + if (index > -1) flatListRef.current?.scrollToIndex?.({ index, @@ -454,7 +455,7 @@ function Picker({ } else { if (disableLocalSearch) return sortedItems; - + const values = []; const normalizeText = (text) => text.normalize("NFD").replace(/[\u0300-\u036f]/g, ""); @@ -485,7 +486,7 @@ function Picker({ if ((results.length === 0 || results.findIndex(item => String(item[_schema.label]).toLowerCase() === searchText.toLowerCase()) === -1) && addCustomItem) { results.push({ [_schema.label]: searchText, - [_schema.value]: searchText.replace(' ', '-'), + [_schema.value]: customItemValueDelimiter ? searchText.replace(' ', customItemValueDelimiter) : searchText, custom: true }); } @@ -583,7 +584,7 @@ function Picker({ if (isNull) return null; - + try { return necessaryItems.find(item => item[_schema.value] === _value); } catch (e) { @@ -602,11 +603,11 @@ function Picker({ if (multiple) if (item.length > 0) { let mtext = _multipleText; - + if (typeof mtext !== 'string') { mtext = mtext[item.length] ?? mtext.n; } - + return mtext.replace('{count}', item.length); } else return fallback; @@ -1022,7 +1023,7 @@ function Picker({ const _itemKey = useMemo(() => { if (itemKey === null) return _schema.value; - + return itemKey; }, [itemKey, _schema]); @@ -1115,7 +1116,7 @@ function Picker({ ); } - + return ; }, [__renderBadge, extendableBadgeContainerStyle, extendableBadgeItemContainerStyle]); @@ -1124,10 +1125,10 @@ function Picker({ * @returns {JSX.Element} */ const BadgeBodyComponent = useMemo(() => { - if (extendableBadgeContainer) { + if (extendableBadgeContainer) { return } - + return ( { setOpen(false); }, []); - + /** * The dropdown flatlist component. * @returns {JSX.Element} @@ -1740,7 +1741,7 @@ function Picker({ const DropDownScrollViewComponent = useMemo(() => { return ( - {_items.map((item, index) => { + {_items.map((item, index) => { return ( {index > 0 && ItemSeparatorComponent()} From 7370be7c4dfb67e4a8248ab473b491d302d63807 Mon Sep 17 00:00:00 2001 From: Jordan Heigle Date: Sun, 14 May 2023 22:33:45 -0500 Subject: [PATCH 2/4] [feat] add customItemValueDelimiter --- src/components/Picker.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Picker.js b/src/components/Picker.js index a243349..2d96135 100644 --- a/src/components/Picker.js +++ b/src/components/Picker.js @@ -486,7 +486,7 @@ function Picker({ if ((results.length === 0 || results.findIndex(item => String(item[_schema.label]).toLowerCase() === searchText.toLowerCase()) === -1) && addCustomItem) { results.push({ [_schema.label]: searchText, - [_schema.value]: customItemValueDelimiter ? searchText.replace(' ', customItemValueDelimiter) : searchText, + [_schema.value]: customItemValueDelimiter ? searchText.replaceAll(' ', customItemValueDelimiter) : searchText, custom: true }); } From 0060cea213acd98edc5e1a28d1c6ea66f1109357 Mon Sep 17 00:00:00 2001 From: JHeigle Date: Thu, 3 Oct 2024 20:59:41 -0500 Subject: [PATCH 3/4] [fix] add missing comma --- src/components/Picker.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Picker.js b/src/components/Picker.js index 2d96135..1b4c079 100644 --- a/src/components/Picker.js +++ b/src/components/Picker.js @@ -162,7 +162,7 @@ function Picker({ testID, closeOnBackPressed = false, extendableBadgeContainer = false, - onSelectItem = (item) => {} + onSelectItem = (item) => {}, customItemValueDelimiter = '-', }) { const [necessaryItems, setNecessaryItems] = useState([]); From 43cc9d9a294c32ddafd20060da06816728a402b8 Mon Sep 17 00:00:00 2001 From: JHeigle Date: Thu, 3 Oct 2024 22:12:45 -0500 Subject: [PATCH 4/4] [chore] add customItemValueDelimiter property type --- index.d.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/index.d.ts b/index.d.ts index 0e0dd54..960149f 100644 --- a/index.d.ts +++ b/index.d.ts @@ -196,6 +196,7 @@ declare module 'react-native-dropdown-picker' { containerStyle?: StyleProp; customItemContainerStyle?: StyleProp; customItemLabelStyle?: StyleProp; + customItemValueDelimiter?: string; disableBorderRadius?: boolean; disabledItemContainerStyle?: StyleProp; disabledItemLabelStyle?: StyleProp;