<.dropdown id="dropdown-single-default" label="Dropdown">
  <.dropdown_item value="1" label="Item 1" />
  <.dropdown_item value="2" label="Item 2"><:right_icon><.chevron_right /></:right_icon></.dropdown_item>
  <.dropdown_item value="3" label="Item 3" secondary_text="Foo" />
  <.dropdown_item value="4" label="Item 4"><:left_icon><.category /></:left_icon></.dropdown_item>
  <.dropdown_item value="5" label="Item 5" />
</.dropdown>

<.dropdown disabled id="dropdown-single-disabled" label="Dropdown"/>

<.dropdown id="dropdown-single-large-items" label="Dropdown with large items">
  <.dropdown_item value="1" label="Item 1" size="large">
  <:left_icon><.category /></:left_icon>
  </.dropdown_item>
  <.dropdown_item value="2" label="Item 2" size="large" right_icon={false}>
  <:left_icon><.category /></:left_icon>
  </.dropdown_item>
  <.dropdown_item value="3" label="Item 3" size="large" secondary_text="Foo">
  <:left_icon><.category /></:left_icon>
  </.dropdown_item>
  <.dropdown_item value="4" label="Item 4" size="large">
  <:left_icon><.category /></:left_icon>
  </.dropdown_item>
  <.dropdown_item value="5" label="Item 5" size="large">
  <:left_icon><.category /></:left_icon>
  </.dropdown_item>
</.dropdown>

<.dropdown id="dropdown-single-with-icon" label="Dropdown">
  <:icon><.category /></:icon>
  <.dropdown_item value="1" label="Item 1"/>
</.dropdown>

<.dropdown id="dropdown-single-with-secondary-text" label="Date" secondary_text="Order by">
  <.dropdown_item value="1" label="Item 1" secondary_text="Foo"/>
</.dropdown>

<.dropdown
  id="dropdown-single-with-icon-and-secondary-text"
  label="Date"
  secondary_text="Order by"
>
  <:icon><.category /></:icon>
  <.dropdown_item value="1" label="Item 1" secondary_text="Foo"/>
</.dropdown>

<.dropdown id="dropdown-single-with-hint" label="Dropdown" hint="This is a hint">
  <.dropdown_item value="1" label="Item 1"/>
</.dropdown>