A new version of the jSuites JavaScript Dropdown plugin is available here.
JavaScript Dropdown
React Dropdown
React dropdown and react autocomplete working example on codesandbox.
Dropdown component
import { useRef, useEffect } from "react";
import jSuites from "jsuites";
import "jsuites/dist/jsuites.css";
export default function Dropdown({ options }) {
const dropdownRef = useRef(null);
useEffect(() => {
jSuites.dropdown(dropdownRef.current, options);
}, [options]);
return <div ref={dropdownRef} />;
}
Component usage
import { useState, useRef } from "react";
import Dropdown from "./Dropdown";
export default function App() {
const [dropdownValue, setDropdownValue] = useState("");
const data = useRef(["Dog", "Cat", "Bird", "Fish"]);
const handleDropdownChange = (element, index, oldValue, newValue) => {
setDropdownValue(newValue);
};
return (
<>
<h3>Dropdown example:</h3>
<Dropdown
options={{
value: dropdownValue,
onchange: handleDropdownChange,
data: data.current,
newOptions: true
}}
/>
</>
);
}