Referencia API

Aquí tienes el contrato completo de avatar: todo lo que puedes enlazar, escuchar, proyectar y personalizar, reunido en un solo sitio. Enlaza lo que necesites y dale el estilo que quieras — es standalone y reactivo con signals.

Inputs

Ajusta avatar a tu gusto con 20 inputs. Se enlazan como cualquier @Input de Angular.

Nombre	Tipo	Por defecto	Descripción
`size`	`string \| number`	`50`	Tamaño del avatar en píxeles
`name`	`string`	—	Nombre de usuario para generar iniciales cuando fallan las fuentes de imagen
`src`	`string \| SafeUrl`	—	URL de la fuente de imagen personalizada principal para el avatar
`alt`	`string`	—	Texto alternativo para la imagen del avatar, por accesibilidad
`round`	`boolean`	`true`	Indica si el avatar debe ser circular (true) o seguir cornerRadius
`bgColor`	`string`	—	Color de fondo para los avatares de texto. Se genera automáticamente si no se proporciona
`autoColor`	`boolean`	`true`	Cuando es `true` (por defecto) un avatar de iniciales deriva su fondo de un hash del nombre. Ponlo a `false` para tematizarlo con la variable `--hub-avatar-bg-color`; un `bgColor` explícito siempre prevalece.
`fgColor`	`string`	`#FFF`	Color de texto de las iniciales en los avatares de texto
`borderColor`	`string`	—	Color del borde alrededor del avatar
`cornerRadius`	`string \| number`	`0`	Radio de las esquinas cuando round es false
`textSizeRatio`	`number`	`3`	Proporción para calcular el tamaño del texto a partir del tamaño del avatar (size / textSizeRatio)
`initialsSize`	`string \| number`	`0`	Limita el número de iniciales mostradas (0 = sin restricción)
`facebookId`	`string`	—	ID de usuario de Facebook para la foto de perfil (al mejor esfuerzo, pueden aplicarse restricciones de la API)
`githubId`	`string`	—	Nombre de usuario de GitHub para obtener la foto de perfil
`gravatarId`	`string`	—	Email o hash MD5 de Gravatar para obtener la foto de perfil
`value`	`string`	—	Muestra un valor personalizado como avatar (p. ej., "75%", "+5")
`style`	`Partial<CSSStyleDeclaration>`	—	Estilos personalizados para aplicar al elemento raíz del avatar
`referrerpolicy`	`string`	—	Política de referrer para la imagen del avatar (p. ej., "no-referrer")
`badge`	`string \| number \| boolean \| null`	—	Superposición en la esquina: `badge` / `[badge]="true"` → punto; `badge="4k"` → etiqueta; null / ausente → nada.
`badgeColor`	`HubAvatarBadgeColor \| string \| null`	—	Color semántico del badge (primary · secondary · success · danger · warning · info · light · dark) → `--hub-sys-color-*`.

Outputs

Reacciona a lo que hace avatar: 1 eventos a los que enganchar tu lógica.

Nombre	Tipo	Descripción
`clickOnAvatar`	`Source`	Se emite cuando se hace clic en el avatar; devuelve el objeto de la fuente activa actual

Templates

Todavía no hay templates documentados.