@codeplex-sac/utils 0.0.4 → 0.0.6

package/lib/area-texto-ajustable/area-texto-ajustable.d.ts

@@ -0,0 +1,61 @@
+import { default as React } from 'react';
+import { TextareaAutosizeProps as MuiTextareaAutosizeProps } from '@mui/material';
+export interface CodeplexAreaTextoAjustableProps extends Omit<MuiTextareaAutosizeProps, 'maxRows' | 'minRows' | 'placeholder' | 'style' | 'disabled' | 'value' | 'onChange'> {
+    /**
+     * Variante de diseño visual del área de texto.
+     */
+    variante?: 'contorneado' | 'relleno' | 'estandar';
+    /**
+     * Etiqueta descriptiva que aparece arriba del campo.
+     */
+    etiqueta?: React.ReactNode;
+    /**
+     * Texto informativo que aparece debajo del campo.
+     */
+    textoAyuda?: React.ReactNode;
+    /**
+     * Valor actual del campo (para componentes controlados).
+     */
+    valor?: string | number;
+    /**
+     * Función que se ejecuta al cambiar el contenido.
+     */
+    alCambiar?: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;
+    /**
+     * Si es verdadero, el componente se mostrará en estado deshabilitado.
+     */
+    deshabilitado?: boolean;
+    /**
+     * Si es verdadero, se aplicarán estilos de error visuales.
+     */
+    error?: boolean;
+    /**
+     * Mensaje que aparece debajo del campo cuando hay un error.
+     */
+    mensajeError?: React.ReactNode;
+    /**
+     * Número mínimo de filas a mostrar.
+     */
+    filasMinimas?: number;
+    /**
+     * Número máximo de filas antes de mostrar barra de desplazamiento.
+     */
+    filasMaximas?: number;
+    /**
+     * Texto de ayuda que aparece cuando el campo está vacío.
+     */
+    marcador?: string;
+    /**
+     * Si es verdadero, el componente ocupará todo el ancho disponible.
+     */
+    anchoCompleto?: boolean;
+    /**
+     * Controla la capacidad de redimensionar el área de texto.
+     */
+    redimension?: 'vertical' | 'horizontal' | 'ambas' | 'ninguna';
+    /**
+     * Estilos adicionales para el contenedor principal.
+     */
+    sx?: any;
+}
+export declare const CodeplexAreaTextoAjustable: ({ variante, etiqueta, textoAyuda, valor, alCambiar, deshabilitado, error, mensajeError, filasMinimas, filasMaximas, marcador, anchoCompleto, redimension, sx, ...props }: CodeplexAreaTextoAjustableProps) => import("react/jsx-runtime").JSX.Element;

package/lib/detector-clic-fuera/detector-clic-fuera.d.ts

@@ -0,0 +1,33 @@
+import { default as React } from 'react';
+export interface CodeplexDetectorClicFueraProps {
+    /**
+     * El elemento hijo al que se le detectará el clic fuera.
+     * Debe ser un único elemento que acepte una referencia (ref).
+     */
+    children: React.ReactElement;
+    /**
+     * Función que se ejecuta cuando se hace clic fuera del elemento envolvente.
+     */
+    alClicFuera: (event: MouseEvent | TouchEvent) => void;
+    /**
+     * El tipo de evento de mouse a escuchar.
+     * @default 'onClick'
+     */
+    eventoMouse?: 'onClick' | 'onMouseDown' | 'onMouseUp' | false;
+    /**
+     * El tipo de evento de toque a escuchar.
+     * @default 'onTouchEnd'
+     */
+    eventoToque?: 'onTouchEnd' | 'onTouchStart' | false;
+    /**
+     * Si es true, el detector no disparará si el clic ocurre dentro del árbol de React,
+     * incluso si el DOM está fuera.
+     * @default false
+     */
+    deshabilitarArbolReact?: boolean;
+}
+/**
+ * Componente de utilidad que detecta cuando se hace clic fuera de su componente hijo.
+ * Útil para cerrar menús, ventanas emergentes o diálogos.
+ */
+export declare const CodeplexDetectorClicFuera: ({ children, alClicFuera, eventoMouse, eventoToque, deshabilitarArbolReact }: CodeplexDetectorClicFueraProps) => import("react/jsx-runtime").JSX.Element;

package/lib/modal/modal.d.ts

@@ -1,11 +1,61 @@
 import { default as React } from 'react';
-import { ModalProps as MuiModalProps, SxProps, Theme } from '@mui/material';
-export interface CodeplexModalProps extends Omit<MuiModalProps, 'children' | 'title'> {
+import { DialogProps } from '@mui/material';
+export interface CodeplexModalProps extends Omit<DialogProps, 'open' | 'onClose' | 'title' | 'maxWidth' | 'fullScreen'> {
+    /**
+     * Controls whether the modal is visible.
+     */
+    open: boolean;
+    /**
+     * Function to execute when closing (click outside, escape, or close icon).
+     */
+    onClose?: (event: {}, reason: 'backdropClick' | 'escapeKeyDown' | 'closeIcon') => void;
+    /**
+     * Modal title.
+     */
+    title?: React.ReactNode;
+    /**
+     * Subtitle or brief description below the title.
+     */
+    subtitle?: string;
+    /**
+     * Modal content (children).
+     */
     children: React.ReactNode;
-    titulo?: React.ReactNode;
-    descripcion?: string;
-    mostrarIconoCierre?: boolean;
-    contentSx?: SxProps<Theme>;
-    ancho?: number | string;
+    /**
+     * Footer content. If omitted, no footer is rendered.
+     */
+    footer?: React.ReactNode;
+    /**
+     * Max width of the modal.
+     * Options: 'xs', 'sm', 'md', 'lg', 'xl' or specific number/string.
+     * Default 'sm'. Ignored if resizable is true.
+     */
+    maxWidth?: DialogProps['maxWidth'];
+    /**
+     * If true, modal takes full screen.
+     * Defaults to false, but auto-switches on mobile if not specified.
+     */
+    fullScreen?: boolean;
+    /**
+     * If true, allows dragging from the header.
+     */
+    draggable?: boolean;
+    /**
+     * If true, allows resizing from bottom-right corner.
+     */
+    resizable?: boolean;
+    /**
+     * If true, modal does not block background interaction (Modeless).
+     */
+    modeless?: boolean;
+    /**
+     * If true, prevents closing by clicking outside or pressing ESC.
+     */
+    locked?: boolean;
+    /**
+     * Shows the close "X" icon.
+     * Default true if onClose is defined.
+     */
+    showCloseIcon?: boolean;
 }
-export declare const CodeplexModal: ({ children, titulo, descripcion, mostrarIconoCierre, onClose, contentSx, ancho, ...props }: CodeplexModalProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CodeplexModal: ({ open, onClose, title, subtitle, children, footer, maxWidth, fullScreen, draggable, resizable, modeless, locked, showCloseIcon, ...props }: CodeplexModalProps) => import("react/jsx-runtime").JSX.Element;

package/lib/portal/portal.d.ts

@@ -2,18 +2,43 @@ import { default as React } from 'react';
 import { PortalProps as MuiPortalProps } from '@mui/material';
 export interface CodeplexPortalProps extends Omit<MuiPortalProps, 'container'> {
     /**
-     * An HTML element, component instance, or function that returns either.
-     * The `container` will have the portal children appended to it.
+     * Un elemento HTML, una instancia de componente o una función que devuelva cualquiera de los dos.
+     * El `contenedor` tendrá los hijos del portal adjuntos a él.
      *
-     * By default, it uses the body of the top-level document object,
-     * so it's simply `document.body` most of the time.
+     * Por defecto, utiliza el body del objeto de documento de nivel superior (document.body).
+     * Alias de `container`.
+     */
+    contenedor?: MuiPortalProps['container'];
+    /**
+     * Alias de `contenedor`. Se mantiene por compatibilidad.
      */
     container?: MuiPortalProps['container'];
     /**
-     * Convenience prop to specify the ID of the container element.
-     * If provided, it overrides the `container` prop.
+     * Propiedad de conveniencia para especificar el ID del elemento contenedor.
+     * Si se proporciona, anula la propiedad `contenedor`.
+     * Alias de `containerId`.
+     */
+    idContenedor?: string;
+    /**
+     * Alias de `idContenedor`. Se mantiene por compatibilidad.
      */
     containerId?: string;
+    /**
+     * Contenido que se renderizará dentro del portal.
+     */
     children: React.ReactNode;
+    /**
+     * Si es verdadero, los hijos se renderizarán en su posición original en el DOM.
+     * Alias de `disablePortal`.
+     */
+    deshabilitarPortal?: boolean;
+    /**
+     * Alias de `deshabilitarPortal`. Se mantiene por compatibilidad.
+     */
+    disablePortal?: boolean;
 }
-export declare const CodeplexPortal: ({ container, containerId, children, ...props }: CodeplexPortalProps) => import("react/jsx-runtime").JSX.Element | null;
+/**
+ * El componente CodeplexPortal permite renderizar contenido fuera de la jerarquía DOM actual.
+ * Es útil para modales, popovers y otros elementos que deben romper el flujo visual o de capas.
+ */
+export declare const CodeplexPortal: ({ contenedor, container, idContenedor, containerId, children, deshabilitarPortal, disablePortal, ...props }: CodeplexPortalProps) => import("react/jsx-runtime").JSX.Element | null;

package/lib/posicionador/posicionador.d.ts

@@ -0,0 +1,73 @@
+import { default as React } from 'react';
+import { PopperProps as MuiPopperProps, SxProps, Theme } from '@mui/material';
+export interface CodeplexPosicionadorProps extends Omit<MuiPopperProps, 'children' | 'title' | 'open' | 'placement' | 'anchorEl'> {
+    /**
+     * Contenido que se renderizará dentro del posicionador.
+     * Alias de `children`.
+     */
+    hijos?: React.ReactNode;
+    /**
+     * Propiedad original de React para el contenido.
+     */
+    children?: React.ReactNode;
+    /**
+     * Título opcional para el contenido del posicionador.
+     */
+    titulo?: React.ReactNode;
+    /**
+     * Estilos para el contenedor interno (Box).
+     */
+    estiloContenido?: SxProps<Theme>;
+    /**
+     * Si es verdadero, envuelve el contenido en un Paper (fondo blanco/sombra).
+     * @default true
+     */
+    conFondo?: boolean;
+    /**
+     * Si es verdadero, cierra el posicionador al hacer clic fuera.
+     * @default false
+     */
+    cerrarAlClicFuera?: boolean;
+    /**
+     * Función llamada al cerrar (click fuera).
+     */
+    alCerrar?: (event: MouseEvent | TouchEvent) => void;
+    /**
+     * Activa animación de entrada (Fade).
+     * @default true
+     */
+    transicion?: boolean;
+    /**
+     * Controla la visibilidad del posicionador.
+     */
+    abierto: boolean;
+    /**
+     * Ubicación del elemento respecto al ancla.
+     * Alias de `placement`.
+     * @default 'bottom-start'
+     */
+    colocacion?: MuiPopperProps['placement'];
+    /**
+     * Propiedad original para la ubicación.
+     */
+    placement?: MuiPopperProps['placement'];
+    /**
+     * Elemento HTML o función que devuelve un elemento que servirá como ancla.
+     * Alias de `anchorEl`.
+     */
+    elementoAncla?: MuiPopperProps['anchorEl'];
+    /**
+     * Propiedad original para el elemento ancla.
+     */
+    anchorEl?: MuiPopperProps['anchorEl'];
+    /**
+     * Distancia en píxeles entre el posicionador y el elemento ancla.
+     * @default 4
+     */
+    distancia?: number;
+}
+/**
+ * El componente CodeplexPosicionador (Popper) permite colocar contenido flotante relativo a otro elemento.
+ * Incluye soporte automático para sombras (Paper), transiciones y detección de clics fuera.
+ */
+export declare const CodeplexPosicionador: ({ hijos, children, titulo, estiloContenido, conFondo, cerrarAlClicFuera, alCerrar, transicion, abierto, colocacion, placement, elementoAncla, anchorEl, distancia, ...props }: CodeplexPosicionadorProps) => import("react/jsx-runtime").JSX.Element;

package/lib/transiciones/transiciones.d.ts

@@ -0,0 +1,97 @@
+import { default as React } from 'react';
+import { CollapseProps as MuiCollapseProps, FadeProps as MuiFadeProps, GrowProps as MuiGrowProps, SlideProps as MuiSlideProps, ZoomProps as MuiZoomProps } from '@mui/material';
+export interface CodeplexColapsoProps extends Omit<MuiCollapseProps, 'timeout' | 'in'> {
+    /**
+     * Duración de la animación. Puede ser un número o un objeto con { enter, exit }.
+     * @default 'auto'
+     */
+    duracion?: MuiCollapseProps['timeout'];
+    /**
+     * Si es verdadero, el componente se mostrará.
+     * Alias de `in`.
+     */
+    visible?: boolean;
+    /**
+     * Alias de `visible`.
+     */
+    activo?: boolean;
+    /**
+     * Propiedad original de MUI para controlar la visibilidad.
+     */
+    in?: boolean;
+}
+/**
+ * El componente CodeplexColapso anima la altura del elemento hijo desde 0 hasta su altura natural.
+ */
+export declare const CodeplexColapso: React.ForwardRefExoticComponent<Omit<CodeplexColapsoProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export interface CodeplexDesvanecimientoProps extends Omit<MuiFadeProps, 'timeout' | 'in'> {
+    /**
+     * Duración de la animación.
+     */
+    duracion?: MuiFadeProps['timeout'];
+    /**
+     * Duración específica para la fase de entrada.
+     */
+    entrada?: number;
+    /**
+     * Duración específica para la fase de salida.
+     */
+    salida?: number;
+    /**
+     * Si es verdadero, el componente se mostrará con un desvanecimiento.
+     */
+    visible?: boolean;
+    /**
+     * Alias de `visible`.
+     */
+    activo?: boolean;
+    /**
+     * Propiedad original de MUI.
+     */
+    in?: boolean;
+}
+/**
+ * El componente CodeplexDesvanecimiento anima la opacidad del elemento hijo.
+ */
+export declare const CodeplexDesvanecimiento: React.ForwardRefExoticComponent<Omit<CodeplexDesvanecimientoProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export interface CodeplexCrecimientoProps extends Omit<MuiGrowProps, 'timeout' | 'in'> {
+    duracion?: MuiGrowProps['timeout'];
+    entrada?: number;
+    salida?: number;
+    visible?: boolean;
+    activo?: boolean;
+    in?: boolean;
+}
+/**
+ * El componente CodeplexCrecimiento anima la escala y opacidad del elemento hijo.
+ */
+export declare const CodeplexCrecimiento: React.ForwardRefExoticComponent<Omit<CodeplexCrecimientoProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export interface CodeplexDeslizamientoProps extends Omit<MuiSlideProps, 'timeout' | 'direction' | 'in'> {
+    duracion?: MuiSlideProps['timeout'];
+    entrada?: number;
+    salida?: number;
+    /**
+     * Dirección desde la cual el elemento se desliza hacia adentro.
+     * @default 'arriba'
+     */
+    direccion?: 'abajo' | 'arriba' | 'izquierda' | 'derecha';
+    visible?: boolean;
+    activo?: boolean;
+    in?: boolean;
+}
+/**
+ * El componente CodeplexDeslizamiento desplaza al elemento hijo desde fuera de la pantalla.
+ */
+export declare const CodeplexDeslizamiento: React.ForwardRefExoticComponent<Omit<CodeplexDeslizamientoProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export interface CodeplexZoomProps extends Omit<MuiZoomProps, 'timeout' | 'in'> {
+    duracion?: MuiZoomProps['timeout'];
+    entrada?: number;
+    salida?: number;
+    visible?: boolean;
+    activo?: boolean;
+    in?: boolean;
+}
+/**
+ * El componente CodeplexZoom anima la escala del elemento hijo desde el centro.
+ */
+export declare const CodeplexZoom: React.ForwardRefExoticComponent<Omit<CodeplexZoomProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/lib/ventana-emergente/ventana-emergente.d.ts

@@ -0,0 +1,55 @@
+import { default as React } from 'react';
+import { PopoverProps as MuiPopoverProps, SxProps, Theme } from '@mui/material';
+export interface CodeplexVentanaEmergenteProps extends Omit<MuiPopoverProps, 'open' | 'anchorEl' | 'onClose' | 'title' | 'anchorOrigin' | 'transformOrigin' | 'children'> {
+    /**
+     * Contenido que se mostrará dentro de la ventana emergente.
+     * Alias de `children`.
+     */
+    hijos?: React.ReactNode;
+    /**
+     * Propiedad original de React para el contenido.
+     */
+    children?: React.ReactNode;
+    /**
+     * Elemento HTML que sirve de ancla para la posición de la ventana.
+     * Alias de `anchorEl`.
+     */
+    elementoAncla?: MuiPopoverProps['anchorEl'];
+    /**
+     * Controla si la ventana está visible.
+     * Alias de `open`.
+     */
+    abierto: boolean;
+    /**
+     * Función que se ejecuta al solicitar cerrar la ventana.
+     * Alias de `onClose`.
+     */
+    alCerrar?: (event: {}, reason: 'backdropClick' | 'escapeKeyDown' | 'closeIcon') => void;
+    /**
+     * Título de la ventana emergente.
+     */
+    titulo?: React.ReactNode;
+    /**
+     * Muestra el botón de cierre en la esquina superior derecha.
+     * @default false
+     */
+    mostrarIconoCierre?: boolean;
+    /**
+     * Estilos adicionales para el contenedor interno (Box).
+     */
+    estiloContenido?: SxProps<Theme>;
+    /**
+     * Punto de origen en el elemento ancla. Define dónde se "engancha" la ventana.
+     */
+    origenAncla?: MuiPopoverProps['anchorOrigin'];
+    /**
+     * Punto de origen en la propia ventana para la transformación y posicionamiento.
+     */
+    origenTransformacion?: MuiPopoverProps['transformOrigin'];
+}
+/**
+ * El componente CodeplexVentanaEmergente (Popover) muestra contenido flotante anclado a un elemento.
+ * A diferencia del Popper (Posicionador), el Popover bloquea la interacción con el fondo (modal-like)
+ * y gestiona su propio estado de foco.
+ */
+export declare const CodeplexVentanaEmergente: ({ hijos, children, titulo, mostrarIconoCierre, alCerrar, estiloContenido, elementoAncla, abierto, origenAncla, origenTransformacion, sx, ...props }: CodeplexVentanaEmergenteProps) => import("react/jsx-runtime").JSX.Element;

package/package.json

@@ -1,14 +1,18 @@
 {
   "name": "@codeplex-sac/utils",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "main": "./index.js",
   "types": "./index.d.ts",
   "exports": {
     ".": {
+      "types": "./index.d.ts",
       "import": "./index.mjs",
       "require": "./index.js"
     }
   },
+  "publishConfig": {
+    "access": "public"
+  },
   "peerDependencies": {
     "react": "^19.0.0",
     "react-dom": "^19.0.0"

package/lib/click-away-listener/click-away-listener.d.ts

@@ -1,5 +0,0 @@
-import { ClickAwayListenerProps as MuiClickAwayListenerProps } from '@mui/material';
-export interface CodeplexDetectorClickFueraProps extends Omit<MuiClickAwayListenerProps, 'onClickAway'> {
-    alHacerClickFuera: (event: MouseEvent | TouchEvent) => void;
-}
-export declare const CodeplexDetectorClickFuera: ({ alHacerClickFuera, ...props }: CodeplexDetectorClickFueraProps) => import("react/jsx-runtime").JSX.Element;

package/lib/popover/popover.d.ts

@@ -1,9 +0,0 @@
-import { default as React } from 'react';
-import { PopoverProps as MuiPopoverProps, SxProps, Theme } from '@mui/material';
-export interface CodeplexPopoverProps extends Omit<MuiPopoverProps, 'title'> {
-    title?: React.ReactNode;
-    showCloseIcon?: boolean;
-    contentSx?: SxProps<Theme>;
-    onClose?: (event: {}, reason: 'backdropClick' | 'escapeKeyDown' | 'closeIcon') => void;
-}
-export declare const CodeplexPopover: ({ children, title, showCloseIcon, onClose, contentSx, sx, ...props }: CodeplexPopoverProps) => import("react/jsx-runtime").JSX.Element;

package/lib/popper/popper.d.ts

@@ -1,12 +0,0 @@
-import { default as React } from 'react';
-import { PopperProps as MuiPopperProps, SxProps, Theme } from '@mui/material';
-export interface CodeplexPopperProps extends Omit<MuiPopperProps, 'children' | 'title'> {
-    children?: React.ReactNode;
-    title?: React.ReactNode;
-    contentSx?: SxProps<Theme>;
-    withPaper?: boolean;
-    closeOnClickAway?: boolean;
-    onClose?: (event: MouseEvent | TouchEvent) => void;
-    transition?: boolean;
-}
-export declare const CodeplexPopper: ({ children, title, contentSx, withPaper, closeOnClickAway, onClose, transition, open, placement, ...props }: CodeplexPopperProps) => import("react/jsx-runtime").JSX.Element;

package/lib/textarea-autosize/textarea-autosize.d.ts

@@ -1,6 +0,0 @@
-import { TextareaAutosizeProps as MuiTextareaAutosizeProps } from '@mui/material';
-export interface CodeplexTextareaAutosizeProps extends MuiTextareaAutosizeProps {
-    variant?: 'outlined' | 'filled' | 'standard';
-    error?: boolean;
-}
-export declare const CodeplexTextareaAutosize: ({ variant, error, minRows, ...props }: CodeplexTextareaAutosizeProps) => import("react/jsx-runtime").JSX.Element;

package/lib/transitions/transitions.d.ts

@@ -1,16 +0,0 @@
-import { CollapseProps as MuiCollapseProps, FadeProps as MuiFadeProps, GrowProps as MuiGrowProps, SlideProps as MuiSlideProps, ZoomProps as MuiZoomProps } from '@mui/material';
-export interface CodeplexColapsoProps extends MuiCollapseProps {
-}
-export declare const CodeplexColapso: ({ timeout, ...props }: CodeplexColapsoProps) => import("react/jsx-runtime").JSX.Element;
-export interface CodeplexDesvanecimientoProps extends MuiFadeProps {
-}
-export declare const CodeplexDesvanecimiento: ({ timeout, ...props }: CodeplexDesvanecimientoProps) => import("react/jsx-runtime").JSX.Element;
-export interface CodeplexCrecimientoProps extends MuiGrowProps {
-}
-export declare const CodeplexCrecimiento: ({ timeout, ...props }: CodeplexCrecimientoProps) => import("react/jsx-runtime").JSX.Element;
-export interface CodeplexDeslizamientoProps extends MuiSlideProps {
-}
-export declare const CodeplexDeslizamiento: ({ timeout, direction, ...props }: CodeplexDeslizamientoProps) => import("react/jsx-runtime").JSX.Element;
-export interface CodeplexZoomProps extends MuiZoomProps {
-}
-export declare const CodeplexZoom: ({ timeout, ...props }: CodeplexZoomProps) => import("react/jsx-runtime").JSX.Element;