@imj_media/ui 1.2.33 → 1.2.35

package/CHANGELOG.md

@@ -5,6 +5,76 @@ 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.35] - 2026-02-04
+
+### Added
+- **InnerButton - HoverText con Gestión Inteligente de Ancho**: Nueva funcionalidad para cambiar el texto al hacer hover con gestión automática del ancho
+  - Nueva prop `hoverText` que permite mostrar un texto diferente al hacer hover sobre el botón
+  - Solo funciona cuando el badge termina de cargar (`badgeLoading` cambia de `true` a `false`)
+  - El componente mantiene un estado interno que rastrea el tamaño máximo de los textos (children y hoverText)
+  - El ancho del botón se ajusta automáticamente al texto más largo y nunca se reduce una vez establecido
+  - Si el texto inicial tiene 5 caracteres y el hoverText tiene 7, el botón se ajusta a 7 caracteres
+  - Si el texto inicial tiene 7 caracteres y el hoverText tiene 5, el botón mantiene 7 caracteres
+  - El cambio de texto ocurre al hacer hover sobre el botón
+  - Optimizado con memoización para evitar re-renders innecesarios
+  - El recálculo del ancho solo ocurre cuando: `children` cambia, `hoverText` cambia, o `badgeLoading` se activa
+  - Funciona con todos los tamaños de botón (xs, sm, md, lg) y con iconos
+  - Nuevas stories en Storybook:
+    - `HoverTextShortInitial`: Texto inicial corto → hoverText largo
+    - `HoverTextLongInitial`: Texto inicial largo → hoverText corto
+    - `HoverTextDifferentSizes`: Diferentes tamaños de botón
+    - `HoverTextWithoutLoading`: Demuestra que no funciona sin badgeLoading
+    - `HoverTextMultipleScenarios`: Múltiples escenarios en una sola historia
+    - `HoverTextWithIcons`: Funcionalidad con diferentes tipos de iconos (string, Font Awesome, duotone, slots)
+
+### Changed
+- **InnerButton - Optimizaciones de Rendimiento**: Mejoras en el rendimiento del componente
+  - Funciones `handleMouseEnter` y `handleMouseLeave` memoizadas con `useCallback`
+  - Valores calculados memoizados con `useMemo` (`displayText`, `childrenText`, `hoverTextValue`, `textStyle`)
+  - Optimización del `useEffect` de medición para evitar loops infinitos
+  - Uso de función de actualización en `setMaxTextWidth` para evitar dependencias innecesarias
+  - Reducción significativa de re-renders innecesarios
+
+## [1.2.34] - 2026-02-04
+
+### Added
+- **Drawer - Compound Components para Footer**: El componente Drawer ahora soporta footer personalizado usando compound components
+  - Nuevo subcomponente `Drawer.Footer` que puede ser pasado como hijo del componente
+  - Función `extractFooterFromChildren` que detecta automáticamente el footer personalizado dentro de los children
+  - Si no se proporciona `Drawer.Footer`, se mantiene el comportamiento por defecto con botones Cancelar/Guardar
+  - Nueva story `CustomFooter` que demuestra el uso de compound components para footer personalizado
+- **CardsWithAside - Tooltips Configurables**: Sistema completo de tooltips para las opciones de tabs
+  - Nueva prop `showTooltips` (por defecto: `true`) para habilitar/deshabilitar tooltips globalmente
+  - Nueva prop `tooltipPosition` (por defecto: `'right'`) para establecer la posición global de los tooltips
+  - Cada tab individual puede sobrescribir la posición del tooltip con su propia prop `tooltipPosition`
+  - Tooltips aplicados tanto a los botones de tabs como al botón de "más opciones"
+  - Nuevas stories: `WithTooltips`, `TooltipPositionGlobal`, `TooltipPositionIndividual`, `ShowHideTooltips`
+- **Badge - Spinner de Carga**: Nuevo sistema de spinner de carga dentro del badge
+  - Nueva prop `loading` en el componente Badge para mostrar un spinner de carga
+  - Spinner adaptativo que se ajusta proporcionalmente a todos los tamaños de badge (`dot`, `sm`, `md`, `lg`)
+  - Tamaños del spinner: 32px para `dot`, 40px para `sm` y `md`, 48px para `lg`
+  - Badges `sm`, `md` y `lg` tienen tamaño fijo y circular cuando están en modo loading
+  - Spinner con borde delgado (`ui-border`) para mejor apariencia visual
+  - Nueva prop `badgeLoading` en `InnerButton` para pasar el estado de carga al badge
+  - Nueva story `BadgeWithLoading` en InnerButton que demuestra el spinner en diferentes configuraciones
+
+### Changed
+- **Drawer - API de Footer**: Cambio de prop `footer` a compound component `Drawer.Footer`
+  - La prop `footer` ha sido removida en favor de usar `Drawer.Footer` como hijo
+  - Mejora la flexibilidad y expresividad de la API del componente
+  - Mantiene compatibilidad con el comportamiento por defecto cuando no se usa footer personalizado
+
+### Fixed
+- **CardsWithAside - Icono "More Options"**: Corrección del icono que no aparecía en el componente Popup
+  - Cambio de `label || ''` a `label || null` en el componente Popup para que el icono se muestre correctamente
+  - El componente `InnerButton` solo renderiza el icono cuando `children` es `null` o `false`
+- **Tooltip - Z-index CSS**: Corrección del valor de z-index en variables CSS
+  - Cambio de `--ui-z-max: 99999px` a `--ui-z-max: 99999` (z-index no debe tener unidades)
+  - Resuelve problema de tooltips no visibles debido a z-index incorrecto
+- **Tooltip - Exportación de Tipos**: Agregada exportación de tipos `TooltipPosition` y `TooltipAlignment`
+  - Los tipos ahora están disponibles para importación desde `@/shared/types/tooltip`
+  - Resuelve error de TypeScript: "Module declares 'TooltipPosition' locally, but it is not exported"
+
 ## [1.2.33] - 2026-02-04
 
 ### Added