Dropdown

Un botón que permite mostrar un menu contextual cuando se hace clic en el.

Utilización

import { Dropdown } from "firefly-components/dropdown";

<Dropdown content="Opciones" icon={ <ChevronDownIcon /> } >
    Opciones del dropdown aquí...
</Dropdown>

Props

`content`	Es texto que va dentro del botón del dropdown. Recibe un string.
`icon`	Recibe un icono que se puede colocar dentro del botón del dropdown.

Para agregar opciones al menú que muestra el dropdown debes usar el componente DropdownItem.
Por ejemplo, para el Dropdown mostrado el incio de esta pagina harias algo como lo siguiente:

import { Dropdown, DropdownItem } from "firefly-components/dropdown";

<Dropdown content="Opciones" icon={ <ChrevronDownIcon /> } >
    <DropdownItem content="Más detalles" icon={ <Detail /> } />
    <DropdownItem content="Editar" icon={ <Pencil /> } />
    <Separator />
    <DropdownItem content="Eliminar" icon={ <Trash /> } hintColor="danger" />
</Dropdown>

Props del `DropdownItem`

`content`	Es el texto del `DropdownItem`. Recibe un string.
`icon`	Es el icono del`DropdownItem`. Recibe un icono que es un componente de React.
`hintColor`	Permite agregar un color de resaltado al `DropdownItem` cuando el usuario hace hover sobre el. Recibe un string que debe concidir con el nombre de alguna de las variables de la paleta de colores.
`handleClick`	Recibe una función que será ejecutada cuando se hace click en el `DropdownItem`.

Utilización

Props

Agregando opciones al menú del Dropdown

Props del DropdownItem

Props del `DropdownItem`