import { CommonModule } from '@angular/common';
import * as i0 from '@angular/core';
import { input, signal, effect, computed, ChangeDetectionStrategy, Component } from '@angular/core';

class SdAvatar {
    /**
     * The source string to be used for the avatar.
     * - If it matches a URL pattern, an image is displayed.
     * - If it is a string representing a name, initials and a colored background are generated.
     * - If undefined, it falls back to a neutral ? initial.
     */
    src = input.required(...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
    size = input(32, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
    #imageError = signal(false, ...(ngDevMode ? [{ debugName: "#imageError" }] : /* istanbul ignore next */ []));
    constructor() {
        // Reset image error state whenever src changes
        effect(() => {
            this.src();
            this.#imageError.set(false);
        });
    }
    isUrl = computed(() => {
        // If image has failed to load, treat it as a non-url to fallback to initials using the literal URL text
        if (this.#imageError()) {
            return false;
        }
        const val = this.src() || '';
        const urlPattern = /^(http|https|data:image|\/)/;
        return urlPattern.test(val);
    }, ...(ngDevMode ? [{ debugName: "isUrl" }] : /* istanbul ignore next */ []));
    bgColor = computed(() => {
        if (this.isUrl()) {
            return 'transparent';
        }
        const val = this.src() || '';
        if (!val) {
            return '#bdc3c7';
        }
        return this.#generateColor(val);
    }, ...(ngDevMode ? [{ debugName: "bgColor" }] : /* istanbul ignore next */ []));
    initials = computed(() => {
        if (this.isUrl()) {
            return '';
        }
        const val = this.src() || '';
        if (!val) {
            return '?';
        }
        return this.#getInitials(val);
    }, ...(ngDevMode ? [{ debugName: "initials" }] : /* istanbul ignore next */ []));
    handleError() {
        this.#imageError.set(true);
    }
    #getInitials = (name) => {
        const words = name.trim().split(' ').filter(Boolean);
        if (!words.length)
            return '';
        if (words.length === 1)
            return words[0][0].toUpperCase();
        return (words[0][0] + words[words.length - 1][0]).toUpperCase();
    };
    #generateColor = (name) => {
        const colors = [
            '#1abc9c',
            '#2ecc71',
            '#3498db',
            '#9b59b6',
            '#34495e',
            '#16a085',
            '#27ae60',
            '#2980b9',
            '#8e44ad',
            '#2c3e50',
            '#f1c40f',
            '#e67e22',
            '#e74c3c',
            '#95a5a6',
            '#f39c12',
            '#d35400',
            '#c0392b',
            '#bdc3c7',
            '#7f8c8d',
        ];
        let hash = 0;
        for (let i = 0; i < name.length; i++) {
            hash = name.charCodeAt(i) + ((hash << 5) - hash);
        }
        return colors[Math.abs(hash) % colors.length];
    };
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SdAvatar, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SdAvatar, isStandalone: true, selector: "sd-avatar", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@let _size = size();\n<div class=\"sd-avatar\" [style.width.px]=\"_size\" [style.height.px]=\"_size\" [style.line-height.px]=\"_size\" [style.backgroundColor]=\"bgColor()\">\n  @if (isUrl()) {\n    <img [src]=\"src()\" (error)=\"handleError()\" alt=\"avatar\" />\n  } @else {\n    <span class=\"sd-avatar-text\" [style.fontSize.px]=\"_size / 2.5\">\n      {{ initials() }}\n    </span>\n  }\n</div>\n", styles: [".sd-avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;overflow:hidden;color:#fff;font-weight:500;-webkit-user-select:none;user-select:none;background-size:cover}.sd-avatar img{width:100%;height:100%;object-fit:cover}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SdAvatar, decorators: [{
            type: Component,
            args: [{ selector: 'sd-avatar', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let _size = size();\n<div class=\"sd-avatar\" [style.width.px]=\"_size\" [style.height.px]=\"_size\" [style.line-height.px]=\"_size\" [style.backgroundColor]=\"bgColor()\">\n  @if (isUrl()) {\n    <img [src]=\"src()\" (error)=\"handleError()\" alt=\"avatar\" />\n  } @else {\n    <span class=\"sd-avatar-text\" [style.fontSize.px]=\"_size / 2.5\">\n      {{ initials() }}\n    </span>\n  }\n</div>\n", styles: [".sd-avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;overflow:hidden;color:#fff;font-weight:500;-webkit-user-select:none;user-select:none;background-size:cover}.sd-avatar img{width:100%;height:100%;object-fit:cover}\n"] }]
        }], ctorParameters: () => [], propDecorators: { src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });

/**
 * Generated bundle index. Do not edit.
 */

export { SdAvatar };
//# sourceMappingURL=sdcorejs-angular-components-avatar.mjs.map
