npm - drf-react-by-schema - Versions diffs - 0.20.0 → 0.20.1 - Mend

drf-react-by-schema 0.20.0 → 0.20.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/dist/components/DataGridBySchemaEditable/DataGridDesktop.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import React, { JSX } from 'react';
-import { GridRowId, GridRenderCellParams } from '@mui/x-data-grid';
 import * as Yup from 'yup';
+import { GridRowId, GridRenderCellParams } from '@mui/x-data-grid';
 import { SxProps } from '@mui/material';
 import { Item, SchemaType, Id, GridEnrichedBySchemaColDef, PaginationModel, ActionType, OnSelectActions, OptionsAC, FormFieldLayout, CustomAction, LinkComponentType } from '../../@types';
 import { OnEditModelType } from '../../context/APIWrapperContext';

package/dist/components/DataGridBySchemaEditable/DataGridDesktop.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DataGridDesktop.d.ts","sourceRoot":"","sources":["../../../src/components/DataGridBySchemaEditable/DataGridDesktop.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA+B,GAAG,EAAgB,MAAM,OAAO,CAAC;AAE9E,OAAO,EAML,SAAS,EAET,oBAAoB,EAErB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,~~KAAK,GAAG,MAAM,KAAK,CAAC;AAS3B,OAAO,~~EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;~~AAMxC~~,OAAO,EACL,IAAI,EACJ,UAAU,EAEV,EAAE,EACF,0BAA0B,EAC1B,eAAe,EACf,UAAU,EACV,eAAe,EAGf,SAAS,EACT,eAAe,EACf,YAAY,EACZ,iBAAiB,EAClB,MAAM,cAAc,CAAC;~~AAWtB~~,OAAO,EAAE,eAAe,EAAiB,MAAM,iCAAiC,CAAC;~~AAEjF~~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~~eAy7BtB~~;;AAED,wBAA6D"}
1	+ {"version":3,"file":"DataGridDesktop.d.ts","sourceRoot":"","sources":["../../../src/components/DataGridBySchemaEditable/DataGridDesktop.tsx"],"names":[],"mappings":"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"}

package/dist/components/DataGridBySchemaEditable/DataGridDesktop.js CHANGED Viewed

@@ -48,7 +48,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const dayjs_1 = __importDefault(require("dayjs"));
 const x_data_grid_1 = require("@mui/x-data-grid");
+const string_mask_1 = __importDefault(require("string-mask"));
 const Box_1 = __importDefault(require("@mui/material/Box"));
+const Typography_1 = __importDefault(require("@mui/material/Typography"));
 const CircularProgress_1 = __importDefault(require("@mui/material/CircularProgress"));
 const Edit_1 = __importDefault(require("@mui/icons-material/Edit"));
 const Bolt_1 = __importDefault(require("@mui/icons-material/Bolt"));
@@ -56,20 +58,20 @@ const Visibility_1 = __importDefault(require("@mui/icons-material/Visibility"));
 const Clear_1 = __importDefault(require("@mui/icons-material/Clear"));
 const Check_1 = __importDefault(require("@mui/icons-material/Check"));
 const Undo_1 = __importDefault(require("@mui/icons-material/Undo"));
-const string_mask_1 = __importDefault(require("string-mask"));
 const styles_1 = require("../../styles");
 const api_1 = require("../../api");
 const utils_1 = require("../../utils");
-const DRFReactBySchemaContext_1 = require("../../context/DRFReactBySchemaContext");
 const utils_2 = require("./utils");
+const DRFReactBySchemaContext_1 = require("../../context/DRFReactBySchemaContext");
+const APIWrapperContext_1 = require("../../context/APIWrapperContext");
 const CustomToolbar_1 = require("./CustomToolbar");
 const SelectEditInputCell_1 = require("./SelectEditInputCell");
 const GridDateInput_1 = require("./GridDateInput");
 const GridDecimalInput_1 = require("./GridDecimalInput");
 const GridPatternInput_1 = require("./GridPatternInput");
 const BooleanInputCell_1 = require("./BooleanInputCell");
+const FileInputCell_1 = require("./FileInputCell");
 const FooterToolbar_1 = require("./FooterToolbar");
-const APIWrapperContext_1 = require("../../context/APIWrapperContext");
 function DataGridDesktop({ schema, dataGrid, setDataGrid, rowCount = 0, columns, model, name = Math.floor(Math.random() * 1000000).toString(), indexField = 'nome', addExistingModel, indexFieldMinWidth = 350, indexFieldBasePath = '', indexFieldViewBasePath, stateToLink = {}, minWidth = 80, loading, modelParent, modelParentId, customColumnOperations, customFieldFormLayouts, customLinkDestination, LinkComponent, onProcessRow, onDataChange, onEditModel, isEditable = false, hasBulkSelect = false, onSelectActions, isAutoHeight = false, hideFooterPagination = false, setVisibleRows, paginationModel = undefined, setPaginationModel = undefined, hideFooterComponent, hideToolbarComponent, tableAutoHeight, actions = ['editInline', 'remove'], customActions, hideColumnsButton, hideFilterButton, hideDensityButton, hideExportButton, hideQuickFilterBar, optionsAC: optionsACExternal, emptyItem, handleDeleteClick, setSnackBar, yupValidationSchema, }) {
     const { serverEndPoint } = (0, DRFReactBySchemaContext_1.useDRFReactBySchema)();
     const apiContext = (0, APIWrapperContext_1.useAPIWrapper)();
@@ -364,6 +366,40 @@ function DataGridDesktop({ schema, dataGrid, setDataGrid, rowCount = 0, columns,
                         type: 'number',
                     });
                     break;
+                case 'image upload':
+                case 'file upload':
+                    column.filterable = false;
+                    column.orderable = false;
+                    const colSchema = schema[col.field];
+                    const accept = colSchema.allowed_mime_types
+                        ? colSchema.allowed_mime_types.join(', ')
+                        : colSchema.type === 'image upload'
+                            ? '/image*'
+                            : '*';
+                    column.minWidth = 200;
+                    column.valueFormatter = (params) => {
+                        var _a;
+                        return !((_a = params.value) === null || _a === void 0 ? void 0 : _a.name)
+                            ? ''
+                            : `${params.value.name.split('/').pop()} (${(0, utils_1.formatFileSize)(params.value.size)})`;
+                    };
+                    column.renderCell = (params) => {
+                        var _a, _b;
+                        return (react_1.default.createElement(react_1.default.Fragment, null, !((_a = params.value) === null || _a === void 0 ? void 0 : _a.name) ? null : ((_b = params.value) === null || _b === void 0 ? void 0 : _b.url) &&
+                            colSchema.type === 'image upload' ? (react_1.default.createElement("img", { src: `${serverEndPoint === null || serverEndPoint === void 0 ? void 0 : serverEndPoint.url}${params.value.url}`, alt: params.value.name, title: params.value.name, style: {
+                                width: '100%',
+                                maxHeight: '100px',
+                                objectFit: 'cover',
+                            } })) : (react_1.default.createElement(Typography_1.default, { variant: "body2", sx: { mb: 1 } },
+                            params.value.name.split('/').pop(),
+                            " (",
+                            (0, utils_1.formatFileSize)(params.value.size),
+                            ")"))));
+                    };
+                    if (isEditable && !col.disabled) {
+                        column.renderEditCell = (params) => (react_1.default.createElement(FileInputCell_1.FileInputCell, Object.assign({ accept: accept, fileType: colSchema.type, column: column, required: colSchema.required }, params)));
+                    }
+                    break;
             }
             if (indexFieldMinWidth && !column.minWidth) {
                 column.minWidth = col.field === indexField ? indexFieldMinWidth : minWidth;

package/dist/components/DataGridBySchemaEditable/FileInputCell.d.ts ADDED Viewed

@@ -0,0 +1,28 @@
+import { JSX } from 'react';
+import { SxProps } from '@mui/material';
+import { GenericValue, GridEnrichedBySchemaColDef } from '../../@types';
+interface FileInputCellProps {
+    field: string;
+    id: number | string;
+    value?: GenericValue;
+    column: GridEnrichedBySchemaColDef;
+    accept: string;
+    fileType?: string;
+    required?: boolean;
+    sx?: SxProps;
+}
+/**
+ *
+ *
+ * @param {FileInputCellProps} {
+ *     field,
+ *     id,
+ *     value,
+ *     column,
+ *     sx = {}
+ * }
+ * @returns {*}  {JSX.Element}
+ */
+export declare function FileInputCell({ field, id, value, column, accept, fileType, required, sx, }: FileInputCellProps): JSX.Element;
+export {};
+//# sourceMappingURL=FileInputCell.d.ts.map

package/dist/components/DataGridBySchemaEditable/FileInputCell.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FileInputCell.d.ts","sourceRoot":"","sources":["../../../src/components/DataGridBySchemaEditable/FileInputCell.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAInC,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAUxC,OAAO,EAAE,YAAY,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAgBxE,UAAU,kBAAkB;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,MAAM,EAAE,0BAA0B,CAAC;IACnC,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,OAAO,CAAC;CACd;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,EAAE,EACF,KAAK,EACL,MAAM,EACN,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,EAAO,GACR,EAAE,kBAAkB,GAAG,GAAG,CAAC,OAAO,CAqGlC"}

package/dist/components/DataGridBySchemaEditable/FileInputCell.js ADDED Viewed

@@ -0,0 +1,114 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FileInputCell = FileInputCell;
+const react_1 = __importDefault(require("react"));
+const x_data_grid_1 = require("@mui/x-data-grid");
+const styles_1 = require("@mui/material/styles");
+const Box_1 = __importDefault(require("@mui/material/Box"));
+const Button_1 = __importDefault(require("@mui/material/Button"));
+const FormControl_1 = __importDefault(require("@mui/material/FormControl"));
+const FormControlLabel_1 = __importDefault(require("@mui/material/FormControlLabel"));
+const Typography_1 = __importDefault(require("@mui/material/Typography"));
+const CloudUpload_1 = __importDefault(require("@mui/icons-material/CloudUpload"));
+const DRFReactBySchemaContext_1 = require("../../context/DRFReactBySchemaContext");
+const utils_1 = require("../../utils");
+const VisuallyHiddenInput = (0, styles_1.styled)('input')({
+    clip: 'rect(0 0 0 0)',
+    clipPath: 'inset(50%)',
+    height: 1,
+    overflow: 'hidden',
+    position: 'absolute',
+    bottom: 0,
+    left: 0,
+    whiteSpace: 'nowrap',
+    width: 1,
+});
+/**
+ *
+ *
+ * @param {FileInputCellProps} {
+ *     field,
+ *     id,
+ *     value,
+ *     column,
+ *     sx = {}
+ * }
+ * @returns {*}  {JSX.Element}
+ */
+function FileInputCell({ field, id, value, column, accept, fileType, required, sx = {}, }) {
+    const apiRef = (0, x_data_grid_1.useGridApiContext)();
+    const { serverEndPoint } = (0, DRFReactBySchemaContext_1.useDRFReactBySchema)();
+    const handleChange = (newValue) => __awaiter(this, void 0, void 0, function* () {
+        yield apiRef.current.setEditCellValue({ id, field, value: newValue });
+        apiRef.current.stopCellEditMode({ id, field });
+    });
+    const fileTypeStr = fileType === 'image upload' ? 'imagem' : 'documento';
+    return (react_1.default.createElement(FormControl_1.default, { component: "fieldset", sx: { width: '100%' } },
+        react_1.default.createElement(FormControlLabel_1.default, { control: react_1.default.createElement(Box_1.default, { sx: Object.assign({ display: 'flex', flexDirection: 'column', alignItems: 'center', width: '100%' }, sx) },
+                !(value === null || value === void 0 ? void 0 : value.name) ? null : ((value === null || value === void 0 ? void 0 : value.url) || (value === null || value === void 0 ? void 0 : value.src)) && fileType === 'image upload' ? (react_1.default.createElement("img", { src: value.url ? `${serverEndPoint === null || serverEndPoint === void 0 ? void 0 : serverEndPoint.url}${value.url}` : value.src, alt: value.name, title: value.name, style: {
+                        width: '100%',
+                        maxHeight: '100px',
+                        objectFit: 'cover',
+                    } })) : (react_1.default.createElement(Typography_1.default, { variant: "body2", sx: { mb: 1 } },
+                    value.name.split('/').pop(),
+                    " (",
+                    (0, utils_1.formatFileSize)(value.size),
+                    ")")),
+                react_1.default.createElement(Button_1.default, { component: "label", variant: "outlined", startIcon: react_1.default.createElement(CloudUpload_1.default, null), disabled: column.disabled === true, fullWidth: true, sx: { mt: 1 },
+                    // color={error ? 'error' : 'primary'}
+                    color: "primary" },
+                    value ? `Trocar ${fileTypeStr}` : `Enviar ${fileTypeStr}`,
+                    react_1.default.createElement(VisuallyHiddenInput, { type: "file", onChange: (e) => {
+                            var _a;
+                            const file = (_a = e.target.files) === null || _a === void 0 ? void 0 : _a[0];
+                            if (file) {
+                                if (file.type.startsWith('image/')) {
+                                    const reader = new FileReader();
+                                    reader.onload = (event) => {
+                                        const src = event.target ? event.target.result : undefined;
+                                        const newValue = {
+                                            name: file.name,
+                                            size: file.size,
+                                            type: file.type,
+                                            src,
+                                            file,
+                                        };
+                                        handleChange(newValue);
+                                        // if (onValueChange) {
+                                        //   onValueChange(newValue);
+                                        // }
+                                    };
+                                    reader.readAsDataURL(file);
+                                    return;
+                                }
+                                const newValue = {
+                                    name: file.name,
+                                    size: file.size,
+                                    type: file.type,
+                                    file,
+                                };
+                                handleChange(newValue);
+                                // if (onValueChange) {
+                                //   onValueChange(newValue);
+                                // }
+                            }
+                        }, accept: accept }))), label: '',
+            // labelPlacement="top"
+            required: required, sx: {
+                width: '100%',
+                alignItems: 'flex-start',
+                marginLeft: 0,
+            } })));
+}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "drf-react-by-schema",
-  "version": "0.20.0",
+  "version": "0.20.1",
   "description": "Components and Tools for building a React App having Django Rest Framework (DRF) as server",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",