Basic Usage
Show a loading overlay with spinner (auto-hides in 3s)
<loading-layer timeout="3"></loading-layer>
document.getElementById('basic').show();
With Message
Display a message below the spinner
<loading-layer message="Loading data, please wait..."></loading-layer>
Custom Colors
Customize spinner color and size
<loading-layer color="#22c55e" size="80" stroke-width="6"></loading-layer>
Different Timeouts
Auto-hide after specified seconds
<loading-layer timeout="2" message="Hiding in 2 seconds..."></loading-layer>
Global Events
Trigger loading layer via custom events
document.dispatchEvent(new CustomEvent('loading-layer-show', {
detail: { message: 'Triggered via event!' }
}));