/**
 * A loader overlay component that dims wrapped content and displays a centered spinner.
 *
 * @example Basic usage with default spinner
 * ```html
 * <r-spinner loading>
 *   <div>Content to dim while loading</div>
 * </r-spinner>
 * ```
 *
 * @example Custom spinner image
 * ```html
 * <r-spinner loading>
 *   <img slot="spinner" src="spinner.gif" alt="" />
 *   <div>Content</div>
 * </r-spinner>
 * ```
 *
 * @example Styled via CSS custom properties
 * ```html
 * <style>
 *   r-spinner {
 *     --loader-overlay-color: rgba(255, 255, 255, 0.8);
 *     --loader-spinner-size: 64px;
 *     --loader-spinner-color: #e11d48;
 *     --loader-spinner-width: 6px;
 *     --loader-spin-duration: 600ms;
 *     --loader-transition-duration: 200ms;
 *   }
 * </style>
 * ```
 *
 * @attr {boolean} loading - When present, shows the overlay and spinner
 *
 * @csspart overlay - The dimming overlay element
 * @csspart spinner-container - Wrapper around the spinner (default or slotted)
 * @csspart default-spinner - The default CSS ring spinner
 *
 * @slot - Default slot for content to be wrapped
 * @slot spinner - Optional custom spinner element (replaces default)
 */
declare class RelaxSpinner extends HTMLElement {
    static get observedAttributes(): string[];
    private _shadow;
    constructor();
    /** Reflects the loading state. Controls overlay visibility. */
    get loading(): boolean;
    set loading(value: boolean);
    attributeChangedCallback(name: string, _oldValue: string | null, _newValue: string | null): void;
    connectedCallback(): void;
    private _updateAriaState;
    private _observeSpinnerSlot;
    private _render;
}
export { RelaxSpinner };
declare global {
    interface HTMLElementTagNameMap {
        'r-spinner': RelaxSpinner;
    }
}