<!--
The README.md file is a compiled document. No edits should be made directly to this file.

README.md is created by running `npm run build:docs`.

This file is generated based on a template fetched from
`../../docs/templates/componentReadmeTemplate.md`
and copied to `./componentDocs/README.md` each time the docs are compiled.

The following sections are editable by making changes to the following files:

| SECTION                | DESCRIPTION                                       | FILE LOCATION                              |
|------------------------|---------------------------------------------------|--------------------------------------------|
| Description            | Description of the component                      | `./docs/partials/description.md`           |
| Use Cases              | Examples for when to use this component           | `./docs/partials/useCases.md`              |
| Getting Started        | Getting started link for this component           | `./docs/partials/readmeGettingStarted.md`  |
-->

# Dropdown

<!-- AURO-GENERATED-CONTENT:START (FILE:src=./docs/partials/description.md) -->
<!-- The below content is automatically added from ./docs/partials/description.md -->
The <code>auro-dropdown</code> component is a trigger and dropdown element combination intended to be used with dropdown content that is interactive. <code>auro-dropdown</code> is content agnostic and any valid HTML can be placed in either the trigger or the dropdown.

<p class="note"><strong>Note:</strong> if the dropdown content in your implementation is not interactive (e.g. a tooltip) [auro-popover](http://auro.alaskaair.com/components/auro/popover) may better serve your needs.</p>
<!-- AURO-GENERATED-CONTENT:END -->

## Dropdown Use Cases

<!-- AURO-GENERATED-CONTENT:START (FILE:src=./docs/partials/useCases.md) -->
<!-- The below content is automatically added from ./docs/partials/useCases.md -->
The `auro-dropdown` element should be used in situations where users may:

* interact with an element to get clarification on content offering
* provide definition to iconic imagery
* when interactive help is required
<!-- AURO-GENERATED-CONTENT:END -->

## Getting Started

<!-- AURO-GENERATED-CONTENT:START (FILE:src=./docs/partials/readmeGettingStarted.md) -->
<!-- The below content is automatically added from ./docs/partials/readmeGettingStarted.md -->
For Getting Started instructions, visit the [auro-dropdown Getting Started page](https://auro.alaskaair.com/components/auro/dropdown/getting-started).
<!-- AURO-GENERATED-CONTENT:END -->
