import{type TemplateResult}from'lit';import{LyraElement}from'../../../internal/lyra-element.js';import type{LyraSize}from'../../../internal/variants.js';import type{LyraProgressVariant}from'./progress-bar.class.js'; /** * `` — a circular determinate or indeterminate progress indicator. `variant` * selects the indicator's semantic palette from the library's shared semantic grid (`neutral` * through `danger`), defaulting to `brand`, matching sibling ``. * * @customElement lr-progress-ring * @slot - Optional center label whose visible accessible text names the progressbar unless an * explicit accessible label overrides it; live mutations stay synchronized through forwarding * slots. When nothing is slotted, the fallback content is the formatted percentage while * determinate and `show-value` is set (`''` otherwise, and always `''` while `indeterminate`) -- * the same value contract as ``'s `showValue`. * @slot label - Named alias for the optional center label, matching ``. * @csspart base - Compatibility name for the progress wrapper; use `progress-ring`. * @csspart progress-ring - The progress wrapper. It is the same node as `base`. * @csspart track - The SVG track. * @csspart indicator - The SVG indicator. * @csspart label - The center label. * @cssprop [--lr-progress-ring-size=var(--size,var(--_lr-progress-ring-size))] - Outer diameter of * the ring. The private fallback steps with `size` across the shared six-step ladder (`1.25rem` at * `2xs` up to `3.5rem` at `xl`, `2.5rem` unchanged at the `m` default); an inherited or direct * value here (or the upstream `--size` alias) still wins outright over every tier. * @cssprop [--lr-progress-ring-track-width=var(--lr-theme-progress-ring-track-width,var(--lr-size-4px))] - Track * stroke width, `4px` by default. Bridges its own dedicated `--lr-theme-progress-ring-track-width` * theme input rather than the widely-shared `--lr-theme-border-width-thick` (fed to the * `--lr-border-width-thick` alias): `theme.css` declares that shared input at `3px` -- its correct * default for the many surfaces that genuinely want it -- and bridging it directly here would have * let importing `theme.css` alone silently repaint this ring's stroke to `3px` even with no * consumer override. Set `--lr-theme-progress-ring-track-width` on `:root` or any ancestor to retune * this ring specifically; it stays unset (and this default applies) whether or not `theme.css` is * imported. * @cssprop [--lr-progress-ring-track-color=var(--lr-color-brand-quiet)] - Track stroke color. * @cssprop [--lr-progress-ring-indicator-width=var(--lr-progress-ring-track-width)] - Indicator stroke width. * @cssprop [--lr-progress-ring-indicator-color=var(--lr-progress-ring-indicator-variant-color)] - * Indicator stroke color, overriding the variant palette below. * @cssprop [--lr-progress-ring-indicator-variant-color=var(--lr-color-fill-loud,var(--lr-color-brand))] - * Palette slot: the active `variant`'s loud fill from the shared semantic grid. Feeds * `--lr-progress-ring-indicator-color` above unless that (or the upstream `--indicator-color` * alias) is itself set. * @cssprop [--lr-progress-ring-indicator-transition-duration=var(--lr-transition-base)] - Determinate indicator transition. * @cssprop [--lr-progress-duration=var(--lr-transition-ambient)] - Indeterminate rotation timing. * @cssprop [--size=var(--lr-progress-ring-size)] - Upstream-compatible outer diameter. * @cssprop [--track-width=var(--lr-progress-ring-track-width)] - Upstream-compatible track width. * @cssprop [--track-color=var(--lr-progress-ring-track-color)] - Upstream-compatible track color. * @cssprop [--indicator-width=var(--lr-progress-ring-indicator-width)] - Upstream-compatible indicator width. * @cssprop [--indicator-color=var(--lr-progress-ring-indicator-color)] - Upstream-compatible indicator color. * @cssprop [--indicator-transition-duration=var(--lr-progress-ring-indicator-transition-duration)] - Upstream-compatible transition duration. * @status stable * @since 4.0.0 */ export declare class LyraProgressRing extends LyraElement{static styles:import("lit").CSSResultGroup[];value:number;max:number;indeterminate:boolean; /** Selects the indicator's semantic palette from the shared semantic grid, matching sibling * ``'s `variant`. */ variant:LyraProgressVariant; /** Shows the formatted percentage as the default slot's fallback content while determinate. * `false` by default, matching sibling ``'s `showValue`/`show-value` exactly -- * a determinate ring with no `show-value` renders no percentage text. Only the fallback is * gated: a consumer who slots their own content always sees that content instead, with or * without `show-value` (native `` projection semantics, unaffected by this property). */ showValue:boolean; /** Outer diameter of the ring, on the library's shared six-step size ladder. `'m'` (the default) * is this component's pre-existing behaviour, unchanged: an unset ring still renders at * `--lr-progress-ring-size`'s literal `2.5rem` default. Every other tier scales that same * diameter, from a compact `1.25rem` at `2xs` up to a roomy `3.5rem` at `xl`; an explicit * `--lr-progress-ring-size` (or the upstream `--size` alias) still wins over any tier. Matching * sibling ``'s own `size`, this scales exactly one dimension — the track/ * indicator stroke width and the center label's font size are unaffected by the tier. */ size:LyraSize; /** Mapped accessible-label property. */ label:string; /** Explicit accessible name, on the library-wide `accessibleLabel`/`accessible-label` convention * shared by every Lyra component that names a shadow-owned role. Not an alias kept for one * upstream: `label` is the mapped upstream name and this is Lyra's own spelling; both are read, * with `label` first and a host `aria-label` above both. */ accessibleLabel:string;private cachedVisibleLabelText;private labelObserver?;private readonly onLabelSlotChange;connectedCallback():void; /** * `MutationObserver` instances are bound to the realm (`window`) that constructed them, not to * the node they observe: one built from a stale `window.MutationObserver` keeps delivering * through that window's microtask queue even after this element is adopted into a different * document, instead of the adopted document's own. Adoption (`document.adoptNode()`, or an * implicit cross-document `appendChild`) always runs `adoptedCallback()` -- while this element is * momentarily disconnected, ahead of any later `connectedCallback()` -- so this rebuilds the * observer here rather than only lazily on the next connect. */ adoptedCallback():void; /** Tears down and reconstructs `labelObserver` bound to the current `ownerDocument`'s realm, then * rebinds every current target. Called on connect and on adoption -- see `adoptedCallback()`. */ private rebuildLabelObserver;private bindLabelObserverTargets;disconnectedCallback():void;private computeVisibleLabelText;private recomputeVisibleLabelText;private get safeMax();private get safeValue();private get percent();private get formattedPercent(); /** Live SVG indicator circle, or `null` before the render root is populated. */ get indicator():SVGCircleElement|null; /** Current normalized stroke offset used by the rendered indicator. */ get indicatorOffset():number;render():TemplateResult;}declare global{interface HTMLElementTagNameMap{'lr-progress-ring':LyraProgressRing;}}