sy-form-components 0.2.0 → 0.2.2

package/dist/index.mjs

@@ -3672,7 +3672,12 @@ var CHUNK_UPLOAD_THRESHOLD = 10 * 1024 * 1024;
 var trimTrailingSlash = (value) => String(value || "").replace(/\/$/, "");
 var getDefaultBaseUrl = () => {
   const globalEnv = globalThis.process?.env;
-  return trimTrailingSlash(globalEnv?.FORM_API_BASE_URL || globalEnv?.BASE_API_URL || "");
+  const envBaseUrl = globalEnv?.FORM_API_BASE_URL || globalEnv?.BASE_API_URL;
+  if (envBaseUrl) return trimTrailingSlash(envBaseUrl);
+  const browserGlobal = typeof window !== "undefined" ? window : void 0;
+  const windowBaseUrl = browserGlobal?.FORM_API_BASE_URL || browserGlobal?.BASE_API_URL || browserGlobal?.__FORM_API_BASE_URL__ || browserGlobal?.__LOWCODE_API_BASE_URL__;
+  if (windowBaseUrl) return trimTrailingSlash(windowBaseUrl);
+  return typeof window !== "undefined" ? "/service" : "";
 };
 var appendQuery = (url, params) => {
   if (!params) return url;
@@ -4036,7 +4041,7 @@ function FormProvider({
     });
   }, []);
   const getFieldValue = useCallback((fieldId) => formData[fieldId], [formData]);
-  const getFormData = useCallback(() => ({ ...formData }), [formData]);
+  const getFormData2 = useCallback(() => ({ ...formData }), [formData]);
   const validateFieldById = useCallback(
     async (fieldId) => {
       const field = schema.fields.find((f) => f.fieldId === fieldId);
@@ -4113,7 +4118,7 @@ function FormProvider({
       },
       setFieldValue,
       getFieldValue,
-      getFormData,
+      getFormData: getFormData2,
       validateField: validateFieldById,
       validateAll,
       resetForm,
@@ -4133,7 +4138,7 @@ function FormProvider({
       config.submit,
       setFieldValue,
       getFieldValue,
-      getFormData,
+      getFormData2,
       validateFieldById,
       validateAll,
       resetForm,
@@ -4204,14 +4209,14 @@ function FormActions({
   showReset = true,
   onSubmit
 }) {
-  const { mode, validateAll, getFormData, resetForm, api, config } = useFormContext();
+  const { mode, validateAll, getFormData: getFormData2, resetForm, api, config } = useFormContext();
   const [isSubmitting, setIsSubmitting] = useState13(false);
   const [submitError, setSubmitError] = useState13(null);
   const handleSubmit = useCallback2(async () => {
     setSubmitError(null);
     const valid = await validateAll();
     if (!valid) return;
-    const values = getFormData();
+    const values = getFormData2();
     setIsSubmitting(true);
     try {
       const beforeResult = await config.submit?.beforeSubmit?.(values);
@@ -4242,7 +4247,7 @@ function FormActions({
     } finally {
       setIsSubmitting(false);
     }
-  }, [api, config, getFormData, mode, onSubmit, validateAll]);
+  }, [api, config, getFormData2, mode, onSubmit, validateAll]);
   const handleReset = useCallback2(() => {
     resetForm();
   }, [resetForm]);
@@ -4302,6 +4307,160 @@ function FormContainer({
   ] });
 }
 
+// src/core/constants.ts
+var PROCESS_STATUS_META = {
+  running: { label: "\u5BA1\u6279\u4E2D", tone: "brand" },
+  waiting: { label: "\u7B49\u5F85\u4E2D", tone: "neutral" },
+  exception: { label: "\u6D41\u7A0B\u5F02\u5E38", tone: "danger" },
+  completed: { label: "\u5DF2\u5B8C\u6210", tone: "success" },
+  terminated: { label: "\u5DF2\u62D2\u7EDD", tone: "danger" },
+  withdrawn: { label: "\u5DF2\u64A4\u9500", tone: "neutral" },
+  pending: { label: "\u5F85\u5904\u7406", tone: "brand" },
+  cancelled: { label: "\u5DF2\u53D6\u6D88", tone: "neutral" }
+};
+var TASK_STATUS_META = {
+  pending: { label: "\u5F85\u5904\u7406", tone: "brand" },
+  approved: { label: "\u5DF2\u540C\u610F", tone: "success" },
+  rejected: { label: "\u5DF2\u62D2\u7EDD", tone: "danger" },
+  returned: { label: "\u5DF2\u9000\u56DE", tone: "warning" },
+  suspended: { label: "\u5DF2\u6302\u8D77", tone: "neutral" },
+  cancelled: { label: "\u5DF2\u53D6\u6D88", tone: "neutral" },
+  copied: { label: "\u5DF2\u6284\u9001", tone: "neutral" },
+  waiting: { label: "\u7B49\u5F85\u4E2D", tone: "neutral" },
+  simulated: { label: "\u672A\u5F00\u59CB", tone: "neutral" }
+};
+
+// src/core/processApi.ts
+async function getProcessBasic(request, formInstId) {
+  const response = await request({
+    url: `/workflow/instance/${formInstId}/basic`,
+    method: "get"
+  });
+  return response.data || response.result;
+}
+async function getProcessProgress(request, formInstId) {
+  const response = await request({
+    url: `/workflow/instance/${formInstId}`,
+    method: "get"
+  });
+  return response.data || response.result || [];
+}
+async function checkUserApproval(request, formInstId) {
+  const response = await request({
+    url: `/workflow/instance/${formInstId}/permission`,
+    method: "get"
+  });
+  return response.data || response.result;
+}
+async function handleApproval(request, params) {
+  const response = await request({
+    url: "/workflow/approve",
+    method: "post",
+    data: params
+  });
+  return response.data || response.result;
+}
+async function withdrawProcess(request, params) {
+  const response = await request({
+    url: `/workflow/instance/${params.instanceId}/withdraw`,
+    method: "put",
+    data: { reason: params.reason }
+  });
+  return response.data || response.result;
+}
+async function transferTask(request, params) {
+  const response = await request({
+    url: `/workflow/task/${params.taskId}/transfer`,
+    method: "put",
+    data: { newAssignee: params.newAssignee, reason: params.reason }
+  });
+  return response.data || response.result;
+}
+async function returnTask(request, params) {
+  const response = await request({
+    url: `/workflow/task/${params.taskId}/return`,
+    method: "put",
+    data: { targetNodeId: params.targetNodeId, reason: params.reason }
+  });
+  return response.data || response.result;
+}
+async function resubmitTask(request, params) {
+  const response = await request({
+    url: `/workflow/task/${params.taskId}/resubmit`,
+    method: "post",
+    data: {
+      formUuid: params.formUuid,
+      appType: params.appType,
+      updateFormDataJson: params.updateFormDataJson,
+      comments: params.comments
+    }
+  });
+  return response.data || response.result;
+}
+async function saveTask(request, params) {
+  const response = await request({
+    url: "/workflow/task/save",
+    method: "post",
+    data: params
+  });
+  return response.data || response.result;
+}
+async function getReturnableNodes(request, taskId) {
+  const response = await request({
+    url: `/workflow/task/${taskId}/returnable-nodes`,
+    method: "get"
+  });
+  return response.data || response.result || [];
+}
+async function previewProcess(request, params) {
+  const response = await request({
+    url: "/workflow/preview",
+    method: "post",
+    data: params
+  });
+  return response.data || response.result || [];
+}
+async function getProcessDefinition(request, formUuid) {
+  const response = await request({
+    url: "/workflow/definition/form",
+    method: "get",
+    params: { formUuid }
+  });
+  return response.data || response.result;
+}
+async function getFormData(request, params) {
+  const response = await request({
+    url: "/form/queryFormDataByFormInstanceId",
+    method: "get",
+    params
+  });
+  return response.data || response.result;
+}
+async function deleteFormData(request, params) {
+  const response = await request({
+    url: `/${params.appType}/v1/form/deleteFormData.json`,
+    method: "post",
+    data: params
+  });
+  return response.data || response.result;
+}
+async function getChangeRecords(request, params) {
+  const response = await request({
+    url: "/form/getFormDataChangeRecords",
+    method: "get",
+    params
+  });
+  return response.data || response.result;
+}
+async function getViewPermission(request, params) {
+  const response = await request({
+    url: "/permission/form-group/view-permissions",
+    method: "get",
+    params
+  });
+  return response.data || response.result;
+}
+
 // src/layout/FormSection/index.tsx
 import { useState as useState14 } from "react";
 import { jsx as jsx70, jsxs as jsxs17 } from "react/jsx-runtime";
@@ -4502,7 +4661,7 @@ function FormSummary({
   const { schema, formData } = useFormContext();
   const displayFields = fields ? schema.fields.filter((f) => fields.includes(f.fieldId)) : schema.fields;
   const colClass = columnClasses2[columns];
-  const formatValue = (value) => {
+  const formatValue2 = (value) => {
     if (value === null || value === void 0 || value === "") return "--";
     if (Array.isArray(value)) {
       if (value.length === 0) return "--";
@@ -4518,7 +4677,7 @@ function FormSummary({
       "data-testid": `summary-field-${field.fieldId}`,
       children: [
         /* @__PURE__ */ jsx74("span", { className: labelClassName ?? "text-sm text-gray-500 mb-1", children: field.label }),
-        /* @__PURE__ */ jsx74("span", { className: valueClassName ?? "text-sm text-gray-900", children: formatValue(formData[field.fieldId]) })
+        /* @__PURE__ */ jsx74("span", { className: valueClassName ?? "text-sm text-gray-900", children: formatValue2(formData[field.fieldId]) })
       ]
     },
     field.fieldId
@@ -4575,7 +4734,7 @@ function useFormEngine(schema, config) {
     });
   }, []);
   const getFieldValue = useCallback3((fieldId) => formData[fieldId], [formData]);
-  const getFormData = useCallback3(() => ({ ...formData }), [formData]);
+  const getFormData2 = useCallback3(() => ({ ...formData }), [formData]);
   const validateAll = useCallback3(async () => {
     const fieldRules = {};
     for (const field of schema.fields) {
@@ -4602,7 +4761,7 @@ function useFormEngine(schema, config) {
     formData,
     setFieldValue,
     getFieldValue,
-    getFormData,
+    getFormData: getFormData2,
     validateAll,
     resetForm,
     mode: config.mode,
@@ -4631,7 +4790,7 @@ function useFormData(initialValues = {}) {
     },
     [formData]
   );
-  const getFormData = useCallback4(() => {
+  const getFormData2 = useCallback4(() => {
     return { ...formData };
   }, [formData]);
   const resetForm = useCallback4(() => {
@@ -4642,7 +4801,7 @@ function useFormData(initialValues = {}) {
     formData,
     setFieldValue,
     getFieldValue,
-    getFormData,
+    getFormData: getFormData2,
     resetForm,
     dirtyFields
   };
@@ -4706,60 +4865,2137 @@ function useFormSubmit(config) {
   return { submit, isSubmitting, submitError };
 }
 
+// src/hooks/useFieldPermission.ts
+import { useMemo as useMemo7, useCallback as useCallback6 } from "react";
+function useFieldPermission(options) {
+  const { viewPermissions, processDefinition, currentTask, isApprover, mode } = options;
+  const computeBehaviors = useCallback6(() => {
+    const behaviors = {};
+    if (!currentTask && viewPermissions) {
+      const { fieldPermissions } = viewPermissions;
+      for (const [fieldId, perm] of Object.entries(fieldPermissions)) {
+        if (perm === "FORM_FILED_HIDDEN") {
+          behaviors[fieldId] = "HIDDEN";
+        } else if (perm === "FORM_FILED_VIEW") {
+          behaviors[fieldId] = "READONLY";
+        } else if (perm === "FORM_FILED_EDIT") {
+          behaviors[fieldId] = mode === "edit" ? "NORMAL" : "READONLY";
+        }
+      }
+      return behaviors;
+    }
+    if (currentTask && !isApprover && viewPermissions) {
+      const { fieldPermissions } = viewPermissions;
+      for (const [fieldId, perm] of Object.entries(fieldPermissions)) {
+        if (perm === "FORM_FILED_HIDDEN") {
+          behaviors[fieldId] = "HIDDEN";
+        } else {
+          behaviors[fieldId] = "READONLY";
+        }
+      }
+      return behaviors;
+    }
+    if (currentTask && isApprover && currentTask.nodeType === "originator_return") {
+      if (processDefinition?.flowConfig && processDefinition.startNodeId) {
+        const startConfig = processDefinition.flowConfig[processDefinition.startNodeId];
+        if (startConfig) {
+          for (const [fieldId, behavior] of Object.entries(startConfig)) {
+            behaviors[fieldId] = mode === "edit" ? behavior : "READONLY";
+          }
+          return behaviors;
+        }
+      }
+      if (viewPermissions) {
+        for (const fieldId of Object.keys(viewPermissions.fieldPermissions)) {
+          if (viewPermissions.fieldPermissions[fieldId] === "FORM_FILED_HIDDEN") {
+            behaviors[fieldId] = "HIDDEN";
+          } else {
+            behaviors[fieldId] = mode === "edit" ? "NORMAL" : "READONLY";
+          }
+        }
+      }
+      return behaviors;
+    }
+    if (currentTask && isApprover && processDefinition?.flowConfig) {
+      const nodeConfig = processDefinition.flowConfig[currentTask.nodeId];
+      if (nodeConfig) {
+        for (const [fieldId, behavior] of Object.entries(nodeConfig)) {
+          behaviors[fieldId] = mode === "edit" ? behavior : "READONLY";
+        }
+        return behaviors;
+      }
+    }
+    if (viewPermissions) {
+      const { fieldPermissions } = viewPermissions;
+      for (const [fieldId, perm] of Object.entries(fieldPermissions)) {
+        if (perm === "FORM_FILED_HIDDEN") {
+          behaviors[fieldId] = "HIDDEN";
+        } else if (perm === "FORM_FILED_VIEW") {
+          behaviors[fieldId] = "READONLY";
+        } else if (perm === "FORM_FILED_EDIT") {
+          behaviors[fieldId] = mode === "edit" ? "NORMAL" : "READONLY";
+        }
+      }
+    }
+    return behaviors;
+  }, [viewPermissions, processDefinition, currentTask, isApprover, mode]);
+  const fieldBehaviors = useMemo7(() => computeBehaviors(), [computeBehaviors]);
+  return { fieldBehaviors, computeBehaviors };
+}
+
+// src/hooks/useFormDetail.ts
+import { useState as useState20, useEffect as useEffect27, useCallback as useCallback7, useRef as useRef7 } from "react";
+function buildFieldBehaviors(permissions, mode) {
+  const behaviors = {};
+  if (!permissions) return behaviors;
+  for (const [fieldId, perm] of Object.entries(permissions.fieldPermissions)) {
+    if (perm === "FORM_FILED_HIDDEN") {
+      behaviors[fieldId] = "HIDDEN";
+    } else if (perm === "FORM_FILED_VIEW") {
+      behaviors[fieldId] = "READONLY";
+    } else if (perm === "FORM_FILED_EDIT") {
+      behaviors[fieldId] = mode === "edit" ? "NORMAL" : "READONLY";
+    }
+  }
+  return behaviors;
+}
+function useFormDetail(options) {
+  const { formUuid, appType, formInstanceId, onPermissionDenied } = options;
+  const { api } = useFormContext();
+  const request = api.request;
+  const [loading, setLoading] = useState20(true);
+  const [mode, setMode] = useState20("readonly");
+  const [formData, setFormData] = useState20(null);
+  const [instanceInfo, setInstanceInfo] = useState20(null);
+  const [permissions, setPermissions] = useState20(null);
+  const mountedRef = useRef7(true);
+  useEffect27(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+    };
+  }, []);
+  const loadData = useCallback7(async () => {
+    if (!mountedRef.current) return;
+    setLoading(true);
+    try {
+      const [permResult, formResult] = await Promise.all([
+        getViewPermission(request, { formUuid, appType, formInstanceId }),
+        getFormData(request, { formInstanceId, appType, formUuid })
+      ]);
+      if (!mountedRef.current) return;
+      if (!permResult || !permResult.operations || permResult.operations.length === 0) {
+        onPermissionDenied?.();
+      }
+      setPermissions(permResult);
+      setInstanceInfo(formResult);
+      setFormData(formResult?.data ?? null);
+    } catch (error) {
+      console.error("[useFormDetail] Failed to load data:", error);
+      if (mountedRef.current) {
+        setPermissions(null);
+        setInstanceInfo(null);
+        setFormData(null);
+      }
+    } finally {
+      if (mountedRef.current) {
+        setLoading(false);
+      }
+    }
+  }, [request, formUuid, appType, formInstanceId, onPermissionDenied]);
+  useEffect27(() => {
+    loadData();
+  }, [loadData]);
+  const fieldBehaviors = buildFieldBehaviors(permissions, mode);
+  const canEdit = permissions?.operations?.includes("EDIT") ?? false;
+  const canDelete = permissions?.operations?.includes("DELETE") ?? false;
+  const canViewChangeRecords = permissions?.operations?.includes("VIEW_CHANGE_RECORDS") ?? false;
+  const switchToEdit = useCallback7(() => {
+    setMode("edit");
+    loadData();
+  }, [loadData]);
+  const switchToReadonly = useCallback7(() => {
+    setMode("readonly");
+  }, []);
+  const saveChanges = useCallback7(
+    async (values) => {
+      try {
+        await api.updateFormData({
+          formInstanceId,
+          formUuid,
+          appType,
+          updateFormDataJson: JSON.stringify(values)
+        });
+        if (mountedRef.current) {
+          setFormData(values);
+          setMode("readonly");
+        }
+        return true;
+      } catch (error) {
+        console.error("[useFormDetail] Failed to save changes:", error);
+        return false;
+      }
+    },
+    [api, formInstanceId, formUuid, appType]
+  );
+  const deleteInstance = useCallback7(async () => {
+    try {
+      await deleteFormData(request, { formInstanceId, appType, formUuid });
+      return true;
+    } catch (error) {
+      console.error("[useFormDetail] Failed to delete instance:", error);
+      return false;
+    }
+  }, [request, formInstanceId, appType, formUuid]);
+  return {
+    loading,
+    mode,
+    formData,
+    instanceInfo,
+    permissions,
+    fieldBehaviors,
+    switchToEdit,
+    switchToReadonly,
+    saveChanges,
+    deleteInstance,
+    canEdit,
+    canDelete,
+    canViewChangeRecords
+  };
+}
+
+// src/hooks/useProcessDetail.ts
+import { useState as useState21, useEffect as useEffect28, useCallback as useCallback8, useRef as useRef8 } from "react";
+function useProcessDetail(options) {
+  const { formUuid, appType, formInstanceId } = options;
+  const { api } = useFormContext();
+  const request = api.request;
+  const [loading, setLoading] = useState21(true);
+  const [mode, setMode] = useState21("readonly");
+  const [processInfo, setProcessInfo] = useState21(null);
+  const [progressList, setProgressList] = useState21([]);
+  const [formData, setFormData] = useState21(null);
+  const [instanceInfo, setInstanceInfo] = useState21(null);
+  const [isApprover, setIsApprover] = useState21(false);
+  const [canWithdraw, setCanWithdraw] = useState21(false);
+  const [permissions, setPermissions] = useState21(null);
+  const [processDefinition, setProcessDefinition] = useState21(null);
+  const mountedRef = useRef8(true);
+  useEffect28(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+    };
+  }, []);
+  const currentTask = processInfo?.currentTask ?? null;
+  const processStatus = processInfo?.processStatus ?? null;
+  const isOriginatorReturn = currentTask?.nodeType === "originator_return";
+  const isProcessCompleted = processStatus === "completed" || processStatus === "terminated";
+  const { fieldBehaviors } = useFieldPermission({
+    viewPermissions: permissions ?? void 0,
+    processDefinition: processDefinition ?? void 0,
+    currentTask: currentTask ?? void 0,
+    isApprover,
+    mode
+  });
+  const activeActions = isApprover && currentTask?.actions ? currentTask.actions : [];
+  const loadData = useCallback8(async () => {
+    if (!mountedRef.current) return;
+    setLoading(true);
+    try {
+      const [basicResult, approvalResult, permResult, formResult] = await Promise.all([
+        getProcessBasic(request, formInstanceId),
+        checkUserApproval(request, formInstanceId),
+        getViewPermission(request, { formUuid, appType, formInstanceId }),
+        getFormData(request, { formInstanceId, appType, formUuid })
+      ]);
+      if (!mountedRef.current) return;
+      setProcessInfo(basicResult);
+      setIsApprover(approvalResult?.isApprover ?? false);
+      setCanWithdraw(approvalResult?.canUndo ?? false);
+      setPermissions(permResult);
+      setInstanceInfo(formResult);
+      setFormData(formResult?.data ?? null);
+      if (permResult?.operations?.includes("VIEW_PROCESS") || permResult?.operations?.length > 0) {
+        try {
+          const progress = await getProcessProgress(request, formInstanceId);
+          if (mountedRef.current) {
+            setProgressList(progress);
+          }
+        } catch (error) {
+          console.error("[useProcessDetail] Failed to load progress:", error);
+        }
+      }
+      const task = basicResult?.currentTask;
+      if (approvalResult?.isApprover && task && (task.nodeType === "originator_return" || task.nodeType === "approval")) {
+        try {
+          const definition = await getProcessDefinition(request, formUuid);
+          if (mountedRef.current) {
+            setProcessDefinition(definition);
+          }
+        } catch (error) {
+          console.error("[useProcessDetail] Failed to load process definition:", error);
+        }
+      }
+    } catch (error) {
+      console.error("[useProcessDetail] Failed to load data:", error);
+      if (mountedRef.current) {
+        setProcessInfo(null);
+        setFormData(null);
+        setInstanceInfo(null);
+      }
+    } finally {
+      if (mountedRef.current) {
+        setLoading(false);
+      }
+    }
+  }, [request, formUuid, appType, formInstanceId]);
+  useEffect28(() => {
+    loadData();
+  }, [loadData]);
+  const switchToEdit = useCallback8(() => {
+    setMode("edit");
+  }, []);
+  const switchToReadonly = useCallback8(() => {
+    setMode("readonly");
+  }, []);
+  const refreshProgress = useCallback8(async () => {
+    try {
+      const [progress, basicResult] = await Promise.all([
+        getProcessProgress(request, formInstanceId),
+        getProcessBasic(request, formInstanceId)
+      ]);
+      if (mountedRef.current) {
+        setProgressList(progress);
+        setProcessInfo(basicResult);
+      }
+    } catch (error) {
+      console.error("[useProcessDetail] Failed to refresh progress:", error);
+    }
+  }, [request, formInstanceId]);
+  return {
+    loading,
+    processInfo,
+    processStatus,
+    currentTask,
+    progressList,
+    formData,
+    instanceInfo,
+    isApprover,
+    activeActions,
+    fieldBehaviors,
+    mode,
+    isOriginatorReturn,
+    isProcessCompleted,
+    canWithdraw,
+    switchToEdit,
+    switchToReadonly,
+    refreshProgress
+  };
+}
+
+// src/hooks/useApprovalActions.ts
+import { useState as useState22, useCallback as useCallback9, useRef as useRef9, useEffect as useEffect29 } from "react";
+function useApprovalActions(options) {
+  const { formInstanceId, formUuid, appType, currentTaskId, onActionComplete, getFormValues } = options;
+  const { api } = useFormContext();
+  const request = api.request;
+  const [isLoading, setIsLoading] = useState22(false);
+  const [currentAction, setCurrentAction] = useState22(null);
+  const [returnableNodes, setReturnableNodes] = useState22([]);
+  const mountedRef = useRef9(true);
+  useEffect29(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+    };
+  }, []);
+  const resetLoading = useCallback9(() => {
+    if (mountedRef.current) {
+      setIsLoading(false);
+      setCurrentAction(null);
+    }
+  }, []);
+  const approve = useCallback9(
+    async (comments) => {
+      setIsLoading(true);
+      setCurrentAction("approve");
+      try {
+        const formValues = getFormValues?.();
+        await handleApproval(request, {
+          instanceId: formInstanceId,
+          action: "approved",
+          comments,
+          appType,
+          formUuid,
+          updateFormDataJson: formValues ? JSON.stringify(formValues) : void 0
+        });
+        resetLoading();
+        onActionComplete?.("approve");
+        return true;
+      } catch (error) {
+        console.error("[useApprovalActions] approve failed:", error);
+        resetLoading();
+        return false;
+      }
+    },
+    [request, formInstanceId, appType, formUuid, getFormValues, onActionComplete, resetLoading]
+  );
+  const reject = useCallback9(
+    async (comments) => {
+      setIsLoading(true);
+      setCurrentAction("reject");
+      try {
+        const formValues = getFormValues?.();
+        await handleApproval(request, {
+          instanceId: formInstanceId,
+          action: "rejected",
+          comments,
+          appType,
+          formUuid,
+          updateFormDataJson: formValues ? JSON.stringify(formValues) : void 0
+        });
+        resetLoading();
+        onActionComplete?.("reject");
+        return true;
+      } catch (error) {
+        console.error("[useApprovalActions] reject failed:", error);
+        resetLoading();
+        return false;
+      }
+    },
+    [request, formInstanceId, appType, formUuid, getFormValues, onActionComplete, resetLoading]
+  );
+  const transfer = useCallback9(
+    async (userId, reason) => {
+      if (!currentTaskId) {
+        console.error("[useApprovalActions] transfer failed: no currentTaskId");
+        return false;
+      }
+      setIsLoading(true);
+      setCurrentAction("transfer");
+      try {
+        await transferTask(request, {
+          taskId: currentTaskId,
+          newAssignee: userId,
+          reason
+        });
+        resetLoading();
+        onActionComplete?.("transfer");
+        return true;
+      } catch (error) {
+        console.error("[useApprovalActions] transfer failed:", error);
+        resetLoading();
+        return false;
+      }
+    },
+    [request, currentTaskId, onActionComplete, resetLoading]
+  );
+  const returnTo = useCallback9(
+    async (nodeId, reason) => {
+      if (!currentTaskId) {
+        console.error("[useApprovalActions] returnTo failed: no currentTaskId");
+        return false;
+      }
+      setIsLoading(true);
+      setCurrentAction("return");
+      try {
+        await returnTask(request, {
+          taskId: currentTaskId,
+          targetNodeId: nodeId,
+          reason
+        });
+        resetLoading();
+        onActionComplete?.("return");
+        return true;
+      } catch (error) {
+        console.error("[useApprovalActions] returnTo failed:", error);
+        resetLoading();
+        return false;
+      }
+    },
+    [request, currentTaskId, onActionComplete, resetLoading]
+  );
+  const withdraw = useCallback9(
+    async (reason) => {
+      setIsLoading(true);
+      setCurrentAction("withdraw");
+      try {
+        await withdrawProcess(request, {
+          instanceId: formInstanceId,
+          reason
+        });
+        resetLoading();
+        onActionComplete?.("withdraw");
+        return true;
+      } catch (error) {
+        console.error("[useApprovalActions] withdraw failed:", error);
+        resetLoading();
+        return false;
+      }
+    },
+    [request, formInstanceId, onActionComplete, resetLoading]
+  );
+  const save = useCallback9(async () => {
+    setIsLoading(true);
+    setCurrentAction("save");
+    try {
+      const formValues = getFormValues?.() ?? {};
+      await saveTask(request, {
+        instanceId: formInstanceId,
+        formUuid,
+        appType,
+        updateFormDataJson: JSON.stringify(formValues)
+      });
+      resetLoading();
+      onActionComplete?.("save");
+      return true;
+    } catch (error) {
+      console.error("[useApprovalActions] save failed:", error);
+      resetLoading();
+      return false;
+    }
+  }, [request, formInstanceId, formUuid, appType, getFormValues, onActionComplete, resetLoading]);
+  const resubmit = useCallback9(
+    async (comments) => {
+      if (!currentTaskId) {
+        console.error("[useApprovalActions] resubmit failed: no currentTaskId");
+        return false;
+      }
+      setIsLoading(true);
+      setCurrentAction("resubmit");
+      try {
+        const formValues = getFormValues?.() ?? {};
+        await resubmitTask(request, {
+          taskId: currentTaskId,
+          formUuid,
+          appType,
+          updateFormDataJson: JSON.stringify(formValues),
+          comments
+        });
+        resetLoading();
+        onActionComplete?.("resubmit");
+        return true;
+      } catch (error) {
+        console.error("[useApprovalActions] resubmit failed:", error);
+        resetLoading();
+        return false;
+      }
+    },
+    [request, currentTaskId, formUuid, appType, getFormValues, onActionComplete, resetLoading]
+  );
+  const loadReturnableNodes = useCallback9(async () => {
+    if (!currentTaskId) return;
+    try {
+      const nodes = await getReturnableNodes(request, currentTaskId);
+      if (mountedRef.current) {
+        setReturnableNodes(nodes);
+      }
+    } catch (error) {
+      console.error("[useApprovalActions] loadReturnableNodes failed:", error);
+    }
+  }, [request, currentTaskId]);
+  return {
+    approve,
+    reject,
+    transfer,
+    returnTo,
+    withdraw,
+    save,
+    resubmit,
+    isLoading,
+    currentAction,
+    returnableNodes,
+    loadReturnableNodes
+  };
+}
+
+// src/hooks/useChangeRecords.ts
+import { useState as useState23, useEffect as useEffect30, useCallback as useCallback10, useRef as useRef10 } from "react";
+function useChangeRecords(options) {
+  const { formUuid, appType, formInstanceId, pageSize = 20, autoLoad = true } = options;
+  const { api } = useFormContext();
+  const request = api.request;
+  const [records, setRecords] = useState23([]);
+  const [loading, setLoading] = useState23(false);
+  const [total, setTotal] = useState23(0);
+  const [page, setPage] = useState23(1);
+  const mountedRef = useRef10(true);
+  useEffect30(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+    };
+  }, []);
+  const fetchRecords = useCallback10(
+    async (pageNum, append) => {
+      if (!mountedRef.current) return;
+      setLoading(true);
+      try {
+        const result = await getChangeRecords(request, {
+          formUuid,
+          appType,
+          formInstanceId,
+          page: pageNum,
+          pageSize
+        });
+        if (!mountedRef.current) return;
+        if (append) {
+          setRecords((prev) => [...prev, ...result.records]);
+        } else {
+          setRecords(result.records);
+        }
+        setTotal(result.total);
+        setPage(pageNum);
+      } catch (error) {
+        console.error("[useChangeRecords] Failed to load change records:", error);
+      } finally {
+        if (mountedRef.current) {
+          setLoading(false);
+        }
+      }
+    },
+    [request, formUuid, appType, formInstanceId, pageSize]
+  );
+  useEffect30(() => {
+    if (autoLoad) {
+      fetchRecords(1, false);
+    }
+  }, [autoLoad, fetchRecords]);
+  const hasMore = records.length < total;
+  const loadMore = useCallback10(async () => {
+    if (!hasMore || loading) return;
+    await fetchRecords(page + 1, true);
+  }, [hasMore, loading, page, fetchRecords]);
+  const refresh = useCallback10(async () => {
+    setRecords([]);
+    setPage(1);
+    setTotal(0);
+    await fetchRecords(1, false);
+  }, [fetchRecords]);
+  return {
+    records,
+    loading,
+    total,
+    page,
+    loadMore,
+    refresh,
+    hasMore
+  };
+}
+
+// src/hooks/useFormNavigation.ts
+import { useState as useState24, useCallback as useCallback11, useRef as useRef11, useEffect as useEffect31 } from "react";
+var normalizeBasePath = (basePath) => {
+  const normalized = String(basePath || "").replace(/^\/+|\/+$/g, "");
+  return normalized ? `/${normalized}` : "";
+};
+var inferBasePath = (appType) => {
+  if (typeof window === "undefined") return "";
+  const pathname = window.location?.pathname || "";
+  const marker = `/${appType}/`;
+  const markerIndex = pathname.indexOf(marker);
+  if (markerIndex <= 0) return "";
+  return pathname.slice(0, markerIndex);
+};
+var buildDetailUrl = (appType, formUuid, formInstId, detailType, basePath) => {
+  const prefix = normalizeBasePath(basePath ?? inferBasePath(appType));
+  return `${prefix}/${appType}/${detailType}/${formUuid}?formInstId=${encodeURIComponent(formInstId)}`;
+};
+function useFormNavigation(options) {
+  const {
+    appType,
+    formUuid,
+    formType = "form",
+    mode = "redirect",
+    redirectDelay = 3e3,
+    basePath,
+    onStay
+  } = options;
+  const [isRedirecting, setIsRedirecting] = useState24(false);
+  const [countdown, setCountdown] = useState24(0);
+  const timerRef = useRef11(null);
+  const redirectTargetRef = useRef11(null);
+  const mountedRef = useRef11(true);
+  useEffect31(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+      if (timerRef.current) {
+        clearInterval(timerRef.current);
+        timerRef.current = null;
+      }
+    };
+  }, []);
+  const navigateToDetail = useCallback11(
+    (formInstId) => {
+      window.location.href = buildDetailUrl(appType, formUuid, formInstId, "formDetail", basePath);
+    },
+    [appType, basePath, formUuid]
+  );
+  const navigateToProcessDetail = useCallback11(
+    (formInstId) => {
+      window.location.href = buildDetailUrl(
+        appType,
+        formUuid,
+        formInstId,
+        "processDetail",
+        basePath
+      );
+    },
+    [appType, basePath, formUuid]
+  );
+  const startRedirectCountdown = useCallback11(
+    (targetUrl) => {
+      const totalSeconds = Math.ceil(redirectDelay / 1e3);
+      setIsRedirecting(true);
+      setCountdown(totalSeconds);
+      redirectTargetRef.current = targetUrl;
+      timerRef.current = setInterval(() => {
+        if (!mountedRef.current) {
+          if (timerRef.current) {
+            clearInterval(timerRef.current);
+            timerRef.current = null;
+          }
+          return;
+        }
+        setCountdown((prev) => {
+          const next = prev - 1;
+          if (next <= 0) {
+            if (timerRef.current) {
+              clearInterval(timerRef.current);
+              timerRef.current = null;
+            }
+            setIsRedirecting(false);
+            if (redirectTargetRef.current) {
+              window.location.href = redirectTargetRef.current;
+            }
+            return 0;
+          }
+          return next;
+        });
+      }, 1e3);
+    },
+    [redirectDelay]
+  );
+  const cancelRedirect = useCallback11(() => {
+    if (timerRef.current) {
+      clearInterval(timerRef.current);
+      timerRef.current = null;
+    }
+    setIsRedirecting(false);
+    setCountdown(0);
+    redirectTargetRef.current = null;
+  }, []);
+  const handlePostSubmit = useCallback11(
+    (formInstId) => {
+      if (mode === "stay") {
+        onStay?.(formInstId);
+        return;
+      }
+      if (mode === "callback") {
+        onStay?.(formInstId);
+        return;
+      }
+      const targetUrl = buildDetailUrl(
+        appType,
+        formUuid,
+        formInstId,
+        formType === "process" ? "processDetail" : "formDetail",
+        basePath
+      );
+      startRedirectCountdown(targetUrl);
+    },
+    [mode, formType, appType, formUuid, basePath, onStay, startRedirectCountdown]
+  );
+  return {
+    navigateToDetail,
+    navigateToProcessDetail,
+    handlePostSubmit,
+    isRedirecting,
+    countdown,
+    cancelRedirect
+  };
+}
+
+// src/hooks/useDraftStorage.ts
+import { useState as useState25, useCallback as useCallback12, useEffect as useEffect32 } from "react";
+function getDraftKey(appType, formUuid) {
+  return `${appType}__${formUuid}__draft`;
+}
+function readDraft(key) {
+  try {
+    const raw = localStorage.getItem(key);
+    if (!raw) return null;
+    const parsed = JSON.parse(raw);
+    if (parsed && typeof parsed.data === "object" && typeof parsed.ts === "number") {
+      return parsed;
+    }
+    return null;
+  } catch {
+    return null;
+  }
+}
+function useDraftStorage(options) {
+  const { appType, formUuid, autoRestore = false } = options;
+  const key = getDraftKey(appType, formUuid);
+  const [hasDraft, setHasDraft] = useState25(false);
+  const [draftData, setDraftData] = useState25(null);
+  const [draftTimestamp, setDraftTimestamp] = useState25(null);
+  useEffect32(() => {
+    const stored = readDraft(key);
+    if (stored) {
+      setHasDraft(true);
+      setDraftTimestamp(stored.ts);
+      if (autoRestore) {
+        setDraftData(stored.data);
+      }
+    } else {
+      setHasDraft(false);
+      setDraftData(null);
+      setDraftTimestamp(null);
+    }
+  }, [key, autoRestore]);
+  const saveDraft = useCallback12(
+    (data) => {
+      const payload = { data, ts: Date.now() };
+      try {
+        localStorage.setItem(key, JSON.stringify(payload));
+        setHasDraft(true);
+        setDraftData(data);
+        setDraftTimestamp(payload.ts);
+      } catch (error) {
+        console.error("[useDraftStorage] Failed to save draft:", error);
+      }
+    },
+    [key]
+  );
+  const restoreDraft = useCallback12(() => {
+    const stored = readDraft(key);
+    if (stored) {
+      setDraftData(stored.data);
+      return stored.data;
+    }
+    return null;
+  }, [key]);
+  const clearDraft = useCallback12(() => {
+    try {
+      localStorage.removeItem(key);
+    } catch (error) {
+      console.error("[useDraftStorage] Failed to clear draft:", error);
+    }
+    setHasDraft(false);
+    setDraftData(null);
+    setDraftTimestamp(null);
+  }, [key]);
+  return {
+    hasDraft,
+    draftData,
+    draftTimestamp,
+    saveDraft,
+    restoreDraft,
+    clearDraft
+  };
+}
+
 // src/utils/defineFormSchema.ts
 function defineFormSchema(schema) {
   return schema;
 }
+
+// src/modules/FormSummaryCard.tsx
+import { Fragment, jsx as jsx75, jsxs as jsxs21 } from "react/jsx-runtime";
+var toneClasses = {
+  brand: "bg-blue-50 text-blue-600",
+  success: "bg-green-50 text-green-600",
+  danger: "bg-red-50 text-red-600",
+  neutral: "bg-gray-100 text-gray-500",
+  warning: "bg-amber-50 text-amber-600"
+};
+var FormSummaryCard = ({
+  title,
+  formInstanceId,
+  creator,
+  createdAt,
+  status,
+  className = "",
+  children
+}) => {
+  const shortId = formInstanceId ? formInstanceId.slice(0, 8) : null;
+  const renderAvatar = () => {
+    if (!creator) return null;
+    if (creator.avatar) {
+      return /* @__PURE__ */ jsx75(
+        "img",
+        {
+          src: creator.avatar,
+          alt: creator.name,
+          className: "w-7 h-7 rounded-full object-cover"
+        }
+      );
+    }
+    const initial = creator.name.charAt(0);
+    return /* @__PURE__ */ jsx75("span", { className: "w-7 h-7 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center text-xs font-medium", children: initial });
+  };
+  return /* @__PURE__ */ jsxs21("div", { className: `bg-white rounded-xl shadow-sm border border-gray-100 p-6 ${className}`, children: [
+    /* @__PURE__ */ jsxs21("div", { className: "flex items-start justify-between", children: [
+      /* @__PURE__ */ jsxs21("div", { className: "min-w-0 flex-1", children: [
+        title && /* @__PURE__ */ jsx75("h2", { className: "text-xl font-semibold text-gray-900 truncate", children: title }),
+        shortId && /* @__PURE__ */ jsxs21("span", { className: "text-xs text-gray-400 mt-0.5 inline-block", children: [
+          "#",
+          shortId
+        ] })
+      ] }),
+      status && /* @__PURE__ */ jsx75(
+        "span",
+        {
+          className: `px-2.5 py-0.5 rounded-full text-xs font-medium whitespace-nowrap ${toneClasses[status.tone] || toneClasses.neutral}`,
+          children: status.label
+        }
+      )
+    ] }),
+    creator && /* @__PURE__ */ jsxs21("div", { className: "flex items-center gap-2 mt-4 text-sm text-gray-600", children: [
+      renderAvatar(),
+      /* @__PURE__ */ jsx75("span", { className: "font-medium", children: creator.name }),
+      creator.department && /* @__PURE__ */ jsxs21(Fragment, { children: [
+        /* @__PURE__ */ jsx75("span", { className: "text-gray-300", children: "\xB7" }),
+        /* @__PURE__ */ jsx75("span", { children: creator.department })
+      ] }),
+      createdAt && /* @__PURE__ */ jsxs21(Fragment, { children: [
+        /* @__PURE__ */ jsx75("span", { className: "text-gray-300", children: "\xB7" }),
+        /* @__PURE__ */ jsx75("span", { className: "text-gray-400", children: createdAt })
+      ] })
+    ] }),
+    children && /* @__PURE__ */ jsx75("div", { className: "mt-4", children })
+  ] });
+};
+
+// src/modules/ChangeRecords.tsx
+import { useState as useState26 } from "react";
+import { Skeleton } from "antd";
+import { DownOutlined, UpOutlined } from "@ant-design/icons";
+import { jsx as jsx76, jsxs as jsxs22 } from "react/jsx-runtime";
+var ChangeRecords = ({
+  records = [],
+  loading = false,
+  defaultExpanded = false,
+  hasMore = false,
+  onLoadMore,
+  onExpand,
+  className = "",
+  renderItem
+}) => {
+  const [expanded, setExpanded] = useState26(defaultExpanded);
+  const handleToggle = () => {
+    const next = !expanded;
+    setExpanded(next);
+    if (next && onExpand) {
+      onExpand();
+    }
+  };
+  const defaultRenderItem = (record) => /* @__PURE__ */ jsxs22("div", { className: "pl-4 py-3 border-l-2 border-gray-200 ml-1", children: [
+    /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-2 text-xs text-gray-400", children: [
+      /* @__PURE__ */ jsx76("span", { children: record.operatedAt }),
+      /* @__PURE__ */ jsx76("span", { className: "text-gray-600 font-medium", children: record.operatorName }),
+      /* @__PURE__ */ jsx76("span", { children: "\u4FEE\u6539\u4E86" }),
+      /* @__PURE__ */ jsx76("span", { className: "text-gray-800 font-medium", children: record.fieldLabel })
+    ] }),
+    /* @__PURE__ */ jsxs22("div", { className: "mt-1.5 text-sm text-gray-600 flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx76("span", { className: "bg-red-50 text-red-600 px-1.5 py-0.5 rounded text-xs line-through", children: formatValue(record.oldValue) }),
+      /* @__PURE__ */ jsx76("span", { className: "text-gray-400", children: "\u2192" }),
+      /* @__PURE__ */ jsx76("span", { className: "bg-green-50 text-green-600 px-1.5 py-0.5 rounded text-xs", children: formatValue(record.newValue) })
+    ] })
+  ] });
+  return /* @__PURE__ */ jsxs22("div", { className: `bg-white rounded-xl shadow-sm border border-gray-100 ${className}`, children: [
+    /* @__PURE__ */ jsxs22(
+      "button",
+      {
+        type: "button",
+        className: "w-full flex items-center justify-between p-6 text-left hover:bg-gray-50/50 transition-colors rounded-xl",
+        onClick: handleToggle,
+        children: [
+          /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx76("h3", { className: "text-lg font-semibold text-gray-900", children: "\u53D8\u66F4\u8BB0\u5F55" }),
+            /* @__PURE__ */ jsx76("span", { className: "text-xs text-gray-400 bg-gray-100 px-1.5 py-0.5 rounded-full", children: records.length })
+          ] }),
+          /* @__PURE__ */ jsx76("span", { className: "text-gray-400 text-xs", children: expanded ? /* @__PURE__ */ jsx76(UpOutlined, {}) : /* @__PURE__ */ jsx76(DownOutlined, {}) })
+        ]
+      }
+    ),
+    expanded && /* @__PURE__ */ jsxs22("div", { className: "px-6 pb-6", children: [
+      loading && records.length === 0 ? /* @__PURE__ */ jsx76(Skeleton, { active: true, paragraph: { rows: 3 } }) : records.length === 0 ? /* @__PURE__ */ jsx76("p", { className: "text-sm text-gray-400 text-center py-4", children: "\u6682\u65E0\u53D8\u66F4\u8BB0\u5F55" }) : /* @__PURE__ */ jsx76("div", { className: "space-y-1", children: records.map((record) => /* @__PURE__ */ jsx76("div", { children: renderItem ? renderItem(record) : defaultRenderItem(record) }, record.id)) }),
+      hasMore && /* @__PURE__ */ jsx76(
+        "button",
+        {
+          type: "button",
+          className: "mt-4 w-full text-center text-sm text-blue-600 hover:text-blue-700 py-2 rounded-lg hover:bg-blue-50/50 transition-colors",
+          onClick: onLoadMore,
+          disabled: loading,
+          children: loading ? "\u52A0\u8F7D\u4E2D..." : "\u52A0\u8F7D\u66F4\u591A"
+        }
+      )
+    ] })
+  ] });
+};
+function formatValue(value) {
+  if (value === null || value === void 0) return "\u7A7A";
+  if (typeof value === "object") return JSON.stringify(value);
+  return String(value);
+}
+
+// src/modules/ApprovalTimeline.tsx
+import { Fragment as Fragment2, jsx as jsx77, jsxs as jsxs23 } from "react/jsx-runtime";
+var toneClasses2 = {
+  brand: "bg-blue-50 text-blue-600",
+  success: "bg-green-50 text-green-600",
+  danger: "bg-red-50 text-red-600",
+  neutral: "bg-gray-100 text-gray-500",
+  warning: "bg-amber-50 text-amber-600"
+};
+function getNodePhase(task) {
+  if (task.status === "approved" || task.status === "rejected" || task.status === "returned" || task.status === "copied") {
+    return "completed";
+  }
+  if (task.status === "pending" || task.status === "waiting") {
+    return "active";
+  }
+  return "pending";
+}
+var ApprovalTimeline = ({
+  tasks,
+  className = "",
+  renderNode,
+  showRemarks = true,
+  compactMode = false
+}) => {
+  if (!tasks || tasks.length === 0) {
+    return /* @__PURE__ */ jsx77("div", { className: `bg-white rounded-xl shadow-sm border border-gray-100 p-6 ${className}`, children: /* @__PURE__ */ jsx77("p", { className: "text-sm text-gray-400 text-center", children: "\u6682\u65E0\u5BA1\u6279\u8BB0\u5F55" }) });
+  }
+  return /* @__PURE__ */ jsx77("div", { className: `${className}`, children: tasks.map((task, index) => {
+    if (renderNode) {
+      return /* @__PURE__ */ jsx77("div", { children: renderNode(task, index) }, task.taskId);
+    }
+    const phase = getNodePhase(task);
+    const isLast = index === tasks.length - 1;
+    const statusMeta = TASK_STATUS_META[task.status];
+    return /* @__PURE__ */ jsxs23("div", { className: "flex gap-4", children: [
+      /* @__PURE__ */ jsxs23("div", { className: "flex flex-col items-center", children: [
+        phase === "completed" && /* @__PURE__ */ jsx77("div", { className: "w-3 h-3 rounded-full bg-green-500 flex-shrink-0" }),
+        phase === "active" && /* @__PURE__ */ jsx77("div", { className: "w-3 h-3 rounded-full bg-blue-500 ring-4 ring-blue-100 flex-shrink-0" }),
+        phase === "pending" && /* @__PURE__ */ jsx77("div", { className: "w-3 h-3 rounded-full bg-gray-300 flex-shrink-0" }),
+        !isLast && /* @__PURE__ */ jsx77(
+          "div",
+          {
+            className: `w-0.5 flex-1 mt-1 ${phase === "completed" ? "bg-green-300" : phase === "active" ? "bg-blue-400" : "border-l-2 border-dashed border-gray-200"}`
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx77("div", { className: `flex-1 pb-6 ${isLast ? "pb-0" : ""}`, children: /* @__PURE__ */ jsxs23(
+        "div",
+        {
+          className: `rounded-lg p-4 ${phase === "completed" ? "bg-white border border-gray-100" : phase === "active" ? "bg-white border-l-4 border-l-blue-500 border border-gray-100 shadow-sm" : "bg-gray-50 border border-gray-100 opacity-60"}`,
+          children: [
+            /* @__PURE__ */ jsxs23("div", { className: "flex items-center justify-between", children: [
+              /* @__PURE__ */ jsx77("span", { className: "text-sm font-medium text-gray-900", children: task.nodeName }),
+              statusMeta && /* @__PURE__ */ jsx77(
+                "span",
+                {
+                  className: `px-2 py-0.5 rounded-full text-xs font-medium ${toneClasses2[statusMeta.tone] || toneClasses2.neutral}`,
+                  children: statusMeta.label
+                }
+              )
+            ] }),
+            task.assigneeName && /* @__PURE__ */ jsxs23("div", { className: "mt-2 flex items-center gap-1.5 text-sm text-gray-600", children: [
+              /* @__PURE__ */ jsx77("span", { className: "text-gray-400", children: "\u{1F464}" }),
+              /* @__PURE__ */ jsxs23("span", { children: [
+                phase === "active" ? "\u5F53\u524D\u5BA1\u6279\u4EBA: " : "",
+                task.assigneeName
+              ] }),
+              task.departmentName && /* @__PURE__ */ jsxs23(Fragment2, { children: [
+                /* @__PURE__ */ jsx77("span", { className: "text-gray-300", children: "\xB7" }),
+                /* @__PURE__ */ jsx77("span", { className: "text-gray-400", children: task.departmentName })
+              ] })
+            ] }),
+            !compactMode && showRemarks && task.comments && /* @__PURE__ */ jsxs23("div", { className: "mt-2 bg-gray-50 rounded-md p-3 text-sm text-gray-600 italic", children: [
+              "\u{1F4AC} \u201C",
+              task.comments,
+              "\u201D"
+            ] }),
+            !compactMode && phase === "active" && !task.comments && /* @__PURE__ */ jsx77("div", { className: "mt-2 text-xs text-gray-400", children: "\u23F3 \u7B49\u5F85\u5904\u7406\u4E2D..." }),
+            !compactMode && (task.actionAt || task.createdAt) && /* @__PURE__ */ jsxs23("div", { className: "mt-2 text-xs text-gray-400", children: [
+              "\u{1F550} ",
+              task.actionAt || task.createdAt
+            ] }),
+            compactMode && (task.actionAt || task.createdAt) && /* @__PURE__ */ jsx77("div", { className: "mt-1 text-xs text-gray-400", children: task.actionAt || task.createdAt })
+          ]
+        }
+      ) })
+    ] }, task.taskId);
+  }) });
+};
+
+// src/modules/ApprovalActions.tsx
+import { useState as useState27 } from "react";
+import { Button as Button5, Drawer, Input as Input8, Dropdown } from "antd";
+import { MoreOutlined, LoadingOutlined } from "@ant-design/icons";
+import { Fragment as Fragment3, jsx as jsx78, jsxs as jsxs24 } from "react/jsx-runtime";
+var { TextArea: TextArea4 } = Input8;
+var ApprovalActions = ({
+  actions,
+  onApprove,
+  onReject,
+  onTransfer,
+  onReturn,
+  onWithdraw,
+  onSave,
+  layout = "horizontal",
+  maxVisible = 3,
+  className = ""
+}) => {
+  const [drawerAction, setDrawerAction] = useState27(null);
+  const [comments, setComments] = useState27("");
+  const [loading, setLoading] = useState27(false);
+  const [saveLoading, setSaveLoading] = useState27(false);
+  const handleOpenDrawer = (action) => {
+    setComments("");
+    setDrawerAction(action);
+  };
+  const handleConfirm = async () => {
+    setLoading(true);
+    try {
+      if (drawerAction === "approve" && onApprove) {
+        await onApprove(comments || void 0);
+      } else if (drawerAction === "reject" && onReject) {
+        await onReject(comments || void 0);
+      } else if (drawerAction === "withdraw" && onWithdraw) {
+        await onWithdraw(comments || void 0);
+      }
+      setDrawerAction(null);
+    } finally {
+      setLoading(false);
+    }
+  };
+  const handleSave = async () => {
+    if (!onSave) return;
+    setSaveLoading(true);
+    try {
+      await onSave();
+    } finally {
+      setSaveLoading(false);
+    }
+  };
+  const actionMap = {};
+  actions.forEach((action) => {
+    switch (action.action) {
+      case "agree":
+        actionMap["agree"] = {
+          label: action.name.zh_CN || "\u540C\u610F",
+          handler: () => handleOpenDrawer("approve"),
+          type: "primary",
+          color: "green"
+        };
+        break;
+      case "rejected":
+        actionMap["rejected"] = {
+          label: action.name.zh_CN || "\u62D2\u7EDD",
+          handler: () => handleOpenDrawer("reject"),
+          type: "default"
+        };
+        break;
+      case "transfer":
+        actionMap["transfer"] = {
+          label: action.name.zh_CN || "\u8F6C\u4EA4",
+          handler: () => onTransfer?.(),
+          type: "default"
+        };
+        break;
+      case "return":
+        actionMap["return"] = {
+          label: action.name.zh_CN || "\u9000\u56DE",
+          handler: () => onReturn?.(),
+          type: "default"
+        };
+        break;
+      case "withdraw":
+        actionMap["withdraw"] = {
+          label: action.name.zh_CN || "\u64A4\u9500",
+          handler: () => handleOpenDrawer("withdraw"),
+          type: "default"
+        };
+        break;
+      case "save":
+        actionMap["save"] = {
+          label: action.name.zh_CN || "\u6682\u5B58",
+          handler: handleSave,
+          type: "default"
+        };
+        break;
+    }
+  });
+  const allButtons = Object.entries(actionMap);
+  const visibleButtons = allButtons.slice(0, maxVisible);
+  const moreButtons = allButtons.slice(maxVisible);
+  const drawerTitle = drawerAction === "approve" ? "\u5BA1\u6279\u610F\u89C1" : drawerAction === "reject" ? "\u62D2\u7EDD\u7406\u7531" : drawerAction === "withdraw" ? "\u64A4\u9500\u539F\u56E0" : "\u5BA1\u6279\u610F\u89C1";
+  return /* @__PURE__ */ jsxs24(Fragment3, { children: [
+    /* @__PURE__ */ jsxs24(
+      "div",
+      {
+        className: `${layout === "horizontal" ? "flex items-center gap-3" : "flex flex-col gap-2"} ${className}`,
+        children: [
+          visibleButtons.map(([key, btn]) => /* @__PURE__ */ jsx78(
+            Button5,
+            {
+              type: btn.type === "primary" ? "primary" : "default",
+              className: btn.color === "green" ? "!bg-green-600 !border-green-600 hover:!bg-green-700" : "",
+              onClick: btn.handler,
+              loading: key === "save" && saveLoading,
+              children: btn.label
+            },
+            key
+          )),
+          moreButtons.length > 0 && /* @__PURE__ */ jsx78(
+            Dropdown,
+            {
+              menu: {
+                items: moreButtons.map(([key, btn]) => ({
+                  key,
+                  label: btn.label,
+                  onClick: btn.handler
+                }))
+              },
+              trigger: ["click"],
+              children: /* @__PURE__ */ jsx78(Button5, { icon: /* @__PURE__ */ jsx78(MoreOutlined, {}), children: "\u66F4\u591A" })
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx78(
+      Drawer,
+      {
+        title: drawerTitle,
+        open: drawerAction !== null,
+        onClose: () => setDrawerAction(null),
+        width: 400,
+        footer: /* @__PURE__ */ jsxs24("div", { className: "flex justify-end gap-3", children: [
+          /* @__PURE__ */ jsx78(Button5, { onClick: () => setDrawerAction(null), children: "\u53D6\u6D88" }),
+          /* @__PURE__ */ jsxs24(Button5, { type: "primary", onClick: handleConfirm, loading, children: [
+            loading && /* @__PURE__ */ jsx78(LoadingOutlined, {}),
+            "\u786E\u8BA4"
+          ] })
+        ] }),
+        children: /* @__PURE__ */ jsx78("div", { className: "space-y-4", children: /* @__PURE__ */ jsxs24("div", { children: [
+          /* @__PURE__ */ jsx78("label", { className: "block text-sm font-medium text-gray-700 mb-2", children: drawerAction === "approve" ? "\u5BA1\u6279\u610F\u89C1\uFF08\u53EF\u9009\uFF09" : "\u8BF7\u8F93\u5165\u7406\u7531" }),
+          /* @__PURE__ */ jsx78(
+            TextArea4,
+            {
+              rows: 4,
+              value: comments,
+              onChange: (e) => setComments(e.target.value),
+              placeholder: drawerAction === "approve" ? "\u8BF7\u8F93\u5165\u5BA1\u6279\u610F\u89C1..." : drawerAction === "reject" ? "\u8BF7\u8F93\u5165\u62D2\u7EDD\u7406\u7531..." : "\u8BF7\u8F93\u5165\u64A4\u9500\u539F\u56E0...",
+              maxLength: 500,
+              showCount: true
+            }
+          )
+        ] }) })
+      }
+    )
+  ] });
+};
+
+// src/modules/FormActionBar.tsx
+import { useState as useState28 } from "react";
+import { Button as Button6, Modal as Modal2 } from "antd";
+import { Fragment as Fragment4, jsx as jsx79, jsxs as jsxs25 } from "react/jsx-runtime";
+var FormActionBar = ({
+  actions,
+  position = "bottom-fixed",
+  className = ""
+}) => {
+  const [loadingKeys, setLoadingKeys] = useState28(/* @__PURE__ */ new Set());
+  const visibleActions = actions.filter((a) => a.visible !== false);
+  const sortedActions = [...visibleActions].sort((a, b) => {
+    if (a.type === "danger" && b.type !== "danger") return -1;
+    if (a.type !== "danger" && b.type === "danger") return 1;
+    if (a.type === "primary" && b.type !== "primary") return 1;
+    if (a.type !== "primary" && b.type === "primary") return -1;
+    return 0;
+  });
+  const handleClick = async (action) => {
+    if (action.confirm) {
+      Modal2.confirm({
+        title: action.confirm.title,
+        content: action.confirm.content,
+        okText: "\u786E\u8BA4",
+        cancelText: "\u53D6\u6D88",
+        onOk: async () => {
+          await executeAction(action);
+        }
+      });
+    } else {
+      await executeAction(action);
+    }
+  };
+  const executeAction = async (action) => {
+    setLoadingKeys((prev) => new Set(prev).add(action.key));
+    try {
+      await action.onClick();
+    } finally {
+      setLoadingKeys((prev) => {
+        const next = new Set(prev);
+        next.delete(action.key);
+        return next;
+      });
+    }
+  };
+  const isFixed = position === "bottom-fixed";
+  const bar = /* @__PURE__ */ jsx79(
+    "div",
+    {
+      className: `${isFixed ? "fixed bottom-0 left-0 right-0 z-50 backdrop-blur-lg bg-white/80 border-t border-gray-200 shadow-[0_-1px_3px_rgba(0,0,0,0.05)] px-6 py-3" : ""} ${className}`,
+      children: /* @__PURE__ */ jsx79("div", { className: "flex items-center justify-end gap-3 flex-wrap md:flex-nowrap", children: sortedActions.map((action) => {
+        const isLoading = action.loading || loadingKeys.has(action.key);
+        return /* @__PURE__ */ jsx79(
+          Button6,
+          {
+            type: action.type === "danger" ? "primary" : action.type === "text" ? "text" : action.type || "default",
+            danger: action.type === "danger",
+            loading: isLoading,
+            disabled: action.disabled,
+            icon: action.icon,
+            onClick: () => handleClick(action),
+            className: "md:w-auto w-full",
+            children: action.label
+          },
+          action.key
+        );
+      }) })
+    }
+  );
+  if (isFixed) {
+    return /* @__PURE__ */ jsxs25(Fragment4, { children: [
+      bar,
+      /* @__PURE__ */ jsx79("div", { className: "h-16" })
+    ] });
+  }
+  return bar;
+};
+
+// src/modules/DraftManager.tsx
+import { Button as Button7 } from "antd";
+import { EditOutlined } from "@ant-design/icons";
+import { jsx as jsx80, jsxs as jsxs26 } from "react/jsx-runtime";
+function formatRelativeTime(timestamp) {
+  const now = Date.now();
+  const diff = now - timestamp;
+  const minutes = Math.floor(diff / 6e4);
+  const hours = Math.floor(diff / 36e5);
+  const days = Math.floor(diff / 864e5);
+  if (minutes < 1) return "\u521A\u521A";
+  if (minutes < 60) return `${minutes}\u5206\u949F\u524D`;
+  if (hours < 24) return `${hours}\u5C0F\u65F6\u524D`;
+  return `${days}\u5929\u524D`;
+}
+var DraftManager = ({
+  hasDraft,
+  draftTimestamp,
+  onRestore,
+  onDiscard,
+  className = ""
+}) => {
+  if (!hasDraft) return null;
+  const timeLabel = draftTimestamp ? formatRelativeTime(draftTimestamp) : null;
+  return /* @__PURE__ */ jsx80(
+    "div",
+    {
+      className: `bg-blue-50 border border-blue-200 rounded-lg p-4 animate-[slideDown_0.3s_ease-out] ${className}`,
+      children: /* @__PURE__ */ jsxs26("div", { className: "flex items-center justify-between flex-wrap gap-3", children: [
+        /* @__PURE__ */ jsxs26("div", { className: "flex items-center gap-2 text-sm text-blue-700", children: [
+          /* @__PURE__ */ jsx80(EditOutlined, { className: "text-blue-500" }),
+          /* @__PURE__ */ jsxs26("span", { children: [
+            "\u68C0\u6D4B\u5230\u672A\u63D0\u4EA4\u7684\u8349\u7A3F",
+            timeLabel && /* @__PURE__ */ jsxs26("span", { className: "text-blue-500 ml-1", children: [
+              "\uFF08\u4FDD\u5B58\u4E8E ",
+              timeLabel,
+              "\uFF09"
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs26("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx80(Button7, { type: "text", size: "small", onClick: onDiscard, className: "!text-gray-500", children: "\u4E22\u5F03" }),
+          /* @__PURE__ */ jsx80(Button7, { type: "primary", size: "small", onClick: onRestore, children: "\u6062\u590D\u586B\u5199" })
+        ] })
+      ] })
+    }
+  );
+};
+
+// src/modules/ProcessPreview.tsx
+import { Modal as Modal3, Skeleton as Skeleton2, Button as Button8 } from "antd";
+import { CheckCircleOutlined, UserOutlined } from "@ant-design/icons";
+import { jsx as jsx81, jsxs as jsxs27 } from "react/jsx-runtime";
+var ProcessPreview = ({
+  open,
+  onClose,
+  onConfirm,
+  routes,
+  loading = false
+}) => {
+  return /* @__PURE__ */ jsx81(
+    Modal3,
+    {
+      title: "\u6D41\u7A0B\u9884\u89C8",
+      open,
+      onCancel: onClose,
+      width: 520,
+      footer: /* @__PURE__ */ jsxs27("div", { className: "flex justify-end gap-3", children: [
+        /* @__PURE__ */ jsx81(Button8, { onClick: onClose, children: "\u53D6\u6D88" }),
+        /* @__PURE__ */ jsx81(Button8, { type: "primary", onClick: onConfirm, loading, children: "\u786E\u8BA4\u63D0\u4EA4" })
+      ] }),
+      children: loading && routes.length === 0 ? /* @__PURE__ */ jsx81(Skeleton2, { active: true, paragraph: { rows: 4 } }) : routes.length === 0 ? /* @__PURE__ */ jsx81("p", { className: "text-sm text-gray-400 text-center py-8", children: "\u6682\u65E0\u6D41\u7A0B\u8282\u70B9" }) : /* @__PURE__ */ jsx81("div", { className: "py-2", children: routes.map((route, index) => {
+        const isLast = index === routes.length - 1;
+        return /* @__PURE__ */ jsxs27("div", { className: "flex gap-3", children: [
+          /* @__PURE__ */ jsxs27("div", { className: "flex flex-col items-center", children: [
+            /* @__PURE__ */ jsx81("div", { className: "w-6 h-6 rounded-full bg-blue-50 border-2 border-blue-400 flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx81(CheckCircleOutlined, { className: "text-blue-500 text-xs" }) }),
+            !isLast && /* @__PURE__ */ jsx81("div", { className: "w-0.5 flex-1 bg-blue-200 mt-1" })
+          ] }),
+          /* @__PURE__ */ jsxs27("div", { className: `flex-1 ${isLast ? "pb-0" : "pb-5"}`, children: [
+            /* @__PURE__ */ jsx81("div", { className: "text-sm font-medium text-gray-900", children: route.nodeName }),
+            route.assignees && route.assignees.length > 0 && /* @__PURE__ */ jsxs27("div", { className: "mt-1 flex items-center gap-1.5 flex-wrap", children: [
+              /* @__PURE__ */ jsx81(UserOutlined, { className: "text-gray-400 text-xs" }),
+              route.assignees.map((assignee) => /* @__PURE__ */ jsx81(
+                "span",
+                {
+                  className: "text-xs text-gray-500 bg-gray-100 px-1.5 py-0.5 rounded",
+                  children: assignee.name
+                },
+                assignee.id
+              ))
+            ] })
+          ] })
+        ] }, route.nodeId);
+      }) })
+    }
+  );
+};
+
+// src/templates/FormSubmitTemplate.tsx
+import { useState as useState29, useCallback as useCallback13 } from "react";
+import { Button as Button9 } from "antd";
+import { CheckCircleFilled } from "@ant-design/icons";
+import { Fragment as Fragment5, jsx as jsx82, jsxs as jsxs28 } from "react/jsx-runtime";
+var pickFormInstanceId = (value) => {
+  if (!value) return void 0;
+  if (typeof value === "string") return value;
+  if (typeof value !== "object") return void 0;
+  return value.formInstanceId || value.formInstId || value.instanceId || value.id || pickFormInstanceId(value.result) || pickFormInstanceId(value.data);
+};
+var SubmitSuccessCard = ({
+  info,
+  mode,
+  isRedirecting,
+  countdown,
+  onContinue,
+  onViewDetail,
+  renderSuccess
+}) => {
+  if (renderSuccess) {
+    return /* @__PURE__ */ jsx82(Fragment5, { children: renderSuccess(info) });
+  }
+  return /* @__PURE__ */ jsx82("div", { className: "bg-white rounded-xl shadow-sm border border-gray-100 p-6", children: /* @__PURE__ */ jsxs28("div", { className: "flex flex-col items-center py-16 animate-[fadeIn_0.3s_ease-out,scaleIn_0.3s_ease-out]", children: [
+    /* @__PURE__ */ jsx82("div", { className: "w-12 h-12 rounded-full bg-green-100 flex items-center justify-center mb-4", children: /* @__PURE__ */ jsx82(CheckCircleFilled, { className: "text-2xl text-green-500" }) }),
+    /* @__PURE__ */ jsx82("h2", { className: "text-lg font-semibold text-gray-900 mb-1", children: "\u63D0\u4EA4\u6210\u529F" }),
+    /* @__PURE__ */ jsx82("p", { className: "text-sm text-gray-500 mb-6", children: info.message || "\u5DF2\u6210\u529F\u521B\u5EFA\u4E00\u6761\u65B0\u8BB0\u5F55" }),
+    /* @__PURE__ */ jsxs28("div", { className: "flex gap-3", children: [
+      (mode === "stay" || mode === "redirect") && /* @__PURE__ */ jsx82(Button9, { onClick: onContinue, children: "\u7EE7\u7EED\u63D0\u4EA4" }),
+      /* @__PURE__ */ jsx82(Button9, { type: "primary", onClick: onViewDetail, children: "\u67E5\u770B\u8BE6\u60C5" })
+    ] }),
+    isRedirecting && /* @__PURE__ */ jsxs28("div", { className: "mt-6 w-48", children: [
+      /* @__PURE__ */ jsxs28("div", { className: "text-xs text-gray-400 text-center mb-1", children: [
+        countdown,
+        "\u79D2\u540E\u81EA\u52A8\u8DF3\u8F6C"
+      ] }),
+      /* @__PURE__ */ jsx82("div", { className: "h-1 bg-gray-200 rounded-full overflow-hidden", children: /* @__PURE__ */ jsx82(
+        "div",
+        {
+          className: "h-full bg-blue-500 transition-all duration-1000",
+          style: { width: `${countdown / 3 * 100}%` }
+        }
+      ) })
+    ] })
+  ] }) });
+};
+var InnerFormContent = ({
+  schema,
+  config,
+  formType,
+  submitSuccessMode,
+  enableDraft,
+  header,
+  footer,
+  beforeForm,
+  afterForm,
+  renderForm,
+  renderSuccess,
+  onSubmitSuccess
+}) => {
+  const { validateAll, getFormData: getFormData2, resetForm, api } = useFormContext();
+  const [submitted, setSubmitted] = useState29(false);
+  const [successInfo, setSuccessInfo] = useState29(null);
+  const [submitting, setSubmitting] = useState29(false);
+  const { hasDraft, draftTimestamp, saveDraft, restoreDraft, clearDraft } = useDraftStorage({
+    appType: config.appType,
+    formUuid: config.formUuid
+  });
+  const { navigateToDetail, navigateToProcessDetail, isRedirecting, countdown, handlePostSubmit } = useFormNavigation({
+    appType: config.appType,
+    formUuid: config.formUuid,
+    formType,
+    mode: submitSuccessMode === "continue" ? "stay" : submitSuccessMode,
+    basePath: config.navigation?.basePath
+  });
+  const handleSubmit = useCallback13(async () => {
+    const valid = await validateAll();
+    if (!valid) return;
+    setSubmitting(true);
+    try {
+      const formData = getFormData2();
+      if (config.submit?.beforeSubmit) {
+        const shouldContinue = await config.submit.beforeSubmit(formData);
+        if (shouldContinue === false) {
+          setSubmitting(false);
+          return;
+        }
+      }
+      const submitResponse = config.mode === "edit" && config.formInstanceId ? await api.updateFormData({
+        appType: config.appType,
+        formUuid: config.formUuid,
+        formInstId: config.formInstanceId,
+        formInstanceId: config.formInstanceId,
+        updateFormDataJson: JSON.stringify(formData)
+      }) : await api.submitFormData({
+        appType: config.appType,
+        formUuid: config.formUuid,
+        data: formData
+      });
+      const formInstId = pickFormInstanceId(submitResponse) || config.formInstanceId || `inst_${Date.now()}`;
+      if (config.submit?.afterSubmit) {
+        await config.submit.afterSubmit({
+          formInstanceId: formInstId,
+          data: formData,
+          response: submitResponse
+        });
+      }
+      if (enableDraft) {
+        clearDraft();
+      }
+      onSubmitSuccess?.(formInstId);
+      if (submitSuccessMode === "continue") {
+        resetForm();
+      } else {
+        setSuccessInfo({ formInstanceId: formInstId });
+        setSubmitted(true);
+        handlePostSubmit(formInstId);
+      }
+    } catch (error) {
+      console.error("[FormSubmitTemplate] Submit failed:", error);
+    } finally {
+      setSubmitting(false);
+    }
+  }, [
+    validateAll,
+    getFormData2,
+    config,
+    api,
+    enableDraft,
+    clearDraft,
+    onSubmitSuccess,
+    submitSuccessMode,
+    resetForm,
+    handlePostSubmit
+  ]);
+  const handleSaveDraft = useCallback13(() => {
+    const data = getFormData2();
+    saveDraft(data);
+  }, [getFormData2, saveDraft]);
+  const handleRestoreDraft = useCallback13(() => {
+    restoreDraft();
+  }, [restoreDraft]);
+  const handleContinue = useCallback13(() => {
+    setSubmitted(false);
+    setSuccessInfo(null);
+    resetForm();
+  }, [resetForm]);
+  const handleViewDetail = useCallback13(() => {
+    if (!successInfo) return;
+    if (formType === "process") {
+      navigateToProcessDetail(successInfo.formInstanceId);
+    } else {
+      navigateToDetail(successInfo.formInstanceId);
+    }
+  }, [successInfo, formType, navigateToDetail, navigateToProcessDetail]);
+  const actions = [];
+  if (enableDraft) {
+    actions.push({
+      key: "draft",
+      label: "\u6682\u5B58",
+      type: "default",
+      onClick: handleSaveDraft
+    });
+  }
+  actions.push({
+    key: "reset",
+    label: "\u91CD\u7F6E",
+    type: "default",
+    onClick: () => resetForm()
+  });
+  actions.push({
+    key: "submit",
+    label: "\u63D0\u4EA4",
+    type: "primary",
+    loading: submitting,
+    onClick: handleSubmit
+  });
+  return /* @__PURE__ */ jsxs28("div", { className: "min-h-screen bg-gray-50/50", children: [
+    /* @__PURE__ */ jsxs28("div", { className: "max-w-4xl mx-auto py-8 px-6 pb-24", children: [
+      header || /* @__PURE__ */ jsxs28("div", { className: "mb-6", children: [
+        /* @__PURE__ */ jsx82("h1", { className: "text-2xl font-bold text-gray-900", children: schema.formMeta.title }),
+        /* @__PURE__ */ jsx82("p", { className: "text-sm text-gray-500 mt-1", children: "\u8BF7\u586B\u5199\u4EE5\u4E0B\u4FE1\u606F" })
+      ] }),
+      enableDraft && hasDraft && !submitted && /* @__PURE__ */ jsx82("div", { className: "mb-6", children: /* @__PURE__ */ jsx82(
+        DraftManager,
+        {
+          hasDraft,
+          draftTimestamp,
+          onRestore: handleRestoreDraft,
+          onDiscard: clearDraft
+        }
+      ) }),
+      !submitted ? /* @__PURE__ */ jsxs28("div", { className: "bg-white rounded-xl shadow-sm border border-gray-100 p-6 animate-[fadeIn_0.2s_ease-out]", children: [
+        beforeForm,
+        renderForm ? renderForm({ schema, config }) : /* @__PURE__ */ jsx82(FormRenderer, { columns: 2 }),
+        afterForm
+      ] }) : successInfo && /* @__PURE__ */ jsx82(
+        SubmitSuccessCard,
+        {
+          info: successInfo,
+          mode: submitSuccessMode,
+          isRedirecting,
+          countdown,
+          onContinue: handleContinue,
+          onViewDetail: handleViewDetail,
+          renderSuccess
+        }
+      ),
+      footer
+    ] }),
+    !submitted && /* @__PURE__ */ jsx82(FormActionBar, { actions, position: "bottom-fixed" })
+  ] });
+};
+var FormSubmitTemplate = ({
+  schema,
+  config,
+  formType = "form",
+  submitSuccessMode = "redirect",
+  enableDraft = false,
+  header,
+  footer,
+  beforeForm,
+  afterForm,
+  renderForm,
+  renderSuccess,
+  onSubmitSuccess
+}) => {
+  return /* @__PURE__ */ jsx82(FormProvider, { schema, config, children: /* @__PURE__ */ jsx82(
+    InnerFormContent,
+    {
+      schema,
+      config,
+      formType,
+      submitSuccessMode,
+      enableDraft,
+      header,
+      footer,
+      beforeForm,
+      afterForm,
+      renderForm,
+      renderSuccess,
+      onSubmitSuccess
+    }
+  ) });
+};
+
+// src/templates/FormDetailTemplate.tsx
+import { useCallback as useCallback14 } from "react";
+
+// src/templates/PageSkeleton.tsx
+import { Skeleton as Skeleton3 } from "antd";
+import { jsx as jsx83, jsxs as jsxs29 } from "react/jsx-runtime";
+var CardSkeleton = ({ children }) => /* @__PURE__ */ jsx83("div", { className: "bg-white rounded-xl shadow-sm border border-gray-100 p-6", children });
+var SummaryCardSkeleton = () => /* @__PURE__ */ jsxs29(CardSkeleton, { children: [
+  /* @__PURE__ */ jsxs29("div", { className: "flex items-start justify-between", children: [
+    /* @__PURE__ */ jsxs29("div", { className: "flex-1", children: [
+      /* @__PURE__ */ jsx83(Skeleton3.Input, { active: true, size: "large", style: { width: 200 } }),
+      /* @__PURE__ */ jsx83("div", { className: "mt-2", children: /* @__PURE__ */ jsx83(Skeleton3.Input, { active: true, size: "small", style: { width: 80 } }) })
+    ] }),
+    /* @__PURE__ */ jsx83(Skeleton3.Button, { active: true, size: "small", shape: "round", style: { width: 60 } })
+  ] }),
+  /* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-3 mt-4", children: [
+    /* @__PURE__ */ jsx83(Skeleton3.Avatar, { active: true, size: "small" }),
+    /* @__PURE__ */ jsx83(Skeleton3.Input, { active: true, size: "small", style: { width: 120 } })
+  ] })
+] });
+var FormGridSkeleton = () => /* @__PURE__ */ jsx83(CardSkeleton, { children: /* @__PURE__ */ jsx83("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ jsxs29("div", { className: "space-y-2", children: [
+  /* @__PURE__ */ jsx83(Skeleton3.Input, { active: true, size: "small", style: { width: 80 } }),
+  /* @__PURE__ */ jsx83(Skeleton3.Input, { active: true, block: true, style: { width: "100%" } })
+] }, i)) }) });
+var ActionBarSkeleton = () => /* @__PURE__ */ jsx83("div", { className: "fixed bottom-0 left-0 right-0 backdrop-blur-lg bg-white/80 border-t border-gray-200 px-6 py-3", children: /* @__PURE__ */ jsxs29("div", { className: "flex items-center justify-end gap-3", children: [
+  /* @__PURE__ */ jsx83(Skeleton3.Button, { active: true, style: { width: 80 } }),
+  /* @__PURE__ */ jsx83(Skeleton3.Button, { active: true, style: { width: 80 } })
+] }) });
+var TimelineSkeleton = () => /* @__PURE__ */ jsxs29(CardSkeleton, { children: [
+  /* @__PURE__ */ jsx83(Skeleton3.Input, { active: true, size: "default", style: { width: 100, marginBottom: 16 } }),
+  /* @__PURE__ */ jsx83("div", { className: "space-y-4", children: Array.from({ length: 3 }).map((_, i) => /* @__PURE__ */ jsxs29("div", { className: "flex gap-4", children: [
+    /* @__PURE__ */ jsxs29("div", { className: "flex flex-col items-center", children: [
+      /* @__PURE__ */ jsx83("div", { className: "w-3 h-3 rounded-full bg-gray-200 animate-pulse" }),
+      i < 2 && /* @__PURE__ */ jsx83("div", { className: "w-0.5 flex-1 bg-gray-200 mt-1" })
+    ] }),
+    /* @__PURE__ */ jsx83("div", { className: "flex-1 pb-4", children: /* @__PURE__ */ jsx83(Skeleton3, { active: true, paragraph: { rows: 1 }, title: { width: "60%" } }) })
+  ] }, i)) })
+] });
+var PageSkeleton = ({ type }) => {
+  if (type === "submit") {
+    return /* @__PURE__ */ jsxs29("div", { className: "space-y-6", children: [
+      /* @__PURE__ */ jsxs29("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx83(Skeleton3.Input, { active: true, size: "large", style: { width: 200 } }),
+        /* @__PURE__ */ jsx83(Skeleton3.Input, { active: true, size: "small", style: { width: 300 } })
+      ] }),
+      /* @__PURE__ */ jsx83(FormGridSkeleton, {}),
+      /* @__PURE__ */ jsx83(ActionBarSkeleton, {})
+    ] });
+  }
+  if (type === "detail") {
+    return /* @__PURE__ */ jsxs29("div", { className: "space-y-6", children: [
+      /* @__PURE__ */ jsx83(SummaryCardSkeleton, {}),
+      /* @__PURE__ */ jsx83(FormGridSkeleton, {}),
+      /* @__PURE__ */ jsx83(ActionBarSkeleton, {})
+    ] });
+  }
+  return /* @__PURE__ */ jsxs29("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsx83(SummaryCardSkeleton, {}),
+    /* @__PURE__ */ jsx83(FormGridSkeleton, {}),
+    /* @__PURE__ */ jsx83(TimelineSkeleton, {}),
+    /* @__PURE__ */ jsx83(ActionBarSkeleton, {})
+  ] });
+};
+
+// src/templates/FormDetailTemplate.tsx
+import { Fragment as Fragment6, jsx as jsx84, jsxs as jsxs30 } from "react/jsx-runtime";
+var InnerDetailContent = ({
+  schema,
+  formUuid,
+  appType,
+  formInstanceId,
+  enableEdit = true,
+  enableDelete = false,
+  enableChangeRecords = false,
+  header,
+  footer,
+  renderSummary,
+  renderActions,
+  onDelete,
+  onSave
+}) => {
+  const {
+    loading,
+    mode,
+    formData,
+    instanceInfo,
+    fieldBehaviors,
+    switchToEdit,
+    switchToReadonly,
+    saveChanges,
+    deleteInstance,
+    canEdit,
+    canDelete,
+    canViewChangeRecords
+  } = useFormDetail({ formUuid, appType, formInstanceId });
+  const {
+    records,
+    loading: recordsLoading,
+    hasMore,
+    loadMore,
+    refresh: refreshRecords
+  } = useChangeRecords({
+    formUuid,
+    appType,
+    formInstanceId,
+    autoLoad: enableChangeRecords && canViewChangeRecords
+  });
+  const handleSave = useCallback14(async () => {
+    if (!formData) return;
+    const success = await saveChanges(formData);
+    if (success) {
+      onSave?.(formData);
+    }
+  }, [formData, saveChanges, onSave]);
+  const handleDelete = useCallback14(async () => {
+    const success = await deleteInstance();
+    if (success) {
+      onDelete?.();
+    }
+  }, [deleteInstance, onDelete]);
+  const handleCancel = useCallback14(() => {
+    switchToReadonly();
+  }, [switchToReadonly]);
+  const readonlyActions = [];
+  if (enableEdit && canEdit) {
+    readonlyActions.push({
+      key: "edit",
+      label: "\u7F16\u8F91",
+      type: "primary",
+      onClick: switchToEdit
+    });
+  }
+  if (enableDelete && canDelete) {
+    readonlyActions.push({
+      key: "delete",
+      label: "\u5220\u9664",
+      type: "danger",
+      onClick: handleDelete,
+      confirm: { title: "\u786E\u8BA4\u5220\u9664", content: "\u5220\u9664\u540E\u5C06\u65E0\u6CD5\u6062\u590D\uFF0C\u786E\u8BA4\u8981\u5220\u9664\u5417\uFF1F" }
+    });
+  }
+  const editActions = [
+    { key: "cancel", label: "\u53D6\u6D88", type: "default", onClick: handleCancel },
+    { key: "save", label: "\u4FDD\u5B58", type: "primary", onClick: handleSave }
+  ];
+  const currentActions = mode === "readonly" ? readonlyActions : editActions;
+  const formConfig = {
+    mode: mode === "edit" ? "edit" : "readonly",
+    formUuid,
+    appType,
+    formInstanceId,
+    permissions: {
+      fieldPermissions: fieldBehaviors,
+      operations: []
+    }
+  };
+  if (loading) {
+    return /* @__PURE__ */ jsx84("div", { className: "min-h-screen bg-gray-50/50", children: /* @__PURE__ */ jsx84("div", { className: "max-w-4xl mx-auto py-8 px-6 pb-24", children: /* @__PURE__ */ jsx84(PageSkeleton, { type: "detail" }) }) });
+  }
+  return /* @__PURE__ */ jsxs30("div", { className: "min-h-screen bg-gray-50/50", children: [
+    /* @__PURE__ */ jsx84("div", { className: "max-w-4xl mx-auto py-8 px-6 pb-24 space-y-6", children: /* @__PURE__ */ jsxs30("div", { className: "animate-[fadeIn_0.2s_ease-out]", children: [
+      header,
+      renderSummary && instanceInfo ? renderSummary(instanceInfo) : /* @__PURE__ */ jsx84(
+        FormSummaryCard,
+        {
+          title: schema.formMeta.title,
+          formInstanceId,
+          creator: instanceInfo?.creator ? {
+            name: instanceInfo.creator.name,
+            avatar: instanceInfo.creator.avatar,
+            department: instanceInfo.creator.department
+          } : void 0,
+          createdAt: instanceInfo?.createdAt,
+          status: mode === "edit" ? { label: "\u7F16\u8F91\u4E2D", tone: "brand" } : void 0
+        }
+      ),
+      mode === "edit" && /* @__PURE__ */ jsx84("div", { className: "bg-blue-50 border border-blue-200 rounded-lg px-4 py-3 text-sm text-blue-700 transition-all duration-150", children: "\u6B63\u5728\u7F16\u8F91\uFF0C\u4FEE\u6539\u540E\u8BF7\u4FDD\u5B58" }),
+      /* @__PURE__ */ jsx84("div", { className: "bg-white rounded-xl shadow-sm border border-gray-100 p-6", children: /* @__PURE__ */ jsx84(FormProvider, { schema, config: formConfig, initialValues: formData ?? void 0, children: /* @__PURE__ */ jsx84(FormRenderer, { columns: 2 }) }) }),
+      enableChangeRecords && canViewChangeRecords && /* @__PURE__ */ jsx84(
+        ChangeRecords,
+        {
+          records,
+          loading: recordsLoading,
+          hasMore,
+          onLoadMore: loadMore,
+          onExpand: refreshRecords
+        }
+      ),
+      footer
+    ] }) }),
+    currentActions.length > 0 && (renderActions ? /* @__PURE__ */ jsx84(Fragment6, { children: renderActions(currentActions) }) : /* @__PURE__ */ jsx84(FormActionBar, { position: "bottom-fixed", actions: currentActions }))
+  ] });
+};
+var FormDetailTemplate = (props) => {
+  const { schema, formUuid, appType, formInstanceId } = props;
+  const wrapperConfig = {
+    mode: "readonly",
+    formUuid,
+    appType,
+    formInstanceId
+  };
+  return /* @__PURE__ */ jsx84(FormProvider, { schema, config: wrapperConfig, children: /* @__PURE__ */ jsx84(InnerDetailContent, { ...props }) });
+};
+
+// src/templates/ProcessDetailTemplate.tsx
+import { useCallback as useCallback15, useRef as useRef12 } from "react";
+import { Fragment as Fragment7, jsx as jsx85, jsxs as jsxs31 } from "react/jsx-runtime";
+function FormDataBridge({
+  formDataRef
+}) {
+  const { getFormData: getFormData2 } = useFormContext();
+  formDataRef.current = getFormData2;
+  return null;
+}
+var InnerProcessContent = ({
+  schema,
+  formUuid,
+  appType,
+  formInstanceId,
+  header,
+  renderTimeline,
+  renderActions,
+  beforeForm,
+  afterForm,
+  onActionComplete
+}) => {
+  const formDataRef = useRef12(void 0);
+  const {
+    loading,
+    processInfo,
+    processStatus,
+    currentTask,
+    progressList,
+    formData,
+    isApprover,
+    activeActions,
+    fieldBehaviors,
+    mode,
+    isOriginatorReturn,
+    canWithdraw,
+    switchToEdit,
+    switchToReadonly,
+    refreshProgress
+  } = useProcessDetail({ formUuid, appType, formInstanceId });
+  const { approve, reject, withdraw, save, resubmit } = useApprovalActions({
+    formInstanceId,
+    formUuid,
+    appType,
+    currentTaskId: currentTask?.taskId,
+    onActionComplete: async (action) => {
+      onActionComplete?.(action);
+      await refreshProgress();
+    },
+    getFormValues: () => formDataRef.current?.() ?? {}
+  });
+  const handleApprove = useCallback15(
+    async (comments) => {
+      await approve(comments);
+    },
+    [approve]
+  );
+  const handleReject = useCallback15(
+    async (comments) => {
+      await reject(comments);
+    },
+    [reject]
+  );
+  const handleWithdraw = useCallback15(
+    async (reason) => {
+      await withdraw(reason);
+    },
+    [withdraw]
+  );
+  const handleSave = useCallback15(async () => {
+    await save();
+  }, [save]);
+  const handleResubmit = useCallback15(async () => {
+    await resubmit();
+  }, [resubmit]);
+  const buildActions = () => {
+    const actions = [];
+    if (isApprover && activeActions.length > 0) {
+      return [];
+    }
+    if (isOriginatorReturn) {
+      if (mode === "readonly") {
+        actions.push({
+          key: "edit",
+          label: "\u7F16\u8F91",
+          type: "primary",
+          onClick: switchToEdit
+        });
+      } else {
+        actions.push({
+          key: "cancel",
+          label: "\u53D6\u6D88",
+          type: "default",
+          onClick: switchToReadonly
+        });
+        actions.push({
+          key: "resubmit",
+          label: "\u91CD\u65B0\u63D0\u4EA4",
+          type: "primary",
+          onClick: handleResubmit
+        });
+      }
+      return actions;
+    }
+    if (canWithdraw) {
+      actions.push({
+        key: "withdraw",
+        label: "\u64A4\u9500",
+        type: "default",
+        onClick: () => handleWithdraw(),
+        confirm: { title: "\u786E\u8BA4\u64A4\u9500", content: "\u786E\u8BA4\u8981\u64A4\u9500\u6B64\u6D41\u7A0B\u5417\uFF1F" }
+      });
+    }
+    return actions;
+  };
+  const formConfig = {
+    mode: mode === "edit" ? "edit" : "readonly",
+    formUuid,
+    appType,
+    formInstanceId,
+    permissions: {
+      fieldPermissions: fieldBehaviors,
+      operations: []
+    }
+  };
+  if (loading) {
+    return /* @__PURE__ */ jsx85("div", { className: "min-h-screen bg-gray-50/50", children: /* @__PURE__ */ jsx85("div", { className: "max-w-4xl mx-auto py-8 px-6 pb-24", children: /* @__PURE__ */ jsx85(PageSkeleton, { type: "process" }) }) });
+  }
+  const bottomActions = buildActions();
+  const showApprovalActions = isApprover && activeActions.length > 0;
+  return /* @__PURE__ */ jsxs31("div", { className: "min-h-screen bg-gray-50/50", children: [
+    /* @__PURE__ */ jsx85("div", { className: "max-w-4xl mx-auto py-8 px-6 pb-24 space-y-6", children: /* @__PURE__ */ jsxs31("div", { className: "animate-[fadeIn_0.2s_ease-out]", children: [
+      header,
+      /* @__PURE__ */ jsx85(
+        FormSummaryCard,
+        {
+          title: schema.formMeta.title,
+          formInstanceId,
+          creator: processInfo?.originatorName ? {
+            name: processInfo.originatorName,
+            department: processInfo.originatorDepartment
+          } : void 0,
+          createdAt: processInfo?.createdAt,
+          status: processStatus ? PROCESS_STATUS_META[processStatus] : void 0
+        }
+      ),
+      beforeForm,
+      mode === "edit" && /* @__PURE__ */ jsx85("div", { className: "bg-blue-50 border border-blue-200 rounded-lg px-4 py-3 text-sm text-blue-700 transition-all duration-150", children: "\u6B63\u5728\u7F16\u8F91\u8868\u5355\uFF0C\u4FEE\u6539\u540E\u8BF7\u91CD\u65B0\u63D0\u4EA4" }),
+      /* @__PURE__ */ jsx85("div", { className: "bg-white rounded-xl shadow-sm border border-gray-100 p-6", children: /* @__PURE__ */ jsxs31(FormProvider, { schema, config: formConfig, initialValues: formData ?? void 0, children: [
+        /* @__PURE__ */ jsx85(FormDataBridge, { formDataRef }),
+        /* @__PURE__ */ jsx85(FormRenderer, { columns: 2 })
+      ] }) }),
+      afterForm,
+      /* @__PURE__ */ jsxs31("div", { className: "bg-white rounded-xl shadow-sm border border-gray-100 p-6", children: [
+        /* @__PURE__ */ jsx85("h3", { className: "text-lg font-semibold text-gray-900 mb-4", children: "\u5BA1\u6279\u8FDB\u5EA6" }),
+        renderTimeline ? renderTimeline(progressList) : /* @__PURE__ */ jsx85(ApprovalTimeline, { tasks: progressList, showRemarks: true })
+      ] })
+    ] }) }),
+    showApprovalActions && (renderActions ? /* @__PURE__ */ jsx85(Fragment7, { children: renderActions(activeActions) }) : /* @__PURE__ */ jsx85("div", { className: "fixed bottom-0 left-0 right-0 z-50 backdrop-blur-lg bg-white/80 border-t border-gray-200 shadow-[0_-1px_3px_rgba(0,0,0,0.05)] px-6 py-3", children: /* @__PURE__ */ jsx85("div", { className: "max-w-4xl mx-auto flex items-center justify-end", children: /* @__PURE__ */ jsx85(
+      ApprovalActions,
+      {
+        actions: activeActions,
+        onApprove: handleApprove,
+        onReject: handleReject,
+        onWithdraw: handleWithdraw,
+        onSave: handleSave
+      }
+    ) }) })),
+    !showApprovalActions && bottomActions.length > 0 && /* @__PURE__ */ jsx85(FormActionBar, { position: "bottom-fixed", actions: bottomActions })
+  ] });
+};
+var ProcessDetailTemplate = (props) => {
+  const { schema, formUuid, appType, formInstanceId } = props;
+  const wrapperConfig = {
+    mode: "readonly",
+    formUuid,
+    appType,
+    formInstanceId
+  };
+  return /* @__PURE__ */ jsx85(FormProvider, { schema, config: wrapperConfig, children: /* @__PURE__ */ jsx85(InnerProcessContent, { ...props }) });
+};
 export {
   AddressField,
+  ApprovalActions,
+  ApprovalTimeline,
   AssociationFormField,
   AttachmentField,
   CascadeDateField,
   CascadeSelectField,
+  ChangeRecords,
   CheckboxField,
   ComponentRegistryContext,
   ComponentRegistryProvider,
   DateField,
   DepartmentSelectField,
   DigitalSignatureField,
+  DraftManager,
   EditorField,
   UserSelectField as EmployeeSelectField,
   FieldWrapper,
+  FormActionBar,
   FormActions,
   FormContainer,
   FormContext,
+  FormDetailTemplate,
   FormGrid,
   FormProvider,
   FormRenderer,
   FormSection,
   FormSteps,
+  FormSubmitTemplate,
   FormSummary,
+  FormSummaryCard,
   FormTabs,
   ImageField,
   JSONField,
   LocationField,
   MultiSelectField,
   NumberField,
+  PROCESS_STATUS_META,
+  PageSkeleton,
+  ProcessDetailTemplate,
+  ProcessPreview,
   RadioField,
   SelectField,
   SerialNumberField,
   SubFormField,
+  TASK_STATUS_META,
   TextAreaField,
   TextField,
   TextAreaField as TextareaField,
   UserSelectField,
+  checkUserApproval,
   createFormRuntimeApi,
   defaultComponentRegistry,
   defineFormSchema,
+  deleteFormData,
   evaluateEffects,
+  getChangeRecords,
+  getFormData,
+  getProcessBasic,
+  getProcessDefinition,
+  getProcessProgress,
+  getReturnableNodes,
+  getViewPermission,
+  handleApproval,
+  previewProcess,
+  resubmitTask,
+  returnTask,
+  saveTask,
+  transferTask,
+  useApprovalActions,
+  useChangeRecords,
   useComponent,
   useDeviceDetect,
+  useDraftStorage,
   useFieldBehavior,
+  useFieldPermission,
   useFormContext,
   useFormData,
+  useFormDetail,
   useFormEngine,
+  useFormNavigation,
   useFormSubmit,
+  useProcessDetail,
   validateAllFields,
-  validateField
+  validateField,
+  withdrawProcess
 };
 //# sourceMappingURL=index.mjs.map