import * as _angular_core from '@angular/core';
import { ResolvedCssSize } from 'ngwr/utils';

/**
 * @license
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
 */
/**
 * Corner treatment for `<wr-avatar>`.
 *
 * - `rounded` (default) — soft rounded square (~10% radius).
 * - `square` — hard corners.
 * - `circle` — fully circular (replaces the old `[rounded]` boolean).
 * - `squircle` — iOS-style smooth corners via `corner-shape: squircle`.
 */
type WrAvatarShape = 'rounded' | 'square' | 'circle' | 'squircle';

/**
 * @license
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
 */
/**
 * Avatar size.
 *
 * Supported formats:
 * - `number`     → pixels (e.g. `48` → `48px`)
 * - `${number}`  → pixels as string (e.g. `'48'` → `48px`)
 * - `${number}px` → pixels (e.g. `'48px'` → `48px`)
 * - `${number}rem` → rems (e.g. `'3rem'` → `3 × root font-size`)
 *
 * Percentage values are intentionally not supported — avatars need a
 * deterministic pixel size for the underlying `<img>` width/height.
 */
type WrAvatarSize = number | `${number}` | `${number}px` | `${number}rem`;

/**
 * Image avatar with configurable corner treatment.
 *
 * A spinner is shown while the image loads, then crossfades in.
 *
 * @example
 * ```html
 * <wr-avatar url="/me.png" alt="Roman" size="3rem" shape="circle" />
 * <wr-avatar url="/me.png" alt="Roman" [size]="48" />
 * ```
 *
 * @see https://ngwr.dev/components/avatar
 */
declare class WrAvatar {
    /**
     * Image URL. When unset, only projected content (e.g. initials) renders.
     *
     * @default null
     */
    readonly url: _angular_core.InputSignal<string | null>;
    /**
     * Alt text for the image.
     *
     * @default 'Avatar'
     */
    readonly alt: _angular_core.InputSignal<string>;
    /**
     * Corner treatment. `rounded` (default) is a soft rounded square,
     * `circle` is the classic profile avatar, `squircle` is the iOS look.
     *
     * @default 'rounded'
     */
    readonly shape: _angular_core.InputSignal<WrAvatarShape>;
    /**
     * Box size. See {@link WrAvatarSize} for accepted values.
     *
     * @default '6rem'
     */
    readonly size: _angular_core.InputSignal<WrAvatarSize>;
    protected readonly loaded: _angular_core.WritableSignal<boolean>;
    protected readonly resolved: _angular_core.Signal<ResolvedCssSize>;
    protected readonly cssSize: _angular_core.Signal<string>;
    protected readonly pxSize: _angular_core.Signal<number | null>;
    protected readonly classes: _angular_core.Signal<string>;
    protected onImageLoad(): void;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrAvatar, never>;
    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrAvatar, "wr-avatar", never, { "url": { "alias": "url"; "required": false; "isSignal": true; }; "alt": { "alias": "alt"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
}

export { WrAvatar };
export type { WrAvatarSize };