Skip to content

hasanalicansu/react-native-multiple-select-hac

Repository files navigation

react-native-multiple-select-hac

Content type (Vertical and horizontal) Modal Light Modal Dark
content ! modal Light modal dark

react-native-multiple-select-hac

react native multiple select

Installation

npm install react-native-multiple-select-hac

Usage

import MultipleSelect from "react-native-multiple-select-hac";

// ...

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT

The component takes 3 compulsory props - items, uniqueKey, value and setValue . Other props are optional. The table below explains more.

Props

Prop Required Purpose
uniqueKey No (String) Defaults to "value". Unique identifier that is part of each item's properties. Used internally as means of identifying each item
items No State variable that holds the items.
value No (array) State variable that specifies the value of the selected item. It's an array of values for multiple item pickers.
setValue No ((callback: SetStateAction) => void) State callback that is called when the value changes.
displayedObject No (String) Defaults to "label". This string will be used to select the key to display the objects in the items array
topText No (String) Top Text for multiple select
topTextStyle No (StyleProp) Style for top text
theme No (light / dark) Theme for component
searchable No (boolean) Defaults to "false". Enables the search feature in the drop-down menu / modal.
placeholder No (String) Defaults to 'Select items'. Placeholder text displayed in multi-select filter input
onSelectedItemsChange No (void function) Callback that returns the selected item / items.
placeholderStyle No (StyleProp) Styling for placeholder
max No (number) Specifies the maximum number of items.
categorySelectable No (boolean) Defaults to 'false'. Allows selection of categories
parent No (string) The children have the parent's value as their parent key.
clearText No (string) Defaults to 'Clear'. Text for remove all selected button.
clearStyle No (StyleProp) Styling for clearText
confirmButtonText No (string) Defaults to 'Confirm'. Confirm button text.
confirmButtonTextStyle No (StyleProp) Styling for confirm button's text
confirmButtonStyle No (StyleProp) Styling for confirm button
vertical No (boolean) Defaults to 'false'. Display mode of selected items
verticalMaxHeight No (number) Defaults to '200'. Height of vertical mode
contentStyle No (StyleProp) Styling for content
modalContentStyle No (StyleProp) Styling for modal content
modalContainer No (StyleProp) Styling for modal container
containerStyle No (StyleProp) Styling for container
badgeIcon No (ReactNode) Icon for badge
badgeTextStyle No (StyleProp) Styling for badge's text
crossStyle No (string) Color for badge's cross icon
headerIcon No (ReactNode) Icon for modal close button
leftStyle No (StyleProp) Icon styling for modal close button
headerStyle No (StyleProp) Styling for modal header