@acvl/frontend-components 0.0.49 → 0.0.51

package/dist/esm/types/src/components/v2/inputs/controlled/ControlledAddressAutocomplete/index.d.ts

@@ -1,4 +1,5 @@
 import { type TextFieldProps } from "@mui/material";
+import { type DetailRenderProps } from "../types";
 /**
  * Forma JSON que se guarda en el formulario / se envía al backend.
  * Para direcciones escritas a mano solo viene `formatted_address`.
@@ -42,5 +43,6 @@ interface ControlledAddressAutocompleteProps {
 declare const ControlledAddressAutocomplete: {
     ({ name, label, control, fieldProps, extraProps, }: ControlledAddressAutocompleteProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
+    formatDetail({ fieldData }: DetailRenderProps): string;
 };
 export default ControlledAddressAutocomplete;

package/dist/esm/types/src/components/v2/inputs/controlled/ControlledAmountWithCurrency/index.d.ts

@@ -1,6 +1,7 @@
 import { type InputBaseProps } from "@mui/material";
 import { type NumericFormatProps } from "react-number-format";
 import { type ComoOpcionesProps } from "@v1";
+import { type DetailRenderProps } from "../types";
 /** Opción de un desplegable: `{ value, label }`. */
 interface Opciones {
     value: string;
@@ -45,5 +46,6 @@ interface ControlledAmountWithCurrencyProps {
 declare const ControlledAmountWithCurrency: {
     ({ name, control, fieldProps, extraProps, }: ControlledAmountWithCurrencyProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
+    formatDetail({ fieldData, extraProps, data, name, }: DetailRenderProps): string;
 };
 export default ControlledAmountWithCurrency;

package/dist/esm/types/src/components/v2/inputs/controlled/ControlledDate/index.d.ts

@@ -0,0 +1,12 @@
+import { type ControlledInput } from "../types";
+/**
+ * `ControlledDate` de v2. Reutiliza el renderizado de edición de v1 (no se
+ * duplica su lógica) y añade el renderizado de detalle mediante `formatDetail`,
+ * de modo que la página de detalle no necesita conocer este tipo de campo.
+ *
+ * Migrar un input a v2 consiste en esto: envolver el componente de v1 y
+ * adjuntarle `formatDetail` (y opcionalmente `Detail`). Sirve de plantilla para
+ * el resto de inputs.
+ */
+declare const ControlledDate: ControlledInput;
+export default ControlledDate;

package/dist/esm/types/src/components/v2/inputs/controlled/ControlledFileField/index.d.ts

@@ -0,0 +1,8 @@
+import { type ControlledInput } from "../types";
+/**
+ * `ControlledFileField` de v2. Reutiliza el renderizado de edición de v1 y
+ * aporta su renderizado de detalle completo mediante `Detail` (badge + popover),
+ * además del texto formateado mediante `formatDetail`.
+ */
+declare const ControlledFileField: ControlledInput;
+export default ControlledFileField;

package/dist/esm/types/src/components/v2/inputs/controlled/ControlledSelect/index.d.ts

@@ -0,0 +1,7 @@
+import { type ControlledInput } from "../types";
+/**
+ * `ControlledSelect` de v2. Reutiliza el renderizado de edición de v1 y añade el
+ * renderizado de detalle (une las etiquetas de las opciones seleccionadas).
+ */
+declare const ControlledSelect: ControlledInput;
+export default ControlledSelect;

package/dist/esm/types/src/components/v2/inputs/controlled/index.d.ts

@@ -1,3 +1,7 @@
 export { default as ControlledAddressAutocomplete } from "./ControlledAddressAutocomplete";
 export type { AddressValue } from "./ControlledAddressAutocomplete";
 export { default as ControlledAmountWithCurrency } from "./ControlledAmountWithCurrency";
+export { default as ControlledDate_v2 } from "./ControlledDate";
+export { default as ControlledSelect_v2 } from "./ControlledSelect";
+export { default as ControlledFileField_v2 } from "./ControlledFileField";
+export type { ControlledInput, DetailRenderProps } from "./types";

package/dist/esm/types/src/components/v2/inputs/controlled/types.d.ts

@@ -0,0 +1,31 @@
+import { type FC, type ReactNode } from "react";
+/**
+ * Datos que recibe el renderizado de detalle de un input. Es un subconjunto de
+ * `FieldProps` (los campos que necesita la vista de solo lectura), más un
+ * `content` opcional con el valor ya formateado y envuelto con pre/post por el
+ * contenedor `DetailField` (útil para renderizadores completos como archivos).
+ */
+export interface DetailRenderProps {
+    fieldData?: any;
+    /** Registro completo de la página; permite leer valores hermanos. */
+    data?: any;
+    name?: string;
+    detail_name?: string;
+    extraProps?: any;
+    /** Valor formateado + pre/post, disponible para `Detail`. */
+    content?: string;
+}
+/**
+ * Contrato de un input controlado de v2. Además de renderizar su modo de
+ * edición (el propio componente), puede aportar su propia lógica de detalle:
+ *
+ * - `formatDetail`: convierte el valor en contenido mostrable (string o nodo).
+ *   Cubre la mayoría de los casos; el contenedor se encarga de envolverlo con
+ *   enlaces de navegación y pre/post.
+ * - `Detail`: renderizado de detalle completo (badges, popovers…). Poco común;
+ *   solo para inputs que necesitan controlar toda su UI de solo lectura.
+ */
+export interface ControlledInput<P = any> extends FC<P> {
+    formatDetail?: (props: DetailRenderProps) => ReactNode;
+    Detail?: (props: DetailRenderProps) => ReactNode;
+}

package/dist/esm/types/src/components/v2/layout/pages/DetailPage/ActionsMenu.d.ts

@@ -0,0 +1,17 @@
+import { type ReactNode } from "react";
+export interface ActionsMenuProps {
+    delete?: {
+        mutation: any;
+        disableNavBack?: boolean;
+    };
+    historial?: {
+        endpoint?: string;
+    };
+    extraButtons?: {
+        title: string;
+        icon: ReactNode;
+        onClick: () => void;
+    }[];
+}
+declare const ActionsMenu: (props: ActionsMenuProps) => import("react/jsx-runtime").JSX.Element;
+export default ActionsMenu;

package/dist/esm/types/src/components/v2/layout/pages/DetailPage/Field/EditField.d.ts

@@ -1,4 +1,4 @@
 import { type FieldProps } from "./index";
 type Props = Partial<FieldProps>;
-declare const EditField: (props: Props) => any;
+declare const EditField: (props: Props) => string | number | bigint | boolean | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | Promise<import("react").ReactNode> | null | undefined;
 export default EditField;

package/dist/esm/types/src/components/v2/layout/pages/DetailPage/Field/index.d.ts

@@ -1,5 +1,6 @@
 import { type GridProps } from "@mui/material";
 import { type PageType } from "@v1";
+import { type ControlledInput } from "@v2/inputs/controlled";
 export interface FieldProps {
     pageType?: PageType;
     fieldData?: any;
@@ -10,7 +11,8 @@ export interface FieldProps {
     label: string;
     /** Ubicación de la etiqueta respecto al campo. Por defecto `"top"`. */
     labelPosition?: "top" | "left";
-    type: any;
+    /** Input controlado a renderizar (edición) y, opcionalmente, su detalle. */
+    type: ControlledInput;
     gridProps?: GridProps;
     fieldProps?: object;
     extraProps?: any;

package/dist/esm/types/src/components/v2/layout/pages/DetailPage/index.d.ts

@@ -12,6 +12,7 @@ export interface DetailPageV2Props {
         mutate: {
             mutation: any;
             args?: any;
+            disable?: boolean;
         };
         delete?: {
             mutation: any;
@@ -29,7 +30,10 @@ export interface DetailPageV2Props {
         button?: ReactNode;
         extraButtons?: {
             pageType: PageType | "all";
-            render: (id: number) => ReactNode;
+            title: string;
+            icon: ReactNode;
+            onClick: (data: any) => void;
+            display?: (data: any) => boolean;
         }[];
         badge?: string;
     };

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import * as _mui_material from '@mui/material';
 import { ButtonProps, ButtonGroupProps, IconButtonProps, MenuItemProps, AlertProps, BoxProps, AutocompleteProps, SliderProps, SwitchProps, GridProps, DrawerProps, MenuProps, PaletteColorOptions, TextFieldProps as TextFieldProps$1, InputBaseProps } from '@mui/material';
 import * as React from 'react';
-import React__default, { ReactNode, Dispatch, SetStateAction, JSX, RefObject, JSXElementConstructor, ElementType } from 'react';
+import React__default, { ReactNode, Dispatch, SetStateAction, JSX, RefObject, FC, JSXElementConstructor, ElementType } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { GridRowId, GridRowSelectionModel, GridSortModel, GridFilterModel, GridRowModesModel, GridRenderEditCellParams, GridToolbarProps, DataGridProps as DataGridProps$1 } from '@mui/x-data-grid';
 import { DataGridProps, GridBaseColDef } from '@mui/x-data-grid/internals';
@@ -405,7 +405,7 @@ interface ControlledDateProps extends BaseControlledFieldProps {
         disableHT?: boolean;
     };
 }
-declare const ControlledDate: React__default.FC<ControlledDateProps>;
+declare const ControlledDate$1: React__default.FC<ControlledDateProps>;
 
 interface ControlledDropdownProps extends BaseControlledFieldProps {
     fieldProps?: Partial<AutocompleteProps<any, any, any, any>>;
@@ -449,7 +449,7 @@ interface ControlledSelectProps extends BaseControlledFieldProps {
         }[];
     };
 }
-declare const ControlledSelect: React__default.FC<ControlledSelectProps>;
+declare const ControlledSelect$1: React__default.FC<ControlledSelectProps>;
 
 interface ControlledSliderProps$1 extends BaseControlledFieldProps {
     fieldProps?: Partial<SliderProps>;
@@ -506,7 +506,7 @@ interface ControlledFileFieldProps extends BaseControlledFieldProps {
         };
     };
 }
-declare const ControlledFileField: React__default.FC<ControlledFileFieldProps>;
+declare const ControlledFileField$1: React__default.FC<ControlledFileFieldProps>;
 
 interface ControlledSliderProps extends BaseControlledFieldProps {
     fieldProps?: Partial<SliderProps>;
@@ -931,6 +931,37 @@ declare module '@mui/material/styles' {
 }
 declare const theme: () => _mui_material.Theme;
 
+/**
+ * Datos que recibe el renderizado de detalle de un input. Es un subconjunto de
+ * `FieldProps` (los campos que necesita la vista de solo lectura), más un
+ * `content` opcional con el valor ya formateado y envuelto con pre/post por el
+ * contenedor `DetailField` (útil para renderizadores completos como archivos).
+ */
+interface DetailRenderProps {
+    fieldData?: any;
+    /** Registro completo de la página; permite leer valores hermanos. */
+    data?: any;
+    name?: string;
+    detail_name?: string;
+    extraProps?: any;
+    /** Valor formateado + pre/post, disponible para `Detail`. */
+    content?: string;
+}
+/**
+ * Contrato de un input controlado de v2. Además de renderizar su modo de
+ * edición (el propio componente), puede aportar su propia lógica de detalle:
+ *
+ * - `formatDetail`: convierte el valor en contenido mostrable (string o nodo).
+ *   Cubre la mayoría de los casos; el contenedor se encarga de envolverlo con
+ *   enlaces de navegación y pre/post.
+ * - `Detail`: renderizado de detalle completo (badges, popovers…). Poco común;
+ *   solo para inputs que necesitan controlar toda su UI de solo lectura.
+ */
+interface ControlledInput<P = any> extends FC<P> {
+    formatDetail?: (props: DetailRenderProps) => ReactNode;
+    Detail?: (props: DetailRenderProps) => ReactNode;
+}
+
 /**
  * Forma JSON que se guarda en el formulario / se envía al backend.
  * Para direcciones escritas a mano solo viene `formatted_address`.
@@ -974,6 +1005,7 @@ interface ControlledAddressAutocompleteProps {
 declare const ControlledAddressAutocomplete: {
     ({ name, label, control, fieldProps, extraProps, }: ControlledAddressAutocompleteProps): react_jsx_runtime.JSX.Element;
     displayName: string;
+    formatDetail({ fieldData }: DetailRenderProps): string;
 };
 
 /** Opción de un desplegable: `{ value, label }`. */
@@ -1020,8 +1052,33 @@ interface ControlledAmountWithCurrencyProps {
 declare const ControlledAmountWithCurrency: {
     ({ name, control, fieldProps, extraProps, }: ControlledAmountWithCurrencyProps): react_jsx_runtime.JSX.Element;
     displayName: string;
+    formatDetail({ fieldData, extraProps, data, name, }: DetailRenderProps): string;
 };
 
+/**
+ * `ControlledDate` de v2. Reutiliza el renderizado de edición de v1 (no se
+ * duplica su lógica) y añade el renderizado de detalle mediante `formatDetail`,
+ * de modo que la página de detalle no necesita conocer este tipo de campo.
+ *
+ * Migrar un input a v2 consiste en esto: envolver el componente de v1 y
+ * adjuntarle `formatDetail` (y opcionalmente `Detail`). Sirve de plantilla para
+ * el resto de inputs.
+ */
+declare const ControlledDate: ControlledInput;
+
+/**
+ * `ControlledSelect` de v2. Reutiliza el renderizado de edición de v1 y añade el
+ * renderizado de detalle (une las etiquetas de las opciones seleccionadas).
+ */
+declare const ControlledSelect: ControlledInput;
+
+/**
+ * `ControlledFileField` de v2. Reutiliza el renderizado de edición de v1 y
+ * aporta su renderizado de detalle completo mediante `Detail` (badge + popover),
+ * además del texto formateado mediante `formatDetail`.
+ */
+declare const ControlledFileField: ControlledInput;
+
 interface FieldProps {
     pageType?: PageType;
     fieldData?: any;
@@ -1032,7 +1089,8 @@ interface FieldProps {
     label: string;
     /** Ubicación de la etiqueta respecto al campo. Por defecto `"top"`. */
     labelPosition?: "top" | "left";
-    type: any;
+    /** Input controlado a renderizar (edición) y, opcionalmente, su detalle. */
+    type: ControlledInput;
     gridProps?: GridProps;
     fieldProps?: object;
     extraProps?: any;
@@ -1084,6 +1142,7 @@ interface DetailPageV2Props {
         mutate: {
             mutation: any;
             args?: any;
+            disable?: boolean;
         };
         delete?: {
             mutation: any;
@@ -1101,7 +1160,10 @@ interface DetailPageV2Props {
         button?: ReactNode;
         extraButtons?: {
             pageType: PageType | "all";
-            render: (id: number) => ReactNode;
+            title: string;
+            icon: ReactNode;
+            onClick: (data: any) => void;
+            display?: (data: any) => boolean;
         }[];
         badge?: string;
     };
@@ -1243,5 +1305,5 @@ declare const useMutationHandler: ({ mutationFn, form, onSuccess, onValidationEr
     }) => void;
 };
 
-export { APIContext, APIProvider, ActiveCell, ActiveIcon, Base, ButtonWithDrawer, CSVUpload, ContentLayout, ControlledAddressAutocomplete, ControlledAmountWithCurrency, ControlledDate, ControlledDropdown, ControlledFileField, FileUploadBox as ControlledFileUploadBox, ControlledNumber, ControlledPhoneNumber, ControlledSelect, ControlledSlider as ControlledSimpleSlider, ControlledSlider$1 as ControlledSlider, ControlledSwitch, ControlledText, ControlledTimePicker, ControlledToggleButtons, CoverPage, CreateButtonBase, CreateButtonWithMenuOptions, CrudDropdown, CustomNoRows, DeleteButton, DeleteConfirmationDialog, DetailPage$1 as DetailPage, DetailPage as DetailPage_v2, EditButton, ExportCSV, ExtraButtons, HistorialDrawer, ListPage, Loadable, LoadingComponent, Logo, MainDrawer, MainLayout, MenuItemWithLoading, ModuleCard, MoreOptions, MyGridEditSingleSelect, NavigationContext, NavigationProvider, NormalOrIcon, NotAllowed, NotFound, ObjectProgressStack, SaveCancelButton, StatusBadge, StyledMenu, Tabs, Transitions, UncontrolledText, changeTitle, closeProgressSnack, deleteColumn, editColumn, filterQuery, formParser, _default as headerReducer, manualCacheRefresh, mergeSettings, openProgressSnack, query, renderEditCellWithErrorTooltip, setErrors, _default$1 as snackProgressReducer, tags, theme, updateProgressSnackData, useAPI, useHasPermission, useMutationHandler, useNavigation, valueLabel };
-export type { APIcontextProps, AddressValue, ComoOpcionesProps, CustomToolbarProps, DeleteGridColumnsProps, DetachedPage, EditGridColumnsProps, EditReadOnlyFields, FieldFilter, FieldProps$1 as FieldProps, FieldValidationProps, GridArgs, GridColDefPropsOverrides, JSONFormProps, JSONParserProps, MainLayoutPageHeaderProps, MainLayoutProps, MainLayoutSidebarFooterProps, MyDataGridProps, MyGridFilterModel, MyTab, MyTabProps, PageType, ProgressStatusProps };
+export { APIContext, APIProvider, ActiveCell, ActiveIcon, Base, ButtonWithDrawer, CSVUpload, ContentLayout, ControlledAddressAutocomplete, ControlledAmountWithCurrency, ControlledDate$1 as ControlledDate, ControlledDate as ControlledDate_v2, ControlledDropdown, ControlledFileField$1 as ControlledFileField, ControlledFileField as ControlledFileField_v2, FileUploadBox as ControlledFileUploadBox, ControlledNumber, ControlledPhoneNumber, ControlledSelect$1 as ControlledSelect, ControlledSelect as ControlledSelect_v2, ControlledSlider as ControlledSimpleSlider, ControlledSlider$1 as ControlledSlider, ControlledSwitch, ControlledText, ControlledTimePicker, ControlledToggleButtons, CoverPage, CreateButtonBase, CreateButtonWithMenuOptions, CrudDropdown, CustomNoRows, DeleteButton, DeleteConfirmationDialog, DetailPage$1 as DetailPage, DetailPage as DetailPage_v2, EditButton, ExportCSV, ExtraButtons, HistorialDrawer, ListPage, Loadable, LoadingComponent, Logo, MainDrawer, MainLayout, MenuItemWithLoading, ModuleCard, MoreOptions, MyGridEditSingleSelect, NavigationContext, NavigationProvider, NormalOrIcon, NotAllowed, NotFound, ObjectProgressStack, SaveCancelButton, StatusBadge, StyledMenu, Tabs, Transitions, UncontrolledText, changeTitle, closeProgressSnack, deleteColumn, editColumn, filterQuery, formParser, _default as headerReducer, manualCacheRefresh, mergeSettings, openProgressSnack, query, renderEditCellWithErrorTooltip, setErrors, _default$1 as snackProgressReducer, tags, theme, updateProgressSnackData, useAPI, useHasPermission, useMutationHandler, useNavigation, valueLabel };
+export type { APIcontextProps, AddressValue, ComoOpcionesProps, ControlledInput, CustomToolbarProps, DeleteGridColumnsProps, DetachedPage, DetailRenderProps, EditGridColumnsProps, EditReadOnlyFields, FieldFilter, FieldProps$1 as FieldProps, FieldValidationProps, GridArgs, GridColDefPropsOverrides, JSONFormProps, JSONParserProps, MainLayoutPageHeaderProps, MainLayoutProps, MainLayoutSidebarFooterProps, MyDataGridProps, MyGridFilterModel, MyTab, MyTabProps, PageType, ProgressStatusProps };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@acvl/frontend-components",
-    "version": "0.0.49",
+    "version": "0.0.51",
     "description": "Component library for ACV frontend projects.",
     "homepage": "https://github.com/ACV-Logistics/acv-frontend-components#readme",
     "access": "public",