formanitor 0.0.5 → 0.0.8

package/dist/index.d.cts

@@ -52,27 +52,24 @@ interface TextFieldDef extends BaseFieldDef {
 interface NumberFieldDef extends BaseFieldDef {
     type: 'number';
 }
+/** Option for select/radio/checkbox. When score is set, sum computation uses it for aggregation. */
+interface SelectOption {
+    label: string;
+    value: any;
+    score?: number;
+}
 interface SelectFieldDef extends BaseFieldDef {
     type: 'select' | 'multiselect';
-    options?: {
-        label: string;
-        value: any;
-    }[];
+    options?: SelectOption[];
 }
 interface RadioFieldDef extends BaseFieldDef {
     type: 'radio';
-    options?: {
-        label: string;
-        value: any;
-    }[];
+    options?: SelectOption[];
 }
 interface CheckboxFieldDef extends BaseFieldDef {
     type: 'checkbox';
     /** Options for the checkbox group; value is stored as array of selected option values. */
-    options?: {
-        label: string;
-        value: any;
-    }[];
+    options?: SelectOption[];
 }
 interface RepeatableFieldDef extends BaseFieldDef {
     type: 'repeatable';
@@ -440,4 +437,4 @@ interface CreateUploadHandlerOptions {
  */
 declare function createUploadHandler(options: CreateUploadHandlerOptions): (file: File | Blob, filename: string) => Promise<string>;
 
-export { type BaseFieldDef, type CheckboxFieldDef, type ColumnLayout, type Computation, type Condition, type CreateUploadHandlerOptions, type DataSource, DynamicForm, EMAIL_REGEX, type EditableTableColumnDef, type EditableTableFieldDef, type EventDefinition, type FieldDef, type FieldPrefill, FieldRenderer, type FieldState, type FieldType, FormControls, type FormControlsProps, type FormDef, type FormErrors, FormProvider, type FormState, FormStore, type FormValues, type ImageUploadFieldDef, ImageUploadWidget, type LayoutNode, type NumberFieldDef, type Permission, type PresignedUploadResponse, type RadioFieldDef, ReadOnlyForm, ReadOnlyImageUpload, ReadOnlySignature, ReadOnlyTable, type RepeatableFieldDef, type Rule, type RuleAction, type RuleResult, type ScoreComputation, type ScoreRange, type Section, type SectionChild, type SelectFieldDef, type SignatureFieldDef, SignatureUploadWidget, type StaticTextFieldDef, type StoreConfig, type SubmissionData, type SumComputation, type TextFieldDef, type ValidationRule, type WebhookDef, type Workflow, type WorkflowTransition, createUploadHandler, evaluateRules, useField, useForm, useFormStore, validateField, validateForm };
+export { type BaseFieldDef, type CheckboxFieldDef, type ColumnLayout, type Computation, type Condition, type CreateUploadHandlerOptions, type DataSource, DynamicForm, EMAIL_REGEX, type EditableTableColumnDef, type EditableTableFieldDef, type EventDefinition, type FieldDef, type FieldPrefill, FieldRenderer, type FieldState, type FieldType, FormControls, type FormControlsProps, type FormDef, type FormErrors, FormProvider, type FormState, FormStore, type FormValues, type ImageUploadFieldDef, ImageUploadWidget, type LayoutNode, type NumberFieldDef, type Permission, type PresignedUploadResponse, type RadioFieldDef, ReadOnlyForm, ReadOnlyImageUpload, ReadOnlySignature, ReadOnlyTable, type RepeatableFieldDef, type Rule, type RuleAction, type RuleResult, type ScoreComputation, type ScoreRange, type Section, type SectionChild, type SelectFieldDef, type SelectOption, type SignatureFieldDef, SignatureUploadWidget, type StaticTextFieldDef, type StoreConfig, type SubmissionData, type SumComputation, type TextFieldDef, type ValidationRule, type WebhookDef, type Workflow, type WorkflowTransition, createUploadHandler, evaluateRules, useField, useForm, useFormStore, validateField, validateForm };

package/dist/index.d.ts

@@ -52,27 +52,24 @@ interface TextFieldDef extends BaseFieldDef {
 interface NumberFieldDef extends BaseFieldDef {
     type: 'number';
 }
+/** Option for select/radio/checkbox. When score is set, sum computation uses it for aggregation. */
+interface SelectOption {
+    label: string;
+    value: any;
+    score?: number;
+}
 interface SelectFieldDef extends BaseFieldDef {
     type: 'select' | 'multiselect';
-    options?: {
-        label: string;
-        value: any;
-    }[];
+    options?: SelectOption[];
 }
 interface RadioFieldDef extends BaseFieldDef {
     type: 'radio';
-    options?: {
-        label: string;
-        value: any;
-    }[];
+    options?: SelectOption[];
 }
 interface CheckboxFieldDef extends BaseFieldDef {
     type: 'checkbox';
     /** Options for the checkbox group; value is stored as array of selected option values. */
-    options?: {
-        label: string;
-        value: any;
-    }[];
+    options?: SelectOption[];
 }
 interface RepeatableFieldDef extends BaseFieldDef {
     type: 'repeatable';
@@ -440,4 +437,4 @@ interface CreateUploadHandlerOptions {
  */
 declare function createUploadHandler(options: CreateUploadHandlerOptions): (file: File | Blob, filename: string) => Promise<string>;
 
-export { type BaseFieldDef, type CheckboxFieldDef, type ColumnLayout, type Computation, type Condition, type CreateUploadHandlerOptions, type DataSource, DynamicForm, EMAIL_REGEX, type EditableTableColumnDef, type EditableTableFieldDef, type EventDefinition, type FieldDef, type FieldPrefill, FieldRenderer, type FieldState, type FieldType, FormControls, type FormControlsProps, type FormDef, type FormErrors, FormProvider, type FormState, FormStore, type FormValues, type ImageUploadFieldDef, ImageUploadWidget, type LayoutNode, type NumberFieldDef, type Permission, type PresignedUploadResponse, type RadioFieldDef, ReadOnlyForm, ReadOnlyImageUpload, ReadOnlySignature, ReadOnlyTable, type RepeatableFieldDef, type Rule, type RuleAction, type RuleResult, type ScoreComputation, type ScoreRange, type Section, type SectionChild, type SelectFieldDef, type SignatureFieldDef, SignatureUploadWidget, type StaticTextFieldDef, type StoreConfig, type SubmissionData, type SumComputation, type TextFieldDef, type ValidationRule, type WebhookDef, type Workflow, type WorkflowTransition, createUploadHandler, evaluateRules, useField, useForm, useFormStore, validateField, validateForm };
+export { type BaseFieldDef, type CheckboxFieldDef, type ColumnLayout, type Computation, type Condition, type CreateUploadHandlerOptions, type DataSource, DynamicForm, EMAIL_REGEX, type EditableTableColumnDef, type EditableTableFieldDef, type EventDefinition, type FieldDef, type FieldPrefill, FieldRenderer, type FieldState, type FieldType, FormControls, type FormControlsProps, type FormDef, type FormErrors, FormProvider, type FormState, FormStore, type FormValues, type ImageUploadFieldDef, ImageUploadWidget, type LayoutNode, type NumberFieldDef, type Permission, type PresignedUploadResponse, type RadioFieldDef, ReadOnlyForm, ReadOnlyImageUpload, ReadOnlySignature, ReadOnlyTable, type RepeatableFieldDef, type Rule, type RuleAction, type RuleResult, type ScoreComputation, type ScoreRange, type Section, type SectionChild, type SelectFieldDef, type SelectOption, type SignatureFieldDef, SignatureUploadWidget, type StaticTextFieldDef, type StoreConfig, type SubmissionData, type SumComputation, type TextFieldDef, type ValidationRule, type WebhookDef, type Workflow, type WorkflowTransition, createUploadHandler, evaluateRules, useField, useForm, useFormStore, validateField, validateForm };

package/dist/index.mjs

@@ -327,10 +327,13 @@ var FormStore = class {
       if (field.type === "image_upload" || field.type === "signature") {
         const raw = values[field.id];
         if (raw !== void 0 && raw !== null && raw !== "") {
-          result[field.id] = {
-            _type: "s3_key",
-            value: raw
-          };
+          const key = typeof raw === "string" ? raw : raw.s3_key || raw.value || null;
+          if (key && typeof key === "string") {
+            result[field.id] = {
+              _type: "s3_key",
+              value: key
+            };
+          }
         }
       }
     });
@@ -342,7 +345,20 @@ var FormStore = class {
       this.schema.computations.forEach((comp) => {
         if (comp.type === "sum") {
           const sum = comp.fields.reduce((acc, fieldId) => {
-            const val = Number(this.state.values[fieldId]) || 0;
+            const raw = this.state.values[fieldId];
+            const fieldDef = this.fieldMap[fieldId];
+            const options = fieldDef?.type === "select" || fieldDef?.type === "multiselect" || fieldDef?.type === "radio" || fieldDef?.type === "checkbox" ? fieldDef.options : void 0;
+            const hasScoreOptions = options?.some((o) => o.score !== void 0);
+            let val;
+            if (hasScoreOptions && options) {
+              const selected = fieldDef?.type === "multiselect" || fieldDef?.type === "checkbox" ? (Array.isArray(raw) ? raw : [raw]).filter(Boolean) : [raw];
+              val = selected.reduce((s, v) => {
+                const opt = options.find((o) => o.value === v || String(o.value) === String(v));
+                return s + (opt && "score" in opt && typeof opt.score === "number" ? opt.score : 0);
+              }, 0);
+            } else {
+              val = Number(raw) || 0;
+            }
             return acc + val;
           }, 0);
           if (this.state.values[comp.target] !== sum) {
@@ -1513,8 +1529,15 @@ var smoothPoint = (prev, curr, smoothing = 0.75) => {
     y: prev.y * smoothing + curr.y * (1 - smoothing)
   };
 };
+function extractDisplayUrl(value) {
+  if (!value || typeof value !== "object") return null;
+  if (typeof value.presigned_url === "string" && value.presigned_url) {
+    return value.presigned_url;
+  }
+  return null;
+}
 var SignatureUploadWidget = ({ fieldId }) => {
-  const { fieldDef, setValue, setTouched, error, disabled, touched } = useField(fieldId);
+  const { fieldDef, setValue, setTouched, error, disabled, touched, value } = useField(fieldId);
   const store = useFormStore();
   const { state } = useForm();
   const canvasRef = useRef(null);
@@ -1523,13 +1546,14 @@ var SignatureUploadWidget = ({ fieldId }) => {
   const lastTimeRef = useRef(null);
   const lastWidthRef = useRef(2);
   const [isDrawing, setIsDrawing] = useState(false);
-  const [hasSignature, setHasSignature] = useState(false);
+  const [hasDrawing, setHasDrawing] = useState(false);
   const [isUploading, setIsUploading] = useState(false);
+  const [isConfirmed, setIsConfirmed] = useState(false);
   const showError = !!error && (touched || state.submitAttempted);
-  if (!fieldDef) return null;
-  const uploadHandler = store.getUploadHandler();
-  if (!uploadHandler) return null;
+  const displayUrl = useMemo(() => extractDisplayUrl(value), [value]);
+  const showPreview = displayUrl !== null;
   useEffect(() => {
+    if (showPreview) return;
     const canvas = canvasRef.current;
     if (!canvas) return;
     const ctx = canvas.getContext("2d");
@@ -1547,7 +1571,9 @@ var SignatureUploadWidget = ({ fieldId }) => {
     ctx.strokeStyle = "#000";
     ctx.fillStyle = "#fff";
     ctx.fillRect(0, 0, width, height);
-  }, []);
+  }, [showPreview]);
+  const uploadHandler = store.getUploadHandler();
+  if (!fieldDef || !uploadHandler) return null;
   const getPoint = (event) => {
     const canvas = canvasRef.current;
     const rect = canvas.getBoundingClientRect();
@@ -1560,6 +1586,7 @@ var SignatureUploadWidget = ({ fieldId }) => {
   const startDrawing = (event) => {
     if (disabled) return;
     setIsDrawing(true);
+    setIsConfirmed(false);
     setTouched();
     const ctx = canvasRef.current?.getContext("2d");
     if (!ctx) return;
@@ -1601,23 +1628,31 @@ var SignatureUploadWidget = ({ fieldId }) => {
     lastPointRef.current = smoothed;
     lastTimeRef.current = now;
     lastWidthRef.current = width;
-    setHasSignature(true);
+    setHasDrawing(true);
   };
   const stopDrawing = () => {
     setIsDrawing(false);
     lastPointRef.current = null;
     lastTimeRef.current = null;
   };
-  const clearCanvas = () => {
+  const clearSignature = () => {
+    if (showPreview) {
+      setValue(null);
+      setTouched();
+      return;
+    }
     const canvas = canvasRef.current;
     const ctx = canvas?.getContext("2d");
-    if (!canvas || !ctx) return;
-    ctx.fillStyle = "#fff";
-    ctx.fillRect(0, 0, 400, 200);
+    if (canvas && ctx) {
+      ctx.fillStyle = "#fff";
+      ctx.fillRect(0, 0, 400, 200);
+    }
     pathRef.current = "";
     lastPointRef.current = null;
-    setHasSignature(false);
+    setHasDrawing(false);
+    setIsConfirmed(false);
     setValue(null);
+    setTouched();
   };
   const generateSVG = () => `
 <svg width="400" height="200" xmlns="http://www.w3.org/2000/svg">
@@ -1630,7 +1665,7 @@ var SignatureUploadWidget = ({ fieldId }) => {
         fill="none"/>
 </svg>`.trim();
   const confirmSignature = async () => {
-    if (!hasSignature) return;
+    if (!hasDrawing) return;
     setIsUploading(true);
     setTouched();
     try {
@@ -1639,55 +1674,95 @@ var SignatureUploadWidget = ({ fieldId }) => {
       const filename = `signature_${Date.now()}.svg`;
       const key = await uploadHandler(blob, filename);
       setValue(key);
+      setIsConfirmed(true);
+      setHasDrawing(false);
+    } catch (err) {
+      console.error("[SignatureUpload] Upload failed:", err);
     } finally {
       setIsUploading(false);
     }
   };
+  const canClear = showPreview ? !disabled : hasDrawing || isConfirmed;
   return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
     /* @__PURE__ */ jsxs(Label, { children: [
       fieldDef.label,
       fieldDef.required && /* @__PURE__ */ jsx("span", { className: "text-red-500", children: "*" })
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-      /* @__PURE__ */ jsx(
-        "canvas",
-        {
-          ref: canvasRef,
-          className: "border border-gray-200 rounded cursor-crosshair touch-none",
-          onMouseDown: startDrawing,
-          onMouseMove: draw,
-          onMouseUp: stopDrawing,
-          onMouseLeave: stopDrawing,
-          onTouchStart: startDrawing,
-          onTouchMove: draw,
-          onTouchEnd: stopDrawing
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        Button,
-        {
-          type: "button",
-          size: "icon",
-          variant: "ghost",
-          className: "absolute top-2 left-2 bg-white/80",
-          onClick: clearCanvas,
-          disabled: !hasSignature,
-          children: /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4" })
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs(
-      Button,
-      {
-        type: "button",
-        onClick: confirmSignature,
-        disabled: !hasSignature || isUploading,
-        className: "text-xs",
-        children: [
-          /* @__PURE__ */ jsx(Check, { className: "h-4 w-4 mr-1" }),
-          isUploading ? "Saving\u2026" : "Confirm"
-        ]
-      }
+    showPreview ? (
+      /* ── Preview mode: existing signature from backend ── */
+      /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsx("div", { className: "border border-gray-200 rounded bg-white flex items-center justify-start p-2", children: /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: displayUrl,
+            alt: "Signature",
+            className: "object-contain max-w-full",
+            style: { width: 400, height: 200 }
+          }
+        ) }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            size: "icon",
+            variant: "ghost",
+            className: "absolute top-2 left-2 bg-white/80 hover:bg-red-50",
+            onClick: clearSignature,
+            disabled: !canClear,
+            title: "Delete signature and draw a new one",
+            children: /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4" })
+          }
+        )
+      ] })
+    ) : (
+      /* ── Canvas mode: drawing / confirmed ── */
+      /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+          /* @__PURE__ */ jsx(
+            "canvas",
+            {
+              ref: canvasRef,
+              className: `border rounded touch-none ${isConfirmed ? "border-green-300 cursor-default" : "border-gray-200 cursor-crosshair"}`,
+              onMouseDown: startDrawing,
+              onMouseMove: draw,
+              onMouseUp: stopDrawing,
+              onMouseLeave: stopDrawing,
+              onTouchStart: startDrawing,
+              onTouchMove: draw,
+              onTouchEnd: stopDrawing
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              size: "icon",
+              variant: "ghost",
+              className: "absolute top-2 left-2 bg-white/80",
+              onClick: clearSignature,
+              disabled: !canClear,
+              title: isConfirmed ? "Clear saved signature" : "Clear canvas",
+              children: /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4" })
+            }
+          )
+        ] }),
+        isConfirmed ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-sm text-green-600", children: [
+          /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsx("span", { children: "Signature saved" })
+        ] }) : /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            onClick: confirmSignature,
+            disabled: !hasDrawing || isUploading,
+            className: "text-xs",
+            children: [
+              /* @__PURE__ */ jsx(Check, { className: "h-4 w-4 mr-1" }),
+              isUploading ? "Saving\u2026" : "Confirm"
+            ]
+          }
+        )
+      ] })
     ),
     showError && /* @__PURE__ */ jsx("p", { className: "text-xs text-red-500", children: error })
   ] });
@@ -2245,7 +2320,7 @@ var ReadOnlyText = ({ fieldDef, value }) => {
         className: "prose prose-sm max-w-none text-gray-900 border border-gray-200 rounded-md p-3 bg-gray-50",
         dangerouslySetInnerHTML: { __html: displayValue }
       }
-    ) : /* @__PURE__ */ jsx("div", { className: "text-gray-900 border border-gray-200 rounded-md p-3 bg-gray-50 min-h-[2.5rem] flex items-center", children: displayValue || /* @__PURE__ */ jsx("span", { className: "text-gray-400 italic", children: "No value" }) })
+    ) : /* @__PURE__ */ jsx("div", { className: "text-gray-900 border border-gray-200 rounded-md p-3 bg-gray-50 min-h-[2.5rem] whitespace-pre-wrap", children: displayValue || /* @__PURE__ */ jsx("span", { className: "text-gray-400 italic", children: "No value" }) })
   ] });
 };
 var ReadOnlySelect = ({ fieldDef, value }) => {