react-multiselect-checkboxes custom the DropdownButton

Question

I'm studying react and so using the react-multiselect-checkboxes library. I'm trying to custom the DropDownButton but without succeed.

Here is the code:

import React, { useState, useEffect } from "react";
import ReactMultiSelectCheckboxes from "react-multiselect-checkboxes";
import DropdownButton from "react-multiselect-checkboxes/lib/DropdownButton.js";

const MultiSelectAll = (props) => {
  const [selectedOptions, setSelectedOptions] = useState([]);
  
  useEffect(() => {
    setSelectedOptions([{ label: "Tutte", value: "*" }, ...props.options]);
  }, []);

  const CustomDropDownButton = (props) => { 
    return (
      <DropdownButton {...props} className={[]} onPress={(e) => e.stopProgagation()}>
        test
      </DropdownButton>
    )
  }

  return (
    <ReactMultiSelectCheckboxes
      options={[{ label: "Tutte", value: "*" }, ...props.options]}
      components={{CustomDropDownButton}}
      value={selectedOptions}
      onChange={onChange}
      setState={setSelectedOptions}
    />
  );
};

export default MultiSelectAll;

I'm using the components property but the DropDownButton is still the same select with the label plus the arrow indicator. Is there a way to custom the DropDownButton in the first way? If yes, what i'm doing wrong?