@acvl/frontend-components 0.0.15 → 0.0.17

package/dist/cjs/types/src/components/v1/badges/StatusBadge/StatusBadge.d.ts

@@ -1,8 +1,11 @@
-import { AlertProps } from "@mui/material";
+import { AlertProps, BoxProps } from "@mui/material";
 import React from "react";
 interface StatusBadgeProps {
     severity?: AlertProps['severity'];
     title: string;
+    slotProps?: {
+        box?: Partial<BoxProps>;
+    };
 }
 declare const StatusBadge: React.FC<StatusBadgeProps>;
 export default StatusBadge;

package/dist/cjs/types/src/components/v1/datagrids/wrappers/CreateGridWrapper.d.ts

@@ -16,6 +16,7 @@ export interface CreateGridWrapperProps extends CreateGridAPIProps {
     renderFunction: (props: any) => JSX.Element;
     dataGridProps?: Partial<MyDataGridProps>;
     pathname: string;
+    navigation?: string;
 }
 declare const CreateGridWrapper: (props: CreateGridWrapperProps) => import("react/jsx-runtime").JSX.Element;
 export default CreateGridWrapper;

package/dist/cjs/types/src/components/v1/forms/utils.d.ts

@@ -14,5 +14,5 @@ export interface JSONFormProps {
     props?: JSONParserProps;
 }
 export declare const jsonForm: ({ submitData, data, useLabel, props }: JSONFormProps) => any;
-export declare const formDataForm: (object: any) => FormData;
+export declare const formDataForm: ({ submitData, data, useLabel, props }: JSONFormProps) => FormData;
 export declare const setErrors: (form: any, error: any) => void;

package/dist/cjs/types/src/components/v1/inputs/controlled/ControlledPhotoField/index.d.ts

@@ -0,0 +1,6 @@
+import { BaseControlledFieldProps } from "../types";
+import React from "react";
+export interface ControlledPhotoFieldProps extends BaseControlledFieldProps {
+}
+declare const ControlledPhotoField: React.FC<ControlledPhotoFieldProps>;
+export default ControlledPhotoField;

package/dist/cjs/types/src/components/v1/inputs/controlled/ControlledSimpleSlider/index.d.ts

@@ -0,0 +1,8 @@
+import { SliderProps } from "@mui/material";
+import React from "react";
+import { BaseControlledFieldProps } from "../types";
+export interface ControlledSliderProps extends BaseControlledFieldProps {
+    fieldProps?: Partial<SliderProps>;
+}
+declare const ControlledSlider: React.FC<ControlledSliderProps>;
+export default ControlledSlider;

package/dist/cjs/types/src/components/v1/inputs/controlled/index.d.ts

@@ -9,3 +9,5 @@ export { default as ControlledSwitch } from './ControlledSwitch';
 export { default as ControlledText } from './ControlledText';
 export { default as ControlledToggleButtons } from './ControlledToggleButtons';
 export { default as ControlledTimePicker } from './ControlledTimePicker';
+export { default as ControlledPhotoField } from './ControlledPhotoField';
+export { default as ControlledSimpleSlider } from './ControlledSimpleSlider';

package/dist/cjs/types/src/components/v1/layout/pages/DetailPage/index.d.ts

@@ -53,6 +53,7 @@ export interface DetailPageProps {
     edit: {
         defaultValues: any;
         schema: any;
+        useFormData?: boolean;
     };
     mainValidation?: {
         api: {

package/dist/esm/index.js

@@ -25643,82 +25643,90 @@ dayjs.locale(es);
 dayjs.extend(duration);
 
 // ==============================|| JSON ||============================== //
-const typeSwitch = ({ base_object, base_key, response, submitData, useLabel, data, props }) => {
+const typeSwitch = ({ base_object, base_key, response, submitData, useLabel, data, props, formType }) => {
     const ignore = get$1(props, `${base_key}.ignore`, false);
-    if (ignore)
+    if (ignore || ['obj_permissions', 'has_history'].includes(base_key))
         return;
     const altered_key = invoke(props, `${base_key}.alter_key`, base_key);
     const key = altered_key || base_key;
     const altered_obj = invoke(props, `${base_key}.alter_value`, base_object, submitData);
     const object = altered_obj || base_object;
+    const setValue = (form, key, value) => {
+        if (formType === "json") {
+            set(form, key, object);
+        }
+        else if (formType === "formData") {
+            form.append(key, value);
+        }
+    };
     switch (typeof object) {
         case "string":
             if (invoke(props, `${base_key}.extra_validation`, object))
                 return;
-            set(response, key, isEmpty(object) ? '' : object);
+            setValue(response, key, isEmpty(object) ? '' : object);
             break;
         case "number":
-            set(response, key, object);
+            setValue(response, key, object);
             break;
         case "boolean":
-            set(response, key, object);
+            setValue(response, key, object);
             break;
         case "object":
             if (isNull(object) || isEmpty(object)) {
                 if (includes(key, 'after') || includes(key, 'before'))
-                    set(response, key, '');
+                    setValue(response, key, '');
                 else
-                    set(response, key, object);
+                    setValue(response, key, object);
             }
             else if (object instanceof dayjs) {
-                set(response, key, object.format(get$1(props, `${key}.format`, 'YYYY-MM-DD')));
+                setValue(response, key, object.format(get$1(props, `${key}.format`, 'YYYY-MM-DD')));
             }
             else if ('label' in object && 'value' in object) {
                 if (useLabel)
-                    set(response, key, object['label']);
+                    setValue(response, key, object['label']);
                 else
-                    set(response, key, object['value']);
+                    setValue(response, key, object['value']);
             }
             else if (Array.isArray(object)) { // it is an array
                 if (object.length && typeof object[0] == 'object' && !Array.isArray(object[0]) && 'value' in object[0] && object[0]['value'] == 'all') { // for data grid filters
-                    set(response, key, '');
+                    setValue(response, key, '');
                 }
                 else {
                     forEach(object, (arrayItem, idx) => {
                         if (typeof arrayItem == 'object') {
                             if ('label' in arrayItem) {
-                                set(response, `${key}.${idx}`, function (item) {
+                                setValue(response, `${key}.${idx}`, function (item) {
                                     if (useLabel)
                                         return item.label;
                                     else
                                         return item.value;
                                 });
                             }
-                            typeSwitch({ base_object: arrayItem, base_key: `${key}.${idx}`, response: response, useLabel: useLabel, data: data, submitData: submitData });
+                            typeSwitch({ base_object: arrayItem, base_key: `${key}.${idx}`, response: response, useLabel: useLabel, data: data, submitData: submitData, props: props, formType: formType });
                         }
                         else {
                             const keyArray = get$1(response, key);
                             if (keyArray)
                                 keyArray.push(arrayItem);
                             else
-                                set(response, key, [arrayItem]);
+                                setValue(response, key, [arrayItem]);
                         }
                     });
                 }
             }
             else if (object instanceof Set) {
-                set(response, key, Array.from(object));
+                setValue(response, key, Array.from(object));
             }
             else {
                 forEach(object, (value, key2) => {
                     if (!includes(['id', 'transporte.tarifa.cargos_adicionales'], key) && isEqual(get$1(data, `${key}.${key2}`), value))
                         return;
-                    typeSwitch({ base_object: value, base_key: `${key}.${key2}`, response: response, useLabel: useLabel, data: data, submitData: submitData, props: props });
+                    typeSwitch({ base_object: value, base_key: `${key}.${key2}`, response: response, useLabel: useLabel, data: data, submitData: submitData, props: props, formType: formType });
                 });
             }
             break;
         default:
-            set(response, key, object);
+            setValue(response, key, object);
             break;
     }
 };
@@ -25727,69 +25735,34 @@ const jsonForm = ({ submitData, data, useLabel, props }) => {
     forEach(submitData, function (value, key) {
         if (key != 'id' && isEqual(get$1(data, key), value))
             return;
-        typeSwitch({ base_object: value, base_key: key, response: response, useLabel: useLabel, data: data, props: props, submitData: submitData });
+        typeSwitch({
+            base_object: value,
+            base_key: key,
+            response: response,
+            useLabel: useLabel,
+            data: data,
+            props: props,
+            submitData: submitData,
+            formType: 'json',
+        });
     });
     return response;
 };
-// ==============================|| FORM DATA ||============================== //
-const formConversion = (key, value, formData) => {
-    switch (typeof value) {
-        case "string":
-            if (!value)
-                return;
-            formData.append(key, value);
-            break;
-        case "bigint":
-        case "number":
-            if (!value)
-                return;
-            formData.append(key, value.toString());
-            break;
-        case "boolean":
-            if (value) {
-                formData.append(key, 'True');
-            }
-            else {
-                formData.append(key, 'False');
-            }
-            break;
-        case "object":
-            if (!value)
-                return;
-            if (Array.isArray(value) && value.length) {
-                for (let i = 0; i < value.length; i++) {
-                    formConversion(`${key}[${i}]`, value[i], formData);
-                }
-            }
-            else {
-                if (value instanceof Date) {
-                    formData.append(key, dayjs(value).format('YYYY-MM-DDTHH:mmZ'));
-                }
-                else if (dayjs.isDayjs(value)) {
-                    // if (key == 'scheduling.end') {
-                    //     formData.append(key, value.format('YYYY-MM-DD'))
-                    // } else {
-                    formData.append(key, value.format('YYYY-MM-DD'));
-                    // }
-                }
-                else if (value instanceof File) {
-                    formData.append(key, value);
-                }
-                else {
-                    Object.keys(value).forEach(key2 => {
-                        if (value[key2] != undefined) {
-                            formConversion(`${key}.${key2}`, value[key2], formData);
-                        }
-                    });
-                }
-            }
-            break;
-    }
-};
-const formDataForm = (object) => {
+const formDataForm = ({ submitData, data, useLabel, props }) => {
     const formData = new FormData();
-    Object.keys(object).forEach(key => {
-        formConversion(key, object[key], formData);
+    forEach(submitData, function (value, key) {
+        if (key != 'id' && isEqual(get$1(data, key), value))
+            return;
+        typeSwitch({
+            base_object: value,
+            base_key: key,
+            response: formData,
+            useLabel: useLabel,
+            data: data,
+            props: props,
+            submitData: submitData,
+            formType: 'formData',
+        });
     });
     return formData;
 };
@@ -25967,7 +25940,7 @@ const FileUploadBox = (props) => {
     const Dropzone = ({ onChange, value }) => {
         const onDrop = useCallback((acceptedFiles) => {
             acceptedFiles.map(file => {
-                const data = formDataForm({ archivo: file });
+                const data = formDataForm({ });
                 validarCSV({ endpoint: props.csvProps.endpoint || '', data: data, custom: props.csvProps.custom }).unwrap()
                     .then((response) => {
                     onChange('archivo' in response ? response.archivo : acceptedFiles[0]);
@@ -26382,7 +26355,7 @@ const ControlledSelect = (props) => {
 };
 
 // ==============================|| DESLIZADOR CONTROLADO ||============================== //
-const ControlledSlider = (props) => {
+const ControlledSlider$1 = (props) => {
     const [_val, setVal] = useState([]);
     return (
     // controlador
@@ -26497,6 +26470,19 @@ const ControlledTimePicker = (props) => {
         } }));
 };
 
+const ControlledPhotoField = (props) => {
+    return (jsx(Controller, { control: props.control, name: props.name, render: ({ field: { onChange, onBlur, ref } }) => (jsx("input", { type: "file", accept: "image/*", ref: ref, onBlur: onBlur, onChange: (e) => onChange(e.target.files && e.target.files[0]) })) }));
+};
+
+// ==============================|| DESLIZADOR CONTROLADO ||============================== //
+const ControlledSlider = (props) => {
+    return (
+    // controlador
+    jsx(Controller, { name: props.name, control: props.control, render: ({ field: { onChange, value }, }) => {
+            return (jsx(Slider, { value: value, onChange: onChange, valueLabelDisplay: 'auto', sx: { mx: 2, width: 0.87 }, ...props.fieldProps }));
+        } }));
+};
+
 const DeleteConfirmationDialog = (props) => {
     const notifications = useNotifications();
     const pathname = 'temp';
@@ -26763,7 +26749,7 @@ const StatusBadge = (props) => {
         }
     }, [props?.severity]);
     if (props)
-        return (jsx(Box, { display: 'flex', justifyContent: 'center', alignItems: 'center', border: 4, borderRadius: 1, borderColor: color[800], bgcolor: color[100], height: 1, minWidth: 100, px: 1, children: jsx(Typography$1, { fontWeight: 'bold', sx: {
+        return (jsx(Box, { display: 'flex', justifyContent: 'center', alignItems: 'center', border: 4, borderRadius: 1, borderColor: color[800], bgcolor: color[100], height: 1, minWidth: 100, px: 1, ...props.slotProps?.box, children: jsx(Typography$1, { fontWeight: 'bold', sx: {
                     color: color[900]
                 }, children: props.title }) }));
     return null;
@@ -26989,7 +26975,7 @@ const generateSchema = (columns, columnsFilter, id) => {
                     dynamicSchema[`${column.field}_max`] = z.number().or(z.string()).optional();
                     dv[`${column.field}_min`] = '';
                     dv[`${column.field}_max`] = '';
-                    column.input = (jsx(ControlledSlider, { name: column.field, control: undefined, fieldProps: column.extra, extraProps: {
+                    column.input = (jsx(ControlledSlider$1, { name: column.field, control: undefined, fieldProps: column.extra, extraProps: {
                             getValue: undefined,
                             setValue: undefined,
                         } }));
@@ -27566,7 +27552,7 @@ const CreateGridWrapper = (props) => {
                                 handleClose();
                             }, disableRipple: true, children: option.title }, index));
                     })), jsx(MenuItem, { onClick: () => {
-                            navigate(`crear`);
+                            navigate(props.navigation ? `${props.navigation}crear` : `crear`);
                             handleClose();
                         }, disableRipple: true, children: "Manual" })] }), props.csv_upload?.enable && (jsx(CSVUpload, { open: csv.open, drawerToggle: handleToggleClose, data: csv.data })), props.renderFunction({ dataGridProps: createGridProps })] }));
 };
@@ -27773,6 +27759,7 @@ const Base = (props) => {
                 permission: data?.permissions?.create,
                 renderFunction: renderFunction,
                 pathname: props.pathname,
+                navigation: props.slotProps?.navigation,
                 ...renderProps,
                 ...props.api.create
             };
@@ -27915,6 +27902,16 @@ const DetailField = (props) => {
             if (props.fieldData)
                 return map(props.fieldData, function (item) { return item.label; }).join(', ');
         }
+        else if (props.type.name == 'ControlledDate') {
+            if (props.fieldData) {
+                if (props.extraProps.type == 'datetime')
+                    return dayjs(props.fieldData).format('YYYY-MM-DD HH:mm');
+            }
+        }
+        else if (props.type.name == 'ControlledPhotoField') {
+            if (props.fieldData)
+                return 'Imagen';
+        }
         else {
             if (props.fieldData) {
                 if (props.detail_name) {
@@ -27932,6 +27929,9 @@ const DetailField = (props) => {
         }
         return (jsx(LinkField, { url: props.navigation.url, value: get(props.fieldData, 'value'), text: content }));
     }
+    else if (props.type.name == 'ControlledPhotoField') {
+        return (jsx(Link, { href: props.fieldData, download: "filename.pdf", children: content }));
+    }
     else {
         if (Array.isArray(props.fieldData)) {
             return (props.fieldData.map((item, index) => (jsx(Typography$1, { children: `${get(item, 'label')}${index < props.fieldData.length - 1 ? ', ' : ''}` }, `${props.name}-link-${index}`))));
@@ -28287,8 +28287,9 @@ function DetailPage(props) {
     // ==============================|| SUBMIT ||============================== //
     const onSubmitHandler = (submitedData) => {
         const formData = 'nativeEvent' in submitedData ? form.getValues() : submitedData;
-        const dataToSend = jsonForm({ submitData: formData, data: data, props: props.slotProps?.parser });
-        mutation({ ...dataToSend, ...props.api.mutate.args }).unwrap()
+        const params = { submitData: formData, data: data, props: props.slotProps?.parser };
+        const dataToSend = props.edit.useFormData ? formDataForm(params) : jsonForm(params);
+        mutation(props.edit.useFormData ? dataToSend : { ...dataToSend, ...props.api.mutate.args }).unwrap()
             .then(() => {
             if (!props.slotProps?.button?.save?.disableNavBack)
                 navigate(-1);
@@ -28661,5 +28662,5 @@ const theme = () => {
     return themes;
 };
 
-export { APIContext, APIProvider, ActiveCell, Base, ButtonWithDrawer, CSVUpload, ContentLayout, ControlledDate, ControlledDropdown, FileUploadBox as ControlledFileUploadBox, ControlledNumber, ControlledPhoneNumber, ControlledSelect, ControlledSlider, ControlledSwitch, ControlledText, ControlledTimePicker, ControlledToggleButtons, CoverPage, CreateButtonBase, CreateButtonWithMenuOptions, DeleteButton, DeleteConfirmationDialog, DetailPage, EditButton, HistorialDrawer, ListPage, Loadable, LoadingComponent, Logo, MainDrawer, MenuItemWithLoading, ModuleCard, MyGridEditSingleSelect, NavigationContext, NavigationProvider, NormalOrIcon, NotAllowed, NotFound, ObjectProgressStack, SaveCancelButton, StatusBadge, StyledMenu, Tabs, Transitions, UncontrolledText, changeTitle, closeProgressSnack, dayjs, deleteColumn, editColumn, filterQuery, formDataForm, header as headerReducer, jsonForm, manualCacheRefresh, mergeSettings, openProgressSnack, query, renderEditCellWithErrorTooltip, setErrors, snackProgress_default as snackProgressReducer, tags, theme, updateProgressSnackData, useAPI, useHasPermission, useNavigation, valueLabel };
+export { APIContext, APIProvider, ActiveCell, Base, ButtonWithDrawer, CSVUpload, ContentLayout, ControlledDate, ControlledDropdown, FileUploadBox as ControlledFileUploadBox, ControlledNumber, ControlledPhoneNumber, ControlledPhotoField, ControlledSelect, ControlledSlider as ControlledSimpleSlider, ControlledSlider$1 as ControlledSlider, ControlledSwitch, ControlledText, ControlledTimePicker, ControlledToggleButtons, CoverPage, CreateButtonBase, CreateButtonWithMenuOptions, DeleteButton, DeleteConfirmationDialog, DetailPage, EditButton, HistorialDrawer, ListPage, Loadable, LoadingComponent, Logo, MainDrawer, MenuItemWithLoading, ModuleCard, MyGridEditSingleSelect, NavigationContext, NavigationProvider, NormalOrIcon, NotAllowed, NotFound, ObjectProgressStack, SaveCancelButton, StatusBadge, StyledMenu, Tabs, Transitions, UncontrolledText, changeTitle, closeProgressSnack, dayjs, deleteColumn, editColumn, filterQuery, formDataForm, header as headerReducer, jsonForm, manualCacheRefresh, mergeSettings, openProgressSnack, query, renderEditCellWithErrorTooltip, setErrors, snackProgress_default as snackProgressReducer, tags, theme, updateProgressSnackData, useAPI, useHasPermission, useNavigation, valueLabel };
 //# sourceMappingURL=index.js.map