@imj_media/ui 1.2.17 → 1.2.18

package/CHANGELOG.md

@@ -5,6 +5,82 @@ Todos los cambios notables de este proyecto serán documentados en este archivo.
 El formato está basado en [Keep a Changelog](https://keepachangelog.com/es-ES/1.0.0/),
 y este proyecto adhiere a [Semantic Versioning](https://semver.org/lang/es/).
 
+## [1.2.18] - 2026-01-13
+
+### Added
+- **Avatar - Componente AvatarStatus**: Nuevo componente para indicadores de estado en avatares
+  - Nuevo componente `AvatarStatus` con soporte para indicadores de color e iconos personalizados
+  - Tipos de status: `'color'` (punto de color) y `'icon'` (icono personalizado)
+  - Colores disponibles: `brand`, `success`, `warning`, `danger`, `disabled`
+  - Tamaños disponibles: `sm`, `md`, `lg` con mapeo automático según el tamaño del avatar
+  - Integración de status en todos los tipos de avatar: `IconAvatar`, `LetterAvatar`, y `PeopleAvatar`
+  - Nueva prop `status` en `BaseAvatarProps` que acepta `AvatarStatusProps`
+  - Mapeo automático de tamaño de avatar a tamaño de status (xxs/xs/sm → sm, md/lg → md, xl → lg)
+  - Nueva story `AvatarConStatus` que demuestra el uso del status con diferentes configuraciones
+  - Exportación de tipos: `AvatarStatusProps`, `AvatarStatusType`, `AvatarStatusColor`, `AvatarStatusSize`
+- **Alert - Soporte para Avatar**: Nueva funcionalidad para mostrar avatar en lugar del icono por defecto
+  - Nueva prop `avatar` en `IAlert` que acepta una URL de imagen para mostrar como avatar
+  - `AlertHeader` ahora muestra un `Avatar` con `type="people"` cuando se proporciona la prop `avatar`
+  - El avatar se muestra con tamaño `xs` y se posiciona correctamente en el layout del header
+  - Si no se proporciona `avatar`, se muestra el icono por defecto según el color del alert
+  - Actualización de tipos `AlertHeaderProps` para incluir la prop `avatar`
+  - Mejora en el layout del header para acomodar tanto avatar como icono de manera consistente
+- **Message - Sistema de Notificaciones con Agrupación**: Nuevo sistema completo de notificaciones agrupadas
+  - Nuevo servicio `NotificationService` que agrupa notificaciones por color (`brand` | `neutral`)
+  - Solo se muestra una notificación por grupo con un contador que indica cuántas hay acumuladas
+  - Timer compartido que se reinicia automáticamente con cada nueva notificación del mismo tipo
+  - Nuevo componente `NotificationItem` para renderizar notificaciones agrupadas
+  - Nuevo componente `NotificationPositions` para posicionamiento de notificaciones
+  - Hook `useNotification` para suscribirse a cambios de notificaciones y obtener grupos activos
+  - API unificada `notify` que combina funcionalidad de toast y notification
+  - Componentes `Notifier` (solo notificaciones) y `Messaging` (toasts + notificaciones) para renderizado
+  - Contador de mensajes que solo aparece cuando hay más de 1 notificación acumulada
+  - Soporte completo para avatar en notificaciones (igual que en Alert)
+  - Soporte para botones de acción (primario y secundario) en notificaciones
+  - Stories completas que demuestran el comportamiento de agrupación, contador, timer, y comparación con toasts
+  - Actualización de tipos para `NotificationGroup`, `NotificationConfig`, `NotificationColor`, etc.
+  - Métodos `notify.brand()` y `notify.neutral()` para mostrar notificaciones
+  - Método `notification.dismissGroup(color)` para cerrar todas las notificaciones de un tipo
+  - Configuración global con `notify.configure()` para duración, posición, tamaño, etc.
+
+### Changed
+- **IconFont - Ajuste menor**: Corrección menor en el componente IconFont
+- **Button - Nuevos colores ghost y soft**: Agregados dos nuevos colores de botón con estilos completos
+  - Color `ghost`: Botón sin fondo, solo cambios de color de texto en estados hover y active
+  - Color `soft`: Botón con fondo blanco (`ui-bg-fill`), texto secondary, con estados hover y active completos
+  - Soporte completo para ambos colores en todas las variantes (solid, icon, emoji)
+  - Colores de iconos ajustados: `brand` para ghost, `default` para soft, `current` para link
+  - Nueva story `Colors` que demuestra todos los colores disponibles
+  - Actualización de tipos `ButtonColors` para incluir `'ghost'` y `'soft'`
+  - Agregados colores de borde tertiary en tailwind.config.js para soportar estados pressed
+- **Button - Mejoras en estilos**: Ajustes en estilos de botones existentes
+  - Botón `tertiary`: Ahora incluye hover con borde (`hover:ui-border-default`)
+  - Botón `primary`: Corrección en borde para forzar estilo con `!ui-border-brand`
+  - Estilos de botón `soft` ahora funcionan correctamente incluso cuando `clickable=false`
+- **Switch - Refactorización y mejoras visuales**: Mejoras en el componente Switch
+  - Cambio de `InnerButton` a `Button` para mejor consistencia con el resto de componentes
+  - Uso de color `soft` cuando la opción está seleccionada (fondo blanco visible)
+  - Uso de color `tertiary` cuando la opción no está seleccionada (fondo transparente)
+  - Agregada prop `active` para indicar visualmente el estado seleccionado
+  - Simplificación del código eliminando props innecesarias (theme, borderable, showShadow)
+
+### Fixed
+- **Alert - Soporte completo para color 'brand'**: Agregado soporte completo para el color `brand` en `useAlertStyles`
+  - Agregado `brand` a `typeClasses` con estilos para todas las variantes (contained, outlined, accent, minimal)
+  - Agregado `brand` a `colorMap` en `getProgressBarColor` con color `ui-bg-brand`
+  - Agregado `brand` a `iconMap` en `getIconForType` usando `faCircleInfo` como icono por defecto
+- **Types - Corrección de nombre de tipo**: Corregido nombre de tipo `AlertAnimation` a `AnimationAlert` en imports y referencias
+  - Actualizado import en `message.ts` para usar el nombre correcto `AnimationAlert`
+  - Actualizadas todas las referencias de `AlertAnimation` a `AnimationAlert` en `BaseMessageProps` y `BaseMessageOptions`
+- **Toast - Corrección de nombre de propiedad**: Corregido nombre de propiedad `maxToasts` a `maxMessages` para consistencia con tipos
+  - Actualizado `toast.config.ts` para usar `maxMessages` en lugar de `maxToasts`
+  - Actualizado `useToast.ts` para usar `toastConfig.maxMessages`
+  - Actualizado `toast.stories.tsx` para usar `maxMessages` en ejemplos
+- **Notification - Corrección de compatibilidad de tipos**: Corregida incompatibilidad entre `NotificationSize` y `SizeAlert`
+  - Agregado mapeo de `'lg'` a `'md'` cuando `NotificationSize` es `'lg'` para compatibilidad con `SizeAlert`
+  - Agregado import de `SizeAlert` en `NotificationService.ts`
+  - Aplicado cast de tipo para asegurar compatibilidad con `NotificationProps.size`
+
 ## [1.2.17] - 2026-01-08
 
 ### Added