drf-react-by-schema 0.6.4 → 0.7.0

package/dist/context/DRFReactBySchemaContext.d.ts

@@ -2,10 +2,10 @@ import React from 'react';
 import { Theme } from '@mui/material/styles';
 export interface serverEndPointType {
     url: string;
-    autocomplete?: string;
-    api?: string;
-    JSONSchema?: string;
     apiTokenUrl: string;
+    api?: string;
+    signUp?: string;
+    autocomplete?: string;
     getToken?: string;
     refreshToken?: string;
     verifyToken?: string;
@@ -17,4 +17,4 @@ export interface DRFReactBySchemaContextType {
     firstBatchLength?: number;
 }
 export declare const DRFReactBySchemaContext: React.Context<DRFReactBySchemaContextType>;
-export declare const useTheme: () => Theme;
+export declare const useDRFReactBySchema: () => DRFReactBySchemaContextType;

package/dist/context/DRFReactBySchemaContext.js

@@ -3,17 +3,17 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useTheme = exports.DRFReactBySchemaContext = void 0;
+exports.useDRFReactBySchema = exports.DRFReactBySchemaContext = void 0;
 const react_1 = __importDefault(require("react"));
 const theme_1 = __importDefault(require("../styles/theme"));
 exports.DRFReactBySchemaContext = react_1.default.createContext({
     serverEndPoint: null,
     theme: theme_1.default,
     isInBatches: true,
-    firstBatchLength: 100
+    firstBatchLength: 100,
 });
-const useTheme = () => {
+const useDRFReactBySchema = () => {
     const context = react_1.default.useContext(exports.DRFReactBySchemaContext);
-    return context.theme;
+    return context;
 };
-exports.useTheme = useTheme;
+exports.useDRFReactBySchema = useDRFReactBySchema;

package/dist/context/DRFReactBySchemaProvider.d.ts

@@ -9,5 +9,5 @@ interface DRFReactBySchemaProviderProps extends DRFReactBySchemaContextType {
  * @param {*} props
  * @returns {*}
  */
-declare const DRFReactBySchemaProvider: ({ serverEndPoint, theme, isInBatches, firstBatchLength, children }: DRFReactBySchemaProviderProps) => JSX.Element;
+declare const DRFReactBySchemaProvider: ({ serverEndPoint, theme, isInBatches, firstBatchLength, children, }: DRFReactBySchemaProviderProps) => JSX.Element;
 export default DRFReactBySchemaProvider;

package/dist/context/DRFReactBySchemaProvider.js

@@ -15,7 +15,7 @@ const DRFReactBySchemaContext_1 = require("./DRFReactBySchemaContext");
  * @param {*} props
  * @returns {*}
  */
-const DRFReactBySchemaProvider = ({ serverEndPoint, theme, isInBatches, firstBatchLength, children }) => {
+const DRFReactBySchemaProvider = ({ serverEndPoint, theme, isInBatches, firstBatchLength, children, }) => {
     if (serverEndPoint) {
         const defaultKeys = [
             'autocomplete',
@@ -23,30 +23,27 @@ const DRFReactBySchemaProvider = ({ serverEndPoint, theme, isInBatches, firstBat
             ['JSONSchema', 'jsonschema'],
             ['getToken', ''],
             ['refreshToken', 'refresh'],
-            ['verifyToken', 'verify']
+            ['verifyToken', 'verify'],
         ];
         for (const key of defaultKeys) {
-            const hybridKey = (typeof key === 'string')
+            const hybridKey = typeof key === 'string'
                 ? key
                 : key[0];
-            const hybridUrl = (typeof key === 'string')
-                ? key
-                : key[1];
+            const hybridUrl = typeof key === 'string' ? key : key[1];
             if (serverEndPoint[hybridKey]) {
                 continue;
             }
             serverEndPoint[hybridKey] = `${serverEndPoint.url}/${hybridUrl}`;
         }
     }
-    const mergedTheme = (theme)
-        ? Object.assign(Object.assign({}, theme_1.default), theme) : theme_1.default;
+    const mergedTheme = theme ? Object.assign(Object.assign({}, theme_1.default), theme) : theme_1.default;
     return (react_1.default.createElement(styles_1.ThemeProvider, { theme: mergedTheme },
         react_1.default.createElement(CssBaseline_1.default, null),
         react_1.default.createElement(DRFReactBySchemaContext_1.DRFReactBySchemaContext.Provider, { value: {
                 serverEndPoint,
                 theme,
                 isInBatches,
-                firstBatchLength
+                firstBatchLength,
             } },
             react_1.default.createElement(Overlays_1.default, { children: children }))));
 };

package/dist/context/Form.d.ts

@@ -17,5 +17,5 @@ interface FormProps {
     formButtonsSx?: any;
     children: React.ReactNode;
 }
-export default function Form({ model, id, objTitleField, optionsACModels, cancelBtn, cancelBtnLabel, deleteBtnLabel, saveAndCreateNewBtnLabel, saveAndContinueBtnLabel, saveBtnLabel, onSuccess, borderBottom, saveAndContinue, formButtonsSx, children }: FormProps): JSX.Element;
+export default function Form({ model, id, objTitleField, optionsACModels, cancelBtn, cancelBtnLabel, deleteBtnLabel, saveAndCreateNewBtnLabel, saveAndContinueBtnLabel, saveBtnLabel, onSuccess, borderBottom, saveAndContinue, formButtonsSx, children, }: FormProps): JSX.Element;
 export {};

package/dist/context/Form.js

@@ -37,27 +37,27 @@ const APIWrapperContext_1 = require("./APIWrapperContext");
 const utils_1 = require("../utils");
 const DRFReactBySchemaContext_1 = require("./DRFReactBySchemaContext");
 const FormContext_1 = require("./FormContext");
-function Form({ model, id, objTitleField = 'name', optionsACModels = [], cancelBtn, cancelBtnLabel, deleteBtnLabel, saveAndCreateNewBtnLabel, saveAndContinueBtnLabel, saveBtnLabel, onSuccess, borderBottom, saveAndContinue, formButtonsSx, children }) {
+function Form({ model, id, objTitleField = 'name', optionsACModels = [], cancelBtn, cancelBtnLabel, deleteBtnLabel, saveAndCreateNewBtnLabel, saveAndContinueBtnLabel, saveBtnLabel, onSuccess, borderBottom, saveAndContinue, formButtonsSx, children, }) {
     const apiContext = react_1.default.useContext(APIWrapperContext_1.APIWrapperContext);
     const context = react_1.default.useContext(DRFReactBySchemaContext_1.DRFReactBySchemaContext);
     if (!context.serverEndPoint || !apiContext) {
         console.error('Error in drf-react-by-schema: There is no serverEndPoint configured!');
-        return (react_1.default.createElement(react_1.default.Fragment, null));
+        return react_1.default.createElement(react_1.default.Fragment, null);
     }
-    const { loadSinglePageData, onSubmit, onEditModel, onDeleteModel, onEditRelatedModelSave, onDeleteRelatedModel } = apiContext;
+    const { loadSinglePageData, onSubmit, onEditModel, onDeleteModel, onEditRelatedModelSave, onDeleteRelatedModel, } = apiContext;
     const pageForm = apiContext.pageFormState[0];
     const optionsAC = apiContext.optionsACState[0];
-    const { control, handleSubmit, reset, getValues, setValue, formState: { errors, isDirty } } = (0, react_hook_form_1.useForm)({
+    const { control, handleSubmit, reset, getValues, setValue, formState: { errors, isDirty }, } = (0, react_hook_form_1.useForm)({
         mode: 'onBlur',
-        resolver: (0, yup_1.yupResolver)(pageForm.validationSchema)
+        resolver: (0, yup_1.yupResolver)(pageForm.validationSchema),
     });
     const loadAllData = () => {
         loadSinglePageData({
             model,
             objTitleField,
             objId: id,
-            optionsACModels
-        }).then(values => {
+            optionsACModels,
+        }).then((values) => {
             if (values && typeof values !== 'boolean') {
                 reset(values);
             }
@@ -80,7 +80,7 @@ function Form({ model, id, objTitleField = 'name', optionsACModels = [], cancelB
         onSuccess,
         borderBottom,
         saveAndContinue,
-        sx: formButtonsSx
+        sx: formButtonsSx,
     };
     // onSubmit={handleSubmit((data, event) => {
     //     onSubmit(
@@ -89,11 +89,10 @@ function Form({ model, id, objTitleField = 'name', optionsACModels = [], cancelB
     //         data,
     //         event
     //     );
-    return (react_1.default.createElement(react_1.default.Fragment, null, pageForm.initialValues && pageForm.schema && control &&
-        react_1.default.createElement(FormContext_1.FormContext.Provider, { value: null },
-            react_1.default.createElement(LocalizationProvider_1.LocalizationProvider, { dateAdapter: AdapterMoment_1.AdapterMoment },
-                react_1.default.createElement(FormButtons_1.default, Object.assign({}, formButtonProps)),
-                react_1.default.createElement(Box_1.default, null, children),
-                react_1.default.createElement(FormButtons_1.default, Object.assign({}, formButtonProps, { bottom: true }))))));
+    return (react_1.default.createElement(react_1.default.Fragment, null, pageForm.initialValues && pageForm.schema && control && (react_1.default.createElement(FormContext_1.FormContext.Provider, { value: null },
+        react_1.default.createElement(LocalizationProvider_1.LocalizationProvider, { dateAdapter: AdapterMoment_1.AdapterMoment },
+            react_1.default.createElement(FormButtons_1.default, Object.assign({}, formButtonProps)),
+            react_1.default.createElement(Box_1.default, null, children),
+            react_1.default.createElement(FormButtons_1.default, Object.assign({}, formButtonProps, { bottom: true })))))));
 }
 exports.default = Form;

package/dist/context/FormContext.js

@@ -5,11 +5,4 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.FormContext = void 0;
 const react_1 = __importDefault(require("react"));
-;
-;
-;
-;
-;
-;
-;
 exports.FormContext = react_1.default.createContext(null);

package/dist/context/Overlays.js

@@ -42,17 +42,17 @@ function Overlays({ children }) {
     const initialSnackBar = {
         open: false,
         msg: '',
-        severity: 'info'
+        severity: 'info',
     };
     const initialDialog = {
         open: false,
         loading: true,
         title: '',
         Body: null,
-        Actions: null
+        Actions: null,
     };
-    const [snackBar, setSnackBar] = (0, react_1.useReducer)(utils_1.reducer, initialSnackBar);
-    const [dialog, setDialog] = (0, react_1.useReducer)(utils_1.reducer, initialDialog);
+    const [snackBar, setSnackBar] = (0, react_1.useReducer)((utils_1.reducer), initialSnackBar);
+    const [dialog, setDialog] = (0, react_1.useReducer)((utils_1.reducer), initialDialog);
     const [loading, setLoading] = (0, react_1.useState)(true);
     // give some time to stop loading when data is retrieved and must render before loading rendering:
     const handleLoading = (loadingState) => {
@@ -66,22 +66,21 @@ function Overlays({ children }) {
     };
     const handleDialogClose = () => {
         setDialog({
-            open: false
+            open: false,
         });
     };
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(APIWrapper_1.default, { setLoading: setLoading, handleLoading: handleLoading, setSnackBar: setSnackBar, setDialog: setDialog, children: children }),
         react_1.default.createElement(Backdrop_1.default, { sx: { color: '#fff', zIndex: (theme) => theme.zIndex.drawer + 1 }, open: loading },
             react_1.default.createElement(CircularProgress_1.default, null)),
-        react_1.default.createElement(Snackbar_1.default, { open: snackBar.open, autoHideDuration: 3000, onClose: () => { setSnackBar({ open: false }); }, anchorOrigin: { vertical: 'top', horizontal: 'right' } },
+        react_1.default.createElement(Snackbar_1.default, { open: snackBar.open, autoHideDuration: 3000, onClose: () => {
+                setSnackBar({ open: false });
+            }, anchorOrigin: { vertical: 'top', horizontal: 'right' } },
             react_1.default.createElement(Alert_1.default, { severity: snackBar.severity }, snackBar.msg)),
         react_1.default.createElement(Dialog_1.default, { open: dialog.open, onClose: handleDialogClose },
             react_1.default.createElement(DialogTitle_1.default, null, dialog.loading ? 'Carregando...' : dialog.title),
-            react_1.default.createElement(DialogContent_1.default, null, dialog.loading
-                ? react_1.default.createElement(Box_1.default, { sx: { display: 'flex' } },
-                    react_1.default.createElement(CircularProgress_1.default, null))
-                : react_1.default.createElement(react_1.default.Fragment, null, dialog.Body)),
-            react_1.default.createElement(DialogActions_1.default, null, !dialog.loading &&
-                react_1.default.createElement(react_1.default.Fragment, null, dialog.Actions)))));
+            react_1.default.createElement(DialogContent_1.default, null, dialog.loading ? (react_1.default.createElement(Box_1.default, { sx: { display: 'flex' } },
+                react_1.default.createElement(CircularProgress_1.default, null))) : (react_1.default.createElement(react_1.default.Fragment, null, dialog.Body))),
+            react_1.default.createElement(DialogActions_1.default, null, !dialog.loading && react_1.default.createElement(react_1.default.Fragment, null, dialog.Actions)))));
 }
 exports.default = Overlays;

package/dist/index.d.ts

@@ -1,12 +1,22 @@
-import { updateData, partialUpdateData, createData, deleteData, createOrUpdateData, updateDataBySchema, addExistingRelatedModel, getAutoComplete, getJSONSchema, createOrUpdateJSONSchema, loginByPayload, setAuthToken, isLoggedIn, getGenericModelList, getGenericModel } from './api';
-import { emptyByType, getChoiceByValue, populateValues, buildGenericYupValidationSchema, errorProps, getTmpId, isTmpId, getPatternFormat } from './utils';
+import { updateData, partialUpdateData, createData, deleteData, createOrUpdateData, updateDataBySchema, addExistingRelatedModel, getAutoComplete, getJSONSchema, createOrUpdateJSONSchema, loginByPayload, setAuthToken, isLoggedIn, getGenericModelList, getGenericModel, hasJWT, clearJWT } from './api';
+import { emptyByType, getChoiceByValue, populateValues, buildGenericYupValidationSchema, errorProps, getTmpId, isTmpId, getPatternFormat, slugToCamelCase } from './utils';
 import DRFReactBySchemaProvider from './context/DRFReactBySchemaProvider';
-import { DRFReactBySchemaContext, useTheme } from './context/DRFReactBySchemaContext';
-import { APIWrapperContext } from './context/APIWrapperContext';
+import { useDRFReactBySchema } from './context/DRFReactBySchemaContext';
+import { useAPIWrapper } from './context/APIWrapperContext';
+import Form from './context/Form';
+import FormBySchema from './components/forms/FormBySchema';
+import DialogFormBySchema from './components/forms/DialogFormBySchema';
 import DataGridBySchemaEditable from './components/DataGridBySchemaEditable';
 import GenericModelList from './components/GenericModelList';
 import GenericRelatedModelList from './components/GenericRelatedModelList';
 import DataTotals from './components/DataTotals';
 import DialogActions from './components/DialogActions';
-import Form from './context/Form';
-export { DRFReactBySchemaProvider, DRFReactBySchemaContext, APIWrapperContext, useTheme, Form, FormContext, DataGridBySchemaEditable, GenericModelList, GenericRelatedModelList, DataTotals, DialogActions, updateData, partialUpdateData, createData, deleteData, createOrUpdateData, updateDataBySchema, addExistingRelatedModel, getAutoComplete, getJSONSchema, createOrUpdateJSONSchema, loginByPayload, setAuthToken, isLoggedIn, getGenericModelList, getGenericModel, emptyByType, getChoiceByValue, populateValues, buildGenericYupValidationSchema, errorProps, getTmpId, isTmpId, getPatternFormat };
+import FieldBySchema from './components/forms/FieldBySchema';
+import TextFieldBySchema from './components/forms/inputs/TextFieldBySchema';
+import BooleanFieldBySchema from './components/forms/inputs/BooleanFieldBySchema';
+import DesktopDatePickerBySchema from './components/forms/inputs/DesktopDatePickerBySchema';
+import DesktopDateTimePickerBySchema from './components/forms/inputs/DesktopDateTimePickerBySchema';
+import EditableAutocompleteFieldBySchema from './components/forms/inputs/EditableAutocompleteFieldBySchema';
+import AutocompleteFieldBySchema from './components/forms/inputs/AutocompleteFieldBySchema';
+import FloatFieldBySchema from './components/forms/inputs/FloatFieldBySchema';
+export { DRFReactBySchemaProvider, useAPIWrapper, useDRFReactBySchema, Form, FormBySchema, DialogFormBySchema, DataGridBySchemaEditable, GenericModelList, GenericRelatedModelList, DataTotals, DialogActions, FieldBySchema, TextFieldBySchema, BooleanFieldBySchema, DesktopDatePickerBySchema, DesktopDateTimePickerBySchema, EditableAutocompleteFieldBySchema, AutocompleteFieldBySchema, FloatFieldBySchema, updateData, partialUpdateData, createData, deleteData, createOrUpdateData, updateDataBySchema, addExistingRelatedModel, getAutoComplete, getJSONSchema, createOrUpdateJSONSchema, loginByPayload, setAuthToken, isLoggedIn, getGenericModelList, getGenericModel, emptyByType, getChoiceByValue, populateValues, buildGenericYupValidationSchema, errorProps, getTmpId, isTmpId, getPatternFormat, clearJWT, hasJWT, slugToCamelCase, };

package/dist/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getPatternFormat = exports.isTmpId = exports.getTmpId = exports.errorProps = exports.buildGenericYupValidationSchema = exports.populateValues = exports.getChoiceByValue = exports.emptyByType = exports.getGenericModel = exports.getGenericModelList = exports.isLoggedIn = exports.setAuthToken = exports.loginByPayload = exports.createOrUpdateJSONSchema = exports.getJSONSchema = exports.getAutoComplete = exports.addExistingRelatedModel = exports.updateDataBySchema = exports.createOrUpdateData = exports.deleteData = exports.createData = exports.partialUpdateData = exports.updateData = exports.DialogActions = exports.DataTotals = exports.GenericRelatedModelList = exports.GenericModelList = exports.DataGridBySchemaEditable = exports.FormContext = exports.Form = exports.useTheme = exports.APIWrapperContext = exports.DRFReactBySchemaContext = exports.DRFReactBySchemaProvider = void 0;
+exports.slugToCamelCase = exports.hasJWT = exports.clearJWT = exports.getPatternFormat = exports.isTmpId = exports.getTmpId = exports.errorProps = exports.buildGenericYupValidationSchema = exports.populateValues = exports.getChoiceByValue = exports.emptyByType = exports.getGenericModel = exports.getGenericModelList = exports.isLoggedIn = exports.setAuthToken = exports.loginByPayload = exports.createOrUpdateJSONSchema = exports.getJSONSchema = exports.getAutoComplete = exports.addExistingRelatedModel = exports.updateDataBySchema = exports.createOrUpdateData = exports.deleteData = exports.createData = exports.partialUpdateData = exports.updateData = exports.FloatFieldBySchema = exports.AutocompleteFieldBySchema = exports.EditableAutocompleteFieldBySchema = exports.DesktopDateTimePickerBySchema = exports.DesktopDatePickerBySchema = exports.BooleanFieldBySchema = exports.TextFieldBySchema = exports.FieldBySchema = exports.DialogActions = exports.DataTotals = exports.GenericRelatedModelList = exports.GenericModelList = exports.DataGridBySchemaEditable = exports.DialogFormBySchema = exports.FormBySchema = exports.Form = exports.useDRFReactBySchema = exports.useAPIWrapper = exports.DRFReactBySchemaProvider = void 0;
 // Methods:
 const api_1 = require("./api");
 Object.defineProperty(exports, "updateData", { enumerable: true, get: function () { return api_1.updateData; } });
@@ -21,6 +21,8 @@ Object.defineProperty(exports, "setAuthToken", { enumerable: true, get: function
 Object.defineProperty(exports, "isLoggedIn", { enumerable: true, get: function () { return api_1.isLoggedIn; } });
 Object.defineProperty(exports, "getGenericModelList", { enumerable: true, get: function () { return api_1.getGenericModelList; } });
 Object.defineProperty(exports, "getGenericModel", { enumerable: true, get: function () { return api_1.getGenericModel; } });
+Object.defineProperty(exports, "hasJWT", { enumerable: true, get: function () { return api_1.hasJWT; } });
+Object.defineProperty(exports, "clearJWT", { enumerable: true, get: function () { return api_1.clearJWT; } });
 const utils_1 = require("./utils");
 Object.defineProperty(exports, "emptyByType", { enumerable: true, get: function () { return utils_1.emptyByType; } });
 Object.defineProperty(exports, "getChoiceByValue", { enumerable: true, get: function () { return utils_1.getChoiceByValue; } });
@@ -30,15 +32,22 @@ Object.defineProperty(exports, "errorProps", { enumerable: true, get: function (
 Object.defineProperty(exports, "getTmpId", { enumerable: true, get: function () { return utils_1.getTmpId; } });
 Object.defineProperty(exports, "isTmpId", { enumerable: true, get: function () { return utils_1.isTmpId; } });
 Object.defineProperty(exports, "getPatternFormat", { enumerable: true, get: function () { return utils_1.getPatternFormat; } });
+Object.defineProperty(exports, "slugToCamelCase", { enumerable: true, get: function () { return utils_1.slugToCamelCase; } });
 // Wrappers/Providers:
 const DRFReactBySchemaProvider_1 = __importDefault(require("./context/DRFReactBySchemaProvider"));
 exports.DRFReactBySchemaProvider = DRFReactBySchemaProvider_1.default;
 const DRFReactBySchemaContext_1 = require("./context/DRFReactBySchemaContext");
-Object.defineProperty(exports, "DRFReactBySchemaContext", { enumerable: true, get: function () { return DRFReactBySchemaContext_1.DRFReactBySchemaContext; } });
-Object.defineProperty(exports, "useTheme", { enumerable: true, get: function () { return DRFReactBySchemaContext_1.useTheme; } });
+Object.defineProperty(exports, "useDRFReactBySchema", { enumerable: true, get: function () { return DRFReactBySchemaContext_1.useDRFReactBySchema; } });
 const APIWrapperContext_1 = require("./context/APIWrapperContext");
-Object.defineProperty(exports, "APIWrapperContext", { enumerable: true, get: function () { return APIWrapperContext_1.APIWrapperContext; } });
-// Components
+Object.defineProperty(exports, "useAPIWrapper", { enumerable: true, get: function () { return APIWrapperContext_1.useAPIWrapper; } });
+// Forms:
+const Form_1 = __importDefault(require("./context/Form"));
+exports.Form = Form_1.default;
+const FormBySchema_1 = __importDefault(require("./components/forms/FormBySchema"));
+exports.FormBySchema = FormBySchema_1.default;
+const DialogFormBySchema_1 = __importDefault(require("./components/forms/DialogFormBySchema"));
+exports.DialogFormBySchema = DialogFormBySchema_1.default;
+// Components:
 const DataGridBySchemaEditable_1 = __importDefault(require("./components/DataGridBySchemaEditable"));
 exports.DataGridBySchemaEditable = DataGridBySchemaEditable_1.default;
 const GenericModelList_1 = __importDefault(require("./components/GenericModelList"));
@@ -49,5 +58,20 @@ const DataTotals_1 = __importDefault(require("./components/DataTotals"));
 exports.DataTotals = DataTotals_1.default;
 const DialogActions_1 = __importDefault(require("./components/DialogActions"));
 exports.DialogActions = DialogActions_1.default;
-const Form_1 = __importDefault(require("./context/Form"));
-exports.Form = Form_1.default;
+// FormComponents
+const FieldBySchema_1 = __importDefault(require("./components/forms/FieldBySchema"));
+exports.FieldBySchema = FieldBySchema_1.default;
+const TextFieldBySchema_1 = __importDefault(require("./components/forms/inputs/TextFieldBySchema"));
+exports.TextFieldBySchema = TextFieldBySchema_1.default;
+const BooleanFieldBySchema_1 = __importDefault(require("./components/forms/inputs/BooleanFieldBySchema"));
+exports.BooleanFieldBySchema = BooleanFieldBySchema_1.default;
+const DesktopDatePickerBySchema_1 = __importDefault(require("./components/forms/inputs/DesktopDatePickerBySchema"));
+exports.DesktopDatePickerBySchema = DesktopDatePickerBySchema_1.default;
+const DesktopDateTimePickerBySchema_1 = __importDefault(require("./components/forms/inputs/DesktopDateTimePickerBySchema"));
+exports.DesktopDateTimePickerBySchema = DesktopDateTimePickerBySchema_1.default;
+const EditableAutocompleteFieldBySchema_1 = __importDefault(require("./components/forms/inputs/EditableAutocompleteFieldBySchema"));
+exports.EditableAutocompleteFieldBySchema = EditableAutocompleteFieldBySchema_1.default;
+const AutocompleteFieldBySchema_1 = __importDefault(require("./components/forms/inputs/AutocompleteFieldBySchema"));
+exports.AutocompleteFieldBySchema = AutocompleteFieldBySchema_1.default;
+const FloatFieldBySchema_1 = __importDefault(require("./components/forms/inputs/FloatFieldBySchema"));
+exports.FloatFieldBySchema = FloatFieldBySchema_1.default;

package/dist/styles/layout.d.ts

@@ -36,6 +36,13 @@ export declare const loadingBox: {
     flexDirection: string;
     alignItems: string;
 };
+export declare const loadingBoxWhite: {
+    height: string;
+    justifyContent: string;
+    display: string;
+    flexDirection: string;
+    alignItems: string;
+};
 export declare const actionButtons: {
     width: string;
     alignItems: string;

package/dist/styles/layout.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.geoPicker = exports.metabaseAppEmbed = exports.formCardContent = exports.formCard = exports.fullWidthButton = exports.dataGridFixedHeight = exports.dataGridWithTabs = exports.dataGrid = exports.topBarOverList = exports.flexRowGrow = exports.flexColumn = exports.inLineForm = exports.actionButtons = exports.loadingBox = exports.topBar = exports.flexRow = exports.main = exports.content = void 0;
+exports.geoPicker = exports.metabaseAppEmbed = exports.formCardContent = exports.formCard = exports.fullWidthButton = exports.dataGridFixedHeight = exports.dataGridWithTabs = exports.dataGrid = exports.topBarOverList = exports.flexRowGrow = exports.flexColumn = exports.inLineForm = exports.actionButtons = exports.loadingBoxWhite = exports.loadingBox = exports.topBar = exports.flexRow = exports.main = exports.content = void 0;
 const theme_1 = __importDefault(require("./theme"));
 exports.content = {
     flexGrow: 1,
@@ -21,6 +21,7 @@ exports.flexRow = {
 };
 exports.topBar = Object.assign(Object.assign({}, exports.flexRow), { width: '100%', pl: 3, pr: 6 });
 exports.loadingBox = Object.assign(Object.assign({}, exports.flexRow), { height: '100%', backgroundColor: '#ccc', justifyContent: 'center' });
+exports.loadingBoxWhite = Object.assign(Object.assign({}, exports.flexRow), { height: '100%', justifyContent: 'center' });
 exports.actionButtons = Object.assign(Object.assign({}, exports.flexRow), { width: '100%', alignItems: 'flex-start' });
 exports.inLineForm = Object.assign(Object.assign({}, exports.flexRow), { width: '100%', justifyContent: 'flex-start' });
 exports.flexColumn = Object.assign(Object.assign({}, exports.flexRow), { flexDirection: 'column' });

package/dist/utils.d.ts

@@ -1,5 +1,9 @@
+/// <reference types="react" />
 import { CalendarPickerView } from '@mui/x-date-pickers/CalendarPicker';
 import { GridActionsColDef, GridColDef, GridFilterModel, GridSortModel } from '@mui/x-data-grid';
+import { Control, FieldValues, UseFormGetValues, UseFormSetValue } from 'react-hook-form';
+import { AutocompleteRenderOptionState, SxProps } from '@mui/material';
+import { OnEditModelType } from './context/APIWrapperContext';
 export type Id = string | number;
 export type Item = Record<string, any>;
 export type PaginatedResult = {
@@ -42,6 +46,10 @@ export interface Field {
     validators_regex?: Item[];
     many?: boolean;
     date_views?: CalendarPickerView[];
+    required?: boolean;
+    disabled?: boolean;
+    help_text?: string;
+    model_multiline?: boolean;
 }
 interface GridBySchemaColDef extends GridColDef {
     isIndexField?: boolean;
@@ -70,21 +78,50 @@ export interface ItemSchemaColumnsType {
     modelOptions: modelOptionsType;
     columns?: GridEnrichedBySchemaColDef[];
 }
+export interface FieldBySchemaProps {
+    name: string;
+    schema: SchemaType;
+    control: Control;
+    errors: Item;
+    multiline?: boolean;
+    setValue?: UseFormSetValue<FieldValues>;
+    getValues?: UseFormGetValues<FieldValues>;
+    fieldKey?: string;
+    labelKey?: string;
+    index?: number;
+    optionsAC?: Record<string, Item[]>;
+    optionsModel?: string;
+    getOptionLabel?: (option: Item | string) => string;
+    renderOption?: (props: React.HTMLAttributes<HTMLLIElement>, option: Item, state: AutocompleteRenderOptionState) => React.ReactNode;
+    onEditModel?: (x: OnEditModelType) => void;
+    multiple?: boolean;
+    sx?: SxProps;
+    options?: Item[];
+    isSemaphoric?: boolean;
+    label?: string;
+    onValueChange?: (x: any) => void;
+    decimalScale?: number;
+    isPassword?: boolean;
+    type?: React.HTMLInputTypeAttribute;
+    autocomplete?: string;
+    minRows?: number;
+    optionIdKey?: string;
+    optionLabelKey?: string;
+}
 export declare const emptyByType: any;
 export declare const getChoiceByValue: (value: number | string, choices: Choice[] | undefined) => string | null | undefined;
 export declare const populateValues: ({ data, schema }: {
     data: Item;
     schema: SchemaType;
 }) => Record<string, any>;
-export declare const buildGenericYupValidationSchema: ({ data, schema, many, skipFields, extraValidators }: {
+export declare const buildGenericYupValidationSchema: ({ data, schema, many, skipFields, extraValidators, }: {
     data: Item;
     schema: SchemaType;
     many?: boolean | undefined;
     skipFields?: string[] | undefined;
     extraValidators?: Item | undefined;
 }) => any;
-export declare const errorProps: ({ type, errors, fieldKey, fieldKeyProp, index }: {
-    type: string;
+export declare const errorProps: ({ errors, fieldKey, fieldKeyProp, index, }: {
     errors: Item;
     fieldKey: string;
     fieldKeyProp: string;
@@ -95,8 +132,9 @@ export declare const errorProps: ({ type, errors, fieldKey, fieldKeyProp, index
 };
 export declare const getTmpId: () => string;
 export declare const isTmpId: (id: string | number | undefined | null) => boolean;
-export declare const reducer: (state: Record<string, any> | null, newState: Record<string, any>) => Record<string, any> | null;
+export declare function reducer<T>(state: T | null, newState: Partial<T> | null): T | null;
 export declare const getPatternFormat: (type: string) => string;
 export type AddParametersToEnd<TFunction extends (...args: any) => any, TParameters extends [...args: any]> = (...args: [...Parameters<TFunction>, ...TParameters]) => ReturnType<TFunction>;
 export declare function buildDateFormatBySchema(dateViews: string[] | null | undefined): "DD/MM/yyyy" | "MM/yyyy" | "yyyy" | "MM" | "DD";
+export declare const slugToCamelCase: (str: string) => string;
 export {};

package/dist/utils.js

@@ -23,12 +23,8 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.buildDateFormatBySchema = exports.getPatternFormat = exports.reducer = exports.isTmpId = exports.getTmpId = exports.errorProps = exports.buildGenericYupValidationSchema = exports.populateValues = exports.getChoiceByValue = exports.emptyByType = void 0;
+exports.slugToCamelCase = exports.buildDateFormatBySchema = exports.getPatternFormat = exports.reducer = exports.isTmpId = exports.getTmpId = exports.errorProps = exports.buildGenericYupValidationSchema = exports.populateValues = exports.getChoiceByValue = exports.emptyByType = void 0;
 const Yup = __importStar(require("yup"));
-;
-;
-;
-;
 const emptyByType = (field, forDatabase = false) => {
     if (field.model_default) {
         return field.model_default;
@@ -41,9 +37,7 @@ const emptyByType = (field, forDatabase = false) => {
             if (field.child) {
                 return [];
             }
-            return (forDatabase)
-                ? undefined
-                : null;
+            return forDatabase ? undefined : null;
         case 'string':
         case 'email':
             return '';
@@ -85,7 +79,7 @@ const populateValues = ({ data, schema }) => {
                 for (const row of data[key]) {
                     const value = (0, exports.populateValues)({
                         data: row,
-                        schema: field.child.children
+                        schema: field.child.children,
                     });
                     arValues.push(value);
                 }
@@ -94,7 +88,7 @@ const populateValues = ({ data, schema }) => {
             }
             values[key] = (0, exports.populateValues)({
                 data: data[key],
-                schema: field.child.children
+                schema: field.child.children,
             });
             continue;
         }
@@ -102,7 +96,7 @@ const populateValues = ({ data, schema }) => {
             values[key] = data[key]
                 ? {
                     value: data[key],
-                    display_name: (0, exports.getChoiceByValue)(data[key], field.choices)
+                    display_name: (0, exports.getChoiceByValue)(data[key], field.choices),
                 }
                 : (0, exports.emptyByType)(field);
             continue;
@@ -164,7 +158,7 @@ const getYupValidator = (type) => {
     }
     return yupFunc.nullable();
 };
-const buildGenericYupValidationSchema = ({ data, schema, many = false, skipFields = [], extraValidators = {} }) => {
+const buildGenericYupValidationSchema = ({ data, schema, many = false, skipFields = [], extraValidators = {}, }) => {
     const yupValidator = {};
     for (const entry of Object.entries(schema)) {
         const [key, field] = entry;
@@ -180,7 +174,7 @@ const buildGenericYupValidationSchema = ({ data, schema, many = false, skipField
                 data: data[key],
                 extraValidators: Object.prototype.hasOwnProperty.call(extraValidators, key)
                     ? extraValidators[key]
-                    : {}
+                    : {},
             });
             continue;
         }
@@ -224,16 +218,19 @@ const buildGenericYupValidationSchema = ({ data, schema, many = false, skipField
         }
     }
     // console.log({ yupValidator });
-    return (many)
+    return many
         ? Yup.array().of(Yup.object().shape(yupValidator))
         : Yup.object().shape(yupValidator);
 };
 exports.buildGenericYupValidationSchema = buildGenericYupValidationSchema;
-const errorProps = ({ type, errors, fieldKey, fieldKeyProp, index }) => {
+const errorProps = ({ errors, fieldKey, fieldKeyProp, index, }) => {
     let error;
     let helperText;
     if (index) {
-        const hasErrors = errors && errors[fieldKey] && errors[fieldKey][index] && Boolean(errors[fieldKey][index][fieldKeyProp]);
+        const hasErrors = errors &&
+            errors[fieldKey] &&
+            errors[fieldKey][index] &&
+            Boolean(errors[fieldKey][index][fieldKeyProp]);
         error = hasErrors;
         helperText = hasErrors ? errors[fieldKey][index][fieldKeyProp].message : null;
         return { error, helperText };
@@ -255,7 +252,7 @@ const isTmpId = (id) => {
     return id.toString().slice(0, 3) === 'tmp';
 };
 exports.isTmpId = isTmpId;
-const reducer = (state, newState) => {
+function reducer(state, newState) {
     if (newState === null) {
         return null;
     }
@@ -263,7 +260,7 @@ const reducer = (state, newState) => {
         return newState;
     }
     return Object.assign(Object.assign({}, state), newState);
-};
+}
 exports.reducer = reducer;
 const getPatternFormat = (type) => {
     let format = '';
@@ -314,3 +311,10 @@ function buildDateFormatBySchema(dateViews) {
     return defaultFormat;
 }
 exports.buildDateFormatBySchema = buildDateFormatBySchema;
+const slugToCamelCase = (str) => {
+    const ret = str.replace(/_([a-z])/g, function (g) {
+        return g[1].toUpperCase();
+    });
+    return ret;
+};
+exports.slugToCamelCase = slugToCamelCase;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "drf-react-by-schema",
-  "version": "0.6.4",
+  "version": "0.7.0",
   "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",