import{type PropertyValues,type TemplateResult}from'lit';import{LyraElement}from'../../../internal/lyra-element.js'; /** Mirroring direction for `flip`. Physical, not direction-relative — see `icon.styles.ts`. */ export type LyraIconFlip='x'|'y'|'both'|'horizontal'|'vertical'; /** Sizing strategy for the icon's layout canvas. */ export type LyraIconCanvas='fixed'|'auto'|'square'|'roomy'; /** Built-in motion treatments. Every treatment stops when reduced motion is requested. */ export type LyraIconAnimation='beat'|'fade'|'beat-fade'|'bounce'|'flip'|'flip-360'|'shake'|'spin'|'spin-pulse'|'spin-reverse'|'spin-snap'|'spin-snap-4'|'spin-snap-8'|'buzz'|'wag'|'float'|'swing'|'jello';export interface LyraIconEventMap{'lr-load':CustomEvent<{src:string;}>;'lr-error':CustomEvent<{src:string;error:unknown;}>;} /** `` — an SVG icon primitive. Renders a built-in named path with no network access at * all, or resolves a name through a registered icon library, or fetches one SVG document from * `src`. Remote markup is byte-capped, sanitized with DOMPurify, and rendered only if the whole * pipeline succeeds; anything else fails closed with a localized alert and no partial markup. * Matching loads share a bounded cache of canonical sanitized SVGs. Each instance deep-clones the * canonical node before its trusted library mutator runs, so cached state is never mutated. * The mirrored upstreams' icon-name vocabularies are not bundled. The default library contains * only `add`, `check`, `close`, `search`, `menu`, `chevron-left`, `chevron-right`, `chevron-down`, * `calendar`, `command`, and `trash`; any other name renders no glyph unless a matching library is * registered, including through `registerIconLibrary('default', { resolver })`. * @customElement lr-icon * @slot - Optional custom SVG/path content when no `name`, `path`, `library`, or `src` resolves. * @event lr-load - A remote icon finished loading and is in the DOM. `detail: { src }`. * @event lr-error - A remote icon could not be resolved, fetched, or sanitized. * `detail: { src, error }`. * @csspart svg - The rendered SVG, whether built-in or fetched. * @csspart use - Every `` element in the rendered SVG. * @csspart error - The visually hidden, `aria-hidden` mirror shown when a remote icon fails. The * spoken error is appended to Lyra's shared assertive light-DOM announcement sink while the * icon and its composed ancestors are exposed to the accessibility tree. * @csspart empty - Marker rendered when a remote icon resolved to an empty but valid document. * @cssprop [--lr-icon-size] - Optional inline and block size override for every canvas. * @cssprop [--lr-icon-fixed-width=var(--lr-size-1-5em)] - Inline size of the box while * `fixed-width` is set; the glyph keeps `--lr-icon-size` and centers inside it. * @cssprop [--lr-icon-rotate=0deg] - Rotation applied to the box. Written inline from the `rotate` * property, so set that rather than this property. * @cssprop [--lr-icon-flip-x=1] - Horizontal scale factor, set to `-1` by `flip`. * @cssprop [--lr-icon-flip-y=1] - Vertical scale factor, set to `-1` by `flip`. * @cssprop [--animation-delay=0s] - Delay before an icon animation starts. * @cssprop [--animation-direction=normal] - Playback direction for icon animations. * @cssprop [--animation-duration=var(--lr-duration-icon)] - Duration of one animation cycle. * @cssprop [--animation-iteration-count=infinite] - Number of animation cycles. * @cssprop [--animation-timing=var(--lr-easing-emphasized)] - Animation timing function. * @cssprop [--beat-fade-opacity=0.4] - Lowest opacity during `beat-fade`. * @cssprop [--beat-fade-scale=1.25] - Peak scale during `beat-fade`. * @cssprop [--beat-scale=1.25] - Scale multiplier for `beat` and `spin-pulse`. * @cssprop [--bounce-height=calc(var(--lr-size-0-5em)*-1)] - Peak bounce height. * @cssprop [--bounce-jump-scale-x=0.95] - Horizontal scale at the top of a bounce. * @cssprop [--bounce-jump-scale-y=1.05] - Vertical scale at the top of a bounce. * @cssprop [--bounce-land-scale-x=1.08] - Horizontal scale while landing. * @cssprop [--bounce-land-scale-y=0.92] - Vertical scale while landing. * @cssprop [--bounce-rebound=calc(var(--lr-size-1em)*-0.1)] - Landing rebound distance. * @cssprop [--bounce-start-scale-x=1] - Initial horizontal bounce scale. * @cssprop [--bounce-start-scale-y=1] - Initial vertical bounce scale. * @cssprop [--bounce-anticipation=0] - Downward offset before a bounce. * @cssprop [--fade-opacity=0.4] - Lowest opacity during `fade` and `spin-pulse`. * @cssprop [--flip-angle=180deg] - Rotation angle for flip treatments. * @cssprop [--flip-x=0] - X coordinate of the flip rotation axis. * @cssprop [--flip-y=1] - Y coordinate of the flip rotation axis. * @cssprop [--flip-z=0] - Z coordinate of the flip rotation axis. * @cssprop [--flip-anticipation-scale=0.9] - Wind-up scale before a flip. * @cssprop [--flip-overshoot=0deg] - Extra angle before a flip settles. * @cssprop [--buzz-distance=calc(var(--lr-size-1em)*0.12)] - Horizontal buzz travel. * @cssprop [--wag-angle=12deg] - Peak wag angle. * @cssprop [--swing-angle=15deg] - Peak swing angle. * @cssprop [--jello-scale-x=1.18] - Horizontal jello stretch. * @cssprop [--jello-scale-y=0.82] - Vertical jello stretch. * @cssprop [--float-height=calc(var(--lr-size-0-5em)*-1)] - Float rise height. * @cssprop [--float-drift=0] - Horizontal float drift. * @cssprop [--float-tilt=4deg] - Rotation at the float peak. * @cssprop [--float-squash-x=1.04] - Resting horizontal float scale. * @cssprop [--float-squash-y=0.96] - Resting vertical float scale. * @cssprop [--float-stretch-x=0.96] - Peak horizontal float scale. * @cssprop [--float-stretch-y=1.04] - Peak vertical float scale. * @cssprop [--primary-color=currentColor] - Primary duotone layer color. * @cssprop [--primary-opacity=1] - Primary duotone layer opacity. * @cssprop [--secondary-color=currentColor] - Secondary duotone layer color. * @cssprop [--secondary-opacity=0.4] - Secondary duotone layer opacity. * @status stable * @since 4.0.0 */ export declare class LyraIcon extends LyraElement{static styles:import("lit").CSSResultGroup[];private _name; /** A built-in glyph name, or the name handed to the resolver of a registered `library`. * Assigning `undefined`, as permitted by both pinned upstreams, clears the name. */ get name():string;set name(value:string|undefined); /** Raw SVG path data, taking precedence over a built-in `name`. */ path:string; /** Accessible name. Empty (the default) leaves the icon `aria-hidden`. */ label:string; /** Name of a registered icon library. `default` means the built-in glyph set; an * unregistered name also falls back to it, so registration can happen after first render. */ library:string; /** Family forwarded to a registered library resolver. Its vocabulary belongs to the library. */ family:string; /** Variant forwarded to a registered library resolver. Its vocabulary belongs to the library. */ variant:string;private _src; /** URL of a single SVG document to fetch, used when no registered library resolves `name`. * Assigning the upstream `undefined` spelling aborts/clears the pending source on update. */ get src():string;set src(value:string|undefined); /** Rotation in degrees, clockwise in both text directions. The zero default does not reflect and * produces no `transform`, so an ordinary icon never becomes a containing block. */ rotate:number; /** Mirrors the icon about the vertical (`x`/`horizontal`), horizontal (`y`/`vertical`), or both axes. */ flip?:LyraIconFlip; /** Layout canvas. Unset/`fixed` is 1.25em × 1em; `auto` follows intrinsic width at 1em high; * `square` is 1.25em × 1.25em; `roomy` is 1.5em × 1.5em. */ canvas?:LyraIconCanvas; /** Compatibility alias for `canvas="auto"`. Purely a CSS-level alias — it never reads or * writes `canvas` — so an explicit `canvas` attribute/property always wins and this becomes a * no-op while one is set. * @deprecated Use `canvas="auto"` instead. */ autoWidth:boolean; /** Swaps the primary and secondary opacity hooks used by duotone SVGs. */ swapOpacity:boolean; /** Optional built-in motion treatment; all variants honor `prefers-reduced-motion`. */ animation?:LyraIconAnimation; /** Widens the icon box to `--lr-icon-fixed-width` so a column of icons aligns its labels. */ fixedWidth:boolean;private fetchState;private svgEl?;private customSlot?;private customContentObserver?;private stopLibrarySubscription?;private resourceLease?;private errorAnnouncementSink?; /** Bumped by every load start and by disconnect, and re-checked after every `await`, so a * superseded response can never paint over a newer one. */ private generation;connectedCallback():void;disconnectedCallback():void;protected updated(changed:PropertyValues):void;private onCustomSlotChange; /** * SVG geometry distributed through a shadow-DOM slot does not paint reliably in Chromium when * the slot itself is inside an SVG. Keep the public custom-content slot, but clone its trusted * SVG nodes into the component-owned SVG so path/circle/group content has a real SVG parent. */ private syncCustomNodes;private observeCustomContent;private cloneSvgNode;private accessibleLabel;private hasRemoteSource;private releaseResourceLease;private load;private fail;private errorMessage; /** Applies presentation semantics to the fetched node. The stable wrapper rendered by * `render()` owns the accessible name through every request state. */ private applyRemoteA11y; /** * The custom-content slot is a *sibling* of the SVG, never a child of it. An HTML parser puts * every element inside `` into the SVG namespace, so a server-rendered `` there comes * back as an inert SVG element that assigns nothing and has no `assignedNodes()` at all — the * client-only DOM insertion Lit does is the only reason the nested spelling ever worked. Nothing * is lost by moving it out: slotted geometry never painted through the slot either way (see * `syncCustomNodes`, which clones it into the component-owned SVG), so the slot is purely an * assignment target and `icon.styles.ts` keeps it `display: none`. */ private renderBuiltIn;render():TemplateResult;}declare global{interface HTMLElementTagNameMap{'lr-icon':LyraIcon;}}