@sandlada/mdc/build/components/loading-indicator/loading-indicator.d.ts

@sandlada/mdc is an open source component library that follows the Material Design 3 design specifications.

/**
 * @license
 * Copyright 2026 Kai-Orion & Sandlada
 * SPDX-License-Identifier: MIT
 *
 * @fileoverview
 * `mdc-loading-indicator` — the MD3 Expressive morphing-shape loading indicator.
 *
 * The indeterminate form morphs through the MD3E shape sequence
 * (SoftBurst → Cookie9Sided → Pentagon → Pill → Sunny → Cookie4Sided → Oval)
 * with a spring-driven morph between consecutive shapes, a short hold on each
 * shape, an extra 90° spin per completed morph, and a continuous global
 * rotation — mirroring the Jetpack Compose `LoadingIndicator` and the Android
 * Views `LoadingIndicatorDrawable` animation parameters. The determinate form
 * drives a circle → SoftBurst morph from `progress`.
 *
 * Geometry: every shape is a radial function sampled at uniform angles, so all
 * shapes share the same point count and morphing reduces to a per-point lerp.
 * The result is rendered as a single closed SVG path (a dense polyline reads
 * as a smooth curve at the 38px active size).
 */
import { LitElement, type PropertyValues, type TemplateResult } from 'lit';
import { type ILoadingIndicator, type LoadingIndicatorVariant } from './loading-indicator.interface';
declare global {
    interface HTMLElementTagNameMap {
        'mdc-loading-indicator': MDCLoadingIndicator;
    }
}
declare const MDCLoadingIndicator_base: Omit<typeof LitElement, "prototype"> & (new () => LitElement & object);
/**
 * @element mdc-loading-indicator
 *
 * MD3 Expressive loading indicator. Runs the looping morph-shape sequence when
 * `indeterminate` is set, or tracks `progress` (0–1) as a determinate
 * circle → SoftBurst morph that rotates −180° across the full range.
 *
 * @version Material Design 3 - Expressive
 *
 * @link https://m3.material.io/components/loading-indicator/overview
 */
export declare class MDCLoadingIndicator extends MDCLoadingIndicator_base implements ILoadingIndicator {
    static styles: import("lit").CSSResult;
    /** When set, loops the indeterminate morph instead of tracking `progress`. */
    indeterminate: boolean;
    /** Determinate progress, `0`–`1` (mirrored by `aria-valuenow`). */
    progress: number;
    /**
     * MD3 color-role scheme: `'primary'` (default) | `'secondary'` |
     * `'tertiary'` | `'error'` | `'surface'`.
     */
    variant: LoadingIndicatorVariant;
    /** When set, draws the fully-rounded container behind the shape. */
    contained: boolean;
    /** Animation-rate multiplier for the indeterminate form (default `1`). */
    speed: number;
    private rafId;
    private lastFrameTime;
    private morphIndex;
    private springPos;
    private springVel;
    private holdElapsed;
    private springRunning;
    private rotationTarget;
    private globalRotation;
    private reducedMotion;
    private reducedMotionQuery;
    private completeFired;
    connectedCallback(): void;
    disconnectedCallback(): void;
    protected updated(changedProperties: PropertyValues<this>): void;
    protected render(): TemplateResult;
    /** The path and rotation for the current frame or progress value. */
    private computeRender;
    private startAnimation;
    private stopAnimation;
    private readonly frame;
    /**
     * Advance the indeterminate morph: spring the shape toward the next one,
     * hold on each shape, accumulate the per-morph spin and the continuous
     * global rotation.
     */
    private stepIndeterminate;
    private readonly handleReducedMotionChange;
}
export {};
//# sourceMappingURL=loading-indicator.d.ts.map