formanitor 0.0.43 → 0.0.44

package/dist/index.cjs

@@ -12095,6 +12095,75 @@ var DynamicForm = () => {
     })
   ] });
 };
+function PlainSection({
+  title,
+  showHeading,
+  children
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-6 space-y-4", children: [
+    showHeading ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-base font-medium text-foreground", children: title }) : null,
+    children
+  ] });
+}
+function renderSectionChildren(children) {
+  return children.map((child, index) => {
+    if (typeof child === "string") {
+      return /* @__PURE__ */ jsxRuntime.jsx(FieldRenderer, { fieldId: child }, child);
+    }
+    if (child.type === "column_layout") {
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        ColumnLayout,
+        {
+          columns: child.columns,
+          label: child.label,
+          children: child.children.map((fieldId) => /* @__PURE__ */ jsxRuntime.jsx(FieldRenderer, { fieldId }, fieldId))
+        },
+        child.id
+      );
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(React15__namespace.default.Fragment, {}, index);
+  });
+}
+var DynamicFormV2 = ({
+  showTitle = true,
+  sectionMode = "plain",
+  showSectionTitles = true,
+  className
+}) => {
+  const store = useFormStore();
+  const schema = store.getSchema();
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-6", className), children: [
+    showTitle ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4", children: /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-2xl font-bold", children: schema.title }) }) : null,
+    schema.layout.map((node) => {
+      if (node.type === "section") {
+        if (sectionMode === "accordion") {
+          return /* @__PURE__ */ jsxRuntime.jsx(Section, { title: node.title, children: renderSectionChildren(node.children) }, node.id);
+        }
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          PlainSection,
+          {
+            title: node.title,
+            showHeading: showSectionTitles,
+            children: renderSectionChildren(node.children)
+          },
+          node.id
+        );
+      }
+      if (node.type === "column_layout") {
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          ColumnLayout,
+          {
+            columns: node.columns,
+            label: node.label,
+            children: node.children.map((fieldId) => /* @__PURE__ */ jsxRuntime.jsx(FieldRenderer, { fieldId }, fieldId))
+          },
+          node.id
+        );
+      }
+      return null;
+    })
+  ] });
+};
 var SUGGESTION_KEYS = /* @__PURE__ */ new Set(["medications", "investigations", "procedures"]);
 function shallowEqualKeys(a, b) {
   const keysA = Object.keys(a);
@@ -13022,65 +13091,126 @@ var ReadOnlyForm = ({ schema, submission }) => {
 };
 var FormControls = ({
   className,
+  containerStyle,
+  showWorkflowStatus = true,
+  statusClassName,
+  statusStyle,
+  actionsClassName,
+  actionsStyle,
+  actionsFullWidth = false,
+  buttonClassName,
   onSaveDraft,
   onSubmit
 }) => {
-  const { state, availableTransitions, submit, transition, hasPersistence, markSubmitAttempted } = useForm();
+  const {
+    state,
+    availableTransitions,
+    submit,
+    transition,
+    hasPersistence,
+    markSubmitAttempted
+  } = useForm();
   const hasUploadsInFlight = (state.pendingUploads ?? 0) > 0;
   const draftAvailable = onSaveDraft || hasPersistence && submit;
   const submitAvailable = onSubmit || availableTransitions.length > 0 && transition;
   if (!draftAvailable && !submitAvailable) {
     return null;
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex gap-4 items-center justify-between p-4 border-t bg-white ${className || ""}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-bold text-sm text-gray-700", children: [
-        "State: ",
-        state.workflowState
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: `text-sm ${state.isValid ? "text-green-600" : "text-red-600"}`, children: state.isValid ? "Valid" : "Invalid" })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
-      draftAvailable && /* @__PURE__ */ jsxRuntime.jsx(
-        Button,
-        {
-          onClick: onSaveDraft || submit,
-          variant: "outline",
-          size: "sm",
-          disabled: hasUploadsInFlight,
-          children: hasUploadsInFlight ? "Upload in progress\u2026" : "Save Draft"
-        }
+  const useWideActions = !showWorkflowStatus && actionsFullWidth;
+  const buttonCn = cn(
+    buttonClassName,
+    useWideActions && "w-full sm:flex-1 min-w-0"
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex gap-4 border-t bg-white p-4 items-center",
+        showWorkflowStatus ? "justify-between" : useWideActions ? "flex-col sm:flex-row sm:justify-stretch sm:gap-4" : "justify-end",
+        className
       ),
-      submitAvailable && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: availableTransitions.length > 0 ? availableTransitions.map((t) => /* @__PURE__ */ jsxRuntime.jsx(
-        Button,
-        {
-          onClick: () => {
-            markSubmitAttempted();
-            if (onSubmit) {
-              onSubmit(t.to);
-            } else {
-              transition(t.to);
-            }
-          },
-          disabled: !state.isValid || hasUploadsInFlight,
-          size: "sm",
-          children: hasUploadsInFlight ? "Upload in progress\u2026" : availableTransitions.length > 1 ? `Submit to ${t.to}` : "Submit"
-        },
-        t.to
-      )) : onSubmit ? /* @__PURE__ */ jsxRuntime.jsx(
-        Button,
-        {
-          onClick: () => {
-            markSubmitAttempted();
-            onSubmit(state.workflowState || "submit");
-          },
-          disabled: !state.isValid || hasUploadsInFlight,
-          size: "sm",
-          children: hasUploadsInFlight ? "Upload in progress\u2026" : "Submit"
-        }
-      ) : null })
-    ] })
-  ] });
+      style: containerStyle,
+      children: [
+        showWorkflowStatus ? /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: cn("flex items-center gap-4", statusClassName),
+            style: statusStyle,
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-bold text-sm text-gray-700", children: [
+                "State: ",
+                state.workflowState
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "span",
+                {
+                  className: cn(
+                    "text-sm",
+                    state.isValid ? "text-green-600" : "text-red-600"
+                  ),
+                  children: state.isValid ? "Valid" : "Invalid"
+                }
+              )
+            ]
+          }
+        ) : null,
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: cn(
+              "flex gap-2",
+              useWideActions ? "w-full flex-col sm:flex-row sm:flex-1 sm:justify-end sm:max-w-none" : "flex-shrink-0",
+              actionsClassName
+            ),
+            style: actionsStyle,
+            children: [
+              draftAvailable && /* @__PURE__ */ jsxRuntime.jsx(
+                Button,
+                {
+                  onClick: onSaveDraft || submit,
+                  variant: "outline",
+                  size: "sm",
+                  disabled: hasUploadsInFlight,
+                  className: buttonCn,
+                  children: hasUploadsInFlight ? "Upload in progress\u2026" : "Save Draft"
+                }
+              ),
+              submitAvailable && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: availableTransitions.length > 0 ? availableTransitions.map((t) => /* @__PURE__ */ jsxRuntime.jsx(
+                Button,
+                {
+                  onClick: () => {
+                    markSubmitAttempted();
+                    if (onSubmit) {
+                      onSubmit(t.to);
+                    } else {
+                      transition(t.to);
+                    }
+                  },
+                  disabled: !state.isValid || hasUploadsInFlight,
+                  size: "sm",
+                  className: buttonCn,
+                  children: hasUploadsInFlight ? "Upload in progress\u2026" : availableTransitions.length > 1 ? `Submit to ${t.to}` : "Submit"
+                },
+                t.to
+              )) : onSubmit ? /* @__PURE__ */ jsxRuntime.jsx(
+                Button,
+                {
+                  onClick: () => {
+                    markSubmitAttempted();
+                    onSubmit(state.workflowState || "submit");
+                  },
+                  disabled: !state.isValid || hasUploadsInFlight,
+                  size: "sm",
+                  className: buttonCn,
+                  children: hasUploadsInFlight ? "Upload in progress\u2026" : "Submit"
+                }
+              ) : null })
+            ]
+          }
+        )
+      ]
+    }
+  );
 };
 
 // src/utils/createUploadHandler.ts
@@ -13117,6 +13247,7 @@ exports.AddInvestigationField = AddInvestigationField;
 exports.AddMedicationField = AddMedicationField;
 exports.DifferentialDiagnosis = DifferentialDiagnosis;
 exports.DynamicForm = DynamicForm;
+exports.DynamicFormV2 = DynamicFormV2;
 exports.EMAIL_REGEX = EMAIL_REGEX;
 exports.FieldRenderer = FieldRenderer;
 exports.FormControls = FormControls;