Skip to content

Failed prop type input mode on Text Input #66

@angeloplacebo

Description

@angeloplacebo

Hi! 👋

Firstly, thanks for your work on this project! 🙂

I used patch-package to patch [email protected] for the project I'm working on.

So i opened a issue link, about a problem that I had and fixed by implementing an optional prop to change the keyboard type and return key type.

Here is the diff that solved my problem:

diff --git a/node_modules/rn-modal-picker/index.tsx b/node_modules/rn-modal-picker/index.tsx
index 0fa11fc..a5cf45d 100644
--- a/node_modules/rn-modal-picker/index.tsx
+++ b/node_modules/rn-modal-picker/index.tsx
@@ -10,10 +10,13 @@ import {
   ImageSourcePropType,
   ImageStyle,
   TextStyle,
+  KeyboardTypeOptions,
+  ReturnKeyType,
 } from "react-native";
 import SearchBar from "./modalPicker/SearchBar";
 import PickerListItem from "./modalPicker/PickerListItem";
 import PickerView from "./modalPicker/PickerView";
+import { SearchBarProps } from "react-native-screens";
 
 const ModalPicker = (props: ModalPickerProps) => {
   const [data, setData] = useState(props?.data);
@@ -80,7 +83,12 @@ const ModalPicker = (props: ModalPickerProps) => {
               <View style={styles.backDropStyle} />
             </Pressable>
             {!props.hideSearchBar && (
-              <SearchBar {...props} searchByNameCode={searchByNameCode} />
+              <SearchBar 
+                {...props} 
+                searchByNameCode={searchByNameCode}
+                keyboardType={props.searchBarKeyboardType}
+                returnKeyType={props.searchBarReturnKeyType}
+              />
             )}
 
             <FlatList
@@ -130,6 +138,8 @@ export interface ModalPickerProps {
   searchIcon?: ImageSourcePropType;
   dropDownIcon?: ImageSourcePropType;
   animationType?: "none" | "slide" | "fade" | undefined;
+  searchBarKeyboardType?: KeyboardTypeOptions
+  searchBarReturnKeyType?: ReturnKeyType
 }
 const styles = StyleSheet.create({
   container: {
diff --git a/node_modules/rn-modal-picker/modalPicker/SearchBar.tsx b/node_modules/rn-modal-picker/modalPicker/SearchBar.tsx
index 958a6a3..6848ee8 100644
--- a/node_modules/rn-modal-picker/modalPicker/SearchBar.tsx
+++ b/node_modules/rn-modal-picker/modalPicker/SearchBar.tsx
@@ -7,6 +7,8 @@ import {
   Platform,
   ViewStyle,
   ImageSourcePropType,
+  KeyboardTypeOptions,
+  ReturnKeyTypeOptions,
 } from "react-native";
 import React, { useState } from "react";
 
@@ -17,6 +19,8 @@ interface SearchBarProps {
   searchBarPlaceHolder?: string;
   searchIcon?: ImageSourcePropType;
   searchClearIcon?: ImageSourcePropType;
+  keyboardType?: KeyboardTypeOptions
+  returnKeyType?: ReturnKeyTypeOptions
 }
 
 const SearchBar = (props: SearchBarProps) => {
@@ -35,8 +39,8 @@ const SearchBar = (props: SearchBarProps) => {
         source={searchIcon}
       />
       <TextInput
-        inputMode="default"
-        enterKeyHint={"done"}
+        keyboardType={props.keyboardType || "default"}
+        returnKeyType={props.returnKeyType || "done"}
         blurOnSubmit={true}
         style={styles.textInputStyle}
         onChangeText={props.searchByNameCode}

This issue body was partially generated by patch-package.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions