> Note: Dash.NET is currently considered experimental. If your organization is interested in sponsoring Dash.NET, please get in touch.

# `htmlAudio`

## Reference & Documentation

An `Audio` component. `Audio` is a wrapper for the <audio> HTML5 element. For detailed attribute info see: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio

> Our recommended IDE for writing Dash apps is Dash Enterprise's Data Science Workspaces, which has typeahead support for Dash Component Properties. Find out if your company is using Dash Enterprise.

`children` (list of or a singular dash component, string or number; optional): The children of this component.

`id` (string; optional): The ID of this component, used to identify dash components in callbacks. The ID needs to be unique across all of the components in an app.

`n_clicks` (number; default `0`): An integer that represents the number of times that this element has been clicked on.

`n_clicks_timestamp` (number; default `-1`): An integer that represents the time (in ms since 1970) at which n_clicks changed. This can be used to tell which button was changed most recently.

`disable_n_clicks` (bool; optional): When True, this will disable the n_clicks prop. Use this to remove event listeners that may interfere with screen readers.

`key` (string; optional): A unique identifier for the component, used to improve performance by React.js while rendering components See https://reactjs.org/docs/lists-and-keys.html for more info.

`autoPlay` (a value equal to: 'autoPlay', 'autoplay' or 'AUTOPLAY' | bool; optional): The audio or video should play as soon as possible.

`controls` (a value equal to: 'controls' or 'CONTROLS' | bool; optional): Indicates whether the browser should show playback controls to the user.

`crossOrigin` (string; optional): How the element handles cross-origin requests.

`loop` (a value equal to: 'loop' or 'LOOP' | bool; optional): Indicates whether the media should start playing from the start when it's finished.

`muted` (a value equal to: 'muted' or 'MUTED' | bool; optional): Indicates whether the audio will be initially silenced on page load.

`preload` (string; optional): Indicates whether the whole resource, parts of it or nothing should be preloaded.

`src` (string; optional): The URL of the embeddable content.

`accessKey` (string; optional): Keyboard shortcut to activate or add focus to the element.

`className` (string; optional): Often used with CSS to style elements with common properties.

`contentEditable` (string; optional): Indicates whether the element's content is editable.

`dir` (string; optional): Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left).

`draggable` (string; optional): Defines whether the element can be dragged.

`hidden` (a value equal to: 'hidden' or 'HIDDEN' | bool; optional): Prevents rendering of given element, while keeping child elements, e.g. script elements, active.

`lang` (string; optional): Defines the language used in the element.

`role` (string; optional): Defines an explicit role for an element for use by assistive technologies.

`spellCheck` (string; optional): Indicates whether spell checking is allowed for the element.

`style` (record; optional): Defines CSS styles which will override styles previously set.

`tabIndex` (string | number; optional): Overrides the browser's default tab order and follows the one specified instead.

`title` (string; optional): Text to be displayed in a tooltip when hovering over the element.

`loading_state` (record; optional): Object that holds the loading state object coming from dash-renderer.

`loading_state` is a record with keys:

- `component_name` (string; optional): Holds the name of the component that is loading.

- `is_loading` (bool; optional): Determines if the component is loading or not.

- `prop_name` (string; optional): Holds which property is loading.