drf-react-by-schema 0.22.3 → 0.23.0

package/dist/components/DataGridBySchemaEditable/GridPatternInput.js

@@ -1,4 +1,37 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 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) {
@@ -13,18 +46,39 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.GridPatternInput = void 0;
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const x_data_grid_1 = require("@mui/x-data-grid");
 const react_number_format_1 = require("react-number-format");
 const TextField_1 = __importDefault(require("@mui/material/TextField"));
-const GridPatternInput = ({ id, value, field, patternFormat = 'cpf', }) => {
+const grid_1 = require("../../styles/grid");
+const GridPatternInput = (props) => {
+    const { id, value, field, patternFormat = 'cpf', error, helperText, hasFocus, 
+    // tabIndex,
+    // cellMode,
+    // isEditable,
+    // api,
+    // row,
+    colDef,
+    // ...other
+     } = props;
     const apiRef = (0, x_data_grid_1.useGridApiContext)();
+    const inputCallbackRef = (0, react_1.useCallback)((node) => {
+        if (node !== null && hasFocus) {
+            requestAnimationFrame(() => {
+                node.focus();
+                node.select();
+            });
+        }
+    }, [hasFocus]);
     const handleChange = (newValue) => __awaiter(void 0, void 0, void 0, function* () {
         yield apiRef.current.setEditCellValue({ id, field, value: newValue });
-        apiRef.current.stopCellEditMode({ id, field });
     });
-    return (react_1.default.createElement(react_number_format_1.PatternFormat, { key: field, id: field, onValueChange: (values) => {
+    return (react_1.default.createElement(react_number_format_1.PatternFormat, { key: field, id: field, inputRef: inputCallbackRef, onValueChange: (values) => {
             handleChange(values.value);
-        }, value: value, valueIsNumericString: true, format: patternFormat, mask: "_", customInput: TextField_1.default }));
+        }, value: value, valueIsNumericString: true, format: patternFormat, mask: "_", customInput: TextField_1.default, slotProps: {
+            htmlInput: {
+                'aria-label': `Editar ${colDef.headerName || field}. Pressione Enter para salvar toda a linha.`,
+            },
+        }, error: error, helperText: helperText, sx: grid_1.seamlessTextFieldStyle }));
 };
 exports.GridPatternInput = GridPatternInput;

package/dist/components/DataGridBySchemaEditable/InputInterval.d.ts

@@ -1,4 +1,4 @@
-import React, { MutableRefObject, RefObject } from 'react';
+import React, { RefObject } from 'react';
 import { Id } from '../../@types';
 type FilterValue = [string | undefined, string | undefined] | string;
 type GridFilterItem = {
@@ -9,7 +9,7 @@ type GridFilterItem = {
 };
 type InputIntervalProps = {
     applyValue: (params: GridFilterItem) => void;
-    focusElementRef?: null | ((instance: HTMLInputElement | null) => void) | RefObject<HTMLInputElement> | MutableRefObject<HTMLInputElement>;
+    focusElementRef?: null | ((instance: HTMLInputElement | null) => void) | RefObject<HTMLInputElement>;
     item: GridFilterItem;
     type: string;
 };

package/dist/components/DataGridBySchemaEditable/InputInterval.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputInterval.d.ts","sourceRoot":"","sources":["../../../src/components/DataGridBySchemaEditable/InputInterval.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,gBAAgB,EAAE,SAAS,EAAU,MAAM,OAAO,CAAC;AAKnE,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAIlC,KAAK,WAAW,GAAG,CAAC,MAAM,GAAG,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC,GAAG,MAAM,CAAC;AAErE,KAAK,cAAc,GAAG;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,EAAE,EAAE,EAAE,CAAC;IACP,aAAa,EAAE,MAAM,CAAC;IACtB,KAAK,EAAE,WAAW,CAAC;CACpB,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,UAAU,EAAE,CAAC,MAAM,EAAE,cAAc,KAAK,IAAI,CAAC;IAC7C,eAAe,CAAC,EACZ,IAAI,GACJ,CAAC,CAAC,QAAQ,EAAE,gBAAgB,GAAG,IAAI,KAAK,IAAI,CAAC,GAC7C,SAAS,CAAC,gBAAgB,CAAC,GAC3B,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACvC,IAAI,EAAE,cAAc,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAkJF,KAAK,YAAY,GAAG,IAAI,CAAC,kBAAkB,EAAE,MAAM,CAAC,CAAC;AAErD,eAAO,MAAM,mBAAmB,GAAI,OAAO,YAAY,sBAEtD,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,OAAO,YAAY,sBAEpD,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,OAAO,YAAY,sBAErD,CAAC"}
+{"version":3,"file":"InputInterval.d.ts","sourceRoot":"","sources":["../../../src/components/DataGridBySchemaEditable/InputInterval.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAoB,SAAS,EAAU,MAAM,OAAO,CAAC;AAKnE,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAIlC,KAAK,WAAW,GAAG,CAAC,MAAM,GAAG,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC,GAAG,MAAM,CAAC;AAErE,KAAK,cAAc,GAAG;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,EAAE,EAAE,EAAE,CAAC;IACP,aAAa,EAAE,MAAM,CAAC;IACtB,KAAK,EAAE,WAAW,CAAC;CACpB,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,UAAU,EAAE,CAAC,MAAM,EAAE,cAAc,KAAK,IAAI,CAAC;IAC7C,eAAe,CAAC,EACd,IAAI,GACJ,CAAC,CAAC,QAAQ,EAAE,gBAAgB,GAAG,IAAI,KAAK,IAAI,CAAC,GAC7C,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC9B,IAAI,EAAE,cAAc,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAoKF,KAAK,YAAY,GAAG,IAAI,CAAC,kBAAkB,EAAE,MAAM,CAAC,CAAC;AAErD,eAAO,MAAM,mBAAmB,GAAI,OAAO,YAAY,sBAEtD,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,OAAO,YAAY,sBAEpD,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,OAAO,YAAY,sBAErD,CAAC"}

package/dist/components/DataGridBySchemaEditable/InputInterval.js

@@ -86,17 +86,36 @@ const InputInterval = ({ item, applyValue, focusElementRef = null, type }) => {
         } },
         type === 'number' && (react_1.default.createElement(react_1.default.Fragment, null,
             react_1.default.createElement(TextField_1.default, { name: "lower-bound-input", placeholder: "De", label: "De", variant: "standard", value: Number(filterValueState[0]), onChange: handleLowerFilterChange, type: "number", inputRef: focusElementRef, sx: { mr: 2, minWidth: 130 } }),
-            react_1.default.createElement(TextField_1.default, { name: "upper-bound-input", placeholder: "At\u00E9", label: "At\u00E9", variant: "standard", value: Number(filterValueState[1]), onChange: handleUpperFilterChange, type: "number", sx: { minWidth: 130 }, InputProps: applying ? { endAdornment: react_1.default.createElement(Sync_1.default, null) } : {} }))),
+            react_1.default.createElement(TextField_1.default, { name: "upper-bound-input", placeholder: "At\u00E9", label: "At\u00E9", variant: "standard", value: Number(filterValueState[1]), onChange: handleUpperFilterChange, type: "number", sx: { minWidth: 130 }, slotProps: {
+                    input: {
+                        endAdornment: applying ? react_1.default.createElement(Sync_1.default, null) : undefined,
+                    }
+                } }))),
         type === 'float' && (react_1.default.createElement(react_1.default.Fragment, null,
             react_1.default.createElement(react_number_format_1.NumericFormat, { name: "lower-bound-input", placeholder: "De", label: "De", variant: "standard", value: Number(filterValueState[0]), onValueChange: (values) => {
                     handleLowerFilterChange({ target: { value: values.value } });
                 }, thousandSeparator: ".", decimalSeparator: ",", decimalScale: 2, fixedDecimalScale: true, valueIsNumericString: true, inputRef: focusElementRef, sx: { mr: 2, minWidth: 130 }, customInput: TextField_1.default }),
             react_1.default.createElement(react_number_format_1.NumericFormat, { name: "upper-bound-input", placeholder: "At\u00E9", label: "At\u00E9", variant: "standard", value: Number(filterValueState[1]), onValueChange: (values) => {
                     handleUpperFilterChange({ target: { value: values.value } });
-                }, thousandSeparator: ".", decimalSeparator: ",", decimalScale: 2, fixedDecimalScale: true, valueIsNumericString: true, InputProps: applying ? { endAdornment: react_1.default.createElement(Sync_1.default, null) } : {}, sx: { minWidth: 130 }, customInput: TextField_1.default }))),
+                }, thousandSeparator: ".", decimalSeparator: ",", decimalScale: 2, fixedDecimalScale: true, valueIsNumericString: true, sx: { minWidth: 130 }, customInput: TextField_1.default, slotProps: {
+                    input: {
+                        endAdornment: applying ? react_1.default.createElement(Sync_1.default, null) : undefined,
+                    }
+                } }))),
         type === 'date' && (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(TextField_1.default, { name: "lower-bound-input", label: "De", variant: "standard", value: filterValueState[0] || '', onChange: handleLowerFilterChange, type: "date", inputRef: focusElementRef, InputLabelProps: { shrink: true }, sx: { mr: 2, minWidth: 130 } }),
-            react_1.default.createElement(TextField_1.default, { name: "upper-bound-input", label: "At\u00E9", variant: "standard", value: filterValueState[1] || '', onChange: handleUpperFilterChange, type: "date", InputProps: applying ? { endAdornment: react_1.default.createElement(Sync_1.default, null) } : {}, InputLabelProps: { shrink: true }, sx: { minWidth: 130 } })))));
+            react_1.default.createElement(TextField_1.default, { name: "lower-bound-input", label: "De", variant: "standard", value: filterValueState[0] || '', onChange: handleLowerFilterChange, type: "date", inputRef: focusElementRef, slotProps: {
+                    inputLabel: {
+                        shrink: true,
+                    }
+                }, sx: { mr: 2, minWidth: 130 } }),
+            react_1.default.createElement(TextField_1.default, { name: "upper-bound-input", label: "At\u00E9", variant: "standard", value: filterValueState[1] || '', onChange: handleUpperFilterChange, type: "date", slotProps: {
+                    input: {
+                        endAdornment: applying ? react_1.default.createElement(Sync_1.default, null) : undefined,
+                    },
+                    inputLabel: {
+                        shrink: true,
+                    }
+                }, sx: { minWidth: 130 } })))));
 };
 const InputNumberInterval = (props) => {
     return react_1.default.createElement(InputInterval, Object.assign({}, props, { type: "number" }));

package/dist/components/DataGridBySchemaEditable/MobileSearchBar.js

@@ -58,7 +58,7 @@ function MobileSearchBar({ paginationModel, setPaginationModel }) {
             startAdornment: (react_1.default.createElement(InputAdornment_1.default, { position: "start" },
                 react_1.default.createElement(Search_1.default, null))),
             endAdornment: (react_1.default.createElement(InputAdornment_1.default, { position: "end" },
-                react_1.default.createElement(IconButton_1.default, { onClick: () => handleSearchChange('') },
+                react_1.default.createElement(IconButton_1.default, { onClick: () => handleSearchChange(''), "aria-label": "Limpar busca" },
                     react_1.default.createElement(Clear_1.default, null)))),
         }, fullWidth: true, onChange: handleChangeEvent }));
 }

package/dist/components/DataGridBySchemaEditable/SelectEditInputCell.d.ts

@@ -15,7 +15,10 @@ interface SelectEditInputCellProps {
     fieldsLayout?: FormFieldLayout[];
     sx?: SxProps<Theme>;
     setDialog: (x: Partial<DialogType>) => void;
+    error?: boolean;
+    helperText?: string;
+    hasFocus?: boolean;
 }
-export declare function SelectEditInputCell({ field, id, value, column, type, options, isIndexField, multiple, onEditModel, fieldsLayout, sx, setDialog, }: SelectEditInputCellProps): JSX.Element;
+export declare function SelectEditInputCell({ field, id, value, column, type, options, isIndexField, multiple, onEditModel, fieldsLayout, sx, setDialog, error, helperText, hasFocus, }: SelectEditInputCellProps): JSX.Element;
 export {};
 //# sourceMappingURL=SelectEditInputCell.d.ts.map

package/dist/components/DataGridBySchemaEditable/SelectEditInputCell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectEditInputCell.d.ts","sourceRoot":"","sources":["../../../src/components/DataGridBySchemaEditable/SelectEditInputCell.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,GAAG,EAAuB,MAAM,OAAO,CAAC;AAGxD,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAMtD,OAAO,EAAE,eAAe,EAAE,YAAY,EAAE,IAAI,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAE/F,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAK9E,UAAU,wBAAwB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,MAAM,EAAE,0BAA0B,CAAC;IACnC,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,IAAI,EAAE,GAAG,CAAC,MAAM,OAAO,CAAC,IAAI,EAAE,CAAC,CAAC,GAAG,IAAI,CAAC;IAClD,YAAY,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,eAAe,KAAK,IAAI,CAAC;IAC3C,YAAY,CAAC,EAAE,eAAe,EAAE,CAAC;IACjC,EAAE,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IACpB,SAAS,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;CAC7C;AAED,wBAAgB,mBAAmB,CAAC,EAClC,KAAK,EACL,EAAE,EACF,KAAK,EACL,MAAM,EACN,IAAI,EACJ,OAAO,EACP,YAAY,EACZ,QAAgB,EAChB,WAAW,EACX,YAAY,EACZ,EAAO,EACP,SAAS,GACV,EAAE,wBAAwB,GAAG,GAAG,CAAC,OAAO,CAyMxC"}
+{"version":3,"file":"SelectEditInputCell.d.ts","sourceRoot":"","sources":["../../../src/components/DataGridBySchemaEditable/SelectEditInputCell.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,GAAG,EAAoC,MAAM,OAAO,CAAC;AAGrE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAMtD,OAAO,EAAE,eAAe,EAAE,YAAY,EAAE,IAAI,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAE/F,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAM9E,UAAU,wBAAwB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,MAAM,EAAE,0BAA0B,CAAC;IACnC,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,IAAI,EAAE,GAAG,CAAC,MAAM,OAAO,CAAC,IAAI,EAAE,CAAC,CAAC,GAAG,IAAI,CAAC;IAClD,YAAY,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,eAAe,KAAK,IAAI,CAAC;IAC3C,YAAY,CAAC,EAAE,eAAe,EAAE,CAAC;IACjC,EAAE,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IACpB,SAAS,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;IAC5C,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,mBAAmB,CAAC,EAClC,KAAK,EACL,EAAE,EACF,KAAK,EACL,MAAM,EACN,IAAI,EACJ,OAAO,EACP,YAAY,EACZ,QAAgB,EAChB,WAAW,EACX,YAAY,EACZ,EAAyB,EACzB,SAAS,EACT,KAAK,EACL,UAAU,EACV,QAAQ,GACT,EAAE,wBAAwB,GAAG,GAAG,CAAC,OAAO,CAmRxC"}

package/dist/components/DataGridBySchemaEditable/SelectEditInputCell.js

@@ -54,11 +54,21 @@ const Edit_1 = __importDefault(require("@mui/icons-material/Edit"));
 const Autocomplete_1 = __importStar(require("@mui/material/Autocomplete"));
 const utils_1 = require("../../utils");
 const DialogActions_1 = __importDefault(require("../DialogActions"));
+const grid_1 = require("../../styles/grid");
 const filter = (0, Autocomplete_1.createFilterOptions)();
-function SelectEditInputCell({ field, id, value, column, type, options, isIndexField, multiple = false, onEditModel, fieldsLayout, sx = {}, setDialog, }) {
+function SelectEditInputCell({ field, id, value, column, type, options, isIndexField, multiple = false, onEditModel, fieldsLayout, sx = {}, setDialog, error, helperText, hasFocus, }) {
     const [loadedOptions, setLoadedOptions] = (0, react_1.useState)(null);
     // TODO: allow edit option label, as in formautocomplete!
     const apiRef = (0, x_data_grid_1.useGridApiContext)();
+    const [openOptions, setOpenOptions] = (0, react_1.useState)(false);
+    const inputCallbackRef = (0, react_1.useCallback)((node) => {
+        if (node !== null && hasFocus) {
+            requestAnimationFrame(() => {
+                node.focus();
+                node.select();
+            });
+        }
+    }, [hasFocus]);
     const handleChange = (newValue) => __awaiter(this, void 0, void 0, function* () {
         yield apiRef.current.setEditCellValue({ id, field, value: newValue });
         apiRef.current.stopCellEditMode({ id, field });
@@ -69,7 +79,7 @@ function SelectEditInputCell({ field, id, value, column, type, options, isIndexF
     // if (column.creatable || isIndexField) {
     if (column.creatable) {
         creatableProps = {
-            freesolo: 'true',
+            freeSolo: true,
             filterOptions: (thisOptions, params) => {
                 let filtered = filter(thisOptions, params);
                 const inputValue = params.inputValue ? params.inputValue : '';
@@ -117,6 +127,12 @@ function SelectEditInputCell({ field, id, value, column, type, options, isIndexF
             },
         };
     }
+    const handleOpenOptions = () => {
+        setOpenOptions(true);
+    };
+    const handleCloseOptions = () => {
+        setOpenOptions(false);
+    };
     (0, react_1.useEffect)(() => {
         if (!options) {
             return;
@@ -136,11 +152,15 @@ function SelectEditInputCell({ field, id, value, column, type, options, isIndexF
     ) {
         return react_1.default.createElement(react_1.default.Fragment, null);
     }
-    return (react_1.default.createElement(Autocomplete_1.default, Object.assign({ key: field, id: field, value: value, options: loadedOptions, selectOnFocus: true, autoHighlight: true, multiple: multiple, isOptionEqualToValue: (option, value) => {
-            return option[labelKey] === value[labelKey];
+    return (react_1.default.createElement(Autocomplete_1.default, Object.assign({ key: field, open: openOptions, onOpen: handleOpenOptions, onClose: handleCloseOptions, id: field, value: value, options: loadedOptions, selectOnFocus: true, autoHighlight: true, multiple: multiple, isOptionEqualToValue: (option, val) => {
+            return option[labelKey] === val[labelKey];
         }, getOptionLabel: (option) => {
+            if (typeof option === 'string')
+                return option;
+            if (option.inputValue)
+                return option.inputValue;
             return option ? option[labelKey] : '';
-        }, onChange: (e, value) => {
+        }, onChange: (_e, value) => {
             // if (!column.creatable && !isIndexField) {
             if (!column.creatable) {
                 handleChange(value);
@@ -175,25 +195,52 @@ function SelectEditInputCell({ field, id, value, column, type, options, isIndexF
                 };
             }
             handleChange(newValue);
-        }, fullWidth: true, renderInput: (params) => (react_1.default.createElement(react_1.default.Fragment, null, column.creatable ? (react_1.default.createElement(TextField_1.default, Object.assign({}, params, { margin: "normal", InputProps: Object.assign(Object.assign({}, params.InputProps), { endAdornment: (react_1.default.createElement(react_1.default.Fragment, null,
-                    !multiple && onEditModel && value && (react_1.default.createElement(IconButton_1.default, { size: "small", onClick: () => {
-                            if ((0, utils_1.isTmpId)(value.id)) {
-                                setDialog({
-                                    open: true,
-                                    loading: false,
-                                    title: 'Linha sendo criada',
-                                    Body: 'Esta linha está sendo criada agora por você. Para editar suas propriedades, salve antes, e depois você poderá editar!',
-                                    Actions: react_1.default.createElement(DialogActions_1.default, { setDialog: setDialog, btnCancel: "Entendi" }),
+        }, fullWidth: true, slotProps: {
+            paper: {
+                sx: {
+                    marginTop: '1px', // Gap to show the bottom cell border
+                    boxShadow: 3,
+                    border: '1px solid #e0e0e0',
+                    '& .MuiAutocomplete-listbox': {
+                        padding: 0,
+                        fontSize: '0.875rem',
+                    },
+                },
+            },
+        }, renderInput: (params) => (react_1.default.createElement(react_1.default.Fragment, null, column.creatable ? (react_1.default.createElement(TextField_1.default, Object.assign({}, params, { 
+            // margin="normal"
+            inputRef: inputCallbackRef, slotProps: {
+                htmlInput: Object.assign(Object.assign({}, params.inputProps), { 'aria-label': `Editar ${column.headerName || field}. Pressione Enter ou comece a digitar para ver as opções.` }),
+                input: Object.assign(Object.assign({}, params.InputProps), { endAdornment: (react_1.default.createElement(react_1.default.Fragment, null,
+                        !multiple && onEditModel && value && (react_1.default.createElement(IconButton_1.default, { size: "small", "aria-label": "Editar", onClick: () => {
+                                if ((0, utils_1.isTmpId)(value.id)) {
+                                    setDialog({
+                                        open: true,
+                                        loading: false,
+                                        title: 'Linha sendo criada',
+                                        Body: 'Esta linha está sendo criada agora por você. Para editar suas propriedades, salve antes, e depois você poderá editar!',
+                                        Actions: (react_1.default.createElement(DialogActions_1.default, { setDialog: setDialog, btnCancel: "Entendi" })),
+                                    });
+                                    return;
+                                }
+                                onEditModel({
+                                    model: field,
+                                    id: value[valueKey],
+                                    labelKey,
+                                    fieldsLayout,
                                 });
-                                return;
-                            }
-                            onEditModel({
-                                model: field,
-                                id: value[valueKey],
-                                labelKey,
-                                fieldsLayout,
-                            });
-                        } },
-                        react_1.default.createElement(Edit_1.default, null))),
-                    params.InputProps.endAdornment)) }) }))) : (react_1.default.createElement(TextField_1.default, Object.assign({}, params, { sx: sx }))))) }, creatableProps)));
+                            } },
+                            react_1.default.createElement(Edit_1.default, null))),
+                        params.InputProps.endAdornment)) }),
+            }, error: error, helperText: helperText, sx: [grid_1.seamlessTextFieldStyle, ...(Array.isArray(sx) ? sx : [sx])] }))) : (react_1.default.createElement(TextField_1.default, Object.assign({}, params, { inputRef: inputCallbackRef, slotProps: {
+                htmlInput: Object.assign(Object.assign({}, params.inputProps), { 'aria-label': `Selecionar ${column.headerName || field}` }),
+            }, error: error, helperText: helperText, sx: [grid_1.seamlessTextFieldStyle, ...(Array.isArray(sx) ? sx : [sx])] }))))) }, creatableProps, { onKeyDown: (event) => {
+            if (event.key === 'Enter') {
+                if (!openOptions) {
+                    // Abrir o menu de opções
+                    event.stopPropagation();
+                    handleOpenOptions();
+                }
+            }
+        } })));
 }

package/dist/components/DataGridBySchemaEditable/hooks/useDataGridActions.d.ts

@@ -0,0 +1,34 @@
+import { RefObject } from 'react';
+import { GridRowId } from '@mui/x-data-grid';
+import { GridApiCommunity } from '@mui/x-data-grid/internals';
+import { Id, Item, SchemaType, BulkUpdateData, BulkDeleteData } from '../../../@types';
+interface UseDataGridActionsProps {
+    apiRef: RefObject<GridApiCommunity>;
+    model: string;
+    schema: SchemaType;
+    emptyItem: Item;
+    dataGrid: {
+        data: Item[];
+    };
+    setDataGrid: (value: React.SetStateAction<{
+        data: Item[];
+    }>) => void;
+    setSelectionModel: (value: React.SetStateAction<Item[]>) => void;
+    setSelectionModelIds: (value: React.SetStateAction<GridRowId[]>) => void;
+    setSnackBar: (value: React.SetStateAction<Item>) => void;
+    setDataGridLoading: (value: boolean) => void;
+    onDataChange?: (p: Item[]) => void;
+    handleStartEditing: (p?: Id) => void;
+    tableAutoHeight?: boolean;
+    indexField: string;
+    defaultValues?: Item;
+    isRowEditing?: Id;
+}
+export declare const useDataGridActions: ({ apiRef, model, schema, emptyItem, dataGrid, setDataGrid, setSelectionModel, setSelectionModelIds, setSnackBar, setDataGridLoading, onDataChange, handleStartEditing, tableAutoHeight, indexField, defaultValues, isRowEditing, }: UseDataGridActionsProps) => {
+    handleAddItem: () => void;
+    bulkUpdateData: BulkUpdateData;
+    bulkDeleteData: BulkDeleteData;
+    bulkCreateData: (ids: Id[]) => Promise<void>;
+};
+export {};
+//# sourceMappingURL=useDataGridActions.d.ts.map

package/dist/components/DataGridBySchemaEditable/hooks/useDataGridActions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDataGridActions.d.ts","sourceRoot":"","sources":["../../../../src/components/DataGridBySchemaEditable/hooks/useDataGridActions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAE9D,OAAO,EAAE,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAIvF,UAAU,uBAAuB;IAC/B,MAAM,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,UAAU,CAAC;IACnB,SAAS,EAAE,IAAI,CAAC;IAChB,QAAQ,EAAE;QAAE,IAAI,EAAE,IAAI,EAAE,CAAA;KAAE,CAAC;IAC3B,WAAW,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC;QAAE,IAAI,EAAE,IAAI,EAAE,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IACrE,iBAAiB,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IACjE,oBAAoB,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,KAAK,IAAI,CAAC;IACzE,WAAW,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IACzD,kBAAkB,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IACnC,kBAAkB,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,KAAK,IAAI,CAAC;IACrC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,IAAI,CAAC;IACrB,YAAY,CAAC,EAAE,EAAE,CAAC;CACnB;AAED,eAAO,MAAM,kBAAkB,GAAI,oOAiBhC,uBAAuB;;;;0BAyJW,EAAE,EAAE;CAiBxC,CAAC"}

package/dist/components/DataGridBySchemaEditable/hooks/useDataGridActions.js

@@ -0,0 +1,170 @@
+"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.useDataGridActions = void 0;
+const axios_1 = __importDefault(require("axios"));
+const utils_1 = require("../../../utils");
+const APIWrapperContext_1 = require("../../../context/APIWrapperContext");
+const useDataGridActions = ({ apiRef, model, schema, emptyItem, dataGrid, setDataGrid, setSelectionModel, setSelectionModelIds, setSnackBar, setDataGridLoading, onDataChange, handleStartEditing, tableAutoHeight, indexField, defaultValues, isRowEditing, }) => {
+    const { rawDeleteData, rawUpdateDataBySchema } = (0, APIWrapperContext_1.useAPIWrapper)();
+    const handleAddItems = (n = 1) => {
+        const newRows = [];
+        for (let i = 0; i < n; i++) {
+            const id = (0, utils_1.getTmpId)();
+            newRows.push(Object.assign(Object.assign(Object.assign({}, emptyItem), defaultValues), { id }));
+        }
+        const newData = tableAutoHeight
+            ? [...dataGrid.data, ...newRows]
+            : [...newRows, ...dataGrid.data];
+        if (onDataChange) {
+            onDataChange(newData);
+        }
+        setDataGrid({
+            data: newData,
+        });
+        setTimeout(() => {
+            let fieldToFocus = indexField;
+            if (!fieldToFocus) {
+                const visibleColumns = apiRef.current.getAllColumns();
+                const firstEditableCol = visibleColumns.find((col) => col.editable && col.field !== 'actions');
+                fieldToFocus = firstEditableCol === null || firstEditableCol === void 0 ? void 0 : firstEditableCol.field;
+            }
+            apiRef.current.startRowEditMode({ id: newRows[0].id, fieldToFocus });
+            handleStartEditing(newRows[0].id);
+            // apiRef.current.setCellFocus(newRows[0].id, fieldToFocus);
+            if (!tableAutoHeight) {
+                apiRef.current.scrollToIndexes({ rowIndex: 0 });
+            }
+        }, 100);
+    };
+    const handleAddItem = () => {
+        if (isRowEditing) {
+            if ((0, utils_1.isTmpId)(isRowEditing)) {
+                setSnackBar({
+                    open: true,
+                    severity: 'info',
+                    msg: 'Adicione uma linha por vez',
+                });
+                return;
+            }
+            apiRef.current.stopRowEditMode({ id: isRowEditing });
+        }
+        const id = (0, utils_1.getTmpId)();
+        const newRow = Object.assign(Object.assign(Object.assign({}, emptyItem), defaultValues), { id });
+        const newData = tableAutoHeight ? [...dataGrid.data, newRow] : [newRow, ...dataGrid.data];
+        if (onDataChange) {
+            onDataChange(newData);
+        }
+        setDataGrid({
+            data: newData,
+        });
+        setTimeout(() => {
+            let fieldToFocus = indexField;
+            if (!fieldToFocus) {
+                const visibleColumns = apiRef.current.getAllColumns();
+                const firstEditableCol = visibleColumns.find((col) => col.editable && col.field !== 'actions');
+                fieldToFocus = firstEditableCol === null || firstEditableCol === void 0 ? void 0 : firstEditableCol.field;
+            }
+            apiRef.current.startRowEditMode({ id, fieldToFocus });
+            handleStartEditing(id);
+            // apiRef.current.setCellFocus(id, fieldToFocus);
+            if (!tableAutoHeight) {
+                apiRef.current.scrollToIndexes({ rowIndex: 0 });
+            }
+        }, 100);
+    };
+    const bulkUpdateData = (newData) => __awaiter(void 0, void 0, void 0, function* () {
+        const promises = [];
+        const ids = [];
+        newData.map((item) => {
+            promises.push(rawUpdateDataBySchema({
+                model,
+                modelObjectId: item.id,
+                data: item,
+                schema,
+            }));
+            ids.push(item.id);
+        });
+        const results = yield Promise.all(promises);
+        setSelectionModel([]);
+        setSelectionModelIds([]);
+        const updatedData = dataGrid.data.map((item) => {
+            const index = ids.indexOf(item.id);
+            return index === -1 ? item : newData[index];
+        });
+        if (onDataChange) {
+            onDataChange(updatedData);
+        }
+        setDataGrid({
+            data: updatedData,
+        });
+        setSnackBar({
+            open: true,
+            severity: 'success',
+            msg: 'Alterações salvas com sucesso',
+        });
+        return results.map((result, index) => {
+            return {
+                id: ids[index],
+                success: !axios_1.default.isAxiosError(result),
+            };
+        });
+    });
+    const bulkDeleteData = (ids) => __awaiter(void 0, void 0, void 0, function* () {
+        const promises = [];
+        ids.map((id) => {
+            promises.push(rawDeleteData(model, id));
+        });
+        setDataGridLoading(true);
+        const results = yield Promise.all(promises);
+        setSelectionModel([]);
+        setSelectionModelIds([]);
+        const newData = dataGrid.data.filter(({ id }) => !ids.includes(id));
+        if (onDataChange) {
+            onDataChange(newData);
+        }
+        setDataGrid({
+            data: newData,
+        });
+        setDataGridLoading(false);
+        setSnackBar({
+            open: true,
+            severity: 'success',
+            msg: 'Itens apagados com sucesso',
+        });
+        return results.map((result, index) => {
+            return {
+                id: ids[index],
+                success: result === true,
+            };
+        });
+    });
+    const bulkCreateData = (ids) => __awaiter(void 0, void 0, void 0, function* () {
+        handleAddItems(ids.length);
+        setSelectionModel([]);
+        setSelectionModelIds([]);
+        setSnackBar({
+            open: true,
+            severity: 'success',
+            msg: 'Linhas adicionadas com sucesso',
+        });
+    });
+    return {
+        handleAddItem,
+        bulkUpdateData,
+        bulkDeleteData,
+        bulkCreateData,
+    };
+};
+exports.useDataGridActions = useDataGridActions;

package/dist/components/DataGridBySchemaEditable/hooks/useOptionsAC.d.ts

@@ -0,0 +1,14 @@
+import { SchemaType, OptionsAC, GridEnrichedBySchemaColDef } from '../../../@types';
+interface UseOptionsACProps {
+    columns: GridEnrichedBySchemaColDef[];
+    schema: SchemaType;
+    optionsACExternal?: OptionsAC;
+    indexField?: string;
+    addExistingModel?: string;
+}
+export declare const useOptionsAC: ({ columns, schema, optionsACExternal, indexField, addExistingModel, }: UseOptionsACProps) => {
+    optionsAC: OptionsAC;
+    updateOptionsAC: () => Promise<void>;
+};
+export {};
+//# sourceMappingURL=useOptionsAC.d.ts.map

package/dist/components/DataGridBySchemaEditable/hooks/useOptionsAC.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOptionsAC.d.ts","sourceRoot":"","sources":["../../../../src/components/DataGridBySchemaEditable/hooks/useOptionsAC.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,0BAA0B,EAAE,MAAM,iBAAiB,CAAC;AAGpF,UAAU,iBAAiB;IACzB,OAAO,EAAE,0BAA0B,EAAE,CAAC;IACtC,MAAM,EAAE,UAAU,CAAC;IACnB,iBAAiB,CAAC,EAAE,SAAS,CAAC;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,eAAO,MAAM,YAAY,GAAI,uEAM1B,iBAAiB;;;CAiDnB,CAAC"}

package/dist/components/DataGridBySchemaEditable/hooks/useOptionsAC.js

@@ -0,0 +1,67 @@
+"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.useOptionsAC = void 0;
+const react_1 = require("react");
+const axios_1 = __importDefault(require("axios"));
+const APIWrapperContext_1 = require("../../../context/APIWrapperContext");
+const useOptionsAC = ({ columns, schema, optionsACExternal, indexField, addExistingModel, }) => {
+    const { getAutoComplete } = (0, APIWrapperContext_1.useAPIWrapper)();
+    const [optionsAC, setOptionsAC] = (0, react_1.useState)({});
+    const updateOptionsAC = (0, react_1.useCallback)(() => __awaiter(void 0, void 0, void 0, function* () {
+        var _a;
+        const newOptionsAC = {};
+        for (const col of columns) {
+            if (optionsACExternal && col.field in optionsACExternal) {
+                newOptionsAC[col.field] = optionsACExternal[col.field];
+                continue;
+            }
+            if (!schema[col.field]) {
+                continue;
+            }
+            const fieldSchema = schema[col.field];
+            if (['field', 'nested object'].includes(fieldSchema.type) && !(col.field in newOptionsAC)) {
+                const options = yield getAutoComplete(col.field);
+                if (!axios_1.default.isAxiosError(options)) {
+                    newOptionsAC[col.field] = options;
+                    continue;
+                }
+                console.log(`Couldn't load autocomplete options from '${col.field}'`);
+                continue;
+            }
+            if (fieldSchema.type === 'choice' && !(col.field in newOptionsAC)) {
+                newOptionsAC[col.field] = fieldSchema.choices || [];
+                continue;
+            }
+            if (fieldSchema.type === 'list' && !(col.field in newOptionsAC)) {
+                newOptionsAC[col.field] = ((_a = fieldSchema.child) === null || _a === void 0 ? void 0 : _a.choices) || [];
+                continue;
+            }
+            if (col.field === indexField && addExistingModel && !newOptionsAC[col.field]) {
+                const options = yield getAutoComplete(addExistingModel);
+                if (!axios_1.default.isAxiosError(options)) {
+                    newOptionsAC[col.field] = options;
+                    continue;
+                }
+            }
+        }
+        setOptionsAC(newOptionsAC);
+    }), [columns, schema, optionsACExternal, indexField, addExistingModel]);
+    (0, react_1.useEffect)(() => {
+        updateOptionsAC();
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [columns]);
+    return { optionsAC, updateOptionsAC };
+};
+exports.useOptionsAC = useOptionsAC;

package/dist/components/DataGridBySchemaEditable/hooks/usePreparedColumns.d.ts

@@ -0,0 +1,9 @@
+import { GridEnrichedBySchemaColDef } from '../../../@types';
+import { BuildPreparedColumnsProps } from '../utils/columnFactory';
+export declare const usePreparedColumns: ({ schema, columns, isEditable, actions, LinkComponent, stateToLink, validationErrors, optionsAC, onEditModel, customFieldFormLayouts, setDialog, indexField, indexFieldMinWidth, minWidth, customColumnOperations, customLinkDestination, indexFieldBasePath, }: Omit<BuildPreparedColumnsProps, "columns" | "serverEndPoint"> & {
+    columns: GridEnrichedBySchemaColDef[];
+}) => {
+    preparedColumns: any[] | null;
+    setPreparedColumns: import("react").Dispatch<import("react").SetStateAction<any[] | null>>;
+};
+//# sourceMappingURL=usePreparedColumns.d.ts.map

package/dist/components/DataGridBySchemaEditable/hooks/usePreparedColumns.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePreparedColumns.d.ts","sourceRoot":"","sources":["../../../../src/components/DataGridBySchemaEditable/hooks/usePreparedColumns.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,0BAA0B,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAwB,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAGzF,eAAO,MAAM,kBAAkB,GAAI,iQAkBhC,IAAI,CAAC,yBAAyB,EAAE,SAAS,GAAG,gBAAgB,CAAC,GAAG;IACjE,OAAO,EAAE,0BAA0B,EAAE,CAAC;CACvC;;;CAqDA,CAAC"}