Skip to main content
Version: 5.1

Category

You can categorize your items easily.

const [items, setItems] = useState([
{label: 'North America', value: 'na'},
{label: 'United States', value: 'usa', parent: 'na'},
{label: 'Canada', value: 'canada', parent: 'na'},
{label: 'Europe', value: 'eu'},
{label: 'Norway', value: 'norway', parent: 'eu'},
{label: 'Belgium', value: 'belgium', parent: 'eu'},
]);

The children have the parent's value as their parent key.

note

The items don't need to be sorted, This will be done automatically.

Props#

categorySelectable#

Specifies if the categories can be selected.

categorySelectable={true}
TypeDefault
boolfalse

Styling#

listParentContainerStyle#

listParentContainerStyle={{
justifyContent: "center",
alignItems: "center"
}}

listParentLabelStyle#

listParentLabelStyle={{
fontWeight: "bold"
}}

listChildContainerStyle#

listChildContainerStyle={{
paddingLeft: 20
}}

listChildLabelStyle#

listChildLabelStyle={{
color: "grey"
}}