frontend-plus-react 0.1.19 → 0.3.0

package/dist/index.d.ts

@@ -1,62 +1,58 @@
-import React$1, { ReactNode } from 'react';
-import { FieldDefinition, TableDefinition, MenuInfoBase, ProcedureDef, AppConfigClientSetup, DetailTable } from 'backend-plus';
+import React$1, { ReactNode, FC } from 'react';
+import { TableDefinition, FieldDefinition, MenuInfoBase, ProcedureDef, AppConfigClientSetup, DetailTable } from 'backend-plus';
 export { FieldDefinition, TableDefinition } from 'backend-plus';
 import { Details } from 'express-useragent';
 import { RenderCellProps, Column, RenderHeaderCellProps } from 'react-data-grid';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
+/**
+ * Recorre recursivamente los hijos de React buscando componentes que tengan una prop 'path'.
+ * Esto permite pasar <Route path="..."> o Fragmentos <><Route.../></> y extraer los strings.
+ */
+declare const extractPathsFromRoutes: (node: ReactNode) => string[];
+
+/**
+ * Marca con la que una fila nueva conserva su identidad en la grilla mientras se edita (antes de tener su clave primaria).
+ * Es un Symbol: no aparece en Object.keys ni en JSON.stringify, pero el spread de la fila (...fila) la conserva.
+ */
+declare const DOM_TEMP_ID: unique symbol;
+/** Una fila de datos de una tabla: los valores salen del servidor ya decodificados (JSON4all) */
+type FilaDeDatos = Record<string, unknown> & {
+    [DOM_TEMP_ID]?: string;
+};
 interface WScreenProps {
     screenName: string;
+    /**
+     * Parámetros de la pantalla como objeto plano (en backend-plus, el primer argumento de `mainAction`).
+     * Como detalle de una grilla son los fixedFields del detalle; en una ruta, la query string.
+     */
+    params?: Record<string, unknown>;
 }
-declare let wScreens: Record<string, React$1.FC<WScreenProps>>;
-declare const extendWScreens: (newWScreens: Record<string, React$1.FC<WScreenProps>>) => void;
-
-interface ClientSideProps extends RenderCellProps<any, any> {
+/** Decide, para una fila, si se muestra el botón de un detalle (`condition` del DetailTable) */
+type CondicionDeDetalle = (fila: FilaDeDatos) => boolean;
+type CondicionesMap = Record<string, CondicionDeDetalle>;
+interface ClientSideProps extends RenderCellProps<FilaDeDatos, FilaDeResumen> {
     fieldDefinition: FieldDefinition;
     tableDefinition: TableDefinition;
     primaryKey: string[];
 }
-declare let clientSides: Record<string, React$1.FC<ClientSideProps>>;
-declare const extendClientSides: (newRenderers: Record<string, React$1.FC<ClientSideProps>>) => void;
-
 interface ResultOkProps {
-    data: any;
-}
-type ResultComponentMap = {
-    [key: string]: React$1.FC<ResultOkProps>;
-};
-declare let resultsOk: ResultComponentMap;
-declare const extendResultsOk: (newComponents: ResultComponentMap) => void;
-
-interface RoutesProps {
-    myRoutes?: React$1.ReactNode;
-    myUnloggedRoutes?: React$1.ReactNode;
-    layout?: React$1.ComponentType;
-    unloggedLayout?: React$1.ComponentType;
+    /** Lo que devolvió el procedimiento (la forma depende de cada procedimiento) */
+    data: unknown;
 }
-declare function FrontendPlusReactRoutes({ myRoutes, myUnloggedRoutes, layout: Layout, unloggedLayout: UnloggedLayout }: RoutesProps): react_jsx_runtime.JSX.Element;
-type WScreenMap = Record<string, React$1.FC<WScreenProps>>;
-type ClientSidesMap = Record<string, React$1.FC<ClientSideProps>>;
-type ResultsOksMap = Record<string, React$1.FC<ResultOkProps>>;
+type WScreenMap = Record<string, FC<WScreenProps>>;
+type ClientSidesMap = Record<string, FC<ClientSideProps>>;
+type ResultsOksMap = Record<string, FC<ResultOkProps>>;
 interface AppProps {
-    myRoutes?: React$1.ReactNode;
-    myUnloggedRoutes?: React$1.ReactNode;
-    unloggedLayout?: React$1.ComponentType;
+    myRoutes?: ReactNode;
+    myUnloggedRoutes?: ReactNode;
+    unloggedLayout?: React.ComponentType;
     myWScreens?: WScreenMap;
     myClientSides?: ClientSidesMap;
     myResultsOk?: ResultsOksMap;
+    /** Condiciones de los detalles, por nombre (la `condition` de un DetailTable) */
+    myConditions?: CondicionesMap;
 }
-declare const FrontendPlusProviders: React$1.FC<{
-    children: React$1.ReactNode;
-    publicPaths: string[];
-}>;
-declare const App: ({ myRoutes, myUnloggedRoutes, unloggedLayout, myWScreens, myClientSides, myResultsOk }: AppProps) => react_jsx_runtime.JSX.Element;
-
-/**
- * Recorre recursivamente los hijos de React buscando componentes que tengan una prop 'path'.
- * Esto permite pasar <Route path="..."> o Fragmentos <><Route.../></> y extraer los strings.
- */
-declare const extractPathsFromRoutes: (node: ReactNode) => string[];
 
 interface CellFeedback {
     rowId: string;
@@ -65,27 +61,38 @@ interface CellFeedback {
     message?: string;
 }
 type CellFeedbackMap = Map<string, CellFeedback>;
-interface InputRendererProps<R extends Record<string, any>, S> {
+/** Lo que el manejo de teclas del editor necesita saber de la tecla (sirve para un evento real o uno encolado) */
+type TeclaDeEditor = Pick<React.KeyboardEvent, 'key' | 'target'>;
+interface InputRendererProps<R extends FilaDeDatos, S> {
     column: Column<R, S>;
     row: R;
     rowIdx: number;
     onRowChange: (row: R, commitChanges?: boolean) => void;
     onClose: (commitChanges?: boolean, shouldFocusCell?: boolean) => void;
     tableDefinition: TableDefinition;
-    cellFeedbackMap: CellFeedbackMap;
-    setCellFeedbackMap: React.Dispatch<React.SetStateAction<CellFeedbackMap>>;
-    onKeyPress?: (rowIndex: number, columnKey: string, event: React.KeyboardEvent, handleCommit: (currentValue: any, closeEditor: boolean, focusNextCell: boolean) => Promise<void>) => void;
-    setTableData: React.Dispatch<React.SetStateAction<any[]>>;
-    setLocalCellChanges: React.Dispatch<React.SetStateAction<Map<string, Set<string>>>>;
-    localCellChanges: Map<string, Set<string>>;
+    onKeyPress?: (rowIndex: number, columnKey: string, event: TeclaDeEditor, handleCommit: (currentValue: unknown, closeEditor: boolean, focusNextCell: boolean) => Promise<void>) => void;
+    /** El editor se registra para recibir las teclas (F4) que caen en la celda antes de que él tenga el foco; devuelve la baja */
+    registrarEditor?: (procesar: (key: string) => void) => () => void;
+    setTableData: React.Dispatch<React.SetStateAction<FilaDeDatos[]>>;
     primaryKey: string[];
 }
+interface Ancestor {
+    tableName: string;
+    row: FilaDeDatos;
+    tableDefinition: TableDefinition;
+    fixedFields?: FixedField[];
+}
 interface GenericDataGridProps$1 {
+    tableName: string;
+    fixedFields?: FixedField[];
+    onOpenDetail?: (tableName: string, fixedFields: FixedField[], label: string, ancestors: Ancestor[]) => void;
+    gridStyles?: React.CSSProperties;
+    ancestors?: Ancestor[];
 }
 interface FixedField {
     fieldName: string;
-    value: any;
-    until?: any;
+    value: unknown;
+    until?: unknown;
 }
 interface ConfirmDialogProps {
     open: boolean;
@@ -93,13 +100,37 @@ interface ConfirmDialogProps {
     title: string;
     message: string;
 }
-interface FilterRendererProps<R extends Record<string, any>, S> {
+/** El filtro de una columna: un texto (busca que contenga) o un operador con su valor */
+type FiltroDeColumna = string | {
+    operator?: string;
+    value?: string;
+};
+type FiltrosDeGrilla = Record<string, FiltroDeColumna>;
+/** Una entrada de la fila de totales: qué se calculó (suma, promedio...) y su valor */
+type EntradaDeTotal = {
+    type: string;
+    value: number;
+};
+/** Fila de resumen con los filtros de cada columna (arriba de la grilla, cuando se muestran los filtros) */
+type FilaDeFiltros = {
+    id: 'filterRow';
+    filters: FiltrosDeGrilla;
+    setFilters: React.Dispatch<React.SetStateAction<FiltrosDeGrilla>>;
+};
+/** Fila de resumen con los totales de las columnas que los tienen (pie de la grilla) */
+type FilaDeTotales = {
+    id: 'bottomSummaryRow';
+    totales: Record<string, EntradaDeTotal>;
+};
+/** Las filas de resumen de react-data-grid: filtros o totales */
+type FilaDeResumen = FilaDeFiltros | FilaDeTotales;
+interface FilterRendererProps<R extends FilaDeDatos, S> {
     column: Column<R, S>;
-    filters: Record<string, string>;
-    setFilters: React.Dispatch<React.SetStateAction<Record<string, string>>>;
+    filters: FiltrosDeGrilla;
+    setFilters: React.Dispatch<React.SetStateAction<FiltrosDeGrilla>>;
 }
 interface GenericDataGridForDetailProps {
-    parentRow: any;
+    parentRow: FilaDeDatos;
     detailTableDefinition: DetailTable;
     parentTableName: string;
 }
@@ -111,7 +142,7 @@ interface MenuListItemProps {
     level: number;
     onMenuItemClick?: () => void;
 }
-interface CustomCellProps<R extends Record<string, any>, SR> extends RenderCellProps<R, SR> {
+interface CustomCellProps<R extends FilaDeDatos, SR> extends RenderCellProps<R, SR> {
     column: RenderCellProps<R, SR>['column'] & {
         isPK?: boolean;
     };
@@ -152,10 +183,15 @@ interface SnackbarContextType {
 interface SnackbarProviderProps {
     children: ReactNode;
 }
-interface UseApiCallResult<T> {
-    callApi: (procedureName: string, params: Record<string, any>, opts?: {
-        reportOnSnackbar: boolean;
-    }) => Promise<T | undefined>;
+interface CallApiOptions {
+    isCritical?: boolean;
+}
+/** Los parámetros de un procedimiento por nombre; se codifican según la definición que manda el servidor */
+type ParametrosDeProcedimiento = Record<string, unknown>;
+interface UseApiCallResult {
+    /** R es la forma del resultado de ese procedimiento (el servidor puede no devolver nada: undefined) */
+    callApi: <R = unknown>(procedureName: string, params: ParametrosDeProcedimiento, opts?: CallApiOptions) => Promise<R | undefined>;
+    callApiUpload: <R = unknown>(procedureName: string, file: File, params: ParametrosDeProcedimiento, opts?: CallApiOptions) => Promise<R | undefined>;
     loading: boolean;
     error: Error | null;
 }
@@ -183,17 +219,66 @@ interface RouterState {
     redirectPath: string | null;
 }
 interface FetchApiOptions extends RequestInit {
+    /** No poner Content-Type: lo arma el navegador (por ejemplo con un FormData, que lleva su boundary) */
+    sinContentType?: boolean;
+}
+interface DataGridOption {
+    id: string;
+    label: string;
+    icon: React.ReactNode;
+    handler: () => Promise<void>;
+    visible?: boolean;
 }
 
 interface GenericDataGridProps {
     tableName: string;
     fixedFields?: FixedField[];
+    /** Abre un detalle en otra pestaña (Ctrl+click o botón del medio en el botón del detalle) */
+    onOpenDetail?: (tableName: string, fixedFields: FixedField[], label: string, ancestors: Ancestor[]) => void;
     gridStyles?: React$1.CSSProperties;
+    ancestors?: Ancestor[];
+    /** Es una grilla de detalle desplegada dentro de otra grilla */
+    anidada?: boolean;
+    /** Título a mostrar en lugar del de la tabla (por omisión, el título o nombre de la tabla, igual que la grilla principal) */
+    titulo?: string;
+    /** Clave en el CacheGrillasContext para volver a mostrarse sin recargar */
+    claveCache?: string;
+    /** La grilla anidada informa el alto que necesita para mostrarse completa */
+    onAltoDeseado?: (alto: number) => void;
+    /** La grilla anidada informa el ancho que necesita (sus columnas y los detalles que tenga abiertos) */
+    onAnchoDeseado?: (ancho: number) => void;
+    /** Alto máximo que puede tener esta grilla anidada (lo calcula la de arriba a partir de la ventana) */
+    altoDisponible?: number;
+    /**
+     * Tope opcional para el alto de las filas de detalle (en px). Sin tope (lo normal) cada detalle
+     * se muestra completo, como en backend-plus; con tope, el detalle más alto scrollea por dentro
+     * y virtualiza sus propias filas (útil si hay detalles de miles de filas).
+     */
+    altoMaximoDetalle?: number;
 }
+
 declare const GenericDataGrid: React$1.FC<GenericDataGridProps>;
 
+declare let clientSides: Record<string, React$1.FC<ClientSideProps>>;
+declare const extendClientSides: (newRenderers: Record<string, React$1.FC<ClientSideProps>>) => void;
+
+declare const extendConditions: (nuevas: CondicionesMap) => void;
+
 declare const ConfirmDialog: React.FC<ConfirmDialogProps>;
 
+interface RoutesProps {
+    myRoutes?: React$1.ReactNode;
+    myUnloggedRoutes?: React$1.ReactNode;
+    layout?: React$1.ComponentType;
+    unloggedLayout?: React$1.ComponentType;
+}
+declare function FrontendPlusReactRoutes({ myRoutes, myUnloggedRoutes, layout: Layout, unloggedLayout: UnloggedLayout }: RoutesProps): react_jsx_runtime.JSX.Element;
+declare const FrontendPlusProviders: React$1.FC<{
+    children: React$1.ReactNode;
+    publicPaths: string[];
+}>;
+declare const App: ({ myRoutes, myUnloggedRoutes, unloggedLayout, myWScreens, myClientSides, myResultsOk, myConditions }: AppProps) => react_jsx_runtime.JSX.Element;
+
 declare const MainLayout: React$1.FC;
 
 declare const SnackbarProvider: React$1.FC<SnackbarProviderProps>;
@@ -210,8 +295,8 @@ declare const useApp: () => {
 };
 declare const AppProvider: React$1.FC<AppProviderProps>;
 
-declare const useApiCall: <T = any>() => UseApiCallResult<T>;
-declare const useApiCallWithoutSnackbar: <T = any>() => UseApiCallResult<T>;
+declare const useApiCall: () => UseApiCallResult;
+declare const useApiCallWithoutSnackbar: () => UseApiCallResult;
 
 /**
  * Hook personalizado para manejar la lógica de cierre de sesión.
@@ -222,4 +307,13 @@ declare const useLogout: () => () => Promise<void>;
 
 declare const cambiarGuionesBajosPorEspacios: (texto: string) => string;
 
-export { App, type AppContextType, type AppProps, AppProvider, type AppProviderProps, type CellFeedback, type CellFeedbackMap, type ClientContextState, type ClientSideProps, type ClientSidesMap, ConfirmDialog, type ConfirmDialogProps, type CustomCellProps, type CustomHeaderCellProps, type FetchApiOptions, type FilterRendererProps, type FixedField, FrontendPlusProviders, FrontendPlusReactRoutes, GenericDataGrid, type GenericDataGridForDetailProps, type GenericDataGridProps$1 as GenericDataGridProps, type InputRendererProps, MainLayout, type MenuListItemProps, type MenuUiState, type PrivateRouteProps, type ResultOkProps, type ResultsOksMap, type RouterState, type SideMenuProps, type SnackbarContextType, SnackbarProvider, type SnackbarProviderProps, type SnackbarState, type UseApiCallResult, type WScreenMap, type WScreenProps, cambiarGuionesBajosPorEspacios, clientSides, extendClientSides, extendResultsOk, extendWScreens, extractPathsFromRoutes, resultsOk as resultComponents, useApiCall, useApiCallWithoutSnackbar, useApp, useLogout, useSnackbar, wScreens };
+declare let wScreens: Record<string, React$1.FC<WScreenProps>>;
+declare const extendWScreens: (newWScreens: Record<string, React$1.FC<WScreenProps>>) => void;
+
+type ResultComponentMap = {
+    [key: string]: React$1.FC<ResultOkProps>;
+};
+declare let resultsOk: ResultComponentMap;
+declare const extendResultsOk: (newComponents: ResultComponentMap) => void;
+
+export { type Ancestor, App, type AppContextType, type AppProps, AppProvider, type AppProviderProps, type CallApiOptions, type CellFeedback, type CellFeedbackMap, type ClientContextState, type ClientSideProps, type ClientSidesMap, type CondicionDeDetalle, type CondicionesMap, ConfirmDialog, type ConfirmDialogProps, type CustomCellProps, type CustomHeaderCellProps, DOM_TEMP_ID, type DataGridOption, type EntradaDeTotal, type FetchApiOptions, type FilaDeDatos, type FilaDeFiltros, type FilaDeResumen, type FilaDeTotales, type FilterRendererProps, type FiltroDeColumna, type FiltrosDeGrilla, type FixedField, FrontendPlusProviders, FrontendPlusReactRoutes, GenericDataGrid, type GenericDataGridForDetailProps, type GenericDataGridProps$1 as GenericDataGridProps, type InputRendererProps, MainLayout, type MenuListItemProps, type MenuUiState, type ParametrosDeProcedimiento, type PrivateRouteProps, type ResultOkProps, type ResultsOksMap, type RouterState, type SideMenuProps, type SnackbarContextType, SnackbarProvider, type SnackbarProviderProps, type SnackbarState, type TeclaDeEditor, type UseApiCallResult, type WScreenMap, type WScreenProps, cambiarGuionesBajosPorEspacios, clientSides, extendClientSides, extendConditions, extendResultsOk, extendWScreens, extractPathsFromRoutes, resultsOk as resultComponents, useApiCall, useApiCallWithoutSnackbar, useApp, useLogout, useSnackbar, wScreens };