furl
Getting startedDesignComponents
Design
Design GuidelinesTypography SystemLayout SystemColor palettesCustomization
Components
ComponentsAccordionAlertAnchorAudioAvatarBadgeBreadcrumbsButtonButtonGroupCalendarCardCollapseContextButtonDividerDropdownFooterFormGraphGridHyperlinkIconIframeImageInputItemLayoutListLoaderMediaObjectMenuModalNotificationPaginationPopoverProgressSearchStepsSwitchTableTabsTooltipTypographyVideo

Dropdown

Dropdowns toggle the display of a list of items.

Examples

Dropdown
Item 1Item 2Item 3
Reverse dropdown
Item 1Item 2Item 3
import React from 'react';
import ReactDOM from 'react-dom';
import { Dropdown, Hyperlink } from 'furl-components';

ReactDOM.render(
  <Dropdown title='Reverse dropdown' reverse>
    <Hyperlink href='#one'>Item 1</Hyperlink>
    <Hyperlink href='#two'>Item 2</Hyperlink>
    <Hyperlink href='#three'>Item 3</Hyperlink>
  </Dropdown>, 
  document.getElementById('root')
);

API

Dropdown props
Property Description Type Default
title dropdown title string 'Show/hide content'
isOpen dropdown open state boolean false
reverse dropdown reverse style boolean false

furl was designed and developed by Angelos Chalaris © 2019
Documentation generated using Gatsby, hosting by Netlify