mantine-entity
Version:
A library combining Mantine, TanStack Query, and Mantine React Table for efficient entity management
37 lines (36 loc) • 1.94 kB
JavaScript
/* eslint-disable @typescript-eslint/no-explicit-any */
"use client";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { createElement as _createElement } from "react";
import { useReducer } from "react";
import { FormProvider, useForm, } from "react-hook-form";
import { Grid, LoadingOverlay, Stack, } from "@mantine/core";
import { RenderElements } from "../render/render-elements";
const FormBuilder = ({ fields, onSubmit, resetOnSubmit, wrapperProps, children, isLoading, mapDefaultValue, disabledFields, hiddenFields, httpGet, getBaseUrl, ...props }) => {
const [key, reset] = useReducer((value) => (value + 1) % 1000000, 0);
const methods = useForm({
...props,
values: mapDefaultValue ? mapDefaultValue(props.values) : props.values,
});
const handleOnSubmit = (data) => {
if (onSubmit) {
onSubmit(data);
}
if (resetOnSubmit) {
methods.reset();
reset();
}
};
return (_createElement(FormProvider, { ...methods, key: key },
_jsxs(Stack, { ...wrapperProps, component: "form", onSubmit: methods.handleSubmit(handleOnSubmit), children: [_jsx(LoadingOverlay, { visible: isLoading }), _jsx(Grid, { children: fields?.map((field, i) => (_jsx(Grid.Col, { span: { base: 12, md: 6 }, ...field.gridColProps, children: _jsx(RenderElements, { element: {
...field,
disabled: disabledFields?.includes(field.name),
hidden: hiddenFields?.includes(field.name),
asyncDataSource: {
...field.asyncDataSource,
httpGet,
getBaseUrl
}
}, methods: methods }) }, `${field.name}-${i}`))) }), children] })));
};
export { FormBuilder };