import { LitElement, PropertyValues } from "lit";
export type SkyAvatarFit = "cover" | "contain";
/**
 * @element sky-avatar
 *
 * @summary Avatar that renders image content or fallback slot content with configurable size, radius, outline, and loading state.
 *
 * @status stable
 * @since 1.0.0
 *
 * @documentation https://sky-ui.com/components/avatar
 *
 * @slot - Fallback content (e.g., initials or an icon) rendered when `image` is empty.
 *
 * @property {string} size - Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).
 * @property {string} image - Image URL; fallback slot is shown on load error.
 * @property {SkyAvatarFit} fit - Image fill mode: `cover` (default) or `contain`.
 * @property {string} radius - Border radius token or CSS value.
 * @property {string} color - Token or CSS color applied to fallback slot content.
 * @property {string} alt - Accessible name when image content conveys meaning.
 * @property {string} outline - CSS `outline` value.
 * @property {string} outlineOffset - CSS `outline-offset` value.
 * @property {boolean} loading - Shows loading overlay when true.
 * @property {boolean} disabled - Dims and disables pointer interactions.
 * @property {boolean} interactive - Enables interactive behavior with keyboard/click activation.
 * @property {boolean} shadow - When true, applies solid surface, border ring, and elevation; no backdrop blur.
 * @property {string} preset - Named prop preset from nearest `sky-config-provider`. Default: `""`.
 *
 * @csspart avatar - The avatar container element.
 * @csspart loading-overlay - The loading overlay container (shown when `loading` is true).
 * @csspart spinner - The spinner element shown when loading.
 *
 * @Behavior
 * - Applies image content when available; otherwise renders fallback slot content.
 * - Uses keyed rendering to reset avatar content when image availability changes.
 * - Scales spinner dimensions from resolved avatar size for numeric values.
 * - Respects reduced-motion preference by disabling spinner animation.
 *
 * @example
 * ```html
 * <sky-avatar size="56px" radius="full" color="primary">
 *   JD
 * </sky-avatar>
 * ```
 * ```vue
 * <template>
 *   <sky-avatar size="56px" radius="full" color="primary">
 *     JD
 *   </sky-avatar>
 * </template>
 * ```
 * ```jsx
 * export default function Demo() {
 *   return (
 *     <sky-avatar size="56px" radius="full" color="primary">
 *       JD
 *     </sky-avatar>
 *   );
 * }
 * ```
 */
export declare class SkyAvatar extends LitElement {
    /** Avatar size: preset sm|md|lg or CSS length. @default "50px" */
    size: string;
    /** Image URL. On error, slot is shown. @default "" */
    image: string;
    /** How the image fills the avatar. @default "cover" */
    fit: SkyAvatarFit;
    /** Border radius token or CSS value. @default "md" */
    radius: string;
    /** Accessible name when image is set. @default "" */
    alt: string;
    /** Slot text/icon color token/CSS color. @default "dark" */
    color: string;
    /** Outline string. @default "" */
    outline: string;
    /** Outline offset value. @default "2px" */
    outlineOffset: string;
    /** Loading state. @default false */
    loading: boolean;
    /** Disables the avatar. @default false */
    disabled: boolean;
    /** When true, focusable with focus ring and click. @default false */
    interactive: boolean;
    /**
     * Elevated ring styling (`border`, inset shadow). No backdrop blur on avatar media.
     * `false` (default) keeps the avatar minimal for inline use.
     */
    shadow: boolean;
    /** True when image failed to load; show slot instead. */
    private _imageError;
    /** Named prop preset from nearest `sky-config-provider`. */
    preset: string;
    private _presets;
    static styles: import("lit").CSSResult;
    updated(changed: PropertyValues): void;
    /** Marks image load success and keeps image rendering active. */
    private _onImageLoad;
    /** Marks image load failure and enables fallback slot rendering. */
    private _onImageError;
    /** Re-dispatches click in interactive mode for host-level consumers. */
    private _handleInteractiveClick;
    /** Handles keyboard activation in interactive mode. */
    private _handleInteractiveKeydown;
    /** Derives spinner dimensions from current avatar size. */
    private adjustSpinnerSize;
    render(): import("lit-html").TemplateResult<1>;
}