# Changelog

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/).

## [Unreleased]

## [1.8.2] - 2026-04-30

### Added

- **CatalogCard:** familia **`user`** (`family="user"`): mismo layout que proveedor (~270px), **sin** rating; **`profile.avatarImageSrc`** / **`avatarImageSrc`** (y `avatarImageAlt` opcional) para foto en el avatar en lugar de iniciales. **`CatalogCardInteractionContext.family`** admite **`'user'`**. Historias **UsuarioFamiliaConFoto** y **UsuarioFamiliaSoloIniciales**.

### Fixed

- **`useClickOutside`:** si el nodo anclado aún no está montado (`ref` nulo), no se considera clic “fuera” (evita cerrar al abrir en el mismo gesto).

## [1.8.1] - 2026-04-30

### Changed

- Peer **`@imj_media/orbit-tokens`**: **`^1.2.0`** (tema oscuro en CSS). Estilos compartidos: **`body`** usa **`background-color: var(--ui-color-bg-canvas-default)`** y **`color: var(--ui-color-text-primary)`** cuando la app importa tokens + capas de tema y **`data-theme`**.

### Added

- Re-export desde **`@imj_media/orbit-tokens`**: **`THEME_LIGHT`**, **`THEME_DARK`**, **`themeNames`**, tipo **`ThemeName`** (uso con **`data-theme`**).

### Fixed

- **TypeScript:** retorno explícito **`React.CSSProperties`** en **`createMarkerStylesWithLeftOffset`** (timeline / markers) para evitar **TS2742** en **`validate:publish`**.

## [1.8.0] - 2026-04-28

### Changed

- **Orbit CSS:** `dist/index.css` ya **no** incluye `@imj_media/orbit-tokens/css/tokens.css`. Las apps deben importar **`@imj_media/orbit-tokens/css/tokens.css` antes de `@imj_media/ui/index.css`** (peer **`@imj_media/orbit-tokens`**). Storybook carga tokens en **`.storybook/preview.ts`**.

## [1.7.6] - 2026-04-27

### Added

- **Modal.Image:** prop opcional **`expandedSrc`**. Con **`thumbnailMode`**, la miniatura sigue usando **`src`**; al expandir se usa **`expandedSrc`** si está definida, o **`src`** (comportamiento por defecto). Historia **ThumbnailYExpandedDiferente**.

### Fixed

- **Dropdown:** ancho del panel de lista acotado al trigger (`maxWidth`, `box-sizing`); **`popover.fullWidth`** por defecto **`true`** (campo a ancho completo) o **`false`** para trigger **`ui-w-fit`** en línea; portal y pie con **`ui-min-w-0`**; **TagsMultiple** alineado con **`fullWidth`**. Tipos y stories (Dropdown, Text).

## [1.7.5] - 2026-04-24

### Fixed

- **CardCatalog** (DEV-846): row tags tooltip truncation in **`catalogCardTagsRow`**; Storybook **CatalogCard** stories updated.

## [1.7.4] - 2026-04-24

### Changed

- **Tailwind:** `tailwind.config.js` now uses **`presets: [@imj_media/orbit-tokens/tailwind/preset]`**; all former `theme.extend` token mappings live in **`@imj_media/orbit-tokens`** (same generated utilities with prefix `ui-`). Local config keeps **`content`**, **`prefix`**, **`safelist`**, and **typography `plugins`** only. Dependency **`@imj_media/orbit-tokens`** raised to **^1.1.0**. See **`DEVELOPMENT_GUIDE.md`** (*Orbit — Tailwind preset*) and **`packages/orbit-tokens/README.md`**.

## [1.7.3] - 2026-04-23

### Added

- **Input**: prop **`minWidthEnabled`** (por defecto `true`). Con **`fullWidth={false}`**, permite desactivar el ancho mínimo del control (`ui-min-w-72`) en huecos estrechos. Historia Storybook **AnchoMinimoConfigurable**.

## [1.7.2] - 2026-04-23

### Changed

- **Tipografía / tokens:** `fontFamily.sans`, `ui-text` y `ui-rounded` en Tailwind usan solo `var(--ui-font-family-ui)` (misma fuente que los tokens de orbit). **`index.css` (Storybook / estilos compartidos):** `body` usa `var(--ui-font-family-ui)` para alinearse con `@imj_media/orbit-tokens`. Las apps consumidoras pueden fijar **`--app-font-family`** en `:root` (ver `@imj_media/orbit-tokens` ≥ 1.0.1) para su fuente de producto; si no, se mantiene **Inter** como hasta ahora.
- **Dependencia:** `@imj_media/orbit-tokens` ^1.0.1 (variable `--app-font-family` en tokens).

## [1.7.1] - 2026-04-23

### Fixed

- **Tooltip**: posicionamiento de la flecha en tooltips alineados al borde (edge-aligned).

## [1.7.0] - 2026-04-22

### Added

- **Card**: prop **`bordered`** (default `true`). Con **`false`**, sin borde de tarjeta; en **`onClick`**, sin **`hover:ui-border-brand`**; con **`active`** y sin borde, solo anillo de foco.
- **Drawer**: prop **`surface`** (`default` | `brand`), fondo brand (**`ui-bg-fill-brand-default`**), título **`ui-text-on-color`**, sin borde bajo el header ni **`Card.Separator`** antes del footer; **`Card` interna** con **`bordered={false}`** en **`brand`**.
- **Drawer**: tamaño **`xl`** (anchura 800px).

## [1.6.18] - 2026-04-22

### Added

- **Icons**: módulo `implementacionCampaniaMedios` — reexportación de iconos outline para tarjetas de medios (implementación campaña), expuesto en el entry principal del paquete.

## [1.6.17] - 2026-04-22

### Changed

- **Dropdown** (DEV-830): en lista **user**, **`list.userHideAvatars`** y por opción **`hideAvatar`** / **`showAvatar`** para ocultar la columna de imagen o mostrarla solo en filas concretas.
- **Dropdown** (DEV-830): en selección múltiple (**TagsMultiple**), el bloque **`slots`** acepta **`leftSlot`** y **`leftSlotClassName`** en el campo de tags, alineado con el trigger del **Input**.

## [1.6.16] - 2026-04-20

### Changed

- **Release (npm):** publicación de esta línea en el registro; el intento de subir **1.6.15** falló porque esa versión ya existía en npm (no se puede republicar el mismo número). El contenido de paquete sigue la línea documentada en **1.6.15**.

## [1.6.15] - 2026-04-20

### Fixed

- **Table** (`useTableColumns`): al fusionar con `initialColumns`, la igualdad estructural ya tiene en cuenta la **identidad** de `render` y `accessor` (p. ej. columna de acciones según estado externo). Antes se reutilizaba el estado previo si solo cambiaba la función, y las celdas podían quedar con closures obsoletos hasta recargar.

### Changed

- **RangeBar** / **RangeSelector**: API con **configuración agrupada** — en la pista, intervalo y comportamiento van en `range`, `events`, `appearance` y `accessibility`; en el organismo, textos y formato en `labels` (p. ej. `title` sustituye a `label` en raíz), `formatting` y `appearance.compact`. Tipos exportados para cada bloque: `RangeBarRangeProps`, `RangeBarEventsProps`, `RangeBarAppearanceProps`, `RangeBarAccessibilityProps`, `RangeSelectorLabelsProps`, `RangeSelectorFormattingProps`, `RangeSelectorAppearanceProps`. Quien integraba props planas debe **remapear** a estos objetos (detalle en JSDoc de cada componente).

## [1.6.14] - 2026-04-17

### Added

- **CardsGenericas**: componente con pestañas personalizables y estilos.
- **Modal** / **Drawer**: tooltip opcional en el botón de cerrar (DEV-806).
- **Table**: icono de estado en la celda de tipo **status** (DEV-808); actualización de la celda de tipo status (DEV-809).

### Changed

- **Dropdown**: acepta valor por defecto (DEV-805).
- **RangeBar**: espaciados cuando **`compact`** es `true` (DEV-807).
- **ModalHeader** / **Drawer**: posicionamiento y manejo del tooltip del botón de cerrar.

## [1.6.13] - 2026-04-16

### Added

- **Table**: tipo de celda **`imagePreview`** (`ImagePreviewCell`): miniatura 16:9, contenedor `rounded-control-xs` (imágenes sin radio), borde brand al hover, altura máx. `calc(100% - 16px)` en la celda; misma imagen a 300×300 en `Popup` al hover (`hoverAnchorFollowPointer`), alternativa al lightbox de `IconCell` al clic. Valor: **`ImagePreviewCellValue`** (`src`, `title?`, `alt?`).
- **Popup**: prop **`openOnHoverAllowPanelPointer`** (por defecto `true`). Si es `false`, al salir del trigger el popup se cierra aunque el puntero pase al panel (sin “puente” hover). `ImagePreviewCell` la usa en `false` para que la vista ampliada no quede fija al mover el ratón al panel.

### Changed

- **DatePicker**: prop **`disabled`** (`false` por defecto): impide abrir el calendario, cierra el portal si pasa a deshabilitado y reenvía **`disabled`** al **Input** interno.
- **Input**: ajustes en **`useInputStyles`**.
- **Popup**: posicionamiento (**`popupPosition`**), triggers externos y refinamiento del hover; tipos en **`@/shared/types/popup`**; tests y stories.
- **Table**: **`FilterCard`**, **`FilterPopup`** y tests asociados; tipos en **`@/shared/types/table`**; stories de **Table**.

## [1.6.12] - 2026-04-16

### Added

- **CatalogSupplierCard** (catálogo): estado **disabled**; tooltips por defecto en **Más opciones**, **Estatus** y **Evaluación** (DEV-799).

### Changed

- **Badge**: ajuste visual del componente (DEV-800).

### Fixed

- **CatalogSupplierCard** (catálogo): bordes en badges **gray**; hover en la cabecera de la card (DEV-799).

## [1.6.11] - 2026-04-15

### Added

- **Ghantt**: organismo basado en **Table** con **una columna extra** `type: 'gantt'`; configuración agrupada en **`gantt`** (`column`, `data`, `timeline`, `appearance`, `events`). Tipos de valor de fila **`GhanttRowValue`** / **`GhanttBarSegment`** y **`GhanttBarColorToken`** en `@/shared/types/table`. Contexto y utilidades en **`@/shared/ghantt`** (`GhanttTimelineHeader` con **dos pisos** mes/año + slots, `ghanttBuildUpperFloorSegments`, `GhanttSlotStrip`, …). Cabecera Gantt a **ancho completo** en `HeaderCell` (sin fila de ordenar/filtrar). Celdas con menos bordes horizontales (sin marco alrededor de la pista ni borde en barras). `lockable` por defecto **false** en la columna sintética. Vista **día**: mes anterior calendario completo + hasta fin del mes de `viewEnd`, eje **`dayAxis`** compartido para barras; **scroll horizontal solo dentro de la columna** Gantt (viewport solo en cabecera; filas con `translateX` ligado al mismo `scrollLeft`); **`maxWidth`** por defecto **560px** (`gantt.column.maxWidth`, `timeline.columnMaxWidthPx`). Ancho mínimo por día (`columnWidthPx` o 44px) sobre el contenido desplazable. Cadenas **`YYYY-MM-DD`** en timeline se interpretan como **medianoche local** en `ghanttParseTime`.

### Changed

- **Ghantt**: virtualización de scroll con **`createGhanttScrollVirtualStore`** y **`GhanttScrollVirtualRoot`**; ancho lógico del timeline para zoom con modificador y clamp de **`scrollLeft`** con máximo explícito; **`mergeGhanttColumns`** memoizado.
- **Table**: **`TableRow`** / **`TableBody`** memoizados; anchos de `<th>` medidos en **`TableContent`** (`ResizeObserver`, `columnWidthsRef`) para sticky sin **`document.querySelector`** por celda; variables CSS **`--table-sticky-left-selection`** / **`--table-sticky-left-expand`**; atributos **`data-column-id`** en celdas de selección y expansión.

## [1.6.10] - 2026-04-13

### Added

- **RangeBar** / **RangeSelector**: control de intervalo con dos thumbs (Figma Range Bar), variante de color, paso y dominio; teclado y arrastre; thumbs encimados resueltos por dirección (izquierda → start, derecha → end) y foco; sin cruce de extremos al arrastrar.
- **Storybook** (`RangeBar`): historias por variante, compacto, paso decimal, flujo controlado y ancho completo con `StoryBox`.

### Changed

- **RangeSelector**: cabecera y pie alineados al carril (`RANGE_BAR_TRACK_BLEED_X`); anchos fijos en `ch` y cifras tabulares para valores dinámicos y extremos.
- **Varios módulos** (`packages/ui`): comas finales opcionales en último argumento de `cn()` / llamadas multilínea (formato ESLint).

## [1.6.9] - 2026-04-13

### Changed

- **Picture**: los \`<img>\` renderizados llevan **`draggable={false}`** para evitar arrastrar la imagen fuera del navegador (p. ej. miniaturas en tarjetas).
- **CatalogCard** (catálogo, \`disabled\`): si se pasa \`onClick\`, el gesto en la raíz sigue activo aunque la tarjeta esté bloqueada (sin \`href\`/\`to\`); el resto del comportamiento con \`disabled\` se mantiene (incl. menú **⋯** activo).
- **CatalogCard** (catálogo): bloque media con **`ui-select-none`** en \`Picture\` para evitar selección accidental al interactuar con la tarjeta.

## [1.6.8] - 2026-04-13

### Added

- **Popup** / **Popover**: la prop **`allowOverflow`** (ya tipada) controla el panel: con **`true`** usa **`overflow: visible`** para que descendientes absolutos (p. ej. **`Dropdown`** con **`popover.absolute: true`**) no queden recortados; JSDoc en tipos y **`argTypes`** en Storybook del módulo Popup.

### Changed

- **Dropdown**: padding superior del listado de opciones cuando no hay buscador (**`ui-pt-8`**) para que la primera fila no quede pegada al borde del panel.
- **Table** (**`LogicOperatorSelector`**): **`multi.showTriggerClearButton: false`** para ocultar la X de limpiar en el operador lógico AND/OR.

### Fixed

- **Storybook** (**Dropdown**): historia **`PortalVsAbsoluteInPopover`** con **`Popover`** y ambos modos de menú; documentación del uso de **`allowOverflow`**.

## [1.6.7] - 2026-04-13

### Added

- **CatalogCard** (catálogo): props **`optionsTooltip`** y **`ratingTooltip`** (en **`optionsMenu`** / **`content`** o planas deprecadas); por defecto *Más opciones* y *Calificación del medio*; cadena vacía desactiva el tooltip. Tooltips en el control **⋯** y en el bloque estrella + valor.
- **Tailwind** (`packages/ui`): util de sombra **`01-03`** (hover de tarjeta catálogo: sombra base **01** + **03**); **`boxShadow.03`** alineado a tokens Figma/orbit con fallbacks documentados.

### Changed

- **CatalogCard**: hover de la tarjeta usa **`hover:ui-shadow-01-03`** en lugar de solo **`hover:ui-shadow-03`**.
- **Storybook**: historia **CatalogoTooltipsOpcionesYRating** y tablas de props en **CatalogCard** actualizadas.

## [1.6.6] - 2026-04-10

### Added

- **Modal**: prop **`tabsConfig`** (opciones, **`defaultValueTab`**, **`onChangeTab`**, overrides del **Switch** de pestañas vía **`switch`**) con avisos de deprecación hacia la forma agrupada; tipos **`ModalTabsSwitchProps`** y contexto alineado.
- **Switch**: **`slotIconSize`** y **`leftSlotIconSize`** / **`rightSlotIconSize`** por opción; paddings del track por tamaño del control y tipografía del label en **`md`** (cuerpo SM).
- **InnerButton** / **ButtonSlots**: **`iconFontSize`** opcional en slots izquierdo y derecho cuando hay texto (pasa a **Visual**).

### Changed

- **Modal** / **ModalHeader**: cabecera con pestañas usa **`tabsSwitchProps`** del contexto; historias ampliadas en Storybook.
- **Switch**: tamaño efectivo del control con **`size ?? 'sm'`**; mapeo de tamaño de botón interno y defaults de icono por **`size`**.
- **Tipos** (`modal`, `switch`, `buttonConfig`, `visual`) y **Tailwind** (safelist / util **`ui-tracking-body-xs-bold`**) en línea con lo anterior.

## [1.6.5] - 2026-04-10

### Added

- **`IconFontColor`**: valor **`primary`** (texto primario del tema) en tipos compartidos; **IconFont** y **LegacyIcon** mapean color, fondo y clases Tailwind para iconos sólidos/regular alineados al cuerpo.

### Changed

- **Switch**: valor por defecto de **`colorIcon`** de **`blue`** a **`primary`**; JSDoc en **`SwitchProps`**.
- **Switch** (Storybook): historias con iconos **duotone** importados desde **`@fortawesome/pro-duotone-svg-icons`**; icono de cierre con **`faXmark`** (Pro Regular) en lugar de `faClose`.

## [1.6.4] - 2026-04-10

### Added

- **CatalogCard**: prop opcional **`primaryCta.primaryIcon`** (`AnyIconDefinition`) para el icono del slot izquierdo del CTA; sustituye el icono asociado a la variante o el del enlace «Ver más». Historia **CatalogoPrimaryCtaIconoPersonalizado** en Storybook.

### Changed

- **Popup**: `usePopup` dividido en hooks y utilidades internas (`usePopupPositioning`, `usePopupCloseEventSubscription`, `usePopupExternalTrigger`, registro global, planificador de cierre por hover); el barrel del módulo reexporta lo necesario.

## [1.6.3] - 2026-04-09

### Changed

- **Picture**: si `src` está vacío o la imagen falla al cargar, el fallback usa el icono Font Awesome **Image** (`@fortawesome/pro-regular-svg-icons`) sobre `ui-bg-fill-tertiary` en lugar del SVG `Placeholder.svg`.
- **Stepper**: ajustes en **StepConnector**, **StepItem** e historias en Storybook.

### Chore

- Reglas Cursor (`monorepo-publish-explicit-package`, `imj-ui-obligations-release`): proponer versiones patch/minor concretas antes de pedir solo el tipo de bump.

## [1.6.2] - 2026-04-09

### Added

- **Table**: prop **`columnsLockable`** y **`lockable`** por **`ColumnConfig`** para controlar si la columna puede fijarse; utilidad **`isColumnLockable`** y tests; historia **TableColumnasNoBloqueables**; ajustes en cabecera, contenido y celdas (**ButtonCell**, **StarsCell**).
- **Filters**: historia en Storybook.
- **Input**, **Modal**, **CatalogCard**: historias y ejemplos ampliados en Storybook.

### Changed

- **Switch** y **Toggle**: implementación y tipos compartidos refinados; historias actualizadas.
- **Dropdown (TagsMultiple)**, **Accordion**: ajustes de comportamiento.
- **CatalogCard**: cambios en organismo, tipos e historias.
- Dependencia **`@bitux/review-layer-react`** → `1.3.3`.
- Documentación interna de componentes (**DOCUMENTACION-COMPONENTES-UI.md**).

## [1.6.1] - 2026-04-07

### Added

- **Table** (`SelectionConfig`): prop **`selectionBarPlacement`** (`'inline'` | `'overlay'`; por defecto `inline`). La barra de selección puede mostrarse en flujo bajo el cuerpo de filas o superpuesta como antes. Historia **TableSelectionBarInline** en Storybook; tests ampliados.

## [1.6.0] - 2026-04-06

### Added

- **FileUploader**: Ajustes de superficie pública y historias en Storybook; exportes de organismos alineados con el módulo.
- **Dropdown** y **Lists**: utilidades y carpetas de historias **API_V2** / helpers de stories donde aplica; refinamiento de contratos de documentación.

### Changed

- **Badge**, **CatalogCard**, **Drawer**, **Filters**, **InnerButton** / **LegacyButton**, **Modal**, **Pagination**, **Popup**, **Table**: mejoras de implementación, props agrupadas o deprecaciones documentadas; celdas y filtros de tabla más coherentes con estados deshabilitados y operadores lógicos.
- **Tipos compartidos** (`badge`, `dropdown`, etc.) y documentación interna del paquete (`DEVELOPMENT_GUIDE`, reglas/skills) actualizadas en línea con los cambios anteriores.

## [1.5.0] - 2026-04-01

### Added

- **CatalogCard**: Indicadores de medios (imagen / video / audio / etc.) y tooltips asociados; utilidades y tipos (`catalogCardMediaIndicatorUtils`, ampliación de tipos de tarjeta y fila de tags). Historias ampliadas en Storybook.
- **Dropdown (selección múltiple / TagsMultiple)**: Mejoras de API y comportamiento; historias en **MultipleSelection**.
- **Tipos compartidos**: Ampliaciones en `dropdown`, `input`, `list`, `modal` para props agrupadas y nuevas opciones.

### Changed

- **CatalogCard**: API con props agrupadas (catálogo: `media`, `content`, `tagRow`, `primaryCta`, `optionsMenu`, `primaryPanel`; proveedor: `profile`, `contact`, `cta`, `optionsMenu`). Las props planas homónimas siguen admitidas (deprecadas en tipos); la fusión ocurre en el organismo. Tipos de bloques exportados; historias y Docs de Storybook alineados.
- **Input**: Props agrupadas y claridad en slots/estilos (`useInputSlots`, `useInputStyles`, `Input`); historias actualizadas.
- **List**, **Modal** (header/body/footer/image y contexto), **Popup** / **PopupStructuredLayout**: Alineación con el patrón de props agrupadas; historias de **Popup** ampliadas.
- **Badge**: API con props agrupadas (`appearance`, `glyph`, `text`, `state`); las planas homónimas siguen admitidas (deprecadas en tipos). Fusión en `mergeGroupedBadgeProps`; tipos de bloques exportados desde `@/shared/types/badge`. Historia **Por defecto** y Docs actualizados.
- Documentación y reglas del monorepo (guías de props, referencias en skills).

## [1.4.0] - 2026-04-01

### Added

- **FileUploader**: Módulo nuevo con organismo **`FileUploader`** (zona de drop, restricciones `accept`/`maxFiles`/`maxSizePerFile`, cola con **`FileUploadListItem`**, iconos por tipo de archivo, utilidades **`inferFileFormat`** y **`matchesAccept`**). API con props agrupadas (`dropZone`, `constraints`, `list`, `events`). Historias en Storybook.
- **CatalogCard / Picture**: Soporte de estado **`disabled`** (tipos y comportamiento en tarjeta de catálogo e imagen); historias actualizadas.
- **Stepper**: Cobertura ampliada en Storybook; ajustes en **`StepIcon`**, **`StepLabel`**, **`StepItem`** y hook **`useStepper`** (incl. tipos compartidos).
- **Switch**: Historias nuevas en Storybook.
- **Tag**: Mejoras de API/tipos y historias en Storybook.

### Changed

- **StoryBox**: Refinamiento de composición y comportamiento.
- **Modal**, **Drawer**, **ProgressBar** (`Container`), **InnerButton**, **Table** (`TableToolbar`): Ajustes menores de implementación o documentación.
- Documentación interna del paquete: guía de props agrupadas en organismos, contrato Storybook y migración (`DEVELOPMENT_GUIDE`, `STORYBOOK_MIGRATION`).

## [1.3.1] - 2026-03-27

### Added

- **InnerButton / Button**: `slotLayout` como `inline` o objeto `{ var: 'spread', textAlign?: 'left' | 'center' | 'right' }`; constante **`BUTTON_SLOT_SPREAD_CENTER`** y guard **`isButtonSlotSpreadLayout`**. La prop raíz **`textAlign`** sigue teniendo prioridad sobre `slotLayout.textAlign`.
- **CatalogCard**: Props **`to`**, **`href`** y **`cardLinkTarget`** (`'_self' | '_blank'`): la zona principal (media + detalle o cabecera + contacto) es un **`<a>`**; el pie con CTA y menú **⋯** queda **fuera** del enlace para HTML válido. Historia **`EnlaceTarjetaToYHref`**.
- **Popup**: **`showPanelBorder`** (default `true`). Con `false`: panel sin `ui-border-default`, sombra **`ui-shadow-xl`** y **`PopupArrow`** en modo **`elevated`** (sin trazo del beak, `drop-shadow` acorde). El disparador reenvía al **`InnerButton`** props completas (`slotLayout`, `iconProps` explícito frente a icon derivado, `badge`, slots, duotone, etc.). **`textAlign`** del `Popup` sin definir: con `slotLayout` spread no se fuerza `center` en el trigger (permite usar `textAlign` del objeto spread). Historia **`PanelBorderToggle`**; historias de disparador spread ampliadas.
- **Modal / PopupStructuredLayout**: Footer `spread` usa internamente **`BUTTON_SLOT_SPREAD_CENTER`**. **`ModalButton.theme`** admite de nuevo **`icon`** (deprecado) por compatibilidad.

### Changed

- **`ButtonTheme`**: Restaurado **`'icon'`** en el tipo (deprecado); documentación actualizada.
- **`LegacyButtonIcon` / `ButtonIcon`**: Clic en el glifo condicionado a `theme === 'icon'` donde aplica.

### Fixed

- **Table — `ActionsCell`**: Se deshabilitan acciones cuando **`row.disabled`** o cuando la entrada tiene **`disabled`**; tests añadidos.

## [1.3.0] - 2026-03-27

### Added

- **InnerButton / tipos botón**: Prop `slotLayout` (`inline` | `spread`) para repartir `leftSlot` / `rightSlot` y el texto (iconos en extremos y texto centrado, o texto al lado opuesto con un solo slot). Tipo exportado `ButtonSlotSpreadSides`. Historias en Storybook **Button**: `FullWidthSlotsBySize`, `SlotLayoutSpreadSingleSlot`.
- **Modal**: Prop `footerSlotLayout` (`inline` | `spread`) en el footer legacy (`cancelButtonSlotLeft` / `successButtonSlotRight`); aplica `slotLayout="spread"` y reparto de ancho en la fila. `ModalButton` incluye `slotLayout`; historia `ModalFooterSlotLayoutSpread`.
- **Popup**: Prop `popoverFooterSlotLayout` para el popover estructurado; historia `StructuredPopoverFooterSlotLayoutSpread`. Export de **`Z_INDEX_TOOLTIP`** (por debajo del panel del popup).
- **Badge**: Prop `hover` (default `true`); con `false`, `pointer-events: none` para que el remarcado lo controle el padre (p. ej. `group-hover`).
- **CatalogCard (catálogo)**: Etiquetas `tags` como `string` o `{ label, color? }` (`CatalogCardTag` / color de `Badge`); util `normalizeCatalogCardTags` y firma de contenido estable para evitar bucles con arrays inline. Bloque media ~**141px** siempre montado con `Picture` (placeholder si falta `imageSrc`). Triggers del menú **⋯** con `pill="pill"`. Nuevas historias: `TagsBadgeColores`, `MenuOpcionesTriggerPill`, `BloqueMediaPicture`, `MediaSinUrlNiRutaValida`.
- **Logo**: Render con **`FillLogoIcon`** (SVG de marca); mapa de tamaños en px (`sm` 24, `md` 32, `lg` 40).

### Changed

- **ButtonTheme**: El tipo público es solo `'solid'`. La apariencia “solo icono” se obtiene con `icon` y sin `children` (ya no se usa el valor deprecado `'icon'` en `theme`). Botones de icono en **LegacyButton** / **ButtonIcon** reenvían el `onClick` sin depender de `theme`.
- **Logo**: Tamaño por defecto **`sm`** (antes `md` en implementación previa).
- **Tooltip / InlineTooltip**: `z-index` alineado a **`Z_INDEX_TOOLTIP`** (deja de usarse `ui-z-max` / valor fijo alto en el overlay).
- **Table — TableSelectionBar**: Acciones del pie usan `theme="solid"` de forma uniforme.

## [1.2.89] - 2026-03-26

### Fixed

- **Modal**: Alineación vertical según altura del panel. Si el contenido cabe en el viewport (con el padding `ui-py-8` del contenedor), el diálogo queda centrado; si supera la altura útil, el contenedor flex usa `items-start` para que el scroll del portal muestre el inicio del contenido (evita el modal “a medias” centrado). `ResizeObserver` + `resize` recalculan al cambiar tamaño del panel o de la ventana; al cerrar se resetea el estado.

## [1.2.88] - 2026-03-26

### Changed

- **CatalogCard — `PrimaryMenuPanel`**: Panel de tags alineado con Figma (Cards `238:14855`): contenedor `p-8`, `gap-8` entre ítems y entre bloques (lista / divisor / *Cerrar*); divisor con `py-4` alrededor del trazo e indentado con el contenido; `List` sin padding duplicado (`padding="none"` con el `p-8` del panel).

### Fixed

- **CatalogCard — CTA *Agregado* con hover (*Quitar* + xmark)**: El grupo icono + texto se centra en el botón (`inline-flex` + `mx-auto`); las capas de texto usan `grid` + `place-items-center` y `w-max` para que “Quitar” no quede alineado a la izquierda dentro de la caja ancha medida por “Agregado n/m”.

## [1.2.87] - 2026-03-26

### Added

- **TruncatedWithTooltip**: Prop `maxVisibleChars` para mostrar como máximo N caracteres + `…` y tooltip con el texto completo (p. ej. ratings); detección de truncado más fiable cuando `ellipsis` no refleja `scrollWidth > clientWidth` en Chromium/WebKit.
- **Popup**: `label` admite `ReactNode` (disparador con JSX, p. ej. hover personalizado); `textAlign` por defecto `center` reenviado al `InnerButton`; contenedor del trigger interno respeta `fullWidth` (`ui-w-full`).
- **Storybook — Badge**: Historias `WithIcons` e `IconOnly` (icono Font Awesome, `iconSlot`, solo icono con `aria-label`).
- **Storybook — CatalogCard**: Historia `TextosLargosSinMenusInternos` (estrés de texto sin picos de memoria); documentación del flujo de tags (sin selección → *Agregar*; con selección → *Agregado n/m*).

### Changed

- **CatalogCard (catálogo)**: Categoría, rating, título y ubicación usan `TruncatedWithTooltip`; rating con tope visual de caracteres + tooltip; panel de tags con checkboxes: sin etiquetas elegidas el CTA muestra *Agregar* (bookmark); con al menos una, *Agregado n/m* y estilo secondary; hover *Quitar* + icono en panel cuando `added`; sincronización de tags controlados por firma de contenido estable para evitar bucles si el padre pasa `tags` inline; badge exclusivo e indicadores de media con posición/tamaños ajustados; refinamiento del CTA del popup (`leftSlot`, `absolute`, centrado).
- **CatalogCard (proveedor)**: Rating con `TruncatedWithTooltip` y límite de caracteres acorde al catálogo.
- **InnerButton / ButtonContent**: Contenedor del texto pasa de `<p>` a `<div>` (HTML válido dentro de `<button>`); soporte de contenido React en el cuerpo del botón; centrado con flex cuando aplica; `textRef` tipado como `HTMLDivElement`.
- **Tipos — PopupProps**: `label?: ReactNode` en `shared/types/popup`.

### Fixed

- **useClickOutside / useClickOutsideWithGlobal**: Los clics cuyo `composedPath` atraviesa un elemento con `[data-review-layer]` (p. ej. pins/overlay de review) ya no cierran Modal, Popup ni Dropdown por error. Misma semántica que `isReviewLayerEvent` en `@bitux/review-layer-react` sin añadir esa dependencia al paquete UI.
- **Tests (Table — ButtonCell)**: Expectativa para `value === undefined` alineada con la implementación (sin botón, coherente con `null`).

## [1.2.86] - 2026-03-26

### Added

- **Text**: Props `truncateLabel`, `truncateTooltip` y `tooltipTitle` para truncado con ellipsis y tooltip al pasar el cursor (misma idea que `Tag` / `Badge`).
- **TruncatedWithTooltip**: Prop opcional `textColor` (tokens del sistema o color CSS) para el texto visible del truncado.
- **Table — TableCell**: Prop opcional `rawValue` (valor del accessor antes de `column.render`) para que `render` reciba el dato crudo; evita doble render con el nodo ya renderizado en la fila (p. ej. `NaN` al formatear números).
- **Storybook (Text)**: Historia «Truncado con tooltip».

### Fixed

- **Table**: Celdas con `column.render` que formatean números ya no muestran `NaN` (se usa `rawValue` desde `CellRenderer`).

## [1.2.84] - 2026-03-25

### Added

- **Table**: Prop `excludedRows` (`excludeKey` + `rows`) para deshabilitar el checkbox de selección cuando el valor de la fila coincide; integración en `useTableSelection` (`isRowSelectable`), `TableRow` / `TableBody` / `TableContent`; utilidad `isRowExcludedFromSelection` y tests; historia `ExcludedRowsSelection`.
- **Table**: `textColor` opcional en `ColumnConfig` (tokens `TextColor` alineados con `<Text color />`); celdas default renderizan `<Text type="body" size="sm" weight="regular" />`; reexport de tipo `TextColor` desde tipos de tabla; historia `cells/01-Default` ampliada.
- **Table — ActionsCell**: Soporte de `label` en acciones (`TableActionConfig`): icono izquierda o derecha (`iconPosition`), `pill` acorde, `colorIcon`.

### Changed

- **Table**: Historia principal aligerada; nuevas historias bajo `stories/cells/`.
- **Storybook**: Ajustes menores en Badges, CatalogCard, Drawer y Toast.

### Fixed

- **Modal**: Con contenido largo y scroll vertical, el portal reinicia `scrollTop` al abrir y el panel deja `ui-my-auto` para alinear el comportamiento del scroll.

## [1.2.83] - 2026-03-27

### Added
- **Popup — Storybook**: Historias con `triggerRef` y `popoverArrow="auto"` por bandas de posición (`ExternalTriggerNativeVsUiButtonArrowAutoInferior`, `ExternalTriggerNativeVsUiButtonArrowAutoSuperior`, `ExternalTriggerNativeVsUiButtonArrowAutoLateralesYBottom`); `PopupOpensModal` (abrir `Modal` desde el panel, `zIndex` alto); `OpenOnHoverCustomDelay` (hover con retardo en ms + mismo flujo de modal que `PopupOpensModal`).
- **Popup — constantes exportadas**: `POPUP_PANEL_Z_INDEX_BASE` (1000) y `Z_INDEX_MODAL_ABOVE_POPUP` (1200) desde `popupPosition` / barrel del módulo `Popup`, para usar `Modal` con `zIndex={Z_INDEX_MODAL_ABOVE_POPUP}` encima del panel del popup sin número mágico.
- **Popup — README**: Sección **«Popup con Modal (clic o hover)»** con guía de props: en **`Modal`**, `zIndex` mayor que el panel del popup (recomendado `Z_INDEX_MODAL_ABOVE_POPUP`); en **`Popup`**, `closeOnClick={false}` si hay botones/enlaces en el panel; `closeOnClickOutside` opcional según UX; con **`openOnHover`** no hace falta prop extra para combinar con modal (el hook respeta `.modal-portal`). Ejemplo de import desde `@imj_media/ui`.

### Fixed
- **Popup / usePopup (hover + modal)**: Con `openOnHover`, el panel ya no se cerraba de forma incorrecta al abrir un `Modal` desde el contenido: `scheduleHoverClose` no aplica cierre por hover mientras exista un nodo `.modal-portal` en el documento; antes del cierre se usa doble `requestAnimationFrame` para dar margen al montaje del modal.
- **Modal + capas**: La raíz del portal del `Modal` expone la clase `modal-portal` para alinear el comportamiento con el hook global de click outside.

### Changed
- **Modal**: `zIndex` admite cualquier número (no solo `50` / `60`); valores fuera de esos presets se aplican con `style` en el contenedor raíz, para superponer popovers/popups en portal (~1000).

## [1.2.82] - 2026-03-26

### Changed
- **CatalogCard (catálogo)**: `categoryLabel` y `locationLabel` pasan a ser **opcionales**; si se omiten o van vacíos, no se renderiza la fila de categoría/rating (solo lo que tenga contenido) ni la fila de ubicación (pin + texto). Documentación en tipos y JSDoc de `CatalogCard`.
- **CatalogCard (proveedor)**: `phone` y `email` **opcionales**; si se omiten, no se muestra la fila correspondiente. **Sin valor por defecto** en `statusLabel`: si se omite o va vacío, no hay badge de estado (antes se mostraba «Activo» implícitamente). Cabecera meta (rating + estado) solo si hay algo que mostrar.
- **CatalogCard — Storybook**: Historias refactorizadas con `CatalogStoryBox` (`StoryBox.Title`, `Description`, `Content`, `Code`); documentación Markdown en `meta` (tablas de props catálogo/proveedor, índice de historias); más ejemplos de variante **proveedor**; historias sin pasar `undefined` explícito donde basta omitir la prop.

## [1.2.81] - 2026-03-25

### Fixed
- **InnerButton / Button (variante `link`)**: Hover y estado pressed alineados con el botón nativo: en `<a>` no aplican los pseudos `:enabled` de CSS, así que `enabled:hover:` / `active:enabled:` no tenían efecto. Se sustituyen por `hover:` / `active:` en `variantColors.ts`; en `buttonVariants.ts` el cursor usa `!ui-cursor-pointer` y `disabled:ui-pointer-events-none` para que el deshabilitado no reciba hover. Tests de `InnerButton` actualizados.

### Changed
- **CatalogCard (variante catálogo)**: La ubicación (`locationLabel`) deja de renderizarse como enlace (sin `<a>`, sin subrayado ni estilo `ui-text-link`). El icono de pin usa `ui-text-secondary` acorde al texto. La prop `locationHref` queda **deprecada** e ignorada (se mantiene en tipos por compatibilidad). Stories y ejemplo en JSDoc de `CatalogCard` sin `locationHref`.
- **CatalogCard — fila de tags**: Transición suave del borde de los badges al hover de la tarjeta (`ui-transition-colors ui-duration-200 ui-ease-in-out` sobre el trazo transparente → marca vía `group-hover`).

## [1.2.80] - 2026-03-24

### Added
- **CatalogCard**: Módulo de tarjeta de catálogo / proveedor (variantes catálogo y proveedor), tipos, stories y constantes de indicadores de media.
- **Popup**: Flecha opcional (`PopupArrow`), layout estructurado (`PopupStructuredLayout`), utilidades de colocación (`popupArrowPlacement`).

### Changed
- **Popup / usePopup**: Ajustes de posicionamiento y comportamiento alineados con flecha y layout estructurado; stories ampliadas.
- **Button / InnerButton / LegacyButton**: Cambios asociados a integración con Popup y tipos de botón compartidos.
- **useClickOutside**: Ajustes para flujos de Popup y menús.
- **Tipos compartidos**: `button` y `popup` ampliados para la nueva API.

## [1.2.78] - 2026-03-23

### Changed
- **Chore**: Verificación del flujo de publicación del paquete UI; reglas Cursor para intención explícita al publicar.

## [1.2.77] - 2026-03-23

### Changed
- **Publicación**: Scripts `publish:patch|minor|major` ejecutan ESLint, `tsc --noEmit`, bump de versión, comprobación de que `README.md` y `CHANGELOG.md` reflejan la versión en `package.json`, build y `npm publish`. `prepublishOnly` repite validaciones al empaquetar. Scripts `scripts/verify-release-docs.mjs` y `scripts/git-release-commit.mjs` (commit del release y `git push` tras publicar).

## [1.2.75] - 2026-03-19

### Added
- **Paleta `COLORS` (tasks-modules)**: Export de `COLORS` y tipo `TasksModulesColors` desde el índice del paquete. Los valores hex coinciden con `@imj_media/tasks-modules` (`utils/Colors.tsx`) para migrar consumidores gradualmente hacia `@imj_media/ui`. Implementación en `shared/constants/tasksColors.ts` (objeto `as const` para inferencia literal / autocompletado).
- **Picture**: Prop `fillParent` para que la imagen ocupe y rellene el contenedor (flujos tipo cards/media).
- **IconFont** e **Icon**: Constantes de tamaño de icono y ajustes asociados en el módulo de fuentes de icono.
- **Documentación**: Cobertura ampliada de documentación para componentes de `@imj_media/ui`.
- **Guías internas**: Guías de desarrollo, de componentes y prompts para trabajar el paquete UI.

### Changed
- **Tailwind / tokens**: Utilidades de `inset`, `margin` y `gap` alineadas con la escala Figma (p. ej. `ui-top-8` según tokens).
- **Tipos compartidos**: Soporte tipado para `Picture.fillParent`, `IconBackgroundColor` y cambios ligados a iconos y media.
- **InnerButton**: Refactor de clases, tests y stories.
- **Tooltip**: Ajuste menor en la story correspondiente.

### Deprecated
- **InnerButton**: Tema de icono heredado marcado como deprecado a favor del modelo actual de iconos.

## [1.2.74] - 2026-03-17

### Changed
- **Table - Scroll horizontal con columnas de ancho automático**: Cuando hay columnas sin `width` o con `maxWidth: 'auto'`, la tabla ya no se superpone a la columna de acciones en viewports pequeños. Se aplica un ancho mínimo total a la tabla (suma de mínimos por columna) y el contenedor con `overflow-x-auto` muestra scroll horizontal. Columna flex (`maxWidth: 'auto'` sin `width`) tiene mínimo por defecto `DEFAULT_FLEX_COLUMN_MIN_WIDTH` (100px), sobreescribible con `column.minWidth`; el contenido trunca con ellipsis cuando no cabe. Utilidad `getColumnMinWidthPx` y constante `DEFAULT_FLEX_COLUMN_MIN_WIDTH` en `cellStyles`; helper `isFlexColumn(column, hasColumnMaxWidthAuto)` para aplicar truncado en celdas y header. `<colgroup>` en la tabla para que el navegador respete anchos mínimos. Eliminados `console.log` de diagnóstico en TableContent y HeaderCell.

## [1.2.73] - 2026-03-14

### Changed
- **Table - Celdas con columna flex**: Componentes de celda (TableCell, PrimaryCell, StatusCell, ActionsCell, LinkCell, AvatarsCell, TextFieldCell, DropdownCell, ButtonCell, ProgressBarCell, SkeletonCell, TagsCell, CheckboxCell, IconCell, StarsCell, DateCell) y HeaderCell aplican truncado (overflow + ellipsis) cuando la columna es flex (`maxWidth: 'auto'` sin `width`) mediante `isFlexColumn` y `hasFixedWidth`/`shouldTruncate`.
- **Badge**: Mejoras de soporte de truncado en componentes relacionados.

## [1.2.72] - 2026-03-13

### Added
- **Review Layer**: Integración de `@bitux/review-layer-react` como dependencia. Re-export de `ReviewProvider` y `useReview` desde el SDK en el index del paquete.
- **Storybook - Review Layer**: Configuración con directorio de entorno custom; archivo de declaración TypeScript para variables de entorno; `ReviewProvider` en el preview para estado de revisiones; componente `LoadCommentsOnRoute` para cargar comentarios al cambiar de ruta; container ID estable para comment pins. Documentación de despliegue del Review Layer en Dokploy (variables de entorno y uso).
- **Table - maxWidth auto**: Soporte para columnas con `maxWidth: 'auto'`. Nueva prop `hasColumnMaxWidthAuto` en celdas y utilidades; `getTableCellProps` y funciones relacionadas contemplan columnas con ancho máximo automático; ajustes de layout y resize para columnas con ancho automático. Stories de Storybook actualizadas para mostrar la nueva capacidad.

### Changed
- **Dependencia**: `@bitux/review-layer-react` actualizada a la versión 0.1.11.
- **Docker**: Variables de entorno para Review Layer (API key y URL) en Docker Compose y Dockerfile; Storybook carga las variables de entorno del Review Layer de forma dinámica en tiempo de build.

## [1.2.70] - 2026-03-12

### Added
- **Table - Persistencia de ancho inicial en resize**: Se guarda `defaultWidth` en el estado persistido (`TableColumnState`) y en localStorage. Permite volver al ancho inicial de cada columna al reducir después de un refresh: columnas que empezaron en "auto" guardan el ancho que tenían al primer resize como mínimo.
- **Table - Callback de resize con ancho inicial**: `onResize` y `updateColumnWidth` aceptan un tercer argumento opcional `defaultWidthAtStart` (ancho al inicio del gesto de resize); HeaderCell lo envía para que la config persistida tenga el mínimo correcto.
- **Tag - Prop `truncateLabel`**: Nueva prop opcional en `ITagProps`. Cuando `truncateLabel={true}`, el tag se adapta al ancho del contenedor y el label se trunca con "..." si no cabe. API cerrada en lugar de pasar clases desde fuera.

### Changed
- **Table - Overflow en celdas con ancho fijo**: Cuando una columna tiene `width` definido, el contenido se adapta al ancho: el `<td>` y los contenedores internos usan `ui-overflow-hidden` y `ui-min-w-0`; el texto se trunca donde corresponde. Ajustes en `getTableCellClasses` (parámetro `hasFixedWidth`), en todos los atoms de celda (TableCell, PrimaryCell, TagsCell, StatusCell, ActionsCell, DateCell, LinkCell, ProgressBarCell, StarsCell, IconCell, ButtonCell, TextFieldCell, DropdownCell, SkeletonCell, CheckboxCell, AvatarsCell) y en HeaderCell (overflow en header cuando tiene width).
- **Table - StatusCell con ancho fijo**: El texto del estado trunca con "..." en lugar de hacer wrap (`ui-truncate` en el span del label cuando `hasFixedWidth`).
- **Table - TagsCell con ancho fijo**: Contenedor de tags con `ui-min-w-0 ui-overflow-hidden`; cada tag puede reducirse (`ui-min-w-0 ui-max-w-full` en el wrapper) y se pasa `truncateLabel={hasFixedWidth}` al componente Tag para que el texto del tag se trunque.
- **Tag - Merge de `className`**: El `className` pasado por props se combina con las clases base del Tag en `baseClasses` para no sobrescribir estilos al personalizar.
- **useTableConfig**: `createInitialConfig` incluye `defaultWidth` para columnas con width numérico; al mergear columnas se expone `originalWidth` desde `colState.defaultWidth` para que HeaderCell use el mínimo correcto en resize; `updateColumnWidth(columnId, width, defaultWidthAtStart?)` persiste `defaultWidth`; `updateColumnOrder` preserva `defaultWidth`.

### Note
- Las versiones **1.2.57**, **1.2.59**, **1.2.60**, **1.2.64**, **1.2.66**, **1.2.68** y **1.2.69** no aparecen en el historial de `package.json`; no se documentan entradas específicas para ellas.

## [1.2.67] - 2026-03-10

### Added
- **ReactCalendarTimeline**: Nuevas props para personalización: `itemsSorted`, `showCursorLine`, `dayBackground`, `height`, `canResizeLeft`, `canResizeRight`. Método `getEffectiveCanResize` para derivar el comportamiento de resize desde las nuevas props. Ajustes en el render para soportar estilos de altura.

## [1.2.65] - 2026-03-10

### Added
- **ReactCalendarTimeline**: Soporte para rangos de fecha flexibles: `defaultTimeStart` y `defaultTimeEnd` aceptan timestamps y objetos `Date`. Documentación de ejemplo con dayjs.
- **DatePicker**: Validación de fechas mejorada: normalización de rangos seleccionados a medianoche local para evitar discrepancias con fechas ISO. Nueva utilidad `toLocalDateOnly`. Stories para formatos de fecha y manejo de timezone.

## [1.2.63] - 2026-03-10

### Added
- **ReactCalendarTimeline**: Zoom con rueda del mouse; mejoras en el renderizado de ítems en `defaultItemRenderer`. `ScrollElement` mantiene listeners estables para interacciones con la rueda. Stories de Timeline con wrapper de documentación para manejo de props.

## [1.2.62] - 2026-03-10

### Changed
- **ReactCalendarTimeline**: La prop `intervalRenderer` en DateHeader e Interval pasa a ser opcional para compatibilidad cuando no se proporciona renderer personalizado. Comentarios actualizados.

## [1.2.61] - 2026-03-10

### Added
- **ReactCalendarTimeline**: Export como `ReactCalendarTimeline` para compatibilidad con imports existentes.
- **DateHeader**: Construcción siempre de `headerDataValue` para que el header sea visible aunque `intervalRenderer` sea undefined. Nueva story para mostrar año en el header.

## [1.2.58] - 2026-03-10

### Added
- **imj-calendar-timeline**: Nuevo módulo con componentes y estilos de timeline (ReactCalendarTimeline).
- **Table**: Story TableActionsColumnScroll para reproducir el solapamiento de columnas sticky.

### Changed
- **Table - HeaderCell**: Simplificación de estilos sticky del header (eliminación de clase z-index innecesaria).

## [1.2.56] - 2026-03-06

### Added
- **Table - Story Resizable Scenarios**: Nueva historia **UI/Table/Resizable Scenarios** con varios escenarios para reproducir el comportamiento de columnas redimensionables (con/sin columnas fijas, paginación con Promise fake, distintas combinaciones de `width` y `resizable`).
- **Table - ColumnConfig `originalWidth`**: Propiedad opcional (solo uso interno) que guarda el ancho original de la columna al montar para permitir volver a él al redimensionar.

### Changed
- **Table - Columna de ACCIONES siempre por encima al hacer scroll**: Ajuste de z-index para que la columna de acciones quede siempre visible sobre el resto de celdas del body al hacer scroll horizontal/vertical. Celdas de acciones en body `z-[50]`; header sticky (checkbox, expand, locked, acciones) `z-[51]` en `TableHeader` y `HeaderCell`.
- **Table - Resize: poder volver al ancho inicial**: Se preserva el ancho original de cada columna (`originalWidth` en `ColumnConfig`) al montar; el mínimo permitido al reducir incluye ese valor para que el usuario pueda volver al ancho definido inicialmente aunque el contenido exija más. Cambios en `useTableColumns` (merge), `cellStyles` y `HeaderCell` (cálculo de `minWidthRef`).
- **Table - Handle de resize ampliado**: El área de activación del resize en el header pasa a 18px centrada en el borde (`right: -9px`, `width: 18px`) con `z-10` para intentar activar desde el inicio de la columna vecina (la celda siguiente puede tapar la zona en algunos contextos de apilamiento).

## [1.2.53] - 2026-03-06

### Added
- **Table - Story Dropdown con API real**: Nueva story **DropdownOpcionesApiReal** que carga opciones desde JSONPlaceholder (GET /users y GET /albums) para validar el flujo completo de dropdowns con datos asíncronos.

### Changed
- **Table - Columna Acciones**: Línea divisoria a la izquierda de la columna de acciones (`ui-border-l ui-border-l-default`). La columna de acciones no puede ser bloqueada: `lockable={false}` y no se muestra el botón de bloquear en el header.
- **StoryBox - Description**: El contenido de la descripción se envuelve en `<div>` en lugar de `<p>` para permitir listas (`<ul>`) y otros bloques sin warning de `validateDOMNesting`.
- **Table - useTableColumns**: Menos re-renders innecesarios al comparar propiedades de columnas antes de devolver nuevo estado.
- **Table - useTableConfig**: Uso de `useMemo` en la computación de columnas para actualizaciones más eficientes cuando cambian las dependencias.

## [1.2.52] - 2026-03-03

### Added
- **Table - Dropdown con opciones asíncronas**: Sincronización de columnas cuando el padre actualiza las props (p. ej. `columnOptions` cargadas por API). El hook `useTableColumns` actualiza el estado interno al cambiar `initialColumns`, de modo que los dropdowns en modo edición reciben las opciones correctamente tras peticiones async (React Query, etc.).
- **Table - Columna `columnOptionsLoading`**: Nueva prop opcional en `ColumnConfig`. Cuando es `true`, el Dropdown de la celda muestra un icono de carga (Font Awesome `faCircleNotch` animado) en el `leftSlot` del selector mientras se cargan las opciones.
- **Table - Stories**: 
  - **EdicionColumnasDropdown**: Ejemplo de edición con dropdown usando opciones en la columna (`columnOptions`) y opciones desde `render` (CellConfigValue).
  - **Dropdown con opciones cargadas por API (escenario OBP)**: Reproduce el flujo de Medios fijos (OBP Data Editor) con opciones vacías al montar y carga simulada a los 2,5 s; incluye botón "Cargar opciones ahora" y uso de `columnOptionsLoading`.
- **Dropdown - Prop `loading`**: Cuando `loading={true}`, el selector muestra el icono de carga en el `leftSlot` (faCircleNotch con animación de giro) en lugar del icono habitual.
- **Input - Prop `leftSlotClassName`**: Clase CSS opcional aplicada al icono/slot izquierdo (p. ej. `ui-animate-spin` / `animate-spin` para iconos de carga).

### Changed
- **Table - useTableColumns**: Efecto que sincroniza el estado de columnas con `initialColumns` al cambiar la referencia. Se preservan `width`, `visible`, `locked` y el orden actual cuando el conjunto de columnas no cambia (solo el contenido, p. ej. `columnOptions`). Incluye JSDoc y recomendación de memoizar columnas con `useMemo(..., [columnOptions, ...])`.
- **Dropdown**: Con `loading=true` se fuerza `leftSlot={faCircleNotch}` y `leftSlotClassName` con clases de giro para el icono de carga.
- **Input**: La prop `leftSlotClassName` se aplica al componente `Icon`/`Visual` del leftSlot (no solo al contenedor) para que animaciones como el giro se vean correctamente.

### Docs
- **Table - README**: Nueva subsección "Opciones de dropdown cargadas por API (asíncronas)" con ejemplo de `useMemo` y referencia a la story OBP.
- **Table - EJEMPLO_USO**: Nota sobre `columnOptions` asíncronas y uso de `useMemo` para las columnas.
- **Dropdown / Table**: Documentación del estado de carga en el leftSlot del dropdown.

## [1.2.51] - 2026-03-02

### Changed
- **Table - TagsCell**: Los tags en celdas se renderizan por defecto sin borde (`stroke={false}`). Se añade soporte para la prop `stroke` en los datos del tag; si se indica `stroke: true`, el tag mostrará borde.

## [1.2.49] - 2026-02-26

### Added
- **Dropdown - Opción `avatarUrl` en variante user**: Las opciones pueden incluir `avatarUrl` (URL de imagen). Esa URL se usa en el `leftSlot` del Input cuando el usuario está seleccionado, y en la lista se muestra la imagen si existe; si no, se usa `avatar` (p. ej. iniciales).
- **Dropdown - Stories en modal**: 
  - **VariantUserInModal**: Dropdown con `listVariant="user"` dentro de un modal para probar cierre al hacer clic en la chevron y fuera.
  - **MultipleDropdownsInModal**: Varios dropdowns en disposición desordenada (arriba/abajo, izquierda/derecha) con botones a la izquierda o derecha, para probar múltiples selectores en modal.

### Changed
- **Dropdown - Avatar en selector (user)**: El avatar del usuario seleccionado se muestra vía URL en el `leftSlot` del Input en lugar de un ReactNode, para evitar fallos de integración.
- **Dropdown - Lista user con imagen**: Cuando una opción tiene `avatarUrl`, en la lista se renderiza la imagen (`<img>`) en el ítem; si no, se usa `option.avatar` (string de iniciales o lo que pase el consumidor).
- **useDropdown - Click outside con trigger**: Se pasa siempre `containerRef` (trigger) al hook de click-outside, también con `absolute=true`. Así los clics en el selector (incluida la chevron derecha) no se consideran "fuera" y el cierre lo hace solo el toggle del Input, corrigiendo que el dropdown a veces no cerraba al hacer clic a la derecha del selector, sobre todo dentro de modales.

## [1.2.48] - 2026-02-26

### Changed
- **DatePicker - Cabecera de días sincronizada con `startOfWeek`**: Las etiquetas del header (iniciales de los días) se reordenan automáticamente según la prop `startOfWeek` para que coincidan con las columnas del calendario (p. ej. L M M J V S D con semana en Lunes, o D L M M J V S con semana en Domingo).
- **DatePicker - Convención de `weekDays`**: El array `weekDays` usa orden natural [Dom, Lun, Mar, Mie, Jue, Vie, Sab] (índice = día de la semana en JavaScript). El componente reordena las etiquetas según `startOfWeek`; no es necesario pasar un orden distinto al cambiar el inicio de semana.
- **DatePicker - Etiquetas por defecto en 3 letras**: Por defecto las etiquetas de días son de 3 letras (Dom, Lun, Mar, Mie, Jue, Vie, Sab). Si se pasa la prop `weekDays`, se usan las etiquetas que indique el usuario (una letra, nombre completo, otro idioma, etc.).

### Docs
- **DatePicker - Tipos**: Comentarios en `Calendar.types.ts` para las props `weekDays` y `startOfWeek` (orden natural y significado de `startOfWeek`).

## [1.2.47] - 2026-02-20

### Added
- **Lightbox - Nueva prop `size`**: Soporte para diseño responsivo con diferentes tamaños de lightbox
  - Nuevas stories para demostrar los diferentes tamaños disponibles
- **Table - Stories adicionales**: Nuevas historias de Storybook para demostrar funcionalidades del componente

### Changed
- **Tipografía y Tracking**: Mejoras de tipografía y consistencia de clases en múltiples componentes
  - `AccordionHeader`: Actualización de clases para consistencia con nuevos estilos de tipografía
  - `Badge`: Mejoras de estilos con clases adicionales de tracking y consistencia de tamaño
  - `StepIcon` y `StepLabel`: Mejoras en estructura de tipografía y clases
  - `AlertHeader`: Mejoras de estilos con tipografía y tracking mejorados
  - `Textarea`: Mejoras de estilos con clases adicionales de tipografía y tracking
  - `DatePicker`: Mejoras de tipografía y estructura de clases en componentes
  - `Toggle`: Actualización de estilos para mejor tipografía y consistencia de clases
  - `Tag`: Mejoras de estilos con clases adicionales de tipografía y tracking
  - `List`: Mejoras con tipografía y consistencia de layout mejorados
- **Organización de Stories**: Actualización de títulos de stories para mejor organización
  - Alert, Badge, DatePicker, Sidebar, Table, Textarea, Toggle, Visual
- **Configuración de Tailwind**: Limpieza de configuración removiendo patrones no utilizados y consolidando estilos de superficie

### Fixed
- **Font Family**: Revertido cambio a SF Pro Text, manteniendo la fuente anterior

### Docs
- **Clases con prefijo `ui-`**: Agregado documento de referencia con información detallada de variables

## [1.2.46] - 2026-02-18

### Added
- **Toolbar - Nueva prop `onBackClick`**: Callback para manejar el clic en el botón de regreso del componente Toolbar

## [1.2.45] - 2026-02-17

### Changed
- **Table - Ordenamiento mejorado**: Modificación del componente Table para mejorar la funcionalidad de ordenamiento
  - Actualización de utilidades de sorting para mejor manejo de ordenamiento
  - Actualización de tipos de tabla para soportar nuevas opciones de ordenamiento
- **ESLint**: Actualización de configuración de ESLint y dependencias del paquete

## [1.2.44] - 2026-02-14

### Added
- **Table - Nueva prop `borderable`**: Opción para agregar bordes a las celdas de la tabla
- **Table - Columnas sticky**: Soporte para columnas fijas (checkbox y acciones) que permanecen visibles al hacer scroll horizontal
  - Nuevas props para configurar columnas sticky
  - Mejoras en estilos de celdas para soportar posicionamiento sticky
  - Nuevas stories demostrando la funcionalidad de columnas fijas

### Changed
- **Font Family**: Actualización de la familia de fuentes a Inter

### Fixed
- **InnerButton - Manejo de `iconProps`**: Mejora en el manejo de iconProps y actualización de verificaciones de null
- **Table - Estado vacío**: Mejora en el manejo del estado vacío de la tabla
- **Table - Espaciado**: Corrección de problemas de espaciado en la tabla

## [1.2.43] - 2026-02-13

### Added
- **Clase `ui-imj`**: Integración de la clase `ui-imj` en componentes UI para mejor encapsulamiento de estilos

### Changed
- **Lightbox**: Refinamiento del componente Lightbox
- **FilterCard**: Refinamiento del componente FilterCard

## [1.2.42] - 2026-02-11

### Added
- **Fuentes SF Pro**: Integración de fuentes SF Pro Text y SF Pro Rounded
- **Documentación de Iconos**: Agregada documentación para componentes de iconos y actualización de uso de iconos en varios módulos

### Changed
- **Input**: Mejoras de estilizado y accesibilidad
- **InnerButton**: Mejoras de estilizado y accesibilidad
- **Dropdown**: 
  - Introducción de múltiples variantes de lista
  - Mejoras de estilizado
  - Mejora de integración de tooltip
- **Pagination**: 
  - Mejora de visualización de paginación
  - Actualización de iconos de acciones de tabla
- **Table**: 
  - Mejora de funcionalidad de celdas de encabezado
  - Mejora de integración de tooltip
  - Actualización de estilos de fondo y manejo de color de texto para estados de edición
- **Popup**: 
  - Mejora de uso de iconos
  - Actualización de implementación de tooltip para usar `tooltipProps`
- **FilterPopup**: Actualización de implementación de tooltip para usar `tooltipProps`
- **TableToolbar**: Actualización de implementación de tooltip para usar `tooltipProps`
- **PickerColor**: Actualización de estructura del componente y mejoras de estilizado
- **Wysiwyg**: Mejora de implementación de botones de formato y actualización de uso de iconos
- **Seguridad de Tipos**: Mejoras de seguridad de tipos y consistencia de componentes actualizando interfaces de props

### Fixed
- **Archivos duplicados**: Eliminación de archivos zombie de merge y corrección de errores de tipos preexistentes
- **Header duplicado**: Eliminación de archivos Header duplicados del antiguo directorio 'organims' traídos por merge

## [1.2.41] - 2026-02-10

### Added
- **Mejora de Seguridad de Tipos y Reducción de Uso de 'any'**: Implementación de mejoras significativas en la seguridad de tipos en todo el paquete UI
  - Agregada dependencia `@fortawesome/pro-duotone-svg-icons` para mejorar el manejo de iconos
  - Reducción de advertencias de 'any' de 258 a 214 mediante correcciones de tipos críticas
  - Creados documentos de documentación: `ANY_CORRECTIONS_SUMMARY.md` y `ANY_CRITICAL_REVIEW.md` para documentar correcciones críticas de tipos
  - Establecida configuración de ESLint para hacer cumplir estándares de codificación y prevenir el uso de 'any' en el futuro
  - Mejoras de tipos implementadas en utilidades compartidas y componentes, mejorando la seguridad de tipos general y mantenibilidad

### Changed
- **Mejora de Seguridad de Tipos y Consistencia de Componentes**: Refactorización para mejorar la seguridad de tipos y consistencia en varios módulos
  - Mejora de seguridad de tipos refinando tipos de props en componentes Dropdown, Header e Icon, reduciendo la dependencia de 'any'
  - Actualización de opciones de Dropdown para incluir un campo 'value' para mejor manejo de datos
  - Mejora del componente Header para convertir filtros para compatibilidad con el componente Filters
  - Ajuste de InnerButton y componentes relacionados para soportar nuevos tipos de iconos y badges, asegurando uso consistente
  - Refactorización de componentes List para asegurar verificaciones de tipos adecuadas para valores de checkbox
  - Mejora de funciones utilitarias de Modal para manejar tipos de componentes con mayor precisión
  - Actualización de componentes Table para hacer cumplir verificaciones de tipos más estrictas y mejorar la mantenibilidad general
  - Actualización de `.prettierrc` para hacer cumplir punto y coma para mejor consistencia de código
- **Eliminación de Documentación de Implementación Desactualizada**: Limpieza de documentación obsoleta
  - Eliminado el archivo `Implementacion_Awesome.md`, que contenía detalles de implementación desactualizados para Font Awesome Pro
  - Actualización de componentes Button, Dropdown y otros para mejorar la seguridad de tipos eliminando aserciones de tipos innecesarias y asegurando tipos de props adecuados
  - Mejora de opciones de Dropdown para hacer el campo `value` opcional, alineándose con el nuevo enfoque de manejo de datos
  - Mejora de stories en varios componentes para eliminar el uso de 'any' y hacer cumplir verificaciones de tipos más estrictas

## [1.2.40] - 2026-02-06

### Fixed
- **Popup - Error de tipo en `iconProps` y `tooltipProps`**: Corrección del error de tipo TypeScript al pasar `iconProps` y `tooltipProps` al componente `InnerButton`
  - Implementada validación interna usando las funciones `convertLegacyIconToIconConfig` y `convertLegacyTooltipToTooltipConfig` para detectar y convertir props legacy
  - Detección automática de objetos de configuración (`ButtonIconConfig`, `ButtonTooltipConfig`) vs valores simples
  - Manejo correcto de `ReactElement` que no pueden convertirse a configuraciones
  - Prioridad correcta: objetos de configuración > configuraciones legacy > valores simples
  - El componente ahora pasa tanto las props legacy (`icon`, `tooltip`) como las nuevas (`iconProps`, `tooltipProps`) a `InnerButton` para mantener compatibilidad

## [1.2.39] - 2026-02-06

### Fixed
- **Checkbox - Tamaño `sm` no funcionaba**: La clase `ui-h-14 ui-w-14` referenciaba la variable CSS `--ui-Positive-space_14` que no existe en los tokens del sistema de diseño (los tokens saltan de `space_12` a `space_16`). Corregido usando valores arbitrarios `ui-h-[14px] ui-w-[14px]` para que resuelva correctamente a 14×14px.

## [1.2.38] - 2026-02-06

### Added
- **Checkbox - Nuevo Componente Base**: Componente atómico de checkbox basado en los tokens semánticos de Figma (`Forms`)
  - Estados completos: Default, Hover, Focus, Disabled, Error
  - Soporte para `checked`, `indeterminate` y `error`
  - Border radius semántico: `ui-rounded-surface-forms` (token `radius/surface/forms` = 2px)
  - Estado checked sin borde visible (`ui-border-transparent`), solo borde en focus (`ui-border-focus`)
  - Estado error con borde rojo (`ui-border-danger` = #ef4444) en checked y unchecked
  - Disabled checked usa `ui-bg-fill-brand-disabled` (#b8c5ee)
  - Marca de check: SVG con tamaño exacto de Figma (10×12px)
  - Marca indeterminate: SVG minus-solid con tamaño exacto de Figma (10×12px)
  - Dos tamaños: `sm` (14×14) y `md` (16×16, default — `space_16`)
  - Forma cuadrada (default) o redonda (`round`)
  - Nuevas props `label` y `supportingText` con tipografía semántica de Figma:
    - Label: `type/label/md/Bold` — 14px, weight 700, line-height 20.5px, tracking 0.5px
    - Supporting text: `type/body/xs/Regular` — 12px, weight 400, line-height 17.5px, tracking 0.5px
  - Gap checkbox ↔ label: `space_8` (8px); Gap label ↔ supporting: `space_4` (4px)
  - Color de texto: `ui-text-primary` / `ui-text-tertiary`, disabled: `ui-text-disabled`
  - Prop `classNameLabel` para estilos personalizados en el contenedor del label
  - Stories completas: Estados, Error, Formas, Tamaños, Con Label, Selección Múltiple, Combinaciones, Componentes que extienden
  - Exportado desde `@imj_media/ui`
- **Modal - Sistema Flexible de Configuración**: Nuevo sistema agnostico y escalable para el Modal
  - `footerButtons`: Array de botones configurables para el footer con prioridad sobre props legacy
  - `headerButtons`: Array de botones configurables para el header
  - Props de "modelo cerrado": `headerButton`, `badge`, `footerPrimaryButton`, `footerSecondaryButton`, `footerAuxButton`
  - `iconConfig`: Configuración completa del ícono principal del modal
  - `badges`: Array de badges configurables
  - `ModalButton`, `ModalIcon`, `ModalBadge` heredan automáticamente de `IInnerButtonProps`, `IconProps`, `IBadgeProps`
  - Sistema de prioridad: nuevas configs > "modelo cerrado" > props legacy
  - Deprecación con `console.warn` para props legacy en desarrollo
  - Stories de "CompleteSystem" con 5 historias que prueban todos los escenarios
- **InnerButton - Sistema Agnostico de Configuración**: Nuevo sistema de props para configuración modular
  - `iconProps`: Configuración completa del ícono (`ButtonIconConfig`)
  - `badge`: Configuración completa del badge (`ButtonBadgeConfig`)
  - `leftSlotProps` / `rightSlotProps`: Configuración de slots (`ButtonSlotConfig`)
  - `tooltipProps`: Configuración completa del tooltip (`ButtonTooltipConfig`)
  - Props duales: `icon`, `leftSlot`, `rightSlot` y `tooltip` aceptan valores simples o objetos de configuración completos
  - Ejemplo: `icon="faCheck"` (simple) o `icon={{ icon: "faCheck", color: "success" }}` (configuración)
  - Ejemplo: `tooltip="Guardar"` (simple) o `tooltip={{ label: "Guardar", position: "top", delay: 500 }}` (configuración)
  - Deprecación inteligente: solo se deprecan props de estilizado legacy (`iconDuotonePrimary`, `tooltipPosition`, etc.), no las props base
  - Stories completas con secciones de sistema nuevo, comparación legacy, duotone, convergencia y casos raros

### Changed
- **InnerButton - Arquitectura Modular (Atomic Design)**: Reestructuración completa del componente
  - Componentes atómicos: `ButtonContent`, `ButtonIcon`, `ButtonBadge`, `ButtonSlotLeft`, `ButtonSlotRight`
  - Custom hooks: `useBadgeLoading`, `useHoverText`, `useButtonClasses`
  - Utilidades: `badgeUtils`, `colorUtils`, `iconUtils`, `configConverters`, `deprecation`
  - Estilos: `buttonVariants` (CVA), `variantColors`
  - Backward compatible: `index.tsx` re-exporta desde `InnerButton.tsx`
- **Renombrado de Props de Slots**: `slotLeft` → `leftSlot`, `slotRight` → `rightSlot`
  - Actualización en 50+ archivos: `Button`, `InnerButton`, `Popup`, `Dropdown`, `Sidebar`, `Switch`, `Table`, `Toolbar`, `Filters`, `DatePicker`, `EmojiPicker`, `Modal`
  - Props de duotone y handlers renombrados: `slotLeftDuotonePrimary` → `leftSlotDuotonePrimary`, `onClickSlotLeft` → `onClickLeftSlot`, etc.
  - Tipos actualizados: `IInnerButtonProps`, `IButtonProps`, `emojipicker.ts`, `switch.ts`, `modal.ts`
- **SelectionCheckbox**: Refactorizado como wrapper del nuevo componente `Checkbox` base
- **ListItemCheckbox**: Reemplazado `<input>` raw por componente `Checkbox`
- **ListFiltersCheckbox**: Reemplazado `<input>` raw por componente `Checkbox`
- **ListBase**: Reemplazados checkboxes raw en variantes `filters-checkbox` y `users-select` por `Checkbox`
- **ListUsersSelect**: Reemplazado `<input>` raw por componente `Checkbox`
- **List**: Reemplazado `<input>` raw en `checkboxProps` por `Checkbox`
- **TableRow**: Reemplazados 2 `<input type="checkbox">` raw por `SelectionCheckbox` (filas padres e hijos)
- **Toolbar**: Ajustes de layout y responsividad con clases flex mejoradas
- **Modal**: Actualización de clases de borde para mejor estilizado

### Fixed
- **Badge - Padding con Ícono**: Corrección del padding en badges `sm` cuando tienen ícono, ahora aplica `ui-pl-8 ui-pr-8` explícitamente
- **Toolbar - Responsividad**: Ajustes de clases de layout para que los addons se ajusten correctamente dentro del contenedor

## [1.2.37] - 2026-02-05

### Fixed
- **Build

## [1.2.36] - 2026-02-04

### Fixed
- **InnerButton - Badge Loading en Producción**: Corrección del problema donde el badge no se mostraba cuando `badgeLoading` era `true` en producción
  - La verificación de `badgeLoading` ahora tiene prioridad en `shouldShowBadge()`, mostrando el badge incluso si no hay `badgeColor` definido
  - Agregado fallback de `badgeColor` a `'accent'` cuando está en loading y no se especifica un color
  - Agregado `effectiveBadgeSize` para asegurar un tamaño válido cuando está en loading (usa `'sm'` por defecto si no se especifica)
  - Validación mejorada en el componente Badge para el spinner con fallback a tamaño `'sm'` si el tamaño no es válido
  - El badge ahora se muestra correctamente en producción cuando `badgeLoading` cambia a `true`, incluso sin `badgeLabel` o `badgeColor` explícito

## [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
- **LinearGraphic - Nuevo Componente**: Componente de gráfica lineal para visualización de datos proporcionales
  - Segmentos visuales con colores semánticos configurables: `brand`, `success`, `warning`, `danger`, `info`, `neutral`, `yellow`
  - Sistema de tooltips integrado con posicionamiento automático
  - Prop `showLegend` para mostrar leyenda con indicadores de color
  - Prop `showLegendPercent` para controlar la visualización del porcentaje en la leyenda (por defecto: `false`)
  - Prop `legendGap` para ajustar el espaciado de la leyenda
  - Animaciones de transición configurables con `transitionDuration`
  - Soporte para estados `disabled`
  - Eventos `onSegmentHover` y `onSegmentLeave` para interactividad
  - Stories completas en Storybook incluyendo `AllColors` con los 7 colores disponibles
- **ListWithDataInHover - Nuevo Componente**: Componente de lista con datos en hover
  - Indicadores de color con colores semánticos: `brand`, `success`, `warning`, `danger`, `info`, `neutral`, `yellow`
  - Tooltips integrados con posicionamiento configurable (`top`, `bottom`, `left`, `right`, `over`)
  - Prop `showPercent` para mostrar/ocultar el porcentaje junto al nombre (por defecto: `true`)
  - Prop `tooltipPosition` para controlar la posición del tooltip (por defecto: `over`)
  - Integración con el sistema de leyenda de `LinearGraphic`
- **TextListWithData - Nuevo Componente**: Componente de lista de texto con datos
  - Colores semánticos unificados con `LinearGraphic` y `ListWithDataInHover`
  - Indicadores de color configurables con `indicatorSize` y `showIndicator`
- **InlineTooltip - Nuevo Componente**: Tooltip inline reutilizable para uso dentro de otros componentes
  - Posiciones disponibles: `top`, `bottom`, `left`, `right`, `over`
  - Estilo visual consistente con el componente `Tooltip` existente
  - Z-index alto (99999) para garantizar visibilidad sobre otros elementos
  - Flecha con diseño de cuadrado rotado como el tooltip original
- **Drawer - Soporte para Tabs**: El componente Drawer ahora soporta tabs internos
  - Props `tabs`, `onChangeTab`, `defaultTab` para configuración de tabs
  - Ancho personalizable con prop `width` (sm, md, lg, xl, 2xl, full)
- **CardsWithAside - Nuevo Componente**: Componente de tarjetas con panel lateral
  - Funcionalidad de tabs integrada para navegación entre secciones
  - Layout responsivo con aside configurable

### Changed
- **Message & Notification**: Mejora en rendimiento y validación de componentes
  - Optimización de re-renders con memoización mejorada
  - Validación de props más robusta
- **InnerButton**: Mejora en lógica de validación y cobertura de pruebas unitarias
- **Alert**: Mejora en accesibilidad y cobertura de pruebas unitarias
- **Accordion**: Documentación completa y pruebas unitarias exhaustivas
- **Text - Tamaño por defecto**: El componente Body ahora usa tamaño `xs` por defecto en lugar de `md`
  - Mejora en la consistencia visual para textos de cuerpo
- **Text - Historia de colores**: Nueva historia `AllSystemColors` que muestra los 42 colores del sistema
  - Colores base: primary, secondary, tertiary, disabled, on-color, on-canvas-inverse
  - Colores semánticos: brand, success, warning, danger, info con variantes hover/pressed/selected
  - Colores de link: link, link-hover, link-pressed, link-visited
  - Paleta de colores: all-colors-red, all-colors-orange, all-colors-yellow, etc.

### Fixed
- **Tooltip - Z-index**: Actualización de clase z-index para mejor posicionamiento sobre modales
- **Tailwind - Safelist de colores**: Agregadas 42 clases de colores de texto al safelist de Tailwind
  - Resuelve problema de clases dinámicas no generadas con `ui-text-${color}`
  - Incluye todos los colores del sistema de diseño para el componente Text

## [1.2.32] - 2026-02-03

### Changed
- **Alert - Variante por defecto**: La variante por defecto de Alert, Message, Notification y Toast cambió de 'contained' a 'outlined'
  - Mejora en la consistencia visual con el sistema de diseño
  - AlertHeader actualizado para soportar mejor el estilo outlined
  - Clases de alerta ajustadas para una apariencia outlined consistente
  - Modificados MessageItem, NotificationItem y ToastItem para reflejar la nueva variante por defecto
- **Toolbar - Mejoras en lógica**: Ajustes en la lógica del componente Toolbar
  - Optimización en el manejo de eventos y estado interno
  - Mejoras en la sincronización entre botones y addons
  - Refinamiento en la gestión de la vista de botones y addons

## [1.2.31] - 2026-02-03

### Changed
- **Dependencias actualizadas**: Actualización de dependencias del paquete UI
  - Agregada dependencia `@fortawesome/pro-duotone-svg-icons` en versión `^7.1.0`
  - Actualizado `@acemir/cssom` a versión `0.9.31`
  - Actualizado `@asamuzakjp/css-color` a versión `4.1.1`
  - Actualizado `lru-cache` a versión `11.2.5`

## [1.2.30] - 2026-02-03

### Fixed
- **Tooltip - Z-index mejorado**: El Tooltip ahora siempre aparece por encima de todas las modales
  - Cambio de `ui-z-[9999]` a `ui-z-max` (99999px) para garantizar que esté por encima de modales
  - Modal usa z-index 50 o 60, Tooltip ahora usa el máximo del sistema
  - Resuelve problemas de layering cuando Tooltip se muestra sobre modales abiertas

## [1.2.29] - 2026-01-30

### Added
- **Toolbar - Modo controlado con estados externos**: El componente Toolbar ahora soporta modo controlado para compartir estado entre múltiples toolbars
  - Nuevas props `activeButtonId` y `onActiveButtonIdChange` para control externo del botón activo
  - Los botones pueden tener un `id` único para funcionar correctamente en modo controlado
  - Si no se proporcionan estas props, el componente funciona en modo no controlado (estado interno)
  - Nueva story "ExternalControl" que demuestra el uso del modo controlado
  - Nueva story "MultipleToolbarsSharedState" que muestra cómo múltiples toolbars pueden compartir estado

### Changed
- **Toolbar - Mejoras en funcionalidad**: Expansión de funcionalidades del componente Toolbar
  - Soporte mejorado para múltiples toolbars compartiendo estado
  - Mejoras en la gestión de estados internos y externos
  - Expansión de tipos TypeScript para soportar el modo controlado

## [1.2.28] - 2026-01-29

### Added
- **Toolbar - Funcionalidad inicial**: Implementación inicial del componente Toolbar
  - Barra de herramientas flexible con botones y addons configurables
  - Soporte para botones con addons asociados
  - Vista de botones y vista de addons con navegación entre ellas
  - Stories completas en Storybook demostrando todas las funcionalidades
- **Toast - Historia de Storybook para uso en hooks**: Nueva historia de Storybook que demuestra cómo usar Toast dentro de un hook personalizado
  - Ejemplo práctico de integración de Toast en lógica de negocio
  - Muestra patrones de uso avanzados con hooks

### Changed
- **Alert - Colores personalizados y estilos**: Actualización completa del sistema de colores de alertas
  - Agregadas variables CSS para colores específicos de alertas (info, success, danger, warning)
  - Configuración de colores de fondo, borde y texto según especificación de diseño
  - Removido el fondo circular de todos los iconos de alerta
  - Uso de variables CSS para color de iconos para mantener consistencia con títulos
  - Actualización de Tailwind config con nuevas clases de colores de alerta

### Fixed
- **Alert - Color de fondo para warning**: Corrección del color de fondo para alertas de tipo warning
  - Ajuste en las variables CSS para el color de fondo correcto

## [1.2.27] - 2026-01-22

### Added
- **Popup - Soporte para Badges**: El componente Popup ahora soporta badges en el botón que abre el popup
  - Todas las props relacionadas con badge están disponibles: `badgeColor`, `badgeLabel`, `badgeTheme`, `badgeSize`, `badgeStroke`, `badgeIcon`
  - Soporte para iconos duotone en el badge del popup
  - Nueva story "WithBadges" en Storybook que demuestra badges funcionales en popups con diferentes colores, temas y tamaños
- **Button - Props de Badge completas**: El componente Button ahora pasa todas las props relacionadas con badge a InnerButton
  - Props agregadas: `badgeTheme`, `badgeSize`, `badgeStroke`, `badgeIcon`, y todas las props duotone del badge
  - Nueva story "Icon Button con Badge" en Storybook para el componente Button

### Fixed
- **Badge - Manejo de labels**: Corrección en el manejo de labels para asegurar que siempre se normalicen correctamente
  - El badge ahora muestra correctamente cuando el label es "0" (string)
  - Si el label es `undefined`, `null` o string vacío, el badge no se muestra (excepto si tiene icono o es size='dot')
  - Normalización mejorada del label para evitar problemas en producción
- **Badge - Cálculo de tamaño y padding**: Corrección en la lógica de cálculo de clases de tamaño y padding
  - Las clases `ui-h-16`, `ui-w-16`, `ui-p-4` ahora se aplican correctamente en producción
  - Mejora en la normalización del label para asegurar que `labelLen` se calcule correctamente

### Changed
- **Badge - Colores de borde**: Actualización completa de colores de borde en `strokeSolid` para usar design tokens
  - Cambio de `ui-border-blue-400` a `ui-border-brand` para accent
  - Cambio de `ui-border-green-400` a `ui-border-success` para success
  - Cambio de `ui-border-yellow-400` a `ui-border-warning` para warning
  - Cambio de `ui-border-red-400` a `ui-border-danger` para danger
  - Cambio de `ui-border-cyan-400` a `ui-border-info` para info
  - Consistencia con el sistema de design tokens

## [1.2.26] - 2026-01-22

### Added
- **InnerButton - Soporte para Badge en Icon Buttons**: Nueva funcionalidad para mostrar badges en botones de icono
  - El badge se muestra automáticamente cuando el botón solo tiene prop `icon` y no tiene `children` (icon button)
  - Posicionamiento absoluto en la esquina superior derecha del botón, centrado perfectamente en la esquina
  - Nuevas props relacionadas con badge: `badgeColor`, `badgeLabel`, `badgeTheme`, `badgeSize`, `badgeStroke`, `badgeIcon`
  - Soporte para iconos duotone en el badge: `badgeIconDuotonePrimary`, `badgeIconDuotoneSecondary`, `badgeIconDuotoneOpacityPrimary`, `badgeIconDuotoneOpacitySecondary`
  - Lógica automática para determinar si el badge debe tener borde basado en la combinación de colores del botón y el badge
    - Badge `accent` en botón `primary` → borde automático
    - Badge `gray` en botones `secondary` o `tertiary` → borde automático
  - El badge mantiene su funcionalidad inline cuando el botón tiene `children`
  - Nueva story en Storybook "Icon Button con Badge" que demuestra todas las variantes

### Changed
- **InnerButton - Overflow handling**: El botón ahora usa `overflow-visible` cuando es un icon button con badge para evitar que el badge sea recortado
- **Badge - Border colors**: Actualización de colores de borde para usar design tokens (`ui-border-brand`, `ui-border-success`, etc.) en lugar de colores genéricos de Tailwind

## [1.2.25] - 2026-01-22

### Added
- **Badges - Nuevo Componente**: Nuevo componente para gestión dinámica de tags/badges
  - Contenedor estilo input donde se pueden escribir y agregar badges presionando Enter
  - Cada badge tiene botón de cierre para eliminarlo de la lista
  - Soporte para valores iniciales como array de `BadgeItem[]` o array de `string[]`
  - Prop `colorCycle` para asignar colores cíclicos automáticamente a nuevos badges
  - Prop `defaultColor` para establecer el color por defecto de nuevos badges
  - Prop `maxBadges` para limitar el número máximo de badges permitidos
  - Eventos: `onChange` (al agregar/eliminar), `onAdd`, `onRemove`, `onFocus`, `onBlur`
  - El evento `onChange` retorna objeto con `type` ('add'|'remove'), `item` y `items`
  - Reutiliza componente Tag existente para los badges
  - Hook `useBadges` separado para manejo de lógica (siguiendo principio DRY)
  - Función `normalizeValue` que convierte arrays de strings a `BadgeItem[]` automáticamente
  - Tamaños: xs, sm, md, lg (consistente con otros inputs)
  - Estados: disabled, error, helperText
  - 12 stories completas en Storybook: Default, WithInitialValues, WithStringArray, ColorCycle, DefaultColor, MaxBadges, Sizes, Disabled, WithError, WithHelperText, Events, FullExample
- **AlertDialog - Prop size**: Nueva prop `size` que hereda los tamaños del componente Modal
  - Tamaños disponibles: xs, sm, md, lg, xl, 2xl, full
  - Nueva story `Sizes` que demuestra todos los tamaños disponibles
- **AlertDialog - z-index mejorado**: AlertDialog ahora siempre aparece sobre Modal
  - Nuevo z-index de 60 para AlertDialog (Modal usa 50 por defecto)
  - Resuelve problema de layering cuando AlertDialog se abre desde un Modal
- **Dropdown - Prop infoTooltip**: Nueva prop para mostrar icono de información con tooltip
  - Se pasa al componente Input interno para mantener consistencia
  - Nueva story `WithInfoTooltip` que demuestra el uso
- **Textarea - Props onFocus y onBlur**: Nuevas props para eventos de focus
  - Retornan el evento nativo `React.FocusEvent<HTMLTextAreaElement>`
  - Parámetro del evento es opcional para mayor flexibilidad
- **Text - Mejora en manejo de colores**: Autocompletado de colores del sistema de diseño
  - Tipo `TextColor` expandido con todos los colores semánticos y de paleta
  - Prop `color` ahora acepta `TextColor | string` para autocompletado + flexibilidad
  - Colores semánticos: primary, secondary, tertiary, disabled, on-color, etc.
  - Colores de marca: brand, success, warning, danger, info (con variantes hover/pressed/selected)
  - Colores de paleta: all-colors-red, all-colors-blue, etc.
  - Constante `DEFAULT_TEXT_COLORS` para identificar colores del sistema

### Changed
- **Modal - Props onCancel y onSuccess**: Ahora retornan el evento nativo del click
  - Tipo actualizado a `(event?: React.MouseEvent<HTMLButtonElement>) => void`
  - Parámetro del evento es opcional para compatibilidad con código existente
  - ModalFooter actualizado para pasar el evento a los callbacks
- **Modal - Prop zIndex configurable**: Nueva prop para controlar el z-index del modal
  - Valores: 50 (default) o 60 (para modales anidados)
  - Útil cuando se necesita mostrar AlertDialog sobre Modal
- **useBodyScrollLock - Mejora en gestión de locks**: Implementación mejorada para múltiples modales
  - Usa `Set<string>` con IDs únicos en lugar de contador simple
  - El scroll solo se restaura cuando todos los modales/dialogs se cierran
  - Previene problema de scroll restaurándose prematuramente con modales anidados

### Fixed
- **Header, Title**: Ajuste de layout para mejorar alineación
- **ModalFooter**: Corrección de handlers onCancel y onSuccess para aceptar parámetro de evento

## [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`
  - La prop `title` ahora es opcional (`title?: string`)
  - Nueva prop `children?: ReactNode` para pasar el contenido como children
  - El componente usa `title || children` para determinar el contenido a mostrar
  - Permite mayor flexibilidad: usar `title` para texto simple o `children` para contenido más complejo (JSX, elementos con formato, etc.)
  - Nueva historia `WithChildren` en Storybook que demuestra diferentes casos de uso con children
  - 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`
- **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
  - Útil para secciones destacadas, páginas de bienvenida o títulos que requieren alineación centrada
  - Nueva story `Centered` en Storybook que demuestra diferentes variantes de títulos centrados (con y sin icono, con iconos duotone)
  - Actualización de `argTypes` en Storybook para incluir control de la prop `center`
- **Title - Historias Completas de Storybook**: Sistema completo de historias para el componente Title
  - Nueva historia `Default` que muestra el título básico sin icono
  - Nueva historia `WithIcon` que demuestra títulos con diferentes iconos Font Awesome Duotone
  - Nueva historia `WithDuotoneSemanticColors` que muestra iconos duotone con colores semánticos (success, warning, danger, info, brand)
  - Nueva historia `WithDuotoneColorCombinations` que demuestra combinaciones creativas de colores del sistema de diseño
  - Nueva historia `WithDifferentOpacities` que muestra variaciones de opacidad para efectos visuales
  - Nueva historia `WithCustomClassName` que ejemplifica el uso de clases CSS personalizadas
  - 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
  - Las clases individuales se generan desde las configuraciones de `lineHeight` y `letterSpacing` en `tailwind.config.js`
  - Mejora la consistencia y funcionalidad de los estilos tipográficos del componente

## [1.2.19] - 2026-01-XX

### Added
- **Text - Sistema de Tipografía Completo**: Nuevo sistema de componentes de tipografía para estilos consistentes
  - Nuevo componente `Text` principal que actúa como wrapper para diferentes tipos de texto
  - Nuevos componentes individuales: `Title`, `Body`, `Caption`, `Code`, y `CustomText`
  - Soporte para tipos: `'title'`, `'body'`, `'caption'`, `'code'`
  - Soporte para tamaños específicos por tipo (h1, h2, h3 para Title; xs, sm, md, lg para Body, etc.)
  - Soporte para tamaños base: `'2xs'`, `'xs'`, `'sm'`, `'md'`, `'lg'`, `'xl'`, `'2xl'`, `'3xl'`, `'4xl'`, `'5xl'`
  - Soporte para pesos de fuente: `'regular'`, `'medium'`, `'semibold'`, `'bold'`
  - Nueva prop `textColor` para colores del sistema de diseño: `'primary'`, `'secondary'`, `'tertiary'`
  - Prop `color` para colores CSS personalizados
  - Prop `as` para especificar el elemento HTML a renderizar
  - Clases de Tailwind configuradas para todos los tamaños y variantes
  - Stories completas que demuestran todos los componentes y variantes
  - Exportación de tipos: `TextProps`, `TextType`, `TextSize`, `TextWeight`, `TitleSize`, `BodySize`, etc.
- **Tailwind - Clases de Tamaño Base para Tipografía**: Agregadas nuevas clases de tamaño base en la configuración de Tailwind
  - Nuevas clases de tamaño: `ui-text-2xs`, `ui-text-xs`, `ui-text-sm`, `ui-text-md`, `ui-text-lg`, `ui-text-xl`, `ui-text-2xl`, `ui-text-3xl`, `ui-text-4xl`, `ui-text-5xl`
  - Patrón regex para coincidencia de clases de tamaño base
  - Integración con el sistema de tipografía para mayor flexibilidad
- **Modal.Image - Soporte para Aspect Ratio**: Nueva prop `aspect` para controlar la proporción del contenedor de la imagen
  - Nueva prop `aspect` con valores: `'square'` (1:1), `'video'` (16:9), `'portrait'` (3:4), `'landscape'` (4:3), `'none'` (sin aspect ratio)
  - El aspect ratio solo se aplica cuando `thumbnailSize="auto"` y `aspect !== 'none'`
  - Mapeo automático de valores a clases de Tailwind CSS (`ui-aspect-square`, `ui-aspect-video`, etc.)
  - Nueva story `DifferentAspectRatios` que demuestra todos los valores disponibles
- **Modal.Image - Animaciones Suaves**: Agregadas animaciones de entrada y salida para la imagen expandida
  - Animación `fadeInScale` para la apertura (fade-in con ligero scale)
  - Animación `fadeOutScale` para el cierre (fade-out con ligero scale)
  - Animación `fadeIn` para el overlay de blur
  - Animación `fadeOut` para el overlay de blur al cerrar
  - Duración de animaciones: 300ms con easing `ease-in-out`
  - El botón de cerrar aparece con un delay de 0.1s para mejor UX
- **Modal.Image - Blur Overlay con Delay**: Agregado overlay con efecto blur que aparece después de abrir la imagen
  - Overlay con `backdrop-blur-md` y `bg-black/20` que cubre solo el ModalBody
  - El blur aparece 200ms después de que se abre la imagen (configurable)
  - El blur desaparece suavemente cuando se cierra la imagen
- **Modal.Image - Soporte para Tabs**: La imagen expandida se cierra automáticamente al cambiar de tab
  - Integración con el sistema de tabs del Modal
  - Detección automática de cambios de tab mediante el contexto del Modal
  - Cierre suave con animación cuando se detecta un cambio de tab
- **Modal - Rastreo de Tab Actual**: Agregado soporte para rastrear el tab actual en el contexto
  - Nueva propiedad `currentTab` en `ModalContextType` que expone el tab activo actual
  - El `ModalProvider` mantiene el estado del tab actual y lo actualiza automáticamente
  - Wrapper `handleChangeTab` que actualiza el estado interno y llama al `onChangeTab` original
- **Icon - Nuevos Iconos de Font Awesome**: Agregados iconos de expandir/contraer de Font Awesome
  - Agregado `faUpRightAndDownLeftFromCenter` (expandir) y `faDownLeftAndUpRightToCenter` (contraer) a la configuración
  - Mapeo agregado: `OutlineUpRightAndDownLeftFromCenterIcon` y `OutlineDownLeftAndUpRightToCenterIcon`
  - Mapeo agregado: `FillUpRightAndDownLeftFromCenterIcon` y `FillDownLeftAndUpRightToCenterIcon`
  - `Modal.Image` ahora usa estos iconos directamente desde Font Awesome
- **Stories - Nuevas Historias para Modal.Image**: Agregadas nuevas historias de Storybook
  - `DifferentAspectRatios`: Demuestra todos los valores de aspect ratio disponibles
  - `ModalWithTabs`: Ejemplo de modal con tabs que muestra cómo la imagen se cierra al cambiar de tab
  - Actualización de `DifferentModalSizes` para incluir ejemplo con aspect ratio

### Changed
- **Modal.Image - Mejoras en Posicionamiento**: Mejoras en el posicionamiento de la imagen expandida
  - La imagen expandida ahora se posiciona correctamente relativo al ModalBody usando `position: relative`
  - El botón de cerrar está posicionado en la misma posición relativa que el botón de abrir (esquina superior derecha)
  - Mejoras en el centrado de la imagen dentro del contenedor expandido
- **Modal.Image - Comportamiento del Thumbnail**: Cambios en el comportamiento del thumbnail según el tamaño
  - Para `thumbnailSize="auto"`: Sin efecto de scale en hover, botón en esquina superior derecha
  - Para otros tamaños (sm, md, lg, xl): Mantiene efecto de scale en hover, botón centrado con overlay
  - Mejoras en la visibilidad del botón de expansión
- **Switch - Soporte para Valores Controlados**: Mejoras en el componente Switch para responder a cambios externos
  - Agregado `useEffect` para actualizar el valor seleccionado cuando cambia `defaultValue`
  - El Switch ahora se actualiza correctamente cuando el valor cambia desde fuera del componente
  - Mejora la integración con el sistema de tabs del Modal

### Fixed
- **Title - Elemento HTML por Defecto**: Corrección del elemento HTML por defecto para tamaños base
  - El componente `Title` ahora usa `h3` como elemento por defecto en lugar de `h1` para tamaños base
  - Mejora la semántica HTML y la jerarquía de títulos
- **Modal.Image - Corrección de Tipos TypeScript**: Corrección en validación de tipos para `Math.abs()`
  - Agregada validación explícita de tipos antes de usar `Math.abs()` para evitar errores de TypeScript
  - Verificación de que los valores no sean `null` antes de realizar cálculos matemáticos

## [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
- **Table - Callback para Sincronización de Edición Externa/Interna**: Nueva prop `onEditingRowIdsChange` para sincronizar el control externo con las acciones internas
  - Nueva prop `onEditingRowIdsChange` callback que permite sincronizar el estado externo con las acciones internas de la tabla
  - Los botones de edición/guardar internos ahora notifican al padre a través de `onEditingRowIdsChange`
  - Control externo e interno ahora funcionan en paralelo: botones externos actualizan `editingRowIds`, botones internos llaman a `onEditingRowIdsChange`
  - Modificado el hook `useTableEdit` para aceptar objeto de opciones con `externalEditingRowIds` y `onEditingRowIdsChange`
  - Actualizada story `ControlExternoEdicion` para demostrar el uso del nuevo callback
  - Ejemplo de uso: `<Table editingRowIds={ids} onEditingRowIdsChange={setIds} />`

## [1.2.16] - 2026-01-07

### Fixed
- **Table - Paginación Externa Mejorada**: Corrección en la lógica de paginación cuando se usa búsqueda y filtros externos
  - La paginación ahora detecta correctamente cuando la búsqueda y filtros son externos (`internalSearch` e `internalFilters`)
  - Si ambos (búsqueda y filtros) son externos, la paginación también se comporta como externa
  - Corrección en el cálculo del total de páginas cuando se proporciona `paginationConfig.total`
  - La paginación interna solo se aplica cuando todo el flujo es interno
  - Mejora en las dependencias del `useMemo` para evitar recálculos innecesarios

## [1.2.15] - 2026-01-07

### Added
- **Table - Control Externo de Edición**: Nueva prop para controlar el modo edición desde fuera del componente
  - Nueva prop `editingRowIds` en `TableProps` que acepta un array de IDs de filas para activar modo edición
  - Permite controlar múltiples filas en modo edición simultáneamente desde fuera del componente
  - Útil para acciones en lote o control centralizado del estado de edición
  - Cuando se proporciona `editingRowIds`, el estado interno de edición se sincroniza con los IDs externos
  - Los botones de edición/guardar en la columna de acciones reflejan correctamente el estado controlado externamente
  - Modificado el hook `useTableEdit` para aceptar IDs externos y sincronizar el estado interno
  - Nueva story `ControlExternoEdicion` que demuestra cómo usar esta funcionalidad con botones externos de UI
- **ProgressBar - Prop `countdown` para Cuenta Regresiva**: Nueva funcionalidad integrada en el componente
  - Nueva prop `countdown` que acepta un número en segundos para activar la animación de cuenta regresiva
  - La barra anima automáticamente desde el valor de `progress` hasta 0% en el tiempo especificado
  - Nueva prop `onCountdownComplete` callback que se ejecuta cuando la cuenta regresiva llega a 0
  - Hook interno `useCountdown` que usa `setInterval` con `performance.now()` para timing preciso (~60fps)
  - La transición CSS se desactiva automáticamente cuando `countdown` está activo para animación suave
  - Story "Cuenta Regresiva" actualizada para demostrar el uso de las nuevas props
  - Ejemplo de uso: `<ProgressBar progress={75} countdown={5} onCountdownComplete={() => alert('¡Listo!')} />`
- **Alert/Toast - Mejora en Barra de Progreso con Cuenta Regresiva**: Integración con la nueva prop `countdown` del ProgressBar
  - El componente `Alert` ahora usa la prop `countdown` del ProgressBar para animación suave
  - Conversión automática de `duration` (ms) a `countdown` (segundos): `countdown={duration / 1000}`
  - La barra solo se muestra cuando `duration > 0`
  - El color de la barra coincide automáticamente con el color del alert
  - `ToastItem` ahora pasa correctamente la prop `duration` al `Alert`
  - Story "Duración Personalizada" actualizada con duraciones explícitas (2s, 5s, 10s, permanente)

### Changed
- **Table - Reorganización y Mejora de Stories**: Mejoras significativas en la organización y documentación de las historias de Storybook
  - Reorganización completa de todas las 29 historias en orden alfabético para facilitar la navegación
  - Traducción de todos los nombres de historias al español para consistencia con el proyecto
  - Conversión de todas las historias para usar el componente `StoryBox` con estructura consistente
  - Adición de ejemplos de código (`StoryBox.Code`) en todas las historias para mejor documentación
  - Eliminación de propiedades `name` redundantes en favor de `StoryBox.Title`
  - Corrección de errores de sintaxis JSX en historias que no cerraban correctamente los componentes
  - Mejora en la consistencia del diseño y distribución de todas las historias
  - Todas las historias ahora siguen el mismo patrón: `StoryBox.Title`, `StoryBox.Description`, `StoryBox.Content`, y `StoryBox.Code`
  - Historia ahora sigue el mismo patrón que las demás historias

### Fixed
- **ProgressBar - Transiciones CSS Controladas**: Corrección del comportamiento de transiciones en `BarProgress`
  - La clase `ui-transition-all` ahora solo se aplica cuando `duration > 0`
  - Se añade `transition: 'none'` explícitamente cuando `duration === 0` para desactivar transiciones CSS
  - Esto permite animaciones controladas por JavaScript sin interferencia de transiciones CSS
  - Mejora significativa en la precisión de animaciones de cuenta regresiva y actualizaciones en tiempo real

## [1.2.14] - 2026-01-06

### Added
- **PickerColor Component**: Nuevo componente completo para selección de colores
  - Componente `PickerColor` para seleccionar colores en formato hexadecimal
  - Componentes `ColorInput`, `ColorPalette`, y `ColorSwatch` para selección visual de colores
  - Integración con almacenamiento de colores recientes usando localStorage para comodidad del usuario
  - Soporte para EyeDropper API para seleccionar colores desde la pantalla
  - Funciones utilitarias para validación y conversión de colores (hex, RGB, HSL)
  - Stories completas para el componente PickerColor que demuestran varios casos de uso y configuraciones
- **Toast/Alert - Barra de Progreso con Duración**: Nueva funcionalidad para mostrar barra de progreso en toasts y alerts
  - Nueva prop `duration` en `IAlert` y `ToastProps` para definir la duración del toast/alert
  - Barra de progreso que se muestra en la parte inferior del alert cuando hay duración definida
  - El progreso retrocede de 100% a 0% mientras pasa el tiempo, mostrando el tiempo restante
  - El toast/alert se cierra automáticamente cuando el progreso llega a 0%
  - La barra de progreso solo se muestra si `duration` está definida y es mayor a 0
  - Hook `useProgressBar` que maneja el cálculo del progreso usando `requestAnimationFrame` para animación suave
  - Sincronización entre el cierre automático del toast y la barra de progreso
  - Actualizada la historia "DuraciónPersonalizada" para demostrar la funcionalidad de la barra de progreso
  - Agregados ejemplos con diferentes duraciones (2s, 5s, 10s) en la historia "Colores"
- **Table - Validación de Celdas Editables**: Sistema de validación para celdas editables en tablas
  - Nueva prop `errorCursor` en componente Input para indicar visualmente errores con cursor rojo y borde
  - Validación automática basada en el tipo de columna (`number`, `numeric`, `text`)
  - Prevención de entrada de caracteres inválidos en columnas numéricas
  - Cursor parpadeante en color danger cuando hay error de validación
  - Borde y fondo en color danger cuando hay error de validación
  - Nueva story `ValidationTable` que demuestra la funcionalidad de validación en celdas editables
- **Table - Búsqueda Interna Configurable**: Mejora en el manejo de búsqueda interna vs externa
  - Nueva prop `internalSearch` en `TableToolbarConfig` para controlar si se aplica búsqueda interna (por defecto: `false`)
  - Cuando `internalSearch` es `false` y hay `onSearch` definido, solo se emite el evento sin aplicar búsqueda interna
  - Evita mostrar resultados intermedios de búsqueda interna cuando hay búsqueda externa asíncrona
  - Mejora en la experiencia de usuario al evitar parpadeos de resultados durante búsquedas externas
- **Table - Actualización Batch de Visibilidad de Columnas**: Mejora en el guardado de configuración en localStorage
  - Nuevo método `updateMultipleColumnVisibility` en `useTableConfig` para actualizar múltiples columnas de una vez
  - Prevención de sobreescrituras en localStorage cuando se cambian múltiples columnas simultáneamente
  - Modificación en `TableToolbar` para usar actualización batch cuando hay múltiples cambios de visibilidad
  - Nueva prop `onMultipleColumnVisibilityChange` en `TableToolbar` para manejar cambios batch
  - Corrección del problema donde solo se guardaba el último checkbox marcado en localStorage
- **TableSelectionBar - Iconos Mejorados**: Mejora en el renderizado de iconos en acciones de selección
  - Los iconos ahora se muestran correctamente cuando hay `label` e `icon` en las acciones
  - Uso de `slotLeft` para iconos cuando hay label, permitiendo mostrar icono y texto juntos
  - Soporte mejorado para iconos de tipo string (`'EditOutlined'`) y Font Awesome (`faCopy`)

### Changed
- **Toast - Message Opcional**: La prop `message` ahora es opcional en `ToastInput`
  - Cambiado el tipo `ToastInput` de `string | (ToastOptions & { message: string })` a `string | (ToastOptions & { message?: string })`
  - Permite crear toasts solo con `title` sin necesidad de incluir `message`
  - Si no se proporciona `message`, se usa una cadena vacía por defecto

### Fixed
- **Table - Guardado en localStorage**: Corrección de sobreescrituras en localStorage
  - Solucionado el problema donde múltiples cambios de visibilidad de columnas causaban sobreescrituras
  - Ahora todos los cambios de visibilidad se guardan correctamente en una sola operación batch
  - Mejora en la persistencia de configuración de columnas
- **Icon - Comparación con 'xl' en LegacyIcon**: Corrección de error de TypeScript
  - Eliminada la comparación innecesaria con `'xl'` en `getPaddingClass` ya que `VisualSize` no incluye `'xl'`
  - Simplificada la lógica para solo convertir `'xxs'` a `'xs'` cuando es necesario
- **PickerColor - Importación de InputRef**: Corrección de importación incorrecta
  - Cambiada la importación de `InputRef` de `@/modules/Input` a `@/shared/types/input`
  - Agregadas las propiedades faltantes `clear` y `getInputElement` al objeto retornado por `useImperativeHandle` en `ColorInput`

## [1.2.13] - 2025-01-22

### Added
- **Avatar - AvatarStack Component**: Nuevo componente para mostrar múltiples avatares apilados con efecto de superposición
  - Nueva prop `stack` que acepta un array de avatares para mostrar en formato apilado
  - Detección automática de tipo: si un avatar tiene `src`, automáticamente se usa `type='people'` sin necesidad de especificarlo
  - Prop `maxVisible` para limitar el número de avatares visibles, mostrando un contador automático con el número restante (ej: "+5")
  - Props `counterColor` y `counterTheme` para personalizar el avatar contador cuando se excede `maxVisible`
  - Prop `stroke` para agregar borde a todos los avatares del stack (incluyendo el contador)
  - Márgenes negativos automáticos según el tamaño del avatar para crear el efecto de superposición
  - Padding derecho proporcional al tamaño para compensar el espacio de los márgenes negativos
  - Nueva story `AvatarStack` que demuestra diferentes variaciones: stack con imágenes, stack mixto, stack con letras, stack con contador, y stack con límite máximo
  - Soporte para todos los tamaños de avatar (xxs, xs, sm, md, lg, xl)
  - Tipos flexibles `AvatarStackItem` que permiten pasar avatares sin especificar `type` cuando tienen `src`

### Fixed
- **Modal - Border-radius cuando footer está oculto**: Mejora en el manejo del border-radius del body cuando el footer está oculto
  - El `ModalBody` ahora aplica `ui-rounded-b-lg` cuando `hideFooter={true}` para mantener el mismo border-radius que tendría el footer
  - El `ModalFooter` también tiene `ui-rounded-b-lg` para mantener consistencia visual
  - Integración de `hideFooter` en el contexto del Modal para que esté disponible en todos los componentes hijos
  - Mejora en la experiencia visual cuando el footer está oculto, manteniendo el border-radius correcto en la parte inferior del modal

## [1.2.12] - 2025-01-16

### Added
- **Modal - Prop hideFooter**: Nueva prop `hideFooter` que permite forzar que no aparezca el footer del modal, sin importar qué otras props estén activas
  - La prop `hideFooter` tiene prioridad sobre todas las demás props relacionadas con el footer
  - Útil cuando se necesita ocultar el footer incluso si hay botones de cancelar o éxito configurados
  - Nueva story `HideFooter` que demuestra el uso de esta funcionalidad
- **Badge - Color Personalizado**: Nueva funcionalidad para la prop `customColor` que permite usar un color hexadecimal o un color fijo que sobrescribe el color por defecto
  - La prop `customColor` se aplica mediante estilos inline que tienen mayor especificidad que las clases CSS
  - Soporte para colores hexadecimales (`#FF0000`, `#0066FF`, etc.), colores RGBA (`rgba(255, 99, 71, 0.3)`), y nombres de color CSS
  - En theme `solid`: usa el color personalizado como `backgroundColor` y el texto en blanco
  - En theme `soft`: usa el color personalizado como `backgroundColor` y como `color` de texto
  - Si `stroke` está activo, también aplica el color personalizado al `borderColor`
  - Nueva story `CustomColor` que demuestra el uso de colores personalizados en diferentes configuraciones
- **Icon - Padding mejorado**: Mejora en la prop `padding` del componente Icon
  - Agregados nuevos valores de padding: `'xl'` y `'2xl'` para mayor flexibilidad de layout
  - Actualizada la lógica de manejo de background para aplicar padding condicionalmente según la presencia de un fondo
  - Mejora en la consistencia del espaciado interno del icono
- **Popup - Prop stopPropagationList**: Nueva prop para controlar la propagación de eventos
  - Prop `stopPropagationList` que controla si se detiene la propagación de eventos de click dentro del popup (por defecto `true`)
  - Permite que los clicks en items de lista dentro del popup no se propaguen al contenedor padre
  - Útil cuando el popup contiene listas y se necesita evitar que los clicks en items activen eventos del contenedor
- **List/ListItem - Hover rojo mejorado**: Mejora en el estado hover para items de lista con color rojo
  - Cambio en el hover de items con `color="red"` de `hover:ui-bg-surface-danger hover:ui-text-danger` a `hover:ui-bg-fill-danger-hover hover:ui-text-on-color`
  - Mejora la experiencia visual para acciones destructivas o de advertencia mostrando fondo rojo con texto blanco en hover
  - Eliminado el gap vertical (`gap-y-8`) de la lista para mejor control del espaciado
- **Filters - Props theme y color**: Nuevas props para personalización del componente Filters
  - Agregadas props `theme` (por defecto `'solid'`) y `color` (por defecto `'secondary'`) al componente Filters
  - La prop `color` se pasa automáticamente al componente Popup interno para mantener consistencia visual
  - Permite mayor personalización del aspecto visual del popup de filtros

## [1.2.11] - 2025-01-16

### Added
- **Table - IconCell con Lightbox Integrado**: Nueva funcionalidad para el tipo de celda 'icon' con lightbox integrado
  - El `IconCell` ahora soporta lightbox integrado que se abre automáticamente al hacer clic en el icono
  - El accessor puede retornar un objeto `IconCellConfig` con las siguientes propiedades:
    - `icon`: `VisualSlotType` - Icono a mostrar (string o Font Awesome icon)
    - `color?`: `IconFontColor` - Color del icono (opcional, por defecto 'tertiary')
    - `images?`: `string | string[] | ILightboxImage | ILightboxImage[]` - URL string, array de URLs, o array de objetos ILightboxImage
    - `displayMode?`: `ImageDisplayMode` - Modo de visualización del lightbox ('fullWidth' o 'square', opcional)
    - `className?`: `string` - Clases CSS adicionales (opcional)
  - Soporte para URL string o array de imágenes (usa la primera imagen si es un array)
  - El lightbox se renderiza dentro del componente `IconCell`, sin necesidad de estado externo
  - Soporte para `contentAlign` en `IconCell` para alinear el contenido ('left', 'center', 'right')
  - Nueva story `WithLightbox` que demuestra el uso del IconCell con lightbox integrado

## [1.2.10] - 2025-12-16

### Fixed
- **Tailwind CSS**: Consistencia en todas las definiciones de `DEFAULT` y `default`
  - Agregado `default:` después de cada `DEFAULT:` en todo `tailwind.config.js` para mantener consistencia
  - Actualización de todas las secciones: `textColor`, `icon`, `backgroundColor`, `borderColor`, y `fill`
  - Permite usar ambas variantes de clases de Tailwind CSS (`-DEFAULT` y `-default`) en todo el sistema de diseño
  - Total de 43 pares `DEFAULT`/`default` actualizados para soportar ambas convenciones de nomenclatura

## [1.2.9] - 2025-12-16

### Fixed
- **Tailwind CSS**: Corrección de clases de border para usar minúsculas
  - Actualización de `tailwind.config.js` para incluir `default: 'var(--ui-color-border-default)'` en `borderColor`
  - Cambio de clases de border de mayúsculas (`border-DEFAULT`) a minúsculas (`border-default`) en `cellStyles.ts` y `TableToolbar.tsx`
  - Verificación de que las clases `ui-border-default`, `ui-border-b-default`, y `ui-border-r-default` se generan correctamente en el CSS de distribución

## [1.2.8] - 2025-12-16

### Added
- **Table**: Nueva prop `contentAlign` en `ColumnConfig` para controlar el alineamiento horizontal del contenido en las celdas
  - Valores disponibles: `'left'` (por defecto), `'center'`, `'right'`
  - Función helper `getContentAlignClass()` en `cellStyles.ts` para generar las clases CSS correspondientes
  - Soporte implementado en todos los componentes de celdas: `TableCell`, `DateCell`, `PrimaryCell`, `LinkCell`, `TextFieldCell`, `DropdownCell`, `ButtonCell`, `StatusCell`, `ProgressBarCell`, `TagsCell`, `SkeletonCell`
  - Nueva story `ContentAlignment` en Table.stories.tsx que demuestra el uso de los diferentes alineamientos

## [1.2.7] - 2025-12-16

### Added
- **CHANGELOG**: Archivo completo con historial de cambios desde la versión 1.0.0
- **package.json**: Inclusión de `CHANGELOG.md` y `README.md` en el campo `files` para publicación en npm
- **package.json**: Agregado campo `repository` y `changelog` para mejor integración con npm

## [1.2.6] - 2025-12-16

### Added
- **Iconos Duotone**: Soporte completo para iconos Font Awesome Duotone con colores personalizados
  - Nuevas props `colorDuotonePrimary`, `colorDuotoneSecondary`, `opacityDuotonePrimary`, `opacityDuotoneSecondary` en múltiples componentes
  - Soporte en: `Icon`, `IconFont`, `Button`, `InnerButton`, `Input`, `Badge`, `Visual`, `Toggle`, `AlertDialog`, `Drawer`, `Modal`, `Title`, `ProgressBar`, `List`
  - Diccionario de colores `DUOTONE_COLORS` que mapea colores del sistema de diseño a variables CSS
  - Stories actualizadas para mostrar ejemplos de iconos duotone

### Fixed
- **TypeScript**: Corrección de tipos para iconos Font Awesome
  - Actualización de tipos para aceptar `AnyIconDefinition` (incluye `IconProp`, `IconDefinition` y objetos personalizados)
  - Eliminación de `as any` en favor de tipos correctos
  - Corrección de tipos en `AlertDialog`, `Modal`, `Toggle`, `Input`, `Badge`, `Table`, `Visual`
- **Table**: Corrección de z-index de columnas bloqueadas para que estén por debajo del Lightbox (z-40 vs z-50)
- **Input**: Corrección de tipos para `leftSlot` aceptando `VisualSlotType | null`
- **Dropdown**: Actualización para usar `columnOptions` en lugar de `options` en `DropdownCell`
- **Table**: Corrección de tipos en `EmptyState` para que `title` sea opcional
- **Tests**: Corrección de tipos en tests (`textfield` vs `textField`, `progressbar` vs `progressBar`, `destructive` vs `danger`)
- **Header**: Corrección de import de `Filter` desde `@/shared/types/header`

### Changed
- **IconFont**: Mejora en el manejo de estilos para iconos duotone usando variables CSS del sistema de diseño
- **Table**: Actualización de tipos para aceptar iconos Font Awesome en acciones y selección

## [1.2.5] - 2025-12-15

### Fixed
- **Icon Handling**: Mejora en el manejo de iconos y definiciones de tipos para mayor flexibilidad
- **Badge**: Actualización de clase de color success para consistencia
- **teams.api**: Eliminación de import redundante y optimización de lógica de conversión de filtros
- **Input**: Actualización de tamaño de `leftSlot` de 'xs' a 'xxs' para mejor renderizado de iconos
- **Dropdown, Input**: Mejora en el manejo de iconos y funcionalidad de slots

### Changed
- **Text Colors**: Actualización de clases de color de texto para usar color primario y mejor consistencia

## [1.2.4] - 2025-12-15

### Fixed
- **IconFont, List**: Actualización del manejo de colores en IconFont y refactorización del componente List
- **LegacyIcon, StrapiFilter**: Actualización de estilos en LegacyIcon y mejora de definiciones de tipos en StrapiFilter
- **Button, Icon**: Eliminación de estado disabled en Button y adición de handler onClick en Icon
- **Button, InnerButton, Icon**: Actualización de estados de botones y mejora en el manejo de clases

### Added
- **List**: Nueva prop `padding` en componente List y actualización de estilos en ListUserList
- **Filters, Header**: Nueva prop `size` en componente Filters y actualización de integración con Header

## [1.2.3] - 2025-12-05

### Added
- **Table**: Integración con TanStack Query para mejor gestión de datos
- **TableToolbar**: Tooltip para botón de configuración de columnas
- **Table**: Mejoras en CellRenderer y HeaderCell para mejor edición y layout
- **Table**: Mejora en el manejo de estados vacíos y actualización de mensajes UI
- **Table**: Tests comprehensivos para varios componentes de celdas de tabla
- **Table**: Mejora del framework de testing y nuevas funcionalidades de tabla
- **DateCell**: Nuevo componente DateCell para mejor renderizado de fechas en tablas
- **Table**: Implementación de persistencia de configuración y mejora en el manejo de estados

### Fixed
- **FilterList, FilterPopup**: Actualización de etiquetas de filtros para claridad y mejora de aserciones en tests
- **ProgressBar**: Actualización de color de botón de secondary a tertiary
- **Pagination, FilterPopup, index.css**: Actualización de lógica de paginación, icono de botón clear y transiciones CSS

### Changed
- **Icon, Emoji, Popup**: Optimización de props de componentes y mejora de estilos
- **ProgressBar, InnerProgressBar**: Consolidación de componentes de progreso y mejora de funcionalidad
- **Table components**: Mejora en estilos de celdas y manejo de colores de texto
- **FilterCard, TableToolbar**: Mejora en el manejo de descripciones de filtros
- **List component**: Mejora en estilos de ListItem y manejo de estados
- **IconFont, Input, List components**: Mejora en estilos y accesibilidad
- **List components**: Actualización de estilos y mejora de consistencia en varios items de lista
- **Styling updates**: Estandarización de estilos de texto en componentes
- **List components**: Actualización de estilos y reemplazo de DragHandleIcon con icono FontAwesome
- **TableToolbar**: Mejora en el manejo de acciones personalizadas con soporte adicional de botones
- **Table components**: Mejora en el renderizado de celdas con soporte de columnas sticky
- **IconFont, InnerButton, TableToolbar**: Mejora en el manejo de iconos e introducción de variante de color link
- **Icon usage**: Reemplazo de iconos estáticos con iconos FontAwesome para mejor consistencia
- **Icon components, Table, HeaderCell**: Mejora en el uso de iconos y manejo de colores
- **IconFont, InnerButton, Table components**: Mejora en el manejo de colores de iconos y consistencia
- **HeaderCell**: Reemplazo de iconos estáticos con iconos FontAwesome para mejor consistencia
- **Tailwind, IconFont, Textarea**: Actualización de colores de iconos y configuraciones para mejor consistencia
- **AlertHeader, Tag, Pagination, Lightbox, DatePicker**: Reemplazo de iconos estáticos con iconos FontAwesome
- **Dropdown, Input, ModalHeader**: Actualización de manejo de iconos y ajustes de tamaño para consistencia
- **Button, ButtonGroup, InnerButton, Visual**: Actualización de manejo de tamaños y descripciones para mejor consistencia
- **Link component**: Actualización de uso de iconos para mejor consistencia visual
- **Badge**: Actualización de mapeo de tamaños de iconos para mejor consistencia
- **AccordionHeader, InnerButton**: Mejora en el manejo de iconos y seguridad de tipos
- **Icon component**: Mejora en el renderizado de iconos e introducción de soporte de padding
- **FilterIcon**: Nuevo componente FilterIcon para renderizado dinámico de iconos
- **UI components**: Actualización de manejo de iconos y mejora de definiciones de tipos
- **UI components**: Actualización de estilos de texto para consistencia y claridad

## [1.2.2] - 2025-11-27

### Added
- **Table**: Nueva barra de selección (TableSelectionBar) para funcionalidad de selección mejorada
- **DatePicker**: Nueva prop `size` en DateInput y DatePicker para mejor personalización
- **Input, StoryBox**: Mejora en componente Input con color de icono derecho y stories de prop 'pill'
- **Icon, Lists**: Mejora en el manejo de iconos y componentes de lista
- **Dropdown, Input**: Introducción de prop 'pill' para estilos personalizables
- **Table**: Mejora en funcionalidad de tabla con acciones editables y columnas de auto-redimensionamiento
- **Table**: Mejora en story RealData con celdas editables y gestión de estado
- **Input, Pagination**: Mejora en componente Input y actualización de estilos de paginación
- **Pagination**: Cálculo de tamaño de página mínimo y actualización de visibilidad del selector de tamaño de página
- **Table**: Botón de acción personalizado en toolbar
- **Table**: Mejora en funcionalidad de tabla con celdas editables y soporte de tags
- **Table**: Implementación de controles de filtro con modos externo e interno
- **Breadcrumbs**: Mejora en componentes Link y Breadcrumbs con estilos mejorados
- **ModalHeader**: Soporte de badge y mejora en estilos de layout

### Changed
- **RadioButtonGroup**: Actualización de tamaño por defecto a 'xs' para consistencia
- **TableToolbar**: Mejora en funcionalidad y estilos de filtros
- **Tooltip**: Actualización de tamaño de flecha y estilos para mejor apariencia
- **Alert components**: Actualización de esquema de colores y mejora de consistencia de tipos
- **Alert component**: Eliminación de progress bar y props de duración para simplificación
- **Alert components**: Mejora en estilos y actualización de tokens semánticos para consistencia
- **Stepper components**: Mejora en estilos y adición de tokens semánticos para consistencia
- **RadioButton, RadioButtonGroup**: Actualización de tamaño por defecto a 'xs' y mejora de estilos para consistencia
- **UI components**: Actualización de clases de color de fondo a 'ui-bg-fill' para consistencia
- **Avatar, Badge, DatePicker, Icon, Lists, RadioButton, Toggle**: Actualización de nombres de clases de border radius a 'ui-rounded-control-pill' para consistencia
- **Popup**: Actualización de nombres de clases de border radius para consistencia
- **Picture**: Actualización de props de tamaño y radio para mejor flexibilidad y consistencia
- **Icon, IconSearch**: Actualización de tamaños de iconos y estilos de header de tabla para consistencia
- **Dropdown, TagsMultiple, List**: Actualización de estilos y mejora de consistencia de componentes
- **Dropdown, Filters, InnerButton, Input, Textarea**: Actualización de prop 'pill' a 'sm' y ajuste de estilos de componentes para consistencia
- **EmojiPicker**: Actualización de dimensiones y estilos para mejor usabilidad
- **Drawer**: Actualización de ancho y padding para mejor layout
- **Card**: Actualización de estilos para mejor layout y consistencia
- **Button, Switch, Visual**: Actualización de texto de botón, ajuste de padding y colores de switch, y modificación de tamaño de icono
- **ModalHeader**: Reemplazo de componente Visual con Icon y actualización de estilos de título
- **Table**: Simplificación de acceso a datos de fila eliminando wrapper 'data'

## [1.2.1] - 2025-11-25

### Added
- **Table**: Mejora en funcionalidad de tabla con acciones editables y columnas de auto-redimensionamiento
- **Table**: Mejora en story RealData con celdas editables y gestión de estado
- **Input, Pagination**: Mejora en componente Input y actualización de estilos de paginación
- **Pagination**: Cálculo de tamaño de página mínimo y actualización de visibilidad del selector de tamaño de página
- **Table**: Botón de acción personalizado en toolbar
- **Table**: Mejora en funcionalidad de tabla con celdas editables y soporte de tags
- **Table**: Implementación de controles de filtro con modos externo e interno

### Changed
- **FilterPopup, TableToolbar**: Actualización de propiedades de popup para mejor funcionalidad

## [1.2.0] - 2025-11-24

### Added
- **Table**: Sistema de filtrado avanzado con operadores lógicos
- **Table**: Implementación de operadores para filtrado avanzado
- **Table**: Sistema de filtrado avanzado y tokens de tipografía
- **Table**: Mejoras en capacidades de filtrado con nuevo operador 'in' y opciones de dropdown
- **Table**: Tabla de datos reales con información detallada de plantillas
- **Table**: Handler onCellChange para mejor edición de celdas
- **Table**: Mejora en funcionalidad de búsqueda interna y paginación
- **Alert, DatePicker, Lists, Wysiwyg**: Actualización de estilos de componentes y mejora de funcionalidad
- **Toggle**: Nuevo componente Toggle con características comprehensivas y documentación
- **Lists**: Componente ListBase unificado con 12 variantes y documentación completa
- **Lists**: Funcionalidad drag and drop para items de lista
- **Table**: Nuevos tipos de celdas para mejor interactividad y documentación
- **Table**: Funcionalidad interactiva de redimensionamiento de columnas
- **Table**: ActionsCell mejorado con acciones por defecto y configuraciones personalizadas
- **Input**: Opción de tamaño 'xs' y actualización de manejo de iconos
- **Textarea**: Props `label` y `fullWidth` para mejor personalización
- **ui/fonts**: Familia de fuentes San Francisco con múltiples pesos y estilos
- **Modal**: Soporte de badge en componente Modal
- **Icon**: Soporte de padding en LegacyIcon
- **ui/tailwind**: Tokens de 'all-colors' y mejora de border-brand
- **ui/tailwind**: Expansión de configuración con tokens de diseño de Figma para spacing y sizing
- **ui/tailwind**: Mejora de configuración con tokens de diseño de Figma

### Changed
- **Table**: Simplificación de acceso a datos de fila eliminando wrapper 'data'
- **Table, package.json, package-lock.json**: Actualización de dependencias y refactorización de componente Table
- **Table, TableToolbar, TagsCell**: Eliminación de console logs y limpieza de código
- **Button, Popup, Separator, Table, TableToolbar**: Actualización de estilos de componentes y funcionalidad
- **TableToolbar**: Actualización de tamaño y estilo de InnerButton
- **Table**: Mejora en experiencia de redimensionamiento de columnas y documentación
- **Table**: Mejora en estilos de header con borde persistente
- **Table**: Mejora en layout de celdas con estilos flex consistentes
- **Table**: Mejora en manejo de acciones y actualización de uso de iconos
- **Table**: Ajuste de tamaño de Avatar y actualización de estilos de celdas
- **ui**: Estandarización de estilos de bordes y mejora de funcionalidad de celdas de tabla
- **Button, InnerButton**: Actualización de componentes para usar nuevos tipos de Button e Icon
- **InnerButton**: Simplificación de variantes y uso de tokens de diseño
- **ui/types**: Actualización de tipos de Button y Visual
- **Tooltip**: Eliminación de prop color y lógica relacionada para simplificación de estilos
- **Alert**: Renombrado de prop 'type' a 'color' para consistencia
- **Toast**: Actualización para usar prop 'color' en lugar de 'type' para mejor claridad y consistencia

## [1.1.1] - 2025-12-05

### Added
- **Table**: Mejoras adicionales en funcionalidad y estilos

## [1.1.0] - 2025-11-24

### Added
- **Table**: Componente Table completamente nuevo con características extensas
- **Table**: Implementación de celdas editables en componente Table para mejor interacción del usuario
- **Table**: Actualización de componentes HeaderCell y EmptyTableState para mejor estilo y funcionalidad
- **Avatar**: Nuevo componente Avatar con múltiples variantes (Icon, Letter, People) y soporte para diferentes estilos
- **Avatar**: Reemplazo de InnerAvatar con nuevo sistema de Avatar
- **Filters**: Módulo Filters con componentes y tipos para funcionalidad de filtrado mejorada
- **Filters**: Componente Filters con hook personalizado para gestión de estado y funcionalidad de aplicación
- **Filters**: Soporte para filtros básicos y avanzados con operadores lógicos
- **DatePicker**: Prop `label` para mejor accesibilidad
- **DatePicker**: Sincronización de estado interno para modo controlado
- **Filters**: Prop `closeOnClickOutside` para mejor interacción del usuario
- **Filters**: Prop `keyName` en interfaz Filter para mejor gestión de estado de filtros
- **Filters**: Soporte para cerrar popup al aplicar y mejora de gestión de estado de filtros
- **useClickOutside**: Opción `disableSameTypeCheck` para mejor manejo de clicks
- **useClickOutside**: Mejora para reconocer componentes interactivos y prevenir cierre
- **Dropdown**: Soporte de checkboxes y input de tags personalizado para mejor experiencia de selección
- **ListItemWithCheckbox**: Nuevo componente ListItemWithCheckbox e integración de soporte de checkbox en List
- **Breadcrumbs**: Nuevo componente Breadcrumbs con renderizado dinámico de links y soporte de truncación
- **Header**: Mejora para soportar aplicación y limpieza de filtros
- **Header**: Expansión de stories con ejemplos comprehensivos de filtros y funcionalidad interactiva
- **TagsMultiple**: Mejora con padding dinámico basado en detección de overflow de tags
- **Spinner**: Nuevo componente Spinner con soporte de animación e integración con Storybook
- **Picture**: Nuevo componente Picture con manejo de imágenes responsivas e integración con Storybook
- **Placeholder**: Nuevo asset SVG Placeholder para mejor representación de UI
- **ui/tailwind**: Utilidades de aspect ratio para dimensiones de video y cuadradas en configuración de Tailwind
- **Tooltip**: Mejora con funcionalidad autoClose y detección de resize
- **Tooltip**: Prop `tooltipAbsolute` en InnerButton para mejor posicionamiento de tooltip
- **Visual**: Soporte de tooltip en componente Visual
- **Popup**: Prop `stopPropagationList` en componente Popup
- **Popup**: Mejora con manejo personalizado de onClick
- **Alert**: Mejora en estilos y funcionalidad de componente Alert
- **Alert, Toast**: Soporte de tamaño en componentes Alert y ToastItem
- **Toast**: Implementación de configuración de tamaño con valor por defecto 'sm'
- **InnerButton**: Mejora de estilos con soporte de estado disabled
- **Modal**: Props `disableCancelButton` y `disableSuccessButton` para mejor control de botones
- **Drawer**: Props de estado disabled para botones success y cancel
- **Title**: Exportación de componente Title desde índice de módulos para mejor accesibilidad
- **Filters**: Reorganización de tipos e interfaces moviéndolos a tipos compartidos para mejor modularidad

### Changed
- **Filters**: Simplificación eliminando manejo global de clicks y actualización de propiedades de popup
- **useDropdown**: Implementación de listener close-all-dropdowns para mejor gestión de dropdowns
- **Dropdown**: Actualización para usar idName en lugar de valueName para identificación de opciones
- **Dropdown**: Simplificación de detección de click fuera y mejora de manejo de eventos
- **Tag**: Actualización para usar prop onClickRightSlot para mejor manejo de clicks
- **Header**: Actualización de opciones de filtro de Tareas con entradas adicionales para mejor funcionalidad
- **Filters**: Actualización de layout ajustando nombres de clases y agregando nuevas props para mejor estilo y funcionalidad
- **Header**: Adición de opciones de selección múltiple al dropdown de filtros del componente Header para mejor gestión de tareas
- **Visual**: Integración de prop fallback en componente Visual para mejor renderizado de avatares
- **ListItem**: Corrección de renderizado de componente Visual en ListItem eliminando llaves innecesarias
- **InnerAvatar**: Mejora con manejo de errores, estados de carga y variantes de tamaño mejoradas
- **Input**: Adición de prop value a componente Input y mejora de lógica de renderizado de slot izquierdo
- **Dropdown**: Actualización de story con opciones de ejemplo reales y ajuste de props para mejor demostración
- **Dropdown**: Actualización de iconos de story para mejor consistencia visual y accesibilidad
- **Drawer**: Integración de componente Dropdown en stories de Drawer y mejora de ListItem con prop fallback para renderizado de iconos
- **Tag**: Reemplazo de ChipProps con TagProps e introducción de definiciones de tipo Tag
- **Badge, Chip**: Actualización de componentes Badge y Chip en README.md para usar nueva sintaxis de componente Tag
- **Tooltip**: Refactorización de componente Tooltip para utilizar hooks personalizados para mejor funcionalidad y lógica de posicionamiento
- **README.md**: Renovación con documentación mejorada de componentes, instrucciones de instalación y resumen de nuevas características
- **Spinner**: Estandarización de estructura de exportación para componente Spinner y sus subcomponentes
- **ui**: Estandarización de declaraciones de exportación y limpieza de formato de código en múltiples componentes
- **Logo**: Eliminación de componente Logo e integración de su funcionalidad directamente en componente Spinner
- **Emoji, Icon**: Actualización de stories de Emoji e Icon para pasar explícitamente prop 'name' para mejor claridad
- **Dropdown**: Limpieza de stories de Dropdown eliminando imports no utilizados de react-hook-form
- **Header**: Actualización de valores de filtros en stories de header para usar identificadores numéricos

### Fixed
- **Filters**: Corrección de comentario en hook useClickOutside para claridad en verificación de tipo de elemento
- **Filters**: Corrección de bug pequeño al actualizar isDnDLocked
- **Filters**: Corrección de problema de arrastre
- **Filters**: Corrección de zIndex de filtros básicos y avanzados y solución de badge de conteo de filtros avanzados
- **Filters**: Corrección de eliminación de entrada de BasicFilters
- **Filters**: Corrección de función getDefaultValueByType para agregar opción de filtro para grupo
- **Table**: Corrección de solapamiento de columnas al redimensionar hacia abajo
- **Table**: Corrección de tamaño por defecto de columna y redimensionamiento de columnas

## [1.0.82] - 2025-11-24

### Added
- **Table**: Mejoras en funcionalidad de tabla

## [1.0.81] - 2025-11-24

### Added
- **Table**: Handler onCellChange para mejor edición de celdas

## [1.0.80] - 2025-11-12

### Added
- **Textarea**: Props `label` y `fullWidth` para mejor personalización
- **Table**: Mejoras en estilos de componente Table

### Changed
- **Storybook**: Eliminación de addon onboarding de configuración de Storybook

### Fixed
- **Avatar**: Uso de icono por defecto cuando falla people avatar

## [1.0.77] - 2025-10-24

### Fixed
- **Switch**: Cambio de variante de 'outlined' a 'button' para mejor estilo

## [1.0.76] - 2025-10-16

### Fixed
- **Stepper**: Actualización de clases de color para mejor estilo
- **Icon, StepIcon, colors**: Actualización de referencias de color y mejora de estilos

## [1.0.75] - 2025-10-16

### Fixed
- **DatePicker**: Ajuste de lógica de posicionamiento y mejora de accesibilidad
- **Filters**: Optimización de lógica de renderizado de filtros y mejora de asignación de keys

## [1.0.74] - 2025-10-16

### Fixed
- **Filters**: Adición de prop fullWidth a Dropdown para mejor layout
- **ModalHeader**: Mejora de estilo de título con clase leading-none para mejor layout
- **InnerButton**: Habilitación de cursor pointer para mejor interacción del usuario
- **Dropdown**: Mejora de gestión de z-index para dropdowns
- **Alert**: Actualización de estilos para componentes Alert

## [1.0.73] - 2025-10-15

### Fixed
- Mejoras menores en estilos y funcionalidad

## [1.0.72] - 2025-10-15

### Fixed
- **Dropdown**: Mejora de manejo de z-index para portales de dropdown

## [1.0.71] - 2025-10-15

### Fixed
- **Input**: Adición de clase box-sizing para estilo consistente de input

## [1.0.70] - 2025-10-13

### Fixed
- **InnerButton**: Actualización de estilo box-sizing para mejor consistencia de layout

## [1.0.69] - 2025-10-13

### Fixed
- **InnerButton**: Actualización de estilo de borde para consistencia y mejora de box-sizing global

## [1.0.68] - 2025-10-02

### Added
- **AlertDialog**: Nuevo componente AlertDialog e integración con UI

## [1.0.67] - 2025-09-30

### Fixed
- **Tooltip**: Actualización de className de componente Tooltip para renderizado adecuado

### Added
- **Visual**: Soporte de tooltip en componente Visual

## [1.0.66] - 2025-09-26

### Added
- **Popup**: Prop `stopPropagationList` en componente Popup
- **Popup**: Mejora con manejo personalizado de onClick

## [1.0.64] - 2025-09-26

### Added
- **Alert**: Mejora en estilos y funcionalidad de componente Alert
- **Alert, Toast**: Soporte de tamaño en componentes Alert y ToastItem
- **Toast**: Implementación de configuración de tamaño con valor por defecto 'sm'

## [1.0.63] - 2025-09-25

### Added
- **InnerButton**: Mejora de estilos con soporte de estado disabled

## [1.0.62] - 2025-09-22

### Added
- **ListItemWithCheckbox**: Mejora de estilos del título de grupo

## [1.0.60] - 2025-09-22

### Fixed
- **Filters**: Corrección de función getDefaultValueByType para agregar opción de filtro para grupo

### Added
- **Dropdown**: Implementación de dropdown con checkboxes y mejoras en sistema de filtros

## [1.0.59] - 2025-09-22

### Added
- **Dropdown**: Implementación de dropdown con checkboxes y mejoras en sistema de filtros

## [1.0.58] - 2025-09-17

### Fixed
- **useClickOutside**: Corrección de comentario para claridad en verificación de tipo de elemento

### Added
- **Header**: Actualización de opciones de filtro de Tareas con entradas adicionales
- **Filters**: Simplificación eliminando manejo global de clicks
- **useDropdown**: Implementación de listener close-all-dropdowns
- **DatePicker**: Sincronización de estado interno para modo controlado
- **Filters**: Mejora con manejo global de clicks para cerrar popups y dropdowns
- **useClickOutside**: Opción disableSameTypeCheck para mejor manejo de clicks
- **Filters**: Prop keyName en interfaz Filter
- **Filters**: Mejora para soportar cerrar popup al aplicar

## [1.0.57] - 2025-09-17

### Added
- **useDropdown**: Implementación de listener close-all-dropdowns
- **DatePicker**: Sincronización de estado interno para modo controlado
- **Filters**: Mejora con manejo global de clicks para cerrar popups y dropdowns
- **useClickOutside**: Opción disableSameTypeCheck para mejor manejo de clicks
- **Filters**: Prop keyName en interfaz Filter
- **Filters**: Mejora para soportar cerrar popup al aplicar

## [1.0.56] - 2025-09-17

### Added
- **Emoji, Icon**: Actualización de stories para pasar explícitamente prop 'name'
- **Filters**: Prop keyName en interfaz Filter
- **Filters**: Mejora para soportar cerrar popup al aplicar

## [1.0.55] - 2025-09-15

### Added
- **Filters**: Prop closeOnClickOutside para mejor interacción del usuario
- **useClickOutside**: Mejora para reconocer componentes interactivos y prevenir cierre
- **DatePicker**: Prop label para mejor accesibilidad
- **Filters**: Reorganización de tipos e interfaces moviéndolos a tipos compartidos

### Changed
- **Filters**: Limpieza de stories de Dropdown eliminando imports no utilizados
- **Header**: Actualización de valores de filtros en stories de header para usar identificadores numéricos

## [1.0.53] - 2025-09-15

### Added
- **Font Awesome Pro**: Implementación completa de Font Awesome Pro, incluyendo migración de iconos, optimización del bundle y validación exitosa
- **Table**: Redimensionamiento de columnas con doble click
- **Table**: Icono de arrastre para redimensionamiento de columnas
- **Filters**: Funcionalidad de click fuera para Config, BasicFilters y AdvancedFilters
- **Filters**: Campos de array probados
- **Filters**: Campos de fecha probados
- **Filters**: Campos de texto probados
- **Filters**: Filtros básicos establecidos y desestablecidos

## [1.0.52] - 2025-09-15

### Added
- **Filters**: Módulo Filters con componentes y tipos para funcionalidad de filtrado mejorada
- **Title**: Exportación de componente Title desde índice de módulos

## [1.0.51] - 2025-09-09

### Added
- **Modal**: Props disableCancelButton y disableSuccessButton para mejor control de botones
- **ui/fonts**: Fuente Marope agregada

### Fixed
- **Table**: Filtros avanzados con toggle de visibilidad de campos dependientes
- **Table**: Modal de acciones de fila seleccionada correctamente centrado
- **Table**: zIndex 10 para columnas no fijadas, de lo contrario zIndex
- **Table**: zIndex negativo para columnas no fijadas
- **Table**: Popper de acciones de filas seleccionadas
- **Table**: Selección de filas, todas y parcial
- **Table**: Selección inicial de filas
- **Table**: Dropdown de Datepicker con 3 operadores agregados
- **Table**: Ordenamiento
- **Table**: Badges de fecha en AdvancedFilters
- **Table**: Badges de lista en AdvancedFilters
- **Table**: Badges de número en AdvancedFilters
- **Table**: Badges de string en AdvancedFilters
- **Table**: AdvancedFilters agregando items de filtro mostrando solo el dropdown de Operador
- **Table**: Filtros avanzados llenando campos de entradas de filtro al reabrir modal AdvancedFilters
- **Table**: Filtros avanzados actualizando badge de conteo y botón de limpieza
- **Table**: Actualizando objeto de filtros en estado al hacer click en botón 'Aplicar' solamente
- **Table**: Mostrando etiquetas de filtro y texto clear solo con length de filtros > 0
- **Table**: BasicFilters completado
- **Table**: Funcionalidad de badge de textSearch
- **Table**: Badge de filtro textSearch funcionando
- **Table**: Sección de filtros activos funcionando

## [1.0.50] - 2025-09-04

### Changed
- **Toast**: Actualización para usar prop 'color' en lugar de 'type'
- **Alert**: Renombrado de prop 'type' a 'color'

## [1.0.49] - 2025-09-03

### Added
- **Spinner**: Exportación de componente Spinner desde índice de módulos

### Fixed
- **Lists**: Corrección de bug pequeño al actualizar isDnDLocked
- **Lists**: Corrección de problema de arrastre

## [1.0.48] - 2025-09-02

### Added
- **Drawer**: Props de estado disabled para botones success y cancel
- **Dropdown**: Actualización de story con opciones de ejemplo reales
- **Visual**: Integración de prop fallback
- **Input**: Adición de prop value
- **InnerAvatar**: Mejora con manejo de errores y estados de carga

### Fixed
- **Visual**: Corrección de renderizado de componente Visual en ListItem
- **Dropdown**: Actualización de iconos de story
- **Drawer**: Integración de componente Dropdown en stories

## [1.0.47] - 2025-09-02

### Changed
- **Dropdown**: Simplificación de detección de click fuera y mejora de manejo de eventos

## [1.0.46] - 2025-09-02

### Changed
- **Dropdown**: Actualización para usar idName en lugar de valueName

## [1.0.45] - 2025-08-29

### Added
- **lottie-react**: Dependencia agregada para animaciones

## [1.0.44] - 2025-08-21

### Changed
- **Tag**: Reemplazo de ChipProps con TagProps
- **Badge, Chip**: Actualización para usar nueva sintaxis de componente Tag

## [1.0.43] - 2025-08-19

### Added
- **Tooltip**: Mejora con funcionalidad autoClose y detección de resize
- **Tooltip**: Prop tooltipAbsolute en InnerButton
- **Tooltip**: Refactorización para utilizar hooks personalizados
- **Picture**: Nuevo componente Picture con manejo de imágenes responsivas
- **Placeholder**: Nuevo asset SVG Placeholder
- **ui/tailwind**: Utilidades de aspect ratio
- **Spinner**: Nuevo componente Spinner con soporte de animación
- **Logo**: Eliminación e integración en Spinner
- **Breadcrumbs**: Nuevo componente Breadcrumbs
- **Header**: Mejora para soportar aplicación y limpieza de filtros
- **TagsMultiple**: Mejora con padding dinámico
- **ListItemWithCheckbox**: Nuevo componente
- **Dropdown**: Soporte de checkboxes

### Changed
- **README.md**: Renovación con documentación mejorada
- **ui**: Estandarización de declaraciones de exportación

## [1.0.37] - 2025-08-19

### Added
- **Filters**: Componente Filters con hook personalizado
- **Header**: Expansión de stories con ejemplos comprehensivos

## [1.0.35] - 2025-08-12

### Added
- Mejoras en componentes y funcionalidad

## [1.0.34] - 2025-08-12

### Added
- Mejoras en componentes y funcionalidad

## [1.0.33] - 2025-08-11

### Added
- Mejoras en componentes y funcionalidad

## [1.0.32] - 2025-08-11

### Added
- Mejoras en componentes y funcionalidad

## [1.0.31] - 2025-08-07

### Added
- Mejoras en componentes y funcionalidad

## [1.0.30] - 2025-08-07

### Added
- Mejoras en componentes y funcionalidad

## [1.0.29] - 2025-08-05

### Added
- Mejoras en componentes y funcionalidad

## [1.0.28] - 2025-08-04

### Added
- Mejoras en componentes y funcionalidad

## [1.0.27] - 2025-08-04

### Added
- Mejoras en componentes y funcionalidad

## [1.0.26] - 2025-08-04

### Added
- Mejoras en componentes y funcionalidad

## [1.0.25] - 2025-08-01

### Added
- Mejoras en componentes y funcionalidad

## [1.0.24] - 2025-08-01

### Added
- Mejoras en componentes y funcionalidad

## [1.0.23] - 2025-07-23

### Added
- Mejoras en componentes y funcionalidad

## [1.0.22] - 2025-07-23

### Added
- Mejoras en componentes y funcionalidad

## [1.0.21] - 2025-07-21

### Added
- Mejoras en componentes y funcionalidad

## [1.0.20] - 2025-07-18

### Added
- Mejoras en componentes y funcionalidad

## [1.0.19] - 2025-07-17

### Added
- Mejoras en componentes y funcionalidad

## [1.0.18] - 2025-07-17

### Added
- Mejoras en componentes y funcionalidad

## [1.0.2] - 2025-07-16

### Changed
- **Build**: Migración de Rollup a Vite para proceso de build
- **CSS**: Mejora de manejo de CSS con integración de Tailwind
- **README**: Mejora de documentación

## [1.0.1] - 2025-07-14

### Changed
- **Rollup**: Actualización de configuración de Rollup para extracción de CSS

## [1.0.0] - 2025-07-14

### Added
- **Release inicial**: Primera versión del paquete UI
- Componentes base del sistema de diseño
- Configuración inicial de build y distribución
- Documentación básica

---

## Tipos de Cambios

- `Added` para nuevas funcionalidades
- `Changed` para cambios en funcionalidades existentes
- `Deprecated` para funcionalidades que serán eliminadas
- `Removed` para funcionalidades eliminadas
- `Fixed` para corrección de bugs
- `Security` para vulnerabilidades