@dashadmin/dash-auto-admin 1.3.17 → 1.3.20

package/dist/DashAutoAdminComponentRegistry.js

@@ -0,0 +1 @@
+import{jsx as g}from"react/jsx-runtime";import o,{createContext as a,useContext as R}from"react";const s={},i=a({components:s,registerComponent:()=>{},registerComponents:()=>{}}),y=()=>R(i),h=({children:C,customComponents:e={}})=>{const[m,n]=o.useState({...s,...e});o.useEffect(()=>{e&&Object.keys(e).length>0&&n(t=>({...t,...e}))},[e]);const p=o.useCallback((t,r)=>{n(c=>({...c,[t]:r}))},[]),d=o.useCallback(t=>{n(r=>({...r,...t}))},[]);return g(i.Provider,{value:{components:m,registerComponent:p,registerComponents:d},children:C})};export{h as ComponentRegistryProvider,y as useComponentRegistry};

package/dist/DashAutoAdminForm.js

@@ -0,0 +1 @@
+import{jsx as t,jsxs as B}from"react/jsx-runtime";import{Box as b}from"@mui/material";import{useResourceContext as p,useRecordContext as v,Toolbar as y,SimpleForm as A}from"react-admin";import S from"./utils/validate";import{ToolbarCreateButton as D,ToolbarDeleteButton as C,ToolbarSaveButton as E}from"./toolbar/buttons/ToolbarButtons";import{useDataProvider as F}from"react-admin";import{DashAutoAdminFormProvider as R}from"./context/DashAutoAdminFormContext";const T=({resourceConfig:r,onSubmit:l,beforeSubmit:n,onError:i,toolbar:h,mode:d,children:g})=>{const s=p(),f=v(),m=F(),a=!1,u=async e=>{a&&console.log("onCreateSave called with values:",e),window.dispatchEvent(new MessageEvent("dash-global-loader",{data:!0}));try{n&&(a&&console.log("beforeSubmit called with values:",e),e=n(e),a&&console.log("beforeSubmit returned values:",e));const{data:o}=await m.create(s,{data:e});a&&console.log("dataProvider.create returned data:",o),l&&(a&&console.log("onSubmit called with data:",o),l(o))}catch(o){i&&(a&&console.log("onError called with error:",o),i(o))}finally{window.dispatchEvent(new MessageEvent("dash-global-loader",{data:!1}))}},w=async e=>{a&&console.log("onUpdateSave called with values:",e),window.dispatchEvent(new MessageEvent("dash-global-loader",{data:!0}));try{n&&(a&&console.log("beforeSubmit called with values:",e),e=n(e),a&&console.log("beforeSubmit returned values:",e));const{data:o}=await m.update(s,{id:f?.id,data:e,previousData:f});a&&console.log("dataProvider.update returned data:",o),l&&(a&&console.log("onSubmit called with data:",o),l(o))}catch(o){i&&(a&&console.log("onError called with error:",o),i(o))}finally{window.dispatchEvent(new MessageEvent("dash-global-loader",{data:!1}))}};let c=u;switch(d){case"edit":c=w;break;case"create":c=u;break}return t(R,{value:{onSave:c,mode:d},children:t(b,{children:t(A,{toolbar:h||B(y,{children:[d==="edit"&&t(E,{resourceConfig:r}),d==="create"&&t(D,{resourceConfig:r}),t(C,{resourceConfig:r})]}),onSubmit:c,validate:S(r.schema),reValidateMode:"onBlur",children:g})})})};var K=T;export{K as default};

package/dist/DashAutoAdminResizableDrawer.js

@@ -0,0 +1 @@
+import{Fragment as w,jsx as e,jsxs as D}from"react/jsx-runtime";import{Drawer as d}from"@mui/material";import t from"react";const n=t.createContext(400),m=({children:a,defaultWidth:s,...o})=>{const[r,l]=t.useState(s),i=()=>e(w,{});return e(d,{PaperProps:{style:{width:r}},...o,children:D(n.Provider,{value:r,children:[e(i,{}),a]})})};export{m as DashAutoAdminResizableDrawer,n as DashAutoAdminResizableDrawerContext};

package/dist/DashAutoAdminSaveButton.js

@@ -0,0 +1 @@
+import{Fragment as m,jsx as t}from"react/jsx-runtime";import{SaveButton as u}from"react-admin";import{useFormContext as i}from"react-hook-form";const l=e=>{const{resourceConfig:n,...o}=e,{formState:a}=i(),s=n?.saveButtonAlwaysEnabled===!0;return t(m,{children:t(u,{alwaysEnable:s,...o,onClick:r=>{o?.onClick&&o.onClick(r)},disabled:a.isSubmitting})})};var k=l;export{k as default};

package/dist/DashAutoAdminSaveButton.tsx.bkup

@@ -0,0 +1,84 @@
+import { SaveButton, SaveButtonProps } from 'react-admin/src';
+import { useFormContext } from 'react-hook-form';
+import IDashAutoAdminResourceConfig from './interfaces/IDashAutoAdminResourceConfig';
+import { FC } from 'react';
+
+export interface IDashAutoAdminSaveButton extends SaveButtonProps {
+	resourceConfig: IDashAutoAdminResourceConfig;
+	onSubmit?: (data: any) => void;
+	onError?: (error: any) => void;
+}
+const DashAutoAdminSaveButton: FC<IDashAutoAdminSaveButton> = (props) => {
+	const { resourceConfig, onSubmit, onError, ...rest } = props;
+	const { reset, setError } = useFormContext();
+	const alwaysEnabled = resourceConfig?.saveButtonAlwaysEnabled === true ? true : false;
+    const debug = true;
+	return resourceConfig?.resetFormAfterSubmit === true ? (
+		<SaveButton
+			{...rest}
+			type={'button'}
+			mutationOptions={{
+				onSuccess: (data) => {
+					if (debug) console.log('onSuccess called with data:', data);
+					if (onSubmit) {
+						onSubmit(data);
+					}
+					reset();
+				},
+				onError: (error, _variables, _context) => {
+					if (debug) console.log('onError called with error:', error);
+					//if(!!Object.keys(error).length) {
+					if (Object.keys(error).length) {
+						Object.keys(error).forEach((key: any) => {
+							setError(key, { message: error[key][0] }, { shouldFocus: false });
+						});
+					}
+
+					if (onError) {
+						onError(error);
+					}
+
+				},
+			}}
+			alwaysEnable={
+				alwaysEnabled
+			}
+		/>
+	) : (
+		<SaveButton
+			{...rest}
+			{...(onSubmit && {
+				mutationOptions: {
+					onSuccess: (data) => {
+						if (debug) console.log('onSuccess called with data:', data);
+						if (onSubmit) {
+							onSubmit(data);
+						}
+					},
+					onError: (error, _variables, _context) => {
+						if (debug) console.log('onError called with error:', error);
+						if (onError) {
+							onError(error);
+						}
+						
+						if (Object.keys(error).length) {
+							Object.keys(error).forEach((key: any) => {
+								setError(key, { message: error[key][0] }, { shouldFocus: false });
+							});
+						}
+
+						if (onError) {
+						
+							onError(error);
+						}
+					},
+				},
+			})}
+			alwaysEnable={
+				alwaysEnabled
+			}
+		/>
+	);
+};
+
+export default DashAutoAdminSaveButton;

package/dist/DashAutoCreate.js

@@ -0,0 +1 @@
+import{Fragment as e,jsx as o,jsxs as l}from"react/jsx-runtime";import s from"./DashAutoTabbedForm";import{Create as B,TopToolbar as v,ListButton as S,Toolbar as E}from"react-admin";import F from"./utils/evalActionPermission";import h from"./common/DashAutoTitle";import R from"./DashAutoAdminSaveButton";const w=({resourceConfig:t,toolbar:n,actions:b,onSubmit:r,onError:p,beforeSubmit:T,isDrawer:u,locale:A})=>{const i=({...m})=>{const a=t.drawer===!0?!1:!!t.toolbarListButton;return!!t?.AutoEditTopToolbarElements||a?l(v,{sx:{mb:2},...m,children:[a&&o(S,{}),t?.AutoEditTopToolbarElements?t.AutoCreateTopToolbarElements(t):o(e,{})]}):null},d=({...m})=>{const a=t.toolbarSaveButton&&t.toolbarSaveButton.component?t.toolbarSaveButton.component:R;return l(E,{...m,children:[F(t,t.toolbarSaveButton)&&o(a,{resourceConfig:t,onSubmit:r,...t.toolbarSaveButton&&t.toolbarSaveButton?.props}),t?.AutoEditBottomToolbarElements?t.AutoCreateBottomToolbarElements(t):o(e,{})]})};return o(B,{component:"div",actions:b||o(i,{}),mutationMode:t.mutationMode,title:o(h,{resourceConfig:t}),children:o(s,{mode:"create",resourceConfig:t,toolbar:n||o(d,{}),onSubmit:r,onError:p,beforeSubmit:T,isDrawer:u,locale:A})})};var K=w;export{K as default};

package/dist/DashAutoDrawer.js

@@ -0,0 +1 @@
+import{Fragment as f,jsx as r,jsxs as $}from"react/jsx-runtime";import{createElement as D}from"react";import{useCallback as B,useEffect as g,useState as x}from"react";import _ from"./DashAutoCreate";import R from"./DashAutoEdit";import{Toolbar as k,Button as L}from"react-admin";import{match as G}from"node-match-path";import{useLocation as O}from"react-router";import T from"./DashAutoShow";import{Drawer as H,SwipeableDrawer as z}from"@mui/material";import C from"./DashAutoAdminSaveButton";const W=({resourceConfig:e,recordId:F,type:l="normal",placement:a="right",width:s="100%",height:n,beforeSubmit:v,onSubmit:M,onError:y,children:K,...h})=>{const i=O(),u=l==="swipeable"?z:H,[p,w]=x(!!i.state?.hash),o=()=>{w(!1)},c=()=>{w(!0)},A=b=>{e.closeDrawerAfterSave&&o(),M&&M(b)},[E,I]=x(i.state?.hash?i.state.hash:window.location.hash),S=B(b=>{I(b.data),w(!0)},[]);g(()=>(window.addEventListener("virtualhash",S),()=>{window.removeEventListener("virtualhash",S)}),[]);let t="edit";G(`/${e.model}/inline/create`,String(E).substring(1)).matches&&(t="create");const m=G(`/${e.model}/inline/:id/:mode`,String(E).substring(1));t=m.matches&&m.params?.mode?m.params.mode:t;const d=["edit","show"].includes(t)?m.params?.id:null;g(()=>(i.state?.hash&&history.replaceState(null,"",i.state.hash),()=>{history.replaceState(null,"",null)}),[]);const P=()=>e?.bottomToolbar===!1?r(f,{}):$(k,{children:[t==="edit"&&e?.saveButton!==!1&&r(C,{alwaysEnable:e?.saveButtonAlwaysEnabled===!0,label:"Guardar",resourceConfig:e}),t==="create"&&e?.saveButton!==!1&&r(C,{resourceConfig:e,alwaysEnable:e?.saveButtonAlwaysEnabled===!0,label:"Crear"}),r(L,{onClick:()=>o(),children:r(f,{children:"Cerrar"})})]});return t!=="list"&&t==="create"?D(u,{anchor:a,onClose:()=>o(),...l==="swipeable"&&{onOpen:c},open:p,key:a,sx:{width:{xs:"90%",sm:"90%",md:"50%",lg:"40%"},"& .MuiDrawer-paper":{width:{xs:"90%",sm:"90%",md:"50%",lg:"40%"}}},slotProps:{},size:"large",...h},r("div",{style:{...n&&{height:n},...s&&{width:s}},children:r(_,{toolbar:r(P,{}),isDrawer:!0,resourceConfig:{...e,formGroupMode:e.formGroupMode==="tabs"||!e.formGroupMode?"groups":e.formGroupMode},beforeSubmit:v,onSubmit:A,onError:y,onCancel:()=>o()})})):t!=="list"&&t==="edit"&&d?D(u,{anchor:a,onClose:()=>o(),...l==="swipeable"&&{onOpen:c},open:p,key:a,sx:{width:{xs:"90%",sm:"90%",md:"50%",lg:"40%"},"& .MuiDrawer-paper":{width:{xs:"90%",sm:"90%",md:"50%",lg:"40%"}}},slotProps:{},size:"large",...h},r("div",{style:{...n&&{height:n},...s&&{width:s}},children:r(R,{isDrawer:!0,toolbar:r(P,{}),id:d,resourceConfig:{...e,formGroupMode:e.formGroupMode==="tabs"||!e.formGroupMode?"groups":e.formGroupMode},beforeSubmit:v,onSubmit:A,onError:y,onCancel:()=>o()})})):t==="show"&&d?D(u,{anchor:a,onClose:()=>o(),...l==="swipeable"&&{onOpen:c},open:p,key:a,sx:{width:{xs:"90%",sm:"90%",md:"50%",lg:"40%"},"& .MuiDrawer-paper":{width:{xs:"90%",sm:"90%",md:"50%",lg:"40%"}}},slotProps:{},size:"large",...h},r("div",{style:{...n&&{height:n},...s&&{width:s}},children:r(T,{isDrawer:!0,id:d,resourceConfig:{...e,formGroupMode:e.formGroupMode==="tabs"||!e.formGroupMode?"groups":e.formGroupMode}})})):r(f,{})};var ie=W;export{ie as default};

package/dist/DashAutoEdit.js

@@ -0,0 +1 @@
+import{Fragment as M,jsx as t,jsxs as i}from"react/jsx-runtime";import B from"./common/DashAutoTitle";import s from"./DashAutoTabbedForm";import{TopToolbar as c,Edit as D,Toolbar as F}from"react-admin";import{ToolbarCreateButton as R,ToolbarDeleteButton as f,ToolbarEditButton as w,ToolbarExportButton as h,ToolbarListButton as v}from"./toolbar/buttons/ToolbarButtons";import{BottomToolbarDeleteButton as I,BottomToolbarSaveButton as S}from"./toolbar/buttons/BottomToolbarButtons";const x=({id:l,resourceConfig:o,onSubmit:a,onError:e,onCancel:b,beforeSubmit:d,toolbar:T,actions:n,isDrawer:u=!1,locale:p})=>{const E=({...m})=>{const r=!!o.drawer;return i(c,{sx:{mb:2},...m,children:[o?.AutoEditTopToolbarElements?o.AutoEditTopToolbarElements(o):null,!r&&t(v,{mode:"edit",resourceConfig:o}),!r&&t(w,{mode:"edit",resourceConfig:o}),!r&&t(R,{mode:"edit",resourceConfig:o}),!r&&t(f,{mode:"edit",resourceConfig:o}),!r&&t(h,{mode:"edit",resourceConfig:o})]})},A=({...m})=>i(F,{...m,children:[t(S,{mode:"edit",resourceConfig:o,onError:e,onSubmit:a}),t(I,{mode:"edit",resourceConfig:o,onError:e,onSubmit:a}),o?.AutoEditBottomToolbarElements?o.AutoEditBottomToolbarElements(o):t(M,{})]});return t(D,{component:"div",...l&&{id:l},actions:n||t(E,{}),mutationMode:o.mutationMode,title:t(B,{resourceConfig:o}),...o?.editProps||{},children:t(s,{isDrawer:u,mode:"edit",resourceConfig:o,toolbar:T||t(A,{}),onSubmit:a,onError:e,...d&&{beforeSubmit:d},onCancel:b,locale:p})})};var V=x;export{V as default};

package/dist/DashAutoFiltersGenerator.js

@@ -0,0 +1 @@
+import{jsx as s}from"react/jsx-runtime";import{TextInput as h,ReferenceInput as R,SelectInput as S,DateInput as F}from"react-admin";import{SelectArrayInput as G}from"react-admin";const w=(i,r)=>{const{label:e,source:n,reference:t,optionText:p,alwaysOn:a=!0,referenceComponent:l,fieldProps:o={},slotProps:m={},inputOptions:f={},multiple:D=!1,date:g=!1}=i;if(console.log("\u{1F527} DashAutoFiltersGenerator DEBUG - generateFilter called:",{idx:r,label:e,source:n,reference:t,hasReferenceComponent:!!l,fieldProps:o,timestamp:new Date().toISOString()}),l&&!t){console.log("\u{1F527} DashAutoFiltersGenerator DEBUG - Rendering with reference component (no reference):",{idx:r,source:n,label:e,referenceComponent:l.name,fieldProps:o,timestamp:new Date().toISOString()});const I=l,u={source:n,label:e,alwaysOn:a,...o};return console.log("\u{1F527} DashAutoFiltersGenerator DEBUG - Final props for reference component (DETAILED):",{idx:r,source:n,label:e,finalProps:u,fieldPropsResource:o?.resource,timestamp:new Date().toISOString()}),s(I,{...u},r)}let c=l||S;return t&&typeof t=="object"?(D&&!l&&(c=G),console.log("\u{1F517} DashAutoFiltersGenerator DEBUG - Rendering with object reference:",{idx:r,source:n,label:e,reference:t,ReferenceComponent:c.name,timestamp:new Date().toISOString()}),s(c,{choices:t,label:e,source:n,alwaysOn:a,...o},r)):t?(console.log("\u{1F517} DashAutoFiltersGenerator DEBUG - Rendering ReferenceInput:",{idx:r,source:n,label:e,reference:t,ReferenceComponent:c.name,inputOptions:f,fieldProps:o,timestamp:new Date().toISOString()}),s(R,{label:e,source:n,reference:t,allowEmpty:!0,alwaysOn:a,...f,children:s(c,{label:e,optionText:p,...o})},r)):g?(console.log("\u{1F4C5} DashAutoFiltersGenerator DEBUG - Rendering DateInput:",{idx:r,source:n,label:e,fieldProps:o,timestamp:new Date().toISOString()}),s(F,{placeholder:"Date",label:e,source:n,alwaysOn:a,...o},r)):(console.log("\u{1F4DD} DashAutoFiltersGenerator DEBUG - Rendering TextInput (default):",{idx:r,source:n,label:e,fieldProps:o,slotProps:m,timestamp:new Date().toISOString()}),s(h,{label:e,source:n,alwaysOn:a,...o,...m?{slotProps:m}:{}},r))},A=(i,r)=>{const e=i?.referenceFilters||[],n=[];return console.log("\u{1F3ED} DashAutoFiltersGenerator DEBUG - dashAutoFiltersGenerator called:",{resourceConfig:i?.model||"unknown",filtersCount:e.length,filters:e.map(t=>({id:t.id,source:t.source,label:t.label,hasReferenceComponent:!!t.referenceComponent,fieldProps:t.fieldProps})),timestamp:new Date().toISOString()}),e&&e.length>0&&e.forEach((t,p)=>{n.push(w(t,p))}),n};var k=A;export{k as default,w as generateFilter};

package/dist/DashAutoFormGroups.js

@@ -0,0 +1 @@
+import{jsx as c,jsxs as b}from"react/jsx-runtime";import{AutoAdminSettings as D}from".";import d from"./utils/groupByTabs";import{default as o}from"./mui/AttributeToInput";import A from"react";import{TranslatedLabel as g}from"./common/components/TranslatedLabel";const $=({schema:m,resourceConfig:f,options:r})=>{const h=D?.defaultTabName||f.label,s=n=>c("legend",{children:c(g,{label:n,fallback:h})}),u=r?.isDrawer===!0;switch(r?.mode){case"create":return d(m).map((n,a)=>{let t=n;u&&(t=t.filter(e=>e?.inDrawer!==!1));const l=t.filter(e=>e?.inCreate!==!1);return l.length?b("fieldset",{children:[l.length>0&&s(t[0].tab||r?.label),l.map((e,i)=>A.cloneElement(o(r.mode,f,e,i,r),{key:`create-${a}-${i}`}))]},`auto-admin-fieldset-${a}`):null});case"edit":return d(m).map((n,a)=>{let t=n;u&&(t=t.filter(e=>e?.inDrawer!==!1));const l=t.filter(e=>e?.inEdit!==!1);return l.length?b("fieldset",{children:[l.length>0&&s(t[0].tab||r?.label),l.map((e,i)=>A.cloneElement(o(r.mode,f,e,i,r),{key:`edit-${a}-${i}`}))]},`auto-admin-fieldset-${a}`):null});case"view":return d(m).map((n,a)=>{let t=n;u&&(t=t.filter(e=>e?.inDrawer!==!1));const l=t.filter(e=>e?.inShow!==!1);return l.length?b("fieldset",{children:[l.length>0&&s(t[0].tab||r?.label),l.map((e,i)=>A.cloneElement(o(r.mode,f,e,i,r),{key:`view-${a}-${i}`}))]},`auto-admin-fieldset-${a}`):null});case"list":return d(m).map((n,a)=>{let t=n;u&&(t=t.filter(e=>e?.inDrawer!==!1));const l=t.filter(e=>e?.inShow!==!1);return l.length?b("fieldset",{children:[l.length>0&&s(t[0].tab||r?.label),l.map((e,i)=>A.cloneElement(o(r.mode,f,e,i,r),{key:`list-${a}-${i}`}))]},`auto-admin-fieldset-${a}`):null})}};var S=$;export{S as default};

package/dist/DashAutoFormLayout.js

@@ -0,0 +1 @@
+import{Fragment as A,jsx as b}from"react/jsx-runtime";import{DashAutoFormTabs as i}from".";import{default as s}from"./mui/AttributeToInput";import p from"./utils/hashedGroupByTabs";const c=({schema:n,resourceConfig:t,options:o})=>{const a=p(n||[]),m=r=>(a[r]?a[r]:[]).filter(e=>e?.inEdit!==!1).map((e,u)=>s("edit",t,e,u,o)),d=r=>(a[r]?a[r]:[]).filter(e=>e?.inCreate!==!1).map((e,u)=>s("create",t,e,u,o));switch(o.mode){case"create":return!t?.createLayout||typeof t.createLayout!="function"?(console.warn("\u26A0\uFE0F createLayout must be present and be a function in the resource definition when using formGroupMode layout, fallback to tabs"),i({schema:n,resourceConfig:t,options:o})):t.createLayout(d);case"edit":return!t?.editLayout||typeof t.editLayout!="function"?(console.warn("\u26A0\uFE0F createLayout must be present and be a function in the resource definition when using formGroupMode layout, fallback to tabs"),i({schema:n,resourceConfig:t,options:o})):t.editLayout(m);default:return b(A,{children:"mode not allowed"})}};var E=c;export{E as default};

package/dist/DashAutoFormLayout.tsx.review

@@ -0,0 +1,113 @@
+import { JSX } from 'react';
+import { DashAutoFormTabs } from '.';
+import IDashAutoAdminAttribute from './interfaces/IDashAutoAdminAttribute';
+import IDashAutoAdminFormOptions from './interfaces/IDashAutoAdminFormOptions';
+import IDashAutoAdminResourceConfig from './interfaces/IDashAutoAdminResourceConfig';
+
+import { default as AttributeToInput } from './mui/AttributeToInput';
+import hashedGroupByTabs from './utils/hashedGroupByTabs';
+
+interface IAutoForm {
+	schema: IDashAutoAdminAttribute[],
+	resourceConfig: IDashAutoAdminResourceConfig,
+	options?: IDashAutoAdminFormOptions,
+}
+
+const DashAutoFormLayout = ({
+    schema,
+    resourceConfig,
+    options
+}: IAutoForm) => {
+	const groupedTabs = hashedGroupByTabs(schema || []);
+
+	const renderEdit = (tab: string): JSX.Element[] => {
+		const groupedAttributesByTab = groupedTabs[tab] ? groupedTabs[tab] : [];
+		return groupedAttributesByTab
+			.filter((attribute) => attribute?.inEdit !== false)
+			.map((attribute, idx) =>
+				AttributeToInput('edit', resourceConfig, attribute, idx, options),
+			);
+	};
+
+	const renderCreate = (tab: string): JSX.Element[] => {
+		const groupedAttributesByTab = groupedTabs[tab] ? groupedTabs[tab] : [];
+		return groupedAttributesByTab
+			.filter((attribute) => attribute?.inCreate !== false)
+			.map((attribute, idx) =>
+				AttributeToInput('create', resourceConfig, attribute, idx, options),
+			);
+	};
+
+	/*
+   const renderShow = (tab: string): JSX.Element[] => {
+    const groupedAttributesByTab = groupedTabs.hasOwnProperty(tab) ? groupedTabs[tab] : [];
+    return groupedAttributesByTab.filter(attribute => attribute?.inShow !== false).map((attribute, idx) => AttributeToInput(attribute, idx, options))
+  }*/
+
+	/*
+   return groupByTabs(schema).map((groupOfAttributes, idx) => (
+        <fieldset key={"fieldset-" + idx}>
+          <legend>{groupOfAttributes[0].tab || (options?.label || 'Datos')}</legend>
+          {groupOfAttributes.filter(attribute => attribute?.inEdit !== false).map((attribute, idx) => AttributeToInput(attribute, idx, options))}
+        </fieldset>
+      ))
+
+  */
+
+	switch (options.mode) {
+		case 'create':
+			if (
+				!resourceConfig?.createLayout ||
+				typeof resourceConfig.createLayout !== 'function'
+			) {
+				console.warn(
+					'⚠️ createLayout must be present and be a function in the resource definition when using formGroupMode layout, fallback to tabs',
+				);
+
+				return DashAutoFormTabs({
+					schema: schema,
+					resourceConfig: resourceConfig,
+					options: options,
+				});
+			}
+
+			return resourceConfig.createLayout(renderCreate);
+
+		case 'edit':
+			if (
+				!resourceConfig?.editLayout ||
+				typeof resourceConfig.editLayout !== 'function'
+			) {
+				console.warn(
+					'⚠️ createLayout must be present and be a function in the resource definition when using formGroupMode layout, fallback to tabs',
+				);
+                
+				return DashAutoFormTabs({
+					schema: schema,
+					resourceConfig: resourceConfig,
+					options: options,
+				});
+			}
+
+			return resourceConfig.editLayout(renderEdit);
+
+			/*case "view":
+    case "list":
+      if (!resource.showLayout || typeof resource.showLayout !== "function") {
+        console.error("showLayout must be present and be a function in the resource definition when using formGroupMode layout, fallback to tabs");
+        return AutoFormTabs({
+          schema: schema,
+          resource: resource,
+          options: { mode: options.mode },
+        })
+      }
+
+      return resource.createLayout(renderShow)
+    */
+
+		default:
+			return <>mode not allowed</>;
+	}
+};
+
+export default DashAutoFormLayout;

package/dist/DashAutoFormMuiTabs.js

@@ -0,0 +1 @@
+import{jsx as o,jsxs as w}from"react/jsx-runtime";import{FormTab as g}from"react-admin";import{Tab as y,Tabs as A,Box as h}from"@mui/material";import p from"./utils/groupByTabs";import f from"./mui/AttributeToInput";import{useDispatch as T}from"react-redux";import{useEffect as D,useState as F}from"react";const x=({schema:i,resourceConfig:d,options:s,isDrawer:b})=>{const m=T(),[n,v]=F(0),c=a=>{const{name:r,value:t,type:e}=a.target;let l;switch(e){case"checkbox":l=a.target.checked;break;case"select":l=t;break;case"text":case"number":case"email":l=t;break;default:l=t;break}console.log("DashAutoFormMuiTabs: dispatch method deprecated")},k=(a,r)=>{v(r)};D(()=>()=>{console.log("DashAutoFormMuiTabs: dispatch method deprecated")},[m]);const u=p(i);return s?.meta?.tabs==="mui"?w(h,{sx:{width:"100%"},children:[o(h,{sx:{borderBottom:1,borderColor:"divider"},children:o(A,{value:n,onChange:k,children:u.map((a,r)=>o(y,{label:a[0].tab||s?.label||""},`tab-${a[0].tab||r}`))})}),u.map((a,r)=>{let t=a.filter(e=>e?.inCreate!==!1);return b&&(t=t.filter(e=>e?.inDrawer!==!1)),o("div",{role:"tabpanel",hidden:n!==r,style:{padding:"20px 0"},children:t.map((e,l)=>o("div",{children:f("create",d,e,l,{...s,handleChange:c})},`input-${l}`))},`panel-${r}`)})]}):p(i).map((a,r)=>{let t=a.filter(e=>e?.inCreate!==!1);return b&&(t=t.filter(e=>e?.inDrawer!==!1)),t.length&&o(g,{value:r,label:a[0].tab||s?.label||"",children:t.map((e,l)=>o("div",{children:f("create",d,e,l,{...s,handleChange:c})},`input-${l}`))},`tab-${a[0].tab||r}`)})},C=({schema:i,resourceConfig:d,options:s,isDrawer:b})=>{const m=T(),[n,v]=F(0),c=a=>{const{name:r,value:t,type:e}=a.target;let l;switch(e){case"checkbox":l=a.target.checked;break;case"select":l=t;break;case"text":case"number":case"email":l=t;break;default:l=t;break}console.log("DashAutoFormMuiTabs: dispatch method deprecated")},k=(a,r)=>{v(r)};D(()=>()=>{console.log("DashAutoFormMuiTabs: dispatch method deprecated")},[m]);const u=p(i);return s?.meta?.tabs==="mui"?w(h,{sx:{width:"100%"},children:[o(h,{sx:{borderBottom:1,borderColor:"divider"},children:o(A,{value:n,onChange:k,children:u.map((a,r)=>o(y,{label:a[0].tab||s?.label||""},`tab-${a[0].tab||r}`))})}),u.map((a,r)=>{let t=a.filter(e=>e?.inEdit!==!1);return b&&(t=t.filter(e=>e?.inDrawer!==!1)),o("div",{role:"tabpanel",hidden:n!==r,style:{padding:"20px 0"},children:t.map((e,l)=>o("div",{children:f("edit",d,e,l,{...s,handleChange:c})},`input-${l}`))},`panel-${r}`)})]}):p(i).map((a,r)=>{let t=a.filter(e=>e?.inEdit!==!1);return b&&(t=t.filter(e=>e?.inDrawer!==!1)),t.length&&o(g,{value:r,label:a[0].tab||s?.label||"",children:t.map((e,l)=>o("div",{children:f("edit",d,e,l,{...s,handleChange:c})},`input-${l}`))},`tab-${a[0].tab||r}`)})},$=({schema:i,resourceConfig:d,options:s,isDrawer:b})=>{const m=T(),[n,v]=F(0),c=a=>{const{name:r,value:t,type:e}=a.target;let l;switch(e){case"checkbox":l=a.target.checked;break;case"select":l=t;break;case"text":case"number":case"email":l=t;break;default:l=t;break}console.log("DashAutoFormMuiTabs: dispatch method deprecated")},k=(a,r)=>{v(r)};D(()=>()=>{console.log("DashAutoFormMuiTabs: dispatch method deprecated")},[m]);const u=p(i);return s?.meta?.tabs==="mui"?w(h,{sx:{width:"100%"},children:[o(h,{sx:{borderBottom:1,borderColor:"divider"},children:o(A,{value:n,onChange:k,children:u.map((a,r)=>o(y,{label:a[0].tab||s?.label||""},`tab-${a[0].tab||r}`))})}),u.map((a,r)=>{let t=a.filter(e=>e?.inShow!==!1);return b&&(t=t.filter(e=>e?.inDrawer!==!1)),o("div",{role:"tabpanel",hidden:n!==r,style:{padding:"20px 0"},children:t.map((e,l)=>o("div",{children:f("view",d,e,l,{...s,handleChange:c})},`input-${l}`))},`panel-${r}`)})]}):p(i).map((a,r)=>{let t=a.filter(e=>e?.inShow!==!1);return b&&(t=t.filter(e=>e?.inDrawer!==!1)),t.length&&o(g,{value:r,label:a[0].tab||s?.label||"",children:t.map((e,l)=>o("div",{children:f("view",d,e,l,{...s,handleChange:c})},`input-${l}`))},`tab-${a[0].tab||r}`)})},B=({schema:i,resourceConfig:d,options:s})=>{const b=s.isDrawer===!0,m=s?.meta||{},n={schema:i,resourceConfig:d,options:s,isDrawer:b};switch(s.mode){case"create":return o(x,{...n});case"edit":return o(C,{...n});case"view":return o($,{...n});default:return null}};var Q=B;export{Q as default};

package/dist/DashAutoFormTabs.js

@@ -0,0 +1 @@
+import{Fragment as c,jsx as l}from"react/jsx-runtime";import{FormTab as d}from"react-admin";import w from"./utils/groupByTabs";import v from"./mui/AttributeToInput";const m=({schema:b,resourceConfig:s,options:i})=>{const f=i.isDrawer===!0;i={...i,handleChange:t=>{const{name:e,value:r,type:a}=t.target;let o;switch(a){case"checkbox":o=t.target.checked;break;case"select":o=r;break;case"text":case"number":case"email":o=r;break;default:o=r;break}}};const n=(t,e)=>e.map((r,a)=>l("div",{children:v(t,s,r,a,i)},`input-${a}`)),h=(t,e)=>{let r=t.filter(a=>{switch(e){case"create":return a?.inCreate!==!1;case"edit":return a?.inEdit!==!1;case"view":return a?.inShow!==!1;default:return!0}});return f&&(r=r.filter(a=>a?.inDrawer!==!1)),r},A=w(b),u=t=>A.map(e=>({original:e,filtered:h(e,t)})).filter(e=>e.filtered.length>0);switch(i.mode){case"create":{const t=u("create");return t.length===1?l(c,{children:n("create",t[0].filtered)}):t.map((e,r)=>l(d,{value:r,label:e.original[0].tab||i?.label||s?.label,children:n("create",e.filtered)},`tab-${e.original[0].tab||r}`))}case"edit":{const t=u("edit");return t.length===1?l(c,{children:n("edit",t[0].filtered)}):t.map((e,r)=>l(d,{value:r,label:e.original[0].tab||i?.label||s?.label,children:n("edit",e.filtered)},`tab-${e.original[0].tab||r}`))}case"view":{const t=u("view");return t.length===1?l(c,{children:n("view",t[0].filtered)}):t.map((e,r)=>l(d,{value:r,label:e.original[0].tab||i?.label||s?.label,children:n("view",e.filtered)},`tab-${e.original[0].tab||r}`))}}};m.whyDidYouRender=!0;var C=m;export{C as default};

package/dist/DashAutoFormTabs.review

@@ -0,0 +1,170 @@
+import { FormTab } from 'react-admin';
+import IDashAutoAdminAttribute from './interfaces/IDashAutoAdminAttribute';
+import IDashAutoAdminFormOptions from './interfaces/IDashAutoAdminFormOptions';
+import groupByTabs from './utils/groupByTabs';
+import AttributeToInput from './mui/AttributeToInput';
+import IDashAutoAdminResourceConfig from './interfaces/IDashAutoAdminResourceConfig';
+
+import { IDASHAppState } from 'dash-admin-state';
+import { CLEAR_FORM_DATA, SET_FORM_DATA } from 'dash-admin-state/src/redux/actions/ActionTypes';
+import { useEffect } from 'react';
+import { useFormContext } from 'react-hook-form';
+
+interface IAutoForm {
+	schema: IDashAutoAdminAttribute[],
+	resourceConfig: IDashAutoAdminResourceConfig,
+	options?: IDashAutoAdminFormOptions,
+}
+
+/** 
+ * The `DashAutoFormTabs` component is responsible for rendering the form tabs in the Dash Auto Admin interface. 
+ * It takes in a `schema` of `IDashAutoAdminAttribute` objects, a `resource` of `IDashAutoAdminResourceConfig`, and optional `options` of `IDashAutoAdminFormOptions`. 
+ * The component handles different form modes ('create', 'edit', 'view') and renders the appropriate form tabs based on the provided schema and options. 
+ * It also features a form data state management using Redux and handles changes to form inputs for Tabbed Forms.
+ */
+
+const DashAutoFormTabs = ({
+    schema,
+    resourceConfig,
+    options
+}: IAutoForm) => {
+
+    const isDrawer = options.isDrawer === true ? true : false;
+   
+
+    const handleChange = (event) => {
+      
+        const { name, value, type } = event.target;
+
+        // Handle different input types
+        let payloadValue;
+        switch (type) {
+            case 'checkbox':
+                // For checkboxes, the value is a boolean
+                payloadValue = event.target.checked; // Use checked for checkbox inputs
+                break;
+            case 'select':
+                // For select inputs, you might need to handle differently if you have multiple selections
+                payloadValue = value; // For single select
+                break;
+            case 'text':
+            case 'number':
+            case 'email':
+                // For text, number, and email inputs
+                payloadValue = value;
+                break;
+            // Add cases for other input types as needed
+            default:
+                payloadValue = value; // Fallback for other input types
+                break;
+        }
+  
+   
+    };
+    
+
+    options = {...options, handleChange};
+
+    switch (options.mode) {
+        case 'create':
+            return groupByTabs(schema).map((groupOfAttributes, idx) => {
+
+                let grouppedAttributes = groupOfAttributes.filter(
+                    (attribute) => attribute?.inCreate !== false,
+                );
+
+                if (isDrawer) {
+                    grouppedAttributes = grouppedAttributes.filter(
+                        (attribute) => attribute?.inDrawer !== false,
+                    );
+                }
+                return (
+                    grouppedAttributes.length && (
+                        <FormTab
+                            key={`tab-${groupOfAttributes[0].tab || idx}`}
+                            value={idx}
+							/*icon={IconResolver(groupOfAttributes[0].tab)}*/ label={
+                                groupOfAttributes[0].tab || options?.label || resourceConfig?.label
+                            }
+                        >
+                            {grouppedAttributes.map((attribute, i) => (
+                                <div key={`input-${i}`}>
+                                    {AttributeToInput('create', resourceConfig, attribute, i, options)}
+                                </div>
+                            ))}
+
+                        </FormTab>
+                    )
+                );
+            });
+
+        case 'edit':
+        
+            return groupByTabs(schema).map((groupOfAttributes, idx) => {
+                let grouppedAttributes = groupOfAttributes.filter(
+                    (attribute) => attribute?.inEdit !== false,
+                );
+                if (isDrawer) {
+                    grouppedAttributes = grouppedAttributes.filter(
+                        (attribute) => attribute?.inDrawer !== false,
+                    );
+                }
+
+                return (
+                    grouppedAttributes.length && (
+                        <FormTab
+                            key={`tab-${groupOfAttributes[0].tab || idx}`}
+                            value={idx}
+							/*icon={IconResolver(groupOfAttributes[0].tab)}*/ label={
+                                groupOfAttributes[0].tab || options?.label || resourceConfig?.label
+                            }
+                        >
+                           
+                            {grouppedAttributes.map((attribute, i) => (
+                                <div key={`input-${i}`}>
+                                    {AttributeToInput('edit', resourceConfig, attribute, i, options)}
+                                </div>
+                            ))}
+
+
+                        </FormTab>
+                    )
+                );
+            });
+
+        case 'view':
+            return groupByTabs(schema).map((groupOfAttributes, idx) => {
+                let grouppedAttributes = groupOfAttributes.filter(
+                    (attribute) => attribute?.inShow !== false,
+                );
+                if (isDrawer) {
+                    grouppedAttributes = grouppedAttributes.filter(
+                        (attribute) => attribute?.inDrawer !== false,
+                    );
+                }
+                //console.log("groupOfAttributes, view",groupOfAttributes);
+                return (
+                    grouppedAttributes.length && (
+                        <FormTab
+                            key={`tab-${groupOfAttributes[0].tab || idx}`}
+                            value={idx}
+							/*key={idx} icon={IconResolver(groupOfAttributes[0].tab)}*/ label={
+                                groupOfAttributes[0].tab || options?.label || resourceConfig?.label
+                            }
+                        >
+                            {grouppedAttributes.map((attribute, i) => (
+                                <div key={`input-${i}`}>
+                                    {AttributeToInput('view', resourceConfig, attribute, i, options)}
+                                </div>
+                            ))}
+                        </FormTab>
+                    )
+                );
+            });
+    }
+};
+
+
+DashAutoFormTabs.whyDidYouRender = true;
+
+export default DashAutoFormTabs;