formanitor 0.0.49 → 0.0.50

package/dist/index.cjs

@@ -1548,16 +1548,28 @@ var FormStore = class {
         result[field.id] = null;
         return;
       }
-      if (field.type === "image_upload" || field.type === "media_upload" || field.type === "signature") {
+      if (field.type === "image_upload" || field.type === "media_upload" || field.type === "signature" || field.type === "file_upload") {
         const raw = values[field.id];
-        if (raw !== void 0 && raw !== null && 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
-            };
+        if (raw === void 0 || raw === null || raw === "") {
+          return;
+        }
+        const wrapKey = (key2) => {
+          if (typeof key2 !== "string" || !key2) return null;
+          return { _type: "s3_key", value: key2 };
+        };
+        if (Array.isArray(raw)) {
+          const wrapped2 = raw.map(
+            (item) => typeof item === "string" ? wrapKey(item) : wrapKey(item.s3_key ?? item.value)
+          ).filter(Boolean);
+          if (wrapped2.length > 0) {
+            result[field.id] = wrapped2;
           }
+          return;
+        }
+        const key = typeof raw === "string" ? raw : raw.s3_key ?? raw.value ?? null;
+        const wrapped = wrapKey(key);
+        if (wrapped) {
+          result[field.id] = wrapped;
         }
       }
     });
@@ -3795,6 +3807,190 @@ var SignatureUploadWidget = ({ fieldId }) => {
     showError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-red-500", children: error })
   ] });
 };
+function Upload3({
+  value,
+  accept,
+  multiple,
+  disabled,
+  onChange,
+  className,
+  formatsLabel,
+  placeholder = "Upload File",
+  beforeUploadContent,
+  id: idProp
+}) {
+  const inputRef = React15__namespace.default.useRef(null);
+  const generatedId = React15__namespace.default.useId();
+  const inputId = idProp ?? generatedId;
+  const handleFileChange = (e) => {
+    onChange(e.target.files ?? null);
+  };
+  React15__namespace.default.useEffect(() => {
+    if (!value && inputRef.current) {
+      inputRef.current.value = "";
+    }
+  }, [value]);
+  const count = value?.length ?? 0;
+  const formatsText = formatsLabel ?? accept;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "border border-dashed bg-[#F7F7F7] border-gray-200 rounded-lg py-5 px-4 flex items-center justify-center text-[#989898]",
+        disabled && "opacity-50 pointer-events-none",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            type: "file",
+            ref: inputRef,
+            accept,
+            id: inputId,
+            className: "hidden",
+            multiple,
+            disabled,
+            onChange: handleFileChange
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "label",
+          {
+            htmlFor: inputId,
+            className: cn("cursor-pointer w-full", disabled && "cursor-not-allowed"),
+            children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: count > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center text-sm font-semibold text-gray-700", children: [
+              count,
+              " file",
+              count === 1 ? "" : "s",
+              " selected"
+            ] }) : beforeUploadContent ? beforeUploadContent : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Upload, { size: 16, className: "rotate-180" }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs font-semibold mt-0.5 text-gray-700", children: placeholder }),
+              formatsText ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 text-[10px]", children: [
+                "Supported formats - ",
+                formatsText
+              ] }) : null
+            ] }) })
+          }
+        )
+      ]
+    }
+  );
+}
+function fileListFromArray(files) {
+  const dt = new DataTransfer();
+  files.forEach((f) => dt.items.add(f));
+  return dt.files;
+}
+function matchesAccept(file, accept) {
+  if (!accept || accept === "*/*") return true;
+  const tokens = accept.split(",").map((t) => t.trim().toLowerCase());
+  const name = file.name.toLowerCase();
+  const type = file.type.toLowerCase();
+  return tokens.some((token) => {
+    if (token.startsWith(".")) return name.endsWith(token);
+    if (token.endsWith("/*")) {
+      const prefix = token.slice(0, -1);
+      return type.startsWith(prefix);
+    }
+    return type === token;
+  });
+}
+var FormFileUploadWidget = ({
+  fieldId
+}) => {
+  const { fieldDef, value, setValue, setTouched, error, disabled, touched } = useField(fieldId);
+  const store = useFormStore();
+  const { state } = useForm();
+  const [localFiles, setLocalFiles] = React15.useState(null);
+  const [isUploading, setIsUploading] = React15.useState(false);
+  const showError = !!error && (touched || state.submitAttempted);
+  if (!fieldDef || fieldDef.type !== "file_upload") return null;
+  const def = fieldDef;
+  const accept = def.accept ?? "*/*";
+  const maxSize = def.maxSize ?? 10 * 1024 * 1024;
+  const allowMultiple = def.multiple === true;
+  const uploadHandler = store.getUploadHandler();
+  if (!uploadHandler) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(Label, { htmlFor: fieldId, children: [
+        fieldDef.label,
+        fieldDef.required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-red-500", children: "*" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-2 border-red-300 rounded-lg p-4 bg-red-50", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-red-600", children: "Upload handler not configured. Please provide an onUpload function in FormProvider config." }) })
+    ] });
+  }
+  const hasStoredValue = value !== null && value !== void 0 && value !== "" && !(Array.isArray(value) && value.length === 0);
+  const handleChange = async (files) => {
+    setTouched();
+    if (!files || files.length === 0) {
+      setLocalFiles(null);
+      setValue(null);
+      return;
+    }
+    const selected = Array.from(files);
+    for (const file of selected) {
+      if (!matchesAccept(file, accept)) {
+        alert(`File type not allowed: ${file.name}`);
+        return;
+      }
+      if (file.size > maxSize) {
+        alert(
+          `File must be less than ${Math.round(maxSize / (1024 * 1024))}MB: ${file.name}`
+        );
+        return;
+      }
+    }
+    const toUpload = allowMultiple ? selected : [selected[0]];
+    setLocalFiles(fileListFromArray(toUpload));
+    setIsUploading(true);
+    store.incrementPendingUploads();
+    try {
+      if (allowMultiple) {
+        const keys = [];
+        for (const file of toUpload) {
+          keys.push(await uploadHandler(file, file.name));
+        }
+        setValue(keys);
+      } else {
+        const key = await uploadHandler(toUpload[0], toUpload[0].name);
+        setValue(key);
+      }
+    } catch (err) {
+      console.error("[FormFileUpload] Upload failed:", err);
+      const message = err instanceof Error ? err.message : "Upload failed. Please try again.";
+      alert(message);
+      setLocalFiles(null);
+      setValue(null);
+    } finally {
+      setIsUploading(false);
+      store.decrementPendingUploads();
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(Label, { htmlFor: fieldId, children: [
+      fieldDef.label,
+      fieldDef.required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-red-500", children: "*" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Upload3,
+      {
+        accept,
+        multiple: allowMultiple,
+        value: localFiles,
+        onChange: handleChange,
+        disabled: disabled || isUploading,
+        placeholder: isUploading ? "Uploading..." : def.uploadPlaceholder ?? "Upload File",
+        formatsLabel: def.uploadFormats,
+        className: isUploading ? "opacity-70" : void 0
+      }
+    ),
+    hasStoredValue && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-green-600", children: allowMultiple && Array.isArray(value) ? `${value.length} file(s) uploaded` : "File uploaded" }),
+    fieldDef.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-gray-500", children: fieldDef.description }),
+    showError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-red-500", children: error })
+  ] });
+};
 var EditableTableWidget = ({
   fieldId
 }) => {
@@ -14242,6 +14438,8 @@ function renderWidget(fieldId, fieldDef) {
       return /* @__PURE__ */ jsxRuntime.jsx(ImageUploadWidget, { fieldId });
     case "media_upload":
       return /* @__PURE__ */ jsxRuntime.jsx(MediaUploadWidget, { fieldId });
+    case "file_upload":
+      return /* @__PURE__ */ jsxRuntime.jsx(FormFileUploadWidget, { fieldId });
     case "signature":
       return /* @__PURE__ */ jsxRuntime.jsx(SignatureUploadWidget, { fieldId });
     case "editable_table":
@@ -15340,6 +15538,8 @@ var ReadOnlyFieldRenderer = ({
       return /* @__PURE__ */ jsxRuntime.jsx(ReadOnlyImageUpload, { fieldDef, value });
     case "media_upload":
       return /* @__PURE__ */ jsxRuntime.jsx(ReadOnlyMediaUpload, { fieldDef, value });
+    case "file_upload":
+      return /* @__PURE__ */ jsxRuntime.jsx(ReadOnlyMediaUpload, { fieldDef, value });
     case "signature":
       return /* @__PURE__ */ jsxRuntime.jsx(ReadOnlySignature, { fieldDef, value });
     case "editable_table":
@@ -15842,6 +16042,7 @@ exports.DynamicFormV2 = DynamicFormV2;
 exports.EMAIL_REGEX = EMAIL_REGEX;
 exports.FieldRenderer = FieldRenderer;
 exports.FormControls = FormControls;
+exports.FormFileUploadWidget = FormFileUploadWidget;
 exports.FormProvider = FormProvider;
 exports.FormStore = FormStore;
 exports.ImageUploadWidget = ImageUploadWidget;
@@ -15857,6 +16058,7 @@ exports.RichTextWidget = RichTextWidget;
 exports.SignatureUploadWidget = SignatureUploadWidget;
 exports.SmartForm = SmartForm;
 exports.SmartTextareaWidget = SmartTextareaWidget;
+exports.Upload = Upload3;
 exports.createUploadHandler = createUploadHandler;
 exports.evaluateRules = evaluateRules;
 exports.fieldMetaRequestsMarMedicationOrdersButton = fieldMetaRequestsMarMedicationOrdersButton;