drf-react-by-schema 0.15.6 → 0.16.0

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.
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { SxProps } from '@mui/material';
3
- import { GenericValue, OptionsAC } from '../../utils';
3
+ import { FormFieldLayout, GenericValue, OptionsAC } from '../../utils';
4
4
  import { GridEnrichedBySchemaColDef } from '../../utils';
5
5
  import { OnEditModelType } from '../../context/APIWrapperContext';
6
6
  interface SelectEditInputCellProps {
@@ -13,7 +13,8 @@ interface SelectEditInputCellProps {
13
13
  isIndexField: boolean;
14
14
  multiple?: boolean;
15
15
  onEditModel?: (x: OnEditModelType) => void;
16
+ fieldsLayout?: FormFieldLayout[];
16
17
  sx?: SxProps;
17
18
  }
18
- export declare function SelectEditInputCell({ field, id, value, column, type, optionsAC, isIndexField, multiple, onEditModel, sx, }: SelectEditInputCellProps): JSX.Element;
19
+ export declare function SelectEditInputCell({ field, id, value, column, type, optionsAC, isIndexField, multiple, onEditModel, fieldsLayout, sx, }: SelectEditInputCellProps): JSX.Element;
19
20
  export {};
@@ -44,7 +44,7 @@ const Edit_1 = __importDefault(require("@mui/icons-material/Edit"));
44
44
  const Autocomplete_1 = __importStar(require("@mui/material/Autocomplete"));
45
45
  const utils_1 = require("../../utils");
46
46
  const filter = (0, Autocomplete_1.createFilterOptions)();
47
- function SelectEditInputCell({ field, id, value, column, type, optionsAC, isIndexField, multiple = false, onEditModel, sx = {}, }) {
47
+ function SelectEditInputCell({ field, id, value, column, type, optionsAC, isIndexField, multiple = false, onEditModel, fieldsLayout, sx = {}, }) {
48
48
  // TODO: allow edit option label, as in formautocomplete!
49
49
  const apiRef = (0, x_data_grid_1.useGridApiContext)();
50
50
  const handleChange = (newValue) => __awaiter(this, void 0, void 0, function* () {
@@ -123,6 +123,7 @@ function SelectEditInputCell({ field, id, value, column, type, optionsAC, isInde
123
123
  model: field,
124
124
  id: value[valueKey],
125
125
  labelKey,
126
+ fieldsLayout,
126
127
  });
127
128
  } },
128
129
  react_1.default.createElement(Edit_1.default, null))),
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { GridRowId, GridRenderCellParams } from '@mui/x-data-grid';
3
3
  import { SxProps } from '@mui/material';
4
- import { Item, SchemaType, Id, GridEnrichedBySchemaColDef, PaginationModel, ActionType, OnSelectActions, OptionsAC } from '../utils';
4
+ import { Item, SchemaType, Id, GridEnrichedBySchemaColDef, PaginationModel, ActionType, OnSelectActions, OptionsAC, FormFieldLayout } from '../utils';
5
5
  import { OnEditModelType } from '../context/APIWrapperContext';
6
6
  interface DataGridBySchemaEditableProps {
7
7
  schema: SchemaType;
@@ -24,6 +24,7 @@ interface DataGridBySchemaEditableProps {
24
24
  modelParentId?: Id;
25
25
  modelParent?: string;
26
26
  customColumnOperations?: (p: GridEnrichedBySchemaColDef) => GridEnrichedBySchemaColDef | Promise<GridEnrichedBySchemaColDef>;
27
+ customFieldFormLayouts?: Record<string, FormFieldLayout[]>;
27
28
  customLinkDestination?: (p: GridRenderCellParams) => string;
28
29
  LinkComponent?: any;
29
30
  onProcessRow?: (p: Item) => void;
@@ -63,7 +63,7 @@ const BooleanInputCell_1 = require("./DataGridBySchemaEditable/BooleanInputCell"
63
63
  const FooterToolbar_1 = require("./DataGridBySchemaEditable/FooterToolbar");
64
64
  const ConfirmDialog_1 = require("./DataGridBySchemaEditable/ConfirmDialog");
65
65
  const APIWrapperContext_1 = require("../context/APIWrapperContext");
66
- const DataGridBySchemaEditable = (0, react_1.forwardRef)(({ schema, data, 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, customLinkDestination, LinkComponent, onProcessRow, onDataChange, onEditModel, isEditable = false, hasBulkSelect = false, onSelectActions, isAutoHeight = false, defaultValues = {}, hideFooterPagination = false, setVisibleRows, paginationModel = undefined, setPaginationModel = undefined, hideFooterComponent, hideToolbarComponent, tableAutoHeight, actions = ['editInline', 'remove'], optionsAC: optionsACExternal, }, ref) => {
66
+ const DataGridBySchemaEditable = (0, react_1.forwardRef)(({ schema, data, 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, defaultValues = {}, hideFooterPagination = false, setVisibleRows, paginationModel = undefined, setPaginationModel = undefined, hideFooterComponent, hideToolbarComponent, tableAutoHeight, actions = ['editInline', 'remove'], optionsAC: optionsACExternal, }, ref) => {
67
67
  const { serverEndPoint } = (0, DRFReactBySchemaContext_1.useDRFReactBySchema)();
68
68
  const apiContext = (0, APIWrapperContext_1.useAPIWrapper)();
69
69
  const initialSnackBar = {
@@ -87,6 +87,9 @@ const DataGridBySchemaEditable = (0, react_1.forwardRef)(({ schema, data, rowCou
87
87
  const processingRow = (0, react_1.useRef)(null);
88
88
  const idToRemove = (0, react_1.useRef)(null);
89
89
  const visibleRows = (0, react_1.useRef)('');
90
+ if (!onEditModel) {
91
+ onEditModel = apiContext.onEditModel;
92
+ }
90
93
  const updateOptionsAC = () => __awaiter(void 0, void 0, void 0, function* () {
91
94
  optionsAC.current = {};
92
95
  for (const col of columns) {
@@ -258,7 +261,10 @@ const DataGridBySchemaEditable = (0, react_1.forwardRef)(({ schema, data, rowCou
258
261
  column.sortComparator = (v1, v2, param1, param2) => {
259
262
  return (0, x_data_grid_1.gridStringOrNumberComparator)(v1.label, v2.label, param1, param2);
260
263
  };
261
- column.renderEditCell = (params) => (react_1.default.createElement(SelectEditInputCell_1.SelectEditInputCell, Object.assign({}, params, { column: column, type: schema[col.field].type, optionsAC: optionsAC.current, isIndexField: isIndexField, onEditModel: onEditModel })));
264
+ column.renderEditCell = (params) => (react_1.default.createElement(SelectEditInputCell_1.SelectEditInputCell, Object.assign({}, params, { column: column, type: schema[col.field].type, optionsAC: optionsAC.current, isIndexField: isIndexField, onEditModel: onEditModel, fieldsLayout: customFieldFormLayouts &&
265
+ col.field in customFieldFormLayouts
266
+ ? customFieldFormLayouts[col.field]
267
+ : undefined })));
262
268
  break;
263
269
  }
264
270
  column.valueGetter = (params) => {
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import { GridFilterModel, GridRenderCellParams } from '@mui/x-data-grid';
3
- import { GridEnrichedBySchemaColDef, ActionType, Item, OnSelectActions, OptionsAC } from '../utils';
3
+ import { GridEnrichedBySchemaColDef, ActionType, Item, OnSelectActions, OptionsAC, FormFieldLayout } from '../utils';
4
4
  import { SumRowsType } from '../api';
5
5
  interface GenericModelListProps {
6
6
  model: string;
@@ -15,6 +15,7 @@ interface GenericModelListProps {
15
15
  addExistingModel?: string;
16
16
  onProcessRow?: (p: Item) => void;
17
17
  customColumnOperations?: (column: GridEnrichedBySchemaColDef) => GridEnrichedBySchemaColDef | Promise<GridEnrichedBySchemaColDef>;
18
+ customFieldFormLayouts?: Record<string, FormFieldLayout[]>;
18
19
  customLinkDestination?: (p: GridRenderCellParams) => string;
19
20
  isEditable?: boolean;
20
21
  hasBulkSelect?: boolean;
@@ -34,5 +35,5 @@ interface GenericModelListProps {
34
35
  optionsAC?: OptionsAC;
35
36
  disableScreenLoading?: boolean;
36
37
  }
37
- declare const GenericModelList: ({ model, columnFields, hiddenFields, creatableFields, disabledFields, minWidthFields, indexField, indexFieldBasePath, indexFieldViewBasePath, addExistingModel, onProcessRow, customColumnOperations, customLinkDestination, isEditable, hasBulkSelect, onSelectActions, sumRows, isAutoHeight, forceReload, LinkComponent, hasHeader, paginationMode, defaultFilter, queryParams, hideFooterComponent, hideToolbarComponent, tableAutoHeight, actions, optionsAC, disableScreenLoading, }: GenericModelListProps) => React.JSX.Element;
38
+ declare const GenericModelList: ({ model, columnFields, hiddenFields, creatableFields, disabledFields, minWidthFields, indexField, indexFieldBasePath, indexFieldViewBasePath, addExistingModel, onProcessRow, customColumnOperations, customFieldFormLayouts, customLinkDestination, isEditable, hasBulkSelect, onSelectActions, sumRows, isAutoHeight, forceReload, LinkComponent, hasHeader, paginationMode, defaultFilter, queryParams, hideFooterComponent, hideToolbarComponent, tableAutoHeight, actions, optionsAC, disableScreenLoading, }: GenericModelListProps) => React.JSX.Element;
38
39
  export default GenericModelList;
@@ -50,7 +50,7 @@ const utils_1 = require("../utils");
50
50
  const api_1 = require("../api");
51
51
  const DRFReactBySchemaContext_1 = require("../context/DRFReactBySchemaContext");
52
52
  const APIWrapperContext_1 = require("../context/APIWrapperContext");
53
- const GenericModelList = ({ model, columnFields, hiddenFields = [], creatableFields, disabledFields, minWidthFields, indexField, indexFieldBasePath, indexFieldViewBasePath, addExistingModel, onProcessRow, customColumnOperations, customLinkDestination, isEditable, hasBulkSelect = false, onSelectActions, sumRows, isAutoHeight = true, forceReload = false, LinkComponent = null, hasHeader = false, paginationMode = 'client', defaultFilter, queryParams, hideFooterComponent, hideToolbarComponent, tableAutoHeight, actions, optionsAC, disableScreenLoading, }) => {
53
+ const GenericModelList = ({ model, columnFields, hiddenFields = [], creatableFields, disabledFields, minWidthFields, indexField, indexFieldBasePath, indexFieldViewBasePath, addExistingModel, onProcessRow, customColumnOperations, customFieldFormLayouts, customLinkDestination, isEditable, hasBulkSelect = false, onSelectActions, sumRows, isAutoHeight = true, forceReload = false, LinkComponent = null, hasHeader = false, paginationMode = 'client', defaultFilter, queryParams, hideFooterComponent, hideToolbarComponent, tableAutoHeight, actions, optionsAC, disableScreenLoading, }) => {
54
54
  const { serverEndPoint, isInBatches, firstBatchLength } = (0, DRFReactBySchemaContext_1.useDRFReactBySchema)();
55
55
  const { onEditModel } = (0, APIWrapperContext_1.useAPIWrapper)();
56
56
  const [data, setData] = (0, react_1.useState)(false);
@@ -151,7 +151,7 @@ const GenericModelList = ({ model, columnFields, hiddenFields = [], creatableFie
151
151
  react_1.default.createElement(LinkComponent, { to: `novo` },
152
152
  react_1.default.createElement(Button_1.default, { variant: "contained", size: "medium", sx: { alignSelf: 'stretch' }, startIcon: react_1.default.createElement(AddCircleOutline_1.default, null) }, "Adicionar")))))),
153
153
  react_1.default.createElement(Box_1.default, { sx: tableAutoHeight ? {} : styles_1.Layout.dataGridWithTabs },
154
- react_1.default.createElement(DataGridBySchemaEditable_1.default, { data: data.data, columns: data.columns, schema: data.schema || {}, model: model, loading: loading, indexField: indexField, indexFieldBasePath: indexFieldBasePath, indexFieldViewBasePath: indexFieldViewBasePath, addExistingModel: addExistingModel, isEditable: isEditable, hasBulkSelect: hasBulkSelect, onSelectActions: onSelectActions, onEditModel: onEditModel, isAutoHeight: isAutoHeight, tableAutoHeight: tableAutoHeight, customColumnOperations: finalCustomColumnOperations, setVisibleRows: setVisibleRows, hideFooterPagination: hideFooterPagination, hideFooterComponent: hideFooterComponent, hideToolbarComponent: hideToolbarComponent, customLinkDestination: customLinkDestination, actions: actions, optionsAC: optionsAC, onProcessRow: onProcessRow, onDataChange: (newData) => {
154
+ react_1.default.createElement(DataGridBySchemaEditable_1.default, { data: data.data, columns: data.columns, schema: data.schema || {}, model: model, loading: loading, indexField: indexField, indexFieldBasePath: indexFieldBasePath, indexFieldViewBasePath: indexFieldViewBasePath, addExistingModel: addExistingModel, isEditable: isEditable, hasBulkSelect: hasBulkSelect, onSelectActions: onSelectActions, onEditModel: onEditModel, isAutoHeight: isAutoHeight, tableAutoHeight: tableAutoHeight, customColumnOperations: finalCustomColumnOperations, customFieldFormLayouts: customFieldFormLayouts, setVisibleRows: setVisibleRows, hideFooterPagination: hideFooterPagination, hideFooterComponent: hideFooterComponent, hideToolbarComponent: hideToolbarComponent, customLinkDestination: customLinkDestination, actions: actions, optionsAC: optionsAC, onProcessRow: onProcessRow, onDataChange: (newData) => {
155
155
  setData(Object.assign(Object.assign({}, data), { data: newData }));
156
156
  }, LinkComponent: LinkComponent, paginationModel: paginationMode === 'server' ? paginationModel : undefined, setPaginationModel: paginationMode === 'server' ? setPaginationModel : undefined, rowCount: paginationMode === 'client'
157
157
  ? undefined
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import { AnyObjectSchema } from 'yup';
3
- import { Item, SchemaType } from '../../utils';
3
+ import { FormFieldLayout, Item, SchemaType } from '../../utils';
4
4
  import { DialogType } from '../../context/APIWrapperContext';
5
5
  interface DialogFormBySchemaProps {
6
6
  schema: SchemaType;
@@ -9,6 +9,7 @@ interface DialogFormBySchemaProps {
9
9
  onEditModelSave: (p: Item) => Promise<boolean>;
10
10
  setDialog: (x: Partial<DialogType>) => void;
11
11
  getAutoComplete: (model: string) => Promise<false | Item[]>;
12
+ fieldsLayout?: FormFieldLayout[];
12
13
  }
13
- export default function DialogFormBySchema({ schema, validationSchema, initialValues, onEditModelSave, setDialog, getAutoComplete, }: DialogFormBySchemaProps): React.JSX.Element;
14
+ export default function DialogFormBySchema({ schema, validationSchema, initialValues, onEditModelSave, setDialog, getAutoComplete, fieldsLayout, }: DialogFormBySchemaProps): React.JSX.Element;
14
15
  export {};
@@ -33,7 +33,7 @@ const Box_1 = __importDefault(require("@mui/material/Box"));
33
33
  const Button_1 = __importDefault(require("@mui/material/Button"));
34
34
  const styles_1 = require("../../styles");
35
35
  const FormBySchema_1 = __importDefault(require("./FormBySchema"));
36
- function DialogFormBySchema({ schema, validationSchema, initialValues, onEditModelSave, setDialog, getAutoComplete, }) {
36
+ function DialogFormBySchema({ schema, validationSchema, initialValues, onEditModelSave, setDialog, getAutoComplete, fieldsLayout, }) {
37
37
  const { control, handleSubmit, reset, getValues, setValue, formState: { errors, isDirty }, } = (0, react_hook_form_1.useForm)({
38
38
  mode: 'onBlur',
39
39
  resolver: (0, yup_1.yupResolver)(validationSchema),
@@ -46,7 +46,7 @@ function DialogFormBySchema({ schema, validationSchema, initialValues, onEditMod
46
46
  }
47
47
  return (react_1.default.createElement(react_1.default.Fragment, null, initialValues && control && (react_1.default.createElement("form", { onSubmit: handleSubmit(onEditModelSave) },
48
48
  react_1.default.createElement(Box_1.default, null,
49
- react_1.default.createElement(FormBySchema_1.default, { control: control, errors: errors, schema: schema, getValues: getValues, setValue: setValue, isolatedGetAutoComplete: getAutoComplete })),
49
+ react_1.default.createElement(FormBySchema_1.default, { control: control, errors: errors, schema: schema, getValues: getValues, setValue: setValue, isolatedGetAutoComplete: getAutoComplete, fieldsLayout: fieldsLayout })),
50
50
  react_1.default.createElement(Box_1.default, { sx: styles_1.Layout.flexRow },
51
51
  react_1.default.createElement(Button_1.default, { variant: "contained", color: "primary", size: "small", sx: { ml: 1 }, onClick: () => {
52
52
  setDialog({
@@ -1,3 +1,3 @@
1
1
  import React from 'react';
2
2
  import { FieldBySchemaProps } from '../../utils';
3
- export default function FieldBySchema({ name, schema, control, errors, multiline, setValue, getValues, fieldKey, labelKey, index, optionsAC, optionsModel, getOptionLabel, renderOption, onEditModel, sx, options, isSemaphoric, label, onValueChange, decimalScale, ...other }: FieldBySchemaProps): React.JSX.Element;
3
+ export default function FieldBySchema({ name, schema, control, errors, multiline, setValue, getValues, fieldKey, labelKey, index, optionsAC, optionsModel, getOptionLabel, renderOption, onEditModel, fieldsLayout, sx, options, isSemaphoric, label, onValueChange, decimalScale, ...other }: FieldBySchemaProps): React.JSX.Element;
@@ -23,7 +23,7 @@ const BooleanFieldBySchema_1 = __importDefault(require("./inputs/BooleanFieldByS
23
23
  const FloatFieldBySchema_1 = __importDefault(require("./inputs/FloatFieldBySchema"));
24
24
  const TextFieldBySchema_1 = __importDefault(require("./inputs/TextFieldBySchema"));
25
25
  function FieldBySchema(_a) {
26
- var { name, schema, control, errors, multiline = false, setValue, getValues, fieldKey, labelKey = 'nome', index, optionsAC, optionsModel, getOptionLabel, renderOption, onEditModel, sx, options, isSemaphoric = false, label, onValueChange, decimalScale = 2 } = _a, other = __rest(_a, ["name", "schema", "control", "errors", "multiline", "setValue", "getValues", "fieldKey", "labelKey", "index", "optionsAC", "optionsModel", "getOptionLabel", "renderOption", "onEditModel", "sx", "options", "isSemaphoric", "label", "onValueChange", "decimalScale"]);
26
+ var { name, schema, control, errors, multiline = false, setValue, getValues, fieldKey, labelKey = 'nome', index, optionsAC, optionsModel, getOptionLabel, renderOption, onEditModel, fieldsLayout, sx, options, isSemaphoric = false, label, onValueChange, decimalScale = 2 } = _a, other = __rest(_a, ["name", "schema", "control", "errors", "multiline", "setValue", "getValues", "fieldKey", "labelKey", "index", "optionsAC", "optionsModel", "getOptionLabel", "renderOption", "onEditModel", "fieldsLayout", "sx", "options", "isSemaphoric", "label", "onValueChange", "decimalScale"]);
27
27
  switch (schema[name].type) {
28
28
  case 'date':
29
29
  return (react_1.default.createElement(DesktopDatePickerBySchema_1.default, Object.assign({ name: name, schema: schema, control: control, errors: errors, multiline: multiline, fieldKey: fieldKey, index: index, sx: sx, onValueChange: onValueChange }, other)));
@@ -45,7 +45,7 @@ function FieldBySchema(_a) {
45
45
  case 'field':
46
46
  const relatedEditable = schema[name].related_editable;
47
47
  const multiple = schema[name].many || false;
48
- return (react_1.default.createElement(EditableAutocompleteFieldBySchema_1.default, Object.assign({ name: name, schema: schema, control: control, errors: errors, setValue: setValue, getValues: getValues, fieldKey: fieldKey, labelKey: labelKey, index: index, optionsAC: optionsAC, optionsModel: optionsModel, getOptionLabel: getOptionLabel, renderOption: renderOption, onEditModel: relatedEditable ? onEditModel : undefined, multiple: multiple, sx: sx, onValueChange: onValueChange }, other)));
48
+ return (react_1.default.createElement(EditableAutocompleteFieldBySchema_1.default, Object.assign({ name: name, schema: schema, control: control, errors: errors, setValue: setValue, getValues: getValues, fieldKey: fieldKey, labelKey: labelKey, index: index, optionsAC: optionsAC, optionsModel: optionsModel, getOptionLabel: getOptionLabel, renderOption: renderOption, onEditModel: relatedEditable ? onEditModel : undefined, fieldsLayout: fieldsLayout, multiple: multiple, sx: sx, onValueChange: onValueChange }, other)));
49
49
  case 'choice':
50
50
  return (react_1.default.createElement(AutocompleteFieldBySchema_1.default, { index: index, name: name, schema: schema, control: control, errors: errors, fieldKey: fieldKey, optionIdKey: "value", optionLabelKey: "display_name", options: options, isSemaphoric: isSemaphoric, label: label, sx: sx, onValueChange: onValueChange }));
51
51
  case 'boolean':
@@ -3,6 +3,7 @@ import { UseFormRegister } from 'react-hook-form';
3
3
  import { CommonFieldProps, FieldBySchemaProps, FormFieldLayout, Item, OptionsAC } from '../../utils';
4
4
  interface FormBySchemaProps extends Omit<FieldBySchemaProps, 'name'> {
5
5
  fieldsLayout?: FormFieldLayout[];
6
+ customFieldFormLayouts?: Record<string, FormFieldLayout[]>;
6
7
  hiddenFields?: string[];
7
8
  register?: UseFormRegister<Item>;
8
9
  setOptionsAC?: (x: OptionsAC) => void;
@@ -10,5 +11,5 @@ interface FormBySchemaProps extends Omit<FieldBySchemaProps, 'name'> {
10
11
  isolatedGetAutoComplete?: (model: string) => Promise<false | Item[]>;
11
12
  fieldsProps?: Record<string, CommonFieldProps>;
12
13
  }
13
- export default function FormBySchema({ schema, control, errors, register, multiline, setValue, getValues, fieldKey, labelKey, index, optionsAC, setOptionsAC, forceReload, optionsModel, getOptionLabel, renderOption, onEditModel, options, isSemaphoric, label, decimalScale, fieldsLayout: fieldsLayoutInitial, fieldsProps, hiddenFields, isolatedGetAutoComplete, }: FormBySchemaProps): React.JSX.Element;
14
+ export default function FormBySchema({ schema, control, errors, register, multiline, setValue, getValues, fieldKey, labelKey, index, optionsAC, setOptionsAC, forceReload, optionsModel, getOptionLabel, renderOption, onEditModel, options, isSemaphoric, label, decimalScale, fieldsLayout: fieldsLayoutInitial, customFieldFormLayouts, fieldsProps, hiddenFields, isolatedGetAutoComplete, }: FormBySchemaProps): React.JSX.Element;
14
15
  export {};
@@ -44,8 +44,11 @@ const CircularProgress_1 = __importDefault(require("@mui/material/CircularProgre
44
44
  const FieldBySchema_1 = __importDefault(require("./FieldBySchema"));
45
45
  const styles_1 = require("../../styles");
46
46
  const APIWrapperContext_1 = require("../../context/APIWrapperContext");
47
- function FormBySchema({ schema, control, errors, register, multiline = false, setValue, getValues, fieldKey, labelKey = 'nome', index, optionsAC, setOptionsAC, forceReload, optionsModel, getOptionLabel, renderOption, onEditModel, options, isSemaphoric = false, label, decimalScale = 2, fieldsLayout: fieldsLayoutInitial, fieldsProps, hiddenFields = [], isolatedGetAutoComplete, }) {
48
- const { getAutoComplete } = (0, APIWrapperContext_1.useAPIWrapper)();
47
+ function FormBySchema({ schema, control, errors, register, multiline = false, setValue, getValues, fieldKey, labelKey = 'nome', index, optionsAC, setOptionsAC, forceReload, optionsModel, getOptionLabel, renderOption, onEditModel, options, isSemaphoric = false, label, decimalScale = 2, fieldsLayout: fieldsLayoutInitial, customFieldFormLayouts, fieldsProps, hiddenFields = [], isolatedGetAutoComplete, }) {
48
+ const { getAutoComplete, onEditModel: defaultOnEditModel } = (0, APIWrapperContext_1.useAPIWrapper)();
49
+ if (!onEditModel) {
50
+ onEditModel = defaultOnEditModel;
51
+ }
49
52
  const [fieldsLayout, setFieldsLayout] = (0, react_1.useState)([]);
50
53
  const [localOptionsAC, setLocalOptionsAC] = (0, react_1.useState)(undefined);
51
54
  const defaultSx = { mr: 0 };
@@ -152,7 +155,7 @@ function FormBySchema({ schema, control, errors, register, multiline = false, se
152
155
  section.rows && (react_1.default.createElement(react_1.default.Fragment, null, section.rows.map((row, rowIndex) => {
153
156
  if (typeof row === 'string') {
154
157
  const field = row;
155
- const fieldProps = fieldsProps && fieldsProps.hasOwnProperty(field)
158
+ const fieldProps = fieldsProps && field in fieldsProps
156
159
  ? fieldsProps[field]
157
160
  : {};
158
161
  fieldProps.sx = fieldProps.hasOwnProperty('sx')
@@ -161,7 +164,10 @@ function FormBySchema({ schema, control, errors, register, multiline = false, se
161
164
  return (react_1.default.createElement(react_1.default.Fragment, { key: field },
162
165
  react_1.default.createElement(FieldBySchema_1.default, Object.assign({ name: field, schema: schema, control: control, errors: errors, multiline: multiline, setValue: setValue, getValues: getValues, fieldKey: fieldKey, labelKey: labelKey, index: index, optionsAC: setOptionsAC
163
166
  ? optionsAC
164
- : localOptionsAC, optionsModel: optionsModel, getOptionLabel: getOptionLabel, renderOption: renderOption, onEditModel: onEditModel, options: options, isSemaphoric: isSemaphoric, label: label, decimalScale: decimalScale }, fieldProps))));
167
+ : localOptionsAC, optionsModel: optionsModel, getOptionLabel: getOptionLabel, renderOption: renderOption, onEditModel: onEditModel, fieldsLayout: customFieldFormLayouts &&
168
+ field in customFieldFormLayouts
169
+ ? customFieldFormLayouts[field]
170
+ : undefined, options: options, isSemaphoric: isSemaphoric, label: label, decimalScale: decimalScale }, fieldProps))));
165
171
  }
166
172
  if (Array.isArray(row)) {
167
173
  return (react_1.default.createElement(Box_1.default, { sx: styles_1.Layout.inLineForm, key: `row_${rowIndex}` },
@@ -49,7 +49,7 @@ const DialogActions_1 = __importDefault(require("../../DialogActions"));
49
49
  const APIWrapperContext_1 = require("../../../context/APIWrapperContext");
50
50
  const filter = (0, Autocomplete_1.createFilterOptions)();
51
51
  const EditableAutocompleteFieldBySchema = react_1.default.forwardRef((_a, ref) => {
52
- var { control, schema, errors, setValue, getValues, fieldKey, labelKey = 'nome', index, name = 'name', optionsAC, optionsModel, getOptionLabel, renderOption, onEditModel, sx = { mr: 2 }, onValueChange, multiple = false, disabled = false } = _a, other = __rest(_a, ["control", "schema", "errors", "setValue", "getValues", "fieldKey", "labelKey", "index", "name", "optionsAC", "optionsModel", "getOptionLabel", "renderOption", "onEditModel", "sx", "onValueChange", "multiple", "disabled"]);
52
+ var { control, schema, errors, setValue, getValues, fieldKey, labelKey = 'nome', index, name = 'name', optionsAC, optionsModel, getOptionLabel, renderOption, onEditModel, sx = { mr: 2 }, onValueChange, multiple = false, disabled = false, fieldsLayout } = _a, other = __rest(_a, ["control", "schema", "errors", "setValue", "getValues", "fieldKey", "labelKey", "index", "name", "optionsAC", "optionsModel", "getOptionLabel", "renderOption", "onEditModel", "sx", "onValueChange", "multiple", "disabled", "fieldsLayout"]);
53
53
  const { setDialog } = (0, APIWrapperContext_1.useAPIWrapper)();
54
54
  const [options, setOptions] = (0, react_1.useState)(null);
55
55
  const model = name;
@@ -156,6 +156,7 @@ const EditableAutocompleteFieldBySchema = react_1.default.forwardRef((_a, ref) =
156
156
  labelKey,
157
157
  setValue,
158
158
  getValues,
159
+ fieldsLayout,
159
160
  });
160
161
  }
161
162
  } },
@@ -242,7 +242,7 @@ function APIWrapper({ handleLoading, setSnackBar, setDialog, children }) {
242
242
  });
243
243
  return response;
244
244
  });
245
- const onEditModel = ({ fieldKey, index, model, id, labelKey, setValue, getValues, }) => {
245
+ const onEditModel = ({ fieldKey, index, model, id, labelKey, setValue, getValues, fieldsLayout, }) => {
246
246
  setDialog({
247
247
  open: true,
248
248
  loading: true,
@@ -266,7 +266,7 @@ function APIWrapper({ handleLoading, setSnackBar, setDialog, children }) {
266
266
  open: true,
267
267
  loading: false,
268
268
  title: 'Editar',
269
- Body: (react_1.default.createElement(DialogFormBySchema_1.default, { schema: result.schema, validationSchema: yupSchema, initialValues: values, setDialog: setDialog, getAutoComplete: localGetAutoComplete, onEditModelSave: onEditModelSave })),
269
+ Body: (react_1.default.createElement(DialogFormBySchema_1.default, { schema: result.schema, validationSchema: yupSchema, initialValues: values, setDialog: setDialog, getAutoComplete: localGetAutoComplete, onEditModelSave: onEditModelSave, fieldsLayout: fieldsLayout })),
270
270
  Actions: react_1.default.createElement(react_1.default.Fragment, null),
271
271
  });
272
272
  editModel.current = {
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { FieldValues, SubmitHandler, UseFormGetValues, UseFormSetValue } from 'react-hook-form';
3
3
  import { AlertColor, AlertPropsColorOverrides } from '@mui/material/Alert';
4
4
  import { OverridableStringUnion } from '@mui/types';
5
- import { ItemSchemaColumnsType, Id, Item, SchemaType, DataSchemaColumnsType, OnSuccessEvent, OptionsAC, GenericValue, TargetApiParams } from '../utils';
5
+ import { ItemSchemaColumnsType, Id, Item, SchemaType, DataSchemaColumnsType, OnSuccessEvent, OptionsAC, GenericValue, TargetApiParams, FormFieldLayout } from '../utils';
6
6
  import { GetGenericModelListProps } from '../api';
7
7
  import { serverEndPointType } from './DRFReactBySchemaContext';
8
8
  export interface LoadSinglePageDataProps {
@@ -30,6 +30,7 @@ export interface OnEditModelType {
30
30
  labelKey: string;
31
31
  setValue?: UseFormSetValue<FieldValues>;
32
32
  getValues?: UseFormGetValues<FieldValues>;
33
+ fieldsLayout?: FormFieldLayout[];
33
34
  }
34
35
  export interface OnEditRelatedModelType {
35
36
  model: string;
package/dist/utils.d.ts CHANGED
@@ -109,6 +109,7 @@ export interface CommonFieldProps {
109
109
  getOptionLabel?: (option: Item | string) => string;
110
110
  renderOption?: (props: React.HTMLAttributes<HTMLLIElement>, option: Item, state: AutocompleteRenderOptionState) => React.ReactNode;
111
111
  onEditModel?: (x: OnEditModelType) => void;
112
+ fieldsLayout?: FormFieldLayout[];
112
113
  multiple?: boolean;
113
114
  sx?: SxProps;
114
115
  options?: Item[];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "drf-react-by-schema",
3
- "version": "0.15.6",
3
+ "version": "0.16.0",
4
4
  "description": "Components and Tools for building a React App having Django Rest Framework (DRF) as server",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",