Skip to content

Latest commit

 

History

History
66 lines (44 loc) · 2.59 KB

File metadata and controls

66 lines (44 loc) · 2.59 KB

Audio Settings API Reference

Audio settings components connect directly to the audio navigator and Redux state. They render the appropriate control variant (slider, slider with presets, or number field) based on the settings.keys configuration in ThAudioPreferences.

All components accept a standalone prop. When true (the default), the component renders without additional wrapper styling — useful when embedding outside the default settings panel.

StatefulAudioAutoPlay

Toggle for continuous play. When enabled, the player automatically loads and plays the next track when the current one ends. When disabled, the next track is loaded but playback does not start automatically.

interface StatefulAudioAutoPlayProps {
  standalone?: boolean;
}

Reads and updates audioSettings.autoPlay in Redux, and submits autoPlay to the navigator preferences.

StatefulAudioSkipInterval

Unified skip interval control — sets both forward and backward skip durations to the same value.

interface StatefulAudioSkipIntervalProps {
  standalone?: boolean;
}

Renders as a preset group, slider with presets, slider, or number field depending on settings.keys.skipInterval.variant. Defaults to presetsGroup. Updates both skipForwardInterval and skipBackwardInterval in Redux simultaneously.

Note

Use either StatefulAudioSkipInterval or the pair StatefulAudioSkipBackwardInterval + StatefulAudioSkipForwardInterval — not both. Including both in settings.order will trigger a console warning from createAudioPreferences.

StatefulAudioSkipBackwardInterval

Independent control for the backward skip duration.

interface StatefulAudioSkipBackwardIntervalProps {
  standalone?: boolean;
}

Renders based on settings.keys.skipBackwardInterval.variant. Defaults to presetsGroup. Updates only skipBackwardInterval in Redux.

StatefulAudioSkipForwardInterval

Independent control for the forward skip duration.

interface StatefulAudioSkipForwardIntervalProps {
  standalone?: boolean;
}

Renders based on settings.keys.skipForwardInterval.variant. Defaults to presetsGroup. Updates only skipForwardInterval in Redux.

Common Features

All settings components share these characteristics:

  • Preference Integration: Direct integration with the preferences system
  • Audio Navigation: Real-time updates to the audio player
  • Redux State: Centralized state management for applied settings
  • Accessibility: ARIA attributes and keyboard navigation support
  • Styling: Consistent styling through CSS modules