@arbidocs/blocks 0.4.157 → 0.4.159

package/dist/document-tools/viewer/index.cjs

@@ -1,7 +1,7 @@
 "use client";
 'use strict';
 
-var chunk6MG62I5B_cjs = require('../../chunk-6MG62I5B.cjs');
+var chunkJPWPR6QU_cjs = require('../../chunk-JPWPR6QU.cjs');
 var chunkULWRNGGE_cjs = require('../../chunk-ULWRNGGE.cjs');
 require('../../chunk-DES3K4SD.cjs');
 var react = require('react');
@@ -32,6 +32,7 @@ function AnnotatedPdfViewer({
   store: storeOverride,
   viewer: PdfViewer = viewers.PdfViewer,
   signed = false,
+  placeStamp = null,
   ...viewerProps
 }) {
   const { client, user, notify, saveFile, uploadDocument, openDocument, onDocumentsChanged } = documentTools.useDocumentTools();
@@ -63,6 +64,12 @@ function AnnotatedPdfViewer({
     () => editing && !controller.readOnly ? controller : viewOnly(controller),
     [editing, controller]
   );
+  const { setSettings, setTool } = controller;
+  react.useEffect(() => {
+    if (!placeStamp) return;
+    setSettings({ stampImage: { image: placeStamp.image, label: placeStamp.label } });
+    setTool("stamp");
+  }, [placeStamp?.key]);
   const { flush } = controller;
   react.useEffect(() => {
     if (!editing) void flush();
@@ -493,6 +500,8 @@ function GuidedSigningViewer({
 }) {
   const { user, notify } = documentTools.useDocumentTools();
   const sign = documentTools.useSignSignatureRequest();
+  const savedSignature = documentTools.useSavedSignature();
+  const storeSignature = documentTools.useStoreSavedSignature();
   const decline = documentTools.useDeclineSignatureRequest();
   const mine = react.useMemo(() => documentTools.fieldsInSigningOrder(request.fields, signer), [request.fields, signer]);
   const [mark, setMark] = react.useState(null);
@@ -572,9 +581,17 @@ function GuidedSigningViewer({
   const renderContent = react.useCallback(
     (field) => {
       if (!applied.has(field.id) || !mark) return null;
-      const { adopted, signatureUrl } = mark;
-      if (field.type === "signature" && signatureUrl) {
-        return /* @__PURE__ */ jsxRuntime.jsx("img", { src: signatureUrl, alt: "Your signature", className: "h-full w-full object-contain" });
+      const { adopted, signatureUrl, initialsUrl } = mark;
+      const image = field.type === "signature" ? signatureUrl : field.type === "initials" ? initialsUrl : null;
+      if (image) {
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          "img",
+          {
+            src: image,
+            alt: field.type === "signature" ? "Your signature" : "Your initials",
+            className: "h-full w-full object-contain"
+          }
+        );
       }
       const text = field.type === "signature" ? adopted.name : field.type === "initials" ? adopted.initials : field.type === "date" ? signingDate() : adopted.name;
       const typed = documentTools.MARK_FIELD_TYPES.includes(field.type);
@@ -582,7 +599,7 @@ function GuidedSigningViewer({
         "span",
         {
           className: "flex h-full w-full items-center px-1 whitespace-nowrap [container-type:size]",
-          style: typed ? chunk6MG62I5B_cjs.TYPED_SIGNATURE_STYLE : { color: "#1a1a26" },
+          style: typed ? chunkJPWPR6QU_cjs.TYPED_SIGNATURE_STYLE : { color: "#1a1a26" },
           children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: typed ? "70cqh" : "62cqh", lineHeight: 1 }, children: text })
         }
       );
@@ -772,12 +789,14 @@ function GuidedSigningViewer({
       }
     ) }),
     /* @__PURE__ */ jsxRuntime.jsx(
-      chunk6MG62I5B_cjs.AdoptSignatureDialog,
+      chunkJPWPR6QU_cjs.AdoptSignatureDialog,
       {
         open: !!adoptFor,
         onOpenChange: (open) => !open && setAdoptFor(null),
         defaultName: user?.name ?? "",
-        onAdopt
+        onAdopt,
+        saved: savedSignature.data ?? null,
+        onSave: async (signature) => void await storeSignature.mutateAsync(signature)
       }
     ),
     /* @__PURE__ */ jsxRuntime.jsx(
@@ -875,9 +894,10 @@ function SignatureRequestEditor({
   viewer: PdfViewer = viewers.PdfViewer,
   ...viewerProps
 }) {
-  const { client, notify } = documentTools.useDocumentTools();
+  const { client, notify, user } = documentTools.useDocumentTools();
   const candidates = documentTools.useSignerCandidates();
   const save = documentTools.useSaveSignatureRequest();
+  const invite = documentTools.useInviteSigners();
   const [fields, setFields] = react.useState(() => draft?.fields ?? []);
   const [signers, setSigners] = react.useState(() => [
     ...new Set((draft?.fields ?? []).map((f) => f.signer))
@@ -890,11 +910,31 @@ function SignatureRequestEditor({
   const [assign, setAssign] = react.useState({});
   const [finding, setFinding] = react.useState(false);
   const [error, setError] = react.useState(null);
+  const [newEmail, setNewEmail] = react.useState("");
+  const [givenNames, setGivenNames] = react.useState({});
+  const [confirmInvite, setConfirmInvite] = react.useState(null);
   const people = react.useMemo(() => candidates.data ?? [], [candidates.data]);
-  const nameOf = react.useCallback(
-    (ext) => people.find((p) => p.externalId === ext)?.name ?? ext,
+  const members = react.useMemo(
+    () => new Map(people.map((p) => [p.email.toLowerCase(), p.externalId])),
     [people]
   );
+  const me = people.find((p) => p.email.toLowerCase() === user?.email?.toLowerCase());
+  const nameOf = react.useCallback(
+    (token) => {
+      const person = people.find((p) => p.externalId === token);
+      if (person) return person.name;
+      const invited = draft?.signers.find((s) => s.external_id === token);
+      if (invited) return invited.name || invited.email || token;
+      const email = token.toLowerCase();
+      const member = people.find((p) => p.email.toLowerCase() === email);
+      return member?.name ?? givenNames[email] ?? token;
+    },
+    [people, draft, givenNames]
+  );
+  const isInvitee = react.useCallback(
+    (token) => documentTools.isEmailSigner(token) && !members.has(token.toLowerCase()) || draft?.signers.find((s) => s.external_id === token)?.progress === "invited",
+    [members, draft]
+  );
   const colorOf = react.useCallback(
     (ext) => {
       const i = signers.indexOf(ext);
@@ -904,8 +944,10 @@ function SignatureRequestEditor({
   );
   const selected = fields.find((f) => f.id === selectedId) ?? null;
   const blocker = signers.length === 0 ? "Add a signer." : documentTools.sendBlocker(fields);
-  const addSigner = (ext) => {
-    if (!ext || signers.includes(ext)) return;
+  const addSigner = (token) => {
+    if (!token) return;
+    const ext = documentTools.isEmailSigner(token) ? members.get(token.trim().toLowerCase()) ?? token.trim().toLowerCase() : token;
+    if (signers.includes(ext)) return;
     setSigners((s) => [...s, ext]);
     setCurrent(ext);
     setPlacing((p) => p ?? "signature");
@@ -916,6 +958,41 @@ function SignatureRequestEditor({
     if (current === ext) setCurrent(signers.find((x) => x !== ext) ?? null);
   };
   const updateField = (id, patch) => setFields((fs) => fs.map((f) => f.id === id ? { ...f, ...patch } : f));
+  const placedOnce = react.useRef(false);
+  react.useEffect(() => {
+    if (draft || placedOnce.current || candidates.isLoading) return;
+    placedOnce.current = true;
+    let live = true;
+    void documentTools.suggestSignatureFields(client, documentId, version).then((found) => {
+      if (!live) return;
+      const { placed, extras } = documentTools.splitSuggestions(found ?? []);
+      if (!placed.length) return;
+      const named = Object.fromEntries(
+        placed.flatMap(
+          (s) => s.signer_email && s.signer_name ? [[s.signer_email.toLowerCase(), s.signer_name]] : []
+        )
+      );
+      setGivenNames((n) => ({ ...n, ...named }));
+      const added = documentTools.fieldsFromSuggestions(placed, {}, members);
+      setFields((fs) => [...fs, ...added]);
+      const assigned = [...new Set(added.map((f) => f.signer))];
+      setSigners((s) => [...s, ...assigned.filter((t) => !s.includes(t))]);
+      setCurrent((c) => c ?? assigned[0] ?? null);
+      const open = placed.filter((s) => !s.signer_email);
+      if (open.length || extras.length) {
+        setSuggestions([...open, ...extras]);
+        setAssign({});
+      }
+      notify(
+        `${added.length} field${added.length === 1 ? "" : "s"} placed from the document.`,
+        "success"
+      );
+    }).catch(() => {
+    });
+    return () => {
+      live = false;
+    };
+  }, [draft, candidates.isLoading, client, documentId, version, members, notify]);
   const findBlocks = async () => {
     setFinding(true);
     setError(null);
@@ -933,7 +1010,7 @@ function SignatureRequestEditor({
   };
   const applySuggestions = () => {
     if (!suggestions) return;
-    const added = documentTools.fieldsFromSuggestions(suggestions, assign);
+    const added = documentTools.fieldsFromSuggestions(suggestions, assign, members);
     setFields((fs) => [...fs, ...added]);
     const assigned = [...new Set(added.map((f) => f.signer))];
     setSigners((s) => [...s, ...assigned.filter((ext) => !s.includes(ext))]);
@@ -941,9 +1018,17 @@ function SignatureRequestEditor({
     setSuggestions(null);
     notify(`${added.length} field${added.length === 1 ? "" : "s"} added.`, "success");
   };
-  const submit = async (send) => {
+  const submit = async (send, invited = false) => {
     setError(null);
+    const invitees = signers.filter((t) => documentTools.isEmailSigner(t) && !members.has(t.toLowerCase()));
+    if (send && invitees.length && !invited) {
+      setConfirmInvite(invitees);
+      return;
+    }
     try {
+      if (send && invitees.length && me?.role === "owner") {
+        await invite.mutateAsync({ documentId, emails: invitees });
+      }
       const request = await save.mutateAsync({
         documentId,
         version,
@@ -952,10 +1037,12 @@ function SignatureRequestEditor({
         requestId: draft?.status === "draft" ? draft.external_id : void 0,
         send
       });
+      const waiting = request.signers.filter((s) => s.progress === "invited").length;
       notify(
-        send ? `Sent for signature to ${request.signers.length} signer${request.signers.length === 1 ? "" : "s"}.` : "Draft saved.",
+        send ? `Sent for signature to ${request.signers.length} signer${request.signers.length === 1 ? "" : "s"}.` + (waiting ? ` ${waiting} ${waiting === 1 ? "is" : "are"} asked once they join the workspace.` : "") : "Draft saved.",
         "success"
       );
+      setConfirmInvite(null);
       onSaved(request);
     } catch (err) {
       setError(err instanceof Error ? err.message : "The request could not be saved");
@@ -1019,7 +1106,8 @@ function SignatureRequestEditor({
                   "data-testid": `signer-chip-${ext}`,
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "size-2.5 rounded-full", style: { background: colorOf(ext) } }),
-                    nameOf(ext)
+                    nameOf(ext),
+                    isInvitee(ext) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", "data-testid": "signer-invited", children: "(to invite)" })
                   ]
                 }
               ),
@@ -1059,7 +1147,45 @@ function SignatureRequestEditor({
               ]
             }
           )
-        ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "form",
+          {
+            className: "inline-flex items-center gap-1",
+            onSubmit: (e) => {
+              e.preventDefault();
+              if (!documentTools.isEmailSigner(newEmail)) return;
+              addSigner(newEmail);
+              setNewEmail("");
+            },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                ui.Input,
+                {
+                  type: "email",
+                  value: newEmail,
+                  onChange: (e) => setNewEmail(e.target.value),
+                  placeholder: "Or anyone, by email",
+                  "aria-label": "Signer's email",
+                  className: "h-8 w-52",
+                  "data-testid": "signature-add-email"
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                ui.Button,
+                {
+                  type: "submit",
+                  size: "sm",
+                  variant: "ghost",
+                  disabled: !documentTools.isEmailSigner(newEmail),
+                  "aria-label": "Add this signer",
+                  "data-testid": "signature-add-email-submit",
+                  children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MailPlus, { className: "size-4", "aria-hidden": true })
+                }
+              )
+            ]
+          }
+        )
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: current ? `Place for ${nameOf(current)}:` : "Add a signer, then place their fields." }),
@@ -1216,7 +1342,8 @@ function SignatureRequestEditor({
                 "data-testid": `signature-suggestion-signer-${g}`,
                 children: [
                   /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", children: "Skip" }),
-                  people.map((p) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: p.externalId, children: p.name }, p.externalId))
+                  people.map((p) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: p.externalId, children: p.name }, p.externalId)),
+                  signers.filter((t) => !people.some((p) => p.externalId === t)).map((t) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: t, children: nameOf(t) }, t))
                 ]
               }
             )
@@ -1237,6 +1364,45 @@ function SignatureRequestEditor({
           /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { type: "button", size: "sm", variant: "ghost", onClick: () => setSuggestions(null), children: "Dismiss" })
         ] })
       ] }),
+      confirmInvite && /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: "space-y-1.5 rounded-md border border-amber-300 bg-amber-50 p-2 text-amber-950 dark:border-amber-800 dark:bg-amber-950/40 dark:text-amber-100",
+          "data-testid": "signature-invite-confirm",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+              "Not in this workspace yet: ",
+              /* @__PURE__ */ jsxRuntime.jsx("strong", { children: confirmInvite.map(nameOf).join(", ") }),
+              ".",
+              " ",
+              me?.role === "owner" ? "They are invited as guests and asked to sign when they join." : "Ask a workspace owner to invite them: they are asked to sign when they join."
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                ui.Button,
+                {
+                  type: "button",
+                  size: "sm",
+                  onClick: () => submit(true, true),
+                  disabled: save.isPending || invite.isPending,
+                  "data-testid": "signature-invite-send",
+                  children: me?.role === "owner" ? "Invite and send" : "Send"
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                ui.Button,
+                {
+                  type: "button",
+                  size: "sm",
+                  variant: "ghost",
+                  onClick: () => setConfirmInvite(null),
+                  children: "Cancel"
+                }
+              )
+            ] })
+          ]
+        }
+      ),
       error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-red-text", role: "alert", "data-testid": "signature-editor-error", children: error })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsxRuntime.jsx(PdfViewer, { ...viewerProps, file, renderPageOverlay }) })