@soyfri/shared-library 2.0.0-beta8 → 3.1.0

package/README.md

@@ -1,243 +1,251 @@
 # @soyfri/shared-library
 
-Una librería de componentes React reutilizables construida con Material-UI, TypeScript y Tailwind CSS, diseñada para proporcionar componentes UI consistentes y bien documentados.
+Librería de componentes React de FRI, construida sobre **Material UI v7** + TypeScript. Provee componentes UI consistentes y tipados para los frontends del ecosistema (`soporte`, `afiliaciones`, …).
 
-## 📋 Tabla de Contenidos
-
-- [Características](#características)
-- [Instalación](#instalación)
-- [Uso](#uso)
-- [Componentes Disponibles](#componentes-disponibles)
-- [Desarrollo](#desarrollo)
-- [Scripts Disponibles](#scripts-disponibles)
-- [Storybook](#storybook)
-- [Testing](#testing)
-- [Tecnologías](#tecnologías)
-- [Estructura del Proyecto](#estructura-del-proyecto)
-
-## ✨ Características
-
-- 🎨 **Componentes tipados**: Todos los componentes están construidos con TypeScript para mayor seguridad de tipos
-- 📚 **Documentación con Storybook**: Cada componente incluye historias interactivas y documentación
-- 🎯 **Material-UI**: Basado en Material-UI para un diseño consistente y accesible
-- 🌈 **Tailwind CSS**: Integración con Tailwind para estilos utilitarios
-- 🧪 **Testing**: Configurado con Vitest y Playwright para testing de componentes
-- 📦 **Build optimizado**: Configuración con Rollup para generar builds ESM y CommonJS
-
-## 📦 Instalación
+## Instalación
 
 ```bash
 npm install @soyfri/shared-library
 ```
 
-## 🚀 Uso
+### Peer dependencies
 
-```tsx
-import { Button, Table, Select } from '@soyfri/shared-library';
-import '@soyfri/shared-library/dist/styles.css';
+El consumidor debe tener instaladas (la librería no las empaqueta):
 
-function App() {
-  return (
-    <div>
-      <Button variant="contained" color="primary">
-        Mi Botón
-      </Button>
-    </div>
-  );
-}
+```
+react >=18   react-dom >=18   react-hook-form ^7
+@mui/material ^7   @mui/icons-material ^7   @mui/x-date-pickers ^8   @mui/lab ^7
+@emotion/react ^11   @emotion/styled ^11   dayjs ^1
 ```
 
-## 🧩 Componentes Disponibles
-
-### Button
-Componente de botón personalizable basado en Material-UI con soporte para iconos, diferentes tamaños y estados.
+## Setup
 
-**Características:**
-- Variantes: `text`, `outlined`, `contained`
-- Tamaños: `small`, `medium`, `large`
-- Soporte para iconos de inicio y fin
-- Estados de carga
-- Completamente tipado
+1. Envuelve la app en el `ThemeProvider` de MUI (los componentes leen el theme del contexto).
+2. Importa los estilos una vez. El barrel los importa solo; si **solo** usas subpaths, impórtalos manualmente:
 
-### Table
-Componente de tabla flexible con paginación interna y externa, ordenamiento y renderizado personalizado de columnas.
+```tsx
+import '@soyfri/shared-library/styles.css'
+```
 
-**Características:**
-- Paginación interna automática
-- Paginación externa controlada
-- Columnas personalizables con renderizado custom
-- Soporte para componentes complejos en celdas
-- Completamente tipado con generics
+## Dos formas de importar
 
-### Select
-Componente select avanzado con soporte para selección múltiple, filtros, agrupación y renderizado personalizado.
+```tsx
+// 1) Subpath por componente (recomendado — tree-shaking, lo que usan los proyectos)
+import { Button } from '@soyfri/shared-library/components/Button'
+import { Table } from '@soyfri/shared-library/components/Table'
 
-**Características:**
-- Selección simple y múltiple
-- Filtrado de opciones
-- Agrupación de opciones
-- Renderizado personalizado con avatars
-- Placeholder configurable
+// 2) Barrel raíz (importa styles.css automáticamente)
+import { Button, Table, Select } from '@soyfri/shared-library'
+```
 
-### Avatar
-Componente para mostrar avatares de usuarios con soporte para imágenes y texto.
+> Cada componente se publica como subpath `@soyfri/shared-library/components/<Nombre>`.
 
-### Icon
-Wrapper para iconos de Material-UI con propiedades consistentes.
+---
 
-### Stat
-Componente para mostrar estadísticas con diferentes plantillas de visualización.
+## Componentes
 
-**Características:**
-- Plantilla simple
-- Plantilla con chip
-- Plantilla con lista de chips
-- Colores personalizables
+Uso mínimo de cada componente. Todos aceptan `sx` y son tipados.
 
-### Column
-Componente auxiliar para definir columnas en el componente Table.
+### Formularios e inputs
 
-## 🛠️ Desarrollo
+**Button** — `variant` (`text`/`outlined`/`contained`), `color`, `size`, `loading`, `startIcon`/`endIcon`.
+```tsx
+<Button variant="contained" color="primary" onClick={fn}>Guardar</Button>
+```
 
-### Prerrequisitos
+**Input** — campo de texto. Modo controlado (`value`/`onChange`) o RHF (`name`/`control`).
+```tsx
+<Input label="Nombre" value={v} onChange={setV} />
+<Input label="Correo" type="email" name="email" control={control} />
+```
 
-- Node.js (versión 18 o superior)
-- npm o yarn
+**InputGroup** — agrupa inputs/botones adyacentes con bordes unificados.
+```tsx
+<InputGroup><Input label="Buscar" value={q} onChange={setQ} /><Button>Ir</Button></InputGroup>
+```
 
-### Configuración del entorno de desarrollo
+**Select** + **Option** — single, múltiple y filtrable. Modo controlado o RHF.
+```tsx
+<Select label="País" value={v} onChange={setV} options={[{value:'gt',label:'Guatemala'}]} />
+<Select label="Tags" multiple value={vals} onChange={setVals} options={opts} filterable />
+```
 
-1. Clona el repositorio:
-```bash
-git clone <repository-url>
-cd shared-library
+**Autocomplete** — búsqueda con `options` (`{value,label,img?}`), `multiple`.
+```tsx
+<Autocomplete label="Usuario" options={opts} value={v} onChange={setV} />
 ```
 
-2. Instala las dependencias:
-```bash
-npm install
+**Checkbox** / **Switch** — `label`, controlado (`checked`/`onChange`) o RHF (`name`/`control`).
+```tsx
+<Checkbox label="Acepto" checked={ok} onChange={setOk} />
+<Switch label="Activo" checked={on} onChange={setOn} />
 ```
 
-3. Inicia el entorno de desarrollo:
-```bash
-npm run dev
+**RadioGroup** — `options` (`{value,label}`), `row`.
+```tsx
+<RadioGroup label="Tipo" options={[{value:'a',label:'A'},{value:'b',label:'B'}]} value={v} onChange={setV} />
 ```
 
-## 📜 Scripts Disponibles
+**DatePicker** / **DateTimePicker** — valor `Dayjs`, `minDate`/`maxDate`.
+```tsx
+<DatePicker label="Fecha" value={date} onChange={setDate} />
+```
 
-- `npm run build` - Construye la librería para producción
-- `npm run dev` - Inicia el modo de desarrollo con watch
-- `npm run build:css` - Construye los estilos CSS
-- `npm run watch:css` - Observa cambios en los estilos CSS
-- `npm run clean` - Limpia la carpeta dist
-- `npm run prepare` - Limpia y construye la librería
-- `npm run storybook` - Inicia Storybook en modo desarrollo
-- `npm run build-storybook` - Construye Storybook para producción
-- `npm run dist` - Ejecuta el script de distribución personalizado
+### Datos y visualización
 
-## 📚 Storybook
+**Table** + **Column** — paginación interna o externa, render por columna.
+```tsx
+<Table data={rows}>
+  <Column name="Nombre" field="name">{({name}) => <b>{name}</b>}</Column>
+  <Column name="Estado" field="status">{({status}) => <Chip label={status} />}</Column>
+</Table>
+```
 
-La librería incluye Storybook para documentación interactiva y desarrollo de componentes.
+**Avatar** — uno (`src`/`alt`/`fallback`) o grupo apilado (`items`).
+```tsx
+<Avatar src={url} alt="Ada" fallback="AL" />
+<Avatar items={[{imageUrl:u1,text:'Ada'},{imageUrl:u2,text:'Bob'}]} displayedAvatars={3} />
+```
 
-### Iniciar Storybook
+**Chip** — `label`, `color`, `variant`, `onDelete`.
+```tsx
+<Chip label="Activo" color="success" size="small" />
+```
 
-```bash
-npm run storybook
+**Stat** — KPI con plantillas `simple`/`chip`/`chipList`.
+```tsx
+<Stat simple statDisplay={() => <>Q 1,200</>} />
 ```
 
-Esto abrirá Storybook en `http://localhost:6006` donde podrás:
+**Icon** — SVG por `path`/`url` o `children`, con `badge`, `spin`.
+```tsx
+<Icon url="/icons/user.svg" size="md" />
+```
 
-- Ver todos los componentes disponibles
-- Interactuar con las propiedades de cada componente
-- Ver ejemplos de uso
-- Acceder a la documentación detallada
+**Gallery** — galería con lightbox; `items` (`{url,type,title}`).
+```tsx
+<Gallery items={[{url:img,type:'image',title:'Doc'}]} />
+```
 
-### Construir Storybook
+**Timeline** + **TimelineItem** — línea temporal.
+```tsx
+<Timeline><TimelineItem>Creado</TimelineItem><TimelineItem>Aprobado</TimelineItem></Timeline>
+```
 
-```bash
-npm run build-storybook
+**Stepper** + **Step** — pasos `horizontal`/`vertical`, `currentStep`.
+```tsx
+<Stepper currentStep={1}><Step label="Datos" /><Step label="Pago" /></Stepper>
 ```
 
-## 🧪 Testing
+### Feedback
+
+**Alert** — `severity` (`success`/`info`/`warning`/`error`), `variant`.
+```tsx
+<Alert severity="error">No se pudo guardar</Alert>
+```
 
-La librería está configurada con Vitest y Playwright para testing de componentes.
+**Spinner** — `size`, `color`.
+```tsx
+<Spinner size={16} />
+```
 
-### Configuración de Testing
+**StatusMessage** — mensaje de estado como `alert` o `modal`.
+```tsx
+<StatusMessage open messageType="success" title="Listo" description="Guardado" close={fn} />
+```
 
-- **Vitest**: Para unit tests y testing de componentes
-- **Playwright**: Para testing de browser
-- **Storybook Test Addon**: Para testing de historias de Storybook
+**Tooltip** — `text` envolviendo un hijo.
+```tsx
+<Tooltip text="Editar"><Button>✎</Button></Tooltip>
+```
 
-## 🔧 Tecnologías
+**Modal** (+ `ModalHeader`/`ModalBody`/`ModalFooter`) — `open`/`onClose`, `actions`, `staticBackdrop`, `maxWidth`.
+```tsx
+<Modal open={open} onClose={close} title="Confirmar" actions={[{text:'OK',onClick:save}]} staticBackdrop />
+```
 
-### Dependencias Principales
+### Navegación
 
-- **React 19.1.0**: Librería de UI
-- **Material-UI 7.1.0**: Sistema de diseño y componentes
-- **TypeScript 5.8.3**: Tipado estático
-- **Tailwind CSS 4.1.7**: Framework de CSS utilitario
+**Tabs** + **Tab** — paneles por contenido, o modo `nav` (enlaces controlados por ruta).
+```tsx
+<Tabs onChangeValue={setV}>
+  <Tab value={0} label="General">…</Tab>
+  <Tab value={1} label="Historial">…</Tab>
+</Tabs>
+// Modo nav (router): value controlado, sin paneles
+<Tabs nav value={current}>
+  <Tab value="info" label="Info" component={Link} to="info" />
+</Tabs>
+```
 
-### Herramientas de Desarrollo
+**Breadcrumbs** — migas; los hijos son `Link`/`Typography`.
+```tsx
+<Breadcrumbs><Link href="/">Inicio</Link><Typography>Detalle</Typography></Breadcrumbs>
+```
 
-- **Storybook 9.0.8**: Documentación y desarrollo de componentes
-- **Rollup**: Bundler para la construcción de la librería
-- **Vitest**: Framework de testing
-- **Playwright**: Testing de browser
-- **Prettier**: Formateo de código
+**Drawer** + **DrawerItem** — panel lateral colapsable.
+```tsx
+<Drawer open variant="permanent"><DrawerItem>Inicio</DrawerItem></Drawer>
+```
 
-## 📁 Estructura del Proyecto
+**AppBar** — barra superior (incluye `AppBarMenuToggle`, `useAppBarContext`).
 
+**MenuButton** — botón que abre un menú de `options`.
+```tsx
+<MenuButton buttonText="Acciones" options={[{label:'Editar',onClick:fn}]} />
 ```
-shared-library/
-├── .storybook/          # Configuración de Storybook
-├── src/
-│   ├── components/      # Componentes de la librería
-│   │   ├── Avatar/
-│   │   ├── Button/
-│   │   ├── Column/
-│   │   ├── Icon/
-│   │   ├── Select/
-│   │   ├── Stat/
-│   │   └── Table/
-│   ├── index.ts         # Punto de entrada principal
-│   └── styles.css       # Estilos globales
-├── dist/                # Archivos construidos
-├── package.json
-├── tsconfig.json
-├── tailwind.config.js
-├── rollup.config.cjs
-└── vitest.config.ts
+
+**ActionMenu** + **ActionMenuItem** — menú contextual (compound; `trigger` opcional, default ⋮).
+```tsx
+<ActionMenu><ActionMenuItem onClick={edit}>Editar</ActionMenuItem><ActionMenuItem onClick={del}>Eliminar</ActionMenuItem></ActionMenu>
 ```
 
-### Estructura de Componentes
+### Layout y contenedores
+
+**Card** — `variant`, `padding`; o composición con `title`/`subheader`/`action` y `contentSx`.
+```tsx
+<Card title="Resumen" action={<Button>Editar</Button>}>…</Card>
+<Card contentSx={{ p: 0 }}><Table data={rows}>…</Table></Card>   // tabla flush
+```
 
-Cada componente sigue una estructura consistente:
+**Divider** — separador `horizontal`/`vertical`.
+```tsx
+<Divider sx={{ my: 2 }} />
+```
 
+**ButtonGroup** — agrupa botones.
+```tsx
+<ButtonGroup><Button>Día</Button><Button>Mes</Button></ButtonGroup>
 ```
-ComponentName/
-├── ComponentName.tsx        # Implementación del componente
-├── ComponentName.stories.tsx # Historias de Storybook
-├── ComponentName.definition.ts # Definiciones de código (opcional)
-├── index.ts                 # Exportaciones
-└── types.ts                 # Tipos específicos (opcional)
+
+**Flyout** — panel flotante `open`/`onClose`, `anchor`.
+```tsx
+<Flyout open={open} onClose={close} anchor="right">…</Flyout>
 ```
 
-## 🤝 Contribución
+### Hooks
+
+**useClipboard** — copiar al portapapeles con feedback.
+```tsx
+import { useClipboard } from '@soyfri/shared-library/hooks/ClipBoard'
+const { copy, CopyMessage } = useClipboard({ message: 'Copiado', severity: 'success' })
+```
 
-Para contribuir al proyecto:
+---
 
-1. Fork el repositorio
-2. Crea una rama para tu feature (`git checkout -b feature/nueva-funcionalidad`)
-3. Commit tus cambios (`git commit -am 'Agrega nueva funcionalidad'`)
-4. Push a la rama (`git push origin feature/nueva-funcionalidad`)
-5. Crea un Pull Request
+## Desarrollo
 
-## 📄 Licencia
+```bash
+npm install
+npm run dev          # build en watch (tsup)
+npm run storybook    # Storybook en :6006 (documentación interactiva, 260+ stories)
+npm run build        # build de producción (vite + postbuild genera subpaths en dist/)
+```
 
-ISC License
+## Tecnologías
 
----
+React 18/19 · Material UI v7 · TypeScript 5 · Tailwind CSS 4 · Storybook 9 · Vite/Rollup · Vitest + Playwright.
 
-**Versión actual:** 1.0.1
+## Licencia
 
-Para más información y ejemplos detallados, consulta la documentación en Storybook ejecutando `npm run storybook`.
-        
+ISC

package/{RadioGroup-CxqDHap1.cjs → RadioGroup-Dd0rHXSX.cjs}

@@ -106,9 +106,9 @@ const RadioGroup = (props) => {
   const buildSx = (effectiveError) => [
     buildRadioGroupSx({ bordered, borderRadius, error: effectiveError }),
     ...presetSx ? [presetSx] : [],
-    ...Array.isArray(sx) ? sx : [sx]
+    ...Array.isArray(sx) ? sx : sx ? [sx] : []
   ];
-  const renderOptions = (currentValue, _onChange, fieldName) => options.map((opt) => {
+  const renderOptions = (fieldName) => options.map((opt) => {
     var _a2;
     const inputId = (_a2 = opt.id) != null ? _a2 : `${fieldName != null ? fieldName : "radio"}-${opt.value}`;
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -124,14 +124,13 @@ const RadioGroup = (props) => {
           }
         ),
         label: opt.label,
-        checked: currentValue === opt.value,
         disabled: disabled || opt.disabled
       },
       inputId
     );
   });
   if ("control" in props && props.control) {
-    const { name: name2, control, validation } = props;
+    const { name: name2, control, validation, onValueChange } = props;
     return /* @__PURE__ */ jsxRuntime.jsx(
       reactHookForm.Controller,
       {
@@ -159,8 +158,11 @@ const RadioGroup = (props) => {
                     name: field.name,
                     value: (_b = field.value) != null ? _b : "",
                     onBlur: field.onBlur,
-                    onChange: (_e, value2) => field.onChange(value2),
-                    children: renderOptions(field.value, field.onChange, field.name)
+                    onChange: (_e, value2) => {
+                      field.onChange(value2);
+                      onValueChange == null ? void 0 : onValueChange(value2);
+                    },
+                    children: renderOptions(field.name)
                   })
                 ),
                 finalHelperText && /* @__PURE__ */ jsxRuntime.jsx(material.FormHelperText, { children: finalHelperText })
@@ -188,7 +190,7 @@ const RadioGroup = (props) => {
             name,
             value: value != null ? value : "",
             onChange: (_e, next) => onChange(next),
-            children: renderOptions(value, onChange, name)
+            children: renderOptions(name)
           })
         ),
         helperText && /* @__PURE__ */ jsxRuntime.jsx(material.FormHelperText, { children: helperText })
@@ -197,4 +199,4 @@ const RadioGroup = (props) => {
   );
 };
 exports.RadioGroup = RadioGroup;
-//# sourceMappingURL=RadioGroup-CxqDHap1.cjs.map
+//# sourceMappingURL=RadioGroup-Dd0rHXSX.cjs.map

package/RadioGroup-Dd0rHXSX.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup-Dd0rHXSX.cjs","sources":["../src/components/RadioGroup/RadioGroup.sx.ts","../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import type { SxProps, Theme } from '@mui/material/styles';\n\nexport interface BuildRadioGroupSxOptions {\n  bordered: boolean;\n  borderRadius: number | string;\n  error: boolean;\n}\n\nconst toRadius = (borderRadius: number | string) =>\n  typeof borderRadius === 'number' ? `${borderRadius}px` : borderRadius;\n\n/**\n * Transición compartida (matchea el InputGroup).\n */\nconst FOCUS_TRANSITION =\n  'border-color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, ' +\n  'box-shadow 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms';\n\n/**\n * Builder de sx para RadioGroup. Reproduce el estilo del antiguo\n * `FormRadioGroup` legacy: contenedor con borde + padding vertical.\n *\n * Cuando `bordered=true`, el contenedor gana:\n * - `:focus-within` → borde + shadow primario (mismo patrón que `InputGroup`).\n * - `error=true` → borde + shadow de error (palette.error.main).\n *\n * El shadow es de 1px, así que no hay shift de layout — sólo se intensifica\n * visualmente el borde sin empujar nada alrededor.\n *\n * Si `bordered=false`, devuelve un sx mínimo (sólo helper text reset).\n */\nexport const buildRadioGroupSx = ({\n  bordered,\n  borderRadius,\n  error,\n}: BuildRadioGroupSxOptions): SxProps<Theme> => {\n  const radius = toRadius(borderRadius);\n\n  if (!bordered) {\n    return {\n      '& .MuiFormHelperText-root': { marginLeft: 0 },\n    };\n  }\n\n  return (theme) => ({\n    '& .MuiRadioGroup-root': {\n      paddingTop: 1.25,\n      paddingBottom: 1.25,\n      paddingX: 1.5,\n      border: `1px solid ${\n        error ? theme.palette.error.main : theme.palette.divider\n      }`,\n      borderRadius: radius,\n      transition: FOCUS_TRANSITION,\n      ...(error && {\n        boxShadow: `0 0 0 1px ${theme.palette.error.main}`,\n      }),\n      // Focus del usuario sobre cualquier radio interno.\n      '&:focus-within': {\n        borderColor: error\n          ? theme.palette.error.main\n          : theme.palette.primary.main,\n        boxShadow: `0 0 0 1px ${\n          error ? theme.palette.error.main : theme.palette.primary.main\n        }`,\n      },\n    },\n    '& .MuiFormHelperText-root': {\n      marginLeft: 0,\n    },\n    '& .MuiFormLabel-root': {\n      marginBottom: 0.5,\n    },\n  });\n};\n","import type { FC } from 'react';\nimport { useTheme } from '@mui/material/styles';\nimport {\n  FormControl,\n  FormControlLabel,\n  FormHelperText,\n  FormLabel,\n  Radio,\n  RadioGroup as MuiRadioGroup,\n  type RadioGroupProps as MuiRadioGroupProps,\n  type SxProps,\n  type Theme,\n} from '@mui/material';\nimport { Controller, type Control, type RegisterOptions } from 'react-hook-form';\n\nimport { buildRadioGroupSx } from './RadioGroup.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\nexport interface RadioOption {\n  /** Valor que se emite cuando se selecciona la opción. */\n  value: string;\n  /** Texto mostrado al lado del radio. */\n  label: string;\n  /** Deshabilitar opción individualmente. */\n  disabled?: boolean;\n  /** ID custom del input (default: prefijo + value). */\n  id?: string;\n}\n\nexport type RadioGroupSize = 'small' | 'medium';\n\n// ── Props base (todo lo común entre RHF y controlado) ────────────────────\nexport interface BaseRadioGroupProps\n  extends Omit<MuiRadioGroupProps, 'value' | 'onChange' | 'defaultValue'> {\n  options: RadioOption[];\n  /** Label superior del grupo. */\n  label?: string;\n  /** Distribución horizontal (default: true — replica el comportamiento legacy). */\n  row?: boolean;\n  size?: RadioGroupSize;\n  disabled?: boolean;\n  error?: boolean;\n  helperText?: string;\n  /** Renderiza un contenedor con borde estilo \"form field\". Default: true. */\n  bordered?: boolean;\n  /** Border radius del contenedor (cuando bordered). Default: 10. */\n  borderRadius?: number | string;\n  defaultValue?: string;\n  /**\n   * Nombre del preset de estilo registrado en `theme.styles.RadioGroup`.\n   * - `\"default\"` (o ausente) = estilo built-in del paquete.\n   * - Cualquier otro string = mergea el preset encima del estilo built-in.\n   */\n  preset?: string;\n  sx?: SxProps<Theme>;\n}\n\n// ── Variantes discriminadas (RHF vs controlado) ──────────────────────────\nexport interface RHFRadioGroupProps extends BaseRadioGroupProps {\n  name: string;\n  // `any` plano (no `Control<any>`): RHF tipa `Control<T>` con generics en\n  // posiciones tanto contravariantes como covariantes (ej. `_subjects.state`).\n  // Cuando el componente o su uso involucra generics adicionales, TS se\n  // confunde narroweando el discriminated union y `Control<any>` no logra\n  // absorber `Control<MyForm>` en la comparación estructural profunda. El\n  // `any` plano elimina ese ruido. RHF adentro sigue teniendo sus tipos\n  // fuertes — solo degradamos la superficie del prop del componente.\n  control: any;\n  validation?: RegisterOptions;\n  /**\n   * Side-effect que corre después de que RHF actualiza el form state.\n   * Útil para cascadas entre campos. NO reemplaza al handler de RHF.\n   */\n  onValueChange?: (value: string) => void;\n  value?: never;\n  onChange?: never;\n}\n\nexport interface ControlledRadioGroupProps extends BaseRadioGroupProps {\n  name?: string;\n  control?: never;\n  validation?: never;\n  value: string;\n  onChange: (value: string) => void;\n}\n\n// ── API pública final ────────────────────────────────────────────────────\nexport type RadioGroupProps = RHFRadioGroupProps | ControlledRadioGroupProps;\n\nexport const RadioGroup: FC<RadioGroupProps> = (props) => {\n  const {\n    options,\n    label,\n    row = true,\n    size = 'small',\n    disabled = false,\n    error = false,\n    helperText,\n    bordered = true,\n    borderRadius = 10,\n    defaultValue,\n    preset,\n    sx,\n    ...rest\n  } = props as ControlledRadioGroupProps & {\n    control?: Control<any>;\n    validation?: RegisterOptions;\n  };\n\n  const theme = useTheme();\n  const presetSx = resolvePreset('RadioGroup', preset, theme);\n\n  // Construye el sx con el estado de error efectivo; se llama por rama\n  // (RHF usa el error del Controller, controlado usa el prop `error`).\n  const buildSx = (effectiveError: boolean) => [\n    buildRadioGroupSx({ bordered, borderRadius, error: effectiveError }),\n    ...(presetSx ? [presetSx] : []),\n    ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n  ];\n\n  const renderOptions = (fieldName?: string) =>\n    options.map((opt) => {\n      const inputId = opt.id ?? `${fieldName ?? 'radio'}-${opt.value}`;\n      return (\n        <FormControlLabel\n          key={inputId}\n          value={opt.value}\n          control={\n            <Radio\n              id={inputId}\n              size={size}\n              disabled={disabled || opt.disabled}\n            />\n          }\n          label={opt.label}\n          disabled={disabled || opt.disabled}\n        />\n      );\n    });\n\n  // ── RHF mode ──────────────────────────────────────────────────────────\n  if ('control' in props && props.control) {\n    const { name, control, validation, onValueChange } = props as RHFRadioGroupProps;\n    return (\n      <Controller\n        name={name}\n        control={control}\n        rules={validation}\n        defaultValue={defaultValue}\n        render={({ field, fieldState: { error: fieldError } }) => {\n          const finalError = !!fieldError || error;\n          const finalHelperText = fieldError?.message ?? helperText;\n          return (\n            <FormControl\n              error={finalError}\n              disabled={disabled}\n              sx={buildSx(finalError)}\n              fullWidth\n            >\n              {label && <FormLabel>{label}</FormLabel>}\n              <MuiRadioGroup\n                {...rest}\n                row={row}\n                name={field.name}\n                value={field.value ?? ''}\n                onBlur={field.onBlur}\n                onChange={(_e, value) => {\n                  field.onChange(value);\n                  onValueChange?.(value);\n                }}\n              >\n                {renderOptions(field.name)}\n              </MuiRadioGroup>\n              {finalHelperText && <FormHelperText>{finalHelperText}</FormHelperText>}\n            </FormControl>\n          );\n        }}\n      />\n    );\n  }\n\n  // ── Controlled mode ───────────────────────────────────────────────────\n  const { value, onChange, name } = props as ControlledRadioGroupProps;\n  return (\n    <FormControl\n      error={error}\n      disabled={disabled}\n      sx={buildSx(error)}\n      fullWidth\n    >\n      {label && <FormLabel>{label}</FormLabel>}\n      <MuiRadioGroup\n        {...rest}\n        row={row}\n        name={name}\n        value={value ?? ''}\n        onChange={(_e, next) => onChange(next)}\n      >\n        {renderOptions(name)}\n      </MuiRadioGroup>\n      {helperText && <FormHelperText>{helperText}</FormHelperText>}\n    </FormControl>\n  );\n};\n\nexport default RadioGroup;\n"],"names":["useTheme","resolvePreset","_a","jsx","FormControlLabel","Radio","name","Controller","jsxs","FormControl","FormLabel","MuiRadioGroup","value","FormHelperText"],"mappings":"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"}

package/{RadioGroup-DMi9FvMP.js → RadioGroup-bO-ahP9T.js}

@@ -105,9 +105,9 @@ const RadioGroup = (props) => {
   const buildSx = (effectiveError) => [
     buildRadioGroupSx({ bordered, borderRadius, error: effectiveError }),
     ...presetSx ? [presetSx] : [],
-    ...Array.isArray(sx) ? sx : [sx]
+    ...Array.isArray(sx) ? sx : sx ? [sx] : []
   ];
-  const renderOptions = (currentValue, _onChange, fieldName) => options.map((opt) => {
+  const renderOptions = (fieldName) => options.map((opt) => {
     var _a2;
     const inputId = (_a2 = opt.id) != null ? _a2 : `${fieldName != null ? fieldName : "radio"}-${opt.value}`;
     return /* @__PURE__ */ jsx(
@@ -123,14 +123,13 @@ const RadioGroup = (props) => {
           }
         ),
         label: opt.label,
-        checked: currentValue === opt.value,
         disabled: disabled || opt.disabled
       },
       inputId
     );
   });
   if ("control" in props && props.control) {
-    const { name: name2, control, validation } = props;
+    const { name: name2, control, validation, onValueChange } = props;
     return /* @__PURE__ */ jsx(
       Controller,
       {
@@ -158,8 +157,11 @@ const RadioGroup = (props) => {
                     name: field.name,
                     value: (_b = field.value) != null ? _b : "",
                     onBlur: field.onBlur,
-                    onChange: (_e, value2) => field.onChange(value2),
-                    children: renderOptions(field.value, field.onChange, field.name)
+                    onChange: (_e, value2) => {
+                      field.onChange(value2);
+                      onValueChange == null ? void 0 : onValueChange(value2);
+                    },
+                    children: renderOptions(field.name)
                   })
                 ),
                 finalHelperText && /* @__PURE__ */ jsx(FormHelperText, { children: finalHelperText })
@@ -187,7 +189,7 @@ const RadioGroup = (props) => {
             name,
             value: value != null ? value : "",
             onChange: (_e, next) => onChange(next),
-            children: renderOptions(value, onChange, name)
+            children: renderOptions(name)
           })
         ),
         helperText && /* @__PURE__ */ jsx(FormHelperText, { children: helperText })
@@ -198,4 +200,4 @@ const RadioGroup = (props) => {
 export {
   RadioGroup as R
 };
-//# sourceMappingURL=RadioGroup-DMi9FvMP.js.map
+//# sourceMappingURL=RadioGroup-bO-ahP9T.js.map

package/RadioGroup-bO-ahP9T.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup-bO-ahP9T.js","sources":["../src/components/RadioGroup/RadioGroup.sx.ts","../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import type { SxProps, Theme } from '@mui/material/styles';\n\nexport interface BuildRadioGroupSxOptions {\n  bordered: boolean;\n  borderRadius: number | string;\n  error: boolean;\n}\n\nconst toRadius = (borderRadius: number | string) =>\n  typeof borderRadius === 'number' ? `${borderRadius}px` : borderRadius;\n\n/**\n * Transición compartida (matchea el InputGroup).\n */\nconst FOCUS_TRANSITION =\n  'border-color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, ' +\n  'box-shadow 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms';\n\n/**\n * Builder de sx para RadioGroup. Reproduce el estilo del antiguo\n * `FormRadioGroup` legacy: contenedor con borde + padding vertical.\n *\n * Cuando `bordered=true`, el contenedor gana:\n * - `:focus-within` → borde + shadow primario (mismo patrón que `InputGroup`).\n * - `error=true` → borde + shadow de error (palette.error.main).\n *\n * El shadow es de 1px, así que no hay shift de layout — sólo se intensifica\n * visualmente el borde sin empujar nada alrededor.\n *\n * Si `bordered=false`, devuelve un sx mínimo (sólo helper text reset).\n */\nexport const buildRadioGroupSx = ({\n  bordered,\n  borderRadius,\n  error,\n}: BuildRadioGroupSxOptions): SxProps<Theme> => {\n  const radius = toRadius(borderRadius);\n\n  if (!bordered) {\n    return {\n      '& .MuiFormHelperText-root': { marginLeft: 0 },\n    };\n  }\n\n  return (theme) => ({\n    '& .MuiRadioGroup-root': {\n      paddingTop: 1.25,\n      paddingBottom: 1.25,\n      paddingX: 1.5,\n      border: `1px solid ${\n        error ? theme.palette.error.main : theme.palette.divider\n      }`,\n      borderRadius: radius,\n      transition: FOCUS_TRANSITION,\n      ...(error && {\n        boxShadow: `0 0 0 1px ${theme.palette.error.main}`,\n      }),\n      // Focus del usuario sobre cualquier radio interno.\n      '&:focus-within': {\n        borderColor: error\n          ? theme.palette.error.main\n          : theme.palette.primary.main,\n        boxShadow: `0 0 0 1px ${\n          error ? theme.palette.error.main : theme.palette.primary.main\n        }`,\n      },\n    },\n    '& .MuiFormHelperText-root': {\n      marginLeft: 0,\n    },\n    '& .MuiFormLabel-root': {\n      marginBottom: 0.5,\n    },\n  });\n};\n","import type { FC } from 'react';\nimport { useTheme } from '@mui/material/styles';\nimport {\n  FormControl,\n  FormControlLabel,\n  FormHelperText,\n  FormLabel,\n  Radio,\n  RadioGroup as MuiRadioGroup,\n  type RadioGroupProps as MuiRadioGroupProps,\n  type SxProps,\n  type Theme,\n} from '@mui/material';\nimport { Controller, type Control, type RegisterOptions } from 'react-hook-form';\n\nimport { buildRadioGroupSx } from './RadioGroup.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\nexport interface RadioOption {\n  /** Valor que se emite cuando se selecciona la opción. */\n  value: string;\n  /** Texto mostrado al lado del radio. */\n  label: string;\n  /** Deshabilitar opción individualmente. */\n  disabled?: boolean;\n  /** ID custom del input (default: prefijo + value). */\n  id?: string;\n}\n\nexport type RadioGroupSize = 'small' | 'medium';\n\n// ── Props base (todo lo común entre RHF y controlado) ────────────────────\nexport interface BaseRadioGroupProps\n  extends Omit<MuiRadioGroupProps, 'value' | 'onChange' | 'defaultValue'> {\n  options: RadioOption[];\n  /** Label superior del grupo. */\n  label?: string;\n  /** Distribución horizontal (default: true — replica el comportamiento legacy). */\n  row?: boolean;\n  size?: RadioGroupSize;\n  disabled?: boolean;\n  error?: boolean;\n  helperText?: string;\n  /** Renderiza un contenedor con borde estilo \"form field\". Default: true. */\n  bordered?: boolean;\n  /** Border radius del contenedor (cuando bordered). Default: 10. */\n  borderRadius?: number | string;\n  defaultValue?: string;\n  /**\n   * Nombre del preset de estilo registrado en `theme.styles.RadioGroup`.\n   * - `\"default\"` (o ausente) = estilo built-in del paquete.\n   * - Cualquier otro string = mergea el preset encima del estilo built-in.\n   */\n  preset?: string;\n  sx?: SxProps<Theme>;\n}\n\n// ── Variantes discriminadas (RHF vs controlado) ──────────────────────────\nexport interface RHFRadioGroupProps extends BaseRadioGroupProps {\n  name: string;\n  // `any` plano (no `Control<any>`): RHF tipa `Control<T>` con generics en\n  // posiciones tanto contravariantes como covariantes (ej. `_subjects.state`).\n  // Cuando el componente o su uso involucra generics adicionales, TS se\n  // confunde narroweando el discriminated union y `Control<any>` no logra\n  // absorber `Control<MyForm>` en la comparación estructural profunda. El\n  // `any` plano elimina ese ruido. RHF adentro sigue teniendo sus tipos\n  // fuertes — solo degradamos la superficie del prop del componente.\n  control: any;\n  validation?: RegisterOptions;\n  /**\n   * Side-effect que corre después de que RHF actualiza el form state.\n   * Útil para cascadas entre campos. NO reemplaza al handler de RHF.\n   */\n  onValueChange?: (value: string) => void;\n  value?: never;\n  onChange?: never;\n}\n\nexport interface ControlledRadioGroupProps extends BaseRadioGroupProps {\n  name?: string;\n  control?: never;\n  validation?: never;\n  value: string;\n  onChange: (value: string) => void;\n}\n\n// ── API pública final ────────────────────────────────────────────────────\nexport type RadioGroupProps = RHFRadioGroupProps | ControlledRadioGroupProps;\n\nexport const RadioGroup: FC<RadioGroupProps> = (props) => {\n  const {\n    options,\n    label,\n    row = true,\n    size = 'small',\n    disabled = false,\n    error = false,\n    helperText,\n    bordered = true,\n    borderRadius = 10,\n    defaultValue,\n    preset,\n    sx,\n    ...rest\n  } = props as ControlledRadioGroupProps & {\n    control?: Control<any>;\n    validation?: RegisterOptions;\n  };\n\n  const theme = useTheme();\n  const presetSx = resolvePreset('RadioGroup', preset, theme);\n\n  // Construye el sx con el estado de error efectivo; se llama por rama\n  // (RHF usa el error del Controller, controlado usa el prop `error`).\n  const buildSx = (effectiveError: boolean) => [\n    buildRadioGroupSx({ bordered, borderRadius, error: effectiveError }),\n    ...(presetSx ? [presetSx] : []),\n    ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n  ];\n\n  const renderOptions = (fieldName?: string) =>\n    options.map((opt) => {\n      const inputId = opt.id ?? `${fieldName ?? 'radio'}-${opt.value}`;\n      return (\n        <FormControlLabel\n          key={inputId}\n          value={opt.value}\n          control={\n            <Radio\n              id={inputId}\n              size={size}\n              disabled={disabled || opt.disabled}\n            />\n          }\n          label={opt.label}\n          disabled={disabled || opt.disabled}\n        />\n      );\n    });\n\n  // ── RHF mode ──────────────────────────────────────────────────────────\n  if ('control' in props && props.control) {\n    const { name, control, validation, onValueChange } = props as RHFRadioGroupProps;\n    return (\n      <Controller\n        name={name}\n        control={control}\n        rules={validation}\n        defaultValue={defaultValue}\n        render={({ field, fieldState: { error: fieldError } }) => {\n          const finalError = !!fieldError || error;\n          const finalHelperText = fieldError?.message ?? helperText;\n          return (\n            <FormControl\n              error={finalError}\n              disabled={disabled}\n              sx={buildSx(finalError)}\n              fullWidth\n            >\n              {label && <FormLabel>{label}</FormLabel>}\n              <MuiRadioGroup\n                {...rest}\n                row={row}\n                name={field.name}\n                value={field.value ?? ''}\n                onBlur={field.onBlur}\n                onChange={(_e, value) => {\n                  field.onChange(value);\n                  onValueChange?.(value);\n                }}\n              >\n                {renderOptions(field.name)}\n              </MuiRadioGroup>\n              {finalHelperText && <FormHelperText>{finalHelperText}</FormHelperText>}\n            </FormControl>\n          );\n        }}\n      />\n    );\n  }\n\n  // ── Controlled mode ───────────────────────────────────────────────────\n  const { value, onChange, name } = props as ControlledRadioGroupProps;\n  return (\n    <FormControl\n      error={error}\n      disabled={disabled}\n      sx={buildSx(error)}\n      fullWidth\n    >\n      {label && <FormLabel>{label}</FormLabel>}\n      <MuiRadioGroup\n        {...rest}\n        row={row}\n        name={name}\n        value={value ?? ''}\n        onChange={(_e, next) => onChange(next)}\n      >\n        {renderOptions(name)}\n      </MuiRadioGroup>\n      {helperText && <FormHelperText>{helperText}</FormHelperText>}\n    </FormControl>\n  );\n};\n\nexport default RadioGroup;\n"],"names":["_a","name","MuiRadioGroup","value"],"mappings":"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"}