import React, { useState } from 'react';
import styles from './dropdown.module.css';
const Dropdown = () => {
const [active, setActive] = useState(false);
return (
<div className={styles.dropdown}>
<button onClick={() => setActive(!active)}>
Dropdown
<div className={styles.caretDown}>&#94;</div>
</button>
{active && (
<div className={styles.menu}>
<div tabIndex='0' className={styles.menuItem}>Item A</div>
<div tabIndex='0' className={styles.menuItem}>Item B</div>
<div tabIndex='0' className={styles.menuItem}>Item C</div>
</div>
)}
</div>
)
}
export default Dropdown;
view raw Dropdown.js hosted with ❤ by GitHub