@imj_media/ui 1.2.22 → 1.2.24

package/CHANGELOG.md

@@ -5,7 +5,48 @@ 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.21] - 2026-01-XX
+## [1.2.24] - 2026-01-XX
+
+### Added
+- **Toolbar - Nuevo Componente**: Nuevo módulo Toolbar como barra de herramientas flexible
+  - Posicionamiento fijo en la parte inferior de la pantalla usando portal
+  - Soporte para botones configurables con `color`, `icon`, `label`, `onClick`, `disabled`, `show`
+  - Cada botón puede tener sus propios addons (inputs o date pickers)
+  - Vista de botones y vista de addons con navegación entre ellas
+  - Props `text` y `count` para mostrar "(count) text" en la vista de addons
+  - Botón de cerrar para ocultar el toolbar
+  - Diseño responsivo con adaptación móvil
+  - Stories completas en Storybook
+- **Modal.Image - Mejoras en Modo Zoom**: Mejoras en la visualización de imagen expandida
+  - Mantiene el aspect ratio original de la imagen en modo zoom
+  - Contenedor con borde y padding según diseño de Figma
+  - Botón de minimizar posicionado dentro de la imagen
+  - Cálculo dinámico de dimensiones respetando el espacio disponible
+
+### Changed
+- **DatePicker - Manejo de Confirmación**: Mejoras en el comportamiento de selección de fechas
+  - El evento `onChange` solo se invoca cuando se hace clic en "Aceptar"
+  - Nuevos props `onAccept` y `onCancel` para manejo explícito de confirmación
+
+## [1.2.23] - 2026-01-XX
+
+### Added
+- **Switch - Soporte para Iconos Font Awesome Duotone**: El componente Switch ahora soporta iconos Font Awesome Duotone con colores personalizados
+  - Nuevas props en `SwitchOption` para configurar iconos duotone:
+    - `leftSlotDuotonePrimary`, `leftSlotDuotoneSecondary`: Colores primario y secundario para el slot izquierdo
+    - `leftSlotDuotoneOpacityPrimary`, `leftSlotDuotoneOpacitySecondary`: Opacidades para el slot izquierdo
+    - `rightSlotDuotonePrimary`, `rightSlotDuotoneSecondary`: Colores primario y secundario para el slot derecho
+    - `rightSlotDuotoneOpacityPrimary`, `rightSlotDuotoneOpacitySecondary`: Opacidades para el slot derecho
+  - El componente Switch ahora pasa todas las props de duotone al componente Button interno
+  - Permite usar tanto iconos normales (string) como iconos Font Awesome Duotone (objetos de icono) en los slots
+  - Nuevas historias de Storybook agregadas:
+    - `WithDuotoneIcons`: Demuestra iconos duotone en el slot izquierdo con diferentes combinaciones de colores
+    - `WithDuotoneBothSlots`: Muestra iconos duotone en ambos slots con colores independientes
+    - `WithNormalAndDuotoneIcons`: Combina iconos normales y duotone en diferentes opciones del mismo switch
+    - `WithSlotLeft`, `WithSlotRight`, `WithBothSlots`, `WithoutSlots`, `MixedSlots`: Historias adicionales que muestran diferentes combinaciones de slots
+  - Compatible con iconos importados desde `@fortawesome/pro-duotone-svg-icons`
+
+## [1.2.22] - 2026-01-XX
 
 ### Added
 - **Title - Soporte para Children**: El componente Title ahora puede recibir el contenido tanto mediante la prop `title` como mediante `children`
@@ -17,25 +58,6 @@ y este proyecto adhiere a [Semantic Versioning](https://semver.org/lang/es/).
   - Actualizada la historia `Default` para mostrar ejemplos con ambas formas de uso
   - Actualizados `argTypes` en Storybook para incluir control de `children`
   - Actualizada la documentación del componente para mencionar soporte de `children`
-
-### Fixed
-- **Dropdown - Comparación Flexible de Valores**: Corregido el problema donde las opciones por defecto no se mostraban correctamente cuando se pasaba un valor inicial
-  - Problema: Cuando se pasaba un valor numérico (ej: `2`) pero las opciones tenían valores string (ej: `'2'`), la comparación estricta (`===`) fallaba y no se encontraba la opción seleccionada
-  - Solución: Implementada función `compareValues` que realiza comparación flexible entre strings y números
-    - Compara valores de tres formas: comparación estricta, comparación como strings, y comparación como números
-    - Permite que valores numéricos coincidan con strings equivalentes y viceversa
-  - Cambios realizados:
-    - Agregada función `compareValues` en `useDropdown.ts` para comparación flexible
-    - Actualizada lógica de `selectedOptions` para usar comparación flexible
-    - Actualizada lógica de `filteredOptions` para usar comparación flexible
-    - Agregada función `compareValues` en `Dropdown.tsx` con `useCallback`
-    - Actualizada comparación en `renderDropdown` para determinar si una opción está seleccionada
-    - Actualizada comparación en `useEffect` que busca la opción seleccionada para establecer iconos
-  - Ahora el dropdown muestra correctamente la opción seleccionada independientemente de si el valor es número o string
-
-## [1.2.20] - 2026-01-XX
-
-### Added
 - **Title - Prop `center` para Alineación Centrada**: Nueva prop `center` que permite centrar horizontalmente el contenido del título
   - Nueva prop `center?: boolean` en `TitleProps` para controlar la alineación del contenido
   - Cuando `center` es `true`, se aplica `ui-justify-center` al contenedor flex
@@ -52,8 +74,23 @@ y este proyecto adhiere a [Semantic Versioning](https://semver.org/lang/es/).
   - Nueva historia `RealWorldExamples` que muestra casos de uso prácticos (Dashboard, Gestión de Archivos, Calendario, etc.)
   - Todas las historias incluyen descripciones, ejemplos visuales y código de ejemplo usando `StoryBox`
   - Documentación completa con `tags: ['autodocs']` para generación automática de documentación
+- **Switch - Props slotLeft y slotRight**: Nuevas props para mayor flexibilidad en el Switch
+- **SelectionCheckbox - Prop round**: Nueva prop para estilo redondeado en checkboxes de selección
 
 ### Fixed
+- **Dropdown - Comparación Flexible de Valores**: Corregido el problema donde las opciones por defecto no se mostraban correctamente cuando se pasaba un valor inicial
+  - Problema: Cuando se pasaba un valor numérico (ej: `2`) pero las opciones tenían valores string (ej: `'2'`), la comparación estricta (`===`) fallaba y no se encontraba la opción seleccionada
+  - Solución: Implementada función `compareValues` que realiza comparación flexible entre strings y números
+    - Compara valores de tres formas: comparación estricta, comparación como strings, y comparación como números
+    - Permite que valores numéricos coincidan con strings equivalentes y viceversa
+  - Cambios realizados:
+    - Agregada función `compareValues` en `useDropdown.ts` para comparación flexible
+    - Actualizada lógica de `selectedOptions` para usar comparación flexible
+    - Actualizada lógica de `filteredOptions` para usar comparación flexible
+    - Agregada función `compareValues` en `Dropdown.tsx` con `useCallback`
+    - Actualizada comparación en `renderDropdown` para determinar si una opción está seleccionada
+    - Actualizada comparación en `useEffect` que busca la opción seleccionada para establecer iconos
+  - Ahora el dropdown muestra correctamente la opción seleccionada independientemente de si el valor es número o string
 - **Title - Corrección de Clases de Tipografía**: Corrección del uso de clases de tipografía para headings
   - Reemplazada la clase compuesta `ui-leading-tracking-h3` (que no funcionaba correctamente) por clases individuales de Tailwind
   - Ahora usa `ui-leading-heading-h3` y `ui-tracking-heading-h3` que están correctamente definidas en la configuración de Tailwind