Component Preview
Interactive demonstration of the RecordCollection component
🎛️ Interactive Controls
Component Overview
The RecordCollection component provides a comprehensive interface for browsing, searching, and loading songs from your music library, making it easy to discover and play your favorite tracks.
This interactive demo allows you to explore all the features and capabilities of the RecordCollection component. Use the controls above to test the component's functionality and see how it integrates with other music library components.
API Reference
The RecordCollection component provides a comprehensive API for integration into your applications.
Properties: Configure the component with various properties to customize appearance and collection behavior.
Methods: Programmatically control the record collection using built-in methods for loading songs and managing the library.
Events: Listen to component events to respond to song selections and library changes.
Component Events
The RecordCollection component emits various events that you can listen to:
• Song Selected: Fired when a song is selected from the collection
• Library Loaded: Fired when the song library is loaded
• Search Results: Fired when search results are updated
• Collection Update: Fired when the collection is refreshed
View the Event Log tab to see real-time events as they occur.
Usage Examples
Here are some common ways to use the RecordCollection component in your projects:
Basic Usage:<recordcollection></recordcollection>
With Properties:<recordcollection library="my-songs" view="grid"></recordcollection>
Event Listeners:recordCollection.addEventListener('song-selected', handleSongSelected);