Dropdown component
This is the main component of the dropdown menu that wraps all the other components
Usage
Make sure you wrap all the other components inside the <Dropdown> component
<Dropdown>
<DropdownLabel>Click me!</DropdownLabel>
<DropdownMenu>
<DropdownButton>Button 1</DropdownButton>
<DropdownButton>Button 2</DropdownButton>
<DropdownButton>Button 3</DropdownButton>
</DropdownMenu>
</Dropdown>
Using NextJS 14
If you are using NextJS 14 you need to add 'use client' for the dropdown menu to work
You can create a separate component like the example bellow
'use client'
import { Dropdown, DropdownLabel, DropdownMenu, DropdownButton } from 'alin-simple-dropdown'
export default function MyDropdown() {
return(
<Dropdown>
<DropdownLabel>Click me!</DropdownLabel>
<DropdownMenu>
<DropdownButton>Button 1</DropdownButton>
<DropdownButton>Button 2</DropdownButton>
<DropdownButton>Button 3</DropdownButton>
</DropdownMenu>
</Dropdown>
)
}